From 60dcffb8564bfcc1401ae4c934c742e31a24bc2f Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 11:03:32 +0100
Subject: [PATCH 001/404] fix: internally wrap store subscribe in untrack
 (#13858)

* fix: internally wrap store subscribe in untrack

* lint

* Update packages/svelte/src/store/utils.js

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/little-hotels-poke.md                     |  5 +++++
 packages/svelte/src/store/utils.js                   | 12 ++++++++----
 .../main.svelte                                      |  5 +----
 3 files changed, 14 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/little-hotels-poke.md

diff --git a/.changeset/little-hotels-poke.md b/.changeset/little-hotels-poke.md
new file mode 100644
index 0000000000..50b60e2142
--- /dev/null
+++ b/.changeset/little-hotels-poke.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: internally wrap store subscribe in untrack
diff --git a/packages/svelte/src/store/utils.js b/packages/svelte/src/store/utils.js
index d48036ea67..db2a62c68c 100644
--- a/packages/svelte/src/store/utils.js
+++ b/packages/svelte/src/store/utils.js
@@ -1,4 +1,5 @@
 /** @import { Readable } from './public' */
+import { untrack } from '../index-client.js';
 import { noop } from '../internal/shared/utils.js';
 
 /**
@@ -20,10 +21,13 @@ export function subscribe_to_store(store, run, invalidate) {
 	}
 
 	// Svelte store takes a private second argument
-	const unsub = store.subscribe(
-		run,
-		// @ts-expect-error
-		invalidate
+	// StartStopNotifier could mutate state, and we want to silence the corresponding validation error
+	const unsub = untrack(() =>
+		store.subscribe(
+			run,
+			// @ts-expect-error
+			invalidate
+		)
 	);
 
 	// Also support RxJS
diff --git a/packages/svelte/tests/runtime-runes/samples/store-unsubscribe-not-referenced-after/main.svelte b/packages/svelte/tests/runtime-runes/samples/store-unsubscribe-not-referenced-after/main.svelte
index e097c639f0..5f8b19f4c7 100644
--- a/packages/svelte/tests/runtime-runes/samples/store-unsubscribe-not-referenced-after/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/store-unsubscribe-not-referenced-after/main.svelte
@@ -1,5 +1,4 @@
 <script>
-	import { untrack } from "svelte";
 	import { writable, derived } from "svelte/store";
 
 	const obj = writable({ a: 1 });
@@ -8,9 +7,7 @@
 
 	function watch (prop) {
 		return derived(obj, (o) => {
-			untrack(() => {
-				count++;
-			});
+			count++;
 			return o[prop];
 		});
 	}

From 4fbd2a6f104e5f458264a129c39dac469717da2a Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 13:20:04 +0100
Subject: [PATCH 002/404] fix: ensure props internally untracks current_value
 on sets (#13859)

* fix: ensure props internally untracks current_value on sets

* Update packages/svelte/src/internal/client/reactivity/props.js

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/short-jokes-speak.md                  |  5 +++++
 .../src/internal/client/reactivity/props.js      |  7 ++-----
 .../samples/props-assignment-tracking/_config.js | 16 ++++++++++++++++
 .../props-assignment-tracking/main.svelte        | 10 ++++++++++
 4 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/short-jokes-speak.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/main.svelte

diff --git a/.changeset/short-jokes-speak.md b/.changeset/short-jokes-speak.md
new file mode 100644
index 0000000000..0b2552e29b
--- /dev/null
+++ b/.changeset/short-jokes-speak.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure props internally untracks current_value on sets
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index 32969139bf..1d0f7b239f 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -373,8 +373,6 @@ export function prop(props, key, flags, fallback) {
 	if (!immutable) current_value.equals = safe_equals;
 
 	return function (/** @type {any} */ value, /** @type {boolean} */ mutation) {
-		var current = get(current_value);
-
 		// legacy nonsense — need to ensure the source is invalidated when necessary
 		// also needed for when handling inspect logic so we can inspect the correct source signal
 		if (is_signals_recorded) {
@@ -398,12 +396,11 @@ export function prop(props, key, flags, fallback) {
 				if (fallback_used && fallback_value !== undefined) {
 					fallback_value = new_value;
 				}
-				get(current_value); // force a synchronisation immediately
+				untrack(() => get(current_value)); // force a synchronisation immediately
 			}
 
 			return value;
 		}
-
-		return current;
+		return get(current_value);
 	};
 }
diff --git a/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/_config.js b/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/_config.js
new file mode 100644
index 0000000000..f08a40706f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/_config.js
@@ -0,0 +1,16 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs, target }) {
+		const btn = target.querySelector('button');
+
+		flushSync(() => {
+			btn?.click();
+			btn?.click();
+			btn?.click();
+		});
+
+		assert.deepEqual(logs, ['effect']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/main.svelte
new file mode 100644
index 0000000000..4a21fa6801
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-assignment-tracking/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	let {display = true} = $props();
+
+	$effect(()=>{
+		display = true;
+		console.log("effect")
+	});
+</script>
+
+<button onclick={() => display = !display} >display</button>

From 04c38b089fb3aa99d2394c86a7dc2c26907cb635 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 24 Oct 2024 14:21:27 +0200
Subject: [PATCH 003/404] fix: allow binding to const with spread in legacy
 mode (#13849)

---
 .changeset/nine-pigs-approve.md                     |  5 +++++
 .../svelte/src/internal/client/reactivity/props.js  | 13 +++++++++++++
 packages/svelte/src/internal/server/index.js        |  7 ++++++-
 .../bind-export-const-with-spread/Test.svelte       |  3 +++
 .../bind-export-const-with-spread/_config.js        |  9 +++++++++
 .../bind-export-const-with-spread/main.svelte       | 11 +++++++++++
 6 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/nine-pigs-approve.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/Test.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/main.svelte

diff --git a/.changeset/nine-pigs-approve.md b/.changeset/nine-pigs-approve.md
new file mode 100644
index 0000000000..b11daff5a3
--- /dev/null
+++ b/.changeset/nine-pigs-approve.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow binding to const with spread in legacy mode
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index 1d0f7b239f..1df1933c19 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -177,6 +177,19 @@ const spread_props_handler = {
 			if (typeof p === 'object' && p !== null && key in p) return p[key];
 		}
 	},
+	set(target, key, value) {
+		let i = target.props.length;
+		while (i--) {
+			let p = target.props[i];
+			if (is_function(p)) p = p();
+			const desc = get_descriptor(p, key);
+			if (desc && desc.set) {
+				desc.set(value);
+				return true;
+			}
+		}
+		return false;
+	},
 	getOwnPropertyDescriptor(target, key) {
 		let i = target.props.length;
 		while (i--) {
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 9b5e4ac3e2..9a66095de4 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -270,7 +270,12 @@ export function spread_props(props) {
 	for (let i = 0; i < props.length; i++) {
 		const obj = props[i];
 		for (key in obj) {
-			merged_props[key] = obj[key];
+			const desc = Object.getOwnPropertyDescriptor(obj, key);
+			if (desc) {
+				Object.defineProperty(merged_props, key, desc);
+			} else {
+				merged_props[key] = obj[key];
+			}
 		}
 	}
 	return merged_props;
diff --git a/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/Test.svelte b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/Test.svelte
new file mode 100644
index 0000000000..1ec9031319
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/Test.svelte
@@ -0,0 +1,3 @@
+<script>
+	export const x = 42;
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/_config.js b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/_config.js
new file mode 100644
index 0000000000..0645e5bc7f
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<p>42</p>`,
+	async test({ target, assert }) {
+		const p = target.querySelector('p');
+		assert.equal(p?.innerHTML, '42');
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/main.svelte b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/main.svelte
new file mode 100644
index 0000000000..8a0a370acb
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/bind-export-const-with-spread/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	import Test from "./Test.svelte";
+
+	let x;
+</script>
+
+<Test
+	bind:x
+	{...{}}
+/>
+<p>{x}</p>
\ No newline at end of file

From b979c291e274e730a9d55f758ca463b65a09eb7b Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 15:23:58 +0200
Subject: [PATCH 004/404] fix: properly traverse children when checking matches
 for `:has` (#13866)

The previous algorithm didn't take control flow blocks etc into account, this fixes that. Fixes #13860
---
 .changeset/tasty-students-peel.md             |  5 ++
 .../phases/2-analyze/css/css-prune.js         | 33 +++++---
 .../svelte/tests/css/samples/has/_config.js   | 78 +++++++++++--------
 .../svelte/tests/css/samples/has/expected.css |  6 ++
 .../svelte/tests/css/samples/has/input.svelte |  9 +++
 5 files changed, 87 insertions(+), 44 deletions(-)
 create mode 100644 .changeset/tasty-students-peel.md

diff --git a/.changeset/tasty-students-peel.md b/.changeset/tasty-students-peel.md
new file mode 100644
index 0000000000..aa7c5472c5
--- /dev/null
+++ b/.changeset/tasty-students-peel.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: properly traverse children when checking matches for `:has`
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 f5f7440085..f71a860958 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
@@ -405,19 +405,28 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 		/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
 		const descendant_elements = [];
 
-		/**
-		 * @param {Compiler.SvelteNode} node
-		 * @param {boolean} is_recursing
-		 */
-		function collect_child_elements(node, is_recursing) {
-			if (node.type === 'RegularElement' || node.type === 'SvelteElement') {
-				descendant_elements.push(node);
-				if (!is_recursing) child_elements.push(node);
-				node.fragment.nodes.forEach((node) => collect_child_elements(node, true));
+		walk(
+			/** @type {Compiler.SvelteNode} */ (element.fragment),
+			{ is_child: true },
+			{
+				_(node, context) {
+					if (node.type === 'RegularElement' || node.type === 'SvelteElement') {
+						descendant_elements.push(node);
+
+						if (context.state.is_child) {
+							child_elements.push(node);
+							context.state.is_child = false;
+							context.next();
+							context.state.is_child = true;
+						} else {
+							context.next();
+						}
+					} else {
+						context.next();
+					}
+				}
 			}
-		}
-
-		element.fragment.nodes.forEach((node) => collect_child_elements(node, false));
+		);
 
 		// :has(...) is special in that it means "look downwards in the CSS tree". Since our matching algorithm goes
 		// upwards and back-to-front, we need to first check the selectors inside :has(...), then check the rest of the
diff --git a/packages/svelte/tests/css/samples/has/_config.js b/packages/svelte/tests/css/samples/has/_config.js
index 815e48e096..675254c5b7 100644
--- a/packages/svelte/tests/css/samples/has/_config.js
+++ b/packages/svelte/tests/css/samples/has/_config.js
@@ -6,112 +6,126 @@ export default test({
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused:has(y)"',
 			start: {
-				line: 28,
+				line: 31,
 				column: 1,
-				character: 277
+				character: 308
 			},
 			end: {
-				line: 28,
+				line: 31,
 				column: 15,
-				character: 291
+				character: 322
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused:has(:global(y))"',
 			start: {
-				line: 31,
+				line: 34,
 				column: 1,
-				character: 312
+				character: 343
 			},
 			end: {
-				line: 31,
+				line: 34,
 				column: 24,
-				character: 335
+				character: 366
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "x:has(.unused)"',
 			start: {
-				line: 34,
+				line: 37,
 				column: 1,
-				character: 356
+				character: 387
 			},
 			end: {
-				line: 34,
+				line: 37,
 				column: 15,
-				character: 370
+				character: 401
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "x:has(y):has(.unused)"',
 			start: {
-				line: 47,
+				line: 50,
 				column: 1,
-				character: 525
+				character: 556
 			},
 			end: {
-				line: 47,
+				line: 50,
 				column: 22,
-				character: 546
+				character: 577
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused"',
 			start: {
-				line: 66,
+				line: 69,
 				column: 2,
-				character: 751
+				character: 782
 			},
 			end: {
-				line: 66,
+				line: 69,
 				column: 9,
-				character: 758
+				character: 789
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused x:has(y)"',
 			start: {
-				line: 82,
+				line: 85,
 				column: 1,
-				character: 905
+				character: 936
 			},
 			end: {
-				line: 82,
+				line: 85,
 				column: 17,
-				character: 921
+				character: 952
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".unused:has(.unused)"',
 			start: {
-				line: 85,
+				line: 88,
 				column: 1,
-				character: 942
+				character: 973
 			},
 			end: {
-				line: 85,
+				line: 88,
 				column: 21,
-				character: 962
+				character: 993
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "x:has(> z)"',
 			start: {
-				line: 92,
+				line: 98,
+				column: 1,
+				character: 1093
+			},
+			end: {
+				line: 98,
+				column: 11,
+				character: 1103
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "x:has(> d)"',
+			start: {
+				line: 101,
 				column: 1,
-				character: 1029
+				character: 1124
 			},
 			end: {
-				line: 92,
+				line: 101,
 				column: 11,
-				character: 1039
+				character: 1134
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/has/expected.css b/packages/svelte/tests/css/samples/has/expected.css
index 215f7d667e..251a6952d5 100644
--- a/packages/svelte/tests/css/samples/has/expected.css
+++ b/packages/svelte/tests/css/samples/has/expected.css
@@ -82,9 +82,15 @@
 	x.svelte-xyz:has(> y:where(.svelte-xyz)) {
 		color: green;
 	}
+	y.svelte-xyz:has(> d:where(.svelte-xyz)) {
+		color: green;
+	}
 	/* (unused) x:has(> z) {
 		color: red;
 	}*/
+	/* (unused) x:has(> d) {
+		color: red;
+	}*/
 	x.svelte-xyz > y:where(.svelte-xyz):has(z:where(.svelte-xyz)) {
 		color: green;
 	}
diff --git a/packages/svelte/tests/css/samples/has/input.svelte b/packages/svelte/tests/css/samples/has/input.svelte
index 7cbebe27ec..7a62b69c0b 100644
--- a/packages/svelte/tests/css/samples/has/input.svelte
+++ b/packages/svelte/tests/css/samples/has/input.svelte
@@ -1,6 +1,9 @@
 <x>
 	<y>
 		<z></z>
+		{#if foo}
+			<d></d>
+		{/if}
 	</y>
 </x>
 <c></c>
@@ -89,9 +92,15 @@
 	x:has(> y) {
 		color: green;
 	}
+	y:has(> d) {
+		color: green;
+	}
 	x:has(> z) {
 		color: red;
 	}
+	x:has(> d) {
+		color: red;
+	}
 	x > y:has(z) {
 		color: green;
 	}

From 7c7fd6518f2c8d88a7c1a401a75bf97ab65c6cc8 Mon Sep 17 00:00:00 2001
From: adiGuba <frederic.martini@gmail.com>
Date: Thu, 24 Oct 2024 19:20:40 +0200
Subject: [PATCH 005/404] feat: Little improvement to set_style() (#13836)

* improvement to set_style()

* add __styles to Element prototype
---
 .../3-transform/client/visitors/RegularElement.js |  8 +-------
 .../3-transform/client/visitors/SvelteElement.js  |  2 +-
 .../3-transform/client/visitors/shared/element.js |  7 ++-----
 .../internal/client/dom/elements/attributes.js    |  9 +++++++++
 .../src/internal/client/dom/elements/style.js     | 15 ++++++---------
 .../svelte/src/internal/client/dom/operations.js  |  2 ++
 6 files changed, 21 insertions(+), 22 deletions(-)

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 86707b1a23..d748fd85e8 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
@@ -291,13 +291,7 @@ export function RegularElement(node, context) {
 
 	// class/style directives must be applied last since they could override class/style attributes
 	build_class_directives(class_directives, node_id, context, is_attributes_reactive);
-	build_style_directives(
-		style_directives,
-		node_id,
-		context,
-		is_attributes_reactive,
-		lookup.has('style') || has_spread
-	);
+	build_style_directives(style_directives, node_id, context, is_attributes_reactive);
 
 	// Apply the src and loading attributes for <img> elements after the element is appended to the document
 	if (node.name === 'img' && (has_spread || lookup.has('loading'))) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
index 8bae80be37..d95f03d1d4 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
@@ -109,7 +109,7 @@ export function SvelteElement(node, context) {
 
 	// class/style directives must be applied last since they could override class/style attributes
 	build_class_directives(class_directives, element_id, inner_context, is_attributes_reactive);
-	build_style_directives(style_directives, element_id, inner_context, is_attributes_reactive, true);
+	build_style_directives(style_directives, element_id, inner_context, is_attributes_reactive);
 
 	const get_tag = b.thunk(/** @type {Expression} */ (context.visit(node.tag)));
 
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
index 1d0705b88d..e0fbe11b73 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
@@ -94,14 +94,12 @@ export function build_set_attributes(
  * @param {Identifier} element_id
  * @param {ComponentContext} context
  * @param {boolean} is_attributes_reactive
- * @param {boolean} force_check Should be `true` if we can't rely on our cached value, because for example there's also a `style` attribute
  */
 export function build_style_directives(
 	style_directives,
 	element_id,
 	context,
-	is_attributes_reactive,
-	force_check
+	is_attributes_reactive
 ) {
 	const state = context.state;
 
@@ -126,8 +124,7 @@ export function build_style_directives(
 				element_id,
 				b.literal(directive.name),
 				value,
-				/** @type {Expression} */ (directive.modifiers.includes('important') ? b.true : undefined),
-				force_check ? b.true : undefined
+				/** @type {Expression} */ (directive.modifiers.includes('important') ? b.true : undefined)
 			)
 		);
 
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 91aa1aee65..b05dd8f9aa 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -105,6 +105,11 @@ export function set_attribute(element, attribute, value, skip_warning) {
 
 	if (attributes[attribute] === (attributes[attribute] = value)) return;
 
+	if (attribute === 'style' && '__styles' in element) {
+		// reset styles to force style: directive to update
+		element.__styles = {};
+	}
+
 	if (attribute === 'loading') {
 		// @ts-expect-error
 		element[LOADING_ATTR_SYMBOL] = value;
@@ -289,6 +294,10 @@ export function set_attributes(
 				}
 			}
 		}
+		if (key === 'style' && '__styles' in element) {
+			// reset styles to force style: directive to update
+			element.__styles = {};
+		}
 	}
 
 	// On the first run, ensure that events are added after bindings so
diff --git a/packages/svelte/src/internal/client/dom/elements/style.js b/packages/svelte/src/internal/client/dom/elements/style.js
index dd297ff72b..34531029c9 100644
--- a/packages/svelte/src/internal/client/dom/elements/style.js
+++ b/packages/svelte/src/internal/client/dom/elements/style.js
@@ -3,23 +3,20 @@
  * @param {string} key
  * @param {string} value
  * @param {boolean} [important]
- * @param {boolean} [force_check] Should be `true` if we can't rely on our cached value, because for example there's also a `style` attribute
  */
-export function set_style(dom, key, value, important, force_check) {
+export function set_style(dom, key, value, important) {
 	// @ts-expect-error
-	var attributes = (dom.__attributes ??= {});
-	var style = dom.style;
-	var style_key = 'style-' + key;
+	var styles = (dom.__styles ??= {});
 
-	if (attributes[style_key] === value && (!force_check || style.getPropertyValue(key) === value)) {
+	if (styles[key] === value) {
 		return;
 	}
 
-	attributes[style_key] = value;
+	styles[key] = value;
 
 	if (value == null) {
-		style.removeProperty(key);
+		dom.style.removeProperty(key);
 	} else {
-		style.setProperty(key, value, important ? 'important' : '');
+		dom.style.setProperty(key, value, important ? 'important' : '');
 	}
 }
diff --git a/packages/svelte/src/internal/client/dom/operations.js b/packages/svelte/src/internal/client/dom/operations.js
index 76e5ca3cb2..e179ca0c71 100644
--- a/packages/svelte/src/internal/client/dom/operations.js
+++ b/packages/svelte/src/internal/client/dom/operations.js
@@ -44,6 +44,8 @@ export function init_operations() {
 	// @ts-expect-error
 	element_prototype.__attributes = null;
 	// @ts-expect-error
+	element_prototype.__styles = null;
+	// @ts-expect-error
 	element_prototype.__e = undefined;
 
 	// @ts-expect-error

From 041e56346615a146e452b69809f2c9d307a37909 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 24 Oct 2024 21:27:34 +0200
Subject: [PATCH 006/404] Version Packages (#13863)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/little-hotels-poke.md  |  5 -----
 .changeset/nine-pigs-approve.md   |  5 -----
 .changeset/short-jokes-speak.md   |  5 -----
 .changeset/tasty-students-peel.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/little-hotels-poke.md
 delete mode 100644 .changeset/nine-pigs-approve.md
 delete mode 100644 .changeset/short-jokes-speak.md
 delete mode 100644 .changeset/tasty-students-peel.md

diff --git a/.changeset/little-hotels-poke.md b/.changeset/little-hotels-poke.md
deleted file mode 100644
index 50b60e2142..0000000000
--- a/.changeset/little-hotels-poke.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: internally wrap store subscribe in untrack
diff --git a/.changeset/nine-pigs-approve.md b/.changeset/nine-pigs-approve.md
deleted file mode 100644
index b11daff5a3..0000000000
--- a/.changeset/nine-pigs-approve.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: allow binding to const with spread in legacy mode
diff --git a/.changeset/short-jokes-speak.md b/.changeset/short-jokes-speak.md
deleted file mode 100644
index 0b2552e29b..0000000000
--- a/.changeset/short-jokes-speak.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure props internally untracks current_value on sets
diff --git a/.changeset/tasty-students-peel.md b/.changeset/tasty-students-peel.md
deleted file mode 100644
index aa7c5472c5..0000000000
--- a/.changeset/tasty-students-peel.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: properly traverse children when checking matches for `:has`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 7fb83456f7..7aef0c6153 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.1.1
+
+### Patch Changes
+
+- fix: internally wrap store subscribe in untrack ([#13858](https://github.com/sveltejs/svelte/pull/13858))
+
+- fix: allow binding to const with spread in legacy mode ([#13849](https://github.com/sveltejs/svelte/pull/13849))
+
+- fix: ensure props internally untracks current_value on sets ([#13859](https://github.com/sveltejs/svelte/pull/13859))
+
+- fix: properly traverse children when checking matches for `:has` ([#13866](https://github.com/sveltejs/svelte/pull/13866))
+
 ## 5.1.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index c2689a69ab..07dce6fa5d 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.1.0",
+  "version": "5.1.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 357b807d80..164475d549 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.1.0';
+export const VERSION = '5.1.1';
 export const PUBLIC_VERSION = '5';

From 5a54ad9cc723b401df7e8dc5084a3a5184f24316 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 21:03:04 +0100
Subject: [PATCH 007/404] fix: ensure SvelteMap reactivity persists through
 deriveds (#13877)

* fix: ensure SvelteMap reactivity persists through deriveds

* fix: ensure SvelteMap reactivity persists through deriveds

* fix: ensure SvelteMap reactivity persists through deriveds
---
 .changeset/hungry-dogs-happen.md              |  5 +++
 packages/svelte/src/reactivity/map.js         | 11 +++++-
 .../samples/derived-map/_config.js            | 13 +++++++
 .../samples/derived-map/main.svelte           | 34 +++++++++++++++++++
 4 files changed, 62 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/hungry-dogs-happen.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte

diff --git a/.changeset/hungry-dogs-happen.md b/.changeset/hungry-dogs-happen.md
new file mode 100644
index 0000000000..e041a94c24
--- /dev/null
+++ b/.changeset/hungry-dogs-happen.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure SvelteMap reactivity persists through deriveds
diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js
index c732806cd0..ddadad90e2 100644
--- a/packages/svelte/src/reactivity/map.js
+++ b/packages/svelte/src/reactivity/map.js
@@ -94,13 +94,22 @@ export class SvelteMap extends Map {
 		var s = sources.get(key);
 		var prev_res = super.get(key);
 		var res = super.set(key, value);
+		var version = this.#version;
 
 		if (s === undefined) {
 			sources.set(key, source(0));
 			set(this.#size, super.size);
-			increment(this.#version);
+			increment(version);
 		} else if (prev_res !== value) {
 			increment(s);
+			// If no one listening to this property and is listening to the version, or
+			// the inverse, then we should increment the version to be safe
+			if (
+				(s.reactions === null && version.reactions !== null) ||
+				(s.reactions !== null && version.reactions === null)
+			) {
+				increment(version);
+			}
 		}
 
 		return res;
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
new file mode 100644
index 0000000000..f3d115c62b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `Loading`,
+
+	async test({ assert, target }) {
+		await Promise.resolve();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `1`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte
new file mode 100644
index 0000000000..6278af8158
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte
@@ -0,0 +1,34 @@
+<script>
+	import { untrack } from 'svelte';
+	import { SvelteMap } from 'svelte/reactivity';
+
+	const cache = new SvelteMap();
+
+	function get_async(id) {
+		const model = cache.get(id);
+
+		if (!model) {
+			const promise = new Promise(async () => {
+				await Promise.resolve();
+				cache.set(id, id.toString());
+			}).then(() => cache.get(id));
+
+			untrack(() => {
+				cache.set(id, promise);
+			});
+
+			return promise;
+		}
+
+		return model;
+	}
+
+	const value = $derived(get_async(1));
+</script>
+
+{#if value instanceof Promise}
+	Loading
+{:else}
+	{value}
+{/if}
+

From 59ff7f1e88134a21024483377b502c6a94db6051 Mon Sep 17 00:00:00 2001
From: adiGuba <frederic.martini@gmail.com>
Date: Thu, 24 Oct 2024 23:04:50 +0200
Subject: [PATCH 008/404] fix: date test fail for some timezone (#13889)

* fix test for some timezone

* lint
---
 packages/svelte/src/reactivity/date.test.ts | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/svelte/src/reactivity/date.test.ts b/packages/svelte/src/reactivity/date.test.ts
index 77111ee727..d07b6780c6 100644
--- a/packages/svelte/src/reactivity/date.test.ts
+++ b/packages/svelte/src/reactivity/date.test.ts
@@ -38,15 +38,23 @@ test('date.setDate and date.setUTCDate', () => {
 		date.setUTCDate(date.getUTCDate() + 1);
 	});
 
+	// Date/UTCDate may vary on some timezones
+	const date_plus_zero = new Date(initial_date);
+	date_plus_zero.setDate(a.getDate());
+	const date_plus_one = new Date(initial_date);
+	date_plus_one.setDate(a.getDate() + 1);
+	const date_plus_two = new Date(initial_date);
+	date_plus_two.setDate(a.getDate() + 2);
+
 	assert.deepEqual(log, [
 		initial_date.getDate(),
 		initial_date.getUTCDate(),
-		a.getDate(),
-		a.getUTCDate(),
-		a.getDate() + 1,
-		a.getUTCDate() + 1,
-		a.getDate() + 2,
-		a.getUTCDate() + 2
+		date_plus_zero.getDate(),
+		date_plus_zero.getUTCDate(),
+		date_plus_one.getDate(),
+		date_plus_one.getUTCDate(),
+		date_plus_two.getDate(),
+		date_plus_two.getUTCDate()
 	]);
 
 	cleanup();

From 4cf2d4a9049b1a32755ce3fad3418e81d6320ff3 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 22:12:40 +0100
Subject: [PATCH 009/404] fix: ensure each block references to imports are
 handled correctly (#13892)

---
 .changeset/curvy-beds-cover.md                           | 5 +++++
 packages/svelte/src/compiler/phases/2-analyze/index.js   | 6 +++++-
 .../samples/each-block-ref-import/_config.js             | 6 ++++++
 .../samples/each-block-ref-import/main.svelte            | 7 +++++++
 .../samples/each-block-ref-import/utils.js               | 9 +++++++++
 5 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/curvy-beds-cover.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/main.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/utils.js

diff --git a/.changeset/curvy-beds-cover.md b/.changeset/curvy-beds-cover.md
new file mode 100644
index 0000000000..f338cafffa
--- /dev/null
+++ b/.changeset/curvy-beds-cover.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure each block references to imports are handled correctly
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 188b060813..89c2e19c3f 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -505,7 +505,11 @@ export function analyze_component(root, source, options) {
 								if (is_reference(node, parent)) {
 									const binding = context.state.scope.get(node.name);
 
-									if (binding && binding.kind === 'normal') {
+									if (
+										binding &&
+										binding.kind === 'normal' &&
+										binding.declaration_kind !== 'import'
+									) {
 										binding.kind = 'state';
 										binding.mutated = binding.updated = true;
 									}
diff --git a/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/_config.js b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/_config.js
new file mode 100644
index 0000000000..052cdd27c4
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/_config.js
@@ -0,0 +1,6 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<input type="text">`,
+	ssrHtml: `<input type="text" value="">`
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/main.svelte b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/main.svelte
new file mode 100644
index 0000000000..26f629eb06
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	import { foo } from './utils';
+</script>
+
+{#each foo.bar as bar}
+	<input type="text" bind:value={bar.value} />
+{/each}
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/utils.js b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/utils.js
new file mode 100644
index 0000000000..e4b4434657
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/each-block-ref-import/utils.js
@@ -0,0 +1,9 @@
+export const foo = {
+	get bar() {
+		return [
+			{
+				value: ''
+			}
+		];
+	}
+};

From 771b1e89055b0acd8134e1cdf36283d519dd3168 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 22:12:48 +0100
Subject: [PATCH 010/404] fix: enable bound store props in runes mode
 components (#13887)

* fix: enable bound store props in runes mode components

* add some JSDoc, since it could be a headscratcher for future us

* make it clear that this is specifically about bindings

* skip intermediate value

* tweak other names too

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/cool-clocks-march.md               |  5 +++
 .../client/visitors/shared/component.js       | 12 ++++++-
 packages/svelte/src/internal/client/index.js  |  3 +-
 .../src/internal/client/reactivity/props.js   | 11 +++++--
 .../src/internal/client/reactivity/store.js   | 33 +++++++++++++++++++
 .../svelte/src/internal/client/validate.js    |  6 +++-
 .../samples/bound-store-sub/Child.svelte      |  7 ++++
 .../samples/bound-store-sub/_config.js        | 25 ++++++++++++++
 .../samples/bound-store-sub/main.svelte       | 11 +++++++
 9 files changed, 108 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/cool-clocks-march.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bound-store-sub/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bound-store-sub/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bound-store-sub/main.svelte

diff --git a/.changeset/cool-clocks-march.md b/.changeset/cool-clocks-march.md
new file mode 100644
index 0000000000..b3d5705231
--- /dev/null
+++ b/.changeset/cool-clocks-march.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: enable bound store props in runes mode components
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 e98c4f04f5..8e1a536707 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
@@ -188,7 +188,17 @@ export function build_component(node, component_name, context, anchor = context.
 					);
 				}
 
-				push_prop(b.get(attribute.name, [b.return(expression)]));
+				const is_store_sub =
+					attribute.expression.type === 'Identifier' &&
+					context.state.scope.get(attribute.expression.name)?.kind === 'store_sub';
+
+				if (is_store_sub) {
+					push_prop(
+						b.get(attribute.name, [b.stmt(b.call('$.mark_store_binding')), b.return(expression)])
+					);
+				} else {
+					push_prop(b.get(attribute.name, [b.return(expression)]));
+				}
 
 				const assignment = b.assignment('=', attribute.expression, b.id('$$value'));
 				push_prop(
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index 306fc69ca7..c401867a0f 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -121,7 +121,8 @@ export {
 	store_set,
 	store_unsub,
 	update_pre_store,
-	update_store
+	update_store,
+	mark_store_binding
 } from './reactivity/store.js';
 export { set_text } from './render.js';
 export {
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index 1df1933c19..eec8e70dc6 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -23,6 +23,7 @@ import { safe_equals } from './equality.js';
 import * as e from '../errors.js';
 import { BRANCH_EFFECT, DESTROYED, LEGACY_DERIVED_PROP, ROOT_EFFECT } from '../constants.js';
 import { proxy } from '../proxy.js';
+import { capture_store_binding } from './store.js';
 
 /**
  * @param {((value?: number) => number)} fn
@@ -273,8 +274,14 @@ export function prop(props, key, flags, fallback) {
 	var runes = (flags & PROPS_IS_RUNES) !== 0;
 	var bindable = (flags & PROPS_IS_BINDABLE) !== 0;
 	var lazy = (flags & PROPS_IS_LAZY_INITIAL) !== 0;
+	var is_store_sub = false;
+	var prop_value;
 
-	var prop_value = /** @type {V} */ (props[key]);
+	if (bindable) {
+		[prop_value, is_store_sub] = capture_store_binding(() => /** @type {V} */ (props[key]));
+	} else {
+		prop_value = /** @type {V} */ (props[key]);
+	}
 	var setter = get_descriptor(props, key)?.set;
 
 	var fallback_value = /** @type {V} */ (fallback);
@@ -343,7 +350,7 @@ export function prop(props, key, flags, fallback) {
 				// In that case the state proxy (if it exists) should take care of the notification.
 				// If the parent is not in runes mode, we need to notify on mutation, too, that the prop
 				// has changed because the parent will not be able to detect the change otherwise.
-				if (!runes || !mutation || legacy_parent) {
+				if (!runes || !mutation || legacy_parent || is_store_sub) {
 					/** @type {Function} */ (setter)(mutation ? getter() : value);
 				}
 				return value;
diff --git a/packages/svelte/src/internal/client/reactivity/store.js b/packages/svelte/src/internal/client/reactivity/store.js
index e28202aaf0..11eee23e0a 100644
--- a/packages/svelte/src/internal/client/reactivity/store.js
+++ b/packages/svelte/src/internal/client/reactivity/store.js
@@ -6,6 +6,13 @@ import { get } from '../runtime.js';
 import { teardown } from './effects.js';
 import { mutable_source, set } from './sources.js';
 
+/**
+ * Whether or not the prop currently being read is a store binding, as in
+ * `<Child bind:x={$y} />`. If it is, we treat the prop as mutable even in
+ * runes mode, and skip `binding_property_non_reactive` validation
+ */
+let is_store_binding = false;
+
 /**
  * Gets the current value of a store. If the store isn't subscribed to yet, it will create a proxy
  * signal that will be updated when the store is. The store references container is needed to
@@ -146,3 +153,29 @@ export function update_pre_store(store, store_value, d = 1) {
 	store.set(value);
 	return value;
 }
+
+/**
+ * Called inside prop getters to communicate that the prop is a store binding
+ */
+export function mark_store_binding() {
+	is_store_binding = true;
+}
+
+/**
+ * Returns a tuple that indicates whether `fn()` reads a prop that is a store binding.
+ * Used to prevent `binding_property_non_reactive` validation false positives and
+ * ensure that these props are treated as mutable even in runes mode
+ * @template T
+ * @param {() => T} fn
+ * @returns {[T, boolean]}
+ */
+export function capture_store_binding(fn) {
+	var previous_is_store_binding = is_store_binding;
+
+	try {
+		is_store_binding = false;
+		return [fn(), is_store_binding];
+	} finally {
+		is_store_binding = previous_is_store_binding;
+	}
+}
diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js
index 0666e5f87b..c3b1821947 100644
--- a/packages/svelte/src/internal/client/validate.js
+++ b/packages/svelte/src/internal/client/validate.js
@@ -4,6 +4,7 @@ import * as e from './errors.js';
 import { FILENAME } from '../../constants.js';
 import { render_effect } from './reactivity/effects.js';
 import * as w from './warnings.js';
+import { capture_store_binding } from './reactivity/store.js';
 
 /** regex of all html void element names */
 const void_element_names =
@@ -84,7 +85,10 @@ export function validate_binding(binding, get_object, get_property, line, column
 	render_effect(() => {
 		if (warned) return;
 
-		var object = get_object();
+		var [object, is_store_sub] = capture_store_binding(get_object);
+
+		if (is_store_sub) return;
+
 		var property = get_property();
 
 		var ran = false;
diff --git a/packages/svelte/tests/runtime-runes/samples/bound-store-sub/Child.svelte b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/Child.svelte
new file mode 100644
index 0000000000..8197a71d7c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/Child.svelte
@@ -0,0 +1,7 @@
+<script>
+	let { form = $bindable() } = $props();
+</script>
+
+<p>
+	<input type="number" bind:value={form.count} />
+</p>
diff --git a/packages/svelte/tests/runtime-runes/samples/bound-store-sub/_config.js b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/_config.js
new file mode 100644
index 0000000000..a2ba61718c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/_config.js
@@ -0,0 +1,25 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+import { ok } from 'assert';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: `<p><input type="number"></p>\n{"count":0}`,
+	ssrHtml: `<p><input type="number" value="0"></p>\n{"count":0}`,
+
+	test({ assert, target }) {
+		const input = target.querySelector('input');
+		ok(input);
+		const inputEvent = new window.InputEvent('input');
+
+		input.value = '10';
+		input.dispatchEvent(inputEvent);
+
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<p><input type="number"></p>\n{"count":10}`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bound-store-sub/main.svelte b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/main.svelte
new file mode 100644
index 0000000000..6ecc4f156e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bound-store-sub/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	import { writable } from 'svelte/store';
+	import Child from './Child.svelte';
+
+	let form = writable({
+		count: 0
+	});
+</script>
+
+<Child bind:form={$form} />
+{JSON.stringify($form)}

From b5750ac6678e18e67527db6877d7474f0e5fa1fe Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 24 Oct 2024 23:18:15 +0200
Subject: [PATCH 011/404] chore: setup `pkg.pr.new` (#13891)

* chore: setup `pkg.pr.new`

* chore: let's try with this
---
 .github/workflows/pkg.pr.new.yml | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 .github/workflows/pkg.pr.new.yml

diff --git a/.github/workflows/pkg.pr.new.yml b/.github/workflows/pkg.pr.new.yml
new file mode 100644
index 0000000000..76736782a0
--- /dev/null
+++ b/.github/workflows/pkg.pr.new.yml
@@ -0,0 +1,24 @@
+name: Publish Any Commit
+on: [push, pull_request]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - run: corepack enable
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 18.x
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build
+        run: pnpm build
+
+      - run: pnpx pkg-pr-new publish --compact --no-template './packages/svelte'

From 42ccdc1023f2169fda6aa4e4419238f9b31fe387 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 22:21:01 +0100
Subject: [PATCH 012/404] fix: ensure snippets after empty text correctly
 hydrate (#13870)

---
 .changeset/plenty-plums-sparkle.md                        | 5 +++++
 .../phases/3-transform/client/visitors/RegularElement.js  | 2 +-
 packages/svelte/src/internal/client/dom/operations.js     | 8 +++++++-
 .../runtime-runes/samples/snippet-after-text/Child.svelte | 5 +++++
 .../runtime-runes/samples/snippet-after-text/_config.js   | 8 ++++++++
 .../runtime-runes/samples/snippet-after-text/main.svelte  | 5 +++++
 .../skip-static-subtree/_expected/client/index.svelte.js  | 2 +-
 7 files changed, 32 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/plenty-plums-sparkle.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-after-text/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-after-text/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-after-text/main.svelte

diff --git a/.changeset/plenty-plums-sparkle.md b/.changeset/plenty-plums-sparkle.md
new file mode 100644
index 0000000000..4613cc321e
--- /dev/null
+++ b/.changeset/plenty-plums-sparkle.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure snippets after empty text correctly hydrate
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 d748fd85e8..52100a2019 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
@@ -384,7 +384,7 @@ export function RegularElement(node, context) {
 			arg = b.member(arg, 'content');
 		}
 
-		process_children(trimmed, () => b.call('$.child', arg), true, {
+		process_children(trimmed, (is_text) => b.call('$.child', arg, is_text && b.true), true, {
 			...context,
 			state: child_state
 		});
diff --git a/packages/svelte/src/internal/client/dom/operations.js b/packages/svelte/src/internal/client/dom/operations.js
index e179ca0c71..6dfce9ebd3 100644
--- a/packages/svelte/src/internal/client/dom/operations.js
+++ b/packages/svelte/src/internal/client/dom/operations.js
@@ -91,9 +91,10 @@ export function get_next_sibling(node) {
  * Don't mark this as side-effect-free, hydration needs to walk all nodes
  * @template {Node} N
  * @param {N} node
+ * @param {boolean} is_text
  * @returns {Node | null}
  */
-export function child(node) {
+export function child(node, is_text) {
 	if (!hydrating) {
 		return get_first_child(node);
 	}
@@ -103,6 +104,11 @@ export function child(node) {
 	// Child can be null if we have an element with a single child, like `<p>{text}</p>`, where `text` is empty
 	if (child === null) {
 		child = hydrate_node.appendChild(create_text());
+	} else if (is_text && child.nodeType !== 3) {
+		var text = create_text();
+		child?.before(text);
+		set_hydrate_node(text);
+		return text;
 	}
 
 	set_hydrate_node(child);
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-after-text/Child.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/Child.svelte
new file mode 100644
index 0000000000..711171a21d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	let {prop = '', children} = $props()
+</script>
+
+<div>{prop}{@render children()}</div>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-after-text/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/_config.js
new file mode 100644
index 0000000000..d9aa3a46c2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true // Render in dev mode to check that the validation error is not thrown
+	},
+	html: `<div>123</div`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-after-text/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/main.svelte
new file mode 100644
index 0000000000..6cc63a19ff
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-after-text/main.svelte
@@ -0,0 +1,5 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<Child>123</Child>
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
index 76433ad5a7..2d3cc3ba5a 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
@@ -7,7 +7,7 @@ export default function Skip_static_subtree($$anchor, $$props) {
 	var fragment = root();
 	var main = $.sibling($.first_child(fragment), 2);
 	var h1 = $.child(main);
-	var text = $.child(h1);
+	var text = $.child(h1, true);
 
 	$.reset(h1);
 

From d0177711b110c6d1b6b598c91063cc31841534f4 Mon Sep 17 00:00:00 2001
From: adiGuba <frederic.martini@gmail.com>
Date: Thu, 24 Oct 2024 23:24:29 +0200
Subject: [PATCH 013/404] fix : Rapidly toggling element with out: transition
 causes incorrect node removal (#13884)

* set onfinish to null to fix a rare bug

* replace null by noop
---
 .../svelte/src/internal/client/dom/elements/transitions.js    | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/svelte/src/internal/client/dom/elements/transitions.js b/packages/svelte/src/internal/client/dom/elements/transitions.js
index c8c297a394..dee029e88f 100644
--- a/packages/svelte/src/internal/client/dom/elements/transitions.js
+++ b/packages/svelte/src/internal/client/dom/elements/transitions.js
@@ -427,6 +427,10 @@ function animate(element, options, counterpart, t2, on_finish) {
 				animation.cancel();
 				// This prevents memory leaks in Chromium
 				animation.effect = null;
+				// This prevents onfinish to be launched after cancel(),
+				// which can happen in some rare cases
+				// see https://github.com/sveltejs/svelte/issues/13681
+				animation.onfinish = noop;
 			}
 		},
 		deactivate: () => {

From dee8db53df03848466ec45aea240c30a750e4a9f Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 24 Oct 2024 22:32:54 +0100
Subject: [PATCH 014/404] chore: add missing changeset (#13895)

Adds a changeset for #13884
---
 .changeset/cold-owls-do.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/cold-owls-do.md

diff --git a/.changeset/cold-owls-do.md b/.changeset/cold-owls-do.md
new file mode 100644
index 0000000000..46f14c6ea9
--- /dev/null
+++ b/.changeset/cold-owls-do.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: improve consistency of transitions

From 31472878130a5b508f4875a6423f5e8a0709e3c9 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 25 Oct 2024 00:04:34 +0200
Subject: [PATCH 015/404] fix: prevent var name clashing for delegated events
 without params (#13896)

---
 .changeset/smooth-dragons-push.md                  |  5 +++++
 .../compiler/phases/3-transform/client/utils.js    |  2 +-
 .../samples/event-without-params-clash/_config.js  | 14 ++++++++++++++
 .../samples/event-without-params-clash/main.svelte |  6 ++++++
 4 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/smooth-dragons-push.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/event-without-params-clash/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/event-without-params-clash/main.svelte

diff --git a/.changeset/smooth-dragons-push.md b/.changeset/smooth-dragons-push.md
new file mode 100644
index 0000000000..6e02748b47
--- /dev/null
+++ b/.changeset/smooth-dragons-push.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent var name clashing for delegated events without params
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 9463d909bc..2647f0a3be 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -136,7 +136,7 @@ export function build_hoisted_params(node, context) {
 	if (node.params.length === 0) {
 		if (hoisted_params.length > 0) {
 			// For the event object
-			params.push(b.id('_'));
+			params.push(b.id(context.state.scope.generate('_')));
 		}
 	} else {
 		for (const param of node.params) {
diff --git a/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/_config.js b/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/_config.js
new file mode 100644
index 0000000000..3dc265319d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	test({ assert, target, logs }) {
+		const btn = target.querySelector('button');
+
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.deepEqual(logs, ['test']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/main.svelte b/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/main.svelte
new file mode 100644
index 0000000000..eea08b3473
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/event-without-params-clash/main.svelte
@@ -0,0 +1,6 @@
+<svelte:options runes />
+<script>
+	let _ = "test"
+</script>
+
+<button onclick={() => { console.log(_)} }></button>
\ No newline at end of file

From b63fde3b75a77fb9fec3a9e126a8f0643ebb5d28 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 25 Oct 2024 00:54:22 +0200
Subject: [PATCH 016/404] fix: prevent migration script from adding `props.` to
 the `export let` identifier (#13899)

---
 .changeset/shaggy-seals-judge.md                             | 5 +++++
 packages/svelte/src/compiler/migrate/index.js                | 2 +-
 .../samples/not-prepend-props-to-export-let/input.svelte     | 5 +++++
 .../samples/not-prepend-props-to-export-let/output.svelte    | 5 +++++
 4 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/shaggy-seals-judge.md
 create mode 100644 packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/output.svelte

diff --git a/.changeset/shaggy-seals-judge.md b/.changeset/shaggy-seals-judge.md
new file mode 100644
index 0000000000..ef79705c31
--- /dev/null
+++ b/.changeset/shaggy-seals-judge.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent migration script from adding `props.` to the `export let` identifier
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 057020d730..ceb2ad5da2 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -1514,7 +1514,7 @@ function handle_identifier(node, state, path) {
 			);
 		} else {
 			const binding = state.scope.get(node.name);
-			if (binding?.kind === 'bindable_prop') {
+			if (binding?.kind === 'bindable_prop' && binding.node !== node) {
 				state.str.prependLeft(/** @type {number} */ (node.start), `${state.names.props}.`);
 			}
 		}
diff --git a/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/input.svelte b/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/input.svelte
new file mode 100644
index 0000000000..b169f63045
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/input.svelte
@@ -0,0 +1,5 @@
+<script>
+	export let stuff;
+
+	console.log($$props);
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/output.svelte b/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/output.svelte
new file mode 100644
index 0000000000..8e0f2fd658
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/not-prepend-props-to-export-let/output.svelte
@@ -0,0 +1,5 @@
+<script>
+	let { ...props } = $props();
+
+	console.log(props);
+</script>
\ No newline at end of file

From 1ee2ac4d05ae70d61d2fdc5bfaaddbee47e5c6c6 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 25 Oct 2024 00:30:46 +0100
Subject: [PATCH 017/404] Version Packages (#13888)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cold-owls-do.md         |  5 -----
 .changeset/cool-clocks-march.md    |  5 -----
 .changeset/curvy-beds-cover.md     |  5 -----
 .changeset/hungry-dogs-happen.md   |  5 -----
 .changeset/plenty-plums-sparkle.md |  5 -----
 .changeset/shaggy-seals-judge.md   |  5 -----
 .changeset/smooth-dragons-push.md  |  5 -----
 packages/svelte/CHANGELOG.md       | 18 ++++++++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 10 files changed, 20 insertions(+), 37 deletions(-)
 delete mode 100644 .changeset/cold-owls-do.md
 delete mode 100644 .changeset/cool-clocks-march.md
 delete mode 100644 .changeset/curvy-beds-cover.md
 delete mode 100644 .changeset/hungry-dogs-happen.md
 delete mode 100644 .changeset/plenty-plums-sparkle.md
 delete mode 100644 .changeset/shaggy-seals-judge.md
 delete mode 100644 .changeset/smooth-dragons-push.md

diff --git a/.changeset/cold-owls-do.md b/.changeset/cold-owls-do.md
deleted file mode 100644
index 46f14c6ea9..0000000000
--- a/.changeset/cold-owls-do.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: improve consistency of transitions
diff --git a/.changeset/cool-clocks-march.md b/.changeset/cool-clocks-march.md
deleted file mode 100644
index b3d5705231..0000000000
--- a/.changeset/cool-clocks-march.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: enable bound store props in runes mode components
diff --git a/.changeset/curvy-beds-cover.md b/.changeset/curvy-beds-cover.md
deleted file mode 100644
index f338cafffa..0000000000
--- a/.changeset/curvy-beds-cover.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure each block references to imports are handled correctly
diff --git a/.changeset/hungry-dogs-happen.md b/.changeset/hungry-dogs-happen.md
deleted file mode 100644
index e041a94c24..0000000000
--- a/.changeset/hungry-dogs-happen.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure SvelteMap reactivity persists through deriveds
diff --git a/.changeset/plenty-plums-sparkle.md b/.changeset/plenty-plums-sparkle.md
deleted file mode 100644
index 4613cc321e..0000000000
--- a/.changeset/plenty-plums-sparkle.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure snippets after empty text correctly hydrate
diff --git a/.changeset/shaggy-seals-judge.md b/.changeset/shaggy-seals-judge.md
deleted file mode 100644
index ef79705c31..0000000000
--- a/.changeset/shaggy-seals-judge.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent migration script from adding `props.` to the `export let` identifier
diff --git a/.changeset/smooth-dragons-push.md b/.changeset/smooth-dragons-push.md
deleted file mode 100644
index 6e02748b47..0000000000
--- a/.changeset/smooth-dragons-push.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent var name clashing for delegated events without params
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 7aef0c6153..e84220e4e2 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,23 @@
 # svelte
 
+## 5.1.2
+
+### Patch Changes
+
+- fix: improve consistency of transitions ([#13895](https://github.com/sveltejs/svelte/pull/13895))
+
+- fix: enable bound store props in runes mode components ([#13887](https://github.com/sveltejs/svelte/pull/13887))
+
+- fix: ensure each block references to imports are handled correctly ([#13892](https://github.com/sveltejs/svelte/pull/13892))
+
+- fix: ensure SvelteMap reactivity persists through deriveds ([#13877](https://github.com/sveltejs/svelte/pull/13877))
+
+- fix: ensure snippets after empty text correctly hydrate ([#13870](https://github.com/sveltejs/svelte/pull/13870))
+
+- fix: prevent migration script from adding `props.` to the `export let` identifier ([#13899](https://github.com/sveltejs/svelte/pull/13899))
+
+- fix: prevent var name clashing for delegated events without params ([#13896](https://github.com/sveltejs/svelte/pull/13896))
+
 ## 5.1.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 07dce6fa5d..c01ca6429b 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.1.1",
+  "version": "5.1.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 164475d549..434d9199f5 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.1.1';
+export const VERSION = '5.1.2';
 export const PUBLIC_VERSION = '5';

From 18e2284e749a6a4334d56e1bb40e3ef4fc140bb0 Mon Sep 17 00:00:00 2001
From: plgingras88 <34991510+plgingras88@users.noreply.github.com>
Date: Thu, 24 Oct 2024 21:56:44 -0400
Subject: [PATCH 018/404] docs: fix setContext/getContext typo (#13901)

---
 documentation/docs/06-runtime/02-context.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/06-runtime/02-context.md b/documentation/docs/06-runtime/02-context.md
index 87f254129e..62dd0c6a9e 100644
--- a/documentation/docs/06-runtime/02-context.md
+++ b/documentation/docs/06-runtime/02-context.md
@@ -80,9 +80,9 @@ Context is not inherently reactive. If you need reactive values in context then
 ```svelte
 <!--- file: Child.svelte --->
 <script>
-	import { setContext } from 'svelte';
+	import { getContext } from 'svelte';
 
-	const value = setContext('counter');
+	const value = getContext('counter');
 </script>
 
 <p>Count is {value.count}</p>

From 1a6a3e7ebd27b55f4ad00197fddc7e197399bb1a Mon Sep 17 00:00:00 2001
From: Matthew Carroll <53098729+matthewCmatt@users.noreply.github.com>
Date: Fri, 25 Oct 2024 03:41:54 -0400
Subject: [PATCH 019/404] fix: typo in `Action` types (#13874)

* typo: HTMLDiveElement

* regenerate types

* add changeset

---------

Co-authored-by: Conduitry <git@chor.date>
---
 .changeset/strong-buttons-juggle.md    | 5 +++++
 packages/svelte/src/action/public.d.ts | 2 +-
 packages/svelte/types/index.d.ts       | 2 +-
 3 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/strong-buttons-juggle.md

diff --git a/.changeset/strong-buttons-juggle.md b/.changeset/strong-buttons-juggle.md
new file mode 100644
index 0000000000..4a605f8051
--- /dev/null
+++ b/.changeset/strong-buttons-juggle.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: typo in `Action` types
diff --git a/packages/svelte/src/action/public.d.ts b/packages/svelte/src/action/public.d.ts
index 5d23b4d608..94669ff1fd 100644
--- a/packages/svelte/src/action/public.d.ts
+++ b/packages/svelte/src/action/public.d.ts
@@ -48,7 +48,7 @@ export interface ActionReturn<
  *   // ...
  * }
  * ```
- * `Action<HTMLDivElement>` and `Action<HTMLDiveElement, undefined>` both signal that the action accepts no parameters.
+ * `Action<HTMLDivElement>` and `Action<HTMLDivElement, undefined>` both signal that the action accepts no parameters.
  *
  * You can return an object with methods `update` and `destroy` from the function and type which additional attributes and events it has.
  * See interface `ActionReturn` for more details.
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 49ff2db8ce..4e57607efc 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -546,7 +546,7 @@ declare module 'svelte/action' {
 	 *   // ...
 	 * }
 	 * ```
-	 * `Action<HTMLDivElement>` and `Action<HTMLDiveElement, undefined>` both signal that the action accepts no parameters.
+	 * `Action<HTMLDivElement>` and `Action<HTMLDivElement, undefined>` both signal that the action accepts no parameters.
 	 *
 	 * You can return an object with methods `update` and `destroy` from the function and type which additional attributes and events it has.
 	 * See interface `ActionReturn` for more details.

From 107be2889009f15ce9d0ff15bd94244e00584cd9 Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 25 Oct 2024 04:49:08 -0400
Subject: [PATCH 020/404] docs: fix outdated $effect.tracking() demo (#13906)

---
 documentation/docs/02-runes/04-$effect.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index eedca52d9d..07291daa43 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -179,7 +179,7 @@ Apart from the timing, `$effect.pre` works exactly like `$effect`.
 
 ## `$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](/playground/untitled#H4sIAAAAAAAAE3XP0QrCMAwF0F-JRXAD595rLfgdzodRUyl0bVgzQcb-3VYFQfExl5tDMgvrPCYhT7MI_YBCiiOR2Aq-UxnSDT1jnlOcRlMSlczoiHUXOjYxpOhx5-O12rgAJg4UAwaGhDyR3Gxhjdai4V1v2N2wqus9tC3Y3ifMQjbehaqq4aBhLtEv_Or893icCsdLve-Caj8nBkU67zMO5HtGCfM3sKiWNKhV0zwVaBqd3x3ixVmHFyFLuJyXB-moOe8pAQAA)):
+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](/playground/untitled#H4sIAAAAAAAACn3PwYrCMBDG8VeZDYIt2PYeY8Dn2HrIhqkU08nQjItS-u6buAt7UDzmz8ePyaKGMWBS-nNRcmdU-hHUTpGbyuvI3KZvDFLal0v4qvtIgiSZUSb5eWSxPfWSc4oB2xDP1XYk8HHiSHkICeXKeruDDQ4Demlldv4y0rmq6z10HQwuJMxGVv4mVVXDwcJS0jP9u3knynwtoKz1vifT_Z9Jhm0WBCcOTlDD8kyspmML5qNpHg40jc3fFryJ0iWsp_UHgz3180oBAAA=)):
 
 ```svelte
 <script>

From feb2d85f4601879bc2edf508374511c4a7e038a3 Mon Sep 17 00:00:00 2001
From: Stephane <stephane-vanraes@users.noreply.github.com>
Date: Fri, 25 Oct 2024 11:52:36 +0200
Subject: [PATCH 021/404] docs: clarify why we need to use the derived rune
 (#13919)

* clarify why we need to use the derived rune

* put clarification as note
---
 documentation/docs/02-runes/03-$derived.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/02-runes/03-$derived.md b/documentation/docs/02-runes/03-$derived.md
index 4f0d70dcc8..96cafeaaea 100644
--- a/documentation/docs/02-runes/03-$derived.md
+++ b/documentation/docs/02-runes/03-$derived.md
@@ -21,6 +21,8 @@ The expression inside `$derived(...)` should be free of side-effects. Svelte wil
 
 As with `$state`, you can mark class fields as `$derived`.
 
+> [!NOTE] Code in Svelte components is only executed once at creation, without the `$derived` rune `double` would maintain it's original value.
+
 ## `$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.

From 441124c5c7d1bb35de9cb20377cddb4bad026eba Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 20:29:44 +0100
Subject: [PATCH 022/404] fix: ensure SVG element attributes have case
 preserved (#13935)

* fix: ensure SVG element attributes have case preserved

* fix: ensure SVG element attributes have case preserved

* fix: ensure SVG element attributes have case preserved
---
 .changeset/gentle-bulldogs-cough.md                          | 5 +++++
 .../phases/3-transform/client/visitors/SvelteElement.js      | 2 +-
 .../runtime-runes/samples/svg-attribute-case/_config.js      | 5 +++++
 .../runtime-runes/samples/svg-attribute-case/main.svelte     | 4 ++++
 4 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/gentle-bulldogs-cough.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-attribute-case/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-attribute-case/main.svelte

diff --git a/.changeset/gentle-bulldogs-cough.md b/.changeset/gentle-bulldogs-cough.md
new file mode 100644
index 0000000000..3f6f862259
--- /dev/null
+++ b/.changeset/gentle-bulldogs-cough.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure SVG element attributes have case preserved
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
index d95f03d1d4..ba66fe29d6 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteElement.js
@@ -101,7 +101,7 @@ export function SvelteElement(node, context) {
 			node,
 			element_id,
 			attributes_id,
-			b.binary('!==', b.member(element_id, 'namespaceURI'), b.id('$.NAMESPACE_SVG')),
+			b.binary('===', b.member(element_id, 'namespaceURI'), b.id('$.NAMESPACE_SVG')),
 			b.call(b.member(b.member(element_id, 'nodeName'), 'includes'), b.literal('-')),
 			context.state
 		);
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/_config.js b/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/_config.js
new file mode 100644
index 0000000000..a863250c74
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<svg viewBox="0 0 10 10"></svg><svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"></svg><svg viewBox=""></svg>`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/main.svelte b/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/main.svelte
new file mode 100644
index 0000000000..5832463312
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-attribute-case/main.svelte
@@ -0,0 +1,4 @@
+<svelte:options namespace="svg" />
+<svelte:element this="svg" viewBox="0 0 10 10" />
+<svelte:element this="svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" />
+<svg viewBox="" />
\ No newline at end of file

From 81f9bdd376979baa8b85095e9421897d7046f303 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 21:30:15 +0200
Subject: [PATCH 023/404] fix: remove metadata from legacy AST (#13927)

Besides being private API that shouldn't be exposed, they caused our AST explorer on the Svelte site to traverse endlessly

fixes https://github.com/sveltejs/svelte.dev/issues/480
---
 .changeset/strong-dogs-obey.md         | 5 +++++
 packages/svelte/src/compiler/legacy.js | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/strong-dogs-obey.md

diff --git a/.changeset/strong-dogs-obey.md b/.changeset/strong-dogs-obey.md
new file mode 100644
index 0000000000..abab6fdf75
--- /dev/null
+++ b/.changeset/strong-dogs-obey.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove metadata from legacy AST
diff --git a/packages/svelte/src/compiler/legacy.js b/packages/svelte/src/compiler/legacy.js
index 2a543a5370..e603da312b 100644
--- a/packages/svelte/src/compiler/legacy.js
+++ b/packages/svelte/src/compiler/legacy.js
@@ -204,7 +204,9 @@ export function convert(source, ast) {
 					ignores: extract_svelte_ignore(node.start, node.data, false)
 				};
 			},
-			ComplexSelector(node) {
+			ComplexSelector(node, { next }) {
+				next(); // delete inner metadata/parent properties
+
 				const children = [];
 
 				for (const child of node.children) {

From 7bbaedd6c749809ba987d937a57c6cd7c0fbd71b Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 20:38:25 +0100
Subject: [PATCH 024/404] fix: rethrow errors from await block if no catch
 block exists (#13819)

* chore: highlight swallowed errors from await blocks in DEV

* chore: highlight swallowed errors from await blocks in DEV

* chore: highlight swallowed errors from await blocks in DEV

* lint

* feedback

* feedback

* add test

* Update packages/svelte/tests/runtime-runes/samples/await-no-catch-error/main.svelte

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/blue-boats-call.md                 |  5 +++++
 .../src/internal/client/dom/blocks/await.js   |  4 ++++
 .../samples/await-no-catch-error/_config.js   | 22 +++++++++++++++++++
 .../samples/await-no-catch-error/main.svelte  | 10 +++++++++
 4 files changed, 41 insertions(+)
 create mode 100644 .changeset/blue-boats-call.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/await-no-catch-error/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/await-no-catch-error/main.svelte

diff --git a/.changeset/blue-boats-call.md b/.changeset/blue-boats-call.md
new file mode 100644
index 0000000000..0f6c31025d
--- /dev/null
+++ b/.changeset/blue-boats-call.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: rethrow errors from await block if no catch block exists
diff --git a/packages/svelte/src/internal/client/dom/blocks/await.js b/packages/svelte/src/internal/client/dom/blocks/await.js
index 75bbb23cdd..3c6bc9900d 100644
--- a/packages/svelte/src/internal/client/dom/blocks/await.js
+++ b/packages/svelte/src/internal/client/dom/blocks/await.js
@@ -131,6 +131,10 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
 					// but let's use internal_set for consistency and just to be safe
 					internal_set(error_source, error);
 					update(CATCH, true);
+					if (!catch_fn) {
+						// Rethrow the error if no catch block exists
+						throw error_source.v;
+					}
 				}
 			);
 
diff --git a/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/_config.js b/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/_config.js
new file mode 100644
index 0000000000..568b58ff95
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/_config.js
@@ -0,0 +1,22 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target }) {
+		const b1 = target.querySelector('button');
+
+		let err = '';
+		window.addEventListener('error', (e) => {
+			e.preventDefault();
+			err = e.message;
+		});
+
+		b1?.click();
+		await Promise.resolve();
+		flushSync();
+
+		assert.throws(() => {
+			throw err;
+		}, /Test/);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/main.svelte b/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/main.svelte
new file mode 100644
index 0000000000..bd2fb1e2f2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/await-no-catch-error/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	const promise = Promise.reject('Test');
+	let toggle = $state(false);
+</script>
+
+<button onclick={() => toggle = !toggle}>toggle</button>
+
+{#if toggle}
+	{#await promise}{/await}
+{/if}

From 1e6cf1bb408acb787ebab001b4301b961b76bbed Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 22:02:45 +0100
Subject: [PATCH 025/404] fix: ensure bind:group works as intended with proxied
 state objects (#13939)

---
 .changeset/giant-bags-wash.md                 |  5 +++++
 .../client/dom/elements/bindings/input.js     |  4 ++--
 .../samples/state-bind-group/_config.js       | 19 +++++++++++++++++++
 .../samples/state-bind-group/main.svelte      | 12 ++++++++++++
 4 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/giant-bags-wash.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-bind-group/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-bind-group/main.svelte

diff --git a/.changeset/giant-bags-wash.md b/.changeset/giant-bags-wash.md
new file mode 100644
index 0000000000..5731e4f922
--- /dev/null
+++ b/.changeset/giant-bags-wash.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure bind:group works as intended with proxied state objects
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 28a99f7eed..7af20b932a 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -2,7 +2,7 @@ import { DEV } from 'esm-env';
 import { render_effect, teardown } from '../../../reactivity/effects.js';
 import { listen_to_event_and_reset_event } from './shared.js';
 import * as e from '../../../errors.js';
-import { get_proxied_value, is } from '../../../proxy.js';
+import { is } from '../../../proxy.js';
 import { queue_micro_task } from '../../task.js';
 import { hydrating } from '../../hydration.js';
 import { is_runes } from '../../../runtime.js';
@@ -126,7 +126,7 @@ export function bind_group(inputs, group_index, input, get, set = get) {
 		if (is_checkbox) {
 			value = value || [];
 			// @ts-ignore
-			input.checked = get_proxied_value(value).includes(get_proxied_value(input.__value));
+			input.checked = value.includes(input.__value);
 		} else {
 			// @ts-ignore
 			input.checked = is(input.__value, value);
diff --git a/packages/svelte/tests/runtime-runes/samples/state-bind-group/_config.js b/packages/svelte/tests/runtime-runes/samples/state-bind-group/_config.js
new file mode 100644
index 0000000000..72f49c6e0e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-bind-group/_config.js
@@ -0,0 +1,19 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `<button>+</button><input type="checkbox" value="1"><input type="checkbox" value="2"><input type="checkbox" value="3">\n[]`,
+
+	test({ assert, target }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.equal(target.querySelectorAll('input')[1].checked, true);
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>+</button><input type="checkbox" value="1"><input type="checkbox" value="2"><input type="checkbox" value="3">\n["2"]`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/state-bind-group/main.svelte b/packages/svelte/tests/runtime-runes/samples/state-bind-group/main.svelte
new file mode 100644
index 0000000000..ca78457ee8
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-bind-group/main.svelte
@@ -0,0 +1,12 @@
+<script>
+	let checkboxes = $state([]);
+	let values = ['1', '2', '3'];
+</script>
+
+<button onclick={() => checkboxes.push('2')}>+</button>
+
+{#each values as val, i}
+	<input type="checkbox" value={val} bind:group={checkboxes} />
+{/each}
+
+{JSON.stringify(checkboxes)}

From 37fa34c4ade50b6570030669cdccc6c6c24226b5 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 22:04:36 +0100
Subject: [PATCH 026/404] fix: ensure value is correctly set to zero on the
 progress element (#13924)

* fix: ensure value is correctly set to zero on the progress element

* fix: ensure value is correctly set to zero on the progress element

* fix: ensure value is correctly set to zero on the progress element
---
 .changeset/late-wombats-cheer.md                         | 5 +++++
 .../src/internal/client/dom/elements/attributes.js       | 9 +++++++--
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/late-wombats-cheer.md

diff --git a/.changeset/late-wombats-cheer.md b/.changeset/late-wombats-cheer.md
new file mode 100644
index 0000000000..cf3f8a0d2b
--- /dev/null
+++ b/.changeset/late-wombats-cheer.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure value is correctly set to zero on the progress element
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index b05dd8f9aa..30c7712f1e 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -54,8 +54,13 @@ export function remove_input_defaults(input) {
 export function set_value(element, value) {
 	// @ts-expect-error
 	var attributes = (element.__attributes ??= {});
-	// @ts-expect-error
-	if (attributes.value === (attributes.value = value) || element.value === value) return;
+	if (
+		attributes.value === (attributes.value = value) ||
+		// @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;
 }

From 83a5eaac8e3ad2c549c640549d84b6bd3efd01c4 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 25 Oct 2024 22:04:54 +0100
Subject: [PATCH 027/404] fix: skip comment nodes in snippet validation logic
 (#13936)

---
 .changeset/shy-penguins-beg.md                         |  5 +++++
 .../compiler/phases/2-analyze/visitors/SnippetBlock.js |  5 ++++-
 .../samples/snippet-comment-sibling/Child.svelte       |  5 +++++
 .../samples/snippet-comment-sibling/_config.js         |  5 +++++
 .../samples/snippet-comment-sibling/main.svelte        | 10 ++++++++++
 5 files changed, 29 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/shy-penguins-beg.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/main.svelte

diff --git a/.changeset/shy-penguins-beg.md b/.changeset/shy-penguins-beg.md
new file mode 100644
index 0000000000..77b614c3d5
--- /dev/null
+++ b/.changeset/shy-penguins-beg.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: skip comment nodes in snippet validation logic
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 94bbd3cde1..356cf2eeae 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
@@ -46,7 +46,10 @@ export function SnippetBlock(node, context) {
 	) {
 		if (
 			parent.fragment.nodes.some(
-				(node) => node.type !== 'SnippetBlock' && (node.type !== 'Text' || node.data.trim())
+				(node) =>
+					node.type !== 'SnippetBlock' &&
+					(node.type !== 'Text' || node.data.trim()) &&
+					node.type !== 'Comment'
 			)
 		) {
 			e.snippet_conflict(node);
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/Child.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/Child.svelte
new file mode 100644
index 0000000000..5da1d878e8
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	const { children } = $props();
+</script>
+
+{@render children()}
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/_config.js
new file mode 100644
index 0000000000..17eaeb9553
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `The content`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/main.svelte
new file mode 100644
index 0000000000..c1073ede06
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-comment-sibling/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	import Child from "./Child.svelte"
+</script>
+
+<Child>
+	<!-- I'm just a poor comment -->
+	{#snippet children()}
+		The content
+	{/snippet}
+</Child>

From da1fefcd45c7bc8650db78ab35e08a921747761c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 25 Oct 2024 22:13:06 +0100
Subject: [PATCH 028/404] Version Packages (#13920)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/blue-boats-call.md       |  5 -----
 .changeset/gentle-bulldogs-cough.md |  5 -----
 .changeset/giant-bags-wash.md       |  5 -----
 .changeset/late-wombats-cheer.md    |  5 -----
 .changeset/shy-penguins-beg.md      |  5 -----
 .changeset/strong-buttons-juggle.md |  5 -----
 .changeset/strong-dogs-obey.md      |  5 -----
 packages/svelte/CHANGELOG.md        | 18 ++++++++++++++++++
 packages/svelte/package.json        |  2 +-
 packages/svelte/src/version.js      |  2 +-
 10 files changed, 20 insertions(+), 37 deletions(-)
 delete mode 100644 .changeset/blue-boats-call.md
 delete mode 100644 .changeset/gentle-bulldogs-cough.md
 delete mode 100644 .changeset/giant-bags-wash.md
 delete mode 100644 .changeset/late-wombats-cheer.md
 delete mode 100644 .changeset/shy-penguins-beg.md
 delete mode 100644 .changeset/strong-buttons-juggle.md
 delete mode 100644 .changeset/strong-dogs-obey.md

diff --git a/.changeset/blue-boats-call.md b/.changeset/blue-boats-call.md
deleted file mode 100644
index 0f6c31025d..0000000000
--- a/.changeset/blue-boats-call.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: rethrow errors from await block if no catch block exists
diff --git a/.changeset/gentle-bulldogs-cough.md b/.changeset/gentle-bulldogs-cough.md
deleted file mode 100644
index 3f6f862259..0000000000
--- a/.changeset/gentle-bulldogs-cough.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure SVG element attributes have case preserved
diff --git a/.changeset/giant-bags-wash.md b/.changeset/giant-bags-wash.md
deleted file mode 100644
index 5731e4f922..0000000000
--- a/.changeset/giant-bags-wash.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure bind:group works as intended with proxied state objects
diff --git a/.changeset/late-wombats-cheer.md b/.changeset/late-wombats-cheer.md
deleted file mode 100644
index cf3f8a0d2b..0000000000
--- a/.changeset/late-wombats-cheer.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure value is correctly set to zero on the progress element
diff --git a/.changeset/shy-penguins-beg.md b/.changeset/shy-penguins-beg.md
deleted file mode 100644
index 77b614c3d5..0000000000
--- a/.changeset/shy-penguins-beg.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: skip comment nodes in snippet validation logic
diff --git a/.changeset/strong-buttons-juggle.md b/.changeset/strong-buttons-juggle.md
deleted file mode 100644
index 4a605f8051..0000000000
--- a/.changeset/strong-buttons-juggle.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: typo in `Action` types
diff --git a/.changeset/strong-dogs-obey.md b/.changeset/strong-dogs-obey.md
deleted file mode 100644
index abab6fdf75..0000000000
--- a/.changeset/strong-dogs-obey.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove metadata from legacy AST
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index e84220e4e2..ae56d2e619 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,23 @@
 # svelte
 
+## 5.1.3
+
+### Patch Changes
+
+- fix: rethrow errors from await block if no catch block exists ([#13819](https://github.com/sveltejs/svelte/pull/13819))
+
+- fix: ensure SVG element attributes have case preserved ([#13935](https://github.com/sveltejs/svelte/pull/13935))
+
+- fix: ensure bind:group works as intended with proxied state objects ([#13939](https://github.com/sveltejs/svelte/pull/13939))
+
+- fix: ensure value is correctly set to zero on the progress element ([#13924](https://github.com/sveltejs/svelte/pull/13924))
+
+- fix: skip comment nodes in snippet validation logic ([#13936](https://github.com/sveltejs/svelte/pull/13936))
+
+- fix: typo in `Action` types ([#13874](https://github.com/sveltejs/svelte/pull/13874))
+
+- fix: remove metadata from legacy AST ([#13927](https://github.com/sveltejs/svelte/pull/13927))
+
 ## 5.1.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index c01ca6429b..73b3e253f3 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.1.2",
+  "version": "5.1.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 434d9199f5..1e37585b9d 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.1.2';
+export const VERSION = '5.1.3';
 export const PUBLIC_VERSION = '5';

From 7be3afb3a642d1654a4b96ddfa3d6239a8cf1a6b Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sat, 26 Oct 2024 09:20:06 +0200
Subject: [PATCH 029/404] fix: add empty stack to `CompileDiagnostic` to show
 error on build (#13942)

* fix: add empty stack to `CompileDiagnostic` to show error on build

* chore: generate types

* chore: make stack optional to make TS happy

* chore: generate types -.-"

* chore: add comment
---
 .changeset/brave-fans-sneeze.md                              | 5 +++++
 packages/svelte/src/compiler/utils/compile_diagnostic.js     | 3 +++
 .../samples/impossible-migrate-with-errors/_config.js        | 1 +
 packages/svelte/types/index.d.ts                             | 2 ++
 4 files changed, 11 insertions(+)
 create mode 100644 .changeset/brave-fans-sneeze.md

diff --git a/.changeset/brave-fans-sneeze.md b/.changeset/brave-fans-sneeze.md
new file mode 100644
index 0000000000..c5fe894acb
--- /dev/null
+++ b/.changeset/brave-fans-sneeze.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: add empty stack to `CompileDiagnostic` to show error on build
diff --git a/packages/svelte/src/compiler/utils/compile_diagnostic.js b/packages/svelte/src/compiler/utils/compile_diagnostic.js
index a27e06968f..374a20b8b5 100644
--- a/packages/svelte/src/compiler/utils/compile_diagnostic.js
+++ b/packages/svelte/src/compiler/utils/compile_diagnostic.js
@@ -39,6 +39,7 @@ function get_code_frame(source, line, column) {
  * @typedef {{
  * 	code: string;
  * 	message: string;
+ *  stack?: string;
  * 	filename?: string;
  * 	start?: Location;
  * 	end?: Location;
@@ -50,6 +51,8 @@ function get_code_frame(source, line, column) {
 /** @implements {ICompileDiagnostic} */
 export class CompileDiagnostic {
 	name = 'CompileDiagnostic';
+	// adding an empty stack so that vite will show the file and frame during build
+	stack = '';
 
 	/**
 	 * @param {string} code
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 6d25bb63b1..57496dcba7 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
@@ -20,6 +20,7 @@ export default test({
                         ^`,
 			message: 'Unexpected end of input',
 			name: 'CompileError',
+			stack: '',
 			position: [30, 30],
 			start: {
 				character: 30,
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 4e57607efc..c7794d5b0e 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1458,6 +1458,7 @@ declare module 'svelte/compiler' {
 	type ICompileDiagnostic = {
 		code: string;
 		message: string;
+		stack?: string;
 		filename?: string;
 		start?: Location;
 		end?: Location;
@@ -2286,6 +2287,7 @@ declare module 'svelte/types/compiler/interfaces' {
 	type ICompileDiagnostic = {
 		code: string;
 		message: string;
+		stack?: string;
 		filename?: string;
 		start?: Location;
 		end?: Location;

From 12fcc7a35a9fedfa5cf3cb85b4cc904b75f2aff5 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sat, 26 Oct 2024 18:20:37 +0200
Subject: [PATCH 030/404] fix: trim whitespace while migrating blocks (#13941)

Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
---
 .changeset/tasty-frogs-boil.md                |  5 ++
 packages/svelte/src/compiler/migrate/index.js | 54 +++++++++++++++++++
 .../remove-blocks-whitespace/input.svelte     | 27 ++++++++++
 .../remove-blocks-whitespace/output.svelte    | 26 +++++++++
 4 files changed, 112 insertions(+)
 create mode 100644 .changeset/tasty-frogs-boil.md
 create mode 100644 packages/svelte/tests/migrate/samples/remove-blocks-whitespace/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/remove-blocks-whitespace/output.svelte

diff --git a/.changeset/tasty-frogs-boil.md b/.changeset/tasty-frogs-boil.md
new file mode 100644
index 0000000000..26b33db998
--- /dev/null
+++ b/.changeset/tasty-frogs-boil.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: trim whitespace while migrating blocks
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index ceb2ad5da2..0bf3ac08b2 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -853,6 +853,20 @@ const instance_script = {
 	}
 };
 
+/**
+ *
+ * @param {State} state
+ * @param {number} start
+ * @param {number} end
+ */
+function trim_block(state, start, end) {
+	const original = state.str.snip(start, end).toString();
+	const without_parens = original.substring(1, original.length - 1);
+	if (without_parens.trim().length !== without_parens.length) {
+		state.str.update(start + 1, end - 1, without_parens.trim());
+	}
+}
+
 /** @type {Visitors<SvelteNode, State>} */
 const template = {
 	Identifier(node, { state, path }) {
@@ -1119,6 +1133,46 @@ const template = {
 		if (migrated !== node.data) {
 			state.str.overwrite(node.start + '<!--'.length, node.end - '-->'.length, migrated);
 		}
+	},
+	HtmlTag(node, { state, next }) {
+		trim_block(state, node.start, node.end);
+		next();
+	},
+	ConstTag(node, { state, next }) {
+		trim_block(state, node.start, node.end);
+		next();
+	},
+	IfBlock(node, { state, next }) {
+		const start = node.start;
+		const end = state.str.original.indexOf('}', node.test.end) + 1;
+		trim_block(state, start, end);
+		next();
+	},
+	AwaitBlock(node, { state, next }) {
+		const start = node.start;
+		const end =
+			state.str.original.indexOf(
+				'}',
+				node.pending !== null ? node.expression.end : node.value?.end
+			) + 1;
+		trim_block(state, start, end);
+		if (node.pending !== null) {
+			const start = state.str.original.lastIndexOf('{', node.value?.start);
+			const end = state.str.original.indexOf('}', node.value?.end) + 1;
+			trim_block(state, start, end);
+		}
+		if (node.catch !== null) {
+			const start = state.str.original.lastIndexOf('{', node.error?.start);
+			const end = state.str.original.indexOf('}', node.error?.end) + 1;
+			trim_block(state, start, end);
+		}
+		next();
+	},
+	KeyBlock(node, { state, next }) {
+		const start = node.start;
+		const end = state.str.original.indexOf('}', node.expression.end) + 1;
+		trim_block(state, start, end);
+		next();
 	}
 };
 
diff --git a/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/input.svelte b/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/input.svelte
new file mode 100644
index 0000000000..d1ff0668a8
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/input.svelte
@@ -0,0 +1,27 @@
+{  @html "some html"   }
+
+{     #if false && {
+	
+}.x === 34    }
+	true
+{    :else if false  }
+	false
+{/if}
+
+{     #await []    }
+	{   @const x = 43   }
+	{x}
+{   :then i   }
+	{i}
+{  :catch e  }
+	dlkdj
+{/await}
+
+{   #await [] then i   }
+stuff
+{/await}
+
+{      #key count    }
+	dlkdj
+{/key}
+
diff --git a/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/output.svelte b/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/output.svelte
new file mode 100644
index 0000000000..e2cb616020
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/remove-blocks-whitespace/output.svelte
@@ -0,0 +1,26 @@
+{@html "some html"}
+
+{#if false && {
+	
+}.x === 34}
+	true
+{:else if false}
+	false
+{/if}
+
+{#await []}
+	{@const x = 43}
+	{x}
+{:then i}
+	{i}
+{:catch e}
+	dlkdj
+{/await}
+
+{#await [] then i}
+stuff
+{/await}
+
+{#key count}
+	dlkdj
+{/key}
\ No newline at end of file

From 5ab65e3d59b678206d1784487b1db049d47ddaec Mon Sep 17 00:00:00 2001
From: george looshch <looshch@loosh.ch>
Date: Sat, 26 Oct 2024 17:22:15 +0100
Subject: [PATCH 031/404] docs: consistently capitalize DOM in the Svelte 5
 migration guide (#13957) (#13958)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Make the casing of the word ‘DOM’ in the Svelte 5 migration guide
consistent.
---
 documentation/docs/07-misc/07-v5-migration-guide.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index deffca288d..1624755a6b 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -319,9 +319,9 @@ When spreading props, local event handlers must go _after_ the spread, or they r
 > - call said dispatch function with a string and possibly a payload
 > - retrieve said payload on the other end through a `.details` property, because the event itself was always a `CustomEvent`
 >
-> It was always possible to use component callback props, but because you had to listen to dom events using `on:`, it made sense to use `createEventDispatcher` for component events due to syntactical consistency. Now that we have event attributes (`onclick`), it's the other way around: Callback props are now the more sensible thing to do.
+> It was always possible to use component callback props, but because you had to listen to DOM events using `on:`, it made sense to use `createEventDispatcher` for component events due to syntactical consistency. Now that we have event attributes (`onclick`), it's the other way around: Callback props are now the more sensible thing to do.
 >
-> The removal of event modifiers is arguably one of the changes that seems like a step back for those who've liked the shorthand syntax of event modifiers. Given that they are not used that frequently, we traded a smaller surface area for more explicitness. Modifiers also were inconsistent, because most of them were only useable on Dom elements.
+> The removal of event modifiers is arguably one of the changes that seems like a step back for those who've liked the shorthand syntax of event modifiers. Given that they are not used that frequently, we traded a smaller surface area for more explicitness. Modifiers also were inconsistent, because most of them were only useable on DOM elements.
 >
 > Multiple listeners for the same event are also no longer possible, but it was something of an anti-pattern anyway, 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. It also implies that the two handlers are independent, when in fact something like `event.stopImmediatePropagation()` inside `one` would prevent `two` from being called.
 >
@@ -441,7 +441,7 @@ We thought the same, which is why we provide a migration script to do most of th
 
 - bump core dependencies in your `package.json`
 - migrate to runes (`let` -> `$state` etc)
-- migrate to event attributes for Dom elements (`on:click` -> `onclick`)
+- migrate to event attributes for DOM elements (`on:click` -> `onclick`)
 - migrate slot creations to render tags (`<slot />` -> `{@render children()}`)
 - migrate slot usages to snippets (`<div slot="x">...</div>` -> `{#snippet x()}<div>...</div>{/snippet}`)
 - migrate obvious component creations (`new Component(...)` -> `mount(Component, ...)`)

From 67cf3871b4fe4f0130406b6d1c1b51e26f155bb4 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sat, 26 Oct 2024 19:18:53 +0200
Subject: [PATCH 032/404] fix: more exhaustive check during `SvelteMap.set` in
 deriveds (#13951)

* fix: more exhaustive check during `SvelteMap.set` in deriveds

* chore: use set for version reactions

* chore: cleanup
---
 .changeset/sweet-candles-poke.md                |  5 +++++
 packages/svelte/src/reactivity/map.js           | 17 ++++++++++-------
 .../samples/derived-map/_config.js              |  1 -
 .../samples/derived-map/main.svelte             |  4 ++++
 4 files changed, 19 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/sweet-candles-poke.md

diff --git a/.changeset/sweet-candles-poke.md b/.changeset/sweet-candles-poke.md
new file mode 100644
index 0000000000..49ec305399
--- /dev/null
+++ b/.changeset/sweet-candles-poke.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: more exhaustive check during `SvelteMap.set` in deriveds
diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js
index ddadad90e2..ae1bf47773 100644
--- a/packages/svelte/src/reactivity/map.js
+++ b/packages/svelte/src/reactivity/map.js
@@ -1,6 +1,6 @@
 /** @import { Source } from '#client' */
 import { DEV } from 'esm-env';
-import { source, set } from '../internal/client/reactivity/sources.js';
+import { set, source } from '../internal/client/reactivity/sources.js';
 import { get } from '../internal/client/runtime.js';
 import { increment } from './utils.js';
 
@@ -102,12 +102,15 @@ export class SvelteMap extends Map {
 			increment(version);
 		} else if (prev_res !== value) {
 			increment(s);
-			// If no one listening to this property and is listening to the version, or
-			// the inverse, then we should increment the version to be safe
-			if (
-				(s.reactions === null && version.reactions !== null) ||
-				(s.reactions !== null && version.reactions === null)
-			) {
+
+			// if not every reaction of s is a reaction of version we need to also include version
+			var v_reactions = version.reactions === null ? null : new Set(version.reactions);
+			var needs_version_increase =
+				v_reactions === null ||
+				!s.reactions?.every((r) =>
+					/** @type {NonNullable<typeof v_reactions>} */ (v_reactions).has(r)
+				);
+			if (needs_version_increase) {
 				increment(version);
 			}
 		}
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
index f3d115c62b..f933d0b2fa 100644
--- a/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/derived-map/_config.js
@@ -3,7 +3,6 @@ import { test } from '../../test';
 
 export default test({
 	html: `Loading`,
-
 	async test({ assert, target }) {
 		await Promise.resolve();
 		flushSync();
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte
index 6278af8158..ea51f29dfb 100644
--- a/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/derived-map/main.svelte
@@ -24,6 +24,10 @@
 	}
 
 	const value = $derived(get_async(1));
+	const value2 = $derived(get_async(1));
+	// both values are read before the set 
+	value;
+	value2;
 </script>
 
 {#if value instanceof Promise}

From ac6d8c0bf4534221818c634286c7c9b1b7fd91d3 Mon Sep 17 00:00:00 2001
From: Max Duval <hi@mxdvl.com>
Date: Sun, 27 Oct 2024 10:36:36 +0000
Subject: [PATCH 033/404] docs: fix small typo (#13967)

A full stop or colon, we myst choose
---
 documentation/docs/03-template-syntax/12-use.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/03-template-syntax/12-use.md b/documentation/docs/03-template-syntax/12-use.md
index ff50e38cf2..f3db72a772 100644
--- a/documentation/docs/03-template-syntax/12-use.md
+++ b/documentation/docs/03-template-syntax/12-use.md
@@ -45,7 +45,7 @@ The action is only called once (but not during server-side rendering) — it wil
 
 ## Typing
 
-The `Action` interface receives three optional type arguments — a node type (which can be `Element`, if the action applies to everything), a parameter, and any custom event handlers created by the action.:
+The `Action` interface receives three optional type arguments — a node type (which can be `Element`, if the action applies to everything), a parameter, and any custom event handlers created by the action:
 
 ```svelte
 <!--- file: App.svelte --->

From 430c2bb129214aed17ca27db8bef5c9e9c897428 Mon Sep 17 00:00:00 2001
From: Tee Ming <chewteeming01@gmail.com>
Date: Mon, 28 Oct 2024 15:38:58 +0800
Subject: [PATCH 034/404] docs: use `$effect.pre` instead of `beforeUpdate`
 (#13955)

* Update 03-lifecycle-hooks.md

* Update documentation/docs/06-runtime/03-lifecycle-hooks.md

Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>

---------

Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
---
 documentation/docs/06-runtime/03-lifecycle-hooks.md | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/documentation/docs/06-runtime/03-lifecycle-hooks.md b/documentation/docs/06-runtime/03-lifecycle-hooks.md
index 56ce8e1cdd..c8699e1f6d 100644
--- a/documentation/docs/06-runtime/03-lifecycle-hooks.md
+++ b/documentation/docs/06-runtime/03-lifecycle-hooks.md
@@ -67,12 +67,13 @@ While there's no "after update" hook, you can use `tick` to ensure that the UI i
 
 ```svelte
 <script>
-	import { beforeUpdate, tick } from 'svelte';
+	import { tick } from 'svelte';
 
-	beforeUpdate(async () => {
+	$effect.pre(() => {
 		console.log('the component is about to update');
-		await tick();
-		console.log('the component just updated');
+		tick().then(
+				console.log('the component just updated');
+		);
 	});
 </script>
 ```

From e99e865291dd135df2d6f5f1836f3364afb10e5d Mon Sep 17 00:00:00 2001
From: Richard Smith <richardmcsmith@gmail.com>
Date: Mon, 28 Oct 2024 21:05:24 +0900
Subject: [PATCH 035/404] docs: update links to point to new site (#13986)

Update (some) of the links pointing to the old preview site as mentioned in #13982.

This updates all the links in documentation/ and packages/svelte/messages, but doesn't touch others present in packages/svelte/ or fix the original link in that issue.
---
 documentation/docs/03-template-syntax/01-basic-markup.md  | 2 +-
 .../docs/98-reference/.generated/client-errors.md         | 4 ++--
 .../docs/98-reference/.generated/client-warnings.md       | 2 +-
 packages/svelte/messages/client-errors/errors.md          | 4 ++--
 packages/svelte/messages/client-warnings/warnings.md      | 2 +-
 packages/svelte/src/internal/client/errors.js             | 8 ++++----
 6 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/documentation/docs/03-template-syntax/01-basic-markup.md b/documentation/docs/03-template-syntax/01-basic-markup.md
index 774ac6ca3e..b41dc187c3 100644
--- a/documentation/docs/03-template-syntax/01-basic-markup.md
+++ b/documentation/docs/03-template-syntax/01-basic-markup.md
@@ -109,7 +109,7 @@ Timing-wise, event attributes always fire after events from bindings (e.g. `onin
 
 When using `ontouchstart` and `ontouchmove` event attributes, the handlers are [passive](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners) for better performance. 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).
+In the very rare cases that you need to prevent these event defaults, you should use [`on`](svelte-events#on) instead (for example inside an action).
 
 ### Event delegation
 
diff --git a/documentation/docs/98-reference/.generated/client-errors.md b/documentation/docs/98-reference/.generated/client-errors.md
index d6bd276de7..9879b67b33 100644
--- a/documentation/docs/98-reference/.generated/client-errors.md
+++ b/documentation/docs/98-reference/.generated/client-errors.md
@@ -19,13 +19,13 @@ A component is attempting to bind to a non-bindable property `%key%` belonging t
 ### component_api_changed
 
 ```
-%parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+%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
 ```
 
 ### component_api_invalid_new
 
 ```
-Attempted 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+Attempted 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
 ```
 
 ### derived_references_self
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 2eabff6958..743a47b67a 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -16,7 +16,7 @@ Your `console.%method%` contained `$state` proxies. Consider using `$inspect(...
 
 When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.
 
-The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte-5-preview.vercel.app/docs/runes#$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte-5-preview.vercel.app/docs/runes#$state-snapshot) to take a snapshot of the current value.
+The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte.dev/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte.dev/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
 
 ### event_handler_invalid
 
diff --git a/packages/svelte/messages/client-errors/errors.md b/packages/svelte/messages/client-errors/errors.md
index 954214cb81..517b028fa2 100644
--- a/packages/svelte/messages/client-errors/errors.md
+++ b/packages/svelte/messages/client-errors/errors.md
@@ -12,11 +12,11 @@
 
 ## component_api_changed
 
-> %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+> %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
 
 ## component_api_invalid_new
 
-> Attempted 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+> Attempted 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
 
 ## derived_references_self
 
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index c6f1b0aae8..e9014207fd 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -10,7 +10,7 @@
 
 When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.
 
-The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte-5-preview.vercel.app/docs/runes#$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte-5-preview.vercel.app/docs/runes#$state-snapshot) to take a snapshot of the current value.
+The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte.dev/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte.dev/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
 
 ## event_handler_invalid
 
diff --git a/packages/svelte/src/internal/client/errors.js b/packages/svelte/src/internal/client/errors.js
index 2a8f0e8914..2d95c42365 100644
--- a/packages/svelte/src/internal/client/errors.js
+++ b/packages/svelte/src/internal/client/errors.js
@@ -57,7 +57,7 @@ export function bind_not_bindable(key, component, name) {
 }
 
 /**
- * %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5. See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+ * %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
  * @param {string} parent
  * @param {string} method
  * @param {string} component
@@ -65,7 +65,7 @@ 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-5-preview.vercel.app/docs/breaking-changes#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`);
 
 		error.name = 'Svelte error';
 		throw error;
@@ -76,14 +76,14 @@ export function component_api_changed(parent, method, component) {
 }
 
 /**
- * Attempted 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information
+ * Attempted 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
  * @param {string} component
  * @param {string} name
  * @returns {never}
  */
 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-5-preview.vercel.app/docs/breaking-changes#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`);
 
 		error.name = 'Svelte error';
 		throw error;

From 777d059b10ded7e0e4af0cfb837c9e00864b3ec2 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 28 Oct 2024 13:28:21 -0400
Subject: [PATCH 036/404] docs: update heading level in `02-getting-started.md`
 (#13997)

---
 documentation/docs/01-introduction/02-getting-started.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/01-introduction/02-getting-started.md b/documentation/docs/01-introduction/02-getting-started.md
index 1abc05fc5e..37757d961f 100644
--- a/documentation/docs/01-introduction/02-getting-started.md
+++ b/documentation/docs/01-introduction/02-getting-started.md
@@ -13,7 +13,7 @@ npm run dev
 
 Don't worry if you don't know Svelte yet! You can ignore all the nice features SvelteKit brings on top for now and dive into it later.
 
-### Alternatives to SvelteKit
+## Alternatives to SvelteKit
 
 You can also use Svelte directly with Vite by running `npm create vite@latest` and selecting the `svelte` option. With this, `npm run build` will generate HTML, JS and CSS files inside the `dist` directory using [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte). In most cases, you will probably need to [choose a routing library](faq#Is-there-a-router) as well.
 

From 3876b302f3bbaedfae1fa20e334354e791f2dbc6 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 28 Oct 2024 22:03:59 +0000
Subject: [PATCH 037/404] fix: ensure effect_tracking correctly handles
 tracking reactions (#14005)

* fix: ensure effect_tracking correctly handles tracking reactions

* fix: ensure effect_tracking correctly handles tracking reactions
---
 .changeset/clean-badgers-battle.md            |  5 +++++
 .../src/internal/client/reactivity/effects.js |  7 +++++--
 .../samples/derived-unowned-10/_config.js     | 19 +++++++++++++++++++
 .../samples/derived-unowned-10/main.svelte    | 13 +++++++++++++
 .../derived-unowned-10/theme.svelte.js        | 18 ++++++++++++++++++
 5 files changed, 60 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/clean-badgers-battle.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-10/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-10/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-unowned-10/theme.svelte.js

diff --git a/.changeset/clean-badgers-battle.md b/.changeset/clean-badgers-battle.md
new file mode 100644
index 0000000000..be9b7de2cb
--- /dev/null
+++ b/.changeset/clean-badgers-battle.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure effect_tracking correctly handles tracking reactions
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 2050c142c5..82baeae288 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -15,7 +15,8 @@ import {
 	set_is_destroying_effect,
 	set_is_flushing_effect,
 	set_signal_status,
-	untrack
+	untrack,
+	skip_reaction
 } from '../runtime.js';
 import {
 	DIRTY,
@@ -167,7 +168,9 @@ export function effect_tracking() {
 		return false;
 	}
 
-	return (active_reaction.f & UNOWNED) === 0;
+	// If it's skipped, that's because we're inside an unowned
+	// that is not being tracked by another reaction
+	return !skip_reaction;
 }
 
 /**
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/_config.js
new file mode 100644
index 0000000000..7e057e94b2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/_config.js
@@ -0,0 +1,19 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, logs }) {
+		let btn1 = target.querySelector('button');
+
+		btn1?.click();
+		flushSync();
+
+		btn1?.click();
+		flushSync();
+
+		btn1?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['light', 'dark', 'light']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/main.svelte
new file mode 100644
index 0000000000..d35c706aec
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	import { store, themeState } from './theme.svelte.js';
+
+	let i = 0;
+
+	const increment = () => {
+		store.update(() => ({ theme: ++i % 2 == 0 ? 'dark' : 'light' }));
+	}
+</script>
+
+<button onclick={increment}>+</button>
+
+{themeState.value.theme}
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/theme.svelte.js b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/theme.svelte.js
new file mode 100644
index 0000000000..30c187cbe9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-unowned-10/theme.svelte.js
@@ -0,0 +1,18 @@
+import { fromStore, writable } from 'svelte/store';
+
+export const store = writable({ theme: 'dark' });
+
+class ThemeState {
+	#storeState = fromStore(store);
+	value = $derived(this.#storeState.current);
+
+	constructor() {
+		$effect.root(() => {
+			$effect(() => {
+				console.log(this.value.theme);
+			});
+		});
+	}
+}
+
+export const themeState = new ThemeState();

From b6fccdb4f7ccbfe5e1548646f09c68f28e96783c Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 28 Oct 2024 23:17:02 +0100
Subject: [PATCH 038/404] fix: properly migrate imports types prefixed with $
 (#14007)

---
 .changeset/wild-oranges-promise.md                    |  5 +++++
 .../phases/2-analyze/visitors/shared/utils.js         | 11 ++++++++++-
 packages/svelte/src/compiler/phases/scope.js          |  2 +-
 .../migrate/samples/import-type-$-prefix/input.svelte |  5 +++++
 .../samples/import-type-$-prefix/output.svelte        |  9 +++++++++
 5 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/wild-oranges-promise.md
 create mode 100644 packages/svelte/tests/migrate/samples/import-type-$-prefix/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/import-type-$-prefix/output.svelte

diff --git a/.changeset/wild-oranges-promise.md b/.changeset/wild-oranges-promise.md
new file mode 100644
index 0000000000..d79666c47e
--- /dev/null
+++ b/.changeset/wild-oranges-promise.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: properly migrate imports types prefixed with $
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
index 266016fcc8..82356ea619 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
@@ -220,7 +220,16 @@ export function validate_identifier_name(binding, function_depth) {
 
 		if (node.name === '$') {
 			e.dollar_binding_invalid(node);
-		} else if (node.name.startsWith('$')) {
+		} else if (
+			node.name.startsWith('$') &&
+			// import type { $Type } from "" - these are normally already filtered out,
+			// but for the migration they aren't, and throwing here is preventing the migration to complete
+			// TODO -> once migration script is gone we can remove this check
+			!(
+				binding.initial?.type === 'ImportDeclaration' &&
+				/** @type {any} */ (binding.initial).importKind === 'type'
+			)
+		) {
 			e.dollar_prefix_invalid(node);
 		}
 	}
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 7a8afa532a..0542a20708 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -348,7 +348,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 				is_reference(node, /** @type {Node} */ (parent)) &&
 				// TSTypeAnnotation, TSInterfaceDeclaration etc - these are normally already filtered out,
 				// but for the migration they aren't, so we need to filter them out here
-				// -> once migration script is gone we can remove this check
+				// TODO -> once migration script is gone we can remove this check
 				!parent.type.startsWith('TS')
 			) {
 				references.push([state.scope, { node, path: path.slice() }]);
diff --git a/packages/svelte/tests/migrate/samples/import-type-$-prefix/input.svelte b/packages/svelte/tests/migrate/samples/import-type-$-prefix/input.svelte
new file mode 100644
index 0000000000..25eb04f319
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/import-type-$-prefix/input.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	import type { $Test } from './types';
+  
+	export let data: $Test;
+  </script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/import-type-$-prefix/output.svelte b/packages/svelte/tests/migrate/samples/import-type-$-prefix/output.svelte
new file mode 100644
index 0000000000..bcd724d8ba
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/import-type-$-prefix/output.svelte
@@ -0,0 +1,9 @@
+<script lang="ts">
+	import type { $Test } from './types';
+  
+	interface Props {
+		data: $Test;
+	}
+
+	let { data }: Props = $props();
+  </script>
\ No newline at end of file

From c93a645b68659c5d1a6f2851b9f115285c146805 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Mon, 28 Oct 2024 15:59:39 -0700
Subject: [PATCH 039/404] docs: fix broken links (#13944)

---
 .changeset/soft-snails-retire.md    | 5 +++++
 packages/svelte/src/index-client.js | 4 ++--
 packages/svelte/types/index.d.ts    | 4 ++--
 3 files changed, 9 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/soft-snails-retire.md

diff --git a/.changeset/soft-snails-retire.md b/.changeset/soft-snails-retire.md
new file mode 100644
index 0000000000..2d8a7efb6a
--- /dev/null
+++ b/.changeset/soft-snails-retire.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: update broken links
diff --git a/packages/svelte/src/index-client.js b/packages/svelte/src/index-client.js
index 2916aaecb1..1b6175c948 100644
--- a/packages/svelte/src/index-client.js
+++ b/packages/svelte/src/index-client.js
@@ -14,7 +14,7 @@ import { lifecycle_outside_component } from './internal/shared/errors.js';
  *
  * If a function is returned _synchronously_ from `onMount`, it will be called when the component is unmounted.
  *
- * `onMount` does not run inside a [server-side component](https://svelte.dev/docs#run-time-server-side-component-api).
+ * `onMount` does not run inside [server-side components](https://svelte.dev/docs/svelte/svelte-server#render).
  *
  * @template T
  * @param {() => NotFunction<T> | Promise<NotFunction<T>> | (() => any)} fn
@@ -64,7 +64,7 @@ function create_custom_event(type, detail, { bubbles = false, cancelable = false
 }
 
 /**
- * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs#template-syntax-component-directives-on-eventname).
+ * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs/svelte/legacy-on#Component-events).
  * Event dispatchers are functions that can take two arguments: `name` and `detail`.
  *
  * Component events created with `createEventDispatcher` create a
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index c7794d5b0e..c07eeedb37 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -354,7 +354,7 @@ declare module 'svelte' {
 	 *
 	 * If a function is returned _synchronously_ from `onMount`, it will be called when the component is unmounted.
 	 *
-	 * `onMount` does not run inside a [server-side component](https://svelte.dev/docs#run-time-server-side-component-api).
+	 * `onMount` does not run inside [server-side components](https://svelte.dev/docs/svelte/svelte-server#render).
 	 *
 	 * */
 	export function onMount<T>(fn: () => NotFunction<T> | Promise<NotFunction<T>> | (() => any)): void;
@@ -367,7 +367,7 @@ declare module 'svelte' {
 	 * */
 	export function onDestroy(fn: () => any): void;
 	/**
-	 * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs#template-syntax-component-directives-on-eventname).
+	 * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs/svelte/legacy-on#Component-events).
 	 * Event dispatchers are functions that can take two arguments: `name` and `detail`.
 	 *
 	 * Component events created with `createEventDispatcher` create a

From 07219f1cbd3a0f1b3bfe85ad9f3c8c61324a02a7 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Mon, 28 Oct 2024 16:00:01 -0700
Subject: [PATCH 040/404] chore: update links that previously pointed to
 preview site (#14001)

---
 .changeset/tiny-boxes-exist.md                |  5 ++
 packages/svelte/src/ambient.d.ts              | 26 ++++-----
 .../3-transform/server/transform-server.js    |  2 +-
 packages/svelte/src/index-client.js           |  6 +--
 packages/svelte/src/index.d.ts                | 20 +++----
 .../svelte/src/internal/client/runtime.js     |  2 -
 packages/svelte/types/index.d.ts              | 54 +++++++++----------
 7 files changed, 58 insertions(+), 57 deletions(-)
 create mode 100644 .changeset/tiny-boxes-exist.md

diff --git a/.changeset/tiny-boxes-exist.md b/.changeset/tiny-boxes-exist.md
new file mode 100644
index 0000000000..67286571f2
--- /dev/null
+++ b/.changeset/tiny-boxes-exist.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: update links that previously pointed to preview site
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index 6af8ca5156..88879394ed 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -24,7 +24,7 @@ declare module '*.svelte' {
  * let count = $state(0);
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$state
+ * https://svelte.dev/docs/svelte/$state
  *
  * @param initial The initial value
  */
@@ -120,7 +120,7 @@ declare namespace $state {
 	 * </button>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$state-raw
+	 * https://svelte.dev/docs/svelte/$state#$state.raw
 	 *
 	 * @param initial The initial value
 	 */
@@ -141,7 +141,7 @@ declare namespace $state {
 	 * </script>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$state.snapshot
+	 * https://svelte.dev/docs/svelte/$state#$state.snapshot
 	 *
 	 * @param state The value to snapshot
 	 */
@@ -178,7 +178,7 @@ declare namespace $state {
  * let double = $derived(count * 2);
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$derived
+ * https://svelte.dev/docs/svelte/$derived
  *
  * @param expression The derived state expression
  */
@@ -200,7 +200,7 @@ declare namespace $derived {
 	 * });
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$derived-by
+	 * https://svelte.dev/docs/svelte/$derived#$derived.by
 	 */
 	export function by<T>(fn: () => T): T;
 
@@ -239,7 +239,7 @@ declare namespace $derived {
  *
  * Does not run during server side rendering.
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$effect
+ * https://svelte.dev/docs/svelte/$effect
  * @param fn The function to execute
  */
 declare function $effect(fn: () => void | (() => void)): void;
@@ -258,7 +258,7 @@ declare namespace $effect {
 	 *
 	 * Does not run during server side rendering.
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-pre
+	 * https://svelte.dev/docs/svelte/$effect#$effect.pre
 	 * @param fn The function to execute
 	 */
 	export function pre(fn: () => void | (() => void)): void;
@@ -281,7 +281,7 @@ declare namespace $effect {
 	 *
 	 * This allows you to (for example) add things like subscriptions without causing memory leaks, by putting them in child effects.
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-tracking
+	 * https://svelte.dev/docs/svelte/$effect#$effect.tracking
 	 */
 	export function tracking(): boolean;
 
@@ -309,7 +309,7 @@ declare namespace $effect {
 	 * <button onclick={() => cleanup()}>cleanup</button>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-root
+	 * https://svelte.dev/docs/svelte/$effect#$effect.root
 	 */
 	export function root(fn: () => void | (() => void)): () => void;
 
@@ -342,7 +342,7 @@ declare namespace $effect {
  * let { optionalProp = 42, requiredProp, bindableProp = $bindable() }: { optionalProp?: number; requiredProps: string; bindableProp: boolean } = $props();
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$props
+ * https://svelte.dev/docs/svelte/$props
  */
 declare function $props(): any;
 
@@ -353,7 +353,7 @@ declare function $props(): any;
  * let { propName = $bindable() }: { propName: boolean } = $props();
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$bindable
+ * https://svelte.dev/docs/svelte/$bindable
  */
 declare function $bindable<T>(fallback?: T): T;
 
@@ -373,7 +373,7 @@ declare function $bindable<T>(fallback?: T): T;
  * $inspect(x, y).with(() => { debugger; });
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$inspect
+ * https://svelte.dev/docs/svelte/$inspect
  */
 declare function $inspect<T extends any[]>(
 	...values: T
@@ -396,6 +396,6 @@ declare function $inspect<T extends any[]>(
  *
  * Only available inside custom element components, and only on the client-side.
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$host
+ * https://svelte.dev/docs/svelte/$host
  */
 declare function $host<El extends HTMLElement = HTMLElement>(): El;
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 5735e94ca4..c164aa4219 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
@@ -344,7 +344,7 @@ export function server_component(analysis, options) {
 						b.block([
 							b.throw_error(
 								`Component.render(...) is no longer valid in Svelte 5. ` +
-									'See https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more information'
+									'See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more information'
 							)
 						])
 					)
diff --git a/packages/svelte/src/index-client.js b/packages/svelte/src/index-client.js
index 1b6175c948..ff477595a1 100644
--- a/packages/svelte/src/index-client.js
+++ b/packages/svelte/src/index-client.js
@@ -82,7 +82,7 @@ function create_custom_event(type, detail, { bubbles = false, cancelable = false
  * }>();
  * ```
  *
- * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte-5-preview.vercel.app/docs/deprecations#createeventdispatcher
+ * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events
  * @template {Record<string, any>} [EventMap = any]
  * @returns {EventDispatcher<EventMap>}
  */
@@ -121,7 +121,7 @@ export function createEventDispatcher() {
  *
  * In runes mode use `$effect.pre` instead.
  *
- * @deprecated Use `$effect.pre` instead — see https://svelte-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
+ * @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/$effect#$effect.pre
  * @param {() => void} fn
  * @returns {void}
  */
@@ -144,7 +144,7 @@ export function beforeUpdate(fn) {
  *
  * In runes mode use `$effect` instead.
  *
- * @deprecated Use `$effect` instead — see https://svelte-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
+ * @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/$effect
  * @param {() => void} fn
  * @returns {void}
  */
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index 76ea112cd2..5130721cbe 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -5,7 +5,7 @@ import './ambient.js';
 /**
  * @deprecated In Svelte 4, components are classes. In Svelte 5, they are functions.
  * Use `mount` instead to instantiate components.
- * See [breaking changes](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes)
+ * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
  * for more info.
  */
 export interface ComponentConstructorOptions<
@@ -39,7 +39,7 @@ type Properties<Props, Slots> = Props &
  * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
  * are completely different under the hood. For typing, use `Component` instead.
  * To instantiate components, use `mount` instead`.
- * See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more info.
+ * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
  */
 export class SvelteComponent<
 	Props extends Record<string, any> = Record<string, any>,
@@ -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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more info.
+	 * 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+	 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+	 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+	 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+		 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+		 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
 		 * for more info.
 		 */
 		$set?(props: Partial<Props>): void;
@@ -171,7 +171,7 @@ export interface Component<
 }
 
 /**
- * @deprecated Use `Component` instead. See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more information.
+ * @deprecated Use `Component` instead. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
  */
 export class SvelteComponentTyped<
 	Props extends Record<string, any> = Record<string, any>,
@@ -278,7 +278,7 @@ declare const SnippetReturn: unique symbol;
  * ```
  * You can only call a snippet through the `{@render ...}` tag.
  *
- * https://svelte-5-preview.vercel.app/docs/snippets
+ * https://svelte.dev/docs/svelte/snippet
  *
  * @template Parameters the parameters that the snippet expects (if any) as a tuple.
  */
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 074c81588a..26c8d9adbb 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -832,8 +832,6 @@ export function invalidate_inner_signals(fn) {
 
 /**
  * Use `untrack` to prevent something from being treated as an `$effect`/`$derived` dependency.
- *
- * https://svelte-5-preview.vercel.app/docs/functions#untrack
  * @template T
  * @param {() => T} fn
  * @returns {T}
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index c07eeedb37..ebf17db6e2 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -2,7 +2,7 @@ declare module 'svelte' {
 	/**
 	 * @deprecated In Svelte 4, components are classes. In Svelte 5, they are functions.
 	 * Use `mount` instead to instantiate components.
-	 * See [breaking changes](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes)
+	 * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
 	 * for more info.
 	 */
 	export interface ComponentConstructorOptions<
@@ -36,7 +36,7 @@ declare module 'svelte' {
 	 * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
 	 * are completely different under the hood. For typing, use `Component` instead.
 	 * To instantiate components, use `mount` instead`.
-	 * See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more info.
+	 * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
 	 */
 	export class SvelteComponent<
 		Props extends Record<string, any> = Record<string, any>,
@@ -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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more info.
+		 * 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+		 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+		 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+		 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+			 * is a stop-gap solution. See 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-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
+			 * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
 			 * for more info.
 			 */
 			$set?(props: Partial<Props>): void;
@@ -168,7 +168,7 @@ declare module 'svelte' {
 	}
 
 	/**
-	 * @deprecated Use `Component` instead. See [breaking changes documentation](https://svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes) for more information.
+	 * @deprecated Use `Component` instead. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
 	 */
 	export class SvelteComponentTyped<
 		Props extends Record<string, any> = Record<string, any>,
@@ -275,7 +275,7 @@ declare module 'svelte' {
 	 * ```
 	 * You can only call a snippet through the `{@render ...}` tag.
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/snippets
+	 * https://svelte.dev/docs/svelte/snippet
 	 *
 	 * @template Parameters the parameters that the snippet expects (if any) as a tuple.
 	 */
@@ -385,7 +385,7 @@ declare module 'svelte' {
 	 * }>();
 	 * ```
 	 *
-	 * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte-5-preview.vercel.app/docs/deprecations#createeventdispatcher
+	 * @deprecated Use callback props and/or the `$host()` rune instead — see 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-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
+	 * @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/$effect#$effect.pre
 	 * */
 	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-5-preview.vercel.app/docs/deprecations#beforeupdate-and-afterupdate
+	 * @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/$effect
 	 * */
 	export function afterUpdate(fn: () => void): void;
 	/**
@@ -456,8 +456,6 @@ declare module 'svelte' {
 	export function tick(): Promise<void>;
 	/**
 	 * Use `untrack` to prevent something from being treated as an `$effect`/`$derived` dependency.
-	 *
-	 * https://svelte-5-preview.vercel.app/docs/functions#untrack
 	 * */
 	export function untrack<T>(fn: () => T): T;
 	/**
@@ -2322,7 +2320,7 @@ declare module 'svelte/types/compiler/interfaces' {
  * let count = $state(0);
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$state
+ * https://svelte.dev/docs/svelte/$state
  *
  * @param initial The initial value
  */
@@ -2418,7 +2416,7 @@ declare namespace $state {
 	 * </button>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$state-raw
+	 * https://svelte.dev/docs/svelte/$state#$state.raw
 	 *
 	 * @param initial The initial value
 	 */
@@ -2439,7 +2437,7 @@ declare namespace $state {
 	 * </script>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$state.snapshot
+	 * https://svelte.dev/docs/svelte/$state#$state.snapshot
 	 *
 	 * @param state The value to snapshot
 	 */
@@ -2476,7 +2474,7 @@ declare namespace $state {
  * let double = $derived(count * 2);
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$derived
+ * https://svelte.dev/docs/svelte/$derived
  *
  * @param expression The derived state expression
  */
@@ -2498,7 +2496,7 @@ declare namespace $derived {
 	 * });
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$derived-by
+	 * https://svelte.dev/docs/svelte/$derived#$derived.by
 	 */
 	export function by<T>(fn: () => T): T;
 
@@ -2537,7 +2535,7 @@ declare namespace $derived {
  *
  * Does not run during server side rendering.
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$effect
+ * https://svelte.dev/docs/svelte/$effect
  * @param fn The function to execute
  */
 declare function $effect(fn: () => void | (() => void)): void;
@@ -2556,7 +2554,7 @@ declare namespace $effect {
 	 *
 	 * Does not run during server side rendering.
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-pre
+	 * https://svelte.dev/docs/svelte/$effect#$effect.pre
 	 * @param fn The function to execute
 	 */
 	export function pre(fn: () => void | (() => void)): void;
@@ -2579,7 +2577,7 @@ declare namespace $effect {
 	 *
 	 * This allows you to (for example) add things like subscriptions without causing memory leaks, by putting them in child effects.
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-tracking
+	 * https://svelte.dev/docs/svelte/$effect#$effect.tracking
 	 */
 	export function tracking(): boolean;
 
@@ -2607,7 +2605,7 @@ declare namespace $effect {
 	 * <button onclick={() => cleanup()}>cleanup</button>
 	 * ```
 	 *
-	 * https://svelte-5-preview.vercel.app/docs/runes#$effect-root
+	 * https://svelte.dev/docs/svelte/$effect#$effect.root
 	 */
 	export function root(fn: () => void | (() => void)): () => void;
 
@@ -2640,7 +2638,7 @@ declare namespace $effect {
  * let { optionalProp = 42, requiredProp, bindableProp = $bindable() }: { optionalProp?: number; requiredProps: string; bindableProp: boolean } = $props();
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$props
+ * https://svelte.dev/docs/svelte/$props
  */
 declare function $props(): any;
 
@@ -2651,7 +2649,7 @@ declare function $props(): any;
  * let { propName = $bindable() }: { propName: boolean } = $props();
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$bindable
+ * https://svelte.dev/docs/svelte/$bindable
  */
 declare function $bindable<T>(fallback?: T): T;
 
@@ -2671,7 +2669,7 @@ declare function $bindable<T>(fallback?: T): T;
  * $inspect(x, y).with(() => { debugger; });
  * ```
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$inspect
+ * https://svelte.dev/docs/svelte/$inspect
  */
 declare function $inspect<T extends any[]>(
 	...values: T
@@ -2694,7 +2692,7 @@ declare function $inspect<T extends any[]>(
  *
  * Only available inside custom element components, and only on the client-side.
  *
- * https://svelte-5-preview.vercel.app/docs/runes#$host
+ * https://svelte.dev/docs/svelte/$host
  */
 declare function $host<El extends HTMLElement = HTMLElement>(): El;
 

From 444195202835651501f7317dda47154aa5d51ba0 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 28 Oct 2024 16:01:52 -0700
Subject: [PATCH 041/404] Version Packages (#13949)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/brave-fans-sneeze.md    |  5 -----
 .changeset/clean-badgers-battle.md |  5 -----
 .changeset/soft-snails-retire.md   |  5 -----
 .changeset/sweet-candles-poke.md   |  5 -----
 .changeset/tasty-frogs-boil.md     |  5 -----
 .changeset/tiny-boxes-exist.md     |  5 -----
 .changeset/wild-oranges-promise.md |  5 -----
 packages/svelte/CHANGELOG.md       | 18 ++++++++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 10 files changed, 20 insertions(+), 37 deletions(-)
 delete mode 100644 .changeset/brave-fans-sneeze.md
 delete mode 100644 .changeset/clean-badgers-battle.md
 delete mode 100644 .changeset/soft-snails-retire.md
 delete mode 100644 .changeset/sweet-candles-poke.md
 delete mode 100644 .changeset/tasty-frogs-boil.md
 delete mode 100644 .changeset/tiny-boxes-exist.md
 delete mode 100644 .changeset/wild-oranges-promise.md

diff --git a/.changeset/brave-fans-sneeze.md b/.changeset/brave-fans-sneeze.md
deleted file mode 100644
index c5fe894acb..0000000000
--- a/.changeset/brave-fans-sneeze.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: add empty stack to `CompileDiagnostic` to show error on build
diff --git a/.changeset/clean-badgers-battle.md b/.changeset/clean-badgers-battle.md
deleted file mode 100644
index be9b7de2cb..0000000000
--- a/.changeset/clean-badgers-battle.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure effect_tracking correctly handles tracking reactions
diff --git a/.changeset/soft-snails-retire.md b/.changeset/soft-snails-retire.md
deleted file mode 100644
index 2d8a7efb6a..0000000000
--- a/.changeset/soft-snails-retire.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-"svelte": patch
----
-
-fix: update broken links
diff --git a/.changeset/sweet-candles-poke.md b/.changeset/sweet-candles-poke.md
deleted file mode 100644
index 49ec305399..0000000000
--- a/.changeset/sweet-candles-poke.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: more exhaustive check during `SvelteMap.set` in deriveds
diff --git a/.changeset/tasty-frogs-boil.md b/.changeset/tasty-frogs-boil.md
deleted file mode 100644
index 26b33db998..0000000000
--- a/.changeset/tasty-frogs-boil.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: trim whitespace while migrating blocks
diff --git a/.changeset/tiny-boxes-exist.md b/.changeset/tiny-boxes-exist.md
deleted file mode 100644
index 67286571f2..0000000000
--- a/.changeset/tiny-boxes-exist.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-"svelte": patch
----
-
-fix: update links that previously pointed to preview site
diff --git a/.changeset/wild-oranges-promise.md b/.changeset/wild-oranges-promise.md
deleted file mode 100644
index d79666c47e..0000000000
--- a/.changeset/wild-oranges-promise.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: properly migrate imports types prefixed with $
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index ae56d2e619..8a98068bb1 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,23 @@
 # svelte
 
+## 5.1.4
+
+### Patch Changes
+
+- fix: add empty stack to `CompileDiagnostic` to show error on build ([#13942](https://github.com/sveltejs/svelte/pull/13942))
+
+- fix: ensure effect_tracking correctly handles tracking reactions ([#14005](https://github.com/sveltejs/svelte/pull/14005))
+
+- fix: update broken links ([#13944](https://github.com/sveltejs/svelte/pull/13944))
+
+- fix: more exhaustive check during `SvelteMap.set` in deriveds ([#13951](https://github.com/sveltejs/svelte/pull/13951))
+
+- fix: trim whitespace while migrating blocks ([#13941](https://github.com/sveltejs/svelte/pull/13941))
+
+- fix: update links that previously pointed to preview site ([#14001](https://github.com/sveltejs/svelte/pull/14001))
+
+- fix: properly migrate imports types prefixed with $ ([#14007](https://github.com/sveltejs/svelte/pull/14007))
+
 ## 5.1.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 73b3e253f3..4dd788fd91 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.1.3",
+  "version": "5.1.4",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1e37585b9d..6fcb1a28fc 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.1.3';
+export const VERSION = '5.1.4';
 export const PUBLIC_VERSION = '5';

From b3437e60205e624d43ce9383edd725d912cbbbd2 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 29 Oct 2024 23:27:56 +0100
Subject: [PATCH 042/404] docs: note old site (#13996)

---
 documentation/docs/99-legacy/00-legacy-overview.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/99-legacy/00-legacy-overview.md b/documentation/docs/99-legacy/00-legacy-overview.md
index 0840b2256e..638a77ec1a 100644
--- a/documentation/docs/99-legacy/00-legacy-overview.md
+++ b/documentation/docs/99-legacy/00-legacy-overview.md
@@ -10,3 +10,5 @@ The following pages document these features for
 - people using Svelte 5, but with components that haven't yet been migrated
 
 Since Svelte 3/4 syntax still works in Svelte 5, we will distinguish between _legacy mode_ and _runes mode_. Once a component is in runes mode (which you can opt into by using runes, or by explicitly setting the `runes: true` compiler option), legacy mode features are no longer available.
+
+If you're exclusively interested in the Svelte 3/4 syntax, you can browse its documentation at [v4.svelte.dev](https://v4.svelte.dev).

From 08bc37a374b452feb057fa7f0a869e0009e6cf54 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Wed, 30 Oct 2024 02:23:49 -0700
Subject: [PATCH 043/404] fix: don't access requestAnimationFrame eagerly
 (#14026)

---
 packages/svelte/src/internal/client/timing.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/packages/svelte/src/internal/client/timing.js b/packages/svelte/src/internal/client/timing.js
index dc7d2ce4ed..18dfc6c583 100644
--- a/packages/svelte/src/internal/client/timing.js
+++ b/packages/svelte/src/internal/client/timing.js
@@ -3,13 +3,11 @@ import { noop } from '../shared/utils.js';
 
 import { BROWSER } from 'esm-env';
 
-const request_animation_frame = BROWSER ? requestAnimationFrame : noop;
-
 const now = BROWSER ? () => performance.now() : () => Date.now();
 
 /** @type {Raf} */
 export const raf = {
-	tick: /** @param {any} _ */ (_) => request_animation_frame(_),
+	tick: /** @param {any} _ */ (_) => (BROWSER ? requestAnimationFrame : noop)(_),
 	now: () => now(),
 	tasks: new Set()
 };

From cbc2ca36ce6a5c1266daade8c1b042f79669a860 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:31:21 +0100
Subject: [PATCH 044/404] fix: allow to pass in TS preference to migration
 (#13929)

First half of https://github.com/sveltejs/kit/issues/12880 - the idea is for the migration script to check for a tsconfig.json and then set it to `true` if one is found
---
 .changeset/giant-wombats-allow.md                   |  5 +++++
 packages/svelte/src/compiler/migrate/index.js       | 13 ++++++++-----
 .../tests/migrate/samples/slot-use_ts/_config.js    |  5 +++++
 .../tests/migrate/samples/slot-use_ts/input.svelte  |  1 +
 .../tests/migrate/samples/slot-use_ts/output.svelte |  9 +++++++++
 packages/svelte/tests/migrate/test.ts               |  4 +++-
 packages/svelte/types/index.d.ts                    |  3 ++-
 7 files changed, 33 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/giant-wombats-allow.md
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte

diff --git a/.changeset/giant-wombats-allow.md b/.changeset/giant-wombats-allow.md
new file mode 100644
index 0000000000..e9d152a946
--- /dev/null
+++ b/.changeset/giant-wombats-allow.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow to pass in TS preference to migration
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 0bf3ac08b2..5630b8b34c 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -39,10 +39,10 @@ class MigrationError extends Error {
  * May throw an error if the code is too complex to migrate automatically.
  *
  * @param {string} source
- * @param {{filename?: string}} [options]
+ * @param {{ filename?: string, use_ts?: boolean }} [options]
  * @returns {{ code: string; }}
  */
-export function migrate(source, { filename } = {}) {
+export function migrate(source, { filename, use_ts } = {}) {
 	let og_source = source;
 	try {
 		has_migration_task = false;
@@ -115,9 +115,12 @@ export function migrate(source, { filename } = {}) {
 			derived_components: new Map(),
 			derived_labeled_statements: new Set(),
 			has_svelte_self: false,
-			uses_ts: !!parsed.instance?.attributes.some(
-				(attr) => attr.name === 'lang' && /** @type {any} */ (attr).value[0].data === 'ts'
-			)
+			uses_ts:
+				// Some people could use jsdoc but have a tsconfig.json, so double-check file for jsdoc indicators
+				(use_ts && !source.includes('@type {')) ||
+				!!parsed.instance?.attributes.some(
+					(attr) => attr.name === 'lang' && /** @type {any} */ (attr).value[0].data === 'ts'
+				)
 		};
 
 		if (parsed.module) {
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts/_config.js b/packages/svelte/tests/migrate/samples/slot-use_ts/_config.js
new file mode 100644
index 0000000000..dbc620d66e
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	use_ts: true
+});
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts/input.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts/input.svelte
new file mode 100644
index 0000000000..0385342cef
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts/input.svelte
@@ -0,0 +1 @@
+<slot />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte
new file mode 100644
index 0000000000..3e92f5ceb1
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte
@@ -0,0 +1,9 @@
+<script>
+	interface Props {
+		children?: import('svelte').Snippet;
+	}
+
+	let { children }: Props = $props();
+</script>
+
+{@render children?.()}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/test.ts b/packages/svelte/tests/migrate/test.ts
index 048c8696a4..a4b48f2fa7 100644
--- a/packages/svelte/tests/migrate/test.ts
+++ b/packages/svelte/tests/migrate/test.ts
@@ -6,6 +6,7 @@ import { suite, type BaseTest } from '../suite.js';
 
 interface ParserTest extends BaseTest {
 	skip_filename?: boolean;
+	use_ts?: boolean;
 	logs?: any[];
 	errors?: any[];
 }
@@ -32,7 +33,8 @@ const { test, run } = suite<ParserTest>(async (config, cwd) => {
 	}
 
 	const actual = migrate(input, {
-		filename: config.skip_filename ? undefined : `output.svelte`
+		filename: config.skip_filename ? undefined : `output.svelte`,
+		use_ts: config.use_ts
 	}).code;
 
 	if (config.logs) {
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index ebf17db6e2..b4da4c79b8 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1290,8 +1290,9 @@ declare module 'svelte/compiler' {
 	 * May throw an error if the code is too complex to migrate automatically.
 	 *
 	 * */
-	export function migrate(source: string, { filename }?: {
+	export function migrate(source: string, { filename, use_ts }?: {
 		filename?: string;
+		use_ts?: boolean;
 	} | undefined): {
 		code: string;
 	};

From 2e9dab6a2130bb091f56e1c75d51f3176fcaa7d2 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:31:59 +0100
Subject: [PATCH 045/404] fix: more robust re-subscribe detection for
 `fromStore` (#13995)

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.
---
 .changeset/eighty-pianos-sip.md           |  5 +++++
 packages/svelte/src/store/index-client.js |  7 ++++--
 packages/svelte/tests/store/test.ts       | 27 +++++++++++++++++++++++
 3 files changed, 37 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/eighty-pianos-sip.md

diff --git a/.changeset/eighty-pianos-sip.md b/.changeset/eighty-pianos-sip.md
new file mode 100644
index 0000000000..330fa54f6d
--- /dev/null
+++ b/.changeset/eighty-pianos-sip.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: more robust re-subscribe detection for `fromStore`
diff --git a/packages/svelte/src/store/index-client.js b/packages/svelte/src/store/index-client.js
index b612124e3c..98f6cf5ac1 100644
--- a/packages/svelte/src/store/index-client.js
+++ b/packages/svelte/src/store/index-client.js
@@ -130,9 +130,12 @@ export function fromStore(store) {
 				subscribers += 1;
 
 				return () => {
-					subscribers -= 1;
-
 					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();
 						}
diff --git a/packages/svelte/tests/store/test.ts b/packages/svelte/tests/store/test.ts
index 74ad892577..b23ea195d6 100644
--- a/packages/svelte/tests/store/test.ts
+++ b/packages/svelte/tests/store/test.ts
@@ -666,6 +666,33 @@ describe('fromStore', () => {
 		teardown();
 	});
 
+	it('creates state from a writable store that updates after timeout', async () => {
+		const wait = () => new Promise((resolve) => setTimeout(resolve, 100));
+		const store = {
+			subscribe: (cb: any) => {
+				// new object each time to force updates of underlying signals,
+				// to test the whole thing doesn't rerun more often than it should
+				setTimeout(() => cb({}), 0);
+				return () => {};
+			}
+		};
+
+		const count = fromStore(store);
+		const log: any[] = [];
+
+		const teardown = effect_root(() => {
+			render_effect(() => {
+				log.push(count.current);
+			});
+		});
+
+		await wait();
+
+		assert.deepEqual(log, [undefined, {}]);
+
+		teardown();
+	});
+
 	it('creates state from a readable store', () => {
 		const store = readable(0);
 

From e487f61262c2a72760454c7bd6795291171b39df Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:33:32 +0100
Subject: [PATCH 046/404] docs: mark deprecated options as such (#13989)

closes #13984
---
 .../docs/05-special-elements/06-svelte-options.md | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/documentation/docs/05-special-elements/06-svelte-options.md b/documentation/docs/05-special-elements/06-svelte-options.md
index 595b1c54e8..d29042e278 100644
--- a/documentation/docs/05-special-elements/06-svelte-options.md
+++ b/documentation/docs/05-special-elements/06-svelte-options.md
@@ -8,14 +8,19 @@ title: <svelte:options>
 
 The `<svelte:options>` element provides a place to specify per-component compiler options, which are detailed in the [compiler section](svelte-compiler#compile). The possible options are:
 
-- `immutable={true}` — you never use mutable data, so the compiler can do simple referential equality checks to determine if values have changed
-- `immutable={false}` — the default. Svelte will be more conservative about whether or not mutable objects have changed
-- `accessors={true}` — adds getters and setters for the component's props
-- `accessors={false}` — the default
 - `runes={true}` — forces a component into _runes mode_ (see the [Legacy APIs](legacy-overview) section)
 - `runes={false}` — forces a component into _legacy mode_
-- `namespace="..."` — the namespace where this component will be used, most commonly "svg"; use the "foreign" namespace to opt out of case-insensitive attribute names and HTML-specific warnings
+- `namespace="..."` — the namespace where this component will be used, can be "html" (the default), "svg" or "mathml"
 - `customElement={...}` — the [options](custom-elements#Component-options) to use when compiling this component as a custom element. If a string is passed, it is used as the `tag` option
+- `css="injected"` — the component will inject its styles inline: During server side rendering, it's injected as a `<style>` tag in the `head`, during client side rendering, it's loaded via JavaScript
+
+> [!LEGACY] Deprecated options
+> Svelte 4 also included the following options. They are deprecated in Svelte 5 and non-functional in runes mode.
+>
+> - `immutable={true}` — you never use mutable data, so the compiler can do simple referential equality checks to determine if values have changed
+> - `immutable={false}` — the default. Svelte will be more conservative about whether or not mutable objects have changed
+> - `accessors={true}` — adds getters and setters for the component's props
+> - `accessors={false}` — the default
 
 ```svelte
 <svelte:options customElement="my-custom-element" />

From 010620498287a580acee26ccb0b1fb635a67c450 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:47:21 +0100
Subject: [PATCH 047/404] fix: minify inject CSS in prod mode (#14006)

When CSS is externalized we rightfully rely on the following tooling chain to properly minify CSS. When we inject the CSS however, that tooling won't be able to do that, so we gotta do it ourselves.
This PR brings back most of that logic that existed in Svelte 4. Fixes #13716
---
 .changeset/red-berries-watch.md               |  5 +
 .../compiler/phases/3-transform/css/index.js  | 93 +++++++++++++++----
 .../css-injected-options-nested/Nested.svelte |  5 +
 .../_expected.html                            |  2 +-
 .../_expected_head.html                       |  6 +-
 .../css-injected-options/_expected_head.html  |  6 +-
 .../samples/css/_expected_head.html           |  6 +-
 7 files changed, 90 insertions(+), 33 deletions(-)
 create mode 100644 .changeset/red-berries-watch.md

diff --git a/.changeset/red-berries-watch.md b/.changeset/red-berries-watch.md
new file mode 100644
index 0000000000..92460c9cd0
--- /dev/null
+++ b/.changeset/red-berries-watch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: minify inject CSS in prod mode
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 decdb21ad7..6f87b04850 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -11,6 +11,7 @@ import { dev } from '../../../state.js';
  * @typedef {{
  *   code: MagicString;
  *   hash: string;
+ *   minify: boolean;
  *   selector: string;
  *   keyframes: string[];
  *   specificity: {
@@ -32,6 +33,7 @@ export function render_stylesheet(source, analysis, options) {
 	const state = {
 		code,
 		hash: analysis.css.hash,
+		minify: analysis.inject_styles && !options.dev,
 		selector: `.${analysis.css.hash}`,
 		keyframes: analysis.css.keyframes,
 		specificity: {
@@ -45,6 +47,9 @@ export function render_stylesheet(source, analysis, options) {
 
 	code.remove(0, ast.content.start);
 	code.remove(/** @type {number} */ (ast.content.end), source.length);
+	if (state.minify) {
+		remove_preceeding_whitespace(ast.content.end, state);
+	}
 
 	const css = {
 		code: code.toString(),
@@ -116,22 +121,47 @@ const visitors = {
 
 				index++;
 			}
+		} else if (state.minify) {
+			remove_preceeding_whitespace(node.start, state);
+
+			// Don't minify whitespace in custom properties, since some browsers (Chromium < 99)
+			// treat --foo: ; and --foo:; differently
+			if (!node.property.startsWith('--')) {
+				let start = node.start + node.property.length + 1;
+				let end = start;
+				while (/\s/.test(state.code.original[end])) end++;
+				if (end > start) state.code.remove(start, end);
+			}
 		}
 	},
 	Rule(node, { state, next, visit }) {
+		if (state.minify) {
+			remove_preceeding_whitespace(node.start, state);
+			remove_preceeding_whitespace(node.block.end - 1, state);
+		}
+
 		// keep empty rules in dev, because it's convenient to
 		// see them in devtools
 		if (!dev && is_empty(node)) {
-			state.code.prependRight(node.start, '/* (empty) ');
-			state.code.appendLeft(node.end, '*/');
-			escape_comment_close(node, state.code);
+			if (state.minify) {
+				state.code.remove(node.start, node.end);
+			} else {
+				state.code.prependRight(node.start, '/* (empty) ');
+				state.code.appendLeft(node.end, '*/');
+				escape_comment_close(node, state.code);
+			}
+
 			return;
 		}
 
 		if (!is_used(node)) {
-			state.code.prependRight(node.start, '/* (unused) ');
-			state.code.appendLeft(node.end, '*/');
-			escape_comment_close(node, state.code);
+			if (state.minify) {
+				state.code.remove(node.start, node.end);
+			} else {
+				state.code.prependRight(node.start, '/* (unused) ');
+				state.code.appendLeft(node.end, '*/');
+				escape_comment_close(node, state.code);
+			}
 
 			return;
 		}
@@ -141,11 +171,16 @@ const visitors = {
 
 			if (selector.children.length === 1 && selector.children[0].selectors.length === 1) {
 				// `:global {...}`
-				state.code.prependRight(node.start, '/* ');
-				state.code.appendLeft(node.block.start + 1, '*/');
+				if (state.minify) {
+					state.code.remove(node.start, node.block.start + 1);
+					state.code.remove(node.block.end - 1, node.end);
+				} else {
+					state.code.prependRight(node.start, '/* ');
+					state.code.appendLeft(node.block.start + 1, '*/');
 
-				state.code.prependRight(node.block.end - 1, '/*');
-				state.code.appendLeft(node.block.end, '*/');
+					state.code.prependRight(node.block.end - 1, '/*');
+					state.code.appendLeft(node.block.end, '*/');
+				}
 
 				// don't recurse into selector or body
 				return;
@@ -162,7 +197,8 @@ const visitors = {
 		// 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)) {
 			let pruning = false;
-			let last = node.children[0].start;
+			let prune_start = node.children[0].start;
+			let last = prune_start;
 
 			for (let i = 0; i < node.children.length; i += 1) {
 				const selector = node.children[i];
@@ -172,12 +208,20 @@ const visitors = {
 						let i = selector.start;
 						while (state.code.original[i] !== ',') i--;
 
-						state.code.overwrite(i, i + 1, '*/');
-					} else {
-						if (i === 0) {
-							state.code.prependRight(selector.start, '/* (unused) ');
+						if (state.minify) {
+							state.code.remove(prune_start, i + 1);
 						} else {
-							state.code.overwrite(last, selector.start, ' /* (unused) ');
+							state.code.overwrite(i, i + 1, '*/');
+						}
+					} else {
+						prune_start = selector.start;
+
+						if (!state.minify) {
+							if (i === 0) {
+								state.code.prependRight(selector.start, '/* (unused) ');
+							} else {
+								state.code.overwrite(last, selector.start, ' /* (unused) ');
+							}
 						}
 					}
 
@@ -188,7 +232,11 @@ const visitors = {
 			}
 
 			if (pruning) {
-				state.code.appendLeft(last, '*/');
+				if (state.minify) {
+					state.code.remove(prune_start, last);
+				} else {
+					state.code.appendLeft(last, '*/');
+				}
 			}
 		}
 
@@ -320,6 +368,17 @@ const visitors = {
 	}
 };
 
+/**
+ * Walk backwards until we find a non-whitespace character
+ * @param {number} end
+ * @param {State} state
+ */
+function remove_preceeding_whitespace(end, state) {
+	let start = end;
+	while (/\s/.test(state.code.original[start - 1])) start--;
+	if (start < end) state.code.remove(start, end);
+}
+
 /** @param {Css.Rule} rule */
 function is_empty(rule) {
 	if (rule.metadata.is_global_block) {
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
index 81243bf114..7b6038eef3 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
@@ -6,4 +6,9 @@
 	.bar {
 		color: red;
 	}
+	.unused {
+		.also-unused {
+			color: green;
+		}
+	}
 </style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
index 1f0b2b95fe..3069a50ad7 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
@@ -1 +1 @@
-<!--[--><div class="bar svelte-ievf05">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
+<!--[--><div class="bar svelte-1fs6vx">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
index 806f6c2db2..6474fde317 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
@@ -1,5 +1 @@
-<style id="svelte-ievf05">
-	.bar.svelte-ievf05 {
-		color: red;
-	}
-</style>
\ No newline at end of file
+<style id="svelte-1fs6vx">.bar.svelte-1fs6vx {color:red;}</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options/_expected_head.html
index 7281935646..9c4f8a8538 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options/_expected_head.html
@@ -1,5 +1 @@
-<style id="svelte-sg04hs">
-	.foo.svelte-sg04hs {
-		color: red;
-	}
-</style>
\ No newline at end of file
+<style id="svelte-sg04hs">.foo.svelte-sg04hs {color:red;}</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css/_expected_head.html
index 7281935646..9c4f8a8538 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css/_expected_head.html
@@ -1,5 +1 @@
-<style id="svelte-sg04hs">
-	.foo.svelte-sg04hs {
-		color: red;
-	}
-</style>
\ No newline at end of file
+<style id="svelte-sg04hs">.foo.svelte-sg04hs {color:red;}</style>
\ No newline at end of file

From 435a9c1cd033dc4a31af9ba007eb7f5b6e24c488 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 11:02:18 +0000
Subject: [PATCH 048/404] fix: ensure toStore subscription correctly syncs
 latest value (#14015)

* fix: ensure toStore subscription correctly syncs latest value

* Update packages/svelte/src/store/index-client.js

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/shaggy-frogs-fetch.md                   |  5 +++++
 packages/svelte/src/store/index-client.js          |  7 +++++--
 .../samples/toStore-subscribe/_config.js           |  6 ++++++
 .../samples/toStore-subscribe/main.svelte          | 14 ++++++++++++++
 4 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/shaggy-frogs-fetch.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/toStore-subscribe/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/toStore-subscribe/main.svelte

diff --git a/.changeset/shaggy-frogs-fetch.md b/.changeset/shaggy-frogs-fetch.md
new file mode 100644
index 0000000000..7dc7b8b920
--- /dev/null
+++ b/.changeset/shaggy-frogs-fetch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure toStore subscription correctly syncs latest value
diff --git a/packages/svelte/src/store/index-client.js b/packages/svelte/src/store/index-client.js
index 98f6cf5ac1..f2f1dfc4eb 100644
--- a/packages/svelte/src/store/index-client.js
+++ b/packages/svelte/src/store/index-client.js
@@ -42,8 +42,11 @@ export { derived, get, readable, readonly, writable } from './shared/index.js';
  * @returns {Writable<V> | Readable<V>}
  */
 export function toStore(get, set) {
-	const store = writable(get(), (set) => {
-		let ran = false;
+	let init_value = get();
+	const store = writable(init_value, (set) => {
+		// If the value has changed before we call subscribe, then
+		// we need to treat the value as already having run
+		let ran = init_value !== get();
 
 		// TODO do we need a different implementation on the server?
 		const teardown = effect_root(() => {
diff --git a/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/_config.js b/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/_config.js
new file mode 100644
index 0000000000..471fed7e09
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/_config.js
@@ -0,0 +1,6 @@
+import { test } from '../../test';
+
+export default test({
+	html: `1`,
+	mode: ['client', 'hydrate']
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/main.svelte b/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/main.svelte
new file mode 100644
index 0000000000..61e0cbe5b6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/toStore-subscribe/main.svelte
@@ -0,0 +1,14 @@
+<script>
+	import { toStore } from 'svelte/store';
+
+	let count = $state(0);
+
+	const store = toStore(
+		() => count,
+		(v) => (count = v)
+	);
+
+	store.set(1);
+</script>
+
+{$store}

From f52a30347f2dc91f23127a6d2271e4f66931bada Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 12:09:47 +0100
Subject: [PATCH 049/404] fix: ensure comma is also pruned if necessary
 (#14032)

immediately after merging #14006 I noticed there's a bug when pruning one selector in a list of several; this fixes it

no changeset because not released yet
---
 .../compiler/phases/3-transform/css/index.js  | 12 ++++++----
 .../css-injected-options-minify/_config.js    |  8 +++++++
 .../_expected.html                            |  1 +
 .../_expected_head.html                       |  1 +
 .../css-injected-options-minify/main.svelte   | 23 +++++++++++++++++++
 .../css-injected-options-nested/Nested.svelte |  5 ----
 .../_expected.html                            |  2 +-
 .../_expected_head.html                       |  2 +-
 8 files changed, 43 insertions(+), 11 deletions(-)
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
 create mode 100644 packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte

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 6f87b04850..5b40867aab 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -214,11 +214,15 @@ const visitors = {
 							state.code.overwrite(i, i + 1, '*/');
 						}
 					} else {
-						prune_start = selector.start;
-
-						if (!state.minify) {
-							if (i === 0) {
+						if (i === 0) {
+							if (state.minify) {
+								prune_start = selector.start;
+							} else {
 								state.code.prependRight(selector.start, '/* (unused) ');
+							}
+						} else {
+							if (state.minify) {
+								prune_start = last;
 							} else {
 								state.code.overwrite(last, selector.start, ' /* (unused) ');
 							}
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
new file mode 100644
index 0000000000..e1a14af601
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	// test checks that minification works correctly
+	compileOptions: {
+		css: 'external'
+	}
+});
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
new file mode 100644
index 0000000000..caa872be9b
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
@@ -0,0 +1 @@
+<!--[--><div class="foo svelte-mnmfn6">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
new file mode 100644
index 0000000000..8d6e42d979
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
@@ -0,0 +1 @@
+<style id="svelte-mnmfn6">.foo.svelte-mnmfn6 {color:green;}.foo.svelte-mnmfn6 {color:green;}</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
new file mode 100644
index 0000000000..13e01788e2
--- /dev/null
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
@@ -0,0 +1,23 @@
+<svelte:options css="injected" />
+
+<div class="foo">foo</div>
+
+<style>
+	.foo {
+		color: green;
+	}
+	.unused {
+		color: red;
+	}
+	.unused {
+		.nested-unused {
+			color: red;
+		}
+	}
+	.unused:has(.unused) {
+		color: red;
+	}
+	.foo, .unused {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
index 7b6038eef3..81243bf114 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/Nested.svelte
@@ -6,9 +6,4 @@
 	.bar {
 		color: red;
 	}
-	.unused {
-		.also-unused {
-			color: green;
-		}
-	}
 </style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
index 3069a50ad7..1f0b2b95fe 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected.html
@@ -1 +1 @@
-<!--[--><div class="bar svelte-1fs6vx">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
+<!--[--><div class="bar svelte-ievf05">bar</div><!----> <div class="foo svelte-sg04hs">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
index 6474fde317..6d795670ff 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-nested/_expected_head.html
@@ -1 +1 @@
-<style id="svelte-1fs6vx">.bar.svelte-1fs6vx {color:red;}</style>
\ No newline at end of file
+<style id="svelte-ievf05">.bar.svelte-ievf05 {color:red;}</style>
\ No newline at end of file

From 1434f48f7c53897905a1758b9318450c6b356522 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 15:33:15 +0100
Subject: [PATCH 050/404] fix: make compiler error extend from `Error` (#14036)

We originally didn't extend from `Error` anymore because its fields are of no real value to us, and has problems with serialization in a worker context.

Turns out this was a mistake, because various build tools rely on errors being thrown as something that extends Error, else they try to wrap it in their own error.

We therefore revert that change while still trying to preserve most of the advantages of not extending `Error`, namely nuking the useless stack trace and making sure the message is enumerable.
---
 .changeset/wet-timers-shop.md                 |  5 ++++
 .../templates/compile-errors.js               | 23 ++++++++++++++++---
 packages/svelte/src/compiler/errors.js        | 22 +++++++++++++++---
 .../src/compiler/utils/compile_diagnostic.js  |  2 --
 .../impossible-migrate-with-errors/_config.js |  2 --
 packages/svelte/tests/migrate/test.ts         |  2 +-
 6 files changed, 45 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/wet-timers-shop.md

diff --git a/.changeset/wet-timers-shop.md b/.changeset/wet-timers-shop.md
new file mode 100644
index 0000000000..55d12496e0
--- /dev/null
+++ b/.changeset/wet-timers-shop.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: make compiler error extend from `Error`
diff --git a/packages/svelte/scripts/process-messages/templates/compile-errors.js b/packages/svelte/scripts/process-messages/templates/compile-errors.js
index a407699e1b..0dc30b2c01 100644
--- a/packages/svelte/scripts/process-messages/templates/compile-errors.js
+++ b/packages/svelte/scripts/process-messages/templates/compile-errors.js
@@ -2,8 +2,9 @@ import { CompileDiagnostic } from './utils/compile_diagnostic.js';
 
 /** @typedef {{ start?: number, end?: number }} NodeLike */
 
-class InternalCompileError extends CompileDiagnostic {
-	name = 'CompileError';
+class InternalCompileError extends Error {
+	message = ''; // ensure this property is enumerable
+	#diagnostic;
 
 	/**
 	 * @param {string} code
@@ -11,7 +12,23 @@ class InternalCompileError extends CompileDiagnostic {
 	 * @param {[number, number] | undefined} position
 	 */
 	constructor(code, message, position) {
-		super(code, message, position);
+		super(message);
+		this.stack = ''; // avoid unnecessary noise; don't set it as a class property or it becomes enumerable
+
+		// We want to extend from Error so that various bundler plugins properly handle it.
+		// But we also want to share the same object shape with that of warnings, therefore
+		// we create an instance of the shared class an copy over its properties.
+		this.#diagnostic = new CompileDiagnostic(code, message, position);
+		Object.assign(this, this.#diagnostic);
+		this.name = 'CompileError';
+	}
+
+	toString() {
+		return this.#diagnostic.toString();
+	}
+
+	toJSON() {
+		return this.#diagnostic.toJSON();
 	}
 }
 
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 299154c988..8f1dae98b1 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -3,8 +3,9 @@
 import { CompileDiagnostic } from './utils/compile_diagnostic.js';
 
 /** @typedef {{ start?: number, end?: number }} NodeLike */
-class InternalCompileError extends CompileDiagnostic {
-	name = 'CompileError';
+class InternalCompileError extends Error {
+	message = ''; // ensure this property is enumerable
+	#diagnostic;
 
 	/**
 	 * @param {string} code
@@ -12,7 +13,22 @@ class InternalCompileError extends CompileDiagnostic {
 	 * @param {[number, number] | undefined} position
 	 */
 	constructor(code, message, position) {
-		super(code, message, position);
+		super(message);
+		this.stack = ''; // avoid unnecessary noise; don't set it as a class property or it becomes enumerable
+		// We want to extend from Error so that various bundler plugins properly handle it.
+		// But we also want to share the same object shape with that of warnings, therefore
+		// we create an instance of the shared class an copy over its properties.
+		this.#diagnostic = new CompileDiagnostic(code, message, position);
+		Object.assign(this, this.#diagnostic);
+		this.name = 'CompileError';
+	}
+
+	toString() {
+		return this.#diagnostic.toString();
+	}
+
+	toJSON() {
+		return this.#diagnostic.toJSON();
 	}
 }
 
diff --git a/packages/svelte/src/compiler/utils/compile_diagnostic.js b/packages/svelte/src/compiler/utils/compile_diagnostic.js
index 374a20b8b5..db938cf2bd 100644
--- a/packages/svelte/src/compiler/utils/compile_diagnostic.js
+++ b/packages/svelte/src/compiler/utils/compile_diagnostic.js
@@ -51,8 +51,6 @@ function get_code_frame(source, line, column) {
 /** @implements {ICompileDiagnostic} */
 export class CompileDiagnostic {
 	name = 'CompileDiagnostic';
-	// adding an empty stack so that vite will show the file and frame during build
-	stack = '';
 
 	/**
 	 * @param {string} code
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 57496dcba7..9e4b7222af 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
@@ -19,8 +19,6 @@ export default test({
 3: unterminated template
                         ^`,
 			message: 'Unexpected end of input',
-			name: 'CompileError',
-			stack: '',
 			position: [30, 30],
 			start: {
 				character: 30,
diff --git a/packages/svelte/tests/migrate/test.ts b/packages/svelte/tests/migrate/test.ts
index a4b48f2fa7..a74bc80488 100644
--- a/packages/svelte/tests/migrate/test.ts
+++ b/packages/svelte/tests/migrate/test.ts
@@ -28,7 +28,7 @@ const { test, run } = suite<ParserTest>(async (config, cwd) => {
 
 	if (config.errors) {
 		console.error = (...args) => {
-			errors.push(...args);
+			errors.push(...args.map((arg) => arg.toJSON?.() ?? arg));
 		};
 	}
 

From 8a2c97a7b87cc6bfe15c6f16d2c960895b13e955 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 16:33:43 +0100
Subject: [PATCH 051/404] fix: extend derived/state validation error to
 indirect exports (#14039)

Closes #14029
---
 .changeset/perfect-queens-reflect.md             |  5 +++++
 .../2-analyze/visitors/ExportNamedDeclaration.js | 16 ++++++++++++++++
 .../export-derived-state-indirect/_config.js     | 10 ++++++++++
 .../export-derived-state-indirect/main.svelte.js |  5 +++++
 .../samples/export-state-indirect/_config.js     | 10 ++++++++++
 .../samples/export-state-indirect/main.svelte.js | 15 +++++++++++++++
 6 files changed, 61 insertions(+)
 create mode 100644 .changeset/perfect-queens-reflect.md
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/main.svelte.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-state-indirect/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-state-indirect/main.svelte.js

diff --git a/.changeset/perfect-queens-reflect.md b/.changeset/perfect-queens-reflect.md
new file mode 100644
index 0000000000..32c54f94f1
--- /dev/null
+++ b/.changeset/perfect-queens-reflect.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: extend derived/state validation error to indirect exports
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
index 547f6ab9c7..a9e8a05c96 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
@@ -57,5 +57,21 @@ export function ExportNamedDeclaration(node, context) {
 				}
 			}
 		}
+
+		if (!context.state.ast_type /* .svelte.js module */ || context.state.ast_type === 'module') {
+			for (const specified of node.specifiers) {
+				const binding = context.state.scope.get(specified.local.name);
+
+				if (!binding) continue;
+
+				if (binding.kind === 'derived') {
+					e.derived_invalid_export(node);
+				}
+
+				if ((binding.kind === 'state' || binding.kind === 'raw_state') && binding.reassigned) {
+					e.state_invalid_export(node);
+				}
+			}
+		}
 	}
 }
diff --git a/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/_config.js b/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/_config.js
new file mode 100644
index 0000000000..ec63999d1d
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/_config.js
@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'derived_invalid_export',
+		message:
+			'Cannot export derived state from a module. To expose the current derived value, export a function returning its value',
+		position: [70, 76]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/main.svelte.js b/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/main.svelte.js
new file mode 100644
index 0000000000..4a63d9481d
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-derived-state-indirect/main.svelte.js
@@ -0,0 +1,5 @@
+let count = $state(0);
+
+const double = $derived(count * 2);
+
+export { double };
diff --git a/packages/svelte/tests/compiler-errors/samples/export-state-indirect/_config.js b/packages/svelte/tests/compiler-errors/samples/export-state-indirect/_config.js
new file mode 100644
index 0000000000..025928ebd5
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-state-indirect/_config.js
@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'state_invalid_export',
+		message:
+			"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",
+		position: [211, 220]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/export-state-indirect/main.svelte.js b/packages/svelte/tests/compiler-errors/samples/export-state-indirect/main.svelte.js
new file mode 100644
index 0000000000..c26536c1c1
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-state-indirect/main.svelte.js
@@ -0,0 +1,15 @@
+const object = $state({
+	ok: true
+});
+
+let primitive = $state('nope');
+
+export function update_object() {
+	object.ok = !object.ok;
+}
+
+export function update_primitive() {
+	primitive = 'yep';
+}
+
+export { object, primitive };

From 217e40998a9ce56f3dc926fb4e985b4547564f40 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Wed, 30 Oct 2024 08:35:26 -0700
Subject: [PATCH 052/404] chore: add changeset and comment (#14040)

for #14026
---
 .changeset/small-bobcats-add.md               | 5 +++++
 packages/svelte/src/internal/client/timing.js | 3 +++
 2 files changed, 8 insertions(+)
 create mode 100644 .changeset/small-bobcats-add.md

diff --git a/.changeset/small-bobcats-add.md b/.changeset/small-bobcats-add.md
new file mode 100644
index 0000000000..2bd686c9c1
--- /dev/null
+++ b/.changeset/small-bobcats-add.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't access `requestAnimationFrame` until needed to reduce need for mocks during testing
diff --git a/packages/svelte/src/internal/client/timing.js b/packages/svelte/src/internal/client/timing.js
index 18dfc6c583..1702798952 100644
--- a/packages/svelte/src/internal/client/timing.js
+++ b/packages/svelte/src/internal/client/timing.js
@@ -7,6 +7,9 @@ const now = BROWSER ? () => performance.now() : () => Date.now();
 
 /** @type {Raf} */
 export const raf = {
+	// don't access requestAnimationFrame eagerly outside method
+	// this allows basic testing of user code without JSDOM
+	// bunder will eval and remove ternary when the user's app is built
 	tick: /** @param {any} _ */ (_) => (BROWSER ? requestAnimationFrame : noop)(_),
 	now: () => now(),
 	tasks: new Set()

From 6ad824046408f1bda1137d0776cbfeda24d5117a Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Wed, 30 Oct 2024 11:37:18 -0400
Subject: [PATCH 053/404] docs: fix various typos in reference docs (#14011)

* docs: fix note about $derived

* fix some other typos

* revert one change

* emdash tweak
---
 documentation/docs/01-introduction/02-getting-started.md  | 2 +-
 documentation/docs/01-introduction/03-svelte-files.md     | 2 +-
 documentation/docs/02-runes/03-$derived.md                | 2 +-
 documentation/docs/02-runes/04-$effect.md                 | 3 +--
 documentation/docs/03-template-syntax/05-await.md         | 2 +-
 documentation/docs/03-template-syntax/06-snippet.md       | 2 +-
 documentation/docs/03-template-syntax/15-animate.md       | 6 +-----
 documentation/docs/04-styling/04-nested-style-elements.md | 2 +-
 documentation/docs/06-runtime/01-stores.md                | 2 +-
 documentation/docs/06-runtime/03-lifecycle-hooks.md       | 2 +-
 10 files changed, 10 insertions(+), 15 deletions(-)

diff --git a/documentation/docs/01-introduction/02-getting-started.md b/documentation/docs/01-introduction/02-getting-started.md
index 37757d961f..e035e6d6df 100644
--- a/documentation/docs/01-introduction/02-getting-started.md
+++ b/documentation/docs/01-introduction/02-getting-started.md
@@ -21,7 +21,7 @@ There are also plugins for [Rollup](https://github.com/sveltejs/rollup-plugin-sv
 
 ## Editor tooling
 
-The Svelte team maintains a [VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) and there are integrations with various other [editors](https://sveltesociety.dev/resources#editor-support) and tools as well.
+The Svelte team maintains a [VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode), and there are integrations with various other [editors](https://sveltesociety.dev/resources#editor-support) and tools as well.
 
 You can also check your code from the command line using [sv check](https://github.com/sveltejs/cli).
 
diff --git a/documentation/docs/01-introduction/03-svelte-files.md b/documentation/docs/01-introduction/03-svelte-files.md
index a0c0bf5cc9..cd98652370 100644
--- a/documentation/docs/01-introduction/03-svelte-files.md
+++ b/documentation/docs/01-introduction/03-svelte-files.md
@@ -50,7 +50,7 @@ A `<script>` tag with a `module` attribute runs once when the module first evalu
 
 You can `export` bindings from this block, and they will become exports of the compiled module. You cannot `export default`, since the default export is the component itself.
 
-> [!NOTE] If you are using TypeScript and import such exports from a `module` block into a `.ts` file, make sure to have your editor setup so that TypeScript knows about them. This is the case for our VS Code extension and the IntelliJ plugin, in other cases you might need to setup our [TypeScript editor plugin](https://www.npmjs.com/package/typescript-svelte-plugin).
+> [!NOTE] If you are using TypeScript and import such exports from a `module` block into a `.ts` file, make sure to have your editor setup so that TypeScript knows about them. This is the case for our VS Code extension and the IntelliJ plugin, but in other cases you might need to setup our [TypeScript editor plugin](https://www.npmjs.com/package/typescript-svelte-plugin).
 
 > [!LEGACY]
 > In Svelte 4, this script tag was created using `<script context="module">`
diff --git a/documentation/docs/02-runes/03-$derived.md b/documentation/docs/02-runes/03-$derived.md
index 96cafeaaea..77ab07a0a9 100644
--- a/documentation/docs/02-runes/03-$derived.md
+++ b/documentation/docs/02-runes/03-$derived.md
@@ -21,7 +21,7 @@ The expression inside `$derived(...)` should be free of side-effects. Svelte wil
 
 As with `$state`, you can mark class fields as `$derived`.
 
-> [!NOTE] Code in Svelte components is only executed once at creation, without the `$derived` rune `double` would maintain it's original value.
+> [!NOTE] Code in Svelte components is only executed once at creation. Without the `$derived` rune, `doubled` would maintain its original value even when `count` changes.
 
 ## `$derived.by`
 
diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index 07291daa43..354869f35e 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -243,8 +243,7 @@ export default function readable<T>(
 
 ## `$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.
+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 the creation of effects outside of the component initialisation phase.
 
 ```svelte
 <script>
diff --git a/documentation/docs/03-template-syntax/05-await.md b/documentation/docs/03-template-syntax/05-await.md
index 7fe7a963c5..6f365179e4 100644
--- a/documentation/docs/03-template-syntax/05-await.md
+++ b/documentation/docs/03-template-syntax/05-await.md
@@ -39,7 +39,7 @@ Await blocks allow you to branch on the three possible states of a [`Promise`](h
 
 > [!NOTE] During server-side rendering, only the pending branch will be rendered.
 >
-> If the provided expression is not a `Promise` only the `:then` branch will be rendered, including during server-side rendering.
+> If the provided expression is not a `Promise`, only the `:then` branch will be rendered, including during server-side rendering.
 
 The `catch` block can be omitted if you don't need to render anything when the promise rejects (or no error is possible).
 
diff --git a/documentation/docs/03-template-syntax/06-snippet.md b/documentation/docs/03-template-syntax/06-snippet.md
index 43bafdd67d..d4ec5a0cef 100644
--- a/documentation/docs/03-template-syntax/06-snippet.md
+++ b/documentation/docs/03-template-syntax/06-snippet.md
@@ -53,7 +53,7 @@ Snippets, and [render tags](@render), are a way to create reusable chunks of mar
 {/each}
 ```
 
-Like function declarations, snippets can have an arbitrary number of parameters, which can have default values, and you can destructure each parameter. You cannot use rest parameters however.
+Like function declarations, snippets can have an arbitrary number of parameters, which can have default values, and you can destructure each parameter. You cannot use rest parameters, however.
 
 ## Snippet scope
 
diff --git a/documentation/docs/03-template-syntax/15-animate.md b/documentation/docs/03-template-syntax/15-animate.md
index 583936be3b..a54e37f0b1 100644
--- a/documentation/docs/03-template-syntax/15-animate.md
+++ b/documentation/docs/03-template-syntax/15-animate.md
@@ -2,15 +2,12 @@
 title: animate:
 ---
 
-
-
-
 An animation is triggered when the contents of a [keyed each block](each#Keyed-each-blocks) are re-ordered. Animations do not run when an element is added or removed, only when the index of an existing data item within the each block changes. Animate directives must be on an element that is an _immediate_ child of a keyed each block.
 
 Animations can be used with Svelte's [built-in animation functions](svelte-animate) or [custom animation functions](#Custom-animation-functions).
 
 ```svelte
-<!-- When `list` is reordered the animation will run-->
+<!-- When `list` is reordered the animation will run -->
 {#each list as item, index (item)}
 	<li animate:flip>{item}</li>
 {/each}
@@ -115,4 +112,3 @@ A custom animation function can also return a `tick` function, which is called _
 	<div animate:whizz>{item}</div>
 {/each}
 ```
-
diff --git a/documentation/docs/04-styling/04-nested-style-elements.md b/documentation/docs/04-styling/04-nested-style-elements.md
index 6198c636d5..4fc5cfa521 100644
--- a/documentation/docs/04-styling/04-nested-style-elements.md
+++ b/documentation/docs/04-styling/04-nested-style-elements.md
@@ -2,7 +2,7 @@
 title: Nested <style> elements
 ---
 
-There should only be 1 top-level `<style>` tag per component.
+There can only be one top-level `<style>` tag per component.
 
 However, it is possible to have a `<style>` tag nested inside other elements or logic blocks.
 
diff --git a/documentation/docs/06-runtime/01-stores.md b/documentation/docs/06-runtime/01-stores.md
index 43bd38580a..8ea01e5314 100644
--- a/documentation/docs/06-runtime/01-stores.md
+++ b/documentation/docs/06-runtime/01-stores.md
@@ -36,7 +36,7 @@ Local variables (that do not represent store values) must _not_ have a `$` prefi
 Prior to Svelte 5, stores were the go-to solution for creating cross-component reactive states or extracting logic. With runes, these use cases have greatly diminished.
 
 - when extracting logic, it's better to take advantage of runes' universal reactivity: You can use runes outside the top level of components and even place them into JavaScript or TypeScript files (using a `.svelte.js` or `.svelte.ts` file ending)
-- when creating shared state, you can create a `$state` object containing the values you need and manipulating said state
+- when creating shared state, you can create a `$state` object containing the values you need and then manipulate said state
 
 Stores are still a good solution when you have complex asynchronous data streams or it's important to have more manual control over updating values or listening to changes. If you're familiar with RxJs and want to reuse that knowledge, the `$` also comes in handy for you.
 
diff --git a/documentation/docs/06-runtime/03-lifecycle-hooks.md b/documentation/docs/06-runtime/03-lifecycle-hooks.md
index c8699e1f6d..16ab0e8e87 100644
--- a/documentation/docs/06-runtime/03-lifecycle-hooks.md
+++ b/documentation/docs/06-runtime/03-lifecycle-hooks.md
@@ -7,7 +7,7 @@ title: Lifecycle hooks
 - beforeUpdate/afterUpdate with deprecation notice?
 - or skip this entirely and only have it in the reference docs? -->
 
-In Svelte 5, the component lifecycle consists of only two parts: Its creation and its destruction. Everything in-between - when certain state is updated - is not related to the component as a whole, only the parts that need to react to the state change are notified. This is because under the hood the smallest unit of change is actually not a component, it's the (render) effects that the component sets up upon component initialization. Consequently, there's no such thing as a "before update"/"after update" hook.
+In Svelte 5, the component lifecycle consists of only two parts: Its creation and its destruction. Everything in-between — when certain state is updated — is not related to the component as a whole; only the parts that need to react to the state change are notified. This is because under the hood the smallest unit of change is actually not a component, it's the (render) effects that the component sets up upon component initialization. Consequently, there's no such thing as a "before update"/"after update" hook.
 
 ## `onMount`
 

From 3fe278a8c311d6d6f2f6250c9ba160ca8a7aa488 Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Wed, 30 Oct 2024 11:55:30 -0400
Subject: [PATCH 054/404] chore: remove xml2js override (#14041)

---
 package.json   | 5 -----
 pnpm-lock.yaml | 3 ---
 2 files changed, 8 deletions(-)

diff --git a/package.json b/package.json
index b213cfa94e..bcd5962c75 100644
--- a/package.json
+++ b/package.json
@@ -45,10 +45,5 @@
     "typescript-eslint": "^8.2.0",
     "v8-natives": "^1.2.5",
     "vitest": "^2.0.5"
-  },
-  "pnpm": {
-    "overrides": {
-      "xml2js": "^0.6.0"
-    }
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 90a2bf2e67..1f33a207fc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,9 +4,6 @@ settings:
   autoInstallPeers: true
   excludeLinksFromLockfile: false
 
-overrides:
-  xml2js: ^0.6.0
-
 importers:
 
   .:

From 253d01ec290fd2d83a8f4024eb6875bd655d0f28 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 16:27:47 +0000
Subject: [PATCH 055/404] fix: ensure element effects are executed in the
 correct order (#14038)

---
 .changeset/thin-icons-sort.md                 |  5 ++++
 .../client/visitors/BindDirective.js          | 10 +++++---
 .../client/visitors/RegularElement.js         | 24 +++++++++----------
 .../client/visitors/UseDirective.js           |  2 +-
 .../deconflict-contextual-action/_config.js   |  2 +-
 .../_config.js                                |  7 ++++++
 .../main.svelte                               | 22 +++++++++++++++++
 7 files changed, 55 insertions(+), 17 deletions(-)
 create mode 100644 .changeset/thin-icons-sort.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/main.svelte

diff --git a/.changeset/thin-icons-sort.md b/.changeset/thin-icons-sort.md
new file mode 100644
index 0000000000..92dc82a825
--- /dev/null
+++ b/.changeset/thin-icons-sort.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure element effects are executed in the correct order
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 860154e3ed..d24c1769d0 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
@@ -245,8 +245,12 @@ export function BindDirective(node, context) {
 		const has_action_directive =
 			parent.type === 'RegularElement' && parent.attributes.find((a) => a.type === 'UseDirective');
 
-		context.state.after_update.push(
-			b.stmt(has_action_directive ? b.call('$.effect', b.thunk(call)) : call)
-		);
+		if (has_action_directive) {
+			context.state.init.push(
+				b.stmt(has_action_directive ? b.call('$.effect', b.thunk(call)) : call)
+			);
+		} else {
+			context.state.after_update.push(b.stmt(call));
+		}
 	}
 }
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 52100a2019..bd881e0f76 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
@@ -158,17 +158,19 @@ export function RegularElement(node, context) {
 	}
 
 	/** @type {typeof state} */
-	const element_after_update_state = { ...context.state, after_update: [] };
+	const element_state = { ...context.state, init: [], after_update: [] };
 
 	for (const attribute of other_directives) {
 		if (attribute.type === 'OnDirective') {
 			const handler = /** @type {Expression} */ (context.visit(attribute));
 
-			element_after_update_state.after_update.push(
-				b.stmt(has_use ? b.call('$.effect', b.thunk(handler)) : handler)
-			);
+			if (has_use) {
+				element_state.init.push(b.stmt(b.call('$.effect', b.thunk(handler))));
+			} else {
+				element_state.after_update.push(b.stmt(handler));
+			}
 		} else {
-			context.visit(attribute, element_after_update_state);
+			context.visit(attribute, element_state);
 		}
 	}
 
@@ -401,18 +403,16 @@ export function RegularElement(node, context) {
 				...child_state.init,
 				child_state.update.length > 0 ? build_render_statement(child_state.update) : b.empty,
 				...child_state.after_update,
-				...element_after_update_state.after_update
+				...element_state.after_update
 			])
 		);
 	} else if (node.fragment.metadata.dynamic) {
-		context.state.init.push(...child_state.init);
+		context.state.init.push(...child_state.init, ...element_state.init);
 		context.state.update.push(...child_state.update);
-		context.state.after_update.push(
-			...child_state.after_update,
-			...element_after_update_state.after_update
-		);
+		context.state.after_update.push(...child_state.after_update, ...element_state.after_update);
 	} else {
-		context.state.after_update.push(...element_after_update_state.after_update);
+		context.state.init.push(...element_state.init);
+		context.state.after_update.push(...element_state.after_update);
 	}
 
 	if (lookup.has('dir')) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
index 311ba36497..f6d918ce45 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
@@ -29,6 +29,6 @@ export function UseDirective(node, context) {
 	}
 
 	// actions need to run after attribute updates in order with bindings/events
-	context.state.after_update.push(b.stmt(b.call('$.action', ...args)));
+	context.state.init.push(b.stmt(b.call('$.action', ...args)));
 	context.next();
 }
diff --git a/packages/svelte/tests/runtime-legacy/samples/deconflict-contextual-action/_config.js b/packages/svelte/tests/runtime-legacy/samples/deconflict-contextual-action/_config.js
index 68d1168b32..0e8e34bde2 100644
--- a/packages/svelte/tests/runtime-legacy/samples/deconflict-contextual-action/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/deconflict-contextual-action/_config.js
@@ -14,6 +14,6 @@ export default test({
 		};
 	},
 	test({ assert }) {
-		assert.deepEqual(result, ['each_action', 'import_action']); // ideally this would be reversed, but it doesn't matter a whole lot
+		assert.deepEqual(result, ['import_action', 'each_action']);
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/_config.js b/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/_config.js
new file mode 100644
index 0000000000..be183ab080
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, logs }) {
+		assert.deepEqual(logs, [0, 1, 2, 3, 4, 5, 6]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/main.svelte b/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/main.svelte
new file mode 100644
index 0000000000..7c21bb1b0a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/lifecycle-render-order-for-children-6/main.svelte
@@ -0,0 +1,22 @@
+<script>
+	function create_action() {
+		let index = 0;
+		return () => {
+			console.log(index++);
+		};
+	}
+
+	const content = create_action();
+</script>
+
+{#if true}
+	<div use:content></div>
+{/if}
+
+<div use:content></div>
+
+{#each { length: 5 } as _}
+	<div>
+		<div use:content></div>
+	</div>
+{/each}

From 224fcde821db43fb22e27c7559dbcf63803a0f91 Mon Sep 17 00:00:00 2001
From: "Ahmad S." <navorite@gmail.com>
Date: Wed, 30 Oct 2024 19:37:31 +0300
Subject: [PATCH 056/404] fix: preserve the separator between selectors when an
 unused selector is in between (#13954)

fixes #13945
---
 .changeset/eighty-icons-fold.md               |  5 +++++
 .../compiler/phases/3-transform/css/index.js  | 16 +++++++++++----
 .../unused-selector-in-between/_config.js     | 20 +++++++++++++++++++
 .../unused-selector-in-between/expected.css   |  7 +++++++
 .../unused-selector-in-between/input.svelte   | 14 +++++++++++++
 .../_expected.html                            |  2 +-
 .../_expected_head.html                       |  2 +-
 .../css-injected-options-minify/main.svelte   |  6 ++++++
 8 files changed, 66 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/eighty-icons-fold.md
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-in-between/_config.js
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-in-between/input.svelte

diff --git a/.changeset/eighty-icons-fold.md b/.changeset/eighty-icons-fold.md
new file mode 100644
index 0000000000..2d8f0d57bf
--- /dev/null
+++ b/.changeset/eighty-icons-fold.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: preserve the separator between selectors when an unused selector is in between
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 5b40867aab..ce682edd52 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -196,12 +196,13 @@ const visitors = {
 	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)) {
+			const children = node.children;
 			let pruning = false;
-			let prune_start = node.children[0].start;
+			let prune_start = children[0].start;
 			let last = prune_start;
 
-			for (let i = 0; i < node.children.length; i += 1) {
-				const selector = node.children[i];
+			for (let i = 0; i < children.length; i += 1) {
+				const selector = children[i];
 
 				if (selector.metadata.used === pruning) {
 					if (pruning) {
@@ -221,10 +222,17 @@ const visitors = {
 								state.code.prependRight(selector.start, '/* (unused) ');
 							}
 						} else {
+							// If this is not the last selector add a separator
+							const separator = i !== children.length - 1 ? ',' : '';
+
 							if (state.minify) {
 								prune_start = last;
+								if (separator) {
+									while (state.code.original[prune_start - 1] !== ',') prune_start++;
+									state.code.update(last, prune_start, separator);
+								}
 							} else {
-								state.code.overwrite(last, selector.start, ' /* (unused) ');
+								state.code.overwrite(last, selector.start, `${separator} /* (unused) `);
 							}
 						}
 					}
diff --git a/packages/svelte/tests/css/samples/unused-selector-in-between/_config.js b/packages/svelte/tests/css/samples/unused-selector-in-between/_config.js
new file mode 100644
index 0000000000..43747eb0c1
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-in-between/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			end: {
+				character: 72,
+				column: 3,
+				line: 10
+			},
+			message: 'Unused CSS selector "h4"',
+			start: {
+				character: 70,
+				column: 1,
+				line: 10
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css b/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
new file mode 100644
index 0000000000..5a93aa53b7
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
@@ -0,0 +1,7 @@
+
+	h1.svelte-xyz,
+	h2.svelte-xyz,
+	h3.svelte-xyz, /* (unused) h4*/
+	p.svelte-xyz {
+		color: red;
+	}
diff --git a/packages/svelte/tests/css/samples/unused-selector-in-between/input.svelte b/packages/svelte/tests/css/samples/unused-selector-in-between/input.svelte
new file mode 100644
index 0000000000..c1e149ba76
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-in-between/input.svelte
@@ -0,0 +1,14 @@
+<h1>h1</h1>
+<h2>h2</h2>
+<h3>h3</h3>
+<p>p</p>
+
+<style>
+	h1,
+	h2,
+	h3,
+	h4,
+	p {
+		color: red;
+	}
+</style>
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
index caa872be9b..60e974bd1a 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected.html
@@ -1 +1 @@
-<!--[--><div class="foo svelte-mnmfn6">foo</div><!--]-->
\ No newline at end of file
+<!--[--><div class="foo svelte-gfnjhw">foo</div><!--]-->
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
index 8d6e42d979..5350e77a49 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/_expected_head.html
@@ -1 +1 @@
-<style id="svelte-mnmfn6">.foo.svelte-mnmfn6 {color:green;}.foo.svelte-mnmfn6 {color:green;}</style>
\ No newline at end of file
+<style id="svelte-gfnjhw">.foo.svelte-gfnjhw {color:green;}.foo.svelte-gfnjhw {color:green;} .foo.svelte-gfnjhw {color:green;}.foo.svelte-gfnjhw, .foo.svelte-gfnjhw {color:green;}</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
index 13e01788e2..6d9ecba8df 100644
--- a/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
+++ b/packages/svelte/tests/server-side-rendering/samples/css-injected-options-minify/main.svelte
@@ -20,4 +20,10 @@
 	.foo, .unused {
 		color: green;
 	}
+	.unused, .foo {
+		color: green;
+	}
+	.foo, .unused, .foo {
+		color: green;
+	}
 </style>

From 4157db94c439148109c8bc407365371f7babae7e Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 30 Oct 2024 12:50:33 -0400
Subject: [PATCH 057/404] fix: correct typo in compiler error messages (#14044)

---
 .changeset/beige-stingrays-sip.md                      |  5 +++++
 .../docs/98-reference/.generated/compile-errors.md     |  2 +-
 packages/svelte/messages/compile-errors/template.md    |  2 +-
 packages/svelte/src/compiler/errors.js                 |  4 ++--
 .../src/compiler/phases/3-transform/css/index.js       | 10 +++++-----
 .../samples/catch-without-await/_config.js             |  2 +-
 .../samples/else-before-closing-3/_config.js           |  2 +-
 .../samples/else-before-closing/_config.js             |  2 +-
 .../samples/else-if-before-closing-2/_config.js        |  2 +-
 .../samples/then-before-closing/_config.js             |  2 +-
 .../samples/then-without-await/_config.js              |  2 +-
 .../tests/migrate/samples/derivations/input.svelte     |  2 +-
 .../tests/migrate/samples/derivations/output.svelte    |  4 ++--
 13 files changed, 23 insertions(+), 18 deletions(-)
 create mode 100644 .changeset/beige-stingrays-sip.md

diff --git a/.changeset/beige-stingrays-sip.md b/.changeset/beige-stingrays-sip.md
new file mode 100644
index 0000000000..408d91d403
--- /dev/null
+++ b/.changeset/beige-stingrays-sip.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: replace typo in compiler error messages
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 1b8511a6f6..3981822d84 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -119,7 +119,7 @@ Can only bind to state or props
 ### block_invalid_continuation_placement
 
 ```
-{:...} block is invalid at this position (did you forget to close the preceeding element or block?)
+{:...} block is invalid at this position (did you forget to close the preceding element or block?)
 ```
 
 ### block_invalid_elseif
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index d606e4fd84..cddca87d9c 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -74,7 +74,7 @@
 
 ## block_invalid_continuation_placement
 
-> {:...} block is invalid at this position (did you forget to close the preceeding element or block?)
+> {:...} block is invalid at this position (did you forget to close the preceding element or block?)
 
 ## block_invalid_elseif
 
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 8f1dae98b1..00e2246ccf 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -747,12 +747,12 @@ export function block_duplicate_clause(node, name) {
 }
 
 /**
- * {:...} block is invalid at this position (did you forget to close the preceeding element or block?)
+ * {:...} block is invalid at this position (did you forget to close the preceding element or block?)
  * @param {null | number | NodeLike} node
  * @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 preceeding 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?)");
 }
 
 /**
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 ce682edd52..62c520e994 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -48,7 +48,7 @@ export function render_stylesheet(source, analysis, options) {
 	code.remove(0, ast.content.start);
 	code.remove(/** @type {number} */ (ast.content.end), source.length);
 	if (state.minify) {
-		remove_preceeding_whitespace(ast.content.end, state);
+		remove_preceding_whitespace(ast.content.end, state);
 	}
 
 	const css = {
@@ -122,7 +122,7 @@ const visitors = {
 				index++;
 			}
 		} else if (state.minify) {
-			remove_preceeding_whitespace(node.start, state);
+			remove_preceding_whitespace(node.start, state);
 
 			// Don't minify whitespace in custom properties, since some browsers (Chromium < 99)
 			// treat --foo: ; and --foo:; differently
@@ -136,8 +136,8 @@ const visitors = {
 	},
 	Rule(node, { state, next, visit }) {
 		if (state.minify) {
-			remove_preceeding_whitespace(node.start, state);
-			remove_preceeding_whitespace(node.block.end - 1, state);
+			remove_preceding_whitespace(node.start, state);
+			remove_preceding_whitespace(node.block.end - 1, state);
 		}
 
 		// keep empty rules in dev, because it's convenient to
@@ -385,7 +385,7 @@ const visitors = {
  * @param {number} end
  * @param {State} state
  */
-function remove_preceeding_whitespace(end, state) {
+function remove_preceding_whitespace(end, state) {
 	let start = end;
 	while (/\s/.test(state.code.original[start - 1])) start--;
 	if (start < end) state.code.remove(start, end);
diff --git a/packages/svelte/tests/compiler-errors/samples/catch-without-await/_config.js b/packages/svelte/tests/compiler-errors/samples/catch-without-await/_config.js
index eaca30bd34..b8fca63f8c 100644
--- a/packages/svelte/tests/compiler-errors/samples/catch-without-await/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/catch-without-await/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [1, 1]
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/else-before-closing-3/_config.js b/packages/svelte/tests/compiler-errors/samples/else-before-closing-3/_config.js
index daf005c900..050f58aa96 100644
--- a/packages/svelte/tests/compiler-errors/samples/else-before-closing-3/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/else-before-closing-3/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [6, 6]
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/else-before-closing/_config.js b/packages/svelte/tests/compiler-errors/samples/else-before-closing/_config.js
index 5053be23bd..4e66c92c65 100644
--- a/packages/svelte/tests/compiler-errors/samples/else-before-closing/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/else-before-closing/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [18, 18]
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/else-if-before-closing-2/_config.js b/packages/svelte/tests/compiler-errors/samples/else-if-before-closing-2/_config.js
index 43839b6723..4a440af93e 100644
--- a/packages/svelte/tests/compiler-errors/samples/else-if-before-closing-2/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/else-if-before-closing-2/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [17, 17]
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/then-before-closing/_config.js b/packages/svelte/tests/compiler-errors/samples/then-before-closing/_config.js
index 23c71262d2..03a5996737 100644
--- a/packages/svelte/tests/compiler-errors/samples/then-before-closing/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/then-before-closing/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [21, 21]
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/then-without-await/_config.js b/packages/svelte/tests/compiler-errors/samples/then-without-await/_config.js
index eaca30bd34..b8fca63f8c 100644
--- a/packages/svelte/tests/compiler-errors/samples/then-without-await/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/then-without-await/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'block_invalid_continuation_placement',
 		message:
-			'{:...} block is invalid at this position (did you forget to close the preceeding element or block?)',
+			'{:...} block is invalid at this position (did you forget to close the preceding element or block?)',
 		position: [1, 1]
 	}
 });
diff --git a/packages/svelte/tests/migrate/samples/derivations/input.svelte b/packages/svelte/tests/migrate/samples/derivations/input.svelte
index 8f89a59385..a120bbe7ee 100644
--- a/packages/svelte/tests/migrate/samples/derivations/input.svelte
+++ b/packages/svelte/tests/migrate/samples/derivations/input.svelte
@@ -6,7 +6,7 @@
 	// no semicolon at the end
 	$: time_8 = count * 8
 	$: ({ time_16 } = { time_16: count * 16 })
-	// preceeding let that doesn't do anything
+	// preceding let that doesn't do anything
 	let time_32;
 	$: time_32 = count * doubled;
 	let very_high;
diff --git a/packages/svelte/tests/migrate/samples/derivations/output.svelte b/packages/svelte/tests/migrate/samples/derivations/output.svelte
index 23bac4ccaf..79ff089018 100644
--- a/packages/svelte/tests/migrate/samples/derivations/output.svelte
+++ b/packages/svelte/tests/migrate/samples/derivations/output.svelte
@@ -6,11 +6,11 @@
 	// no semicolon at the end
 	let time_8 = $derived(count * 8)
 	let { time_16 } = $derived({ time_16: count * 16 })
-	// preceeding let that doesn't do anything
+	// preceding let that doesn't do anything
 	let time_32 = $derived(count * doubled);
 	
 	let very_high = $derived(time_32 * count);
 	
 </script>
 
-{count} / {doubled} / {quadrupled} / {time_8} / {time_16}
\ No newline at end of file
+{count} / {doubled} / {quadrupled} / {time_8} / {time_16}

From f519b3d7b75b879842d65bcd67928dd528a895e1 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 30 Oct 2024 09:52:55 -0700
Subject: [PATCH 058/404] Version Packages (#14031)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/beige-stingrays-sip.md    |  5 -----
 .changeset/eighty-icons-fold.md      |  5 -----
 .changeset/eighty-pianos-sip.md      |  5 -----
 .changeset/giant-wombats-allow.md    |  5 -----
 .changeset/perfect-queens-reflect.md |  5 -----
 .changeset/red-berries-watch.md      |  5 -----
 .changeset/shaggy-frogs-fetch.md     |  5 -----
 .changeset/small-bobcats-add.md      |  5 -----
 .changeset/thin-icons-sort.md        |  5 -----
 .changeset/wet-timers-shop.md        |  5 -----
 packages/svelte/CHANGELOG.md         | 24 ++++++++++++++++++++++++
 packages/svelte/package.json         |  2 +-
 packages/svelte/src/version.js       |  2 +-
 13 files changed, 26 insertions(+), 52 deletions(-)
 delete mode 100644 .changeset/beige-stingrays-sip.md
 delete mode 100644 .changeset/eighty-icons-fold.md
 delete mode 100644 .changeset/eighty-pianos-sip.md
 delete mode 100644 .changeset/giant-wombats-allow.md
 delete mode 100644 .changeset/perfect-queens-reflect.md
 delete mode 100644 .changeset/red-berries-watch.md
 delete mode 100644 .changeset/shaggy-frogs-fetch.md
 delete mode 100644 .changeset/small-bobcats-add.md
 delete mode 100644 .changeset/thin-icons-sort.md
 delete mode 100644 .changeset/wet-timers-shop.md

diff --git a/.changeset/beige-stingrays-sip.md b/.changeset/beige-stingrays-sip.md
deleted file mode 100644
index 408d91d403..0000000000
--- a/.changeset/beige-stingrays-sip.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: replace typo in compiler error messages
diff --git a/.changeset/eighty-icons-fold.md b/.changeset/eighty-icons-fold.md
deleted file mode 100644
index 2d8f0d57bf..0000000000
--- a/.changeset/eighty-icons-fold.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: preserve the separator between selectors when an unused selector is in between
diff --git a/.changeset/eighty-pianos-sip.md b/.changeset/eighty-pianos-sip.md
deleted file mode 100644
index 330fa54f6d..0000000000
--- a/.changeset/eighty-pianos-sip.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: more robust re-subscribe detection for `fromStore`
diff --git a/.changeset/giant-wombats-allow.md b/.changeset/giant-wombats-allow.md
deleted file mode 100644
index e9d152a946..0000000000
--- a/.changeset/giant-wombats-allow.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: allow to pass in TS preference to migration
diff --git a/.changeset/perfect-queens-reflect.md b/.changeset/perfect-queens-reflect.md
deleted file mode 100644
index 32c54f94f1..0000000000
--- a/.changeset/perfect-queens-reflect.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: extend derived/state validation error to indirect exports
diff --git a/.changeset/red-berries-watch.md b/.changeset/red-berries-watch.md
deleted file mode 100644
index 92460c9cd0..0000000000
--- a/.changeset/red-berries-watch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: minify inject CSS in prod mode
diff --git a/.changeset/shaggy-frogs-fetch.md b/.changeset/shaggy-frogs-fetch.md
deleted file mode 100644
index 7dc7b8b920..0000000000
--- a/.changeset/shaggy-frogs-fetch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure toStore subscription correctly syncs latest value
diff --git a/.changeset/small-bobcats-add.md b/.changeset/small-bobcats-add.md
deleted file mode 100644
index 2bd686c9c1..0000000000
--- a/.changeset/small-bobcats-add.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't access `requestAnimationFrame` until needed to reduce need for mocks during testing
diff --git a/.changeset/thin-icons-sort.md b/.changeset/thin-icons-sort.md
deleted file mode 100644
index 92dc82a825..0000000000
--- a/.changeset/thin-icons-sort.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure element effects are executed in the correct order
diff --git a/.changeset/wet-timers-shop.md b/.changeset/wet-timers-shop.md
deleted file mode 100644
index 55d12496e0..0000000000
--- a/.changeset/wet-timers-shop.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: make compiler error extend from `Error`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 8a98068bb1..ceb63fece4 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,29 @@
 # svelte
 
+## 5.1.5
+
+### Patch Changes
+
+- fix: replace typo in compiler error messages ([#14044](https://github.com/sveltejs/svelte/pull/14044))
+
+- fix: preserve the separator between selectors when an unused selector is in between ([#13954](https://github.com/sveltejs/svelte/pull/13954))
+
+- fix: more robust re-subscribe detection for `fromStore` ([#13995](https://github.com/sveltejs/svelte/pull/13995))
+
+- fix: allow to pass in TS preference to migration ([#13929](https://github.com/sveltejs/svelte/pull/13929))
+
+- fix: extend derived/state validation error to indirect exports ([#14039](https://github.com/sveltejs/svelte/pull/14039))
+
+- fix: minify inject CSS in prod mode ([#14006](https://github.com/sveltejs/svelte/pull/14006))
+
+- fix: ensure toStore subscription correctly syncs latest value ([#14015](https://github.com/sveltejs/svelte/pull/14015))
+
+- fix: don't access `requestAnimationFrame` until needed to reduce need for mocks during testing ([#14040](https://github.com/sveltejs/svelte/pull/14040))
+
+- fix: ensure element effects are executed in the correct order ([#14038](https://github.com/sveltejs/svelte/pull/14038))
+
+- fix: make compiler error extend from `Error` ([#14036](https://github.com/sveltejs/svelte/pull/14036))
+
 ## 5.1.4
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 4dd788fd91..bd610bcd69 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.1.4",
+  "version": "5.1.5",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 6fcb1a28fc..11711b5dc2 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.1.4';
+export const VERSION = '5.1.5';
 export const PUBLIC_VERSION = '5';

From bce1c4898c1460926662f47aeff1588681720806 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 19:35:06 +0000
Subject: [PATCH 059/404] fix: ensure child effects are destroyed before their
 deriveds (#14043)

* fix: ensure legacy props cache last value when destroyed

* fix runes

* better approach

* better approach

* kill code

* lint
---
 .changeset/khaki-carrots-mix.md                 |  5 +++++
 .../src/internal/client/reactivity/effects.js   |  2 +-
 .../src/internal/client/reactivity/props.js     | 12 +++---------
 packages/svelte/src/internal/client/runtime.js  |  2 +-
 .../samples/props-reactive-destroy/Child.svelte | 11 +++++++++++
 .../samples/props-reactive-destroy/_config.js   | 10 ++++++++++
 .../samples/props-reactive-destroy/main.svelte  | 17 +++++++++++++++++
 .../samples/props-reactive-destroy/Child.svelte | 11 +++++++++++
 .../samples/props-reactive-destroy/_config.js   | 10 ++++++++++
 .../samples/props-reactive-destroy/main.svelte  | 17 +++++++++++++++++
 10 files changed, 86 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/khaki-carrots-mix.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/main.svelte

diff --git a/.changeset/khaki-carrots-mix.md b/.changeset/khaki-carrots-mix.md
new file mode 100644
index 0000000000..f5ef6b6418
--- /dev/null
+++ b/.changeset/khaki-carrots-mix.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure child effects are destroyed before their deriveds
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 82baeae288..daf28eeec2 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -437,8 +437,8 @@ export function destroy_effect(effect, remove_dom = true) {
 		removed = true;
 	}
 
-	destroy_effect_deriveds(effect);
 	destroy_effect_children(effect, remove_dom && !removed);
+	destroy_effect_deriveds(effect);
 	remove_reactions(effect, 0);
 	set_signal_status(effect, DESTROYED);
 
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index eec8e70dc6..e24deb5a20 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -1,4 +1,4 @@
-/** @import { Derived, Source } from './types.js' */
+/** @import { Source } from './types.js' */
 import { DEV } from 'esm-env';
 import {
 	PROPS_IS_BINDABLE,
@@ -12,7 +12,6 @@ import { mutable_source, set, source } from './sources.js';
 import { derived, derived_safe_equal } from './deriveds.js';
 import {
 	active_effect,
-	active_reaction,
 	get,
 	is_signals_recorded,
 	set_active_effect,
@@ -21,7 +20,7 @@ import {
 } from '../runtime.js';
 import { safe_equals } from './equality.js';
 import * as e from '../errors.js';
-import { BRANCH_EFFECT, DESTROYED, LEGACY_DERIVED_PROP, ROOT_EFFECT } from '../constants.js';
+import { BRANCH_EFFECT, LEGACY_DERIVED_PROP, ROOT_EFFECT } from '../constants.js';
 import { proxy } from '../proxy.js';
 import { capture_store_binding } from './store.js';
 
@@ -369,17 +368,12 @@ export function prop(props, key, flags, fallback) {
 	// The derived returns the current value. The underlying mutable
 	// source is written to from various places to persist this value.
 	var inner_current_value = mutable_source(prop_value);
-
 	var current_value = with_parent_branch(() =>
 		derived(() => {
 			var parent_value = getter();
 			var child_value = get(inner_current_value);
-			var current_derived = /** @type {Derived} */ (active_reaction);
 
-			// If the getter from the parent returns undefined, switch
-			// to using the local value from inner_current_value instead,
-			// as the parent value might have been torn down
-			if (from_child || (parent_value === undefined && (current_derived.f & DESTROYED) !== 0)) {
+			if (from_child) {
 				from_child = false;
 				was_from_child = true;
 				return child_value;
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 26c8d9adbb..6bed3825c7 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -432,12 +432,12 @@ export function update_effect(effect) {
 	}
 
 	try {
-		destroy_effect_deriveds(effect);
 		if ((flags & BLOCK_EFFECT) !== 0) {
 			destroy_block_effect_children(effect);
 		} else {
 			destroy_effect_children(effect);
 		}
+		destroy_effect_deriveds(effect);
 
 		execute_effect_teardown(effect);
 		var teardown = update_reaction(effect);
diff --git a/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/Child.svelte b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/Child.svelte
new file mode 100644
index 0000000000..dc6326f8c4
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/Child.svelte
@@ -0,0 +1,11 @@
+<script>
+	import { onDestroy } from 'svelte';
+
+	export let data;
+	
+	onDestroy(() => {
+		data;
+	});
+</script>
+
+{data ? '' : null}
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/_config.js b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/_config.js
new file mode 100644
index 0000000000..363c850c8b
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/_config.js
@@ -0,0 +1,10 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs, target }) {
+		target.querySelector('button')?.click();
+		flushSync();
+		assert.deepEqual(logs, ['should fire once']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/main.svelte b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/main.svelte
new file mode 100644
index 0000000000..00c6a5f71c
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/props-reactive-destroy/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	import Child from './Child.svelte';
+
+	let active = true;
+	let data = { example: 'This is some example data' };
+
+	function log(data) {
+		console.log('should fire once');
+		return data;
+	}
+</script>
+
+<button on:click={() => active = false}>Hide</button>
+
+{#if active}
+	<Child data={log(data)} />
+{/if}
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/Child.svelte b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/Child.svelte
new file mode 100644
index 0000000000..d16689b07d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/Child.svelte
@@ -0,0 +1,11 @@
+<script>
+	import { onDestroy } from 'svelte';
+
+	const { data = 123 } = $props();
+
+	onDestroy(() => {
+		data;
+	});
+</script>
+
+{data ? '' : null}
diff --git a/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/_config.js b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/_config.js
new file mode 100644
index 0000000000..363c850c8b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/_config.js
@@ -0,0 +1,10 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs, target }) {
+		target.querySelector('button')?.click();
+		flushSync();
+		assert.deepEqual(logs, ['should fire once']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/main.svelte
new file mode 100644
index 0000000000..604237072a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-reactive-destroy/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	import Child from './Child.svelte';
+
+	let active = $state(true);
+	let data = $state({ example: 'This is some example data' });
+
+	function log(data) {
+		console.log('should fire once');
+		return data;
+	}
+</script>
+
+<button onclick={() => (active = false)}>Hide</button>
+
+{#if active}
+	<Child data={log(data)} />
+{/if}

From e78ea1d555732834983bbf2b48b7fbb78eb3c86c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 30 Oct 2024 19:39:01 +0000
Subject: [PATCH 060/404] Version Packages (#14047)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/khaki-carrots-mix.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-carrots-mix.md

diff --git a/.changeset/khaki-carrots-mix.md b/.changeset/khaki-carrots-mix.md
deleted file mode 100644
index f5ef6b6418..0000000000
--- a/.changeset/khaki-carrots-mix.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure child effects are destroyed before their deriveds
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index ceb63fece4..1a25f6dc4a 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.1.6
+
+### Patch Changes
+
+- fix: ensure child effects are destroyed before their deriveds ([#14043](https://github.com/sveltejs/svelte/pull/14043))
+
 ## 5.1.5
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index bd610bcd69..3612e4e67a 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.1.5",
+  "version": "5.1.6",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 11711b5dc2..de8344ad66 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.1.5';
+export const VERSION = '5.1.6';
 export const PUBLIC_VERSION = '5';

From 4c6255f8ddd9252a5ef245667e0b379528c60938 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 30 Oct 2024 15:39:38 -0400
Subject: [PATCH 061/404] chore: remove unnecessary ternary (#14045)

---
 .../phases/3-transform/client/visitors/BindDirective.js   | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

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 d24c1769d0..79969240c7 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
@@ -242,13 +242,11 @@ export function BindDirective(node, context) {
 	if (node.name === 'this') {
 		context.state.init.push(b.stmt(call));
 	} else {
-		const has_action_directive =
+		const has_use =
 			parent.type === 'RegularElement' && parent.attributes.find((a) => a.type === 'UseDirective');
 
-		if (has_action_directive) {
-			context.state.init.push(
-				b.stmt(has_action_directive ? b.call('$.effect', b.thunk(call)) : call)
-			);
+		if (has_use) {
+			context.state.init.push(b.stmt(b.call('$.effect', b.thunk(call))));
 		} else {
 			context.state.after_update.push(b.stmt(call));
 		}

From cdec39afac9acf5293eda5bc9208cd00300b47c2 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 21:07:38 +0000
Subject: [PATCH 062/404] fix: ensure custom element attribute/prop changes are
 in their own context (#14016)

Fixes #13848.

When we set custom element attributes/props, we should be doing so without the current effect/reaction active. Otherwise, the custom element lifecycle might attach effects/dependencies to the wrong reaction and all manner of things can incorrectly occur

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/wild-parents-begin.md              |  5 +++
 .../client/dom/elements/attributes.js         | 28 ++++++++++++++---
 .../element-effect-context/_config.js         | 24 ++++++++++++++
 .../element-effect-context/main.svelte        | 31 +++++++++++++++++++
 4 files changed, 84 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/wild-parents-begin.md
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/main.svelte

diff --git a/.changeset/wild-parents-begin.md b/.changeset/wild-parents-begin.md
new file mode 100644
index 0000000000..ac98fa0e3e
--- /dev/null
+++ b/.changeset/wild-parents-begin.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure custom element attribute/prop changes are in their own context
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 30c7712f1e..545cab20f8 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -7,6 +7,12 @@ import * as w from '../../warnings.js';
 import { LOADING_ATTR_SYMBOL } from '../../constants.js';
 import { queue_idle_task, queue_micro_task } from '../task.js';
 import { is_capture_event, is_delegated, normalize_attribute } from '../../../../utils.js';
+import {
+	active_effect,
+	active_reaction,
+	set_active_effect,
+	set_active_reaction
+} from '../../runtime.js';
 
 /**
  * The value/checked attribute in the template actually corresponds to the defaultValue property, so we need
@@ -145,10 +151,24 @@ export function set_xlink_attribute(dom, attribute, value) {
  * @param {any} value
  */
 export function set_custom_element_data(node, prop, value) {
-	if (get_setters(node).includes(prop)) {
-		node[prop] = value;
-	} else {
-		set_attribute(node, prop, value);
+	// We need to ensure that setting custom element props, which can
+	// invoke lifecycle methods on other custom elements, does not also
+	// associate those lifecycle methods with the current active reaction
+	// or effect
+	var previous_reaction = active_reaction;
+	var previous_effect = active_effect;
+
+	set_active_reaction(null);
+	set_active_effect(null);
+	try {
+		if (get_setters(node).includes(prop)) {
+			node[prop] = value;
+		} else {
+			set_attribute(node, prop, value);
+		}
+	} finally {
+		set_active_reaction(previous_reaction);
+		set_active_effect(previous_effect);
 	}
 }
 
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js
new file mode 100644
index 0000000000..3cf7a66df1
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js
@@ -0,0 +1,24 @@
+import { test } from '../../assert';
+const tick = () => Promise.resolve();
+
+export default test({
+	async test({ assert, target }) {
+		target.innerHTML = '<my-app/>';
+		await tick();
+		await tick();
+
+		/** @type {any} */
+		const el = target.querySelector('my-app');
+		const button = el.shadowRoot.querySelector('button');
+		const p = el.shadowRoot.querySelector('my-tracking').shadowRoot.querySelector('p');
+
+		assert.equal(button.innerHTML, '0');
+		assert.equal(p.innerHTML, 'false');
+
+		button.click();
+		await tick();
+
+		assert.equal(button.innerHTML, '1');
+		assert.equal(p.innerHTML, 'false');
+	}
+});
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/main.svelte b/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/main.svelte
new file mode 100644
index 0000000000..fa35c8a086
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/main.svelte
@@ -0,0 +1,31 @@
+<svelte:options customElement="my-app" />
+
+<script module>
+	class Tracking extends HTMLElement {
+		static observedAttributes = ["count"];
+        tracking = false;
+
+        set count(_) {
+            this.tracking = $effect.tracking();
+            this.render();
+        }
+
+        constructor() {
+            super();
+            this.attachShadow({ mode: 'open' });
+        }
+
+		render() {
+			this.shadowRoot.innerHTML = `<p>${this.tracking}</p>`;
+		}
+	}
+
+	customElements.define("my-tracking", Tracking);
+</script>
+
+<script>
+    let count = $state(0);
+</script>
+
+<button onclick={() => (count += 1)}>{count}</button>
+<my-tracking {count}></my-tracking>

From 4a5a0b15d90e7c735dab2bc6b434c7feae204cc6 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 30 Oct 2024 21:08:33 +0000
Subject: [PATCH 063/404] fix: ensure onMount correctly fires when new
 expressions are used (#14049)

* fix: ensure onMount correctly fires when used externally

* fix root context

* fix root context

* revert

* alternative fix
---
 .changeset/early-hounds-float.md                    |  5 +++++
 .../phases/2-analyze/visitors/NewExpression.js      |  2 ++
 .../samples/onmount-external/_config.js             |  7 +++++++
 .../samples/onmount-external/main.svelte            | 13 +++++++++++++
 4 files changed, 27 insertions(+)
 create mode 100644 .changeset/early-hounds-float.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/onmount-external/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/onmount-external/main.svelte

diff --git a/.changeset/early-hounds-float.md b/.changeset/early-hounds-float.md
new file mode 100644
index 0000000000..0a708c59e4
--- /dev/null
+++ b/.changeset/early-hounds-float.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure onMount correctly fires when new expressions are used
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/NewExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/NewExpression.js
index 6b393ae9b9..bcb2400932 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/NewExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/NewExpression.js
@@ -11,5 +11,7 @@ export function NewExpression(node, context) {
 		w.perf_avoid_inline_class(node);
 	}
 
+	context.state.analysis.needs_context = true;
+
 	context.next();
 }
diff --git a/packages/svelte/tests/runtime-legacy/samples/onmount-external/_config.js b/packages/svelte/tests/runtime-legacy/samples/onmount-external/_config.js
new file mode 100644
index 0000000000..6cf976bd48
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/onmount-external/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, logs }) {
+		assert.deepEqual(logs, ['mounted']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/onmount-external/main.svelte b/packages/svelte/tests/runtime-legacy/samples/onmount-external/main.svelte
new file mode 100644
index 0000000000..e2e7dad8dc
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/onmount-external/main.svelte
@@ -0,0 +1,13 @@
+<script module>
+	import { onMount } from 'svelte';
+
+	class MyClass {
+		constructor() {
+			onMount(() => console.log('mounted'));
+		}
+	}
+</script>
+
+<script>
+	new MyClass();
+</script>

From dc3c82cb2d11fc320a2f30c2c6de9266907ae4e1 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 30 Oct 2024 18:39:48 -0400
Subject: [PATCH 064/404] chore: add sync request workflow (#14055)

---
 .github/workflows/sync-request.yml | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 .github/workflows/sync-request.yml

diff --git a/.github/workflows/sync-request.yml b/.github/workflows/sync-request.yml
new file mode 100644
index 0000000000..a4147faf73
--- /dev/null
+++ b/.github/workflows/sync-request.yml
@@ -0,0 +1,21 @@
+name: Sync request
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  dispatch:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Repository Dispatch
+        uses: peter-evans/repository-dispatch@v3
+        with:
+          token: ${{ secrets.SYNC_REQUEST_TOKEN }}
+          repository: sveltejs/svelte.dev
+          event-type: sync-request
+          client-payload: |-
+            {
+              "package": "svelte"
+            }

From ee2f4a209bdcfff7760843353567c99831d2e2ac Mon Sep 17 00:00:00 2001
From: Dave Snider <dave.snider@gmail.com>
Date: Wed, 30 Oct 2024 23:45:08 +0100
Subject: [PATCH 065/404] docs: Update in and out docs to show the imports
 (#14050)

* Update in and out docs to show the imports

* Apply suggestions from code review

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 .../docs/03-template-syntax/14-in-and-out.md          | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/documentation/docs/03-template-syntax/14-in-and-out.md b/documentation/docs/03-template-syntax/14-in-and-out.md
index feb5aa84c5..865398b46e 100644
--- a/documentation/docs/03-template-syntax/14-in-and-out.md
+++ b/documentation/docs/03-template-syntax/14-in-and-out.md
@@ -5,6 +5,17 @@ title: in: and out:
 The `in:` and `out:` directives are identical to [`transition:`](transition), except that the resulting transitions are not bidirectional — an `in` transition will continue to 'play' alongside the `out` transition, rather than reversing, if the block is outroed while the transition is in progress. If an out transition is aborted, transitions will restart from scratch.
 
 ```svelte
+<script>
+  import { fade, fly } from 'svelte/transition';
+  
+  let visible = $state(false);
+</script>
+
+<label>
+  <input type="checkbox" bind:checked={visible}>
+  visible
+</label>
+
 {#if visible}
 	<div in:fly out:fade>flies in, fades out</div>
 {/if}

From 0efe031edc61e01e175caf0f8b9cb259c05e6ce8 Mon Sep 17 00:00:00 2001
From: gubo97000 <gubo97000@hotmail.it>
Date: Thu, 31 Oct 2024 01:25:28 +0200
Subject: [PATCH 066/404] Update 07-$inspect.md (#14048)

moved note to top
---
 documentation/docs/02-runes/07-$inspect.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/02-runes/07-$inspect.md b/documentation/docs/02-runes/07-$inspect.md
index 07429a2818..1afe25deca 100644
--- a/documentation/docs/02-runes/07-$inspect.md
+++ b/documentation/docs/02-runes/07-$inspect.md
@@ -2,6 +2,8 @@
 title: $inspect
 ---
 
+> [!NOTE] `$inspect` only works during development. In a production build it becomes a noop.
+
 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 will cause it to re-fire ([demo](/playground/untitled#H4sIAAAAAAAACkWQ0YqDQAxFfyUMhSotdZ-tCvu431AXtGOqQ2NmmMm0LOK_r7Utfby5JzeXTOpiCIPKT5PidkSVq2_n1F7Jn3uIcEMSXHSw0evHpAjaGydVzbUQCmgbWaCETZBWMPlKj29nxBDaHj_edkAiu12JhdkYDg61JGvE_s2nR8gyuBuiJZuDJTyQ7eE-IEOzog1YD80Lb0APLfdYc5F9qnFxjiKWwbImo6_llKRQVs-2u91c_bD2OCJLkT3JZasw7KLA2XCX31qKWE6vIzNk1fKE0XbmYrBTufiI8-_8D2cUWBA_AQAA)):
 
 ```svelte
@@ -40,5 +42,3 @@ A convenient way to find the origin of some change is to pass `console.trace` to
 // @errors: 2304
 $inspect(stuff).with(console.trace);
 ```
-
-> [!NOTE] `$inspect` only works during development. In a production build it becomes a noop.

From 6b6445a9349750699f1953f1519b08e774e168df Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 30 Oct 2024 19:55:04 -0400
Subject: [PATCH 067/404] add parameters to `in:fly` (#14057)

Without a `y` value, `fly` is indistinguishable from `fade`
---
 documentation/docs/03-template-syntax/14-in-and-out.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/03-template-syntax/14-in-and-out.md b/documentation/docs/03-template-syntax/14-in-and-out.md
index 865398b46e..f4e37c845e 100644
--- a/documentation/docs/03-template-syntax/14-in-and-out.md
+++ b/documentation/docs/03-template-syntax/14-in-and-out.md
@@ -17,6 +17,6 @@ The `in:` and `out:` directives are identical to [`transition:`](transition), ex
 </label>
 
 {#if visible}
-	<div in:fly out:fade>flies in, fades out</div>
+	<div in:fly={{ y: 200 }} out:fade>flies in, fades out</div>
 {/if}
 ```

From 6a1b5dd004e494e1e9445a06e320d0873d5566aa Mon Sep 17 00:00:00 2001
From: Devr <bhargavj2804@pm.me>
Date: Thu, 31 Oct 2024 13:54:38 +0530
Subject: [PATCH 068/404] docs : add an example of using dynamic components
 (#13993)

Closes #13990

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 documentation/docs/03-template-syntax/05-await.md | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/documentation/docs/03-template-syntax/05-await.md b/documentation/docs/03-template-syntax/05-await.md
index 6f365179e4..06e9bdd540 100644
--- a/documentation/docs/03-template-syntax/05-await.md
+++ b/documentation/docs/03-template-syntax/05-await.md
@@ -68,3 +68,12 @@ Similarly, if you only want to show the error state, you can omit the `then` blo
 	<p>The error is {error}</p>
 {/await}
 ```
+
+> [!NOTE] You can use `#await` to render dynamic components with the help of the `import()` function:
+>
+> ```svelte
+> {#await import('./Component.svelte') then Component}
+> 	<Component.default />
+> {/await}
+> ```
+

From 217ef2062d2762c380fa98cc7965a88940de80d7 Mon Sep 17 00:00:00 2001
From: Bernie Sumption <bernie@berniecode.com>
Date: Thu, 31 Oct 2024 10:25:19 +0000
Subject: [PATCH 069/404] docs: clarify when prop values are deeply reactive
 (#13994)

* Update $props documentation to clarify when prop values are deeply reactive

* Update 05-$props.md

* Apply suggestions from code review

* drive-by-fixes

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 documentation/docs/02-runes/05-$props.md | 86 +++++++++++++++++++++---
 1 file changed, 77 insertions(+), 9 deletions(-)

diff --git a/documentation/docs/02-runes/05-$props.md b/documentation/docs/02-runes/05-$props.md
index 8e3dcfb341..17e9b3625f 100644
--- a/documentation/docs/02-runes/05-$props.md
+++ b/documentation/docs/02-runes/05-$props.md
@@ -5,29 +5,29 @@ title: $props
 The inputs to a component are referred to as _props_, which is short for _properties_. You pass props to components just like you pass attributes to elements:
 
 ```svelte
+<!--- file: App.svelte --->
 <script>
 	import MyComponent from './MyComponent.svelte';
 </script>
 
-/// file: App.svelte
 <MyComponent adjective="cool" />
 ```
 
 On the other side, inside `MyComponent.svelte`, we can receive props with the `$props` rune...
 
 ```svelte
+<!--- file: MyComponent.svelte --->
 <script>
 	let props = $props();
 </script>
 
-/// file: MyComponent.svelte
 <p>this component is {props.adjective}</p>
 ```
 
 ...though more commonly, you'll [_destructure_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) your props:
 
 ```svelte
-/// file: MyComponent.svelte
+<!--- file: MyComponent.svelte --->
 <script>
 	let +++{ adjective }+++ = $props();
 </script>
@@ -40,11 +40,10 @@ On the other side, inside `MyComponent.svelte`, we can receive props with the `$
 Destructuring allows us to declare fallback values, which are used if the parent component does not set a given prop:
 
 ```js
-/// file: MyComponent.svelte
 let { adjective = 'happy' } = $props();
 ```
 
-> [!NOTE] Fallback values are not turned into reactive state proxies.
+> [!NOTE] Fallback values are not turned into reactive state proxies (see [Updating props](#Updating-props) for more info)
 
 ## Renaming props
 
@@ -66,9 +65,8 @@ let { a, b, c, ...others } = $props();
 
 References to a prop inside a component update when the prop itself updates — when `count` changes in `App.svelte`, it will also change inside `Child.svelte`. But the child component is able to temporarily override the prop value, which can be useful for unsaved ephemeral state ([demo](/playground/untitled#H4sIAAAAAAAAE6WQ0WrDMAxFf0WIQR0Wmu3VTQJln7HsIfVcZubIxlbGRvC_DzuBraN92qPula50tODZWB1RPi_IX16jLALWSOOUq6P3-_ihLWftNEZ9TVeOWBNHlNhGFYznfqCBzeRdYHh6M_YVzsFNsNs3pdpGd4eBcqPVDMrNxNDBXeSRtXioDgO1zU8ataeZ2RE4Utao924RFXQ9iHXwvoPHKpW1xY4g_Bg0cSVhKS0p560Za95612ZC02ONrD8ZJYdZp_rGQ37ff_mSP86Np2TWZaNNmdcH56P4P67K66_SXoK9pG-5dF5Z9QEAAA==)):
 
-<!-- prettier-ignore -->
 ```svelte
-/// file: App.svelte
+<!--- file: App.svelte --->
 <script>
 	import Child from './Child.svelte';
 
@@ -82,9 +80,8 @@ References to a prop inside a component update when the prop itself updates —
 <Child {count} />
 ```
 
-<!-- prettier-ignore -->
 ```svelte
-/// file: Child.svelte
+<!--- file: Child.svelte --->
 <script>
 	let { count } = $props();
 </script>
@@ -94,6 +91,77 @@ References to a prop inside a component update when the prop itself updates —
 </button>
 ```
 
+Prop variables are not automatically deeply reactive. What happens when mutating one of their properties depends on what the parent passed in. For example if the parent passed a non-reactive POJO as a prop, setting a property of that object in the child will not cause the component to update ([demo](/playground/untitled#H4sIAAAAAAAAE3VPS07DMBC9yshCaiuqBLYhjoQ4Q1eEReJOVIMztuJJBbJ8d-IkEqXQ5bx53yCo6VEU4kCs2eBR7EWnDXpRvAbBXy79EjDhK_PZucyf0XDC2sbjf7iyxEg82YjSq0E7rmqqWffODgwvJ22O0A22h02Wz9cq3TzVVOY_CioXrm3fUbEMQdmRuICHGCGvpiDGTxYFDyPG_Y3Cl_6_K199bpQ2yBDWBhBBwp0brPPb3Z-u7chsCSwpo9WHDNsdyApCMslzODUeyAJ23WSUsMUymyfBvYTHmmKcI2e9LyBcUmKKWyKulr_Fb2Z_SHPIAQAA)):
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import Child from './Child.svelte';
+
+	let object = $state({count: 0});
+</script>
+
+<Child {object} />
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	let { object } = $props();
+</script>
+
+<button onclick={() => {
+	// has no effect
+	object.count += 1
+}}>
+	clicks: {object.count}
+</button>
+```
+
+However if the value passed in by the parent component is itself a deeply reactive state object, then it will be deeply reactive in the child, too ([demo](/playground/untitled#H4sIAAAAAAAAE3WQwU7DMBBEf2VlITUVVQLXkERC_YaeCIfE2aoujm3FGwqy_O_YcSug0KNnx7Nv1jHVjchKtlMkSOLANmwvJFpWvjhGnybOohD0s_PZmNy-o6So9Z3F_3SuFaGiEMMqyydhqGlVS2I0eiLYHoQcYD_pEVZ5sbzOX1dPwRaMEgl0f0ROUMOdpY4wc1zPikp48OvgqorvXFWlRJe-eCiawED4QaykaUa_udHl5-rfba4mN_pETHcB9RHVTNrY7C9gPxNpBVpxKfhb7bI11A24GFIUcBJSAu9mi0AHhKUo9Cj1CUjDbIbQP1rTpjzN72t4bJX3C8kSa8vLCZLFR4q0-eogr_4LN7sC9foBAAA=)):
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import Child from './Child.svelte';
+
+	let object = $state({count: 0});
+</script>
+
+<Child {object} />
+```
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	let { object } = $props();
+</script>
+
+<button onclick={() => {
+	// will cause the count below to update
+	object.count += 1
+}}>
+	clicks: {object.count}
+</button>
+```
+
+The fallback value of a prop not declared with `$bindable` is treated like a non-reactive POJO, and therefore also doesn't update the component when mutating its properties.
+
+```svelte
+<!--- file: Child.svelte --->
+<script>
+	let { object = { count = 0 } } = $props();
+</script>
+<button onclick={() => {
+	// has no effect if the fallback value is used
+	object.count += 1
+}}>
+	clicks: {object.count}
+</button>
+```
+
+In general, mutating props is discouraged, instead use callback props to make it easier to reason about state and changes to that state. If parent and child should share (and be allowed to mutate) the same object, then use the [$bindable]($bindable) rune.
+
 ## Type safety
 
 You can add type safety to your components by annotating your props, as you would with any other variable declaration. In TypeScript that might look like this...

From e47ee226286173db32e09d9f969d34815a1f3d85 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 31 Oct 2024 11:26:53 +0100
Subject: [PATCH 070/404] fix: wrap `:id`, `:where``:not` and `:has` with
 `:global` during migration (#13850)

Closes #13765
---
 .changeset/sour-feet-carry.md                 |  5 ++
 packages/svelte/src/compiler/migrate/index.js | 60 ++++++++++++++++++-
 .../samples/is-not-where-has/input.svelte     | 58 ++++++++++++++++++
 .../samples/is-not-where-has/output.svelte    | 58 ++++++++++++++++++
 4 files changed, 180 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/sour-feet-carry.md
 create mode 100644 packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte

diff --git a/.changeset/sour-feet-carry.md b/.changeset/sour-feet-carry.md
new file mode 100644
index 0000000000..6e09bac7f2
--- /dev/null
+++ b/.changeset/sour-feet-carry.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: wrap `:id`, `:where``:not` and `:has` with `:global` during migration
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 5630b8b34c..ee5abc8853 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -34,6 +34,61 @@ class MigrationError extends Error {
 	}
 }
 
+/**
+ *
+ * @param {State} state
+ */
+function migrate_css(state) {
+	if (!state.analysis.css.ast?.start) return;
+	let code = state.str
+		.snip(state.analysis.css.ast.start, /** @type {number} */ (state.analysis.css.ast?.end))
+		.toString();
+	let starting = 0;
+
+	// since we already blank css we can't work directly on `state.str` so we will create a copy that we can update
+	const str = new MagicString(code);
+	while (code) {
+		if (
+			code.startsWith(':has') ||
+			code.startsWith(':not') ||
+			code.startsWith(':is') ||
+			code.startsWith(':where')
+		) {
+			let start = code.indexOf('(') + 1;
+			let is_global = false;
+			const global_str = ':global';
+			const next_global = code.indexOf(global_str);
+			const str_between = code.substring(start, next_global);
+			if (!str_between.trim()) {
+				is_global = true;
+				start += global_str.length;
+			}
+			let parenthesis = 1;
+			let end = start;
+			let char = code[end];
+			// find the closing parenthesis
+			while (parenthesis !== 0 && char) {
+				if (char === '(') parenthesis++;
+				if (char === ')') parenthesis--;
+				end++;
+				char = code[end];
+			}
+			if (start && end) {
+				if (!is_global) {
+					str.prependLeft(starting + start, ':global(');
+					str.appendRight(starting + end - 1, ')');
+				}
+				starting += end - 1;
+				code = code.substring(end - 1);
+				continue;
+			}
+		}
+		starting++;
+		code = code.substring(1);
+	}
+	state.str.update(state.analysis.css.ast?.start, state.analysis.css.ast?.end, str.toString());
+}
+
 /**
  * Does a best-effort migration of Svelte code towards using runes, event attributes and render tags.
  * May throw an error if the code is too complex to migrate automatically.
@@ -320,7 +375,10 @@ export function migrate(source, { filename, use_ts } = {}) {
 		if (!parsed.instance && need_script) {
 			str.appendRight(insertion_point, '\n</script>\n\n');
 		}
-		return { code: str.toString() };
+		migrate_css(state);
+		return {
+			code: str.toString()
+		};
 	} catch (e) {
 		if (!(e instanceof MigrationError)) {
 			// eslint-disable-next-line no-console
diff --git a/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte b/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
new file mode 100644
index 0000000000..fbfc1c119f
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
@@ -0,0 +1,58 @@
+<script>
+	function is(){}
+	function where(){}
+	function not(){}
+	function has(){}
+
+	// looks like css but it's not in style tag
+	const x = {
+		div:is(42),
+		span:where(42),
+		form:not(42),
+		input:has(42),
+	}
+</script>
+
+what if i'm talking about `:has()` in my blog?
+
+```css
+	:has(.is_cool)
+```
+
+<style lang="postcss">
+	div:has(span){}
+	div > :not(span){}
+	div > :is(span){}
+	div > :where(span){}
+
+	div:has(:is(span)){}
+	div > :not(:is(span)){}
+	div > :is(:is(span)){}
+	div > :where(:is(span)){}
+
+	div:has(.class:is(span)){}
+	div > :not(.class:is(span)){}
+	div > :is(.class:is(span)){}
+	div > :where(.class:is(span)){}
+
+	div :has(.class:is(span:where(:focus))){}
+	div :not(.class:is(span:where(:focus-within))){}
+	div :is(.class:is(span:is(:hover))){}
+	div :where(.class:is(span:has(* > *))){}
+	div :is(.class:is(span:is(:hover)), .x){}
+
+	div :has(    :global(.class:is(span:where(:focus)))){}
+	div :not(:global(.class:is(span:where(:focus-within)))){}
+	div :is(:global(.class:is(span:is(:hover)))){}
+	div :where(:global(.class:is(span:has(* > *)))){}
+	div :is(:global(.class:is(span:is(:hover)), .x)){}
+
+	div{
+		p:has(&){
+
+		}
+		:not(span > *){
+			:where(form){}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
new file mode 100644
index 0000000000..1e02e9bdfd
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
@@ -0,0 +1,58 @@
+<script>
+	function is(){}
+	function where(){}
+	function not(){}
+	function has(){}
+
+	// looks like css but it's not in style tag
+	const x = {
+		div:is(42),
+		span:where(42),
+		form:not(42),
+		input:has(42),
+	}
+</script>
+
+what if i'm talking about `:has()` in my blog?
+
+```css
+	:has(.is_cool)
+```
+
+<style lang="postcss">
+	div:has(:global(span)){}
+	div > :not(:global(span)){}
+	div > :is(:global(span)){}
+	div > :where(:global(span)){}
+
+	div:has(:global(:is(span))){}
+	div > :not(:global(:is(span))){}
+	div > :is(:global(:is(span))){}
+	div > :where(:global(:is(span))){}
+
+	div:has(:global(.class:is(span))){}
+	div > :not(:global(.class:is(span))){}
+	div > :is(:global(.class:is(span))){}
+	div > :where(:global(.class:is(span))){}
+
+	div :has(:global(.class:is(span:where(:focus)))){}
+	div :not(:global(.class:is(span:where(:focus-within)))){}
+	div :is(:global(.class:is(span:is(:hover)))){}
+	div :where(:global(.class:is(span:has(* > *)))){}
+	div :is(:global(.class:is(span:is(:hover)), .x)){}
+
+	div :has(    :global(.class:is(span:where(:focus)))){}
+	div :not(:global(.class:is(span:where(:focus-within)))){}
+	div :is(:global(.class:is(span:is(:hover)))){}
+	div :where(:global(.class:is(span:has(* > *)))){}
+	div :is(:global(.class:is(span:is(:hover)), .x)){}
+
+	div{
+		p:has(:global(&)){
+
+		}
+		:not(:global(span > *)){
+			:where(:global(form)){}
+		}
+	}
+</style>
\ No newline at end of file

From 3999fed4ca30b35f26b9758afd3240614889e8b7 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 31 Oct 2024 11:02:30 +0000
Subject: [PATCH 071/404] fix: ensure each block inert items are disposed of if
 the each block is also inert (#13930)

Fixes #13926
---
 .changeset/curly-dogs-breathe.md              |  5 +++
 .../src/internal/client/dom/blocks/each.js    | 18 ++++++-----
 .../src/internal/client/reactivity/effects.js |  5 ++-
 .../samples/transition-each-3/_config.js      | 31 +++++++++++++++++++
 .../samples/transition-each-3/main.svelte     | 28 +++++++++++++++++
 5 files changed, 78 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/curly-dogs-breathe.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/transition-each-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/transition-each-3/main.svelte

diff --git a/.changeset/curly-dogs-breathe.md b/.changeset/curly-dogs-breathe.md
new file mode 100644
index 0000000000..9409c38141
--- /dev/null
+++ b/.changeset/curly-dogs-breathe.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure each block inert items are disposed of if the each block is also inert
diff --git a/packages/svelte/src/internal/client/dom/blocks/each.js b/packages/svelte/src/internal/client/dom/blocks/each.js
index e10aed3867..0fef7d343b 100644
--- a/packages/svelte/src/internal/client/dom/blocks/each.js
+++ b/packages/svelte/src/internal/client/dom/blocks/each.js
@@ -35,7 +35,7 @@ import { source, mutable_source, internal_set } from '../../reactivity/sources.j
 import { array_from, is_array } from '../../../shared/utils.js';
 import { INERT } from '../../constants.js';
 import { queue_micro_task } from '../task.js';
-import { active_effect } from '../../runtime.js';
+import { active_effect, active_reaction } from '../../runtime.js';
 
 /**
  * The row of a keyed each block that is currently updating. We track this
@@ -204,7 +204,8 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
 		}
 
 		if (!hydrating) {
-			reconcile(array, state, anchor, render_fn, flags, get_key);
+			var effect = /** @type {Effect} */ (active_reaction);
+			reconcile(array, state, anchor, render_fn, flags, (effect.f & INERT) !== 0, get_key);
 		}
 
 		if (fallback_fn !== null) {
@@ -248,10 +249,11 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
  * @param {Element | Comment | Text} anchor
  * @param {(anchor: Node, item: MaybeSource<V>, index: number | Source<number>) => void} render_fn
  * @param {number} flags
+ * @param {boolean} is_inert
  * @param {(value: V, index: number) => any} get_key
  * @returns {void}
  */
-function reconcile(array, state, anchor, render_fn, flags, get_key) {
+function reconcile(array, state, anchor, render_fn, flags, is_inert, get_key) {
 	var is_animated = (flags & EACH_IS_ANIMATED) !== 0;
 	var should_update = (flags & (EACH_ITEM_REACTIVE | EACH_INDEX_REACTIVE)) !== 0;
 
@@ -390,9 +392,9 @@ function reconcile(array, state, anchor, render_fn, flags, get_key) {
 			stashed = [];
 
 			while (current !== null && current.k !== key) {
-				// If the item has an effect that is already inert, skip over adding it
-				// to our seen Set as the item is already being handled
-				if ((current.e.f & INERT) === 0) {
+				// If the each block isn't inert and an item has an effect that is already inert,
+				// skip over adding it to our seen Set as the item is already being handled
+				if (is_inert || (current.e.f & INERT) === 0) {
 					(seen ??= new Set()).add(current);
 				}
 				stashed.push(current);
@@ -415,8 +417,8 @@ function reconcile(array, state, anchor, render_fn, flags, get_key) {
 		var to_destroy = seen === undefined ? [] : array_from(seen);
 
 		while (current !== null) {
-			// Inert effects are currently outroing and will be removed once the transition is finished
-			if ((current.e.f & INERT) === 0) {
+			// If the each block isn't inert, then inert effects are currently outroing and will be removed once the transition is finished
+			if (is_inert || (current.e.f & INERT) === 0) {
 				to_destroy.push(current);
 			}
 			current = current.next;
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index daf28eeec2..66b489cf54 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -577,7 +577,6 @@ export function resume_effect(effect) {
  */
 function resume_children(effect, local) {
 	if ((effect.f & INERT) === 0) return;
-	effect.f ^= INERT;
 
 	// If a dependency of this effect changed while it was paused,
 	// apply the change now
@@ -585,6 +584,10 @@ function resume_children(effect, local) {
 		update_effect(effect);
 	}
 
+	// Ensure we toggle the flag after possibly updating the effect so that
+	// each block logic can correctly operate on inert items
+	effect.f ^= INERT;
+
 	var child = effect.first;
 
 	while (child !== null) {
diff --git a/packages/svelte/tests/runtime-runes/samples/transition-each-3/_config.js b/packages/svelte/tests/runtime-runes/samples/transition-each-3/_config.js
new file mode 100644
index 0000000000..ebacf8e8b8
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/transition-each-3/_config.js
@@ -0,0 +1,31 @@
+import { flushSync } from '../../../../src/index-client.js';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, raf, target }) {
+		assert.htmlEqual(
+			target.innerHTML,
+			'<button>Toggle</button><div><div>1</div><div>2</div><div>3</div></div>'
+		);
+
+		const btn1 = target.querySelector('button');
+		btn1?.click();
+		flushSync();
+		raf.tick(250);
+
+		assert.htmlEqual(
+			target.innerHTML,
+			'<button>Toggle</button><div style="opacity: 0.5;"><div>1</div><div>2</div><div>3</div></div>'
+		);
+
+		await Promise.resolve();
+
+		flushSync();
+		raf.tick(500);
+
+		assert.htmlEqual(
+			target.innerHTML,
+			'<button>Toggle</button><div style=""><div>3</div><div>4</div></div>'
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/transition-each-3/main.svelte b/packages/svelte/tests/runtime-runes/samples/transition-each-3/main.svelte
new file mode 100644
index 0000000000..e2ae300dc9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/transition-each-3/main.svelte
@@ -0,0 +1,28 @@
+<script>
+	function fade(_) {
+		return {
+			duration: 500,
+			css: t => `opacity: ${t}`,
+		}
+	}
+
+	let toggle = $state(true);
+	let items = $state([ 1, 2, 3 ]);
+
+	const handle_toggle = async () => {
+		toggle = false;
+		await Promise.resolve();
+		items = [3, 4];
+		toggle = true;
+	};
+</script>
+
+<button onclick={handle_toggle}>Toggle</button>
+
+{#if toggle}
+	<div transition:fade>
+		{#each items as item (item)}
+			<div>{item}</div>
+		{/each}
+	</div>
+{/if}

From d93ad3ba1e8c28c2facaec49e19d2ac1ed577e9f Mon Sep 17 00:00:00 2001
From: FoHoOV <53280503+FoHoOV@users.noreply.github.com>
Date: Thu, 31 Oct 2024 14:55:49 +0330
Subject: [PATCH 072/404] feat: add `ComponentExports` utility type (#13441)

Safer/clearer/backwards/forward-compatibale way to reference them

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/rotten-cups-float.md          |  5 +++++
 packages/svelte/src/index.d.ts           | 20 ++++++++++++++++++
 packages/svelte/tests/types/component.ts | 26 +++++++++++++++++++++++-
 packages/svelte/types/index.d.ts         | 20 ++++++++++++++++++
 4 files changed, 70 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/rotten-cups-float.md

diff --git a/.changeset/rotten-cups-float.md b/.changeset/rotten-cups-float.md
new file mode 100644
index 0000000000..e58d4f26df
--- /dev/null
+++ b/.changeset/rotten-cups-float.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: provide `ComponentExports` utility type
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index 5130721cbe..262337ef0a 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -237,6 +237,26 @@ export type ComponentProps<Comp extends SvelteComponent | Component<any, any>> =
 			? Props
 			: never;
 
+/**
+ * Convenience type to get the properties that given component exports.
+ *
+ * Example: Typing the `bind:this` for a component named `MyComponent`
+ * ```
+ * <script lang="ts">
+ * 	import MyComponent from '$lib/component';
+ * 	let component: ComponentExports<typeof MyComponent> | undefined = undefined;
+ * <script>
+ *
+ * <MyComponent bind:this={component} />
+ * ```
+ */
+export type ComponentExports<TComponent extends Component<any, any> | typeof SvelteComponent<any>> =
+	TComponent extends typeof SvelteComponent<any>
+		? InstanceType<TComponent>
+		: TComponent extends Component<any, infer TExports>
+			? TExports
+			: never;
+
 /**
  * @deprecated This type is obsolete when working with the new `Component` type.
  *
diff --git a/packages/svelte/tests/types/component.ts b/packages/svelte/tests/types/component.ts
index 06749e9937..f439d3ea5d 100644
--- a/packages/svelte/tests/types/component.ts
+++ b/packages/svelte/tests/types/component.ts
@@ -7,7 +7,8 @@ import {
 	mount,
 	hydrate,
 	type Component,
-	type ComponentInternals
+	type ComponentInternals,
+	type ComponentExports
 } from 'svelte';
 import { render } from 'svelte/server';
 
@@ -180,6 +181,16 @@ render(NewComponent, {
 	}
 });
 
+const newComponentExports: ComponentExports<typeof NewComponent> = {
+	anExport: '',
+	$$events_def: null as any,
+	$$prop_def: null as any,
+	$$slot_def: null as any,
+	$set: null as any,
+	$destroy: null as any,
+	$on: null as any
+};
+
 // --------------------------------------------------------------------------- interop
 
 const AsLegacyComponent = asClassComponent(newComponent);
@@ -337,6 +348,19 @@ render(functionComponent, {
 	}
 });
 
+const functionComponentExports: ComponentExports<typeof functionComponent> = {
+	foo: 'bar',
+	// @ts-expect-error
+	x: ''
+};
+
+type AdhocFunctionComponent = (a: unknown, b: { a: true }) => { foo: string };
+const adhocFunctionComponentExport: ComponentExports<AdhocFunctionComponent> = {
+	foo: 'bar',
+	// @ts-expect-error
+	x: ''
+};
+
 // --------------------------------------------------------------------------- *.svelte components
 
 // import from a nonexistent file to trigger the declare module '*.svelte' in ambient.d.ts
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index b4da4c79b8..7ffa022060 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -234,6 +234,26 @@ declare module 'svelte' {
 				? Props
 				: never;
 
+	/**
+	 * Convenience type to get the properties that given component exports.
+	 *
+	 * Example: Typing the `bind:this` for a component named `MyComponent`
+	 * ```
+	 * <script lang="ts">
+	 * 	import MyComponent from '$lib/component';
+	 * 	let component: ComponentExports<typeof MyComponent> | undefined = undefined;
+	 * <script>
+	 *
+	 * <MyComponent bind:this={component} />
+	 * ```
+	 */
+	export type ComponentExports<TComponent extends Component<any, any> | typeof SvelteComponent<any>> =
+		TComponent extends typeof SvelteComponent<any>
+			? InstanceType<TComponent>
+			: TComponent extends Component<any, infer TExports>
+				? TExports
+				: never;
+
 	/**
 	 * @deprecated This type is obsolete when working with the new `Component` type.
 	 *

From 4715dfaad2562bd9074d3ff79fd775aeee4dc0a0 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 31 Oct 2024 12:59:49 +0100
Subject: [PATCH 073/404] feat: migrate `Component` to `ComponentExports<typeof
 Component>` in TS (#13656)

Closes #13491

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/new-parrots-pay.md                 |  5 +++
 packages/svelte/src/compiler/migrate/index.js | 37 ++++++++++++++++---
 .../samples/component-type/input.svelte       | 18 +++++++++
 .../samples/component-type/output.svelte      | 22 +++++++++++
 4 files changed, 77 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/new-parrots-pay.md
 create mode 100644 packages/svelte/tests/migrate/samples/component-type/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/component-type/output.svelte

diff --git a/.changeset/new-parrots-pay.md b/.changeset/new-parrots-pay.md
new file mode 100644
index 0000000000..3dbcc9580a
--- /dev/null
+++ b/.changeset/new-parrots-pay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: migrate `Component` to `ComponentExports<typeof Component>` in TS
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index ee5abc8853..3e47bf8167 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -1,5 +1,5 @@
 /** @import { VariableDeclarator, Node, Identifier, AssignmentExpression, LabeledStatement, ExpressionStatement } from 'estree' */
-/** @import { Visitors } from 'zimmerframe' */
+/** @import { Visitors, Context } from 'zimmerframe' */
 /** @import { ComponentAnalysis } from '../phases/types.js' */
 /** @import { Scope, ScopeRoot } from '../phases/scope.js' */
 /** @import { AST, Binding, SvelteNode, ValidatedCompileOptions } from '#compiler' */
@@ -398,6 +398,8 @@ export function migrate(source, { filename, use_ts } = {}) {
 	}
 }
 
+/** @typedef {SvelteNode | { type: "TSTypeReference", typeName: Identifier, start: number, end: number }} ASTNode  */
+
 /**
  * @typedef {{
  *  scope: Scope;
@@ -416,11 +418,12 @@ export function migrate(source, { filename, use_ts } = {}) {
  *  derived_components: Map<string, string>;
  * 	derived_labeled_statements: Set<LabeledStatement>;
  *  has_svelte_self: boolean;
+ *  migrate_prop_component_type?: boolean;
  *  uses_ts: boolean;
  * }} State
  */
 
-/** @type {Visitors<SvelteNode, State>} */
+/** @type {Visitors<ASTNode, State>} */
 const instance_script = {
 	_(node, { state, next }) {
 		// @ts-expect-error
@@ -437,8 +440,27 @@ const instance_script = {
 		}
 		next();
 	},
-	Identifier(node, { state, path }) {
+	TSTypeReference(node, { state, path }) {
+		if (state.analysis.runes) return;
+		if (node.typeName.type === 'Identifier') {
+			const binding = state.scope.get(node.typeName.name);
+			if (
+				binding &&
+				binding.declaration_kind === 'import' &&
+				binding.initial?.type === 'ImportDeclaration' &&
+				binding.initial.source.value?.toString().endsWith('.svelte')
+			) {
+				state.str.overwrite(
+					node.start,
+					node.end,
+					`import('svelte').ComponentExports<typeof ${state.str.original.substring(node.start, node.end)}>`
+				);
+			}
+		}
+	},
+	Identifier(node, { state, path, next }) {
 		handle_identifier(node, state, path);
+		next();
 	},
 	ImportDeclaration(node, { state }) {
 		state.props_insertion_point = node.end ?? state.props_insertion_point;
@@ -503,6 +525,8 @@ const instance_script = {
 			return;
 		}
 
+		next();
+
 		let nr_of_props = 0;
 
 		for (const declarator of node.declarations) {
@@ -1409,7 +1433,7 @@ function migrate_slot_usage(node, path, state) {
 /**
  * @param {VariableDeclarator} declarator
  * @param {State} state
- * @param {SvelteNode[]} path
+ * @param {ASTNode[]} path
  */
 function extract_type_and_comment(declarator, state, path) {
 	const str = state.str;
@@ -1432,7 +1456,10 @@ function extract_type_and_comment(declarator, state, path) {
 		while (str.original[start] === ' ') {
 			start++;
 		}
-		return { type: str.original.substring(start, declarator.id.typeAnnotation.end), comment };
+		return {
+			type: str.snip(start, declarator.id.typeAnnotation.end).toString(),
+			comment
+		};
 	}
 
 	let cleaned_comment_arr = comment
diff --git a/packages/svelte/tests/migrate/samples/component-type/input.svelte b/packages/svelte/tests/migrate/samples/component-type/input.svelte
new file mode 100644
index 0000000000..7184f9f4d1
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/component-type/input.svelte
@@ -0,0 +1,18 @@
+<script lang="ts">
+	import Component from "./Component.svelte";
+	import type ComponentType from "./Component.svelte";
+
+	export let my_comp: Component;
+
+	export let my_component_type: ComponentType;
+
+	export function enhance(comp: Component, comp_type: ComponentType){
+		
+	}
+
+	let comp: Component | ComponentType | undefined = undefined;
+	
+	export const the_comp: Component | ComponentType = comp;
+</script>
+
+<Component bind:this={comp} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/component-type/output.svelte b/packages/svelte/tests/migrate/samples/component-type/output.svelte
new file mode 100644
index 0000000000..ab774e56ad
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/component-type/output.svelte
@@ -0,0 +1,22 @@
+<script lang="ts">
+	import Component from "./Component.svelte";
+	import type ComponentType from "./Component.svelte";
+
+
+	interface Props {
+		my_comp: import('svelte').ComponentExports<typeof Component>;
+		my_component_type: import('svelte').ComponentExports<typeof ComponentType>;
+	}
+
+	let { my_comp, my_component_type }: Props = $props();
+
+	export function enhance(comp: import('svelte').ComponentExports<typeof Component>, comp_type: import('svelte').ComponentExports<typeof ComponentType>){
+		
+	}
+
+	let comp: import('svelte').ComponentExports<typeof Component> | import('svelte').ComponentExports<typeof ComponentType> | undefined = $state(undefined);
+	
+	export const the_comp: import('svelte').ComponentExports<typeof Component> | import('svelte').ComponentExports<typeof ComponentType> = comp;
+</script>
+
+<Component bind:this={comp} />
\ No newline at end of file

From ca58039e3ee44880aefd882f5ef2a1be05d7a9e4 Mon Sep 17 00:00:00 2001
From: Abu <42287254+Anyass3@users.noreply.github.com>
Date: Thu, 31 Oct 2024 12:20:57 +0000
Subject: [PATCH 074/404] docs: fix type (#14064)

this slot name should be `footer` instead it was `header`
---
 documentation/docs/07-misc/07-v5-migration-guide.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index 1624755a6b..093ec5b86b 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -376,7 +376,7 @@ If you wanted multiple UI placeholders, you had to use named slots. In Svelte 5,
 </main>
 
 <footer>
-	---<slot name="header" />---
+	---<slot name="footer" />---
 	+++{@render footer()}+++
 </footer>
 ```

From 4f80ab6da6a0bfe64c4a0d125ba0619461809ac6 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 31 Oct 2024 14:47:53 +0100
Subject: [PATCH 075/404] fix: allow `warningFilter` option for `compileModule`
 (#14066)

fixes #14012
---
 .changeset/curvy-melons-knock.md                 | 5 +++++
 packages/svelte/src/compiler/validate-options.js | 6 +++---
 2 files changed, 8 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/curvy-melons-knock.md

diff --git a/.changeset/curvy-melons-knock.md b/.changeset/curvy-melons-knock.md
new file mode 100644
index 0000000000..dcf158b4ee
--- /dev/null
+++ b/.changeset/curvy-melons-knock.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: allow `warningFilter` option for `compileModule`
diff --git a/packages/svelte/src/compiler/validate-options.js b/packages/svelte/src/compiler/validate-options.js
index c84fdac8a7..9465cba77a 100644
--- a/packages/svelte/src/compiler/validate-options.js
+++ b/packages/svelte/src/compiler/validate-options.js
@@ -31,7 +31,9 @@ const common = {
 		}
 
 		return input;
-	})
+	}),
+
+	warningFilter: fun(() => true)
 };
 
 export const validate_module_options =
@@ -106,8 +108,6 @@ export const validate_component_options =
 
 			hmr: boolean(false),
 
-			warningFilter: fun(() => true),
-
 			sourcemap: validator(undefined, (input) => {
 				// Source maps can take on a variety of values, including string, JSON, map objects from magic-string and source-map,
 				// so there's no good way to check type validity here

From 2784fb19f3f38963b9c5e7d0fbcb7182fd5d589b Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 11:37:30 -0400
Subject: [PATCH 076/404] Revert "feat: add `ComponentExports` utility type
 (#13441)" (#14069)

This reverts commit d93ad3ba1e8c28c2facaec49e19d2ac1ed577e9f.
---
 .changeset/rotten-cups-float.md          |  5 -----
 packages/svelte/src/index.d.ts           | 20 ------------------
 packages/svelte/tests/types/component.ts | 26 +-----------------------
 packages/svelte/types/index.d.ts         | 20 ------------------
 4 files changed, 1 insertion(+), 70 deletions(-)
 delete mode 100644 .changeset/rotten-cups-float.md

diff --git a/.changeset/rotten-cups-float.md b/.changeset/rotten-cups-float.md
deleted file mode 100644
index e58d4f26df..0000000000
--- a/.changeset/rotten-cups-float.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: provide `ComponentExports` utility type
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index 262337ef0a..5130721cbe 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -237,26 +237,6 @@ export type ComponentProps<Comp extends SvelteComponent | Component<any, any>> =
 			? Props
 			: never;
 
-/**
- * Convenience type to get the properties that given component exports.
- *
- * Example: Typing the `bind:this` for a component named `MyComponent`
- * ```
- * <script lang="ts">
- * 	import MyComponent from '$lib/component';
- * 	let component: ComponentExports<typeof MyComponent> | undefined = undefined;
- * <script>
- *
- * <MyComponent bind:this={component} />
- * ```
- */
-export type ComponentExports<TComponent extends Component<any, any> | typeof SvelteComponent<any>> =
-	TComponent extends typeof SvelteComponent<any>
-		? InstanceType<TComponent>
-		: TComponent extends Component<any, infer TExports>
-			? TExports
-			: never;
-
 /**
  * @deprecated This type is obsolete when working with the new `Component` type.
  *
diff --git a/packages/svelte/tests/types/component.ts b/packages/svelte/tests/types/component.ts
index f439d3ea5d..06749e9937 100644
--- a/packages/svelte/tests/types/component.ts
+++ b/packages/svelte/tests/types/component.ts
@@ -7,8 +7,7 @@ import {
 	mount,
 	hydrate,
 	type Component,
-	type ComponentInternals,
-	type ComponentExports
+	type ComponentInternals
 } from 'svelte';
 import { render } from 'svelte/server';
 
@@ -181,16 +180,6 @@ render(NewComponent, {
 	}
 });
 
-const newComponentExports: ComponentExports<typeof NewComponent> = {
-	anExport: '',
-	$$events_def: null as any,
-	$$prop_def: null as any,
-	$$slot_def: null as any,
-	$set: null as any,
-	$destroy: null as any,
-	$on: null as any
-};
-
 // --------------------------------------------------------------------------- interop
 
 const AsLegacyComponent = asClassComponent(newComponent);
@@ -348,19 +337,6 @@ render(functionComponent, {
 	}
 });
 
-const functionComponentExports: ComponentExports<typeof functionComponent> = {
-	foo: 'bar',
-	// @ts-expect-error
-	x: ''
-};
-
-type AdhocFunctionComponent = (a: unknown, b: { a: true }) => { foo: string };
-const adhocFunctionComponentExport: ComponentExports<AdhocFunctionComponent> = {
-	foo: 'bar',
-	// @ts-expect-error
-	x: ''
-};
-
 // --------------------------------------------------------------------------- *.svelte components
 
 // import from a nonexistent file to trigger the declare module '*.svelte' in ambient.d.ts
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 7ffa022060..b4da4c79b8 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -234,26 +234,6 @@ declare module 'svelte' {
 				? Props
 				: never;
 
-	/**
-	 * Convenience type to get the properties that given component exports.
-	 *
-	 * Example: Typing the `bind:this` for a component named `MyComponent`
-	 * ```
-	 * <script lang="ts">
-	 * 	import MyComponent from '$lib/component';
-	 * 	let component: ComponentExports<typeof MyComponent> | undefined = undefined;
-	 * <script>
-	 *
-	 * <MyComponent bind:this={component} />
-	 * ```
-	 */
-	export type ComponentExports<TComponent extends Component<any, any> | typeof SvelteComponent<any>> =
-		TComponent extends typeof SvelteComponent<any>
-			? InstanceType<TComponent>
-			: TComponent extends Component<any, infer TExports>
-				? TExports
-				: never;
-
 	/**
 	 * @deprecated This type is obsolete when working with the new `Component` type.
 	 *

From 37049b4171ee3e5cf9bd1ee05fdb609cc6d47503 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 11:38:13 -0400
Subject: [PATCH 077/404] =?UTF-8?q?Revert=20"feat:=20migrate=20`Component`?=
 =?UTF-8?q?=20to=20`ComponentExports<typeof=20Component>`=20in=20=E2=80=A6?=
 =?UTF-8?q?"=20(#14070)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reverts commit 4715dfaad2562bd9074d3ff79fd775aeee4dc0a0.
---
 .changeset/new-parrots-pay.md                 |  5 ---
 packages/svelte/src/compiler/migrate/index.js | 37 +++----------------
 .../samples/component-type/input.svelte       | 18 ---------
 .../samples/component-type/output.svelte      | 22 -----------
 4 files changed, 5 insertions(+), 77 deletions(-)
 delete mode 100644 .changeset/new-parrots-pay.md
 delete mode 100644 packages/svelte/tests/migrate/samples/component-type/input.svelte
 delete mode 100644 packages/svelte/tests/migrate/samples/component-type/output.svelte

diff --git a/.changeset/new-parrots-pay.md b/.changeset/new-parrots-pay.md
deleted file mode 100644
index 3dbcc9580a..0000000000
--- a/.changeset/new-parrots-pay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: migrate `Component` to `ComponentExports<typeof Component>` in TS
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 3e47bf8167..ee5abc8853 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -1,5 +1,5 @@
 /** @import { VariableDeclarator, Node, Identifier, AssignmentExpression, LabeledStatement, ExpressionStatement } from 'estree' */
-/** @import { Visitors, Context } from 'zimmerframe' */
+/** @import { Visitors } from 'zimmerframe' */
 /** @import { ComponentAnalysis } from '../phases/types.js' */
 /** @import { Scope, ScopeRoot } from '../phases/scope.js' */
 /** @import { AST, Binding, SvelteNode, ValidatedCompileOptions } from '#compiler' */
@@ -398,8 +398,6 @@ export function migrate(source, { filename, use_ts } = {}) {
 	}
 }
 
-/** @typedef {SvelteNode | { type: "TSTypeReference", typeName: Identifier, start: number, end: number }} ASTNode  */
-
 /**
  * @typedef {{
  *  scope: Scope;
@@ -418,12 +416,11 @@ export function migrate(source, { filename, use_ts } = {}) {
  *  derived_components: Map<string, string>;
  * 	derived_labeled_statements: Set<LabeledStatement>;
  *  has_svelte_self: boolean;
- *  migrate_prop_component_type?: boolean;
  *  uses_ts: boolean;
  * }} State
  */
 
-/** @type {Visitors<ASTNode, State>} */
+/** @type {Visitors<SvelteNode, State>} */
 const instance_script = {
 	_(node, { state, next }) {
 		// @ts-expect-error
@@ -440,27 +437,8 @@ const instance_script = {
 		}
 		next();
 	},
-	TSTypeReference(node, { state, path }) {
-		if (state.analysis.runes) return;
-		if (node.typeName.type === 'Identifier') {
-			const binding = state.scope.get(node.typeName.name);
-			if (
-				binding &&
-				binding.declaration_kind === 'import' &&
-				binding.initial?.type === 'ImportDeclaration' &&
-				binding.initial.source.value?.toString().endsWith('.svelte')
-			) {
-				state.str.overwrite(
-					node.start,
-					node.end,
-					`import('svelte').ComponentExports<typeof ${state.str.original.substring(node.start, node.end)}>`
-				);
-			}
-		}
-	},
-	Identifier(node, { state, path, next }) {
+	Identifier(node, { state, path }) {
 		handle_identifier(node, state, path);
-		next();
 	},
 	ImportDeclaration(node, { state }) {
 		state.props_insertion_point = node.end ?? state.props_insertion_point;
@@ -525,8 +503,6 @@ const instance_script = {
 			return;
 		}
 
-		next();
-
 		let nr_of_props = 0;
 
 		for (const declarator of node.declarations) {
@@ -1433,7 +1409,7 @@ function migrate_slot_usage(node, path, state) {
 /**
  * @param {VariableDeclarator} declarator
  * @param {State} state
- * @param {ASTNode[]} path
+ * @param {SvelteNode[]} path
  */
 function extract_type_and_comment(declarator, state, path) {
 	const str = state.str;
@@ -1456,10 +1432,7 @@ function extract_type_and_comment(declarator, state, path) {
 		while (str.original[start] === ' ') {
 			start++;
 		}
-		return {
-			type: str.snip(start, declarator.id.typeAnnotation.end).toString(),
-			comment
-		};
+		return { type: str.original.substring(start, declarator.id.typeAnnotation.end), comment };
 	}
 
 	let cleaned_comment_arr = comment
diff --git a/packages/svelte/tests/migrate/samples/component-type/input.svelte b/packages/svelte/tests/migrate/samples/component-type/input.svelte
deleted file mode 100644
index 7184f9f4d1..0000000000
--- a/packages/svelte/tests/migrate/samples/component-type/input.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script lang="ts">
-	import Component from "./Component.svelte";
-	import type ComponentType from "./Component.svelte";
-
-	export let my_comp: Component;
-
-	export let my_component_type: ComponentType;
-
-	export function enhance(comp: Component, comp_type: ComponentType){
-		
-	}
-
-	let comp: Component | ComponentType | undefined = undefined;
-	
-	export const the_comp: Component | ComponentType = comp;
-</script>
-
-<Component bind:this={comp} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/component-type/output.svelte b/packages/svelte/tests/migrate/samples/component-type/output.svelte
deleted file mode 100644
index ab774e56ad..0000000000
--- a/packages/svelte/tests/migrate/samples/component-type/output.svelte
+++ /dev/null
@@ -1,22 +0,0 @@
-<script lang="ts">
-	import Component from "./Component.svelte";
-	import type ComponentType from "./Component.svelte";
-
-
-	interface Props {
-		my_comp: import('svelte').ComponentExports<typeof Component>;
-		my_component_type: import('svelte').ComponentExports<typeof ComponentType>;
-	}
-
-	let { my_comp, my_component_type }: Props = $props();
-
-	export function enhance(comp: import('svelte').ComponentExports<typeof Component>, comp_type: import('svelte').ComponentExports<typeof ComponentType>){
-		
-	}
-
-	let comp: import('svelte').ComponentExports<typeof Component> | import('svelte').ComponentExports<typeof ComponentType> | undefined = $state(undefined);
-	
-	export const the_comp: import('svelte').ComponentExports<typeof Component> | import('svelte').ComponentExports<typeof ComponentType> = comp;
-</script>
-
-<Component bind:this={comp} />
\ No newline at end of file

From 3b38bc2a7722de1d594df41736362d4bcdba4202 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 31 Oct 2024 11:41:47 -0400
Subject: [PATCH 078/404] Version Packages (#14052)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/curly-dogs-breathe.md |  5 -----
 .changeset/curvy-melons-knock.md |  5 -----
 .changeset/early-hounds-float.md |  5 -----
 .changeset/sour-feet-carry.md    |  5 -----
 .changeset/wild-parents-begin.md |  5 -----
 packages/svelte/CHANGELOG.md     | 14 ++++++++++++++
 packages/svelte/package.json     |  2 +-
 packages/svelte/src/version.js   |  2 +-
 8 files changed, 16 insertions(+), 27 deletions(-)
 delete mode 100644 .changeset/curly-dogs-breathe.md
 delete mode 100644 .changeset/curvy-melons-knock.md
 delete mode 100644 .changeset/early-hounds-float.md
 delete mode 100644 .changeset/sour-feet-carry.md
 delete mode 100644 .changeset/wild-parents-begin.md

diff --git a/.changeset/curly-dogs-breathe.md b/.changeset/curly-dogs-breathe.md
deleted file mode 100644
index 9409c38141..0000000000
--- a/.changeset/curly-dogs-breathe.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure each block inert items are disposed of if the each block is also inert
diff --git a/.changeset/curvy-melons-knock.md b/.changeset/curvy-melons-knock.md
deleted file mode 100644
index dcf158b4ee..0000000000
--- a/.changeset/curvy-melons-knock.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: allow `warningFilter` option for `compileModule`
diff --git a/.changeset/early-hounds-float.md b/.changeset/early-hounds-float.md
deleted file mode 100644
index 0a708c59e4..0000000000
--- a/.changeset/early-hounds-float.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure onMount correctly fires when new expressions are used
diff --git a/.changeset/sour-feet-carry.md b/.changeset/sour-feet-carry.md
deleted file mode 100644
index 6e09bac7f2..0000000000
--- a/.changeset/sour-feet-carry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: wrap `:id`, `:where``:not` and `:has` with `:global` during migration
diff --git a/.changeset/wild-parents-begin.md b/.changeset/wild-parents-begin.md
deleted file mode 100644
index ac98fa0e3e..0000000000
--- a/.changeset/wild-parents-begin.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure custom element attribute/prop changes are in their own context
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 1a25f6dc4a..010a1c8e0f 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,19 @@
 # svelte
 
+## 5.1.7
+
+### Patch Changes
+
+- fix: ensure each block inert items are disposed of if the each block is also inert ([#13930](https://github.com/sveltejs/svelte/pull/13930))
+
+- fix: allow `warningFilter` option for `compileModule` ([#14066](https://github.com/sveltejs/svelte/pull/14066))
+
+- fix: ensure onMount correctly fires when new expressions are used ([#14049](https://github.com/sveltejs/svelte/pull/14049))
+
+- fix: wrap `:id`, `:where``:not` and `:has` with `:global` during migration ([#13850](https://github.com/sveltejs/svelte/pull/13850))
+
+- fix: ensure custom element attribute/prop changes are in their own context ([#14016](https://github.com/sveltejs/svelte/pull/14016))
+
 ## 5.1.6
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 3612e4e67a..53e1f5e467 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.1.6",
+  "version": "5.1.7",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index de8344ad66..a17065e9e9 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.1.6';
+export const VERSION = '5.1.7';
 export const PUBLIC_VERSION = '5';

From 2bdc3d401f8bce90ff92d8cd1d34c25f61293d7d Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 31 Oct 2024 17:16:06 +0000
Subject: [PATCH 079/404] fix: ensure compiler statements are correctly
 included (#14074)

Fixes #14068 and fixes #14071
---
 .changeset/nice-peas-lay.md                           |  5 +++++
 .../3-transform/client/visitors/RegularElement.js     |  1 +
 .../runtime-runes/samples/snippet-ref/_config.js      |  8 ++++++++
 .../runtime-runes/samples/snippet-ref/main.svelte     | 11 +++++++++++
 4 files changed, 25 insertions(+)
 create mode 100644 .changeset/nice-peas-lay.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-ref/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-ref/main.svelte

diff --git a/.changeset/nice-peas-lay.md b/.changeset/nice-peas-lay.md
new file mode 100644
index 0000000000..f37f92231b
--- /dev/null
+++ b/.changeset/nice-peas-lay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure compiler statements are correctly included
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 bd881e0f76..6ef29b621f 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
@@ -401,6 +401,7 @@ export function RegularElement(node, context) {
 		context.state.init.push(
 			b.block([
 				...child_state.init,
+				...element_state.init,
 				child_state.update.length > 0 ? build_render_statement(child_state.update) : b.empty,
 				...child_state.after_update,
 				...element_state.after_update
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-ref/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-ref/_config.js
new file mode 100644
index 0000000000..9dc0bd3bd5
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-ref/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true // Render in dev mode to check that the validation error is not thrown
+	},
+	html: `<form></form>\nundefined`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-ref/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-ref/main.svelte
new file mode 100644
index 0000000000..7e4e6fd0aa
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-ref/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	let thisBug;
+</script>
+
+<form bind:this={thisBug}>
+	{#snippet Bug()}
+		cool
+	{/snippet}
+</form>
+
+{typeof thisBug}

From b0d255aefe6e5071c0cde23285ff0e89eec23080 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 31 Oct 2024 18:18:06 +0100
Subject: [PATCH 080/404] Version Packages (#14075)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/nice-peas-lay.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/nice-peas-lay.md

diff --git a/.changeset/nice-peas-lay.md b/.changeset/nice-peas-lay.md
deleted file mode 100644
index f37f92231b..0000000000
--- a/.changeset/nice-peas-lay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure compiler statements are correctly included
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 010a1c8e0f..ac474979c6 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.1.8
+
+### Patch Changes
+
+- fix: ensure compiler statements are correctly included ([#14074](https://github.com/sveltejs/svelte/pull/14074))
+
 ## 5.1.7
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 53e1f5e467..394f943894 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.1.7",
+  "version": "5.1.8",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index a17065e9e9..6386be520d 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.1.7';
+export const VERSION = '5.1.8';
 export const PUBLIC_VERSION = '5';

From 0ed914b2e54dd14df77f672d4d3300bc80f200af Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 14:10:47 -0400
Subject: [PATCH 081/404] docs: improve lazy import example (#14076)

* docs: improve lazy import example

* Update documentation/docs/03-template-syntax/05-await.md
---
 documentation/docs/03-template-syntax/05-await.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/03-template-syntax/05-await.md b/documentation/docs/03-template-syntax/05-await.md
index 06e9bdd540..842b3c7e32 100644
--- a/documentation/docs/03-template-syntax/05-await.md
+++ b/documentation/docs/03-template-syntax/05-await.md
@@ -69,11 +69,11 @@ Similarly, if you only want to show the error state, you can omit the `then` blo
 {/await}
 ```
 
-> [!NOTE] You can use `#await` to render dynamic components with the help of the `import()` function:
+> [!NOTE] You can use `#await` with [`import(...)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import) to render components lazily:
 >
 > ```svelte
-> {#await import('./Component.svelte') then Component}
-> 	<Component.default />
+> {#await import('./Component.svelte') then { default: Component }}
+> 	<Component />
 > {/await}
 > ```
 

From 58b1540ddc52e52215eb41e20db58c6a796cc329 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 31 Oct 2024 18:36:21 +0000
Subject: [PATCH 082/404] fix: ensure transitions are applied to nested
 elements (#14080)

---
 .changeset/modern-adults-lay.md               |  5 ++++
 .../src/compiler/phases/2-analyze/index.js    |  2 ++
 .../2-analyze/visitors/TransitionDirective.js | 14 +++++++++++
 .../transition-static-subtree/_config.js      | 23 +++++++++++++++++++
 .../transition-static-subtree/main.svelte     | 18 +++++++++++++++
 5 files changed, 62 insertions(+)
 create mode 100644 .changeset/modern-adults-lay.md
 create mode 100644 packages/svelte/src/compiler/phases/2-analyze/visitors/TransitionDirective.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/transition-static-subtree/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/transition-static-subtree/main.svelte

diff --git a/.changeset/modern-adults-lay.md b/.changeset/modern-adults-lay.md
new file mode 100644
index 0000000000..9caa3962af
--- /dev/null
+++ b/.changeset/modern-adults-lay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure transitions are applied to nested elements
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 89c2e19c3f..f5a31d09a7 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -63,6 +63,7 @@ import { SvelteWindow } from './visitors/SvelteWindow.js';
 import { TaggedTemplateExpression } from './visitors/TaggedTemplateExpression.js';
 import { Text } from './visitors/Text.js';
 import { TitleElement } from './visitors/TitleElement.js';
+import { TransitionDirective } from './visitors/TransitionDirective.js';
 import { UpdateExpression } from './visitors/UpdateExpression.js';
 import { UseDirective } from './visitors/UseDirective.js';
 import { VariableDeclarator } from './visitors/VariableDeclarator.js';
@@ -172,6 +173,7 @@ const visitors = {
 	SvelteWindow,
 	TaggedTemplateExpression,
 	Text,
+	TransitionDirective,
 	TitleElement,
 	UpdateExpression,
 	UseDirective,
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/TransitionDirective.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/TransitionDirective.js
new file mode 100644
index 0000000000..c218f741c3
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/TransitionDirective.js
@@ -0,0 +1,14 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+
+import { mark_subtree_dynamic } from './shared/fragment.js';
+
+/**
+ * @param {AST.TransitionDirective} node
+ * @param {Context} context
+ */
+export function TransitionDirective(node, context) {
+	mark_subtree_dynamic(context.path);
+
+	context.next();
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/_config.js b/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/_config.js
new file mode 100644
index 0000000000..99563ef959
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/_config.js
@@ -0,0 +1,23 @@
+import { flushSync } from '../../../../src/index-client.js';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, raf, target }) {
+		assert.htmlEqual(target.innerHTML, '<button>Toggle</button><div><span>123</span></div>');
+
+		const btn1 = target.querySelector('button');
+		btn1?.click();
+		flushSync();
+		raf.tick(250);
+
+		assert.htmlEqual(
+			target.innerHTML,
+			'<button>Toggle</button><div><span style="opacity: 0.5;">123</span></div>'
+		);
+
+		flushSync();
+		raf.tick(500);
+
+		assert.htmlEqual(target.innerHTML, '<button>Toggle</button>');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/main.svelte b/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/main.svelte
new file mode 100644
index 0000000000..4a15e15699
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/transition-static-subtree/main.svelte
@@ -0,0 +1,18 @@
+<script>
+	function fade(_) {
+		return {
+			duration: 500,
+			css: t => `opacity: ${t}`,
+		}
+	}
+
+	let visible = $state(true);
+</script>
+
+<button onclick={() => visible = !visible}>Toggle</button>
+
+{#if visible}
+	<div>
+		<span transition:fade>123</span>
+	</div>
+{/if}

From 9cd476881dfec0a2bf6d59c28c233e79d6548946 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 14:36:54 -0400
Subject: [PATCH 083/404] fix props docs (#14079)

---
 documentation/docs/02-runes/05-$props.md | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/documentation/docs/02-runes/05-$props.md b/documentation/docs/02-runes/05-$props.md
index 17e9b3625f..58e9b36f8e 100644
--- a/documentation/docs/02-runes/05-$props.md
+++ b/documentation/docs/02-runes/05-$props.md
@@ -91,17 +91,17 @@ References to a prop inside a component update when the prop itself updates —
 </button>
 ```
 
-Prop variables are not automatically deeply reactive. What happens when mutating one of their properties depends on what the parent passed in. For example if the parent passed a non-reactive POJO as a prop, setting a property of that object in the child will not cause the component to update ([demo](/playground/untitled#H4sIAAAAAAAAE3VPS07DMBC9yshCaiuqBLYhjoQ4Q1eEReJOVIMztuJJBbJ8d-IkEqXQ5bx53yCo6VEU4kCs2eBR7EWnDXpRvAbBXy79EjDhK_PZucyf0XDC2sbjf7iyxEg82YjSq0E7rmqqWffODgwvJ22O0A22h02Wz9cq3TzVVOY_CioXrm3fUbEMQdmRuICHGCGvpiDGTxYFDyPG_Y3Cl_6_K199bpQ2yBDWBhBBwp0brPPb3Z-u7chsCSwpo9WHDNsdyApCMslzODUeyAJ23WSUsMUymyfBvYTHmmKcI2e9LyBcUmKKWyKulr_Fb2Z_SHPIAQAA)):
+While you can temporarily _reassign_ props, you should not _mutate_ props unless they are [bindable]($bindable).
+
+If the prop is a regular object, the mutation will have no effect ([demo](/playground/untitled#H4sIAAAAAAAAE3WQwU7DMBBEf2W1QmorQgJXk0RC3PkBwiExG9WQrC17U4Es_ztKUkQp9OjxzM7bjcjtSKjwyfKNp1aLORA4b13ADHszUED1HFE-3eyaBcy-Mw_O5eFAg8xa1wb6T9eWhVgCKiyD9sZJ3XAjZnTWCzzuzfAKvbcjbPJieR2jm_uGy-InweXqtd0baaliBG0nFgW3kBIUNWYo9CGoxE-UsgvIpw2_oc9-LmAPJBCPDJCggqvlVtvdH9puErEMlvVg9HsVtzuoaojzkKKAfRuALVDfk5ZZW0fmy05wXcFdwyktlUs-KIinljTXrRVnm7-kL9dYLVbUAQAA)):
 
 ```svelte
 <!--- file: App.svelte --->
 <script>
 	import Child from './Child.svelte';
-
-	let object = $state({count: 0});
 </script>
 
-<Child {object} />
+<Child object={{ count: 0 }} />
 ```
 
 ```svelte
@@ -118,7 +118,7 @@ Prop variables are not automatically deeply reactive. What happens when mutating
 </button>
 ```
 
-However if the value passed in by the parent component is itself a deeply reactive state object, then it will be deeply reactive in the child, too ([demo](/playground/untitled#H4sIAAAAAAAAE3WQwU7DMBBEf2VlITUVVQLXkERC_YaeCIfE2aoujm3FGwqy_O_YcSug0KNnx7Nv1jHVjchKtlMkSOLANmwvJFpWvjhGnybOohD0s_PZmNy-o6So9Z3F_3SuFaGiEMMqyydhqGlVS2I0eiLYHoQcYD_pEVZ5sbzOX1dPwRaMEgl0f0ROUMOdpY4wc1zPikp48OvgqorvXFWlRJe-eCiawED4QaykaUa_udHl5-rfba4mN_pETHcB9RHVTNrY7C9gPxNpBVpxKfhb7bI11A24GFIUcBJSAu9mi0AHhKUo9Cj1CUjDbIbQP1rTpjzN72t4bJX3C8kSa8vLCZLFR4q0-eogr_4LN7sC9foBAAA=)):
+If the prop is a reactive state proxy, however, then mutations _will_ have an effect but you will see an [`ownership_invalid_mutation`](runtime-warnings#Client-warnings-ownership_invalid_mutation) warning, because the component is mutating state that does not 'belong' to it ([demo](/playground/untitled#H4sIAAAAAAAAE3WR0U7DMAxFf8VESBuiauG1WycheOEbKA9p67FA6kSNszJV-XeUZhMw2GN8r-1znUmQ7FGU4pn2UqsOes-SlSGRia3S6ET5Mgk-2OiJBZGdOh6szd0eNcdaIx3-V28NMRI7UYq1awdleVNTzaq3ZmB43CndwXYwPSzyYn4dWxermqJRI4Np3rFlqODasWRcTtAaT1zCHYSbVU3r4nsyrdPMKTUFKDYiE4yfLEoePIbsQpqfy3_nOVMuJIqg0wk1RFg7GOuWfwEbz2wIDLVatR_VtLyBagNTHFIUMCqtoZXeIfAOU1JoUJsR2IC3nWTMjt7GM4yKdyBhlAMpesvhydCC0y_i0ZagHByMh26WzUhXUUxKnpbcVnBfUwhznJnNlac7JkuIURL-2VVfwxflyrWcSQIAAA==)):
 
 ```svelte
 <!--- file: App.svelte --->
@@ -138,20 +138,23 @@ However if the value passed in by the parent component is itself a deeply reacti
 </script>
 
 <button onclick={() => {
-	// will cause the count below to update
+	// will cause the count below to update,
+	// but with a warning. Don't mutate
+	// objects you don't own!
 	object.count += 1
 }}>
 	clicks: {object.count}
 </button>
 ```
 
-The fallback value of a prop not declared with `$bindable` is treated like a non-reactive POJO, and therefore also doesn't update the component when mutating its properties.
+The fallback value of a prop not declared with `$bindable` is left untouched — it is not turned into a reactive state proxy — meaning mutations will not cause updates ([demo](/playground/untitled#H4sIAAAAAAAAE3WQwU7DMBBEf2VkIbUVoYFraCIh7vwA4eC4G9Wta1vxpgJZ_nfkBEQp9OjxzOzTRGHlkUQlXpy9G0gq1idCL43ppDrAD84HUYheGwqieo2CP3y2Z0EU3-En79fhRIaz1slA_-nKWSbLQVRiE9SgPTetbVkfvRsYzztttugHd8RiXU6vr-jisbWb8idhN7O3bEQhmN5ZVDyMlIorcOddv_Eufq4AGmJEuG5PilEjQrnRcoV7JCTUuJlGWq7-YHYjs7NwVhmtDnVcrlA3iLmzLLGTAdaB-j736h68Oxv-JM1I0AFjoG1OzPfX023c1nhobUoT39QeKsRzS8owM8DFTG_pE6dcVl70AQAA))
 
 ```svelte
 <!--- file: Child.svelte --->
 <script>
-	let { object = { count = 0 } } = $props();
+	let { object = { count: 0 } } = $props();
 </script>
+
 <button onclick={() => {
 	// has no effect if the fallback value is used
 	object.count += 1
@@ -160,7 +163,7 @@ The fallback value of a prop not declared with `$bindable` is treated like a non
 </button>
 ```
 
-In general, mutating props is discouraged, instead use callback props to make it easier to reason about state and changes to that state. If parent and child should share (and be allowed to mutate) the same object, then use the [$bindable]($bindable) rune.
+In summary: don't mutate props. Either use callback props to communicate changes, or — if parent and child should share the same object — use the [`$bindable`]($bindable) rune.
 
 ## Type safety
 

From e58c03b100c6b2cb0bbdcb50453082d40b4b9864 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 14:37:32 -0400
Subject: [PATCH 084/404] add link to sync-docs README (#14056)

---
 .github/workflows/sync-request.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/sync-request.yml b/.github/workflows/sync-request.yml
index a4147faf73..de2ce77692 100644
--- a/.github/workflows/sync-request.yml
+++ b/.github/workflows/sync-request.yml
@@ -1,3 +1,4 @@
+# https://github.com/sveltejs/svelte.dev/blob/main/apps/svelte.dev/scripts/sync-docs/README.md
 name: Sync request
 
 on:

From ffbd5c971e67e98a55745885ab01cb28c9b82228 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 31 Oct 2024 14:52:56 -0400
Subject: [PATCH 085/404] docs: fix runtime-warnings page (#14077)

* fix runtime-warnings page

* fix
---
 documentation/docs/98-reference/30-runtime-warnings.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/documentation/docs/98-reference/30-runtime-warnings.md b/documentation/docs/98-reference/30-runtime-warnings.md
index 3e040eb06f..edc5890ac0 100644
--- a/documentation/docs/98-reference/30-runtime-warnings.md
+++ b/documentation/docs/98-reference/30-runtime-warnings.md
@@ -2,10 +2,10 @@
 title: 'Runtime warnings'
 ---
 
-## Client errors
+## Client warnings
 
-@include .generated/client-errors.md
+@include .generated/client-warnings.md
 
-## Shared errors
+## Shared warnings
 
-@include .generated/shared-errors.md
+@include .generated/shared-warnings.md

From cf25930512417f4c3f15c2abade95c929569e484 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 31 Oct 2024 19:40:21 +0000
Subject: [PATCH 086/404] Version Packages (#14081)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/modern-adults-lay.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/modern-adults-lay.md

diff --git a/.changeset/modern-adults-lay.md b/.changeset/modern-adults-lay.md
deleted file mode 100644
index 9caa3962af..0000000000
--- a/.changeset/modern-adults-lay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure transitions are applied to nested elements
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index ac474979c6..0786d007f3 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.1.9
+
+### Patch Changes
+
+- fix: ensure transitions are applied to nested elements ([#14080](https://github.com/sveltejs/svelte/pull/14080))
+
 ## 5.1.8
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 394f943894..257d3924bf 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.1.8",
+  "version": "5.1.9",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 6386be520d..e6a9988e3a 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.1.8';
+export const VERSION = '5.1.9';
 export const PUBLIC_VERSION = '5';

From 2ab70041fd27801f9cf7f6bd1e59df7eb3b6c50a Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Thu, 31 Oct 2024 22:44:39 -0400
Subject: [PATCH 087/404] chore: mark markdown output from process-messages as
 generated (#13913)

* chore: mark markdown output from process-messages as generated

* regenerate
---
 .../98-reference/.generated/client-errors.md  |  2 ++
 .../.generated/client-warnings.md             |  2 ++
 .../98-reference/.generated/compile-errors.md |  2 ++
 .../.generated/compile-warnings.md            |  2 ++
 .../98-reference/.generated/server-errors.md  |  2 ++
 .../98-reference/.generated/shared-errors.md  |  2 ++
 .../.generated/shared-warnings.md             |  2 ++
 .../svelte/scripts/process-messages/index.js  | 22 ++++++++++---------
 8 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/documentation/docs/98-reference/.generated/client-errors.md b/documentation/docs/98-reference/.generated/client-errors.md
index 9879b67b33..90c9c1f9d1 100644
--- a/documentation/docs/98-reference/.generated/client-errors.md
+++ b/documentation/docs/98-reference/.generated/client-errors.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### bind_invalid_checkbox_value
 
 ```
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 743a47b67a..e9f1a88c3c 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### binding_property_non_reactive
 
 ```
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 3981822d84..b32bc6b89c 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### animation_duplicate
 
 ```
diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index e2ac86be2f..775e0681c9 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### a11y_accesskey
 
 ```
diff --git a/documentation/docs/98-reference/.generated/server-errors.md b/documentation/docs/98-reference/.generated/server-errors.md
index f325b5349a..8cf6727da9 100644
--- a/documentation/docs/98-reference/.generated/server-errors.md
+++ b/documentation/docs/98-reference/.generated/server-errors.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### lifecycle_function_unavailable
 
 ```
diff --git a/documentation/docs/98-reference/.generated/shared-errors.md b/documentation/docs/98-reference/.generated/shared-errors.md
index 1a2bcf8d2d..52ef9d5f88 100644
--- a/documentation/docs/98-reference/.generated/shared-errors.md
+++ b/documentation/docs/98-reference/.generated/shared-errors.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### invalid_default_snippet
 
 ```
diff --git a/documentation/docs/98-reference/.generated/shared-warnings.md b/documentation/docs/98-reference/.generated/shared-warnings.md
index 4ff3f89e6d..e9327e1e98 100644
--- a/documentation/docs/98-reference/.generated/shared-warnings.md
+++ b/documentation/docs/98-reference/.generated/shared-warnings.md
@@ -1,3 +1,5 @@
+<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
+
 ### dynamic_void_element_content
 
 ```
diff --git a/packages/svelte/scripts/process-messages/index.js b/packages/svelte/scripts/process-messages/index.js
index 3a4e9d8a4d..3360b24802 100644
--- a/packages/svelte/scripts/process-messages/index.js
+++ b/packages/svelte/scripts/process-messages/index.js
@@ -62,18 +62,20 @@ for (const category of fs.readdirSync('messages')) {
 
 	fs.writeFileSync(
 		`${DIR}/${category}.md`,
-		Object.entries(messages[category])
-			.map(([code, { messages, details }]) => {
-				const chunks = [`### ${code}`, ...messages.map((message) => '```\n' + message + '\n```')];
+		'<!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->\n\n' +
+			Object.entries(messages[category])
+				.map(([code, { messages, details }]) => {
+					const chunks = [`### ${code}`, ...messages.map((message) => '```\n' + message + '\n```')];
 
-				if (details) {
-					chunks.push(details);
-				}
+					if (details) {
+						chunks.push(details);
+					}
 
-				return chunks.join('\n\n');
-			})
-			.sort()
-			.join('\n\n') + '\n'
+					return chunks.join('\n\n');
+				})
+				.sort()
+				.join('\n\n') +
+			'\n'
 	);
 }
 

From 6a2c28c59091f93c483ed4a77d2eaf617d602ae8 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 1 Nov 2024 03:49:52 -0400
Subject: [PATCH 088/404] docs: tweak untrack description, provide an example
 of usage (#14085)

* docs: tweak untrack description, provide an example of usage

* link to untrack

* add derived docs too
---
 documentation/docs/02-runes/03-$derived.md     |  6 ++++++
 documentation/docs/02-runes/04-$effect.md      |  2 +-
 packages/svelte/src/internal/client/runtime.js | 12 +++++++++++-
 packages/svelte/types/index.d.ts               | 12 +++++++++++-
 4 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/02-runes/03-$derived.md b/documentation/docs/02-runes/03-$derived.md
index 77ab07a0a9..6b38f99746 100644
--- a/documentation/docs/02-runes/03-$derived.md
+++ b/documentation/docs/02-runes/03-$derived.md
@@ -45,3 +45,9 @@ Sometimes you need to create complex derivations that don't fit inside a short e
 ```
 
 In essence, `$derived(expression)` is equivalent to `$derived.by(() => expression)`.
+
+## Understanding dependencies
+
+Anything read synchronously inside the `$derived` expression (or `$derived.by` function body) is considered a _dependency_ of the derived state. When the state changes, the derived will be marked as _dirty_ and recalculated when it is next read.
+
+To exempt a piece of state from being treated as a dependency, use [`untrack`](svelte#untrack).
diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index 354869f35e..3515a6c4e4 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -2,7 +2,7 @@
 title: $effect
 ---
 
-Effects are what make your application _do things_. When Svelte runs an effect function, it tracks which pieces of state (and derived state) are accessed, and re-runs the function when that state later changes.
+Effects are what make your application _do things_. When Svelte runs an effect function, it tracks which pieces of state (and derived state) are accessed (unless accessed inside [`untrack`](svelte#untrack)), and re-runs the function when that state later changes.
 
 Most of the effects in a Svelte app are created by Svelte itself — they're the bits that update the text in `<h1>hello {name}!</h1>` when `name` changes, for example.
 
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 6bed3825c7..bd4d23dd15 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -831,7 +831,17 @@ export function invalidate_inner_signals(fn) {
 }
 
 /**
- * Use `untrack` to prevent something from being treated as an `$effect`/`$derived` dependency.
+ * When used inside a [`$derived`](https://svelte.dev/docs/svelte/$derived) or [`$effect`](https://svelte.dev/docs/svelte/$effect),
+ * any state read inside `fn` will not be treated as a dependency.
+ *
+ * ```ts
+ * $effect(() => {
+ *   // this will run when `data` changes, but not when `time` changes
+ *   save(data, {
+ *     timestamp: untrack(() => time)
+ *   });
+ * });
+ * ```
  * @template T
  * @param {() => T} fn
  * @returns {T}
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index b4da4c79b8..0fc0e7ad16 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -455,7 +455,17 @@ declare module 'svelte' {
 	 * */
 	export function tick(): Promise<void>;
 	/**
-	 * Use `untrack` to prevent something from being treated as an `$effect`/`$derived` dependency.
+	 * When used inside a [`$derived`](https://svelte.dev/docs/svelte/$derived) or [`$effect`](https://svelte.dev/docs/svelte/$effect),
+	 * any state read inside `fn` will not be treated as a dependency.
+	 *
+	 * ```ts
+	 * $effect(() => {
+	 *   // this will run when `data` changes, but not when `time` changes
+	 *   save(data, {
+	 *     timestamp: untrack(() => time)
+	 *   });
+	 * });
+	 * ```
 	 * */
 	export function untrack<T>(fn: () => T): T;
 	/**

From 7d11fa8da2f97be96fa9353bd28981d946b06903 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 13:19:52 +0100
Subject: [PATCH 089/404] fix: recognize all custom element prop definitions
 (#14084)

We didn't account for the `$props` rune being writtin in a way that makes some props unknown, and they would only be visible through the `customElement.props` definition. This changes the iteration to account for that and also adds a note to the documentation that you need to list out the properties explicitly.

fixes #13785
---
 .changeset/warm-eyes-protect.md               |  5 +++++
 .../docs/07-misc/04-custom-elements.md        |  2 ++
 .../3-transform/client/transform-client.js    | 20 +++++++++++++-----
 .../props-rune-attributes/_config.js          | 21 +++++++++++++++++++
 .../props-rune-attributes/main.svelte         | 14 +++++++++++++
 .../props-rune-attributes/my-widget.svelte    | 14 +++++++++++++
 6 files changed, 71 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/warm-eyes-protect.md
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/_config.js
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/main.svelte
 create mode 100644 packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/my-widget.svelte

diff --git a/.changeset/warm-eyes-protect.md b/.changeset/warm-eyes-protect.md
new file mode 100644
index 0000000000..fbb971f314
--- /dev/null
+++ b/.changeset/warm-eyes-protect.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: recognize all custom element prop definitions
diff --git a/documentation/docs/07-misc/04-custom-elements.md b/documentation/docs/07-misc/04-custom-elements.md
index 83874f2f5b..71c66f7edc 100644
--- a/documentation/docs/07-misc/04-custom-elements.md
+++ b/documentation/docs/07-misc/04-custom-elements.md
@@ -49,6 +49,8 @@ console.log(el.name);
 el.name = 'everybody';
 ```
 
+Note that you need to list out all properties explicitly, i.e. doing `let props = $props()` without declaring `props` in the [component options](#Component-options) means that Svelte can't know which props to expose as properties on the DOM element.
+
 ## Component lifecycle
 
 Custom elements are created from Svelte components using a wrapper approach. This means the inner Svelte component has no knowledge that it is a custom element. The custom element wrapper takes care of handling its lifecycle appropriately.
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 8369842e13..4daff53efb 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
@@ -561,17 +561,19 @@ export function client_component(analysis, options) {
 
 	if (analysis.custom_element) {
 		const ce = analysis.custom_element;
+		const ce_props = typeof ce === 'boolean' ? {} : ce.props || {};
 
 		/** @type {ESTree.Property[]} */
 		const props_str = [];
 
-		for (const [name, binding] of properties) {
-			const key = binding.prop_alias ?? name;
-			const prop_def = typeof ce === 'boolean' ? {} : ce.props?.[key] || {};
+		for (const [name, prop_def] of Object.entries(ce_props)) {
+			const binding = analysis.instance.scope.get(name);
+			const key = binding?.prop_alias ?? name;
+
 			if (
 				!prop_def.type &&
-				binding.initial?.type === 'Literal' &&
-				typeof binding.initial.value === 'boolean'
+				binding?.initial?.type === 'Literal' &&
+				typeof binding?.initial.value === 'boolean'
 			) {
 				prop_def.type = 'Boolean';
 			}
@@ -585,9 +587,17 @@ export function client_component(analysis, options) {
 					].filter(Boolean)
 				)
 			);
+
 			props_str.push(b.init(key, value));
 		}
 
+		for (const [name, binding] of properties) {
+			const key = binding.prop_alias ?? name;
+			if (ce_props[key]) continue;
+
+			props_str.push(b.init(key, b.object([])));
+		}
+
 		const slots_str = b.array([...analysis.slot_names.keys()].map((name) => b.literal(name)));
 		const accessors_str = b.array(
 			analysis.exports.map(({ name, alias }) => b.literal(alias ?? name))
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/_config.js
new file mode 100644
index 0000000000..04b49c5c00
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/_config.js
@@ -0,0 +1,21 @@
+import { test } from '../../assert';
+const tick = () => Promise.resolve();
+
+export default test({
+	async test({ assert, target }) {
+		target.innerHTML = '<custom-element foo-bar="1" bar="2" b-az="3"></custom-element>';
+		await tick();
+
+		/** @type {any} */
+		const el = target.querySelector('custom-element');
+
+		assert.htmlEqual(
+			el.shadowRoot.innerHTML,
+			`
+			<p>1</p>
+			<p>2</p>
+			<p>3</p>
+		`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/main.svelte b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/main.svelte
new file mode 100644
index 0000000000..bea04b1248
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/main.svelte
@@ -0,0 +1,14 @@
+<svelte:options
+	customElement={{
+		tag: "custom-element",
+		props: { foo: { attribute: 'foo-bar' } },
+	}}
+/>
+
+<script>
+	let { bar, 'b-az': baz, ...rest } = $props();
+</script>
+
+<p>{rest.foo}</p>
+<p>{bar}</p>
+<p>{baz}</p>
diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/my-widget.svelte b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/my-widget.svelte
new file mode 100644
index 0000000000..cdba7491f9
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/custom-elements-samples/props-rune-attributes/my-widget.svelte
@@ -0,0 +1,14 @@
+<svelte:options
+	customElement={{
+		tag: "my-widget",
+		props: { foo: { attribute: 'foo-bar' } },
+	}}
+/>
+
+<script>
+	let { bar, 'b-az': baz, ...rest } = $props();
+</script>
+
+<p>{rest.foo}</p>
+<p>{bar}</p>
+<p>{baz}</p>

From a315a14939fbbd2bf51564af77e4415eaacfab4a Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 12:52:32 +0000
Subject: [PATCH 090/404] fix: ensure video elements autoplay in safari
 (#14095)

---
 .changeset/empty-hairs-love.md                               | 5 +++++
 .../phases/3-transform/client/visitors/RegularElement.js     | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/empty-hairs-love.md

diff --git a/.changeset/empty-hairs-love.md b/.changeset/empty-hairs-love.md
new file mode 100644
index 0000000000..a56e6c6334
--- /dev/null
+++ b/.changeset/empty-hairs-love.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure video elements autoplay in safari
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 6ef29b621f..dafe1e74ae 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
@@ -61,11 +61,13 @@ export function RegularElement(node, context) {
 
 	const is_custom_element = is_custom_element_node(node);
 
-	if (is_custom_element) {
+	if (node.name === 'video' || is_custom_element) {
 		// cloneNode is faster, but it does not instantiate the underlying class of the
 		// custom element until the template is connected to the dom, which would
 		// cause problems when setting properties on the custom element.
 		// Therefore we need to use importNode instead, which doesn't have this caveat.
+		// Additionally, Webkit browsers need importNode for video elements for autoplay
+		// to work correctly.
 		context.state.metadata.context.template_needs_import_node = true;
 	}
 

From e7d68d8c10d4864cb4c58cd86f6076c187b22ec0 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 14:22:24 +0100
Subject: [PATCH 091/404] fix: pass along `anchor` in legacy class wrappers
 (#14100)

fixes #13832
---
 .changeset/silly-bulldogs-rest.md           | 5 +++++
 packages/svelte/src/legacy/legacy-client.js | 1 +
 2 files changed, 6 insertions(+)
 create mode 100644 .changeset/silly-bulldogs-rest.md

diff --git a/.changeset/silly-bulldogs-rest.md b/.changeset/silly-bulldogs-rest.md
new file mode 100644
index 0000000000..f92eb81575
--- /dev/null
+++ b/.changeset/silly-bulldogs-rest.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: pass along `anchor` in legacy class wrappers
diff --git a/packages/svelte/src/legacy/legacy-client.js b/packages/svelte/src/legacy/legacy-client.js
index 4148f3d1cd..c7684570bb 100644
--- a/packages/svelte/src/legacy/legacy-client.js
+++ b/packages/svelte/src/legacy/legacy-client.js
@@ -110,6 +110,7 @@ class Svelte4Component {
 
 		this.#instance = (options.hydrate ? hydrate : mount)(options.component, {
 			target: options.target,
+			anchor: options.anchor,
 			props,
 			context: options.context,
 			intro: options.intro ?? false,

From 535ea44b9da3042ddb887070a1467747421a4d6c Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 1 Nov 2024 12:08:04 -0400
Subject: [PATCH 092/404] chore: replace non-breaking spaces (#14098)

* replace nbsp in docs

* replace nbsp in test

* replace nbsp in types

* regenerate types
---
 documentation/docs/03-template-syntax/11-bind.md            | 2 +-
 documentation/docs/03-template-syntax/13-transition.md      | 3 +--
 .../docs/99-legacy/02-legacy-reactive-assignments.md        | 2 +-
 documentation/docs/99-legacy/40-legacy-component-api.md     | 2 +-
 packages/svelte/src/ambient.d.ts                            | 4 ++--
 .../samples/dynamic-element-store/main.svelte               | 6 +++---
 packages/svelte/types/index.d.ts                            | 4 ++--
 7 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/documentation/docs/03-template-syntax/11-bind.md b/documentation/docs/03-template-syntax/11-bind.md
index 86a725f2f9..4fe3e7c4a8 100644
--- a/documentation/docs/03-template-syntax/11-bind.md
+++ b/documentation/docs/03-template-syntax/11-bind.md
@@ -230,7 +230,7 @@ All visible elements have the following readonly bindings, measured with a `Resi
 bind:this={dom_node}
 ```
 
-To get a reference to a DOM node, use `bind:this`. The value will be `undefined` until the component is mounted — in other words, you should read it inside an effect or an event handler, but not during component initialisation:
+To get a reference to a DOM node, use `bind:this`. The value will be `undefined` until the component is mounted — in other words, you should read it inside an effect or an event handler, but not during component initialisation:
 
 ```svelte
 <script>
diff --git a/documentation/docs/03-template-syntax/13-transition.md b/documentation/docs/03-template-syntax/13-transition.md
index 51f1008209..51c11e8b34 100644
--- a/documentation/docs/03-template-syntax/13-transition.md
+++ b/documentation/docs/03-template-syntax/13-transition.md
@@ -68,7 +68,7 @@ transition = (node: HTMLElement, params: any, options: { direction: 'in' | 'out'
 
 Transitions can use custom functions. If the returned object has a `css` function, Svelte will generate keyframes for a [web animation](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).
 
-The `t` argument passed to `css` is a value between `0` and `1` after the `easing` function has been applied. _In_ transitions run from `0` to `1`, _out_ transitions run from `1` to `0` — in other words, `1` is the element's natural state, as though no transition had been applied. The `u` argument is equal to `1 - t`.
+The `t` argument passed to `css` is a value between `0` and `1` after the `easing` function has been applied. _In_ transitions run from `0` to `1`, _out_ transitions run from `1` to `0` — in other words, `1` is the element's natural state, as though no transition had been applied. The `u` argument is equal to `1 - t`.
 
 The function is called repeatedly _before_ the transition begins, with different `t` and `u` arguments.
 
@@ -169,4 +169,3 @@ An element with transitions will dispatch the following events in addition to an
 	</p>
 {/if}
 ```
-
diff --git a/documentation/docs/99-legacy/02-legacy-reactive-assignments.md b/documentation/docs/99-legacy/02-legacy-reactive-assignments.md
index 5f7c9da790..5abd481bfc 100644
--- a/documentation/docs/99-legacy/02-legacy-reactive-assignments.md
+++ b/documentation/docs/99-legacy/02-legacy-reactive-assignments.md
@@ -15,7 +15,7 @@ In legacy mode, any top-level statement (i.e. not inside a block or a function)
 	// when `a`, `b` or `sum` change
 	$: console.log(`${a} + ${b} = ${sum}`);
 
-	// this is a 'reactive assignment' — `sum` will be
+	// this is a 'reactive assignment' — `sum` will be
 	// recalculated when `a` or `b` change. It is
 	// not necessary to declare `sum` separately
 	$: sum = a + b;
diff --git a/documentation/docs/99-legacy/40-legacy-component-api.md b/documentation/docs/99-legacy/40-legacy-component-api.md
index 917e4d724b..a08f53951c 100644
--- a/documentation/docs/99-legacy/40-legacy-component-api.md
+++ b/documentation/docs/99-legacy/40-legacy-component-api.md
@@ -11,7 +11,7 @@ In Svelte 3 and 4, the API for interacting with a component is different than in
 const component = new Component(options);
 ```
 
-A client-side component — that is, a component compiled with `generate: 'dom'` (or the `generate` option left unspecified) is a JavaScript class.
+A client-side component — that is, a component compiled with `generate: 'dom'` (or the `generate` option left unspecified) is a JavaScript class.
 
 ```ts
 // @noErrors
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index 88879394ed..8a20a884ff 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -47,7 +47,7 @@ declare namespace $state {
 		| BigInt64Array
 		| BigUint64Array;
 
-	/** The things that `structuredClone` can handle — https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm */
+	/** The things that `structuredClone` can handle — https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm */
 	export type Cloneable =
 		| ArrayBuffer
 		| DataView
@@ -358,7 +358,7 @@ declare function $props(): any;
 declare function $bindable<T>(fallback?: T): T;
 
 /**
- * Inspects one or more values whenever they, or the properties they contain, change. Example:
+ * Inspects one or more values whenever they, or the properties they contain, change. Example:
  *
  * ```ts
  * $inspect(someValue, someOtherValue)
diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-store/main.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-store/main.svelte
index 84a577ecee..6a7952a404 100644
--- a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-store/main.svelte
+++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-store/main.svelte
@@ -1,6 +1,6 @@
 <script>
-  import { writable } from 'svelte/store';
-  const foo = writable('div');
+	import { writable } from 'svelte/store';
+	const foo = writable('div');
 </script>
 
-<svelte:element this={$foo}></svelte:element>
\ No newline at end of file
+<svelte:element this={$foo}></svelte:element>
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 0fc0e7ad16..0f08fabfcb 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -2354,7 +2354,7 @@ declare namespace $state {
 		| BigInt64Array
 		| BigUint64Array;
 
-	/** The things that `structuredClone` can handle — https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm */
+	/** The things that `structuredClone` can handle — https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm */
 	export type Cloneable =
 		| ArrayBuffer
 		| DataView
@@ -2665,7 +2665,7 @@ declare function $props(): any;
 declare function $bindable<T>(fallback?: T): T;
 
 /**
- * Inspects one or more values whenever they, or the properties they contain, change. Example:
+ * Inspects one or more values whenever they, or the properties they contain, change. Example:
  *
  * ```ts
  * $inspect(someValue, someOtherValue)

From 9883e7078cfedf67b12302b8e202519794293b3d Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 16:08:45 +0000
Subject: [PATCH 093/404] fix: ensure SvelteMap and SvelteSet work with
 generators in dev (#14103)

* fix: ensure SvelteMap and SvelteSet work with generators in dev

* add test

* better fix

* better fix

* better fix

* better fix
---
 .changeset/selfish-chicken-argue.md                |  5 +++++
 packages/svelte/src/reactivity/map.js              |  2 +-
 packages/svelte/src/reactivity/set.js              |  2 +-
 .../samples/svelte-set-generators/_config.js       |  9 +++++++++
 .../samples/svelte-set-generators/main.svelte      | 14 ++++++++++++++
 5 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/selfish-chicken-argue.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svelte-set-generators/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svelte-set-generators/main.svelte

diff --git a/.changeset/selfish-chicken-argue.md b/.changeset/selfish-chicken-argue.md
new file mode 100644
index 0000000000..32e0d0afef
--- /dev/null
+++ b/.changeset/selfish-chicken-argue.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure SvelteMap and SvelteSet work with generators in dev
diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js
index ae1bf47773..3fa2945ef0 100644
--- a/packages/svelte/src/reactivity/map.js
+++ b/packages/svelte/src/reactivity/map.js
@@ -22,7 +22,7 @@ export class SvelteMap extends Map {
 		super();
 
 		// If the value is invalid then the native exception will fire here
-		if (DEV) new Map(value);
+		if (DEV) value = new Map(value);
 
 		if (value) {
 			for (var [key, v] of value) {
diff --git a/packages/svelte/src/reactivity/set.js b/packages/svelte/src/reactivity/set.js
index 38723a0b9e..be0c2d2cf5 100644
--- a/packages/svelte/src/reactivity/set.js
+++ b/packages/svelte/src/reactivity/set.js
@@ -26,7 +26,7 @@ export class SvelteSet extends Set {
 		super();
 
 		// If the value is invalid then the native exception will fire here
-		if (DEV) new Set(value);
+		if (DEV) value = new Set(value);
 
 		if (value) {
 			for (var element of value) {
diff --git a/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/_config.js b/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/_config.js
new file mode 100644
index 0000000000..8c6279baa3
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: `1`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/main.svelte b/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/main.svelte
new file mode 100644
index 0000000000..632dc8a588
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svelte-set-generators/main.svelte
@@ -0,0 +1,14 @@
+<script>
+	import { SvelteSet } from 'svelte/reactivity';
+
+	function *generator() {
+		yield 1;
+	}
+
+	let gen = new SvelteSet(generator());
+</script>
+
+{#each gen as item}
+	{item}
+{/each}
+

From aac4cbd1f1c854cbc5e72d824538077a1234d07e Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 17:21:36 +0100
Subject: [PATCH 094/404] docs: note browser condition earlier (#14096)

* docs: note browser condition earlier

The browser condition is also necessary to test runes, so it makes sense to add it to the first occurence to the vite config. Also add a note about more fine-grained alias conditions.

Closes #13961

* Update documentation/docs/07-misc/02-testing.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/07-misc/02-testing.md | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/02-testing.md b/documentation/docs/07-misc/02-testing.md
index f0ed52a3c9..7609242471 100644
--- a/documentation/docs/07-misc/02-testing.md
+++ b/documentation/docs/07-misc/02-testing.md
@@ -21,9 +21,18 @@ Then adjust your `vite.config.js`:
 /// file: vite.config.js
 import { defineConfig } from +++'vitest/config'+++;
 
-export default defineConfig({ /* ... */ })
+export default defineConfig({
+	// ...
+	// Tell Vitest to use the `browser` entry points in `package.json` files, even though it's running in Node
+	resolve: process.env.VITEST
+		? {
+				conditions: ['browser']
+			}
+		: undefined
 ```
 
+> [!NOTE] If loading the browser version of all your packages is undesirable, because (for example) you also test backend libraries, [you may need to resort to an alias configuration](https://github.com/testing-library/svelte-testing-library/issues/222#issuecomment-1909993331)
+
 You can now write unit tests for code inside your `.js/.ts` files:
 
 ```js

From 82b87b361e2004b58f683be3c70d678ed8f29e59 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 1 Nov 2024 12:48:04 -0400
Subject: [PATCH 095/404] docs: fix syntax error (#14106)

---
 documentation/docs/07-misc/02-testing.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/documentation/docs/07-misc/02-testing.md b/documentation/docs/07-misc/02-testing.md
index 7609242471..1c3d4ba6e1 100644
--- a/documentation/docs/07-misc/02-testing.md
+++ b/documentation/docs/07-misc/02-testing.md
@@ -29,6 +29,7 @@ export default defineConfig({
 				conditions: ['browser']
 			}
 		: undefined
+});
 ```
 
 > [!NOTE] If loading the browser version of all your packages is undesirable, because (for example) you also test backend libraries, [you may need to resort to an alias configuration](https://github.com/testing-library/svelte-testing-library/issues/222#issuecomment-1909993331)

From 96c299afc6ecc1493ad8683e55bf6feff75ebea5 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 1 Nov 2024 13:48:29 -0400
Subject: [PATCH 096/404] differentiate between 'effect' and `$effect` (#14105)

---
 documentation/docs/02-runes/04-$effect.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index 3515a6c4e4..06e2fa140a 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -8,7 +8,7 @@ Most of the effects in a Svelte app are created by Svelte itself — they're the
 
 But you can also create your own effects with the `$effect` rune, which is useful when you need to synchronize an external system (whether that's a library, or a `<canvas>` element, or something across a network) with state inside your Svelte app.
 
-> [!NOTE] Avoid overusing effects! When you do too much work in them, code often becomes difficult to understand and maintain. See [when not to use effects](#When-not-to-use-effects) to learn about alternative approaches.
+> [!NOTE] Avoid overusing `$effect`! When you do too much work in effects, code often becomes difficult to understand and maintain. See [when not to use `$effect`](#When-not-to-use-$effect) to learn about alternative approaches.
 
 Your effects run after the component has been mounted to the DOM, and in a [microtask](https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API/Microtask_guide) after state changes ([demo](/playground/untitled#H4sIAAAAAAAAE31S246bMBD9lZF3pSRSAqTVvrCAVPUP2sdSKY4ZwJJjkD0hSVH-vbINuWxXfQH5zMyZc2ZmZLVUaFn6a2R06ZGlHmBrpvnBvb71fWQHVOSwPbf4GS46TajJspRlVhjZU1HqkhQSWPkHIYdXS5xw-Zas3ueI6FRn7qHFS11_xSRZhIxbFtcDtw7SJb1iXaOg5XIFeQGjzyPRaevYNOGZIJ8qogbpe8CWiy_VzEpTXiQUcvPDkSVrSNZz1UlW1N5eLcqmpdXUvaQ4BmqlhZNUCgxuzFHDqUWNAxrYeUM76AzsnOsdiJbrBp_71lKpn3RRbii-4P3f-IMsRxS-wcDV_bL4PmSdBa2wl7pKnbp8DMgVvJm8ZNskKRkEM_OzyOKQFkgqOYBQ3Nq89Ns0nbIl81vMFN-jKoLMTOr-SOBOJS-Z8f5Y6D1wdcR8dFqvEBdetK-PHwj-z-cH8oHPY54wRJ8Ys7iSQ3Bg3VA9azQbmC9k35kKzYa6PoVtfwbbKVnBixBiGn7Pq0rqJoUtHiCZwAM3jdTPWCVtr_glhVrhecIa3vuksJ_b7TqFs4DPyriSjd5IwoNNQaAmNI-ESfR2p8zimzvN1swdCkvJHPH6-_oX8o1SgcIDAAA=)):
 
@@ -261,7 +261,7 @@ The `$effect.root` rune is an advanced feature that creates a non-tracked scope
 </script>
 ```
 
-## When not to use effects
+## 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...
 

From 4ec9986cba11d4635155e90c87c7ac5e6503a6c1 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 1 Nov 2024 19:09:27 +0100
Subject: [PATCH 097/404] fix: check options namespace for top level
 `svelte:element`s (#14101)

We were checking it for nested elements, but not root elements

fixes #13875
---
 .changeset/polite-timers-tell.md                     |  5 +++++
 .../phases/2-analyze/visitors/SvelteElement.js       |  5 +++--
 .../dynamic-element-svg-options-namespace/_config.js | 12 ++++++++++++
 .../main.svelte                                      |  7 +++++++
 .../rect.svelte                                      |  7 +++++++
 5 files changed, 34 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/polite-timers-tell.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/main.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/rect.svelte

diff --git a/.changeset/polite-timers-tell.md b/.changeset/polite-timers-tell.md
new file mode 100644
index 0000000000..b98a89c95f
--- /dev/null
+++ b/.changeset/polite-timers-tell.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: check options namespace for top level `svelte:element`s
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
index 02717bdfd9..c0b9f95fc2 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
@@ -35,9 +35,10 @@ export function SvelteElement(node, context) {
 				ancestor.type === 'Component' ||
 				ancestor.type === 'SvelteComponent' ||
 				ancestor.type === 'SvelteFragment' ||
-				ancestor.type === 'SnippetBlock'
+				ancestor.type === 'SnippetBlock' ||
+				i === 0
 			) {
-				// Inside a slot or a snippet -> this resets the namespace, so assume the component namespace
+				// Root element, or inside a slot or a snippet -> this resets the namespace, so assume the component namespace
 				node.metadata.svg = context.state.options.namespace === 'svg';
 				node.metadata.mathml = context.state.options.namespace === 'mathml';
 				break;
diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/_config.js b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/_config.js
new file mode 100644
index 0000000000..a18ad5dc10
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/_config.js
@@ -0,0 +1,12 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<svg><rect fill="black" width="10" height="90"></rect></svg>',
+
+	test({ assert, target }) {
+		const svg = target.querySelector('svg');
+		const rect = target.querySelector('rect');
+		assert.equal(svg?.namespaceURI, 'http://www.w3.org/2000/svg');
+		assert.equal(rect?.namespaceURI, 'http://www.w3.org/2000/svg');
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/main.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/main.svelte
new file mode 100644
index 0000000000..0cc8a2a1f3
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	import Rect from './rect.svelte';
+</script>
+
+<svg>
+	<Rect />
+</svg>
diff --git a/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/rect.svelte b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/rect.svelte
new file mode 100644
index 0000000000..e747291714
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/dynamic-element-svg-options-namespace/rect.svelte
@@ -0,0 +1,7 @@
+<svelte:options namespace="svg" />
+
+<script>
+	const tag = 'rect';
+</script>
+
+<svelte:element this={tag} fill="black" width="10" height="90" />

From 304d88edd0a0c8f89603aa3309217b46720ed304 Mon Sep 17 00:00:00 2001
From: "Ahmad S." <navorite@gmail.com>
Date: Fri, 1 Nov 2024 22:09:00 +0200
Subject: [PATCH 098/404] docs: fix `$effect` section examples (#13911)

closes #13912
---
 documentation/docs/02-runes/04-$effect.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index 06e2fa140a..b338795220 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -288,7 +288,7 @@ In general, `$effect` is best considered something of an escape hatch — useful
 
 > [!NOTE] For things that are more complicated than a simple expression like `count * 2`, you can also use `$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](/playground/untitled#H4sIAAAAAAAACpVRy2rDMBD8lWXJwYE0dg-9KFYg31H3oNirIJBlYa1DjPG_F8l1XEop9LgzOzP7mFAbSwHF-4ROtYQCL97jAXn0sQh3skx4wNANfR2RMtS98XyuXMWWGLhjZUHCa1GcVix4cgwSdoEVU1bsn4wl_Y1I2kS6inekNdWcZXuQZ5giFDWpfwl5WYyT2fynbB1g1UWbTVbm2w6utOpKNq1TGucHhri6rLBX7kYVwtW4RtyVHUhOyXeGVj3klLxnyJP0i8lXNJUx6en-v6A48K85kTimpi0sYj-yAo-Wlh9FcL1LY4K3ahSgLT1OC3ZTXkBxfKN2uVC6T5LjAduuMdpQg4L7geaP-RNHPuClMQIAAA==)):
+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](/playground/untitled#H4sIAAAAAAAACpVRy26DMBD8FcvKgUhtoIdeHBwp31F6MGSJkBbHwksEQvx77aWQqooq9bgzOzP7mGTdIHipPiZJowOpGJAv0po2VmfnDv4OSBErjYdneHWzBJaCjcx91TWOToUtCIEE3cig0OIty44r5l1oDtjOkyFIsv3GINQ_CNYyGegd1DVUlCR7oU9iilDUcP8S8roYs9n8p2wdYNVFm4csTx872BxNCcjr5I11fdgonEkXsjP2CoUUZWMv6m6wBz2x7yxaM-iJvWeRsvSbSVeUy5i0uf8vKA78NIeJLSZWv1I8jQjLdyK4XuTSeIdmVKJGGI4LdjVOiezwDu1yG74My8PLCQaSiroe5s_5C2PHrkVGAgAA)):
 
 ```svelte
 <script>
@@ -316,7 +316,7 @@ You might be tempted to do something convoluted with effects to link one value t
 </label>
 ```
 
-Instead, use callbacks where possible ([demo](/playground/untitled#H4sIAAAAAAAACo2SP2-DMBDFv8rp1CFR84cOXQhU6p6tY-ngwoEsGWPhI0pk8d0rG5yglqGj37v7veMJh7VUZDH9dKhFS5jiuzG4Q74Z_7AXUky4Q9sNfemVzJa9NPxW6IIVMXDHQkEOL0lyipo1pBlyeLIsmDbJ9u4oqhdG2A2mLrgedMmy0zCYSjB9eMaGtuC8WXBkPtOBRd8QHy5CDXSa3Jk7HbOfDgjWuAo_U71kz9vr6Bgc2X44orPjow2dKfFNKhSTSW0GBl9iXmAvdEMFQqDmLgBH6HQYyt3ie0doxTV3IWqEY2DN88eohqePvsf9O9mf_if4HMSVXD89NfEI99qvbMs3RdPv4MXYaSWtUeKWQq3oOlfZCJNCcnildlFgWMcdtl0la0kVptwPNH6NP_uzV0acAgAA)):
+Instead, use callbacks where possible ([demo](/playground/untitled#H4sIAAAAAAAACo1SMW6EMBD8imWluFMSIEUaDiKlvy5lSOHjlhOSMRZeTiDkv8deMEEJRcqdmZ1ZjzzxqpZgePo5cRw18JQA_sSVaPz0rnVk7iDRYxdhYA8vW4Wg0NnwzJRdrfGtUAVKQIYtCsly9pIkp4AZ7cQOezAoEA7JcWUkVBuCdol0dNWrEutWsV5fHfnhPQ5wZJMnCwyejxCh6G6A0V3IHk4zu_jOxzzPBxBld83PTr7xXrb3rUNw8PbiYJ3FP22oTIoLSComq5XuXTeu8LzgnVA3KDgj13wiQ8taRaJ82rzXskYM-URRlsXktejjgNLoo9e4fyf70_8EnwncySX1GuunX6kGRwnzR_BgaPNaGy3FmLJKwrCUeBM6ZUn0Cs2mOlp3vwthQJ5i14P9st9vZqQlsQIAAA==)):
 
 ```svelte
 <script>
@@ -346,7 +346,7 @@ Instead, use callbacks where possible ([demo](/playground/untitled#H4sIAAAAAAAAC
 </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](/playground/untitled#H4sIAAAAAAAACo2SQW-DMAyF_4pl7dBqXcsOu1CYtHtvO44dsmKqSCFExFRFiP8-xRCGth52tJ_9PecpA1bakMf0Y0CrasIU35zDHXLvQuGvZJhwh77p2nPoZP7casevhS3YEAM3rAzk8Jwkx9jzjixDDg-eFdMm2S6KoWolyK6ItuCqs2fWjYXOlYrpPTA2tIUhiAVH5iPtWbUX4v1VmY6Okzpzp2OepgNEGu_CT1St2fP2fXQ0juwwHNHZ4ScNmxn1RUaCybR1HUMIMS-wVfZCBYJQ80GAIzRWhvJh9d4RanXLB7Ea4SCsef4Qu1IG68Xu387h9D_GJ2ne8ZXpxTZUv1w994amjxCaMc1Se2dUn0Jl6DaHeFEuhWT_QvUqOlnHHdZNqStNJabcdjR-jt8IbC-7lgIAAA==)):
+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](/playground/untitled#H4sIAAAAAAAACpWRwW6DMBBEf8WyekikFOihFwcq9TvqHkyyQUjGsfCCQMj_XnvBNKpy6Qn2DTOD1wu_tRocF18Lx9kCFwT4iRvVxenT2syNoDGyWjl4xi93g2AwxPDSXfrW4oc0EjUgwzsqzSr2VhTnxJwNHwf24lAhHIpjVDZNwy1KS5wlNoGMSg9wOCYksQccerMlv65p51X0p_Xpdt_4YEy9yTkmV3z4MJT579-bUqsaNB2kbI0dwlnCgirJe2UakJzVrbkKaqkWivasU1O1ULxnOVk3JU-Uxti0p_-vKO4no_enbQ_yXhnZn0aHs4b1jiJMK7q2zmo1C3bTMG3LaZQVrMjeoSPgaUtkDxePMCEX2Ie6b_8D4WyJJEwCAAA=)):
 
 ```svelte
 <script>

From 8d0937a53427d6ecd50a5fdd41fbfbd6aff3168c Mon Sep 17 00:00:00 2001
From: Tim Deschryver <28659384+timdeschryver@users.noreply.github.com>
Date: Sat, 2 Nov 2024 20:09:23 +0100
Subject: [PATCH 099/404] docs: fix compilation error (#14121)

---
 documentation/docs/06-runtime/03-lifecycle-hooks.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/06-runtime/03-lifecycle-hooks.md b/documentation/docs/06-runtime/03-lifecycle-hooks.md
index 16ab0e8e87..a3dbe04b00 100644
--- a/documentation/docs/06-runtime/03-lifecycle-hooks.md
+++ b/documentation/docs/06-runtime/03-lifecycle-hooks.md
@@ -71,9 +71,9 @@ While there's no "after update" hook, you can use `tick` to ensure that the UI i
 
 	$effect.pre(() => {
 		console.log('the component is about to update');
-		tick().then(
+		tick().then(() => {
 				console.log('the component just updated');
-		);
+		});
 	});
 </script>
 ```

From 4038b0cad67f8eebf652cee04e5c2691bcc40e89 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 2 Nov 2024 22:19:48 -0400
Subject: [PATCH 100/404] chore: setup docs previews (#14128)

* chore: setup docs previews

* test

* delete
---
 .../workflows/docs-preview-create-request.yml | 26 ++++++++++++++++++
 .../workflows/docs-preview-delete-request.yml | 27 +++++++++++++++++++
 2 files changed, 53 insertions(+)
 create mode 100644 .github/workflows/docs-preview-create-request.yml
 create mode 100644 .github/workflows/docs-preview-delete-request.yml

diff --git a/.github/workflows/docs-preview-create-request.yml b/.github/workflows/docs-preview-create-request.yml
new file mode 100644
index 0000000000..95ea820928
--- /dev/null
+++ b/.github/workflows/docs-preview-create-request.yml
@@ -0,0 +1,26 @@
+# https://github.com/sveltejs/svelte.dev/blob/main/apps/svelte.dev/scripts/sync-docs/README.md
+name: Docs preview create request
+
+on:
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  dispatch:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Repository Dispatch
+        uses: peter-evans/repository-dispatch@v3
+        with:
+          token: ${{ secrets.SYNC_REQUEST_TOKEN }}
+          repository: sveltejs/svelte.dev
+          event-type: docs-preview-create
+          client-payload: |-
+            {
+              "package": "svelte",
+              "repo": "${{ github.repository }}",
+              "owner": "${{ github.event.pull_request.head.repo.owner.login }}",
+              "branch": "${{ github.event.pull_request.head.ref }}",
+              "pr": ${{ github.event.pull_request.number }}
+            }
diff --git a/.github/workflows/docs-preview-delete-request.yml b/.github/workflows/docs-preview-delete-request.yml
new file mode 100644
index 0000000000..d14704107d
--- /dev/null
+++ b/.github/workflows/docs-preview-delete-request.yml
@@ -0,0 +1,27 @@
+# https://github.com/sveltejs/svelte.dev/blob/main/apps/svelte.dev/scripts/sync-docs/README.md
+name: Docs preview delete request
+
+on:
+  pull_request:
+    branches:
+      - main
+    types: [closed]
+
+jobs:
+  dispatch:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Repository Dispatch
+        uses: peter-evans/repository-dispatch@v3
+        with:
+          token: ${{ secrets.SYNC_REQUEST_TOKEN }}
+          repository: sveltejs/svelte.dev
+          event-type: docs-preview-delete
+          client-payload: |-
+            {
+              "package": "svelte",
+              "repo": "${{ github.repository }}",
+              "owner": "${{ github.event.pull_request.head.repo.owner.login }}",
+              "branch": "${{ github.event.pull_request.head.ref }}",
+              "pr": ${{ github.event.pull_request.number }}
+            }

From 00f5b14d4029760b6e0583d5d4c0ebc7b3484520 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Sun, 3 Nov 2024 03:23:32 +0100
Subject: [PATCH 101/404] docs: fix description (#14109)

Since Svelte 5, comments are also preserved on the client
---
 packages/svelte/src/compiler/types/index.d.ts | 2 +-
 packages/svelte/types/index.d.ts              | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index 40611b31ae..8a45f2d4fd 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -110,7 +110,7 @@ export interface CompileOptions extends ModuleCompileOptions {
 	 */
 	cssHash?: CssHashGetter;
 	/**
-	 * If `true`, your HTML comments will be preserved during server-side rendering. By default, they are stripped out.
+	 * If `true`, your HTML comments will be preserved in the output. By default, they are stripped out.
 	 *
 	 * @default false
 	 */
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 0f08fabfcb..ca67923ee1 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -812,7 +812,7 @@ declare module 'svelte/compiler' {
 		 */
 		cssHash?: CssHashGetter;
 		/**
-		 * If `true`, your HTML comments will be preserved during server-side rendering. By default, they are stripped out.
+		 * If `true`, your HTML comments will be preserved in the output. By default, they are stripped out.
 		 *
 		 * @default false
 		 */
@@ -2183,7 +2183,7 @@ declare module 'svelte/types/compiler/interfaces' {
 		 */
 		cssHash?: CssHashGetter;
 		/**
-		 * If `true`, your HTML comments will be preserved during server-side rendering. By default, they are stripped out.
+		 * If `true`, your HTML comments will be preserved in the output. By default, they are stripped out.
 		 *
 		 * @default false
 		 */

From a952860232203cbb3228387f5a3e70de28192796 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Sun, 3 Nov 2024 03:24:10 +0100
Subject: [PATCH 102/404] docs: more docs on TS types (#14065)

* docs: more docs on TS types

and a few related changes/enhancements
closes #13940

* Apply suggestions from code review

* adjust

* Apply suggestions from code review

* Update documentation/docs/07-misc/03-typescript.md

* Update documentation/docs/07-misc/03-typescript.md

* Update documentation/docs/07-misc/03-typescript.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/07-misc/03-typescript.md     | 17 ++++++++++++++++-
 .../docs/07-misc/07-v5-migration-guide.md       |  5 +++--
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md
index 525ba51d2f..5e16382187 100644
--- a/documentation/docs/07-misc/03-typescript.md
+++ b/documentation/docs/07-misc/03-typescript.md
@@ -195,7 +195,9 @@ Using it together with dynamic components to restrict what kinds of component ca
 <DynamicComponent prop="foo" />
 ```
 
-Closely related to the `Component` type is the `ComponentProps` type which extracts the properties a component expects.
+> [!LEGACY] In Svelte 4, components were of type `SvelteComponent`
+
+To extract the properties from a component, use `ComponentProps`.
 
 ```ts
 import type { Component, ComponentProps } from 'svelte';
@@ -211,6 +213,19 @@ function withProps<TComponent extends Component<any>>(
 withProps(MyComponent, { foo: 'bar' });
 ```
 
+To declare that a variable expects the constructor or instance type of a component:
+
+```svelte
+<script lang="ts">
+	import MyComponent from './MyComponent.svelte';
+
+	let componentConstructor: typeof MyComponent = MyComponent;
+	let componentInstance: MyComponent;
+</script>
+
+<MyComponent bind:this={componentInstance} />
+```
+
 ## Enhancing built-in DOM types
 
 Svelte provides a best effort of all the HTML DOM types that exist. Sometimes you may want to use experimental attributes or custom events coming from an action. In these cases, TypeScript will throw a type error, saying that it does not know these types. If it's a non-experimental standard attribute/event, this may very well be a missing typing from our [HTML typings](https://github.com/sveltejs/svelte/blob/main/packages/svelte/elements.d.ts). In that case, you are welcome to open an issue and/or a PR fixing it.
diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index 093ec5b86b..c7cdd36106 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -599,13 +599,14 @@ To declare that a component of a certain type is required:
 
 ```svelte
 <script lang="ts">
-	import type { Component } from 'svelte';
+	import type { ---SvelteComponent--- +++Component+++ } from 'svelte';
 	import {
 		ComponentA,
 		ComponentB
 	} from 'component-library';
 
-	let component: Component<{ foo: string }> = $state(
+	---let component: typeof SvelteComponent<{ foo: string }>---
+	+++let component: Component<{ foo: string }>+++ = $state(
 		Math.random() ? ComponentA : ComponentB
 	);
 </script>

From 74a2c6b5807de1540f48db3875dab36d56ca738e Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sun, 3 Nov 2024 14:31:54 +0100
Subject: [PATCH 103/404] fix: migrate multiple declarations with only some
 exported correctly (#14126)

---
 .changeset/yellow-pumas-rule.md               |  5 +++
 packages/svelte/src/compiler/migrate/index.js | 41 +++++++++++++++----
 .../input.svelte                              |  6 +++
 .../output.svelte                             | 12 ++++++
 4 files changed, 57 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/yellow-pumas-rule.md
 create mode 100644 packages/svelte/tests/migrate/samples/export-props-multiple-declarations/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/export-props-multiple-declarations/output.svelte

diff --git a/.changeset/yellow-pumas-rule.md b/.changeset/yellow-pumas-rule.md
new file mode 100644
index 0000000000..02def3c178
--- /dev/null
+++ b/.changeset/yellow-pumas-rule.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: migrate multiple declarations with only some exported correctly
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index ee5abc8853..011d28d61a 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -505,7 +505,8 @@ const instance_script = {
 
 		let nr_of_props = 0;
 
-		for (const declarator of node.declarations) {
+		for (let i = 0; i < node.declarations.length; i++) {
+			const declarator = node.declarations[i];
 			if (state.analysis.runes) {
 				if (get_rune(declarator.init, state.scope) === '$props') {
 					state.props_insertion_point = /** @type {number} */ (declarator.id.start) + 1;
@@ -605,12 +606,38 @@ const instance_script = {
 					});
 				}
 
-				state.props_insertion_point = /** @type {number} */ (declarator.end);
-				state.str.update(
-					/** @type {number} */ (declarator.start),
-					/** @type {number} */ (declarator.end),
-					''
-				);
+				let start = /** @type {number} */ (declarator.start);
+				let end = /** @type {number} */ (declarator.end);
+
+				// handle cases like let a,b,c; where only some are exported
+				if (node.declarations.length > 1) {
+					// move the insertion point after the node itself;
+					state.props_insertion_point = /** @type {number} */ (node.end);
+					// if it's not the first declaration remove from the , of the previous declaration
+					if (i !== 0) {
+						start = state.str.original.indexOf(
+							',',
+							/** @type {number} */ (node.declarations[i - 1].end)
+						);
+					}
+					// if it's not the last declaration remove either from up until the
+					// start of the next declaration (if it's the first declaration) or
+					// up until the last index of , from the next declaration
+					if (i !== node.declarations.length - 1) {
+						if (i === 0) {
+							end = /** @type {number} */ (node.declarations[i + 1].start);
+						} else {
+							end = state.str.original.lastIndexOf(
+								',',
+								/** @type {number} */ (node.declarations[i + 1].start)
+							);
+						}
+					}
+				} else {
+					state.props_insertion_point = /** @type {number} */ (declarator.end);
+				}
+
+				state.str.update(start, end, '');
 
 				continue;
 			}
diff --git a/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/input.svelte b/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/input.svelte
new file mode 100644
index 0000000000..198bd44fc0
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/input.svelte
@@ -0,0 +1,6 @@
+<script>
+	let a, b, c, d;
+	let e, f, g, h;
+
+	export {a, c , f, h}
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/output.svelte b/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/output.svelte
new file mode 100644
index 0000000000..bb16ea2ff9
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/export-props-multiple-declarations/output.svelte
@@ -0,0 +1,12 @@
+<script>
+	let b, d;
+	let e, g;
+	let {
+		a,
+		c,
+		f,
+		h
+	} = $props();
+
+	
+</script>
\ No newline at end of file

From 8de5605b6a5ffa436d6fb9be5991345477e09f73 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sun, 3 Nov 2024 14:36:11 +0100
Subject: [PATCH 104/404] fix: prevent migrated snippet from shadow snippet
 prop (#14127)

---
 .changeset/silent-tigers-lay.md               |  5 +++
 packages/svelte/src/compiler/migrate/index.js | 44 +++++++++++++++++++
 .../shadowed-forwarded-slot/input.svelte      | 15 +++++++
 .../shadowed-forwarded-slot/output.svelte     | 33 ++++++++++++++
 4 files changed, 97 insertions(+)
 create mode 100644 .changeset/silent-tigers-lay.md
 create mode 100644 packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte

diff --git a/.changeset/silent-tigers-lay.md b/.changeset/silent-tigers-lay.md
new file mode 100644
index 0000000000..8debfd7151
--- /dev/null
+++ b/.changeset/silent-tigers-lay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent migrated snippet from shadow snippet prop
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 011d28d61a..3513098a20 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -168,6 +168,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 			legacy_imports: new Set(),
 			script_insertions: new Set(),
 			derived_components: new Map(),
+			derived_conflicting_slots: new Map(),
 			derived_labeled_statements: new Set(),
 			has_svelte_self: false,
 			uses_ts:
@@ -199,6 +200,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 		const need_script =
 			state.legacy_imports.size > 0 ||
 			state.derived_components.size > 0 ||
+			state.derived_conflicting_slots.size > 0 ||
 			state.script_insertions.size > 0 ||
 			state.props.length > 0 ||
 			analysis.uses_rest_props ||
@@ -365,6 +367,13 @@ export function migrate(source, { filename, use_ts } = {}) {
 			);
 		}
 
+		if (state.derived_conflicting_slots.size > 0) {
+			str.appendRight(
+				insertion_point,
+				`\n${indent}${[...state.derived_conflicting_slots.entries()].map(([name, init]) => `const ${name} = $derived(${init});`).join(`\n${indent}`)}\n`
+			);
+		}
+
 		if (state.props.length > 0 && state.analysis.accessors) {
 			str.appendRight(
 				insertion_point,
@@ -414,6 +423,7 @@ export function migrate(source, { filename, use_ts } = {}) {
  * 	legacy_imports: Set<string>;
  * 	script_insertions: Set<string>;
  *  derived_components: Map<string, string>;
+ *  derived_conflicting_slots: Map<string, string>;
  * 	derived_labeled_statements: Set<LabeledStatement>;
  *  has_svelte_self: boolean;
  *  uses_ts: boolean;
@@ -1133,6 +1143,7 @@ const template = {
 		let name = 'children';
 		let slot_name = 'default';
 		let slot_props = '{ ';
+		let aliased_slot_name;
 
 		for (const attr of node.attributes) {
 			if (attr.type === 'SpreadAttribute') {
@@ -1144,6 +1155,37 @@ const template = {
 
 				if (attr.name === 'name') {
 					slot_name = /** @type {any} */ (attr.value)[0].data;
+					// if some of the parents or this node itself har a slot
+					// attribute with the sane name of this slot
+					// we want to create a derived or the migrated snippet
+					// will shadow the slot prop
+					if (
+						path.some(
+							(parent) =>
+								(parent.type === 'RegularElement' ||
+									parent.type === 'SvelteElement' ||
+									parent.type === 'Component' ||
+									parent.type === 'SvelteComponent' ||
+									parent.type === 'SvelteFragment') &&
+								parent.attributes.some(
+									(attribute) =>
+										attribute.type === 'Attribute' &&
+										attribute.name === 'slot' &&
+										is_text_attribute(attribute) &&
+										attribute.value[0].data === slot_name
+								)
+						) ||
+						node.attributes.some(
+							(attribute) =>
+								attribute.type === 'Attribute' &&
+								attribute.name === 'slot' &&
+								is_text_attribute(attribute) &&
+								attribute.value[0].data === slot_name
+						)
+					) {
+						aliased_slot_name = `${slot_name}_render`;
+						state.derived_conflicting_slots.set(aliased_slot_name, slot_name);
+					}
 				} else {
 					const attr_value =
 						attr.value === true || Array.isArray(attr.value) ? attr.value : [attr.value];
@@ -1200,6 +1242,8 @@ const template = {
 			existing_prop.needs_refine_type = false;
 		}
 
+		name = aliased_slot_name ?? name;
+
 		if (node.fragment.nodes.length > 0) {
 			next();
 			state.str.update(
diff --git a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
new file mode 100644
index 0000000000..800ef2532c
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
@@ -0,0 +1,15 @@
+{#if $$slots.label}
+	<slot name="label" />
+{/if}
+<MyInput>
+	<slot name="label" slot="label"/>
+</MyInput>
+<MyInput>
+	<div slot="label">
+		<MyComponent>
+			<div slot="label">
+				<slot name="label" />
+			</div>
+		</MyComponent>
+	</div>
+</MyInput>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte
new file mode 100644
index 0000000000..3c763349c6
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte
@@ -0,0 +1,33 @@
+<script>
+	/**
+	 * @typedef {Object} Props
+	 * @property {import('svelte').Snippet} [label]
+	 */
+
+	/** @type {Props} */
+	let { label } = $props();
+	const label_render = $derived(label);
+
+</script>
+
+{#if label}
+	{@render label?.()}
+{/if}
+<MyInput>
+	{#snippet label()}
+		{@render label_render?.()}
+	{/snippet}
+</MyInput>
+<MyInput>
+	{#snippet label()}
+		<div >
+			<MyComponent>
+				{#snippet label()}
+						<div >
+						{@render label_render?.()}
+					</div>
+					{/snippet}
+			</MyComponent>
+		</div>
+	{/snippet}
+</MyInput>
\ No newline at end of file

From 551284ca2259d934d34b71a38071d85684bd6d4f Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Sun, 3 Nov 2024 15:04:52 +0100
Subject: [PATCH 105/404] fix: correctly infer `<a>` tag namespace (#14134)

`<a>` tags are valid in both the SVG and HTML namespace.  If there's no parent, we therefore have to look downwards to see if it's the parent of a SVG or HTML element.

fixes #7807
fixes #13793
---
 .changeset/modern-pets-punch.md               |  5 ++++
 .../src/compiler/phases/2-analyze/types.d.ts  |  4 +++
 .../2-analyze/visitors/RegularElement.js      | 13 ++++++++++
 .../2-analyze/visitors/shared/component.js    |  3 ++-
 .../html-namespace-infer-a-tag/_config.js     | 26 +++++++++++++++++++
 .../html-namespace-infer-a-tag/div.svelte     |  7 +++++
 .../html-namespace-infer-a-tag/main.svelte    | 24 +++++++++++++++++
 .../svg-namespace-infer-a-tag/_config.js      | 26 +++++++++++++++++++
 .../svg-namespace-infer-a-tag/main.svelte     | 24 +++++++++++++++++
 .../svg-namespace-infer-a-tag/svg.svelte      |  7 +++++
 10 files changed, 138 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/modern-pets-punch.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/div.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/svg.svelte

diff --git a/.changeset/modern-pets-punch.md b/.changeset/modern-pets-punch.md
new file mode 100644
index 0000000000..981547e9e5
--- /dev/null
+++ b/.changeset/modern-pets-punch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly infer `<a>` tag namespace
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 265f58130d..dedbe95ace 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/types.d.ts
+++ b/packages/svelte/src/compiler/phases/2-analyze/types.d.ts
@@ -9,6 +9,10 @@ export interface AnalysisState {
 	analysis: ComponentAnalysis;
 	options: ValidatedCompileOptions;
 	ast_type: 'instance' | 'template' | 'module';
+	/**
+	 * Tag name of the parent element. `null` if the parent is `svelte:element`, `#snippet`, a component or the root.
+	 * Parent doesn't necessarily mean direct path predecessor because there could be `#each`, `#if` etc in-between.
+	 */
 	parent_element: string | null;
 	has_props_rune: boolean;
 	/** Which slots the current parent component has */
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index 98bb1ca92a..60bd1dd0c5 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -174,4 +174,17 @@ export function RegularElement(node, context) {
 	}
 
 	context.next({ ...context.state, parent_element: node.name });
+
+	// Special case: <a> tags are valid in both the SVG and HTML namespace.
+	// If there's no parent, look downwards to see if it's the parent of a SVG or HTML element.
+	if (node.name === 'a' && !context.state.parent_element) {
+		for (const child of node.fragment.nodes) {
+			if (child.type === 'RegularElement') {
+				if (child.metadata.svg && child.name !== 'svg') {
+					node.metadata.svg = true;
+					break;
+				}
+			}
+		}
+	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
index 73b051a848..9a432341a0 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
@@ -1,5 +1,5 @@
 /** @import { AST } from '#compiler' */
-/** @import { Context } from '../../types' */
+/** @import { AnalysisState, Context } from '../../types' */
 import * as e from '../../../../errors.js';
 import { get_attribute_expression, is_expression_attribute } from '../../../../utils/ast.js';
 import { determine_slot } from '../../../../utils/slot.js';
@@ -96,6 +96,7 @@ export function visit_component(node, context) {
 	const component_slots = new Set();
 
 	for (const slot_name in nodes) {
+		/** @type {AnalysisState} */
 		const state = {
 			...context.state,
 			scope: node.metadata.scopes[slot_name],
diff --git a/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/_config.js b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/_config.js
new file mode 100644
index 0000000000..982e3a3d18
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/_config.js
@@ -0,0 +1,26 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+	<div><a><span>Hello</span></a></div>
+	<div><a><span>Hello</span></a></div>
+	<div><a><span>Hello</span></a></div>
+`,
+	test({ assert, target }) {
+		const div = target.querySelectorAll('div');
+		const a = target.querySelectorAll('a');
+		const span = target.querySelectorAll('span');
+
+		for (const element of div) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/1999/xhtml');
+		}
+
+		for (const element of a) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/1999/xhtml');
+		}
+
+		for (const element of span) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/1999/xhtml');
+		}
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/div.svelte b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/div.svelte
new file mode 100644
index 0000000000..d3d283c634
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/div.svelte
@@ -0,0 +1,7 @@
+<script>
+    let { children } = $props();
+</script>
+
+<div>
+    {@render children()}
+</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/main.svelte b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/main.svelte
new file mode 100644
index 0000000000..e5d9d78860
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/html-namespace-infer-a-tag/main.svelte
@@ -0,0 +1,24 @@
+<script>
+  import Div from './div.svelte';
+</script>
+
+<div>
+	<a>
+		<span>Hello</span>
+	</a>
+</div>
+
+<div>
+	{#snippet test()}
+		<a>
+			<span>Hello</span>
+		</a>
+	{/snippet}
+	{@render test()}
+</div>
+
+<Div>
+  <a>
+    <span>Hello</span>
+  </a>
+</Div>
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/_config.js b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/_config.js
new file mode 100644
index 0000000000..86309a1c86
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/_config.js
@@ -0,0 +1,26 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+	<svg><a><text>Hello</text></a></svg>
+	<svg><a><text>Hello</text></a></svg>
+	<svg><a><text>Hello</text></a></svg>
+`,
+	test({ assert, target }) {
+		const svg = target.querySelectorAll('svg');
+		const a = target.querySelectorAll('a');
+		const text = target.querySelectorAll('text');
+
+		for (const element of svg) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/2000/svg');
+		}
+
+		for (const element of a) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/2000/svg');
+		}
+
+		for (const element of text) {
+			assert.equal(element.namespaceURI, 'http://www.w3.org/2000/svg');
+		}
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/main.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/main.svelte
new file mode 100644
index 0000000000..6d3a658c36
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/main.svelte
@@ -0,0 +1,24 @@
+<script>
+  import Svg from './svg.svelte';
+</script>
+
+<svg>
+	<a>
+		<text>Hello</text>
+	</a>
+</svg>
+
+<svg>
+	{#snippet test()}
+		<a>
+			<text>Hello</text>
+		</a>
+	{/snippet}
+	{@render test()}
+</svg>
+
+<Svg>
+  <a>
+    <text>Hello</text>
+  </a>
+</Svg>
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/svg.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/svg.svelte
new file mode 100644
index 0000000000..b5ca463293
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-infer-a-tag/svg.svelte
@@ -0,0 +1,7 @@
+<script>
+    let { children } = $props();
+</script>
+
+<svg>
+    {@render children()}
+</svg>

From 8731f4f780da8c439e6b1abfcce579a3c07efb48 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 4 Nov 2024 17:32:50 +0100
Subject: [PATCH 106/404] docs: note what the value of `this` can be on
 `svelte:element` (#14117)

closes #7575
---
 documentation/docs/05-special-elements/05-svelte-element.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/05-special-elements/05-svelte-element.md b/documentation/docs/05-special-elements/05-svelte-element.md
index 17ce06799c..ef7dc32066 100644
--- a/documentation/docs/05-special-elements/05-svelte-element.md
+++ b/documentation/docs/05-special-elements/05-svelte-element.md
@@ -29,3 +29,5 @@ Svelte tries its best to infer the correct namespace from the element's surround
 ```svelte
 <svelte:element this={tag} xmlns="http://www.w3.org/2000/svg" />
 ```
+
+`this` needs to be a valid DOM element tag, things like `#text` or `svelte:head` will not work.

From c6904e892f9560f97573d4528cdcb6ea2f209f32 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 4 Nov 2024 15:08:15 -0500
Subject: [PATCH 107/404] use pull_request_target (#14148)

---
 .github/workflows/docs-preview-create-request.yml | 2 +-
 .github/workflows/docs-preview-delete-request.yml | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/docs-preview-create-request.yml b/.github/workflows/docs-preview-create-request.yml
index 95ea820928..f57766dc36 100644
--- a/.github/workflows/docs-preview-create-request.yml
+++ b/.github/workflows/docs-preview-create-request.yml
@@ -2,7 +2,7 @@
 name: Docs preview create request
 
 on:
-  pull_request:
+  pull_request_target:
     branches:
       - main
 
diff --git a/.github/workflows/docs-preview-delete-request.yml b/.github/workflows/docs-preview-delete-request.yml
index d14704107d..4eb0e996a6 100644
--- a/.github/workflows/docs-preview-delete-request.yml
+++ b/.github/workflows/docs-preview-delete-request.yml
@@ -2,7 +2,7 @@
 name: Docs preview delete request
 
 on:
-  pull_request:
+  pull_request_target:
     branches:
       - main
     types: [closed]

From 87d83ffa39802ec0d6a798f399ab6790f6c19cd6 Mon Sep 17 00:00:00 2001
From: Christoph Sanz <22081130+christophsanz@users.noreply.github.com>
Date: Mon, 4 Nov 2024 22:09:09 +0100
Subject: [PATCH 108/404] Add same note as in tutorial to doc. (#14136)

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/03-template-syntax/11-bind.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/03-template-syntax/11-bind.md b/documentation/docs/03-template-syntax/11-bind.md
index 4fe3e7c4a8..7dd03a6b04 100644
--- a/documentation/docs/03-template-syntax/11-bind.md
+++ b/documentation/docs/03-template-syntax/11-bind.md
@@ -223,6 +223,8 @@ All visible elements have the following readonly bindings, measured with a `Resi
 </div>
 ```
 
+> [!NOTE] `display: inline` elements do not have a width or height (except for elements with 'intrinsic' dimensions, like `<img>` and `<canvas>`), and cannot be observed with a `ResizeObserver`. You will need to change the `display` style of these elements to something else, such as `inline-block`.
+
 ## bind:this
 
 ```svelte

From 57e27ae90e19df103a01a9a56117bf2402bb029a Mon Sep 17 00:00:00 2001
From: wackbyte <wackbyte@protonmail.com>
Date: Mon, 4 Nov 2024 16:19:53 -0500
Subject: [PATCH 109/404] fix: only output the key for each_key_duplicate
 (#14147)

Fixes #14146
---
 .changeset/short-lions-search.md                | 5 +++++
 packages/svelte/src/internal/client/validate.js | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/short-lions-search.md

diff --git a/.changeset/short-lions-search.md b/.changeset/short-lions-search.md
new file mode 100644
index 0000000000..ed3abdc053
--- /dev/null
+++ b/.changeset/short-lions-search.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: only output the key for each_key_duplicate
diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js
index c3b1821947..eddcb69d9e 100644
--- a/packages/svelte/src/internal/client/validate.js
+++ b/packages/svelte/src/internal/client/validate.js
@@ -37,7 +37,7 @@ export function validate_each_keys(collection, key_fn) {
 				const b = String(i);
 
 				/** @type {string | null} */
-				let k = String(array[i]);
+				let k = String(key);
 				if (k.startsWith('[object ')) k = null;
 
 				e.each_key_duplicate(a, b, k);

From 7dbe812fc92ad87e30a91ddb3270261964531c54 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 4 Nov 2024 22:49:54 +0100
Subject: [PATCH 110/404] fix: ensure non-matching elements are scoped for
 `:not(...)` selector (#13999)

If the contents of a `:not` selector don't match, then it's actually a match for `:not` because it's inverted. Therefore, we need to scope such elements. We're also making sure that contents of `:not` that never match actually count as a used (because the result is negated), and as such the contents of `:not` that always match are actually marked as unused.

Fixes #13974
---
 .changeset/dirty-parrots-smell.md             |  5 ++
 .../phases/2-analyze/css/css-prune.js         | 89 ++++++++++++-------
 .../samples/not-selector-global/_config.js    | 20 +++++
 .../samples/not-selector-global/expected.css  | 19 ++++
 .../samples/not-selector-global/expected.html |  1 +
 .../samples/not-selector-global/input.svelte  | 23 +++++
 .../_config.js                                |  5 ++
 .../expected.css                              |  4 +
 .../expected.html                             |  1 +
 .../input.svelte                              |  8 ++
 .../tests/css/samples/not-selector/_config.js | 46 ++++------
 .../css/samples/not-selector/expected.css     | 21 ++---
 .../css/samples/not-selector/expected.html    |  1 +
 .../css/samples/not-selector/input.svelte     | 19 ++--
 14 files changed, 172 insertions(+), 90 deletions(-)
 create mode 100644 .changeset/dirty-parrots-smell.md
 create mode 100644 packages/svelte/tests/css/samples/not-selector-global/_config.js
 create mode 100644 packages/svelte/tests/css/samples/not-selector-global/expected.css
 create mode 100644 packages/svelte/tests/css/samples/not-selector-global/expected.html
 create mode 100644 packages/svelte/tests/css/samples/not-selector-global/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
 create mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
 create mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
 create mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/not-selector/expected.html

diff --git a/.changeset/dirty-parrots-smell.md b/.changeset/dirty-parrots-smell.md
new file mode 100644
index 0000000000..50864d20a4
--- /dev/null
+++ b/.changeset/dirty-parrots-smell.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure non-matching elements are scoped for `:not(...)` selector
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 f71a860958..fae89f11ed 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
@@ -10,6 +10,7 @@ import { get_attribute_chunks, is_text_attribute } from '../../../utils/ast.js';
  *   stylesheet: Compiler.Css.StyleSheet;
  *   element: Compiler.AST.RegularElement | Compiler.AST.SvelteElement;
  *   from_render_tag: boolean;
+ *   inside_not: boolean;
  * }} State
  */
 /** @typedef {NODE_PROBABLY_EXISTS | NODE_DEFINITELY_EXISTS} NodeExistsValue */
@@ -61,9 +62,13 @@ export function prune(stylesheet, element) {
 		const parent = get_element_parent(element);
 		if (!parent) return;
 
-		walk(stylesheet, { stylesheet, element: parent, from_render_tag: true }, visitors);
+		walk(
+			stylesheet,
+			{ stylesheet, element: parent, from_render_tag: true, inside_not: false },
+			visitors
+		);
 	} else {
-		walk(stylesheet, { stylesheet, element, from_render_tag: false }, visitors);
+		walk(stylesheet, { stylesheet, element, from_render_tag: false, inside_not: false }, visitors);
 	}
 }
 
@@ -127,7 +132,7 @@ const visitors = {
 							selectors_to_check,
 							/** @type {Compiler.Css.Rule} */ (node.metadata.rule),
 							element,
-							context.state.stylesheet
+							context.state
 						)
 					) {
 						mark(inner, element);
@@ -143,7 +148,7 @@ const visitors = {
 				selectors,
 				/** @type {Compiler.Css.Rule} */ (node.metadata.rule),
 				context.state.element,
-				context.state.stylesheet
+				context.state
 			)
 		) {
 			mark(inner, context.state.element);
@@ -188,10 +193,10 @@ function truncate(node) {
  * @param {Compiler.Css.RelativeSelector[]} relative_selectors
  * @param {Compiler.Css.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {Compiler.Css.StyleSheet} stylesheet
+ * @param {State} state
  * @returns {boolean}
  */
-function apply_selector(relative_selectors, rule, element, stylesheet) {
+function apply_selector(relative_selectors, rule, element, state) {
 	const parent_selectors = relative_selectors.slice();
 	const relative_selector = parent_selectors.pop();
 
@@ -201,7 +206,7 @@ function apply_selector(relative_selectors, rule, element, stylesheet) {
 		relative_selector,
 		rule,
 		element,
-		stylesheet
+		state
 	);
 
 	if (!possible_match) {
@@ -215,14 +220,14 @@ function apply_selector(relative_selectors, rule, element, stylesheet) {
 			parent_selectors,
 			rule,
 			element,
-			stylesheet
+			state
 		);
 	}
 
 	// if this is the left-most non-global selector, mark it — we want
 	// `x y z {...}` to become `x.blah y z.blah {...}`
 	const parent = parent_selectors[parent_selectors.length - 1];
-	if (!parent || is_global(parent, rule)) {
+	if (!state.inside_not && (!parent || is_global(parent, rule))) {
 		mark(relative_selector, element);
 	}
 
@@ -235,17 +240,10 @@ function apply_selector(relative_selectors, rule, element, stylesheet) {
  * @param {Compiler.Css.RelativeSelector[]} parent_selectors
  * @param {Compiler.Css.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {Compiler.Css.StyleSheet} stylesheet
+ * @param {State} state
  * @returns {boolean}
  */
-function apply_combinator(
-	combinator,
-	relative_selector,
-	parent_selectors,
-	rule,
-	element,
-	stylesheet
-) {
+function apply_combinator(combinator, relative_selector, parent_selectors, rule, element, state) {
 	const name = combinator.name;
 
 	switch (name) {
@@ -269,9 +267,9 @@ function apply_combinator(
 				}
 
 				if (parent.type === 'RegularElement' || parent.type === 'SvelteElement') {
-					if (apply_selector(parent_selectors, rule, parent, stylesheet)) {
+					if (apply_selector(parent_selectors, rule, parent, state)) {
 						// TODO the `name === ' '` causes false positives, but removing it causes false negatives...
-						if (name === ' ' || crossed_component_boundary) {
+						if (!state.inside_not && (name === ' ' || crossed_component_boundary)) {
 							mark(parent_selectors[parent_selectors.length - 1], parent);
 						}
 
@@ -297,11 +295,15 @@ function apply_combinator(
 				if (possible_sibling.type === 'RenderTag' || possible_sibling.type === 'SlotElement') {
 					// `{@render foo()}<p>foo</p>` with `:global(.x) + p` is a match
 					if (parent_selectors.length === 1 && parent_selectors[0].metadata.is_global) {
-						mark(relative_selector, element);
+						if (!state.inside_not) {
+							mark(relative_selector, element);
+						}
 						sibling_matched = true;
 					}
-				} else if (apply_selector(parent_selectors, rule, possible_sibling, stylesheet)) {
-					mark(relative_selector, element);
+				} else if (apply_selector(parent_selectors, rule, possible_sibling, state)) {
+					if (!state.inside_not) {
+						mark(relative_selector, element);
+					}
 					sibling_matched = true;
 				}
 			}
@@ -381,10 +383,10 @@ const regex_backslash_and_following_character = /\\(.)/g;
  * @param {Compiler.Css.RelativeSelector} relative_selector
  * @param {Compiler.Css.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {Compiler.Css.StyleSheet} stylesheet
+ * @param {State} state
  * @returns {boolean  }
  */
-function relative_selector_might_apply_to_node(relative_selector, rule, element, stylesheet) {
+function relative_selector_might_apply_to_node(relative_selector, rule, element, state) {
 	// Sort :has(...) selectors in one bucket and everything else into another
 	const has_selectors = [];
 	const other_selectors = [];
@@ -458,7 +460,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 					if (
 						selectors.length === 0 /* is :global(...) */ ||
 						(element.metadata.scoped && selector_matched) ||
-						apply_selector(selectors, rule, element, stylesheet)
+						apply_selector(selectors, rule, element, state)
 					) {
 						complex_selector.metadata.used = true;
 						selector_matched = matched = true;
@@ -504,7 +506,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				) {
 					const args = selector.args;
 					const complex_selector = args.children[0];
-					return apply_selector(complex_selector.children, rule, element, stylesheet);
+					return apply_selector(complex_selector.children, rule, element, state);
 				}
 
 				// We came across a :global, everything beyond it is global and therefore a potential match
@@ -515,12 +517,37 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 
 					for (const complex_selector of selector.args.children) {
 						const relative = truncate(complex_selector);
-						if (
-							relative.length === 0 /* is :global(...) */ ||
-							apply_selector(relative, rule, element, stylesheet)
+						const is_global = relative.length === 0;
+
+						if (is_global) {
+							complex_selector.metadata.used = true;
+							matched = true;
+						} else if (name !== 'not' && apply_selector(relative, rule, element, state)) {
+							complex_selector.metadata.used = true;
+							matched = true;
+						} else if (
+							name === 'not' &&
+							!apply_selector(relative, rule, element, { ...state, inside_not: true })
 						) {
+							// For `:not(...)` we gotta do the inverse: If it did not match, mark the element and possibly
+							// everything above (if the selector is written is a such) as scoped (because they matched by not matching).
+							element.metadata.scoped = true;
 							complex_selector.metadata.used = true;
 							matched = true;
+
+							for (const r of relative) {
+								r.metadata.scoped = true;
+							}
+
+							// bar:not(foo bar) means that foo is an ancestor of bar
+							if (complex_selector.children.length > 1) {
+								/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null} */
+								let el = get_element_parent(element);
+								while (el) {
+									el.metadata.scoped = true;
+									el = get_element_parent(el);
+								}
+							}
 						} else if (complex_selector.children.length > 1 && (name == 'is' || name == 'where')) {
 							// foo :is(bar baz) can also mean that bar is an ancestor of foo, and baz a descendant.
 							// We can't fully check if that actually matches with our current algorithm, so we just assume it does.
@@ -618,7 +645,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				const parent = /** @type {Compiler.Css.Rule} */ (rule.metadata.parent_rule);
 
 				for (const complex_selector of parent.prelude.children) {
-					if (apply_selector(truncate(complex_selector), parent, element, stylesheet)) {
+					if (apply_selector(truncate(complex_selector), parent, element, state)) {
 						complex_selector.metadata.used = true;
 						matched = true;
 					}
diff --git a/packages/svelte/tests/css/samples/not-selector-global/_config.js b/packages/svelte/tests/css/samples/not-selector-global/_config.js
new file mode 100644
index 0000000000..2776ac227a
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-global/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":global(.x) :not(p)"',
+			start: {
+				line: 14,
+				column: 1,
+				character: 197
+			},
+			end: {
+				line: 14,
+				column: 20,
+				character: 216
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/not-selector-global/expected.css b/packages/svelte/tests/css/samples/not-selector-global/expected.css
new file mode 100644
index 0000000000..f90edd0c88
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-global/expected.css
@@ -0,0 +1,19 @@
+
+	.svelte-xyz:not(.foo) {
+		color: green;
+	}
+	.svelte-xyz:not(.foo:where(.svelte-xyz)):not(.unused) {
+		color: green;
+	}
+	.x:not(.foo.svelte-xyz) {
+		color: green;
+	}
+	/* (unused) :global(.x) :not(p) {
+		color: red;
+	}*/
+	.x:not(p.svelte-xyz) {
+		color: red; /* TODO would be nice to prune this one day */
+	}
+	.x .svelte-xyz:not(.unused:where(.svelte-xyz)) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/not-selector-global/expected.html b/packages/svelte/tests/css/samples/not-selector-global/expected.html
new file mode 100644
index 0000000000..b4834bb818
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-global/expected.html
@@ -0,0 +1 @@
+<p class="foo svelte-xyz">foo</p> <p class="bar svelte-xyz">bar</p>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-global/input.svelte b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
new file mode 100644
index 0000000000..578052d943
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
@@ -0,0 +1,23 @@
+<p class="foo">foo</p>
+<p class="bar">bar</p>
+
+<style>
+	:not(:global(.foo)) {
+		color: green;
+	}
+	:not(.foo):not(:global(.unused)) {
+		color: green;
+	}
+	:global(.x):not(.foo) {
+		color: green;
+	}
+	:global(.x) :not(p) {
+		color: red;
+	}
+	:global(.x):not(p) {
+		color: red; /* TODO would be nice to prune this one day */
+	}
+	:global(.x) :not(.unused) {
+		color: green;
+	}
+</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
new file mode 100644
index 0000000000..292c6c49ac
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: []
+});
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
new file mode 100644
index 0000000000..8fe09de6dc
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
@@ -0,0 +1,4 @@
+
+	.svelte-xyz:not(.bar:where(.svelte-xyz)) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
new file mode 100644
index 0000000000..fa4ca95c60
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
@@ -0,0 +1 @@
+<p class="foo svelte-xyz">foo</p> <p class="bar">bar</p>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte
new file mode 100644
index 0000000000..6599a21ca6
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte
@@ -0,0 +1,8 @@
+<p class="foo">foo</p>
+<p class="bar">bar</p>
+
+<style>
+	:not(.bar) {
+		color: green;
+	}
+</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector/_config.js b/packages/svelte/tests/css/samples/not-selector/_config.js
index 6ab49a8809..27b4f91a6a 100644
--- a/packages/svelte/tests/css/samples/not-selector/_config.js
+++ b/packages/svelte/tests/css/samples/not-selector/_config.js
@@ -4,58 +4,44 @@ export default test({
 	warnings: [
 		{
 			code: 'css_unused_selector',
-			message: 'Unused CSS selector ":not(.unused)"',
+			message: 'Unused CSS selector ":not(p)"',
 			start: {
-				line: 8,
+				line: 11,
 				column: 1,
-				character: 89
+				character: 125
 			},
 			end: {
-				line: 8,
-				column: 14,
-				character: 102
-			}
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ":not(.foo):not(.unused)"',
-			start: {
-				line: 18,
-				column: 1,
-				character: 221
-			},
-			end: {
-				line: 18,
-				column: 24,
-				character: 244
+				line: 11,
+				column: 8,
+				character: 132
 			}
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "p :not(.foo)"',
 			start: {
-				line: 25,
+				line: 22,
 				column: 1,
-				character: 300
+				character: 235
 			},
 			end: {
-				line: 25,
+				line: 22,
 				column: 13,
-				character: 312
+				character: 247
 			}
 		},
 		{
 			code: 'css_unused_selector',
-			message: 'Unused CSS selector ":global(.x) :not(.unused)"',
+			message: 'Unused CSS selector "p :not(.unused)"',
 			start: {
-				line: 34,
+				line: 25,
 				column: 1,
-				character: 469
+				character: 268
 			},
 			end: {
-				line: 34,
-				column: 26,
-				character: 494
+				line: 25,
+				column: 16,
+				character: 283
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/not-selector/expected.css b/packages/svelte/tests/css/samples/not-selector/expected.css
index 45e9ad69c0..b4d51bf269 100644
--- a/packages/svelte/tests/css/samples/not-selector/expected.css
+++ b/packages/svelte/tests/css/samples/not-selector/expected.css
@@ -2,19 +2,16 @@
 	.svelte-xyz:not(.foo:where(.svelte-xyz)) {
 		color: green;
 	}
-	/* (unused) :not(.unused) {
-		color: red;
-	}*/
-	.svelte-xyz:not(.foo) {
+	.svelte-xyz:not(.unused:where(.svelte-xyz)) {
 		color: green;
 	}
+	/* (unused) :not(p) {
+		color: red;
+	}*/
 
-	.svelte-xyz:not(.foo:where(.svelte-xyz)):not(.unused) {
+	.svelte-xyz:not(.foo:where(.svelte-xyz)):not(.unused:where(.svelte-xyz)) {
 		color: green;
 	}
-	/* (unused) :not(.foo):not(.unused) {
-		color: red;
-	}*/
 
 	p.svelte-xyz:not(.foo:where(.svelte-xyz)) {
 		color: green;
@@ -22,12 +19,6 @@
 	/* (unused) p :not(.foo) {
 		color: red;
 	}*/
-	.x:not(.foo.svelte-xyz) {
-		color: green;
-	}
-	.x:not(.unused.svelte-xyz) {
-		color: red; /* TODO would be nice to prune this one day */
-	}
-	/* (unused) :global(.x) :not(.unused) {
+	/* (unused) p :not(.unused) {
 		color: red;
 	}*/
diff --git a/packages/svelte/tests/css/samples/not-selector/expected.html b/packages/svelte/tests/css/samples/not-selector/expected.html
new file mode 100644
index 0000000000..b4834bb818
--- /dev/null
+++ b/packages/svelte/tests/css/samples/not-selector/expected.html
@@ -0,0 +1 @@
+<p class="foo svelte-xyz">foo</p> <p class="bar svelte-xyz">bar</p>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector/input.svelte b/packages/svelte/tests/css/samples/not-selector/input.svelte
index 57d062cf49..a0e72c7be8 100644
--- a/packages/svelte/tests/css/samples/not-selector/input.svelte
+++ b/packages/svelte/tests/css/samples/not-selector/input.svelte
@@ -6,17 +6,14 @@
 		color: green;
 	}
 	:not(.unused) {
-		color: red;
-	}
-	:not(:global(.foo)) {
 		color: green;
 	}
-
-	:not(.foo):not(:global(.unused)) {
-		color: green;
+	:not(p) {
+		color: red;
 	}
+
 	:not(.foo):not(.unused) {
-		color: red;
+		color: green;
 	}
 
 	p:not(.foo) {
@@ -25,13 +22,7 @@
 	p :not(.foo) {
 		color: red;
 	}
-	:global(.x):not(.foo) {
-		color: green;
-	}
-	:global(.x):not(.unused) {
-		color: red; /* TODO would be nice to prune this one day */
-	}
-	:global(.x) :not(.unused) {
+	p :not(.unused) {
 		color: red;
 	}
 </style>
\ No newline at end of file

From e6dd871819a5da9a749e7e0f015a774be8eb5ee3 Mon Sep 17 00:00:00 2001
From: Gonzalo Ruiz <rgon@outlook.com>
Date: Mon, 4 Nov 2024 23:31:36 +0100
Subject: [PATCH 111/404] fix: ensure migrate keeps inline/trailing comments in
 $props type definition and produces non-broken code (#14143)

* feat[sv migrate]: keep inline/trailing comments when migrating export let types to type definition

* test: add tests for inline comment migration

* chore: add changeset

* fix: migrate trailing multiline comment parsing no longer results in broken code, FIXES PR #14143#issuecomment-2455702689

* test: add migrate test with same-line trailing multiline comments and same-line leading multiline comments

* chore: add changeset

* fix: lint

---------

Co-authored-by: Gonzalo Ruiz <rgon@rgon.es>
Co-authored-by: paoloricciuti <ricciutipaolo@gmail.com>
---
 .changeset/mean-seas-give.md                  |  5 ++
 .changeset/purple-owls-hug.md                 |  5 ++
 packages/svelte/src/compiler/migrate/index.js | 72 +++++++++++++++++--
 .../samples/jsdoc-with-comments/input.svelte  | 17 ++++-
 .../samples/jsdoc-with-comments/output.svelte | 16 ++++-
 .../migrate/samples/props-ts/input.svelte     | 10 +++
 .../migrate/samples/props-ts/output.svelte    | 20 +++++-
 7 files changed, 134 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/mean-seas-give.md
 create mode 100644 .changeset/purple-owls-hug.md

diff --git a/.changeset/mean-seas-give.md b/.changeset/mean-seas-give.md
new file mode 100644
index 0000000000..0c16ac6d55
--- /dev/null
+++ b/.changeset/mean-seas-give.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure trailing multiline comments on props produce correct code (#14143#issuecomment-2455702689)
diff --git a/.changeset/purple-owls-hug.md b/.changeset/purple-owls-hug.md
new file mode 100644
index 0000000000..f3dcb0a5e3
--- /dev/null
+++ b/.changeset/purple-owls-hug.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure migrate keeps inline/trailing comments in $props type definition
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 3513098a20..8e8670c824 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -279,7 +279,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 						type = `interface ${type_name} {${newline_separator}${state.props
 							.map((prop) => {
 								const comment = prop.comment ? `${prop.comment}${newline_separator}` : '';
-								return `${comment}${prop.exported}${prop.optional ? '?' : ''}: ${prop.type};`;
+								return `${comment}${prop.exported}${prop.optional ? '?' : ''}: ${prop.type};${prop.trailing_comment ? ' ' + prop.trailing_comment : ''}`;
 							})
 							.join(newline_separator)}`;
 						if (analysis.uses_props || analysis.uses_rest_props) {
@@ -289,7 +289,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 					} else {
 						type = `/**\n${indent} * @typedef {Object} ${type_name}${state.props
 							.map((prop) => {
-								return `\n${indent} * @property {${prop.type}} ${prop.optional ? `[${prop.exported}]` : prop.exported}${prop.comment ? ` - ${prop.comment}` : ''}`;
+								return `\n${indent} * @property {${prop.type}} ${prop.optional ? `[${prop.exported}]` : prop.exported}${prop.comment ? ` - ${prop.comment}` : ''}${prop.trailing_comment ? ` - ${prop.trailing_comment.trim()}` : ''}`;
 							})
 							.join(``)}\n${indent} */`;
 					}
@@ -414,7 +414,7 @@ export function migrate(source, { filename, use_ts } = {}) {
  *  analysis: ComponentAnalysis;
  *  filename?: string;
  *  indent: string;
- *  props: Array<{ local: string; exported: string; init: string; bindable: boolean; slot_name?: string; optional: boolean; type: string; comment?: string; type_only?: boolean; needs_refine_type?: boolean; }>;
+ *  props: Array<{ local: string; exported: string; init: string; bindable: boolean; slot_name?: string; optional: boolean; type: string; comment?: string; trailing_comment?: string; type_only?: boolean; needs_refine_type?: boolean; }>;
  *  props_insertion_point: number;
  *  has_props_rune: boolean;
  *  has_type_or_fallback: boolean;
@@ -1497,13 +1497,28 @@ function extract_type_and_comment(declarator, state, path) {
 		str.update(comment_start, comment_end, '');
 	}
 
+	// Find trailing comments
+	const trailing_comment_node = /** @type {Node} */ (parent)?.trailingComments?.at(0);
+	const trailing_comment_start = /** @type {any} */ (trailing_comment_node)?.start;
+	const trailing_comment_end = /** @type {any} */ (trailing_comment_node)?.end;
+	let trailing_comment =
+		trailing_comment_node && str.original.substring(trailing_comment_start, trailing_comment_end);
+
+	if (trailing_comment_node) {
+		str.update(trailing_comment_start, trailing_comment_end, '');
+	}
+
 	if (declarator.id.typeAnnotation) {
 		state.has_type_or_fallback = true;
 		let start = declarator.id.typeAnnotation.start + 1; // skip the colon
 		while (str.original[start] === ' ') {
 			start++;
 		}
-		return { type: str.original.substring(start, declarator.id.typeAnnotation.end), comment };
+		return {
+			type: str.original.substring(start, declarator.id.typeAnnotation.end),
+			comment,
+			trailing_comment
+		};
 	}
 
 	let cleaned_comment_arr = comment
@@ -1526,12 +1541,43 @@ function extract_type_and_comment(declarator, state, path) {
 		?.slice(0, first_at_comment !== -1 ? first_at_comment : cleaned_comment_arr.length)
 		.join('\n');
 
+	let cleaned_comment_arr_trailing = trailing_comment
+		?.split('\n')
+		.map((line) =>
+			line
+				.trim()
+				// replace `// ` for one liners
+				.replace(/^\/\/\s*/g, '')
+				// replace `\**` for the initial JSDoc
+				.replace(/^\/\*\*?\s*/g, '')
+				// migrate `*/` for the end of JSDoc
+				.replace(/\s*\*\/$/g, '')
+				// remove any initial `* ` to clean the comment
+				.replace(/^\*\s*/g, '')
+		)
+		.filter(Boolean);
+	const first_at_comment_trailing = cleaned_comment_arr_trailing?.findIndex((line) =>
+		line.startsWith('@')
+	);
+	let cleaned_comment_trailing = cleaned_comment_arr_trailing
+		?.slice(
+			0,
+			first_at_comment_trailing !== -1
+				? first_at_comment_trailing
+				: cleaned_comment_arr_trailing.length
+		)
+		.join('\n');
+
 	// try to find a comment with a type annotation, hinting at jsdoc
 	if (parent?.type === 'ExportNamedDeclaration' && comment_node) {
 		state.has_type_or_fallback = true;
 		const match = /@type {(.+)}/.exec(comment_node.value);
 		if (match) {
-			return { type: match[1], comment: cleaned_comment };
+			return {
+				type: match[1],
+				comment: cleaned_comment,
+				trailing_comment: cleaned_comment_trailing
+			};
 		}
 	}
 
@@ -1540,11 +1586,19 @@ function extract_type_and_comment(declarator, state, path) {
 		state.has_type_or_fallback = true; // only assume type if it's trivial to infer - else someone would've added a type annotation
 		const type = typeof declarator.init.value;
 		if (type === 'string' || type === 'number' || type === 'boolean') {
-			return { type, comment: state.uses_ts ? comment : cleaned_comment };
+			return {
+				type,
+				comment: state.uses_ts ? comment : cleaned_comment,
+				trailing_comment: state.uses_ts ? trailing_comment : cleaned_comment_trailing
+			};
 		}
 	}
 
-	return { type: 'any', comment: state.uses_ts ? comment : cleaned_comment };
+	return {
+		type: 'any',
+		comment: state.uses_ts ? comment : cleaned_comment,
+		trailing_comment: state.uses_ts ? trailing_comment : cleaned_comment_trailing
+	};
 }
 
 // Ensure modifiers are applied in the same order as Svelte 4
@@ -1779,10 +1833,13 @@ function handle_identifier(node, state, path) {
 						comment = state.str.original.substring(comment_node.start, comment_node.end);
 					}
 
+					const trailing_comment = member.trailingComments?.at(0)?.value;
+
 					if (prop) {
 						prop.type = type;
 						prop.optional = member.optional;
 						prop.comment = comment ?? prop.comment;
+						prop.trailing_comment = trailing_comment ?? prop.trailing_comment;
 					} else {
 						state.props.push({
 							local: member.key.name,
@@ -1792,6 +1849,7 @@ function handle_identifier(node, state, path) {
 							optional: member.optional,
 							type,
 							comment,
+							trailing_comment,
 							type_only: true
 						});
 					}
diff --git a/packages/svelte/tests/migrate/samples/jsdoc-with-comments/input.svelte b/packages/svelte/tests/migrate/samples/jsdoc-with-comments/input.svelte
index 333980513a..f2efb1db80 100644
--- a/packages/svelte/tests/migrate/samples/jsdoc-with-comments/input.svelte
+++ b/packages/svelte/tests/migrate/samples/jsdoc-with-comments/input.svelte
@@ -24,5 +24,20 @@
 	/**
 	 * This is optional
 	 */
-	 export let optional = {stuff: true};
+	export let optional = {stuff: true};
+	
+	export let inline_commented; // this should stay a comment
+
+	/**
+	 * This comment should be merged
+	 */
+	export let inline_commented_merged; // with this inline comment
+
+	/*
+	* this is a same-line leading multiline comment
+	**/ export let inline_multiline_leading_comment = 'world';
+
+	export let inline_multiline_trailing_comment = 'world'; /*
+	* this is a same-line trailing multiline comment
+	**/
 </script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/jsdoc-with-comments/output.svelte b/packages/svelte/tests/migrate/samples/jsdoc-with-comments/output.svelte
index 271dd23ffb..19fbe38b50 100644
--- a/packages/svelte/tests/migrate/samples/jsdoc-with-comments/output.svelte
+++ b/packages/svelte/tests/migrate/samples/jsdoc-with-comments/output.svelte
@@ -9,6 +9,12 @@
 	
 
 	
+	
+
+	
+
+	
+
 	/**
 	 * @typedef {Object} Props
 	 * @property {string} comment - My wonderful comment
@@ -17,6 +23,10 @@
 	 * @property {any} no_comment
 	 * @property {boolean} type_no_comment
 	 * @property {any} [optional] - This is optional
+	 * @property {any} inline_commented - this should stay a comment
+	 * @property {any} inline_commented_merged - This comment should be merged - with this inline comment
+	 * @property {string} [inline_multiline_leading_comment] - this is a same-line leading multiline comment
+	 * @property {string} [inline_multiline_trailing_comment] - this is a same-line trailing multiline comment
 	 */
 
 	/** @type {Props} */
@@ -26,6 +36,10 @@
 		one_line,
 		no_comment,
 		type_no_comment,
-		optional = {stuff: true}
+		optional = {stuff: true},
+		inline_commented,
+		inline_commented_merged,
+		inline_multiline_leading_comment = 'world',
+		inline_multiline_trailing_comment = 'world'
 	} = $props();
 </script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/props-ts/input.svelte b/packages/svelte/tests/migrate/samples/props-ts/input.svelte
index 34007c08b7..9378c54ecf 100644
--- a/packages/svelte/tests/migrate/samples/props-ts/input.svelte
+++ b/packages/svelte/tests/migrate/samples/props-ts/input.svelte
@@ -6,6 +6,16 @@
 	export let bindingOptional: string | undefined = 'bar';
 	/** this should stay a comment */
 	export let no_type_but_comment = 0;
+	export let type_and_inline_comment:number; // this should also stay a comment
+	export let no_type_and_inline_comment = 0;         // this should stay as well
+
+	/*
+	* this is a same-line leading multiline comment
+	**/ export let inline_multiline_leading_comment = 'world';
+
+	export let inline_multiline_trailing_comment = 'world'; /*
+	* this is a same-line trailing multiline comment
+	**/
 </script>
 
 {readonly}
diff --git a/packages/svelte/tests/migrate/samples/props-ts/output.svelte b/packages/svelte/tests/migrate/samples/props-ts/output.svelte
index 36a0b0f4fb..e9deea1384 100644
--- a/packages/svelte/tests/migrate/samples/props-ts/output.svelte
+++ b/packages/svelte/tests/migrate/samples/props-ts/output.svelte
@@ -1,6 +1,9 @@
 <script lang="ts">
 	
 	
+
+	
+
 	interface Props {
 		/** some comment */
 		readonly: number;
@@ -9,6 +12,15 @@
 		bindingOptional?: string | undefined;
 		/** this should stay a comment */
 		no_type_but_comment?: number;
+		type_and_inline_comment: number; // this should also stay a comment
+		no_type_and_inline_comment?: number; // this should stay as well
+		/*
+	* this is a same-line leading multiline comment
+	**/
+		inline_multiline_leading_comment?: string;
+		inline_multiline_trailing_comment?: string; /*
+	* this is a same-line trailing multiline comment
+	**/
 	}
 
 	let {
@@ -16,11 +28,15 @@
 		optional = 'foo',
 		binding = $bindable(),
 		bindingOptional = $bindable('bar'),
-		no_type_but_comment = 0
+		no_type_but_comment = 0,
+		type_and_inline_comment,
+		no_type_and_inline_comment = 0,
+		inline_multiline_leading_comment = 'world',
+		inline_multiline_trailing_comment = 'world'
 	}: Props = $props();
 </script>
 
 {readonly}
 {optional}
 <input bind:value={binding} />
-<input bind:value={bindingOptional} />
\ No newline at end of file
+<input bind:value={bindingOptional} />

From 3d67cd53dbee6079834e208de4f65861798a3131 Mon Sep 17 00:00:00 2001
From: Pig Fang <g-plane@hotmail.com>
Date: Tue, 5 Nov 2024 17:13:46 +0800
Subject: [PATCH 112/404] docs: fix migration guide typo (#14155)

---
 documentation/docs/07-misc/07-v5-migration-guide.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index c7cdd36106..4ebfb5f905 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -36,7 +36,7 @@ In Svelte 4, a `$:` statement at the top level of a component could be used to d
 </script>
 ```
 
-As with `$state`, nothing else changes. `double` is still the number itself, and you read it directly, without a wrapper like `.value` or `getCount()`.
+As with `$state`, nothing else changes. `double` is still the number itself, and you read it directly, without a wrapper like `.value` or `getDouble()`.
 
 A `$:` statement could also be used to create side effects. In Svelte 5, this is achieved using the `$effect` rune:
 

From 0ce4b559f213944b426eb5cb687d5b22ba51bef7 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 5 Nov 2024 14:07:54 +0100
Subject: [PATCH 113/404] chore: add custom comment with link to playground for
 `pkg.pr.new` (#14151)

* chore: add custom comment with link to playground for `pkg.pr.new`

* chore: small updates to the script output

* chore: refine comment a bit, include multiple packages

* tweak comment

* chore: two steps workflow

* chore: update workflow

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .github/workflows/pkg.pr.new-comment.yml | 107 +++++++++++++++++++++++
 .github/workflows/pkg.pr.new.yml         |  18 +++-
 2 files changed, 124 insertions(+), 1 deletion(-)
 create mode 100644 .github/workflows/pkg.pr.new-comment.yml

diff --git a/.github/workflows/pkg.pr.new-comment.yml b/.github/workflows/pkg.pr.new-comment.yml
new file mode 100644
index 0000000000..b6ad1272f0
--- /dev/null
+++ b/.github/workflows/pkg.pr.new-comment.yml
@@ -0,0 +1,107 @@
+name: Update pkg.pr.new comment
+
+on:
+  workflow_run:
+    workflows: ['Publish Any Commit']
+    types:
+      - completed
+
+jobs:
+  build:
+    name: 'Update comment'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Download artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: output.json
+          path: output.json
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          run-id: ${{ github.event.workflow_run.id }}
+      - name: 'Post or update comment'
+        uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const fs = require('fs');
+            const output = JSON.parse(fs.readFileSync('output.json', 'utf8'));
+
+            const bot_comment_identifier = `<!-- pkg.pr.new comment -->`;
+
+            const body = (number) => `${bot_comment_identifier}
+
+            [Playground](https://svelte.dev/playground?version=pr-${number})
+
+            \`\`\`
+            ${output.packages.map((p) => `pnpm add https://pkg.pr.new/${p.name}@${number}`).join('\n')}
+            \`\`\`
+            `;
+
+            async function find_bot_comment(issue_number) {
+              if (!issue_number) return null;
+              const comments = await github.rest.issues.listComments({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: issue_number,
+              });
+              return comments.data.find((comment) =>
+                comment.body.includes(bot_comment_identifier)
+              );
+            }
+
+            async function create_or_update_comment(issue_number) {
+              if (!issue_number) {
+                console.log('No issue number provided. Cannot post or update comment.');
+                return;
+              }
+
+              const existing_comment = await find_bot_comment(issue_number);
+              if (existing_comment) {
+                await github.rest.issues.updateComment({
+                  owner: context.repo.owner,
+                  repo: context.repo.repo,
+                  comment_id: existing_comment.id,
+                  body: body(issue_number),
+                });
+              } else {
+                await github.rest.issues.createComment({
+                  issue_number: issue_number,
+                  owner: context.repo.owner,
+                  repo: context.repo.repo,
+                  body: body(issue_number),
+                });
+              }
+            }
+
+            async function log_publish_info() {
+              console.log('\n' + '='.repeat(50));
+              console.log('Publish Information');
+              console.log('='.repeat(50));
+              console.log('\nPublished Packages:');
+              console.log(packages);
+              console.log('\nPlayground URL:');
+              console.log(`\nhttps://svelte.dev/playground?version=commit-${output.sha.substring(0, 7)}`)
+              console.log('\n' + '='.repeat(50));
+            }
+
+            if (output.event_name === 'pull_request') {
+              if (context.issue.number) {
+                await create_or_update_comment(context.issue.number);
+              }
+            } else if (output.event_name === 'push') {
+              const pull_requests = await github.rest.pulls.list({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                state: 'open',
+                head: `${context.repo.owner}:${output.ref.replace('refs/heads/', '')}`,
+              });
+
+              if (pull_requests.data.length > 0) {
+                await create_or_update_comment(pull_requests.data[0].number);
+              } else {
+                console.log(
+                  'No open pull request found for this push. Logging publish information to console:'
+                );
+                await log_publish_info();
+              }
+            }
diff --git a/.github/workflows/pkg.pr.new.yml b/.github/workflows/pkg.pr.new.yml
index 76736782a0..ccb05ec93b 100644
--- a/.github/workflows/pkg.pr.new.yml
+++ b/.github/workflows/pkg.pr.new.yml
@@ -21,4 +21,20 @@ jobs:
       - name: Build
         run: pnpm build
 
-      - run: pnpx pkg-pr-new publish --compact --no-template './packages/svelte'
+      - run: pnpx pkg-pr-new publish --comment=off --json output.json --compact --no-template './packages/svelte'
+      - name: Add metadata to output
+        uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const fs = require('fs');
+            const output = JSON.parse(fs.readFileSync('output.json', 'utf8'));
+            output.number = context.issue.number;
+            output.event_name = context.eventName;
+            output.ref = context.ref;
+            fs.writeFileSync('output.json', JSON.stringify(output), 'utf8');
+      - name: Upload output
+        uses: actions/upload-artifact@v4
+        with:
+          name: output.json
+          path: output.json

From f1f4c29a9980480eefe75b973272c894aceaad17 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 5 Nov 2024 15:03:23 +0100
Subject: [PATCH 114/404] =?UTF-8?q?fix:=20`pkg.pr.new`=C2=A0comment=20work?=
 =?UTF-8?q?flow=20(#14156)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: `pkg.pr.new` comment workflow

* chore: remove path from initial workflow and add ls

* chore: add path back since it's mandatory
---
 .github/workflows/pkg.pr.new-comment.yml | 7 ++++---
 .github/workflows/pkg.pr.new.yml         | 4 +++-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/pkg.pr.new-comment.yml b/.github/workflows/pkg.pr.new-comment.yml
index b6ad1272f0..10d979121f 100644
--- a/.github/workflows/pkg.pr.new-comment.yml
+++ b/.github/workflows/pkg.pr.new-comment.yml
@@ -15,9 +15,10 @@ jobs:
         uses: actions/download-artifact@v4
         with:
           name: output.json
-          path: output.json
           github-token: ${{ secrets.GITHUB_TOKEN }}
           run-id: ${{ github.event.workflow_run.id }}
+
+      - run: ls -R .
       - name: 'Post or update comment'
         uses: actions/github-script@v6
         with:
@@ -85,8 +86,8 @@ jobs:
             }
 
             if (output.event_name === 'pull_request') {
-              if (context.issue.number) {
-                await create_or_update_comment(context.issue.number);
+              if (output.number) {
+                await create_or_update_comment(output.number);
               }
             } else if (output.event_name === 'push') {
               const pull_requests = await github.rest.pulls.list({
diff --git a/.github/workflows/pkg.pr.new.yml b/.github/workflows/pkg.pr.new.yml
index ccb05ec93b..a55dd5963c 100644
--- a/.github/workflows/pkg.pr.new.yml
+++ b/.github/workflows/pkg.pr.new.yml
@@ -37,4 +37,6 @@ jobs:
         uses: actions/upload-artifact@v4
         with:
           name: output.json
-          path: output.json
+          path: ./output
+
+      - run: ls -R .

From 16a40a8bcea44ff2ea8a062d20bc6e109bf65a22 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 5 Nov 2024 15:30:04 +0100
Subject: [PATCH 115/404] fix: use both correct paths (#14157)

* fix: try to read from right folder

* fix: use both correct paths
---
 .github/workflows/pkg.pr.new-comment.yml | 2 +-
 .github/workflows/pkg.pr.new.yml         | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/pkg.pr.new-comment.yml b/.github/workflows/pkg.pr.new-comment.yml
index 10d979121f..65038c9a4c 100644
--- a/.github/workflows/pkg.pr.new-comment.yml
+++ b/.github/workflows/pkg.pr.new-comment.yml
@@ -14,7 +14,7 @@ jobs:
       - name: Download artifact
         uses: actions/download-artifact@v4
         with:
-          name: output.json
+          name: output
           github-token: ${{ secrets.GITHUB_TOKEN }}
           run-id: ${{ github.event.workflow_run.id }}
 
diff --git a/.github/workflows/pkg.pr.new.yml b/.github/workflows/pkg.pr.new.yml
index a55dd5963c..4292ec900a 100644
--- a/.github/workflows/pkg.pr.new.yml
+++ b/.github/workflows/pkg.pr.new.yml
@@ -36,7 +36,7 @@ jobs:
       - name: Upload output
         uses: actions/upload-artifact@v4
         with:
-          name: output.json
-          path: ./output
+          name: output
+          path: ./output.json
 
       - run: ls -R .

From 0c853208ceba88053516312e27797df387d45c82 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 5 Nov 2024 15:46:01 +0100
Subject: [PATCH 116/404] fix: we are getting there...this should be it
 (#14158)

---
 .github/workflows/pkg.pr.new-comment.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/pkg.pr.new-comment.yml b/.github/workflows/pkg.pr.new-comment.yml
index 65038c9a4c..c3924799d8 100644
--- a/.github/workflows/pkg.pr.new-comment.yml
+++ b/.github/workflows/pkg.pr.new-comment.yml
@@ -79,7 +79,7 @@ jobs:
               console.log('Publish Information');
               console.log('='.repeat(50));
               console.log('\nPublished Packages:');
-              console.log(packages);
+              console.log(output.packages.map((p) => `${p.name} - pnpm add https://pkg.pr.new/${p.name}@${number}`).join('\n'));
               console.log('\nPlayground URL:');
               console.log(`\nhttps://svelte.dev/playground?version=commit-${output.sha.substring(0, 7)}`)
               console.log('\n' + '='.repeat(50));

From e786729555c58ce8ab4409e6c0de1780d65d205d Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 5 Nov 2024 17:05:21 +0100
Subject: [PATCH 117/404] fix: find the right sha for logging (#14159)

---
 .github/workflows/pkg.pr.new-comment.yml | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/pkg.pr.new-comment.yml b/.github/workflows/pkg.pr.new-comment.yml
index c3924799d8..1698a456d3 100644
--- a/.github/workflows/pkg.pr.new-comment.yml
+++ b/.github/workflows/pkg.pr.new-comment.yml
@@ -75,13 +75,17 @@ jobs:
             }
 
             async function log_publish_info() {
+              const svelte_package = output.packages.find(p => p.name === 'svelte');
+              const svelte_sha = svelte_package.url.replace(/^.+@([^@]+)$/, '$1');
               console.log('\n' + '='.repeat(50));
               console.log('Publish Information');
               console.log('='.repeat(50));
               console.log('\nPublished Packages:');
-              console.log(output.packages.map((p) => `${p.name} - pnpm add https://pkg.pr.new/${p.name}@${number}`).join('\n'));
-              console.log('\nPlayground URL:');
-              console.log(`\nhttps://svelte.dev/playground?version=commit-${output.sha.substring(0, 7)}`)
+              console.log(output.packages.map((p) => `${p.name} - pnpm add https://pkg.pr.new/${p.name}@${p.url.replace(/^.+@([^@]+)$/, '$1')}`).join('\n'));
+              if(svelte_sha){
+                console.log('\nPlayground URL:');
+                console.log(`\nhttps://svelte.dev/playground?version=commit-${svelte_sha}`)
+              }
               console.log('\n' + '='.repeat(50));
             }
 

From 927319c139a2bf729499ba4f576ced369a6ba41f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 5 Nov 2024 13:51:50 -0500
Subject: [PATCH 118/404] fix: update links in JSDoc (#14165)

---
 .changeset/rotten-toys-fix.md           | 5 +++++
 packages/svelte/src/transition/index.js | 2 +-
 packages/svelte/types/index.d.ts        | 2 +-
 3 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/rotten-toys-fix.md

diff --git a/.changeset/rotten-toys-fix.md b/.changeset/rotten-toys-fix.md
new file mode 100644
index 0000000000..fdaff54c1b
--- /dev/null
+++ b/.changeset/rotten-toys-fix.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: update links in JSDoc
diff --git a/packages/svelte/src/transition/index.js b/packages/svelte/src/transition/index.js
index 3978d088a3..8cc054cba2 100644
--- a/packages/svelte/src/transition/index.js
+++ b/packages/svelte/src/transition/index.js
@@ -209,7 +209,7 @@ function assign(tar, src) {
 }
 
 /**
- * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs#template-syntax-element-directives-transition-fn) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
+ * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs/svelte/transition) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
  *
  * @param {CrossfadeParams & {
  * 	fallback?: (node: Element, params: CrossfadeParams, intro: boolean) => TransitionConfig;
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index ca67923ee1..00ba2556d9 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1947,7 +1947,7 @@ declare module 'svelte/transition' {
 		getTotalLength(): number;
 	}, { delay, speed, duration, easing }?: DrawParams | undefined): TransitionConfig;
 	/**
-	 * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs#template-syntax-element-directives-transition-fn) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
+	 * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs/svelte/transition) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
 	 *
 	 * */
 	export function crossfade({ fallback, ...defaults }: CrossfadeParams & {

From ecc9b97a5be9a475f6dcc6fc84b46d9ad9ebceba Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 5 Nov 2024 13:54:18 -0500
Subject: [PATCH 119/404] Version Packages (#14097)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/dirty-parrots-smell.md   |  5 -----
 .changeset/empty-hairs-love.md      |  5 -----
 .changeset/mean-seas-give.md        |  5 -----
 .changeset/modern-pets-punch.md     |  5 -----
 .changeset/polite-timers-tell.md    |  5 -----
 .changeset/purple-owls-hug.md       |  5 -----
 .changeset/rotten-toys-fix.md       |  5 -----
 .changeset/selfish-chicken-argue.md |  5 -----
 .changeset/short-lions-search.md    |  5 -----
 .changeset/silent-tigers-lay.md     |  5 -----
 .changeset/silly-bulldogs-rest.md   |  5 -----
 .changeset/warm-eyes-protect.md     |  5 -----
 .changeset/yellow-pumas-rule.md     |  5 -----
 packages/svelte/CHANGELOG.md        | 30 +++++++++++++++++++++++++++++
 packages/svelte/package.json        |  2 +-
 packages/svelte/src/version.js      |  2 +-
 16 files changed, 32 insertions(+), 67 deletions(-)
 delete mode 100644 .changeset/dirty-parrots-smell.md
 delete mode 100644 .changeset/empty-hairs-love.md
 delete mode 100644 .changeset/mean-seas-give.md
 delete mode 100644 .changeset/modern-pets-punch.md
 delete mode 100644 .changeset/polite-timers-tell.md
 delete mode 100644 .changeset/purple-owls-hug.md
 delete mode 100644 .changeset/rotten-toys-fix.md
 delete mode 100644 .changeset/selfish-chicken-argue.md
 delete mode 100644 .changeset/short-lions-search.md
 delete mode 100644 .changeset/silent-tigers-lay.md
 delete mode 100644 .changeset/silly-bulldogs-rest.md
 delete mode 100644 .changeset/warm-eyes-protect.md
 delete mode 100644 .changeset/yellow-pumas-rule.md

diff --git a/.changeset/dirty-parrots-smell.md b/.changeset/dirty-parrots-smell.md
deleted file mode 100644
index 50864d20a4..0000000000
--- a/.changeset/dirty-parrots-smell.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure non-matching elements are scoped for `:not(...)` selector
diff --git a/.changeset/empty-hairs-love.md b/.changeset/empty-hairs-love.md
deleted file mode 100644
index a56e6c6334..0000000000
--- a/.changeset/empty-hairs-love.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure video elements autoplay in safari
diff --git a/.changeset/mean-seas-give.md b/.changeset/mean-seas-give.md
deleted file mode 100644
index 0c16ac6d55..0000000000
--- a/.changeset/mean-seas-give.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure trailing multiline comments on props produce correct code (#14143#issuecomment-2455702689)
diff --git a/.changeset/modern-pets-punch.md b/.changeset/modern-pets-punch.md
deleted file mode 100644
index 981547e9e5..0000000000
--- a/.changeset/modern-pets-punch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly infer `<a>` tag namespace
diff --git a/.changeset/polite-timers-tell.md b/.changeset/polite-timers-tell.md
deleted file mode 100644
index b98a89c95f..0000000000
--- a/.changeset/polite-timers-tell.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: check options namespace for top level `svelte:element`s
diff --git a/.changeset/purple-owls-hug.md b/.changeset/purple-owls-hug.md
deleted file mode 100644
index f3dcb0a5e3..0000000000
--- a/.changeset/purple-owls-hug.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure migrate keeps inline/trailing comments in $props type definition
diff --git a/.changeset/rotten-toys-fix.md b/.changeset/rotten-toys-fix.md
deleted file mode 100644
index fdaff54c1b..0000000000
--- a/.changeset/rotten-toys-fix.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: update links in JSDoc
diff --git a/.changeset/selfish-chicken-argue.md b/.changeset/selfish-chicken-argue.md
deleted file mode 100644
index 32e0d0afef..0000000000
--- a/.changeset/selfish-chicken-argue.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure SvelteMap and SvelteSet work with generators in dev
diff --git a/.changeset/short-lions-search.md b/.changeset/short-lions-search.md
deleted file mode 100644
index ed3abdc053..0000000000
--- a/.changeset/short-lions-search.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: only output the key for each_key_duplicate
diff --git a/.changeset/silent-tigers-lay.md b/.changeset/silent-tigers-lay.md
deleted file mode 100644
index 8debfd7151..0000000000
--- a/.changeset/silent-tigers-lay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent migrated snippet from shadow snippet prop
diff --git a/.changeset/silly-bulldogs-rest.md b/.changeset/silly-bulldogs-rest.md
deleted file mode 100644
index f92eb81575..0000000000
--- a/.changeset/silly-bulldogs-rest.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: pass along `anchor` in legacy class wrappers
diff --git a/.changeset/warm-eyes-protect.md b/.changeset/warm-eyes-protect.md
deleted file mode 100644
index fbb971f314..0000000000
--- a/.changeset/warm-eyes-protect.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: recognize all custom element prop definitions
diff --git a/.changeset/yellow-pumas-rule.md b/.changeset/yellow-pumas-rule.md
deleted file mode 100644
index 02def3c178..0000000000
--- a/.changeset/yellow-pumas-rule.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: migrate multiple declarations with only some exported correctly
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 0786d007f3..cdda3a12c3 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,35 @@
 # svelte
 
+## 5.1.10
+
+### Patch Changes
+
+- fix: ensure non-matching elements are scoped for `:not(...)` selector ([#13999](https://github.com/sveltejs/svelte/pull/13999))
+
+- fix: ensure video elements autoplay in safari ([#14095](https://github.com/sveltejs/svelte/pull/14095))
+
+- fix: ensure trailing multiline comments on props produce correct code (#14143#issuecomment-2455702689) ([#14143](https://github.com/sveltejs/svelte/pull/14143))
+
+- fix: correctly infer `<a>` tag namespace ([#14134](https://github.com/sveltejs/svelte/pull/14134))
+
+- fix: check options namespace for top level `svelte:element`s ([#14101](https://github.com/sveltejs/svelte/pull/14101))
+
+- fix: ensure migrate keeps inline/trailing comments in $props type definition ([#14143](https://github.com/sveltejs/svelte/pull/14143))
+
+- fix: update links in JSDoc ([#14165](https://github.com/sveltejs/svelte/pull/14165))
+
+- fix: ensure SvelteMap and SvelteSet work with generators in dev ([#14103](https://github.com/sveltejs/svelte/pull/14103))
+
+- fix: only output the key for each_key_duplicate ([#14147](https://github.com/sveltejs/svelte/pull/14147))
+
+- fix: prevent migrated snippet from shadow snippet prop ([#14127](https://github.com/sveltejs/svelte/pull/14127))
+
+- fix: pass along `anchor` in legacy class wrappers ([#14100](https://github.com/sveltejs/svelte/pull/14100))
+
+- fix: recognize all custom element prop definitions ([#14084](https://github.com/sveltejs/svelte/pull/14084))
+
+- fix: migrate multiple declarations with only some exported correctly ([#14126](https://github.com/sveltejs/svelte/pull/14126))
+
 ## 5.1.9
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 257d3924bf..5234e334b6 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.1.9",
+  "version": "5.1.10",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index e6a9988e3a..d91ee8164e 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.1.9';
+export const VERSION = '5.1.10';
 export const PUBLIC_VERSION = '5';

From 5077061695a00f8e6fccc37cf7fd66490e061ae4 Mon Sep 17 00:00:00 2001
From: Caique Torres <56696506+caiquetorres@users.noreply.github.com>
Date: Tue, 5 Nov 2024 16:29:38 -0300
Subject: [PATCH 120/404] fix: issue with implicit public modifier causing
 undefined properties (#14153)

closes #14152
---
 .changeset/four-countries-taste.md                 |  5 +++++
 .../phases/1-parse/remove_typescript_nodes.js      |  2 +-
 .../runtime-runes/samples/typescript/main.svelte   |  5 ++++-
 .../ts-unsupported-modifier-readonly/errors.json   | 14 ++++++++++++++
 .../ts-unsupported-modifier-readonly/input.svelte  |  5 +++++
 5 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/four-countries-taste.md
 create mode 100644 packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/input.svelte

diff --git a/.changeset/four-countries-taste.md b/.changeset/four-countries-taste.md
new file mode 100644
index 0000000000..6873b2ae2d
--- /dev/null
+++ b/.changeset/four-countries-taste.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: error on TypeScript's `readonly` modifier
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index edbb673bd5..5febef420d 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -94,7 +94,7 @@ const visitors = {
 		e.typescript_invalid_feature(node, 'enums');
 	},
 	TSParameterProperty(node, context) {
-		if (node.accessibility && context.path.at(-2)?.kind === 'constructor') {
+		if ((node.readonly || node.accessibility) && context.path.at(-2)?.kind === 'constructor') {
 			e.typescript_invalid_feature(node, 'accessibility modifiers on constructor parameters');
 		}
 		return node.parameter;
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index d1c4f361ba..6c9cacdeff 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -9,7 +9,10 @@
 	}
 
 	class Foo {
-		constructor(readonly name: string) {}
+		public name: string;
+		constructor(name: string) {
+			this.name = name;
+		}
 	}
 
 	declare const declared_const: number;
diff --git a/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/errors.json b/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/errors.json
new file mode 100644
index 0000000000..44399179c0
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "typescript_invalid_feature",
+		"message": "TypeScript language features like accessibility modifiers on constructor parameters 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 })`)",
+		"start": {
+			"line": 3,
+			"column": 14
+		},
+		"end": {
+			"line": 3,
+			"column": 32
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/input.svelte b/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/input.svelte
new file mode 100644
index 0000000000..b099667fa2
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/ts-unsupported-modifier-readonly/input.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	class Foo {
+		constructor(readonly x: number) {}
+	}
+</script>

From aa23415179364d7f50f652c4e1a704e5a5d2ff16 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 6 Nov 2024 13:49:37 +0100
Subject: [PATCH 123/404] fix: remove scoping for most `:not` selectors 
 (#14177)

fixes #14168

This reverts the whole "selectors inside `:not` are scoped" logic. Scoping is done so that styles don't bleed. But within `:not`,everything is reversed, which means scoping the selectors now means they are more likely to bleed. That is the opposite of what we want to achieve, therefore we should just leave those selectors alone.

The exception are `:not` selectors with descendant selectors, as that means "look up the tree" and we need to scope all ancestor elements in that case.
---
 .changeset/quick-eels-occur.md                |  5 ++
 packages/svelte/src/compiler/migrate/index.js |  6 +-
 .../phases/2-analyze/css/css-prune.js         | 80 +++++++++----------
 .../compiler/phases/3-transform/css/index.js  | 43 +++++-----
 .../samples/not-selector-global/_config.js    | 17 +---
 .../samples/not-selector-global/expected.css  | 26 ++++--
 .../samples/not-selector-global/expected.html |  4 +-
 .../samples/not-selector-global/input.svelte  | 20 ++++-
 .../_config.js                                |  5 --
 .../expected.css                              |  4 -
 .../expected.html                             |  1 -
 .../input.svelte                              |  8 --
 .../tests/css/samples/not-selector/_config.js | 38 +++------
 .../css/samples/not-selector/expected.css     | 25 +++---
 .../css/samples/not-selector/expected.html    |  4 +-
 .../css/samples/not-selector/input.svelte     | 19 ++++-
 packages/svelte/tests/css/test.ts             | 28 +++----
 .../samples/is-not-where-has/output.svelte    | 10 +--
 18 files changed, 172 insertions(+), 171 deletions(-)
 create mode 100644 .changeset/quick-eels-occur.md
 delete mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
 delete mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
 delete mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
 delete mode 100644 packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte

diff --git a/.changeset/quick-eels-occur.md b/.changeset/quick-eels-occur.md
new file mode 100644
index 0000000000..e5eb153fbf
--- /dev/null
+++ b/.changeset/quick-eels-occur.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove scoping for `:not` selectors
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 8e8670c824..387b6a5485 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -50,9 +50,9 @@ function migrate_css(state) {
 	while (code) {
 		if (
 			code.startsWith(':has') ||
-			code.startsWith(':not') ||
 			code.startsWith(':is') ||
-			code.startsWith(':where')
+			code.startsWith(':where') ||
+			code.startsWith(':not')
 		) {
 			let start = code.indexOf('(') + 1;
 			let is_global = false;
@@ -74,7 +74,7 @@ function migrate_css(state) {
 				char = code[end];
 			}
 			if (start && end) {
-				if (!is_global) {
+				if (!is_global && !code.startsWith(':not')) {
 					str.prependLeft(starting + start, ':global(');
 					str.appendRight(starting + end - 1, ')');
 				}
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 fae89f11ed..4306d49d81 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
@@ -10,7 +10,6 @@ import { get_attribute_chunks, is_text_attribute } from '../../../utils/ast.js';
  *   stylesheet: Compiler.Css.StyleSheet;
  *   element: Compiler.AST.RegularElement | Compiler.AST.SvelteElement;
  *   from_render_tag: boolean;
- *   inside_not: boolean;
  * }} State
  */
 /** @typedef {NODE_PROBABLY_EXISTS | NODE_DEFINITELY_EXISTS} NodeExistsValue */
@@ -62,13 +61,9 @@ export function prune(stylesheet, element) {
 		const parent = get_element_parent(element);
 		if (!parent) return;
 
-		walk(
-			stylesheet,
-			{ stylesheet, element: parent, from_render_tag: true, inside_not: false },
-			visitors
-		);
+		walk(stylesheet, { stylesheet, element: parent, from_render_tag: true }, visitors);
 	} else {
-		walk(stylesheet, { stylesheet, element, from_render_tag: false, inside_not: false }, visitors);
+		walk(stylesheet, { stylesheet, element, from_render_tag: false }, visitors);
 	}
 }
 
@@ -179,9 +174,9 @@ function truncate(node) {
 						selector.type === 'PseudoClassSelector' &&
 						selector.args !== null &&
 						(selector.name === 'has' ||
-							selector.name === 'not' ||
 							selector.name === 'is' ||
-							selector.name === 'where')
+							selector.name === 'where' ||
+							selector.name === 'not')
 				))
 		);
 	});
@@ -227,7 +222,7 @@ function apply_selector(relative_selectors, rule, element, state) {
 	// if this is the left-most non-global selector, mark it — we want
 	// `x y z {...}` to become `x.blah y z.blah {...}`
 	const parent = parent_selectors[parent_selectors.length - 1];
-	if (!state.inside_not && (!parent || is_global(parent, rule))) {
+	if (!parent || is_global(parent, rule)) {
 		mark(relative_selector, element);
 	}
 
@@ -269,7 +264,7 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 				if (parent.type === 'RegularElement' || parent.type === 'SvelteElement') {
 					if (apply_selector(parent_selectors, rule, parent, state)) {
 						// TODO the `name === ' '` causes false positives, but removing it causes false negatives...
-						if (!state.inside_not && (name === ' ' || crossed_component_boundary)) {
+						if (name === ' ' || crossed_component_boundary) {
 							mark(parent_selectors[parent_selectors.length - 1], parent);
 						}
 
@@ -295,15 +290,11 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 				if (possible_sibling.type === 'RenderTag' || possible_sibling.type === 'SlotElement') {
 					// `{@render foo()}<p>foo</p>` with `:global(.x) + p` is a match
 					if (parent_selectors.length === 1 && parent_selectors[0].metadata.is_global) {
-						if (!state.inside_not) {
-							mark(relative_selector, element);
-						}
+						mark(relative_selector, element);
 						sibling_matched = true;
 					}
 				} else if (apply_selector(parent_selectors, rule, possible_sibling, state)) {
-					if (!state.inside_not) {
-						mark(relative_selector, element);
-					}
+					mark(relative_selector, element);
 					sibling_matched = true;
 				}
 			}
@@ -512,7 +503,35 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				// We came across a :global, everything beyond it is global and therefore a potential match
 				if (name === 'global' && selector.args === null) return true;
 
-				if ((name === 'is' || name === 'where' || name === 'not') && selector.args) {
+				// :not(...) contents should stay unscoped. Scoping them would achieve the opposite of what we want,
+				// because they are then _more_ likely to bleed out of the component. The exception is complex selectors
+				// with descendants, in which case we scope them all.
+				if (name === 'not' && selector.args) {
+					for (const complex_selector of selector.args.children) {
+						complex_selector.metadata.used = true;
+						const relative = truncate(complex_selector);
+
+						if (complex_selector.children.length > 1) {
+							// foo:not(bar foo) means that bar is an ancestor of foo (side note: ending with foo is the only way the selector make sense).
+							// We can't fully check if that actually matches with our current algorithm, so we just assume it does.
+							// The result may not match a real element, so the only drawback is the missing prune.
+							for (const selector of relative) {
+								selector.metadata.scoped = true;
+							}
+
+							/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null} */
+							let el = element;
+							while (el) {
+								el.metadata.scoped = true;
+								el = get_element_parent(el);
+							}
+						}
+					}
+
+					break;
+				}
+
+				if ((name === 'is' || name === 'where') && selector.args) {
 					let matched = false;
 
 					for (const complex_selector of selector.args.children) {
@@ -522,32 +541,9 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 						if (is_global) {
 							complex_selector.metadata.used = true;
 							matched = true;
-						} else if (name !== 'not' && apply_selector(relative, rule, element, state)) {
+						} else if (apply_selector(relative, rule, element, state)) {
 							complex_selector.metadata.used = true;
 							matched = true;
-						} else if (
-							name === 'not' &&
-							!apply_selector(relative, rule, element, { ...state, inside_not: true })
-						) {
-							// For `:not(...)` we gotta do the inverse: If it did not match, mark the element and possibly
-							// everything above (if the selector is written is a such) as scoped (because they matched by not matching).
-							element.metadata.scoped = true;
-							complex_selector.metadata.used = true;
-							matched = true;
-
-							for (const r of relative) {
-								r.metadata.scoped = true;
-							}
-
-							// bar:not(foo bar) means that foo is an ancestor of bar
-							if (complex_selector.children.length > 1) {
-								/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null} */
-								let el = get_element_parent(element);
-								while (el) {
-									el.metadata.scoped = true;
-									el = get_element_parent(el);
-								}
-							}
 						} else if (complex_selector.children.length > 1 && (name == 'is' || name == 'where')) {
 							// foo :is(bar baz) can also mean that bar is an ancestor of foo, and baz a descendant.
 							// We can't fully check if that actually matches with our current algorithm, so we just assume it does.
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 62c520e994..350eca35d8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -278,29 +278,10 @@ const visitors = {
 	ComplexSelector(node, context) {
 		const before_bumped = context.state.specificity.bumped;
 
-		/**
-		 * @param {Css.PseudoClassSelector} selector
-		 * @param {Css.Combinator | null} combinator
-		 */
-		function remove_global_pseudo_class(selector, combinator) {
-			if (selector.args === null) {
-				let start = selector.start;
-				if (combinator?.name === ' ') {
-					// div :global.x becomes div.x
-					while (/\s/.test(context.state.code.original[start - 1])) start--;
-				}
-				context.state.code.remove(start, selector.start + ':global'.length);
-			} else {
-				context.state.code
-					.remove(selector.start, selector.start + ':global('.length)
-					.remove(selector.end - 1, selector.end);
-			}
-		}
-
 		for (const relative_selector of node.children) {
 			if (relative_selector.metadata.is_global) {
 				const global = /** @type {Css.PseudoClassSelector} */ (relative_selector.selectors[0]);
-				remove_global_pseudo_class(global, relative_selector.combinator);
+				remove_global_pseudo_class(global, relative_selector.combinator, context.state);
 
 				if (
 					node.metadata.rule?.metadata.parent_rule &&
@@ -328,7 +309,7 @@ const visitors = {
 				// for any :global() or :global at the middle of compound selector
 				for (const selector of relative_selector.selectors) {
 					if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
-						remove_global_pseudo_class(selector, null);
+						remove_global_pseudo_class(selector, null, context.state);
 					}
 				}
 
@@ -380,6 +361,26 @@ const visitors = {
 	}
 };
 
+/**
+ * @param {Css.PseudoClassSelector} selector
+ * @param {Css.Combinator | null} combinator
+ * @param {State} state
+ */
+function remove_global_pseudo_class(selector, combinator, state) {
+	if (selector.args === null) {
+		let start = selector.start;
+		if (combinator?.name === ' ') {
+			// div :global.x becomes div.x
+			while (/\s/.test(state.code.original[start - 1])) start--;
+		}
+		state.code.remove(start, selector.start + ':global'.length);
+	} else {
+		state.code
+			.remove(selector.start, selector.start + ':global('.length)
+			.remove(selector.end - 1, selector.end);
+	}
+}
+
 /**
  * Walk backwards until we find a non-whitespace character
  * @param {number} end
diff --git a/packages/svelte/tests/css/samples/not-selector-global/_config.js b/packages/svelte/tests/css/samples/not-selector-global/_config.js
index 2776ac227a..292c6c49ac 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/_config.js
+++ b/packages/svelte/tests/css/samples/not-selector-global/_config.js
@@ -1,20 +1,5 @@
 import { test } from '../../test';
 
 export default test({
-	warnings: [
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ":global(.x) :not(p)"',
-			start: {
-				line: 14,
-				column: 1,
-				character: 197
-			},
-			end: {
-				line: 14,
-				column: 20,
-				character: 216
-			}
-		}
-	]
+	warnings: []
 });
diff --git a/packages/svelte/tests/css/samples/not-selector-global/expected.css b/packages/svelte/tests/css/samples/not-selector-global/expected.css
index f90edd0c88..ea9ff39486 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/expected.css
+++ b/packages/svelte/tests/css/samples/not-selector-global/expected.css
@@ -2,18 +2,28 @@
 	.svelte-xyz:not(.foo) {
 		color: green;
 	}
-	.svelte-xyz:not(.foo:where(.svelte-xyz)):not(.unused) {
+	.svelte-xyz:not(.foo):not(.unused) {
 		color: green;
 	}
-	.x:not(.foo.svelte-xyz) {
+	.x:not(.foo) {
 		color: green;
 	}
-	/* (unused) :global(.x) :not(p) {
-		color: red;
-	}*/
-	.x:not(p.svelte-xyz) {
-		color: red; /* TODO would be nice to prune this one day */
+	.x .svelte-xyz:not(p) {
+		color: green;
+	}
+	.x:not(p) {
+		color: green;
+	}
+	.x .svelte-xyz:not(.unused) {
+		color: green;
+	}
+
+	span:not(p.svelte-xyz span:where(.svelte-xyz)) {
+		color: green;
+	}
+	span.svelte-xyz:not(p span) {
+		color: green;
 	}
-	.x .svelte-xyz:not(.unused:where(.svelte-xyz)) {
+	span:not(p span) {
 		color: green;
 	}
diff --git a/packages/svelte/tests/css/samples/not-selector-global/expected.html b/packages/svelte/tests/css/samples/not-selector-global/expected.html
index b4834bb818..5eeb2be294 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/expected.html
+++ b/packages/svelte/tests/css/samples/not-selector-global/expected.html
@@ -1 +1,3 @@
-<p class="foo svelte-xyz">foo</p> <p class="bar svelte-xyz">bar</p>
\ No newline at end of file
+<p class="foo svelte-xyz">foo</p>
+<p class="bar svelte-xyz">bar <span class="svelte-xyz">baz</span></p>
+<span class="svelte-xyz">buzz</span>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-global/input.svelte b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
index 578052d943..1f0e6cd6db 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/input.svelte
+++ b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
@@ -1,5 +1,9 @@
 <p class="foo">foo</p>
-<p class="bar">bar</p>
+<p class="bar">
+	bar
+	<span>baz</span>
+</p>
+<span>buzz</span>
 
 <style>
 	:not(:global(.foo)) {
@@ -12,12 +16,22 @@
 		color: green;
 	}
 	:global(.x) :not(p) {
-		color: red;
+		color: green;
 	}
 	:global(.x):not(p) {
-		color: red; /* TODO would be nice to prune this one day */
+		color: green;
 	}
 	:global(.x) :not(.unused) {
 		color: green;
 	}
+
+	:global(span):not(p span) {
+		color: green;
+	}
+	span:not(:global(p span)) {
+		color: green;
+	}
+	:global(span:not(p span)) {
+		color: green;
+	}
 </style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
deleted file mode 100644
index 292c6c49ac..0000000000
--- a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/_config.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	warnings: []
-});
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
deleted file mode 100644
index 8fe09de6dc..0000000000
--- a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.css
+++ /dev/null
@@ -1,4 +0,0 @@
-
-	.svelte-xyz:not(.bar:where(.svelte-xyz)) {
-		color: green;
-	}
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
deleted file mode 100644
index fa4ca95c60..0000000000
--- a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/expected.html
+++ /dev/null
@@ -1 +0,0 @@
-<p class="foo svelte-xyz">foo</p> <p class="bar">bar</p>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte b/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte
deleted file mode 100644
index 6599a21ca6..0000000000
--- a/packages/svelte/tests/css/samples/not-selector-hash-on-right-elements/input.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<p class="foo">foo</p>
-<p class="bar">bar</p>
-
-<style>
-	:not(.bar) {
-		color: green;
-	}
-</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector/_config.js b/packages/svelte/tests/css/samples/not-selector/_config.js
index 27b4f91a6a..9c91a2a4c0 100644
--- a/packages/svelte/tests/css/samples/not-selector/_config.js
+++ b/packages/svelte/tests/css/samples/not-selector/_config.js
@@ -4,44 +4,30 @@ export default test({
 	warnings: [
 		{
 			code: 'css_unused_selector',
-			message: 'Unused CSS selector ":not(p)"',
+			message: 'Unused CSS selector "span :not(.foo)"',
 			start: {
-				line: 11,
+				line: 26,
 				column: 1,
-				character: 125
+				character: 276
 			},
 			end: {
-				line: 11,
-				column: 8,
-				character: 132
-			}
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector "p :not(.foo)"',
-			start: {
-				line: 22,
-				column: 1,
-				character: 235
-			},
-			end: {
-				line: 22,
-				column: 13,
-				character: 247
+				line: 26,
+				column: 16,
+				character: 291
 			}
 		},
 		{
 			code: 'css_unused_selector',
-			message: 'Unused CSS selector "p :not(.unused)"',
+			message: 'Unused CSS selector "span :not(.unused)"',
 			start: {
-				line: 25,
+				line: 29,
 				column: 1,
-				character: 268
+				character: 312
 			},
 			end: {
-				line: 25,
-				column: 16,
-				character: 283
+				line: 29,
+				column: 19,
+				character: 330
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/not-selector/expected.css b/packages/svelte/tests/css/samples/not-selector/expected.css
index b4d51bf269..ea0b3aacac 100644
--- a/packages/svelte/tests/css/samples/not-selector/expected.css
+++ b/packages/svelte/tests/css/samples/not-selector/expected.css
@@ -1,24 +1,31 @@
 
-	.svelte-xyz:not(.foo:where(.svelte-xyz)) {
+	.svelte-xyz:not(.foo) {
 		color: green;
 	}
-	.svelte-xyz:not(.unused:where(.svelte-xyz)) {
+	.svelte-xyz:not(.unused) {
+		color: green;
+	}
+	.svelte-xyz:not(p) {
 		color: green;
 	}
-	/* (unused) :not(p) {
-		color: red;
-	}*/
 
-	.svelte-xyz:not(.foo:where(.svelte-xyz)):not(.unused:where(.svelte-xyz)) {
+	.svelte-xyz:not(.foo):not(.unused) {
 		color: green;
 	}
 
-	p.svelte-xyz:not(.foo:where(.svelte-xyz)) {
+	p.svelte-xyz:not(.foo) {
 		color: green;
 	}
-	/* (unused) p :not(.foo) {
+	/* (unused) span :not(.foo) {
 		color: red;
 	}*/
-	/* (unused) p :not(.unused) {
+	/* (unused) span :not(.unused) {
 		color: red;
 	}*/
+
+	span.svelte-xyz:not(p:where(.svelte-xyz) span:where(.svelte-xyz)) {
+		color: green;
+	}
+	span.svelte-xyz:not(:focus) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/not-selector/expected.html b/packages/svelte/tests/css/samples/not-selector/expected.html
index b4834bb818..5eeb2be294 100644
--- a/packages/svelte/tests/css/samples/not-selector/expected.html
+++ b/packages/svelte/tests/css/samples/not-selector/expected.html
@@ -1 +1,3 @@
-<p class="foo svelte-xyz">foo</p> <p class="bar svelte-xyz">bar</p>
\ No newline at end of file
+<p class="foo svelte-xyz">foo</p>
+<p class="bar svelte-xyz">bar <span class="svelte-xyz">baz</span></p>
+<span class="svelte-xyz">buzz</span>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/not-selector/input.svelte b/packages/svelte/tests/css/samples/not-selector/input.svelte
index a0e72c7be8..3a786530a2 100644
--- a/packages/svelte/tests/css/samples/not-selector/input.svelte
+++ b/packages/svelte/tests/css/samples/not-selector/input.svelte
@@ -1,5 +1,9 @@
 <p class="foo">foo</p>
-<p class="bar">bar</p>
+<p class="bar">
+	bar
+	<span>baz</span>
+</p>
+<span>buzz</span>
 
 <style>
 	:not(.foo) {
@@ -9,7 +13,7 @@
 		color: green;
 	}
 	:not(p) {
-		color: red;
+		color: green;
 	}
 
 	:not(.foo):not(.unused) {
@@ -19,10 +23,17 @@
 	p:not(.foo) {
 		color: green;
 	}
-	p :not(.foo) {
+	span :not(.foo) {
 		color: red;
 	}
-	p :not(.unused) {
+	span :not(.unused) {
 		color: red;
 	}
+
+	span:not(p span) {
+		color: green;
+	}
+	span:not(:focus) {
+		color: green;
+	}
 </style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/test.ts b/packages/svelte/tests/css/test.ts
index 30ad96369a..443ee02958 100644
--- a/packages/svelte/tests/css/test.ts
+++ b/packages/svelte/tests/css/test.ts
@@ -32,30 +32,17 @@ 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 });
 
-	const dom_css = fs.readFileSync(`${cwd}/_output/client/input.svelte.css`, 'utf-8').trim();
-	const ssr_css = fs.readFileSync(`${cwd}/_output/server/input.svelte.css`, 'utf-8').trim();
-
-	assert.equal(dom_css, ssr_css);
-
-	const dom_warnings = load_warnings(`${cwd}/_output/client/input.svelte.warnings.json`);
-	const ssr_warnings = load_warnings(`${cwd}/_output/server/input.svelte.warnings.json`);
-	const expected_warnings = (config.warnings || []).map(normalize_warning);
-	assert.deepEqual(dom_warnings, ssr_warnings);
-	assert.deepEqual(dom_warnings.map(normalize_warning), expected_warnings);
-
 	const expected = {
 		html: try_read_file(`${cwd}/expected.html`),
 		css: try_read_file(`${cwd}/expected.css`)
 	};
 
-	assert.equal(dom_css.trim().replace(/\r\n/g, '\n'), (expected.css ?? '').trim());
-
 	// we do this here, rather than in the expected.html !== null
 	// block, to verify that valid code was generated
 	const ClientComponent = (await import(`${cwd}/_output/client/input.svelte.js`)).default;
 	const ServerComponent = (await import(`${cwd}/_output/server/input.svelte.js`)).default;
 
-	// verify that the right elements have scoping selectors
+	// verify that the right elements have scoping selectors (do this first to ensure all actual files are written to disk)
 	if (expected.html !== null) {
 		const target = window.document.createElement('main');
 
@@ -75,6 +62,19 @@ const { test, run } = suite<CssTest>(async (config, cwd) => {
 		// const actual_ssr = ServerComponent.render(config.props).html;
 		// assert_html_equal(actual_ssr, expected.html);
 	}
+
+	const dom_css = fs.readFileSync(`${cwd}/_output/client/input.svelte.css`, 'utf-8').trim();
+	const ssr_css = fs.readFileSync(`${cwd}/_output/server/input.svelte.css`, 'utf-8').trim();
+
+	assert.equal(dom_css, ssr_css);
+
+	const dom_warnings = load_warnings(`${cwd}/_output/client/input.svelte.warnings.json`);
+	const ssr_warnings = load_warnings(`${cwd}/_output/server/input.svelte.warnings.json`);
+	const expected_warnings = (config.warnings || []).map(normalize_warning);
+	assert.deepEqual(dom_warnings, ssr_warnings);
+	assert.deepEqual(dom_warnings.map(normalize_warning), expected_warnings);
+
+	assert.equal(dom_css.trim().replace(/\r\n/g, '\n'), (expected.css ?? '').trim());
 });
 
 export { test };
diff --git a/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
index 1e02e9bdfd..d8bb703ac5 100644
--- a/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
+++ b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
@@ -21,22 +21,22 @@ what if i'm talking about `:has()` in my blog?
 
 <style lang="postcss">
 	div:has(:global(span)){}
-	div > :not(:global(span)){}
+	div > :not(span){}
 	div > :is(:global(span)){}
 	div > :where(:global(span)){}
 
 	div:has(:global(:is(span))){}
-	div > :not(:global(:is(span))){}
+	div > :not(:is(span)){}
 	div > :is(:global(:is(span))){}
 	div > :where(:global(:is(span))){}
 
 	div:has(:global(.class:is(span))){}
-	div > :not(:global(.class:is(span))){}
+	div > :not(.class:is(span)){}
 	div > :is(:global(.class:is(span))){}
 	div > :where(:global(.class:is(span))){}
 
 	div :has(:global(.class:is(span:where(:focus)))){}
-	div :not(:global(.class:is(span:where(:focus-within)))){}
+	div :not(.class:is(span:where(:focus-within))){}
 	div :is(:global(.class:is(span:is(:hover)))){}
 	div :where(:global(.class:is(span:has(* > *)))){}
 	div :is(:global(.class:is(span:is(:hover)), .x)){}
@@ -51,7 +51,7 @@ what if i'm talking about `:has()` in my blog?
 		p:has(:global(&)){
 
 		}
-		:not(:global(span > *)){
+		:not(span > *){
 			:where(:global(form)){}
 		}
 	}

From c49949621b1ce2bfc53963a369c649ae2d65a824 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 6 Nov 2024 08:01:05 -0500
Subject: [PATCH 124/404] Version Packages (#14167)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/four-countries-taste.md | 5 -----
 .changeset/quick-eels-occur.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/four-countries-taste.md
 delete mode 100644 .changeset/quick-eels-occur.md

diff --git a/.changeset/four-countries-taste.md b/.changeset/four-countries-taste.md
deleted file mode 100644
index 6873b2ae2d..0000000000
--- a/.changeset/four-countries-taste.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: error on TypeScript's `readonly` modifier
diff --git a/.changeset/quick-eels-occur.md b/.changeset/quick-eels-occur.md
deleted file mode 100644
index e5eb153fbf..0000000000
--- a/.changeset/quick-eels-occur.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove scoping for `:not` selectors
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index cdda3a12c3..b57d72ea0a 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.1.11
+
+### Patch Changes
+
+- fix: error on TypeScript's `readonly` modifier ([#14153](https://github.com/sveltejs/svelte/pull/14153))
+
+- fix: remove scoping for `:not` selectors ([#14177](https://github.com/sveltejs/svelte/pull/14177))
+
 ## 5.1.10
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 5234e334b6..4ee792827d 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.1.10",
+  "version": "5.1.11",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index d91ee8164e..c5cc14a530 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.1.10';
+export const VERSION = '5.1.11';
 export const PUBLIC_VERSION = '5';

From 9b2a8f15fbf9c96b3cdb7af54eb72f557730a177 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 6 Nov 2024 16:48:27 +0100
Subject: [PATCH 125/404] fix: ignore `as` type expressions on property
 definitions (#14181)

fixes #14179
---
 .changeset/dull-laws-end.md                                  | 5 +++++
 .../src/compiler/phases/1-parse/remove_typescript_nodes.js   | 5 +++--
 .../svelte/tests/runtime-runes/samples/typescript/_config.js | 1 +
 .../tests/runtime-runes/samples/typescript/main.svelte       | 1 +
 4 files changed, 10 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/dull-laws-end.md

diff --git a/.changeset/dull-laws-end.md b/.changeset/dull-laws-end.md
new file mode 100644
index 0000000000..595424826e
--- /dev/null
+++ b/.changeset/dull-laws-end.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ignore `as` type expressions on property definitions
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index 5febef420d..36a25f5124 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -56,13 +56,14 @@ const visitors = {
 		if (node.exportKind === 'type') return b.empty;
 		return node;
 	},
-	PropertyDefinition(node) {
+	PropertyDefinition(node, { next }) {
 		if (node.accessor) {
 			e.typescript_invalid_feature(
 				node,
 				'accessor fields (related TSC proposal is not stage 4 yet)'
 			);
 		}
+		return next();
 	},
 	TSAsExpression(node, context) {
 		return context.visit(node.expression);
@@ -97,7 +98,7 @@ const visitors = {
 		if ((node.readonly || node.accessibility) && context.path.at(-2)?.kind === 'constructor') {
 			e.typescript_invalid_feature(node, 'accessibility modifiers on constructor parameters');
 		}
-		return node.parameter;
+		return context.visit(node.parameter);
 	},
 	FunctionExpression: remove_this_param,
 	FunctionDeclaration: remove_this_param,
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/_config.js b/packages/svelte/tests/runtime-runes/samples/typescript/_config.js
index 7c9552b7b2..c15cd18225 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/_config.js
@@ -1,6 +1,7 @@
 import { flushSync } from 'svelte';
 import { test } from '../../test';
 
+// This test mainly checks that all types are properly ignored by the compiler
 export default test({
 	html: '<button>clicks: 0</button>',
 
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index 6c9cacdeff..71638688f2 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -10,6 +10,7 @@
 
 	class Foo {
 		public name: string;
+		x = 'x' as const;
 		constructor(name: string) {
 			this.name = name;
 		}

From 26d109cb115507928e944f164ff1da7fdb93f1bd Mon Sep 17 00:00:00 2001
From: Scott <sw@scottwu.ca>
Date: Thu, 7 Nov 2024 00:32:12 +0800
Subject: [PATCH 126/404] docs: `SvelteHTMLElements` can be used for creating
 component wrapper (#14162)

---
 documentation/docs/07-misc/03-typescript.md | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md
index 5e16382187..9e4297b275 100644
--- a/documentation/docs/07-misc/03-typescript.md
+++ b/documentation/docs/07-misc/03-typescript.md
@@ -132,7 +132,7 @@ The content of `generics` is what you would put between the `<...>` tags of a ge
 
 ## Typing wrapper components
 
-In case you're writing a component that wraps a native element, you may want to expose all the attributes of underlying element to the user. In that case, use (or extend from) one of the interfaces provided by `svelte/elements`. Here's an example for a `Button` component:
+In case you're writing a component that wraps a native element, you may want to expose all the attributes of the underlying element to the user. In that case, use (or extend from) one of the interfaces provided by `svelte/elements`. Here's an example for a `Button` component:
 
 ```svelte
 <script lang="ts">
@@ -146,6 +146,20 @@ In case you're writing a component that wraps a native element, you may want to
 </button>
 ```
 
+Not all elements have a specific type definition, in those cases, use `SvelteHTMLElements`:
+
+```svelte
+<script lang="ts">
+	import type { SvelteHTMLElements } from 'svelte/elements';
+
+	let { children, ...rest }: SvelteHTMLElements['div'] = $props();
+</script>
+
+<div {...rest}>
+	{@render children()}
+</div>
+```
+
 ## Typing `$state`
 
 You can type `$state` like any other variable.

From f1aeaf19e5ed0044e5728a6357403f617abc6f6e Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 6 Nov 2024 16:41:17 +0000
Subject: [PATCH 127/404] feat: adds legacy mode flag (#14180)

* feat: adds legacy mode flag

* feedback

* feedback and tweaks

* feedback and tweaks

* tweaks

* tweaks

* tweaks

* tweaks
---
 .changeset/warm-snakes-remain.md              |  5 +++
 packages/svelte/package.json                  |  3 ++
 .../svelte/scripts/check-treeshakeability.js  | 17 ++++++++-
 .../3-transform/client/transform-client.js    |  4 ++
 packages/svelte/src/index-client.js           |  3 +-
 .../src/internal/client/dom/blocks/each.js    | 38 +++++++++----------
 .../src/internal/client/reactivity/props.js   |  3 +-
 .../src/internal/client/reactivity/sources.js |  3 +-
 .../svelte/src/internal/client/runtime.js     |  5 ++-
 packages/svelte/src/internal/flags/index.js   |  5 +++
 packages/svelte/src/internal/flags/legacy.js  |  3 ++
 .../migrate/samples/derivations/output.svelte |  2 +-
 .../migrate/samples/props-ts/output.svelte    |  2 +-
 .../_expected/client/index.svelte.js          |  1 +
 .../_expected/client/index.svelte.js          |  1 +
 .../_expected/client/index.svelte.js          |  1 +
 .../hmr/_expected/client/index.svelte.js      |  1 +
 .../_expected/client/index.svelte.js          |  1 +
 .../purity/_expected/client/index.svelte.js   |  1 +
 19 files changed, 71 insertions(+), 28 deletions(-)
 create mode 100644 .changeset/warm-snakes-remain.md
 create mode 100644 packages/svelte/src/internal/flags/index.js
 create mode 100644 packages/svelte/src/internal/flags/legacy.js

diff --git a/.changeset/warm-snakes-remain.md b/.changeset/warm-snakes-remain.md
new file mode 100644
index 0000000000..508e8763e5
--- /dev/null
+++ b/.changeset/warm-snakes-remain.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: adds legacy mode flag reducing bundle size in runes mode only apps
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 4ee792827d..62fa40620a 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -53,6 +53,9 @@
     "./internal/disclose-version": {
       "default": "./src/internal/disclose-version.js"
     },
+    "./internal/flags/legacy": {
+      "default": "./src/internal/flags/legacy.js"
+    },
     "./internal/server": {
       "default": "./src/internal/server/index.js"
     },
diff --git a/packages/svelte/scripts/check-treeshakeability.js b/packages/svelte/scripts/check-treeshakeability.js
index 9263649956..1b50111b87 100644
--- a/packages/svelte/scripts/check-treeshakeability.js
+++ b/packages/svelte/scripts/check-treeshakeability.js
@@ -57,6 +57,7 @@ for (const key in pkg.exports) {
 	if (key === './compiler') continue;
 	if (key === './internal') continue;
 	if (key === './internal/disclose-version') continue;
+	if (key === './internal/flags/legacy') continue;
 
 	for (const type of ['browser', 'default']) {
 		if (!pkg.exports[key][type]) continue;
@@ -83,6 +84,7 @@ const bundle = await bundle_code(
 	// Use all features which contain hydration code to ensure it's treeshakeable
 	compile(
 		`
+<svelte:options runes />
 <script>
 	import { mount } from ${JSON.stringify(client_main)}; mount();
 	let foo;
@@ -118,12 +120,23 @@ if (!bundle.includes('hydrate_node') && !bundle.includes('hydrate_next')) {
 	// eslint-disable-next-line no-console
 	console.error(`✅ Hydration code treeshakeable`);
 } else {
-	// eslint-disable-next-line no-console
-	console.error(bundle);
+	failed = true;
 	// eslint-disable-next-line no-console
 	console.error(`❌ Hydration code not treeshakeable`);
+}
+
+if (!bundle.includes('component_context.l')) {
+	// eslint-disable-next-line no-console
+	console.error(`✅ Legacy code treeshakeable`);
+} else {
 	failed = true;
+	// eslint-disable-next-line no-console
+	console.error(`❌ Legacy code not treeshakeable`);
+}
 
+if (failed) {
+	// eslint-disable-next-line no-console
+	console.error(bundle);
 	fs.writeFileSync('scripts/_bundle.js', bundle);
 }
 
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 4daff53efb..5349f60255 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
@@ -531,6 +531,10 @@ export function client_component(analysis, options) {
 		body.push(b.stmt(b.call(b.id('$.mark_module_end'), b.id(analysis.name))));
 	}
 
+	if (!analysis.runes) {
+		body.unshift(b.imports([], 'svelte/internal/flags/legacy'));
+	}
+
 	if (options.discloseVersion) {
 		body.unshift(b.imports([], 'svelte/internal/disclose-version'));
 	}
diff --git a/packages/svelte/src/index-client.js b/packages/svelte/src/index-client.js
index ff477595a1..72811c8f17 100644
--- a/packages/svelte/src/index-client.js
+++ b/packages/svelte/src/index-client.js
@@ -6,6 +6,7 @@ import { is_array } from './internal/shared/utils.js';
 import { user_effect } from './internal/client/index.js';
 import * as e from './internal/client/errors.js';
 import { lifecycle_outside_component } from './internal/shared/errors.js';
+import { legacy_mode_flag } from './internal/flags/index.js';
 
 /**
  * The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM.
@@ -25,7 +26,7 @@ export function onMount(fn) {
 		lifecycle_outside_component('onMount');
 	}
 
-	if (component_context.l !== null) {
+	if (legacy_mode_flag && component_context.l !== null) {
 		init_update_callbacks(component_context).m.push(fn);
 	} else {
 		user_effect(() => {
diff --git a/packages/svelte/src/internal/client/dom/blocks/each.js b/packages/svelte/src/internal/client/dom/blocks/each.js
index 0fef7d343b..d62c575391 100644
--- a/packages/svelte/src/internal/client/dom/blocks/each.js
+++ b/packages/svelte/src/internal/client/dom/blocks/each.js
@@ -490,27 +490,27 @@ function update_item(item, value, index, type) {
  */
 function create_item(anchor, state, prev, next, value, key, index, render_fn, flags) {
 	var previous_each_item = current_each_item;
+	var reactive = (flags & EACH_ITEM_REACTIVE) !== 0;
+	var mutable = (flags & EACH_ITEM_IMMUTABLE) === 0;
+
+	var v = reactive ? (mutable ? mutable_source(value) : source(value)) : value;
+	var i = (flags & EACH_INDEX_REACTIVE) === 0 ? index : source(index);
+
+	/** @type {EachItem} */
+	var item = {
+		i,
+		v,
+		k: key,
+		a: null,
+		// @ts-expect-error
+		e: null,
+		prev,
+		next
+	};
+
+	current_each_item = item;
 
 	try {
-		var reactive = (flags & EACH_ITEM_REACTIVE) !== 0;
-		var mutable = (flags & EACH_ITEM_IMMUTABLE) === 0;
-
-		var v = reactive ? (mutable ? mutable_source(value) : source(value)) : value;
-		var i = (flags & EACH_INDEX_REACTIVE) === 0 ? index : source(index);
-
-		/** @type {EachItem} */
-		var item = {
-			i,
-			v,
-			k: key,
-			a: null,
-			// @ts-expect-error
-			e: null,
-			prev,
-			next
-		};
-
-		current_each_item = item;
 		item.e = branch(() => render_fn(anchor, v, i), hydrating);
 
 		item.e.prev = prev && prev.e;
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index e24deb5a20..ae934c01a5 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -23,6 +23,7 @@ import * as e from '../errors.js';
 import { BRANCH_EFFECT, LEGACY_DERIVED_PROP, ROOT_EFFECT } from '../constants.js';
 import { proxy } from '../proxy.js';
 import { capture_store_binding } from './store.js';
+import { legacy_mode_flag } from '../../flags/index.js';
 
 /**
  * @param {((value?: number) => number)} fn
@@ -270,7 +271,7 @@ function with_parent_branch(fn) {
  */
 export function prop(props, key, flags, fallback) {
 	var immutable = (flags & PROPS_IS_IMMUTABLE) !== 0;
-	var runes = (flags & PROPS_IS_RUNES) !== 0;
+	var runes = !legacy_mode_flag || (flags & PROPS_IS_RUNES) !== 0;
 	var bindable = (flags & PROPS_IS_BINDABLE) !== 0;
 	var lazy = (flags & PROPS_IS_LAZY_INITIAL) !== 0;
 	var is_store_sub = false;
diff --git a/packages/svelte/src/internal/client/reactivity/sources.js b/packages/svelte/src/internal/client/reactivity/sources.js
index bb97ea34c8..4bbd470d08 100644
--- a/packages/svelte/src/internal/client/reactivity/sources.js
+++ b/packages/svelte/src/internal/client/reactivity/sources.js
@@ -32,6 +32,7 @@ import {
 	BLOCK_EFFECT
 } from '../constants.js';
 import * as e from '../errors.js';
+import { legacy_mode_flag } from '../../flags/index.js';
 
 export let inspect_effects = new Set();
 
@@ -80,7 +81,7 @@ export function mutable_source(initial_value, immutable = false) {
 
 	// bind the signal to the component context, in case we need to
 	// track updates to trigger beforeUpdate/afterUpdate callbacks
-	if (component_context !== null && component_context.l !== null) {
+	if (legacy_mode_flag && component_context !== null && component_context.l !== null) {
 		(component_context.l.s ??= []).push(s);
 	}
 
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index bd4d23dd15..e9f1c773e6 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -33,6 +33,7 @@ import { destroy_derived, execute_derived, update_derived } from './reactivity/d
 import * as e from './errors.js';
 import { lifecycle_outside_component } from '../shared/errors.js';
 import { FILENAME } from '../../constants.js';
+import { legacy_mode_flag } from '../flags/index.js';
 
 const FLUSH_MICROTASK = 0;
 const FLUSH_SYNC = 1;
@@ -162,7 +163,7 @@ export function increment_version() {
 
 /** @returns {boolean} */
 export function is_runes() {
-	return component_context !== null && component_context.l === null;
+	return !legacy_mode_flag || (component_context !== null && component_context.l === null);
 }
 
 /**
@@ -1025,7 +1026,7 @@ export function push(props, runes = false, fn) {
 		l: null
 	};
 
-	if (!runes) {
+	if (legacy_mode_flag && !runes) {
 		component_context.l = {
 			s: null,
 			u: null,
diff --git a/packages/svelte/src/internal/flags/index.js b/packages/svelte/src/internal/flags/index.js
new file mode 100644
index 0000000000..767a40a765
--- /dev/null
+++ b/packages/svelte/src/internal/flags/index.js
@@ -0,0 +1,5 @@
+export let legacy_mode_flag = false;
+
+export function enable_legacy_mode_flag() {
+	legacy_mode_flag = true;
+}
diff --git a/packages/svelte/src/internal/flags/legacy.js b/packages/svelte/src/internal/flags/legacy.js
new file mode 100644
index 0000000000..cab3c01063
--- /dev/null
+++ b/packages/svelte/src/internal/flags/legacy.js
@@ -0,0 +1,3 @@
+import { enable_legacy_mode_flag } from './index.js';
+
+enable_legacy_mode_flag();
diff --git a/packages/svelte/tests/migrate/samples/derivations/output.svelte b/packages/svelte/tests/migrate/samples/derivations/output.svelte
index 79ff089018..5200b7f8a7 100644
--- a/packages/svelte/tests/migrate/samples/derivations/output.svelte
+++ b/packages/svelte/tests/migrate/samples/derivations/output.svelte
@@ -13,4 +13,4 @@
 	
 </script>
 
-{count} / {doubled} / {quadrupled} / {time_8} / {time_16}
+{count} / {doubled} / {quadrupled} / {time_8} / {time_16}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/props-ts/output.svelte b/packages/svelte/tests/migrate/samples/props-ts/output.svelte
index e9deea1384..b75f4383f5 100644
--- a/packages/svelte/tests/migrate/samples/props-ts/output.svelte
+++ b/packages/svelte/tests/migrate/samples/props-ts/output.svelte
@@ -39,4 +39,4 @@
 {readonly}
 {optional}
 <input bind:value={binding} />
-<input bind:value={bindingOptional} />
+<input bind:value={bindingOptional} />
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js
index bd24eca962..fedcc87696 100644
--- a/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/bind-this/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 
 export default function Bind_this($$anchor) {
diff --git a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js
index 81c06f23ec..80f2da11a2 100644
--- a/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/each-string-template/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 
 export default function Each_string_template($$anchor) {
diff --git a/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js
index 92354d8f14..9f6f291669 100644
--- a/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/hello-world/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 
 var root = $.template(`<h1>hello world</h1>`);
diff --git a/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js
index 01daada7ac..86c2880abc 100644
--- a/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 
 var root = $.template(`<h1>hello world</h1>`);
diff --git a/packages/svelte/tests/snapshot/samples/imports-in-modules/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/imports-in-modules/_expected/client/index.svelte.js
index 464ef519af..9c7d2f3f23 100644
--- a/packages/svelte/tests/snapshot/samples/imports-in-modules/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/imports-in-modules/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 import { random } from './module.svelte';
 
diff --git a/packages/svelte/tests/snapshot/samples/purity/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/purity/_expected/client/index.svelte.js
index 305e9aa0d7..0a627a55ae 100644
--- a/packages/svelte/tests/snapshot/samples/purity/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/purity/_expected/client/index.svelte.js
@@ -1,4 +1,5 @@
 import "svelte/internal/disclose-version";
+import "svelte/internal/flags/legacy";
 import * as $ from "svelte/internal/client";
 
 var root = $.template(`<p></p> <p></p> <!>`, 1);

From 44a833fafee1dc760dfc6f18f2e699b74cb4baea Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Wed, 6 Nov 2024 18:51:09 +0100
Subject: [PATCH 128/404] fix: restore active reaction if then block throws
 (#14191)

---
 .changeset/pink-doors-chew.md                 |  5 ++
 .../src/internal/client/dom/blocks/await.js   | 64 ++++++++++---------
 .../_config.js                                | 16 +++++
 .../main.svelte                               | 21 ++++++
 4 files changed, 75 insertions(+), 31 deletions(-)
 create mode 100644 .changeset/pink-doors-chew.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/main.svelte

diff --git a/.changeset/pink-doors-chew.md b/.changeset/pink-doors-chew.md
new file mode 100644
index 0000000000..ea43c5e00c
--- /dev/null
+++ b/.changeset/pink-doors-chew.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: restore active reaction if then block throws
diff --git a/packages/svelte/src/internal/client/dom/blocks/await.js b/packages/svelte/src/internal/client/dom/blocks/await.js
index 3c6bc9900d..29ef15452f 100644
--- a/packages/svelte/src/internal/client/dom/blocks/await.js
+++ b/packages/svelte/src/internal/client/dom/blocks/await.js
@@ -70,42 +70,44 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
 			if (DEV) set_dev_current_component_function(component_function);
 		}
 
-		if (state === PENDING && pending_fn) {
-			if (pending_effect) resume_effect(pending_effect);
-			else pending_effect = branch(() => pending_fn(anchor));
-		}
-
-		if (state === THEN && then_fn) {
-			if (then_effect) resume_effect(then_effect);
-			else then_effect = branch(() => then_fn(anchor, input_source));
-		}
+		try {
+			if (state === PENDING && pending_fn) {
+				if (pending_effect) resume_effect(pending_effect);
+				else pending_effect = branch(() => pending_fn(anchor));
+			}
 
-		if (state === CATCH && catch_fn) {
-			if (catch_effect) resume_effect(catch_effect);
-			else catch_effect = branch(() => catch_fn(anchor, error_source));
-		}
+			if (state === THEN && then_fn) {
+				if (then_effect) resume_effect(then_effect);
+				else then_effect = branch(() => then_fn(anchor, input_source));
+			}
 
-		if (state !== PENDING && pending_effect) {
-			pause_effect(pending_effect, () => (pending_effect = null));
-		}
+			if (state === CATCH && catch_fn) {
+				if (catch_effect) resume_effect(catch_effect);
+				else catch_effect = branch(() => catch_fn(anchor, error_source));
+			}
 
-		if (state !== THEN && then_effect) {
-			pause_effect(then_effect, () => (then_effect = null));
-		}
+			if (state !== PENDING && pending_effect) {
+				pause_effect(pending_effect, () => (pending_effect = null));
+			}
 
-		if (state !== CATCH && catch_effect) {
-			pause_effect(catch_effect, () => (catch_effect = null));
-		}
+			if (state !== THEN && then_effect) {
+				pause_effect(then_effect, () => (then_effect = null));
+			}
 
-		if (restore) {
-			if (DEV) set_dev_current_component_function(null);
-			set_component_context(null);
-			set_active_reaction(null);
-			set_active_effect(null);
-
-			// without this, the DOM does not update until two ticks after the promise
-			// resolves, which is unexpected behaviour (and somewhat irksome to test)
-			flush_sync();
+			if (state !== CATCH && catch_effect) {
+				pause_effect(catch_effect, () => (catch_effect = null));
+			}
+		} finally {
+			if (restore) {
+				if (DEV) set_dev_current_component_function(null);
+				set_component_context(null);
+				set_active_reaction(null);
+				set_active_effect(null);
+
+				// without this, the DOM does not update until two ticks after the promise
+				// resolves, which is unexpected behaviour (and somewhat irksome to test)
+				flush_sync();
+			}
 		}
 	}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/_config.js b/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/_config.js
new file mode 100644
index 0000000000..5cae253851
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/_config.js
@@ -0,0 +1,16 @@
+import { ok, test } from '../../test';
+import { flushSync } from 'svelte';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+	async test({ target, errors, assert, window }) {
+		const btn = target.querySelector('button');
+		ok(btn);
+		flushSync(() => {
+			btn.click();
+		});
+		assert.deepEqual(errors, []);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/main.svelte b/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/main.svelte
new file mode 100644
index 0000000000..4e9e32dcab
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/await-render-error-restore-reaction/main.svelte
@@ -0,0 +1,21 @@
+<script>
+	let count = $state(0);
+
+	function listen(node){
+		function handler(){
+			count++;
+		}
+		node.addEventListener("click", handler);
+		return {
+			destroy(){
+				node.removeEventListener("click", handler);
+			}
+		}
+	}
+</script>
+
+<button use:listen></button>
+
+{#await Promise.resolve() then}
+	{err.or}
+{/await}
\ No newline at end of file

From 5ce1159ec32f6d6d7e422e63903a540dc14200bf Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 6 Nov 2024 20:54:04 -0500
Subject: [PATCH 129/404] Update 03-typescript.md (#14197)

---
 documentation/docs/07-misc/03-typescript.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md
index 9e4297b275..e02ac7b6b1 100644
--- a/documentation/docs/07-misc/03-typescript.md
+++ b/documentation/docs/07-misc/03-typescript.md
@@ -146,7 +146,7 @@ In case you're writing a component that wraps a native element, you may want to
 </button>
 ```
 
-Not all elements have a specific type definition, in those cases, use `SvelteHTMLElements`:
+Not all elements have a dedicated type definition. For those without one, use `SvelteHTMLElements`:
 
 ```svelte
 <script lang="ts">

From 7eb4cb91d78278f391fcf41839adafad5d87b7a1 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 7 Nov 2024 08:58:37 +0000
Subject: [PATCH 130/404] chore: ensure binding events are without context
 (#14194)

* chore: ensure binding events are without context

* doh
---
 .../client/dom/elements/bindings/input.js     |  2 +-
 .../client/dom/elements/bindings/shared.js    | 25 ++++++++++++++++++-
 .../client/dom/elements/bindings/window.js    | 17 +++++++------
 .../internal/client/dom/elements/events.js    | 13 +++-------
 4 files changed, 37 insertions(+), 20 deletions(-)

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 7af20b932a..e528d1699e 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -1,6 +1,6 @@
 import { DEV } from 'esm-env';
 import { render_effect, teardown } from '../../../reactivity/effects.js';
-import { listen_to_event_and_reset_event } from './shared.js';
+import { listen_to_event_and_reset_event, without_reactive_context } from './shared.js';
 import * as e from '../../../errors.js';
 import { is } from '../../../proxy.js';
 import { queue_micro_task } from '../../task.js';
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/shared.js b/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
index 195eae2200..832b7f45e5 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
@@ -1,4 +1,10 @@
 import { teardown } from '../../../reactivity/effects.js';
+import {
+	active_effect,
+	active_reaction,
+	set_active_effect,
+	set_active_reaction
+} from '../../../runtime.js';
 import { add_form_reset_listener } from '../misc.js';
 
 /**
@@ -25,6 +31,23 @@ export function listen(target, events, handler, call_handler_immediately = true)
 	});
 }
 
+/**
+ * @template T
+ * @param {() => T} fn
+ */
+export function without_reactive_context(fn) {
+	var previous_reaction = active_reaction;
+	var previous_effect = active_effect;
+	set_active_reaction(null);
+	set_active_effect(null);
+	try {
+		return fn();
+	} finally {
+		set_active_reaction(previous_reaction);
+		set_active_effect(previous_effect);
+	}
+}
+
 /**
  * Listen to the given event, and then instantiate a global form reset listener if not already done,
  * to notify all bindings when the form is reset
@@ -34,7 +57,7 @@ export function listen(target, events, handler, call_handler_immediately = true)
  * @param {() => void} [on_reset]
  */
 export function listen_to_event_and_reset_event(element, event, handler, on_reset = handler) {
-	element.addEventListener(event, handler);
+	element.addEventListener(event, () => without_reactive_context(handler));
 	// @ts-expect-error
 	const prev = element.__on_r;
 	if (prev) {
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/window.js b/packages/svelte/src/internal/client/dom/elements/bindings/window.js
index 61775b9d4b..2f7e44c5d9 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/window.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/window.js
@@ -1,5 +1,5 @@
 import { effect, render_effect, teardown } from '../../../reactivity/effects.js';
-import { listen } from './shared.js';
+import { listen, without_reactive_context } from './shared.js';
 
 /**
  * @param {'x' | 'y'} type
@@ -10,13 +10,14 @@ import { listen } from './shared.js';
 export function bind_window_scroll(type, get, set = get) {
 	var is_scrolling_x = type === 'x';
 
-	var target_handler = () => {
-		scrolling = true;
-		clearTimeout(timeout);
-		timeout = setTimeout(clear, 100); // TODO use scrollend event if supported (or when supported everywhere?)
+	var target_handler = () =>
+		without_reactive_context(() => {
+			scrolling = true;
+			clearTimeout(timeout);
+			timeout = setTimeout(clear, 100); // TODO use scrollend event if supported (or when supported everywhere?)
 
-		set(window[is_scrolling_x ? 'scrollX' : 'scrollY']);
-	};
+			set(window[is_scrolling_x ? 'scrollX' : 'scrollY']);
+		});
 
 	addEventListener('scroll', target_handler, {
 		passive: true
@@ -61,5 +62,5 @@ export function bind_window_scroll(type, get, set = get) {
  * @param {(size: number) => void} set
  */
 export function bind_window_size(type, set) {
-	listen(window, ['resize'], () => set(window[type]));
+	listen(window, ['resize'], () => without_reactive_context(() => set(window[type])));
 }
diff --git a/packages/svelte/src/internal/client/dom/elements/events.js b/packages/svelte/src/internal/client/dom/elements/events.js
index 12108b00f8..f2038f96ad 100644
--- a/packages/svelte/src/internal/client/dom/elements/events.js
+++ b/packages/svelte/src/internal/client/dom/elements/events.js
@@ -11,6 +11,7 @@ import {
 	set_active_effect,
 	set_active_reaction
 } from '../../runtime.js';
+import { without_reactive_context } from './bindings/shared.js';
 
 /** @type {Set<string>} */
 export const all_registered_events = new Set();
@@ -61,17 +62,9 @@ export function create_event(event_name, dom, handler, options) {
 			handle_event_propagation.call(dom, event);
 		}
 		if (!event.cancelBubble) {
-			var previous_reaction = active_reaction;
-			var previous_effect = active_effect;
-
-			set_active_reaction(null);
-			set_active_effect(null);
-			try {
+			return without_reactive_context(() => {
 				return handler.call(this, event);
-			} finally {
-				set_active_reaction(previous_reaction);
-				set_active_effect(previous_effect);
-			}
+			});
 		}
 	}
 

From d7caf0833c2ee5b4b59da1bf4b801873a6a013bc Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 7 Nov 2024 09:00:26 +0000
Subject: [PATCH 131/404] Version Packages (#14184)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/dull-laws-end.md      |  5 -----
 .changeset/pink-doors-chew.md    |  5 -----
 .changeset/warm-snakes-remain.md |  5 -----
 packages/svelte/CHANGELOG.md     | 10 ++++++++++
 packages/svelte/package.json     |  2 +-
 packages/svelte/src/version.js   |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/dull-laws-end.md
 delete mode 100644 .changeset/pink-doors-chew.md
 delete mode 100644 .changeset/warm-snakes-remain.md

diff --git a/.changeset/dull-laws-end.md b/.changeset/dull-laws-end.md
deleted file mode 100644
index 595424826e..0000000000
--- a/.changeset/dull-laws-end.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ignore `as` type expressions on property definitions
diff --git a/.changeset/pink-doors-chew.md b/.changeset/pink-doors-chew.md
deleted file mode 100644
index ea43c5e00c..0000000000
--- a/.changeset/pink-doors-chew.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: restore active reaction if then block throws
diff --git a/.changeset/warm-snakes-remain.md b/.changeset/warm-snakes-remain.md
deleted file mode 100644
index 508e8763e5..0000000000
--- a/.changeset/warm-snakes-remain.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: adds legacy mode flag reducing bundle size in runes mode only apps
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index b57d72ea0a..4283f406d6 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.1.12
+
+### Patch Changes
+
+- fix: ignore `as` type expressions on property definitions ([#14181](https://github.com/sveltejs/svelte/pull/14181))
+
+- fix: restore active reaction if then block throws ([#14191](https://github.com/sveltejs/svelte/pull/14191))
+
+- chore: adds legacy mode flag reducing bundle size in runes mode only apps ([#14180](https://github.com/sveltejs/svelte/pull/14180))
+
 ## 5.1.11
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 62fa40620a..0b0eb32ffd 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.1.11",
+  "version": "5.1.12",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c5cc14a530..9c883457e8 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.1.11';
+export const VERSION = '5.1.12';
 export const PUBLIC_VERSION = '5';

From 1eed645919bf9f0f5a2d609752ce1570e3d5876e Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 7 Nov 2024 15:30:06 +0100
Subject: [PATCH 132/404] fix: ensure explicit nesting selector is always
 applied (#14193)

Previously, we were applying an explicit nesting selector to the start of a relative selector chain only when starting the traversal. Prepending the selector is important because it ensures we traverse upwards to the parent rule when the current selectors all matched and there's still more to do. But we forgot to do the prepend for parent rules, which meant that if we were nested two levels deep, we would stop too early. This fix ensures we prepend in that case, too.

Fixes #14178
---
 .changeset/nice-numbers-remember.md           |  5 ++
 .../phases/2-analyze/css/css-prune.js         | 77 +++++++++++--------
 .../css/samples/nested-in-pseudo/_config.js   |  5 --
 .../css/samples/nested-in-pseudo/expected.css |  6 --
 .../samples/nested-in-pseudo/expected.html    |  1 -
 .../css/samples/nested-in-pseudo/input.svelte | 11 ---
 .../css/samples/nesting-selectors/_config.js  | 48 ++++++++++++
 .../samples/nesting-selectors/expected.css    | 37 +++++++++
 .../samples/nesting-selectors/expected.html   |  1 +
 .../samples/nesting-selectors/input.svelte    | 42 ++++++++++
 10 files changed, 179 insertions(+), 54 deletions(-)
 create mode 100644 .changeset/nice-numbers-remember.md
 delete mode 100644 packages/svelte/tests/css/samples/nested-in-pseudo/_config.js
 delete mode 100644 packages/svelte/tests/css/samples/nested-in-pseudo/expected.css
 delete mode 100644 packages/svelte/tests/css/samples/nested-in-pseudo/expected.html
 delete mode 100644 packages/svelte/tests/css/samples/nested-in-pseudo/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/nesting-selectors/_config.js
 create mode 100644 packages/svelte/tests/css/samples/nesting-selectors/expected.css
 create mode 100644 packages/svelte/tests/css/samples/nesting-selectors/expected.html
 create mode 100644 packages/svelte/tests/css/samples/nesting-selectors/input.svelte

diff --git a/.changeset/nice-numbers-remember.md b/.changeset/nice-numbers-remember.md
new file mode 100644
index 0000000000..810343aedf
--- /dev/null
+++ b/.changeset/nice-numbers-remember.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure explicit nesting selector is always applied
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 4306d49d81..4207a16502 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
@@ -77,38 +77,9 @@ const visitors = {
 		}
 	},
 	ComplexSelector(node, context) {
-		const selectors = truncate(node);
+		const selectors = get_relative_selectors(node);
 		const inner = selectors[selectors.length - 1];
 
-		if (node.metadata.rule?.metadata.parent_rule && selectors.length > 0) {
-			let has_explicit_nesting_selector = false;
-
-			// nesting could be inside pseudo classes like :is, :has or :where
-			for (let selector of selectors) {
-				walk(
-					selector,
-					{},
-					{
-						// @ts-ignore
-						NestingSelector() {
-							has_explicit_nesting_selector = true;
-						}
-					}
-				);
-				// if we found one we can break from the others
-				if (has_explicit_nesting_selector) break;
-			}
-
-			if (!has_explicit_nesting_selector) {
-				selectors[0] = {
-					...selectors[0],
-					combinator: descendant_combinator
-				};
-
-				selectors.unshift(nesting_selector);
-			}
-		}
-
 		if (context.state.from_render_tag) {
 			// We're searching for a match that crosses a render tag boundary. That means we have to both traverse up
 			// the element tree (to see if we find an entry point) but also remove selectors from the end (assuming
@@ -156,6 +127,50 @@ const visitors = {
 	}
 };
 
+/**
+ * Retrieves the relative selectors (minus the trailing globals) from a complex selector.
+ * 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
+ */
+function get_relative_selectors(node) {
+	const selectors = truncate(node);
+
+	if (node.metadata.rule?.metadata.parent_rule && selectors.length > 0) {
+		let has_explicit_nesting_selector = false;
+
+		// nesting could be inside pseudo classes like :is, :has or :where
+		for (let selector of selectors) {
+			walk(
+				selector,
+				{},
+				{
+					// @ts-ignore
+					NestingSelector() {
+						has_explicit_nesting_selector = true;
+					}
+				}
+			);
+			// if we found one we can break from the others
+			if (has_explicit_nesting_selector) break;
+		}
+
+		if (!has_explicit_nesting_selector) {
+			if (selectors[0].combinator === null) {
+				selectors[0] = {
+					...selectors[0],
+					combinator: descendant_combinator
+				};
+			}
+
+			selectors.unshift(nesting_selector);
+		}
+	}
+
+	return selectors;
+}
+
 /**
  * Discard trailing `:global(...)` selectors without a `:has/is/where/not(...)` modifier, these are unused for scoping purposes
  * @param {Compiler.Css.ComplexSelector} node
@@ -641,7 +656,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				const parent = /** @type {Compiler.Css.Rule} */ (rule.metadata.parent_rule);
 
 				for (const complex_selector of parent.prelude.children) {
-					if (apply_selector(truncate(complex_selector), parent, element, state)) {
+					if (apply_selector(get_relative_selectors(complex_selector), parent, element, state)) {
 						complex_selector.metadata.used = true;
 						matched = true;
 					}
diff --git a/packages/svelte/tests/css/samples/nested-in-pseudo/_config.js b/packages/svelte/tests/css/samples/nested-in-pseudo/_config.js
deleted file mode 100644
index 292c6c49ac..0000000000
--- a/packages/svelte/tests/css/samples/nested-in-pseudo/_config.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	warnings: []
-});
diff --git a/packages/svelte/tests/css/samples/nested-in-pseudo/expected.css b/packages/svelte/tests/css/samples/nested-in-pseudo/expected.css
deleted file mode 100644
index 3f365a8988..0000000000
--- a/packages/svelte/tests/css/samples/nested-in-pseudo/expected.css
+++ /dev/null
@@ -1,6 +0,0 @@
-
-nav.svelte-xyz{
-	header:where(.svelte-xyz):has(&){
-		color: red;
-	}
-}	
diff --git a/packages/svelte/tests/css/samples/nested-in-pseudo/expected.html b/packages/svelte/tests/css/samples/nested-in-pseudo/expected.html
deleted file mode 100644
index 44a5d4a52d..0000000000
--- a/packages/svelte/tests/css/samples/nested-in-pseudo/expected.html
+++ /dev/null
@@ -1 +0,0 @@
-<header class="svelte-xyz"><nav class="svelte-xyz"></nav></header>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/nested-in-pseudo/input.svelte b/packages/svelte/tests/css/samples/nested-in-pseudo/input.svelte
deleted file mode 100644
index 8a6758f60f..0000000000
--- a/packages/svelte/tests/css/samples/nested-in-pseudo/input.svelte
+++ /dev/null
@@ -1,11 +0,0 @@
-<header>
-	<nav></nav>		
-</header>
-
-<style>
-nav{
-	header:has(&){
-		color: red;
-	}
-}	
-</style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/nesting-selectors/_config.js b/packages/svelte/tests/css/samples/nesting-selectors/_config.js
new file mode 100644
index 0000000000..8960eff1b6
--- /dev/null
+++ b/packages/svelte/tests/css/samples/nesting-selectors/_config.js
@@ -0,0 +1,48 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ".unused:has(&)"',
+			start: {
+				line: 10,
+				column: 2,
+				character: 105
+			},
+			end: {
+				line: 10,
+				column: 16,
+				character: 119
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "&.unused"',
+			start: {
+				line: 23,
+				column: 3,
+				character: 223
+			},
+			end: {
+				line: 23,
+				column: 11,
+				character: 231
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "&.unused"',
+			start: {
+				line: 37,
+				column: 3,
+				character: 344
+			},
+			end: {
+				line: 37,
+				column: 11,
+				character: 352
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/nesting-selectors/expected.css b/packages/svelte/tests/css/samples/nesting-selectors/expected.css
new file mode 100644
index 0000000000..1b606b10ca
--- /dev/null
+++ b/packages/svelte/tests/css/samples/nesting-selectors/expected.css
@@ -0,0 +1,37 @@
+
+	nav.svelte-xyz {
+		header:where(.svelte-xyz):has(&){
+			color: green;
+		}
+		/* (unused) .unused:has(&){
+			color: red;
+		}*/
+	}
+
+	header.svelte-xyz {
+		> nav:where(.svelte-xyz) {
+			color: green;
+
+			&.active {
+				color: green;
+			}
+
+			/* (unused) &.unused {
+				color: red;
+			}*/
+		}
+	}
+
+	header.svelte-xyz {
+		& > nav:where(.svelte-xyz) {
+			color: green;
+
+			&.active {
+				color: green;
+			}
+
+			/* (unused) &.unused {
+				color: red;
+			}*/
+		}
+	}
diff --git a/packages/svelte/tests/css/samples/nesting-selectors/expected.html b/packages/svelte/tests/css/samples/nesting-selectors/expected.html
new file mode 100644
index 0000000000..59e17c2d02
--- /dev/null
+++ b/packages/svelte/tests/css/samples/nesting-selectors/expected.html
@@ -0,0 +1 @@
+<header class="svelte-xyz"><nav class="active svelte-xyz"></nav></header>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/nesting-selectors/input.svelte b/packages/svelte/tests/css/samples/nesting-selectors/input.svelte
new file mode 100644
index 0000000000..98881237c0
--- /dev/null
+++ b/packages/svelte/tests/css/samples/nesting-selectors/input.svelte
@@ -0,0 +1,42 @@
+<header>
+	<nav class="active"></nav>		
+</header>
+
+<style>
+	nav {
+		header:has(&){
+			color: green;
+		}
+		.unused:has(&){
+			color: red;
+		}
+	}
+
+	header {
+		> nav {
+			color: green;
+
+			&.active {
+				color: green;
+			}
+
+			&.unused {
+				color: red;
+			}
+		}
+	}
+
+	header {
+		& > nav {
+			color: green;
+
+			&.active {
+				color: green;
+			}
+
+			&.unused {
+				color: red;
+			}
+		}
+	}
+</style>
\ No newline at end of file

From ea0d80e1950b5c62547c69a26c823282e8d88ad3 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 7 Nov 2024 15:33:02 +0100
Subject: [PATCH 133/404] fix: consider variables with synthetic store sub as
 state (#14195)

Fixes #14183
---
 .changeset/giant-waves-act.md                 |  5 ++++
 .../src/compiler/phases/2-analyze/index.js    | 11 +++++++
 .../variable-assigned-store-state/Test.svelte | 11 +++++++
 .../variable-assigned-store-state/_config.js  | 29 +++++++++++++++++++
 .../variable-assigned-store-state/main.svelte |  9 ++++++
 5 files changed, 65 insertions(+)
 create mode 100644 .changeset/giant-waves-act.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/Test.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/main.svelte

diff --git a/.changeset/giant-waves-act.md b/.changeset/giant-waves-act.md
new file mode 100644
index 0000000000..591f0f25ba
--- /dev/null
+++ b/.changeset/giant-waves-act.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: consider variables with synthetic store sub as state
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index f5a31d09a7..36d8145145 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -351,6 +351,17 @@ export function analyze_component(root, source, options) {
 				}
 			}
 
+			// if we are creating a synthetic binding for a let declaration we should also declare
+			// the declaration as state in case it's reassigned
+			if (
+				declaration !== null &&
+				declaration.kind === 'normal' &&
+				declaration.declaration_kind === 'let' &&
+				declaration.reassigned
+			) {
+				declaration.kind = 'state';
+			}
+
 			const binding = instance.scope.declare(b.id(name), 'store_sub', 'synthetic');
 			binding.references = references;
 			instance.scope.references.set(name, references);
diff --git a/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/Test.svelte b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/Test.svelte
new file mode 100644
index 0000000000..8b11acb279
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/Test.svelte
@@ -0,0 +1,11 @@
+<script>
+	export let store;
+
+	let currentStore;
+	function update(){
+		currentStore = store
+	}
+</script>
+
+<button on:click={update}></button>
+<p>{$currentStore}</p>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/_config.js b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/_config.js
new file mode 100644
index 0000000000..eecdcb2462
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/_config.js
@@ -0,0 +1,29 @@
+import { flushSync } from 'svelte';
+import { ok, test } from '../../test';
+
+export default test({
+	async test({ assert, target, window }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+		const p = target.querySelector('p');
+
+		assert.equal(p?.innerHTML, '');
+
+		flushSync(() => {
+			btn2.click();
+		});
+
+		assert.equal(p?.innerHTML, '1');
+
+		flushSync(() => {
+			btn1.click();
+		});
+
+		assert.equal(p?.innerHTML, '1');
+
+		flushSync(() => {
+			btn2.click();
+		});
+
+		assert.equal(p?.innerHTML, '2');
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/main.svelte b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/main.svelte
new file mode 100644
index 0000000000..5033fbc526
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/variable-assigned-store-state/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import { writable } from 'svelte/store'
+	import Test from './Test.svelte'
+	let counter = 1
+	let store = writable(counter)
+</script>
+
+<button on:click={() => store = writable(++counter)}></button>
+<Test {store} />
\ No newline at end of file

From 53af138d588f77bb8f4f10f9ad15fd4f798b50ef Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 7 Nov 2024 21:18:45 +0100
Subject: [PATCH 134/404] fix: read index as a source in legacy keyed each
 block (#14208)

Fixes #14203
---
 .changeset/late-dodos-film.md                          |  5 +++++
 .../phases/3-transform/client/visitors/EachBlock.js    |  4 ++--
 .../keyed-each-bind-read-index/Component.svelte        |  5 +++++
 .../samples/keyed-each-bind-read-index/_config.js      |  9 +++++++++
 .../samples/keyed-each-bind-read-index/main.svelte     | 10 ++++++++++
 5 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/late-dodos-film.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/Component.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/main.svelte

diff --git a/.changeset/late-dodos-film.md b/.changeset/late-dodos-film.md
new file mode 100644
index 0000000000..c3636019da
--- /dev/null
+++ b/.changeset/late-dodos-film.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: read index as a source in legacy keyed each block
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
index fb6338cae3..55d7ded247 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
@@ -196,7 +196,7 @@ export function EachBlock(node, context) {
 					// forbidden in runes mode
 					return b.member(
 						each_node_meta.array_name ? b.call(each_node_meta.array_name) : collection,
-						index,
+						(flags & EACH_INDEX_REACTIVE) !== 0 ? get_value(index) : index,
 						true
 					);
 				}
@@ -208,7 +208,7 @@ export function EachBlock(node, context) {
 
 				const left = b.member(
 					each_node_meta.array_name ? b.call(each_node_meta.array_name) : collection,
-					index,
+					(flags & EACH_INDEX_REACTIVE) !== 0 ? get_value(index) : index,
 					true
 				);
 
diff --git a/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/Component.svelte b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/Component.svelte
new file mode 100644
index 0000000000..988c2b6457
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/Component.svelte
@@ -0,0 +1,5 @@
+<script>
+	export let item;
+	console.log(item);
+	item = 1;
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/_config.js b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/_config.js
new file mode 100644
index 0000000000..8b5db4df40
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, logs }) {
+		const p = target.querySelector('p');
+		assert.equal(p?.innerHTML, '1');
+		assert.deepEqual(logs, [0]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/main.svelte b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/main.svelte
new file mode 100644
index 0000000000..384722f5aa
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/keyed-each-bind-read-index/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	import Component from './Component.svelte';
+	const items = [0];
+</script>
+
+{#each items as item, idx(item)}
+	<Component bind:item />
+{/each}
+
+<p>{items}</p>
\ No newline at end of file

From 870745fc5370d0bb6b2c5186bffcc1602168a4a7 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 8 Nov 2024 10:53:43 +0100
Subject: [PATCH 135/404] fix: handle sibling combinators within `:has`
 (#14213)

We didn't collect sibling elements of a given element to then check the `:has` selectors. This adds the logic for that. Fixes #14072
---
 .changeset/four-jobs-care.md                  |  5 ++
 .../phases/2-analyze/css/css-prune.js         | 53 ++++++++++++++++++-
 .../svelte/tests/css/samples/has/_config.js   | 14 +++++
 .../svelte/tests/css/samples/has/expected.css | 10 ++++
 .../svelte/tests/css/samples/has/input.svelte | 10 ++++
 5 files changed, 91 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/four-jobs-care.md

diff --git a/.changeset/four-jobs-care.md b/.changeset/four-jobs-care.md
new file mode 100644
index 0000000000..51e5d22313
--- /dev/null
+++ b/.changeset/four-jobs-care.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: handle sibling combinators within `:has`
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 4207a16502..a9ea9fe913 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
@@ -412,6 +412,8 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 		const child_elements = [];
 		/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
 		const descendant_elements = [];
+		/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
+		let sibling_elements; // do them lazy because it's rarely used and expensive to calculate
 
 		walk(
 			/** @type {Compiler.SvelteNode} */ (element.fragment),
@@ -457,7 +459,11 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				}
 
 				const descendants =
-					left_most_combinator.name === '>' ? child_elements : descendant_elements;
+					left_most_combinator.name === '+' || left_most_combinator.name === '~'
+						? (sibling_elements ??= get_following_sibling_elements(element))
+						: left_most_combinator.name === '>'
+							? child_elements
+							: descendant_elements;
 
 				let selector_matched = false;
 
@@ -675,6 +681,51 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 	return true;
 }
 
+/** @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element */
+function get_following_sibling_elements(element) {
+	/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.Root | null} */
+	let parent = get_element_parent(element);
+
+	if (!parent) {
+		parent = element;
+		while (parent?.type !== 'Root') {
+			parent = /** @type {any} */ (parent).parent;
+		}
+	}
+
+	/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
+	const sibling_elements = [];
+	let found_parent = false;
+
+	for (const el of parent.fragment.nodes) {
+		if (found_parent) {
+			walk(
+				el,
+				{},
+				{
+					RegularElement(node) {
+						sibling_elements.push(node);
+					},
+					SvelteElement(node) {
+						sibling_elements.push(node);
+					}
+				}
+			);
+		} else {
+			/** @type {any} */
+			let child = element;
+			while (child !== el && child !== parent) {
+				child = child.parent;
+			}
+			if (child === el) {
+				found_parent = true;
+			}
+		}
+	}
+
+	return sibling_elements;
+}
+
 /**
  * @param {any} operator
  * @param {any} expected_value
diff --git a/packages/svelte/tests/css/samples/has/_config.js b/packages/svelte/tests/css/samples/has/_config.js
index 675254c5b7..8b8e7760f5 100644
--- a/packages/svelte/tests/css/samples/has/_config.js
+++ b/packages/svelte/tests/css/samples/has/_config.js
@@ -127,6 +127,20 @@ export default test({
 				column: 11,
 				character: 1134
 			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "x:has(~ y)"',
+			start: {
+				line: 121,
+				column: 1,
+				character: 1326
+			},
+			end: {
+				line: 121,
+				column: 11,
+				character: 1336
+			}
 		}
 	]
 });
diff --git a/packages/svelte/tests/css/samples/has/expected.css b/packages/svelte/tests/css/samples/has/expected.css
index 251a6952d5..4cb8d76bf6 100644
--- a/packages/svelte/tests/css/samples/has/expected.css
+++ b/packages/svelte/tests/css/samples/has/expected.css
@@ -101,3 +101,13 @@
 	x.svelte-xyz:has(y:where(.svelte-xyz)) + c:where(.svelte-xyz) {
 		color: green;
 	}
+
+	x.svelte-xyz:has(+ c:where(.svelte-xyz)) {
+		color: green;
+	}
+	x.svelte-xyz:has(~ c:where(.svelte-xyz)) {
+		color: green;
+	}
+	/* (unused) x:has(~ y) {
+		color: red;
+	}*/
diff --git a/packages/svelte/tests/css/samples/has/input.svelte b/packages/svelte/tests/css/samples/has/input.svelte
index 7a62b69c0b..8eb6296f05 100644
--- a/packages/svelte/tests/css/samples/has/input.svelte
+++ b/packages/svelte/tests/css/samples/has/input.svelte
@@ -111,4 +111,14 @@
 	x:has(y) + c {
 		color: green;
 	}
+
+	x:has(+ c) {
+		color: green;
+	}
+	x:has(~ c) {
+		color: green;
+	}
+	x:has(~ y) {
+		color: red;
+	}
 </style>

From 438de04fb2a753287bfd9fd420711cc7cd971012 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 8 Nov 2024 11:18:50 +0100
Subject: [PATCH 136/404] fix: add migration task when there's a variable named
 that would conflict with a rune (#14216)

Closes #14215
---
 .changeset/chatty-gorillas-poke.md            |  5 ++
 packages/svelte/src/compiler/migrate/index.js | 50 +++++++++++++++++++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  6 +++
 .../output.svelte                             |  8 +++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  9 ++++
 .../output.svelte                             | 11 ++++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  5 ++
 .../output.svelte                             |  7 +++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  6 +++
 .../output.svelte                             |  7 +++
 .../_config.js                                |  8 +++
 .../input.svelte                              | 10 ++++
 .../output.svelte                             | 12 +++++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  4 ++
 .../output.svelte                             |  6 +++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  7 +++
 .../output.svelte                             |  9 ++++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  7 +++
 .../output.svelte                             |  9 ++++
 .../_config.js                                |  8 +++
 .../input.svelte                              |  7 +++
 .../output.svelte                             |  9 ++++
 29 files changed, 266 insertions(+)
 create mode 100644 .changeset/chatty-gorillas-poke.md
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/output.svelte

diff --git a/.changeset/chatty-gorillas-poke.md b/.changeset/chatty-gorillas-poke.md
new file mode 100644
index 0000000000..744adcf214
--- /dev/null
+++ b/.changeset/chatty-gorillas-poke.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: add migration task when there's a variable named that would conflict with a rune
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 387b6a5485..b7687af09f 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -239,6 +239,18 @@ export function migrate(source, { filename, use_ts } = {}) {
 
 		insertion_point = state.props_insertion_point;
 
+		/**
+		 * @param {"derived"|"props"|"bindable"} rune
+		 */
+		function check_rune_binding(rune) {
+			const has_rune_binding = !!state.scope.get(rune);
+			if (has_rune_binding) {
+				throw new MigrationError(
+					`migrating this component would require adding a \`$${rune}\` rune but there's already a variable named ${rune}.\n     Rename the variable and try again or migrate by hand.`
+				);
+			}
+		}
+
 		if (state.props.length > 0 || analysis.uses_rest_props || analysis.uses_props) {
 			const has_many_props = state.props.length > 3;
 			const newline_separator = `\n${indent}${indent}`;
@@ -253,6 +265,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 						let prop_str =
 							prop.local === prop.exported ? prop.local : `${prop.exported}: ${prop.local}`;
 						if (prop.bindable) {
+							check_rune_binding('bindable');
 							prop_str += ` = $bindable(${prop.init})`;
 						} else if (prop.init) {
 							prop_str += ` = ${prop.init}`;
@@ -300,11 +313,13 @@ export function migrate(source, { filename, use_ts } = {}) {
 					if (type) {
 						props_declaration = `${type}\n\n${indent}${props_declaration}`;
 					}
+					check_rune_binding('props');
 					props_declaration = `${props_declaration}${type ? `: ${type_name}` : ''} = $props();`;
 				} else {
 					if (type) {
 						props_declaration = `${state.props.length > 0 ? `${type}\n\n${indent}` : ''}/** @type {${state.props.length > 0 ? type_name : ''}${analysis.uses_props || analysis.uses_rest_props ? `${state.props.length > 0 ? ' & ' : ''}{ [key: string]: any }` : ''}} */\n${indent}${props_declaration}`;
 					}
+					check_rune_binding('props');
 					props_declaration = `${props_declaration} = $props();`;
 				}
 
@@ -361,6 +376,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 			: insertion_point;
 
 		if (state.derived_components.size > 0) {
+			check_rune_binding('derived');
 			str.appendRight(
 				insertion_point,
 				`\n${indent}${[...state.derived_components.entries()].map(([init, name]) => `const ${name} = $derived(${init});`).join(`\n${indent}`)}\n`
@@ -368,6 +384,7 @@ export function migrate(source, { filename, use_ts } = {}) {
 		}
 
 		if (state.derived_conflicting_slots.size > 0) {
+			check_rune_binding('derived');
 			str.appendRight(
 				insertion_point,
 				`\n${indent}${[...state.derived_conflicting_slots.entries()].map(([name, init]) => `const ${name} = $derived(${init});`).join(`\n${indent}`)}\n`
@@ -652,6 +669,18 @@ const instance_script = {
 				continue;
 			}
 
+			/**
+			 * @param {"state"|"derived"} rune
+			 */
+			function check_rune_binding(rune) {
+				const has_rune_binding = !!state.scope.get(rune);
+				if (has_rune_binding) {
+					throw new MigrationError(
+						`can't migrate \`${state.str.original.substring(/** @type {number} */ (node.start), node.end)}\` to \`$${rune}\` because there's a variable named ${rune}.\n     Rename the variable and try again or migrate by hand.`
+					);
+				}
+			}
+
 			// state
 			if (declarator.init) {
 				let { start, end } = /** @type {{ start: number, end: number }} */ (declarator.init);
@@ -661,6 +690,8 @@ const instance_script = {
 					while (state.str.original[end - 1] !== ')') end += 1;
 				}
 
+				check_rune_binding('state');
+
 				state.str.prependLeft(start, '$state(');
 				state.str.appendRight(end, ')');
 			} else {
@@ -755,6 +786,8 @@ const instance_script = {
 						}
 					}
 
+					check_rune_binding('derived');
+
 					// Someone wrote a `$: { ... }` statement which we can turn into a `$derived`
 					state.str.appendRight(
 						/** @type {number} */ (declarator.id.typeAnnotation?.end ?? declarator.id.end),
@@ -795,6 +828,8 @@ const instance_script = {
 						}
 					}
 				} else {
+					check_rune_binding('state');
+
 					state.str.prependLeft(
 						/** @type {number} */ (declarator.id.typeAnnotation?.end ?? declarator.id.end),
 						' = $state('
@@ -858,6 +893,18 @@ const instance_script = {
 
 		next();
 
+		/**
+		 * @param {"state"|"derived"} rune
+		 */
+		function check_rune_binding(rune) {
+			const has_rune_binding = state.scope.get(rune);
+			if (has_rune_binding) {
+				throw new MigrationError(
+					`can't migrate \`$: ${state.str.original.substring(/** @type {number} */ (node.body.start), node.body.end)}\` to \`$${rune}\` because there's a variable named ${rune}.\n     Rename the variable and try again or migrate by hand.`
+				);
+			}
+		}
+
 		if (
 			node.body.type === 'ExpressionStatement' &&
 			node.body.expression.type === 'AssignmentExpression'
@@ -878,6 +925,8 @@ const instance_script = {
 					node.body.expression.right
 				);
 
+				check_rune_binding('derived');
+
 				// $derived
 				state.str.update(
 					/** @type {number} */ (node.start),
@@ -902,6 +951,7 @@ const instance_script = {
 			} else {
 				for (const binding of reassigned_bindings) {
 					if (binding && (ids.includes(binding.node) || expression_ids.length === 0)) {
+						check_rune_binding('state');
 						const init =
 							binding.kind === 'state'
 								? ' = $state()'
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/input.svelte
new file mode 100644
index 0000000000..e66dfea9f7
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/input.svelte
@@ -0,0 +1,6 @@
+<script>
+	let bindable;
+	export let something;
+</script>
+
+<input bind:value={something} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/output.svelte
new file mode 100644
index 0000000000..f956c2cd75
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$bindable-bindable-var-1/output.svelte
@@ -0,0 +1,8 @@
+<!-- @migration-task Error while migrating Svelte code: migrating this component would require adding a `$bindable` rune but there's already a variable named bindable.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let bindable;
+	export let something;
+</script>
+
+<input bind:value={something} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/input.svelte
new file mode 100644
index 0000000000..f8bde54909
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/input.svelte
@@ -0,0 +1,9 @@
+<script>
+	let name = 'world';
+
+	let derived;
+
+	$: other = name;
+</script>
+
+<input bind:value={name} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/output.svelte
new file mode 100644
index 0000000000..64c61be00c
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-1/output.svelte
@@ -0,0 +1,11 @@
+<!-- @migration-task Error while migrating Svelte code: can't migrate `$: other = name;` to `$derived` because there's a variable named derived.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let name = 'world';
+
+	let derived;
+
+	$: other = name;
+</script>
+
+<input bind:value={name} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/input.svelte
new file mode 100644
index 0000000000..0b298cc7d2
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/input.svelte
@@ -0,0 +1,5 @@
+<script>
+	let derived;
+</script>
+
+<svelte:component this={derived} />
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/output.svelte
new file mode 100644
index 0000000000..01864be058
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-2/output.svelte
@@ -0,0 +1,7 @@
+<!-- @migration-task Error while migrating Svelte code: migrating this component would require adding a `$derived` rune but there's already a variable named derived.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let derived;
+</script>
+
+<svelte:component this={derived} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/input.svelte
new file mode 100644
index 0000000000..9203fdf30c
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/input.svelte
@@ -0,0 +1,6 @@
+<script>
+	let derived;
+</script>
+<Component>
+	<slot name="derived" slot="derived" />
+</Component>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/output.svelte
new file mode 100644
index 0000000000..9e4f086aed
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-3/output.svelte
@@ -0,0 +1,7 @@
+<!-- @migration-task Error while migrating Svelte code: This migration would change the name of a slot making the component unusable -->
+<script>
+	let derived;
+</script>
+<Component>
+	<slot name="derived" slot="derived" />
+</Component>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/input.svelte
new file mode 100644
index 0000000000..c4179c7185
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/input.svelte
@@ -0,0 +1,10 @@
+<script>
+	let name = 'world';
+
+	let derived;
+
+	let other;
+	$: other = name;
+</script>
+
+<input bind:value={name} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/output.svelte
new file mode 100644
index 0000000000..05cd363682
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$derived-derived-var-4/output.svelte
@@ -0,0 +1,12 @@
+<!-- @migration-task Error while migrating Svelte code: can't migrate `let other;` to `$derived` because there's a variable named derived.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let name = 'world';
+
+	let derived;
+
+	let other;
+	$: other = name;
+</script>
+
+<input bind:value={name} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/input.svelte
new file mode 100644
index 0000000000..bc50d58776
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/input.svelte
@@ -0,0 +1,4 @@
+<script>
+	let props;
+	export let something;
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/output.svelte
new file mode 100644
index 0000000000..33532dbaf5
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$props-props-var-1/output.svelte
@@ -0,0 +1,6 @@
+<!-- @migration-task Error while migrating Svelte code: migrating this component would require adding a `$props` rune but there's already a variable named props.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let props;
+	export let something;
+</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/input.svelte
new file mode 100644
index 0000000000..8999063751
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/input.svelte
@@ -0,0 +1,7 @@
+<script>
+	let state = 'world';
+
+	let other;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/output.svelte
new file mode 100644
index 0000000000..d795f588ec
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-1/output.svelte
@@ -0,0 +1,9 @@
+<!-- @migration-task Error while migrating Svelte code: can't migrate `let other;` to `$state` because there's a variable named state.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let state = 'world';
+
+	let other;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/input.svelte
new file mode 100644
index 0000000000..354110f521
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/input.svelte
@@ -0,0 +1,7 @@
+<script>
+	let state = 'world';
+
+	let other = 42;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/output.svelte
new file mode 100644
index 0000000000..cf084c0364
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-2/output.svelte
@@ -0,0 +1,9 @@
+<!-- @migration-task Error while migrating Svelte code: can't migrate `let other = 42;` to `$state` because there's a variable named state.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let state = 'world';
+
+	let other = 42;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/_config.js b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/_config.js
new file mode 100644
index 0000000000..aceae9ce69
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	logs: [
+		'One or more `@migration-task` comments were added to `output.svelte`, please check them and complete the migration manually.'
+	],
+	errors: []
+});
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/input.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/input.svelte
new file mode 100644
index 0000000000..ddf64172fe
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/input.svelte
@@ -0,0 +1,7 @@
+<script>
+	let state = 'world';
+
+	$: other = 42;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/output.svelte b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/output.svelte
new file mode 100644
index 0000000000..3e41b632d1
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/impossible-migrate-$state-state-var-3/output.svelte
@@ -0,0 +1,9 @@
+<!-- @migration-task Error while migrating Svelte code: can't migrate `$: other = 42;` to `$state` because there's a variable named state.
+     Rename the variable and try again or migrate by hand. -->
+<script>
+	let state = 'world';
+
+	$: other = 42;
+</script>
+
+<input bind:value={other} />
\ No newline at end of file

From 31e6bbb6466d1a8dad71efeb9f63b7e1c1010d32 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 8 Nov 2024 12:25:03 +0100
Subject: [PATCH 137/404] fix: add `lang="ts"` attribute during migration if
 needed (#14222)

* fix: add `lang="ts"` attribute during migration if needed

fixes #14219

* fix
---
 .changeset/seven-clocks-pull.md                     |  5 +++++
 packages/svelte/src/compiler/migrate/index.js       | 10 +++++++++-
 .../tests/migrate/samples/slot-use_ts-2/_config.js  |  5 +++++
 .../migrate/samples/slot-use_ts-2/input.svelte      |  5 +++++
 .../migrate/samples/slot-use_ts-2/output.svelte     | 10 ++++++++++
 .../tests/migrate/samples/slot-use_ts-3/_config.js  |  5 +++++
 .../migrate/samples/slot-use_ts-3/input.svelte      |  6 ++++++
 .../migrate/samples/slot-use_ts-3/output.svelte     | 13 +++++++++++++
 .../tests/migrate/samples/slot-use_ts/output.svelte |  2 +-
 9 files changed, 59 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/seven-clocks-pull.md
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-2/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-2/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-2/output.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-3/_config.js
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-3/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/slot-use_ts-3/output.svelte

diff --git a/.changeset/seven-clocks-pull.md b/.changeset/seven-clocks-pull.md
new file mode 100644
index 0000000000..e426560b7b
--- /dev/null
+++ b/.changeset/seven-clocks-pull.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: add `lang="ts"` attribute during migration if needed
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index b7687af09f..5bcf160e8b 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -207,8 +207,12 @@ export function migrate(source, { filename, use_ts } = {}) {
 			analysis.uses_props ||
 			state.has_svelte_self;
 
+		const need_ts_tag =
+			state.uses_ts &&
+			(!parsed.instance || !parsed.instance.attributes.some((attr) => attr.name === 'lang'));
+
 		if (!parsed.instance && need_script) {
-			str.appendRight(0, '<script>');
+			str.appendRight(0, need_ts_tag ? '<script lang="ts">' : '<script>');
 		}
 
 		if (state.has_svelte_self && filename) {
@@ -326,6 +330,10 @@ export function migrate(source, { filename, use_ts } = {}) {
 				props_declaration = `\n${indent}${props_declaration}`;
 				str.appendRight(insertion_point, props_declaration);
 			}
+
+			if (parsed.instance && need_ts_tag) {
+				str.appendRight(parsed.instance.start + '<script'.length, ' lang="ts"');
+			}
 		}
 
 		/**
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-2/_config.js b/packages/svelte/tests/migrate/samples/slot-use_ts-2/_config.js
new file mode 100644
index 0000000000..dbc620d66e
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-2/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	use_ts: true
+});
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-2/input.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts-2/input.svelte
new file mode 100644
index 0000000000..0ea83a56d8
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-2/input.svelte
@@ -0,0 +1,5 @@
+<script>
+    // script tag but no lang="ts", because for example only imports present
+</script>
+
+<slot />
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-2/output.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts-2/output.svelte
new file mode 100644
index 0000000000..a8e8db66b1
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-2/output.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+    interface Props {
+        children?: import('svelte').Snippet;
+    }
+
+    let { children }: Props = $props();
+    // script tag but no lang="ts", because for example only imports present
+</script>
+
+{@render children?.()}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-3/_config.js b/packages/svelte/tests/migrate/samples/slot-use_ts-3/_config.js
new file mode 100644
index 0000000000..dbc620d66e
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-3/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	use_ts: true
+});
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-3/input.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts-3/input.svelte
new file mode 100644
index 0000000000..b228fef106
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-3/input.svelte
@@ -0,0 +1,6 @@
+<script>
+    /** @type {ShouldNotUseTSBecauseImUsingJsDoc} */
+    export let data;
+</script>
+
+<slot />
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts-3/output.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts-3/output.svelte
new file mode 100644
index 0000000000..ab95eace3a
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts-3/output.svelte
@@ -0,0 +1,13 @@
+<script>
+    
+    /**
+     * @typedef {Object} Props
+     * @property {ShouldNotUseTSBecauseImUsingJsDoc} data
+     * @property {import('svelte').Snippet} [children]
+     */
+
+    /** @type {Props} */
+    let { data, children } = $props();
+</script>
+
+{@render children?.()}
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte b/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte
index 3e92f5ceb1..0ba0bf53e9 100644
--- a/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte
+++ b/packages/svelte/tests/migrate/samples/slot-use_ts/output.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 	interface Props {
 		children?: import('svelte').Snippet;
 	}

From f0c2d4c69833d161778ddfde3ed77740499f674e Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 8 Nov 2024 14:14:56 +0100
Subject: [PATCH 138/404] fix: account for shadowing children slot during
 migration (#14224)

Fixes #14171
---
 .changeset/lazy-chefs-float.md                 |  5 +++++
 packages/svelte/src/compiler/migrate/index.js  | 15 +++++++++++++++
 .../shadowed-forwarded-slot/input.svelte       | 10 ++++++++++
 .../shadowed-forwarded-slot/output.svelte      | 18 +++++++++++++++++-
 4 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/lazy-chefs-float.md

diff --git a/.changeset/lazy-chefs-float.md b/.changeset/lazy-chefs-float.md
new file mode 100644
index 0000000000..ce15e3dabc
--- /dev/null
+++ b/.changeset/lazy-chefs-float.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: account for shadowing children slot during migration
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 5bcf160e8b..8c2429b1c9 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -1300,6 +1300,21 @@ const template = {
 			existing_prop.needs_refine_type = false;
 		}
 
+		if (
+			slot_name === 'default' &&
+			path.some(
+				(parent) =>
+					(parent.type === 'SvelteComponent' ||
+						parent.type === 'Component' ||
+						parent.type === 'RegularElement' ||
+						parent.type === 'SvelteElement' ||
+						parent.type === 'SvelteFragment') &&
+					parent.attributes.some((attr) => (attr.type = 'LetDirective'))
+			)
+		) {
+			aliased_slot_name = `${name}_render`;
+			state.derived_conflicting_slots.set(aliased_slot_name, name);
+		}
 		name = aliased_slot_name ?? name;
 
 		if (node.fragment.nodes.length > 0) {
diff --git a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
index 800ef2532c..18d28e9d34 100644
--- a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
+++ b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/input.svelte
@@ -12,4 +12,14 @@
 			</div>
 		</MyComponent>
 	</div>
+</MyInput>
+
+<MyInput let:args>
+	<slot/>
+</MyInput>
+
+<MyInput>
+	<div let:args>
+		<slot/>
+	</div>
 </MyInput>
\ No newline at end of file
diff --git a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte
index 3c763349c6..8bf12c0ced 100644
--- a/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte
+++ b/packages/svelte/tests/migrate/samples/shadowed-forwarded-slot/output.svelte
@@ -2,11 +2,13 @@
 	/**
 	 * @typedef {Object} Props
 	 * @property {import('svelte').Snippet} [label]
+	 * @property {import('svelte').Snippet} [children]
 	 */
 
 	/** @type {Props} */
-	let { label } = $props();
+	let { label, children } = $props();
 	const label_render = $derived(label);
+	const children_render = $derived(children);
 
 </script>
 
@@ -30,4 +32,18 @@
 			</MyComponent>
 		</div>
 	{/snippet}
+</MyInput>
+
+<MyInput >
+	{#snippet children({ args })}
+		{@render children_render?.()}
+	{/snippet}
+</MyInput>
+
+<MyInput>
+	<div >
+		{#snippet children({ args })}
+				{@render children_render?.()}
+					{/snippet}
+		</div>
 </MyInput>
\ No newline at end of file

From 1060bea6e1fd1a02f2d251e200591864511e2ea2 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 8 Nov 2024 15:30:38 +0100
Subject: [PATCH 139/404] fix: consider `valueOf` in the reactive methods of
 `SvelteDate` (#14227)

---
 .changeset/cyan-cooks-nail.md               |  5 +++++
 packages/svelte/src/reactivity/date.js      |  2 +-
 packages/svelte/src/reactivity/date.test.ts | 24 +++++++++++++++++++++
 3 files changed, 30 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/cyan-cooks-nail.md

diff --git a/.changeset/cyan-cooks-nail.md b/.changeset/cyan-cooks-nail.md
new file mode 100644
index 0000000000..656cf3a413
--- /dev/null
+++ b/.changeset/cyan-cooks-nail.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: consider `valueOf` in the reactive methods of `SvelteDate`
diff --git a/packages/svelte/src/reactivity/date.js b/packages/svelte/src/reactivity/date.js
index 9eb0cc3521..2d8de624bc 100644
--- a/packages/svelte/src/reactivity/date.js
+++ b/packages/svelte/src/reactivity/date.js
@@ -30,7 +30,7 @@ export class SvelteDate extends Date {
 		);
 
 		for (const method of methods) {
-			if (method.startsWith('get') || method.startsWith('to')) {
+			if (method.startsWith('get') || method.startsWith('to') || method === 'valueOf') {
 				// @ts-ignore
 				proto[method] = function (...args) {
 					// don't memoize if there are arguments
diff --git a/packages/svelte/src/reactivity/date.test.ts b/packages/svelte/src/reactivity/date.test.ts
index d07b6780c6..87bfde41c8 100644
--- a/packages/svelte/src/reactivity/date.test.ts
+++ b/packages/svelte/src/reactivity/date.test.ts
@@ -588,6 +588,30 @@ test('Date.toLocaleString', () => {
 	cleanup();
 });
 
+test('Date.valueOf', () => {
+	const date = new SvelteDate(initial_date);
+
+	const log: any = [];
+
+	const cleanup = effect_root(() => {
+		render_effect(() => {
+			log.push(date.valueOf());
+		});
+	});
+
+	flushSync();
+
+	assert.deepEqual(log, [initial_date.valueOf()]);
+
+	flushSync(() => {
+		date.setTime(date.getTime() + 10);
+	});
+
+	assert.deepEqual(log, [initial_date.valueOf(), new Date(initial_date.getTime() + 10).valueOf()]);
+
+	cleanup();
+});
+
 test('Date.instanceOf', () => {
 	assert.equal(new SvelteDate() instanceof Date, true);
 });

From 4bcd01b9941c7ba393738b5e038d9f4ad96b3bbd Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 8 Nov 2024 11:48:03 -0800
Subject: [PATCH 140/404] Version Packages (#14207)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/chatty-gorillas-poke.md  |  5 -----
 .changeset/cyan-cooks-nail.md       |  5 -----
 .changeset/four-jobs-care.md        |  5 -----
 .changeset/giant-waves-act.md       |  5 -----
 .changeset/late-dodos-film.md       |  5 -----
 .changeset/lazy-chefs-float.md      |  5 -----
 .changeset/nice-numbers-remember.md |  5 -----
 .changeset/seven-clocks-pull.md     |  5 -----
 packages/svelte/CHANGELOG.md        | 20 ++++++++++++++++++++
 packages/svelte/package.json        |  2 +-
 packages/svelte/src/version.js      |  2 +-
 11 files changed, 22 insertions(+), 42 deletions(-)
 delete mode 100644 .changeset/chatty-gorillas-poke.md
 delete mode 100644 .changeset/cyan-cooks-nail.md
 delete mode 100644 .changeset/four-jobs-care.md
 delete mode 100644 .changeset/giant-waves-act.md
 delete mode 100644 .changeset/late-dodos-film.md
 delete mode 100644 .changeset/lazy-chefs-float.md
 delete mode 100644 .changeset/nice-numbers-remember.md
 delete mode 100644 .changeset/seven-clocks-pull.md

diff --git a/.changeset/chatty-gorillas-poke.md b/.changeset/chatty-gorillas-poke.md
deleted file mode 100644
index 744adcf214..0000000000
--- a/.changeset/chatty-gorillas-poke.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: add migration task when there's a variable named that would conflict with a rune
diff --git a/.changeset/cyan-cooks-nail.md b/.changeset/cyan-cooks-nail.md
deleted file mode 100644
index 656cf3a413..0000000000
--- a/.changeset/cyan-cooks-nail.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: consider `valueOf` in the reactive methods of `SvelteDate`
diff --git a/.changeset/four-jobs-care.md b/.changeset/four-jobs-care.md
deleted file mode 100644
index 51e5d22313..0000000000
--- a/.changeset/four-jobs-care.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: handle sibling combinators within `:has`
diff --git a/.changeset/giant-waves-act.md b/.changeset/giant-waves-act.md
deleted file mode 100644
index 591f0f25ba..0000000000
--- a/.changeset/giant-waves-act.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: consider variables with synthetic store sub as state
diff --git a/.changeset/late-dodos-film.md b/.changeset/late-dodos-film.md
deleted file mode 100644
index c3636019da..0000000000
--- a/.changeset/late-dodos-film.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: read index as a source in legacy keyed each block
diff --git a/.changeset/lazy-chefs-float.md b/.changeset/lazy-chefs-float.md
deleted file mode 100644
index ce15e3dabc..0000000000
--- a/.changeset/lazy-chefs-float.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: account for shadowing children slot during migration
diff --git a/.changeset/nice-numbers-remember.md b/.changeset/nice-numbers-remember.md
deleted file mode 100644
index 810343aedf..0000000000
--- a/.changeset/nice-numbers-remember.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure explicit nesting selector is always applied
diff --git a/.changeset/seven-clocks-pull.md b/.changeset/seven-clocks-pull.md
deleted file mode 100644
index e426560b7b..0000000000
--- a/.changeset/seven-clocks-pull.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: add `lang="ts"` attribute during migration if needed
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 4283f406d6..98fdbc6937 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,25 @@
 # svelte
 
+## 5.1.13
+
+### Patch Changes
+
+- fix: add migration task when there's a variable named that would conflict with a rune ([#14216](https://github.com/sveltejs/svelte/pull/14216))
+
+- fix: consider `valueOf` in the reactive methods of `SvelteDate` ([#14227](https://github.com/sveltejs/svelte/pull/14227))
+
+- fix: handle sibling combinators within `:has` ([#14213](https://github.com/sveltejs/svelte/pull/14213))
+
+- fix: consider variables with synthetic store sub as state ([#14195](https://github.com/sveltejs/svelte/pull/14195))
+
+- fix: read index as a source in legacy keyed each block ([#14208](https://github.com/sveltejs/svelte/pull/14208))
+
+- fix: account for shadowing children slot during migration ([#14224](https://github.com/sveltejs/svelte/pull/14224))
+
+- fix: ensure explicit nesting selector is always applied ([#14193](https://github.com/sveltejs/svelte/pull/14193))
+
+- fix: add `lang="ts"` attribute during migration if needed ([#14222](https://github.com/sveltejs/svelte/pull/14222))
+
 ## 5.1.12
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 0b0eb32ffd..9b0c03a5af 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.1.12",
+  "version": "5.1.13",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 9c883457e8..c50265e998 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.1.12';
+export const VERSION = '5.1.13';
 export const PUBLIC_VERSION = '5';

From 6534742ae13b6f064f0768df245b3d363add0e1e Mon Sep 17 00:00:00 2001
From: CJSnyman <98422173+CJSnyman@users.noreply.github.com>
Date: Sun, 10 Nov 2024 15:25:11 +0200
Subject: [PATCH 141/404] docs: fix grammar (#14244)

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
---
 documentation/docs/07-misc/02-testing.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/07-misc/02-testing.md b/documentation/docs/07-misc/02-testing.md
index 1c3d4ba6e1..c8774e341f 100644
--- a/documentation/docs/07-misc/02-testing.md
+++ b/documentation/docs/07-misc/02-testing.md
@@ -197,7 +197,7 @@ When writing component tests that involve two-way bindings, context or snippet p
 
 E2E (short for 'end to end') tests allow you to test your full application through the eyes of the user. This section uses [Playwright](https://playwright.dev/) as an example, but you can also use other solutions like [Cypress](https://www.cypress.io/) or [NightwatchJS](https://nightwatchjs.org/).
 
-To get start with Playwright, either let you guide by [their VS Code extension](https://playwright.dev/docs/getting-started-vscode), or install it from the command line using `npm init playwright`. It is also part of the setup CLI when you run `npx sv create`.
+To get started with Playwright, either install it via [the VS Code extension](https://playwright.dev/docs/getting-started-vscode), or install it from the command line using `npm init playwright`. It is also part of the setup CLI when you run `npx sv create`.
 
 After you've done that, you should have a `tests` folder and a Playwright config. You may need to adjust that config to tell Playwright what to do before running the tests - mainly starting your application at a certain port:
 

From 1e5a385c968afb302beb38e7d8dd2982fdd66d0c Mon Sep 17 00:00:00 2001
From: Hosam Sultan <hosam5553@gmail.com>
Date: Sun, 10 Nov 2024 05:31:50 -0800
Subject: [PATCH 142/404] docs: fix typo (#14232)

---
 documentation/docs/03-template-syntax/06-snippet.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/03-template-syntax/06-snippet.md b/documentation/docs/03-template-syntax/06-snippet.md
index d4ec5a0cef..4bbc970c5d 100644
--- a/documentation/docs/03-template-syntax/06-snippet.md
+++ b/documentation/docs/03-template-syntax/06-snippet.md
@@ -169,7 +169,7 @@ Any content inside the component tags that is _not_ a snippet declaration implic
 
 ```svelte
 <!--- file: App.svelte --->
-<Button>click me<Button>
+<Button>click me</Button>
 ```
 
 ```svelte

From d207666ec3066a7fed208141c31e06fcf3275059 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sun, 10 Nov 2024 17:48:10 +0100
Subject: [PATCH 143/404] fix: consider img with loading attribute not static
 (#14237)

* fix: consider img with loading attribute not static

* chore: add comment for `is_static_element`

* chore: better comment

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>

---------

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
---
 .changeset/nice-chicken-wonder.md                            | 5 +++++
 .../phases/3-transform/client/visitors/shared/fragment.js    | 5 +++++
 .../samples/img-loading-lazy-no-static/_config.js            | 5 +++++
 .../samples/img-loading-lazy-no-static/main.svelte           | 2 ++
 4 files changed, 17 insertions(+)
 create mode 100644 .changeset/nice-chicken-wonder.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte

diff --git a/.changeset/nice-chicken-wonder.md b/.changeset/nice-chicken-wonder.md
new file mode 100644
index 0000000000..b9f6e39fb8
--- /dev/null
+++ b/.changeset/nice-chicken-wonder.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: consider img with loading attribute not static
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 022b8574d9..98272817df 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
@@ -150,6 +150,11 @@ function is_static_element(node) {
 			return false;
 		}
 
+		// We need to apply src and loading after appending the img to the DOM for lazy loading to work
+		if (node.name === 'img' && attribute.name === 'loading') {
+			return false;
+		}
+
 		if (node.name.includes('-')) {
 			return false; // we're setting all attributes on custom elements through properties
 		}
diff --git a/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js
new file mode 100644
index 0000000000..673ff2d754
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<h1></h1><img src="..." loading="lazy" />`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte
new file mode 100644
index 0000000000..15425d9051
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte
@@ -0,0 +1,2 @@
+<h1></h1>
+<img src="..." loading="lazy">
\ No newline at end of file

From 7bc94b998476e9dfed73ad9ef0f66b7d06252b27 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sun, 10 Nov 2024 20:55:39 +0100
Subject: [PATCH 144/404] fix: do not treat reassigned synthetic binds as state
 in runes mode (#14236)

* fix: do not treat reassigned synthetic binds as state in runes mode

* fix: avoid calling checks if we are in runes mode
---
 .changeset/bright-papayas-sneeze.md           |  5 +++
 .../src/compiler/phases/2-analyze/index.js    | 33 +++++++++++++------
 .../reassigned-store-not-state/_config.js     |  7 ++++
 .../reassigned-store-not-state/main.svelte    | 13 ++++++++
 4 files changed, 48 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/bright-papayas-sneeze.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/main.svelte

diff --git a/.changeset/bright-papayas-sneeze.md b/.changeset/bright-papayas-sneeze.md
new file mode 100644
index 0000000000..8587aebc66
--- /dev/null
+++ b/.changeset/bright-papayas-sneeze.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: do not treat reassigned synthetic binds as state in runes mode
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 36d8145145..9e4f72a66d 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -276,6 +276,8 @@ export function analyze_component(root, source, options) {
 	/** @type {Template} */
 	const template = { ast: root.fragment, scope, scopes };
 
+	let synthetic_stores_legacy_check = [];
+
 	// create synthetic bindings for store subscriptions
 	for (const [name, references] of module.scope.references) {
 		if (name[0] !== '$' || RESERVED.includes(name)) continue;
@@ -351,16 +353,21 @@ export function analyze_component(root, source, options) {
 				}
 			}
 
-			// if we are creating a synthetic binding for a let declaration we should also declare
-			// the declaration as state in case it's reassigned
-			if (
-				declaration !== null &&
-				declaration.kind === 'normal' &&
-				declaration.declaration_kind === 'let' &&
-				declaration.reassigned
-			) {
-				declaration.kind = 'state';
-			}
+			// we push to the array because at this moment in time we can't be sure if we are in legacy
+			// mode yet because we are still changing the module scope
+			synthetic_stores_legacy_check.push(() => {
+				// if we are creating a synthetic binding for a let declaration we should also declare
+				// the declaration as state in case it's reassigned and we are not in runes mode (the function will
+				// not be called if we are not in runes mode, that's why there's no !runes check here)
+				if (
+					declaration !== null &&
+					declaration.kind === 'normal' &&
+					declaration.declaration_kind === 'let' &&
+					declaration.reassigned
+				) {
+					declaration.kind = 'state';
+				}
+			});
 
 			const binding = instance.scope.declare(b.id(name), 'store_sub', 'synthetic');
 			binding.references = references;
@@ -373,6 +380,12 @@ export function analyze_component(root, source, options) {
 
 	const runes = options.runes ?? Array.from(module.scope.references.keys()).some(is_rune);
 
+	if (!runes) {
+		for (let check of synthetic_stores_legacy_check) {
+			check();
+		}
+	}
+
 	if (runes && root.module) {
 		const context = root.module.attributes.find((attribute) => attribute.name === 'context');
 		if (context) {
diff --git a/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/_config.js b/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/_config.js
new file mode 100644
index 0000000000..7091b34479
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ logs, assert }) {
+		assert.deepEqual(logs, ['world']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/main.svelte b/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/main.svelte
new file mode 100644
index 0000000000..95da959012
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/reassigned-store-not-state/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	import { writable } from 'svelte/store';
+
+	let style = writable('world');
+	
+	$effect(() => {
+	  console.log($style);
+	});
+
+	function init(){
+		style = writable('svelte');
+	}
+</script>

From ae9f53a3bde79e8777e865acac3b99612c2cec71 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Sun, 10 Nov 2024 20:56:00 +0100
Subject: [PATCH 145/404] fix: account for mutations in script module in
 ownership check (#14253)

---
 .changeset/good-laws-sin.md                                | 5 +++++
 packages/svelte/src/internal/client/dev/ownership.js       | 3 +++
 .../samples/mutate-state-in-context-dev/_config.js         | 7 +++++++
 .../samples/mutate-state-in-context-dev/main.svelte        | 6 ++++++
 4 files changed, 21 insertions(+)
 create mode 100644 .changeset/good-laws-sin.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/main.svelte

diff --git a/.changeset/good-laws-sin.md b/.changeset/good-laws-sin.md
new file mode 100644
index 0000000000..38d3d3bfc8
--- /dev/null
+++ b/.changeset/good-laws-sin.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: account for mutations in script module in ownership check
diff --git a/packages/svelte/src/internal/client/dev/ownership.js b/packages/svelte/src/internal/client/dev/ownership.js
index 64f424e1a9..d113d9ae90 100644
--- a/packages/svelte/src/internal/client/dev/ownership.js
+++ b/packages/svelte/src/internal/client/dev/ownership.js
@@ -59,6 +59,9 @@ export function get_component() {
 		}
 
 		for (const module of modules) {
+			if (module.end == null) {
+				return null;
+			}
 			if (module.start.line < entry.line && module.end.line > entry.line) {
 				return module.component;
 			}
diff --git a/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/_config.js b/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/_config.js
new file mode 100644
index 0000000000..ed0ead960b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/main.svelte b/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/main.svelte
new file mode 100644
index 0000000000..ff6f816912
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/mutate-state-in-context-dev/main.svelte
@@ -0,0 +1,6 @@
+<script module>
+	let obj = $state({});
+	obj.test = "hi!";
+</script>
+  
+<h1>Values: {JSON.stringify(obj)}</h1>
\ No newline at end of file

From 653f4accbd3393fdaed072b936a39d908cf9d20a Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 11 Nov 2024 10:28:56 +0100
Subject: [PATCH 146/404] fix: migration script messing with attributes
 (#14260)

---
 .changeset/afraid-donuts-whisper.md               |  5 +++++
 packages/svelte/src/compiler/migrate/index.js     |  2 +-
 .../slot-dont-mess-with-attributes/input.svelte   |  5 +++++
 .../slot-dont-mess-with-attributes/output.svelte  | 15 +++++++++++++++
 4 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/afraid-donuts-whisper.md
 create mode 100644 packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/output.svelte

diff --git a/.changeset/afraid-donuts-whisper.md b/.changeset/afraid-donuts-whisper.md
new file mode 100644
index 0000000000..df9eea40ad
--- /dev/null
+++ b/.changeset/afraid-donuts-whisper.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: migration script messing with attributes
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 8c2429b1c9..080babdfb7 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -1309,7 +1309,7 @@ const template = {
 						parent.type === 'RegularElement' ||
 						parent.type === 'SvelteElement' ||
 						parent.type === 'SvelteFragment') &&
-					parent.attributes.some((attr) => (attr.type = 'LetDirective'))
+					parent.attributes.some((attr) => attr.type === 'LetDirective')
 			)
 		) {
 			aliased_slot_name = `${name}_render`;
diff --git a/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/input.svelte b/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/input.svelte
new file mode 100644
index 0000000000..53f38e0332
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/input.svelte
@@ -0,0 +1,5 @@
+<MyComponent
+  variant="outlined"
+>
+  <slot />
+</MyComponent>
diff --git a/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/output.svelte b/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/output.svelte
new file mode 100644
index 0000000000..39a6ff7957
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/slot-dont-mess-with-attributes/output.svelte
@@ -0,0 +1,15 @@
+<script>
+  /**
+   * @typedef {Object} Props
+   * @property {import('svelte').Snippet} [children]
+   */
+
+  /** @type {Props} */
+  let { children } = $props();
+</script>
+
+<MyComponent
+  variant="outlined"
+>
+  {@render children?.()}
+</MyComponent>
\ No newline at end of file

From 832499fee889e7e88911649c64ddbb84a2a8b454 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 11 Nov 2024 10:36:28 +0100
Subject: [PATCH 147/404] Version Packages (#14251)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/afraid-donuts-whisper.md |  5 -----
 .changeset/bright-papayas-sneeze.md |  5 -----
 .changeset/good-laws-sin.md         |  5 -----
 .changeset/nice-chicken-wonder.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/afraid-donuts-whisper.md
 delete mode 100644 .changeset/bright-papayas-sneeze.md
 delete mode 100644 .changeset/good-laws-sin.md
 delete mode 100644 .changeset/nice-chicken-wonder.md

diff --git a/.changeset/afraid-donuts-whisper.md b/.changeset/afraid-donuts-whisper.md
deleted file mode 100644
index df9eea40ad..0000000000
--- a/.changeset/afraid-donuts-whisper.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: migration script messing with attributes
diff --git a/.changeset/bright-papayas-sneeze.md b/.changeset/bright-papayas-sneeze.md
deleted file mode 100644
index 8587aebc66..0000000000
--- a/.changeset/bright-papayas-sneeze.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: do not treat reassigned synthetic binds as state in runes mode
diff --git a/.changeset/good-laws-sin.md b/.changeset/good-laws-sin.md
deleted file mode 100644
index 38d3d3bfc8..0000000000
--- a/.changeset/good-laws-sin.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: account for mutations in script module in ownership check
diff --git a/.changeset/nice-chicken-wonder.md b/.changeset/nice-chicken-wonder.md
deleted file mode 100644
index b9f6e39fb8..0000000000
--- a/.changeset/nice-chicken-wonder.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: consider img with loading attribute not static
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 98fdbc6937..9ab2e67282 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.1.14
+
+### Patch Changes
+
+- fix: migration script messing with attributes ([#14260](https://github.com/sveltejs/svelte/pull/14260))
+
+- fix: do not treat reassigned synthetic binds as state in runes mode ([#14236](https://github.com/sveltejs/svelte/pull/14236))
+
+- fix: account for mutations in script module in ownership check ([#14253](https://github.com/sveltejs/svelte/pull/14253))
+
+- fix: consider img with loading attribute not static ([#14237](https://github.com/sveltejs/svelte/pull/14237))
+
 ## 5.1.13
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 9b0c03a5af..04efd21643 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.1.13",
+  "version": "5.1.14",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c50265e998..17232bc9d6 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.1.13';
+export const VERSION = '5.1.14';
 export const PUBLIC_VERSION = '5';

From 0fa43e216dc0744f5b41751f087024c45efde66f Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 11 Nov 2024 14:55:04 +0100
Subject: [PATCH 148/404] fix: consider static attributes that are inlined in
 the template (#14249)

* fix: consider static attributes that are inlined in the template

* fix: use `is_inlinable_expression`

* fix: move check for inlinable expression as last

* fix: simplify and correct

* chore: accept single node in `is_inlinable_expression`

* chore: update comment

* chore: add snapshots for non static nodes
---
 .changeset/mighty-ads-appear.md               |  5 +++
 .../phases/3-transform/client/utils.js        | 27 +++++++++++++-
 .../client/visitors/RegularElement.js         | 36 ++++---------------
 .../client/visitors/shared/fragment.js        | 21 ++++++-----
 .../_expected/client/index.svelte.js          |  5 +--
 .../_expected/client/index.svelte.js          | 24 ++++++++++++-
 .../_expected/server/index.svelte.js          |  2 +-
 .../samples/skip-static-subtree/index.svelte  | 15 ++++++++
 8 files changed, 91 insertions(+), 44 deletions(-)
 create mode 100644 .changeset/mighty-ads-appear.md

diff --git a/.changeset/mighty-ads-appear.md b/.changeset/mighty-ads-appear.md
new file mode 100644
index 0000000000..c1b3b6a746
--- /dev/null
+++ b/.changeset/mighty-ads-appear.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: consider static attributes that are inlined in the template
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 2647f0a3be..c460905977 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, SvelteNode } from '#compiler' */
 /** @import { ClientTransformState, ComponentClientTransformState, ComponentContext } from './types.js' */
 /** @import { Analysis } from '../../types.js' */
 /** @import { Scope } from '../../scope.js' */
@@ -326,3 +326,28 @@ export function can_inline_variable(binding) {
 		binding.initial?.type === 'Literal'
 	);
 }
+
+/**
+ * @param {(AST.Text | AST.ExpressionTag) | (AST.Text | AST.ExpressionTag)[]} node_or_nodes
+ * @param {import('./types.js').ComponentClientTransformState} state
+ */
+export function is_inlinable_expression(node_or_nodes, state) {
+	let nodes = Array.isArray(node_or_nodes) ? node_or_nodes : [node_or_nodes];
+	let has_expression_tag = false;
+	for (let value of nodes) {
+		if (value.type === 'ExpressionTag') {
+			if (value.expression.type === 'Identifier') {
+				const binding = state.scope
+					.owner(value.expression.name)
+					?.declarations.get(value.expression.name);
+				if (!can_inline_variable(binding)) {
+					return false;
+				}
+			} else {
+				return false;
+			}
+			has_expression_tag = true;
+		}
+	}
+	return has_expression_tag;
+}
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 dafe1e74ae..4d3cebcee6 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
@@ -19,7 +19,12 @@ import {
 import * as b from '../../../../utils/builders.js';
 import { is_custom_element_node } from '../../../nodes.js';
 import { clean_nodes, determine_namespace_for_children } from '../../utils.js';
-import { build_getter, can_inline_variable, create_derived } from '../utils.js';
+import {
+	build_getter,
+	can_inline_variable,
+	create_derived,
+	is_inlinable_expression
+} from '../utils.js';
 import {
 	get_attribute_name,
 	build_attribute_value,
@@ -584,10 +589,7 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 	const inlinable_expression =
 		attribute.value === true
 			? false // not an expression
-			: is_inlinable_expression(
-					Array.isArray(attribute.value) ? attribute.value : [attribute.value],
-					context.state
-				);
+			: is_inlinable_expression(attribute.value, context.state);
 	if (attribute.metadata.expression.has_state) {
 		if (has_call) {
 			state.init.push(build_update(update));
@@ -605,30 +607,6 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 	}
 }
 
-/**
- * @param {(AST.Text | AST.ExpressionTag)[]} nodes
- * @param {import('../types.js').ComponentClientTransformState} state
- */
-function is_inlinable_expression(nodes, state) {
-	let has_expression_tag = false;
-	for (let value of nodes) {
-		if (value.type === 'ExpressionTag') {
-			if (value.expression.type === 'Identifier') {
-				const binding = state.scope
-					.owner(value.expression.name)
-					?.declarations.get(value.expression.name);
-				if (!can_inline_variable(binding)) {
-					return false;
-				}
-			} else {
-				return false;
-			}
-			has_expression_tag = true;
-		}
-	}
-	return has_expression_tag;
-}
-
 /**
  * Like `build_element_attribute_update_assignment` but without any special attribute treatment.
  * @param {Identifier}	node_id
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 98272817df..3b009fb5b5 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
@@ -3,6 +3,7 @@
 /** @import { ComponentContext } from '../../types' */
 import { is_event_attribute, is_text_attribute } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
+import { is_inlinable_expression } from '../../utils.js';
 import { build_template_literal, build_update } from './utils.js';
 
 /**
@@ -97,7 +98,7 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 
 			let child_state = state;
 
-			if (is_static_element(node)) {
+			if (is_static_element(node, state)) {
 				skipped += 1;
 			} else if (node.type === 'EachBlock' && nodes.length === 1 && is_element) {
 				node.metadata.is_controlled = true;
@@ -124,10 +125,12 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 
 /**
  * @param {SvelteNode} node
+ * @param {ComponentContext["state"]} state
  */
-function is_static_element(node) {
+function is_static_element(node, state) {
 	if (node.type !== 'RegularElement') return false;
 	if (node.fragment.metadata.dynamic) return false;
+	if (node.name.includes('-')) return false; // we're setting all attributes on custom elements through properties
 
 	for (const attribute of node.attributes) {
 		if (attribute.type !== 'Attribute') {
@@ -138,10 +141,6 @@ function is_static_element(node) {
 			return false;
 		}
 
-		if (attribute.value !== true && !is_text_attribute(attribute)) {
-			return false;
-		}
-
 		if (attribute.name === 'autofocus' || attribute.name === 'muted') {
 			return false;
 		}
@@ -155,8 +154,14 @@ function is_static_element(node) {
 			return false;
 		}
 
-		if (node.name.includes('-')) {
-			return false; // we're setting all attributes on custom elements through properties
+		if (
+			attribute.value !== true &&
+			!is_text_attribute(attribute) &&
+			// If the attribute is not a text attribute but is inlinable we will directly inline it in the
+			// the template so before returning false we need to check that the attribute is not inlinable
+			!is_inlinable_expression(attribute.value, state)
+		) {
+			return false;
 		}
 	}
 
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
index 69c6901d50..46ed3c1913 100644
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
@@ -9,11 +9,8 @@ var root = $.template(`<picture><source srcset="${__DECLARED_ASSET_0__}" type="i
 
 export default function Inline_module_vars($$anchor) {
 	var picture = root();
-	var source = $.child(picture);
-	var source_1 = $.sibling(source, 2);
-	var source_2 = $.sibling(source_1, 2);
-	var img = $.sibling(source_2, 2);
 
+	$.next(6);
 	$.reset(picture);
 	$.append($$anchor, picture);
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
index 2d3cc3ba5a..ae79efef42 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
@@ -1,7 +1,7 @@
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-var root = $.template(`<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1> </h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> <!> <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements></custom-elements></cant-skip>`, 3);
+var root = $.template(`<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1> </h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> <!> <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements></custom-elements></cant-skip> <div><input></div> <div><source></div> <select><option>a</option></select> <img src="..." alt="" loading="lazy">`, 3);
 
 export default function Skip_static_subtree($$anchor, $$props) {
 	var fragment = root();
@@ -22,6 +22,28 @@ export default function Skip_static_subtree($$anchor, $$props) {
 
 	$.set_custom_element_data(custom_elements, "with", "attributes");
 	$.reset(cant_skip);
+
+	var div = $.sibling(cant_skip, 2);
+	var input = $.child(div);
+
+	$.autofocus(input, true);
+	$.reset(div);
+
+	var div_1 = $.sibling(div, 2);
+	var source = $.child(div_1);
+
+	source.muted = true;
+	$.reset(div_1);
+
+	var select = $.sibling(div_1, 2);
+	var option = $.child(select);
+
+	option.value = null == (option.__value = "a") ? "" : "a";
+	$.reset(select);
+
+	var img = $.sibling(select, 2);
+
 	$.template_effect(() => $.set_text(text, $$props.title));
+	$.handle_lazy_img(img);
 	$.append($$anchor, fragment);
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
index 2bd910508d..d09ac657f9 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
@@ -3,5 +3,5 @@ import * as $ from "svelte/internal/server";
 export default function Skip_static_subtree($$payload, $$props) {
 	let { title, content } = $$props;
 
-	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip>`;
+	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus></div> <div><source muted></div> <select><option value="a">a</option></select> <img src="..." alt="" loading="lazy">`;
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte b/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
index de399169b4..cb73eba707 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
@@ -30,3 +30,18 @@
 <cant-skip>
 	<custom-elements with="attributes"></custom-elements>
 </cant-skip>
+
+<div>
+	<!-- svelte-ignore a11y_autofocus -->
+	<input autofocus />
+</div>
+
+<div>
+	<source muted />
+</div>
+
+<select>
+	<option value="a">a</option>
+</select>
+
+<img src="..." alt="" loading="lazy" />
\ No newline at end of file

From 4a85c4157df1bd5d8903b336bfd4af204d32f1ce Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 11 Nov 2024 10:07:09 -0800
Subject: [PATCH 149/404] Version Packages (#14262)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/mighty-ads-appear.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/mighty-ads-appear.md

diff --git a/.changeset/mighty-ads-appear.md b/.changeset/mighty-ads-appear.md
deleted file mode 100644
index c1b3b6a746..0000000000
--- a/.changeset/mighty-ads-appear.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: consider static attributes that are inlined in the template
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 9ab2e67282..e2c59c27f4 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.1.15
+
+### Patch Changes
+
+- fix: consider static attributes that are inlined in the template ([#14249](https://github.com/sveltejs/svelte/pull/14249))
+
 ## 5.1.14
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 04efd21643..3124fd73af 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.1.14",
+  "version": "5.1.15",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 17232bc9d6..20a804671e 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.1.14';
+export const VERSION = '5.1.15';
 export const PUBLIC_VERSION = '5';

From 36ece1c38114a7d1b4177829f76201eaeef7a6f4 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 12 Nov 2024 14:46:26 +0100
Subject: [PATCH 150/404] fix: don't wrap pseudo classes inside `:global(...)`
 with another `:global(...)` (#14267)

fixes #14088
---
 .changeset/hot-ladybugs-clap.md               |  5 ++
 packages/svelte/src/compiler/migrate/index.js | 46 ++++++++++++++-----
 .../samples/is-not-where-has/input.svelte     |  2 +
 .../samples/is-not-where-has/output.svelte    |  2 +
 4 files changed, 44 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/hot-ladybugs-clap.md

diff --git a/.changeset/hot-ladybugs-clap.md b/.changeset/hot-ladybugs-clap.md
new file mode 100644
index 0000000000..20acdd0750
--- /dev/null
+++ b/.changeset/hot-ladybugs-clap.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't wrap pseudo classes inside `:global(...)` with another `:global(...)` during migration
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 080babdfb7..4942dd7db2 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -40,9 +40,10 @@ class MigrationError extends Error {
  */
 function migrate_css(state) {
 	if (!state.analysis.css.ast?.start) return;
-	let code = state.str
+	const css_contents = state.str
 		.snip(state.analysis.css.ast.start, /** @type {number} */ (state.analysis.css.ast?.end))
 		.toString();
+	let code = css_contents;
 	let starting = 0;
 
 	// since we already blank css we can't work directly on `state.str` so we will create a copy that we can update
@@ -56,23 +57,28 @@ function migrate_css(state) {
 		) {
 			let start = code.indexOf('(') + 1;
 			let is_global = false;
+
 			const global_str = ':global';
 			const next_global = code.indexOf(global_str);
 			const str_between = code.substring(start, next_global);
 			if (!str_between.trim()) {
 				is_global = true;
 				start += global_str.length;
+			} else {
+				const prev_global = css_contents.lastIndexOf(global_str, starting);
+				if (prev_global > -1) {
+					const end =
+						find_closing_parenthesis(css_contents.indexOf('(', prev_global) + 1, css_contents) -
+						starting;
+					if (end > start) {
+						starting += end;
+						code = code.substring(end);
+						continue;
+					}
+				}
 			}
-			let parenthesis = 1;
-			let end = start;
-			let char = code[end];
-			// find the closing parenthesis
-			while (parenthesis !== 0 && char) {
-				if (char === '(') parenthesis++;
-				if (char === ')') parenthesis--;
-				end++;
-				char = code[end];
-			}
+
+			const end = find_closing_parenthesis(start, code);
 			if (start && end) {
 				if (!is_global && !code.startsWith(':not')) {
 					str.prependLeft(starting + start, ':global(');
@@ -89,6 +95,24 @@ function migrate_css(state) {
 	state.str.update(state.analysis.css.ast?.start, state.analysis.css.ast?.end, str.toString());
 }
 
+/**
+ * @param {number} start
+ * @param {string} code
+ */
+function find_closing_parenthesis(start, code) {
+	let parenthesis = 1;
+	let end = start;
+	let char = code[end];
+	// find the closing parenthesis
+	while (parenthesis !== 0 && char) {
+		if (char === '(') parenthesis++;
+		if (char === ')') parenthesis--;
+		end++;
+		char = code[end];
+	}
+	return end;
+}
+
 /**
  * Does a best-effort migration of Svelte code towards using runes, event attributes and render tags.
  * May throw an error if the code is too complex to migrate automatically.
diff --git a/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte b/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
index fbfc1c119f..88c54ad2db 100644
--- a/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
+++ b/packages/svelte/tests/migrate/samples/is-not-where-has/input.svelte
@@ -47,6 +47,8 @@ what if i'm talking about `:has()` in my blog?
 	div :where(:global(.class:is(span:has(* > *)))){}
 	div :is(:global(.class:is(span:is(:hover)), .x)){}
 
+	:global(button:has(.is-active)){}
+
 	div{
 		p:has(&){
 
diff --git a/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
index d8bb703ac5..9f23cb1024 100644
--- a/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
+++ b/packages/svelte/tests/migrate/samples/is-not-where-has/output.svelte
@@ -47,6 +47,8 @@ what if i'm talking about `:has()` in my blog?
 	div :where(:global(.class:is(span:has(* > *)))){}
 	div :is(:global(.class:is(span:is(:hover)), .x)){}
 
+	:global(button:has(.is-active)){}
+
 	div{
 		p:has(:global(&)){
 

From 033061842d463c1db9a0ebed3b27a2ab5b7fddb7 Mon Sep 17 00:00:00 2001
From: Torsten Dittmann <torsten.dittmann@googlemail.com>
Date: Tue, 12 Nov 2024 18:13:05 +0100
Subject: [PATCH 151/404] fix: named slots with reserved keywords during
 migration (#14278)

Fixes named slots with a reserved keyword not working anymore after migration. Re-uses the @migration-task logic for invalid identifiers.

Fixes #14277
---
 .changeset/mean-worms-fetch.md                           | 5 +++++
 packages/svelte/src/compiler/migrate/index.js            | 4 ++--
 .../migrate/samples/slot-non-identifier/input.svelte     | 8 +++++++-
 .../migrate/samples/slot-non-identifier/output.svelte    | 9 ++++++++-
 4 files changed, 22 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/mean-worms-fetch.md

diff --git a/.changeset/mean-worms-fetch.md b/.changeset/mean-worms-fetch.md
new file mode 100644
index 0000000000..d573a631de
--- /dev/null
+++ b/.changeset/mean-worms-fetch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: bail on named slots with that have reserved keywords during migration
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 4942dd7db2..9db09158a1 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -17,7 +17,7 @@ import {
 } from '../utils/ast.js';
 import { migrate_svelte_ignore } from '../utils/extract_svelte_ignore.js';
 import { validate_component_options } from '../validate-options.js';
-import { is_svg, is_void } from '../../utils.js';
+import { is_reserved, is_svg, is_void } from '../../utils.js';
 import { regex_is_valid_identifier } from '../phases/patterns.js';
 
 const regex_style_tags = /(<style[^>]+>)([\S\s]*?)(<\/style>)/g;
@@ -1440,7 +1440,7 @@ function migrate_slot_usage(node, path, state) {
 			if (snippet_name === 'default') {
 				snippet_name = 'children';
 			}
-			if (!regex_is_valid_identifier.test(snippet_name)) {
+			if (!regex_is_valid_identifier.test(snippet_name) || is_reserved(snippet_name)) {
 				has_migration_task = true;
 				state.str.appendLeft(
 					node.start,
diff --git a/packages/svelte/tests/migrate/samples/slot-non-identifier/input.svelte b/packages/svelte/tests/migrate/samples/slot-non-identifier/input.svelte
index a62eff1b74..7cf7dd86bb 100644
--- a/packages/svelte/tests/migrate/samples/slot-non-identifier/input.svelte
+++ b/packages/svelte/tests/migrate/samples/slot-non-identifier/input.svelte
@@ -14,6 +14,12 @@
 	</div>
 </Comp>
 
+<Comp>
+	<div slot="new">
+		reserved keyword
+	</div>
+</Comp>
+
 <Comp>
 	<div slot="stuff">
 		cool
@@ -63,4 +69,4 @@
 	<svelte:fragment let:should_stay slot="cool stuff">
 		cool
 	</svelte:fragment>
-</Comp>
\ No newline at end of file
+</Comp>
diff --git a/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte b/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
index 85913264b4..fb262e8c25 100644
--- a/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
+++ b/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
@@ -16,6 +16,13 @@
 	</div>
 </Comp>
 
+<Comp>
+	<!-- @migration-task: migrate this slot by hand, `new` is an invalid identifier -->
+	<div slot="new">
+		reserved keyword
+	</div>
+</Comp>
+
 <Comp>
 	{#snippet stuff()}
 		<div >
@@ -75,4 +82,4 @@
 	<svelte:fragment let:should_stay slot="cool stuff">
 		cool
 	</svelte:fragment>
-</Comp>
\ No newline at end of file
+</Comp>

From f5a7d492162781c09794f207fa9a51c1d4eab51c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 12 Nov 2024 17:59:34 -0500
Subject: [PATCH 152/404] Version Packages (#14274)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/hot-ladybugs-clap.md | 5 -----
 .changeset/mean-worms-fetch.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/hot-ladybugs-clap.md
 delete mode 100644 .changeset/mean-worms-fetch.md

diff --git a/.changeset/hot-ladybugs-clap.md b/.changeset/hot-ladybugs-clap.md
deleted file mode 100644
index 20acdd0750..0000000000
--- a/.changeset/hot-ladybugs-clap.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't wrap pseudo classes inside `:global(...)` with another `:global(...)` during migration
diff --git a/.changeset/mean-worms-fetch.md b/.changeset/mean-worms-fetch.md
deleted file mode 100644
index d573a631de..0000000000
--- a/.changeset/mean-worms-fetch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: bail on named slots with that have reserved keywords during migration
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index e2c59c27f4..879fdb2058 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.1.16
+
+### Patch Changes
+
+- fix: don't wrap pseudo classes inside `:global(...)` with another `:global(...)` during migration ([#14267](https://github.com/sveltejs/svelte/pull/14267))
+
+- fix: bail on named slots with that have reserved keywords during migration ([#14278](https://github.com/sveltejs/svelte/pull/14278))
+
 ## 5.1.15
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 3124fd73af..760272680e 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.1.15",
+  "version": "5.1.16",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 20a804671e..c6802cecf0 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.1.15';
+export const VERSION = '5.1.16';
 export const PUBLIC_VERSION = '5';

From 25d9aa18286a0fead03f8556eddf71eccf350194 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 13 Nov 2024 00:18:51 +0000
Subject: [PATCH 153/404] chore: simplify signal capturing logic (#14281)

---
 .../svelte/src/internal/client/reactivity/props.js  |  4 ++--
 packages/svelte/src/internal/client/runtime.js      | 13 +++++--------
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index ae934c01a5..dbfb8f0337 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -13,7 +13,7 @@ import { derived, derived_safe_equal } from './deriveds.js';
 import {
 	active_effect,
 	get,
-	is_signals_recorded,
+	captured_signals,
 	set_active_effect,
 	untrack,
 	update
@@ -390,7 +390,7 @@ export function prop(props, key, flags, fallback) {
 	return function (/** @type {any} */ value, /** @type {boolean} */ mutation) {
 		// legacy nonsense — need to ensure the source is invalidated when necessary
 		// also needed for when handling inspect logic so we can inspect the correct source signal
-		if (is_signals_recorded) {
+		if (captured_signals !== null) {
 			// set this so that we don't reset to the parent value if `d`
 			// is invalidated because of `invalidate_inner_signals` (rather
 			// than because the parent or child value changed)
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index e9f1c773e6..5b5b488824 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -128,8 +128,8 @@ let current_version = 0;
 // to prevent memory leaks, we skip adding the reaction.
 export let skip_reaction = false;
 // Handle collecting all signals which are read during a specific time frame
-export let is_signals_recorded = false;
-let captured_signals = new Set();
+/** @type {Set<Value> | null} */
+export let captured_signals = null;
 
 // Handling runtime component context
 /** @type {ComponentContext | null} */
@@ -732,7 +732,7 @@ export function get(signal) {
 		return value;
 	}
 
-	if (is_signals_recorded) {
+	if (captured_signals !== null) {
 		captured_signals.add(signal);
 	}
 
@@ -800,21 +800,18 @@ export function safe_get(signal) {
  * @param {() => any} fn
  */
 export function invalidate_inner_signals(fn) {
-	var previous_is_signals_recorded = is_signals_recorded;
 	var previous_captured_signals = captured_signals;
-	is_signals_recorded = true;
 	captured_signals = new Set();
 	var captured = captured_signals;
 	var signal;
 	try {
 		untrack(fn);
-	} finally {
-		is_signals_recorded = previous_is_signals_recorded;
-		if (is_signals_recorded) {
+		if (previous_captured_signals !== null) {
 			for (signal of captured_signals) {
 				previous_captured_signals.add(signal);
 			}
 		}
+	} finally {
 		captured_signals = previous_captured_signals;
 	}
 	for (signal of captured) {

From ac9b7de05866d2fde6f8fe06281ac97f0e540ec7 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 13 Nov 2024 03:24:56 -0500
Subject: [PATCH 154/404] fix: use strict equality for key block comparisons in
 runes mode (#14285)

fixes #14283
---
 .changeset/hot-frogs-melt.md                        |  5 +++++
 .../svelte/src/internal/client/dom/blocks/key.js    |  7 +++++--
 .../src/internal/client/reactivity/equality.js      |  9 +++++++++
 .../samples/key-unchanged-value/_config.js          | 13 +++++++++++++
 .../samples/key-unchanged-value/main.svelte         | 10 ++++++++++
 5 files changed, 42 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/hot-frogs-melt.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/key-unchanged-value/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/key-unchanged-value/main.svelte

diff --git a/.changeset/hot-frogs-melt.md b/.changeset/hot-frogs-melt.md
new file mode 100644
index 0000000000..95b3e0b4b4
--- /dev/null
+++ b/.changeset/hot-frogs-melt.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: use strict equality for key block comparisons in runes mode
diff --git a/packages/svelte/src/internal/client/dom/blocks/key.js b/packages/svelte/src/internal/client/dom/blocks/key.js
index 04b8ab403f..4a8b7b94fc 100644
--- a/packages/svelte/src/internal/client/dom/blocks/key.js
+++ b/packages/svelte/src/internal/client/dom/blocks/key.js
@@ -1,7 +1,8 @@
 /** @import { Effect, TemplateNode } from '#client' */
 import { UNINITIALIZED } from '../../../../constants.js';
 import { block, branch, pause_effect } from '../../reactivity/effects.js';
-import { safe_not_equal } from '../../reactivity/equality.js';
+import { not_equal, safe_not_equal } from '../../reactivity/equality.js';
+import { is_runes } from '../../runtime.js';
 import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
 
 /**
@@ -24,8 +25,10 @@ export function key_block(node, get_key, render_fn) {
 	/** @type {Effect} */
 	var effect;
 
+	var changed = is_runes() ? not_equal : safe_not_equal;
+
 	block(() => {
-		if (safe_not_equal(key, (key = get_key()))) {
+		if (changed(key, (key = get_key()))) {
 			if (effect) {
 				pause_effect(effect);
 			}
diff --git a/packages/svelte/src/internal/client/reactivity/equality.js b/packages/svelte/src/internal/client/reactivity/equality.js
index 751c8720f9..37a9994ab8 100644
--- a/packages/svelte/src/internal/client/reactivity/equality.js
+++ b/packages/svelte/src/internal/client/reactivity/equality.js
@@ -15,6 +15,15 @@ export function safe_not_equal(a, b) {
 		: a !== b || (a !== null && typeof a === 'object') || typeof a === 'function';
 }
 
+/**
+ * @param {unknown} a
+ * @param {unknown} b
+ * @returns {boolean}
+ */
+export function not_equal(a, b) {
+	return a !== b;
+}
+
 /** @type {Equals} */
 export function safe_equals(value) {
 	return !safe_not_equal(value, this.v);
diff --git a/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/_config.js b/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/_config.js
new file mode 100644
index 0000000000..0c56330a3e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		assert.deepEqual(logs, ['rendering']);
+
+		const btn = target.querySelector('button');
+		flushSync(() => btn?.click());
+
+		assert.deepEqual(logs, ['rendering']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/main.svelte b/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/main.svelte
new file mode 100644
index 0000000000..47ecd20c10
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/key-unchanged-value/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	let inner = Symbol();
+	let outer = $state({ inner });
+</script>
+
+<button onclick={() => outer = { inner }}>update</button>
+
+{#key outer.inner}
+	{console.log('rendering')}
+{/key}

From 45fa678242bec9809b9458a7e0102ceeacc369af Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 14 Nov 2024 11:24:02 +0100
Subject: [PATCH 155/404] fix: account for `:has(...)` as part of `:root`
 (#14229)

We previously marked all `:root` selectors as global-like, which excempted them from further analysis. This causes problems:
- things like `:not(...)` are never visited and therefore never marked as used -> we gotta do that directly when coming across this
- `:has(...)` was never visited, too. Just marking it as used is not enough though, because we might need to scope its contents

Therefore the logic is enhanced to account for these special cases. Fixes #14118

While fixing this I cleaned up some inconsistencies in what we mark as global. This simplified code and fixed some adjacent bugs, which conindicentally also fixes #14189
---
 .changeset/beige-files-pull.md                |   5 +
 .changeset/great-bulldogs-wonder.md           |   5 +
 .../phases/2-analyze/css/css-analyze.js       |  47 ++++----
 .../phases/2-analyze/css/css-prune.js         | 101 +++++++++---------
 .../compiler/phases/2-analyze/css/css-warn.js |   7 +-
 .../compiler/phases/2-analyze/css/utils.js    |  84 ++++++++++++++-
 .../compiler/phases/3-transform/css/index.js  |  14 +--
 packages/svelte/src/compiler/types/css.d.ts   |   4 +-
 .../svelte/tests/css/samples/has/_config.js   |  42 ++++++++
 .../svelte/tests/css/samples/has/expected.css |  19 +++-
 .../svelte/tests/css/samples/has/input.svelte |  15 +++
 .../svelte/tests/css/samples/is/_config.js    |  40 +++----
 .../svelte/tests/css/samples/is/expected.css  |  15 +++
 .../svelte/tests/css/samples/is/input.svelte  |  15 +++
 .../samples/not-selector-global/expected.css  |   9 ++
 .../samples/not-selector-global/input.svelte  |   9 ++
 .../svelte/tests/css/samples/root/_config.js  |  75 ++++++++++++-
 .../tests/css/samples/root/expected.css       |  47 +++++++-
 .../tests/css/samples/root/expected.html      |   2 +-
 .../tests/css/samples/root/input.svelte       |  46 +++++++-
 20 files changed, 484 insertions(+), 117 deletions(-)
 create mode 100644 .changeset/beige-files-pull.md
 create mode 100644 .changeset/great-bulldogs-wonder.md

diff --git a/.changeset/beige-files-pull.md b/.changeset/beige-files-pull.md
new file mode 100644
index 0000000000..2cd98a2819
--- /dev/null
+++ b/.changeset/beige-files-pull.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: account for `:has(...)` as part of `:root`
diff --git a/.changeset/great-bulldogs-wonder.md b/.changeset/great-bulldogs-wonder.md
new file mode 100644
index 0000000000..b6cafa4585
--- /dev/null
+++ b/.changeset/great-bulldogs-wonder.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent nested pseudo class from being marked as unused
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 ec36e1ce64..38551f328f 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
@@ -4,6 +4,7 @@
 import { walk } from 'zimmerframe';
 import * as e from '../../../errors.js';
 import { is_keyframes_node } from '../../css.js';
+import { is_global, is_unscoped_pseudo_class } from './utils.js';
 
 /**
  * @typedef {Visitors<
@@ -15,27 +16,6 @@ import { is_keyframes_node } from '../../css.js';
  * >} CssVisitors
  */
 
-/**
- * True if is `:global(...)` or `:global`
- * @param {Css.RelativeSelector} relative_selector
- * @returns {relative_selector is Css.RelativeSelector & { selectors: [Css.PseudoClassSelector, ...Array<Css.PseudoClassSelector | Css.PseudoElementSelector>] }}
- */
-function is_global(relative_selector) {
-	const first = relative_selector.selectors[0];
-
-	return (
-		first.type === 'PseudoClassSelector' &&
-		first.name === 'global' &&
-		(first.args === null ||
-			// Only these two selector types keep the whole selector global, because e.g.
-			// :global(button).x means that the selector is still scoped because of the .x
-			relative_selector.selectors.every(
-				(selector) =>
-					selector.type === 'PseudoClassSelector' || selector.type === 'PseudoElementSelector'
-			))
-	);
-}
-
 /**
  * True if is `:global`
  * @param {Css.SimpleSelector} simple_selector
@@ -119,11 +99,14 @@ const css_visitors = {
 			node.metadata.rule?.metadata.parent_rule &&
 			node.children[0]?.selectors[0]?.type === 'NestingSelector'
 		) {
+			const first = node.children[0]?.selectors[1];
+			const no_nesting_scope =
+				first?.type !== 'PseudoClassSelector' || is_unscoped_pseudo_class(first);
 			const parent_is_global = node.metadata.rule.metadata.parent_rule.prelude.children.some(
 				(child) => child.children.length === 1 && child.children[0].metadata.is_global
 			);
 			// mark `&:hover` in `:global(.foo) { &:hover { color: green }}` as used
-			if (parent_is_global) {
+			if (no_nesting_scope && parent_is_global) {
 				node.metadata.used = true;
 			}
 		}
@@ -156,9 +139,23 @@ const css_visitors = {
 					].includes(first.name));
 		}
 
-		node.metadata.is_global_like ||= !!node.selectors.find(
-			(child) => child.type === 'PseudoClassSelector' && child.name === 'root'
-		);
+		node.metadata.is_global_like ||=
+			node.selectors.some(
+				(child) => child.type === 'PseudoClassSelector' && child.name === 'root'
+			) &&
+			// :root.y:has(.x) is not a global selector because while .y is unscoped, .x inside `:has(...)` should be scoped
+			!node.selectors.some((child) => child.type === 'PseudoClassSelector' && child.name === 'has');
+
+		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, {
+					ComplexSelector(node) {
+						node.metadata.used = true;
+					}
+				});
+			}
+		}
 
 		context.next();
 	},
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 a9ea9fe913..bf0fd27566 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
@@ -1,7 +1,7 @@
 /** @import { Visitors } from 'zimmerframe' */
 /** @import * as Compiler from '#compiler' */
 import { walk } from 'zimmerframe';
-import { get_possible_values } from './utils.js';
+import { get_parent_rules, get_possible_values, is_outer_global } from './utils.js';
 import { regex_ends_with_whitespace, regex_starts_with_whitespace } from '../../patterns.js';
 import { get_attribute_chunks, is_text_attribute } from '../../../utils/ast.js';
 
@@ -172,7 +172,7 @@ function get_relative_selectors(node) {
 }
 
 /**
- * Discard trailing `:global(...)` selectors without a `:has/is/where/not(...)` modifier, these are unused for scoping purposes
+ * Discard trailing `:global(...)` selectors, these are unused for scoping purposes
  * @param {Compiler.Css.ComplexSelector} node
  */
 function truncate(node) {
@@ -182,21 +182,22 @@ function truncate(node) {
 			// not after a :global selector
 			!metadata.is_global_like &&
 			!(first.type === 'PseudoClassSelector' && first.name === 'global' && first.args === null) &&
-			// not a :global(...) without a :has/is/where/not(...) modifier
-			(!metadata.is_global ||
-				selectors.some(
-					(selector) =>
-						selector.type === 'PseudoClassSelector' &&
-						selector.args !== null &&
-						(selector.name === 'has' ||
-							selector.name === 'is' ||
-							selector.name === 'where' ||
-							selector.name === 'not')
-				))
+			// not a :global(...) without a :has/is/where(...) modifier that is scoped
+			!metadata.is_global
 		);
 	});
 
-	return node.children.slice(0, i + 1);
+	return node.children.slice(0, i + 1).map((child) => {
+		// In case of `:root.y:has(...)`, `y` is unscoped, but everything in `:has(...)` should be scoped (if not global).
+		// To properly accomplish that, we gotta filter out all selector types except `:has`.
+		const root = child.selectors.find((s) => s.type === 'PseudoClassSelector' && s.name === 'root');
+		if (!root || child.metadata.is_global_like) return child;
+
+		return {
+			...child,
+			selectors: child.selectors.filter((s) => s.type === 'PseudoClassSelector' && s.name === 'has')
+		};
+	});
 }
 
 /**
@@ -334,7 +335,9 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  */
 function mark(relative_selector, element) {
-	relative_selector.metadata.scoped = true;
+	if (!is_outer_global(relative_selector)) {
+		relative_selector.metadata.scoped = true;
+	}
 	element.metadata.scoped = true;
 }
 
@@ -415,6 +418,21 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 		/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
 		let sibling_elements; // do them lazy because it's rarely used and expensive to calculate
 
+		// If this is a :has inside a global selector, we gotta include the element itself, too,
+		// because the global selector might be for an element that's outside the component (e.g. :root).
+		const rules = [rule, ...get_parent_rules(rule)];
+		const include_self =
+			rules.some((r) => r.prelude.children.some((c) => c.children.some((s) => is_global(s, r)))) ||
+			rules[rules.length - 1].prelude.children.some((c) =>
+				c.children.some((r) =>
+					r.selectors.some((s) => s.type === 'PseudoClassSelector' && s.name === 'root')
+				)
+			);
+		if (include_self) {
+			child_elements.push(element);
+			descendant_elements.push(element);
+		}
+
 		walk(
 			/** @type {Compiler.SvelteNode} */ (element.fragment),
 			{ is_child: true },
@@ -460,7 +478,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 
 				const descendants =
 					left_most_combinator.name === '+' || left_most_combinator.name === '~'
-						? (sibling_elements ??= get_following_sibling_elements(element))
+						? (sibling_elements ??= get_following_sibling_elements(element, include_self))
 						: left_most_combinator.name === '>'
 							? child_elements
 							: descendant_elements;
@@ -481,20 +499,6 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 			}
 
 			if (!matched) {
-				if (relative_selector.metadata.is_global && !relative_selector.metadata.is_global_like) {
-					// Edge case: `:global(.x):has(.y)` where `.x` is global but `.y` doesn't match.
-					// Since `used` is set to `true` for `:global(.x)` in css-analyze beforehand, and
-					// we have no way of knowing if it's safe to set it back to `false`, we'll mark
-					// the inner selector as used and scoped to prevent it from being pruned, which could
-					// result in a invalid CSS output (e.g. `.x:has(/* unused .y */)`). The result
-					// can't match a real element, so the only drawback is the missing prune.
-					// TODO clean this up some day
-					complex_selectors[0].metadata.used = true;
-					complex_selectors[0].children.forEach((selector) => {
-						selector.metadata.scoped = true;
-					});
-				}
-
 				return false;
 			}
 		}
@@ -507,9 +511,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 
 		switch (selector.type) {
 			case 'PseudoClassSelector': {
-				if (name === 'host' || name === 'root') {
-					return false;
-				}
+				if (name === 'host' || name === 'root') return false;
 
 				if (
 					name === 'global' &&
@@ -578,23 +580,6 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 					}
 
 					if (!matched) {
-						if (
-							relative_selector.metadata.is_global &&
-							!relative_selector.metadata.is_global_like
-						) {
-							// Edge case: `:global(.x):is(.y)` where `.x` is global but `.y` doesn't match.
-							// Since `used` is set to `true` for `:global(.x)` in css-analyze beforehand, and
-							// we have no way of knowing if it's safe to set it back to `false`, we'll mark
-							// the inner selector as used and scoped to prevent it from being pruned, which could
-							// result in a invalid CSS output (e.g. `.x:is(/* unused .y */)`). The result
-							// can't match a real element, so the only drawback is the missing prune.
-							// TODO clean this up some day
-							selector.args.children[0].metadata.used = true;
-							selector.args.children[0].children.forEach((selector) => {
-								selector.metadata.scoped = true;
-							});
-						}
-
 						return false;
 					}
 				}
@@ -662,7 +647,10 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				const parent = /** @type {Compiler.Css.Rule} */ (rule.metadata.parent_rule);
 
 				for (const complex_selector of parent.prelude.children) {
-					if (apply_selector(get_relative_selectors(complex_selector), parent, element, state)) {
+					if (
+						apply_selector(get_relative_selectors(complex_selector), parent, element, state) ||
+						complex_selector.children.every((s) => is_global(s, parent))
+					) {
 						complex_selector.metadata.used = true;
 						matched = true;
 					}
@@ -681,8 +669,11 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 	return true;
 }
 
-/** @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element */
-function get_following_sibling_elements(element) {
+/**
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
+ * @param {boolean} include_self
+ */
+function get_following_sibling_elements(element, include_self) {
 	/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.Root | null} */
 	let parent = get_element_parent(element);
 
@@ -723,6 +714,10 @@ function get_following_sibling_elements(element) {
 		}
 	}
 
+	if (include_self) {
+		sibling_elements.push(element);
+	}
+
 	return sibling_elements;
 }
 
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 482278b795..eab67327e2 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
@@ -24,7 +24,12 @@ const visitors = {
 		}
 	},
 	ComplexSelector(node, context) {
-		if (!node.metadata.used) {
+		if (
+			!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)
+		) {
 			const content = context.state.stylesheet.content;
 			const text = content.styles.substring(node.start - content.start, node.end - content.start);
 			w.css_unused_selector(node, text);
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 99603fad29..0226a150c9 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 } from '#compiler' */
+/** @import { AST, Css } from '#compiler' */
 /** @import { Node } from 'estree' */
 const UNKNOWN = {};
 
@@ -33,3 +33,85 @@ export function get_possible_values(chunk) {
 	if (values.has(UNKNOWN)) return null;
 	return values;
 }
+
+/**
+ * Returns all parent rules; root is last
+ * @param {Css.Rule | null} rule
+ */
+export function get_parent_rules(rule) {
+	const parents = [];
+
+	let parent = rule?.metadata.parent_rule;
+	while (parent) {
+		parents.push(parent);
+		parent = parent.metadata.parent_rule;
+	}
+
+	return parents;
+}
+
+/**
+ * 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>] }}
+ */
+export function is_global(relative_selector) {
+	const first = relative_selector.selectors[0];
+
+	return (
+		first.type === 'PseudoClassSelector' &&
+		first.name === 'global' &&
+		(first.args === null ||
+			// Only these two selector types keep the whole selector global, because e.g.
+			// :global(button).x means that the selector is still scoped because of the .x
+			relative_selector.selectors.every(
+				(selector) =>
+					is_unscoped_pseudo_class(selector) || selector.type === 'PseudoElementSelector'
+			))
+	);
+}
+
+/**
+ * `true` if is a pseudo class that cannot be or is not scoped
+ * @param {Css.SimpleSelector} selector
+ */
+export function is_unscoped_pseudo_class(selector) {
+	return (
+		selector.type === 'PseudoClassSelector' &&
+		// These make the selector scoped
+		((selector.name !== 'has' &&
+			selector.name !== 'is' &&
+			selector.name !== 'where' &&
+			// Not is special because we want to scope as specific as possible, but because :not
+			// inverses the result, we want to leave the unscoped, too. The exception is more than
+			// one selector in the :not (.e.g :not(.x .y)), then .x and .y should be scoped
+			(selector.name !== 'not' ||
+				selector.args === null ||
+				selector.args.children.every((c) => c.children.length === 1))) ||
+			// selectors with has/is/where/not can also be global if all their children are global
+			selector.args === null ||
+			selector.args.children.every((c) => c.children.every((r) => is_global(r))))
+	);
+}
+
+/**
+ * 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>] }}
+ */
+export function is_outer_global(relative_selector) {
+	const first = relative_selector.selectors[0];
+
+	return (
+		first.type === 'PseudoClassSelector' &&
+		first.name === 'global' &&
+		(first.args === null ||
+			// Only these two selector types can keep the whole selector global, because e.g.
+			// :global(button).x means that the selector is still scoped because of the .x
+			relative_selector.selectors.every(
+				(selector) =>
+					selector.type === 'PseudoClassSelector' || selector.type === 'PseudoElementSelector'
+			))
+	);
+}
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 350eca35d8..d1f3d3baa6 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -292,6 +292,13 @@ const visitors = {
 					context.state.code.prependRight(global.start, '&');
 				}
 				continue;
+			} else {
+				// for any :global() or :global at the middle of compound selector
+				for (const selector of relative_selector.selectors) {
+					if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
+						remove_global_pseudo_class(selector, null, context.state);
+					}
+				}
 			}
 
 			if (relative_selector.metadata.scoped) {
@@ -306,13 +313,6 @@ const visitors = {
 					}
 				}
 
-				// for any :global() or :global at the middle of compound selector
-				for (const selector of relative_selector.selectors) {
-					if (selector.type === 'PseudoClassSelector' && selector.name === 'global') {
-						remove_global_pseudo_class(selector, null, context.state);
-					}
-				}
-
 				if (relative_selector.selectors.some((s) => s.type === 'NestingSelector')) {
 					continue;
 				}
diff --git a/packages/svelte/src/compiler/types/css.d.ts b/packages/svelte/src/compiler/types/css.d.ts
index 97ac7fc0d3..ba4079ecd0 100644
--- a/packages/svelte/src/compiler/types/css.d.ts
+++ b/packages/svelte/src/compiler/types/css.d.ts
@@ -87,8 +87,8 @@ export namespace Css {
 			/**
 			 * `true` if the whole selector is unscoped, e.g. `:global(...)` or `:global` or `:global.x`.
 			 * Selectors like `:global(...).x` are not considered global, because they still need scoping.
-			 * Selectors like `:global(...):is/where/not/has(...)` are considered global even if they aren't
-			 * strictly speaking (we should consolidate the logic around this at some point).
+			 * Selectors like `:global(...):is/where/not/has(...)` are only considered global if all their
+			 * children are global.
 			 */
 			is_global: boolean;
 			/** `:root`, `:host`, `::view-transition`, or selectors after a `:global` */
diff --git a/packages/svelte/tests/css/samples/has/_config.js b/packages/svelte/tests/css/samples/has/_config.js
index 8b8e7760f5..e5dc5f3459 100644
--- a/packages/svelte/tests/css/samples/has/_config.js
+++ b/packages/svelte/tests/css/samples/has/_config.js
@@ -44,6 +44,20 @@ export default test({
 				character: 401
 			}
 		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":global(.foo):has(.unused)"',
+			start: {
+				line: 40,
+				column: 1,
+				character: 422
+			},
+			end: {
+				line: 40,
+				column: 27,
+				character: 448
+			}
+		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "x:has(y):has(.unused)"',
@@ -141,6 +155,34 @@ export default test({
 				column: 11,
 				character: 1336
 			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":has(.unused)"',
+			start: {
+				line: 129,
+				column: 2,
+				character: 1409
+			},
+			end: {
+				line: 129,
+				column: 15,
+				character: 1422
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "&:has(.unused)"',
+			start: {
+				line: 135,
+				column: 2,
+				character: 1480
+			},
+			end: {
+				line: 135,
+				column: 16,
+				character: 1494
+			}
 		}
 	]
 });
diff --git a/packages/svelte/tests/css/samples/has/expected.css b/packages/svelte/tests/css/samples/has/expected.css
index 4cb8d76bf6..8eda676f93 100644
--- a/packages/svelte/tests/css/samples/has/expected.css
+++ b/packages/svelte/tests/css/samples/has/expected.css
@@ -27,9 +27,9 @@
 	/* (unused) x:has(.unused) {
 		color: red;
 	}*/
-	.foo:has(.unused.svelte-xyz) {
+	/* (unused) :global(.foo):has(.unused) {
 		color: red;
-	}
+	}*/
 
 	x.svelte-xyz:has(y:where(.svelte-xyz) /* (unused) .unused*/) {
 		color: green;
@@ -111,3 +111,18 @@
 	/* (unused) x:has(~ y) {
 		color: red;
 	}*/
+
+	.foo {
+		.svelte-xyz:has(x:where(.svelte-xyz)) {
+			color: green;
+		}
+		/* (unused) :has(.unused) {
+			color: red;
+		}*/
+		&:has(x.svelte-xyz) {
+			color: green;
+		}
+		/* (unused) &:has(.unused) {
+			color: red;
+		}*/
+	}
diff --git a/packages/svelte/tests/css/samples/has/input.svelte b/packages/svelte/tests/css/samples/has/input.svelte
index 8eb6296f05..3487b64e8c 100644
--- a/packages/svelte/tests/css/samples/has/input.svelte
+++ b/packages/svelte/tests/css/samples/has/input.svelte
@@ -121,4 +121,19 @@
 	x:has(~ y) {
 		color: red;
 	}
+
+	:global(.foo) {
+		:has(x) {
+			color: green;
+		}
+		:has(.unused) {
+			color: red;
+		}
+		&:has(x) {
+			color: green;
+		}
+		&:has(.unused) {
+			color: red;
+		}
+	}
 </style>
diff --git a/packages/svelte/tests/css/samples/is/_config.js b/packages/svelte/tests/css/samples/is/_config.js
index e4c24eb756..eee617e7e4 100644
--- a/packages/svelte/tests/css/samples/is/_config.js
+++ b/packages/svelte/tests/css/samples/is/_config.js
@@ -30,20 +30,6 @@ export default test({
 				character: 125
 			}
 		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".unused"',
-			start: {
-				line: 14,
-				column: 7,
-				character: 117
-			},
-			end: {
-				line: 14,
-				column: 14,
-				character: 124
-			}
-		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ":global(.foo) :is(.unused)"',
@@ -60,16 +46,30 @@ export default test({
 		},
 		{
 			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".unused"',
+			message: 'Unused CSS selector ":global(.foo):is(.unused)"',
 			start: {
-				line: 28,
-				column: 19,
-				character: 292
+				line: 34,
+				column: 1,
+				character: 363
 			},
 			end: {
-				line: 28,
+				line: 34,
 				column: 26,
-				character: 299
+				character: 388
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":is(.unused)"',
+			start: {
+				line: 52,
+				column: 2,
+				character: 636
+			},
+			end: {
+				line: 52,
+				column: 14,
+				character: 648
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/is/expected.css b/packages/svelte/tests/css/samples/is/expected.css
index be8deeff28..639f0d5392 100644
--- a/packages/svelte/tests/css/samples/is/expected.css
+++ b/packages/svelte/tests/css/samples/is/expected.css
@@ -22,6 +22,12 @@
 	/* (unused) :global(.foo) :is(.unused) {
 		color: red;
 	}*/
+	.foo:is(x.svelte-xyz) {
+		color: green;
+	}
+	/* (unused) :global(.foo):is(.unused) {
+		color: red;
+	}*/
 
 	x.svelte-xyz :is(html *) {
 		color: green;
@@ -32,3 +38,12 @@
 	y.svelte-xyz :is(x:where(.svelte-xyz) :where(.svelte-xyz)) {
 		color: green; /* matches z */
 	}
+
+	.foo {
+		:is(x.svelte-xyz) {
+			color: green;
+		}
+		/* (unused) :is(.unused) {
+			color: red;
+		}*/
+	}
diff --git a/packages/svelte/tests/css/samples/is/input.svelte b/packages/svelte/tests/css/samples/is/input.svelte
index 06aa0669b9..b5ae663087 100644
--- a/packages/svelte/tests/css/samples/is/input.svelte
+++ b/packages/svelte/tests/css/samples/is/input.svelte
@@ -28,6 +28,12 @@
 	:global(.foo) :is(.unused) {
 		color: red;
 	}
+	:global(.foo):is(x) {
+		color: green;
+	}
+	:global(.foo):is(.unused) {
+		color: red;
+	}
 
 	x :is(:global(html *)) {
 		color: green;
@@ -38,4 +44,13 @@
 	y :is(x *) {
 		color: green; /* matches z */
 	}
+
+	:global(.foo) {
+		:is(x) {
+			color: green;
+		}
+		:is(.unused) {
+			color: red;
+		}
+	}
 </style>
diff --git a/packages/svelte/tests/css/samples/not-selector-global/expected.css b/packages/svelte/tests/css/samples/not-selector-global/expected.css
index ea9ff39486..b815dcf9aa 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/expected.css
+++ b/packages/svelte/tests/css/samples/not-selector-global/expected.css
@@ -27,3 +27,12 @@
 	span:not(p span) {
 		color: green;
 	}
+
+	.x {
+		.svelte-xyz:not(.foo) {
+			color: green;
+		}
+		&:not(.foo) {
+			color: green;
+		}
+	}
diff --git a/packages/svelte/tests/css/samples/not-selector-global/input.svelte b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
index 1f0e6cd6db..1d2f7a9bca 100644
--- a/packages/svelte/tests/css/samples/not-selector-global/input.svelte
+++ b/packages/svelte/tests/css/samples/not-selector-global/input.svelte
@@ -34,4 +34,13 @@
 	:global(span:not(p span)) {
 		color: green;
 	}
+
+	:global(.x) {
+		:not(.foo) {
+			color: green;
+		}
+		&:not(.foo) {
+			color: green;
+		}
+	}
 </style>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/root/_config.js b/packages/svelte/tests/css/samples/root/_config.js
index f47bee71df..fad7fc536d 100644
--- a/packages/svelte/tests/css/samples/root/_config.js
+++ b/packages/svelte/tests/css/samples/root/_config.js
@@ -1,3 +1,76 @@
 import { test } from '../../test';
 
-export default test({});
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":root .unused"',
+			start: {
+				line: 18,
+				column: 2,
+				character: 190
+			},
+			end: {
+				line: 18,
+				column: 15,
+				character: 203
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":root:has(.unused)"',
+			start: {
+				line: 25,
+				column: 2,
+				character: 269
+			},
+			end: {
+				line: 25,
+				column: 20,
+				character: 287
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ".unused"',
+			start: {
+				line: 37,
+				column: 4,
+				character: 401
+			},
+			end: {
+				line: 37,
+				column: 11,
+				character: 408
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ":has(.unused)"',
+			start: {
+				line: 43,
+				column: 4,
+				character: 480
+			},
+			end: {
+				line: 43,
+				column: 17,
+				character: 493
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "&:has(.unused)"',
+			start: {
+				line: 49,
+				column: 4,
+				character: 566
+			},
+			end: {
+				line: 49,
+				column: 18,
+				character: 580
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/root/expected.css b/packages/svelte/tests/css/samples/root/expected.css
index a107696250..b4c82c258e 100644
--- a/packages/svelte/tests/css/samples/root/expected.css
+++ b/packages/svelte/tests/css/samples/root/expected.css
@@ -1,9 +1,52 @@
+
   :root {
-    color: red;
+    color: green;
   }
   .foo:root {
-    color: blue;
+    color: green;
   }
   :root.foo {
     color: green;
   }
+  :root.unknown {
+    color: green;
+  }
+
+  :root h1.svelte-xyz {
+    color: green;
+  }
+  /* (unused) :root .unused {
+    color: red;
+  }*/
+
+  :root:has(h1:where(.svelte-xyz)) {
+    color: green;
+  }
+  /* (unused) :root:has(.unused) {
+    color: red;
+  }*/
+
+  :root:not(.x) {
+    color: green;
+  }
+
+  :root {
+    h1.svelte-xyz {
+      color: green;
+    }
+    /* (unused) .unused {
+      color: red;
+    }*/
+    .svelte-xyz:has(h1:where(.svelte-xyz)) {
+      color: green;
+    }
+    /* (unused) :has(.unused) {
+      color: red;
+    }*/
+    &:has(h1.svelte-xyz) {
+      color: green;
+    }
+    /* (unused) &:has(.unused) {
+      color: red;
+    }*/
+  }
diff --git a/packages/svelte/tests/css/samples/root/expected.html b/packages/svelte/tests/css/samples/root/expected.html
index 1d90ab5df7..5c30de1c29 100644
--- a/packages/svelte/tests/css/samples/root/expected.html
+++ b/packages/svelte/tests/css/samples/root/expected.html
@@ -1 +1 @@
-<h1>Hello!</h1>
\ No newline at end of file
+<h1 class="svelte-xyz">Hello!</h1>
\ No newline at end of file
diff --git a/packages/svelte/tests/css/samples/root/input.svelte b/packages/svelte/tests/css/samples/root/input.svelte
index 979c9d4f0a..e06a1a36fa 100644
--- a/packages/svelte/tests/css/samples/root/input.svelte
+++ b/packages/svelte/tests/css/samples/root/input.svelte
@@ -1,13 +1,55 @@
 <style>
   :root {
-    color: red;
+    color: green;
   }
   .foo:root {
-    color: blue;
+    color: green;
   }
   :root.foo {
     color: green;
   }
+  :root.unknown {
+    color: green;
+  }
+
+  :root h1 {
+    color: green;
+  }
+  :root .unused {
+    color: red;
+  }
+
+  :root:has(h1) {
+    color: green;
+  }
+  :root:has(.unused) {
+    color: red;
+  }
+
+  :root:not(.x) {
+    color: green;
+  }
+
+  :root {
+    h1 {
+      color: green;
+    }
+    .unused {
+      color: red;
+    }
+    :has(h1) {
+      color: green;
+    }
+    :has(.unused) {
+      color: red;
+    }
+    &:has(h1) {
+      color: green;
+    }
+    &:has(.unused) {
+      color: red;
+    }
+  }
 </style>
 
 <h1>Hello!</h1>

From 320ebd24d8857570b0c180752765fb1580590367 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 14 Nov 2024 12:54:27 +0100
Subject: [PATCH 156/404] fix: bump `is-reference` dependency to fix
 `import.meta` bug (#14286)

closes #14234
---
 .changeset/shaggy-flowers-kneel.md            |  5 ++++
 packages/svelte/package.json                  |  2 +-
 packages/svelte/src/compiler/migrate/index.js |  3 ++
 .../src/compiler/phases/2-analyze/index.js    |  4 +++
 .../visitors/ExportNamedDeclaration.js        |  2 ++
 .../2-analyze/visitors/ExportSpecifier.js     | 15 +++++++---
 .../2-analyze/visitors/ImportDeclaration.js   |  5 ++--
 packages/svelte/src/compiler/utils/ast.js     | 11 +++++--
 .../svelte/src/compiler/utils/builders.js     |  5 ++--
 pnpm-lock.yaml                                | 29 +++++++++++--------
 10 files changed, 57 insertions(+), 24 deletions(-)
 create mode 100644 .changeset/shaggy-flowers-kneel.md

diff --git a/.changeset/shaggy-flowers-kneel.md b/.changeset/shaggy-flowers-kneel.md
new file mode 100644
index 0000000000..fb0a041fbc
--- /dev/null
+++ b/.changeset/shaggy-flowers-kneel.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: bump `is-reference` dependency to fix `import.meta` bug
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 760272680e..608c8d466d 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -144,7 +144,7 @@
     "axobject-query": "^4.1.0",
     "esm-env": "^1.0.0",
     "esrap": "^1.2.2",
-    "is-reference": "^3.0.2",
+    "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
     "magic-string": "^0.30.11",
     "zimmerframe": "^1.1.2"
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 9db09158a1..88f9bbf0ee 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -507,6 +507,7 @@ const instance_script = {
 			for (let specifier of node.specifiers) {
 				if (
 					specifier.type === 'ImportSpecifier' &&
+					specifier.imported.type === 'Identifier' &&
 					['beforeUpdate', 'afterUpdate'].includes(specifier.imported.name)
 				) {
 					const references = state.scope.references.get(specifier.local.name);
@@ -544,6 +545,8 @@ const instance_script = {
 
 		let count_removed = 0;
 		for (const specifier of node.specifiers) {
+			if (specifier.local.type !== 'Identifier') continue;
+
 			const binding = state.scope.get(specifier.local.name);
 			if (binding?.kind === 'bindable_prop') {
 				state.str.remove(
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 9e4f72a66d..a96652d60b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -474,6 +474,10 @@ export function analyze_component(root, source, options) {
 				}
 			} else {
 				for (const specifier of node.specifiers) {
+					if (specifier.local.type !== 'Identifier' || specifier.exported.type !== 'Identifier') {
+						continue;
+					}
+
 					const binding = instance.scope.get(specifier.local.name);
 
 					if (
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
index a9e8a05c96..784d2fdd88 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
@@ -60,6 +60,8 @@ export function ExportNamedDeclaration(node, context) {
 
 		if (!context.state.ast_type /* .svelte.js module */ || context.state.ast_type === 'module') {
 			for (const specified of node.specifiers) {
+				if (specified.local.type !== 'Identifier') continue;
+
 				const binding = context.state.scope.get(specified.local.name);
 
 				if (!binding) continue;
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
index 27eb39acbf..d0d1ccf932 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
@@ -9,18 +9,25 @@ import * as e from '../../../errors.js';
  * @param {Context} context
  */
 export function ExportSpecifier(node, context) {
+	const local_name =
+		node.local.type === 'Identifier' ? node.local.name : /** @type {string} */ (node.local.value);
+	const exported_name =
+		node.exported.type === 'Identifier'
+			? node.exported.name
+			: /** @type {string} */ (node.exported.value);
+
 	if (context.state.ast_type === 'instance') {
 		if (context.state.analysis.runes) {
 			context.state.analysis.exports.push({
-				name: node.local.name,
-				alias: node.exported.name
+				name: local_name,
+				alias: exported_name
 			});
 
-			const binding = context.state.scope.get(node.local.name);
+			const binding = context.state.scope.get(local_name);
 			if (binding) binding.reassigned = binding.updated = true;
 		}
 	} else {
-		validate_export(node, context.state.scope, node.local.name);
+		validate_export(node, context.state.scope, local_name);
 	}
 }
 
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ImportDeclaration.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ImportDeclaration.js
index eb57fee264..d46218ac64 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ImportDeclaration.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ImportDeclaration.js
@@ -18,8 +18,9 @@ export function ImportDeclaration(node, context) {
 			for (const specifier of node.specifiers) {
 				if (specifier.type === 'ImportSpecifier') {
 					if (
-						specifier.imported.name === 'beforeUpdate' ||
-						specifier.imported.name === 'afterUpdate'
+						specifier.imported.type === 'Identifier' &&
+						(specifier.imported.name === 'beforeUpdate' ||
+							specifier.imported.name === 'afterUpdate')
 					) {
 						e.runes_mode_invalid_import(specifier, specifier.imported.name);
 					}
diff --git a/packages/svelte/src/compiler/utils/ast.js b/packages/svelte/src/compiler/utils/ast.js
index 9aff7546be..cc8339f16b 100644
--- a/packages/svelte/src/compiler/utils/ast.js
+++ b/packages/svelte/src/compiler/utils/ast.js
@@ -433,7 +433,11 @@ export function is_simple_expression(node) {
 	}
 
 	if (node.type === 'BinaryExpression' || node.type === 'LogicalExpression') {
-		return is_simple_expression(node.left) && is_simple_expression(node.right);
+		return (
+			node.left.type !== 'PrivateIdentifier' &&
+			is_simple_expression(node.left) &&
+			is_simple_expression(node.right)
+		);
 	}
 
 	return false;
@@ -475,7 +479,10 @@ export function is_expression_async(expression) {
 		case 'AssignmentExpression':
 		case 'BinaryExpression':
 		case 'LogicalExpression': {
-			return is_expression_async(expression.left) || is_expression_async(expression.right);
+			return (
+				(expression.left.type !== 'PrivateIdentifier' && is_expression_async(expression.left)) ||
+				is_expression_async(expression.right)
+			);
 		}
 		case 'CallExpression':
 		case 'NewExpression': {
diff --git a/packages/svelte/src/compiler/utils/builders.js b/packages/svelte/src/compiler/utils/builders.js
index fc1cdf4adb..ecb595d74d 100644
--- a/packages/svelte/src/compiler/utils/builders.js
+++ b/packages/svelte/src/compiler/utils/builders.js
@@ -350,7 +350,7 @@ export function prop(kind, key, value, computed = false) {
  * @returns {ESTree.PropertyDefinition}
  */
 export function prop_def(key, value, computed = false, is_static = false) {
-	return { type: 'PropertyDefinition', key, value, computed, static: is_static, decorators: [] };
+	return { type: 'PropertyDefinition', key, value, computed, static: is_static };
 }
 
 /**
@@ -551,8 +551,7 @@ export function method(kind, key, params, body, computed = false, is_static = fa
 		kind,
 		value: function_builder(null, params, block(body)),
 		computed,
-		static: is_static,
-		decorators: []
+		static: is_static
 	};
 }
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1f33a207fc..83e4522b2f 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -67,7 +67,7 @@ importers:
         version: 1.5.0
       '@types/estree':
         specifier: ^1.0.5
-        version: 1.0.5
+        version: 1.0.6
       acorn:
         specifier: ^8.12.1
         version: 8.12.1
@@ -87,8 +87,8 @@ importers:
         specifier: ^1.2.2
         version: 1.2.2
       is-reference:
-        specifier: ^3.0.2
-        version: 3.0.2
+        specifier: ^3.0.3
+        version: 3.0.3
       locate-character:
         specifier: ^3.0.0
         version: 3.0.0
@@ -916,6 +916,9 @@ packages:
   '@types/estree@1.0.5':
     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 
+  '@types/estree@1.0.6':
+    resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
+
   '@types/json-schema@7.0.15':
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
 
@@ -1775,8 +1778,8 @@ packages:
   is-reference@1.2.1:
     resolution: {integrity: sha512-U82MsXXiFIrjCK4otLT+o2NA2Cd2g5MLoOVXUZjIOhLurrRxpEXzI8O0KZHr3IjLvlAH1kTPYSuqer5T9ZVBKQ==}
 
-  is-reference@3.0.2:
-    resolution: {integrity: sha512-v3rht/LgVcsdZa3O2Nqs+NMowLOxeOm7Ay9+/ARQ2F+qEoANRcqrjAZKGN0v8ymUetZGgkp26LTnGT7H0Qo9Pg==}
+  is-reference@3.0.3:
+    resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==}
 
   is-stream@3.0.0:
     resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
@@ -3468,7 +3471,7 @@ snapshots:
 
   '@rollup/pluginutils@5.1.0(rollup@4.22.4)':
     dependencies:
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
       estree-walker: 2.0.2
       picomatch: 2.3.1
     optionalDependencies:
@@ -3611,11 +3614,13 @@ snapshots:
 
   '@types/eslint@8.56.12':
     dependencies:
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
       '@types/json-schema': 7.0.15
 
   '@types/estree@1.0.5': {}
 
+  '@types/estree@1.0.6': {}
+
   '@types/json-schema@7.0.15': {}
 
   '@types/node@12.20.55': {}
@@ -4243,7 +4248,7 @@ snapshots:
   esrap@1.2.2:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
 
   esrecurse@4.3.0:
     dependencies:
@@ -4255,7 +4260,7 @@ snapshots:
 
   estree-walker@3.0.3:
     dependencies:
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
 
   esutils@2.0.3: {}
 
@@ -4556,11 +4561,11 @@ snapshots:
 
   is-reference@1.2.1:
     dependencies:
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
 
-  is-reference@3.0.2:
+  is-reference@3.0.3:
     dependencies:
-      '@types/estree': 1.0.5
+      '@types/estree': 1.0.6
 
   is-stream@3.0.0: {}
 

From 6a7146bee7b98d4745b8d13fb5a7d0c3c4720a34 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 14 Nov 2024 12:47:14 -0500
Subject: [PATCH 157/404] Version Packages (#14287)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/beige-files-pull.md      |  5 -----
 .changeset/great-bulldogs-wonder.md |  5 -----
 .changeset/hot-frogs-melt.md        |  5 -----
 .changeset/shaggy-flowers-kneel.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/beige-files-pull.md
 delete mode 100644 .changeset/great-bulldogs-wonder.md
 delete mode 100644 .changeset/hot-frogs-melt.md
 delete mode 100644 .changeset/shaggy-flowers-kneel.md

diff --git a/.changeset/beige-files-pull.md b/.changeset/beige-files-pull.md
deleted file mode 100644
index 2cd98a2819..0000000000
--- a/.changeset/beige-files-pull.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: account for `:has(...)` as part of `:root`
diff --git a/.changeset/great-bulldogs-wonder.md b/.changeset/great-bulldogs-wonder.md
deleted file mode 100644
index b6cafa4585..0000000000
--- a/.changeset/great-bulldogs-wonder.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent nested pseudo class from being marked as unused
diff --git a/.changeset/hot-frogs-melt.md b/.changeset/hot-frogs-melt.md
deleted file mode 100644
index 95b3e0b4b4..0000000000
--- a/.changeset/hot-frogs-melt.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: use strict equality for key block comparisons in runes mode
diff --git a/.changeset/shaggy-flowers-kneel.md b/.changeset/shaggy-flowers-kneel.md
deleted file mode 100644
index fb0a041fbc..0000000000
--- a/.changeset/shaggy-flowers-kneel.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: bump `is-reference` dependency to fix `import.meta` bug
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 879fdb2058..8040c4ecab 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.1.17
+
+### Patch Changes
+
+- fix: account for `:has(...)` as part of `:root` ([#14229](https://github.com/sveltejs/svelte/pull/14229))
+
+- fix: prevent nested pseudo class from being marked as unused ([#14229](https://github.com/sveltejs/svelte/pull/14229))
+
+- fix: use strict equality for key block comparisons in runes mode ([#14285](https://github.com/sveltejs/svelte/pull/14285))
+
+- fix: bump `is-reference` dependency to fix `import.meta` bug ([#14286](https://github.com/sveltejs/svelte/pull/14286))
+
 ## 5.1.16
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 608c8d466d..ffe19223c2 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.1.16",
+  "version": "5.1.17",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c6802cecf0..7c0d0680ea 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.1.16';
+export const VERSION = '5.1.17';
 export const PUBLIC_VERSION = '5';

From 8a8e6f70e8955cb3d7aa256710a0ac35ae27f18d Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Thu, 14 Nov 2024 18:48:11 +0100
Subject: [PATCH 158/404] fix: avoid marking subtree as dynamic for inlined
 attributes (#14269)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: avoid marking subtree as dynamic for inlined attributes

* fix: i'm a silly goose 🪿

* chore: refactor `is_inlinable_expression` to accept the attribute

* feat: inline dom expression too

* fix: special case literals with `"` in it and fix standalone case

* chore: simpler check first

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>

* typo

* add more stuff to snapshot test

* simplify/speedup by doing the work once, during analysis

* simplify

* simplify - no reason these cases should prevent inlining

* return template

* name is incorrect

* name is incorrect

* fix escaping

* no longer necessary

* remove obsolete description

* better concatenation

* fix test

* do the work at runtime

* fix another thing

* tidy

* tidy up

* simplify

* simplify

* fix

* note to self

* another

* simplify

* more accurate name

* simplify

* simplify

* explain what is happening

* tidy up

* simplify

* better inlining

* update test

* colocate some code

* better inlining

* use attribute metadata

* Update packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>

* Apply suggestions from code review

---------

Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/spotty-sheep-fetch.md              |   5 +
 .../phases/2-analyze/visitors/Attribute.js    |  14 +-
 .../2-analyze/visitors/CallExpression.js      |   1 +
 .../2-analyze/visitors/ExpressionTag.js       |   5 -
 .../phases/2-analyze/visitors/Identifier.js   |  22 +++-
 .../2-analyze/visitors/MemberExpression.js    |   1 +
 .../visitors/TaggedTemplateExpression.js      |   1 +
 .../phases/3-transform/client/utils.js        |  52 +-------
 .../3-transform/client/visitors/Fragment.js   |  38 ++++--
 .../client/visitors/RegularElement.js         | 106 +++++++++------
 .../client/visitors/TitleElement.js           |   4 +-
 .../client/visitors/shared/element.js         |   4 +-
 .../client/visitors/shared/fragment.js        |  74 ++++++++---
 .../client/visitors/shared/utils.js           | 124 +++++++++---------
 packages/svelte/src/compiler/phases/nodes.js  |   3 +-
 packages/svelte/src/compiler/types/index.d.ts |   2 +
 packages/svelte/src/internal/client/index.js  |   2 +
 packages/svelte/src/internal/server/index.js  |  30 +----
 .../svelte/src/internal/shared/attributes.js  |  28 ++++
 .../main.svelte                               |   2 +-
 .../_expected/client/index.svelte.js          |  11 +-
 .../_expected/server/index.svelte.js          |   4 +-
 .../samples/inline-module-vars/index.svelte   |   7 +-
 23 files changed, 313 insertions(+), 227 deletions(-)
 create mode 100644 .changeset/spotty-sheep-fetch.md
 create mode 100644 packages/svelte/src/internal/shared/attributes.js

diff --git a/.changeset/spotty-sheep-fetch.md b/.changeset/spotty-sheep-fetch.md
new file mode 100644
index 0000000000..8a23f40e3a
--- /dev/null
+++ b/.changeset/spotty-sheep-fetch.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: better inlining of static attributes
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 2a281a1aa3..6931f873fb 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
@@ -1,7 +1,7 @@
 /** @import { ArrowFunctionExpression, Expression, FunctionDeclaration, FunctionExpression } from 'estree' */
 /** @import { AST, DelegatedEvent, SvelteNode } from '#compiler' */
 /** @import { Context } from '../types' */
-import { is_capture_event, is_delegated } from '../../../../utils.js';
+import { is_boolean_attribute, is_capture_event, is_delegated } from '../../../../utils.js';
 import {
 	get_attribute_chunks,
 	get_attribute_expression,
@@ -16,14 +16,23 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
 export function Attribute(node, context) {
 	context.next();
 
+	const parent = /** @type {SvelteNode} */ (context.path.at(-1));
+
 	// special case
 	if (node.name === 'value') {
-		const parent = /** @type {SvelteNode} */ (context.path.at(-1));
 		if (parent.type === 'RegularElement' && parent.name === 'option') {
 			mark_subtree_dynamic(context.path);
 		}
 	}
 
+	if (node.name.startsWith('on')) {
+		mark_subtree_dynamic(context.path);
+	}
+
+	if (parent.type === 'RegularElement' && is_boolean_attribute(node.name.toLowerCase())) {
+		node.metadata.expression.can_inline = false;
+	}
+
 	if (node.value !== true) {
 		for (const chunk of get_attribute_chunks(node.value)) {
 			if (chunk.type !== 'ExpressionTag') continue;
@@ -37,6 +46,7 @@ export function Attribute(node, context) {
 
 			node.metadata.expression.has_state ||= chunk.metadata.expression.has_state;
 			node.metadata.expression.has_call ||= chunk.metadata.expression.has_call;
+			node.metadata.expression.can_inline &&= chunk.metadata.expression.can_inline;
 		}
 
 		if (is_event_attribute(node)) {
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 957b27ae9b..2ae32e80e1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -178,6 +178,7 @@ export function CallExpression(node, context) {
 		if (!is_pure(node.callee, context) || context.state.expression.dependencies.size > 0) {
 			context.state.expression.has_call = true;
 			context.state.expression.has_state = true;
+			context.state.expression.can_inline = false;
 		}
 	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
index 32c8d2ca36..f59b7fc569 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
@@ -2,7 +2,6 @@
 /** @import { Context } from '../types' */
 import { is_tag_valid_with_parent } from '../../../../html-tree-validation.js';
 import * as e from '../../../errors.js';
-import { mark_subtree_dynamic } from './shared/fragment.js';
 
 /**
  * @param {AST.ExpressionTag} node
@@ -15,9 +14,5 @@ export function ExpressionTag(node, context) {
 		}
 	}
 
-	// TODO ideally we wouldn't do this here, we'd just do it on encountering
-	// an `Identifier` within the tag. But we currently need to handle `{42}` etc
-	mark_subtree_dynamic(context.path);
-
 	context.next({ ...context.state, expression: node.metadata.expression });
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
index 79dccd5a7c..635f939c75 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
@@ -1,5 +1,4 @@
 /** @import { Expression, Identifier } from 'estree' */
-/** @import { EachBlock } from '#compiler' */
 /** @import { Context } from '../types' */
 import is_reference from 'is-reference';
 import { should_proxy } from '../../3-transform/client/utils.js';
@@ -20,8 +19,6 @@ export function Identifier(node, context) {
 		return;
 	}
 
-	mark_subtree_dynamic(context.path);
-
 	// If we are using arguments outside of a function, then throw an error
 	if (
 		node.name === 'arguments' &&
@@ -87,6 +84,12 @@ export function Identifier(node, context) {
 		}
 	}
 
+	// no binding means global, and we can't inline e.g. `<span>{location}</span>`
+	// because it could change between component renders. if there _is_ a
+	// binding and it is outside module scope, the expression cannot
+	// be inlined (TODO allow inlining in more cases - e.g. primitive consts)
+	let can_inline = !!binding && !binding.scope.parent && binding.kind === 'normal';
+
 	if (binding) {
 		if (context.state.expression) {
 			context.state.expression.dependencies.add(binding);
@@ -122,4 +125,17 @@ export function Identifier(node, context) {
 			w.reactive_declaration_module_script_dependency(node);
 		}
 	}
+
+	if (!can_inline && context.state.expression) {
+		context.state.expression.can_inline = false;
+	}
+
+	/**
+	 * if the identifier is part of an expression tag of an attribute we want to check if it's inlinable
+	 * before marking the subtree as dynamic. This is because if it's inlinable it will be inlined in the template
+	 * directly making the whole thing actually static.
+	 */
+	if (!can_inline || !context.path.find((node) => node.type === 'Attribute')) {
+		mark_subtree_dynamic(context.path);
+	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
index 171a1106a8..adcc2da422 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
@@ -19,6 +19,7 @@ export function MemberExpression(node, context) {
 
 	if (context.state.expression && !is_pure(node, context)) {
 		context.state.expression.has_state = true;
+		context.state.expression.can_inline = false;
 	}
 
 	if (!is_safe_identifier(node, context.state.scope)) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
index eacb8a342a..724b9af311 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
@@ -10,6 +10,7 @@ export function TaggedTemplateExpression(node, context) {
 	if (context.state.expression && !is_pure(node.tag, context)) {
 		context.state.expression.has_call = true;
 		context.state.expression.has_state = true;
+		context.state.expression.can_inline = false;
 	}
 
 	if (node.tag.type === 'Identifier') {
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 c460905977..910f173f79 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -1,18 +1,18 @@
 /** @import { ArrowFunctionExpression, Expression, FunctionDeclaration, FunctionExpression, Identifier, Pattern, PrivateIdentifier, Statement } from 'estree' */
-/** @import { AST, Binding, SvelteNode } from '#compiler' */
+/** @import { Binding, SvelteNode } from '#compiler' */
 /** @import { ClientTransformState, ComponentClientTransformState, ComponentContext } from './types.js' */
 /** @import { Analysis } from '../../types.js' */
 /** @import { Scope } from '../../scope.js' */
-import * as b from '../../../utils/builders.js';
-import { extract_identifiers, is_simple_expression } from '../../../utils/ast.js';
 import {
-	PROPS_IS_LAZY_INITIAL,
+	PROPS_IS_BINDABLE,
 	PROPS_IS_IMMUTABLE,
+	PROPS_IS_LAZY_INITIAL,
 	PROPS_IS_RUNES,
-	PROPS_IS_UPDATED,
-	PROPS_IS_BINDABLE
+	PROPS_IS_UPDATED
 } from '../../../../constants.js';
 import { dev } from '../../../state.js';
+import { extract_identifiers, is_simple_expression } from '../../../utils/ast.js';
+import * as b from '../../../utils/builders.js';
 import { get_value } from './visitors/shared/declarations.js';
 
 /**
@@ -311,43 +311,3 @@ export function create_derived_block_argument(node, context) {
 export function create_derived(state, arg) {
 	return b.call(state.analysis.runes ? '$.derived' : '$.derived_safe_equal', arg);
 }
-
-/**
- * Whether a variable can be referenced directly from template string.
- * @param {import('#compiler').Binding | undefined} binding
- * @returns {boolean}
- */
-export function can_inline_variable(binding) {
-	return (
-		!!binding &&
-		// in a `<script module>` block
-		!binding.scope.parent &&
-		// to prevent the need for escaping
-		binding.initial?.type === 'Literal'
-	);
-}
-
-/**
- * @param {(AST.Text | AST.ExpressionTag) | (AST.Text | AST.ExpressionTag)[]} node_or_nodes
- * @param {import('./types.js').ComponentClientTransformState} state
- */
-export function is_inlinable_expression(node_or_nodes, state) {
-	let nodes = Array.isArray(node_or_nodes) ? node_or_nodes : [node_or_nodes];
-	let has_expression_tag = false;
-	for (let value of nodes) {
-		if (value.type === 'ExpressionTag') {
-			if (value.expression.type === 'Identifier') {
-				const binding = state.scope
-					.owner(value.expression.name)
-					?.declarations.get(value.expression.name);
-				if (!can_inline_variable(binding)) {
-					return false;
-				}
-			} else {
-				return false;
-			}
-			has_expression_tag = true;
-		}
-	}
-	return has_expression_tag;
-}
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
index 08e06cc714..111516ce0a 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
@@ -1,4 +1,4 @@
-/** @import { Expression, Identifier, Statement } from 'estree' */
+/** @import { Expression, Identifier, Statement, TemplateElement } from 'estree' */
 /** @import { AST, Namespace } from '#compiler' */
 /** @import { SourceLocation } from '#shared' */
 /** @import { ComponentClientTransformState, ComponentContext } from '../types' */
@@ -141,14 +141,14 @@ export function Fragment(node, context) {
 		const id = b.id(context.state.scope.generate('fragment'));
 
 		const use_space_template =
-			trimmed.some((node) => node.type === 'ExpressionTag') &&
-			trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag');
+			trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag') &&
+			trimmed.some((node) => node.type === 'ExpressionTag' && !node.metadata.expression.can_inline);
 
 		if (use_space_template) {
 			// special case — we can use `$.text` instead of creating a unique template
 			const id = b.id(context.state.scope.generate('text'));
 
-			process_children(trimmed, () => id, false, {
+			process_children(trimmed, () => id, null, {
 				...context,
 				state
 			});
@@ -158,12 +158,12 @@ export function Fragment(node, context) {
 		} else {
 			if (is_standalone) {
 				// no need to create a template, we can just use the existing block's anchor
-				process_children(trimmed, () => b.id('$$anchor'), false, { ...context, state });
+				process_children(trimmed, () => b.id('$$anchor'), null, { ...context, state });
 			} else {
 				/** @type {(is_text: boolean) => Expression} */
 				const expression = (is_text) => b.call('$.first_child', id, is_text && b.true);
 
-				process_children(trimmed, expression, false, { ...context, state });
+				process_children(trimmed, expression, null, { ...context, state });
 
 				let flags = TEMPLATE_FRAGMENT;
 
@@ -212,12 +212,34 @@ function join_template(items) {
 	let quasi = b.quasi('');
 	const template = b.template([quasi], []);
 
+	/**
+	 * @param {Expression} expression
+	 */
+	function push(expression) {
+		if (expression.type === 'TemplateLiteral') {
+			for (let i = 0; i < expression.expressions.length; i += 1) {
+				const q = expression.quasis[i];
+				const e = expression.expressions[i];
+
+				quasi.value.cooked += /** @type {string} */ (q.value.cooked);
+				push(e);
+			}
+
+			const last = /** @type {TemplateElement} */ (expression.quasis.at(-1));
+			quasi.value.cooked += /** @type {string} */ (last.value.cooked);
+		} else if (expression.type === 'Literal') {
+			/** @type {string} */ (quasi.value.cooked) += expression.value;
+		} else {
+			template.expressions.push(expression);
+			template.quasis.push((quasi = b.quasi('')));
+		}
+	}
+
 	for (const item of items) {
 		if (typeof item === 'string') {
 			quasi.value.cooked += item;
 		} else {
-			template.expressions.push(item);
-			template.quasis.push((quasi = b.quasi('')));
+			push(item);
 		}
 	}
 
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 4d3cebcee6..455327a712 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
@@ -1,46 +1,36 @@
-/** @import { Expression, ExpressionStatement, Identifier, MemberExpression, ObjectExpression, Statement } from 'estree' */
+/** @import { Expression, ExpressionStatement, Identifier, Literal, MemberExpression, ObjectExpression, Statement } from 'estree' */
 /** @import { AST } from '#compiler' */
 /** @import { SourceLocation } from '#shared' */
 /** @import { ComponentClientTransformState, ComponentContext } from '../types' */
 /** @import { Scope } from '../../../scope' */
+import { escape_html } from '../../../../../escaping.js';
 import {
 	is_boolean_attribute,
 	is_dom_property,
 	is_load_error_element,
 	is_void
 } from '../../../../../utils.js';
-import { escape_html } from '../../../../../escaping.js';
 import { dev, is_ignored, locator } from '../../../../state.js';
-import {
-	get_attribute_expression,
-	is_event_attribute,
-	is_text_attribute
-} from '../../../../utils/ast.js';
+import { is_event_attribute, is_text_attribute } from '../../../../utils/ast.js';
 import * as b from '../../../../utils/builders.js';
 import { is_custom_element_node } from '../../../nodes.js';
 import { clean_nodes, determine_namespace_for_children } from '../../utils.js';
+import { build_getter, create_derived } from '../utils.js';
 import {
-	build_getter,
-	can_inline_variable,
-	create_derived,
-	is_inlinable_expression
-} from '../utils.js';
-import {
-	get_attribute_name,
 	build_attribute_value,
 	build_class_directives,
+	build_set_attributes,
 	build_style_directives,
-	build_set_attributes
+	get_attribute_name
 } from './shared/element.js';
+import { visit_event_attribute } from './shared/events.js';
 import { process_children } from './shared/fragment.js';
 import {
 	build_render_statement,
-	build_template_literal,
+	build_template_chunk,
 	build_update,
-	build_update_assignment,
-	get_states_and_calls
+	build_update_assignment
 } from './shared/utils.js';
-import { visit_event_attribute } from './shared/events.js';
 
 /**
  * @param {AST.RegularElement} node
@@ -362,28 +352,32 @@ export function RegularElement(node, context) {
 
 	// special case — if an element that only contains text, we don't need
 	// to descend into it if the text is non-reactive
-	const states_and_calls =
-		trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag') &&
-		trimmed.some((node) => node.type === 'ExpressionTag') &&
-		get_states_and_calls(trimmed);
+	const is_text = trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag');
+
+	// in the rare case that we have static text that can't be inlined
+	// (e.g. `<span>{location}</span>`), set `textContent` programmatically
+	const use_text_content =
+		is_text &&
+		trimmed.every((node) => node.type === 'Text' || !node.metadata.expression.has_state) &&
+		trimmed.some((node) => node.type === 'ExpressionTag' && !node.metadata.expression.can_inline);
+
+	if (use_text_content) {
+		let { value } = build_template_chunk(trimmed, context.visit, child_state);
 
-	if (states_and_calls && states_and_calls.states === 0) {
 		child_state.init.push(
-			b.stmt(
-				b.assignment(
-					'=',
-					b.member(context.state.node, 'textContent'),
-					build_template_literal(trimmed, context.visit, child_state).value
-				)
-			)
+			b.stmt(b.assignment('=', b.member(context.state.node, 'textContent'), value))
 		);
 	} else {
 		/** @type {Expression} */
 		let arg = context.state.node;
 
 		// If `hydrate_node` is set inside the element, we need to reset it
-		// after the element has been hydrated
-		let needs_reset = trimmed.some((node) => node.type !== 'Text');
+		// after the element has been hydrated (we don't need to reset if it's been inlined)
+		let needs_reset = !trimmed.every(
+			(node) =>
+				node.type === 'Text' ||
+				(node.type === 'ExpressionTag' && node.metadata.expression.can_inline)
+		);
 
 		// The same applies if it's a `<template>` element, since we need to
 		// set the value of `hydrate_node` to `node.content`
@@ -393,7 +387,7 @@ export function RegularElement(node, context) {
 			arg = b.member(arg, 'content');
 		}
 
-		process_children(trimmed, (is_text) => b.call('$.child', arg, is_text && b.true), true, {
+		process_children(trimmed, (is_text) => b.call('$.child', arg, is_text && b.true), node, {
 			...context,
 			state: child_state
 		});
@@ -586,10 +580,6 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 		);
 	}
 
-	const inlinable_expression =
-		attribute.value === true
-			? false // not an expression
-			: is_inlinable_expression(attribute.value, context.state);
 	if (attribute.metadata.expression.has_state) {
 		if (has_call) {
 			state.init.push(build_update(update));
@@ -597,14 +587,44 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 			state.update.push(update);
 		}
 		return true;
-	} else {
-		if (inlinable_expression) {
-			context.state.template.push(` ${name}="`, value, '"');
+	}
+
+	// we need to special case textarea value because it's not an actual attribute
+	const can_inline =
+		(attribute.name !== 'value' || element.name !== 'textarea') &&
+		attribute.metadata.expression.can_inline;
+
+	if (can_inline) {
+		/** @type {Literal | undefined} */
+		let literal = undefined;
+
+		if (value.type === 'Literal') {
+			literal = value;
+		} else if (value.type === 'Identifier') {
+			const binding = context.state.scope.get(value.name);
+			if (binding && binding.initial?.type === 'Literal' && !binding.reassigned) {
+				literal = binding.initial;
+			}
+		}
+
+		if (literal && escape_html(literal.value, true) === String(literal.value)) {
+			if (is_boolean_attribute(name)) {
+				if (literal.value) {
+					context.state.template.push(` ${name}`);
+				}
+			} else {
+				context.state.template.push(` ${name}="`, value, '"');
+			}
 		} else {
-			state.init.push(update);
+			context.state.template.push(
+				b.call('$.attr', b.literal(name), value, is_boolean_attribute(name) && b.true)
+			);
 		}
-		return false;
+	} else {
+		state.init.push(update);
 	}
+
+	return false;
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js
index a71deaf539..72cc57b068 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/TitleElement.js
@@ -1,14 +1,14 @@
 /** @import { AST } from '#compiler' */
 /** @import { ComponentContext } from '../types' */
 import * as b from '../../../../utils/builders.js';
-import { build_template_literal } from './shared/utils.js';
+import { build_template_chunk } from './shared/utils.js';
 
 /**
  * @param {AST.TitleElement} node
  * @param {ComponentContext} context
  */
 export function TitleElement(node, context) {
-	const { has_state, value } = build_template_literal(
+	const { has_state, value } = build_template_chunk(
 		/** @type {any} */ (node.fragment.nodes),
 		context.visit,
 		context.state
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
index e0fbe11b73..1b0737e31e 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/element.js
@@ -6,7 +6,7 @@ import { is_ignored } from '../../../../../state.js';
 import { get_attribute_expression, is_event_attribute } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
 import { build_getter, create_derived } from '../../utils.js';
-import { build_template_literal, build_update } from './utils.js';
+import { build_template_chunk, build_update } from './utils.js';
 
 /**
  * @param {Array<AST.Attribute | AST.SpreadAttribute>} attributes
@@ -200,7 +200,7 @@ export function build_attribute_value(value, context) {
 		};
 	}
 
-	return build_template_literal(value, context.visit, context.state);
+	return build_template_chunk(value, context.visit, context.state);
 }
 
 /**
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 3b009fb5b5..ac6e0f8f9f 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,10 +1,11 @@
 /** @import { Expression } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
+/** @import { Scope } from '../../../../scope.js' */
 /** @import { ComponentContext } from '../../types' */
-import { is_event_attribute, is_text_attribute } from '../../../../../utils/ast.js';
+import { escape_html } from '../../../../../../escaping.js';
+import { is_event_attribute } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
-import { is_inlinable_expression } from '../../utils.js';
-import { build_template_literal, build_update } from './utils.js';
+import { build_template_chunk, build_update } from './utils.js';
 
 /**
  * Processes an array of template nodes, joining sibling text/expression nodes
@@ -12,10 +13,10 @@ import { build_template_literal, build_update } from './utils.js';
  * corresponding template node references these updates are applied to.
  * @param {SvelteNode[]} nodes
  * @param {(is_text: boolean) => Expression} initial
- * @param {boolean} is_element
+ * @param {AST.RegularElement | null} element
  * @param {ComponentContext} context
  */
-export function process_children(nodes, initial, is_element, { visit, state }) {
+export function process_children(nodes, initial, element, { visit, state }) {
 	const within_bound_contenteditable = state.metadata.bound_contenteditable;
 	let prev = initial;
 	let skipped = 0;
@@ -61,16 +62,17 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 	 * @param {Sequence} sequence
 	 */
 	function flush_sequence(sequence) {
-		if (sequence.every((node) => node.type === 'Text')) {
+		const { has_state, has_call, value, can_inline } = build_template_chunk(sequence, visit, state);
+
+		if (can_inline) {
 			skipped += 1;
-			state.template.push(sequence.map((node) => node.raw).join(''));
+			const raw = element?.name === 'script' || element?.name === 'style';
+			state.template.push(raw ? value : escape_inline_expression(value, state.scope));
 			return;
 		}
 
 		state.template.push(' ');
 
-		const { has_state, has_call, value } = build_template_literal(sequence, visit, state);
-
 		// if this is a standalone `{expression}`, make sure we handle the case where
 		// no text node was created because the expression was empty during SSR
 		const is_text = sequence.length === 1;
@@ -98,9 +100,9 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 
 			let child_state = state;
 
-			if (is_static_element(node, state)) {
+			if (is_static_element(node)) {
 				skipped += 1;
-			} else if (node.type === 'EachBlock' && nodes.length === 1 && is_element) {
+			} else if (node.type === 'EachBlock' && nodes.length === 1 && element) {
 				node.metadata.is_controlled = true;
 			} else {
 				const id = flush_node(false, node.type === 'RegularElement' ? node.name : 'node');
@@ -125,9 +127,8 @@ export function process_children(nodes, initial, is_element, { visit, state }) {
 
 /**
  * @param {SvelteNode} node
- * @param {ComponentContext["state"]} state
  */
-function is_static_element(node, state) {
+function is_static_element(node) {
 	if (node.type !== 'RegularElement') return false;
 	if (node.fragment.metadata.dynamic) return false;
 	if (node.name.includes('-')) return false; // we're setting all attributes on custom elements through properties
@@ -154,16 +155,49 @@ function is_static_element(node, state) {
 			return false;
 		}
 
-		if (
-			attribute.value !== true &&
-			!is_text_attribute(attribute) &&
-			// If the attribute is not a text attribute but is inlinable we will directly inline it in the
-			// the template so before returning false we need to check that the attribute is not inlinable
-			!is_inlinable_expression(attribute.value, state)
-		) {
+		if (!attribute.metadata.expression.can_inline) {
 			return false;
 		}
 	}
 
 	return true;
 }
+
+/**
+ * @param {Expression} node
+ * @param {Scope} scope
+ * @returns {Expression}
+ */
+function escape_inline_expression(node, scope) {
+	if (node.type === 'Literal') {
+		if (typeof node.value === 'string') {
+			return b.literal(escape_html(node.value));
+		}
+
+		return node;
+	}
+
+	if (node.type === 'TemplateLiteral') {
+		return b.template(
+			node.quasis.map((q) => b.quasi(escape_html(q.value.cooked))),
+			node.expressions.map((expression) => escape_inline_expression(expression, scope))
+		);
+	}
+
+	/**
+	 * If we can't determine the range of possible values statically, wrap in
+	 * `$.escape(...)`. TODO expand this to cover more cases
+	 */
+	let needs_escape = true;
+
+	if (node.type === 'Identifier') {
+		const binding = scope.get(node.name);
+
+		// TODO handle more cases
+		if (binding?.initial?.type === 'Literal' && !binding.reassigned) {
+			needs_escape = escape_html(binding.initial.value) !== String(binding.initial.value);
+		}
+	}
+
+	return needs_escape ? b.call('$.escape', node) : node;
+}
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 21b902d5c2..b74d2cc9c0 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, Statement, Super, TemplateLiteral, Node } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
 /** @import { ComponentClientTransformState } from '../../types' */
 import { walk } from 'zimmerframe';
@@ -10,85 +10,89 @@ import { create_derived } from '../../utils.js';
 import is_reference from 'is-reference';
 import { locator } from '../../../../../state.js';
 
-/**
- * @param {Array<AST.Text | AST.ExpressionTag>} values
- */
-export function get_states_and_calls(values) {
-	let states = 0;
-	let calls = 0;
-	for (let i = 0; i < values.length; i++) {
-		const node = values[i];
-
-		if (node.type === 'ExpressionTag') {
-			if (node.metadata.expression.has_call) {
-				calls++;
-			}
-			if (node.metadata.expression.has_state) {
-				states++;
-			}
-		}
-	}
-
-	return { states, calls };
-}
-
 /**
  * @param {Array<AST.Text | AST.ExpressionTag>} values
  * @param {(node: SvelteNode, state: any) => any} visit
  * @param {ComponentClientTransformState} state
- * @returns {{ value: Expression, has_state: boolean, has_call: boolean }}
+ * @returns {{ value: Expression, has_state: boolean, has_call: boolean, can_inline: boolean }}
  */
-export function build_template_literal(values, visit, state) {
+export function build_template_chunk(values, visit, state) {
 	/** @type {Expression[]} */
 	const expressions = [];
 
 	let quasi = b.quasi('');
 	const quasis = [quasi];
 
-	const { states, calls } = get_states_and_calls(values);
+	let has_call = false;
+	let has_state = false;
+	let can_inline = true;
+	let contains_multiple_call_expression = false;
 
-	let has_call = calls > 0;
-	let has_state = states > 0;
-	let contains_multiple_call_expression = calls > 1;
+	for (const node of values) {
+		if (node.type === 'ExpressionTag') {
+			if (node.metadata.expression.has_call) {
+				if (has_call) contains_multiple_call_expression = true;
+				has_call = true;
+			}
+
+			if (node.metadata.expression.has_state) {
+				has_state = true;
+			}
+
+			if (!node.metadata.expression.can_inline) {
+				can_inline = false;
+			}
+		}
+	}
 
 	for (let i = 0; i < values.length; i++) {
 		const node = values[i];
 
 		if (node.type === 'Text') {
 			quasi.value.cooked += node.data;
-		} else if (node.type === 'ExpressionTag' && node.expression.type === 'Literal') {
-			if (node.expression.value != null) {
-				quasi.value.cooked += node.expression.value + '';
-			}
 		} else {
-			if (contains_multiple_call_expression) {
-				const id = b.id(state.scope.generate('stringified_text'));
-				state.init.push(
-					b.const(
-						id,
-						create_derived(
-							state,
-							b.thunk(
-								b.logical(
-									'??',
-									/** @type {Expression} */ (visit(node.expression, state)),
-									b.literal('')
-								)
-							)
-						)
-					)
-				);
-				expressions.push(b.call('$.get', id));
-			} else if (values.length === 1) {
-				// If we have a single expression, then pass that in directly to possibly avoid doing
-				// extra work in the template_effect (instead we do the work in set_text).
-				return { value: visit(node.expression, state), has_state, has_call };
+			const expression = /** @type {Expression} */ (visit(node.expression, state));
+
+			if (expression.type === 'Literal') {
+				if (expression.value != null) {
+					quasi.value.cooked += expression.value + '';
+				}
 			} else {
-				expressions.push(b.logical('??', visit(node.expression, state), b.literal('')));
-			}
+				let value = expression;
+
+				// if we don't know the value, we need to add `?? ''` to replace
+				// `null` and `undefined` with the empty string
+				let needs_fallback = true;
+
+				if (value.type === 'Identifier') {
+					const binding = state.scope.get(value.name);
 
-			quasi = b.quasi('', i + 1 === values.length);
-			quasis.push(quasi);
+					if (binding && binding.initial?.type === 'Literal' && !binding.reassigned) {
+						needs_fallback = binding.initial.value === null;
+					}
+				}
+
+				if (needs_fallback) {
+					value = b.logical('??', expression, b.literal(''));
+				}
+
+				if (contains_multiple_call_expression) {
+					const id = b.id(state.scope.generate('stringified_text'));
+
+					state.init.push(b.const(id, create_derived(state, b.thunk(value))));
+
+					expressions.push(b.call('$.get', id));
+				} else if (values.length === 1) {
+					// If we have a single expression, then pass that in directly to possibly avoid doing
+					// extra work in the template_effect (instead we do the work in set_text).
+					return { value: visit(node.expression, state), has_state, has_call, can_inline };
+				} else {
+					expressions.push(value);
+				}
+
+				quasi = b.quasi('', i + 1 === values.length);
+				quasis.push(quasi);
+			}
 		}
 	}
 
@@ -98,7 +102,7 @@ export function build_template_literal(values, visit, state) {
 
 	const value = b.template(quasis, expressions);
 
-	return { value, has_state, has_call };
+	return { value, has_state, has_call, can_inline };
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/nodes.js b/packages/svelte/src/compiler/phases/nodes.js
index ead525aaa1..13a54730eb 100644
--- a/packages/svelte/src/compiler/phases/nodes.js
+++ b/packages/svelte/src/compiler/phases/nodes.js
@@ -58,6 +58,7 @@ export function create_expression_metadata() {
 	return {
 		dependencies: new Set(),
 		has_state: false,
-		has_call: false
+		has_call: false,
+		can_inline: true
 	};
 }
diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index 8a45f2d4fd..bd4749db00 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -317,6 +317,8 @@ export interface ExpressionMetadata {
 	has_state: boolean;
 	/** True if the expression involves a call expression (often, it will need to be wrapped in a derived) */
 	has_call: boolean;
+	/** True if the expression can be inlined into a template */
+	can_inline: boolean;
 }
 
 export * from './template.js';
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index c401867a0f..bfc0a6aac9 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -1,4 +1,5 @@
 export { FILENAME, HMR, NAMESPACE_SVG } from '../../constants.js';
+export { escape_html as escape } from '../../escaping.js';
 export { cleanup_styles } from './dev/css.js';
 export { add_locations } from './dev/elements.js';
 export { hmr } from './dev/hmr.js';
@@ -155,6 +156,7 @@ export {
 	$window as window,
 	$document as document
 } from './dom/operations.js';
+export { attr } from '../shared/attributes.js';
 export { snapshot } from '../shared/clone.js';
 export { noop, fallback } from '../shared/utils.js';
 export {
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 9a66095de4..615a49fbd4 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -2,6 +2,7 @@
 /** @import { Component, Payload, RenderOutput } from '#server' */
 /** @import { Store } from '#shared' */
 export { FILENAME, HMR } from '../../constants.js';
+import { attr } from '../shared/attributes.js';
 import { is_promise, noop } from '../shared/utils.js';
 import { subscribe_to_store } from '../../store/utils.js';
 import {
@@ -153,33 +154,6 @@ export function head(payload, fn) {
 	head_payload.out += BLOCK_CLOSE;
 }
 
-/**
- * `<div translate={false}>` should be rendered as `<div translate="no">` and _not_
- * `<div translate="false">`, which is equivalent to `<div translate="yes">`. There
- * may be other odd cases that need to be added to this list in future
- * @type {Record<string, Map<any, string>>}
- */
-const replacements = {
-	translate: new Map([
-		[true, 'yes'],
-		[false, 'no']
-	])
-};
-
-/**
- * @template V
- * @param {string} name
- * @param {V} value
- * @param {boolean} [is_boolean]
- * @returns {string}
- */
-export function attr(name, value, is_boolean = false) {
-	if (value == null || (!value && is_boolean) || (value === '' && name === 'class')) return '';
-	const normalized = (name in replacements && replacements[name].get(value)) || value;
-	const assignment = is_boolean ? '' : `="${escape_html(normalized, true)}"`;
-	return ` ${name}${assignment}`;
-}
-
 /**
  * @param {Payload} payload
  * @param {boolean} is_html
@@ -549,6 +523,8 @@ export function once(get_value) {
 	};
 }
 
+export { attr };
+
 export { html } from './blocks/html.js';
 
 export { push, pop } from './context.js';
diff --git a/packages/svelte/src/internal/shared/attributes.js b/packages/svelte/src/internal/shared/attributes.js
new file mode 100644
index 0000000000..867d6ba5d3
--- /dev/null
+++ b/packages/svelte/src/internal/shared/attributes.js
@@ -0,0 +1,28 @@
+import { escape_html } from '../../escaping.js';
+
+/**
+ * `<div translate={false}>` should be rendered as `<div translate="no">` and _not_
+ * `<div translate="false">`, which is equivalent to `<div translate="yes">`. There
+ * may be other odd cases that need to be added to this list in future
+ * @type {Record<string, Map<any, string>>}
+ */
+const replacements = {
+	translate: new Map([
+		[true, 'yes'],
+		[false, 'no']
+	])
+};
+
+/**
+ * @template V
+ * @param {string} name
+ * @param {V} value
+ * @param {boolean} [is_boolean]
+ * @returns {string}
+ */
+export function attr(name, value, is_boolean = false) {
+	if (value == null || (!value && is_boolean) || (value === '' && name === 'class')) return '';
+	const normalized = (name in replacements && replacements[name].get(value)) || value;
+	const assignment = is_boolean ? '' : `="${escape_html(normalized, true)}"`;
+	return ` ${name}${assignment}`;
+}
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-case-insensitive/main.svelte b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-case-insensitive/main.svelte
index 9020894086..bcc418511f 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-case-insensitive/main.svelte
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-case-insensitive/main.svelte
@@ -1 +1 @@
-<input READONLY={true} REQUIRED={false}>
+<input READONLY={!0} REQUIRED={!1}>
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
index 46ed3c1913..75e632239e 100644
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
@@ -5,12 +5,13 @@ const __DECLARED_ASSET_0__ = "__VITE_ASSET__2AM7_y_a__ 1440w, __VITE_ASSET__2AM7
 const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
 const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
 const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
-var root = $.template(`<picture><source srcset="${__DECLARED_ASSET_0__}" type="image/avif"> <source srcset="${__DECLARED_ASSET_1__}" type="image/webp"> <source srcset="${__DECLARED_ASSET_2__}" type="image/png"> <img src="${__DECLARED_ASSET_3__}" alt="production test" width="1440" height="1440"></picture>`);
+const a = 1;
+const b = 2;
+var root = $.template(`<picture><source srcset="${__DECLARED_ASSET_0__}" type="image/avif"> <source srcset="${__DECLARED_ASSET_1__}" type="image/webp"> <source srcset="${__DECLARED_ASSET_2__}" type="image/png"> <img src="${__DECLARED_ASSET_3__}" alt="production test" width="1440" height="1440"></picture> <p>${a} + ${b} = ${$.escape(a + b ?? "")}</p>`, 1);
 
 export default function Inline_module_vars($$anchor) {
-	var picture = root();
+	var fragment = root();
+	var p = $.sibling($.first_child(fragment), 2);
 
-	$.next(6);
-	$.reset(picture);
-	$.append($$anchor, picture);
+	$.append($$anchor, fragment);
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
index 9dad39d81e..ca98cd952b 100644
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
@@ -4,7 +4,9 @@ const __DECLARED_ASSET_0__ = "__VITE_ASSET__2AM7_y_a__ 1440w, __VITE_ASSET__2AM7
 const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
 const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
 const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
+const a = 1;
+const b = 2;
 
 export default function Inline_module_vars($$payload) {
-	$$payload.out += `<picture><source${$.attr("srcset", __DECLARED_ASSET_0__)} type="image/avif"> <source${$.attr("srcset", __DECLARED_ASSET_1__)} type="image/webp"> <source${$.attr("srcset", __DECLARED_ASSET_2__)} type="image/png"> <img${$.attr("src", __DECLARED_ASSET_3__)} alt="production test" width="1440" height="1440"></picture>`;
+	$$payload.out += `<picture><source${$.attr("srcset", __DECLARED_ASSET_0__)} type="image/avif"> <source${$.attr("srcset", __DECLARED_ASSET_1__)} type="image/webp"> <source${$.attr("srcset", __DECLARED_ASSET_2__)} type="image/png"> <img${$.attr("src", __DECLARED_ASSET_3__)} alt="production test"${$.attr("width", 1440)}${$.attr("height", 1440)}></picture> <p>${$.escape(a)} + ${$.escape(b)} = ${$.escape(a + b)}</p>`;
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte b/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte
index b46a86dc0b..a7b737e596 100644
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte
+++ b/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte
@@ -5,11 +5,16 @@
 	const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
 	const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
 	const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
+
+	const a = 1;
+	const b = 2;
 </script>
 
 <picture>
 	<source srcset={__DECLARED_ASSET_0__} type="image/avif" />
 	<source srcset={__DECLARED_ASSET_1__} type="image/webp" />
 	<source srcset={__DECLARED_ASSET_2__} type="image/png" />
-	<img src={__DECLARED_ASSET_3__} alt="production test" width=1440 height=1440 />
+	<img src={__DECLARED_ASSET_3__} alt="production test" width={1440} height={1440} />
 </picture>
+
+<p>{a} + {b} = {a + b}</p>

From 312dd51acc44d92ab855f7eaf15d2d9150c0a6f3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 14 Nov 2024 12:56:16 -0500
Subject: [PATCH 159/404] Version Packages (#14302)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/spotty-sheep-fetch.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/spotty-sheep-fetch.md

diff --git a/.changeset/spotty-sheep-fetch.md b/.changeset/spotty-sheep-fetch.md
deleted file mode 100644
index 8a23f40e3a..0000000000
--- a/.changeset/spotty-sheep-fetch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: better inlining of static attributes
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 8040c4ecab..f7e17f14f9 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.2.0
+
+### Minor Changes
+
+- feat: better inlining of static attributes ([#14269](https://github.com/sveltejs/svelte/pull/14269))
+
 ## 5.1.17
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index ffe19223c2..b23d031a17 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.1.17",
+  "version": "5.2.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 7c0d0680ea..e3d34edc4e 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.1.17';
+export const VERSION = '5.2.0';
 export const PUBLIC_VERSION = '5';

From 7fd37740150da964f923f136fed36c2156b533b4 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 14 Nov 2024 20:22:35 +0000
Subject: [PATCH 160/404] fix: disallow invalid attributes for
 `<svelte:window>` and `<svelte:document>` (#14228)

---
 .changeset/fast-ligers-repeat.md                   |  5 +++++
 .../docs/98-reference/.generated/compile-errors.md |  6 ++++++
 .../svelte/messages/compile-errors/template.md     |  4 ++++
 packages/svelte/src/compiler/errors.js             | 10 ++++++++++
 .../phases/2-analyze/visitors/SvelteDocument.js    | 12 ++++++++++++
 .../phases/2-analyze/visitors/SvelteWindow.js      | 12 ++++++++++++
 .../illegal_spread_element-document/errors.json    | 14 ++++++++++++++
 .../illegal_spread_element-document/input.svelte   |  4 ++++
 .../illegal_spread_element-window/errors.json      | 14 ++++++++++++++
 .../illegal_spread_element-window/input.svelte     |  4 ++++
 10 files changed, 85 insertions(+)
 create mode 100644 .changeset/fast-ligers-repeat.md
 create mode 100644 packages/svelte/tests/validator/samples/illegal_spread_element-document/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/illegal_spread_element-document/input.svelte
 create mode 100644 packages/svelte/tests/validator/samples/illegal_spread_element-window/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/illegal_spread_element-window/input.svelte

diff --git a/.changeset/fast-ligers-repeat.md b/.changeset/fast-ligers-repeat.md
new file mode 100644
index 0000000000..c6b35c4373
--- /dev/null
+++ b/.changeset/fast-ligers-repeat.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: disallow invalid attributes for `<svelte:window>` and `<svelte:document>`
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index b32bc6b89c..16cd361e52 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -412,6 +412,12 @@ Expected whitespace
 `$host()` can only be used inside custom element component instances
 ```
 
+### illegal_element_attribute
+
+```
+`<%name%>` does not support non-event attributes or spread attributes
+```
+
 ### import_svelte_internal_forbidden
 
 ```
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index cddca87d9c..38ff87d505 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -172,6 +172,10 @@
 
 > Expected whitespace
 
+## illegal_element_attribute
+
+> `<%name%>` does not support non-event attributes or spread attributes
+
 ## js_parse_error
 
 > %message%
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 00e2246ccf..ad2919b34b 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -984,6 +984,16 @@ export function expected_whitespace(node) {
 	e(node, "expected_whitespace", "Expected whitespace");
 }
 
+/**
+ * `<%name%>` does not support non-event attributes or spread attributes
+ * @param {null | number | NodeLike} node
+ * @param {string} name
+ * @returns {never}
+ */
+export function illegal_element_attribute(node, name) {
+	e(node, "illegal_element_attribute", `\`<${name}>\` does not support non-event attributes or spread attributes`);
+}
+
 /**
  * %message%
  * @param {null | number | NodeLike} node
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteDocument.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteDocument.js
index a44baef9e4..fe54ebf30d 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteDocument.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteDocument.js
@@ -1,6 +1,8 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 import { disallow_children } from './shared/special-element.js';
+import * as e from '../../../errors.js';
+import { is_event_attribute } from '../../../utils/ast.js';
 
 /**
  * @param {AST.SvelteDocument} node
@@ -8,5 +10,15 @@ import { disallow_children } from './shared/special-element.js';
  */
 export function SvelteDocument(node, context) {
 	disallow_children(node);
+
+	for (const attribute of node.attributes) {
+		if (
+			attribute.type === 'SpreadAttribute' ||
+			(attribute.type === 'Attribute' && !is_event_attribute(attribute))
+		) {
+			e.illegal_element_attribute(attribute, 'svelte:document');
+		}
+	}
+
 	context.next();
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteWindow.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteWindow.js
index c5392a477d..20f5abc5d6 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteWindow.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteWindow.js
@@ -1,6 +1,8 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 import { disallow_children } from './shared/special-element.js';
+import * as e from '../../../errors.js';
+import { is_event_attribute } from '../../../utils/ast.js';
 
 /**
  * @param {AST.SvelteWindow} node
@@ -8,5 +10,15 @@ import { disallow_children } from './shared/special-element.js';
  */
 export function SvelteWindow(node, context) {
 	disallow_children(node);
+
+	for (const attribute of node.attributes) {
+		if (
+			attribute.type === 'SpreadAttribute' ||
+			(attribute.type === 'Attribute' && !is_event_attribute(attribute))
+		) {
+			e.illegal_element_attribute(attribute, 'svelte:window');
+		}
+	}
+
 	context.next();
 }
diff --git a/packages/svelte/tests/validator/samples/illegal_spread_element-document/errors.json b/packages/svelte/tests/validator/samples/illegal_spread_element-document/errors.json
new file mode 100644
index 0000000000..2e15b152e7
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/illegal_spread_element-document/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "illegal_element_attribute",
+		"message": "`<svelte:document>` does not support non-event attributes or spread attributes",
+		"start": {
+			"line": 4,
+			"column": 17
+		},
+		"end": {
+			"line": 4,
+			"column": 23
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/illegal_spread_element-document/input.svelte b/packages/svelte/tests/validator/samples/illegal_spread_element-document/input.svelte
new file mode 100644
index 0000000000..8980eea012
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/illegal_spread_element-document/input.svelte
@@ -0,0 +1,4 @@
+<script>
+	let a = {};
+</script>
+<svelte:document {...a}></svelte:document>
diff --git a/packages/svelte/tests/validator/samples/illegal_spread_element-window/errors.json b/packages/svelte/tests/validator/samples/illegal_spread_element-window/errors.json
new file mode 100644
index 0000000000..c59045e852
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/illegal_spread_element-window/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "illegal_element_attribute",
+		"message": "`<svelte:window>` does not support non-event attributes or spread attributes",
+		"start": {
+			"line": 4,
+			"column": 15
+		},
+		"end": {
+			"line": 4,
+			"column": 21
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/illegal_spread_element-window/input.svelte b/packages/svelte/tests/validator/samples/illegal_spread_element-window/input.svelte
new file mode 100644
index 0000000000..c0076cc6bf
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/illegal_spread_element-window/input.svelte
@@ -0,0 +1,4 @@
+<script>
+	let a = {};
+</script>
+<svelte:window {...a}></svelte:window>

From e379319626349e55b65a7f6af18eef4a81f92adf Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 14 Nov 2024 22:47:18 +0100
Subject: [PATCH 161/404] fix: ensure props passed to components via mount are
 updateable (#14210)

The detection whether or not props are writable is buggy; it doesn't take into account the case when instantiating components via `mount` or legacy-`new`

Fixes #14161

This posed an interesting question: What to do about (non-)`bind:`able properties? The answer I arrived on was: Treat it as if everything that _can_ be bound _is_ treated as bound, and everything else as readonly. In other words, if you're reassigning a prop, it will diverge from the passed in props if it's not bindable or not set in the parent, otherwise it will mutate the passed in props. I think that makes the most sense, given that you can't control this behavior from the outside.
---
 .changeset/fresh-pigs-divide.md               |  5 ++
 .../svelte/src/internal/client/constants.js   |  1 +
 .../src/internal/client/reactivity/props.js   | 20 +++++++-
 .../svelte/src/internal/client/validate.js    | 11 +----
 packages/svelte/src/legacy/legacy-client.js   |  7 ++-
 .../samples/mount-props-updates/_config.js    | 47 +++++++++++++++++++
 .../mount-props-updates/component.svelte      | 17 +++++++
 .../samples/mount-props-updates/main.svelte   | 30 ++++++++++++
 8 files changed, 124 insertions(+), 14 deletions(-)
 create mode 100644 .changeset/fresh-pigs-divide.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/mount-props-updates/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/mount-props-updates/component.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/mount-props-updates/main.svelte

diff --git a/.changeset/fresh-pigs-divide.md b/.changeset/fresh-pigs-divide.md
new file mode 100644
index 0000000000..8aa3d74ce9
--- /dev/null
+++ b/.changeset/fresh-pigs-divide.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure props passed to components via mount are updateable
diff --git a/packages/svelte/src/internal/client/constants.js b/packages/svelte/src/internal/client/constants.js
index 53df86126a..bcf30e78db 100644
--- a/packages/svelte/src/internal/client/constants.js
+++ b/packages/svelte/src/internal/client/constants.js
@@ -22,4 +22,5 @@ export const EFFECT_HAS_DERIVED = 1 << 19;
 
 export const STATE_SYMBOL = Symbol('$state');
 export const STATE_SYMBOL_METADATA = Symbol('$state metadata');
+export const LEGACY_PROPS = Symbol('legacy props');
 export const LOADING_ATTR_SYMBOL = Symbol('');
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index dbfb8f0337..8fb13f7e2c 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -20,7 +20,13 @@ import {
 } from '../runtime.js';
 import { safe_equals } from './equality.js';
 import * as e from '../errors.js';
-import { BRANCH_EFFECT, LEGACY_DERIVED_PROP, ROOT_EFFECT } from '../constants.js';
+import {
+	BRANCH_EFFECT,
+	LEGACY_DERIVED_PROP,
+	LEGACY_PROPS,
+	ROOT_EFFECT,
+	STATE_SYMBOL
+} from '../constants.js';
 import { proxy } from '../proxy.js';
 import { capture_store_binding } from './store.js';
 import { legacy_mode_flag } from '../../flags/index.js';
@@ -209,6 +215,9 @@ const spread_props_handler = {
 		}
 	},
 	has(target, key) {
+		// To prevent a false positive `is_entry_props` in the `prop` function
+		if (key === STATE_SYMBOL || key === LEGACY_PROPS) return false;
+
 		for (let p of target.props) {
 			if (is_function(p)) p = p();
 			if (p != null && key in p) return true;
@@ -282,7 +291,14 @@ export function prop(props, key, flags, fallback) {
 	} else {
 		prop_value = /** @type {V} */ (props[key]);
 	}
-	var setter = get_descriptor(props, key)?.set;
+
+	// Can be the case when someone does `mount(Component, props)` with `let props = $state({...})`
+	// or `createClassComponent(Component, props)`
+	var is_entry_props = STATE_SYMBOL in props || LEGACY_PROPS in props;
+
+	var setter =
+		get_descriptor(props, key)?.set ??
+		(is_entry_props && bindable && key in props ? (v) => (props[key] = v) : undefined);
 
 	var fallback_value = /** @type {V} */ (fallback);
 	var fallback_dirty = true;
diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js
index eddcb69d9e..951feee33b 100644
--- a/packages/svelte/src/internal/client/validate.js
+++ b/packages/svelte/src/internal/client/validate.js
@@ -1,4 +1,4 @@
-import { dev_current_component_function, untrack } from './runtime.js';
+import { dev_current_component_function } from './runtime.js';
 import { get_descriptor, is_array } from '../shared/utils.js';
 import * as e from './errors.js';
 import { FILENAME } from '../../constants.js';
@@ -6,15 +6,6 @@ import { render_effect } from './reactivity/effects.js';
 import * as w from './warnings.js';
 import { capture_store_binding } from './reactivity/store.js';
 
-/** regex of all html void element names */
-const void_element_names =
-	/^(?:area|base|br|col|command|embed|hr|img|input|keygen|link|meta|param|source|track|wbr)$/;
-
-/** @param {string} tag */
-function is_void(tag) {
-	return void_element_names.test(tag) || tag.toLowerCase() === '!doctype';
-}
-
 /**
  * @param {() => any} collection
  * @param {(item: any, index: number) => string} key_fn
diff --git a/packages/svelte/src/legacy/legacy-client.js b/packages/svelte/src/legacy/legacy-client.js
index c7684570bb..9e1cd888ad 100644
--- a/packages/svelte/src/legacy/legacy-client.js
+++ b/packages/svelte/src/legacy/legacy-client.js
@@ -1,5 +1,5 @@
 /** @import { ComponentConstructorOptions, ComponentType, SvelteComponent, Component } from 'svelte' */
-import { DIRTY, MAYBE_DIRTY } from '../internal/client/constants.js';
+import { DIRTY, LEGACY_PROPS, MAYBE_DIRTY } from '../internal/client/constants.js';
 import { user_pre_effect } from '../internal/client/reactivity/effects.js';
 import { mutable_source, set } from '../internal/client/reactivity/sources.js';
 import { hydrate, mount, unmount } from '../internal/client/render.js';
@@ -89,7 +89,7 @@ class Svelte4Component {
 		};
 
 		// Replicate coarse-grained props through a proxy that has a version source for
-		// each property, which is increment on updates to the property itself. Do not
+		// each property, which is incremented on updates to the property itself. Do not
 		// use our $state proxy because that one has fine-grained reactivity.
 		const props = new Proxy(
 			{ ...(options.props || {}), $$events: {} },
@@ -98,6 +98,9 @@ class Svelte4Component {
 					return get(sources.get(prop) ?? add_source(prop, Reflect.get(target, prop)));
 				},
 				has(target, prop) {
+					// Necessary to not throw "invalid binding" validation errors on the component side
+					if (prop === LEGACY_PROPS) return true;
+
 					get(sources.get(prop) ?? add_source(prop, Reflect.get(target, prop)));
 					return Reflect.has(target, prop);
 				},
diff --git a/packages/svelte/tests/runtime-runes/samples/mount-props-updates/_config.js b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/_config.js
new file mode 100644
index 0000000000..ff7af2d524
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/_config.js
@@ -0,0 +1,47 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		assert.htmlEqual(
+			target.innerHTML,
+			// The buz fallback does not propagate back up
+			`
+			<button>reset</button> foo baz
+			<div><button>update</button> foo bar baz buz</div>
+			<div><button>update</button> foo bar baz buz</div>
+			`
+		);
+
+		const [btn1, btn2, btn3] = target.querySelectorAll('button');
+
+		btn2.click();
+		btn3.click();
+		flushSync();
+		assert.htmlEqual(
+			target.innerHTML,
+			// bar is not set in the parent because it's a readonly property
+			// baz is not set in the parent because while it's a bindable property,
+			// it wasn't set initially so it's treated as a readonly proeprty
+			`
+			<button>reset</button> foo 3
+			<div><button>update</button> 1 2 3 4</div>
+			<div><button>update</button> 1 2 3 4</div>
+			`
+		);
+
+		btn1.click();
+		flushSync();
+		assert.htmlEqual(
+			target.innerHTML,
+			// Because foo is a readonly property, component.svelte diverges locally from it,
+			// and the passed in property keeps the initial value of foo. This is why it stays
+			// at 1, because foo is not updated to a different value.
+			`
+				<button>reset</button> foo bar baz buz
+			<div><button>update</button> 1 bar baz buz</div>
+			<div><button>update</button> 1 bar baz buz</div>
+				`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/mount-props-updates/component.svelte b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/component.svelte
new file mode 100644
index 0000000000..214cb7bf72
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/component.svelte
@@ -0,0 +1,17 @@
+<script>
+	let { foo, bar = 'bar', baz = $bindable(), buz = $bindable('buz') } = $props();
+</script>
+
+<button
+	onclick={() => {
+		foo = '1';
+		bar = '2';
+		baz = '3';
+		buz = '4';
+	}}>update</button
+>
+
+{foo}
+{bar}
+{baz}
+{buz}
diff --git a/packages/svelte/tests/runtime-runes/samples/mount-props-updates/main.svelte b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/main.svelte
new file mode 100644
index 0000000000..0769830afb
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/mount-props-updates/main.svelte
@@ -0,0 +1,30 @@
+<script>
+	import { createClassComponent } from 'svelte/legacy';
+	import Component from './component.svelte';
+	import { mount, onMount } from 'svelte';
+
+	let div1, div2;
+	let legacy;
+	const props = $state({ foo: 'foo', baz: 'baz' });
+
+	onMount(() => {
+		legacy = createClassComponent({
+			component: Component,
+			target: div1,
+			props: { foo: 'foo', baz: 'baz' }
+		});
+		mount(Component, { target: div2, props });
+	});
+</script>
+
+<button
+	onclick={() => {
+		legacy.$set({ foo: 'foo', bar: 'bar', baz: 'baz', buz: 'buz' });
+		props.foo = 'foo';
+		props.bar = 'bar';
+		props.baz = 'baz';
+		props.buz = 'buz';
+	}}>reset</button
+> {props.foo} {props.bar} {props.baz} {props.buz}
+<div bind:this={div1}></div>
+<div bind:this={div2}></div>

From 637364104538cdac26e3807fd71e4be6dd2958f8 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 15 Nov 2024 14:32:47 +0100
Subject: [PATCH 162/404] docs: add example to "state instead of stores"
 (#14310)

closes #13879
---
 documentation/docs/06-runtime/01-stores.md | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/documentation/docs/06-runtime/01-stores.md b/documentation/docs/06-runtime/01-stores.md
index 8ea01e5314..9cff5a754f 100644
--- a/documentation/docs/06-runtime/01-stores.md
+++ b/documentation/docs/06-runtime/01-stores.md
@@ -38,6 +38,28 @@ Prior to Svelte 5, stores were the go-to solution for creating cross-component r
 - when extracting logic, it's better to take advantage of runes' universal reactivity: You can use runes outside the top level of components and even place them into JavaScript or TypeScript files (using a `.svelte.js` or `.svelte.ts` file ending)
 - when creating shared state, you can create a `$state` object containing the values you need and then manipulate said state
 
+```ts
+/// file: state.svelte.js
+export const userState = $state({
+	name: 'name',
+	/* ... */
+});
+```
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import { userState } from './state.svelte';
+</script>
+
+<p>User name: {userState.name}</p>
+<button onclick={() => {
+	userState.name = 'new name';
+}}>
+	change name
+</button>
+```
+
 Stores are still a good solution when you have complex asynchronous data streams or it's important to have more manual control over updating values or listening to changes. If you're familiar with RxJs and want to reuse that knowledge, the `$` also comes in handy for you.
 
 ## svelte/store

From efc65d4e0c185cd597a6eeef013f6641b8e25d50 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 15 Nov 2024 14:33:10 +0100
Subject: [PATCH 163/404] fix: mark pseudo classes nested inside `:not` as used
 (#14303)

fixes the css bug part of #14299
---
 .changeset/chatty-singers-sin.md                           | 5 +++++
 .../src/compiler/phases/2-analyze/css/css-analyze.js       | 3 ++-
 .../svelte/src/compiler/phases/2-analyze/css/css-prune.js  | 7 ++++++-
 .../svelte/tests/css/samples/not-selector/expected.css     | 4 ++++
 .../svelte/tests/css/samples/not-selector/input.svelte     | 4 ++++
 5 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/chatty-singers-sin.md

diff --git a/.changeset/chatty-singers-sin.md b/.changeset/chatty-singers-sin.md
new file mode 100644
index 0000000000..f69bc97454
--- /dev/null
+++ b/.changeset/chatty-singers-sin.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: mark pseudo classes nested inside `:not` as used
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 38551f328f..1dd2d9ae7c 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
@@ -150,8 +150,9 @@ const css_visitors = {
 			// 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, {
-					ComplexSelector(node) {
+					ComplexSelector(node, context) {
 						node.metadata.used = true;
+						context.next();
 					}
 				});
 			}
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 bf0fd27566..bfb83d3e02 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
@@ -531,7 +531,12 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				// with descendants, in which case we scope them all.
 				if (name === 'not' && selector.args) {
 					for (const complex_selector of selector.args.children) {
-						complex_selector.metadata.used = true;
+						walk(complex_selector, null, {
+							ComplexSelector(node, context) {
+								node.metadata.used = true;
+								context.next();
+							}
+						});
 						const relative = truncate(complex_selector);
 
 						if (complex_selector.children.length > 1) {
diff --git a/packages/svelte/tests/css/samples/not-selector/expected.css b/packages/svelte/tests/css/samples/not-selector/expected.css
index ea0b3aacac..1b0db0ff4b 100644
--- a/packages/svelte/tests/css/samples/not-selector/expected.css
+++ b/packages/svelte/tests/css/samples/not-selector/expected.css
@@ -29,3 +29,7 @@
 	span.svelte-xyz:not(:focus) {
 		color: green;
 	}
+
+	p.svelte-xyz:not(:has(span)) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/not-selector/input.svelte b/packages/svelte/tests/css/samples/not-selector/input.svelte
index 3a786530a2..da8f4579c2 100644
--- a/packages/svelte/tests/css/samples/not-selector/input.svelte
+++ b/packages/svelte/tests/css/samples/not-selector/input.svelte
@@ -36,4 +36,8 @@
 	span:not(:focus) {
 		color: green;
 	}
+
+	p:not(:has(span)) {
+		color: green;
+	}
 </style>
\ No newline at end of file

From 1f0700f5c597174e51d6e07407b078c8314486fc Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 15 Nov 2024 23:40:08 +0100
Subject: [PATCH 164/404] fix: mark subtree dynamic for img with loading
 attribute (#14317)

* fix: mark subtree dynamic for img with loading attribute

* chore: unify conditions

* chore: change conditions
---
 .changeset/rotten-turkeys-sniff.md                    |  5 +++++
 .../compiler/phases/2-analyze/visitors/Attribute.js   | 11 ++++++++---
 .../_expected/client/index.svelte.js                  |  6 +++++-
 .../_expected/server/index.svelte.js                  |  2 +-
 .../snapshot/samples/skip-static-subtree/index.svelte |  5 ++++-
 5 files changed, 23 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/rotten-turkeys-sniff.md

diff --git a/.changeset/rotten-turkeys-sniff.md b/.changeset/rotten-turkeys-sniff.md
new file mode 100644
index 0000000000..53fb5bd663
--- /dev/null
+++ b/.changeset/rotten-turkeys-sniff.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: mark subtree dynamic for img with loading attribute
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 6931f873fb..ca0ea55d1f 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
@@ -18,9 +18,14 @@ export function Attribute(node, context) {
 
 	const parent = /** @type {SvelteNode} */ (context.path.at(-1));
 
-	// special case
-	if (node.name === 'value') {
-		if (parent.type === 'RegularElement' && parent.name === 'option') {
+	if (parent.type === 'RegularElement') {
+		// special case <option value="" />
+		if (node.name === 'value' && parent.name === 'option') {
+			mark_subtree_dynamic(context.path);
+		}
+
+		// special case <img loading="lazy" />
+		if (node.name === 'loading' && parent.name === 'img') {
 			mark_subtree_dynamic(context.path);
 		}
 	}
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
index ae79efef42..8dd7df82cf 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/client/index.svelte.js
@@ -1,7 +1,7 @@
 import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 
-var root = $.template(`<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1> </h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> <!> <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements></custom-elements></cant-skip> <div><input></div> <div><source></div> <select><option>a</option></select> <img src="..." alt="" loading="lazy">`, 3);
+var root = $.template(`<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1> </h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> <!> <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements></custom-elements></cant-skip> <div><input></div> <div><source></div> <select><option>a</option></select> <img src="..." alt="" loading="lazy"> <div><img src="..." alt="" loading="lazy"></div>`, 3);
 
 export default function Skip_static_subtree($$anchor, $$props) {
 	var fragment = root();
@@ -42,8 +42,12 @@ export default function Skip_static_subtree($$anchor, $$props) {
 	$.reset(select);
 
 	var img = $.sibling(select, 2);
+	var div_2 = $.sibling(img, 2);
+	var img_1 = $.child(div_2);
 
+	$.reset(div_2);
 	$.template_effect(() => $.set_text(text, $$props.title));
 	$.handle_lazy_img(img);
+	$.handle_lazy_img(img_1);
 	$.append($$anchor, fragment);
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
index d09ac657f9..309f5a2b57 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
@@ -3,5 +3,5 @@ import * as $ from "svelte/internal/server";
 export default function Skip_static_subtree($$payload, $$props) {
 	let { title, content } = $$props;
 
-	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus></div> <div><source muted></div> <select><option value="a">a</option></select> <img src="..." alt="" loading="lazy">`;
+	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus></div> <div><source muted></div> <select><option value="a">a</option></select> <img src="..." alt="" loading="lazy"> <div><img src="..." alt="" loading="lazy"></div>`;
 }
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte b/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
index cb73eba707..4533a261a0 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/index.svelte
@@ -44,4 +44,7 @@
 	<option value="a">a</option>
 </select>
 
-<img src="..." alt="" loading="lazy" />
\ No newline at end of file
+<img src="..." alt="" loading="lazy" />
+<div>
+	<img src="..." alt="" loading="lazy" />
+</div>
\ No newline at end of file

From 94471ca38e9752c08dde1620916b76ff517b369b Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 15 Nov 2024 23:50:47 +0100
Subject: [PATCH 165/404] fix: avoid relying on Node specifics within compiler
 (#14314)

fixes #14294
---
 .changeset/strange-adults-visit.md               |  5 +++++
 packages/svelte/src/compiler/validate-options.js | 16 ++++++++++++----
 2 files changed, 17 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/strange-adults-visit.md

diff --git a/.changeset/strange-adults-visit.md b/.changeset/strange-adults-visit.md
new file mode 100644
index 0000000000..06cc667dac
--- /dev/null
+++ b/.changeset/strange-adults-visit.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: avoid relying on Node specifics within compiler
diff --git a/packages/svelte/src/compiler/validate-options.js b/packages/svelte/src/compiler/validate-options.js
index 9465cba77a..ab932ed5bc 100644
--- a/packages/svelte/src/compiler/validate-options.js
+++ b/packages/svelte/src/compiler/validate-options.js
@@ -1,5 +1,3 @@
-import process from 'node:process';
-
 /** @import { ModuleCompileOptions, ValidatedModuleCompileOptions, CompileOptions, ValidatedCompileOptions } from '#compiler' */
 import * as e from './errors.js';
 import * as w from './warnings.js';
@@ -13,9 +11,19 @@ import * as w from './warnings.js';
 const common = {
 	filename: string('(unknown)'),
 
-	// default to process.cwd() where it exists to replicate svelte4 behavior
+	// default to process.cwd() where it exists to replicate svelte4 behavior (and make Deno work with this as well)
 	// see https://github.com/sveltejs/svelte/blob/b62fc8c8fd2640c9b99168f01b9d958cb2f7574f/packages/svelte/src/compiler/compile/Component.js#L211
-	rootDir: string(typeof process !== 'undefined' ? process.cwd?.() : undefined),
+	/* eslint-disable */
+	rootDir: string(
+		typeof process !== 'undefined'
+			? process.cwd?.()
+			: // @ts-expect-error
+				typeof Deno !== 'undefined'
+				? // @ts-expect-error
+					Deno.cwd()
+				: undefined
+	),
+	/* eslint-enable */
 
 	dev: boolean(false),
 

From 95ab85fad742d9911bbe87561dfaf9f868f75eaf Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sat, 16 Nov 2024 00:07:08 +0000
Subject: [PATCH 166/404] Version Packages (#14304)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/chatty-singers-sin.md   |  5 -----
 .changeset/fast-ligers-repeat.md   |  5 -----
 .changeset/fresh-pigs-divide.md    |  5 -----
 .changeset/rotten-turkeys-sniff.md |  5 -----
 .changeset/strange-adults-visit.md |  5 -----
 packages/svelte/CHANGELOG.md       | 14 ++++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 8 files changed, 16 insertions(+), 27 deletions(-)
 delete mode 100644 .changeset/chatty-singers-sin.md
 delete mode 100644 .changeset/fast-ligers-repeat.md
 delete mode 100644 .changeset/fresh-pigs-divide.md
 delete mode 100644 .changeset/rotten-turkeys-sniff.md
 delete mode 100644 .changeset/strange-adults-visit.md

diff --git a/.changeset/chatty-singers-sin.md b/.changeset/chatty-singers-sin.md
deleted file mode 100644
index f69bc97454..0000000000
--- a/.changeset/chatty-singers-sin.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: mark pseudo classes nested inside `:not` as used
diff --git a/.changeset/fast-ligers-repeat.md b/.changeset/fast-ligers-repeat.md
deleted file mode 100644
index c6b35c4373..0000000000
--- a/.changeset/fast-ligers-repeat.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: disallow invalid attributes for `<svelte:window>` and `<svelte:document>`
diff --git a/.changeset/fresh-pigs-divide.md b/.changeset/fresh-pigs-divide.md
deleted file mode 100644
index 8aa3d74ce9..0000000000
--- a/.changeset/fresh-pigs-divide.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure props passed to components via mount are updateable
diff --git a/.changeset/rotten-turkeys-sniff.md b/.changeset/rotten-turkeys-sniff.md
deleted file mode 100644
index 53fb5bd663..0000000000
--- a/.changeset/rotten-turkeys-sniff.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: mark subtree dynamic for img with loading attribute
diff --git a/.changeset/strange-adults-visit.md b/.changeset/strange-adults-visit.md
deleted file mode 100644
index 06cc667dac..0000000000
--- a/.changeset/strange-adults-visit.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: avoid relying on Node specifics within compiler
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index f7e17f14f9..5888348409 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,19 @@
 # svelte
 
+## 5.2.1
+
+### Patch Changes
+
+- fix: mark pseudo classes nested inside `:not` as used ([#14303](https://github.com/sveltejs/svelte/pull/14303))
+
+- fix: disallow invalid attributes for `<svelte:window>` and `<svelte:document>` ([#14228](https://github.com/sveltejs/svelte/pull/14228))
+
+- fix: ensure props passed to components via mount are updateable ([#14210](https://github.com/sveltejs/svelte/pull/14210))
+
+- fix: mark subtree dynamic for img with loading attribute ([#14317](https://github.com/sveltejs/svelte/pull/14317))
+
+- fix: avoid relying on Node specifics within compiler ([#14314](https://github.com/sveltejs/svelte/pull/14314))
+
 ## 5.2.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index b23d031a17..9989394873 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.2.0",
+  "version": "5.2.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index e3d34edc4e..1f6874e75e 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.2.0';
+export const VERSION = '5.2.1';
 export const PUBLIC_VERSION = '5';

From 3a69b4c41533757ea0e3c7e293bd41818a833ead Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sat, 16 Nov 2024 17:10:45 +0000
Subject: [PATCH 167/404] fix: ensure inline object literals are correctly
 serialised (#14325)

* fix: ensure inline object literals are correctly serialised

* Apply suggestions from code review

* address feedback

* address feedback

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/wicked-readers-knock.md            |  5 ++++
 .../phases/2-analyze/visitors/shared/utils.js | 27 ++++++++++++++++---
 .../samples/inline-expressions-2/_config.js   | 11 ++++++++
 .../samples/inline-expressions-2/main.svelte  |  6 +++++
 4 files changed, 46 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/wicked-readers-knock.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte

diff --git a/.changeset/wicked-readers-knock.md b/.changeset/wicked-readers-knock.md
new file mode 100644
index 0000000000..4ec417402f
--- /dev/null
+++ b/.changeset/wicked-readers-knock.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treat property accesses of literals as pure
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
index 82356ea619..2dec4361c8 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
@@ -1,4 +1,4 @@
-/** @import { AssignmentExpression, Expression, Identifier, Pattern, PrivateIdentifier, Super, UpdateExpression, VariableDeclarator } from 'estree' */
+/** @import { AssignmentExpression, Expression, Literal, Pattern, PrivateIdentifier, Super, UpdateExpression, VariableDeclarator } from 'estree' */
 /** @import { AST, Binding } from '#compiler' */
 /** @import { AnalysisState, Context } from '../../types' */
 /** @import { Scope } from '../../../scope' */
@@ -176,21 +176,42 @@ export function is_safe_identifier(expression, scope) {
 }
 
 /**
- * @param {Expression | Super} node
+ * @param {Expression | Literal | Super} node
  * @param {Context} context
  * @returns {boolean}
  */
 export function is_pure(node, context) {
+	if (node.type === 'Literal') {
+		return true;
+	}
+	if (node.type === 'CallExpression') {
+		if (!is_pure(node.callee, context)) {
+			return false;
+		}
+		for (let arg of node.arguments) {
+			if (!is_pure(arg.type === 'SpreadElement' ? arg.argument : arg, context)) {
+				return false;
+			}
+		}
+		return true;
+	}
 	if (node.type !== 'Identifier' && node.type !== 'MemberExpression') {
 		return false;
 	}
 
-	const left = object(node);
+	/** @type {Expression | Super | null} */
+	let left = node;
+	while (left.type === 'MemberExpression') {
+		left = left.object;
+	}
+
 	if (!left) return false;
 
 	if (left.type === 'Identifier') {
 		const binding = context.state.scope.get(left.name);
 		if (binding === null) return true; // globals are assumed to be safe
+	} else if (is_pure(left, context)) {
+		return true;
 	}
 
 	// TODO add more cases (safe Svelte imports, etc)
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
new file mode 100644
index 0000000000..1869540b2c
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
@@ -0,0 +1,11 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<p>Without text expression: 7.36</p>
+		<p>With text expression: 7.36</p>
+		<p>With text expression and function call: 7.36</p>
+		<p>With text expression and property access: 4</p>
+		<h1>Hello name!</h1>
+		<p>4</p>`
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte
new file mode 100644
index 0000000000..78a325dcc4
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte
@@ -0,0 +1,6 @@
+<p>Without text expression: 7.36</p>
+<p>With text expression: {7.36}</p>
+<p>With text expression and function call: {(7.36).toLocaleString()}</p>
+<p>With text expression and property access: {"test".length}</p>
+<h1>Hello {('name').toUpperCase().toLowerCase()}!</h1>
+<p>{"test".length}</p>

From 396ea2ef370e7ea5b5d4571c4e5e14384bac3ca6 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sat, 16 Nov 2024 17:13:21 +0000
Subject: [PATCH 168/404] Version Packages (#14328)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/wicked-readers-knock.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/wicked-readers-knock.md

diff --git a/.changeset/wicked-readers-knock.md b/.changeset/wicked-readers-knock.md
deleted file mode 100644
index 4ec417402f..0000000000
--- a/.changeset/wicked-readers-knock.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treat property accesses of literals as pure
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 5888348409..64b04e0fc2 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.2.2
+
+### Patch Changes
+
+- fix: treat property accesses of literals as pure ([#14325](https://github.com/sveltejs/svelte/pull/14325))
+
 ## 5.2.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 9989394873..8c9efb00de 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.2.1",
+  "version": "5.2.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1f6874e75e..db950a129a 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.2.1';
+export const VERSION = '5.2.2';
 export const PUBLIC_VERSION = '5';

From 24ebbcbbc19701987d7560c4fe3952e8c24432ef Mon Sep 17 00:00:00 2001
From: Gwen Le Bihan <hey@ewen.works>
Date: Sun, 17 Nov 2024 23:27:34 +0100
Subject: [PATCH 169/404] docs: use e.detail instead of e.details in migration
 examples (#14340)

---
 documentation/docs/07-misc/07-v5-migration-guide.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/documentation/docs/07-misc/07-v5-migration-guide.md b/documentation/docs/07-misc/07-v5-migration-guide.md
index 4ebfb5f905..687f8e93b1 100644
--- a/documentation/docs/07-misc/07-v5-migration-guide.md
+++ b/documentation/docs/07-misc/07-v5-migration-guide.md
@@ -169,11 +169,11 @@ This function is deprecated in Svelte 5. Instead, components should accept _call
 
 <Pump
 	---on:---inflate={(power) => {
-		size += power---.details---;
+		size += power---.detail---;
 		if (size > 75) burst = true;
 	}}
 	---on:---deflate={(power) => {
-		if (size > 0) size -= power---.details---;
+		if (size > 0) size -= power---.detail---;
 	}}
 />
 
@@ -317,7 +317,7 @@ When spreading props, local event handlers must go _after_ the spread, or they r
 > - import the function
 > - call the function to get a dispatch function
 > - call said dispatch function with a string and possibly a payload
-> - retrieve said payload on the other end through a `.details` property, because the event itself was always a `CustomEvent`
+> - retrieve said payload on the other end through a `.detail` property, because the event itself was always a `CustomEvent`
 >
 > It was always possible to use component callback props, but because you had to listen to DOM events using `on:`, it made sense to use `createEventDispatcher` for component events due to syntactical consistency. Now that we have event attributes (`onclick`), it's the other way around: Callback props are now the more sensible thing to do.
 >

From 1c454c236eeb00fab04007b4c8b9ae0f475e9cf6 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 18 Nov 2024 14:24:55 +0000
Subject: [PATCH 170/404] fix: ensure dynamic call expressions correctly
 generate output (#14345)

---
 .changeset/moody-bears-change.md                             | 5 +++++
 .../src/compiler/phases/2-analyze/visitors/CallExpression.js | 2 ++
 .../samples/inline-expressions-subtree/_config.js            | 5 +++++
 .../samples/inline-expressions-subtree/main.svelte           | 4 ++++
 4 files changed, 16 insertions(+)
 create mode 100644 .changeset/moody-bears-change.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/main.svelte

diff --git a/.changeset/moody-bears-change.md b/.changeset/moody-bears-change.md
new file mode 100644
index 0000000000..0bf32026d2
--- /dev/null
+++ b/.changeset/moody-bears-change.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure dynamic call expressions correctly generate output
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 2ae32e80e1..fe3f638a69 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -5,6 +5,7 @@ import { get_rune } from '../../scope.js';
 import * as e from '../../../errors.js';
 import { get_parent, unwrap_optional } from '../../../utils/ast.js';
 import { is_pure, is_safe_identifier } from './shared/utils.js';
+import { mark_subtree_dynamic } from './shared/fragment.js';
 
 /**
  * @param {CallExpression} node
@@ -179,6 +180,7 @@ export function CallExpression(node, context) {
 			context.state.expression.has_call = true;
 			context.state.expression.has_state = true;
 			context.state.expression.can_inline = false;
+			mark_subtree_dynamic(context.path);
 		}
 	}
 }
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/_config.js
new file mode 100644
index 0000000000..17c573a510
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<span class="red">A</span>\n<div><span class="red">B</span></div>'
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/main.svelte b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/main.svelte
new file mode 100644
index 0000000000..555dc8af23
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-subtree/main.svelte
@@ -0,0 +1,4 @@
+<span class={(() => 'red')()}>A</span>
+<div>
+  <span class={(() => 'red')()}>B</span>
+</div>

From b145035a00525770abe9116e3887c050e19340ea Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 18 Nov 2024 15:23:13 +0000
Subject: [PATCH 171/404] Version Packages (#14348)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/moody-bears-change.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/moody-bears-change.md

diff --git a/.changeset/moody-bears-change.md b/.changeset/moody-bears-change.md
deleted file mode 100644
index 0bf32026d2..0000000000
--- a/.changeset/moody-bears-change.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure dynamic call expressions correctly generate output
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 64b04e0fc2..d36307c80c 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.2.3
+
+### Patch Changes
+
+- fix: ensure dynamic call expressions correctly generate output ([#14345](https://github.com/sveltejs/svelte/pull/14345))
+
 ## 5.2.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 8c9efb00de..50319c77aa 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.2.2",
+  "version": "5.2.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index db950a129a..b79e9a2891 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.2.2';
+export const VERSION = '5.2.3';
 export const PUBLIC_VERSION = '5';

From 012166ec3c2a4f199d0314444519096bc21d3715 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Santiago=20C=C3=A9zar?=
 <48573316+santiagocezar@users.noreply.github.com>
Date: Tue, 19 Nov 2024 13:48:01 -0300
Subject: [PATCH 172/404] fix: convert input value to number on hydration
 (#14349)

* convert input value to number on hydration

* add test

* changeset

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/wicked-grapes-flash.md               |  5 +++++
 .../client/dom/elements/bindings/input.js       |  2 +-
 .../hydrate-modified-input-numeric/_config.js   | 17 +++++++++++++++++
 .../hydrate-modified-input-numeric/main.svelte  |  6 ++++++
 4 files changed, 29 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/wicked-grapes-flash.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/main.svelte

diff --git a/.changeset/wicked-grapes-flash.md b/.changeset/wicked-grapes-flash.md
new file mode 100644
index 0000000000..75ff68a728
--- /dev/null
+++ b/.changeset/wicked-grapes-flash.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: coerce value to number when hydrating range/number input with changed value
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 e528d1699e..aec6f815a0 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -45,7 +45,7 @@ export function bind_value(input, get, set = get) {
 		// If we are hydrating and the value has since changed, then use the update value
 		// from the input instead.
 		if (hydrating && input.defaultValue !== input.value) {
-			set(input.value);
+			set(is_numberlike_input(input) ? to_number(input.value) : input.value);
 			return;
 		}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/_config.js b/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/_config.js
new file mode 100644
index 0000000000..f4b5037890
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/_config.js
@@ -0,0 +1,17 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	skip_mode: ['client'],
+
+	test({ assert, target, hydrate }) {
+		const input = /** @type {HTMLInputElement} */ (target.querySelector('input'));
+		input.value = '1';
+		input.dispatchEvent(new window.Event('input'));
+		// Hydration shouldn't reset the value to empty
+		hydrate();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, '<input type="number">\n1 (number)');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/main.svelte b/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/main.svelte
new file mode 100644
index 0000000000..a10f3cec1e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/hydrate-modified-input-numeric/main.svelte
@@ -0,0 +1,6 @@
+<script>
+	let value = $state(0);
+</script>
+
+<input type="number" bind:value={value}>
+{value} ({typeof value})

From 6e8267f46277592f6f6afb6f77d62d3d9d740605 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 19 Nov 2024 16:48:30 +0000
Subject: [PATCH 173/404] fix: correctly update dynamic member expressions
 (#14359)

* fix: output template effect for svg xlink attribute

* mark subtree dynamic in MemberExpression visitor

* don't treat attributes and text nodes differently

* Update .changeset/serious-spiders-bake.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/serious-spiders-bake.md                  |  5 +++++
 .../phases/2-analyze/visitors/Identifier.js         | 13 ++++---------
 .../phases/2-analyze/visitors/MemberExpression.js   |  3 +++
 .../samples/inline-expressions-3/_config.js         |  5 +++++
 .../samples/inline-expressions-3/main.svelte        |  9 +++++++++
 .../samples/inline-expressions-3/sprites.js         |  3 +++
 .../_expected/client/index.svelte.js                |  2 +-
 7 files changed, 30 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/serious-spiders-bake.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/main.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/sprites.js

diff --git a/.changeset/serious-spiders-bake.md b/.changeset/serious-spiders-bake.md
new file mode 100644
index 0000000000..b1f9d84a3f
--- /dev/null
+++ b/.changeset/serious-spiders-bake.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly update dynamic member expressions
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
index 635f939c75..042c467df1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
@@ -126,16 +126,11 @@ export function Identifier(node, context) {
 		}
 	}
 
-	if (!can_inline && context.state.expression) {
-		context.state.expression.can_inline = false;
-	}
+	if (!can_inline) {
+		if (context.state.expression) {
+			context.state.expression.can_inline = false;
+		}
 
-	/**
-	 * if the identifier is part of an expression tag of an attribute we want to check if it's inlinable
-	 * before marking the subtree as dynamic. This is because if it's inlinable it will be inlined in the template
-	 * directly making the whole thing actually static.
-	 */
-	if (!can_inline || !context.path.find((node) => node.type === 'Attribute')) {
 		mark_subtree_dynamic(context.path);
 	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
index adcc2da422..88adecbd35 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
@@ -4,6 +4,7 @@ import * as e from '../../../errors.js';
 import * as w from '../../../warnings.js';
 import { object } from '../../../utils/ast.js';
 import { is_pure, is_safe_identifier } from './shared/utils.js';
+import { mark_subtree_dynamic } from './shared/fragment.js';
 
 /**
  * @param {MemberExpression} node
@@ -20,6 +21,8 @@ export function MemberExpression(node, context) {
 	if (context.state.expression && !is_pure(node, context)) {
 		context.state.expression.has_state = true;
 		context.state.expression.can_inline = false;
+
+		mark_subtree_dynamic(context.path);
 	}
 
 	if (!is_safe_identifier(node, context.state.scope)) {
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/_config.js
new file mode 100644
index 0000000000..c229f97e07
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<div><svg aria-hidden="true" height="14" width="13"><use xlink:href="test#done"></use></svg></div`
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/main.svelte b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/main.svelte
new file mode 100644
index 0000000000..48549d5479
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import { sprites } from './sprites.js'
+</script>
+
+<div>
+	<svg width="13" height="14" aria-hidden="true">
+    <use xlink:href="{sprites['a']}#done"></use>
+  </svg>
+</div>
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/sprites.js b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/sprites.js
new file mode 100644
index 0000000000..055fdbd59a
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-3/sprites.js
@@ -0,0 +1,3 @@
+export const sprites = {
+	a: 'test'
+};
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
index 75e632239e..4622624424 100644
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
@@ -11,7 +11,7 @@ var root = $.template(`<picture><source srcset="${__DECLARED_ASSET_0__}" type="i
 
 export default function Inline_module_vars($$anchor) {
 	var fragment = root();
-	var p = $.sibling($.first_child(fragment), 2);
 
+	$.next(2);
 	$.append($$anchor, fragment);
 }
\ No newline at end of file

From f6117bb3285c4aaf0d9003b2cca73d8a60150d8b Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 19 Nov 2024 18:06:32 +0000
Subject: [PATCH 174/404] chore: add ssr benchmark suite (#14361)

* chore: add ssr benchmark suite

* lint

* Update benchmarking/run.js

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

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 benchmarking/.gitignore                       |  1 +
 .../reactivity/index.js}                      | 25 +++++------
 .../{ => reactivity}/kairo/kairo_avoidable.js |  4 +-
 .../{ => reactivity}/kairo/kairo_broad.js     |  4 +-
 .../{ => reactivity}/kairo/kairo_deep.js      |  4 +-
 .../{ => reactivity}/kairo/kairo_diamond.js   |  4 +-
 .../{ => reactivity}/kairo/kairo_mux.js       |  4 +-
 .../{ => reactivity}/kairo/kairo_repeated.js  |  4 +-
 .../{ => reactivity}/kairo/kairo_triangle.js  |  4 +-
 .../{ => reactivity}/kairo/kairo_unstable.js  |  4 +-
 .../benchmarks/{ => reactivity}/kairo/util.js |  0
 .../benchmarks/{ => reactivity}/mol_bench.js  |  4 +-
 .../benchmarks/{ => reactivity}/sbench.js     |  4 +-
 benchmarking/benchmarks/ssr/index.js          |  3 ++
 .../benchmarks/ssr/wrapper/App.svelte         | 31 ++++++++++++++
 .../benchmarks/ssr/wrapper/wrapper_bench.js   | 36 ++++++++++++++++
 benchmarking/run.js                           | 41 +++++++++++++++----
 benchmarking/utils.js                         | 21 ++++++++++
 18 files changed, 155 insertions(+), 43 deletions(-)
 create mode 100644 benchmarking/.gitignore
 rename benchmarking/{benchmarks.js => benchmarks/reactivity/index.js} (63%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_avoidable.js (93%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_broad.js (92%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_deep.js (92%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_diamond.js (92%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_mux.js (93%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_repeated.js (92%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_triangle.js (93%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/kairo_unstable.js (92%)
 rename benchmarking/benchmarks/{ => reactivity}/kairo/util.js (100%)
 rename benchmarking/benchmarks/{ => reactivity}/mol_bench.js (95%)
 rename benchmarking/benchmarks/{ => reactivity}/sbench.js (98%)
 create mode 100644 benchmarking/benchmarks/ssr/index.js
 create mode 100644 benchmarking/benchmarks/ssr/wrapper/App.svelte
 create mode 100644 benchmarking/benchmarks/ssr/wrapper/wrapper_bench.js

diff --git a/benchmarking/.gitignore b/benchmarking/.gitignore
new file mode 100644
index 0000000000..53752db253
--- /dev/null
+++ b/benchmarking/.gitignore
@@ -0,0 +1 @@
+output
diff --git a/benchmarking/benchmarks.js b/benchmarking/benchmarks/reactivity/index.js
similarity index 63%
rename from benchmarking/benchmarks.js
rename to benchmarking/benchmarks/reactivity/index.js
index 795ac3e09e..58b3f5cb29 100644
--- a/benchmarking/benchmarks.js
+++ b/benchmarking/benchmarks/reactivity/index.js
@@ -1,15 +1,12 @@
-import {
-	kairo_avoidable_owned,
-	kairo_avoidable_unowned
-} from './benchmarks/kairo/kairo_avoidable.js';
-import { kairo_broad_owned, kairo_broad_unowned } from './benchmarks/kairo/kairo_broad.js';
-import { kairo_deep_owned, kairo_deep_unowned } from './benchmarks/kairo/kairo_deep.js';
-import { kairo_diamond_owned, kairo_diamond_unowned } from './benchmarks/kairo/kairo_diamond.js';
-import { kairo_mux_unowned, kairo_mux_owned } from './benchmarks/kairo/kairo_mux.js';
-import { kairo_repeated_unowned, kairo_repeated_owned } from './benchmarks/kairo/kairo_repeated.js';
-import { kairo_triangle_owned, kairo_triangle_unowned } from './benchmarks/kairo/kairo_triangle.js';
-import { kairo_unstable_owned, kairo_unstable_unowned } from './benchmarks/kairo/kairo_unstable.js';
-import { mol_bench_owned, mol_bench_unowned } from './benchmarks/mol_bench.js';
+import { kairo_avoidable_owned, kairo_avoidable_unowned } from './kairo/kairo_avoidable.js';
+import { kairo_broad_owned, kairo_broad_unowned } from './kairo/kairo_broad.js';
+import { kairo_deep_owned, kairo_deep_unowned } from './kairo/kairo_deep.js';
+import { kairo_diamond_owned, kairo_diamond_unowned } from './kairo/kairo_diamond.js';
+import { kairo_mux_unowned, kairo_mux_owned } from './kairo/kairo_mux.js';
+import { kairo_repeated_unowned, kairo_repeated_owned } from './kairo/kairo_repeated.js';
+import { kairo_triangle_owned, kairo_triangle_unowned } from './kairo/kairo_triangle.js';
+import { kairo_unstable_owned, kairo_unstable_unowned } from './kairo/kairo_unstable.js';
+import { mol_bench_owned, mol_bench_unowned } from './mol_bench.js';
 import {
 	sbench_create_0to1,
 	sbench_create_1000to1,
@@ -21,12 +18,12 @@ import {
 	sbench_create_2to1,
 	sbench_create_4to1,
 	sbench_create_signals
-} from './benchmarks/sbench.js';
+} from './sbench.js';
 
 // This benchmark has been adapted from the js-reactivity-benchmark (https://github.com/milomg/js-reactivity-benchmark)
 // Not all tests are the same, and many parts have been tweaked to capture different data.
 
-export const benchmarks = [
+export const reactivity_benchmarks = [
 	sbench_create_signals,
 	sbench_create_0to1,
 	sbench_create_1to1,
diff --git a/benchmarking/benchmarks/kairo/kairo_avoidable.js b/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
similarity index 93%
rename from benchmarking/benchmarks/kairo/kairo_avoidable.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
index 76bd4c72e3..1237547ebe 100644
--- a/benchmarking/benchmarks/kairo/kairo_avoidable.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 import { busy } from './util.js';
 
 function setup() {
diff --git a/benchmarking/benchmarks/kairo/kairo_broad.js b/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
similarity index 92%
rename from benchmarking/benchmarks/kairo/kairo_broad.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
index d7b37d153c..8148a743ea 100644
--- a/benchmarking/benchmarks/kairo/kairo_broad.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 function setup() {
 	let head = $.state(0);
diff --git a/benchmarking/benchmarks/kairo/kairo_deep.js b/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
similarity index 92%
rename from benchmarking/benchmarks/kairo/kairo_deep.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
index cc29940738..806042cc72 100644
--- a/benchmarking/benchmarks/kairo/kairo_deep.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 let len = 50;
 const iter = 50;
diff --git a/benchmarking/benchmarks/kairo/kairo_diamond.js b/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
similarity index 92%
rename from benchmarking/benchmarks/kairo/kairo_diamond.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
index 0492454966..deb9482de9 100644
--- a/benchmarking/benchmarks/kairo/kairo_diamond.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 let width = 5;
 
diff --git a/benchmarking/benchmarks/kairo/kairo_mux.js b/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
similarity index 93%
rename from benchmarking/benchmarks/kairo/kairo_mux.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
index 769e14c43e..8eafacc9eb 100644
--- a/benchmarking/benchmarks/kairo/kairo_mux.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 function setup() {
 	let heads = new Array(100).fill(null).map((_) => $.state(0));
diff --git a/benchmarking/benchmarks/kairo/kairo_repeated.js b/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
similarity index 92%
rename from benchmarking/benchmarks/kairo/kairo_repeated.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
index 2416f89dfd..2bddf879c9 100644
--- a/benchmarking/benchmarks/kairo/kairo_repeated.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 let size = 30;
 
diff --git a/benchmarking/benchmarks/kairo/kairo_triangle.js b/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
similarity index 93%
rename from benchmarking/benchmarks/kairo/kairo_triangle.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
index ee9311c96a..9d99b7815b 100644
--- a/benchmarking/benchmarks/kairo/kairo_triangle.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 let width = 10;
 
diff --git a/benchmarking/benchmarks/kairo/kairo_unstable.js b/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
similarity index 92%
rename from benchmarking/benchmarks/kairo/kairo_unstable.js
rename to benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
index b05fc0745a..c30c007561 100644
--- a/benchmarking/benchmarks/kairo/kairo_unstable.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../../utils.js';
-import * as $ from '../../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 function setup() {
 	let head = $.state(0);
diff --git a/benchmarking/benchmarks/kairo/util.js b/benchmarking/benchmarks/reactivity/kairo/util.js
similarity index 100%
rename from benchmarking/benchmarks/kairo/util.js
rename to benchmarking/benchmarks/reactivity/kairo/util.js
diff --git a/benchmarking/benchmarks/mol_bench.js b/benchmarking/benchmarks/reactivity/mol_bench.js
similarity index 95%
rename from benchmarking/benchmarks/mol_bench.js
rename to benchmarking/benchmarks/reactivity/mol_bench.js
index a962f5e148..c9f492f619 100644
--- a/benchmarking/benchmarks/mol_bench.js
+++ b/benchmarking/benchmarks/reactivity/mol_bench.js
@@ -1,5 +1,5 @@
-import { assert, fastest_test } from '../utils.js';
-import * as $ from '../../packages/svelte/src/internal/client/index.js';
+import { assert, fastest_test } from '../../utils.js';
+import * as $ from 'svelte/internal/client';
 
 /**
  * @param {number} n
diff --git a/benchmarking/benchmarks/sbench.js b/benchmarking/benchmarks/reactivity/sbench.js
similarity index 98%
rename from benchmarking/benchmarks/sbench.js
rename to benchmarking/benchmarks/reactivity/sbench.js
index f390d84463..ddeaef2514 100644
--- a/benchmarking/benchmarks/sbench.js
+++ b/benchmarking/benchmarks/reactivity/sbench.js
@@ -1,5 +1,5 @@
-import { fastest_test } from '../utils.js';
-import * as $ from '../../packages/svelte/src/internal/client/index.js';
+import { fastest_test } from '../../utils.js';
+import * as $ from '../../../packages/svelte/src/internal/client/index.js';
 
 const COUNT = 1e5;
 
diff --git a/benchmarking/benchmarks/ssr/index.js b/benchmarking/benchmarks/ssr/index.js
new file mode 100644
index 0000000000..667137d1ed
--- /dev/null
+++ b/benchmarking/benchmarks/ssr/index.js
@@ -0,0 +1,3 @@
+import { wrapper_bench } from './wrapper/wrapper_bench.js';
+
+export const ssr_benchmarks = [wrapper_bench];
diff --git a/benchmarking/benchmarks/ssr/wrapper/App.svelte b/benchmarking/benchmarks/ssr/wrapper/App.svelte
new file mode 100644
index 0000000000..93f031f2bc
--- /dev/null
+++ b/benchmarking/benchmarks/ssr/wrapper/App.svelte
@@ -0,0 +1,31 @@
+<script>
+	const wrapperWidth = 960;
+	const wrapperHeight = 720;
+	const cellSize = 10;
+	const centerX = wrapperWidth / 2;
+	const centerY = wrapperHeight / 2;
+
+	let angle = 0;
+	let radius = 0;
+
+	let tiles = [];
+	const step = cellSize;
+
+	while (radius < Math.min(wrapperWidth, wrapperHeight) / 2) {
+		let x = centerX + Math.cos(angle) * radius;
+		let y = centerY + Math.sin(angle) * radius;
+
+		if (x >= 0 && x <= wrapperWidth - cellSize && y >= 0 && y <= wrapperHeight - cellSize) {
+			tiles.push({ x, y });
+		}
+
+		angle += 0.2;
+		radius += step * 0.015;
+	}
+</script>
+
+<div id="wrapper">
+	{#each tiles as { x, y }}
+		<div class="tile" style="left: {x.toFixed(2)}px; top: {y.toFixed(2)}px;"></div>
+	{/each}
+</div>
diff --git a/benchmarking/benchmarks/ssr/wrapper/wrapper_bench.js b/benchmarking/benchmarks/ssr/wrapper/wrapper_bench.js
new file mode 100644
index 0000000000..ba0457b80e
--- /dev/null
+++ b/benchmarking/benchmarks/ssr/wrapper/wrapper_bench.js
@@ -0,0 +1,36 @@
+import { render } from 'svelte/server';
+import { fastest_test, read_file, write } from '../../../utils.js';
+import { compile } from 'svelte/compiler';
+
+const dir = `${process.cwd()}/benchmarking/benchmarks/ssr/wrapper`;
+
+async function compile_svelte() {
+	const output = compile(read_file(`${dir}/App.svelte`), {
+		generate: 'server'
+	});
+	write(`${dir}/output/App.js`, output.js.code);
+
+	const module = await import(`${dir}/output/App.js`);
+
+	return module.default;
+}
+
+export async function wrapper_bench() {
+	const App = await compile_svelte();
+	// Do 3 loops to warm up JIT
+	for (let i = 0; i < 3; i++) {
+		render(App);
+	}
+
+	const { timing } = await fastest_test(10, () => {
+		for (let i = 0; i < 100; i++) {
+			render(App);
+		}
+	});
+
+	return {
+		benchmark: 'wrapper_bench',
+		time: timing.time.toFixed(2),
+		gc_time: timing.gc_time.toFixed(2)
+	};
+}
diff --git a/benchmarking/run.js b/benchmarking/run.js
index 35a6ac307f..bd96b9c2dc 100644
--- a/benchmarking/run.js
+++ b/benchmarking/run.js
@@ -1,30 +1,53 @@
 import * as $ from '../packages/svelte/src/internal/client/index.js';
-import { benchmarks } from './benchmarks.js';
+import { reactivity_benchmarks } from './benchmarks/reactivity/index.js';
+import { ssr_benchmarks } from './benchmarks/ssr/index.js';
 
 let total_time = 0;
 let total_gc_time = 0;
 
+const suites = [
+	{ benchmarks: reactivity_benchmarks, name: 'reactivity benchmarks' },
+	{ benchmarks: ssr_benchmarks, name: 'server-side rendering benchmarks' }
+];
+
 // eslint-disable-next-line no-console
-console.log('-- Benchmarking Started --');
+console.log('\x1b[1m', '-- Benchmarking Started --', '\x1b[0m');
 $.push({}, true);
 try {
-	for (const benchmark of benchmarks) {
-		const results = await benchmark();
+	for (const { benchmarks, name } of suites) {
+		let suite_time = 0;
+		let suite_gc_time = 0;
+		// eslint-disable-next-line no-console
+		console.log(`\nRunning ${name}...\n`);
+
+		for (const benchmark of benchmarks) {
+			const results = await benchmark();
+			// eslint-disable-next-line no-console
+			console.log(results);
+			total_time += Number(results.time);
+			total_gc_time += Number(results.gc_time);
+			suite_time += Number(results.time);
+			suite_gc_time += Number(results.gc_time);
+		}
+
+		console.log(`\nFinished ${name}.\n`);
+
 		// eslint-disable-next-line no-console
-		console.log(results);
-		total_time += Number(results.time);
-		total_gc_time += Number(results.gc_time);
+		console.log({
+			suite_time: suite_time.toFixed(2),
+			suite_gc_time: suite_gc_time.toFixed(2)
+		});
 	}
 } catch (e) {
 	// eslint-disable-next-line no-console
-	console.error('-- Benchmarking Failed --');
+	console.log('\x1b[1m', '\n-- Benchmarking Failed --\n', '\x1b[0m');
 	// eslint-disable-next-line no-console
 	console.error(e);
 	process.exit(1);
 }
 $.pop();
 // eslint-disable-next-line no-console
-console.log('-- Benchmarking Complete --');
+console.log('\x1b[1m', '\n-- Benchmarking Complete --\n', '\x1b[0m');
 // eslint-disable-next-line no-console
 console.log({
 	total_time: total_time.toFixed(2),
diff --git a/benchmarking/utils.js b/benchmarking/utils.js
index db2fa753ee..684d2ee02b 100644
--- a/benchmarking/utils.js
+++ b/benchmarking/utils.js
@@ -1,5 +1,7 @@
 import { performance, PerformanceObserver } from 'node:perf_hooks';
 import v8 from 'v8-natives';
+import * as fs from 'node:fs';
+import * as path from 'node:path';
 
 // Credit to https://github.com/milomg/js-reactivity-benchmark for the logic for timing + GC tracking.
 
@@ -96,3 +98,22 @@ export function assert(a) {
 		throw new Error('Assertion failed');
 	}
 }
+
+/**
+ * @param {string} file
+ */
+export function read_file(file) {
+	return fs.readFileSync(file, 'utf-8').replace(/\r\n/g, '\n');
+}
+
+/**
+ * @param {string} file
+ * @param {string} contents
+ */
+export function write(file, contents) {
+	try {
+		fs.mkdirSync(path.dirname(file), { recursive: true });
+	} catch {}
+
+	fs.writeFileSync(file, contents);
+}

From 741106879bc60bb8b4e5daf3884032a04c803dd2 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 19 Nov 2024 18:11:30 +0000
Subject: [PATCH 175/404] fix: ensure internal cloning can work circular values
 (#14347)

* fix: ensure internal cloning can work circular values

* better fixc

* 'original' feels slightly clearer than 'json_instance'

* use an optional parameter, so we can omit it in most cases

* Update packages/svelte/src/internal/shared/clone.js

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

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/cool-trains-yawn.md                |  5 ++++
 packages/svelte/src/internal/shared/clone.js  | 15 ++++++++++--
 .../samples/inspect-recursive-2/_config.js    | 23 +++++++++++++++++++
 .../samples/inspect-recursive-2/main.svelte   | 23 +++++++++++++++++++
 4 files changed, 64 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/cool-trains-yawn.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/main.svelte

diff --git a/.changeset/cool-trains-yawn.md b/.changeset/cool-trains-yawn.md
new file mode 100644
index 0000000000..d5198d118c
--- /dev/null
+++ b/.changeset/cool-trains-yawn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure internal cloning can work circular values
diff --git a/packages/svelte/src/internal/shared/clone.js b/packages/svelte/src/internal/shared/clone.js
index bfdc9af263..cef14bc14f 100644
--- a/packages/svelte/src/internal/shared/clone.js
+++ b/packages/svelte/src/internal/shared/clone.js
@@ -49,9 +49,10 @@ export function snapshot(value, skip_warning = false) {
  * @param {Map<T, Snapshot<T>>} cloned
  * @param {string} path
  * @param {string[]} paths
+ * @param {null | T} original The original value, if `value` was produced from a `toJSON` call
  * @returns {Snapshot<T>}
  */
-function clone(value, cloned, path, paths) {
+function clone(value, cloned, path, paths, original = null) {
 	if (typeof value === 'object' && value !== null) {
 		const unwrapped = cloned.get(value);
 		if (unwrapped !== undefined) return unwrapped;
@@ -63,6 +64,10 @@ function clone(value, cloned, path, paths) {
 			const copy = /** @type {Snapshot<any>} */ ([]);
 			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));
 			}
@@ -75,6 +80,10 @@ function clone(value, cloned, path, paths) {
 			const copy = {};
 			cloned.set(value, copy);
 
+			if (original !== null) {
+				cloned.set(original, copy);
+			}
+
 			for (var key in value) {
 				// @ts-expect-error
 				copy[key] = clone(value[key], cloned, DEV ? `${path}.${key}` : path, paths);
@@ -92,7 +101,9 @@ function clone(value, cloned, path, paths) {
 				/** @type {T & { toJSON(): any } } */ (value).toJSON(),
 				cloned,
 				DEV ? `${path}.toJSON()` : path,
-				paths
+				paths,
+				// Associate the instance with the toJSON clone
+				value
 			);
 		}
 	}
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/_config.js
new file mode 100644
index 0000000000..ab49697195
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/_config.js
@@ -0,0 +1,23 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	async test({ assert, logs }) {
+		var a = {
+			a: {}
+		};
+		a.a = a;
+
+		var b = {
+			a: {
+				b: {}
+			}
+		};
+		b.a.b = b;
+
+		assert.deepEqual(logs, ['init', a, 'init', b]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/main.svelte
new file mode 100644
index 0000000000..f7874d2192
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-recursive-2/main.svelte
@@ -0,0 +1,23 @@
+<script>
+	class A {
+		toJSON(){
+			return {
+				a: this
+			}
+		}
+	}
+	const state = $state(new A());
+	$inspect(state);
+
+	class B {
+		toJSON(){
+			return {
+				a: {
+					b: this
+				}
+			}
+		}
+	}
+	const state2 = $state(new B());
+	$inspect(state2);
+</script>

From 747d40833b024d2b5ea5cf0de8e6198cbd3af23c Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 19 Nov 2024 19:04:40 +0000
Subject: [PATCH 176/404] fix: ensure is_pure takes into account runes (#14333)

* fix: ensure is_pure takes into account runes

* feedback
---
 .changeset/slimy-islands-cry.md               |  5 +++++
 .../phases/2-analyze/visitors/shared/utils.js | 10 ++++++++-
 .../samples/inline-expressions-2/_config.js   | 11 ----------
 .../samples/inline-expressions/_config.js     | 21 +++++++++++++++++++
 .../samples/inline-expressions}/main.svelte   |  1 +
 5 files changed, 36 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/slimy-islands-cry.md
 delete mode 100644 packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inline-expressions/_config.js
 rename packages/svelte/tests/{runtime-legacy/samples/inline-expressions-2 => runtime-runes/samples/inline-expressions}/main.svelte (87%)

diff --git a/.changeset/slimy-islands-cry.md b/.changeset/slimy-islands-cry.md
new file mode 100644
index 0000000000..f7f34b60e1
--- /dev/null
+++ b/.changeset/slimy-islands-cry.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure is_pure takes into account $effect.tracking()
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
index 2dec4361c8..8698174c6b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
@@ -4,8 +4,10 @@
 /** @import { Scope } from '../../../scope' */
 /** @import { NodeLike } from '../../../../errors.js' */
 import * as e from '../../../../errors.js';
-import { extract_identifiers, object } from '../../../../utils/ast.js';
+import { extract_identifiers } from '../../../../utils/ast.js';
 import * as w from '../../../../warnings.js';
+import * as b from '../../../../utils/builders.js';
+import { get_rune } from '../../../scope.js';
 
 /**
  * @param {AssignmentExpression | UpdateExpression} node
@@ -184,6 +186,7 @@ export function is_pure(node, context) {
 	if (node.type === 'Literal') {
 		return true;
 	}
+
 	if (node.type === 'CallExpression') {
 		if (!is_pure(node.callee, context)) {
 			return false;
@@ -195,10 +198,15 @@ export function is_pure(node, context) {
 		}
 		return true;
 	}
+
 	if (node.type !== 'Identifier' && node.type !== 'MemberExpression') {
 		return false;
 	}
 
+	if (get_rune(b.call(node), context.state.scope) === '$effect.tracking') {
+		return false;
+	}
+
 	/** @type {Expression | Super | null} */
 	let left = node;
 	while (left.type === 'MemberExpression') {
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js b/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
deleted file mode 100644
index 1869540b2c..0000000000
--- a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/_config.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	html: `
-		<p>Without text expression: 7.36</p>
-		<p>With text expression: 7.36</p>
-		<p>With text expression and function call: 7.36</p>
-		<p>With text expression and property access: 4</p>
-		<h1>Hello name!</h1>
-		<p>4</p>`
-});
diff --git a/packages/svelte/tests/runtime-runes/samples/inline-expressions/_config.js b/packages/svelte/tests/runtime-runes/samples/inline-expressions/_config.js
new file mode 100644
index 0000000000..c5d4a75379
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inline-expressions/_config.js
@@ -0,0 +1,21 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<p>Without text expression: 7.36</p>
+		<p>With text expression: 7.36</p>
+		<p>With text expression and function call: 7.36</p>
+		<p>With text expression and property access: 4</p>
+		<h1>Hello name!</h1>
+		<p>4</p>
+		<h1>Tracking: true</h1>`,
+
+	ssrHtml: `
+		<p>Without text expression: 7.36</p>
+		<p>With text expression: 7.36</p>
+		<p>With text expression and function call: 7.36</p>
+		<p>With text expression and property access: 4</p>
+		<h1>Hello name!</h1>
+		<p>4</p>
+		<h1>Tracking: false</h1>`
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
similarity index 87%
rename from packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte
rename to packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
index 78a325dcc4..38a97415d2 100644
--- a/packages/svelte/tests/runtime-legacy/samples/inline-expressions-2/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
@@ -4,3 +4,4 @@
 <p>With text expression and property access: {"test".length}</p>
 <h1>Hello {('name').toUpperCase().toLowerCase()}!</h1>
 <p>{"test".length}</p>
+<h1>Tracking: {$effect.tracking()}</h1>

From 53cc60085e099352c04732f0653af03b63af624c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 19 Nov 2024 14:05:50 -0500
Subject: [PATCH 177/404] Version Packages (#14362)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cool-trains-yawn.md     |  5 -----
 .changeset/serious-spiders-bake.md |  5 -----
 .changeset/slimy-islands-cry.md    |  5 -----
 .changeset/wicked-grapes-flash.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/cool-trains-yawn.md
 delete mode 100644 .changeset/serious-spiders-bake.md
 delete mode 100644 .changeset/slimy-islands-cry.md
 delete mode 100644 .changeset/wicked-grapes-flash.md

diff --git a/.changeset/cool-trains-yawn.md b/.changeset/cool-trains-yawn.md
deleted file mode 100644
index d5198d118c..0000000000
--- a/.changeset/cool-trains-yawn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure internal cloning can work circular values
diff --git a/.changeset/serious-spiders-bake.md b/.changeset/serious-spiders-bake.md
deleted file mode 100644
index b1f9d84a3f..0000000000
--- a/.changeset/serious-spiders-bake.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly update dynamic member expressions
diff --git a/.changeset/slimy-islands-cry.md b/.changeset/slimy-islands-cry.md
deleted file mode 100644
index f7f34b60e1..0000000000
--- a/.changeset/slimy-islands-cry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure is_pure takes into account $effect.tracking()
diff --git a/.changeset/wicked-grapes-flash.md b/.changeset/wicked-grapes-flash.md
deleted file mode 100644
index 75ff68a728..0000000000
--- a/.changeset/wicked-grapes-flash.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: coerce value to number when hydrating range/number input with changed value
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index d36307c80c..f01f519150 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.2.4
+
+### Patch Changes
+
+- fix: ensure internal cloning can work circular values ([#14347](https://github.com/sveltejs/svelte/pull/14347))
+
+- fix: correctly update dynamic member expressions ([#14359](https://github.com/sveltejs/svelte/pull/14359))
+
+- fix: ensure is_pure takes into account $effect.tracking() ([#14333](https://github.com/sveltejs/svelte/pull/14333))
+
+- fix: coerce value to number when hydrating range/number input with changed value ([#14349](https://github.com/sveltejs/svelte/pull/14349))
+
 ## 5.2.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 50319c77aa..f6ba053398 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.2.3",
+  "version": "5.2.4",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index b79e9a2891..3a728f3d14 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.2.3';
+export const VERSION = '5.2.4';
 export const PUBLIC_VERSION = '5';

From ce471310c49695550f8422ade46025f9818106c2 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 19 Nov 2024 16:31:22 -0500
Subject: [PATCH 178/404] chore: remove some unused code (#14363)

---
 .../visitors/ExportNamedDeclaration.js         | 18 ------------------
 1 file changed, 18 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
index 784d2fdd88..547f6ab9c7 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportNamedDeclaration.js
@@ -57,23 +57,5 @@ export function ExportNamedDeclaration(node, context) {
 				}
 			}
 		}
-
-		if (!context.state.ast_type /* .svelte.js module */ || context.state.ast_type === 'module') {
-			for (const specified of node.specifiers) {
-				if (specified.local.type !== 'Identifier') continue;
-
-				const binding = context.state.scope.get(specified.local.name);
-
-				if (!binding) continue;
-
-				if (binding.kind === 'derived') {
-					e.derived_invalid_export(node);
-				}
-
-				if ((binding.kind === 'state' || binding.kind === 'raw_state') && binding.reassigned) {
-					e.state_invalid_export(node);
-				}
-			}
-		}
 	}
 }

From 32a14538051a9ab382b467d4c5f772114809b7d1 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 19 Nov 2024 22:38:36 +0100
Subject: [PATCH 179/404] fix: include method definitions in class private
 fields (#14365)

* fix: include method definitions in class private fields

* Update packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/_config.js

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/unlucky-icons-sit.md                           | 5 +++++
 .../phases/3-transform/client/visitors/ClassBody.js       | 2 +-
 .../_config.js                                            | 3 +++
 .../main.svelte                                           | 8 ++++++++
 4 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/unlucky-icons-sit.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/main.svelte

diff --git a/.changeset/unlucky-icons-sit.md b/.changeset/unlucky-icons-sit.md
new file mode 100644
index 0000000000..7fc14cf435
--- /dev/null
+++ b/.changeset/unlucky-icons-sit.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: include method definitions in class private fields
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 2d832b9df1..11a524d33c 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
@@ -28,7 +28,7 @@ export function ClassBody(node, context) {
 
 	for (const definition of node.body) {
 		if (
-			definition.type === 'PropertyDefinition' &&
+			(definition.type === 'PropertyDefinition' || definition.type === 'MethodDefinition') &&
 			(definition.key.type === 'Identifier' ||
 				definition.key.type === 'PrivateIdentifier' ||
 				definition.key.type === 'Literal')
diff --git a/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/_config.js b/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/_config.js
new file mode 100644
index 0000000000..f47bee71df
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/_config.js
@@ -0,0 +1,3 @@
+import { test } from '../../test';
+
+export default test({});
diff --git a/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/main.svelte b/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/main.svelte
new file mode 100644
index 0000000000..92f2540498
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/class-disabinguate-private-method-definition/main.svelte
@@ -0,0 +1,8 @@
+<script>
+	class Repo {
+	  tree = $state();
+	  async #tree() {
+	  }
+	}
+	const repo = new Repo();
+</script>

From 4c98c2e4a6aaa54650cc834e109a0e2dabd5a574 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 20 Nov 2024 15:52:03 +0100
Subject: [PATCH 180/404] chore: consolidate checks for never-static attributes
 (#14372)

We're using string checks in various places, better to have it encapsulated in one function
---
 .../phases/2-analyze/visitors/RegularElement.js       |  6 ++----
 .../3-transform/client/visitors/RegularElement.js     |  4 ++--
 .../3-transform/client/visitors/shared/fragment.js    |  3 ++-
 packages/svelte/src/utils.js                          | 11 +++++++++++
 4 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index 60bd1dd0c5..d5964f9ae1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -1,6 +1,6 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
-import { is_mathml, is_svg, is_void } from '../../../../utils.js';
+import { cannot_be_set_statically, is_mathml, is_svg, is_void } from '../../../../utils.js';
 import {
 	is_tag_valid_with_ancestor,
 	is_tag_valid_with_parent
@@ -77,9 +77,7 @@ export function RegularElement(node, context) {
 
 	if (
 		node.attributes.some(
-			(attribute) =>
-				attribute.type === 'Attribute' &&
-				(attribute.name === 'autofocus' || attribute.name === 'muted')
+			(attribute) => attribute.type === 'Attribute' && cannot_be_set_statically(attribute.name)
 		)
 	) {
 		mark_subtree_dynamic(context.path);
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 455327a712..19948464d2 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
@@ -5,6 +5,7 @@
 /** @import { Scope } from '../../../scope' */
 import { escape_html } from '../../../../../escaping.js';
 import {
+	cannot_be_set_statically,
 	is_boolean_attribute,
 	is_dom_property,
 	is_load_error_element,
@@ -262,8 +263,7 @@ export function RegularElement(node, context) {
 
 			if (
 				!is_custom_element &&
-				attribute.name !== 'autofocus' &&
-				attribute.name !== 'muted' &&
+				!cannot_be_set_statically(attribute.name) &&
 				(attribute.value === true || is_text_attribute(attribute))
 			) {
 				const name = get_attribute_name(node, attribute);
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 ac6e0f8f9f..102988781a 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
@@ -3,6 +3,7 @@
 /** @import { Scope } from '../../../../scope.js' */
 /** @import { ComponentContext } from '../../types' */
 import { escape_html } from '../../../../../../escaping.js';
+import { cannot_be_set_statically } from '../../../../../../utils.js';
 import { is_event_attribute } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
 import { build_template_chunk, build_update } from './utils.js';
@@ -142,7 +143,7 @@ function is_static_element(node) {
 			return false;
 		}
 
-		if (attribute.name === 'autofocus' || attribute.name === 'muted') {
+		if (cannot_be_set_statically(attribute.name)) {
 			return false;
 		}
 
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index 60ec364e6f..84c7ca1efb 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -222,6 +222,17 @@ export function is_dom_property(name) {
 	return DOM_PROPERTIES.includes(name);
 }
 
+const NON_STATIC_PROPERTIES = ['autofocus', 'muted'];
+
+/**
+ * Returns `true` if the given attribute cannot be set through the template
+ * string, i.e. needs some kind of JavaScript handling to work.
+ * @param {string} name
+ */
+export function cannot_be_set_statically(name) {
+	return NON_STATIC_PROPERTIES.includes(name);
+}
+
 /**
  * Subset of delegated events which should be passive by default.
  * These two are already passive via browser defaults on window, document and body.

From 4dfa0e31fe70174538ca47efe1b276ca13b2cd80 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 20 Nov 2024 16:14:33 +0100
Subject: [PATCH 181/404] fix: tighten up `export default` validation (#14368)

through #14363 I noticed our `export default` validation wasn't quite right:
- missed checking for derived/state exports
- the "cannot have a default export" error was only thrown if you did `export default` from the instance script, but it shouldn't matter from which component part you export it; it's never ok
---
 .changeset/new-houses-roll.md                 |  5 ++++
 .../visitors/ExportDefaultDeclaration.js      |  9 +++++--
 .../2-analyze/visitors/ExportSpecifier.js     | 25 ++-----------------
 .../phases/2-analyze/visitors/shared/utils.js | 21 +++++++++++++++-
 .../_config.js                                | 10 ++++++++
 .../main.svelte.js                            |  5 ++++
 .../export-default-state-indirect/_config.js  | 10 ++++++++
 .../main.svelte.js                            |  7 ++++++
 .../samples/default-export-module/errors.json | 14 +++++++++++
 .../default-export-module/input.svelte        |  3 +++
 10 files changed, 83 insertions(+), 26 deletions(-)
 create mode 100644 .changeset/new-houses-roll.md
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/main.svelte.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/main.svelte.js
 create mode 100644 packages/svelte/tests/validator/samples/default-export-module/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/default-export-module/input.svelte

diff --git a/.changeset/new-houses-roll.md b/.changeset/new-houses-roll.md
new file mode 100644
index 0000000000..a2b8370e06
--- /dev/null
+++ b/.changeset/new-houses-roll.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: tighten up `export default` validation
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportDefaultDeclaration.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportDefaultDeclaration.js
index 0a7461f155..768f1c6305 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportDefaultDeclaration.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportDefaultDeclaration.js
@@ -1,13 +1,18 @@
-/** @import { ExportDefaultDeclaration, Node } from 'estree' */
+/** @import { ExportDefaultDeclaration } from 'estree' */
 /** @import { Context } from '../types' */
 import * as e from '../../../errors.js';
+import { validate_export } from './shared/utils.js';
 
 /**
  * @param {ExportDefaultDeclaration} node
  * @param {Context} context
  */
 export function ExportDefaultDeclaration(node, context) {
-	if (context.state.ast_type === 'instance') {
+	if (!context.state.ast_type /* .svelte.js module */) {
+		if (node.declaration.type === 'Identifier') {
+			validate_export(node, context.state.scope, node.declaration.name);
+		}
+	} else {
 		e.module_illegal_default_export(node);
 	}
 
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
index d0d1ccf932..cfb24970de 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExportSpecifier.js
@@ -1,8 +1,6 @@
-/** @import { ExportSpecifier, Node } from 'estree' */
-/** @import { Binding } from '#compiler' */
+/** @import { ExportSpecifier } from 'estree' */
 /** @import { Context } from '../types' */
-/** @import { Scope } from '../../scope' */
-import * as e from '../../../errors.js';
+import { validate_export } from './shared/utils.js';
 
 /**
  * @param {ExportSpecifier} node
@@ -30,22 +28,3 @@ export function ExportSpecifier(node, context) {
 		validate_export(node, context.state.scope, local_name);
 	}
 }
-
-/**
- *
- * @param {Node} node
- * @param {Scope} scope
- * @param {string} name
- */
-function validate_export(node, scope, name) {
-	const binding = scope.get(name);
-	if (!binding) return;
-
-	if (binding.kind === 'derived') {
-		e.derived_invalid_export(node);
-	}
-
-	if ((binding.kind === 'state' || binding.kind === 'raw_state') && binding.reassigned) {
-		e.state_invalid_export(node);
-	}
-}
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
index 8698174c6b..e265637c40 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/utils.js
@@ -1,4 +1,4 @@
-/** @import { AssignmentExpression, Expression, Literal, Pattern, PrivateIdentifier, Super, UpdateExpression, VariableDeclarator } from 'estree' */
+/** @import { AssignmentExpression, Expression, Literal, Node, Pattern, PrivateIdentifier, Super, UpdateExpression, VariableDeclarator } from 'estree' */
 /** @import { AST, Binding } from '#compiler' */
 /** @import { AnalysisState, Context } from '../../types' */
 /** @import { Scope } from '../../../scope' */
@@ -263,3 +263,22 @@ export function validate_identifier_name(binding, function_depth) {
 		}
 	}
 }
+
+/**
+ * Checks that the exported name is not a derived or reassigned state variable.
+ * @param {Node} node
+ * @param {Scope} scope
+ * @param {string} name
+ */
+export function validate_export(node, scope, name) {
+	const binding = scope.get(name);
+	if (!binding) return;
+
+	if (binding.kind === 'derived') {
+		e.derived_invalid_export(node);
+	}
+
+	if ((binding.kind === 'state' || binding.kind === 'raw_state') && binding.reassigned) {
+		e.state_invalid_export(node);
+	}
+}
diff --git a/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/_config.js b/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/_config.js
new file mode 100644
index 0000000000..4a36211769
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/_config.js
@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'derived_invalid_export',
+		message:
+			'Cannot export derived state from a module. To expose the current derived value, export a function returning its value',
+		position: [61, 83]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/main.svelte.js b/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/main.svelte.js
new file mode 100644
index 0000000000..64a794492b
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-default-derived-state-indirect/main.svelte.js
@@ -0,0 +1,5 @@
+let count = $state(0);
+
+const double = $derived(count * 2);
+
+export default double;
diff --git a/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/_config.js b/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/_config.js
new file mode 100644
index 0000000000..99e4faec25
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/_config.js
@@ -0,0 +1,10 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'state_invalid_export',
+		message:
+			"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",
+		position: [93, 118]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/main.svelte.js b/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/main.svelte.js
new file mode 100644
index 0000000000..8e52f76533
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-default-state-indirect/main.svelte.js
@@ -0,0 +1,7 @@
+let primitive = $state('nope');
+
+export function update_primitive() {
+	primitive = 'yep';
+}
+
+export default primitive;
diff --git a/packages/svelte/tests/validator/samples/default-export-module/errors.json b/packages/svelte/tests/validator/samples/default-export-module/errors.json
new file mode 100644
index 0000000000..9fd2bb7df5
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/default-export-module/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "module_illegal_default_export",
+		"message": "A component cannot have a default export",
+		"start": {
+			"line": 2,
+			"column": 1
+		},
+		"end": {
+			"line": 2,
+			"column": 19
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/default-export-module/input.svelte b/packages/svelte/tests/validator/samples/default-export-module/input.svelte
new file mode 100644
index 0000000000..2aeeabb2e1
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/default-export-module/input.svelte
@@ -0,0 +1,3 @@
+<script module>
+	export default 42;
+</script>

From 7bd1cdf4271078c977cc39497cbe545a9de4dd62 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20Crozatier?=
 <48696601+fcrozatier@users.noreply.github.com>
Date: Wed, 20 Nov 2024 16:14:56 +0100
Subject: [PATCH 182/404] feat: add content-visibility: auto state change event
 (#14373)

* add contentvisibilityautostatechange event

* changeset

* Update .changeset/kind-horses-lay.md

* Update .changeset/kind-horses-lay.md

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 .changeset/kind-horses-lay.md |  5 +++++
 packages/svelte/elements.d.ts | 18 ++++++++++++++++++
 2 files changed, 23 insertions(+)
 create mode 100644 .changeset/kind-horses-lay.md

diff --git a/.changeset/kind-horses-lay.md b/.changeset/kind-horses-lay.md
new file mode 100644
index 0000000000..d08bdde6c4
--- /dev/null
+++ b/.changeset/kind-horses-lay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+add `contentvisibilityautostatechange` event to element definitions
diff --git a/packages/svelte/elements.d.ts b/packages/svelte/elements.d.ts
index 8746b29e25..8b2d388bf8 100644
--- a/packages/svelte/elements.d.ts
+++ b/packages/svelte/elements.d.ts
@@ -60,6 +60,10 @@ export type AnimationEventHandler<T extends EventTarget> = EventHandler<Animatio
 export type TransitionEventHandler<T extends EventTarget> = EventHandler<TransitionEvent, T>;
 export type MessageEventHandler<T extends EventTarget> = EventHandler<MessageEvent, T>;
 export type ToggleEventHandler<T extends EventTarget> = EventHandler<ToggleEvent, T>;
+export type ContentVisibilityAutoStateChangeEventHandler<T extends EventTarget> = EventHandler<
+	ContentVisibilityAutoStateChangeEvent,
+	T
+>;
 
 export type FullAutoFill =
 	| AutoFill
@@ -157,6 +161,20 @@ export interface DOMAttributes<T extends EventTarget> {
 	ontoggle?: ToggleEventHandler<T> | undefined | null;
 	ontogglecapture?: ToggleEventHandler<T> | undefined | null;
 
+	// Content visibility Events
+	'on:contentvisibilityautostatechange'?:
+		| ContentVisibilityAutoStateChangeEventHandler<T>
+		| undefined
+		| null;
+	oncontentvisibilityautostatechange?:
+		| ContentVisibilityAutoStateChangeEventHandler<T>
+		| undefined
+		| null;
+	oncontentvisibilityautostatechangecapture?:
+		| ContentVisibilityAutoStateChangeEventHandler<T>
+		| undefined
+		| null;
+
 	// Keyboard Events
 	'on:keydown'?: KeyboardEventHandler<T> | undefined | null;
 	onkeydown?: KeyboardEventHandler<T> | undefined | null;

From 811c8d32ebcd38501ec5acf1eabe461693bc24d7 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 20 Nov 2024 15:19:17 +0000
Subject: [PATCH 183/404] fix: correctly handle srcObject attribute on video
 elements (#14369)

* fix: correctly handle srcObject attribute on video elements

* remove side-effect

* side-effects agin

* side-effects agin

* better fix
---
 .changeset/bright-jokes-bow.md                       |  5 +++++
 packages/svelte/src/utils.js                         |  6 ++++--
 .../samples/video-src-object/_config.js              | 12 ++++++++++++
 .../samples/video-src-object/main.svelte             | 10 ++++++++++
 4 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/bright-jokes-bow.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/video-src-object/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/video-src-object/main.svelte

diff --git a/.changeset/bright-jokes-bow.md b/.changeset/bright-jokes-bow.md
new file mode 100644
index 0000000000..f70076b869
--- /dev/null
+++ b/.changeset/bright-jokes-bow.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly handle srcObject attribute on video elements
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index 84c7ca1efb..919660fd6a 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -192,7 +192,8 @@ const ATTRIBUTE_ALIASES = {
 	ismap: 'isMap',
 	nomodule: 'noModule',
 	playsinline: 'playsInline',
-	readonly: 'readOnly'
+	readonly: 'readOnly',
+	srcobject: 'srcObject'
 };
 
 /**
@@ -212,7 +213,8 @@ const DOM_PROPERTIES = [
 	'readOnly',
 	'value',
 	'inert',
-	'volume'
+	'volume',
+	'srcObject'
 ];
 
 /**
diff --git a/packages/svelte/tests/runtime-runes/samples/video-src-object/_config.js b/packages/svelte/tests/runtime-runes/samples/video-src-object/_config.js
new file mode 100644
index 0000000000..a31b98cac6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/video-src-object/_config.js
@@ -0,0 +1,12 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<video></video>`,
+
+	test({ assert, target }) {
+		const video = target.querySelector('video');
+
+		// @ts-ignore
+		assert.deepEqual(video?.srcObject, {});
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/video-src-object/main.svelte b/packages/svelte/tests/runtime-runes/samples/video-src-object/main.svelte
new file mode 100644
index 0000000000..f4059b028a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/video-src-object/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	let srcObject = $state();
+
+	$effect(() => {
+		srcObject = {};
+	})
+</script>
+
+<video {srcObject}></video>
+

From f616c2205399090965d6cf11e9e9b7d5c542fafc Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 20 Nov 2024 10:30:25 -0500
Subject: [PATCH 184/404] Version Packages (#14366)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/bright-jokes-bow.md  |  5 -----
 .changeset/kind-horses-lay.md   |  5 -----
 .changeset/new-houses-roll.md   |  5 -----
 .changeset/unlucky-icons-sit.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/bright-jokes-bow.md
 delete mode 100644 .changeset/kind-horses-lay.md
 delete mode 100644 .changeset/new-houses-roll.md
 delete mode 100644 .changeset/unlucky-icons-sit.md

diff --git a/.changeset/bright-jokes-bow.md b/.changeset/bright-jokes-bow.md
deleted file mode 100644
index f70076b869..0000000000
--- a/.changeset/bright-jokes-bow.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly handle srcObject attribute on video elements
diff --git a/.changeset/kind-horses-lay.md b/.changeset/kind-horses-lay.md
deleted file mode 100644
index d08bdde6c4..0000000000
--- a/.changeset/kind-horses-lay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-add `contentvisibilityautostatechange` event to element definitions
diff --git a/.changeset/new-houses-roll.md b/.changeset/new-houses-roll.md
deleted file mode 100644
index a2b8370e06..0000000000
--- a/.changeset/new-houses-roll.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: tighten up `export default` validation
diff --git a/.changeset/unlucky-icons-sit.md b/.changeset/unlucky-icons-sit.md
deleted file mode 100644
index 7fc14cf435..0000000000
--- a/.changeset/unlucky-icons-sit.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: include method definitions in class private fields
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index f01f519150..f5b581ab0e 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.2.5
+
+### Patch Changes
+
+- fix: correctly handle srcObject attribute on video elements ([#14369](https://github.com/sveltejs/svelte/pull/14369))
+
+- add `contentvisibilityautostatechange` event to element definitions ([#14373](https://github.com/sveltejs/svelte/pull/14373))
+
+- fix: tighten up `export default` validation ([#14368](https://github.com/sveltejs/svelte/pull/14368))
+
+- fix: include method definitions in class private fields ([#14365](https://github.com/sveltejs/svelte/pull/14365))
+
 ## 5.2.4
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index f6ba053398..2205990fff 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.2.4",
+  "version": "5.2.5",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 3a728f3d14..5014c88702 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.2.4';
+export const VERSION = '5.2.5';
 export const PUBLIC_VERSION = '5';

From 9d12fd1a01d7020855122a8bfb5a35a3dd4e1c8f Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 20 Nov 2024 17:46:53 +0000
Subject: [PATCH 185/404] chore: remove template expression inlining (#14374)

* chore: remove template expression inlining

* missed some

* fix

* feedback

* feedback

* Update packages/svelte/src/compiler/phases/3-transform/client/utils.js

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

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

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

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

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

* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js

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

* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js

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

* Update packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js

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

* fix

* Update .changeset/calm-mice-perform.md

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

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/calm-mice-perform.md               |  5 +
 .../phases/2-analyze/visitors/Attribute.js    |  9 +-
 .../2-analyze/visitors/CallExpression.js      |  2 -
 .../2-analyze/visitors/ExpressionTag.js       |  5 +
 .../phases/2-analyze/visitors/Identifier.js   | 17 +---
 .../2-analyze/visitors/MemberExpression.js    |  3 -
 .../2-analyze/visitors/RegularElement.js      | 10 +-
 .../visitors/TaggedTemplateExpression.js      |  1 -
 .../phases/3-transform/client/utils.js        | 10 +-
 .../3-transform/client/visitors/Fragment.js   | 10 +-
 .../client/visitors/RegularElement.js         | 72 ++++-----------
 .../client/visitors/shared/fragment.js        | 65 +++----------
 .../client/visitors/shared/utils.js           | 92 ++++++++-----------
 packages/svelte/src/compiler/phases/nodes.js  |  3 +-
 packages/svelte/src/compiler/types/index.d.ts |  2 -
 packages/svelte/src/internal/client/index.js  |  1 -
 .../samples/slot-non-identifier/output.svelte |  2 +-
 .../_expected/client/index.svelte.js          | 17 ----
 .../_expected/server/index.svelte.js          | 12 ---
 .../samples/inline-module-vars/index.svelte   | 20 ----
 20 files changed, 97 insertions(+), 261 deletions(-)
 create mode 100644 .changeset/calm-mice-perform.md
 delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
 delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
 delete mode 100644 packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte

diff --git a/.changeset/calm-mice-perform.md b/.changeset/calm-mice-perform.md
new file mode 100644
index 0000000000..f43c7fcf0e
--- /dev/null
+++ b/.changeset/calm-mice-perform.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove template expression inlining
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 ca0ea55d1f..6c050d966a 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
@@ -1,7 +1,7 @@
 /** @import { ArrowFunctionExpression, Expression, FunctionDeclaration, FunctionExpression } from 'estree' */
 /** @import { AST, DelegatedEvent, SvelteNode } from '#compiler' */
 /** @import { Context } from '../types' */
-import { is_boolean_attribute, is_capture_event, is_delegated } from '../../../../utils.js';
+import { cannot_be_set_statically, is_capture_event, is_delegated } from '../../../../utils.js';
 import {
 	get_attribute_chunks,
 	get_attribute_expression,
@@ -30,12 +30,12 @@ export function Attribute(node, context) {
 		}
 	}
 
-	if (node.name.startsWith('on')) {
+	if (is_event_attribute(node)) {
 		mark_subtree_dynamic(context.path);
 	}
 
-	if (parent.type === 'RegularElement' && is_boolean_attribute(node.name.toLowerCase())) {
-		node.metadata.expression.can_inline = false;
+	if (cannot_be_set_statically(node.name)) {
+		mark_subtree_dynamic(context.path);
 	}
 
 	if (node.value !== true) {
@@ -51,7 +51,6 @@ export function Attribute(node, context) {
 
 			node.metadata.expression.has_state ||= chunk.metadata.expression.has_state;
 			node.metadata.expression.has_call ||= chunk.metadata.expression.has_call;
-			node.metadata.expression.can_inline &&= chunk.metadata.expression.can_inline;
 		}
 
 		if (is_event_attribute(node)) {
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 fe3f638a69..c7ade4856b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -179,8 +179,6 @@ export function CallExpression(node, context) {
 		if (!is_pure(node.callee, context) || context.state.expression.dependencies.size > 0) {
 			context.state.expression.has_call = true;
 			context.state.expression.has_state = true;
-			context.state.expression.can_inline = false;
-			mark_subtree_dynamic(context.path);
 		}
 	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
index f59b7fc569..32c8d2ca36 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
@@ -2,6 +2,7 @@
 /** @import { Context } from '../types' */
 import { is_tag_valid_with_parent } from '../../../../html-tree-validation.js';
 import * as e from '../../../errors.js';
+import { mark_subtree_dynamic } from './shared/fragment.js';
 
 /**
  * @param {AST.ExpressionTag} node
@@ -14,5 +15,9 @@ export function ExpressionTag(node, context) {
 		}
 	}
 
+	// TODO ideally we wouldn't do this here, we'd just do it on encountering
+	// an `Identifier` within the tag. But we currently need to handle `{42}` etc
+	mark_subtree_dynamic(context.path);
+
 	context.next({ ...context.state, expression: node.metadata.expression });
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
index 042c467df1..79dccd5a7c 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Identifier.js
@@ -1,4 +1,5 @@
 /** @import { Expression, Identifier } from 'estree' */
+/** @import { EachBlock } from '#compiler' */
 /** @import { Context } from '../types' */
 import is_reference from 'is-reference';
 import { should_proxy } from '../../3-transform/client/utils.js';
@@ -19,6 +20,8 @@ export function Identifier(node, context) {
 		return;
 	}
 
+	mark_subtree_dynamic(context.path);
+
 	// If we are using arguments outside of a function, then throw an error
 	if (
 		node.name === 'arguments' &&
@@ -84,12 +87,6 @@ export function Identifier(node, context) {
 		}
 	}
 
-	// no binding means global, and we can't inline e.g. `<span>{location}</span>`
-	// because it could change between component renders. if there _is_ a
-	// binding and it is outside module scope, the expression cannot
-	// be inlined (TODO allow inlining in more cases - e.g. primitive consts)
-	let can_inline = !!binding && !binding.scope.parent && binding.kind === 'normal';
-
 	if (binding) {
 		if (context.state.expression) {
 			context.state.expression.dependencies.add(binding);
@@ -125,12 +122,4 @@ export function Identifier(node, context) {
 			w.reactive_declaration_module_script_dependency(node);
 		}
 	}
-
-	if (!can_inline) {
-		if (context.state.expression) {
-			context.state.expression.can_inline = false;
-		}
-
-		mark_subtree_dynamic(context.path);
-	}
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
index 88adecbd35..1cc20c96da 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
@@ -20,9 +20,6 @@ export function MemberExpression(node, context) {
 
 	if (context.state.expression && !is_pure(node, context)) {
 		context.state.expression.has_state = true;
-		context.state.expression.can_inline = false;
-
-		mark_subtree_dynamic(context.path);
 	}
 
 	if (!is_safe_identifier(node, context.state.scope)) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index d5964f9ae1..7d1c4aaeaa 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -1,6 +1,6 @@
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
-import { cannot_be_set_statically, is_mathml, is_svg, is_void } from '../../../../utils.js';
+import { is_mathml, is_svg, is_void } from '../../../../utils.js';
 import {
 	is_tag_valid_with_ancestor,
 	is_tag_valid_with_parent
@@ -75,14 +75,6 @@ export function RegularElement(node, context) {
 		node.attributes.push(create_attribute('value', child.start, child.end, [child]));
 	}
 
-	if (
-		node.attributes.some(
-			(attribute) => attribute.type === 'Attribute' && cannot_be_set_statically(attribute.name)
-		)
-	) {
-		mark_subtree_dynamic(context.path);
-	}
-
 	const binding = context.state.scope.get(node.name);
 	if (
 		binding !== null &&
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
index 724b9af311..eacb8a342a 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/TaggedTemplateExpression.js
@@ -10,7 +10,6 @@ export function TaggedTemplateExpression(node, context) {
 	if (context.state.expression && !is_pure(node.tag, context)) {
 		context.state.expression.has_call = true;
 		context.state.expression.has_state = true;
-		context.state.expression.can_inline = false;
 	}
 
 	if (node.tag.type === 'Identifier') {
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 910f173f79..0b49d18ee9 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -3,16 +3,16 @@
 /** @import { ClientTransformState, ComponentClientTransformState, ComponentContext } from './types.js' */
 /** @import { Analysis } from '../../types.js' */
 /** @import { Scope } from '../../scope.js' */
+import * as b from '../../../utils/builders.js';
+import { extract_identifiers, is_simple_expression } from '../../../utils/ast.js';
 import {
-	PROPS_IS_BINDABLE,
-	PROPS_IS_IMMUTABLE,
 	PROPS_IS_LAZY_INITIAL,
+	PROPS_IS_IMMUTABLE,
 	PROPS_IS_RUNES,
-	PROPS_IS_UPDATED
+	PROPS_IS_UPDATED,
+	PROPS_IS_BINDABLE
 } from '../../../../constants.js';
 import { dev } from '../../../state.js';
-import { extract_identifiers, is_simple_expression } from '../../../utils/ast.js';
-import * as b from '../../../utils/builders.js';
 import { get_value } from './visitors/shared/declarations.js';
 
 /**
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
index 111516ce0a..0e6ea29614 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Fragment.js
@@ -141,14 +141,14 @@ export function Fragment(node, context) {
 		const id = b.id(context.state.scope.generate('fragment'));
 
 		const use_space_template =
-			trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag') &&
-			trimmed.some((node) => node.type === 'ExpressionTag' && !node.metadata.expression.can_inline);
+			trimmed.some((node) => node.type === 'ExpressionTag') &&
+			trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag');
 
 		if (use_space_template) {
 			// special case — we can use `$.text` instead of creating a unique template
 			const id = b.id(context.state.scope.generate('text'));
 
-			process_children(trimmed, () => id, null, {
+			process_children(trimmed, () => id, false, {
 				...context,
 				state
 			});
@@ -158,12 +158,12 @@ export function Fragment(node, context) {
 		} else {
 			if (is_standalone) {
 				// no need to create a template, we can just use the existing block's anchor
-				process_children(trimmed, () => b.id('$$anchor'), null, { ...context, state });
+				process_children(trimmed, () => b.id('$$anchor'), false, { ...context, state });
 			} else {
 				/** @type {(is_text: boolean) => Expression} */
 				const expression = (is_text) => b.call('$.first_child', id, is_text && b.true);
 
-				process_children(trimmed, expression, null, { ...context, state });
+				process_children(trimmed, expression, false, { ...context, state });
 
 				let flags = TEMPLATE_FRAGMENT;
 
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 19948464d2..85df92e8bf 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
@@ -1,9 +1,8 @@
-/** @import { Expression, ExpressionStatement, Identifier, Literal, MemberExpression, ObjectExpression, Statement } from 'estree' */
+/** @import { Expression, ExpressionStatement, Identifier, MemberExpression, ObjectExpression, Statement } from 'estree' */
 /** @import { AST } from '#compiler' */
 /** @import { SourceLocation } from '#shared' */
 /** @import { ComponentClientTransformState, ComponentContext } from '../types' */
 /** @import { Scope } from '../../../scope' */
-import { escape_html } from '../../../../../escaping.js';
 import {
 	cannot_be_set_statically,
 	is_boolean_attribute,
@@ -11,6 +10,7 @@ import {
 	is_load_error_element,
 	is_void
 } from '../../../../../utils.js';
+import { escape_html } from '../../../../../escaping.js';
 import { dev, is_ignored, locator } from '../../../../state.js';
 import { is_event_attribute, is_text_attribute } from '../../../../utils/ast.js';
 import * as b from '../../../../utils/builders.js';
@@ -18,13 +18,12 @@ import { is_custom_element_node } from '../../../nodes.js';
 import { clean_nodes, determine_namespace_for_children } from '../../utils.js';
 import { build_getter, create_derived } from '../utils.js';
 import {
+	get_attribute_name,
 	build_attribute_value,
 	build_class_directives,
-	build_set_attributes,
 	build_style_directives,
-	get_attribute_name
+	build_set_attributes
 } from './shared/element.js';
-import { visit_event_attribute } from './shared/events.js';
 import { process_children } from './shared/fragment.js';
 import {
 	build_render_statement,
@@ -32,6 +31,7 @@ import {
 	build_update,
 	build_update_assignment
 } from './shared/utils.js';
+import { visit_event_attribute } from './shared/events.js';
 
 /**
  * @param {AST.RegularElement} node
@@ -352,32 +352,30 @@ export function RegularElement(node, context) {
 
 	// special case — if an element that only contains text, we don't need
 	// to descend into it if the text is non-reactive
-	const is_text = trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag');
-
 	// in the rare case that we have static text that can't be inlined
 	// (e.g. `<span>{location}</span>`), set `textContent` programmatically
 	const use_text_content =
-		is_text &&
+		trimmed.every((node) => node.type === 'Text' || node.type === 'ExpressionTag') &&
 		trimmed.every((node) => node.type === 'Text' || !node.metadata.expression.has_state) &&
-		trimmed.some((node) => node.type === 'ExpressionTag' && !node.metadata.expression.can_inline);
+		trimmed.some((node) => node.type === 'ExpressionTag');
 
 	if (use_text_content) {
-		let { value } = build_template_chunk(trimmed, context.visit, child_state);
-
 		child_state.init.push(
-			b.stmt(b.assignment('=', b.member(context.state.node, 'textContent'), value))
+			b.stmt(
+				b.assignment(
+					'=',
+					b.member(context.state.node, 'textContent'),
+					build_template_chunk(trimmed, context.visit, child_state).value
+				)
+			)
 		);
 	} else {
 		/** @type {Expression} */
 		let arg = context.state.node;
 
 		// If `hydrate_node` is set inside the element, we need to reset it
-		// after the element has been hydrated (we don't need to reset if it's been inlined)
-		let needs_reset = !trimmed.every(
-			(node) =>
-				node.type === 'Text' ||
-				(node.type === 'ExpressionTag' && node.metadata.expression.can_inline)
-		);
+		// after the element has been hydrated
+		let needs_reset = trimmed.some((node) => node.type !== 'Text');
 
 		// The same applies if it's a `<template>` element, since we need to
 		// set the value of `hydrate_node` to `node.content`
@@ -387,7 +385,7 @@ export function RegularElement(node, context) {
 			arg = b.member(arg, 'content');
 		}
 
-		process_children(trimmed, (is_text) => b.call('$.child', arg, is_text && b.true), node, {
+		process_children(trimmed, (is_text) => b.call('$.child', arg, is_text && b.true), true, {
 			...context,
 			state: child_state
 		});
@@ -587,44 +585,10 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 			state.update.push(update);
 		}
 		return true;
-	}
-
-	// we need to special case textarea value because it's not an actual attribute
-	const can_inline =
-		(attribute.name !== 'value' || element.name !== 'textarea') &&
-		attribute.metadata.expression.can_inline;
-
-	if (can_inline) {
-		/** @type {Literal | undefined} */
-		let literal = undefined;
-
-		if (value.type === 'Literal') {
-			literal = value;
-		} else if (value.type === 'Identifier') {
-			const binding = context.state.scope.get(value.name);
-			if (binding && binding.initial?.type === 'Literal' && !binding.reassigned) {
-				literal = binding.initial;
-			}
-		}
-
-		if (literal && escape_html(literal.value, true) === String(literal.value)) {
-			if (is_boolean_attribute(name)) {
-				if (literal.value) {
-					context.state.template.push(` ${name}`);
-				}
-			} else {
-				context.state.template.push(` ${name}="`, value, '"');
-			}
-		} else {
-			context.state.template.push(
-				b.call('$.attr', b.literal(name), value, is_boolean_attribute(name) && b.true)
-			);
-		}
 	} else {
 		state.init.push(update);
+		return false;
 	}
-
-	return false;
 }
 
 /**
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 102988781a..af336733bc 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,10 +1,8 @@
 /** @import { Expression } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
-/** @import { Scope } from '../../../../scope.js' */
 /** @import { ComponentContext } from '../../types' */
-import { escape_html } from '../../../../../../escaping.js';
 import { cannot_be_set_statically } from '../../../../../../utils.js';
-import { is_event_attribute } from '../../../../../utils/ast.js';
+import { is_event_attribute, is_text_attribute } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
 import { build_template_chunk, build_update } from './utils.js';
 
@@ -14,10 +12,10 @@ import { build_template_chunk, build_update } from './utils.js';
  * corresponding template node references these updates are applied to.
  * @param {SvelteNode[]} nodes
  * @param {(is_text: boolean) => Expression} initial
- * @param {AST.RegularElement | null} element
+ * @param {boolean} is_element
  * @param {ComponentContext} context
  */
-export function process_children(nodes, initial, element, { visit, state }) {
+export function process_children(nodes, initial, is_element, { visit, state }) {
 	const within_bound_contenteditable = state.metadata.bound_contenteditable;
 	let prev = initial;
 	let skipped = 0;
@@ -63,17 +61,16 @@ export function process_children(nodes, initial, element, { visit, state }) {
 	 * @param {Sequence} sequence
 	 */
 	function flush_sequence(sequence) {
-		const { has_state, has_call, value, can_inline } = build_template_chunk(sequence, visit, state);
-
-		if (can_inline) {
+		if (sequence.every((node) => node.type === 'Text')) {
 			skipped += 1;
-			const raw = element?.name === 'script' || element?.name === 'style';
-			state.template.push(raw ? value : escape_inline_expression(value, state.scope));
+			state.template.push(sequence.map((node) => node.raw).join(''));
 			return;
 		}
 
 		state.template.push(' ');
 
+		const { has_state, has_call, value } = build_template_chunk(sequence, visit, state);
+
 		// if this is a standalone `{expression}`, make sure we handle the case where
 		// no text node was created because the expression was empty during SSR
 		const is_text = sequence.length === 1;
@@ -101,9 +98,9 @@ export function process_children(nodes, initial, element, { visit, state }) {
 
 			let child_state = state;
 
-			if (is_static_element(node)) {
+			if (is_static_element(node, state)) {
 				skipped += 1;
-			} else if (node.type === 'EachBlock' && nodes.length === 1 && element) {
+			} else if (node.type === 'EachBlock' && nodes.length === 1 && is_element) {
 				node.metadata.is_controlled = true;
 			} else {
 				const id = flush_node(false, node.type === 'RegularElement' ? node.name : 'node');
@@ -128,8 +125,9 @@ export function process_children(nodes, initial, element, { visit, state }) {
 
 /**
  * @param {SvelteNode} node
+ * @param {ComponentContext["state"]} state
  */
-function is_static_element(node) {
+function is_static_element(node, state) {
 	if (node.type !== 'RegularElement') return false;
 	if (node.fragment.metadata.dynamic) return false;
 	if (node.name.includes('-')) return false; // we're setting all attributes on custom elements through properties
@@ -156,49 +154,10 @@ function is_static_element(node) {
 			return false;
 		}
 
-		if (!attribute.metadata.expression.can_inline) {
+		if (attribute.value !== true && !is_text_attribute(attribute)) {
 			return false;
 		}
 	}
 
 	return true;
 }
-
-/**
- * @param {Expression} node
- * @param {Scope} scope
- * @returns {Expression}
- */
-function escape_inline_expression(node, scope) {
-	if (node.type === 'Literal') {
-		if (typeof node.value === 'string') {
-			return b.literal(escape_html(node.value));
-		}
-
-		return node;
-	}
-
-	if (node.type === 'TemplateLiteral') {
-		return b.template(
-			node.quasis.map((q) => b.quasi(escape_html(q.value.cooked))),
-			node.expressions.map((expression) => escape_inline_expression(expression, scope))
-		);
-	}
-
-	/**
-	 * If we can't determine the range of possible values statically, wrap in
-	 * `$.escape(...)`. TODO expand this to cover more cases
-	 */
-	let needs_escape = true;
-
-	if (node.type === 'Identifier') {
-		const binding = scope.get(node.name);
-
-		// TODO handle more cases
-		if (binding?.initial?.type === 'Literal' && !binding.reassigned) {
-			needs_escape = escape_html(binding.initial.value) !== String(binding.initial.value);
-		}
-	}
-
-	return needs_escape ? b.call('$.escape', node) : node;
-}
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 b74d2cc9c0..59beacbb0c 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, TemplateLiteral, Node } from 'estree' */
+/** @import { Expression, ExpressionStatement, Identifier, MemberExpression, Statement, Super } from 'estree' */
 /** @import { AST, SvelteNode } from '#compiler' */
 /** @import { ComponentClientTransformState } from '../../types' */
 import { walk } from 'zimmerframe';
@@ -14,7 +14,7 @@ import { locator } from '../../../../../state.js';
  * @param {Array<AST.Text | AST.ExpressionTag>} values
  * @param {(node: SvelteNode, state: any) => any} visit
  * @param {ComponentClientTransformState} state
- * @returns {{ value: Expression, has_state: boolean, has_call: boolean, can_inline: boolean }}
+ * @returns {{ value: Expression, has_state: boolean, has_call: boolean }}
  */
 export function build_template_chunk(values, visit, state) {
 	/** @type {Expression[]} */
@@ -25,23 +25,15 @@ export function build_template_chunk(values, visit, state) {
 
 	let has_call = false;
 	let has_state = false;
-	let can_inline = true;
 	let contains_multiple_call_expression = false;
 
 	for (const node of values) {
 		if (node.type === 'ExpressionTag') {
-			if (node.metadata.expression.has_call) {
-				if (has_call) contains_multiple_call_expression = true;
-				has_call = true;
-			}
-
-			if (node.metadata.expression.has_state) {
-				has_state = true;
-			}
+			const metadata = node.metadata.expression;
 
-			if (!node.metadata.expression.can_inline) {
-				can_inline = false;
-			}
+			contains_multiple_call_expression ||= has_call && metadata.has_call;
+			has_call ||= metadata.has_call;
+			has_state ||= metadata.has_state;
 		}
 	}
 
@@ -50,49 +42,39 @@ export function build_template_chunk(values, visit, state) {
 
 		if (node.type === 'Text') {
 			quasi.value.cooked += node.data;
+		} else if (node.type === 'ExpressionTag' && node.expression.type === 'Literal') {
+			if (node.expression.value != null) {
+				quasi.value.cooked += node.expression.value + '';
+			}
 		} else {
-			const expression = /** @type {Expression} */ (visit(node.expression, state));
-
-			if (expression.type === 'Literal') {
-				if (expression.value != null) {
-					quasi.value.cooked += expression.value + '';
-				}
+			if (contains_multiple_call_expression) {
+				const id = b.id(state.scope.generate('stringified_text'));
+				state.init.push(
+					b.const(
+						id,
+						create_derived(
+							state,
+							b.thunk(
+								b.logical(
+									'??',
+									/** @type {Expression} */ (visit(node.expression, state)),
+									b.literal('')
+								)
+							)
+						)
+					)
+				);
+				expressions.push(b.call('$.get', id));
+			} else if (values.length === 1) {
+				// If we have a single expression, then pass that in directly to possibly avoid doing
+				// extra work in the template_effect (instead we do the work in set_text).
+				return { value: visit(node.expression, state), has_state, has_call };
 			} else {
-				let value = expression;
-
-				// if we don't know the value, we need to add `?? ''` to replace
-				// `null` and `undefined` with the empty string
-				let needs_fallback = true;
-
-				if (value.type === 'Identifier') {
-					const binding = state.scope.get(value.name);
-
-					if (binding && binding.initial?.type === 'Literal' && !binding.reassigned) {
-						needs_fallback = binding.initial.value === null;
-					}
-				}
-
-				if (needs_fallback) {
-					value = b.logical('??', expression, b.literal(''));
-				}
-
-				if (contains_multiple_call_expression) {
-					const id = b.id(state.scope.generate('stringified_text'));
-
-					state.init.push(b.const(id, create_derived(state, b.thunk(value))));
-
-					expressions.push(b.call('$.get', id));
-				} else if (values.length === 1) {
-					// If we have a single expression, then pass that in directly to possibly avoid doing
-					// extra work in the template_effect (instead we do the work in set_text).
-					return { value: visit(node.expression, state), has_state, has_call, can_inline };
-				} else {
-					expressions.push(value);
-				}
-
-				quasi = b.quasi('', i + 1 === values.length);
-				quasis.push(quasi);
+				expressions.push(b.logical('??', visit(node.expression, state), b.literal('')));
 			}
+
+			quasi = b.quasi('', i + 1 === values.length);
+			quasis.push(quasi);
 		}
 	}
 
@@ -102,7 +84,7 @@ export function build_template_chunk(values, visit, state) {
 
 	const value = b.template(quasis, expressions);
 
-	return { value, has_state, has_call, can_inline };
+	return { value, has_state, has_call };
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/nodes.js b/packages/svelte/src/compiler/phases/nodes.js
index 13a54730eb..ead525aaa1 100644
--- a/packages/svelte/src/compiler/phases/nodes.js
+++ b/packages/svelte/src/compiler/phases/nodes.js
@@ -58,7 +58,6 @@ export function create_expression_metadata() {
 	return {
 		dependencies: new Set(),
 		has_state: false,
-		has_call: false,
-		can_inline: true
+		has_call: false
 	};
 }
diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index bd4749db00..8a45f2d4fd 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -317,8 +317,6 @@ export interface ExpressionMetadata {
 	has_state: boolean;
 	/** True if the expression involves a call expression (often, it will need to be wrapped in a derived) */
 	has_call: boolean;
-	/** True if the expression can be inlined into a template */
-	can_inline: boolean;
 }
 
 export * from './template.js';
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index bfc0a6aac9..6fd749b42c 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -1,5 +1,4 @@
 export { FILENAME, HMR, NAMESPACE_SVG } from '../../constants.js';
-export { escape_html as escape } from '../../escaping.js';
 export { cleanup_styles } from './dev/css.js';
 export { add_locations } from './dev/elements.js';
 export { hmr } from './dev/hmr.js';
diff --git a/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte b/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
index fb262e8c25..b9a3248012 100644
--- a/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
+++ b/packages/svelte/tests/migrate/samples/slot-non-identifier/output.svelte
@@ -82,4 +82,4 @@
 	<svelte:fragment let:should_stay slot="cool stuff">
 		cool
 	</svelte:fragment>
-</Comp>
+</Comp>
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
deleted file mode 100644
index 4622624424..0000000000
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/client/index.svelte.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-
-const __DECLARED_ASSET_0__ = "__VITE_ASSET__2AM7_y_a__ 1440w, __VITE_ASSET__2AM7_y_b__ 960w";
-const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
-const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
-const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
-const a = 1;
-const b = 2;
-var root = $.template(`<picture><source srcset="${__DECLARED_ASSET_0__}" type="image/avif"> <source srcset="${__DECLARED_ASSET_1__}" type="image/webp"> <source srcset="${__DECLARED_ASSET_2__}" type="image/png"> <img src="${__DECLARED_ASSET_3__}" alt="production test" width="1440" height="1440"></picture> <p>${a} + ${b} = ${$.escape(a + b ?? "")}</p>`, 1);
-
-export default function Inline_module_vars($$anchor) {
-	var fragment = root();
-
-	$.next(2);
-	$.append($$anchor, fragment);
-}
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
deleted file mode 100644
index ca98cd952b..0000000000
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/_expected/server/index.svelte.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import * as $ from "svelte/internal/server";
-
-const __DECLARED_ASSET_0__ = "__VITE_ASSET__2AM7_y_a__ 1440w, __VITE_ASSET__2AM7_y_b__ 960w";
-const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
-const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
-const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
-const a = 1;
-const b = 2;
-
-export default function Inline_module_vars($$payload) {
-	$$payload.out += `<picture><source${$.attr("srcset", __DECLARED_ASSET_0__)} type="image/avif"> <source${$.attr("srcset", __DECLARED_ASSET_1__)} type="image/webp"> <source${$.attr("srcset", __DECLARED_ASSET_2__)} type="image/png"> <img${$.attr("src", __DECLARED_ASSET_3__)} alt="production test"${$.attr("width", 1440)}${$.attr("height", 1440)}></picture> <p>${$.escape(a)} + ${$.escape(b)} = ${$.escape(a + b)}</p>`;
-}
\ No newline at end of file
diff --git a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte b/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte
deleted file mode 100644
index a7b737e596..0000000000
--- a/packages/svelte/tests/snapshot/samples/inline-module-vars/index.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<svelte:options runes={true} />
-
-<script module>
-	const __DECLARED_ASSET_0__ = "__VITE_ASSET__2AM7_y_a__ 1440w, __VITE_ASSET__2AM7_y_b__ 960w";
-	const __DECLARED_ASSET_1__ = "__VITE_ASSET__2AM7_y_c__ 1440w, __VITE_ASSET__2AM7_y_d__ 960w";
-	const __DECLARED_ASSET_2__ = "__VITE_ASSET__2AM7_y_e__ 1440w, __VITE_ASSET__2AM7_y_f__ 960w";
-	const __DECLARED_ASSET_3__ = "__VITE_ASSET__2AM7_y_g__";
-
-	const a = 1;
-	const b = 2;
-</script>
-
-<picture>
-	<source srcset={__DECLARED_ASSET_0__} type="image/avif" />
-	<source srcset={__DECLARED_ASSET_1__} type="image/webp" />
-	<source srcset={__DECLARED_ASSET_2__} type="image/png" />
-	<img src={__DECLARED_ASSET_3__} alt="production test" width={1440} height={1440} />
-</picture>
-
-<p>{a} + {b} = {a + b}</p>

From 85ec6fa276e1cf3202ccadf751b7c3c387debb75 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 20 Nov 2024 19:54:56 +0000
Subject: [PATCH 186/404] Version Packages (#14377)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/calm-mice-perform.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/calm-mice-perform.md

diff --git a/.changeset/calm-mice-perform.md b/.changeset/calm-mice-perform.md
deleted file mode 100644
index f43c7fcf0e..0000000000
--- a/.changeset/calm-mice-perform.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove template expression inlining
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index f5b581ab0e..b69c0dd3e5 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.2.6
+
+### Patch Changes
+
+- fix: remove template expression inlining ([#14374](https://github.com/sveltejs/svelte/pull/14374))
+
 ## 5.2.5
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 2205990fff..9c11b4cdd9 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.2.5",
+  "version": "5.2.6",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 5014c88702..1db41e6c21 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.2.5';
+export const VERSION = '5.2.6';
 export const PUBLIC_VERSION = '5';

From 520055cf5c6635e44aa2cb04fdabc6ecb776d527 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Wed, 20 Nov 2024 21:03:05 +0100
Subject: [PATCH 187/404] fix: always use set for private identifiers (#14378)

* fix: always use set for private identifiers

* we can simplify this further - no need to check the value was transformed, since the outcome of not returning immediately is the same but with extra steps

* add explanatory note

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/tiny-trainers-sleep.md             |  5 +++
 .../client/visitors/AssignmentExpression.js   | 41 ++++++++-----------
 .../private-identifiers-not-this/_config.js   | 17 ++++++++
 .../private-identifiers-not-this/main.svelte  | 26 ++++++++++++
 4 files changed, 66 insertions(+), 23 deletions(-)
 create mode 100644 .changeset/tiny-trainers-sleep.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/main.svelte

diff --git a/.changeset/tiny-trainers-sleep.md b/.changeset/tiny-trainers-sleep.md
new file mode 100644
index 0000000000..4cb0b05e66
--- /dev/null
+++ b/.changeset/tiny-trainers-sleep.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: always use set for private identifiers
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 cf54dba1b3..ee909ede91 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
@@ -32,31 +32,26 @@ function build_assignment(operator, left, right, context) {
 	if (
 		context.state.analysis.runes &&
 		left.type === 'MemberExpression' &&
-		left.object.type === 'ThisExpression'
+		left.property.type === 'PrivateIdentifier'
 	) {
-		if (left.property.type === 'PrivateIdentifier') {
-			const private_state = context.state.private_state.get(left.property.name);
-
-			if (private_state !== undefined) {
-				let transformed = false;
-				let value = /** @type {Expression} */ (
-					context.visit(build_assignment_value(operator, left, right))
-				);
-
-				if (should_proxy(value, context.state.scope)) {
-					transformed = true;
-					value =
-						private_state.kind === 'raw_state'
-							? value
-							: build_proxy_reassignment(value, b.member(b.this, private_state.id));
-				}
-
-				if (!context.state.in_constructor) {
-					return b.call('$.set', left, value);
-				} else if (transformed) {
-					return b.assignment(operator, /** @type {Pattern} */ (context.visit(left)), value);
-				}
+		const private_state = context.state.private_state.get(left.property.name);
+
+		if (private_state !== undefined) {
+			let value = /** @type {Expression} */ (
+				context.visit(build_assignment_value(operator, left, right))
+			);
+
+			if (private_state.kind !== 'raw_state' && should_proxy(value, context.state.scope)) {
+				value = build_proxy_reassignment(value, b.member(b.this, private_state.id));
 			}
+
+			if (context.state.in_constructor) {
+				// inside the constructor, we can assign to `this.#foo.v` rather than using `$.set`,
+				// since nothing is tracking the signal at this point
+				return b.assignment(operator, /** @type {Pattern} */ (context.visit(left)), value);
+			}
+
+			return b.call('$.set', left, value);
 		}
 	}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/_config.js b/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/_config.js
new file mode 100644
index 0000000000..0294b930c2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/_config.js
@@ -0,0 +1,17 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `<p>42</p><p>1337</p><button></button>`,
+	async test({ assert, target, instance }) {
+		const [a, b] = target.querySelectorAll('p');
+		const btn = target.querySelector('button');
+
+		flushSync(() => {
+			btn?.click();
+		});
+
+		assert.equal(a.textContent, '1337');
+		assert.equal(b.textContent, '42');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/main.svelte b/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/main.svelte
new file mode 100644
index 0000000000..384795f60d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/private-identifiers-not-this/main.svelte
@@ -0,0 +1,26 @@
+<script>
+	class Box {
+		#value = $state(0);
+
+		get value(){
+			return this.#value;
+		}
+		
+		constructor(num){
+			this.#value = num;
+		}
+		
+		swap(other) {
+			const value = this.#value;
+			this.#value = other.value;
+			other.#value = value;
+		}
+	}
+
+	const a = new Box(42);
+	const b = new Box(1337);
+</script>
+
+<p>{a.value}</p>
+<p>{b.value}</p>
+<button onclick={()=>{a.swap(b)}}></button>
\ No newline at end of file

From 97185eb3d5e839d6da70edd3e1ebb97396c6197f Mon Sep 17 00:00:00 2001
From: Rob B <2623102+rob-balfre@users.noreply.github.com>
Date: Thu, 21 Nov 2024 09:14:21 +1100
Subject: [PATCH 188/404] docs Update 03-typescript.md (#14382)

* Update 03-typescript.md

Fix TS error: Cannot invoke an object which is possibly 'undefined'.

* Update 03-typescript.md

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
---
 documentation/docs/07-misc/03-typescript.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md
index e02ac7b6b1..f4513a9a2d 100644
--- a/documentation/docs/07-misc/03-typescript.md
+++ b/documentation/docs/07-misc/03-typescript.md
@@ -142,7 +142,7 @@ In case you're writing a component that wraps a native element, you may want to
 </script>
 
 <button {...rest}>
-	{@render children()}
+	{@render children?.()}
 </button>
 ```
 
@@ -156,7 +156,7 @@ Not all elements have a dedicated type definition. For those without one, use `S
 </script>
 
 <div {...rest}>
-	{@render children()}
+	{@render children?.()}
 </div>
 ```
 

From 6e391fce59c5c79cd42b0b214a54143e05e01db3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 20 Nov 2024 17:14:43 -0500
Subject: [PATCH 189/404] Version Packages (#14380)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/tiny-trainers-sleep.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/tiny-trainers-sleep.md

diff --git a/.changeset/tiny-trainers-sleep.md b/.changeset/tiny-trainers-sleep.md
deleted file mode 100644
index 4cb0b05e66..0000000000
--- a/.changeset/tiny-trainers-sleep.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: always use set for private identifiers
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index b69c0dd3e5..47b620b402 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.2.7
+
+### Patch Changes
+
+- fix: always use set for private identifiers ([#14378](https://github.com/sveltejs/svelte/pull/14378))
+
 ## 5.2.6
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 9c11b4cdd9..130fe64ba0 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.2.6",
+  "version": "5.2.7",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1db41e6c21..3cd065be8e 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.2.6';
+export const VERSION = '5.2.7';
 export const PUBLIC_VERSION = '5';

From 6a5f30b290dbce34afdd1f5d743044e904d024a6 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 21 Nov 2024 13:48:36 +0100
Subject: [PATCH 190/404] chore: add changeset checkbox to PR template (#14388)

too many people forget it
---
 .github/PULL_REQUEST_TEMPLATE.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index 6d1fead587..aa5f9732b6 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -4,6 +4,7 @@
 - [ ] Prefix your PR title with `feat:`, `fix:`, `chore:`, or `docs:`.
 - [ ] This message body should clearly illustrate what problems it solves.
 - [ ] Ideally, include a test that fails without this PR but passes with it.
+- [ ] If this PR changes code within `packages/svelte/src`, add a changeset (`npx changeset`).
 
 ### Tests and linting
 

From dd9abea2a1059cbead398c5578bfd07a3c3ddd69 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 21 Nov 2024 16:40:10 +0000
Subject: [PATCH 191/404] fix: ensure spread attribute events are attached
 synchronously (#14387)

* fix: ensure spread attribute events are attached synchronously

* fix: ensure spread attribute events are attached synchronously

* Update .changeset/rich-worms-burn.md

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

* simplify

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/rich-worms-burn.md                 |  5 ++++
 .../client/dom/elements/attributes.js         | 27 ++-----------------
 .../samples/event-spread-timing/_config.js    |  7 +++++
 .../samples/event-spread-timing/main.svelte   |  7 +++++
 4 files changed, 21 insertions(+), 25 deletions(-)
 create mode 100644 .changeset/rich-worms-burn.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/event-spread-timing/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/event-spread-timing/main.svelte

diff --git a/.changeset/rich-worms-burn.md b/.changeset/rich-worms-burn.md
new file mode 100644
index 0000000000..8ec3af516a
--- /dev/null
+++ b/.changeset/rich-worms-burn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: attach spread attribute events synchronously
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 545cab20f8..d927af543f 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -5,7 +5,7 @@ import { create_event, delegate } from './events.js';
 import { add_form_reset_listener, autofocus } from './misc.js';
 import * as w from '../../warnings.js';
 import { LOADING_ATTR_SYMBOL } from '../../constants.js';
-import { queue_idle_task, queue_micro_task } from '../task.js';
+import { queue_idle_task } from '../task.js';
 import { is_capture_event, is_delegated, normalize_attribute } from '../../../../utils.js';
 import {
 	active_effect,
@@ -209,8 +209,6 @@ export function set_attributes(
 
 	// @ts-expect-error
 	var attributes = /** @type {Record<string, unknown>} **/ (element.__attributes ??= {});
-	/** @type {Array<[string, any, () => void]>} */
-	var events = [];
 
 	// since key is captured we use const
 	for (const key in next) {
@@ -277,15 +275,7 @@ export function set_attributes(
 						current[key].call(this, evt);
 					}
 
-					if (!prev) {
-						events.push([
-							key,
-							value,
-							() => (current[event_handle_key] = create_event(event_name, element, handle, opts))
-						]);
-					} else {
-						current[event_handle_key] = create_event(event_name, element, handle, opts);
-					}
+					current[event_handle_key] = create_event(event_name, element, handle, opts);
 				} else {
 					// @ts-ignore
 					element[`__${event_name}`] = value;
@@ -325,19 +315,6 @@ export function set_attributes(
 		}
 	}
 
-	// On the first run, ensure that events are added after bindings so
-	// that their listeners fire after the binding listeners
-	if (!prev) {
-		queue_micro_task(() => {
-			if (!element.isConnected) return;
-			for (const [key, value, evt] of events) {
-				if (current[key] === value) {
-					evt();
-				}
-			}
-		});
-	}
-
 	return current;
 }
 
diff --git a/packages/svelte/tests/runtime-runes/samples/event-spread-timing/_config.js b/packages/svelte/tests/runtime-runes/samples/event-spread-timing/_config.js
new file mode 100644
index 0000000000..bde384b51b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/event-spread-timing/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs }) {
+		assert.deepEqual(logs, ['onfocus']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/event-spread-timing/main.svelte b/packages/svelte/tests/runtime-runes/samples/event-spread-timing/main.svelte
new file mode 100644
index 0000000000..bb04abce83
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/event-spread-timing/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	const focus = (input) => {
+		input.focus();
+	};
+</script>
+
+<input {...({})} onfocus={() => console.log("onfocus")} use:focus />

From 046900876f7951a9116688f936e61df69664c2c9 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 22 Nov 2024 09:48:36 -0500
Subject: [PATCH 192/404] chore: remove references to node.parent (#14395)

* chore: remove references to node.parent

* types

* add ElementWithPath interface

* put path on analysis.elements instead of metadata

* Revert "put path on analysis.elements instead of metadata"

This reverts commit c0c7ab8bd10a812e84b267352b2afced4057e6d6.

* use node.metadata.path

* remove a node.parent usage

* another

* and another, albeit by replacing some bewildering code with some more bewildering code

* make loop idiomatic

* replace some more weirdo code

* simplify
---
 .../phases/2-analyze/css/css-prune.js         | 108 ++++++++++--------
 .../src/compiler/phases/2-analyze/index.js    |  20 ++--
 .../2-analyze/visitors/ExpressionTag.js       |   4 +-
 .../2-analyze/visitors/RegularElement.js      |   4 +-
 .../phases/2-analyze/visitors/RenderTag.js    |   1 +
 .../2-analyze/visitors/SvelteElement.js       |   4 +-
 .../phases/2-analyze/visitors/Text.js         |   4 +-
 .../phases/2-analyze/visitors/shared/a11y.js  |  19 +--
 .../svelte/src/compiler/types/template.d.ts   |   2 +
 9 files changed, 90 insertions(+), 76 deletions(-)

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 bfb83d3e02..9147e887e5 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
@@ -260,12 +260,15 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 	switch (name) {
 		case ' ':
 		case '>': {
-			let parent = /** @type {Compiler.TemplateNode | null} */ (element.parent);
-
 			let parent_matched = false;
 			let crossed_component_boundary = false;
 
-			while (parent) {
+			const path = element.metadata.path;
+			let i = path.length;
+
+			while (i--) {
+				const parent = path[i];
+
 				if (parent.type === 'Component' || parent.type === 'SvelteComponent') {
 					crossed_component_boundary = true;
 				}
@@ -289,8 +292,6 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 
 					if (name === '>') return parent_matched;
 				}
-
-				parent = /** @type {Compiler.TemplateNode | null} */ (parent.parent);
 			}
 
 			return parent_matched || parent_selectors.every((selector) => is_global(selector, rule));
@@ -679,51 +680,50 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
  * @param {boolean} include_self
  */
 function get_following_sibling_elements(element, include_self) {
-	/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.Root | null} */
-	let parent = get_element_parent(element);
+	const path = element.metadata.path;
+	let i = path.length;
 
-	if (!parent) {
-		parent = element;
-		while (parent?.type !== 'Root') {
-			parent = /** @type {any} */ (parent).parent;
+	/** @type {Compiler.SvelteNode} */
+	let start = element;
+	let nodes = /** @type {Compiler.SvelteNode[]} */ (
+		/** @type {Compiler.AST.Fragment} */ (path[0]).nodes
+	);
+
+	// find the set of nodes to walk...
+	while (i--) {
+		const node = path[i];
+
+		if (node.type === 'RegularElement' || node.type === 'SvelteElement') {
+			nodes = node.fragment.nodes;
+			break;
+		}
+
+		if (node.type !== 'Fragment') {
+			start = node;
 		}
 	}
 
 	/** @type {Array<Compiler.AST.RegularElement | Compiler.AST.SvelteElement>} */
-	const sibling_elements = [];
-	let found_parent = false;
-
-	for (const el of parent.fragment.nodes) {
-		if (found_parent) {
-			walk(
-				el,
-				{},
-				{
-					RegularElement(node) {
-						sibling_elements.push(node);
-					},
-					SvelteElement(node) {
-						sibling_elements.push(node);
-					}
-				}
-			);
-		} else {
-			/** @type {any} */
-			let child = element;
-			while (child !== el && child !== parent) {
-				child = child.parent;
+	const siblings = [];
+
+	// ...then walk them, starting from the node after the one
+	// containing the element in question
+	for (const node of nodes.slice(nodes.indexOf(start) + 1)) {
+		walk(node, null, {
+			RegularElement(node) {
+				siblings.push(node);
+			},
+			SvelteElement(node) {
+				siblings.push(node);
 			}
-			if (child === el) {
-				found_parent = true;
-			}
-		}
+		});
 	}
 
 	if (include_self) {
-		sibling_elements.push(element);
+		siblings.push(element);
 	}
 
-	return sibling_elements;
+	return siblings;
 }
 
 /**
@@ -867,15 +867,18 @@ function unquote(str) {
  * @returns {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null}
  */
 function get_element_parent(node) {
-	/** @type {Compiler.SvelteNode | null} */
-	let parent = node;
-	while (
-		// @ts-expect-error TODO figure out a more elegant solution
-		(parent = parent.parent) &&
-		parent.type !== 'RegularElement' &&
-		parent.type !== 'SvelteElement'
-	);
-	return parent ?? null;
+	let path = node.metadata.path;
+	let i = path.length;
+
+	while (i--) {
+		const parent = path[i];
+
+		if (parent.type === 'RegularElement' || parent.type === 'SvelteElement') {
+			return parent;
+		}
+	}
+
+	return null;
 }
 
 /**
@@ -920,7 +923,7 @@ function find_previous_sibling(node) {
 	while (current_node?.type === 'SlotElement') {
 		const slot_children = current_node.fragment.nodes;
 		if (slot_children.length > 0) {
-			current_node = slot_children.slice(-1)[0];
+			current_node = slot_children[slot_children.length - 1];
 		} else {
 			break;
 		}
@@ -1118,8 +1121,12 @@ function mark_as_probably(result) {
 function loop_child(children, adjacent_only) {
 	/** @type {Map<Compiler.AST.RegularElement, NodeExistsValue>} */
 	const result = new Map();
-	for (let i = children.length - 1; i >= 0; i--) {
+
+	let i = children.length;
+
+	while (i--) {
 		const child = children[i];
+
 		if (child.type === 'RegularElement') {
 			result.set(child, NODE_DEFINITELY_EXISTS);
 			if (adjacent_only) {
@@ -1137,5 +1144,6 @@ function loop_child(children, adjacent_only) {
 			}
 		}
 	}
+
 	return result;
 }
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index a96652d60b..0a61fdbd88 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -709,8 +709,8 @@ export function analyze_component(root, source, options) {
 		analyze_css(analysis.css.ast, analysis);
 
 		// mark nodes as scoped/unused/empty etc
-		for (const element of analysis.elements) {
-			prune(analysis.css.ast, element);
+		for (const node of analysis.elements) {
+			prune(analysis.css.ast, node);
 		}
 
 		const { comment } = analysis.css.ast.content;
@@ -724,18 +724,18 @@ export function analyze_component(root, source, options) {
 			warn_unused(analysis.css.ast);
 		}
 
-		outer: for (const element of analysis.elements) {
-			if (element.type === 'RenderTag') continue;
+		outer: for (const node of analysis.elements) {
+			if (node.type === 'RenderTag') continue;
 
-			if (element.metadata.scoped) {
+			if (node.metadata.scoped) {
 				// Dynamic elements in dom mode always use spread for attributes and therefore shouldn't have a class attribute added to them
 				// TODO this happens during the analysis phase, which shouldn't know anything about client vs server
-				if (element.type === 'SvelteElement' && options.generate === 'client') continue;
+				if (node.type === 'SvelteElement' && options.generate === 'client') continue;
 
 				/** @type {AST.Attribute | undefined} */
 				let class_attribute = undefined;
 
-				for (const attribute of element.attributes) {
+				for (const attribute of node.attributes) {
 					if (attribute.type === 'SpreadAttribute') {
 						// The spread method appends the hash to the end of the class attribute on its own
 						continue outer;
@@ -768,7 +768,7 @@ export function analyze_component(root, source, options) {
 						}
 					}
 				} else {
-					element.attributes.push(
+					node.attributes.push(
 						create_attribute('class', -1, -1, [
 							{
 								type: 'Text',
@@ -780,8 +780,8 @@ export function analyze_component(root, source, options) {
 							}
 						])
 					);
-					if (is_custom_element_node(element) && element.attributes.length === 1) {
-						mark_subtree_dynamic(element.metadata.path);
+					if (is_custom_element_node(node) && node.attributes.length === 1) {
+						mark_subtree_dynamic(node.metadata.path);
 					}
 				}
 			}
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
index 32c8d2ca36..7e21d5ca14 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
@@ -9,7 +9,9 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
  * @param {Context} context
  */
 export function ExpressionTag(node, context) {
-	if (node.parent && context.state.parent_element) {
+	const in_attribute = context.path.at(-1)?.type === 'Attribute';
+
+	if (!in_attribute && context.state.parent_element) {
 		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
 			e.node_invalid_placement(node, '`{expression}`', context.state.parent_element);
 		}
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index 7d1c4aaeaa..fa6ca0f6e9 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -19,11 +19,9 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
  */
 export function RegularElement(node, context) {
 	validate_element(node, context);
-
-	check_element(node, context.state);
+	check_element(node, context);
 
 	node.metadata.path = [...context.path];
-
 	context.state.analysis.elements.push(node);
 
 	// Special case: Move the children of <textarea> into a value attribute if they are dynamic
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
index 244a4dd26c..57bd80ff1c 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
@@ -12,6 +12,7 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
 export function RenderTag(node, context) {
 	validate_opening_tag(node, context.state, '@');
 
+	node.metadata.path = [...context.path];
 	context.state.analysis.elements.push(node);
 
 	const callee = unwrap_optional(node.expression).callee;
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
index c0b9f95fc2..c45859408c 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteElement.js
@@ -12,9 +12,9 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
  */
 export function SvelteElement(node, context) {
 	validate_element(node, context);
+	check_element(node, context);
 
-	check_element(node, context.state);
-
+	node.metadata.path = [...context.path];
 	context.state.analysis.elements.push(node);
 
 	const xmlns = /** @type {AST.Attribute & { value: [AST.Text] } | undefined} */ (
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
index a9ba67e95c..2eca7d43e9 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
@@ -9,7 +9,9 @@ import * as e from '../../../errors.js';
  * @param {Context} context
  */
 export function Text(node, context) {
-	if (node.parent && context.state.parent_element && regex_not_whitespace.test(node.data)) {
+	const in_attribute = context.path.at(-1)?.type === 'Attribute';
+
+	if (!in_attribute && context.state.parent_element && regex_not_whitespace.test(node.data)) {
 		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
 			e.node_invalid_placement(node, 'Text node', context.state.parent_element);
 		}
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 9fddade24d..3bd16b0dd4 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,4 +1,4 @@
-/** @import { AnalysisState } from '../../types.js' */
+/** @import { Context } from '../../types.js' */
 /** @import { AST, SvelteNode, TemplateNode } from '#compiler' */
 /** @import { ARIARoleDefinitionKey, ARIARoleRelationConcept, ARIAProperty, ARIAPropertyDefinition, ARIARoleDefinition } from 'aria-query' */
 import { roles as roles_map, aria, elementRoles } from 'aria-query';
@@ -582,16 +582,17 @@ function get_implicit_role(name, attribute_map) {
 const invisible_elements = ['meta', 'html', 'script', 'style'];
 
 /**
- * @param {SvelteNode | null} parent
+ * @param {SvelteNode[]} path
  * @param {string[]} elements
  */
-function is_parent(parent, elements) {
-	while (parent) {
+function is_parent(path, elements) {
+	let i = path.length;
+	while (i--) {
+		const parent = path[i];
 		if (parent.type === 'SvelteElement') return true; // unknown, play it safe, so we don't warn
 		if (parent.type === 'RegularElement') {
 			return elements.includes(parent.name);
 		}
-		parent = /** @type {TemplateNode} */ (parent).parent;
 	}
 	return false;
 }
@@ -683,9 +684,9 @@ function get_static_text_value(attribute) {
 
 /**
  * @param {AST.RegularElement | AST.SvelteElement} node
- * @param {AnalysisState} state
+ * @param {Context} context
  */
-export function check_element(node, state) {
+export function check_element(node, context) {
 	/** @type {Map<string, AST.Attribute>} */
 	const attribute_map = new Map();
 
@@ -792,7 +793,7 @@ export function check_element(node, state) {
 					}
 
 					// Footers and headers are special cases, and should not have redundant roles unless they are the children of sections or articles.
-					const is_parent_section_or_article = is_parent(node.parent, ['section', 'article']);
+					const is_parent_section_or_article = is_parent(context.path, ['section', 'article']);
 					if (!is_parent_section_or_article) {
 						const has_nested_redundant_role =
 							current_role === a11y_nested_implicit_semantics.get(node.name);
@@ -1114,7 +1115,7 @@ export function check_element(node, state) {
 	}
 
 	if (node.name === 'figcaption') {
-		if (!is_parent(node.parent, ['figure'])) {
+		if (!is_parent(context.path, ['figure'])) {
 			w.a11y_figcaption_parent(node);
 		}
 	}
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index fd1824d3b3..59456412bd 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -167,6 +167,7 @@ export namespace AST {
 		metadata: {
 			dynamic: boolean;
 			args_with_call_expression: Set<number>;
+			path: SvelteNode[];
 		};
 	}
 
@@ -344,6 +345,7 @@ export namespace AST {
 			 */
 			mathml: boolean;
 			scoped: boolean;
+			path: SvelteNode[];
 		};
 	}
 

From e721d96d32ccbea5961f491a4349f71e57b15cd1 Mon Sep 17 00:00:00 2001
From: Theodor Steiner <40017636+Theo-Steiner@users.noreply.github.com>
Date: Sat, 23 Nov 2024 00:22:05 +0900
Subject: [PATCH 193/404] fix: export temporary LegacyComponentType (#14256)
 (#14257)

closes  #14256

helps TypeScript when generating dts files to not fail
---
 .changeset/lovely-mayflies-sing.md          |  5 +++++
 packages/svelte/src/ambient.d.ts            | 14 +++-----------
 packages/svelte/src/legacy/legacy-client.js |  5 +++++
 packages/svelte/types/index.d.ts            | 21 ++++++++++-----------
 4 files changed, 23 insertions(+), 22 deletions(-)
 create mode 100644 .changeset/lovely-mayflies-sing.md

diff --git a/.changeset/lovely-mayflies-sing.md b/.changeset/lovely-mayflies-sing.md
new file mode 100644
index 0000000000..a9ced0b19e
--- /dev/null
+++ b/.changeset/lovely-mayflies-sing.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: provide temporary `LegacyComponentType`
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index 8a20a884ff..fe87e446d6 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -1,17 +1,9 @@
 declare module '*.svelte' {
 	// use prettier-ignore for a while because of https://github.com/sveltejs/language-tools/commit/026111228b5814a9109cc4d779d37fb02955fb8b
 	// prettier-ignore
-	import { SvelteComponent, Component, type ComponentConstructorOptions } from 'svelte'
-
-	// Support using the component as both a class and function during the transition period
-	// prettier-ignore
-	interface ComponentType {
-		(
-			...args: Parameters<Component<Record<string, any>>>
-		): ReturnType<Component<Record<string, any>, Record<string, any>>>
-		new (o: ComponentConstructorOptions): SvelteComponent
-	}
-	const Comp: ComponentType;
+	import { SvelteComponent } from 'svelte'
+	import { LegacyComponentType } from 'svelte/legacy';
+	const Comp: LegacyComponentType;
 	type Comp = SvelteComponent;
 	export default Comp;
 }
diff --git a/packages/svelte/src/legacy/legacy-client.js b/packages/svelte/src/legacy/legacy-client.js
index 9e1cd888ad..3715617f4c 100644
--- a/packages/svelte/src/legacy/legacy-client.js
+++ b/packages/svelte/src/legacy/legacy-client.js
@@ -63,6 +63,11 @@ export function asClassComponent(component) {
 	};
 }
 
+/**
+ * Support using the component as both a class and function during the transition period
+ * @typedef  {{new (o: ComponentConstructorOptions): SvelteComponent;(...args: Parameters<Component<Record<string, any>>>): ReturnType<Component<Record<string, any>, Record<string, any>>>;}} LegacyComponentType
+ */
+
 class Svelte4Component {
 	/** @type {any} */
 	#events;
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 00ba2556d9..01119e7485 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1578,6 +1578,13 @@ declare module 'svelte/legacy' {
 	 * @deprecated Use this only as a temporary solution to migrate your automatically delegated events in Svelte 5.
 	 */
 	export function createBubbler(): (type: string) => (event: Event) => boolean;
+	/**
+	 * Support using the component as both a class and function during the transition period
+	 */
+	export type LegacyComponentType = {
+		new (o: ComponentConstructorOptions): SvelteComponent;
+		(...args: Parameters<Component<Record<string, any>>>): ReturnType<Component<Record<string, any>, Record<string, any>>>;
+	};
 	/**
 	 * Substitute for the `trusted` event modifier
 	 * @deprecated
@@ -2308,17 +2315,9 @@ declare module 'svelte/types/compiler/interfaces' {
 }declare module '*.svelte' {
 	// use prettier-ignore for a while because of https://github.com/sveltejs/language-tools/commit/026111228b5814a9109cc4d779d37fb02955fb8b
 	// prettier-ignore
-	import { SvelteComponent, Component, type ComponentConstructorOptions } from 'svelte'
-
-	// Support using the component as both a class and function during the transition period
-	// prettier-ignore
-	interface ComponentType {
-		(
-			...args: Parameters<Component<Record<string, any>>>
-		): ReturnType<Component<Record<string, any>, Record<string, any>>>
-		new (o: ComponentConstructorOptions): SvelteComponent
-	}
-	const Comp: ComponentType;
+	import { SvelteComponent } from 'svelte'
+	import { LegacyComponentType } from 'svelte/legacy';
+	const Comp: LegacyComponentType;
 	type Comp = SvelteComponent;
 	export default Comp;
 }

From 37e6c7f26b39b6f068ed8ccba47aa186e2ca241a Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 22 Nov 2024 14:44:43 -0500
Subject: [PATCH 194/404] fix: correctly prune key/each blocks (#14403)

* fix: correctly prune key blocks

* fix pruning of each blocks

* simplify

* make more explicit

* changeset

* helperise/robustify
---
 .changeset/fuzzy-lies-battle.md               |   5 +
 .changeset/wicked-buses-work.md               |   5 +
 .../phases/2-analyze/css/css-prune.js         | 128 ++++++++----------
 .../_config.js                                |   5 +
 .../expected.css                              |   4 +
 .../input.svelte                              |  13 ++
 .../_config.js                                |  48 ++-----
 .../expected.css                              |  21 +--
 .../expected.html                             |   2 +-
 .../input.svelte                              |  20 +--
 .../siblings-combinator-key/_config.js        |  12 ++
 .../siblings-combinator-key/expected.css      |   6 +
 .../siblings-combinator-key/input.svelte      |  15 ++
 13 files changed, 156 insertions(+), 128 deletions(-)
 create mode 100644 .changeset/fuzzy-lies-battle.md
 create mode 100644 .changeset/wicked-buses-work.md
 create mode 100644 packages/svelte/tests/css/samples/general-siblings-combinator-key/_config.js
 create mode 100644 packages/svelte/tests/css/samples/general-siblings-combinator-key/expected.css
 create mode 100644 packages/svelte/tests/css/samples/general-siblings-combinator-key/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-key/_config.js
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-key/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-key/input.svelte

diff --git a/.changeset/fuzzy-lies-battle.md b/.changeset/fuzzy-lies-battle.md
new file mode 100644
index 0000000000..ebca5aa862
--- /dev/null
+++ b/.changeset/fuzzy-lies-battle.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly prune each blocks
diff --git a/.changeset/wicked-buses-work.md b/.changeset/wicked-buses-work.md
new file mode 100644
index 0000000000..3fb4e96b79
--- /dev/null
+++ b/.changeset/wicked-buses-work.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly prune key blocks
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 9147e887e5..899ea7e894 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
@@ -955,7 +955,7 @@ function get_possible_element_siblings(node, adjacent_only) {
 			if (adjacent_only) {
 				break;
 			}
-		} else if (prev.type === 'EachBlock' || prev.type === 'IfBlock' || prev.type === 'AwaitBlock') {
+		} else if (is_block(prev)) {
 			const possible_last_child = get_possible_last_child(prev, adjacent_only);
 			add_to_map(possible_last_child, result);
 			if (adjacent_only && has_definite_elements(possible_last_child)) {
@@ -979,7 +979,7 @@ function get_possible_element_siblings(node, adjacent_only) {
 		while (
 			// @ts-expect-error TODO
 			(parent = parent?.parent) &&
-			(parent.type === 'EachBlock' || parent.type === 'IfBlock' || parent.type === 'AwaitBlock')
+			is_block(parent)
 		) {
 			const possible_siblings = get_possible_element_siblings(parent, adjacent_only);
 			add_to_map(possible_siblings, result);
@@ -1000,73 +1000,57 @@ function get_possible_element_siblings(node, adjacent_only) {
 }
 
 /**
- * @param {Compiler.AST.EachBlock | Compiler.AST.IfBlock | Compiler.AST.AwaitBlock} relative_selector
+ * @param {Compiler.AST.EachBlock | Compiler.AST.IfBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock} node
  * @param {boolean} adjacent_only
  * @returns {Map<Compiler.AST.RegularElement, NodeExistsValue>}
  */
-function get_possible_last_child(relative_selector, adjacent_only) {
+function get_possible_last_child(node, adjacent_only) {
 	/** @typedef {Map<Compiler.AST.RegularElement, NodeExistsValue>} NodeMap */
 
+	/** @type {Array<Compiler.AST.Fragment | undefined | null>} */
+	let fragments = [];
+
+	switch (node.type) {
+		case 'EachBlock':
+			fragments.push(node.body, node.fallback);
+			break;
+
+		case 'IfBlock':
+			fragments.push(node.consequent, node.alternate);
+			break;
+
+		case 'AwaitBlock':
+			fragments.push(node.pending, node.then, node.catch);
+			break;
+
+		case 'KeyBlock':
+			fragments.push(node.fragment);
+			break;
+	}
+
 	/** @type {NodeMap} */
 	const result = new Map();
-	if (relative_selector.type === 'EachBlock') {
-		/** @type {NodeMap} */
-		const each_result = loop_child(relative_selector.body.nodes, adjacent_only);
-
-		/** @type {NodeMap} */
-		const else_result = relative_selector.fallback
-			? loop_child(relative_selector.fallback.nodes, adjacent_only)
-			: new Map();
-		const not_exhaustive = !has_definite_elements(else_result);
-		if (not_exhaustive) {
-			mark_as_probably(each_result);
-			mark_as_probably(else_result);
-		}
-		add_to_map(each_result, result);
-		add_to_map(else_result, result);
-	} else if (relative_selector.type === 'IfBlock') {
-		/** @type {NodeMap} */
-		const if_result = loop_child(relative_selector.consequent.nodes, adjacent_only);
-
-		/** @type {NodeMap} */
-		const else_result = relative_selector.alternate
-			? loop_child(relative_selector.alternate.nodes, adjacent_only)
-			: new Map();
-		const not_exhaustive = !has_definite_elements(if_result) || !has_definite_elements(else_result);
-		if (not_exhaustive) {
-			mark_as_probably(if_result);
-			mark_as_probably(else_result);
+
+	let exhaustive = true;
+
+	for (const fragment of fragments) {
+		if (fragment == null) {
+			exhaustive = false;
+			continue;
 		}
-		add_to_map(if_result, result);
-		add_to_map(else_result, result);
-	} else if (relative_selector.type === 'AwaitBlock') {
-		/** @type {NodeMap} */
-		const pending_result = relative_selector.pending
-			? loop_child(relative_selector.pending.nodes, adjacent_only)
-			: new Map();
-
-		/** @type {NodeMap} */
-		const then_result = relative_selector.then
-			? loop_child(relative_selector.then.nodes, adjacent_only)
-			: new Map();
-
-		/** @type {NodeMap} */
-		const catch_result = relative_selector.catch
-			? loop_child(relative_selector.catch.nodes, adjacent_only)
-			: new Map();
-		const not_exhaustive =
-			!has_definite_elements(pending_result) ||
-			!has_definite_elements(then_result) ||
-			!has_definite_elements(catch_result);
-		if (not_exhaustive) {
-			mark_as_probably(pending_result);
-			mark_as_probably(then_result);
-			mark_as_probably(catch_result);
+
+		const map = loop_child(fragment.nodes, adjacent_only);
+		exhaustive &&= has_definite_elements(map);
+
+		add_to_map(map, result);
+	}
+
+	if (!exhaustive) {
+		for (const key of result.keys()) {
+			result.set(key, NODE_PROBABLY_EXISTS);
 		}
-		add_to_map(pending_result, result);
-		add_to_map(then_result, result);
-		add_to_map(catch_result, result);
 	}
+
 	return result;
 }
 
@@ -1107,13 +1091,6 @@ function higher_existence(exist1, exist2) {
 	return exist1 > exist2 ? exist1 : exist2;
 }
 
-/** @param {Map<Compiler.AST.RegularElement, NodeExistsValue>} result */
-function mark_as_probably(result) {
-	for (const key of result.keys()) {
-		result.set(key, NODE_PROBABLY_EXISTS);
-	}
-}
-
 /**
  * @param {Compiler.SvelteNode[]} children
  * @param {boolean} adjacent_only
@@ -1132,11 +1109,7 @@ function loop_child(children, adjacent_only) {
 			if (adjacent_only) {
 				break;
 			}
-		} else if (
-			child.type === 'EachBlock' ||
-			child.type === 'IfBlock' ||
-			child.type === 'AwaitBlock'
-		) {
+		} else if (is_block(child)) {
 			const child_result = get_possible_last_child(child, adjacent_only);
 			add_to_map(child_result, result);
 			if (adjacent_only && has_definite_elements(child_result)) {
@@ -1147,3 +1120,16 @@ function loop_child(children, adjacent_only) {
 
 	return result;
 }
+
+/**
+ * @param {Compiler.SvelteNode} node
+ * @returns {node is Compiler.AST.IfBlock | Compiler.AST.EachBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock}
+ */
+function is_block(node) {
+	return (
+		node.type === 'IfBlock' ||
+		node.type === 'EachBlock' ||
+		node.type === 'AwaitBlock' ||
+		node.type === 'KeyBlock'
+	);
+}
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-key/_config.js b/packages/svelte/tests/css/samples/general-siblings-combinator-key/_config.js
new file mode 100644
index 0000000000..292c6c49ac
--- /dev/null
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-key/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: []
+});
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-key/expected.css b/packages/svelte/tests/css/samples/general-siblings-combinator-key/expected.css
new file mode 100644
index 0000000000..dde595dc8a
--- /dev/null
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-key/expected.css
@@ -0,0 +1,4 @@
+
+	.a.svelte-xyz ~ .b:where(.svelte-xyz) { color: green; }
+	.a.svelte-xyz ~ .c:where(.svelte-xyz) { color: green; }
+	.b.svelte-xyz ~ .c:where(.svelte-xyz) { color: green; }
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-key/input.svelte b/packages/svelte/tests/css/samples/general-siblings-combinator-key/input.svelte
new file mode 100644
index 0000000000..82a666d584
--- /dev/null
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-key/input.svelte
@@ -0,0 +1,13 @@
+<div class="a"></div>
+
+{#key x}
+	<div class="b"></div>
+{/key}
+
+<div class="c"></div>
+
+<style>
+	.a ~ .b { color: green; }
+	.a ~ .c { color: green; }
+	.b ~ .c { color: green; }
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/_config.js b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/_config.js
index 6ea62ad0c5..f8b4747e43 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/_config.js
+++ b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/_config.js
@@ -5,62 +5,38 @@ export default test({
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".a + .c"',
-			start: { character: 478, column: 1, line: 23 },
-			end: { character: 485, column: 8, line: 23 }
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".a + .g"',
-			start: { character: 505, column: 1, line: 24 },
-			end: { character: 512, column: 8, line: 24 }
+			start: { character: 586, column: 1, line: 27 },
+			end: { character: 593, column: 8, line: 27 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".b + .e"',
-			start: { character: 532, column: 1, line: 25 },
-			end: { character: 539, column: 8, line: 25 }
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".c + .g"',
-			start: { character: 559, column: 1, line: 26 },
-			end: { character: 566, column: 8, line: 26 }
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".c + .k"',
-			start: { character: 586, column: 1, line: 27 },
-			end: { character: 593, column: 8, line: 27 }
+			start: { character: 611, column: 1, line: 28 },
+			end: { character: 618, column: 8, line: 28 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".d + .d"',
-			start: { character: 613, column: 1, line: 28 },
-			end: { character: 620, column: 8, line: 28 }
+			start: { character: 636, column: 1, line: 29 },
+			end: { character: 643, column: 8, line: 29 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".e + .f"',
-			start: { character: 640, column: 1, line: 29 },
-			end: { character: 647, column: 8, line: 29 }
+			start: { character: 661, column: 1, line: 30 },
+			end: { character: 668, column: 8, line: 30 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".f + .f"',
-			start: { character: 667, column: 1, line: 30 },
-			end: { character: 674, column: 8, line: 30 }
-		},
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".g + .j"',
-			start: { character: 694, column: 1, line: 31 },
-			end: { character: 701, column: 8, line: 31 }
+			start: { character: 686, column: 1, line: 31 },
+			end: { character: 693, column: 8, line: 31 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".g + .h + .i + .j"',
-			start: { character: 721, column: 1, line: 32 },
-			end: { character: 738, column: 18, line: 32 }
+			start: { character: 711, column: 1, line: 32 },
+			end: { character: 728, column: 18, line: 32 }
 		}
 	]
 });
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.css
index 55c0e95913..85c1522bac 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.css
+++ b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.css
@@ -1,27 +1,28 @@
+
 	.a.svelte-xyz + .e:where(.svelte-xyz) { color: green; }
 	.a.svelte-xyz + .f:where(.svelte-xyz) { color: green; }
+	.a.svelte-xyz + .g:where(.svelte-xyz) { color: green; }
 	.b.svelte-xyz + .c:where(.svelte-xyz) { color: green; }
 	.b.svelte-xyz + .d:where(.svelte-xyz) { color: green; }
 	.c.svelte-xyz + .e:where(.svelte-xyz) { color: green; }
 	.c.svelte-xyz + .f:where(.svelte-xyz) { color: green; }
+	.c.svelte-xyz + .g:where(.svelte-xyz) { color: green; }
+	.c.svelte-xyz + .k:where(.svelte-xyz) { color: green; }
 	.d.svelte-xyz + .e:where(.svelte-xyz) { color: green; }
 	.d.svelte-xyz + .f:where(.svelte-xyz) { color: green; }
 	.e.svelte-xyz + .e:where(.svelte-xyz) { color: green; }
 	.i.svelte-xyz + .j:where(.svelte-xyz) { color: green; }
 	.g.svelte-xyz + .h:where(.svelte-xyz) + .j:where(.svelte-xyz) { color: green; }
 	.g.svelte-xyz + .i:where(.svelte-xyz) + .j:where(.svelte-xyz) { color: green; }
+	.g.svelte-xyz + .j:where(.svelte-xyz) { color: green; }
 	.m.svelte-xyz + .m:where(.svelte-xyz) { color: green; }
 	.m.svelte-xyz + .l:where(.svelte-xyz) { color: green; }
 	.l.svelte-xyz + .m:where(.svelte-xyz) { color: green; }
 
 	/* no match */
-	/* (unused) .a + .c { color: green; }*/
-	/* (unused) .a + .g { color: green; }*/
-	/* (unused) .b + .e { color: green; }*/
-	/* (unused) .c + .g { color: green; }*/
-	/* (unused) .c + .k { color: green; }*/
-	/* (unused) .d + .d { color: green; }*/
-	/* (unused) .e + .f { color: green; }*/
-	/* (unused) .f + .f { color: green; }*/
-	/* (unused) .g + .j { color: green; }*/
-	/* (unused) .g + .h + .i + .j { color: green; }*/
+	/* (unused) .a + .c { color: red; }*/
+	/* (unused) .b + .e { color: red; }*/
+	/* (unused) .d + .d { color: red; }*/
+	/* (unused) .e + .f { color: red; }*/
+	/* (unused) .f + .f { color: red; }*/
+	/* (unused) .g + .h + .i + .j { color: red; }*/
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.html b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.html
index 5f25a2d38a..03d19e06bb 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.html
+++ b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/expected.html
@@ -1,3 +1,3 @@
 <div class="a svelte-xyz"></div>
 <div class="f svelte-xyz"></div>
-<div class="k"></div>
\ No newline at end of file
+<div class="k svelte-xyz"></div>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/input.svelte
index 94da7d87ac..805977d3c3 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/input.svelte
+++ b/packages/svelte/tests/css/samples/siblings-combinator-each-else-nested/input.svelte
@@ -5,31 +5,31 @@
 <style>
 	.a + .e { color: green; }
 	.a + .f { color: green; }
+	.a + .g { color: green; }
 	.b + .c { color: green; }
 	.b + .d { color: green; }
 	.c + .e { color: green; }
 	.c + .f { color: green; }
+	.c + .g { color: green; }
+	.c + .k { color: green; }
 	.d + .e { color: green; }
 	.d + .f { color: green; }
 	.e + .e { color: green; }
 	.i + .j { color: green; }
 	.g + .h + .j { color: green; }
 	.g + .i + .j { color: green; }
+	.g + .j { color: green; }
 	.m + .m { color: green; }
 	.m + .l { color: green; }
 	.l + .m { color: green; }
 
 	/* no match */
-	.a + .c { color: green; }
-	.a + .g { color: green; }
-	.b + .e { color: green; }
-	.c + .g { color: green; }
-	.c + .k { color: green; }
-	.d + .d { color: green; }
-	.e + .f { color: green; }
-	.f + .f { color: green; }
-	.g + .j { color: green; }
-	.g + .h + .i + .j { color: green; }
+	.a + .c { color: red; }
+	.b + .e { color: red; }
+	.d + .d { color: red; }
+	.e + .f { color: red; }
+	.f + .f { color: red; }
+	.g + .h + .i + .j { color: red; }
 </style>
 
 <div class="a"></div>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-key/_config.js b/packages/svelte/tests/css/samples/siblings-combinator-key/_config.js
new file mode 100644
index 0000000000..01b14f0b39
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-key/_config.js
@@ -0,0 +1,12 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ".a + .c"',
+			start: { character: 166, column: 1, line: 14 },
+			end: { character: 173, column: 8, line: 14 }
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-key/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-key/expected.css
new file mode 100644
index 0000000000..6e89831e53
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-key/expected.css
@@ -0,0 +1,6 @@
+
+	.a.svelte-xyz + .b:where(.svelte-xyz) { color: green; }
+	.b.svelte-xyz + .c:where(.svelte-xyz) { color: green; }
+
+	/* no match */
+	/* (unused) .a + .c { color: red; }*/
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-key/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-key/input.svelte
new file mode 100644
index 0000000000..f0f9dea2b5
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-key/input.svelte
@@ -0,0 +1,15 @@
+<div class="a"></div>
+
+{#key x}
+	<div class="b"></div>
+{/key}
+
+<div class="c"></div>
+
+<style>
+	.a + .b { color: green; }
+	.b + .c { color: green; }
+
+	/* no match */
+	.a + .c { color: red; }
+</style>

From 63484aff9bbaf1029e88451ccb726854d683b5a8 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 25 Nov 2024 14:46:01 +0000
Subject: [PATCH 195/404] fix: ensure last empty text node correctly hydrates
 (#14425)

* fix: ensure last empty text node correctly hydrates

* fix: ensure last empty text node correctly hydrates
---
 .changeset/short-chicken-compare.md                 |  5 +++++
 .../svelte/src/internal/client/dom/operations.js    | 13 +++++++++++--
 .../tests/hydration/samples/text-empty-2/_config.js |  3 +++
 .../hydration/samples/text-empty-2/_expected.html   |  1 +
 .../hydration/samples/text-empty-2/main.svelte      |  7 +++++++
 5 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/short-chicken-compare.md
 create mode 100644 packages/svelte/tests/hydration/samples/text-empty-2/_config.js
 create mode 100644 packages/svelte/tests/hydration/samples/text-empty-2/_expected.html
 create mode 100644 packages/svelte/tests/hydration/samples/text-empty-2/main.svelte

diff --git a/.changeset/short-chicken-compare.md b/.changeset/short-chicken-compare.md
new file mode 100644
index 0000000000..d0f6c22de4
--- /dev/null
+++ b/.changeset/short-chicken-compare.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure last empty text node correctly hydrates
diff --git a/packages/svelte/src/internal/client/dom/operations.js b/packages/svelte/src/internal/client/dom/operations.js
index 6dfce9ebd3..627bf917ee 100644
--- a/packages/svelte/src/internal/client/dom/operations.js
+++ b/packages/svelte/src/internal/client/dom/operations.js
@@ -154,8 +154,10 @@ export function first_child(fragment, is_text) {
  */
 export function sibling(node, count = 1, is_text = false) {
 	let next_sibling = hydrating ? hydrate_node : node;
+	var last_sibling;
 
 	while (count--) {
+		last_sibling = next_sibling;
 		next_sibling = /** @type {TemplateNode} */ (get_next_sibling(next_sibling));
 	}
 
@@ -163,13 +165,20 @@ export function sibling(node, count = 1, is_text = false) {
 		return next_sibling;
 	}
 
-	var type = next_sibling.nodeType;
+	var type = next_sibling?.nodeType;
 
 	// if a sibling {expression} is empty during SSR, there might be no
 	// text node to hydrate — we must therefore create one
 	if (is_text && type !== 3) {
 		var text = create_text();
-		next_sibling?.before(text);
+		// If the next sibling is `null` and we're handling text then it's because
+		// the SSR content was empty for the text, so we need to generate a new text
+		// node and insert it after the last sibling
+		if (next_sibling === null) {
+			last_sibling?.after(text);
+		} else {
+			next_sibling.before(text);
+		}
 		set_hydrate_node(text);
 		return text;
 	}
diff --git a/packages/svelte/tests/hydration/samples/text-empty-2/_config.js b/packages/svelte/tests/hydration/samples/text-empty-2/_config.js
new file mode 100644
index 0000000000..f47bee71df
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/text-empty-2/_config.js
@@ -0,0 +1,3 @@
+import { test } from '../../test';
+
+export default test({});
diff --git a/packages/svelte/tests/hydration/samples/text-empty-2/_expected.html b/packages/svelte/tests/hydration/samples/text-empty-2/_expected.html
new file mode 100644
index 0000000000..ff12f10bfb
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/text-empty-2/_expected.html
@@ -0,0 +1 @@
+<!--[--><span><span></span></span><!--]-->
diff --git a/packages/svelte/tests/hydration/samples/text-empty-2/main.svelte b/packages/svelte/tests/hydration/samples/text-empty-2/main.svelte
new file mode 100644
index 0000000000..ae1ed05e3a
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/text-empty-2/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	let { name, remaining } = $props();
+</script>
+
+<span>
+	<span>{name}</span>{remaining >= 2 ? ',' : ''}
+</span>

From 2b5c0e791e5efbfdaf4041dc2a923c1b61529757 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 25 Nov 2024 11:30:12 -0500
Subject: [PATCH 196/404] Version Packages (#14383)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/fuzzy-lies-battle.md     |  5 -----
 .changeset/lovely-mayflies-sing.md  |  5 -----
 .changeset/rich-worms-burn.md       |  5 -----
 .changeset/short-chicken-compare.md |  5 -----
 .changeset/wicked-buses-work.md     |  5 -----
 packages/svelte/CHANGELOG.md        | 14 ++++++++++++++
 packages/svelte/package.json        |  2 +-
 packages/svelte/src/version.js      |  2 +-
 8 files changed, 16 insertions(+), 27 deletions(-)
 delete mode 100644 .changeset/fuzzy-lies-battle.md
 delete mode 100644 .changeset/lovely-mayflies-sing.md
 delete mode 100644 .changeset/rich-worms-burn.md
 delete mode 100644 .changeset/short-chicken-compare.md
 delete mode 100644 .changeset/wicked-buses-work.md

diff --git a/.changeset/fuzzy-lies-battle.md b/.changeset/fuzzy-lies-battle.md
deleted file mode 100644
index ebca5aa862..0000000000
--- a/.changeset/fuzzy-lies-battle.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly prune each blocks
diff --git a/.changeset/lovely-mayflies-sing.md b/.changeset/lovely-mayflies-sing.md
deleted file mode 100644
index a9ced0b19e..0000000000
--- a/.changeset/lovely-mayflies-sing.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: provide temporary `LegacyComponentType`
diff --git a/.changeset/rich-worms-burn.md b/.changeset/rich-worms-burn.md
deleted file mode 100644
index 8ec3af516a..0000000000
--- a/.changeset/rich-worms-burn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: attach spread attribute events synchronously
diff --git a/.changeset/short-chicken-compare.md b/.changeset/short-chicken-compare.md
deleted file mode 100644
index d0f6c22de4..0000000000
--- a/.changeset/short-chicken-compare.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure last empty text node correctly hydrates
diff --git a/.changeset/wicked-buses-work.md b/.changeset/wicked-buses-work.md
deleted file mode 100644
index 3fb4e96b79..0000000000
--- a/.changeset/wicked-buses-work.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly prune key blocks
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 47b620b402..35adeaf6b0 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,19 @@
 # svelte
 
+## 5.2.8
+
+### Patch Changes
+
+- fix: correctly prune each blocks ([#14403](https://github.com/sveltejs/svelte/pull/14403))
+
+- fix: provide temporary `LegacyComponentType` ([#14257](https://github.com/sveltejs/svelte/pull/14257))
+
+- fix: attach spread attribute events synchronously ([#14387](https://github.com/sveltejs/svelte/pull/14387))
+
+- fix: ensure last empty text node correctly hydrates ([#14425](https://github.com/sveltejs/svelte/pull/14425))
+
+- fix: correctly prune key blocks ([#14403](https://github.com/sveltejs/svelte/pull/14403))
+
 ## 5.2.7
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 130fe64ba0..bc03bcb990 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.2.7",
+  "version": "5.2.8",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 3cd065be8e..294ad27c1f 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.2.7';
+export const VERSION = '5.2.8';
 export const PUBLIC_VERSION = '5';

From d2ce0a79aee0c167c6133d1636bab73254a54e15 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 25 Nov 2024 13:49:31 -0500
Subject: [PATCH 197/404] remove stylesheet property from state (#14429)

---
 .../svelte/src/compiler/phases/2-analyze/css/css-prune.js    | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

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 899ea7e894..61f3fc822f 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
@@ -7,7 +7,6 @@ import { get_attribute_chunks, is_text_attribute } from '../../../utils/ast.js';
 
 /**
  * @typedef {{
- *   stylesheet: Compiler.Css.StyleSheet;
  *   element: Compiler.AST.RegularElement | Compiler.AST.SvelteElement;
  *   from_render_tag: boolean;
  * }} State
@@ -61,9 +60,9 @@ export function prune(stylesheet, element) {
 		const parent = get_element_parent(element);
 		if (!parent) return;
 
-		walk(stylesheet, { stylesheet, element: parent, from_render_tag: true }, visitors);
+		walk(stylesheet, { element: parent, from_render_tag: true }, visitors);
 	} else {
-		walk(stylesheet, { stylesheet, element, from_render_tag: false }, visitors);
+		walk(stylesheet, { element, from_render_tag: false }, visitors);
 	}
 }
 

From 191245930831c37ce36cb19adc7474c8310f34b3 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 25 Nov 2024 14:03:28 -0500
Subject: [PATCH 198/404] chore: initialize snippet binding correctly (#14430)

---
 packages/svelte/src/compiler/phases/2-analyze/index.js      | 5 +++--
 .../svelte/src/compiler/phases/3-transform/client/utils.js  | 3 ++-
 packages/svelte/src/compiler/phases/scope.js                | 6 +++---
 packages/svelte/src/compiler/types/index.d.ts               | 3 ++-
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 0a61fdbd88..0d8caa0a4b 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -287,6 +287,7 @@ export function analyze_component(root, source, options) {
 
 		const store_name = name.slice(1);
 		const declaration = instance.scope.get(store_name);
+		const init = /** @type {Node | undefined} */ (declaration?.initial);
 
 		// If we're not in legacy mode through the compiler option, assume the user
 		// is referencing a rune and not a global store.
@@ -295,9 +296,9 @@ export function analyze_component(root, source, options) {
 			!is_rune(name) ||
 			(declaration !== null &&
 				// const state = $state(0) is valid
-				(get_rune(declaration.initial, instance.scope) === null ||
+				(get_rune(init, instance.scope) === null ||
 					// rune-line names received as props are valid too (but we have to protect against $props as store)
-					(store_name !== 'props' && get_rune(declaration.initial, instance.scope) === '$props')) &&
+					(store_name !== 'props' && get_rune(init, instance.scope) === '$props')) &&
 				// allow `import { derived } from 'svelte/store'` in the same file as `const x = $derived(..)` because one is not a subscription to the other
 				!(
 					name === '$derived' &&
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 0b49d18ee9..de821bbc45 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -259,7 +259,8 @@ export function should_proxy(node, scope) {
 			binding.initial.type !== 'FunctionDeclaration' &&
 			binding.initial.type !== 'ClassDeclaration' &&
 			binding.initial.type !== 'ImportDeclaration' &&
-			binding.initial.type !== 'EachBlock'
+			binding.initial.type !== 'EachBlock' &&
+			binding.initial.type !== 'SnippetBlock'
 		) {
 			return should_proxy(binding.initial, null);
 		}
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 0542a20708..454bb8c34e 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -75,7 +75,7 @@ export class Scope {
 	 * @param {Identifier} node
 	 * @param {Binding['kind']} kind
 	 * @param {DeclarationKind} declaration_kind
-	 * @param {null | Expression | FunctionDeclaration | ClassDeclaration | ImportDeclaration | AST.EachBlock} initial
+	 * @param {null | Expression | FunctionDeclaration | ClassDeclaration | ImportDeclaration | AST.EachBlock | AST.SnippetBlock} initial
 	 * @returns {Binding}
 	 */
 	declare(node, kind, declaration_kind, initial = null) {
@@ -632,7 +632,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 			if (is_top_level) {
 				scope = /** @type {Scope} */ (parent);
 			}
-			scope.declare(node.expression, 'normal', 'function', node.expression);
+			scope.declare(node.expression, 'normal', 'function', node);
 
 			const child_scope = state.scope.child();
 			scopes.set(node, child_scope);
@@ -726,7 +726,7 @@ export function set_scope(node, { next, state }) {
 
 /**
  * Returns the name of the rune if the given expression is a `CallExpression` using a rune.
- * @param {Node | AST.EachBlock | null | undefined} node
+ * @param {Node | null | undefined} node
  * @param {Scope} scope
  */
 export function get_rune(node, scope) {
diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index 8a45f2d4fd..f8aa3db69d 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -291,7 +291,8 @@ export interface Binding {
 		| FunctionDeclaration
 		| ClassDeclaration
 		| ImportDeclaration
-		| AST.EachBlock;
+		| AST.EachBlock
+		| AST.SnippetBlock;
 	is_called: boolean;
 	references: { node: Identifier; path: SvelteNode[] }[];
 	mutated: boolean;

From 4f0dde52077478349762f4c7ba53568905426420 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 25 Nov 2024 18:16:53 -0500
Subject: [PATCH 199/404] chore: simplify css pruning slightly (#14432)

---
 .../phases/2-analyze/css/css-prune.js         | 51 +++++++++----------
 1 file changed, 25 insertions(+), 26 deletions(-)

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 61f3fc822f..6b9410e4b5 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
@@ -944,15 +944,16 @@ function get_possible_element_siblings(node, adjacent_only) {
 	let prev = node;
 	while ((prev = find_previous_sibling(prev))) {
 		if (prev.type === 'RegularElement') {
-			if (
-				!prev.attributes.find(
-					(attr) => attr.type === 'Attribute' && attr.name.toLowerCase() === 'slot'
-				)
-			) {
+			const has_slot_attribute = prev.attributes.some(
+				(attr) => attr.type === 'Attribute' && attr.name.toLowerCase() === 'slot'
+			);
+
+			if (!has_slot_attribute) {
 				result.set(prev, NODE_DEFINITELY_EXISTS);
-			}
-			if (adjacent_only) {
-				break;
+
+				if (adjacent_only) {
+					return result;
+				}
 			}
 		} else if (is_block(prev)) {
 			const possible_last_child = get_possible_last_child(prev, adjacent_only);
@@ -971,27 +972,25 @@ function get_possible_element_siblings(node, adjacent_only) {
 		}
 	}
 
-	if (!prev || !adjacent_only) {
-		/** @type {Compiler.SvelteNode | null} */
-		let parent = node;
+	/** @type {Compiler.SvelteNode | null} */
+	let parent = node;
 
-		while (
-			// @ts-expect-error TODO
-			(parent = parent?.parent) &&
-			is_block(parent)
-		) {
-			const possible_siblings = get_possible_element_siblings(parent, adjacent_only);
-			add_to_map(possible_siblings, result);
+	while (
+		// @ts-expect-error TODO
+		(parent = parent?.parent) &&
+		is_block(parent)
+	) {
+		const possible_siblings = get_possible_element_siblings(parent, adjacent_only);
+		add_to_map(possible_siblings, result);
 
-			// @ts-expect-error
-			if (parent.type === 'EachBlock' && !parent.fallback?.nodes.includes(node)) {
-				// `{#each ...}<a /><b />{/each}` — `<b>` can be previous sibling of `<a />`
-				add_to_map(get_possible_last_child(parent, adjacent_only), result);
-			}
+		// @ts-expect-error
+		if (parent.type === 'EachBlock' && !parent.fallback?.nodes.includes(node)) {
+			// `{#each ...}<a /><b />{/each}` — `<b>` can be previous sibling of `<a />`
+			add_to_map(get_possible_last_child(parent, adjacent_only), result);
+		}
 
-			if (adjacent_only && has_definite_elements(possible_siblings)) {
-				break;
-			}
+		if (adjacent_only && has_definite_elements(possible_siblings)) {
+			break;
 		}
 	}
 

From 9e9fb2463cda29e5ed75601515651379ff328cfd Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 26 Nov 2024 16:00:54 +0100
Subject: [PATCH 200/404] fix: relax parent validation (#14442)

This reverts #13255 / #13158, and helps with the validation error part of #14120

If you would have a component like this...
```svelte
<td>hi there</td>
```
...and then render it on the server via our `render` function like this:
```js
const result = render(Main);
```
...then right now you get an error saying that `td` is not valid at this position. But that doesn't seem right, because we should give people the benefit of the doubt: It may very well be that someone renders such a component and then correctly puts it into a `tr` tag themselves on the server (another example is rendering a full html document like in #14120).

All the other validation where there's a known parent (X not valid inside Y) is untouched by this.

Doing this as cleanup prior to tackling #13331
---
 .changeset/cool-gifts-sniff.md                |  5 ++++
 packages/svelte/src/html-tree-validation.js   | 24 +++++++++----------
 packages/svelte/src/internal/server/dev.js    |  8 ++-----
 .../samples/invalid-html-ssr/_config.js       |  5 ++--
 .../samples/invalid-html-ssr/main.svelte      |  1 -
 5 files changed, 20 insertions(+), 23 deletions(-)
 create mode 100644 .changeset/cool-gifts-sniff.md

diff --git a/.changeset/cool-gifts-sniff.md b/.changeset/cool-gifts-sniff.md
new file mode 100644
index 0000000000..ab9680309f
--- /dev/null
+++ b/.changeset/cool-gifts-sniff.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: relax html parent validation
diff --git a/packages/svelte/src/html-tree-validation.js b/packages/svelte/src/html-tree-validation.js
index da5567f56a..0ebf45e166 100644
--- a/packages/svelte/src/html-tree-validation.js
+++ b/packages/svelte/src/html-tree-validation.js
@@ -167,25 +167,23 @@ export function is_tag_valid_with_ancestor(tag, ancestors) {
  * Returns false if the tag is not allowed inside the parent tag such that it will result
  * in the browser repairing the HTML, which will likely result in an error during hydration.
  * @param {string} tag
- * @param {string | null} parent_tag
+ * @param {string} parent_tag
  * @returns {boolean}
  */
 export function is_tag_valid_with_parent(tag, parent_tag) {
 	if (tag.includes('-') || parent_tag?.includes('-')) return true; // custom elements can be anything
 
-	if (parent_tag !== null) {
-		const disallowed = disallowed_children[parent_tag];
+	const disallowed = disallowed_children[parent_tag];
 
-		if (disallowed) {
-			if ('direct' in disallowed && disallowed.direct.includes(tag)) {
-				return false;
-			}
-			if ('descendant' in disallowed && disallowed.descendant.includes(tag)) {
-				return false;
-			}
-			if ('only' in disallowed && disallowed.only) {
-				return disallowed.only.includes(tag);
-			}
+	if (disallowed) {
+		if ('direct' in disallowed && disallowed.direct.includes(tag)) {
+			return false;
+		}
+		if ('descendant' in disallowed && disallowed.descendant.includes(tag)) {
+			return false;
+		}
+		if ('only' in disallowed && disallowed.only) {
+			return disallowed.only.includes(tag);
 		}
 	}
 
diff --git a/packages/svelte/src/internal/server/dev.js b/packages/svelte/src/internal/server/dev.js
index 61c7c6d5e8..145b37479b 100644
--- a/packages/svelte/src/internal/server/dev.js
+++ b/packages/svelte/src/internal/server/dev.js
@@ -34,14 +34,12 @@ function stringify(element) {
 
 /**
  * @param {Payload} payload
- * @param {Element | null} parent
+ * @param {Element} parent
  * @param {Element} child
  */
 function print_error(payload, parent, child) {
 	var message =
-		(parent === null
-			? `node_invalid_placement_ssr: ${stringify(child)} needs a valid parent element\n\n`
-			: `node_invalid_placement_ssr: ${stringify(parent)} cannot contain ${stringify(child)}\n\n`) +
+		`node_invalid_placement_ssr: ${stringify(parent)} cannot contain ${stringify(child)}\n\n` +
 		'This can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.';
 
 	if ((seen ??= new Set()).has(message)) return;
@@ -85,8 +83,6 @@ export function push_element(payload, tag, line, column) {
 			}
 			ancestor = ancestor.parent;
 		}
-	} else if (!is_tag_valid_with_parent(tag, null)) {
-		print_error(payload, null, child);
 	}
 
 	parent = child;
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
index f7327d1608..d815d10fc7 100644
--- a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
@@ -5,7 +5,7 @@ export default test({
 		dev: true
 	},
 
-	html: `<p></p><h1>foo</h1><p></p><form></form> hello`,
+	html: `<p></p><h1>foo</h1><p></p><form></form>`,
 
 	recover: true,
 
@@ -13,8 +13,7 @@ export default test({
 
 	errors: [
 		'node_invalid_placement_ssr: `<p>` (main.svelte:6:0) cannot contain `<h1>` (h1.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.',
-		'node_invalid_placement_ssr: `<form>` (main.svelte:9:0) cannot contain `<form>` (form.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.',
-		'node_invalid_placement_ssr: `<td>` (main.svelte:12:0) needs a valid parent element\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
+		'node_invalid_placement_ssr: `<form>` (main.svelte:9:0) cannot contain `<form>` (form.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
 	],
 
 	warnings: [
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/main.svelte b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/main.svelte
index 92ccc7283f..84af671155 100644
--- a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/main.svelte
@@ -9,4 +9,3 @@
 <form>
 	<Form />
 </form>
-<td>hello</td>

From 3fa08d565cf11ac5673b5ecc74868965e2255be2 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 26 Nov 2024 16:32:08 +0100
Subject: [PATCH 201/404] fix: show `:then` block for `null` value (#14440)

fixes #14439

This bug was introduced in #13642 because setting the input to null means the equality check ("is the input different") fails if you set the value to null

Also fixes #14441 - this bug was present for a long time, and the reason is the same as for the other bug: The equality check always returns "yes this is the same" if the value is undefined initially. The fix is similar; we need to initialize the input to something that can never be equal to whatever value is passed
---
 .changeset/breezy-insects-live.md             |  5 +++++
 .../src/internal/client/dom/blocks/await.js   |  9 ++++----
 .../samples/await-non-promise/_config.js      | 22 +++++++++++++++++--
 .../samples/await-non-promise/main.svelte     | 17 +++++++++-----
 4 files changed, 41 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/breezy-insects-live.md

diff --git a/.changeset/breezy-insects-live.md b/.changeset/breezy-insects-live.md
new file mode 100644
index 0000000000..8b86fab6be
--- /dev/null
+++ b/.changeset/breezy-insects-live.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: show `:then` block for `null/undefined` value
diff --git a/packages/svelte/src/internal/client/dom/blocks/await.js b/packages/svelte/src/internal/client/dom/blocks/await.js
index 29ef15452f..62b2e4dd0c 100644
--- a/packages/svelte/src/internal/client/dom/blocks/await.js
+++ b/packages/svelte/src/internal/client/dom/blocks/await.js
@@ -14,6 +14,7 @@ import {
 } from '../../runtime.js';
 import { hydrate_next, hydrate_node, hydrating } from '../hydration.js';
 import { queue_micro_task } from '../task.js';
+import { UNINITIALIZED } from '../../../../constants.js';
 
 const PENDING = 0;
 const THEN = 1;
@@ -40,8 +41,8 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
 	/** @type {any} */
 	var component_function = DEV ? component_context?.function : null;
 
-	/** @type {V | Promise<V> | null} */
-	var input;
+	/** @type {V | Promise<V> | typeof UNINITIALIZED} */
+	var input = UNINITIALIZED;
 
 	/** @type {Effect | null} */
 	var pending_effect;
@@ -156,8 +157,8 @@ export function await_block(node, get_input, pending_fn, then_fn, catch_fn) {
 			update(THEN, false);
 		}
 
-		// Set the input to null, in order to disable the promise callbacks
-		return () => (input = null);
+		// Set the input to something else, in order to disable the promise callbacks
+		return () => (input = UNINITIALIZED);
 	});
 
 	if (hydrating) {
diff --git a/packages/svelte/tests/runtime-runes/samples/await-non-promise/_config.js b/packages/svelte/tests/runtime-runes/samples/await-non-promise/_config.js
index 14dac30350..882742f731 100644
--- a/packages/svelte/tests/runtime-runes/samples/await-non-promise/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/await-non-promise/_config.js
@@ -1,9 +1,27 @@
 import { flushSync } from 'svelte';
-import { test } from '../../test';
+import { ok, test } from '../../test';
 
 export default test({
 	compileOptions: {
 		dev: true
 	},
-	test() {}
+	test({ assert, target }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+		const p = target.querySelector('p');
+		ok(p);
+
+		assert.htmlEqual(p.outerHTML, `<p></p>`);
+
+		btn1.click();
+		flushSync();
+		assert.htmlEqual(p.outerHTML, `<p>1</p>`);
+
+		btn2.click();
+		flushSync();
+		assert.htmlEqual(p.outerHTML, `<p></p>`);
+
+		btn1.click();
+		flushSync();
+		assert.htmlEqual(p.outerHTML, `<p>1</p>`);
+	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/await-non-promise/main.svelte b/packages/svelte/tests/runtime-runes/samples/await-non-promise/main.svelte
index 62881ba666..efd05f2dd2 100644
--- a/packages/svelte/tests/runtime-runes/samples/await-non-promise/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/await-non-promise/main.svelte
@@ -1,9 +1,14 @@
 <script>
-	let count = $state(43);
+	let count = $state();
 </script>
 
-{#await count}
-	loading
-{:then count}
-	{count}
-{/await}
\ No newline at end of file
+<button onclick={() => count = 1}>number</button>
+<button onclick={() => count = null}>nullify</button>
+
+<p>
+	{#await count}
+		loading
+	{:then count}
+		{count}
+	{/await}
+</p>

From a6ad5af0bb361960160937a6317a2401384b1e1c Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 26 Nov 2024 14:05:40 -0500
Subject: [PATCH 202/404] fix: disregard TypeScript nodes when pruning CSS
 (#14446)

* make get_possible_element_siblings non-recursive

* treat slots as blocks

* simplify

* simplify

* add test

* changeset
---
 .changeset/tender-balloons-relate.md          |   5 +
 .../phases/2-analyze/css/css-prune.js         | 143 ++++++------------
 .../unused-ts-as-expression/_config.js        |  20 +++
 .../unused-ts-as-expression/expected.css      |   4 +
 .../unused-ts-as-expression/input.svelte      |  13 ++
 5 files changed, 88 insertions(+), 97 deletions(-)
 create mode 100644 .changeset/tender-balloons-relate.md
 create mode 100644 packages/svelte/tests/css/samples/unused-ts-as-expression/_config.js
 create mode 100644 packages/svelte/tests/css/samples/unused-ts-as-expression/expected.css
 create mode 100644 packages/svelte/tests/css/samples/unused-ts-as-expression/input.svelte

diff --git a/.changeset/tender-balloons-relate.md b/.changeset/tender-balloons-relate.md
new file mode 100644
index 0000000000..ea7ce094b6
--- /dev/null
+++ b/.changeset/tender-balloons-relate.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: disregard TypeScript nodes when pruning CSS
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 6b9410e4b5..dec85c0361 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
@@ -881,116 +881,63 @@ function get_element_parent(node) {
 }
 
 /**
- * Finds the given node's previous sibling in the DOM
- *
- * The Svelte `<slot>` is just a placeholder and is not actually real. Any children nodes
- * in `<slot>` are 'flattened' and considered as the same level as the `<slot>`'s siblings
- *
- * e.g.
- * ```html
- * <h1>Heading 1</h1>
- * <slot>
- *   <h2>Heading 2</h2>
- * </slot>
- * ```
- *
- * is considered to look like:
- * ```html
- * <h1>Heading 1</h1>
- * <h2>Heading 2</h2>
- * ```
- * @param {Compiler.SvelteNode} node
- * @returns {Compiler.SvelteNode}
- */
-function find_previous_sibling(node) {
-	/** @type {Compiler.SvelteNode} */
-	let current_node = node;
-
-	while (
-		// @ts-expect-error TODO
-		!current_node.prev &&
-		// @ts-expect-error TODO
-		current_node.parent?.type === 'SlotElement'
-	) {
-		// @ts-expect-error TODO
-		current_node = current_node.parent;
-	}
-
-	// @ts-expect-error
-	current_node = current_node.prev;
-
-	while (current_node?.type === 'SlotElement') {
-		const slot_children = current_node.fragment.nodes;
-		if (slot_children.length > 0) {
-			current_node = slot_children[slot_children.length - 1];
-		} else {
-			break;
-		}
-	}
-
-	return current_node;
-}
-
-/**
- * @param {Compiler.SvelteNode} node
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  * @param {boolean} adjacent_only
  * @returns {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>}
  */
-function get_possible_element_siblings(node, adjacent_only) {
+function get_possible_element_siblings(element, adjacent_only) {
 	/** @type {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>} */
 	const result = new Map();
+	const path = element.metadata.path;
 
 	/** @type {Compiler.SvelteNode} */
-	let prev = node;
-	while ((prev = find_previous_sibling(prev))) {
-		if (prev.type === 'RegularElement') {
-			const has_slot_attribute = prev.attributes.some(
-				(attr) => attr.type === 'Attribute' && attr.name.toLowerCase() === 'slot'
-			);
+	let current = element;
+
+	let i = path.length;
+
+	while (i--) {
+		const fragment = /** @type {Compiler.AST.Fragment} */ (path[i--]);
+		let j = fragment.nodes.indexOf(current);
+
+		while (j--) {
+			const node = fragment.nodes[j];
+
+			if (node.type === 'RegularElement') {
+				const has_slot_attribute = node.attributes.some(
+					(attr) => attr.type === 'Attribute' && attr.name.toLowerCase() === 'slot'
+				);
 
-			if (!has_slot_attribute) {
-				result.set(prev, NODE_DEFINITELY_EXISTS);
+				if (!has_slot_attribute) {
+					result.set(node, NODE_DEFINITELY_EXISTS);
 
-				if (adjacent_only) {
+					if (adjacent_only) {
+						return result;
+					}
+				}
+			} else if (is_block(node)) {
+				if (node.type === 'SlotElement') {
+					result.set(node, NODE_PROBABLY_EXISTS);
+				}
+
+				const possible_last_child = get_possible_last_child(node, adjacent_only);
+				add_to_map(possible_last_child, result);
+				if (adjacent_only && has_definite_elements(possible_last_child)) {
 					return result;
 				}
+			} else if (node.type === 'RenderTag' || node.type === 'SvelteElement') {
+				result.set(node, NODE_PROBABLY_EXISTS);
+				// Special case: slots, render tags and svelte:element tags could resolve to no siblings,
+				// so we want to continue until we find a definite sibling even with the adjacent-only combinator
 			}
-		} else if (is_block(prev)) {
-			const possible_last_child = get_possible_last_child(prev, adjacent_only);
-			add_to_map(possible_last_child, result);
-			if (adjacent_only && has_definite_elements(possible_last_child)) {
-				return result;
-			}
-		} else if (
-			prev.type === 'SlotElement' ||
-			prev.type === 'RenderTag' ||
-			prev.type === 'SvelteElement'
-		) {
-			result.set(prev, NODE_PROBABLY_EXISTS);
-			// Special case: slots, render tags and svelte:element tags could resolve to no siblings,
-			// so we want to continue until we find a definite sibling even with the adjacent-only combinator
 		}
-	}
 
-	/** @type {Compiler.SvelteNode | null} */
-	let parent = node;
+		current = path[i];
 
-	while (
-		// @ts-expect-error TODO
-		(parent = parent?.parent) &&
-		is_block(parent)
-	) {
-		const possible_siblings = get_possible_element_siblings(parent, adjacent_only);
-		add_to_map(possible_siblings, result);
+		if (!current || !is_block(current)) break;
 
-		// @ts-expect-error
-		if (parent.type === 'EachBlock' && !parent.fallback?.nodes.includes(node)) {
+		if (current.type === 'EachBlock' && fragment === current.body) {
 			// `{#each ...}<a /><b />{/each}` — `<b>` can be previous sibling of `<a />`
-			add_to_map(get_possible_last_child(parent, adjacent_only), result);
-		}
-
-		if (adjacent_only && has_definite_elements(possible_siblings)) {
-			break;
+			add_to_map(get_possible_last_child(current, adjacent_only), result);
 		}
 	}
 
@@ -998,7 +945,7 @@ function get_possible_element_siblings(node, adjacent_only) {
 }
 
 /**
- * @param {Compiler.AST.EachBlock | Compiler.AST.IfBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock} node
+ * @param {Compiler.AST.EachBlock | Compiler.AST.IfBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock | Compiler.AST.SlotElement} node
  * @param {boolean} adjacent_only
  * @returns {Map<Compiler.AST.RegularElement, NodeExistsValue>}
  */
@@ -1022,6 +969,7 @@ function get_possible_last_child(node, adjacent_only) {
 			break;
 
 		case 'KeyBlock':
+		case 'SlotElement':
 			fragments.push(node.fragment);
 			break;
 	}
@@ -1029,7 +977,7 @@ function get_possible_last_child(node, adjacent_only) {
 	/** @type {NodeMap} */
 	const result = new Map();
 
-	let exhaustive = true;
+	let exhaustive = node.type !== 'SlotElement';
 
 	for (const fragment of fragments) {
 		if (fragment == null) {
@@ -1121,13 +1069,14 @@ function loop_child(children, adjacent_only) {
 
 /**
  * @param {Compiler.SvelteNode} node
- * @returns {node is Compiler.AST.IfBlock | Compiler.AST.EachBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock}
+ * @returns {node is Compiler.AST.IfBlock | Compiler.AST.EachBlock | Compiler.AST.AwaitBlock | Compiler.AST.KeyBlock | Compiler.AST.SlotElement}
  */
 function is_block(node) {
 	return (
 		node.type === 'IfBlock' ||
 		node.type === 'EachBlock' ||
 		node.type === 'AwaitBlock' ||
-		node.type === 'KeyBlock'
+		node.type === 'KeyBlock' ||
+		node.type === 'SlotElement'
 	);
 }
diff --git a/packages/svelte/tests/css/samples/unused-ts-as-expression/_config.js b/packages/svelte/tests/css/samples/unused-ts-as-expression/_config.js
new file mode 100644
index 0000000000..e2679428cc
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-ts-as-expression/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			end: {
+				character: 127,
+				column: 28,
+				line: 10
+			},
+			message: 'Unused CSS selector "[data-active=\'true\'] > span"',
+			start: {
+				character: 100,
+				column: 1,
+				line: 10
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/unused-ts-as-expression/expected.css b/packages/svelte/tests/css/samples/unused-ts-as-expression/expected.css
new file mode 100644
index 0000000000..571d2acfbc
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-ts-as-expression/expected.css
@@ -0,0 +1,4 @@
+
+	/* (unused) [data-active='true'] > span {
+		background-color: red;
+	}*/
diff --git a/packages/svelte/tests/css/samples/unused-ts-as-expression/input.svelte b/packages/svelte/tests/css/samples/unused-ts-as-expression/input.svelte
new file mode 100644
index 0000000000..24fc0096bf
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-ts-as-expression/input.svelte
@@ -0,0 +1,13 @@
+<script lang="ts">
+	//
+</script>
+
+<div data-active={false as true}>
+	<span></span>
+</div>
+
+<style>
+	[data-active='true'] > span {
+		background-color: red;
+	}
+</style>

From 45417a36ce8100095f91907cdb9d47bbeafbaff7 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 26 Nov 2024 19:18:35 +0000
Subject: [PATCH 203/404] fix: addresses memory leak when creating deriveds
 inside untrack (#14443)

* fix: addresses memory leak when creating deriveds inside untrack

* fix: addresses memory leak when creating deriveds inside untrack

* changeset

* Update packages/svelte/src/internal/client/reactivity/deriveds.js

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

* fix

* fix

* fix

* comment

* Update packages/svelte/tests/signals/test.ts

* Update packages/svelte/src/internal/client/reactivity/deriveds.js

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

* Update .changeset/great-crabs-rhyme.md

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

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/great-crabs-rhyme.md               |  5 +++
 .../internal/client/reactivity/deriveds.js    | 42 +++++++++++++------
 .../src/internal/client/reactivity/types.d.ts |  5 ++-
 .../svelte/src/internal/client/runtime.js     | 19 ++++++++-
 packages/svelte/tests/signals/test.ts         | 26 ++++++++++++
 5 files changed, 82 insertions(+), 15 deletions(-)
 create mode 100644 .changeset/great-crabs-rhyme.md

diff --git a/.changeset/great-crabs-rhyme.md b/.changeset/great-crabs-rhyme.md
new file mode 100644
index 0000000000..b02f7bc9b2
--- /dev/null
+++ b/.changeset/great-crabs-rhyme.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent memory leak when creating deriveds inside untrack
diff --git a/packages/svelte/src/internal/client/reactivity/deriveds.js b/packages/svelte/src/internal/client/reactivity/deriveds.js
index 98fbfb0f52..a679d307c4 100644
--- a/packages/svelte/src/internal/client/reactivity/deriveds.js
+++ b/packages/svelte/src/internal/client/reactivity/deriveds.js
@@ -42,6 +42,11 @@ export function derived(fn) {
 		active_effect.f |= EFFECT_HAS_DERIVED;
 	}
 
+	var parent_derived =
+		active_reaction !== null && (active_reaction.f & DERIVED) !== 0
+			? /** @type {Derived} */ (active_reaction)
+			: null;
+
 	/** @type {Derived<V>} */
 	const signal = {
 		children: null,
@@ -53,12 +58,11 @@ export function derived(fn) {
 		reactions: null,
 		v: /** @type {V} */ (null),
 		version: 0,
-		parent: active_effect
+		parent: parent_derived ?? active_effect
 	};
 
-	if (active_reaction !== null && (active_reaction.f & DERIVED) !== 0) {
-		var derived = /** @type {Derived} */ (active_reaction);
-		(derived.children ??= []).push(signal);
+	if (parent_derived !== null) {
+		(parent_derived.children ??= []).push(signal);
 	}
 
 	return signal;
@@ -104,6 +108,21 @@ function destroy_derived_children(derived) {
  */
 let stack = [];
 
+/**
+ * @param {Derived} derived
+ * @returns {Effect | null}
+ */
+function get_derived_parent_effect(derived) {
+	var parent = derived.parent;
+	while (parent !== null) {
+		if ((parent.f & DERIVED) === 0) {
+			return /** @type {Effect} */ (parent);
+		}
+		parent = parent.parent;
+	}
+	return null;
+}
+
 /**
  * @template T
  * @param {Derived} derived
@@ -113,7 +132,7 @@ export function execute_derived(derived) {
 	var value;
 	var prev_active_effect = active_effect;
 
-	set_active_effect(derived.parent);
+	set_active_effect(get_derived_parent_effect(derived));
 
 	if (DEV) {
 		let prev_inspect_effects = inspect_effects;
@@ -162,14 +181,13 @@ export function update_derived(derived) {
 }
 
 /**
- * @param {Derived} signal
+ * @param {Derived} derived
  * @returns {void}
  */
-export function destroy_derived(signal) {
-	destroy_derived_children(signal);
-	remove_reactions(signal, 0);
-	set_signal_status(signal, DESTROYED);
+export function destroy_derived(derived) {
+	destroy_derived_children(derived);
+	remove_reactions(derived, 0);
+	set_signal_status(derived, DESTROYED);
 
-	// TODO we need to ensure we remove the derived from any parent derives
-	signal.v = signal.children = signal.deps = signal.ctx = signal.reactions = null;
+	derived.v = derived.children = derived.deps = derived.ctx = derived.reactions = null;
 }
diff --git a/packages/svelte/src/internal/client/reactivity/types.d.ts b/packages/svelte/src/internal/client/reactivity/types.d.ts
index 2cef49eb2d..395070fedd 100644
--- a/packages/svelte/src/internal/client/reactivity/types.d.ts
+++ b/packages/svelte/src/internal/client/reactivity/types.d.ts
@@ -23,7 +23,6 @@ export interface Reaction extends Signal {
 	fn: null | Function;
 	/** Signals that this signal reads from */
 	deps: null | Value[];
-	parent: Effect | null;
 }
 
 export interface Derived<V = unknown> extends Value<V>, Reaction {
@@ -31,6 +30,8 @@ export interface Derived<V = unknown> extends Value<V>, Reaction {
 	fn: () => V;
 	/** Reactions created inside this signal */
 	children: null | Reaction[];
+	/** Parent effect or derived */
+	parent: Effect | Derived | null;
 }
 
 export interface Effect extends Reaction {
@@ -58,6 +59,8 @@ export interface Effect extends Reaction {
 	first: null | Effect;
 	/** Last child effect created inside this signal */
 	last: null | Effect;
+	/** Parent effect */
+	parent: Effect | null;
 	/** Dev only */
 	component_function?: any;
 }
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 5b5b488824..8931d02009 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -767,9 +767,24 @@ export function get(signal) {
 	} else if (is_derived && /** @type {Derived} */ (signal).deps === null) {
 		var derived = /** @type {Derived} */ (signal);
 		var parent = derived.parent;
+		var target = derived;
 
-		if (parent !== null && !parent.deriveds?.includes(derived)) {
-			(parent.deriveds ??= []).push(derived);
+		while (parent !== null) {
+			// Attach the derived to the nearest parent effect, if there are deriveds
+			// in between then we also need to attach them too
+			if ((parent.f & DERIVED) !== 0) {
+				var parent_derived = /** @type {Derived} */ (parent);
+
+				target = parent_derived;
+				parent = parent_derived.parent;
+			} else {
+				var parent_effect = /** @type {Effect} */ (parent);
+
+				if (!parent_effect.deriveds?.includes(target)) {
+					(parent_effect.deriveds ??= []).push(target);
+				}
+				break;
+			}
 		}
 	}
 
diff --git a/packages/svelte/tests/signals/test.ts b/packages/svelte/tests/signals/test.ts
index e2d27267a3..db061bfb55 100644
--- a/packages/svelte/tests/signals/test.ts
+++ b/packages/svelte/tests/signals/test.ts
@@ -739,4 +739,30 @@ describe('signals', () => {
 			assert.deepEqual(a.reactions, null);
 		};
 	});
+
+	test('nested deriveds clean up the relationships when used with untrack', () => {
+		return () => {
+			let a = render_effect(() => {});
+
+			const destroy = effect_root(() => {
+				a = render_effect(() => {
+					$.untrack(() => {
+						const b = derived(() => {
+							const c = derived(() => {});
+							$.untrack(() => {
+								$.get(c);
+							});
+						});
+						$.get(b);
+					});
+				});
+			});
+
+			assert.deepEqual(a.deriveds?.length, 1);
+
+			destroy();
+
+			assert.deepEqual(a.deriveds, null);
+		};
+	});
 });

From 3a6bf1041b154d762420071f01666f39c3928ca7 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 26 Nov 2024 14:46:14 -0500
Subject: [PATCH 204/404] Version Packages (#14444)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/breezy-insects-live.md    |  5 -----
 .changeset/cool-gifts-sniff.md       |  5 -----
 .changeset/great-crabs-rhyme.md      |  5 -----
 .changeset/tender-balloons-relate.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/breezy-insects-live.md
 delete mode 100644 .changeset/cool-gifts-sniff.md
 delete mode 100644 .changeset/great-crabs-rhyme.md
 delete mode 100644 .changeset/tender-balloons-relate.md

diff --git a/.changeset/breezy-insects-live.md b/.changeset/breezy-insects-live.md
deleted file mode 100644
index 8b86fab6be..0000000000
--- a/.changeset/breezy-insects-live.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: show `:then` block for `null/undefined` value
diff --git a/.changeset/cool-gifts-sniff.md b/.changeset/cool-gifts-sniff.md
deleted file mode 100644
index ab9680309f..0000000000
--- a/.changeset/cool-gifts-sniff.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: relax html parent validation
diff --git a/.changeset/great-crabs-rhyme.md b/.changeset/great-crabs-rhyme.md
deleted file mode 100644
index b02f7bc9b2..0000000000
--- a/.changeset/great-crabs-rhyme.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent memory leak when creating deriveds inside untrack
diff --git a/.changeset/tender-balloons-relate.md b/.changeset/tender-balloons-relate.md
deleted file mode 100644
index ea7ce094b6..0000000000
--- a/.changeset/tender-balloons-relate.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: disregard TypeScript nodes when pruning CSS
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 35adeaf6b0..13c67caa84 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.2.9
+
+### Patch Changes
+
+- fix: show `:then` block for `null/undefined` value ([#14440](https://github.com/sveltejs/svelte/pull/14440))
+
+- fix: relax html parent validation ([#14442](https://github.com/sveltejs/svelte/pull/14442))
+
+- fix: prevent memory leak when creating deriveds inside untrack ([#14443](https://github.com/sveltejs/svelte/pull/14443))
+
+- fix: disregard TypeScript nodes when pruning CSS ([#14446](https://github.com/sveltejs/svelte/pull/14446))
+
 ## 5.2.8
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index bc03bcb990..9d9b04a6eb 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.2.8",
+  "version": "5.2.9",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 294ad27c1f..4fabe40a59 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.2.8';
+export const VERSION = '5.2.9';
 export const PUBLIC_VERSION = '5';

From 6ff1d0aa1b96f8f9ea7b9207fb0239a3989be401 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 26 Nov 2024 14:56:54 -0500
Subject: [PATCH 205/404] chore(deps-dev): bump @sveltejs/kit from 2.5.24 to
 2.8.3 (#14427)

Bumps [@sveltejs/kit](https://github.com/sveltejs/kit/tree/HEAD/packages/kit) from 2.5.24 to 2.8.3.
- [Release notes](https://github.com/sveltejs/kit/releases)
- [Changelog](https://github.com/sveltejs/kit/blob/main/packages/kit/CHANGELOG.md)
- [Commits](https://github.com/sveltejs/kit/commits/@sveltejs/kit@2.8.3/packages/kit)

---
updated-dependencies:
- dependency-name: "@sveltejs/kit"
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 pnpm-lock.yaml                      | 48 +++++++++++++++++------------
 sites/svelte-5-preview/package.json |  2 +-
 2 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 83e4522b2f..0af617a61d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -249,19 +249,19 @@ importers:
         version: 1.2.1
       '@sveltejs/adapter-vercel':
         specifier: ^5.4.3
-        version: 5.4.3(@sveltejs/kit@2.5.24(@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)))
+        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.5.24
-        version: 2.5.24(@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))
+        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.5.24(@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)
+        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.5.24(@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)
+        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.2
         version: 1.2.2
@@ -870,8 +870,8 @@ packages:
       typescript: '>= 5'
       typescript-eslint: '>= 7.5'
 
-  '@sveltejs/kit@2.5.24':
-    resolution: {integrity: sha512-Nr2oxsCsDfEkdS/zzQQQbsPYTbu692Qs3/iE3L7VHzCVjG2+WujF9oMUozWI7GuX98KxYSoPMlAsfmDLSg44hQ==}
+  '@sveltejs/kit@2.8.3':
+    resolution: {integrity: sha512-DVBVwugfzzn0SxKA+eAmKqcZ7aHZROCHxH7/pyrOi+HLtQ721eEsctGb9MkhEuqj6q/9S/OFYdn37vdxzFPdvw==}
     engines: {node: '>=18.13'}
     hasBin: true
     peerDependencies:
@@ -1332,8 +1332,8 @@ packages:
     resolution: {integrity: sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==}
     engines: {node: '>=8'}
 
-  devalue@5.0.0:
-    resolution: {integrity: sha512-gO+/OMXF7488D+u3ue+G7Y4AA3ZmUnB3eHJXmBTgNHvr4ZNzl36A0ZtG+XCRNYCkYx/bFmw4qtkoFLa+wSrwAA==}
+  devalue@5.1.1:
+    resolution: {integrity: sha512-maua5KUiapvEwiEAe+XnlZ3Rh0GD+qI1J/nb9vrJc3muPXvcF/8gXYTWF76+5DAqHyDUtOIImEuo0YKE9mshVw==}
 
   dir-glob@3.0.1:
     resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
@@ -2470,6 +2470,10 @@ 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'}
@@ -3534,9 +3538,9 @@ snapshots:
       eslint-visitor-keys: 3.4.3
       espree: 9.6.1
 
-  '@sveltejs/adapter-vercel@5.4.3(@sveltejs/kit@2.5.24(@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/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.5.24(@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': 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:
@@ -3554,12 +3558,12 @@ snapshots:
       typescript: 5.5.4
       typescript-eslint: 8.2.0(eslint@9.9.1)(typescript@5.5.4)
 
-  '@sveltejs/kit@2.5.24(@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@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.0.0
+      devalue: 5.1.1
       esm-env: 1.0.0
       import-meta-resolve: 4.1.0
       kleur: 4.1.5
@@ -3567,14 +3571,14 @@ snapshots:
       mrmime: 2.0.0
       sade: 1.8.1
       set-cookie-parser: 2.7.0
-      sirv: 2.0.4
+      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.5.24(@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/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.5.24(@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': 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.0.0
       svelte: link:packages/svelte
       svelte-persisted-store: 0.9.2(svelte@packages+svelte)
@@ -3752,9 +3756,9 @@ snapshots:
       - encoding
       - supports-color
 
-  '@vercel/speed-insights@1.0.11(@sveltejs/kit@2.5.24(@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)':
+  '@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.5.24(@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': 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.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))':
@@ -4052,7 +4056,7 @@ snapshots:
 
   detect-libc@2.0.2: {}
 
-  devalue@5.0.0: {}
+  devalue@5.1.1: {}
 
   dir-glob@3.0.1:
     dependencies:
@@ -5202,6 +5206,12 @@ 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: {}
diff --git a/sites/svelte-5-preview/package.json b/sites/svelte-5-preview/package.json
index e47bd54bcd..db4dd6d417 100644
--- a/sites/svelte-5-preview/package.json
+++ b/sites/svelte-5-preview/package.json
@@ -15,7 +15,7 @@
     "@fontsource/fira-mono": "^5.0.8",
     "@lezer/common": "^1.2.1",
     "@sveltejs/adapter-vercel": "^5.4.3",
-    "@sveltejs/kit": "^2.5.24",
+    "@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",

From 610bc98f6690209a4a505273fd5e55fc2ba31754 Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Tue, 26 Nov 2024 14:59:15 -0500
Subject: [PATCH 206/404] chore: remove obsolete site content (#13818)

---
 ...-11-26-frameworks-without-the-framework.md |  51 ----
 ...17-08-07-the-easiest-way-to-get-started.md |  65 -----
 .../2017-09-06-the-zen-of-just-writing-css.md |  76 -----
 ...per-towards-the-ideal-web-app-framework.md |  80 ------
 documentation/blog/2018-04-18-version-2.md    | 201 -------------
 .../blog/2018-12-26-svelte-css-in-js.md       |  28 --
 ...2018-12-27-virtual-dom-is-pure-overhead.md | 135 ---------
 .../2019-01-31-svelte-on-the-changelog.md     |  21 --
 .../blog/2019-04-15-setting-up-your-editor.md |  65 -----
 .../2019-04-16-svelte-for-new-developers.md   |  95 -------
 .../blog/2019-04-20-write-less-code.md        | 163 -----------
 ...19-04-22-svelte-3-rethinking-reactivity.md | 102 -------
 .../blog/2020-07-17-svelte-and-typescript.md  | 134 ---------
 ...-10-01-whats-new-in-svelte-october-2020.md |  91 ------
 ...11-01-whats-new-in-svelte-november-2020.md |  46 ---
 ...020-11-05-whats-the-deal-with-sveltekit.md |  94 -------
 ...12-01-whats-new-in-svelte-december-2020.md |  75 -----
 ...-01-01-whats-new-in-svelte-january-2021.md |  83 ------
 ...02-01-whats-new-in-svelte-february-2021.md |  85 ------
 ...21-03-01-whats-new-in-svelte-march-2021.md | 101 -------
 .../blog/2021-03-23-sveltekit-beta.md         |  65 -----
 ...21-04-01-whats-new-in-svelte-april-2021.md |  72 -----
 ...2021-05-01-whats-new-in-svelte-may-2021.md |  76 -----
 ...021-06-01-whats-new-in-svelte-june-2021.md |  63 -----
 ...021-07-01-whats-new-in-svelte-july-2021.md |  64 -----
 ...1-08-01-whats-new-in-svelte-august-2021.md |  75 -----
 ...9-01-whats-new-in-svelte-september-2021.md |  84 ------
 ...-10-01-whats-new-in-svelte-october-2021.md | 100 -------
 ...11-01-whats-new-in-svelte-november-2021.md |  88 ------
 ...12-01-whats-new-in-svelte-december-2021.md |  92 ------
 ...-01-01-whats-new-in-svelte-january-2022.md |  81 ------
 ...-01-13-accelerating-sveltes-development.md |  69 -----
 ...02-01-whats-new-in-svelte-february-2022.md | 114 --------
 ...22-03-01-whats-new-in-svelte-march-2022.md |  89 ------
 ...22-04-01-whats-new-in-svelte-april-2022.md | 108 -------
 ...2022-05-01-whats-new-in-svelte-may-2022.md |  92 ------
 ...022-06-01-whats-new-in-svelte-june-2022.md | 117 --------
 ...022-07-01-whats-new-in-svelte-july-2022.md | 101 -------
 ...2-08-01-whats-new-in-svelte-august-2022.md | 125 ---------
 ...9-01-whats-new-in-svelte-september-2022.md | 112 --------
 ...-10-01-whats-new-in-svelte-october-2022.md | 149 ----------
 ...11-01-whats-new-in-svelte-november-2022.md | 122 --------
 ...12-01-whats-new-in-svelte-december-2022.md | 105 -------
 .../2022-12-14-announcing-sveltekit-1.0.md    | 105 -------
 ...-01-01-whats-new-in-svelte-january-2023.md | 112 --------
 ...02-01-whats-new-in-svelte-february-2023.md | 105 -------
 ...023-02-21-streaming-snapshots-sveltekit.md | 207 --------------
 ...23-03-01-whats-new-in-svelte-march-2023.md | 136 ---------
 .../2023-03-09-zero-config-type-safety.md     | 171 -----------
 ...23-04-01-whats-new-in-svelte-april-2023.md | 116 --------
 ...2023-05-01-whats-new-in-svelte-may-2023.md | 117 --------
 ...023-06-01-whats-new-in-svelte-june-2023.md | 103 -------
 documentation/blog/2023-06-22-svelte-4.md     |  59 ----
 .../blog/2023-06-29-svelte-dev-overhaul.md    |  96 -------
 ...023-07-01-whats-new-in-svelte-july-2023.md | 102 -------
 ...3-08-01-whats-new-in-svelte-august-2023.md |  97 -------
 .../blog/2023-08-31-view-transitions.md       | 265 ------------------
 ...9-01-whats-new-in-svelte-september-2023.md |  98 -------
 documentation/blog/2023-09-20-runes.md        | 223 ---------------
 .../blog/2023-10-01-hacktoberfest.md          |  24 --
 ...-10-01-whats-new-in-svelte-october-2023.md |  86 ------
 ...11-01-whats-new-in-svelte-november-2023.md |  89 ------
 .../00-introduction/00-hello-world/App.svelte |   5 -
 .../00-introduction/00-hello-world/meta.json  |   3 -
 .../01-dynamic-attributes/App.svelte          |   7 -
 .../01-dynamic-attributes/meta.json           |   3 -
 .../00-introduction/02-styling/App.svelte     |   9 -
 .../00-introduction/02-styling/meta.json      |   3 -
 .../03-nested-components/App.svelte           |  14 -
 .../03-nested-components/Nested.svelte        |   1 -
 .../03-nested-components/meta.json            |   3 -
 .../00-introduction/04-html-tags/App.svelte   |   5 -
 .../00-introduction/04-html-tags/meta.json    |   3 -
 .../examples/00-introduction/meta.json        |   3 -
 .../00-reactive-assignments/App.svelte        |  12 -
 .../00-reactive-assignments/meta.json         |   3 -
 .../01-reactive-declarations/App.svelte       |  18 --
 .../01-reactive-declarations/meta.json        |   3 -
 .../02-reactive-statements/App.svelte         |  17 --
 .../02-reactive-statements/meta.json          |   3 -
 .../examples/01-reactivity/meta.json          |   3 -
 .../02-props/00-declaring-props/App.svelte    |   5 -
 .../02-props/00-declaring-props/Nested.svelte |   5 -
 .../02-props/00-declaring-props/meta.json     |   3 -
 .../02-props/01-default-values/App.svelte     |   6 -
 .../02-props/01-default-values/Nested.svelte  |   5 -
 .../02-props/01-default-values/meta.json      |   3 -
 .../02-props/02-spread-props/App.svelte       |  12 -
 .../02-props/02-spread-props/Info.svelte      |  12 -
 .../02-props/02-spread-props/meta.json        |   3 -
 documentation/examples/02-props/meta.json     |   3 -
 .../examples/03-logic/00-if-blocks/App.svelte |  15 -
 .../examples/03-logic/00-if-blocks/meta.json  |   3 -
 .../03-logic/01-else-blocks/App.svelte        |  13 -
 .../03-logic/01-else-blocks/meta.json         |   3 -
 .../03-logic/02-else-if-blocks/App.svelte     |  11 -
 .../03-logic/02-else-if-blocks/meta.json      |   3 -
 .../03-logic/03-each-blocks/App.svelte        |  19 --
 .../03-logic/03-each-blocks/meta.json         |   3 -
 .../03-logic/04-keyed-each-blocks/App.svelte  |  33 ---
 .../04-keyed-each-blocks/Thing.svelte         |  24 --
 .../03-logic/04-keyed-each-blocks/meta.json   |   3 -
 .../03-logic/05-await-blocks/App.svelte       |  28 --
 .../03-logic/05-await-blocks/meta.json        |   3 -
 documentation/examples/03-logic/meta.json     |   3 -
 .../04-events/00-dom-events/App.svelte        |  20 --
 .../04-events/00-dom-events/meta.json         |   3 -
 .../04-events/01-inline-handlers/App.svelte   |  15 -
 .../04-events/01-inline-handlers/meta.json    |   3 -
 .../04-events/02-event-modifiers/App.svelte   |   7 -
 .../04-events/02-event-modifiers/meta.json    |   3 -
 .../04-events/03-component-events/App.svelte  |   9 -
 .../03-component-events/Inner.svelte          |  13 -
 .../04-events/03-component-events/meta.json   |   3 -
 .../04-events/04-event-forwarding/App.svelte  |   9 -
 .../04-event-forwarding/Inner.svelte          |  13 -
 .../04-event-forwarding/Outer.svelte          |   5 -
 .../04-events/04-event-forwarding/meta.json   |   3 -
 .../05-dom-event-forwarding/App.svelte        |   9 -
 .../CustomButton.svelte                       |  20 --
 .../05-dom-event-forwarding/meta.json         |   3 -
 documentation/examples/04-events/meta.json    |   3 -
 .../05-bindings/00-text-inputs/App.svelte     |   6 -
 .../05-bindings/00-text-inputs/meta.json      |   3 -
 .../05-bindings/01-numeric-inputs/App.svelte  |  16 --
 .../05-bindings/01-numeric-inputs/meta.json   |   3 -
 .../05-bindings/02-checkbox-inputs/App.svelte |  16 --
 .../05-bindings/02-checkbox-inputs/meta.json  |   3 -
 .../05-bindings/03-group-inputs/App.svelte    |  49 ----
 .../05-bindings/03-group-inputs/meta.json     |   3 -
 .../05-bindings/04-textarea-inputs/App.svelte |  15 -
 .../05-bindings/04-textarea-inputs/meta.json  |   3 -
 .../05-bindings/05-file-inputs/App.svelte     |  26 --
 .../05-bindings/05-file-inputs/meta.json      |   3 -
 .../05-bindings/06-select-bindings/App.svelte |  41 ---
 .../05-bindings/06-select-bindings/meta.json  |   3 -
 .../07-multiple-select-bindings/App.svelte    |  50 ----
 .../07-multiple-select-bindings/meta.json     |   3 -
 .../08-each-block-bindings/App.svelte         |  33 ---
 .../08-each-block-bindings/meta.json          |   3 -
 .../05-bindings/09-media-elements/App.svelte  | 134 ---------
 .../05-bindings/09-media-elements/meta.json   |   3 -
 .../05-bindings/10-dimensions/App.svelte      |  24 --
 .../05-bindings/10-dimensions/meta.json       |   3 -
 .../05-bindings/11-bind-this/App.svelte       |  51 ----
 .../05-bindings/11-bind-this/meta.json        |   3 -
 .../12-component-bindings/App.svelte          |  29 --
 .../12-component-bindings/Keypad.svelte       |  40 ---
 .../12-component-bindings/meta.json           |   3 -
 documentation/examples/05-bindings/meta.json  |   3 -
 .../06-lifecycle/00-onmount/App.svelte        |  39 ---
 .../06-lifecycle/00-onmount/meta.json         |   3 -
 .../06-lifecycle/01-ondestroy/App.svelte      |  12 -
 .../06-lifecycle/01-ondestroy/meta.json       |   3 -
 .../06-lifecycle/01-ondestroy/utils.js        |   9 -
 .../06-lifecycle/02-update/App.svelte         | 113 --------
 .../examples/06-lifecycle/02-update/meta.json |   3 -
 .../examples/06-lifecycle/03-tick/App.svelte  |  31 --
 .../examples/06-lifecycle/03-tick/meta.json   |   3 -
 documentation/examples/06-lifecycle/meta.json |   3 -
 .../07-stores/00-writable-stores/App.svelte   |  18 --
 .../00-writable-stores/Decrementer.svelte     |   9 -
 .../00-writable-stores/Incrementer.svelte     |   9 -
 .../00-writable-stores/Resetter.svelte        |   9 -
 .../07-stores/00-writable-stores/meta.json    |   3 -
 .../07-stores/00-writable-stores/stores.js    |   3 -
 .../01-auto-subscriptions/App.svelte          |  12 -
 .../01-auto-subscriptions/Decrementer.svelte  |   9 -
 .../01-auto-subscriptions/Incrementer.svelte  |   9 -
 .../01-auto-subscriptions/Resetter.svelte     |   9 -
 .../07-stores/01-auto-subscriptions/meta.json |   3 -
 .../07-stores/01-auto-subscriptions/stores.js |   3 -
 .../07-stores/02-readable-stores/App.svelte   |  12 -
 .../07-stores/02-readable-stores/meta.json    |   3 -
 .../07-stores/02-readable-stores/stores.js    |  11 -
 .../07-stores/03-derived-stores/App.svelte    |  18 --
 .../07-stores/03-derived-stores/meta.json     |   3 -
 .../07-stores/03-derived-stores/stores.js     |  15 -
 .../07-stores/04-custom-stores/App.svelte     |   9 -
 .../07-stores/04-custom-stores/meta.json      |   3 -
 .../07-stores/04-custom-stores/stores.js      |  14 -
 documentation/examples/07-stores/meta.json    |   3 -
 .../examples/08-motion/00-tweened/App.svelte  |  28 --
 .../examples/08-motion/00-tweened/meta.json   |   3 -
 .../examples/08-motion/01-spring/App.svelte   |  45 ---
 .../examples/08-motion/01-spring/meta.json    |   3 -
 documentation/examples/08-motion/meta.json    |   3 -
 .../09-transitions/00-transition/App.svelte   |  13 -
 .../09-transitions/00-transition/meta.json    |   3 -
 .../App.svelte                                |  13 -
 .../meta.json                                 |   3 -
 .../09-transitions/02-in-and-out/App.svelte   |  13 -
 .../09-transitions/02-in-and-out/meta.json    |   3 -
 .../03-custom-css-transitions/App.svelte      |  49 ----
 .../03-custom-css-transitions/meta.json       |   3 -
 .../04-custom-js-transitions/App.svelte       |  31 --
 .../04-custom-js-transitions/meta.json        |   3 -
 .../05-transition-events/App.svelte           |  25 --
 .../05-transition-events/meta.json            |   3 -
 .../06-deferred-transitions/App.svelte        | 155 ----------
 .../06-deferred-transitions/images.js         | 102 -------
 .../06-deferred-transitions/meta.json         |   3 -
 .../examples/09-transitions/meta.json         |   3 -
 .../10-animations/00-animate/App.svelte       | 143 ----------
 .../10-animations/00-animate/meta.json        |   3 -
 .../examples/10-animations/meta.json          |   3 -
 .../examples/11-easing/00-easing/App.svelte   | 100 -------
 .../11-easing/00-easing/Controls.svelte       | 176 ------------
 .../examples/11-easing/00-easing/Grid.svelte  |  40 ---
 .../examples/11-easing/00-easing/eases.js     |  43 ---
 .../examples/11-easing/00-easing/meta.json    |   3 -
 documentation/examples/11-easing/meta.json    |   3 -
 .../examples/12-svg/01-clock/App.svelte       |  85 ------
 .../examples/12-svg/01-clock/meta.json        |   3 -
 .../examples/12-svg/02-bar-chart/App.svelte   | 118 --------
 .../examples/12-svg/02-bar-chart/meta.json    |   3 -
 .../examples/12-svg/03-area-chart/App.svelte  | 117 --------
 .../examples/12-svg/03-area-chart/data.js     |  45 ---
 .../examples/12-svg/03-area-chart/meta.json   |   3 -
 .../examples/12-svg/04-scatterplot/App.svelte |  24 --
 .../12-svg/04-scatterplot/Scatterplot.svelte  |  91 ------
 .../examples/12-svg/04-scatterplot/data.js    |  54 ----
 .../examples/12-svg/04-scatterplot/meta.json  |   3 -
 .../12-svg/05-svg-transitions/App.svelte      |  68 -----
 .../05-svg-transitions/custom-transitions.js  |  14 -
 .../12-svg/05-svg-transitions/meta.json       |   3 -
 .../12-svg/05-svg-transitions/shape.js        |   2 -
 documentation/examples/12-svg/meta.json       |   3 -
 .../examples/13-actions/00-actions/App.svelte |  30 --
 .../13-actions/00-actions/click_outside.js    |  15 -
 .../examples/13-actions/00-actions/meta.json  |   3 -
 .../App.svelte                                |  21 --
 .../longpress.js                              |  26 --
 .../01-adding-parameters-to-actions/meta.json |   3 -
 .../13-actions/03-actions-pannable/App.svelte |  55 ----
 .../13-actions/03-actions-pannable/meta.json  |   3 -
 .../03-actions-pannable/pannable.js           |  53 ----
 documentation/examples/13-actions/meta.json   |   3 -
 .../examples/14-classes/00-classes/App.svelte |  20 --
 .../examples/14-classes/00-classes/meta.json  |   3 -
 .../14-classes/01-class-shorthand/App.svelte  |  18 --
 .../14-classes/01-class-shorthand/meta.json   |   3 -
 documentation/examples/14-classes/meta.json   |   3 -
 .../15-composition/00-slots/App.svelte        |   8 -
 .../15-composition/00-slots/Box.svelte        |  14 -
 .../15-composition/00-slots/meta.json         |   3 -
 .../01-slot-fallbacks/App.svelte              |  10 -
 .../01-slot-fallbacks/Box.svelte              |  16 --
 .../01-slot-fallbacks/meta.json               |   3 -
 .../15-composition/02-named-slots/App.svelte  |  12 -
 .../02-named-slots/ContactCard.svelte         |  54 ----
 .../15-composition/02-named-slots/meta.json   |   3 -
 .../15-composition/03-slot-props/App.svelte   |  51 ----
 .../03-slot-props/Hoverable.svelte            |  16 --
 .../15-composition/03-slot-props/meta.json    |   3 -
 .../04-conditional-slots/App.svelte           |  13 -
 .../04-conditional-slots/Profile.svelte       |  24 --
 .../04-conditional-slots/meta.json            |   3 -
 .../15-composition/05-modal/App.svelte        |  31 --
 .../15-composition/05-modal/Modal.svelte      |  64 -----
 .../15-composition/05-modal/meta.json         |   3 -
 .../examples/15-composition/meta.json         |   3 -
 .../16-context/00-context-api/App.svelte      |  13 -
 .../16-context/00-context-api/Map.svelte      |  45 ---
 .../00-context-api/MapMarker.svelte           |  15 -
 .../16-context/00-context-api/mapbox.js       |   8 -
 .../16-context/00-context-api/meta.json       |   3 -
 documentation/examples/16-context/meta.json   |   3 -
 .../00-svelte-self/App.svelte                 |  39 ---
 .../00-svelte-self/File.svelte                |  14 -
 .../00-svelte-self/Folder.svelte              |  55 ----
 .../00-svelte-self/meta.json                  |   3 -
 .../01-svelte-component/App.svelte            |  21 --
 .../01-svelte-component/BlueThing.svelte      |   7 -
 .../01-svelte-component/GreenThing.svelte     |   7 -
 .../01-svelte-component/RedThing.svelte       |   7 -
 .../01-svelte-component/meta.json             |   3 -
 .../02-svelte-element/App.svelte              |  12 -
 .../02-svelte-element/meta.json               |   3 -
 .../03-svelte-window/App.svelte               |  42 ---
 .../03-svelte-window/meta.json                |   3 -
 .../04-svelte-window-bindings/App.svelte      |  86 ------
 .../04-svelte-window-bindings/meta.json       |   3 -
 .../05-svelte-document/App.svelte             |  10 -
 .../05-svelte-document/meta.json              |   3 -
 .../06-svelte-body/App.svelte                 |  34 ---
 .../06-svelte-body/meta.json                  |   3 -
 .../07-svelte-head/App.svelte                 |   5 -
 .../07-svelte-head/meta.json                  |   3 -
 .../examples/17-special-elements/meta.json    |   3 -
 .../01-module-exports/App.svelte              |  45 ---
 .../01-module-exports/AudioPlayer.svelte      |  57 ----
 .../01-module-exports/meta.json               |   3 -
 .../examples/18-module-context/meta.json      |   3 -
 .../examples/19-debugging/00-debug/App.svelte |  13 -
 .../examples/19-debugging/00-debug/meta.json  |   3 -
 documentation/examples/19-debugging/meta.json |   3 -
 .../20-7guis/01-7guis-counter/App.svelte      |   7 -
 .../20-7guis/01-7guis-counter/meta.json       |   3 -
 .../20-7guis/02-7guis-temperature/App.svelte  |  24 --
 .../20-7guis/02-7guis-temperature/meta.json   |   3 -
 .../03-7guis-flight-booker/App.svelte         |  58 ----
 .../20-7guis/03-7guis-flight-booker/meta.json |   3 -
 .../20-7guis/04-7guis-timer/App.svelte        |  37 ---
 .../20-7guis/04-7guis-timer/meta.json         |   3 -
 .../20-7guis/05-7guis-crud/App.svelte         |  90 ------
 .../examples/20-7guis/05-7guis-crud/meta.json |   3 -
 .../20-7guis/06-7guis-circles/App.svelte      | 129 ---------
 .../20-7guis/06-7guis-circles/meta.json       |   3 -
 documentation/examples/20-7guis/meta.json     |   3 -
 .../01-hacker-news/App.svelte                 |  53 ----
 .../01-hacker-news/Comment.svelte             |  32 ---
 .../01-hacker-news/Item.svelte                |  43 ---
 .../01-hacker-news/List.svelte                |  50 ----
 .../01-hacker-news/Summary.svelte             |  36 ---
 .../21-miscellaneous/01-hacker-news/meta.json |   3 -
 .../02-immutable-data/App.svelte              |  36 ---
 .../02-immutable-data/ImmutableTodo.svelte    |  30 --
 .../02-immutable-data/MutableTodo.svelte      |  28 --
 .../02-immutable-data/flash.js                |  13 -
 .../02-immutable-data/meta.json               |   3 -
 .../examples/21-miscellaneous/meta.json       |   3 -
 .../20181225-blog-svelte-css-in-js/App.svelte |  17 --
 .../Hero.svelte                               |  15 -
 .../20181225-blog-svelte-css-in-js/meta.json  |   3 -
 .../20181225-blog-svelte-css-in-js/styles.js  |  35 ---
 .../20190420-blog-write-less-code/App.svelte  |   9 -
 .../20190420-blog-write-less-code/meta.json   |   3 -
 documentation/examples/99-embeds/meta.json    |   1 -
 .../01-basics/app-a/App.svelte                |   1 -
 .../01-introduction/01-basics/text.md         |  29 --
 .../02-adding-data/app-a/App.svelte           |   1 -
 .../02-adding-data/app-b/App.svelte           |   5 -
 .../01-introduction/02-adding-data/text.md    |  23 --
 .../03-dynamic-attributes/app-a/App.svelte    |   5 -
 .../03-dynamic-attributes/app-b/App.svelte    |   6 -
 .../03-dynamic-attributes/text.md             |  35 ---
 .../04-styling/app-a/App.svelte               |   5 -
 .../04-styling/app-b/App.svelte               |   9 -
 .../01-introduction/04-styling/text.md        |  19 --
 .../05-nested-components/app-a/App.svelte     |   9 -
 .../05-nested-components/app-a/Nested.svelte  |   1 -
 .../05-nested-components/app-b/App.svelte     |  14 -
 .../05-nested-components/app-b/Nested.svelte  |   1 -
 .../05-nested-components/text.md              |  28 --
 .../06-making-an-app/app-a/App.svelte         |   1 -
 .../01-introduction/06-making-an-app/text.md  |  37 ---
 .../tutorial/01-introduction/meta.json        |   3 -
 .../01-reactive-assignments/app-a/App.svelte  |  18 --
 .../01-reactive-assignments/app-b/App.svelte  |  18 --
 .../01-reactive-assignments/text.md           |  21 --
 .../02-reactive-declarations/app-a/App.svelte |  12 -
 .../02-reactive-declarations/app-b/App.svelte |  15 -
 .../02-reactive-declarations/text.md          |  20 --
 .../03-reactive-statements/app-a/App.svelte   |  12 -
 .../03-reactive-statements/app-b/App.svelte   |  17 --
 .../03-reactive-statements/text.md            |  27 --
 .../app-a/App.svelte                          |  13 -
 .../app-b/App.svelte                          |  13 -
 .../04-updating-arrays-and-objects/text.md    |  54 ----
 .../tutorial/02-reactivity/meta.json          |   3 -
 .../01-declaring-props/app-a/App.svelte       |   5 -
 .../01-declaring-props/app-a/Nested.svelte    |   5 -
 .../01-declaring-props/app-b/App.svelte       |   5 -
 .../01-declaring-props/app-b/Nested.svelte    |   5 -
 .../03-props/01-declaring-props/text.md       |  15 -
 .../02-default-values/app-a/App.svelte        |   5 -
 .../02-default-values/app-a/Nested.svelte     |   5 -
 .../02-default-values/app-b/App.svelte        |   6 -
 .../02-default-values/app-b/Nested.svelte     |   5 -
 .../03-props/02-default-values/text.md        |  18 --
 .../03-props/03-spread-props/app-a/App.svelte |  12 -
 .../03-spread-props/app-a/Info.svelte         |  12 -
 .../03-props/03-spread-props/app-b/App.svelte |  12 -
 .../03-spread-props/app-b/Info.svelte         |  12 -
 .../tutorial/03-props/03-spread-props/text.md |  11 -
 documentation/tutorial/03-props/meta.json     |   3 -
 .../04-logic/01-if-blocks/app-a/App.svelte    |  11 -
 .../04-logic/01-if-blocks/app-b/App.svelte    |  15 -
 .../tutorial/04-logic/01-if-blocks/text.md    |  19 --
 .../04-logic/02-else-blocks/app-a/App.svelte  |  15 -
 .../04-logic/02-else-blocks/app-b/App.svelte  |  13 -
 .../tutorial/04-logic/02-else-blocks/text.md  |  15 -
 .../03-else-if-blocks/app-a/App.svelte        |   9 -
 .../03-else-if-blocks/app-b/App.svelte        |  11 -
 .../04-logic/03-else-if-blocks/text.md        |  15 -
 .../04-logic/04-each-blocks/app-a/App.svelte  |  19 --
 .../04-logic/04-each-blocks/app-b/App.svelte  |  19 --
 .../tutorial/04-logic/04-each-blocks/text.md  |  33 ---
 .../05-keyed-each-blocks/app-a/App.svelte     |  21 --
 .../05-keyed-each-blocks/app-a/Thing.svelte   |  40 ---
 .../05-keyed-each-blocks/app-b/App.svelte     |  21 --
 .../05-keyed-each-blocks/app-b/Thing.svelte   |  40 ---
 .../04-logic/05-keyed-each-blocks/text.md     |  21 --
 .../04-logic/06-await-blocks/app-a/App.svelte |  23 --
 .../04-logic/06-await-blocks/app-b/App.svelte |  28 --
 .../tutorial/04-logic/06-await-blocks/text.md |  25 --
 documentation/tutorial/04-logic/meta.json     |   3 -
 .../05-events/01-dom-events/app-a/App.svelte  |  19 --
 .../05-events/01-dom-events/app-b/App.svelte  |  19 --
 .../tutorial/05-events/01-dom-events/text.md  |  11 -
 .../02-inline-handlers/app-a/App.svelte       |  19 --
 .../02-inline-handlers/app-b/App.svelte       |  14 -
 .../05-events/02-inline-handlers/text.md      |  13 -
 .../03-event-modifiers/app-a/App.svelte       |   7 -
 .../03-event-modifiers/app-b/App.svelte       |   7 -
 .../05-events/03-event-modifiers/text.md      |  28 --
 .../04-component-events/app-a/App.svelte      |   9 -
 .../04-component-events/app-a/Inner.svelte    |   7 -
 .../04-component-events/app-b/App.svelte      |   9 -
 .../04-component-events/app-b/Inner.svelte    |  13 -
 .../05-events/04-component-events/text.md     |  27 --
 .../05-event-forwarding/app-a/App.svelte      |   9 -
 .../05-event-forwarding/app-a/Inner.svelte    |  13 -
 .../05-event-forwarding/app-a/Outer.svelte    |   5 -
 .../05-event-forwarding/app-b/App.svelte      |   9 -
 .../05-event-forwarding/app-b/Inner.svelte    |  13 -
 .../05-event-forwarding/app-b/Outer.svelte    |   5 -
 .../05-events/05-event-forwarding/text.md     |  34 ---
 .../06-dom-event-forwarding/app-a/App.svelte  |   9 -
 .../app-a/CustomButton.svelte                 |  20 --
 .../06-dom-event-forwarding/app-b/App.svelte  |   9 -
 .../app-b/CustomButton.svelte                 |  20 --
 .../05-events/06-dom-event-forwarding/text.md |  11 -
 documentation/tutorial/05-events/meta.json    |   3 -
 .../01-text-inputs/app-a/App.svelte           |   7 -
 .../01-text-inputs/app-b/App.svelte           |   7 -
 .../06-bindings/01-text-inputs/text.md        |  15 -
 .../02-numeric-inputs/app-a/App.svelte        |  26 --
 .../02-numeric-inputs/app-b/App.svelte        |  26 --
 .../06-bindings/02-numeric-inputs/text.md     |  12 -
 .../03-checkbox-inputs/app-a/App.svelte       |  16 --
 .../03-checkbox-inputs/app-b/App.svelte       |  16 --
 .../06-bindings/03-checkbox-inputs/text.md    |   9 -
 .../04-group-inputs/app-a/App.svelte          |  55 ----
 .../04-group-inputs/app-b/App.svelte          |  49 ----
 .../06-bindings/04-group-inputs/text.md       |  32 ---
 .../05-textarea-inputs/app-a/App.svelte       |  15 -
 .../05-textarea-inputs/app-b/App.svelte       |  15 -
 .../06-bindings/05-textarea-inputs/text.md    |  18 --
 .../06-select-bindings/app-a/App.svelte       |  41 ---
 .../06-select-bindings/app-b/App.svelte       |  41 ---
 .../06-bindings/06-select-bindings/text.md    |  13 -
 .../app-a/App.svelte                          |  49 ----
 .../app-b/App.svelte                          |  50 ----
 .../07-multiple-select-bindings/text.md       |  21 --
 .../app-a/App.svelte                          |  15 -
 .../app-b/App.svelte                          |  15 -
 .../08-contenteditable-bindings/text.md       |  15 -
 .../09-each-block-bindings/app-a/App.svelte   |  39 ---
 .../09-each-block-bindings/app-b/App.svelte   |  39 ---
 .../09-each-block-bindings/text.md            |  17 --
 .../10-media-elements/app-a/App.svelte        | 131 ---------
 .../10-media-elements/app-b/App.svelte        | 134 ---------
 .../06-bindings/10-media-elements/text.md     |  48 ----
 .../11-dimensions/app-a/App.svelte            |  27 --
 .../11-dimensions/app-b/App.svelte            |  27 --
 .../06-bindings/11-dimensions/text.md         |  17 --
 .../06-bindings/12-bind-this/app-a/App.svelte |  49 ----
 .../06-bindings/12-bind-this/app-b/App.svelte |  49 ----
 .../tutorial/06-bindings/12-bind-this/text.md |  11 -
 .../13-component-bindings/app-a/App.svelte    |  14 -
 .../13-component-bindings/app-a/Keypad.svelte |  40 ---
 .../13-component-bindings/app-b/App.svelte    |  14 -
 .../13-component-bindings/app-b/Keypad.svelte |  40 ---
 .../06-bindings/13-component-bindings/text.md |  13 -
 .../14-component-this/app-a/App.svelte        |   5 -
 .../14-component-this/app-a/InputField.svelte |   9 -
 .../14-component-this/app-b/App.svelte        |   9 -
 .../14-component-this/app-b/InputField.svelte |   9 -
 .../06-bindings/14-component-this/text.md     |  21 --
 documentation/tutorial/06-bindings/meta.json  |   3 -
 .../07-lifecycle/01-onmount/app-a/App.svelte  |  32 ---
 .../07-lifecycle/01-onmount/app-b/App.svelte  |  39 ---
 .../tutorial/07-lifecycle/01-onmount/text.md  |  28 --
 .../02-ondestroy/app-a/App.svelte             |  21 --
 .../02-ondestroy/app-a/Timer.svelte           |  20 --
 .../07-lifecycle/02-ondestroy/app-a/utils.js  |   9 -
 .../02-ondestroy/app-b/App.svelte             |  21 --
 .../02-ondestroy/app-b/Timer.svelte           |  20 --
 .../07-lifecycle/02-ondestroy/app-b/utils.js  |   9 -
 .../07-lifecycle/02-ondestroy/text.md         |  45 ---
 .../07-lifecycle/03-update/app-a/App.svelte   | 113 --------
 .../07-lifecycle/03-update/app-b/App.svelte   | 113 --------
 .../tutorial/07-lifecycle/03-update/text.md   |  24 --
 .../07-lifecycle/04-tick/app-a/App.svelte     |  29 --
 .../07-lifecycle/04-tick/app-b/App.svelte     |  31 --
 .../tutorial/07-lifecycle/04-tick/text.md     |  21 --
 documentation/tutorial/07-lifecycle/meta.json |   3 -
 .../01-writable-stores/app-a/App.svelte       |  18 --
 .../app-a/Decrementer.svelte                  |   9 -
 .../app-a/Incrementer.svelte                  |   9 -
 .../01-writable-stores/app-a/Resetter.svelte  |   9 -
 .../01-writable-stores/app-a/stores.js        |   3 -
 .../01-writable-stores/app-b/App.svelte       |  18 --
 .../app-b/Decrementer.svelte                  |   9 -
 .../app-b/Incrementer.svelte                  |   9 -
 .../01-writable-stores/app-b/Resetter.svelte  |   9 -
 .../01-writable-stores/app-b/stores.js        |   3 -
 .../08-stores/01-writable-stores/text.md      |  27 --
 .../02-auto-subscriptions/app-a/App.svelte    |  18 --
 .../app-a/Decrementer.svelte                  |   9 -
 .../app-a/Incrementer.svelte                  |   9 -
 .../app-a/Resetter.svelte                     |   9 -
 .../02-auto-subscriptions/app-a/stores.js     |   3 -
 .../02-auto-subscriptions/app-b/App.svelte    |  12 -
 .../app-b/Decrementer.svelte                  |   9 -
 .../app-b/Incrementer.svelte                  |   9 -
 .../app-b/Resetter.svelte                     |   9 -
 .../02-auto-subscriptions/app-b/stores.js     |   3 -
 .../08-stores/02-auto-subscriptions/text.md   |  56 ----
 .../03-readable-stores/app-a/App.svelte       |  12 -
 .../03-readable-stores/app-a/stores.js        |   7 -
 .../03-readable-stores/app-b/App.svelte       |  12 -
 .../03-readable-stores/app-b/stores.js        |  11 -
 .../08-stores/03-readable-stores/text.md      |  19 --
 .../04-derived-stores/app-a/App.svelte        |  18 --
 .../04-derived-stores/app-a/stores.js         |  15 -
 .../04-derived-stores/app-b/App.svelte        |  18 --
 .../04-derived-stores/app-b/stores.js         |  15 -
 .../08-stores/04-derived-stores/text.md       |  11 -
 .../05-custom-stores/app-a/App.svelte         |   9 -
 .../05-custom-stores/app-a/stores.js          |  14 -
 .../05-custom-stores/app-b/App.svelte         |   9 -
 .../05-custom-stores/app-b/stores.js          |  14 -
 .../08-stores/05-custom-stores/text.md        |  20 --
 .../06-store-bindings/app-a/App.svelte        |   6 -
 .../06-store-bindings/app-a/stores.js         |   5 -
 .../06-store-bindings/app-b/App.svelte        |   8 -
 .../06-store-bindings/app-b/stores.js         |   5 -
 .../08-stores/06-store-bindings/text.md       |  21 --
 documentation/tutorial/08-stores/meta.json    |   3 -
 .../09-motion/01-tweened/app-a/App.svelte     |  24 --
 .../09-motion/01-tweened/app-b/App.svelte     |  28 --
 .../tutorial/09-motion/01-tweened/text.md     |  40 ---
 .../09-motion/02-spring/app-a/App.svelte      |  37 ---
 .../09-motion/02-spring/app-b/App.svelte      |  44 ---
 .../tutorial/09-motion/02-spring/text.md      |  32 ---
 documentation/tutorial/09-motion/meta.json    |   3 -
 .../01-transition/app-a/App.svelte            |  12 -
 .../01-transition/app-b/App.svelte            |  13 -
 .../10-transitions/01-transition/text.md      |  20 --
 .../app-a/App.svelte                          |  13 -
 .../app-b/App.svelte                          |  13 -
 .../text.md                                   |  20 --
 .../03-in-and-out/app-a/App.svelte            |  13 -
 .../03-in-and-out/app-b/App.svelte            |  13 -
 .../10-transitions/03-in-and-out/text.md      |  17 --
 .../app-a/App.svelte                          |  38 ---
 .../app-b/App.svelte                          |  49 ----
 .../04-custom-css-transitions/text.md         |  77 -----
 .../05-custom-js-transitions/app-a/App.svelte |  18 --
 .../05-custom-js-transitions/app-b/App.svelte |  31 --
 .../05-custom-js-transitions/text.md          |  26 --
 .../06-transition-events/app-a/App.svelte     |  17 --
 .../06-transition-events/app-b/App.svelte     |  25 --
 .../06-transition-events/text.md              |  17 --
 .../07-global-transitions/app-a/App.svelte    |  31 --
 .../07-global-transitions/app-b/App.svelte    |  31 --
 .../07-global-transitions/text.md             |  17 --
 .../08-deferred-transitions/app-a/App.svelte  | 150 ----------
 .../08-deferred-transitions/app-b/App.svelte  | 150 ----------
 .../08-deferred-transitions/text.md           |  30 --
 .../09-key-blocks/app-a/App.svelte            |  20 --
 .../09-key-blocks/app-b/App.svelte            |  22 --
 .../10-transitions/09-key-blocks/text.md      |  18 --
 .../tutorial/10-transitions/meta.json         |   3 -
 .../11-animations/01-animate/app-a/App.svelte | 150 ----------
 .../11-animations/01-animate/app-b/App.svelte | 151 ----------
 .../tutorial/11-animations/01-animate/text.md |  37 ---
 .../tutorial/11-animations/meta.json          |   3 -
 .../12-actions/01-actions/app-a/App.svelte    |  28 --
 .../01-actions/app-a/click_outside.js         |   9 -
 .../12-actions/01-actions/app-b/App.svelte    |  30 --
 .../01-actions/app-b/click_outside.js         |  15 -
 .../tutorial/12-actions/01-actions/text.md    |  46 ---
 .../app-a/App.svelte                          |  19 --
 .../app-a/longpress.js                        |  24 --
 .../app-b/App.svelte                          |  21 --
 .../app-b/longpress.js                        |  27 --
 .../02-adding-parameters-to-actions/text.md   |  44 ---
 documentation/tutorial/12-actions/meta.json   |   3 -
 .../01-classes/app-a/App.svelte               |  20 --
 .../01-classes/app-b/App.svelte               |  20 --
 .../13-advanced-styling/01-classes/text.md    |  25 --
 .../02-class-shorthand/app-a/App.svelte       |  18 --
 .../02-class-shorthand/app-b/App.svelte       |  18 --
 .../02-class-shorthand/text.md                |  20 --
 .../03-inline-styles/app-a/App.svelte         |  15 -
 .../03-inline-styles/app-b/App.svelte         |  15 -
 .../03-inline-styles/text.md                  |  10 -
 .../04-style-directive/app-a/App.svelte       |  15 -
 .../04-style-directive/app-b/App.svelte       |  15 -
 .../04-style-directive/text.md                |  18 --
 .../tutorial/13-advanced-styling/meta.json    |   3 -
 .../14-composition/01-slots/app-a/App.svelte  |   7 -
 .../14-composition/01-slots/app-a/Box.svelte  |  14 -
 .../14-composition/01-slots/app-b/App.svelte  |   8 -
 .../14-composition/01-slots/app-b/Box.svelte  |  14 -
 .../tutorial/14-composition/01-slots/text.md  |  28 --
 .../02-slot-fallbacks/app-a/App.svelte        |   8 -
 .../02-slot-fallbacks/app-a/Box.svelte        |  14 -
 .../02-slot-fallbacks/app-b/App.svelte        |  10 -
 .../02-slot-fallbacks/app-b/Box.svelte        |  16 --
 .../14-composition/02-slot-fallbacks/text.md  |  24 --
 .../03-named-slots/app-a/App.svelte           |   7 -
 .../03-named-slots/app-a/ContactCard.svelte   |  54 ----
 .../03-named-slots/app-b/App.svelte           |  12 -
 .../03-named-slots/app-b/ContactCard.svelte   |  54 ----
 .../14-composition/03-named-slots/text.md     |  42 ---
 .../04-optional-slots/app-a/App.svelte        |  47 ----
 .../04-optional-slots/app-a/Comment.svelte    |  59 ----
 .../04-optional-slots/app-a/Project.svelte    |  62 ----
 .../04-optional-slots/app-b/App.svelte        |  47 ----
 .../04-optional-slots/app-b/Comment.svelte    |  59 ----
 .../04-optional-slots/app-b/Project.svelte    |  64 -----
 .../14-composition/04-optional-slots/text.md  |  28 --
 .../05-slot-props/app-a/App.svelte            |  27 --
 .../05-slot-props/app-a/Hoverable.svelte      |  15 -
 .../05-slot-props/app-b/App.svelte            |  47 ----
 .../05-slot-props/app-b/Hoverable.svelte      |  15 -
 .../14-composition/05-slot-props/text.md      |  49 ----
 .../tutorial/14-composition/meta.json         |   3 -
 .../01-context-api/app-a/App.svelte           |  13 -
 .../01-context-api/app-a/Map.svelte           |  44 ---
 .../01-context-api/app-a/MapMarker.svelte     |  13 -
 .../15-context/01-context-api/app-a/mapbox.js |   8 -
 .../01-context-api/app-b/App.svelte           |  13 -
 .../01-context-api/app-b/Map.svelte           |  46 ---
 .../01-context-api/app-b/MapMarker.svelte     |  15 -
 .../15-context/01-context-api/app-b/mapbox.js |   8 -
 .../15-context/01-context-api/text.md         |  56 ----
 documentation/tutorial/15-context/meta.json   |   3 -
 .../01-svelte-self/app-a/App.svelte           |  29 --
 .../01-svelte-self/app-a/File.svelte          |  14 -
 .../01-svelte-self/app-a/Folder.svelte        |  54 ----
 .../01-svelte-self/app-b/App.svelte           |  29 --
 .../01-svelte-self/app-b/File.svelte          |  14 -
 .../01-svelte-self/app-b/Folder.svelte        |  54 ----
 .../01-svelte-self/text.md                    |  25 --
 .../02-svelte-component/app-a/App.svelte      |  27 --
 .../app-a/BlueThing.svelte                    |   7 -
 .../app-a/GreenThing.svelte                   |   7 -
 .../02-svelte-component/app-a/RedThing.svelte |   7 -
 .../02-svelte-component/app-b/App.svelte      |  21 --
 .../app-b/BlueThing.svelte                    |   7 -
 .../app-b/GreenThing.svelte                   |   7 -
 .../02-svelte-component/app-b/RedThing.svelte |   7 -
 .../02-svelte-component/text.md               |  23 --
 .../03-svelte-element/app-a/App.svelte        |  18 --
 .../03-svelte-element/app-b/App.svelte        |  12 -
 .../03-svelte-element/text.md                 |  23 --
 .../04-svelte-window/app-a/App.svelte         |  42 ---
 .../04-svelte-window/app-b/App.svelte         |  42 ---
 .../04-svelte-window/text.md                  |  13 -
 .../app-a/App.svelte                          |  86 ------
 .../app-b/App.svelte                          |  86 ------
 .../05-svelte-window-bindings/text.md         |  21 --
 .../06-svelte-document/app-a/App.svelte       |  10 -
 .../06-svelte-document/app-b/App.svelte       |  10 -
 .../06-svelte-document/text.md                |  13 -
 .../07-svelte-body/app-a/App.svelte           |  34 ---
 .../07-svelte-body/app-b/App.svelte           |  34 ---
 .../07-svelte-body/text.md                    |  15 -
 .../08-svelte-head/app-a/App.svelte           |   5 -
 .../08-svelte-head/app-b/App.svelte           |   5 -
 .../08-svelte-head/text.md                    |  13 -
 .../09-svelte-options/app-a/App.svelte        |  30 --
 .../09-svelte-options/app-a/Todo.svelte       |  28 --
 .../09-svelte-options/app-a/flash.js          |  13 -
 .../09-svelte-options/app-b/App.svelte        |  30 --
 .../09-svelte-options/app-b/Todo.svelte       |  30 --
 .../09-svelte-options/app-b/flash.js          |  13 -
 .../09-svelte-options/text.md                 |  30 --
 .../10-svelte-fragment/app-a/App.svelte       |  10 -
 .../10-svelte-fragment/app-a/Box.svelte       |  20 --
 .../10-svelte-fragment/app-b/App.svelte       |  10 -
 .../10-svelte-fragment/app-b/Box.svelte       |  20 --
 .../10-svelte-fragment/text.md                |  35 ---
 .../tutorial/16-special-elements/meta.json    |   3 -
 .../01-sharing-code/app-a/App.svelte          |  43 ---
 .../01-sharing-code/app-a/AudioPlayer.svelte  |  38 ---
 .../01-sharing-code/app-b/App.svelte          |  43 ---
 .../01-sharing-code/app-b/AudioPlayer.svelte  |  43 ---
 .../17-module-context/01-sharing-code/text.md |  24 --
 .../02-module-exports/app-a/App.svelte        |  45 ---
 .../app-a/AudioPlayer.svelte                  |  51 ----
 .../02-module-exports/app-b/App.svelte        |  45 ---
 .../app-b/AudioPlayer.svelte                  |  57 ----
 .../02-module-exports/text.md                 |  33 ---
 .../tutorial/17-module-context/meta.json      |   3 -
 .../18-special-tags/01-debug/app-a/App.svelte |  13 -
 .../18-special-tags/01-debug/app-b/App.svelte |  13 -
 .../tutorial/18-special-tags/01-debug/text.md |  15 -
 .../02-html-tags/app-a/App.svelte             |   5 -
 .../02-html-tags/app-b/App.svelte             |   5 -
 .../18-special-tags/02-html-tags/text.md      |  15 -
 .../tutorial/18-special-tags/meta.json        |   3 -
 .../01-congratulations/app-a/App.svelte       |  51 ----
 .../19-next-steps/01-congratulations/text.md  |  11 -
 .../tutorial/19-next-steps/meta.json          |   3 -
 701 files changed, 19792 deletions(-)
 delete mode 100644 documentation/blog/2016-11-26-frameworks-without-the-framework.md
 delete mode 100644 documentation/blog/2017-08-07-the-easiest-way-to-get-started.md
 delete mode 100644 documentation/blog/2017-09-06-the-zen-of-just-writing-css.md
 delete mode 100644 documentation/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md
 delete mode 100644 documentation/blog/2018-04-18-version-2.md
 delete mode 100644 documentation/blog/2018-12-26-svelte-css-in-js.md
 delete mode 100644 documentation/blog/2018-12-27-virtual-dom-is-pure-overhead.md
 delete mode 100644 documentation/blog/2019-01-31-svelte-on-the-changelog.md
 delete mode 100644 documentation/blog/2019-04-15-setting-up-your-editor.md
 delete mode 100644 documentation/blog/2019-04-16-svelte-for-new-developers.md
 delete mode 100644 documentation/blog/2019-04-20-write-less-code.md
 delete mode 100644 documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
 delete mode 100644 documentation/blog/2020-07-17-svelte-and-typescript.md
 delete mode 100644 documentation/blog/2020-10-01-whats-new-in-svelte-october-2020.md
 delete mode 100644 documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md
 delete mode 100644 documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md
 delete mode 100644 documentation/blog/2020-12-01-whats-new-in-svelte-december-2020.md
 delete mode 100644 documentation/blog/2021-01-01-whats-new-in-svelte-january-2021.md
 delete mode 100644 documentation/blog/2021-02-01-whats-new-in-svelte-february-2021.md
 delete mode 100644 documentation/blog/2021-03-01-whats-new-in-svelte-march-2021.md
 delete mode 100644 documentation/blog/2021-03-23-sveltekit-beta.md
 delete mode 100644 documentation/blog/2021-04-01-whats-new-in-svelte-april-2021.md
 delete mode 100644 documentation/blog/2021-05-01-whats-new-in-svelte-may-2021.md
 delete mode 100644 documentation/blog/2021-06-01-whats-new-in-svelte-june-2021.md
 delete mode 100644 documentation/blog/2021-07-01-whats-new-in-svelte-july-2021.md
 delete mode 100644 documentation/blog/2021-08-01-whats-new-in-svelte-august-2021.md
 delete mode 100644 documentation/blog/2021-09-01-whats-new-in-svelte-september-2021.md
 delete mode 100644 documentation/blog/2021-10-01-whats-new-in-svelte-october-2021.md
 delete mode 100644 documentation/blog/2021-11-01-whats-new-in-svelte-november-2021.md
 delete mode 100644 documentation/blog/2021-12-01-whats-new-in-svelte-december-2021.md
 delete mode 100644 documentation/blog/2022-01-01-whats-new-in-svelte-january-2022.md
 delete mode 100644 documentation/blog/2022-01-13-accelerating-sveltes-development.md
 delete mode 100644 documentation/blog/2022-02-01-whats-new-in-svelte-february-2022.md
 delete mode 100644 documentation/blog/2022-03-01-whats-new-in-svelte-march-2022.md
 delete mode 100644 documentation/blog/2022-04-01-whats-new-in-svelte-april-2022.md
 delete mode 100644 documentation/blog/2022-05-01-whats-new-in-svelte-may-2022.md
 delete mode 100644 documentation/blog/2022-06-01-whats-new-in-svelte-june-2022.md
 delete mode 100644 documentation/blog/2022-07-01-whats-new-in-svelte-july-2022.md
 delete mode 100644 documentation/blog/2022-08-01-whats-new-in-svelte-august-2022.md
 delete mode 100644 documentation/blog/2022-09-01-whats-new-in-svelte-september-2022.md
 delete mode 100644 documentation/blog/2022-10-01-whats-new-in-svelte-october-2022.md
 delete mode 100644 documentation/blog/2022-11-01-whats-new-in-svelte-november-2022.md
 delete mode 100644 documentation/blog/2022-12-01-whats-new-in-svelte-december-2022.md
 delete mode 100644 documentation/blog/2022-12-14-announcing-sveltekit-1.0.md
 delete mode 100644 documentation/blog/2023-01-01-whats-new-in-svelte-january-2023.md
 delete mode 100644 documentation/blog/2023-02-01-whats-new-in-svelte-february-2023.md
 delete mode 100644 documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
 delete mode 100644 documentation/blog/2023-03-01-whats-new-in-svelte-march-2023.md
 delete mode 100644 documentation/blog/2023-03-09-zero-config-type-safety.md
 delete mode 100644 documentation/blog/2023-04-01-whats-new-in-svelte-april-2023.md
 delete mode 100644 documentation/blog/2023-05-01-whats-new-in-svelte-may-2023.md
 delete mode 100644 documentation/blog/2023-06-01-whats-new-in-svelte-june-2023.md
 delete mode 100644 documentation/blog/2023-06-22-svelte-4.md
 delete mode 100644 documentation/blog/2023-06-29-svelte-dev-overhaul.md
 delete mode 100644 documentation/blog/2023-07-01-whats-new-in-svelte-july-2023.md
 delete mode 100644 documentation/blog/2023-08-01-whats-new-in-svelte-august-2023.md
 delete mode 100644 documentation/blog/2023-08-31-view-transitions.md
 delete mode 100644 documentation/blog/2023-09-01-whats-new-in-svelte-september-2023.md
 delete mode 100644 documentation/blog/2023-09-20-runes.md
 delete mode 100644 documentation/blog/2023-10-01-hacktoberfest.md
 delete mode 100644 documentation/blog/2023-10-01-whats-new-in-svelte-october-2023.md
 delete mode 100644 documentation/blog/2023-11-01-whats-new-in-svelte-november-2023.md
 delete mode 100644 documentation/examples/00-introduction/00-hello-world/App.svelte
 delete mode 100644 documentation/examples/00-introduction/00-hello-world/meta.json
 delete mode 100644 documentation/examples/00-introduction/01-dynamic-attributes/App.svelte
 delete mode 100644 documentation/examples/00-introduction/01-dynamic-attributes/meta.json
 delete mode 100644 documentation/examples/00-introduction/02-styling/App.svelte
 delete mode 100644 documentation/examples/00-introduction/02-styling/meta.json
 delete mode 100644 documentation/examples/00-introduction/03-nested-components/App.svelte
 delete mode 100644 documentation/examples/00-introduction/03-nested-components/Nested.svelte
 delete mode 100644 documentation/examples/00-introduction/03-nested-components/meta.json
 delete mode 100644 documentation/examples/00-introduction/04-html-tags/App.svelte
 delete mode 100644 documentation/examples/00-introduction/04-html-tags/meta.json
 delete mode 100644 documentation/examples/00-introduction/meta.json
 delete mode 100644 documentation/examples/01-reactivity/00-reactive-assignments/App.svelte
 delete mode 100644 documentation/examples/01-reactivity/00-reactive-assignments/meta.json
 delete mode 100644 documentation/examples/01-reactivity/01-reactive-declarations/App.svelte
 delete mode 100644 documentation/examples/01-reactivity/01-reactive-declarations/meta.json
 delete mode 100644 documentation/examples/01-reactivity/02-reactive-statements/App.svelte
 delete mode 100644 documentation/examples/01-reactivity/02-reactive-statements/meta.json
 delete mode 100644 documentation/examples/01-reactivity/meta.json
 delete mode 100644 documentation/examples/02-props/00-declaring-props/App.svelte
 delete mode 100644 documentation/examples/02-props/00-declaring-props/Nested.svelte
 delete mode 100644 documentation/examples/02-props/00-declaring-props/meta.json
 delete mode 100644 documentation/examples/02-props/01-default-values/App.svelte
 delete mode 100644 documentation/examples/02-props/01-default-values/Nested.svelte
 delete mode 100644 documentation/examples/02-props/01-default-values/meta.json
 delete mode 100644 documentation/examples/02-props/02-spread-props/App.svelte
 delete mode 100644 documentation/examples/02-props/02-spread-props/Info.svelte
 delete mode 100644 documentation/examples/02-props/02-spread-props/meta.json
 delete mode 100644 documentation/examples/02-props/meta.json
 delete mode 100644 documentation/examples/03-logic/00-if-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/00-if-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/01-else-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/01-else-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/02-else-if-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/02-else-if-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/03-each-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/03-each-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/04-keyed-each-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/04-keyed-each-blocks/Thing.svelte
 delete mode 100644 documentation/examples/03-logic/04-keyed-each-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/05-await-blocks/App.svelte
 delete mode 100644 documentation/examples/03-logic/05-await-blocks/meta.json
 delete mode 100644 documentation/examples/03-logic/meta.json
 delete mode 100644 documentation/examples/04-events/00-dom-events/App.svelte
 delete mode 100644 documentation/examples/04-events/00-dom-events/meta.json
 delete mode 100644 documentation/examples/04-events/01-inline-handlers/App.svelte
 delete mode 100644 documentation/examples/04-events/01-inline-handlers/meta.json
 delete mode 100644 documentation/examples/04-events/02-event-modifiers/App.svelte
 delete mode 100644 documentation/examples/04-events/02-event-modifiers/meta.json
 delete mode 100644 documentation/examples/04-events/03-component-events/App.svelte
 delete mode 100644 documentation/examples/04-events/03-component-events/Inner.svelte
 delete mode 100644 documentation/examples/04-events/03-component-events/meta.json
 delete mode 100644 documentation/examples/04-events/04-event-forwarding/App.svelte
 delete mode 100644 documentation/examples/04-events/04-event-forwarding/Inner.svelte
 delete mode 100644 documentation/examples/04-events/04-event-forwarding/Outer.svelte
 delete mode 100644 documentation/examples/04-events/04-event-forwarding/meta.json
 delete mode 100644 documentation/examples/04-events/05-dom-event-forwarding/App.svelte
 delete mode 100644 documentation/examples/04-events/05-dom-event-forwarding/CustomButton.svelte
 delete mode 100644 documentation/examples/04-events/05-dom-event-forwarding/meta.json
 delete mode 100644 documentation/examples/04-events/meta.json
 delete mode 100644 documentation/examples/05-bindings/00-text-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/00-text-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/01-numeric-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/01-numeric-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/02-checkbox-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/02-checkbox-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/03-group-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/03-group-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/04-textarea-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/04-textarea-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/05-file-inputs/App.svelte
 delete mode 100644 documentation/examples/05-bindings/05-file-inputs/meta.json
 delete mode 100644 documentation/examples/05-bindings/06-select-bindings/App.svelte
 delete mode 100644 documentation/examples/05-bindings/06-select-bindings/meta.json
 delete mode 100644 documentation/examples/05-bindings/07-multiple-select-bindings/App.svelte
 delete mode 100644 documentation/examples/05-bindings/07-multiple-select-bindings/meta.json
 delete mode 100644 documentation/examples/05-bindings/08-each-block-bindings/App.svelte
 delete mode 100644 documentation/examples/05-bindings/08-each-block-bindings/meta.json
 delete mode 100644 documentation/examples/05-bindings/09-media-elements/App.svelte
 delete mode 100644 documentation/examples/05-bindings/09-media-elements/meta.json
 delete mode 100644 documentation/examples/05-bindings/10-dimensions/App.svelte
 delete mode 100644 documentation/examples/05-bindings/10-dimensions/meta.json
 delete mode 100644 documentation/examples/05-bindings/11-bind-this/App.svelte
 delete mode 100644 documentation/examples/05-bindings/11-bind-this/meta.json
 delete mode 100644 documentation/examples/05-bindings/12-component-bindings/App.svelte
 delete mode 100644 documentation/examples/05-bindings/12-component-bindings/Keypad.svelte
 delete mode 100644 documentation/examples/05-bindings/12-component-bindings/meta.json
 delete mode 100644 documentation/examples/05-bindings/meta.json
 delete mode 100644 documentation/examples/06-lifecycle/00-onmount/App.svelte
 delete mode 100644 documentation/examples/06-lifecycle/00-onmount/meta.json
 delete mode 100644 documentation/examples/06-lifecycle/01-ondestroy/App.svelte
 delete mode 100644 documentation/examples/06-lifecycle/01-ondestroy/meta.json
 delete mode 100644 documentation/examples/06-lifecycle/01-ondestroy/utils.js
 delete mode 100644 documentation/examples/06-lifecycle/02-update/App.svelte
 delete mode 100644 documentation/examples/06-lifecycle/02-update/meta.json
 delete mode 100644 documentation/examples/06-lifecycle/03-tick/App.svelte
 delete mode 100644 documentation/examples/06-lifecycle/03-tick/meta.json
 delete mode 100644 documentation/examples/06-lifecycle/meta.json
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/App.svelte
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/Decrementer.svelte
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/Incrementer.svelte
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/Resetter.svelte
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/meta.json
 delete mode 100644 documentation/examples/07-stores/00-writable-stores/stores.js
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/App.svelte
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/Decrementer.svelte
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/Incrementer.svelte
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/Resetter.svelte
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/meta.json
 delete mode 100644 documentation/examples/07-stores/01-auto-subscriptions/stores.js
 delete mode 100644 documentation/examples/07-stores/02-readable-stores/App.svelte
 delete mode 100644 documentation/examples/07-stores/02-readable-stores/meta.json
 delete mode 100644 documentation/examples/07-stores/02-readable-stores/stores.js
 delete mode 100644 documentation/examples/07-stores/03-derived-stores/App.svelte
 delete mode 100644 documentation/examples/07-stores/03-derived-stores/meta.json
 delete mode 100644 documentation/examples/07-stores/03-derived-stores/stores.js
 delete mode 100644 documentation/examples/07-stores/04-custom-stores/App.svelte
 delete mode 100644 documentation/examples/07-stores/04-custom-stores/meta.json
 delete mode 100644 documentation/examples/07-stores/04-custom-stores/stores.js
 delete mode 100644 documentation/examples/07-stores/meta.json
 delete mode 100644 documentation/examples/08-motion/00-tweened/App.svelte
 delete mode 100644 documentation/examples/08-motion/00-tweened/meta.json
 delete mode 100644 documentation/examples/08-motion/01-spring/App.svelte
 delete mode 100644 documentation/examples/08-motion/01-spring/meta.json
 delete mode 100644 documentation/examples/08-motion/meta.json
 delete mode 100644 documentation/examples/09-transitions/00-transition/App.svelte
 delete mode 100644 documentation/examples/09-transitions/00-transition/meta.json
 delete mode 100644 documentation/examples/09-transitions/01-adding-parameters-to-transitions/App.svelte
 delete mode 100644 documentation/examples/09-transitions/01-adding-parameters-to-transitions/meta.json
 delete mode 100644 documentation/examples/09-transitions/02-in-and-out/App.svelte
 delete mode 100644 documentation/examples/09-transitions/02-in-and-out/meta.json
 delete mode 100644 documentation/examples/09-transitions/03-custom-css-transitions/App.svelte
 delete mode 100644 documentation/examples/09-transitions/03-custom-css-transitions/meta.json
 delete mode 100644 documentation/examples/09-transitions/04-custom-js-transitions/App.svelte
 delete mode 100644 documentation/examples/09-transitions/04-custom-js-transitions/meta.json
 delete mode 100644 documentation/examples/09-transitions/05-transition-events/App.svelte
 delete mode 100644 documentation/examples/09-transitions/05-transition-events/meta.json
 delete mode 100644 documentation/examples/09-transitions/06-deferred-transitions/App.svelte
 delete mode 100644 documentation/examples/09-transitions/06-deferred-transitions/images.js
 delete mode 100644 documentation/examples/09-transitions/06-deferred-transitions/meta.json
 delete mode 100644 documentation/examples/09-transitions/meta.json
 delete mode 100644 documentation/examples/10-animations/00-animate/App.svelte
 delete mode 100644 documentation/examples/10-animations/00-animate/meta.json
 delete mode 100644 documentation/examples/10-animations/meta.json
 delete mode 100644 documentation/examples/11-easing/00-easing/App.svelte
 delete mode 100644 documentation/examples/11-easing/00-easing/Controls.svelte
 delete mode 100644 documentation/examples/11-easing/00-easing/Grid.svelte
 delete mode 100644 documentation/examples/11-easing/00-easing/eases.js
 delete mode 100644 documentation/examples/11-easing/00-easing/meta.json
 delete mode 100644 documentation/examples/11-easing/meta.json
 delete mode 100644 documentation/examples/12-svg/01-clock/App.svelte
 delete mode 100644 documentation/examples/12-svg/01-clock/meta.json
 delete mode 100644 documentation/examples/12-svg/02-bar-chart/App.svelte
 delete mode 100644 documentation/examples/12-svg/02-bar-chart/meta.json
 delete mode 100644 documentation/examples/12-svg/03-area-chart/App.svelte
 delete mode 100644 documentation/examples/12-svg/03-area-chart/data.js
 delete mode 100644 documentation/examples/12-svg/03-area-chart/meta.json
 delete mode 100644 documentation/examples/12-svg/04-scatterplot/App.svelte
 delete mode 100644 documentation/examples/12-svg/04-scatterplot/Scatterplot.svelte
 delete mode 100644 documentation/examples/12-svg/04-scatterplot/data.js
 delete mode 100644 documentation/examples/12-svg/04-scatterplot/meta.json
 delete mode 100644 documentation/examples/12-svg/05-svg-transitions/App.svelte
 delete mode 100644 documentation/examples/12-svg/05-svg-transitions/custom-transitions.js
 delete mode 100644 documentation/examples/12-svg/05-svg-transitions/meta.json
 delete mode 100644 documentation/examples/12-svg/05-svg-transitions/shape.js
 delete mode 100644 documentation/examples/12-svg/meta.json
 delete mode 100644 documentation/examples/13-actions/00-actions/App.svelte
 delete mode 100644 documentation/examples/13-actions/00-actions/click_outside.js
 delete mode 100644 documentation/examples/13-actions/00-actions/meta.json
 delete mode 100644 documentation/examples/13-actions/01-adding-parameters-to-actions/App.svelte
 delete mode 100644 documentation/examples/13-actions/01-adding-parameters-to-actions/longpress.js
 delete mode 100644 documentation/examples/13-actions/01-adding-parameters-to-actions/meta.json
 delete mode 100644 documentation/examples/13-actions/03-actions-pannable/App.svelte
 delete mode 100644 documentation/examples/13-actions/03-actions-pannable/meta.json
 delete mode 100644 documentation/examples/13-actions/03-actions-pannable/pannable.js
 delete mode 100644 documentation/examples/13-actions/meta.json
 delete mode 100644 documentation/examples/14-classes/00-classes/App.svelte
 delete mode 100644 documentation/examples/14-classes/00-classes/meta.json
 delete mode 100644 documentation/examples/14-classes/01-class-shorthand/App.svelte
 delete mode 100644 documentation/examples/14-classes/01-class-shorthand/meta.json
 delete mode 100644 documentation/examples/14-classes/meta.json
 delete mode 100644 documentation/examples/15-composition/00-slots/App.svelte
 delete mode 100644 documentation/examples/15-composition/00-slots/Box.svelte
 delete mode 100644 documentation/examples/15-composition/00-slots/meta.json
 delete mode 100644 documentation/examples/15-composition/01-slot-fallbacks/App.svelte
 delete mode 100644 documentation/examples/15-composition/01-slot-fallbacks/Box.svelte
 delete mode 100644 documentation/examples/15-composition/01-slot-fallbacks/meta.json
 delete mode 100644 documentation/examples/15-composition/02-named-slots/App.svelte
 delete mode 100644 documentation/examples/15-composition/02-named-slots/ContactCard.svelte
 delete mode 100644 documentation/examples/15-composition/02-named-slots/meta.json
 delete mode 100644 documentation/examples/15-composition/03-slot-props/App.svelte
 delete mode 100644 documentation/examples/15-composition/03-slot-props/Hoverable.svelte
 delete mode 100644 documentation/examples/15-composition/03-slot-props/meta.json
 delete mode 100644 documentation/examples/15-composition/04-conditional-slots/App.svelte
 delete mode 100644 documentation/examples/15-composition/04-conditional-slots/Profile.svelte
 delete mode 100644 documentation/examples/15-composition/04-conditional-slots/meta.json
 delete mode 100644 documentation/examples/15-composition/05-modal/App.svelte
 delete mode 100644 documentation/examples/15-composition/05-modal/Modal.svelte
 delete mode 100644 documentation/examples/15-composition/05-modal/meta.json
 delete mode 100644 documentation/examples/15-composition/meta.json
 delete mode 100644 documentation/examples/16-context/00-context-api/App.svelte
 delete mode 100644 documentation/examples/16-context/00-context-api/Map.svelte
 delete mode 100644 documentation/examples/16-context/00-context-api/MapMarker.svelte
 delete mode 100644 documentation/examples/16-context/00-context-api/mapbox.js
 delete mode 100644 documentation/examples/16-context/00-context-api/meta.json
 delete mode 100644 documentation/examples/16-context/meta.json
 delete mode 100644 documentation/examples/17-special-elements/00-svelte-self/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/00-svelte-self/File.svelte
 delete mode 100644 documentation/examples/17-special-elements/00-svelte-self/Folder.svelte
 delete mode 100644 documentation/examples/17-special-elements/00-svelte-self/meta.json
 delete mode 100644 documentation/examples/17-special-elements/01-svelte-component/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/01-svelte-component/BlueThing.svelte
 delete mode 100644 documentation/examples/17-special-elements/01-svelte-component/GreenThing.svelte
 delete mode 100644 documentation/examples/17-special-elements/01-svelte-component/RedThing.svelte
 delete mode 100644 documentation/examples/17-special-elements/01-svelte-component/meta.json
 delete mode 100644 documentation/examples/17-special-elements/02-svelte-element/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/02-svelte-element/meta.json
 delete mode 100644 documentation/examples/17-special-elements/03-svelte-window/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/03-svelte-window/meta.json
 delete mode 100644 documentation/examples/17-special-elements/04-svelte-window-bindings/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/04-svelte-window-bindings/meta.json
 delete mode 100644 documentation/examples/17-special-elements/05-svelte-document/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/05-svelte-document/meta.json
 delete mode 100644 documentation/examples/17-special-elements/06-svelte-body/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/06-svelte-body/meta.json
 delete mode 100644 documentation/examples/17-special-elements/07-svelte-head/App.svelte
 delete mode 100644 documentation/examples/17-special-elements/07-svelte-head/meta.json
 delete mode 100644 documentation/examples/17-special-elements/meta.json
 delete mode 100644 documentation/examples/18-module-context/01-module-exports/App.svelte
 delete mode 100644 documentation/examples/18-module-context/01-module-exports/AudioPlayer.svelte
 delete mode 100644 documentation/examples/18-module-context/01-module-exports/meta.json
 delete mode 100644 documentation/examples/18-module-context/meta.json
 delete mode 100644 documentation/examples/19-debugging/00-debug/App.svelte
 delete mode 100644 documentation/examples/19-debugging/00-debug/meta.json
 delete mode 100644 documentation/examples/19-debugging/meta.json
 delete mode 100644 documentation/examples/20-7guis/01-7guis-counter/App.svelte
 delete mode 100644 documentation/examples/20-7guis/01-7guis-counter/meta.json
 delete mode 100644 documentation/examples/20-7guis/02-7guis-temperature/App.svelte
 delete mode 100644 documentation/examples/20-7guis/02-7guis-temperature/meta.json
 delete mode 100644 documentation/examples/20-7guis/03-7guis-flight-booker/App.svelte
 delete mode 100644 documentation/examples/20-7guis/03-7guis-flight-booker/meta.json
 delete mode 100644 documentation/examples/20-7guis/04-7guis-timer/App.svelte
 delete mode 100644 documentation/examples/20-7guis/04-7guis-timer/meta.json
 delete mode 100644 documentation/examples/20-7guis/05-7guis-crud/App.svelte
 delete mode 100644 documentation/examples/20-7guis/05-7guis-crud/meta.json
 delete mode 100644 documentation/examples/20-7guis/06-7guis-circles/App.svelte
 delete mode 100644 documentation/examples/20-7guis/06-7guis-circles/meta.json
 delete mode 100644 documentation/examples/20-7guis/meta.json
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/App.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/Comment.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/Item.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/List.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/01-hacker-news/meta.json
 delete mode 100644 documentation/examples/21-miscellaneous/02-immutable-data/App.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/02-immutable-data/ImmutableTodo.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/02-immutable-data/MutableTodo.svelte
 delete mode 100644 documentation/examples/21-miscellaneous/02-immutable-data/flash.js
 delete mode 100644 documentation/examples/21-miscellaneous/02-immutable-data/meta.json
 delete mode 100644 documentation/examples/21-miscellaneous/meta.json
 delete mode 100644 documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte
 delete mode 100644 documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte
 delete mode 100644 documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json
 delete mode 100644 documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js
 delete mode 100644 documentation/examples/99-embeds/20190420-blog-write-less-code/App.svelte
 delete mode 100644 documentation/examples/99-embeds/20190420-blog-write-less-code/meta.json
 delete mode 100644 documentation/examples/99-embeds/meta.json
 delete mode 100644 documentation/tutorial/01-introduction/01-basics/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/01-basics/text.md
 delete mode 100644 documentation/tutorial/01-introduction/02-adding-data/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/02-adding-data/app-b/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/02-adding-data/text.md
 delete mode 100644 documentation/tutorial/01-introduction/03-dynamic-attributes/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/03-dynamic-attributes/app-b/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/03-dynamic-attributes/text.md
 delete mode 100644 documentation/tutorial/01-introduction/04-styling/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/04-styling/app-b/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/04-styling/text.md
 delete mode 100644 documentation/tutorial/01-introduction/05-nested-components/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/05-nested-components/app-a/Nested.svelte
 delete mode 100644 documentation/tutorial/01-introduction/05-nested-components/app-b/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/05-nested-components/app-b/Nested.svelte
 delete mode 100644 documentation/tutorial/01-introduction/05-nested-components/text.md
 delete mode 100644 documentation/tutorial/01-introduction/06-making-an-app/app-a/App.svelte
 delete mode 100644 documentation/tutorial/01-introduction/06-making-an-app/text.md
 delete mode 100644 documentation/tutorial/01-introduction/meta.json
 delete mode 100644 documentation/tutorial/02-reactivity/01-reactive-assignments/app-a/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/01-reactive-assignments/app-b/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/01-reactive-assignments/text.md
 delete mode 100644 documentation/tutorial/02-reactivity/02-reactive-declarations/app-a/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/02-reactive-declarations/app-b/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/02-reactive-declarations/text.md
 delete mode 100644 documentation/tutorial/02-reactivity/03-reactive-statements/app-a/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/03-reactive-statements/app-b/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/03-reactive-statements/text.md
 delete mode 100644 documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-a/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-b/App.svelte
 delete mode 100644 documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/text.md
 delete mode 100644 documentation/tutorial/02-reactivity/meta.json
 delete mode 100644 documentation/tutorial/03-props/01-declaring-props/app-a/App.svelte
 delete mode 100644 documentation/tutorial/03-props/01-declaring-props/app-a/Nested.svelte
 delete mode 100644 documentation/tutorial/03-props/01-declaring-props/app-b/App.svelte
 delete mode 100644 documentation/tutorial/03-props/01-declaring-props/app-b/Nested.svelte
 delete mode 100644 documentation/tutorial/03-props/01-declaring-props/text.md
 delete mode 100644 documentation/tutorial/03-props/02-default-values/app-a/App.svelte
 delete mode 100644 documentation/tutorial/03-props/02-default-values/app-a/Nested.svelte
 delete mode 100644 documentation/tutorial/03-props/02-default-values/app-b/App.svelte
 delete mode 100644 documentation/tutorial/03-props/02-default-values/app-b/Nested.svelte
 delete mode 100644 documentation/tutorial/03-props/02-default-values/text.md
 delete mode 100644 documentation/tutorial/03-props/03-spread-props/app-a/App.svelte
 delete mode 100644 documentation/tutorial/03-props/03-spread-props/app-a/Info.svelte
 delete mode 100644 documentation/tutorial/03-props/03-spread-props/app-b/App.svelte
 delete mode 100644 documentation/tutorial/03-props/03-spread-props/app-b/Info.svelte
 delete mode 100644 documentation/tutorial/03-props/03-spread-props/text.md
 delete mode 100644 documentation/tutorial/03-props/meta.json
 delete mode 100644 documentation/tutorial/04-logic/01-if-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/01-if-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/01-if-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/02-else-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/02-else-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/02-else-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/03-else-if-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/03-else-if-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/03-else-if-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/04-each-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/04-each-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/04-each-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/Thing.svelte
 delete mode 100644 documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/Thing.svelte
 delete mode 100644 documentation/tutorial/04-logic/05-keyed-each-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/06-await-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/06-await-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/04-logic/06-await-blocks/text.md
 delete mode 100644 documentation/tutorial/04-logic/meta.json
 delete mode 100644 documentation/tutorial/05-events/01-dom-events/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/01-dom-events/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/01-dom-events/text.md
 delete mode 100644 documentation/tutorial/05-events/02-inline-handlers/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/02-inline-handlers/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/02-inline-handlers/text.md
 delete mode 100644 documentation/tutorial/05-events/03-event-modifiers/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/03-event-modifiers/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/03-event-modifiers/text.md
 delete mode 100644 documentation/tutorial/05-events/04-component-events/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/04-component-events/app-a/Inner.svelte
 delete mode 100644 documentation/tutorial/05-events/04-component-events/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/04-component-events/app-b/Inner.svelte
 delete mode 100644 documentation/tutorial/05-events/04-component-events/text.md
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-a/Inner.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-a/Outer.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-b/Inner.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/app-b/Outer.svelte
 delete mode 100644 documentation/tutorial/05-events/05-event-forwarding/text.md
 delete mode 100644 documentation/tutorial/05-events/06-dom-event-forwarding/app-a/App.svelte
 delete mode 100644 documentation/tutorial/05-events/06-dom-event-forwarding/app-a/CustomButton.svelte
 delete mode 100644 documentation/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte
 delete mode 100644 documentation/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte
 delete mode 100644 documentation/tutorial/05-events/06-dom-event-forwarding/text.md
 delete mode 100644 documentation/tutorial/05-events/meta.json
 delete mode 100644 documentation/tutorial/06-bindings/01-text-inputs/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/01-text-inputs/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/01-text-inputs/text.md
 delete mode 100644 documentation/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/02-numeric-inputs/text.md
 delete mode 100644 documentation/tutorial/06-bindings/03-checkbox-inputs/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/03-checkbox-inputs/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/03-checkbox-inputs/text.md
 delete mode 100644 documentation/tutorial/06-bindings/04-group-inputs/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/04-group-inputs/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/04-group-inputs/text.md
 delete mode 100644 documentation/tutorial/06-bindings/05-textarea-inputs/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/05-textarea-inputs/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/05-textarea-inputs/text.md
 delete mode 100644 documentation/tutorial/06-bindings/06-select-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/06-select-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/06-select-bindings/text.md
 delete mode 100644 documentation/tutorial/06-bindings/07-multiple-select-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/07-multiple-select-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/07-multiple-select-bindings/text.md
 delete mode 100644 documentation/tutorial/06-bindings/08-contenteditable-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/08-contenteditable-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/08-contenteditable-bindings/text.md
 delete mode 100644 documentation/tutorial/06-bindings/09-each-block-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/09-each-block-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/09-each-block-bindings/text.md
 delete mode 100644 documentation/tutorial/06-bindings/10-media-elements/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/10-media-elements/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/10-media-elements/text.md
 delete mode 100644 documentation/tutorial/06-bindings/11-dimensions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/11-dimensions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/11-dimensions/text.md
 delete mode 100644 documentation/tutorial/06-bindings/12-bind-this/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/12-bind-this/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/12-bind-this/text.md
 delete mode 100644 documentation/tutorial/06-bindings/13-component-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/13-component-bindings/app-a/Keypad.svelte
 delete mode 100644 documentation/tutorial/06-bindings/13-component-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/13-component-bindings/app-b/Keypad.svelte
 delete mode 100644 documentation/tutorial/06-bindings/13-component-bindings/text.md
 delete mode 100644 documentation/tutorial/06-bindings/14-component-this/app-a/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/14-component-this/app-a/InputField.svelte
 delete mode 100644 documentation/tutorial/06-bindings/14-component-this/app-b/App.svelte
 delete mode 100644 documentation/tutorial/06-bindings/14-component-this/app-b/InputField.svelte
 delete mode 100644 documentation/tutorial/06-bindings/14-component-this/text.md
 delete mode 100644 documentation/tutorial/06-bindings/meta.json
 delete mode 100644 documentation/tutorial/07-lifecycle/01-onmount/app-a/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/01-onmount/app-b/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/01-onmount/text.md
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-a/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-a/Timer.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-a/utils.js
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-b/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-b/Timer.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/app-b/utils.js
 delete mode 100644 documentation/tutorial/07-lifecycle/02-ondestroy/text.md
 delete mode 100644 documentation/tutorial/07-lifecycle/03-update/app-a/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/03-update/app-b/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/03-update/text.md
 delete mode 100644 documentation/tutorial/07-lifecycle/04-tick/app-a/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/04-tick/app-b/App.svelte
 delete mode 100644 documentation/tutorial/07-lifecycle/04-tick/text.md
 delete mode 100644 documentation/tutorial/07-lifecycle/meta.json
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-a/Decrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-a/Incrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-a/Resetter.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-b/Decrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-b/Incrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-b/Resetter.svelte
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/01-writable-stores/text.md
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Decrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Incrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Resetter.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Decrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Incrementer.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Resetter.svelte
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/02-auto-subscriptions/text.md
 delete mode 100644 documentation/tutorial/08-stores/03-readable-stores/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/03-readable-stores/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/03-readable-stores/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/03-readable-stores/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/03-readable-stores/text.md
 delete mode 100644 documentation/tutorial/08-stores/04-derived-stores/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/04-derived-stores/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/04-derived-stores/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/04-derived-stores/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/04-derived-stores/text.md
 delete mode 100644 documentation/tutorial/08-stores/05-custom-stores/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/05-custom-stores/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/05-custom-stores/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/05-custom-stores/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/05-custom-stores/text.md
 delete mode 100644 documentation/tutorial/08-stores/06-store-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/06-store-bindings/app-a/stores.js
 delete mode 100644 documentation/tutorial/08-stores/06-store-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/08-stores/06-store-bindings/app-b/stores.js
 delete mode 100644 documentation/tutorial/08-stores/06-store-bindings/text.md
 delete mode 100644 documentation/tutorial/08-stores/meta.json
 delete mode 100644 documentation/tutorial/09-motion/01-tweened/app-a/App.svelte
 delete mode 100644 documentation/tutorial/09-motion/01-tweened/app-b/App.svelte
 delete mode 100644 documentation/tutorial/09-motion/01-tweened/text.md
 delete mode 100644 documentation/tutorial/09-motion/02-spring/app-a/App.svelte
 delete mode 100644 documentation/tutorial/09-motion/02-spring/app-b/App.svelte
 delete mode 100644 documentation/tutorial/09-motion/02-spring/text.md
 delete mode 100644 documentation/tutorial/09-motion/meta.json
 delete mode 100644 documentation/tutorial/10-transitions/01-transition/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/01-transition/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/01-transition/text.md
 delete mode 100644 documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/text.md
 delete mode 100644 documentation/tutorial/10-transitions/03-in-and-out/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/03-in-and-out/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/03-in-and-out/text.md
 delete mode 100644 documentation/tutorial/10-transitions/04-custom-css-transitions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/04-custom-css-transitions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/04-custom-css-transitions/text.md
 delete mode 100644 documentation/tutorial/10-transitions/05-custom-js-transitions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/05-custom-js-transitions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/05-custom-js-transitions/text.md
 delete mode 100644 documentation/tutorial/10-transitions/06-transition-events/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/06-transition-events/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/06-transition-events/text.md
 delete mode 100644 documentation/tutorial/10-transitions/07-global-transitions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/07-global-transitions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/07-global-transitions/text.md
 delete mode 100644 documentation/tutorial/10-transitions/08-deferred-transitions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/08-deferred-transitions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/08-deferred-transitions/text.md
 delete mode 100644 documentation/tutorial/10-transitions/09-key-blocks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/09-key-blocks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/10-transitions/09-key-blocks/text.md
 delete mode 100644 documentation/tutorial/10-transitions/meta.json
 delete mode 100644 documentation/tutorial/11-animations/01-animate/app-a/App.svelte
 delete mode 100644 documentation/tutorial/11-animations/01-animate/app-b/App.svelte
 delete mode 100644 documentation/tutorial/11-animations/01-animate/text.md
 delete mode 100644 documentation/tutorial/11-animations/meta.json
 delete mode 100644 documentation/tutorial/12-actions/01-actions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/12-actions/01-actions/app-a/click_outside.js
 delete mode 100644 documentation/tutorial/12-actions/01-actions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/12-actions/01-actions/app-b/click_outside.js
 delete mode 100644 documentation/tutorial/12-actions/01-actions/text.md
 delete mode 100644 documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/App.svelte
 delete mode 100644 documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/longpress.js
 delete mode 100644 documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/App.svelte
 delete mode 100644 documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/longpress.js
 delete mode 100644 documentation/tutorial/12-actions/02-adding-parameters-to-actions/text.md
 delete mode 100644 documentation/tutorial/12-actions/meta.json
 delete mode 100644 documentation/tutorial/13-advanced-styling/01-classes/app-a/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/01-classes/app-b/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/01-classes/text.md
 delete mode 100644 documentation/tutorial/13-advanced-styling/02-class-shorthand/app-a/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/02-class-shorthand/app-b/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/02-class-shorthand/text.md
 delete mode 100644 documentation/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/03-inline-styles/text.md
 delete mode 100644 documentation/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte
 delete mode 100644 documentation/tutorial/13-advanced-styling/04-style-directive/text.md
 delete mode 100644 documentation/tutorial/13-advanced-styling/meta.json
 delete mode 100644 documentation/tutorial/14-composition/01-slots/app-a/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/01-slots/app-a/Box.svelte
 delete mode 100644 documentation/tutorial/14-composition/01-slots/app-b/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/01-slots/app-b/Box.svelte
 delete mode 100644 documentation/tutorial/14-composition/01-slots/text.md
 delete mode 100644 documentation/tutorial/14-composition/02-slot-fallbacks/app-a/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/02-slot-fallbacks/app-a/Box.svelte
 delete mode 100644 documentation/tutorial/14-composition/02-slot-fallbacks/app-b/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/02-slot-fallbacks/app-b/Box.svelte
 delete mode 100644 documentation/tutorial/14-composition/02-slot-fallbacks/text.md
 delete mode 100644 documentation/tutorial/14-composition/03-named-slots/app-a/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/03-named-slots/app-a/ContactCard.svelte
 delete mode 100644 documentation/tutorial/14-composition/03-named-slots/app-b/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/03-named-slots/app-b/ContactCard.svelte
 delete mode 100644 documentation/tutorial/14-composition/03-named-slots/text.md
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-a/App.svelte
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-a/Comment.svelte
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-a/Project.svelte
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-b/App.svelte
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-b/Comment.svelte
 delete mode 100755 documentation/tutorial/14-composition/04-optional-slots/app-b/Project.svelte
 delete mode 100644 documentation/tutorial/14-composition/04-optional-slots/text.md
 delete mode 100644 documentation/tutorial/14-composition/05-slot-props/app-a/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/05-slot-props/app-a/Hoverable.svelte
 delete mode 100644 documentation/tutorial/14-composition/05-slot-props/app-b/App.svelte
 delete mode 100644 documentation/tutorial/14-composition/05-slot-props/app-b/Hoverable.svelte
 delete mode 100644 documentation/tutorial/14-composition/05-slot-props/text.md
 delete mode 100644 documentation/tutorial/14-composition/meta.json
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-a/App.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-a/Map.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-a/MapMarker.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-a/mapbox.js
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-b/App.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-b/Map.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-b/MapMarker.svelte
 delete mode 100644 documentation/tutorial/15-context/01-context-api/app-b/mapbox.js
 delete mode 100644 documentation/tutorial/15-context/01-context-api/text.md
 delete mode 100644 documentation/tutorial/15-context/meta.json
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-a/File.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-a/Folder.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-b/File.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/app-b/Folder.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/01-svelte-self/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-a/BlueThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-a/GreenThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-a/RedThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-b/BlueThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-b/GreenThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/app-b/RedThing.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/02-svelte-component/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/03-svelte-element/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/03-svelte-element/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/03-svelte-element/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/04-svelte-window/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/04-svelte-window/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/04-svelte-window/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/05-svelte-window-bindings/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/06-svelte-document/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/06-svelte-document/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/06-svelte-document/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/07-svelte-body/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/07-svelte-body/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/07-svelte-body/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/08-svelte-head/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/08-svelte-head/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/08-svelte-head/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-a/Todo.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-a/flash.js
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-b/Todo.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/app-b/flash.js
 delete mode 100644 documentation/tutorial/16-special-elements/09-svelte-options/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/Box.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/App.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/Box.svelte
 delete mode 100644 documentation/tutorial/16-special-elements/10-svelte-fragment/text.md
 delete mode 100644 documentation/tutorial/16-special-elements/meta.json
 delete mode 100644 documentation/tutorial/17-module-context/01-sharing-code/app-a/App.svelte
 delete mode 100644 documentation/tutorial/17-module-context/01-sharing-code/app-a/AudioPlayer.svelte
 delete mode 100644 documentation/tutorial/17-module-context/01-sharing-code/app-b/App.svelte
 delete mode 100644 documentation/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte
 delete mode 100644 documentation/tutorial/17-module-context/01-sharing-code/text.md
 delete mode 100644 documentation/tutorial/17-module-context/02-module-exports/app-a/App.svelte
 delete mode 100644 documentation/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte
 delete mode 100644 documentation/tutorial/17-module-context/02-module-exports/app-b/App.svelte
 delete mode 100644 documentation/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte
 delete mode 100644 documentation/tutorial/17-module-context/02-module-exports/text.md
 delete mode 100644 documentation/tutorial/17-module-context/meta.json
 delete mode 100644 documentation/tutorial/18-special-tags/01-debug/app-a/App.svelte
 delete mode 100644 documentation/tutorial/18-special-tags/01-debug/app-b/App.svelte
 delete mode 100644 documentation/tutorial/18-special-tags/01-debug/text.md
 delete mode 100644 documentation/tutorial/18-special-tags/02-html-tags/app-a/App.svelte
 delete mode 100644 documentation/tutorial/18-special-tags/02-html-tags/app-b/App.svelte
 delete mode 100644 documentation/tutorial/18-special-tags/02-html-tags/text.md
 delete mode 100644 documentation/tutorial/18-special-tags/meta.json
 delete mode 100644 documentation/tutorial/19-next-steps/01-congratulations/app-a/App.svelte
 delete mode 100644 documentation/tutorial/19-next-steps/01-congratulations/text.md
 delete mode 100644 documentation/tutorial/19-next-steps/meta.json

diff --git a/documentation/blog/2016-11-26-frameworks-without-the-framework.md b/documentation/blog/2016-11-26-frameworks-without-the-framework.md
deleted file mode 100644
index de7a227082..0000000000
--- a/documentation/blog/2016-11-26-frameworks-without-the-framework.md
+++ /dev/null
@@ -1,51 +0,0 @@
----
-title: "Frameworks without the framework: why didn't we think of this sooner?"
-description: You can't write serious applications in vanilla JavaScript without hitting a complexity wall. But a compiler can do it for you.
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-> Wait, this new framework has a _runtime_? Ugh. Thanks, I'll pass.
-> **– front end developers in 2018**
-
-We're shipping too much code to our users. Like a lot of front end developers, I've been in denial about that fact, thinking that it was fine to serve 100kb of JavaScript on page load – just use [one less .jpg!](https://twitter.com/miketaylr/status/227056824275333120) – and that what _really_ mattered was performance once your app was already interactive.
-
-But I was wrong. 100kb of .js isn't equivalent to 100kb of .jpg. It's not just the network time that'll kill your app's startup performance, but the time spent parsing and evaluating your script, during which time the browser becomes completely unresponsive. On mobile, those milliseconds rack up very quickly.
-
-If you're not convinced that this is a problem, follow [Alex Russell](https://twitter.com/slightlylate) on Twitter. Alex [hasn't been making many friends in the framework community lately](https://twitter.com/slightlylate/status/728355959022587905), but he's not wrong. But the proposed alternative to using frameworks like Angular, React and Ember – [Polymer](https://www.polymer-project.org/1.0/) – hasn't yet gained traction in the front end world, and it's certainly not for a lack of marketing.
-
-Perhaps we need to rethink the whole thing.
-
-## What problem do frameworks _really_ solve?
-
-The common view is that frameworks make it easier to manage the complexity of your code: the framework abstracts away all the fussy implementation details with techniques like virtual DOM diffing. But that's not really true. At best, frameworks _move the complexity around_, away from code that you had to write and into code you didn't.
-
-Instead, the reason that ideas like React are so wildly and deservedly successful is that they make it easier to manage the complexity of your _concepts_. Frameworks are primarily a tool for structuring your thoughts, not your code.
-
-Given that, what if the framework _didn't actually run in the browser_? What if, instead, it converted your application into pure vanilla JavaScript, just like Babel converts ES2016+ to ES5? You'd pay no upfront cost of shipping a hefty runtime, and your app would get seriously fast, because there'd be no layers of abstraction between your app and the browser.
-
-## Introducing Svelte
-
-Svelte is a new framework that does exactly that. You write your components using HTML, CSS and JavaScript (plus a few extra bits you can [learn in under 5 minutes](https://v2.svelte.dev/guide)), and during your build process Svelte compiles them into tiny standalone JavaScript modules. By statically analysing the component template, we can make sure that the browser does as little work as possible.
-
-The [Svelte implementation of TodoMVC](https://svelte-todomvc.surge.sh/) weighs 3.6kb zipped. For comparison, React plus ReactDOM _without any app code_ weighs about 45kb zipped. It takes about 10x as long for the browser just to evaluate React as it does for Svelte to be up and running with an interactive TodoMVC.
-
-And once your app _is_ up and running, according to [js-framework-benchmark](https://github.com/krausest/js-framework-benchmark) **Svelte is fast as heck**. It's faster than React. It's faster than Vue. It's faster than Angular, or Ember, or Ractive, or Preact, or Riot, or Mithril. It's competitive with Inferno, which is probably the fastest UI framework in the world, for now, because [Dominic Gannaway](https://twitter.com/trueadm) is a wizard. (Svelte is slower at removing elements. We're [working on it](https://github.com/sveltejs/svelte/issues/26).)
-
-It's basically as fast as vanilla JS, which makes sense because it _is_ vanilla JS – just vanilla JS that you didn't have to write.
-
-## But that's not the important thing
-
-Well, it _is_ important – performance matters a great deal. What's really exciting about this approach, though, is that we can finally solve some of the thorniest problems in web development.
-
-Consider interoperability. Want to `npm install cool-calendar-widget` and use it in your app? Previously, you could only do that if you were already using (a correct version of) the framework that the widget was designed for – if `cool-calendar-widget` was built in React and you're using Angular then, well, hard cheese. But if the widget author used Svelte, apps that use it can be built using whatever technology you like. (On the TODO list: a way to convert Svelte components into web components.)
-
-Or [code splitting](https://twitter.com/samccone/status/797528710085652480). It's a great idea (only load the code the user needs for the initial view, then get the rest later), but there's a problem – even if you only initially serve one React component instead of 100, _you still have to serve React itself_. With Svelte, code splitting can be much more effective, because the framework is embedded in the component, and the component is tiny.
-
-Finally, something I've wrestled with a great deal as an open source maintainer: your users always want _their_ features prioritised, and underestimate the cost of those features to people who don't need them. A framework author must always balance the long-term health of the project with the desire to meet their users' needs. That's incredibly difficult, because it's hard to anticipate – much less articulate – the consequences of incremental bloat, and it takes serious soft skills to tell people (who may have been enthusiastically evangelising your tool up to that point) that their feature isn't important enough. But with an approach like Svelte's, many features can be added with absolutely no cost to people who don't use them, because the code that implements those features just doesn't get generated by the compiler if it's unnecessary.
-
-## We're just getting started
-
-Svelte is very new. There's a lot of work still left to do – creating build tool integrations, adding a server-side renderer, hot reloading, transitions, more documentation and examples, starter kits, and so on.
-
-But you can already build rich components with it, which is why we've gone straight to a stable 1.0.0 release. [Read the guide](https://v2.svelte.dev/guide), [try it out in the REPL](/repl), and head over to [GitHub](https://github.com/sveltejs/svelte) to help kickstart the next era of front end development.
diff --git a/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md b/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md
deleted file mode 100644
index 2bbb2d4639..0000000000
--- a/documentation/blog/2017-08-07-the-easiest-way-to-get-started.md
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: The easiest way to get started with Svelte
-description: This'll only take a minute.
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-Svelte is a [new kind of framework](/blog/frameworks-without-the-framework). Rather than putting a `<script src='svelte.js'>` tag on the page, or bringing it into your app with `import` or `require`, Svelte is a compiler that works behind the scenes to turn your component files into beautifully optimised JavaScript.
-
-Because of that, getting started with it can be a little bit confusing at first. How, you might reasonably ask, do you make a Svelte app?
-
-## 1. Use the REPL
-
-The [Svelte REPL](/repl) (Read-Eval-Print Loop) is the easiest way to begin. This is an interactive environment that allows you to modify code and instantly see the result.
-
-You can choose from a list of [examples](/examples/), click the [REPL](/repl) link, and then tweak them until they do what you want.
-
-<aside><p>You'll need to have <a href="https://nodejs.org/">Node.js</a> installed, and know how to use the terminal</p></aside>
-
-At some point, your app will outgrow the REPL. Click the **download** button to save a `svelte-app.zip` file to your computer and uncompress it.
-
-Open a terminal window and set the project up...
-
-```bash
-cd /path/to/svelte-app
-npm install
-```
-
-...then start up a development server:
-
-```bash
-npm run dev
-```
-
-This will serve your app on [localhost:8080](http://localhost:8080) and rebuild it with [Rollup](https://rollupjs.org) every time you make a change to the files in `svelte-app/src`.
-
-## 2. Use degit
-
-When you download from the REPL, you're getting a customised version of the [sveltejs/template](https://github.com/sveltejs/template) repo. You can skip messing around with zip files by using [degit](https://github.com/Rich-Harris/degit), a project scaffolding tool.
-
-In the terminal, you can instantly create a new project like so:
-
-```bash
-npx degit sveltejs/template my-svelte-project
-cd my-svelte-project
-# to use TypeScript run:
-# node scripts/setupTypeScript.js
-
-npm install
-npm run dev
-```
-
-This will create a new project in the `my-svelte-project` directory, install its dependencies, and start a server on http://localhost:8080.
-
-You can find more information about using TypeScript [here](/blog/svelte-and-typescript).
-
-Once you've tinkered a bit and understood how everything fits together, you can fork [sveltejs/template](https://github.com/sveltejs/template) and start doing this instead:
-
-```bash
-npx degit your-name/template my-new-project
-```
-
-And that's it! Do `npm run build` to create a production-ready version of your app, and check the project template's [README](https://github.com/sveltejs/template/blob/master/README.md) for instructions on how to easily deploy your app to the web with [Vercel](https://vercel.com) or [Surge](http://surge.sh/).
-
-You're not restricted to using Rollup — there are also integrations for [webpack](https://github.com/sveltejs/svelte-loader), [Browserify](https://github.com/tehshrike/sveltify) and others, or you can use the [Svelte CLI](https://github.com/sveltejs/svelte-cli) (Update from 2019: with Svelte 3 the CLI was deprecated and we now use [sirv-cli](https://www.npmjs.com/package/sirv-cli) in our template. Feel free to use whatever tool you like!) or the [API](https://github.com/sveltejs/svelte/tree/v2#api) directly. If you make a project template using one of these tools, please share it with the [Svelte Discord chatroom](https://svelte.dev/chat), or via [@sveltejs](https://twitter.com/sveltejs) on Twitter!
diff --git a/documentation/blog/2017-09-06-the-zen-of-just-writing-css.md b/documentation/blog/2017-09-06-the-zen-of-just-writing-css.md
deleted file mode 100644
index f06a4aaac0..0000000000
--- a/documentation/blog/2017-09-06-the-zen-of-just-writing-css.md
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: The zen of Just Writing CSS
-description: I would say this is the future, but we're already doing it.
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-It's fashionable to dislike CSS. There are lots of reasons why that's the case, but it boils down to this: CSS is _unpredictable_. If you've never had the experience of tweaking a style rule and accidentally breaking some layout that you thought was completely unrelated — usually when you're trying to ship — then you're either new at this or you're a much better programmer than the rest of us.
-
-So the JavaScript community rolled up its sleeves and got to work. Over the last couple of years, there's been a Cambrian explosion of libraries aimed at making CSS behave, collectively referred to as _CSS-in-JS_.
-
-What you might not realise is that **the biggest problems with CSS can be solved without CSS-in-JS**. Without those problems, writing CSS isn't just tolerable — it's enjoyable. And you don't have to find solutions to the additional problems that CSS-in-JS introduces.
-
-This article isn't in any way intended as criticism of the hard work the CSS-in-JS community has done. It's one of the most active corners of the JS ecosystem, and new ideas are springing up every week. Instead, my purpose is to illustrate why an alternative approach — based on Single File Components with real CSS — is so damn delightful.
-
-## The biggest problem with CSS
-
-Everything in CSS is global. Because of that, styles intended for one bit of markup often end up affecting another. Because of _that_, developers often resort to wild namespacing conventions (not 'rules', since they're very difficult to enforce) that mostly just increase your risk of RSI.
-
-It gets worse when you're working on a team. No-one dares touch styles authored by someone else, because it's often unclear what they're doing, what markup they apply to, and what disasters will unfold if you remove them.
-
-The consequence of all this is the **append-only stylesheet**. There's no way of knowing which code can safely be removed, so it's common to undo some existing style with another, more specific style — even on relatively small projects.
-
-## Single File Components change all that
-
-The idea behind SFCs is simple: you write your components in an HTML file that (optionally) contains a `<style>` and `<script>` attribute describing the component's styles and behaviour. Svelte, Ractive, Vue and Polymer all follow this basic pattern.
-
-<aside>
-	<p><a href="/blog/frameworks-without-the-framework">Read the introductory blog post</a> if you're new to Svelte. Or <a href="https://twitter.com/padolsey/status/899717303234908160">read</a> <a href="https://twitter.com/sveltejs/status/901818357644701696">the</a> <a href="https://twitter.com/sveltejs/status/901818106309476352">testimonials</a>.</p>
-</aside>
-
-(For the rest of this article we'll be using Svelte, obviously. But if the idea of using a template language makes you shudder — your fears are misplaced, but that's a topic for another day — then just use Vue which lets you use JSX in your SFCs.)
-
-Several wonderful things happen as a result:
-
-- Your styles are _scoped to the component_. No more leakage, no more unpredictable cascade. And no more sesquipedalian classnames designed to prevent conflicts.
-- You don't need to go spelunking through your folder structure to find the rules that are breaking your stuff.
-- The compiler (in Svelte's case) can **identify and remove unused styles**. No more append-only stylesheets!
-
-Let's see what that looks like in practice.
-
-<figure>
-	<video controls poster='https://svelte-technology-assets.surge.sh/just-write-css.jpg'>
-		<source type='video/mp4' src='https://svelte-technology-assets.surge.sh/just-write-css.mp4'>
-	</video>
-
-<!-- prettier-ignore -->
-<figcaption>
-	Is this what they mean by 'use the platform'?
-</figcaption>
-
-</figure>
-
-Every code editor already knows about CSS, so there's a good chance that you'll get autocomplete, linting, syntax highlighting and so on — all without additional JS-fatigue-inducing tools.
-
-And because it's real CSS, rather than some camelCased quotes-everywhere impostor, we can take advantage of the 'tweak in devtools, paste back into our source code' workflow, which I personally couldn't live without. Notice that we get CSS sourcemaps out of the box, so you can instantly pinpoint the lines in question. It's hard to overstate the importance of this: when you're in WYSIWYG mode, you're not thinking in terms of your component tree, so having a robust way to figure out _where these damn styles came from_ is essential. Doubly so if someone else originally wrote the component. (I promise you, this is the single biggest productivity boost to your CSS workflow. If you're writing styles without sourcemaps, you are almost certainly wasting a lot of time. I know I was.)
-
-Svelte transforms your selectors (using an attribute that's also applied to affected elements, though the exact mechanism is unimportant and subject to change) to achieve the scoping. It warns on and removes any unused rules, then it minifies the result and lets you write it out to a `.css` file. There's also an experimental new option to compile to web components, using shadow DOM to encapsulate the styles, if that's your jam.
-
-This is all possible because your CSS is parsed (with [css-tree](https://github.com/csstree/csstree)) and statically analysed in the context of your markup. Static analysis opens the doors to all kinds of exciting future possibilities — smarter optimisations, a11y hints — that are much harder if your styles are computed dynamically at runtime. We're just getting started.
-
-## But we can add tools to do [x]!
-
-If your reaction to the video was 'fine, but if we use TypeScript and write plugins for each editor then we can get all the autocomplete and syntax highlighting stuff' — in other words, if you believe that in order to achieve parity with CSS it makes sense to build, document, promote and maintain a fleet of ancillary projects — then, well, you and I may never see eye to eye!
-
-## We don't have all the answers — yet
-
-Having said all that, CSS-in-JS does point to answers to some lingering questions:
-
-- How can we install styles from npm?
-- How can we reuse constants that are defined in a single place?
-- How can we compose declarations?
-
-Personally, I haven't found these issues to outweigh the benefits of the approach outlined above. You may well have a different set of priorities, and they may be reason enough for you to abandon CSS.
-
-But at the end of the day, you have to know CSS anyway. Love it or loathe it, you must at least _learn_ it. As custodians of the web, we have a choice: create abstractions that steepen the web dev learning curve yet further, or work together to fix the bad parts of CSS. I know which I choose.
diff --git a/documentation/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md b/documentation/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md
deleted file mode 100644
index 86514fc279..0000000000
--- a/documentation/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: 'Sapper: Towards the ideal web app framework'
-description: Taking the next-plus-one step
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-> Quickstart for the impatient: [the Sapper docs](https://sapper.svelte.dev), and the [starter template](https://github.com/sveltejs/sapper-template)
-
-If you had to list the characteristics of the perfect Node.js web application framework, you'd probably come up with something like this:
-
-1. It should do server-side rendering, for fast initial loads and no caveats around SEO
-2. As a corollary, your app's codebase should be universal — write once for server _and_ client
-3. The client-side app should _hydrate_ the server-rendered HTML, attaching event listeners (and so on) to existing elements rather than re-rendering them
-4. Navigating to subsequent pages should be instantaneous
-5. Offline, and other Progressive Web App characteristics, must be supported out of the box
-6. Only the JavaScript and CSS required for the first page should load initially. That means the framework should do automatic code-splitting at the route level, and support dynamic `import(...)` for more granular manual control
-7. No compromise on performance
-8. First-rate developer experience, with hot module reloading and all the trimmings
-9. The resulting codebase should be easy to grok and maintain
-10. It should be possible to understand and customise every aspect of the system — no webpack configs locked up in the framework, and as little hidden 'plumbing' as possible
-11. Learning the entire framework in under an hour should be easy, and not just for experienced developers
-
-[Next.js](https://github.com/zeit/next.js) is close to this ideal. If you haven't encountered it yet, I strongly recommend going through the tutorials at [learnnextjs.com](https://learnnextjs.com). Next introduced a brilliant idea: all the pages of your app are files in a `your-project/pages` directory, and each of those files is just a React component.
-
-Everything else flows from that breakthrough design decision. Finding the code responsible for a given page is easy, because you can just look at the filesystem rather than playing 'guess the component name'. Project structure bikeshedding is a thing of the past. And the combination of SSR (server-side rendering) and code-splitting — something the React Router team [gave up on](https://reacttraining.com/react-router/web/guides/code-splitting), declaring 'Godspeed those who attempt the server-rendered, code-split apps' — is trivial.
-
-But it's not perfect. As churlish as it might be to list the flaws in something _so, so good_, there are some:
-
-- Next uses something called 'route masking' to create nice URLs (e.g. `/blog/hello-world` instead of `/post?slug=hello-world`). This undermines the guarantee about directory structure corresponding to app structure, and forces you to maintain configuration that translates between the two forms
-- All your routes are assumed to be universal 'pages'. But it's very common to need routes that only render on the server, such as a 301 redirect or an API endpoint that serves the data for your pages, and Next doesn't have a great solution for this. You can add logic to your `server.js` file to handle these cases, but it feels at odds with the declarative approach taken for pages
-- To use the client-side router, links can't be standard `<a>` tags. Instead, you have to use framework-specific `<Link>` components, which is impossible in the markdown content for a blog post such as this one, for example
-
-The real problem, though, is that all that goodness comes for a price. The simplest possible Next app — a single 'hello world' page that renders some static text — involves 66kb of gzipped JavaScript. Unzipped, it's 204kb, which is a non-trivial amount of code for a mobile device to parse at a time when performance is a critical factor determining whether or not your users will stick around. And that's the _baseline_.
-
-We can do better!
-
-## The compiler-as-framework paradigm shift
-
-[Svelte introduced a radical idea](/blog/frameworks-without-the-framework): what if your UI framework wasn't a framework at all, but a compiler that turned your components into standalone JavaScript modules? Instead of using a library like React or Vue, which knows nothing about your app and must therefore be a one-size-fits-all solution, we can ship highly-optimised vanilla JavaScript. Just the code your app needs, and without the memory and performance overhead of solutions based on a virtual DOM.
-
-The JavaScript world is [moving towards this model](https://tomdale.net/2017/09/compilers-are-the-new-frameworks/). [Stencil](https://stenciljs.com), a Svelte-inspired framework from the Ionic team, compiles to web components. [Glimmer](https://glimmerjs.com) _doesn't_ compile to standalone JavaScript (the pros and cons of which deserve a separate blog post), but the team is doing some fascinating research around compiling templates to bytecode. (React is [getting in on the action](https://twitter.com/trueadm/status/944908776896978946), though their current research focuses on optimising your JSX app code, which is arguably more similar to the ahead-of-time optimisations that Angular, Ractive and Vue have been doing for a few years.)
-
-What happens if we use the new model as a starting point?
-
-## Introducing Sapper
-
-<aside><p>The <a href="https://sapper.svelte.dev/docs#Why_the_name">name comes from</a> the term for combat engineers, and is also short for Svelte app maker</p></aside>
-
-[Sapper](https://sapper.svelte.dev) is the answer to that question. **Sapper is a Next.js-style framework that aims to meet the eleven criteria at the top of this article while dramatically reducing the amount of code that gets sent to the browser.** It's implemented as Express-compatible middleware, meaning it's easy to understand and customise.
-
-The same 'hello world' app that took 204kb with React and Next weighs just 7kb with Sapper. That number is likely to fall further in the future as we explore the space of optimisation possibilities, such as not shipping any JavaScript _at all_ for pages that aren't interactive, beyond the tiny Sapper runtime that handles client-side routing.
-
-What about a more 'real world' example? Conveniently, the [RealWorld](https://github.com/gothinkster/realworld) project, which challenges frameworks to develop an implementation of a Medium clone, gives us a way to find out. The [Sapper implementation](https://github.com/sveltejs/realworld) takes 39.6kb (11.8kb zipped) to render an interactive homepage.
-
-<aside><p>Code-splitting isn't free — if the reference implementation used code-splitting, it would be larger still</p></aside>
-
-The entire app costs 132.7kb (39.9kb zipped), which is significantly smaller than the reference React/Redux implementation at 327kb (85.7kb), but even if it was as large it would _feel_ faster because of code-splitting. And that's a crucial point. We're told we need to code-split our apps, but if your app uses a traditional framework like React or Vue then there's a hard lower bound on the size of your initial code-split chunk — the framework itself, which is likely to be a significant portion of your total app size. With the Svelte approach, that's no longer the case.
-
-But size is only part of the story. Svelte apps are also extremely performant and memory-efficient, and the framework includes powerful features that you would sacrifice if you chose a 'minimal' or 'simple' UI library.
-
-## Trade-offs
-
-The biggest drawback for many developers evaluating Sapper would be 'but I like React, and I already know how to use it', which is fair.
-
-If you're in that camp, I'd invite you to at least try alternative frameworks. You might be pleasantly surprised! The [Sapper RealWorld](https://github.com/sveltejs/realworld) implementation totals 1,201 lines of source code, compared to 2,377 for the reference implementation, because you're able to express concepts very concisely using Svelte's template syntax (which [takes all of five minutes to master](https://v2.svelte.dev/guide#template-syntax)). You get [scoped CSS](/blog/the-zen-of-just-writing-css), with unused style removal and minification built-in, and you can use preprocessors like LESS if you want. You no longer need to use Babel. SSR is ridiculously fast, because it's just string concatenation. And we recently introduced [svelte/store](https://v2.svelte.dev/guide#state-management), a tiny global store that synchronises state across your component hierarchy with zero boilerplate. The worst that can happen is that you'll end up feeling vindicated!
-
-But there are trade-offs nonetheless. Some people have a pathological aversion to any form of 'template language', and maybe that applies to you. JSX proponents will clobber you with the 'it's just JavaScript' mantra, and therein lies React's greatest strength, which is that it is infinitely flexible. That flexibility comes with its own set of trade-offs, but we're not here to discuss those.
-
-And then there's _ecosystem_. The universe around React in particular — the devtools, editor integrations, ancillary libraries, tutorials, StackOverflow answers, hell, even job opportunities — is unrivalled. While it's true that citing 'ecosystem' as the main reason to choose a tool is a sign that you're stuck on a local maximum, apt to be marooned by the rising waters of progress, it's still a major point in favour of incumbents.
-
-## Roadmap
-
-We're not at version 1.0.0 yet, and a few things may change before we get there. Once we do (soon!), there are a lot of exciting possibilities.
-
-I believe the next frontier of web performance is 'whole-app optimisation'. Currently, Svelte's compiler operates at the component level, but a compiler that understood the boundaries _between_ those components could generate even more efficient code. The React team's [Prepack research](https://twitter.com/trueadm/status/944908776896978946) is predicated on a similar idea, and the Glimmer team is doing some interesting work in this space. Svelte and Sapper are well positioned to take advantage of these ideas.
-
-Speaking of Glimmer, the idea of compiling components to bytecode is one that we'll probably steal in 2018. A framework like Sapper could conceivably determine which compilation mode to use based on the characteristics of your app. It could even serve JavaScript for the initial route for the fastest possible startup time, then lazily serve a bytecode interpreter for subsequent routes, resulting in the optimal combination of startup size and total app size.
-
-Mostly, though, we want the direction of Sapper to be determined by its users. If you're the kind of developer who enjoys life on the bleeding edge and would like to help shape the future of how we build web apps, please join us on [GitHub](https://github.com/sveltejs/svelte) and [Discord](https://svelte.dev/chat).
diff --git a/documentation/blog/2018-04-18-version-2.md b/documentation/blog/2018-04-18-version-2.md
deleted file mode 100644
index 58f420fcd6..0000000000
--- a/documentation/blog/2018-04-18-version-2.md
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: Svelte v2 is out!
-description: Here's what you need to know
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-<aside>Our motto is 'move slowly and break things'. No, wait, that came out wrong...</aside>
-
-Almost a year after we first started talking about version 2 on the Svelte issue tracker, it's finally time to make some breaking changes. This blog post will explain what changed, why it changed, and what you need to do to bring your apps up to date.
-
-## tl;dr
-
-Each of these items is described in more depth below. If you get stuck, ask for help in our friendly [Discord chatroom](https://svelte.dev/chat).
-
-- Install Svelte v2 from npm
-- Upgrade your templates with [svelte-upgrade](https://github.com/sveltejs/svelte-upgrade)
-- Remove calls to `component.observe`, or add the `observe` method from [svelte-extras](https://github.com/sveltejs/svelte-extras)
-- Rewrite calls to `component.get('foo')` as `component.get().foo`
-- Return `destroy` from your custom event handlers, rather than `teardown`
-- Make sure you're not passing numeric string props to components
-
-## New template syntax
-
-The most visible change: we've made some improvements to the template syntax.
-
-A common piece of feedback we heard was 'ewww, Mustache' or 'ewww, Handlebars'. A lot of people who used string-based templating systems in a previous era of web development _really_ dislike them. Because Svelte adopted the `{{curlies}}` from those languages, a lot of people assumed that we somehow shared the limitations of those tools, such as weird scoping rules or an inability to use arbitrary JavaScript expressions.
-
-<aside>If you need to show an actual `{` character, it's as easy as `&amp;#123;`</aside>
-
-Beyond that, JSX proved that double curlies are unnecessary. So we've made our templates more... svelte, by adopting single curlies. The result feels much lighter to look at and is more pleasant to type:
-
-```svelte
-<h1>Hello {name}!</h1>
-```
-
-There are a few other updates. But you don't need to make them manually — just run [svelte-upgrade](https://github.com/sveltejs/svelte-upgrade) on your codebase:
-
-```bash
-npx svelte-upgrade v2 src
-```
-
-This assumes any `.html` files in `src` are Svelte components. You can specify whichever directory you like, or target a different directory — for example, you'd do `npx svelte-upgrade v2 routes` to update a [Sapper](https://sapper.svelte.technology) app.
-
-To see the full set of changes, consult the [svelte-upgrade README](https://github.com/sveltejs/svelte-upgrade#svelte-v2-syntax-changes).
-
-## Computed properties
-
-Another thing that people often found confusing about Svelte is the way computed properties work. To recap, if you had a component with this...
-
-```ts
-// @noErrors
-export default {
-	computed: {
-		d: (a, b, c) => (a = b + c)
-	}
-};
-```
-
-...then Svelte would first look at the function arguments to see which values `d` depended on, and then it would write code that updated `d` whenever those values changed, by injecting them into the function. That's cool, because it allows you to derive complex values from your component's inputs without worrying about when they need to recomputed, but it's also... _weird_. JavaScript doesn't work that way!
-
-In v2, we use [destructuring](http://www.jstips.co/en/javascript/use-destructuring-in-function-parameters/) instead:
-
-```ts
-// @noErrors
-export default {
-	computed: {
-		d: ({ a, b, c }) => (a = b + c)
-	}
-};
-```
-
-The Svelte compiler can still see which values `d` depends on, but it's no longer injecting values — it just passes the component state object into each computed property.
-
-Again, you don't need to make this change manually — just run svelte-upgrade on your components, as shown above.
-
-## Sorry, IE11. It's not you, it's... well actually, yeah. It's you
-
-Svelte v1 was careful to only emit ES5 code, so that you wouldn't be forced to faff around with transpilers in order to use it. But it's 2018 now, and almost all browsers support modern JavaScript. By ditching the ES5 constraint, we can generate leaner code.
-
-If you need to support IE11 and friends, you will need to use a transpiler like [Babel](https://babeljs.io/repl) or [Bublé](https://buble.surge.sh/).
-
-## New lifecycle hooks
-
-In addition to `oncreate` and `ondestroy`, Svelte v2 adds two more [lifecycle hooks](https://v2.svelte.dev/guide#lifecycle-hooks) for responding to state changes:
-
-```js
-// @noErrors
-export default {
-	onstate({ changed, current, previous }) {
-		// this fires before oncreate, and
-		// whenever state changes
-	},
-
-	onupdate({ changed, current, previous }) {
-		// this fires after oncreate, and
-		// whenever the DOM has been updated
-		// following a state change
-	}
-};
-```
-
-You can also listen to those events programmatically:
-
-```js
-// @noErrors
-component.on('state', ({ changed, current, previous }) => {
-	// ...
-});
-```
-
-## component.observe
-
-With the new lifecycle hooks, we no longer need the `component.observe(...)` method:
-
-```js
-// @noErrors
-// before
-export default {
-	oncreate() {
-		this.observe('foo', foo => {
-			console.log(`foo is now ${foo}`);
-		});
-	}
-};
-
-// after
-export default {
-	onstate({ changed, current }) {
-		if (changed.foo) {
-			console.log(`foo is now ${current.foo}`);
-		}
-	}
-};
-```
-
-This shrinks the amount of code Svelte needs to generate, and gives you more flexibility. For example, it's now very easy to take action when any one of _several_ properties have changed, such as redrawing a canvas without debouncing several observers.
-
-However, if you prefer to use `component.observe(...)`, then you can install it from [svelte-extras](https://github.com/sveltejs/svelte-extras):
-
-```js
-// @noErrors
-import { observe } from 'svelte-extras';
-
-export default {
-	methods: {
-		observe
-	}
-};
-```
-
-## component.get
-
-This method no longer takes an optional `key` argument — instead, it always returns the entire state object:
-
-```js
-// @noErrors
-// before
-const foo = this.get('foo');
-const bar = this.get('bar');
-
-// after
-const { foo, bar } = this.get();
-```
-
-This change might seem annoying initially, but it's the right move: among other things, it's likely to play better with type systems as we explore that space more fully in future.
-
-## event_handler.destroy
-
-If your app has [custom event handlers](https://v2.svelte.dev/guide#custom-event-handlers), they must return an object with a `destroy` method, _not_ a `teardown` method (this aligns event handlers with the component API).
-
-## No more type coercion
-
-Previously, numeric values passed to components were treated as numbers:
-
-```svelte
-<Counter start="1" />
-```
-
-That causes unexpected behaviour, and has been changed: if you need to pass a literal number, do so as an expression:
-
-```svelte
-<Counter start={1} />
-```
-
-## Compiler changes
-
-In most cases you'll never need to deal with the compiler directly, so this shouldn't require any action on your part. It's worth noting anyway: the compiler API has changed. Instead of an object with a mish-mash of properties, the compiler now returns `js`, `css`, `ast` and `stats`:
-
-```js
-// @noErrors
-const { js, css, ast, stats } = svelte.compile(source, options);
-```
-
-`js` and `css` are both `{ code, map }` objects, where `code` is a string and `map` is a sourcemap. The `ast` is an abstract syntax tree of your component, and the `stats` object contains metadata about the component, and information about the compilation.
-
-Before, there was a `svelte.validate` method which checked your component was valid. That's been removed — if you want to check a component without actually compiling it, just pass the `generate: false` option.
-
-## My app is broken! Help!
-
-Hopefully this covers everything, and the update should be easier for you than it was for us. But if you find bugs, or discover things that aren't mentioned here, swing by [Discord chatroom](https://svelte.dev/chat) or raise an issue on the [tracker](https://github.com/sveltejs/svelte/issues).
diff --git a/documentation/blog/2018-12-26-svelte-css-in-js.md b/documentation/blog/2018-12-26-svelte-css-in-js.md
deleted file mode 100644
index 0eb2d0a19e..0000000000
--- a/documentation/blog/2018-12-26-svelte-css-in-js.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Using CSS-in-JS with Svelte
-description: You don't need to, but you can
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-CSS is a core part of any web app. By extension, a UI framework that doesn't have a built-in way to add styles to your components is unfinished.
-
-That's why Svelte allows you to add CSS in a component's `<style>` tag. Co-locating your CSS with your markup means we can [solve the biggest problems developers face when writing CSS](/blog/the-zen-of-just-writing-css) without introducing new ones, all while providing a rather nice development experience.
-
-But Svelte's style handling does have some limitations. It's too difficult to share styles between components, or apply app-level optimisations. These are areas we plan to address in future versions, but in the meantime if you need those things you can use any framework-agnostic CSS-in-JS library.
-
-## For example
-
-Here, we're using [Emotion](https://emotion.sh) to generate scoped class names that can be used across multiple components:
-
-<div class="max">
-	<iframe
-		title="Aphrodite example"
-		src="/repl/embed?example=blog-svelte-css-in-js"
-		scrolling="no"
-	></iframe>
-</div>
-
-It's important to note that most CSS-in-JS libraries have a runtime library, and many don't support statically extracting styles out into a separate <code>.css</code> file at build time (which is essential for the best performance). You should therefore only use CSS-in-JS if it's necessary for your application!
-
-Note that you can mix-and-match — you can still use Svelte's built-in CSS handling alongside a CSS-in-JS library.
diff --git a/documentation/blog/2018-12-27-virtual-dom-is-pure-overhead.md b/documentation/blog/2018-12-27-virtual-dom-is-pure-overhead.md
deleted file mode 100644
index 066e758e81..0000000000
--- a/documentation/blog/2018-12-27-virtual-dom-is-pure-overhead.md
+++ /dev/null
@@ -1,135 +0,0 @@
----
-title: Virtual DOM is pure overhead
-description: Let's retire the 'virtual DOM is fast' myth once and for all
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-If you've used JavaScript frameworks in the last few years, you've probably heard the phrase 'the virtual DOM is fast', often said to mean that it's faster than the _real_ DOM. It's a surprisingly resilient meme — for example people have asked how Svelte can be fast when it doesn't use a virtual DOM.
-
-It's time to take a closer look.
-
-## What is the virtual DOM?
-
-In many frameworks, you build an app by creating `render()` functions, like this simple [React](https://reactjs.org/) component:
-
-```ts
-// @noErrors
-function HelloMessage(props) {
-	return <div className="greeting">Hello {props.name}</div>;
-}
-```
-
-You can do the same thing without JSX...
-
-```js
-// @noErrors
-function HelloMessage(props) {
-	return React.createElement('div', { className: 'greeting' }, 'Hello ', props.name);
-}
-```
-
-...but the result is the same — an object representing how the page should now look. That object is the virtual DOM. Every time your app's state updates (for example when the `name` prop changes), you create a new one. The framework's job is to _reconcile_ the new one against the old one, to figure out what changes are necessary and apply them to the real DOM.
-
-## How did the meme start?
-
-Misunderstood claims about virtual DOM performance date back to the launch of React. In [Rethinking Best Practices](https://www.youtube.com/watch?v=x7cQ3mrcKaY), a seminal 2013 talk by former React core team member Pete Hunt, we learned the following:
-
-> This is actually extremely fast, primarily because most DOM operations tend to be slow. There's been a lot of performance work on the DOM, but most DOM operations tend to drop frames.
-
-<figure>
-	<img alt="Pete Hunt at JSConfEU 2013" src="/media/rethinking-best-practices.jpg">
-	<figcaption>Screenshot from <a href="https://www.youtube.com/watch?v=x7cQ3mrcKaY">Rethinking Best Practices</a> at JSConfEU 2013</figcaption>
-</figure>
-
-But hang on a minute! The virtual DOM operations are _in addition to_ the eventual operations on the real DOM. The only way it could be faster is if we were comparing it to a less efficient framework (there were plenty to go around back in 2013!), or arguing against a straw man — that the alternative is to do something no-one actually does:
-
-```js
-// @noErrors
-onEveryStateChange(() => {
-	document.body.innerHTML = renderMyApp();
-});
-```
-
-Pete clarifies soon after...
-
-> React is not magic. Just like you can drop into assembler with C and beat the C compiler, you can drop into raw DOM operations and DOM API calls and beat React if you wanted to. However, using C or Java or JavaScript is an order of magnitude performance improvement because you don't have to worry...about the specifics of the platform. With React you can build applications without even thinking about performance and the default state is fast.
-
-...but that's not the part that stuck.
-
-## So... is the virtual DOM _slow_?
-
-Not exactly. It's more like 'the virtual DOM is usually fast enough', but with certain caveats.
-
-The original promise of React was that you could re-render your entire app on every single state change without worrying about performance. In practice, I don't think that's turned out to be accurate. If it was, there'd be no need for optimisations like `shouldComponentUpdate` (which is a way of telling React when it can safely skip a component).
-
-Even with `shouldComponentUpdate`, updating your entire app's virtual DOM in one go is a lot of work. A while back, the React team introduced something called React Fiber which allows the update to be broken into smaller chunks. This means (among other things) that updates don't block the main thread for long periods of time, though it doesn't reduce the total amount of work or the time an update takes.
-
-## Where does the overhead come from?
-
-Most obviously, [diffing isn't free](https://twitter.com/pcwalton/status/1015694528857047040). You can't apply changes to the real DOM without first comparing the new virtual DOM with the previous snapshot. To take the earlier `HelloMessage` example, suppose the `name` prop changed from 'world' to 'everybody'.
-
-1. Both snapshots contain a single element. In both cases it's a `<div>`, which means we can keep the same DOM node
-2. We enumerate all the attributes on the old `<div>` and the new one to see if any need to be changed, added or removed. In both cases we have a single attribute — a `className` with a value of `"greeting"`
-3. Descending into the element, we see that the text has changed, so we'll need to update the real DOM
-
-Of these three steps, only the third has value in this case, since — as is the case in the vast majority of updates — the basic structure of the app is unchanged. It would be much more efficient if we could skip straight to step 3:
-
-```js
-// @noErrors
-if (changed.name) {
-	text.data = name;
-}
-```
-
-(This is almost exactly the update code that Svelte generates. Unlike traditional UI frameworks, Svelte is a compiler that knows at _build time_ how things could change in your app, rather than waiting to do the work at _run time_.)
-
-## It's not just the diffing though
-
-The diffing algorithms used by React and other virtual DOM frameworks are fast. Arguably, the greater overhead is in the components themselves. You wouldn't write code like this...
-
-```js
-// @noErrors
-function StrawManComponent(props) {
-	const value = expensivelyCalculateValue(props.foo);
-
-	return <p>the value is {value}</p>;
-}
-```
-
-...because you'd be carelessly recalculating `value` on every update, regardless of whether `props.foo` had changed. But it's extremely common to do unnecessary computation and allocation in ways that seem much more benign:
-
-```js
-// @noErrors
-function MoreRealisticComponent(props) {
-	const [selected, setSelected] = useState(null);
-
-	return (
-		<div>
-			<p>Selected {selected ? selected.name : 'nothing'}</p>
-
-			<ul>
-				{props.items.map((item) => (
-					<li>
-						<button onClick={() => setSelected(item)}>{item.name}</button>
-					</li>
-				))}
-			</ul>
-		</div>
-	);
-}
-```
-
-Here, we're generating a new array of virtual `<li>` elements — each with their own inline event handler — on every state change, regardless of whether `props.items` has changed. Unless you're unhealthily obsessed with performance, you're not going to optimise that. There's no point. It's plenty fast enough. But you know what would be even faster? _Not doing that._
-
-<aside><p><a href="https://reactjs.org/docs/hooks-intro.html">React Hooks</a> doubles down on defaulting to doing unnecessary work, with <a href="https://twitter.com/thekitze/status/1078582382201131008">predictable results</a>.</p></aside>
-
-The danger of defaulting to doing unnecessary work, even if that work is trivial, is that your app will eventually succumb to 'death by a thousand cuts' with no clear bottleneck to aim at once it's time to optimise.
-
-Svelte is explicitly designed to prevent you from ending up in that situation.
-
-## Why do frameworks use the virtual DOM then?
-
-It's important to understand that virtual DOM _isn't a feature_. It's a means to an end, the end being declarative, state-driven UI development. Virtual DOM is valuable because it allows you to build apps without thinking about state transitions, with performance that is _generally good enough_. That means less buggy code, and more time spent on creative tasks instead of tedious ones.
-
-But it turns out that we can achieve a similar programming model without using virtual DOM — and that's where Svelte comes in.
diff --git a/documentation/blog/2019-01-31-svelte-on-the-changelog.md b/documentation/blog/2019-01-31-svelte-on-the-changelog.md
deleted file mode 100644
index ca5805ac6d..0000000000
--- a/documentation/blog/2019-01-31-svelte-on-the-changelog.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Svelte on The Changelog
-description: Listen to the interview here
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-Earlier this month, I had the privilege of appearing on [The Changelog](https://changelog.com/podcast), a podcast about software development. We had a fun (for me) and wide-ranging conversation:
-
-- life as a coder inside a newsroom
-- the big compilers-as-frameworks trend
-- scalability
-- the [Great Divide](https://css-tricks.com/the-great-divide/)
-
-...and, most importantly, Svelte 3.
-
-Unless you hang out in our [Discord server](https://svelte.dev/chat) or follow [@sveltejs](https://twitter.com/sveltejs) on Twitter, you might not know that Svelte 3 is just around the corner, and it's going to be a huge release. We've rethought the developer experience from the ground up, and while it _will_ be a nuisance if you need to upgrade a Svelte 2 app (more on that soon) we think you're going to love it.
-
-On the podcast [Adam](https://twitter.com/adamstac), [Jerod](https://twitter.com/jerodsanto) and I talk about some of the changes and why we're making them. You can listen here or on the [podcast page](https://changelog.com/podcast/332).
-
-<audio data-theme="night" style="width: 100%" data-src="https://changelog.com/podcast/332/embed" src="https://cdn.changelog.com/uploads/podcast/332/the-changelog-332.mp3" preload="none" class="changelog-episode" controls></audio><p><a href="https://changelog.com/podcast/332">The Changelog 332: A UI framework without the framework</a> – Listen on <a href="https://changelog.com/">Changelog.com</a></p><script async src="//cdn.changelog.com/embed.js"></script>
diff --git a/documentation/blog/2019-04-15-setting-up-your-editor.md b/documentation/blog/2019-04-15-setting-up-your-editor.md
deleted file mode 100644
index eaf3fac624..0000000000
--- a/documentation/blog/2019-04-15-setting-up-your-editor.md
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: Setting up your editor
-description: Instructions for configuring linting and syntax highlighting
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
-draft: true
----
-
-_**Coming soon**_
-
-This post will walk you through setting up your editor so that it recognises Svelte files:
-
-- eslint-plugin-svelte3
-- svelte-vscode
-- associating .svelte files with HTML in VS Code, Sublime, etc.
-
-## Atom
-
-To treat `*.svelte` files as HTML, open _**Edit → Config...**_ and add the following lines to your `core` section:
-
-```cson
-"*":
-  core:
-    …
-    customFileTypes:
-	    "text.html.basic": [
-        "svelte"
-      ]
-```
-
-## Vim/Neovim
-
-You can use the [coc-svelte extension](https://github.com/coc-extensions/coc-svelte) which utilises the official language-server.
-
-As an alternative you can treat all `*.svelte` files as HTML. Add the following line to your `init.vim`:
-
-```
-au! BufNewFile,BufRead *.svelte set ft=html
-```
-
-To temporarily turn on HTML syntax highlighting for the current buffer, use:
-
-```
-:set ft=html
-```
-
-To set the filetype for a single file, use a [modeline](https://vim.fandom.com/wiki/Modeline_magic):
-
-```
-<!-- vim: set ft=html :-->
-```
-
-## Visual Studio Code
-
-We recommend using the official [Svelte for VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
-
-## JetBrains WebStorm
-
-The [Svelte Framework Integration](https://plugins.jetbrains.com/plugin/12375-svelte/) can be used to add support for Svelte to WebStorm, or other Jetbrains IDEs. Consult the [WebStorm plugin installation guide](https://www.jetbrains.com/help/webstorm/managing-plugins.html) on the JetBrains website for more details.
-
-## Sublime Text 3
-
-Open any `.svelte` file.
-
-Go to _**View → Syntax → Open all with current extension as... → HTML**_.
diff --git a/documentation/blog/2019-04-16-svelte-for-new-developers.md b/documentation/blog/2019-04-16-svelte-for-new-developers.md
deleted file mode 100644
index e11e180a6c..0000000000
--- a/documentation/blog/2019-04-16-svelte-for-new-developers.md
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Svelte for new developers
-description: Never used Node.js or the command line? No problem
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-This short guide is designed to help you — someone who has looked at the [tutorial](/tutorial) and wants to start creating Svelte apps, but doesn't have a ton of experience using JavaScript build tooling — get up and running.
-
-If there are things that don't make sense, or that we're glossing over, feel free to [raise an issue](https://github.com/sveltejs/svelte/issues) or [suggest edits to this page](https://github.com/sveltejs/svelte/blob/master/site/content/blog/2019-04-16-svelte-for-new-developers.md) that will help us help more people.
-
-If you get stuck at any point following this guide, the best place to ask for help is in the [chatroom](https://svelte.dev/chat).
-
-## First things first
-
-You'll be using the _command line_, also known as the terminal. On Windows, you can access it by running **Command Prompt** from the Start menu; on a Mac, hit `Cmd` and `Space` together to bring up **Spotlight**, then start typing `Terminal.app`. On most Linux systems, `Ctrl-Alt-T` brings up the command line.
-
-The command line is a way to interact with your computer (or another computer! but that's a topic for another time) with more power and control than the GUI (graphical user interface) that most people use day-to-day.
-
-Once on the command line, you can navigate the filesystem using `ls` (`dir` on Windows) to list the contents of your current directory, and `cd` to change the current directory. For example, if you had a `Development` directory of your projects inside your home directory, you would type
-
-```bash
-cd Development
-```
-
-to go to it. From there, you could create a new project directory with the `mkdir` command:
-
-```bash
-mkdir svelte-projects
-cd svelte-projects
-```
-
-A full introduction to the command line is out of the scope of this guide, but here are a few more useful commands:
-
-- `cd ..` — navigates to the parent of the current directory
-- `cat my-file.txt` — on Mac/Linux (`type my-file.txt` on Windows), lists the contents of `my-file.txt`
-- `open .` (or `start .` on Windows) — opens the current directory in Finder or File Explorer
-
-## Installing Node.js
-
-[Node](https://nodejs.org/en/) is a way to run JavaScript on the command line. It's used by many tools, including Svelte. If you don't yet have it installed, the easiest way is to download the latest version straight from the [website](https://nodejs.org/en/).
-
-Once installed, you'll have access to three new commands:
-
-- `node my-file.js` — runs the JavaScript in `my-file.js`
-- `npm [subcommand]` — [npm](https://www.npmjs.com/) is a way to install 'packages' that your application depends on, such as the [svelte](https://www.npmjs.com/package/svelte) package
-- `npx [subcommand]` — a convenient way to run programs available on npm without permanently installing them
-
-## Installing a text editor
-
-To write code, you need a good editor. The most popular choice is [Visual Studio Code](https://code.visualstudio.com/) or VS Code, and justifiably so — it's well-designed and fully-featured, and has a wealth of extensions ([including one for Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode), which provides syntax highlighting and diagnostic messages when you're writing components).
-
-## Creating a project
-
-We're going to use the [Svelte + Vite](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-svelte) template. You don't have to use a project template, but it means you have to do a lot less setup work.
-
-On the command line, navigate to where you want to create a new project, then type the following lines (you can paste the whole lot, but you'll develop better muscle memory if you get into the habit of writing each line out one at a time then running it):
-
-```bash
-npm create vite@latest my-svelte-project -- --template svelte
-cd my-svelte-project
-npm install
-```
-
-> You can replace `--template svelte` with `--template svelte-ts`, if you prefer TypeScript.
-
-This creates a new directory, `my-svelte-project`, adds files from the [create-vite/template-svelte](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-svelte) template, and installs a number of packages from npm. Open the directory in your text editor and take a look around. The app's 'source code' lives in the `src` directory, while the files your app can load are in `public`.
-
-In the `package.json` file, there is a section called `"scripts"`. These scripts define shortcuts for working with your application — `dev`, `build` and `preview`. To launch your app in development mode, type the following:
-
-```bash
-npm run dev
-```
-
-Running the `dev` script starts a program called [Vite](https://vitejs.dev/). Vite's job is to take your application's source files, pass them to other programs (including Svelte, in our case) and convert them into the code that will actually run when you open the application in a browser.
-
-Speaking of which, open a browser and navigate to http://localhost:5173. This is your application running on a local _web server_ (hence 'localhost') on port 5173.
-
-Try changing `src/App.svelte` and saving it. The application will update with your changes.
-
-## Building your app
-
-In the last step, we were running the app in 'development mode'. In dev mode, Svelte adds extra code that helps with debugging, and Vite skips the final step where your app's JavaScript is compressed.
-
-When you share your app with the world, you want to build it in 'production mode', so that it's as small and efficient as possible for end users. To do that, use the `build` command:
-
-```bash
-npm run build
-```
-
-Your `dist` directory now contains an optimised version of your app. You can run it like so:
-
-```bash
-npm run preview
-```
diff --git a/documentation/blog/2019-04-20-write-less-code.md b/documentation/blog/2019-04-20-write-less-code.md
deleted file mode 100644
index 8ccc2c0439..0000000000
--- a/documentation/blog/2019-04-20-write-less-code.md
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: Write less code
-description: The most important metric you're not paying attention to
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-All code is buggy. It stands to reason, therefore, that the more code you have to write the buggier your apps will be.
-
-Writing more code also takes more time, leaving less time for other things like optimisation, nice-to-have features, or being outdoors instead of hunched over a laptop.
-
-In fact it's widely acknowledged that [project development time](https://blog.codinghorror.com/diseconomies-of-scale-and-lines-of-code/) and [bug count](https://www.mayerdan.com/ruby/2012/11/11/bugs-per-line-of-code-ratio) grow _quadratically_, not linearly, with the size of a codebase. That tracks with our intuitions: a ten-line pull request will get a level of scrutiny rarely applied to a 100-line one. And once a given module becomes too big to fit on a single screen, the cognitive effort required to understand it increases significantly. We compensate by refactoring and adding comments — activities that almost always result in _more_ code. It's a vicious cycle.
-
-Yet while we obsess — rightly! — over performance numbers, bundle size and anything else we can measure, we rarely pay attention to the amount of code we're writing.
-
-## Readability is important
-
-I'm certainly not claiming that we should use clever tricks to scrunch our code into the most compact form possible at the expense of readability. Nor am I claiming that reducing _lines_ of code is necessarily a worthwhile goal, since it encourages turning readable code like this...
-
-```js
-for (let i = 0; i <= 100; i += 1) {
-	if (i % 2 === 0) {
-		console.log(`${i} is even`);
-	}
-}
-```
-
-...into something much harder to parse:
-
-```js
-for (let i = 0; i <= 100; i += 1) if (i % 2 === 0) console.log(`${i} is even`);
-```
-
-Instead, I'm claiming that we should favour languages and patterns that allow us to naturally write less code.
-
-## Yes, I'm talking about Svelte
-
-Reducing the amount of code you have to write is an explicit goal of Svelte. To illustrate, let's look at a very simple component implemented in React, Vue and Svelte. First, the Svelte version:
-
-<div class="max">
-	<iframe
-		title="Simple component example"
-		src="/repl/embed?example=blog-write-less-code"
-		scrolling="no"
-	></iframe>
-</div>
-
-How would we build this in React? It would probably look something like this:
-
-```js
-// @noErrors
-import React, { useState } from 'react';
-
-export default () => {
-	const [a, setA] = useState(1);
-	const [b, setB] = useState(2);
-
-	function handleChangeA(event) {
-		setA(+event.target.value);
-	}
-
-	function handleChangeB(event) {
-		setB(+event.target.value);
-	}
-
-	return (
-		<div>
-			<input type="number" value={a} onChange={handleChangeA} />
-			<input type="number" value={b} onChange={handleChangeB} />
-
-			<p>
-				{a} + {b} = {a + b}
-			</p>
-		</div>
-	);
-};
-```
-
-Here's an equivalent component in Vue:
-
-```svelte
-<template>
-	<div>
-		<input type="number" v-model.number="a">
-		<input type="number" v-model.number="b">
-
-		<p>{{a}} + {{b}} = {{a + b}}</p>
-	</div>
-</template>
-
-<script>
-	export default {
-		data: function() {
-			return {
-				a: 1,
-				b: 2
-			};
-		}
-	};
-</script>
-```
-
-<aside>
-	<p>I'm counting by copying the source code to the clipboard and running `pbpaste | wc -c` in my terminal</p>
-</aside>
-
-In other words, it takes 442 characters in React, and 263 characters in Vue, to achieve something that takes 145 characters in Svelte. The React version is literally three times larger!
-
-It's unusual for the difference to be _quite_ so obvious — in my experience, a React component is typically around 40% larger than its Svelte equivalent. Let's look at the features of Svelte's design that enable you to express ideas more concisely:
-
-### Top-level elements
-
-In Svelte, a component can have as many top-level elements as you like. In React and Vue, a component must have a single top-level element — in React's case, trying to return two top-level elements from a component function would result in syntactically invalid code. (You can use a fragment — `<>` — instead of a `<div>`, but it's the same basic idea, and still results in an extra level of indentation).
-
-In Vue, your markup must be wrapped in a `<template>` element, which I'd argue is redundant.
-
-### Bindings
-
-In React, we have to respond to input events ourselves:
-
-```js
-// @noErrors
-function handleChangeA(event) {
-	setA(+event.target.value);
-}
-```
-
-This isn't just boring plumbing that takes up extra space on the screen, it's also extra surface area for bugs. Conceptually, the value of the input is bound to the value of `a` and vice versa, but that relationship isn't cleanly expressed — instead we have two tightly-coupled but physically separate chunks of code (the event handler and the `value={a}` prop). Not only that, but we have to remember to coerce the string value with the `+` operator, otherwise `2 + 2` will equal `22` instead of `4`.
-
-Like Svelte, Vue does have a way of expressing the binding — the `v-model` attribute, though again we have to be careful to use `v-model.number` even though it's a numeric input.
-
-### State
-
-In Svelte, you update local component state with an assignment operator:
-
-```js
-let count = 0;
-
-function increment() {
-	count += 1;
-}
-```
-
-In React, we use the `useState` hook:
-
-```js
-// @noErrors
-const [count, setCount] = useState(0);
-
-function increment() {
-	setCount(count + 1);
-}
-```
-
-This is much _noisier_ — it expresses the exact same concept but with over 60% more characters. As you're reading the code, you have to do that much more work to understand the author's intent.
-
-In Vue, meanwhile, we have a default export with a `data` function that returns an object literal with properties corresponding to our local state. Things like helper functions and child components can't simply be imported and used in the template, but must instead be 'registered' by attaching them to the correct part of the default export.
-
-## Death to boilerplate
-
-These are just some of the ways that Svelte helps you build user interfaces with a minimum of fuss. There are plenty of others — for example, [reactive declarations](/tutorial/reactive-declarations) essentially do the work of React's `useMemo`, `useCallback` and `useEffect` without the boilerplate (or indeed the garbage collection overhead of creating inline functions and arrays on each state change).
-
-How? By choosing a different set of constraints. Because [Svelte is a compiler](/blog/frameworks-without-the-framework), we're not bound to the peculiarities of JavaScript: we can _design_ a component authoring experience, rather than having to fit it around the semantics of the language. Paradoxically, this results in _more_ idiomatic code — for example using variables naturally rather than via proxies or hooks — while delivering significantly more performant apps.
diff --git a/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md b/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
deleted file mode 100644
index a4dd7b2b3b..0000000000
--- a/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: 'Svelte 3: Rethinking reactivity'
-description: It's finally here
-author: Rich Harris
-authorURL: https://twitter.com/Rich_Harris
----
-
-After several months of being just days away, we are over the moon to announce the stable release of Svelte 3. This is a huge release representing hundreds of hours of work by many people in the Svelte community, including invaluable feedback from beta testers who have helped shape the design every step of the way.
-
-We think you're going to love it.
-
-## What is Svelte?
-
-Svelte is a component framework — like React or Vue — but with an important difference. Traditional frameworks allow you to write _declarative_ state-driven code, but there's a penalty: the browser must do extra work to convert those declarative structures into DOM operations, using techniques like [virtual DOM diffing](/blog/virtual-dom-is-pure-overhead) that eat into your frame budget and tax the garbage collector.
-
-Instead, Svelte runs at _build time_, converting your components into highly efficient _imperative_ code that surgically updates the DOM. As a result, you're able to write ambitious applications with excellent performance characteristics.
-
-The first version of Svelte was all about [testing a hypothesis](/blog/frameworks-without-the-framework) — that a purpose-built compiler could generate rock-solid code that delivered a great user experience. The second was a small upgrade that tidied things up a bit.
-
-Version 3 is a significant overhaul. Our focus for the last five or six months has been on delivering an outstanding _developer_ experience. It's now possible to write components with [significantly less boilerplate](/blog/write-less-code) than you'll find elsewhere. Try the brand new [tutorial](/tutorial) and see what we mean — if you're familiar with other frameworks we think you'll be pleasantly surprised.
-
-To make that possible we first needed to rethink the concept at the heart of modern UI frameworks: reactivity.
-
-<div class="max">
-<figure style="max-width: 960px; margin: 0 auto">
-<div style="height: 0; padding: 0 0 57.1% 0; position: relative; margin: 0 auto;">
-	<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0; margin: 0;" src="https://www.youtube-nocookie.com/embed/AdNJ3fydeao" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-</div>
-
-<figcaption>'Rethinking Reactivity' from <a href="https://www.israel.yglfconf.com/">You Gotta Love Frontend Code Camp</a></figcaption>
-</figure>
-</div>
-
-## Moving reactivity into the language
-
-In old Svelte, you would tell the computer that some state had changed by calling the `this.set` method:
-
-```js
-// @noErrors
-const { count } = this.get();
-this.set({
-	count: count + 1
-});
-```
-
-That would cause the component to _react_. Speaking of which, `this.set` is almost identical to the `this.setState` method used in classical (pre-hooks) React:
-
-```js
-// @noErrors
-const { count } = this.state;
-this.setState({
-	count: count + 1
-});
-```
-
-There are some important technical differences (as I explain in the video above, React is not reactive) but conceptually it's the same thing.
-
-<aside>
-	<p>In fact, Svelte 3 is basically <a href="https://twitter.com/threepointone/status/1057179801109311488">Sunil's fault</a>.</p>
-</aside>
-
-That all changed with the advent of [hooks](https://reactjs.org/docs/hooks-intro.html), which handle state in a very different fashion. Many frameworks started experimenting with their own implementations of hooks, but we quickly concluded it wasn't a direction we wanted to go in. Hooks have some intriguing properties, but they also involve some unnatural code and create unnecessary work for the garbage collector. For a framework that's used in [embedded devices](https://mobile.twitter.com/sveltejs/status/1088500539640418304) as well as animation-heavy interactives, that's no good.
-
-So we took a step back and asked ourselves what kind of API would work for us... and realised that the best API is no API at all. We can just _use the language_. Updating some `count` value — and all the things that depend on it — should be as simple as this:
-
-```ts
-let count: number = 10;
-// ---cut---
-count += 1;
-```
-
-Since we're a compiler, we can do that by instrumenting assignments behind the scenes:
-
-```ts
-let count: number = 10;
-const $$invalidate = <T>(name: string, value: T) => {
-	return void 0;
-};
-// ---cut---
-count += 1;
-$$invalidate('count', count);
-```
-
-Importantly, we can do all this without the overhead and complexity of using proxies or accessors. It's just a variable.
-
-## New look
-
-Your components aren't the only thing that's getting a facelift. Svelte itself has a completely new look and feel, thanks to the amazing design work of [Achim Vedam](https://vedam.de/) who created our new logo and website, which has moved from [svelte.technology](https://svelte.technology) to [svelte.dev](https://svelte.dev).
-
-We've also changed our tagline, from 'The magical disappearing UI framework' to 'Cybernetically enhanced web apps'. Svelte has many aspects — outstanding performance, small bundles, accessibility, built-in style encapsulation, declarative transitions, ease of use, the fact that it's a compiler, etc — that focusing on any one of them feels like an injustice to the others. 'Cybernetically enhanced' is designed to instead evoke Svelte's overarching philosophy that our tools should work as intelligent extensions of ourselves — hopefully with a retro, William Gibson-esque twist.
-
-## Upgrading from version 2
-
-If you're an existing Svelte 2 user, I'm afraid there is going to be some manual upgrading involved. In the coming days we'll release a migration guide and an updated version of [svelte-upgrade](https://github.com/sveltejs/svelte-upgrade) which will do the best it can to automate the process, but this _is_ a significant change and not everything can be handled automatically.
-
-We don't take this lightly: hopefully once you've experienced Svelte 3 you'll understand why we felt it was necessary to break with the past.
-
-## Still to come
-
-As grueling as this release has been, we're nowhere near finished. We have a ton of ideas for generating smarter, more compact code, and a long feature wish-list. [Sapper](https://sapper.svelte.dev), our Next.js-style app framework, is still in the middle of being updated to use Svelte 3. The [Svelte Native](https://svelte-native.technology/) community project, which allows you to write Android and iOS apps in Svelte, is making solid progress but deserves more complete support from core. We don't yet have the bounty of editor extensions, syntax highlighters, component kits, devtools and so on that other frameworks have, and we should fix that. We _really_ want to add first-class TypeScript support.
-
-But in the meantime we think Svelte 3 is the best way to build web apps yet. Take an hour to go through the [tutorial](/tutorial) and we hope to convince you of the same. Either way, we'd love to see you in our [Discord chatroom](https://svelte.dev/chat) and on [GitHub](https://github.com/sveltejs/svelte) — everyone is welcome, especially you.
diff --git a/documentation/blog/2020-07-17-svelte-and-typescript.md b/documentation/blog/2020-07-17-svelte-and-typescript.md
deleted file mode 100644
index 691ecdafde..0000000000
--- a/documentation/blog/2020-07-17-svelte-and-typescript.md
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: Svelte <3 TypeScript
-description: Typernetically enhanced web apps
-author: Orta Therox
-authorURL: https://twitter.com/orta
----
-
-It's been by far the most requested feature for a while, and it's finally here: Svelte officially supports TypeScript.
-
-We think it'll give you a much nicer development experience — one that also scales beautifully to larger Svelte code bases — regardless of whether you use TypeScript or JavaScript.
-
-<figure>
-	<img alt="Screenshot of TypeScript in Svelte" src="/media/svelte-ts.png">
-	<figcaption>Image of TypeScript + Svelte in VS Code (theme is <a href="https://marketplace.visualstudio.com/items?itemName=karyfoundation.theme-karyfoundation-themes">Kary Pro</a>.)</figcaption>
-</figure>
-
-## Try it now
-
-You can start a new Svelte TypeScript project using Svelte's official scaffolding CLI by running `npx sv create` and following the prompts. This sets up a new SvelteKit project for you.
-
-Alternatively you can run `npm create vite@latest myapp -- --template svelte-ts` to scaffold a Vite project using Svelte and TypeScript.
-
-If you're a VS Code user, make sure you're using the (new) [official extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode), which replaces the popular extension by James Birtles.
-Later in this blog post, we'll detail the individual steps involved in using TypeScript in an existing Svelte project.
-
-## What does it mean to support TypeScript in Svelte?
-
-TypeScript support in Svelte has been possible for a long time, but you had to mix a lot of disparate tools together and each project ran independently. Today, nearly all of these tools live under the Svelte organization and are maintained by a set of people who take responsibility over the whole pipeline and have common goals.
-
-A week before COVID was declared a pandemic, [I pitched a consolidation](https://github.com/sveltejs/svelte/issues/4518) of the best Svelte tools and ideas from similar dev-ecosystems and provided a set of steps to get first class TypeScript support. Since then, many people have pitched in and written the code to get us there.
-
-When we say that Svelte now supports TypeScript, we mean a few different things:
-
-- You can use TypeScript inside your `<script>` blocks — just add the `lang="ts"` attribute
-- Components with TypeScript can be type-checked with the `svelte-check` command
-- You get autocompletion hints and type-checking as you're writing components, even in expressions inside markup
-- TypeScript files understand the Svelte component API — no more red squiggles when you import a `.svelte` file into a `.ts` module
-
-### How does it work?
-
-To understand the two main parts of TypeScript support, we'll compare it to the technique TypeScript uses to provide dev tools. There is a compiler `tsc` which you run on the command-line to convert `*.ts` to `*.js`, then there is a `TSServer` which is a node API that responds to requests from text editors. The `TSServer` is what provides all the JavaScript and TypeScript realtime introspection for editors while coding, and it has most of the compiler's code inside it.
-
-For Svelte, we have the Svelte compiler, and now we have the [`svelte-language-server`](https://github.com/sveltejs/language-tools/tree/master/packages/language-server#svelte-language-server) which responds to text editor calls via the [Language Server Protocol standard](https://microsoft.github.io//language-server-protocol/overviews/lsp/overview/). First class TypeScript support means that _both_ of these two systems do a good job of handling TypeScript code.
-
-The Svelte compiler support for TypeScript is handled by [Christian Kaisermann](https://github.com/kaisermann)'s [`svelte-preprocess`](https://github.com/sveltejs/svelte-preprocess#svelte-preprocess) which is now an official Svelte project.
-
-For the editor level, we took inspiration from [Pine's](https://github.com/octref) work in the [Vue](https://vuejs.org) ecosystem via [Vetur](https://github.com/vuejs/vetur). Vetur provides an [LSP](https://github.com/vuejs/vetur/blob/master/server), a VS Code extension and a [CLI](https://github.com/vuejs/vetur/blob/master/vti). Svelte now also has an [LSP](https://github.com/sveltejs/language-tools/blob/master/packages/language-server), a [VS Code extension](https://github.com/sveltejs/language-tools/blob/master/packages/svelte-vscode) and a [CLI](https://github.com/sveltejs/language-tools/blob/master/packages/svelte-check).
-
-### `*.svelte` Introspection
-
-For the official Svelte VS Code extension, we built off the foundations which [James Birtles](https://github.com/UnwrittenFun) has created in [`UnwrittenFun/svelte-vscode`](https://github.com/UnwrittenFun/svelte-vscode) and [`UnwrittenFun/svelte-language-server`](https://github.com/UnwrittenFun/svelte-language-server/).
-
-[Simon Holthausen](https://github.com/dummdidumm) and [Lyu, Wei-Da](https://github.com/jasonlyu123) have done great work improving the JavaScript and TypeScript introspection, including integrating [@halfnelson](https://github.com/halfnelson)'s [svelte2tsx](https://github.com/sveltejs/language-tools/tree/master/packages/svelte2tsx#svelte2tsx) which powers understanding the props on components in your codebase.
-
-## Adding TypeScript to an existing project
-
-Before getting started, add the dependencies:
-
-```bash
-npm install --save-dev @tsconfig/svelte typescript svelte-preprocess svelte-check
-```
-
-### 1. Compiling TypeScript
-
-You first need to set up [`svelte-preprocess`](https://github.com/sveltejs/svelte-preprocess#svelte-preprocess), which passes the contents of your `<script lang="ts">` blocks through the TypeScript compiler.
-
-In a Rollup project, that would look like this — note that we also need to install `@rollup/plugin-typescript` so that Rollup can handle `.ts` files:
-
-```diff
-+ import autoPreprocess from 'svelte-preprocess';
-+ import typescript from '@rollup/plugin-typescript';
-
-export default {
-  ...,
-  plugins: [
-    svelte({
-+       preprocess: autoPreprocess()
-    }),
-+   typescript({ sourceMap: !production })
-  ]
-}
-```
-
-[Full instructions for other environments here](https://github.com/sveltejs/svelte-preprocess#usage).
-
-To configure TypeScript, you will need to create a `tsconfig.json` in the root of your project:
-
-```json
-{
-	"extends": "@tsconfig/svelte/tsconfig.json",
-
-	"include": ["src/**/*", "src/node_modules"],
-	"exclude": ["node_modules/*", "__sapper__/*", "public/*"]
-}
-```
-
-Your `include`/`exclude` may differ per project — these are defaults that should work across most Svelte projects.
-
-### 2. Editor Support
-
-Any editor [using an LSP](https://langserver.org/#implementations-client) can be supported. The [VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) extension has been our primary focus, but there is work in progress [on Atom](https://github.com/sveltejs/language-tools/pull/160), and Vim via [coc-svelte](https://github.com/coc-extensions/coc-svelte) has been updated with the latest LSP.
-
-These editor extensions will improve your coding experience even if you only use JavaScript. The editor won't offer errors, but it will offer inference and refactoring tools. You can [add `// @ts-check`](https://www.staging-typescript.org/docs/handbook/intro-to-js-ts.html) to the top of a `<script>` tag using JavaScript to get better error messages with no infra changes.
-
-To switch a `<script>` to use TypeScript, use `<script lang="ts">` and that should be it. Hopefully you won't be seeing an ocean of red squiggles.
-
-### 3. CI Checks
-
-Having red squiggles is great, well, kinda. On the long run though, you want to be able to verify that there are no errors in your code. To verify your project is error free, you can use the CLI tool [`svelte-check`](https://www.npmjs.com/package/svelte-check). It acts like an editor asking for errors against all of your `.svelte` files.
-
-You can add the dependency to your project and then add it to CI.
-
-```bash
-❯ npx svelte-check
-
-Loading svelte-check in workspace: /Users/ortatherox/dev/svelte/example-app
-Getting Svelte diagnostics...
-====================================
-
-/Users/ortatherox/dev/svelte/example-app/src/App.svelte:3:2
-Error: Type '123' is not assignable to type 'string'. (ts)
-
-====================================
-svelte-check found 1 error
-error Command failed with exit code 1.
-```
-
-## What about TypeScript in Sapper projects?
-
-TypeScript support was added to Sapper in 0.28, so if you're using an older version be sure to [upgrade](https://sapper.svelte.dev/migrating#0_27_to_0_28).
-
-## How can I contribute?
-
-We're so glad you asked. The work is happening in the [sveltejs/language-tools](https://github.com/sveltejs/language-tools) repo and in the [#language-tools](https://discord.gg/enV6v8K) channel in the Svelte Discord. If you'd like to report issues, submit fixes, or help out with extensions for new editors and so on, that's where you can find us. See you there!
diff --git a/documentation/blog/2020-10-01-whats-new-in-svelte-october-2020.md b/documentation/blog/2020-10-01-whats-new-in-svelte-october-2020.md
deleted file mode 100644
index 72a032de1b..0000000000
--- a/documentation/blog/2020-10-01-whats-new-in-svelte-october-2020.md
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: "What's new in Svelte: October 2020"
-description: New object methods, in-depth learning resources and tons of integration examples!
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Welcome to the first edition of our "What's new in Svelte" series! We'll try to make this a monthly blog post in which you'll find out about new features, bug fixes, and a showcase of Svelte projects from around the community.
-
-## New features
-
-1. `use:obj.method` allows functions defined within objects to be used within actions ([Example](https://svelte.dev/repl/c305722adb4a4545b27b198ea8ff9bde?version=3.27.0), **3.26.0**, warning removed in **3.27.0**)
-2. `_` is now supported as a "numerical separator", similar to a `.` or `,` ([Example](https://svelte.dev/repl/844c39e91d1248649fe54af839fab570?version=3.26.0), **3.26.0**)
-3. `import.meta` now works in template expressions ([Example](https://svelte.dev/repl/9630de41957a4c80a4fce264360a6bc7?version=3.26.0), **3.26.0**)
-4. CSS Selectors with `~` and `+` combinators are now supported ([Example](https://svelte.dev/repl/91ad9257d2d1430185a504a18cc60172?version=3.29.0), **3.27.0**, with a compiler fix in **3.29.0**)
-5. The `{#key}` block is now available to key arbitrary content on an expression. Whenever the expression changes, the contents inside the `{#key}` block will be destroyed and recreated. For an in-depth explanation and to find out how it's implemented, check out the [new blog post](https://lihautan.com/contributing-to-svelte-implement-key-block/) of Svelte Team member Tan Li Hau. ([More info](https://github.com/sveltejs/svelte/issues/1469), **3.29.0**)
-6. Slots can now be forwarded through child components! This used to only be possible by adding extra wrapper `<div>`s ([More info](https://github.com/sveltejs/svelte/issues/2079), **3.29.0**)
-7. When using TypeScript, you can now type the `createEventDispatcher` method:
-
-```svelte
-<script lang="ts">
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher<{
-		/**
-		 * you can also add docs
-		 */
-		checked: boolean; // Will translate to `CustomEvent<boolean>`
-		hello: string;
-	}>();
-
-	// ...
-</script>
-```
-
-This will make sure that you can invoke dispatch only with the specified event names and its types. The Svelte for VS Code extension was also updated to deal with this new feature. It will provide strong typings for these events as well as autocompletion and hover information.
-
-**New from Sapper!**
-Sapper 0.28.9 just came out. The highlights from it include much better support for CSP nonces, asset preload support for exported pages, and error details are now available in the `$page` store on error pages.
-
-In addition, Sapper's CSS handling has been rewritten over the course of recent releases in order to fix existing CSS handling bugs, refactor the CSS handling to occur entirely within a Rollup plugin, and remove the need internally to register CSS in the routing system. Congrats and thank you to the folks working on Sapper for all their solid work!
-
-## Impactful bug fixes
-
-- CSS compilation will no longer remove rules for the `open` attribute on `<details>` elements ([Example](https://svelte.dev/repl/ab4c0c177d1f4fab92f46eb8539cea9a?version=3.26.0), **3.26.0**)
-- `prettier-plugin-svelte` will do a better job now at dealing with whitespaces, especially around inline elements. It will also preserve formatting inside `<pre>` tags and will no longer format languages which are not supported by Prettier, like SASS, Pug or Stylus.
-
-## Coming up
-
-- [Svelte Summit](https://sveltesummit.com/), Svelte's second global online conference, is taking place on October 18! Sign up for free to get reminders and talk updates!
-
-For all the features and bugfixes see the CHANGELOG for [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [Sapper](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md).
-
----
-
-## Svelte Showcase
-
-- [This CustomMenu example](https://svelte.dev/repl/3a33725c3adb4f57b46b597f9dade0c1?version=3.25.0) demos how to replace the OS right-click menu
-- [GitHub Tetris](https://svelte.dev/repl/cc1eaa7c66964fedb5e70e3ecbbaa0e1?version=3.25.1) lets you play a Tetris-like game in a git commit history
-- [Who are my representatives?](https://whoaremyrepresentatives.us/) is a website built with Svelte to help US residents get more info on their congressional representatives
-- [Pick Palette](https://github.com/bluwy/pick-palette) is a color palette manager made with Svelte!
-
-### In-depth learning:
-
-- [Svelte 3 Up and Running](https://www.amazon.com/dp/B08D6T6BKS/ref=cm_sw_r_tw_dp_x_OQMtFb3GPQCB2) is a new book about building production-ready static web apps with Svelte 3
-- [Sapper Tutorial (Crash Course)](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gdr4Qhx83gBBcID-KMe-PQ) walks through the ins-and-outs of Sapper, the Svelte-powered application framework
-- [Svelte Society Day France](https://france.sveltesociety.dev/) happened September 27th featuring a wide variety of topics all in French! You can find the full recording [here](https://www.youtube.com/watch?v=aS1TQ155JK4).
-
-### Plug-and-play components:
-
-- [svelte-zoom](https://github.com/vaheqelyan/svelte-zoom) brings "nearly native" pan-and-zoom to images on desktop and mobile
-- [svelte-materialify](https://github.com/TheComputerM/svelte-materialify) is a Material component library for Svelte with over 50 components
-- [svelte-undoable](https://github.com/macfja/svelte-undoable) makes it easy to introduce undo and redo functionality using `bind:`
-- [This Tilt component](https://svelte.dev/repl/7b23ad9d2693424482cd411b0378b55b?version=3.24.1) implements a common UX pattern where the hovered element tilts to follow the mouse
-
-### Lots of examples of how use JS tech came out this month:
-
-- [Sapper with PostCSS and Tailwind](https://codechips.me/sapper-with-postcss-and-tailwind/)
-- [PrismJS (Code block syntax highlighting)](https://github.com/phptuts/Svelte-PrismJS)
-- [Filepond (Drag-and-drop file upload)](https://github.com/pqina/svelte-filepond)
-- [Ionic (UI Components)](https://github.com/Tommertom/svelte-ionic-app)
-- [Pell (WYSIWYG Editor)](https://github.com/Demonicious/svelte-pell/)
-- [Leaflet (Mapping)](https://github.com/anoram/leaflet-svelte)
-
-**Reminder**: There's a [Svelte integrations repo](https://github.com/sveltejs/integrations) that demonstrates ways to incorporate Svelte into your stack (and vice versa). If you've got questions on how to use a particular piece of tech with Svelte, you may find your answer there... and if you've gotten something to work with Svelte, consider contributing!
-
-For more amazing Svelte projects, check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)… and be sure to post your own!
-
-## See you next month!
-
-By the way, Svelte now has an [OpenCollective](https://opencollective.com/svelte)! All contributions and all expenses are published in our transparent public ledger. Learn who is donating, how much, where that money is going, submit expenses, get reimbursed and more!
diff --git a/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md b/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md
deleted file mode 100644
index d29859a473..0000000000
--- a/documentation/blog/2020-11-01-whats-new-in-svelte-november-2020.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: "What's new in Svelte: November 2020"
-description: Slot forwarding fixes, SvelteKit for faster local development, and more from Svelte Summit
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Welcome back to the "What's new in Svelte" series! This month, we're covering new features & bug fixes, last month's Svelte Summit and some stand-out sites and libraries...
-
-## New features & impactful bug fixes
-
-1. Destructuring Promises now works as expected by using the `{#await}` syntax
-   (**3.29.3**, [Example](https://svelte.dev/repl/3fd4e2cecfa14d629961478f1dac2445?version=3.29.3))
-2. Slot forwarding (released in 3.29.0) should no longer hang during compilation (**3.29.3**, [Example](https://svelte.dev/repl/29959e70103f4868a6525c0734934936?version=3.29.3))
-3. Better typings for the `get` function in `svelte/store` and on lifecycle hooks (**3.29.1**)
-
-**What's going on in Sapper?**
-
-Sapper got some new types in its `preload` function, which will make typing easier if you are using TypeScript. See the [Sapper docs](https://sapper.svelte.dev/docs#Typing_the_function) on how to use them. There also were fixes to `preload` links in exported sites. Route layouts got a few fixes too - including ensuring CSS is applied to nested route layouts. You can also better organize your files now that extensions with multiple dots are supported. (**0.28.10**)
-
-For all the features and bugfixes see the CHANGELOGs for [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [Sapper](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md).
-
-## [Svelte Summit](https://sveltesummit.com/) was Svelte-tacular!
-
-- Rich Harris demoed the possible future of Svelte development in a talk titled "Futuristic Web Development". The not-yet-public project is called SvelteKit (name may change) and will bring a first-class developer experience and more flexibility for build outputs. If you want to get the full sneak-peek, [check out the video](https://www.youtube.com/watch?v=qSfdtmcZ4d0).
-- 17 speakers made the best of the conference's virtual format... From floating heads to seamless demos, Svelte developers from every skill level will find something of interest in this year's [YouTube playlist](https://www.youtube.com/playlist?list=PL8bMgX1kyZThM1sbYCoWdTcpiYysJsSeu)
-
----
-
-## Community Showcase
-
-- [Svelte Lab](https://sveltelab.app/) showcases a variety of components, visualizations and interactions that can be achieved in Svelte. You can click into any component to see its source or edit it, using the site's built-in REPL
-- [svelte-electron-boilerplate](https://github.com/hjalmar/svelte-electron-boilerplate) is a fast way to get up and running with a Svelte app built in the desktop javascript framework, Electron
-- [React Hooks in Svelte](https://github.com/joshnuss/react-hooks-in-svelte) showcases examples of common React Hooks ported to Svelte.
-- [gurlic](https://gurlic.com/) is a social network and internet experiment that is super snappy thanks to Svelte
-- [Interference 2020](https://interference2020.org/) visualizes reported foreign interference in the 2020 U.S. elections. You can learn more about how it was built in [YYY's talk at Svelte Summit]()
-- [jitsi-svelte](https://github.com/relm-us/jitsi-svelte) lets you easily create your own custom Jitsi client by providing out-of-the-box components built with Svelte
-- [Ellx](https://ellx.io/) is part spreadsheet, part notebook and part IDE. It's super smooth thanks to Svelte 😎
-- [This New Zealand news site](https://www.nzherald.co.nz/nz/election-2020-latest-results-party-vote-electorate-vote-and-full-data/5CFVO4ENKNQDE3SICRRNPU5GZM/) breaks down the results of the 2020 Parliamentary elections using Svelte
-- [Budibase](https://github.com/Budibase/budibase) is a no-code app builder, powered by Svelte
-- [Svelt-yjs](https://github.com/relm-us/svelt-yjs) combines the collaborative, local-first technology of Yjs with the power of Svelte to enable multiple users across the internet to stay in sync.
-- [tabler-icons-svelte](https://github.com/benflap/tabler-icons-svelte) is a Svelte wrapper for over 850 free MIT-licensed high-quality SVG icons for you to use in your web projects.
-
-## See you next month!
-
-Got an idea for something to add to the Showcase? Want to get involved more with Svelte? We're always looking for maintainers, contributors and fanatics... Check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs) to get involved!
diff --git a/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md b/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md
deleted file mode 100644
index a89181fc6a..0000000000
--- a/documentation/blog/2020-11-05-whats-the-deal-with-sveltekit.md
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: What's the deal with SvelteKit?
-description: We're rethinking how to build Svelte apps. Here's what you need to know
-author: Rich Harris
-authorURL: https://twitter.com/rich_harris
----
-
-<aside><p>If you <em>didn't</em> attend Svelte Summit, you can catch up on the <a href="https://www.youtube.com/c/SvelteSociety/videos">Svelte Society YouTube page</a></p></aside>
-
-If you attended [Svelte Summit](https://sveltesummit.com/) last month you may have seen my talk, Futuristic Web Development, in which I finally tackled one of the most frequently asked questions about Svelte: when will Sapper reach version 1.0?
-
-The answer: never.
-
-This was slightly tongue-in-cheek — as the talk explains, it's really more of a rewrite of Sapper coupled with a rebrand — but it raised a lot of new questions from the community, and it's time we offered a bit more clarity on what you can expect from Sapper's successor, SvelteKit.
-
-<div class="max">
-<figure style="max-width: 960px; margin: 0 auto">
-<div style="height: 0; padding: 0 0 57.1% 0; position: relative; margin: 0 auto;">
-	<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0; margin: 0;" src="https://www.youtube-nocookie.com/embed/qSfdtmcZ4d0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-</div>
-
-<figcaption>'Futuristic Web Development' from <a href="https://sveltesummit.com/">Svelte Summit</a></figcaption>
-</figure>
-</div>
-
-## What's Sapper?
-
-[Sapper](https://sapper.svelte.dev) is an _app framework_ (or 'metaframework') built on top of Svelte (which is a _component_ framework). Its job is to make it easy to build Svelte apps with all the modern best practices like server-side rendering (SSR) and code-splitting, and to provide a project structure that makes development productive and fun. It uses _filesystem-based routing_ (as popularised by [Next](https://nextjs.org/) and adopted by many other frameworks, albeit with some enhancements) — your project's file structure mirrors the structure of the app itself.
-
-While the Svelte homepage and documentation encourages you to [degit](https://github.com/Rich-Harris/degit) the [sveltejs/template](https://github.com/sveltejs/template) repo to start building an app, Sapper has long been our recommended way to build apps; this very blog post is (at the time of writing!) rendered with Sapper.
-
-## Why are we migrating to something new?
-
-Firstly, the distinction between [sveltejs/template](https://github.com/sveltejs/template) and [sveltejs/sapper-template](https://github.com/sveltejs/sapper-template) is confusing, particularly to newcomers to Svelte. Having a single recommended way to start building apps with Svelte will bring enormous benefits: we simplify onboarding, reduce the maintenance and support burden, and can potentially begin to explore the new possibilities that are unlocked by having a predictable project structure. (This last part is deliberately vague because it will take time to fully understand what those possibilities are.)
-
-Aside from all that, we've been tempted by the thought of rewriting Sapper for a while. This is partly because the codebase has become a little unkempt over the years ([Sapper started in 2017](/blog/sapper-towards-the-ideal-web-app-framework)), but mostly because the web has changed a lot recently, and it's time to rethink some of our foundational assumptions.
-
-## How is this new thing different?
-
-The first of those foundational assumptions is that you need to use a module bundler like [webpack](https://webpack.js.org/) or [Rollup](https://rollupjs.org/) to build apps. These tools trace the dependency graph of your application, analysing and transforming code along the way (turning Svelte components to JS modules, for example), in order to create bundles of code that can run anywhere. As the original creator of Rollup, I can attest that it is a surprisingly complex problem with fiendish edge cases.
-
-You certainly needed a bundler several years ago, because browsers didn't natively support the `import` keyword, but it's much less true today. Right now, we're seeing the rise of the _unbundled development_ workflow, which is radically simpler: instead of eagerly bundling your app, a dev server can serve modules (converted to JavaScript, if necessary) _on-demand_, meaning startup is essentially instantaneous however large your app becomes.
-
-[Snowpack](https://www.snowpack.dev/) is at the vanguard of this movement, and it's what powers SvelteKit. It's astonishingly fast, and has a beautiful development experience (hot module reloading, error overlays and so on), and we've been working closely with the Snowpack team on features like SSR. The hot module reloading is particularly revelatory if you're used to using Sapper with Rollup (which has never had first-class HMR support owing to its architecture, which prioritises the most efficient output).
-
-That's not to say we're abandoning bundlers altogether. It's still essential to optimise your app for production, and SvelteKit uses Rollup to make your apps as fast and lean as they possibly can be (which includes things like extracting styles into static `.css` files).
-
-The other foundational assumption is that a server-rendered app needs, well, a server. Sapper effectively has two modes — `sapper build`, which creates a standalone app that has to run on a Node server, and `sapper export` which bakes your app out as a collection of static files suitable for hosting on services like GitHub Pages.
-
-Static files can go pretty much anywhere, but running a Node server (and monitoring/scaling it etc) is less straightforward. Nowadays we're witnessing a shift towards _serverless platforms_, in which you as the app author don't need to think about the server your code is running on, with all the attendant complexity. You can get Sapper apps running on serverless platforms, thanks to things like [vercel-sapper](https://github.com/thgh/vercel-sapper), but it's certainly not what you'd call idiomatic.
-
-<aside><p>It'll still be possible to create both Node apps and fully pre-rendered (aka exported) sites</a></p></aside>
-
-SvelteKit fully embraces the serverless paradigm, and will launch with support for all the major serverless providers, with an 'adapter' API for targeting any platforms that we don't officially cater to. In addition, we'll be able to do partial pre-rendering, which means that static pages can be generated at build time but dynamic ones get rendered on-demand.
-
-## When can I start using it?
-
-If you're feeling brave, you can start right now:
-
-```bash
-npm init svelte@next
-```
-
-This will scaffold a new project and install the `@sveltejs/kit` CLI, which provides the tools for developing and building an app.
-
-We don't recommend it though! There are no docs, and we won't be able to offer any form of support. It's also likely to break often.
-
-The work is being done in a private monorepo while we're still in exploration mode. Our plan is to get a public beta ready and announce it here once we've closed a few issues — the repo itself will remain private at that time, but we'll create a place to collect feedback from the YOLO crowd. After that, we'll work towards a 1.0 release which will involve opening the repo up.
-
-I'm not going to make any firm promises about timings, because I don't like to break promises. But I _think_ we're talking about weeks rather than months.
-
-## What if I don't want to use SvelteKit?
-
-You won't have to — it will always be possible to use Svelte as a standalone package or via a bundler integration like [rollup-plugin-svelte](https://github.com/sveltejs/rollup-plugin-svelte). We think it's essential that you can bend Svelte to fit your workflow, however esoteric, and use third-party app frameworks like [Elder.js](https://github.com/Elderjs/elderjs), [Routify](https://routify.dev/), [Plenti](https://plenti.co/), [Crown](https://crownframework.com/), [JungleJS](https://www.junglejs.org/) and others.
-
-## TypeScript?
-
-Don't worry, we won't launch without full TypeScript support.
-
-## How can I migrate my existing Sapper apps?
-
-For the most part, it should be relatively straightforward to migrate a Sapper codebase.
-
-There are some unavoidable changes (being able to run on serverless platforms means we need to replace custom `server.js` files and `(req, res) => {...}` functions with more portable equivalents), and we're taking the opportunity to fix a few design flaws, but on the whole a SvelteKit app will feel very familiar to Sapper users.
-
-Detailed migration guides will accompany the 1.0 launch.
-
-## How can I contribute?
-
-Keep your eyes peeled for announcements about when we'll launch the public beta and open up the repo. (Also, blog post TODO but I would be remiss if I didn't mention that we now have an [OpenCollective](https://opencollective.com/svelte) where you can contribute financially to the project if it's been valuable to you. Many, many thanks to those of you who already have.)
-
-## Where can I learn more?
-
-Follow [@sveltejs](https://twitter.com/sveltejs) and [@SvelteSociety](https://twitter.com/SvelteSociety) on Twitter, and visit [svelte.dev/chat](https://svelte.dev/chat). You should also subscribe to [Svelte Radio](https://www.svelteradio.com/), where Kevin and his co-hosts will grill me about this project on an upcoming episode (and between now and next week when we record it, [reply to this Twitter thread](https://twitter.com/Rich_Harris/status/1323376048571121665) with your additional questions).
diff --git a/documentation/blog/2020-12-01-whats-new-in-svelte-december-2020.md b/documentation/blog/2020-12-01-whats-new-in-svelte-december-2020.md
deleted file mode 100644
index 4e0f56e449..0000000000
--- a/documentation/blog/2020-12-01-whats-new-in-svelte-december-2020.md
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: "What's new in Svelte: December 2020"
-description: Better tooling, export maps and improvements to slots and context
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-It's the last "What's new in Svelte" of the year and there's lots to celebrate! This month's coverage includes updates from `rollup-plugin-svelte`, `Sapper` and `SvelteKit` and a bunch of showcases from the Svelte community!
-
-## New features & impactful bug fixes
-
-1. `$$props`, `$$restProps`, and `$$slots` are all now supported in custom web components (**3.29.5**, [Example](https://svelte.dev/repl/ad8e6f39cd20403dacd1be84d71e498d?version=3.29.5)) and `slot` components now support spread props: `<slot {...foo} />` (**3.30.0**)
-2. A new `hasContext` lifecycle function makes it easy to check whether a `key` has been set in the context of a parent component (**3.30.0** & **3.30.1**, [Docs](https://svelte.dev/docs#run-time-svelte-hascontext))
-3. There is now a new `SvelteComponentTyped` class which makes it easier to add strongly typed components that extend base Svelte components. Component library and framework authors rejoice! An example: `export class YourComponent extends SvelteComponentTyped<{aProp: boolean}, {click: MouseEvent}, {default: {aSlot: string}}> {}` (**3.31.0**, [RFC](https://github.com/sveltejs/rfcs/pull/37))
-4. Transitions within `{:else}` blocks should now complete successfully (**3.29.5**, [Example](https://svelte.dev/repl/49cef205e5da459594ef2eafcbd41593?version=3.29.5))
-5. Svelte now includes an export map, which explicitly states which files can be imported from its npm package (**3.29.5** with some fixes in **3.29.6**, **3.29.7** and **3.30.0**)
-6. `rollup-plugin-svelte` had a new [7.0.0 release](https://github.com/sveltejs/rollup-plugin-svelte/blob/master/CHANGELOG.md). The biggest change is that the `css` option was removed. Users who were using that option should add another plugin like `rollup-plugin-css-only` as demonstrated [in the template](https://github.com/sveltejs/template/blob/5b1135c286f7a649daa99825a077586655051649/rollup.config.js#L48)
-
-## What's going on in Sapper?
-
-Lots of new TypeScript definition improvements to make editing Sapper apps even easier! CSS for dynamic imports also should now work in `client.js` files. (Unreleased)
-
-## What's the deal with SvelteKit?
-
-We're glad you asked! If you didn't catch Rich's blog post from early last month, [you can find it here](https://svelte.dev/blog/whats-the-deal-with-sveltekit)!
-
-For all the features and bugfixes see the CHANGELOGs for [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [Sapper](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [narration.studio](https://narration.studio/) (Chrome Only) is an automatic in-browser audio recording & editing platform for voice over narration.
-- [Vippet](https://vippet.netlify.app/) is a video recording and editing tool for the browser.
-- [Pattern Monster](https://pattern.monster/) is a simple online pattern generator to create repeatable SVG patterns.
-- [Plant-based diets](https://planetbaseddiets.panda.org/) is a website from the World Wildlife Foundation (WWF) built with Svelte.
-- [johnells.se](https://www.johnells.se/) is a Swedish fashion e-commerce site, built with [Crown](https://crownframework.com/) - a Svelte-powered framework.
-- [sentence-length](https://sentence-length.netlify.app/) is a learning and analysis tool to show how some authors play with different lengths, while others stick with one.
-- [svelte-presenter](https://github.com/stephane-vanraes/svelte-presenter) lets you quickly make good looking presentations using Svelte and mdsvex.
-
-**Demos**
-
-- [u/loopcake got SSR working in Java Spring Boot](https://www.reddit.com/r/sveltejs/comments/jkh5up/svelte_ssr_but_its_java_spring_boot_and_its_native/) for all the Java shops out there looking to render Svelte server-side.
-- [svelte-liquid-swipe](https://github.com/tncrazvan/svelte-liquid-swipe) shows off a fancy interaction pattern using svg paths.
-- [Crossfade Link Animation](https://svelte.dev/repl/7f68e148caf04b2787bb6f296208f870?version=3.29.7) demonstrates how to animate between navigation links using a crossfade (made by Blu, from the Discord community)
-- [Clip-Path Transitions](https://svelte.dev/repl/b5ad281ae8024b629b545c70c9e8764d?version=3.29.7) showcases how to use clip paths and custom transitions to create magical in-and-out transitions (made by Faber, from the Discord community)
-
-**Learning Resources**
-
-- [lihautan](https://www.youtube.com/channel/UCbmC3HP3FaAFdcZkui8YoMQ/featured) has been making easy-to-follow videos to share his in-depth knowledge of Svelte.
-- [Lessons From Building a Static Site Generator](https://nicholasreese.com/lessons-from-building-a-static-site-generator/) shares the backstory and thinking behind Elder.js - and the design decision made along the way.
-- [Svelte Tutorial and Projects Course ](https://www.udemy.com/course/svelte-tutorial-and-projects-course/) is a udemy course by John Smilga where students learn Svelte.js by building interesting projects.
-- [Building Pastebin on IPFS - with FastAPI, Svelte, and IPFS](https://amalshaji.wtf/building-pastebin-on-ipfs-with-fastapi-svelte-and-ipfs) explains how to make a distributed pastebin-like application.
-
-**Components, Libraries & Tools**
-
-- [svelte-crossword](https://russellgoldenberg.github.io/svelte-crossword/) is a customizable crossword puzzle component for Svelte.
-- [svelte-cloudinary](https://github.com/cupcakearmy/svelte-cloudinary) makes it easy to integrate Cloudinary with Svelte (including TypeScript and SSR support)
-- [Svelte Nova](https://extensions.panic.com/extensions/sb.lao/sb.lao.svelte-nova/) extends the new Nova editor to support Svelte
-- [saos](https://github.com/shiryel/saos) is a small svelte component to animate your elements on scroll.
-- [Svelte-nStore](https://github.com/lacikawiz/svelte-nStore) is a general purpose store replacement that fulfills the Svelte store contract and adds getter and calculation features.
-- [svelte-slimscroll](https://github.com/MelihAltintas/svelte-slimscroll) is a Svelte Action that transforms any div into a scrollable area with a nice scrollbar.
-- [svelte-typewriter](https://github.com/henriquehbr/svelte-typewriter) is a simple and reusable typewriter effect for your Svelte applications
-- [svelte-store-router](https://github.com/zyxd/svelte-store-router) is a store-based router for Svelte that suggests that routing is just another global state and History API changes are just an optional side-effects of this state.
-- [Routify](https://routify.dev/blog/routify-2-released) just released version 2 of its Svelte router.
-- [svelte-error-boundary](https://www.npmjs.com/package/@crownframework/svelte-error-boundary) provides a simple error boundary component for Svelte that can be can be used with both DOM and SSR targets.
-- [svelte2dts](https://www.npmjs.com/package/svelte2dts) generates d.ts files from svelte files, creating truly shareable and well typed components.
-
-## See you next month!
-
-Got an idea for something to add to the Showcase? Want to get involved more with Svelte? We're always looking for maintainers, contributors and fanatics... Check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs) to get involved!
-
-That's all for the year, folks! See you in January 😎
diff --git a/documentation/blog/2021-01-01-whats-new-in-svelte-january-2021.md b/documentation/blog/2021-01-01-whats-new-in-svelte-january-2021.md
deleted file mode 100644
index 4a5ea4eddc..0000000000
--- a/documentation/blog/2021-01-01-whats-new-in-svelte-january-2021.md
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: "What's new in Svelte: January 2021"
-description: A Svelte-packed showcase to kick-off the new year!
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Happy new year from Svelte! In the last month we made progress on Sapper's upcoming release, fine-tuned our `SvelteComponent` typings, and have seen some amazing apps, sites, and libraries coming out in the showcase.
-
-## What's changed in Svelte?
-
-A new minor release replaces the `SvelteComponent` class with a `SvelteComponentTyped` class. This renaming should help with backwards compatibility. We've updated [last month's blog post](https://svelte.dev/blog/whats-new-in-svelte-december-2020) to avoid any confusion with the name change.
-
-If you're using `SvelteComponent` or the new `SvelteComponentTyped` in your project or library, let us know what you're using it for and we'll add it to the showcase!
-
-## What's going on in Sapper?
-
-More quality of life features are landing in the upcoming release every day. `0.29.0` will include new TypeScript definitions, fixes to scroll tracking and prefetching behavior, and improvements to the runtime router to support encoded query parameters.
-
-If you're upgrading from 0.28.x, check out [the migration guide](https://sapper.svelte.dev/migrating/#0_28_to_0_29) for steps on updating to Sapper 0.29.
-
-## Is SvelteKit ready yet?
-
-To avoid too much churn during development, SvelteKit is still being worked on in a private repo. There will be an announcement on the Discord, blog and Twitter when it's ready for a larger group of users and contributors.
-
-In the meantime, you can explore the current build by running `npm init svelte@next` from your command line.
-
-As cautioned in _[What's the deal with SvelteKit?](https://svelte.dev/blog/whats-the-deal-with-sveltekit)_, there are no docs or support available yet... So use at your own risk / for your own enjoyment!
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [manitu.me](https://manitu.me/) is a background sound / pomodoro timer for focus and relaxation
-- [Answer Socrates](https://answersocrates.com/) helps you find trending questions on the internet so that you can write the most relevant blog post, tweet, or billboard
-- [multris](https://multris.s1h.org/) is a multiplayer Tetris game. You can read about its development [here](https://blog.s1h.org/svelte-multiplayer-game/)
-- [weather-ab](https://github.com/ganochenkodg/weather-ab) compares the archive of weather in different cities of the world. Indispensable for people thinking about migration
-- [Game Nibs](https://gamenibs.com/) is a platform for gamers to find and share concise bite-sized bits of gaming advice, tips, tricks, screenshots, builds, and much more
-- [Ora](https://github.com/cupcakearmy/ora) is an open source website tracking and limiting tool for Chrome and Firefox
-- [vscode-dms](https://github.com/techsyndicate/vscode-dms) is a group direct messaging chat app for VS Code
-- [Zero.2](https://zero.oleksandrdemian.tech/) is a math-based challenge game where you try to get to zero as quickly as possible
-- [Octave Compass](https://octavecompass.com/2741) is a chord table and scale explorer for many popular musical scales
-- [Infinite Walking Bass Generator 2](https://github.com/elialbert/infinitewalkingbass2) is an online music player that generates a unique walking bass line
-- [ListenAddict](https://www.listenaddict.com/) is a site that notifies you whenever a person has a new talk/interview on podcast
-
-**Demos, Libraries & Components**
-
-- [svelte-tiny-virtual-list](https://github.com/Skayo/svelte-tiny-virtual-list) speeds up long lists by only rendering visible items
-- [svelte-query](https://github.com/TanStack/svelte-query) is a collection of helpful hooks for managing, caching and syncing asynchronous and remote data
-- [svelte-previous](https://github.com/bryanmylee/svelte-previous) is a svelte store to remember previous values - helpful for transitions or a quick undo stack
-- [Let's Build a Confetti Cannon](https://varun.ca/confetti/) explains how to build a particle system and integrate a Canvas based animation into a larger application
-- [svelte-micro](https://github.com/ayndqy/svelte-micro) is a one-component router
-- [svelte-standalone-router](https://github.com/hjalmar/svelte-standalone-router) is a standalone router with an API based on [standalone-router](https://github.com/hjalmar/standalone-router)
-- [svelte-datepicker](https://github.com/beyonk-adventures/svelte-datepicker) is a datepicker component with variations for time selection, date ranges and responsive themes
-- [svelte-slimscroll](https://github.com/MelihAltintas/svelte-slimscroll) is a action for Svelte.js, which can transforms any div into a scrollable area with a nice scrollbar.
-- [Svelte Zoomable](https://svelte.dev/repl/58dfe87756ee4db897c281b52fdef7b7?version=3.31.0) is a custom transition with a nice zoom effect
-
-**Have a component you'd like to share?** Check out the [Components](https://sveltesociety.dev/components) page on the Svelte Society site. You can contribute by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-**Learning Resources**
-
-- [Using Svelte to create a scroll video effect](https://blog.koenvangilst.nl/tutorial-svelte-scroll-video/) showcases how the `bind` command can be used to create a cool scroll video effect with very little code
-- [How to make a flappybird game in svelte and typescript](https://www.youtube.com/watch?v=nhrYBoVI8pQ) is a video tutorial including docs and code for reference
-- [Accessible Svelte Transition](https://www.youtube.com/watch?v=QK_QuRL7nSo&feature=youtu.be) walks through `prefers-reduced-motion` to make svelte transitions more accessible
-- [Svelte's module scripts explained](https://codechips.me/svelte-module-scripts-explained/) is a great introduction to the module context, a common Sapper pattern
-- [Awesome Svelte](https://github.com/TheComputerM/awesome-svelte#readme) is a curated list of Svelte resources
-- [.NET Core and Svelte](https://dev.to/cainux/net-core-and-svelte-f8o) explains how to get Svelte up and running with .NET Core
-- [A la découverte de Svelte JS](https://www.youtube.com/watch?v=SLpx1Y8e1ek&list=PLff5I1miao9ZEUhpqkrOx7k8RGAZt-nm9) is a svelte tutorial series in French!
-- [Svelte for React Developers](https://soshace.com/svelte-for-react-developers/) explains Svelte's core concepts to folks who are used to React
-- [Building a Svelte Static Website with Smooth Page Transitions](https://www.youtube.com/watch?v=dvPfmcGtmrI&feature=emb_title) shows how to build a static website with Svelte and add smooth page transitions using Three.js and GSAP.
-- [Using Apollo Client in Sapper](https://bjornlu.com/blog/using-apollo-client-in-sapper/) explains the "simplest" solutions to integrate the Apollo query client into Sapper
-- [Reactive web apps with Crystal + Svelte](https://www.youtube.com/watch?v=i1xjLd6z7BU) explores how to build full-stack, server-rendered Svelte apps with a [Crystal](https://crystal-lang.org) backend
-
-**Related Projects**
-
-- [Snowpack's v3 release candidate](https://www.snowpack.dev/posts/2020-12-03-snowpack-3-release-candidate) is out now in preparation for a January 6 release date. Check out the [Getting Started with Svelte](https://www.snowpack.dev/tutorials/svelte) for more info on how to use Snowpack.
-- [Uppy](https://uppy.io/blog/2020/12/1.24/), the open source file uploader, announced Svelte support in its new version 1.24
-
-## See you next month!
-
-Want to add your work to the Showcase? Want to contribute to Svelte? Check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs) to get involved!
diff --git a/documentation/blog/2021-02-01-whats-new-in-svelte-february-2021.md b/documentation/blog/2021-02-01-whats-new-in-svelte-february-2021.md
deleted file mode 100644
index e85b274d96..0000000000
--- a/documentation/blog/2021-02-01-whats-new-in-svelte-february-2021.md
+++ /dev/null
@@ -1,85 +0,0 @@
----
-title: "What's new in Svelte: February 2021"
-description: Integrations and improvements at lightning speed...
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-With the shortest month of the year coming up, Svelte maintainers and community members alike have been busy this last month – from big changes in `svelte-loader`, `prettier-plugin-svelte`, `rollup-plugin-svelte`, and `language-tools` to steady progress in Sapper and `svelte-preprocess`. Meanwhile, lots of folks have been busy integrating Svelte with other popular frameworks.
-
-## New compiler features
-
-- Aria roles from the [WAI-ARIA Graphics Module](https://www.w3.org/TR/graphics-aria-1.0/#role_definitions) are now recognized as valid aria roles in Svelte components (**3.31.1**)
-- Compiler warnings for the common React attributes, `className` and `htmlFor`, now make it easier to port React components to Svelte (**3.31.1**)
-
-Have a suggestion for a compiler feature or want to help implement new features/bug fixes? Check out the ["triage: good first issue" tag for Svelte](https://github.com/sveltejs/svelte/issues?q=is%3Aopen+is%3Aissue+label%3A%22triage%3A+good+first+issue%22)
-
-## New bits in language-tools
-
-- User disabled auto import suggestions no longer show in VS Code (**103.0.0**)
-- Renaming a variable is now safer with smart additions of a prefix/suffix to renamed variables (**104.0.0**)
-- Semantic (token) highlighting for TypeScript users lets theme makers apply semantic styling in their themes, if they support it (**104.0.0**)
-- "Extract Component" has been added to the context menu - allowing you to extract components out of files without having to open the command window to type "Svelte: Extract Component" (**104.0.0**)
-- The VS Code extension now listens to JavaScript/TypeScript file changes - you no longer need to save the files for the changes to be noticed (**104.1.0**)
-
-For the complete list of changes, check out the language-tools [Releases page](https://github.com/sveltejs/language-tools/releases).
-
-A great way to try the language tools is to download the [Svelte Extension for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode). This extension provides syntax highlighting and rich intellisense for Svelte components in VS Code, using the svelte language server. Check your editor's extension sources to see if there's a Svelte plugin for your IDE or build your own (see [coc-svelte](https://github.com/coc-extensions/coc-svelte) for example)!
-
-## Big improvements across the Svelte ecosystem
-
-- [svelte-loader](https://github.com/sveltejs/svelte-loader) released a major version, 3.0.0 - featuring Webpack 5 and Node 14 support, better hot reloading, and new `compilerOptions` to match `rollup-plugin-svelte`. Breaking changes include dropping Svelte 2 and Node 8 support. [More info in the changelog](https://github.com/sveltejs/svelte-loader/blob/master/CHANGELOG.md)
-- [rollup-plugin-svelte](https://github.com/sveltejs/rollup-plugin-svelte) is now at version 7.x - with support for relative filenames, better handling of sourcemaps, and consistent `compilerOptions`. Be sure to [checkout the changelog](https://github.com/sveltejs/rollup-plugin-svelte/blob/master/CHANGELOG.md) for breaking changes when upgrading
-- [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess) iterated through some 4.6.x releases this month to improve postcss and scss handling and fix sourcemap transformation for typescript users. [More info in the changelog](https://github.com/sveltejs/svelte-preprocess/blob/main/CHANGELOG.md)
-- [Sapper](https://github.com/sveltejs/sapper) got some improvements in scroll tracking and handling encoding query parameters. Dynamic imports also now work as expected in browsers that don't support ES modules. These changes from 0.29.0 and a step-by-step migration guide can be found [in the changelog](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md)
-- [prettier-plugin-svelte](https://github.com/sveltejs/prettier-plugin-svelte) version 2 was released. It received an overhaul and comes with a rewrite of the HTML formatting. The output is now much more in line with how standard Prettier formats HTML. Better defaults for `svelteBracketNewLine` and `options-scripts-markup-styles` should now match how the majority of users like to order the code blocks. Additionally, Prettier's `htmlWhitespaceSensitivity` setting is now supported. [More info in the changelog](https://github.com/sveltejs/prettier-plugin-svelte/blob/master/CHANGELOG.md)
-
-New changes to the Svelte Society website include [a new cheat sheet](https://sveltesociety.dev/cheatsheet) for easy access to useful code patterns and some smaller visual fixes across the site. **Want to help make the Svelte Society website ready for prime time**? [Checkout the GitHub repo](https://github.com/svelte-society/sveltesociety.dev) to get started!
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [The official German vaccination dashboard](https://impfdashboard.de/) tracks the current COVID vaccine rollout and features some well-done dataviz.
-- [La neuva era de la educatión conectada](https://elfuturoesapasionante.vodafone.es/especiales/educacion-conectada/) is a Vodaphone site that highlights the ways that technology and COVID-19 has changed the education landscape
-- [sho.rest](https://github.com/Melonai/shorest) is a self-hostable url shortener
-- [night.fm](https://night.fm/) is a cyberpunk-themed radio station
-
-**Demos, Libraries & Components**
-
-- [Svelte Reactive Debugger](https://addons.mozilla.org/en-US/firefox/addon/svelte-reactive-debugger/) is a way to monitor Svelte reactive statements in Firefox devtools
-- [svelte-actions](https://github.com/sw-yx/svelte-actions) is a set of prototype Svelte actions for inclusion into official actions in future. [See RFC](https://github.com/sveltejs/rfcs/pull/24) and [Discuss High Level Policy](https://github.com/sw-yx/svelte-actions/issues/7).
-- [This css grid gallery](https://svelte.dev/repl/3a1b7fae13b242fe9cd4a4f7aa092fa4?version=3.31.2) made by @joja (in the Svelte Discord) features grid transitions based on a user's mouse position
-- [Patchcab](https://github.com/spectrome/patchcab) is a modular Eurorack style synthesizer made with Web Audio.
-- [svelte-knob](https://github.com/MelihAltintas/svelte-knob) is a knob control to help with speedometer-style visualization
-- [descent-ripple](https://github.com/micha-lmxt/descent-ripple) is a highly customizable javascript ripple animation for buttons
-- [makeItSnow](https://github.com/florianlouvet/make-it-snow/blob/main/makeItSnowAction.js) is a Svelte action made by @MrPoule (in the Svelte Discord) that can be used to add ❄️snow❄️ to any component ([Demo](https://svelte.dev/repl/de5223beb45540a5a11c9bd7b318304f?version=3.31.2))
-- [svelte-video-player](https://github.com/meigo/svelte-video-player) is a customizable `VideoPlayer` component
-- [svelte-readonly](https://github.com/Crisfole/svelte-readonly) is a very small store that exposes only a readable interface.
-
-**New Integrations & Starters**
-
-- [svelte-derver-starter](https://github.com/AlexxNB/svelte-derver-starter) is a starter for baking fullstack application with the client based on Svelte and server side powered by Derver.
-- [eleventy-plugin-embed-svelte](https://github.com/shalomscott/eleventy-plugin-embed-svelte) makes it easy to embed Svelte components into an 11ty site.
-- [svelte-tailwind-extension-boilerplate](https://github.com/kyrelldixon/svelte-tailwind-extension-boilerplate) is a good foundation for a Chrome extension using either JavaScript or TypeScript, Svelte for the frontend, Tailwind CSS for styling, Jest for testing, and Rollup as the build system.
-- [snowpack-ui](https://github.com/rajasegar/snowpack-ui) lets you run & manage Snowpack projects from the browser instead of the terminal
-- [Svelte for Appwrite](https://dev.to/torstendittmann/svelte-for-appwrite-4fkg) explains how to integrate with Appwrite, a self-hosted Firebase alternative [GitHub Repo](https://github.com/appwrite/sdk-for-svelte)
-- [here-maps-svelte](https://github.com/peopledrivemecrazy/here-maps-svelte) makes it easy to include HERE maps in a Svelte app
-- [p5-svelte](https://github.com/tonyketcham/p5-svelte) is an absolutely dead simple way of tossing the creative coding/sketching tool, p5, into a project
-- [svelte-windicss-preprocess](https://github.com/voorjaar/svelte-windicss-preprocess) is a Svelte preprocessor to compile tailwindcss at build time based on windicss compiler
-- [MitzaCoder/svelte-boilerplate](https://github.com/MitzaCoder/svelte-boilerplate) features configurations for TypeScript, TailwindCSS, IE11 compatibility (with Babel) and lazy loaded modules.
-
-**Want to share your Svelte Component with the world?** Head over to the [Components](https://sveltesociety.dev/components) page on the Svelte Society site. You can contribute by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-**Learning Resources**
-
-- [lihautan's Svelte Actions Playlist](https://www.youtube.com/watch?v=ciaMT_MswzE&list=PLoKaNN3BjQX3Gl14MBygFf8buPIw9pAeK) teaches how actions work and how they can help solve common problems when developing Svelte applications
-- [One-click Portfolio/Personal blog generator from dev.to API ](https://dev.to/shriji/one-click-portfolio-personal-blog-generator-from-dev-to-api-3apb) walks through creating a Sapper site that also fetches your articles from DEV.to using the API
-- [How to Code a VS Code Extension](https://www.youtube.com/watch?v=a5DX5pQ9p5M) features Svelte as a way to render a custom UI within VS Code
-- [This YouTube series on Plenti](https://www.youtube.com/watch?v=wyNC7R_VVyQ&list=PLbWvcwWtuDm12y3Hye6oKDwI2gAS0ccHW) walks through the new static site generator in detail
-
-## See you next month!
-
-Want to add your work to the Showcase? Want to contribute to Svelte? Check out the [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs) to get involved!
diff --git a/documentation/blog/2021-03-01-whats-new-in-svelte-march-2021.md b/documentation/blog/2021-03-01-whats-new-in-svelte-march-2021.md
deleted file mode 100644
index dea4d292cd..0000000000
--- a/documentation/blog/2021-03-01-whats-new-in-svelte-march-2021.md
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: "What's new in Svelte: March 2021"
-description: Call for Svelte Summit Speakers! Improved SSR, non-HTML5 compilation targets, and ESLint TypeScript support
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Lots to cover this month with releases from across the Svelte ecosystem. Most importantly, Svelte Summit Spring 2021 has an [Open Call for Speakers](https://sessionize.com/svelte-summit-spring-2021). **The deadline is March 14** so if you have an idea for a talk, submit it now!
-
-Let's dive into the news 🐬
-
-## What's new in `sveltejs/svelte`
-
-- SSR store handling has been reworked to subscribe and unsubscribe as in DOM mode. SSR stores should work much more consistently now (**3.31.2**, see [custom stores](https://svelte.dev/examples/custom-stores) and [Server-side component API ](https://svelte.dev/docs#run-time-server-side-component-api))
-- Multiple instances of the same action are now allowed on an element (**3.32.0**, [example](https://svelte.dev/repl/01a14375951749dab9579cb6860eccde?version=3.32.0))
-- The new `foreign` namespace should make it easier for alternative compile targets (like Svelte Native and SvelteGUI) by disabling certain HTML5-specific behaviour and checks (**3.32.0**, [more info](https://github.com/sveltejs/svelte/pull/5652))
-- Support for inline comment sourcemaps in code from preprocessors (**3.32.0**)
-- Destructured defaults are now allowed to refer to other variables (**3.33.0**, [example](https://svelte.dev/repl/0ee7227e1b45465b9b47d7a5ae2d1252?version=3.33.0))
-- Custom elements will now call `onMount` functions when connecting and clean up when disconnecting (**3.33.0**, checkout [this PR](https://github.com/sveltejs/svelte/pull/4522) for an interesting conversation on how folks are using Svelte with Web Components)
-- A `cssHash` option has been added to the compiler options to control the classname used for CSS scoping (**3.34.0**, [docs](https://svelte.dev/docs#compile-time-svelte-compile))
-- Continued improvement to TypeScript definitions
-
-For a complete list of changes, including bug fixes and links to PRs, check out [the CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md)
-
-## New from `sveltejs/language-tools`
-
-- For language server clients that don't support `didChangeWatchedFiles`, a fallback file watcher will be used instead
-- New highlighting rules for store accessors and element directives (like `bind:` and `class:`)
-- HTML tags can now be renamed together
-- Mustache tags parsing is now more robust and will provide better intellisense in more situations
-
-Haven't tried the language-tools yet? Check out [Svelte Extension for VS Code](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode) or find a plugin for your favorite IDE!
-
-## Other changes from `sveltejs/*`
-
-- [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3) now supports TypeScript as of 3.1.0
-- [prettier-plugin-svelte](https://github.com/sveltejs/prettier-plugin-svelte/) released a number of minor versions to address whitespace and comment trimming issues.
-- [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess/) bug fixes this month include fixes to postcss transformations and support for both v2 and v3 of `postcss-load-config`
-- [sapper](https://github.com/sveltejs/sapper/)'s 0.29.1 release fixes some bad imports in type definitions, updates typings to be compatible with express/polka, and restores hashing of all CSS file names.
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [Tracking the Coronavirus](https://www.nytimes.com/interactive/2021/us/new-york-city-new-york-covid-cases.html) from NYTimes is an example of SvelteKit in production
-- [Budibase](https://github.com/Budibase/budibase) is an open-source low-code platform, helping developers and IT professionals build, automate, and ship internal tools 50x faster on their own infrastructure.
-- [Track the Parcel](https://tracktheparcel.com/) is a one-stop tool for tracking parcel status with all major package shippers.
-- [Memo](https://sendmemo.app/features/) is a replacement for email that uses Svelte for modern messaging
-- [Userscripts Safari](https://github.com/quoid/userscripts) is an open-source userscript editor for Safari... a native Svelte app for Mac OS!
-- [SVGX](https://svgx.app/) is "the desktop SVG asset manager designers and developers wished they had."
-- [Armoria](https://azgaar.github.io/Armoria/) is a procedural heraldry generator and editor
-- [FictionBoard](https://www.fictionboard.com) is a virtual table top (VTT) platform that just released fillable and responsive character sheets
-- [Castles & Crusades Treasure Generator](https://treasure.playaheadgames.com/) is a treasure generator for the table top RPG: Castles and Crusades.
-- [NESBit Studio](https://jensa.org/NESBitStudio-web/graphics/spritesheets) is a toolkit to help the development of homebrew NES games
-- [ElectroBlocks](https://electroblocks.org/) is an online Arduino IDE with a built-in simulator (Chrome Only)
-- [Goblin.life](https://store.steampowered.com/app/552180/GoblinLife/) is a 3D world builder whose UI is built with Svelte
-- [farmbox](https://farmbox.ae/) is a UAE-based grocery delivery services
-- [heroeswearmasks.fun](https://heroeswearmasks.fun/) is a client-side machine learning tool that determines whether or not you're wearing a mask.
-- [weatherify](https://brdtheo-weatherify.netlify.app/) is a very pretty (and [open source](https://github.com/brdtheo/weatherify)) weather app
-- [DSN Live](https://dsn-live.netlify.app/#/) lets you monitor connections between NASA/JPL and interplanetary spacecraft missions in real time.
-
-**Demos, Libraries, Tools & Components**
-
-- [spc](https://github.com/khang-nd/spc) is a special characters picker component for the web
-- [svelte-injector](https://www.npmjs.com/package/svelte-injector) lets you inject Svelte components in React, Angular, Vue, jQuery, Vanilla JS.
-- [Felte](https://felte.dev/) is a form library for Svelte with simple validation reporting.
-- [svelte-use-form](https://github.com/noahsalvi/svelte-use-form#readme) is form library that "is easy to use and has 0 boilerplate."
-- [Formula](https://formula.svelte.codes/) provides "Zero Configuration Reactive Forms for Svelte."
-- [Houdini](https://github.com/AlecAivazis/houdini) is "the disappearing GraphQL client built for Sapper and Sveltekit."
-- [svelte-split-pane](https://www.reddit.com/r/sveltejs/comments/leoe33/sveltesplitpane/) is a draggable split pane component
-- [svelte-virtualized-auto-sizer](https://github.com/micha-lmxt/svelte-virtualized-auto-sizer) is a high-order component that automatically adjusts the width and height of a single child.
-- [svelte-window](https://github.com/micha-lmxt/svelte-window) are components for efficiently rendering large, scrollable lists and tabular data.
-- [Svelte Persistent store](https://github.com/MacFJA/svelte-persistent-store) is a Svelte store that keep its value through pages and reloads
-- [Svelte Dark](https://marketplace.visualstudio.com/items?itemName=NickScialli.svelte-dark) is a VS Code theme inspired by the svelte.dev REPL
-- [Import Cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost) has been updated to support Svelte libraries and help developers keep their bundle size under control.
-- [Tree-sitter-svelte](https://github.com/Himujjal/tree-sitter-svelte) provides tree-sitter grammar for svelte
-- [Svelte Ripple](https://svelte.dev/repl/b73224a0fd4248178e3eab41943d41a9?version=3.31.2) is a Material Design ripple effect that doesn't depend on `@material/ripple` (made by @karakara in the Svelte Discord)
-- [Analog SVG Clock](https://svelte.dev/repl/270e83f43e7a48918d8f2d497760904f?version=3.32.1) is a great example of easing functions (made by @tonmcg in the Svelte Discord)
-- [Console Log Styler](https://svelte.dev/repl/11f609d0d90746f08da6d3d90bba84fc?version=3.32.0) lets you generate a styled console log using pseudo HTML and CSS (made by @EmNudge in the Svelte Discord)
-- [svelte-heroicons](https://github.com/martinse/svelte-heroicons) is a handy wrapper for the Heroicons icon library
-- [supabase-ui-svelte](https://github.com/joshnuss/supabase-ui-svelte) are UI components for Supabase authentication
-
-**Have your own Svelte Component to share?** Check out the [Components](https://sveltesociety.dev/components) page on the Svelte Society site. You can contribute by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-**Learning Resources & Starters**
-
-- [The **unofficial** SvelteKit docs](https://sk-incognito.vercel.app/learn/what-is-sveltekit) were built using SvelteKit and are [open for contributions](https://github.com/GrygrFlzr/kit-docs)
-- [📦 Svelte Store](https://www.youtube.com/playlist?list=PLoKaNN3BjQX3fG-XOSwsPHtnV8FUY6lgK) course by lihautan covers the basics of Svelte Stores and best practices.
-- [Svelte Events](https://www.youtube.com/watch?v=cbxxbBofjAw&feature=youtu.be) by WebJeda explains how directives like `on:` can be used to listen to DOM events.
-- [How to Set Up Protected Routes in Your Svelte Application](https://www.webtips.dev/how-to-set-up-protected-routes-in-your-svelte-application) describes how to authenticate your users to access your routes
-- [Using Fauna's streaming feature to build a chat with Svelte](https://dev.to/fauna/using-fauna-s-streaming-feature-to-build-a-chat-with-svelte-1gkd) demonstrates how to setup and configure Fauna to build a real-time chat interface with Svelte
-- [Using TakeShape with Sapper](https://www.takeshape.io/articles/using-takeshape-with-sapper/) demonstrates how to connect the TakeShape CMS with Sapper
-- [YastPack](https://github.com/rodabt/yastpack) is Yet Another Snowpack-Svelte-TailwindCss-Routify Template Pack
-- [S2T2](https://ralphbliu.medium.com/s2t2-snowpack-svelte-tailwindcss-typescript-8928caa5af6c) is a Snowpack + Svelte + TailwindCSS + TypeScript template
-- [tonyketcham/sapper-tailwind2-template](https://github.com/tonyketcham/sapper-tailwind2-template) is a Sapper Template w/ Tailwind 2.0, TypeScript, ESLint, and Prettier
-
-## See you next month!
-
-Got something to add? Join us on [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-03-23-sveltekit-beta.md b/documentation/blog/2021-03-23-sveltekit-beta.md
deleted file mode 100644
index e778fbd020..0000000000
--- a/documentation/blog/2021-03-23-sveltekit-beta.md
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: SvelteKit is in public beta
-description: And we'd love to have your feedback
-author: Rich Harris
-authorURL: https://twitter.com/rich_harris
----
-
-<aside><p>Previously: <a href="/blog/whats-the-deal-with-sveltekit">What's the deal with SvelteKit?</a></p></aside>
-
-It's time. After five months and hundreds of commits, you're finally invited to try out the SvelteKit beta. It's not finished — there are a few known bugs and several missing features — but we're really happy with how it's shaping up and can't wait for you to try it.
-
-Starting a new project is easy:
-
-```bash
-# create the project
-mkdir my-app
-cd my-app
-npm init svelte@next
-
-# install dependencies
-npm install
-
-# start dev server and open a browser tab
-npm run dev -- --open
-```
-
-You'll find documentation at [kit.svelte.dev/docs](https://kit.svelte.dev/docs). If you have a [Sapper](https://sapper.svelte.dev) app that you'd like to migrate to SvelteKit, you'll find instructions at [kit.svelte.dev/docs/migrating](https://kit.svelte.dev/docs/migrating).
-
-The source code is available at [github.com/sveltejs/kit](https://github.com/sveltejs/kit). Issues and pull requests are disabled while we finish getting our house in order, but we'll be making it fully open in the near future.
-
-## Wait, what is SvelteKit?
-
-Think of it as [Next](https://nextjs.org/) for Svelte. It's a framework for building apps with Svelte, complete with server-side rendering, routing, code-splitting for JS and CSS, adapters for different serverless platforms and so on.
-
-If you're familiar with [Sapper](https://sapper.svelte.dev), SvelteKit is Sapper's successor.
-
-## From Snowpack to Vite
-
-One thing that might seem surprising after the [announcement video](/blog/whats-the-deal-with-sveltekit), in which I waxed lyrical about [Snowpack](https://www.snowpack.dev/), is that SvelteKit uses [Vite](https://vitejs.dev) under the hood. When we tried Snowpack back when we started thinking about what form SvelteKit should take, it was love at first sight.
-
-Snowpack created an entirely new category of dev tooling. Rather than _bundling_ your app in development, as we've been doing with webpack and Rollup for the last several years, Snowpack is an _unbundled dev server_ that uses the browser's native `import` and does 1:1 transformations of things like Svelte components on the fly. As a result you get quick startup, simple caching and instant hot module reloading. Once you experience this way of working, it will ruin you for anything else.
-
-Vite falls into the same category as Snowpack. While Vite 1 wasn't suitable for SvelteKit — it was Vue-centric (Vite and Vue are both created by [Evan You](https://twitter.com/youyuxi)) and made server-side rendering difficult — Vite 2 is framework-agnostic and designed with SSR at the core. It also has powerful features, like CSS code-splitting, that we previously had to implement ourselves. When we evaluated the two technologies side-by-side we were forced to conclude that Vite is a closer match for SvelteKit's requirements and would give us the best chance to deliver the framework of our imaginations.
-
-We owe a deep debt of gratitude to the Snowpack team, both for the close collaboration earlier in development and for lighting the path that web development will take over the next few years. It's a wonderful tool, and you should absolutely try it out.
-
-## Dogfooding as extreme sport
-
-SvelteKit is very much in beta, but that doesn't mean it hasn't been used in production.
-
-My day job is at the New York Times, where I've spent much of the last twelve months working on our [coronavirus tracker](https://www.nytimes.com/interactive/2020/us/coronavirus-us-cases.html). It uses a customised version of the workflow that powers the majority of graphics at the Times, which isn't designed for large multi-page projects. When we decided late last year to create pages for each of the ~3,000 counties in the US, we quickly realised we would need to completely rearchitect the project.
-
-Even though it was far from ready, SvelteKit was the only framework that matched our esoteric requirements. (Anyone who has worked in a newsroom and done battle with their CMS will know what I'm talking about.) Today it powers our [county risk pages](https://www.nytimes.com/interactive/2021/us/tom-green-texas-covid-cases.html) and we're in the process of migrating existing pages to the SvelteKit app.
-
-<aside><p>I am eternally grateful for my coworkers' forbearance.</p></aside>
-
-Using unfinished software to build an app that will be seen by millions of people is a risk, and in general I don't recommend it. But it has enabled us to develop the app much faster, and has made the framework itself much stronger than it otherwise would be.
-
-## The road to 1.0
-
-You can see the list of outstanding issues with the 1.0 milestone on our [issue tracker](https://github.com/sveltejs/kit/issues?q=is%3Aopen+is%3Aissue+milestone%3A1.0). Alongside that work, we plan to upgrade the documentation and add more [adapters](https://kit.svelte.dev/docs/adapters).
-
-Most importantly though, we need your feedback to help us make the best possible app framework. Try it out, and let us know which pieces are missing.
-
-Many thanks to everyone who has tried SvelteKit out despite the 'here be dragons' warnings and lack of documentation; your back-channel feedback has been invaluable. In particular, I want to acknowledge the work of [GrygrFlzr](https://github.com/GrygrFlzr), who maintained unofficial docs and a fork that added Windows support when we lacked it; and [dominikg](https://github.com/dominikg) whose work on [Svite](https://github.com/svitejs/svite) laid essential groundwork for SvelteKit's Vite integration. Both have now been welcomed onto the team.
diff --git a/documentation/blog/2021-04-01-whats-new-in-svelte-april-2021.md b/documentation/blog/2021-04-01-whats-new-in-svelte-april-2021.md
deleted file mode 100644
index 4c9a122385..0000000000
--- a/documentation/blog/2021-04-01-whats-new-in-svelte-april-2021.md
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: "What's new in Svelte: April 2021"
-description: SvelteKit beta and new way to use slots
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Two projects that have been months (even years) in the making have made their way out into the world. SvelteKit is now in public beta and slotted components are now available in Svelte!
-
-## What's up with SvelteKit?
-
-[SvelteKit](https://kit.svelte.dev/) - Svelte's versatile framework for building SSR, serverless applications, or SPAs - is now officially in public beta. Expect bugs! Lots more detail in the [latest blog post](https://svelte.dev/blog/sveltekit-beta). Want to know when 1.0 is close? Check out the milestone on [github](https://github.com/sveltejs/kit/milestone/2).
-
-Want to learn more about how to get started, what's different compared to Sapper, new features and migration paths? Check out this week's [episode of Svelte Radio](https://www.svelteradio.com/episodes/svelte-kit-public-beta) for a deep dive with Antony, Kev and Swyx.
-
-## New in Svelte & Language Tools
-
-- Slotted components, including `<svelte:fragment slot="...">` lets component consumers target specific slots with rich content (**Svelte 3.35.0, Language Tools [104.5.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-104.5.0)**, check out the [docs](https://svelte.dev/docs#template-syntax-svelte-fragment) and the [tutorial](https://svelte.dev/tutorial/svelte-fragment))
-- Linked editing now works for HTML in Svelte files (**Language Tools, [104.6.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-104.6.0)**)
-- Type definitions `svelte.d.ts` are now resolved in order, allowing library authors to ship type definitions with their svelte components (**Language Tools, [104.7.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-104.7.0)**)
-- [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte) is available for general use of Svelte in Vite. `npm init @vitejs/app` includes Svelte options using this plugin.
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [Nagato](https://nagato.app/) is a task management tool that connects popular time tracking and to-do tools all in one place.
-- [type-kana](https://type-kana.cass.moe/setup) is a quiz app to help you learn ひらがな (hiragana) and カタカナ (katakana), the Japanese syllabaries.
-- [Pittsburgh Steps](https://pittsburgh-steps.samlearner.com/) is an interactive map of the more than 800 sets of public outdoor stairways in Pittsburgh, PA.
-- [Music Mode Wheels](https://tobx.github.io/music-mode-wheels/) is a website that displays music modes as interactive wheels.
-- [Critical Notes](https://www.critical-notes.com/) helps game masters and players keep track of their roleplaying games campaigns and adventures.
-- [Svelte Game of Life](https://github.com/alanrsoares/svelte-game-of-life) is an educational implementation of Conway's Game of Life in TypeScript + Svelte
-- [foxql](https://github.com/foxql) is a peer to peer full text search engine that runs on your browser.
-
-**Demos, Libraries, Tools & Components**
-
-- [svelte-nodegui](https://github.com/nodegui/svelte-nodegui) is a way to build performant, native and cross-platform desktop applications with Node.js and Svelte
-- [Svelte Story Format](https://www.npmjs.com/package/@storybook/addon-svelte-csf) allows you to write your "stories" in Storybook using the Svelte syntax. More info in the [Storybook blog](https://storybook.js.org/blog/storybook-for-svelte/)
-- [SelectMadu](https://github.com/pavish/select-madu) is a replacement for the select menu, with support for searching, multiple selections, async data loading and more.
-- [Svelte Checklist](https://www.npmjs.com/package/svelte-checklist) is a customizable CheckList built with Svelte.
-- [Suspense for Svelte](https://www.npmjs.com/package/@jamcart/suspense) is a Svelte component that implements the core idea of React's `<Suspense>`.
-- [MiniRx](https://spierala.github.io/mini-rx-store/) is a RxJS Redux Store that works with Svelte and TypeScript
-- [svelte-formly](https://github.com/arabdevelop/svelte-formly) generates dynamic forms for Svelte and Sapper
-- [7ty](https://www.npmjs.com/package/@jamcart/7ty) is a static site generator that uses Svelte, supports partial hydration of components, and uses file based routing resembling Sapper and 11ty.
-
-**Want to contribute your own component?** Submit a [Component](https://sveltesociety.dev/components) to the Svelte Society site by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-**Starters**
-
-- [sveltekit-electron](https://github.com/FractalHQ/sveltekit-electron) is a starter kit for Electron using SvelteKit
-- [sveltekit-tailwindcss-external-api](https://github.com/acidlake/sveltekit-tailwindcss-external-api) is everything you need to build a Svelte project with TailwindCSS and an external API, powered by create-svelte.
-- [Sapper Netlify](https://www.npmjs.com/package/sapper-netlify) is a Sapper project that can run on a Netlify function.
-
-**Looking for a particular starter?** Check out [svelte-adders](https://github.com/svelte-add/svelte-adders) and a number of other template examples at the community site [sveltesociety.dev](https://sveltesociety.dev/templates/)
-
-**Learning Resources**
-
-- [How to Build a Website with Svelte and SvelteKit](https://prismic.io/blog/svelte-sveltekit-tutorial) is a step-by-step tutorial walking through the new SvelteKit setup.
-- [A Svelte store for prefers-reduced-motion](https://geoffrich.net/posts/svelte-prefers-reduced-motion-store/) demonstrates how to make a custom Svelte store whose value will indicate whether the user has requested reduced motion and improve accessibility.
-- [TypeScript support in Svelte](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript) is an MDN guide to using TypeScript in Svelte.
-- [How to merge cells with svelte-window](https://gradientdescent.de/merging-cells/) is a walkthrough of svelte-window, a port of the popular react-window tool for merging table cells. For more on this migration, see [from react-window 1:1 to svelte-window](https://gradientdescent.de/porting-react-window/).
-- [Easy-to-Embed Svelte Components](https://codeandlife.com/2021/03/06/easy-to-embed-svelte-components/) explains how to use Rollup and a script tag to embed Svelte components anywhere.
-- [Convert Svelte project from Rollup to Snowpack](https://www.youtube.com/watch?v=-sHcqj4YLeQ) walks through a common migration pattern on video.
-- [How to internationalize routing in Svelte & Sapper](https://www.leaf.cloud/blog/how-to-internationalize-routing-in-svelte-sapper?utm_medium=story&utm_source=reddit.com&utm_campaign=awareness&utm_content=sapper_routing) explains how leaf.cloud translated their site to Dutch.
-- [Svelte Store: Reactive context using Svelte Store](https://www.youtube.com/watch?v=-rTnWlbdjoY) is a video answer to the question, "How do we make [a] context value reactive?"
-- [Creating Social Sharing Images with Cloudinary and Svelte](https://www.youtube.com/watch?v=-Si5o-R7KHY) is a video from Cloudinary that demonstrates how to dynamically develop Open Graph images and Twitter Cards for a JAMstack website.
-
-## See you next month!
-
-Got something to add? Join us on [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-05-01-whats-new-in-svelte-may-2021.md b/documentation/blog/2021-05-01-whats-new-in-svelte-may-2021.md
deleted file mode 100644
index 1e176b7421..0000000000
--- a/documentation/blog/2021-05-01-whats-new-in-svelte-may-2021.md
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: "What's new in Svelte: May 2021"
-description: Working toward SvelteKit 1.0 and a showcase full of SvelteKit sites!
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Last week, Svelte Summit blew us away with a mountain of content! [Check out the full recording](https://www.youtube.com/watch?v=fnr9XWvjJHw) or an audio-only (p)review [on Svelte Radio](https://www.svelteradio.com/episodes/svelte-summit-party-episode). Now let's get into this month's news...
-
-## New features in the Svelte Compiler
-
-- `:global()` is now supported as part of compound CSS selectors (**3.38.0**, [Example](https://svelte.dev/repl/54148fd2af484f2c84977c94e523c7c5?version=3.38.0))
-- CSS custom properties can now be passed to components for use cases such as theming (**3.38.0**, [Docs coming soon](https://github.com/sveltejs/svelte/issues/6268))
-
-## New in SvelteKit
-
-- [kit.svelte.dev](https://kit.svelte.dev/) has a fresh new look and the [SvelteKit Demo Site](https://netlify.demo.svelte.dev/) got a fresh set of paint. Check it out by running `npm init svelte@next`
-- You can now use `@sveltejs/adapter-static` to create a single-page app or SPA by specifying a fallback page ([PR](https://github.com/sveltejs/kit/pull/1181), [Docs](https://github.com/sveltejs/kit/tree/master/packages/adapter-static))
-- Disable Server-side Rendering (SSR) app-wide or on a page-by-page basis ([PR](https://github.com/sveltejs/kit/pull/713))
-- Error messages thrown during pre-rendering are now much more informative and readable ([PR](https://github.com/sveltejs/kit/pull/1062), [Docs](https://kit.svelte.dev/docs/layouts#error-pages))
-- Layouts can now be reset to prevent pages from inheriting the root layout. This is useful if you have a specific layout for a page or i18n variation ([PR](https://github.com/sveltejs/kit/pull/1061), [Docs](https://kit.svelte.dev/docs/layouts#resets))
-- `fetch` in SvelteKit code will now use the environment-provided implementation, whenever possible. If `fetch` is unavailable, it will be polyfilled by adapters ([PR](https://github.com/sveltejs/kit/pull/1066), [Docs](https://kit.svelte.dev/docs/loading#input-fetch))
-
-## New in Svelte & Language Tools
-
-- `svelte-preprocess` now supports the "extends" field of the tsconfig.json (4.7.2)
-- HTML `style` attributes now have hover & auto-complete. Foreign namespaces and ESM configs are now supported in the Svelte language server & extensions
-- The Svelte language tools can now infer slot/event types from their props if a generic relationship between them was defined
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [gitpod.io](https://github.com/gitpod-io/website) recently rewrote its site with SvelteKit
-- [highlight eel](https://highlighteel.com/) is a web-based editor to mark your favorite parts of any YouTube video to clip and share with anyone
-- [The Far Star Mission](https://thefarstar.apotheus.net/) is an interactive audiobook companion to the album, The Far Star by Apotheus
-- [JavaScript quiz](https://github.com/nclskfm/javascript-quiz) is a small quiz application that saves your answers locally
-- [ExtensionPay](https://extensionpay.com/) lets developers accept secure payments in browser extensions with no backend server code.
-- [mk48.io](https://mk48.io/) is a naval warship game made with SvelteKit
-- [Frog Safety](https://frog-safety.vercel.app/) is a guide for African Dwarf Frogs and the API freshwater master kit
-- [Stardew Valley Character Preview](https://github.com/overscore-media/stardew-valley-character-preview) loads your character's attributes from your Stardew Valley savefile and lets you play around with different outfits, colours, and accessories.
-
-**Demos, Libraries, Tools & Components**
-
-- [svelte-parallax](https://github.com/kindoflew/svelte-parallax) is a spring-based parallax component for Svelte
-- [@svelte-plugins/viewable](https://github.com/svelte-plugins/viewable) is a simple rule-based approach to tracking element viewability.
-- [Sveltekit-JUI](https://github.com/Wolfr/sveltekit-jui) is a kit of UI components to be used in conjunction with Svelte and Svelte Kit.
-- [EZGesture](https://github.com/mhmd-22/ezgesture#integrating-with-other-frameworks) makes it easy to add gestures functionality with simple native DOM events
-
-**Want to contribute your own component?** Submit a [Component](https://sveltesociety.dev/components) to the Svelte Society site by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-**Starters**
-
-- [How to use Vercel Analytics with SvelteKit](https://ivoberger.com/posts/using-vercel-analytics-with-svelte-kit) teaches how to track Web Vitals across your users' devices
-- [Asp.NETCore + Svelte + Vite](https://github.com/Kiho/aspcore-spa-cli/tree/master/samples/SviteSample) connects the three frameworks with SpaCliMiddleware (VS2019)
-- [Add CoffeeScript to Svelte](https://github.com/Leftium/coffeescript-adder) is an experimental command to run to add CoffeeScript to your SvelteKit project or Vite-powered Svelte app
-- [Adds Supabase to Svelte](https://github.com/joshnuss/svelte-supabase) is an experimental command to run to add Supabase to your SvelteKit project
-- [svelte-babylon](https://github.com/SectorXUSA/svelte-babylon) lets you use BabylonJS like A-Frame through reactive Svelte Components
-
-**Looking for a starter or integration?** Check out [svelte-adders](https://github.com/svelte-add/svelte-adders) and a number of other template examples at the community site [sveltesociety.dev](https://sveltesociety.dev/templates)
-
-**Learning Resources**
-
-- [Amazing macOS Dock animation in Svelte](https://dev.to/puruvj/amazing-macos-dock-animation-in-svelte-5hfb) demonstrates how nice Svelte and popmotion look together
-- [Solving the Tower of Hanoi with recursive Svelte templates](https://geoffrich.net/posts/svelte-tower-of-hanoi/) incorporates the `<svelte:self>` element into a common computer science problem
-- [DIY SvelteKit CDK adapter](https://dev.to/juranki/diy-sveltekit-cdk-adapter-3enp) puts together SvelteKit and AWS CDK
-- Fireship's [Svelte in 100 Seconds](https://www.youtube.com/watch?v=rv3Yq-B8qp4) is a quick and easy introduction to Svelte's core concepts
-- [Tech Downtime](https://www.youtube.com/watch?v=tsePBA2JC7o&list=PLualcIC6WNK1LHIYx2Tg9AQfTQDv4zNPu) has been diving into SvelteKit in this playlist - from getting up and running to debugging.
-- lihautan's latest video updates in the [Svelte 101](https://www.youtube.com/watch?v=rwYgOU0WmVk&list=PLoKaNN3BjQX3mxDEVG3oGJx2ByXnue_gR&index=59) and [Svelte Store](https://www.youtube.com/watch?v=p4GmT0trCPE&list=PLoKaNN3BjQX3fG-XOSwsPHtnV8FUY6lgK&index=19) playlists cover slots, stores and context - and when to use which
-- [DavidParkerW](https://www.youtube.com/c/DavidParkerW/playlists) has been exploring Svelte, Sapper and SvelteKit in some real-world scenarios, like [displaying a blog post list from an API](https://www.youtube.com/watch?v=kAPVFgFnxaM&list=PLPqKsyEGhUna6cvm6d4vZNI6gbt_0S4Xx&index=15)
-
-## See you next month!
-
-Got something to add? Join us on [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-06-01-whats-new-in-svelte-june-2021.md b/documentation/blog/2021-06-01-whats-new-in-svelte-june-2021.md
deleted file mode 100644
index cf05ef09fe..0000000000
--- a/documentation/blog/2021-06-01-whats-new-in-svelte-june-2021.md
+++ /dev/null
@@ -1,63 +0,0 @@
----
-title: "What's new in Svelte: June 2021"
-description: Progress towards SvelteKit 1.0 and tighter TypeScript/Svelte integrations in language tools
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-This month, we saw lots of contributions to SvelteKit and its docs. The language tools also got some new features, most notably deeper integration with Svelte files within JavaScript or TypeScript files. Let's jump into the updates...
-
-## New in SvelteKit
-
-- `svelte.config.js` config files are now loaded in ESM format (`.js` instead of `.cjs`).
-- AMP pages will now use the rendered CSS, rather than emitted CSS
-- `svelte-check` has been added to the TypeScript template ([sveltejs/kit#1556](https://github.com/sveltejs/kit/pull/1556))
-- Support for https keypair [sveltejs/kit#1456](https://github.com/sveltejs/kit/pull/1456)
-- Now bundling Vite with SvelteKit and using an upgraded version. Remove Vite from your `package.json` if it's there
-- Etags for binary responses [sveltejs/kit#1382](https://github.com/sveltejs/kit/pull/1382)
-- Renamed `$layout` to `__layout` and `$error` to `__error`
-- Removed `getContext` in favor of `request.locals`
-- Renamed `.svelte` output directory to `.svelte-kit`. Update your `.gitignore` accordingly
-- `trailingSlash: 'never' | 'always' | 'ignore'` is now available in the config. This should make it easier to build sites that work with static hosting providers that expect a trailing slash for `index.html` pages, and provides an escape hatch for anyone that needs more complex behaviour.
-
-## Notable bug fixes in SvelteKit
-
-- `adapter-netlify` got a fix [sveltejs/kit#1467](https://github.com/sveltejs/kit/pull/1467) and new documentation in the readme https://github.com/sveltejs/kit/tree/master/packages/adapter-netlify
-- The router will no longer intercept navigation for URLs that the app does not own. This fixes a crash for apps that have `<a>` elements on the page with the same origin but don't share a base path with the app.
-- Hash only changes are now handled by the router fixing the browser's "back" navigation between hash changes in some circumstances.
-
-## New in Svelte & Language Tools
-
-- Svelte 3.38.1 and 3.38.2 fixed an issue with hydration that was causing duplicate elements. If you're seeing this in your project, be sure to update the latest version!
-- A new TypeScript plugin provides deeper integration with Svelte files within JavaScript or TypeScript files. This includes diagnostics, references and renaming of variables. It comes packaged with the VS Code extension but is turned off by default for now. You can enable it through [this setting](https://github.com/sveltejs/language-tools/tree/master/packages/svelte-vscode#svelteenable-ts-plugin). We encourage you to test it out and [provide feedback](https://github.com/sveltejs/language-tools/issues/580)
-- In the latest version of `svelte-check` you can now provide the path to your `tsconfig.json` or `jsconfig.json`. Example: `svelte-check --tsconfig "./tsconfig.json"`. This ensures the diagnostics are only run on files that are referenced in that config. It also runs diagnostics on JavaScript and/or TypeScript files which removes the need to run another check (like `tsc --noEmit`) for non-Svelte files (`svelte-check` version [**1.6.0**](https://github.com/sveltejs/language-tools/releases/tag/svelte-check-1.6.0))
-- The VS Code extension and `svelte-check` got a new major release. Previously, properties that had no initializer (`export let foo;`) were only required if the user was using both TypeScript and activated `strict` mode. This is changed now: People using TypeScript, and those using `checkJs` also in JavaScript files, will now always have these properties marked as required (`svelte-check` version [**2.0.0**](https://github.com/sveltejs/language-tools/releases/tag/svelte-check-2.0.0), extension version [**105.0.0**](https://github.com/sveltejs/language-tools/releases/tag/extensions-105.0.0))
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [vidu](https://github.com/pa-nic/vidu) is a minimal web analytics collector and dashboard
-- [River Runner](https://river-runner.samlearner.com/) is a virtual way to follow rivers downstream - built with Mapbox and Svelte.
-- [JSDoc Type Generator](https://rafistrauss.github.io/jsdoc-generator/) generates JSDoc types for valid JSON.
-- [pagereview.io](https://pagereview.io/) is a website feedback tool that lets you leave comments directly on the site being reviewed.
-- [gamesroom.io](https://gamesroom.io/) is an online board game platform with video chat built-in.
-- [Greedy Goblin](https://greedygoblin-fe11c.web.app/) is a recipe app for old-school Runescape players.
-- [hashbrown.geopjr.dev](https://hashbrown.geopjr.dev/) is a GNOME-shell inspired webpage to learn about, explore the source code and download the Hashbrown GTK app ([link to source](https://github.com/GeopJr/Hashbrown/tree/website)).
-
-**Libraries, Tools & Components**
-
-- [svelte-image-crop](https://novacbn.github.io/svelte-image-crop/) is a simple click'n'drag image cropping library using Web APIs.
-- [svelte-datepicker](https://github.com/andrew-secret/svelte-datepicker) is a lightweight and inclusive date picker build with Svelte.
-- [svelte-regex-router](https://www.npmjs.com/package/svelte-regex-router) is a simple, lightweight library for you to easily handle routes in your Svelte application.
-- [Svelte Micro](https://www.npmjs.com/package/svelte-micro) is a light & reactive one-component router for Svelte.
-- [svelte-entity-store](https://www.npmjs.com/package/svelte-entity-store) is to provide a simple, generic solution for storing collections of entity objects.
-- [svelte-animation-store](https://github.com/joshnuss/svelte-animation-store) is a store that is based on Svelte's tweened store, that lets you pause, continue, reset, replay, reverse or adjust speed of a tween.
-
-**Want to contribute a component?** Submit a [Component](https://sveltesociety.dev/components) to the Svelte Society site by making [a PR to this file](https://github.com/svelte-society/sveltesociety.dev/blob/master/src/pages/components/components.json).
-
-## See you next month!
-
-Did we miss something? Join us on [Svelte Society](https://sveltesociety.dev/), [Reddit](https://www.reddit.com/r/sveltejs/) and [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-07-01-whats-new-in-svelte-july-2021.md b/documentation/blog/2021-07-01-whats-new-in-svelte-july-2021.md
deleted file mode 100644
index 023028f0f8..0000000000
--- a/documentation/blog/2021-07-01-whats-new-in-svelte-july-2021.md
+++ /dev/null
@@ -1,64 +0,0 @@
----
-title: "What's new in Svelte: July 2021"
-description: Keeping cool with fixes, TypeScript tooling and tonnes of new features
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-As the northern hemisphere heats up, Svelte has stayed cool with lots of performance and bug fixes, better TypeScript support, and lots of new components & tools from around the ecosystem. Let's take a peek 👀
-
-## New in SvelteKit
-
-- `adapter-node` now precompresses assets using gzip & brotli ([#1693](https://github.com/sveltejs/kit/pull/1693))
-- Support for TypeScript transpilation has been added to the `svelte-kit package` tooling ([#1633](https://github.com/sveltejs/kit/pull/1633))
-- Improved caching defaults in `adapter-node` ([#1416](https://github.com/sveltejs/kit/pull/1416))
-- Allow configuring Rollup output options ([#1572](https://github.com/sveltejs/kit/pull/1572))
-- Fixed usage of SSL with HMR ([#1517](https://github.com/sveltejs/kit/pull/1517))
-
-## Features & bug fixes from around svelte/\*
-
-- [Svelte 3.38.3](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#3383) (released June 22) includes a bunch of performance and bug fixes - including hydration optimizations, `this` preservation in bubbled events, and more!
-- The latest language tools releases added support for prop renaming from outside of a component, PostCSS syntax grammar, and a `.d.ts` output target in `svelte2tsx` which can be used to create type definitions from Svelte files.
-- Also in language tools, some long-awaited experimental features for enhanced TypeScript support were added - including explicitly typing all possible component events or slots, and using generics. Have a look at [the RFC](https://github.com/sveltejs/rfcs/pull/38) for more details and leave feedback in [this issue](https://github.com/sveltejs/language-tools/issues/442) if you are using it.
-- `svelte-scroller` got some quality-of-life fixes in 2.0.7 - fixing an initial width bug and updating its `index` more conservatively
-
-## Coming soon to Svelte
-
-- Constants in markup ([RFC](https://github.com/sveltejs/rfcs/blob/master/text/0000-markup-constants.md)): Adds a new `{@const ...}` tag that defines a local constant ([PR](https://github.com/sveltejs/svelte/pull/6413))
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [SvelteThemes](https://sveltethemes.dev/) is a curated list of Svelte themes and templates built using svelte, sveltekit, elderjs, routify etc.
-- [Beatbump](https://github.com/snuffyDev/Beatbump) is an alternative frontend for YouTube Music created using Svelte/SvelteKit.
-- [Sveltuir](https://github.com/webspaceadam/sveltuir) is an app help you memorize the guitar fretboard
-
-**Educational Content**
-
-- [Svelte Radio: A Jolly Good Svelte Summer](https://share.transistor.fm/s/60880542) is a conversation about what's new in Svelte and a celebration of Svelte Radio's 1-year anniversary
-- [Class properties in Svelte](https://navillus.dev/blog/svelte-class-props) is a refresher on the power of `class` for developers switching over to Svelte from React
-- [Sveltekit Tutorial for Beginners](https://www.youtube.com/playlist?list=PLm_Qt4aKpfKjf77S8UD79Ockhwp_699Ms) is a video playlist for learning SvelteKit by WebJeda
-- [How To Cache Dynamic Pages On Demand With A Service Worker In SvelteKit](https://jochemvogel.medium.com/how-to-cache-dynamic-pages-on-demand-with-a-service-worker-in-sveltekit-4b4a7652583d) walks through the power of service workers when used within SvelteKit for on-demand caching
-- [Vue vs Svelte: Comparing Framework Internals](https://www.vuemastery.com/blog/vue-vs-svelte-comparing-framework-internals/) dives deep into the differences between Vue and Svelte from the inside out
-- [Setting up a development environment for SvelteKit with Docker and Docker Compose](https://jenyus.web.app/blog/2021-05-30-setting-up-a-development-environment-for-sveltekit-with-docker-and-compose) walks through how to use Docker to create reusable development environments, no matter what kind of device you run your code on
-- Scalable Scripts released three videos this month documenting how to deploy dockerized Svelte Apps to [AWS](https://youtu.be/VOs2Od5jYOc), [Azure](https://youtu.be/gdg4ne_uDm8) and [Google Cloud](https://youtu.be/_-uBb61Tikw)
-- [Render Katex with Svelte from zero to hero](https://www.youtube.com/watch?v=euowJs9CblA) demonstrates how to implement Katex in a Svelte project
-- [Using Custom Elements in Svelte](https://css-tricks.com/using-custom-elements-in-svelte/) shows some of the quirks to look out for when using custom elements in a Svelte site
-
-**Libraries, Tools & Components**
-
-- [svelte-pipeline](https://github.com/novacbn/svelte-pipeline) provides custom JavaScript contexts and the Svelte Compiler as Svelte Stores, for REPLs, Editors, etc.
-- [Sveltotron](https://github.com/Salemmous/sveltotron) is an Electron-based app made to inspect your Svelte app
-- [svelte-qr-reader-writer](https://github.com/pleasemarkdarkly/svelte-qr-reader-writer) is a Svelte component that helps read and write data from QR codes
-- [svelte-stack-router](https://www.npmjs.com/package/svelte-stack-router) Aims to make Svelte apps feel more native by routing with Stacks
-- [svelte-typed-context](https://www.npmjs.com/package/svelte-typed-context) provides an interface which, when provided to `getContext` or `setContext`, allows for stricter types
-- [svelte-modals](https://svelte-modals.mattjennings.io/) is a simple, flexible, zero-dependency modal manager for Svelte
-
-**Want to contribute a component? Interested in helping make Svelte's presence on the web better?** Submit a Component to the Svelte Society site by making [a PR to this file](https://github.com/svelte-society/sveltesociety-2021/blob/main/src/routes/components/components.json) or check out [the list of open issues](https://github.com/svelte-society/sveltesociety-2021/issues) if you'd like to contribute to the Svelte Society rewrite in SvelteKit.
-
-## See you next month!
-
-Want more updates? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-08-01-whats-new-in-svelte-august-2021.md b/documentation/blog/2021-08-01-whats-new-in-svelte-august-2021.md
deleted file mode 100644
index 97bd24605f..0000000000
--- a/documentation/blog/2021-08-01-whats-new-in-svelte-august-2021.md
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: "What's new in Svelte: August 2021"
-description: Shadow DOM, export and await - oh my!
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-From The Changelog ([JS Party Ep. 182](https://changelog.com/jsparty/182)) to Svelte Radio (Episodes [29](https://share.transistor.fm/s/adc23e84) and [30](https://share.transistor.fm/s/6316622d)), it seems that folks couldn't help but talk about Svelte, this month! Also, shadow DOM support and new export and await functionality are new in Svelte.
-
-## New in Svelte
-
-July was the most active month for the Svelte core repo since late 2019 as we really worked to reduce the number of outstanding PRs and saw the release of Svelte 3.39.0, 3.40.0, and 3.41.0. Tons of bug fixes were added as well as the following new features:
-
-- The `|trusted` event modifier allows you to check if an event is trusted before it's called ([#6137](https://github.com/sveltejs/svelte/issues/6137))
-- The new `svelte/ssr` package to support work on improving SvelteKit SSR ([#6416](https://github.com/sveltejs/svelte/pull/6416))
-- A new `errorMode` compiler option to support improved preprocessing of TypeScript files ([#6194](https://github.com/sveltejs/svelte/pull/6194))
-- You can now specify a `ShadowRoot` as the `target` when creating a component - making it possible to render Svelte components inside the shadow DOM ([#5869](https://github.com/sveltejs/svelte/issues/5869))
-- The `export { ... } from` ([#2214](https://github.com/sveltejs/svelte/issues/2214)), `export let { ... } =` ([#5612](https://github.com/sveltejs/svelte/issues/5612)) and `{#await ... then/catch}` ([#6270](https://github.com/sveltejs/svelte/issues/6270)) syntaxes are all now supported in Svelte components
-
-For a full list of features and bug fixes, check out the [Svelte changelog](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## SvelteKit Updates
-
-- `prerender.force` is now `prerender.onError` which lets you fine-tune which errors fail the build and which do not ([#2007](https://github.com/sveltejs/kit/pull/2007))
-- esbuild's configuration is now exposed for use with SvelteKit adapters ([#1914](https://github.com/sveltejs/kit/pull/1914))
-- Error messages are friendlier now for common config errors ([#1910](https://github.com/sveltejs/kit/pull/1910)) and compiler errors ([#1827](https://github.com/sveltejs/kit/pull/1827))
-- Cookies will only be passed through if the target host is the same as the SvelteKit application or a more specific subdomain of it ([#1847](https://github.com/sveltejs/kit/pull/1847))
-- index.js exports will now be changed to directory exports when packaging - making for nicer imports ([#1905](https://github.com/sveltejs/kit/pull/1905))
-- Vite.js's `mode` is now exposed from `$app/env` ([#1789](https://github.com/sveltejs/kit/pull/1789))
-- Better types across the board ([#1778](https://github.com/sveltejs/kit/pull/1778), [#1791](https://github.com/sveltejs/kit/pull/1791), [#1646](https://github.com/sveltejs/kit/pull/1646))
-
-To see all updates to SvelteKit, check out the [SvelteKit changelog](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
-## Features & bug fixes from around svelte/\*
-
-- Language Tools now better support the "Workplace Trust" functionality (used in VS Code)
-- In svelte2tsx, ambient type declarations are now renamed to avoid conflicting declarations in the future. Users are now expected to provide the ambient type definitions themselves - fixing JS output
-- Sapper released v0.29.2 which fixes regex routes, status codes when requesting a directory, and exports when a user has not provided a `base` tag ([changelog](https://github.com/sveltejs/sapper/blob/master/CHANGELOG.md))
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [Parsnip](https://www.parsnip.ai/) is a mobile-first, progressive-web-app that helps you to learn to cook at home. Check out the [conversation on Reddit](https://www.reddit.com/r/sveltejs/comments/oearb9/learning_to_cook_at_home_with_parsnip_built/) for all the geeky details.
-- [Central Bank Digital Currency (CBDC) tracker](https://www.atlanticcouncil.org/cbdctracker/) is a site that keeps track of how countries around the world are adopting digital currencies.
-- [Svelte Commerce](https://github.com/itswadesh/svelte-commerce) is an advanced frontend platform for eCommerce based on Sveltekit.
-- [neovimcraft](https://neovimcraft.com/) is a SvelteKit site dedicated to neovim plugins
-
-**Looking for a Svelte project to work on? Interested in helping make Svelte's presence on the web better?** Check out [the list of open issues](https://github.com/svelte-society/sveltesociety-2021/issues) if you'd like to contribute to the Svelte Society rewrite in SvelteKit.
-
-**Educational Content**
-
-- [How I Built a Cross-Platform Desktop Application with Svelte, Redis, and Rust](https://css-tricks.com/how-i-built-a-cross-platform-desktop-application-with-svelte-redis-and-rust/) is a blog post by Luke Edwards, Svelte maintainer and Developer Advocate from Cloudflare.
-- [How to Create a Blog with SvelteKit and Strapi](https://strapi.io/blog/how-to-create-a-blog-with-svelte-kit-strapi) is a step-by-step tutorial by Aarnav Pai from Strapi
-- [Sveltekit Markdown Blog](https://www.youtube.com/watch?v=sKKgT0SEioI&list=PLm_Qt4aKpfKgonq1zwaCS6kOD-nbOKx7V) is a YouTube tutorial series by WebJeda.
-- [Using Custom Elements in Svelte](https://css-tricks.com/using-custom-elements-in-svelte/) is a deep dive into custom elements by Geoff Rich.
-- [learn / graphql / svelte](https://hasura.io/learn/graphql/svelte-apollo/introduction/) is a free 2-hour GraphQL course from Hasura.
-- [How to add Magic Link to a SvelteKit application](https://magic.link/posts/magic-svelte) is a guide to the popular password-less login pattern.
-
-**Libraries, Tools & Components**
-
-- [Svelte-Capacitor](https://github.com/drannex42/svelte-capacitor/) just released v2.0.0 - making it even easier to build hybrid mobile apps for iOS and Android using Svelte and Capacitor with near native performance.
-- [svelte-remixicon](https://github.com/ABarnob/svelte-remixicon) is an icon library for Svelte based on Remix Icon, consisting of more than 2000 icons.
-- [SveltePress](https://github.com/GeopJr/SveltePress) is a documentation tool built on top of SvelteKit.
-- [Svelte Starter Kit](https://github.com/one-aalam/svelte-starter-kit/tree/auth-supabase) is a boilerplate to quickly get up and running with Svelte, with Auth and User Profiles powered by Supabase.
-- [Kahi UI](https://github.com/novacbn/kahi-ui) is a Svelte-first UI kit with Dark Mode built-in.
-- [typesafe-i18n](https://github.com/ivanhofer/typesafe-i18n) is an opinionated, fully type-safe, lightweight localization library for TypeScript and JavaScript projects with no external dependencies.
-
-Check out the community site [sveltesociety.dev](https://sveltesociety.dev/templates/) for more templates, adders and adapters from across the Svelte ecosystem.
-
-## See you next month!
-
-Want more updates? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-09-01-whats-new-in-svelte-september-2021.md b/documentation/blog/2021-09-01-whats-new-in-svelte-september-2021.md
deleted file mode 100644
index 1cbffd5baf..0000000000
--- a/documentation/blog/2021-09-01-whats-new-in-svelte-september-2021.md
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: "What's new in Svelte: September 2021"
-description: StackOverflow's most loved web framework
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-This month, Svelte was [voted StackOverflow's most loved web framework](https://insights.stackoverflow.com/survey/2021#section-most-loved-dreaded-and-wanted-web-frameworks), Tan Li Hau [talked to Svelte Radio](https://share.transistor.fm/s/84c7521b) about his [Svelte-filled YouTube channel](https://www.youtube.com/channel/UCbmC3HP3FaAFdcZkui8YoMQ), and SvelteKit made even more progress towards its 1.0 release!
-
-## New in Svelte
-
-- `use:actions` can now be used on `<svelte:body>` (**3.42.0**)
-- `HTMLElement`, `SVGElement` (**3.42.2**) and `BigInt` (**3.42.3**) are now known globals
-- There is less code in Svelte's output thanks to the following improvements in **3.42.2**:
-  - Whitespace is now collapsed in class and style attributes
-  - Hydrated components have been updated to only rely upon helpers for creating the types of elements present in the component
-- Scaling is now accounted for in `flip` animations (**3.42.2**)
-- All `<option>`s in a `<select>` are now deselected when the bound value doesn't match any of them (**3.42.2**)
-
-For a full list of features and bug fixes, check out the [Svelte changelog](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## SvelteKit Updates
-
-Svelte maintainers are [looking for help getting SvelteKit to 1.0](https://github.com/sveltejs/kit/issues/2100). We've knocked out over 100 issues that were on the 1.0 milestone. There's only a couple dozen left and we'd love a hand making that list a bit shorter!
-
-If you'd like to help, please consider working on any of the [1.0 milestone issues](https://github.com/sveltejs/kit/issues?q=is%3Aopen+is%3Aissue+milestone%3A1.0).
-
-The focus this past month was on continuing to iron out any kinks, with well over 100 PRs merged. A few new features went in as well...
-
-- SvelteKit will now detect if a prerendered app is trying to access a query parameter and return an error instead of failing silently ([#2104](https://github.com/sveltejs/kit/pull/2104))
-- `adapter-node` now lets you [add the Kit middleware to your own server](https://kit.svelte.dev/faq#integrations) for use with other middleware. You can also [add middleware in dev mode](https://kit.svelte.dev/faq#how-do-i-use-x-with-sveltekit-how-do-i-use-middleware) with more improvements to come in this area
-- The new [`sequence` helper lets you chain together multiple `handle` calls](https://kit.svelte.dev/docs/modules#sveltejs-kit-hooks)
-- A new [`handleError` hook](https://kit.svelte.dev/docs/hooks#handleerror) gives you the option to send data to an error tracking service, or to customise the formatting before printing the error to the console.
-- `adapter-node` can now listen on socket path ([#2048](https://github.com/sveltejs/kit/pull/2048))
-
-To see all updates to SvelteKit, check out the [SvelteKit changelog](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [macos-web](https://github.com/PuruVJ/macos-web) by @puruvjdev has been rebuilt with Svelte from the ground up. Check out all the details in this [Twitter thread](https://twitter.com/puruvjdev/status/1426267327687847939)
-- [Brave Search](https://search.brave.com/) is using Svelte
-- [exatorrent](https://github.com/varbhat/exatorrent) is a self-hostable, easy-to-use, lightweight and feature-rich torrent client written in Go and Svelte
-- [json2TsTypes](https://github.com/jatinhemnani01/json2TsTypes) is a simple tool which will convert your JSON to TypeScript Types/Interfaces
-- [Histogram.dev](https://histogram.dev/) generates histograms for each feature in a CSV
-- [cybernetic.dev](https://cybernetic.dev/) is a collection of data-centric UI experiments made while learning Svelte
-- [LunaNotes](https://chrome.google.com/webstore/detail/lunanotes-youtube-video-n/oehoffnnkgcdacmbkhmlbjedinpampak?hl=en) is a Chrome extension to help with taking YouTube video notes
-- [theia.games](https://theia.games/#dev)'s built-in 3D environment editor lets you create a VR world with a menu built in Svelte
-- [Ferrum](https://github.com/probablykasper/ferrum) is a music library and player available for Mac, Windows or Linux
-- [Fluid Earth](https://github.com/byrd-polar/fluid-earth) is an interactive WebGL application for visualizing Earth's atmosphere and oceans
-
-**Looking for a Svelte project to work on? Interested in helping make Svelte's presence on the web better?** Check out [the list of open issues](https://github.com/svelte-society/sveltesociety-2021/issues) if you'd like to contribute to the Svelte Society rewrite in SvelteKit.
-
-**Educational Content**
-
-- [Tauri with Standard Svelte or SvelteKit](https://medium.com/@cazanator/tauri-with-standard-svelte-or-sveltekit-ad7f103c37e7) walks through how to setup Svelte with Tauri, a new light-weight framework for developing cross-platform hybrid desktop applications
-- [Svelte - Web App Development Reimagined [An Intro to Svelte]](https://www.youtube.com/watch?v=4CGzFwHoD0A&list=PLEx5khR4g7PKSASVAXXiAhkyx02_OeruP) is a great intro talk from the goto; conference
-- [LevelUpTuts - Even More 5 Things I Like More In Svelte Than React](https://www.youtube.com/watch?v=ISmnG2sIOeM) highlights Svelte's approach to refs (don't need them), meta tags and more
-- [State Management in Svelte Applications](https://auth0.com/blog/state-management-in-svelte-applications/) is a tutorial on how to use the Svelte state management store to manage state in Svelte applications
-- [Migrating from Sapper to SvelteKit](https://shipbit.de/blog/migrating-from-sapper-to-svelte-kit/) is a review and retrospective of ShipBit's migration from Sapper
-
-**Libraries, Tools & Components**
-
-- [svelte-stripe-js](https://github.com/joshnuss/svelte-stripe-js) is everything you need to add Stripe to your Svelte project. 100% SvelteKit compatible
-- [svelte-steps](https://github.com/shaozi/svelte-steps) is a customizable step component written in Svelte
-- [simple-optics-module](https://gitlab.com/Samzelot/simple-optics-module) is an online open source optics tool for experimenting and teaching geometrical optics
-- [inlang](https://github.com/samuelstroschein/inlang) is an internationalization (i18n) tool for SvelteKit apps
-- [Sveno](https://github.com/pocinnovation/sveno) is a component transpiler that transforms React components to Svelte components
-- [svelte-useactions](https://github.com/paolotiu/svelte-useactions) is a fully typed library for passing actions to components
-- [Svelte-Element-Query](https://github.com/leveluptuts/Svelte-Element-Query) is a 322b library/action for element queries
-- [svelte-meta-tags](https://github.com/oekazuma/svelte-meta-tags) is a plug-in that makes managing SEO easier in Svelte projects
-- [svelte-domtree](https://github.com/alex-knyaz/svelte-domtree) lets you visualize the DOM - similar to DOM tree in Chrome DevTools
-- [Diffx](https://github.com/jbjorge/diffx/tree/master/svelte), a cross-framework state management library, just added Svelte support
-- [svelte-ionic-starter](https://github.com/Zettexe/svelte-ionic-starter) a project template for Svelte + Ionic + CapacitorJS apps with live reload and iOS/Android build targets
-- [demo-sveltekit-sanity](https://github.com/stephane-vanraes/demo-sveltekit-sanity/) is a starter kit for SvelteKit and Sanity, an open source React CMS
-
-Check out the community site [sveltesociety.dev](https://sveltesociety.dev/templates/) for more templates, adders and adapters from across the Svelte ecosystem.
-
-## See you next month!
-
-Want more updates? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-10-01-whats-new-in-svelte-october-2021.md b/documentation/blog/2021-10-01-whats-new-in-svelte-october-2021.md
deleted file mode 100644
index d20cce0cab..0000000000
--- a/documentation/blog/2021-10-01-whats-new-in-svelte-october-2021.md
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: "What's new in Svelte: October 2021"
-description: A whole year of "What's new in Svelte"
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Hey y'all 👋 It's been 1 year since "What's new in Svelte" started being cross-posted to the Svelte blog. I wanted to take this moment at the top to thank all of you for reading and for all the contributors every month. From the maintainers to everyone who posts their work in the Discord and Reddit, it's amazing to witness all the effort that goes into making the Svelte community great.
-
-Keep up the good work, everyone! Now, let's dive into this month's news...
-
-## New around Svelte
-
-- New additions to Svelte's export map now expose no-op versions of lifecycle functions for SSR (Svelte **3.43.0**)
-- Custom components with a `src` attribute no longer break `svelte-native` builds (Svelte **3.42.4**)
-- Svelte plugin users without [the TypeScript plugin](https://www.npmjs.com/package/typescript-svelte-plugin) enabled will now be prompted to enable it. It enhances TypeScript and JavaScript files with additional intellisense to interact with Svelte files. [Please leave feedback](https://github.com/sveltejs/language-tools/issues/580) if you are using it (Svelte extensions **105.4.0**)
-- Event modifiers have been added to intellisense as autocomplete and hover info (Svelte extensions **105.4.0**)
-- TypeScript users no longer have to strictly separate type imports and value imports when using Svelte version 3.39 or higher and `svelte-preprocess` version 4.9.5 or higher. This means you can now write `import { MyInterface, myValue } from './somewhere'` instead of `import type { MyInterface } from './somewhere'; import { myValue } from './somewhere'`. Huge thanks to community member [@SomaticIT](https://github.com/SomaticIT) who mainly implemented this!
-
-For a full list of features and bug fixes, check out the [Svelte changelog](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## SvelteKit Updates
-
-Nearly 100 PRs committed again this past month, but there's still lots to do and Svelte maintainers are [looking for help getting SvelteKit to 1.0](https://github.com/sveltejs/kit/issues/2100). Antony said it well in a [recent comment](https://github.com/sveltejs/kit/issues/2100#issuecomment-895446285) on the issue:
-
-> If you think you are too n00b to contribute (you're not), then add tests, or write tests for the feature you want to add, before you add it! Start small, and learn the codebase that way.
-
-If you'd like to help, please consider working on any of the [1.0 milestone issues labeled with "help wanted"](https://github.com/sveltejs/kit/issues?q=is%3Aopen+is%3Aissue+milestone%3A1.0+label%3A%22help+wanted%22).
-
-Notable SvelteKit improvements this month include...
-
-- Service workers are now allowed to access files using the `$lib` alias ([#2326](https://github.com/sveltejs/kit/pull/2326))
-- Svelte libraries should now work out-of-the-box without any Vite configuration ([#2343](https://github.com/sveltejs/kit/pull/2343))
-- Improvements to package exports field ([#2345](https://github.com/sveltejs/kit/pull/2345) and [#2327](https://github.com/sveltejs/kit/pull/2327))
-- [breaking] The `prerender.pages` config option has been renamed to `prerender.entries` ([#2380](https://github.com/sveltejs/kit/pull/2380))
-- A new generic argument has been added to allow typing Body from hooks ([#2413](https://github.com/sveltejs/kit/pull/2413))
-- The `svelte` field will be added to package.json when running the package command ([#2431](https://github.com/sveltejs/kit/pull/2431))
-- [breaking] The `context` parameter of the load function was renamed to `stuff` ([#2439](https://github.com/sveltejs/kit/pull/2439))
-- Added an `entryPoint` option for building a custom server with `adapter-node` ([#2414](https://github.com/sveltejs/kit/pull/2414))
-- `vite-plugin-svelte` improved support for [useVitePreprocess](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/config.md#usevitepreprocess), which uses Vite to automatically preprocess TypeScript, PostCSS, Scss, etc in Svelte components ([#173](https://github.com/sveltejs/vite-plugin-svelte/pull/173))
-
-To see all updates to SvelteKit, check out the [SvelteKit changelog](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [radiofrance](https://www.radiofrance.fr/) just migrated their website to SvelteKit
-- [FLAYKS](https://flayks.com/) is the portfolio site for Félix Péault made with SvelteKit, Sanity, and Anime.js
-- [hirehive](https://www.hirehive.com/) is a candidate and job tracking site
-- [Microsocial](https://microsocial.xyz/) is an experimental Peer-to-Peer Social Platform
-- [Dylan Ipsum](https://www.dylanlyrics.app/) is a random text generator to replace lorem ipsum with Bob Dylan lyrics
-- [Chip8 Svelte](https://github.com/mikeyhogarth/chip8-svelte) is a CHIP-8 emulator frontend, built on top of CHIP8 TypeScript
-
-**Looking for a Svelte project to work on? Interested in helping make Svelte's presence on the web better?** Check out [the list of open issues](https://github.com/svelte-society/sveltesociety-2021/issues) if you'd like to contribute to the Svelte Society rewrite in SvelteKit.
-
-**Podcasts Featuring Svelte**
-
-- [Syntax Podcast: From React to SvelteKit](https://podcasts.apple.com/us/podcast/from-react-to-sveltekit/id1253186678?i=1000536276106) Scott talks with Wes about moving Level Up Tutorials from React to SvelteKit — why he did it, how, benefits, things to watch out for, and more!
-- [Web Rush Podcast: Svelte Tools and Svelte Society](https://www.webrush.io/episodes/episode-150-svelte-tools-and-svelte-society) Kevin Åberg Kultalahti talks about what Svelte Society is, what he's excited about with Svelte, how important documentation is to any product, and much _much_ more
-- [Svelte: The Compiled Future of Front End](https://www.arahansen.com/the-compiled-future-of-front-end/) details the history of component-based frontends and how a compiler changes everything
-- [Svelte Radio: Contributing to Svelte with Martin 'Grygrflzr' Krisnanto Putra](https://share.transistor.fm/s/10aa305c) Grygrflzr shares his journey to becoming a maintainer and his views on React, Vite and a host of other things
-- [Svelte Radio: Routify 3 with Jake and Willow](https://share.transistor.fm/s/10aa305c) the Svelte Radio crew sits down with the maintainers of Routify and discusses the just-released Routify 3
-- [JS Party: 1Password](https://twitter.com/geoffrich_/status/1441816829853253640?s=20) mentioned on the latest episode of The Changelog's JS Party that they use Svelte to power their in-page suggestions
-
-**Educational Content**
-
-- [How I built a blog with Svelte and SvelteKit](https://fantinel.dev/blog-development-sveltekit/) is an introduction to Svelte, SvelteKit and Progressive Enhancement with code examples
-- [I built a decentralized chat dapp](https://www.youtube.com/watch?v=J5x3OMXjgMc) is a tutorial on how to use popular web3 technologies like GUN to build a decentralized web app (dapp)
-- [Writing a Svelte Store with TypeScript](https://javascript.plainenglish.io/writing-a-svelte-store-with-typescript-22fa1c901a4) is a deep dive into writing Svelte stores with TypeScript
-- [How Svelte scopes component styles](https://geoffrich.net/posts/svelte-scoped-styles/) explains scoping using classes and more complex CSS specifiers
-- [SvelteKit Hooks](https://www.youtube.com/watch?v=RarufLoEL08) shows how to use hooks.js in Sveltekit.. When you're done, check out [Part 2](https://www.youtube.com/watch?v=RmIBG3G0-VY)
-- [An early look at SvelteKit](https://www.infoworld.com/article/3630395/an-early-look-at-sveltekit.html) is a post from Infoworld walking through the features and onboarding of SvelteKit
-
-**Libraries, Tools & Components**
-
-- [sveltekit-netlify-cms](https://github.com/buhrmi/sveltekit-netlify-cms) is a SvelteKit skeleton app configured for use with Netlify CMS
-- [SvelteFireTS](https://github.com/jacobbowdoin/sveltefirets) is a SvelteKit + TypeScript + Firebase library inspired by Fireship.io
-- [stores-x](https://github.com/Anyass3/stores-x) lets you use Svelte stores just like vueX
-- [sveltekit-snippets](https://github.com/stordahl/sveltekit-snippets) is a VS Code extension that provides snippets for common patterns in SvelteKit & Vanilla Svelte
-- [svelte-xactor](https://github.com/wobsoriano/svelte-xactor) is a middleware that allows you to easily convert your xactor machines into a global store that implements the store contract
-- [vite-plugin-pages-svelte](https://github.com/aldy505/vite-plugin-pages-svelte) is a vite plugin for automatic filesystem-based routing
-- [sveltio](https://www.npmjs.com/package/sveltio) is a Svelte wrapper for valtio - a proxy-state library
-- [svelte-transition-classes](https://github.com/rmarscher/svelte-transition-classes) is a custom Svelte transition for adding and swapping CSS classes
-- [Svelte-Boring-Avatars](https://github.com/paolotiu/svelte-boring-avatars) is Svelte port of the popular [Boring Avatars](https://github.com/boringdesigners/boring-avatars) React project
-- [Svelte DataTables](https://github.com/homescriptone/svelte-datatables) brings DataTable, a popular JavaScript library allowing you to easily display your data in a user-friendly table, into your Svelte project.
-- [focus-svelte](https://github.com/chanced/focus-svelte) is a focus trap for Svelte with zero dependencies
-- [filedrop-svelte](https://github.com/chanced/filedrop-svelte) is a file dropzone action & component for Svelte
-
-Check out the community site [sveltesociety.dev](https://sveltesociety.dev/templates/) for more templates, adders and adapters from across the Svelte ecosystem.
-
-## Before you go, answer the call for speakers!
-
-Svelte Summit Fall 2021 (happening 20 November 2021) is looking for speakers. Submit your talk proposal before 30 October... all are welcome to present and attend.
-
-### More info on the [sessionize site](https://sessionize.com/svelte-summit-fall-2021/)
-
-Can't wait for the summit? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-11-01-whats-new-in-svelte-november-2021.md b/documentation/blog/2021-11-01-whats-new-in-svelte-november-2021.md
deleted file mode 100644
index 2ac151af85..0000000000
--- a/documentation/blog/2021-11-01-whats-new-in-svelte-november-2021.md
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: "What's new in Svelte: November 2021"
-description: Over 5000 stars to light up the showcase
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-With SvelteKit crossing the [80% complete mark](https://github.com/sveltejs/kit/milestone/2), over [5000 stars](https://github.com/sveltejs/kit) on GitHub, and now having more usage than Sapper, there's never been a better time to try it out! Many in the community have, making for quite a large showcase this month...
-
-Also, don't miss out on [Svelte Summit](https://sveltesummit.com/) on November 20th - featuring speakers from around the world. Keep an eye out for a watch party in your area 👀
-
-Now onto what's new!
-
-## New in Svelte and SvelteKit
-
-- [svelte.dev](https://svelte.dev/) now runs on SvelteKit alongside [sveltesociety.dev](https://sveltesociety.dev). svelte.dev is a relatively complicated site with live code editing, authentication, and a markdown-based blog - making it a great way for us to really test out SvelteKit
-- A new compiler option, `enableSourcemap`, provides more control over the compiler output for JS and CSS sourcemaps (**3.44.0**). With this new feature, SvelteKit and the Vite Svelte plugin can now properly handle environment variables in `.svelte` templates (See [sveltejs/kit#720](https://github.com/sveltejs/kit/issues/720) and [sveltejs/vite-plugin-svelte#201](https://github.com/sveltejs/vite-plugin-svelte/pull/201))
-- The Svelte Language Tools now support reading the configuration of the VS Code CSS settings ([#1219](https://github.com/sveltejs/language-tools/issues/1219))
-- `vite-plugin-svelte` added a new `experimental.prebundleSvelteLibraries` option that makes it much faster to load Svelte libraries with many components like icon libraries and UI frameworks. The option can be set in the root of `svelte.config.js`. Please test it out and give us feedback!
-- SvelteKit will only route endpoints on the client, unless marked as `rel="external"` - reducing the size of the client JS and making it easier to refactor the router in the future ([2656](https://github.com/sveltejs/kit/pull/2656))
-- SvelteKit no longer supports Node 12 ([2604](https://github.com/sveltejs/kit/pull/2604))
-- SvelteKit was upgraded from Vite 2.6.0 to Vite 2.6.12 fixing an issue where Vite would corrupt the Svelte runtime (https://github.com/vitejs/vite/issues/4306). It also included two fixes from the SvelteKit team to avoid or make diagnosing Vite issues in SvelteKit templates easier (https://github.com/vitejs/vite/pull/5192 and https://github.com/vitejs/vite/pull/5193). Vite 2.7 is currently available in beta with additional fixes for SSR
-
-To see all updates to Svelte and SvelteKit, check out the [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [SvelteKit changelog](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md), respectively.
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [Tangent](http://tangentnotes.com/) is a clean and powerful notes app for Mac & Windows
-- [The Pudding](https://pudding.cool/) is a digital publication that explains ideas debated in culture with visual essays - rebuilt in SvelteKit
-- [Power Switcher](https://powerswitcher.axpo.com/) is an interactive overview of the development of the power supply in Switzerland, as energy sources migrate to cleaner sources
-- [Sublive](https://sub.live/) is a new way of making music by connecting musicians all over the world with a low-latency and high-quality audio network
-- [Vibify](https://www.vibify.me/) helps you find hidden playlists within your music using your Spotify listening history
-- [Browse Marvel Unlimited by Year](https://marvel.geoffrich.net/) is a SvelteKit site to see what issues are available on Marvel Unlimited for a given year
-- [Files](https://files.community/), a modern file explorer for Windows, has a new site rebuilt with SvelteKit
-- [lil-hash](https://github.com/jackbow/lil-hash) is a simple URL shortener that produces easily rememberable and speakable shortened URLs
-- [PWA Haven](https://github.com/ThaUnknown/pwa-haven) is a collection of small, fast, simple PWAs to replace native OS apps
-- [DottoBit](https://dottobit.com/) is a multi-color 16-bit drawing program with URL sharing built-in
-- [Former Fast Document for Print](https://github.com/zummon/former) is an invoice generator with beautiful designs, abilities for international languages and auto calculation
-- [Helvetikon](https://github.com/noahsalvi/helvetikon) is a community maintained dictionary for the Swiss German language
-- [Palitra App](https://palitra.app/) is a search-based color palette generator
-
-**Podcasts Featuring Svelte**
-
-- [Svelte Radio](https://www.svelteradio.com/episodes/svelte-summit-is-coming-up-and-svelte-is-growing) dives into the tech behind the recently released Svelte Summit website and a bunch of other fun stuff!
-- [PodRocket](https://podrocket.logrocket.com/rich-harris), LogRocket's podcast, talks Svelte with Rich Harris
-- [PodRocket also dove deep](https://podrocket.logrocket.com/elderjs) into Elder.js with Nick Reese
-- [Web Rush](https://webrush.io/episodes/episode-153-single-page-application-vs-multi-page-application-with-rich-harris) and Rich Harris talk about the differences between a SPA and MPA, what role the server rendering plays, what client side hydration is, and the state of modern tooling for developing an SPA or MPA
-- [devtools.fm](https://devtools.fm/episode/15) talks with Rich Harris about developing engaging data visualizations and building the tools of tomorrow
-
-**Educational Content**
-
-- [Have Single-Page Apps Ruined the Web?](https://www.youtube.com/watch?v=860d8usGC0o) Rich Harris answers the controversial question at this year's Jamstack Conf
-- [Svelte vs SvelteKit - What's The Difference?](https://www.youtube.com/watch?v=IKhtnhQKjxQ) LevelUpTuts provides a quick guide to explaining the relationship between the two projects. You can check out the rest of Scott Tolinski's guides to Svelte in his new series, ["Weekly Svelte"](https://www.youtube.com/playlist?list=PLLnpHn493BHF-Onm1MQgKC1psvW-rJuYi)
-- [WebJeda's SvelteKit Hooks](https://www.youtube.com/watch?v=RarufLoEL08&list=PLm_Qt4aKpfKgzcTiMT2cgWGBDBIPK06DQ) series continues this month with Part 3 - Cookie Session Authentication
-- [Writing Context Aware Styles in a Svelte App](https://www.ryanfiller.com/blog/tips/svelte-contex-aware-styles) is a guide to writing self-contained components that are able to dynamically adapt to their parents
-- [A Beginner’s Guide to SvelteKit](https://www.sitepoint.com/a-beginners-guide-to-sveltekit/) takes a beginner-friendly look at both Svelte and SvelteKit and build out a simple web app showing profile pages of imaginary users
-- [Svelte vs React: Ending the Debate](https://massivepixel.io/blog/svelte-vs-react/) is a historical take on the age-old argument
-- [Svelte Snacks | Custom Events for Modal Actions](https://jeremydayslice.hashnode.dev/svelte-snacks-or-custom-events-for-modal-actions) walks through a solid implementation of Svelte's handy custom event system
-- [What Svelte's accessibility warnings won't tell you](https://geoffrich.net/posts/svelte-a11y-limits/) explains how Svelte's a11y warnings work and why you shouldn't count on them to make your app accessible
-
-**Libraries, Tools & Components**
-
-- [svelte-adapter-azure-swa](https://github.com/geoffrich/svelte-adapter-azure-swa) is an adapter for Svelte apps that creates an Azure Static Web App, using an Azure function for dynamic server rendering
-- [Inlang](https://docs.inlang.dev/getting-started/svelte-kit) is a localization and internationalization toolkit that now supports SvelteKit
-- [svelte-translate-tools](https://github.com/noelmugnier/svelte-translate-tools) extract/generate/compile translation files for your Svelte App at build time
-- [@egjs/svelte-infinitegrid](https://github.com/naver/egjs-infinitegrid/tree/master/packages/svelte-infinitegrid) lets you implement various grids composed of different card elements whose sizes vary
-- [svelte-reactive-css-preprocess](https://github.com/srmullen/svelte-reactive-css-preprocess) makes it easier to update css variable values whenever your component state changes
-- [Sveltegen](https://github.com/snuffyDev/sveltegen) is a CLI for simple and easy creation of actions, components, and routes
-- [svelte-advanced-multistep-form](https://www.npmjs.com/package/svelte-advanced-multistep-form) helps to wrap form elements passing down styles to the component to be rendered, also it presents each form step in a ordered and stylish way
-- [gQuery](https://github.com/leveluptuts/gQuery) is a GraphQL Fetcher & Cache for SvelteKit
-- [date-picker-svelte](https://github.com/probablykasper/date-picker-svelte) is a date and time picker for Svelte
-- [TwelveUI](https://twelveui.readme.io/reference/what-is-twelveui) is a Svelte component library with accessibility built-in
-- [svelte-outclick](https://github.com/babakfp/svelte-outclick/) is a Svelte component that allows you to listen for clicks outside of an element, by providing you an outclick event
-- [svelte-zero-api](https://github.com/ymzuiku/svelte-zero-api) lets you use SvelteKit APIs like client functions - with support for TypeScript
-- [svelte-recaptcha-v2](https://github.com/basaran/svelte-recaptcha-v2) is a Google reCAPTCHA v2 implementation for Svelte SPA, SSR and sveltekit static sites.
-- [Svelte Body](https://github.com/ghostdevv/svelte-body) lets you apply styles to the body in routes - designed to work with SvelteKit and Routify.
-- [svelte-debug-console](https://github.com/basaran/svelte-debug-console) is a debug.js implementation for Svelte SPA, SSR and sveltekit static sites that lets you see your debug statements in the browser.
-- [SVEO](https://github.com/didier/sveo) is a dependency-free approach to declare metadata on SvelteKit pages
-- [@svelte-drama/suspense](https://www.npmjs.com/package/@svelte-drama/suspense) is a Svelte component that implements the core idea of React's `<Suspense>`. Also check out [SWR for Svelte](https://www.npmjs.com/package/@svelte-drama/swr) to make refetching even easier.
-- [sveltekit-adapter-browser-extension](https://github.com/antony/sveltekit-adapter-browser-extension) is an adapter for SvelteKit which turns your app into a cross-platform browser extension
-
-Check out the community site [sveltesociety.dev](https://sveltesociety.dev/templates/) for more tools, templates, adders and adapters from across the Svelte ecosystem.
-
-Looking for more Svelte goodness? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
diff --git a/documentation/blog/2021-12-01-whats-new-in-svelte-december-2021.md b/documentation/blog/2021-12-01-whats-new-in-svelte-december-2021.md
deleted file mode 100644
index 1f70a7c7e7..0000000000
--- a/documentation/blog/2021-12-01-whats-new-in-svelte-december-2021.md
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: "What's new in Svelte: December 2021"
-description: 'Svelte Summit Fall 2021 Recap, Rich Harris joins Vercel, and Kevin goes full-time on Svelte Society'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-With SvelteKit getting more and more stable each day, there's not much to cover in terms of code changes other than bug fixes... So, in this month's newsletter, we'll be covering Svelte Summit Fall 2021!
-
-If you want to dive deep into the last month's worth of bug fixes, check out the [Svelte](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md) and [SvelteKit](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md) changelogs, respectively.
-
-## What happened at Svelte Summit?
-
-If you missed Svelte Summit, you can watch the entire live stream on [YouTube](https://www.youtube.com/watch?v=1Df-9EKvZr0) and catch a recap in the [#svelte-summit channel on Discord](https://discord.gg/YmHcdnhu).
-
-Here are the highlights:
-
-- [Rich Harris](https://twitter.com/rich_harris) took us through a tour of Svelte's history and announced [his move to Vercel](https://vercel.com/blog/vercel-welcomes-rich-harris-creator-of-svelte) - where he will be helping maintain Svelte full-time! ([20:00](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=1200s))
-- [Steph Dietz](https://twitter.com/steph_dietz_) explained how Svelte's simple abstractions makes it easy for beginners and experts alike to learn and use JavaScript - without the boilerplate ([29:00](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=1740s))
-- [Kevin Bridges](https://twitter.com/kevinast) dove deep into Svelte's reactivity logic by visualizing it through `ReflectiveCounter` and showing how to "fine tune" it, as needed. A full "syllabus" for the presentation is available on [Kevin's site](https://wiibridges.com/presentations/ResponsiveSvelte/). ([42:55](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=2575s))
-- [Mateo Morris](https://twitter.com/_mateomorris) launched [Primo](https://primo.af/), an all-in-one SvelteKit CMS to help build and manage static sites ([1:12:34](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=4354s))
-- [Guillermo Rauch](https://vercel.com/about/rauchg) explained Vercel's commitment to Svelte, what it means to have Rich on the team, and what's coming next from the company... ([1:21:54](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=4914s))
-- [Geoff Rich](https://twitter.com/geoffrich_) introduced various ways to modify motion and transitions within Svelte to be more accessible to all users of the web. Slides and a full transcription of the talk are available on [Geoff's site](https://geoffrich.net/posts/svelte-summit-2021/). ([1:32:30](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=5550s))
-- [Dean Fogarty](https://df.id.au/) demoed a number of different use-cases for custom stores - transforming data to and from storage mechanisms within Svelte. Transcript and code is available on [Dean's GitHub](https://github.com/angrytongan/svelte-summit-2021). ([1:43:06](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=6186s))
-- [Kellen Mace](https://twitter.com/kellenmace) shared how we can let content creators keep using WordPress, while leveraging Svelte on the frontend to provide a phenomenal user experience ([1:49:30](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=6570ss))
-- [Ben Holmes](https://twitter.com/bholmesdev) explained the "islands" architecture and how 11ty + [Slinkity](https://slinkity.dev/) can bring these islands to any HTML template ([2:17:15](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=8235s))
-- [Scott Tolinski](https://twitter.com/stolinski) shared the lessons learned from rewriting the React-based LevelUpTutorials in Svelte and "found developer bliss" ([3:16:35](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=11795s))
-- [Svelte Sirens](https://sveltesirens.dev) was announced as the new Svelte community for women, non-binary and allies. Their first event was on November 29th - all future events can be found on [the Svelte Sirens website](https://sveltesirens.dev/events) ([3:50:45](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=13845s))
-- [Rich Harris](https://twitter.com/rich_harris) discussed creating libraries with SvelteKit, better ways to link packages when developing, and how SvelteKit helps with modern JavaScript library development ([3:56:00](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=14160s))
-- [Ken Kunz](https://twitter.com/kennethkunz) explained how finite state machines (and the svelte-fsm library) can make managing Svelte component states more... manageable. Examples from the talk are available on [Ken's GitHub](https://github.com/kenkunz/svelte-fsm/wiki/Examples). ([4:07:18](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=14838s))
-- [Austin Crim](https://twitter.com/crim_codes) connected learning to code on the web to learning how to play an instrument. By giving learners early wins and introducing the fundamentals through real-world apps, learning Svelte (and the fundamentals underneath) doesn't have to be a chore ([4:21:50](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=15710s))
-- [Jesse Skinner](https://twitter.com/JesseSkinner) brought our legacy apps into the future by explaining how to use (and reuse) Svelte components within React (and even jQuery!) projects ([4:32:30](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=16350s))
-- [Jim Fisk](https://twitter.com/jimafisk) and [Stephanie Luz](https://stephanie-luz.medium.com/) introduced [Plenti](https://plenti.co/) and its theming tools to make building new Svelte sites much faster ([4:59:00](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=17940s))
-- [Evyatar Alush](https://twitter.com/evyataral) helped us all make (and maintain) better forms using a powerful validation library called [Vest](https://github.com/ealush/vest) ([5:08:55](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=18535s))
-- Dominik G. presented a fresh take on icon libraries - one that reduces the bundle size of applications and opens up the entire iconify library for use in any Svelte app ([5:30:04](https://www.youtube.com/watch?v=1Df-9EKvZr0&t=19804s))
-
-Thanks to [Kevin](https://twitter.com/kevmodrome) and all the Svelte Society volunteers for pulling together such an amazing event! Excitingly, [Kevin announced](https://twitter.com/kevmodrome/status/1463151477174714373) after the event that he will now be working full-time on Svelte Society! You can check out all the talks, broken up into individual videos for convenience, in [this Svelte Society YouTube Playlist](https://www.youtube.com/playlist?list=PL8bMgX1kyZTg2bI9IOMgfBc8lrU3v2itt).
-
-If you have feedback on the Svelte Summit, Kev is [looking for feedback on the Svelte subreddit](https://www.reddit.com/r/sveltejs/comments/qzgo3k/svelte_summit_feedback/) 👀
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [pixeldrain](https://github.com/Fornaxian/pixeldrain_web) is a free-to-use file sharing platform
-- [LifeHash](http://lifehash.info/) generates beautiful visual hashes from Blockchain Commons
-- [simple-cloud-music](https://github.com/dufu1991/simple-cloud-music) is a lightweight third-party NetEase cloud music player for modern browsers (likely only works on Chrome)
-- [palette.rocks](https://palette.rocks/) is a color palette generator with contrast-checking built-in
-- [Kadium](https://github.com/probablykasper/kadium) is an app for staying on top of YouTube channel uploads
-- [Multi-Monitor Calculator](https://multimonitorcalculator.com/) is a tool for planning your multi-monitor setup
-- [Your Home](https://yourhome.fb.com/) is an interactive overview of Facebook's privacy settings
-- [Svelte Crush](https://svelte-crush.netlify.app/) is a Candy Crush style match-3 game
-- [100.000 Corona deaths in Germany](https://twitter.com/h_i_g_s_c_h/status/1463767113563353089?s=20) is a visualization made for Spiegel Gesundheit
-
-**Looking for a Svelte project to work on? Interested in helping make Svelte's presence on the web better?** Check out [the list of open issues](https://github.com/svelte-society/sveltesociety-2021/issues) if you'd like to contribute to the Svelte Society rewrite in SvelteKit.
-
-**Videos, Blogs and Podcasts**
-
-- [How To Make and Publish a Svelte Library](https://www.youtube.com/watch?v=_TymiadmPrc)
-- [SvelteKit is now fully supported in WebContainers](https://blog.stackblitz.com/posts/sveltekit-supported-in-webcontainers/)
-- [Introducing Svelte, and Comparing Svelte with React and Vue](https://joshcollinsworth.com/blog/introducing-svelte-comparing-with-react-vue)
-- [Testing a Svelte app with Jest](https://www.roboleary.net/2021/11/18/svelte-app-testing-jest.html)
-- [How to create a toast notification library package with SvelteKit](https://www.sarcevic.dev/blog/toasting-in-svelte)
-- [Svelte training: Here you can learn Svelte](https://sustainablewww.org/principles/svelte-training-here-you-can-learn-svelte)
-- [Introduction to Svelte Actions](https://blog.logrocket.com/svelte-actions-introduction/)
-- [Enjoy making DAPPs using SvelteWeb3](https://chiuzon.medium.com/enjoy-making-dapps-using-svelteweb3-b78dfea1d902)
-- [Svelte creator: Web development should be more fun](https://www.infoworld.com/article/3639521/svelte-creator-web-development-should-be-more-fun.html)
-- [Svelte Radio: Rich Harris is now working full-time on Svelte 🤯](https://share.transistor.fm/s/d9b04961)
-- [Web Rush: Svelte and Elder.js with Nick Reese](https://webrush.io/episodes/episode-158-svelte-and-elderjs-with-nick-reese)
-- [Building SvelteKit applications with Serverless Redis](https://blog.upstash.com/svelte-with-serverless-redis)
-
-**Libraries, Tools & Components**
-
-- [svelte-cubed](https://github.com/Rich-Harris/svelte-cubed) is a Three.js component library for Svelte - created by Rich Harris for his presentation at Svelte Summit Fall 2021
-- [svelte-fsm](https://github.com/kenkunz/svelte-fsm) is a tiny, simple, expressive, pragmatic Finite State Machine (FSM) library, optimized for Svelte
-- [bromb](https://github.com/samuelstroschein/bromb) is a feedback widget for websites/web apps that is small and easy to integration/self-host
-- [Spaper](https://github.com/Oli8/spaper) is a set of PaperCSS components for Svelte
-- [svelte-intl-precompile](https://github.com/cibernox/svelte-intl-precompile) is an i18n library for Svelte that analyzes and compiles your translations at build time
-- [svelte-preprocess-svg](https://github.com/svitejs/svelte-preprocess-svg) automatically optimizes inline svg in Svelte components for better performance and reduced file size
-- [svelte-subcomponent-preprocessor](https://github.com/srmullen/svelte-subcomponent-preprocessor) allows you to write more than one component within a svelte file
-- [svelte-pdfjs](https://github.com/gtm-nayan/svelte-pdfjs) is a crude implementation of a Svelte PDF viewer component
-- [svelte-inview](https://github.com/maciekgrzybek/svelte-inview) is a Svelte action that monitors an element enters or leaves the viewport/parent element
-- [sveltekit-adapter-wordpress-shortcode](https://github.com/tomatrow/sveltekit-adapter-wordpress-shortcode) is an adapter for SvelteKit which turns your app into a wordpress shortcode
-- [svelte-websocket-store](https://github.com/arlac77/svelte-websocket-store) is a Svelte store with a websocket backend
-- [Svelte Auto Form](https://github.com/leveluptuts/auto-form) is a fast and fun form library focused on ease of use, rather than flexibility.
-- [set-focus](https://www.npmjs.com/package/@svackages/set-focus) is an Svelte action that will set focus on `<a>` or `<button>` elements as soon as they mount - useful for some experiences and testing
-
-Got an idea for SvelteKit? Check out the new [GitHub Discussions](https://github.com/sveltejs/kit/discussions) in the Svelte repo. You can also join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs).
-
-See you next ~~month~~ year!
diff --git a/documentation/blog/2022-01-01-whats-new-in-svelte-january-2022.md b/documentation/blog/2022-01-01-whats-new-in-svelte-january-2022.md
deleted file mode 100644
index 1e021fa54b..0000000000
--- a/documentation/blog/2022-01-01-whats-new-in-svelte-january-2022.md
+++ /dev/null
@@ -1,81 +0,0 @@
----
-title: "What's new in Svelte: January 2022"
-description: 'Faster builds with SvelteKit and a much anticipated REPL feature'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Happy new year, Svelte Community! Lots to share this month across Svelte, SvelteKit, Language Tools and the Showcase. Thanks to everyone who made 2021 a great year to use Svelte. Looking forward to the next one 🚀
-
-## What's new in SvelteKit
-
-- `@sveltejs/adapter-static` for SvelteKit now has a `precompress` option to make brotli compression of assets and pages easier to do out of the box ([#3079](https://github.com/sveltejs/kit/pull/3079))
-- Concurrency mode in SvelteKit will now prerender pages in parallel ([#3120](https://github.com/sveltejs/kit/pull/3120)). It is enabled by default in `1.0.0-next.205` and later
-- CSS is now automatically included before JS for improved page performance ([d13efe](https://github.com/sveltejs/kit/commit/d138efe21692f5925f1e89afc0a33f42d6a1a711))
-- A new config option adds the ability to disable service worker registration to do your own custom registration ([#2988](https://github.com/sveltejs/kit/pull/2988))
-- SSR route-splitting is here - breaking monolithic builds into smaller pieces for improved startup and routing performance ([#2931](https://github.com/sveltejs/kit/pull/2931))
-- `request.origin/path/query` is now `request.url` - simplifying the config and page `load` functions ([#3126](https://github.com/sveltejs/kit/pull/3126))
-- After the [update to Vite 2.7](https://github.com/sveltejs/kit/pull/3018), SvelteKit users are [reporting significant performance improvements](https://www.reddit.com/r/sveltejs/comments/rljhfc/sveltekit_massive_compiler_improvement_by/) and loading third-parties libraries in SSR has also been greatly improved
-- SvelteKit server will now automatically restart when the config files is changed ([vite-plugin-svelte#237](https://github.com/sveltejs/vite-plugin-svelte/pull/237))
-
-## Other new bits from `svelte/*`
-
-- [Svelte 3.44.3](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#3443) is out with a few bug fixes in the binding and loop code
-- Svelte Language Tools has introduced support for the then/catch shorthands from Svelte 3.41 and TypeScript's "go to" functionality ([105.8.0 and later](https://github.com/sveltejs/language-tools/releases/tag/extensions-105.8.0))
-- The Svelte REPL got a nice upgrade as well - letting you delete saved REPLs. Try it out by logging in at [svelte.dev/apps](https://svelte.dev/apps)
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [Discover Twitter Spaces](https://github.com/navneetsharmaui/discover-twitter-spaces) is a tool that helps you find the Twitter Spaces
-- [Modern Fluid Typography Editor](https://github.com/codeAdrian/modern-fluid-typography-editor) helps create beautiful fluid typography using CSS clamp
-- [Unnwhiteboard](https://github.com/AviKKi/unnwhiteboard) is a job board for companies (or teams) that don't do "whiteboard" interviews
-- [Secret Santa](https://gitlab.com/arturoguzman/secret-santa-sveltekit) is a gift giving coordination app developed with easiness in mind
-- [LogSnag](https://logsnag.com/) notifies you of your projects' events and provides you with a timeline to keep track of anything important that happens
-- [Version 0.2 of Tangent](http://tangentnotes.com/Download), a Svelte-based note writing app, is now in beta
-- [Intl Explorer](https://github.com/jesperorb/intl-explorer) is a tool for viewing output for all possible formatters for Intl
-
-A lot of work this month has gone into migrating the Svelte main website and Svelte REPL to live in the https://github.com/sveltejs/sites repository - including a brand new homepage for [svelte.dev](https://svelte.dev/). Thanks to all the contributors who made this possible!
-
-If you're looking for a fun SvelteKit project to work on, [you can contribute to the Svelte Society site rewrite](https://github.com/svelte-society/sveltesociety-2021/issues) 💅
-
-**Learning and Listening**
-
-_To Read_
-
-- [Mutating Query Params in SvelteKit Without Page Reloads or Navigations](https://dev.to/mohamadharith/mutating-query-params-in-sveltekit-without-page-reloads-or-navigations-2i2b) by Mohamad Harith
-- [Svelte for Reactaholics : A guide for React developers](https://www.100ms.live/blog/svelte-guide-for-react-developers) by Puru Vijay
-- [Svelte's lifecycle methods can be used anywhere](https://geoffrich.net/posts/svelte-lifecycle-examples/) and [The many meanings of $ in Svelte](https://geoffrich.net/posts/svelte-$-meanings/) by Geoff Rich
-- [Vercel and Svelte: A Perfect Match for Web Developers](https://thenewstack.io/vercel-and-svelte-a-perfect-match-for-web-developers/) by Darryl K. Taft
-- [User-defined TailwindCSS Color Scheme with Svelte Stores](https://blog.dayslice.io/user-defined-tailwindcss-color-scheme-with-svelte-stores-ad80ca2cf038) by jeremy zaborowski
-- [Ionic 6 + Svelte 🚀](https://medium.com/@raymondboswel/ionic-6-svelte-ae904caa82df) by Raymond Boswel
-- [What happened in #Svelte language tools this year](https://twitter.com/dummdidumm_/status/1474158105395179525?t=ytj2K2Q52iD5-lNyLnQaAQ&s=19) by Simon H
-
-_To Watch_
-
-- [The Future of Svelte (Interview with Rich Harris)](https://www.youtube.com/watch?v=uQntFkK8Z54) by Lee Robinson, Director of Developer Relations at Vercel
-- [Svelte is becoming the go-to framework](https://www.youtube.com/watch?v=fo6BKY2xR2w&t=1834s) for Obsidian plugin developers
-- [Sveltekit WordPress Headless Blog](https://www.youtube.com/watch?v=c0UDVgjPxFw) by WebJeda
-- [Getting started with SvelteKit](https://www.youtube.com/watch?v=i2suPKMPUFA) by Lihau Tan
-- [Deploy a full-stack SvelteKit app on Cloudflare Pages](https://www.youtube.com/watch?v=Wc1_U6Dy5Tw) by 1nf
-
-_To Listen To_
-
-- [Syntax podcast: How To Do Things In Svelte](https://podcasts.apple.com/ca/podcast/how-to-do-things-in-svelte/id1253186678?i=1000544796072)
-- [JS Party #205: So much Sveltey goodness (w/ Rich Harris)](https://changelog.com/jsparty/205)
-
-**Libraries, Tools & Components**
-
-- [svelte-headlessui](https://github.com/rgossiaux/svelte-headlessui) is an unofficial, complete Svelte port of the Headless UI component library
-- [svelte-forms v2](https://chainlist.github.io/svelte-forms/) has been released - the author is [looking for feedback](https://www.reddit.com/r/sveltejs/comments/r6354j/svelteforms_v2_has_been_released/)
-- [Percival](https://github.com/ekzhang/percival) is a declarative data query and visualization language
-- [Svelte FlatList](https://github.com/snuffyDev/svelte-flatlist) is a mobile-friendly, simple, and customizable draggable menu
-- [svelte-keyed](https://github.com/bryanmylee/svelte-keyed) is a writable derived store for objects and arrays
-- [Svemix](https://github.com/svemix/svemix) is Remix for Svelte - providing server scripts inside your Svelte components/routes, which will be transformed into endpoints
-
-Want to add something to the showcase? Need help bringing your next idea to life in Svelte? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs).
-
-See ya next month!
diff --git a/documentation/blog/2022-01-13-accelerating-sveltes-development.md b/documentation/blog/2022-01-13-accelerating-sveltes-development.md
deleted file mode 100644
index db94a5ca2f..0000000000
--- a/documentation/blog/2022-01-13-accelerating-sveltes-development.md
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: "Accelerating Svelte's Development"
-description: 'Scaling the team, building partnerships, and growing the community'
-author: Ben McCann
-authorURL: https://www.benmccann.com/
----
-
-[Svelte](/) is a frontend framework for building fast reactive web apps with less code. If you’re new here, [check out the tutorial](/tutorial) or [examples](/examples) to get a feel for it.
-
-Svelte was [launched 5 years ago](https://news.ycombinator.com/item?id=13069841) and has [come a long way in the time since](https://www.youtube.com/watch?v=YeY5M29-WcY). In 2021, as usage more than doubled, it was voted the [most loved](https://insights.stackoverflow.com/survey/2021#section-most-loved-dreaded-and-wanted-web-frameworks) framework with the [most satisfied](https://2020.stateofjs.com/en-US/technologies/front-end-frameworks/) developers in a pair of surveys. Alongside high-profile companies like The New York Times, Apple, Spotify, Square, Rakuten, Bloomberg, Reuters, Ikea, Brave, and countless others, Svelte is used to power everything from hobby projects to embedded systems interfaces.
-
-To help developers build fully-featured applications with Svelte without worrying about the hard parts, we’ve been developing the [SvelteKit](https://kit.svelte.dev/) application framework. We’re moving quickly towards a [stable 1.0 release](https://github.com/sveltejs/kit/issues?q=is%3Aopen+is%3Aissue+milestone%3A1.0) with the help of early adopters who have already downloaded SvelteKit almost one million times.
-
-## Scaling the team
-
-Rich Harris, Svelte’s creator, has [joined Vercel to work on Svelte full-time](https://vercel.com/blog/vercel-welcomes-rich-harris-creator-of-svelte). We’re incredibly excited to have Rich’s level of involvement in Svelte increase even more and have him steward Svelte into the future.
-
-Svelte has been made possible by the work of a large, dedicated community. Svelte has added numerous core maintainers over the course of the pandemic, including three this past week. In alphabetical order:
-
-- [benmccann](https://github.com/benmccann) - primary maintainer of SvelteKit for much of 2021
-- [bluwy](https://github.com/bluwy) - major contributor across SvelteKit, vite-plugin-svelte, and Vite
-- [dominikg](https://github.com/dominikg) - creator of vite-plugin-svelte
-- [dummdidumm](https://github.com/dummdidumm) - maintainer of language-tools, which includes the VS Code extension and `svelte-check`
-- [ehrencrona](https://github.com/ehrencrona) - contributor to SvelteKit and uses Svelte at work
-- [geoffrich](https://github.com/geoffrich) - has driven efforts to improve the accessibility of the Svelte site and documentation
-- [GrygrFlzr](https://github.com/GrygrFlzr) - holds a unique status as a maintainer of both SvelteKit and Vite
-- [Halfnelson](https://github.com/Halfnelson) - creator of svelte-native
-- [ignatiusmb](https://github.com/ignatiusmb) - regular SvelteKit contributor especially to TypeScript support
-- [jasonlyu123](https://github.com/jasonlyu123) - maintainer of language-tools, which includes the VS Code extension and `svelte-check`
-- [kaisermann](https://github.com/kaisermann) - creator of svelte-preprocess
-- [RedHatter](https://github.com/RedHatter) - creator of Svelte Devtools
-- [rixo](https://github.com/rixo) - creator of svelte-hmr
-
-Svelte began accepting donations via [OpenCollective](https://opencollective.com/svelte) last year and has now had over $60,000 donated to-date with [Cohere](https://cohere.ai/) giving $10,000 just today. We hope that these funds will allow existing maintainers to spend more time on Svelte or that the funds could otherwise support Svelte on a part-time or contract basis, which we will continue to investigate.
-
-## Partnerships
-
-Multiple major cloud vendors are stepping up to make deploying SvelteKit applications anywhere a seamless experience. As a result of Rich’s new job, SvelteKit will soon run on [Vercel Edge Functions](https://vercel.com/features/edge-functions). Netlify has made [big contributions](https://github.com/sveltejs/kit/pull/2113) to the SvelteKit Netlify adapter and also [updated](https://github.com/dependents/node-precinct/pull/88) their zip-it-and-ship-it tool to better support SvelteKit. The recent [Cloudflare Pages launch](https://blog.cloudflare.com/cloudflare-pages-goes-full-stack/) featured SvelteKit as a day one partner via a [new adapter](https://github.com/sveltejs/kit/tree/master/packages/adapter-cloudflare) written by Svelte maintainers [pngwn](https://twitter.com/evilpingwin) and [lukeed](https://twitter.com/lukeed05), the latter of whom joined Cloudflare in 2021. [Begin](https://begin.com) created a [SvelteKit adapter](https://github.com/architect/sveltekit-adapter) for [Architect](https://arc.codes) apps. And community members have [contributed adapters](https://sveltesociety.dev/components#adapters) for environments such as Firebase and Deno, showcasing SvelteKit’s ability to run wherever JavaScript does.
-
-We’ve also been working closely with the [Vite](https://vitejs.dev) team to iron out SSR issues uncovered by SvelteKit users. Vite is the build tool that makes the SvelteKit developer experience possible, and thanks to hard work from a contributor base that includes representatives of multiple frameworks, recent releases have solved almost all the issues we’ve been tracking as SvelteKit 1.0 release blockers.
-
-## A growing community
-
-[SvelteSociety](https://sveltesociety.dev/) just hosted the [4th Svelte Summit](https://sveltesummit.com/) — [read a summary here](https://svelte.dev/blog/whats-new-in-svelte-december-2021#what-happened-at-svelte-summit) — and Kevin Åberg Kultalahti is [going full-time to lead SvelteSociety](https://twitter.com/kevmodrome/status/1463151477174714373). In addition to hosting Svelte Summit, Kevin and SvelteSociety host and manage the [Svelte Radio podcast](https://www.svelteradio.com/), the [SvelteSociety YouTube channel](https://www.youtube.com/SvelteSociety), and the [Svelte subreddit](https://www.reddit.com/r/sveltejs). SvelteSociety has become the home of all things related to the Svelte community, with the sveltejs/community and sveltejs/integrations repos being retired in favor of [sveltesociety.dev](https://sveltesociety.dev/), which has been redesigned and rebuilt in SvelteKit. In October [Brittney Postma](https://github.com/brittneypostma), [Willow aka GHOST](https://ghostdev.xyz), [Steph Dietz](https://github.com/StephDietz), and [Gen Ashley](https://twitter.com/coderinheels) founded [Svelte Sirens](https://sveltesirens.dev/), a group for women & non-binary community members and their allies.
-
-Hundreds of developers join the Svelte Discord every week to chat about Svelte. You may have noticed that, as of recently, some members of the server have purple names. These are people with the ambassadors role, which was created to recognise some of the community’s most valued members and help manage the demands of a rapidly growing community. Svelte ambassadors are people who are well known for their helpfulness and contributions and for upholding Svelte’s reputation as a friendly, welcoming community, and we’re deeply grateful for their involvement. The initial ambassadors in alphabetical order are:
-
-- [babichjacob](https://github.com/babichjacob)
-- [brady fractal](https://github.com/FractalHQ)
-- [brittney postma](https://github.com/brittneypostma)
-- [d3sandoval](https://github.com/d3sandoval)
-- [geoffrich](https://github.com/geoffrich)
-- [kev](https://github.com/kevmodrome)
-- [puru](https://github.com/PuruVJ)
-- [rainlife](https://github.com/stephane-vanraes)
-- [rmunn](https://github.com/rmunn)
-- [stolinski](https://github.com/stolinski)
-- [swyx](https://github.com/sw-yx)
-- [theo](https://github.com/theo-steiner)
-
-We’re also testing out [GitHub discussions on SvelteKit](https://github.com/sveltejs/kit/discussions) and may bring this to other repos in the Svelte organization if feedback is positive.
-
-## Things to watch
-
-SvelteKit is continuing to progress towards 1.0 and, in just the past week, we have added major features like [improved client-only rendering](https://github.com/sveltejs/kit/pull/2804), [routing hooks](https://github.com/sveltejs/kit/pull/3293), and [the ability to pass data from child components to layouts](https://github.com/sveltejs/kit/pull/3252) (e.g. to support easier management of `<meta>` tags). We're currently working on a number of other high priority items such as discussing API designs for features like streaming and file uploads and contributing to the upcoming Vite 2.8 release.
-
-While a lot of effort has been going into SvelteKit recently, we continue to progress the entire ecosystem. [Svelte 3.46.0](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#3460) was one of our biggest releases in awhile with two major new features added: [constants in markup](https://github.com/sveltejs/rfcs/blob/master/text/0007-markup-constants.md) and [style directives](https://github.com/sveltejs/rfcs/blob/master/text/0008-style-directives.md).
-
-Svelte and SvelteKit’s trajectories have been accelerated by the numerous investments above and there will be many more updates to come — subscribe to the [blog](/blog) via [RSS](https://svelte.dev/blog/rss.xml) or check monthly to be the first to get them.
diff --git a/documentation/blog/2022-02-01-whats-new-in-svelte-february-2022.md b/documentation/blog/2022-02-01-whats-new-in-svelte-february-2022.md
deleted file mode 100644
index ab11a2fac1..0000000000
--- a/documentation/blog/2022-02-01-whats-new-in-svelte-february-2022.md
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: "What's new in Svelte: February 2022"
-description: 'Rapid-fire releases across Svelte, SvelteKit and the community'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Happy February, everyone! Over the last month or so, we've seen Svelte and SvelteKit [develop at rapid speed](accelerating-sveltes-development), new community rules across the [Reddit](https://www.reddit.com/r/sveltejs/comments/s9n8ou/new_rules/), [GitHub](https://github.com/sveltejs/community/blob/main/CODE_OF_CONDUCT.md) and [Discord](https://discord.com/channels/457912077277855764/831611707667382303/935264550436102315), and quite a few amazing apps, tutorials and libraries.
-
-Let's take a look...
-
-## Highlights from the Svelte changelog
-
-- **3.45.0** brought a [new a11y warning `a11y-no-redundant-roles`](https://svelte.dev/docs#accessibility-warnings-a11y-no-redundant-roles), destructuring and caching fixes
-- **3.46.0** added the much requested [`{@const}` tag](https://svelte.dev/docs#template-syntax-const) and [`style:` directive](https://svelte.dev/docs#template-syntax-element-directives-style-property)
-- Check out **3.46.1 - 3.46.3** for fixes to the `{@const}` tag and `style:` directive, along with a number of fixes to animations
-- [AST output is now available in the Svelte REPL](https://svelte.dev/repl/hello-world)
-
-## What's new in SvelteKit
-
-- `inlineStyleThreshold` allows you to specify where inline stylesheets are inserted into the page ([Docs](https://kit.svelte.dev/docs/configuration#inlinestylethreshold), [#2620](https://github.com/sveltejs/kit/pull/2620))
-- `beforeNavigate`/`afterNavigate` lifecycle functions lets you add functionality before or after a page navigation ([Docs](https://kit.svelte.dev/docs/modules#$app-navigation), [#3293](https://github.com/sveltejs/kit/pull/3293))
-- Platform context can now be passed from adapters ([Docs](https://kit.svelte.dev/docs/adapters#supported-environments-platform-specific-context), [#3429](https://github.com/sveltejs/kit/pull/3429))
-- Hooks now have an `ssr` parameter in `resolve` to make it easier to skip SSR, when needed ([Docs](https://kit.svelte.dev/docs/hooks#handle), [#2804](https://github.com/sveltejs/kit/pull/2804))
-- `$page.stuff` provides a mechanism for pages to pass data 'upward' to layouts ([Docs](https://kit.svelte.dev/docs/loading#input-stuff), [#3252](https://github.com/sveltejs/kit/pull/3252))
-- Fallthrough routes let you specify where to route when an route can't be loaded ([Docs](https://kit.svelte.dev/docs/routing#advanced-routing-fallthrough-routes), [#3217](https://github.com/sveltejs/kit/pull/3217))
-
-**New configs**
-
-- Content Security Policy (CSP) is now supported for increased security when using inline javascript or stylesheets ([Docs](https://kit.svelte.dev/docs/configuration#csp), [#3499](https://github.com/sveltejs/kit/pull/3499))
-- `kit.routes` config allows you to customise public/private modules during build ([Docs](https://kit.svelte.dev/docs/configuration#routes), [#3576](https://github.com/sveltejs/kit/pull/3576))
-- `prerender.createIndexFiles` config lets you prerender index.html files as their subfolder's name ([Docs](https://kit.svelte.dev/docs/configuration#prerender), [#2632](https://github.com/sveltejs/kit/pull/2632))
-- HTTP methods can now be overridden using `kit.methodOverride` ([Docs](https://kit.svelte.dev/docs/routing#endpoints-http-method-overrides), [#2989](https://github.com/sveltejs/kit/pull/2989))
-
-**Config changes**
-
-- `config.kit.hydrate` and `config.kit.router` are now nested under `config.kit.browser` ([Docs](https://kit.svelte.dev/docs/configuration#browser), [3578](https://github.com/sveltejs/kit/pull/3578))
-
-**Breaking change**
-
-- use `Request` and `Response` objects in endpoints and hooks ([#3384](https://github.com/sveltejs/kit/pull/3384))
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [timb(re)](https://paullj.github.io/timb) is a live music programming environment
-- [Music for Programming](https://musicforprogramming.net/latest/) is a series of mixes intended for listening while `${task}` to focus the brain and inspire the mind
-- [Team Tale](https://teamtale.app/) allows two authors to write the same story in a tag-team sort of fashion
-- [Puzzlez](https://www.puzzlez.io/) is an online place to play Sudoku and Wordle
-- [Closed Caption Creator](https://www.closedcaptioncreator.com/) makes it easy to add subtitles to your video on Windows, Mac and Google Chrome
-- [SC3Lab](https://sc3-lab.netlify.app/) is a code generator for experimenting with svelte-cubed and three.js
-- [Donkeytype](https://github.com/0ql/Donkeytype) is a minimalistic and lightweight typingtest inspired by Monkeytype.
-- [Above](https://above.silas.pro/) is a visual routine timer built for the ADHD/autistic mind
-- [base.report](https://base.report/) is a modern research platform for serious investors
-- [String](https://string.kampsy.xyz/) turns your Phone into a secure portable audio recorder, making it easy to capture and share personal notes, family moments, classroom lectures, and more
-- [The Raytracer Challenge REPL](https://github.com/jakobwesthoff/the_raytracer_challenge_repl) provides a live editor interface to configure a raytraced scene and render it live in any modern browser
-- [awesome-svelte-kit](https://github.com/janosh/awesome-svelte-kit) is a list of awesome examples of SvelteKit in the wild
-- [Map Projection Explorer](https://www.geo-projections.com/) lets you explore different map projections and explains their differences
-- [Rubiks](https://github.com/MeharGaur/rubiks) is a Rubik's Cube simulator
-- [Pianisto](https://pianisto.net/) is a working piano made with SVG, ToneJS and a lot of patience
-
-Want to work on a SvelteKit site with others, [try contributing to the Svelte Society site](https://github.com/svelte-society/sveltesociety-2021/issues)!
-
-**Learning and Listening**
-
-_To Read_
-
-- [Accelerating Svelte's Development](https://svelte.dev/blog/accelerating-sveltes-development) by Ben McCann
-- [Storybook for Vite](https://storybook.js.org/blog/storybook-for-vite/)
-- [Let's learn SvelteKit by building a static Markdown blog from scratch](https://joshcollinsworth.com/blog/build-static-sveltekit-markdown-blog) by Josh Collinsworth
-- [Building an iOS app with Svelte, Capacitor and Firebase](https://harryherskowitz.com/2022/01/05/tapedrop-app.html) by Harry Herskowitz
-- [Mutating Query Params in SvelteKit Without Page Reloads or Navigations](https://dev.to/mohamadharith/mutating-query-params-in-sveltekit-without-page-reloads-or-navigations-2i2b) and [Workaround for Bubbling Custom Events in Svelte](https://dev.to/mohamadharith/workaround-for-bubbling-custom-events-in-svelte-3khk) by Mohamad Harith
-- [How to build a full stack serverless application with Svelte and GraphQL](https://dev.to/shadid12/how-to-build-a-full-stack-serverless-application-with-svelte-graphql-and-fauna-5427) by Shadid Haque
-- [How to Deploy SvelteKit Apps to GitHub Pages](https://sveltesaas.com/articles/sveltekit-github-pages-guide/)
-- [Creating a dApp with SvelteKit](https://anthonyriley.org/2021/12/31/creating-a-dapp-with-sveltekit/) by Anthony Riley
-- [Comparing Svelte Reactivity Options](https://opendirective.net/2022/01/06/comparing-svelte-reactivity-options/) by Steve Lee
-
-_To Watch_
-
-- [Integrating Storybook with SvelteKit](https://www.youtube.com/watch?v=Kc1ULlfyUcw) and [Integrating FaunaDB with Svelte](https://www.youtube.com/watch?v=zaoLZc76uZM) by the Svelte Sirens
-- [SvelteKit Crash Course Tutorial](https://www.youtube.com/watch?v=9OlLxkaeVvw&list=PL4cUxeGkcC9hpM9ARM59Ve3jqcb54dqiP) by The Net Ninja
-- [Svelte for Beginners](https://www.youtube.com/watch?v=BrkrOjknC_E&list=PLA9WiRZ-IS_ylnMYxIFCsZN6xVVSvLuHk) by Joy of Code
-- [SvelteKit For Beginners | Movie App Tutorial](https://www.youtube.com/watch?v=ydR_M0fw9Xc) by Dev Ed
-- [SvelteKit $app/stores](https://www.youtube.com/watch?v=gBPhr1xbgaQ) by lihautan
-- [Sveltekit - Get All Routes/Pages](https://www.youtube.com/watch?v=Y_NE2R3HuOU) by WebJeda
-
-_To Listen To_
-
-- [New Year, New Svelte!?](https://share.transistor.fm/s/36212cdc) from Svelte Radio
-- [So much Sveltey goodness (featuring Rich Harris)](https://changelog.com/jsparty/205) from JS Party
-- [The Other Side of Tech: A Documentarian Perspective (with Stefan Kingham)](https://codingcat.dev/podcast/2-4-the-other-side-of-tech-a-documentarian-perspective) from Purrfect.dev
-
-**Libraries, Tools & Components**
-
-- [threlte](https://github.com/grischaerbe/threlte) is a three.js component library for Svelte
-- [svelte-formify](https://github.com/nodify-at/svelte-formify) is a library to manage and validate forms that uses decorators to define validations
-- [gQuery](https://github.com/leveluptuts/gQuery) is a GraphQL Fetcher & Cache for Svelte Kit
-- [Unlock-protocol](https://github.com/novum-insights/sveltekit-unlock-firebase) is an integration to help login with MetaMask, Firebase, and paywall customers
-- [AgnosticUI](https://github.com/AgnosticUI/agnosticui) is a set of UI primitives that start their lives in clean HTML and CSS
-- [Vitebook](https://github.com/vitebook/vitebook) is a fast and lightweight alternative to Storybook that's powered by Vite
-- [SwyxKit](https://swyxkit.netlify.app/) is an opinionated blog starter for SvelteKit + Tailwind + Netlify. Refreshed for 2022!
-- [svelte-themes](https://github.com/beynar/svelte-themes) is an abstraction for themes in your SvelteKit app
-- [svelte-transition](https://www.npmjs.com/package/svelte-transition) is a Svelte component to make using CSS class based transitions easier - ideally suited for use with TailwindCSS
-- [Svelte Inview](https://www.npmjs.com/package/svelte-inview) is a Svelte action that monitors an element enters or leaves the viewport/parent element
-- [svelte-inline-compile](https://github.com/DockYard/svelte-inline-compile) is a babel transform that allows for a much more pleasant experience when testing svelte components using Jest and `@testing-library/svelte`
-- [@feltcoop/svelte-mutable-store](https://github.com/feltcoop/svelte-mutable-store) is a Svelte store for mutable values with an `immutable` compiler option
-- [headless-svelte-ui](https://www.npmjs.com/package/@bojalelabs/headless-svelte-ui) is a group of headless components that can be used in building Svelte Apps.
-
-Did we miss something? Need help bringing your next idea to life in Svelte? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs).
-
-See ya next month!
diff --git a/documentation/blog/2022-03-01-whats-new-in-svelte-march-2022.md b/documentation/blog/2022-03-01-whats-new-in-svelte-march-2022.md
deleted file mode 100644
index 477ef1f279..0000000000
--- a/documentation/blog/2022-03-01-whats-new-in-svelte-march-2022.md
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: "What's new in Svelte: March 2022"
-description: 'Svelte Summit Spring is coming... and page endpoints are here!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Just announced: [Svelte Summit Spring](https://www.sveltesummit.com/) will be taking place on April 30, 2022. The 5th Virtual Svelte Conference is [looking for speakers](https://www.sveltesummit.com/#speakers) and [sponsors](https://www.sveltesummit.com/sponsors)... so it's time to dust off those proposals!
-
-Also, some long-requested features were added to SvelteKit this month... including page endpoints! This change in how the `load` function works makes it easier to fetch data required for basic pages, redirect from POST responses and handle 404s and other errors.
-
-More on that and other new features and fixes below!
-
-## What's new in SvelteKit
-
-- The docs are now searchable and multipage with type definitions and hoverable code examples - Check them out at [kit.svelte.dev/docs](https://kit.svelte.dev/docs/)
-- Page endpoints significantly decrease the boilerplate needed when loading a page ([Issue](https://github.com/sveltejs/kit/issues/3532), [PR](https://github.com/sveltejs/kit/pull/3679), [Docs](https://kit.svelte.dev/docs/routing#endpoints-page-endpoints))
-- Application versioning and update detection support lets you determine what to do when a route fails to load after an app update ([Issue](https://github.com/sveltejs/kit/issues/87), [PR](https://github.com/sveltejs/kit/pull/3412), [Docs](https://kit.svelte.dev/docs/configuration#version))
-- A new option in `npm init svelte@next` will now set up Playwright automatically for testing ([PR](https://github.com/sveltejs/kit/pull/4056))
-
-**Breaking Changes**
-
-- The `target` option is no longer available. Instead, the `init` script hydrates its `parentNode` ([#3674](https://github.com/sveltejs/kit/pull/3674))
-- App-level types now live in the `App` namespace which allows you to type global types like `Stuff` or `Session` ([#3670](https://github.com/sveltejs/kit/pull/3670))
-- `JSONString` is now `JSONValue` ([#3683](https://github.com/sveltejs/kit/pull/3683))
-- `createIndexFiles` has been removed — it is now controlled by the `trailingSlash` option ([#3801](https://github.com/sveltejs/kit/pull/3801))
-- SvelteKit will no longer exclude root-relative external links from prerendering, which will cause 404s if these URLs are intended to be served by a separate app. Use a custom [`prerender.onError`](https://kit.svelte.dev/docs/configuration#prerender) handler if you need to ignore them ([#3826](https://github.com/sveltejs/kit/pull/3826))
-
-## New in Language Tools
-
-- Accessing properties in markups has been improved in the Svelte language tools ([105.12.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-105.12.0)) - working around some known issues with autocomplete ([#538](https://github.com/sveltejs/language-tools/issues/538) / [#1302](https://github.com/sveltejs/language-tools/issues/1302))
-
----
-
-## Community Showcase
-
-**Apps & Sites**
-
-- [SvelteStorm](https://github.com/open-source-labs/SvelteStorm) is specifically tailored to provide all of the essential tools a Svelte developer needs to build a Svelte application
-- [Supachat](https://github.com/Lleweraf/supachat) is a real-time chat app using Svelte and Supabase
-- [Radicle](https://radicle.xyz/) is a peer-to-peer stack for building software together
-- [The Making Known](https://the-making-known.com/) is a narrated encounter with posters designed by the Nazi German government to communicate with the occupied nations of Belgium, France, and Luxembourg during the Second World War
-- [Svelte Kanban](https://github.com/V-Py/svelte-kanban) is a simple Svelte Kanban made in pure CSS
-- [fngrng](https://github.com/nvlgzr/fngrng) is a typing trainer focussed on accuracy over speed
-- [Generative grids](https://svelte.dev/repl/873988ce33db43f097c0ca69df57b3ac?version=3.46.4) is a neat little generative SVG grid in a Svelte REPL, with randomly generated color palettes and shapes
-- [LifeHash](https://github.com/BlockchainCommons/lifehash.info) is a method of hash visualization that creates beautiful, deterministic icons
-- [TypedWebhook.tools](https://typedwebhook.tools/) is a webhook testing tool for checking payloads, with automatic type generation
-- [Speedskating](https://github.com/spiegelgraphics/speedskating) is an animation widget to show olympic speedskating runs. Built with Svelte, D3 and regl
-- [Web tail](https://github.com/mishankov/web-tail) is a web application to view lines from file on local system or on remote server
-
-Want to work on a SvelteKit site with others? [Contribute to the Svelte Society site](https://github.com/svelte-society/sveltesociety.dev/issues)!
-
-**Learning Resources**
-
-_To Read_
-
-- [Svelte Components as Web Components](https://medium.com/@yesmeno/svelte-components-as-web-components-b400d1253504) by Matias Meno
-- [Simple Svelte Routing with Reactive URLs](https://bjornlu.com/blog/simple-svelte-routing-with-reactive-urls) by Bjorn Lu
-- [Leveling Up my Sveltekit / Sanity.io Blog Content with Featured Videos and Syntax Highlighting](https://ryanboddy.net/level-up-blog) by Ryan Boddy
-- [How This Blog Makes the Most of GitHub](https://paullj.github.io/posts/how-this-blog-makes-the-most-of-github/) by paullj
-- [FullStack JWT Auth: Introducing SvelteKit](https://dev.to/sirneij/fullstack-jwt-introducing-sveltekit-3jcn) by John Idogun
-- [Svelte-Cubed: Adding Motion to 3D Scenes](https://dev.to/alexwarnes/svelte-cubed-adding-motion-to-3d-scenes-51lo) by Alex Warnes
-- [Creating a RSS feed with Sanity and Svelte Kit](https://ghostdev.xyz/posts/creating-a-rss-feed-with-sanity-and-svelte-kit) by GHOST
-- [How to use Svelte's style directive](https://geoffrich.net/posts/style-directives/) by Geoff Rich
-- [SvelteKit and the "Client pattern"](https://retro.cloud/sveltekit-and-the-client-pattern/) by Julian Laubstein
-
-_To Watch_
-
-- [~~Shadow~~ Page Endpoints In Svelte Kit - Weekly Svelte](https://www.youtube.com/watch?v=PoYPZT7ruqI) by LevelUpTuts
-- [Testing For Beginners (Playlist)](https://www.youtube.com/watch?v=y53wwdBr5AI&list=PLA9WiRZ-IS_z7KpqhPELfEMbhAGRwZrzn) by Joy of Code
-- [KitQL - The native SvelteKit library for GraphQL](https://www.youtube.com/watch?v=6pH4fnFN70w) by Jean-Yves COUËT
-
-**Libraries, Tools & Components**
-
-- [gosvelte](https://github.com/sachinbhutani/gosvelte) is a proof of concept to serve Svelte-generated pages on GoLang HTTP server with server data being sent as props to svelte components
-- [svelte-ethers-store](https://www.npmjs.com/package/svelte-ethers-store) uses the ethers.js library as a collection of readable Svelte stores for Svelte, Sapper or SvelteKit
-- [Fluid Grid](https://fluid-grid.com/) is a CSS grid system for future web
-- [stirstack](https://github.com/seeReadCode/stirstack) is an opinionated framework that combines Svelte.js, TailwindCSS, InertiaJS and Ruby on Rails
-- [OATHqr](https://codeberg.org/vhs/oathqr) helps users create security credentials for use with 2FA/MFA and other OATH-enabled apps. Use it to generate scannable QR codes for one-time password authenticator apps such as Aegis or YubiKey
-- [svelte-GridTiles](https://github.com/honeybeeSunshine/svelte-GridTiles) is a drag and drop resizable tiles library built on a responsive grid
-- [Miscellaneous Svelte Components](https://github.com/alex-knyaz/Miscellaneous-svelte-components/) is a collection of miscellaneous svelte components alex-knyaz often use in my projects
-- [walk-and-graph-svelte-components](https://github.com/j2l/walk-and-graph-svelte-components) is a CLI node script to walk svelte and js files, to draw a beautiful JPG of your dependencies aka "imports"
-- [Felte](https://www.npmjs.com/package/felte) is a simple to use form library for Svelte
-- [svelte-use-tooltip](https://github.com/untemps/svelte-use-tooltip) is a Svelte action to display a tooltip
-- [persistent-svelte-store](https://github.com/omer-g/persistent-svelte-store) is a generic persistent writable store, built from scratch in TypeScript according to the Svelte store contract
-
-What'd we miss? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs) to continue the conversation.
-
-See y'all next month!
diff --git a/documentation/blog/2022-04-01-whats-new-in-svelte-april-2022.md b/documentation/blog/2022-04-01-whats-new-in-svelte-april-2022.md
deleted file mode 100644
index de7374f7cd..0000000000
--- a/documentation/blog/2022-04-01-whats-new-in-svelte-april-2022.md
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: "What's new in Svelte: April 2022"
-description: 'Goodbye fallthrough routes, hello param validators!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-This month, we felt a shift in the way SvelteKit handles page properties. The last holdout of the use-cases that required fallthrough routes, validating parameter properties, has been replaced by a more specific solution.
-
-More on that, and what else is new in Svelte, as we dive in...
-
-## What's new in SvelteKit
-
-- Param matchers allow you to check if a url parameter matches before rendering a page - replacing the need for fallthrough routes for this purpose ([Docs](https://kit.svelte.dev/docs/routing#advanced-routing-matching), [#4334](https://github.com/sveltejs/kit/pull/4334))
-- Explicit redirects can now be handled directly from endpoints ([#4260](https://github.com/sveltejs/kit/pull/4260))
-- `svelte-kit sync` ([#4182](https://github.com/sveltejs/kit/pull/4182)), TypeScript 4.6 ([#4190](https://github.com/sveltejs/kit/pull/4190)) and Vite 2.9 were released - adding non-blocking dependency optimization and experimental CSS source maps in dev mode as well as a number of bug fixes contributed by the SvelteKit team ([#4468](https://github.com/sveltejs/kit/pull/4468))
-
-**New Config Options**
-
-- `outDir` fixes path issues in monorepos and other situations where the desired output directory is outside the project directory ([Docs](https://kit.svelte.dev/docs/configuration#outdir), [#4176](https://github.com/sveltejs/kit/pull/4176))
-- `endpointExtensions` prevents files other than .js and .ts files from being treated as endpoints, unless you specify endpointExtensions ([Docs](https://kit.svelte.dev/docs/configuration#endpointextensions), [#4197](https://github.com/sveltejs/kit/pull/4197))
-- `prerender.default` lets you prerender every page without having to write `export const prerender = true` in every page file ([Docs](https://kit.svelte.dev/docs/configuration#prerender), [#4192](https://github.com/sveltejs/kit/pull/4192))
-
-**Breaking Changes**
-
-- Fallthrough routes have been removed. For migration tips, check out the PR ([#4330](https://github.com/sveltejs/kit/pull/4330))
-- `tabindex="-1"` is only added to `<body>` during navigation ([#4140](https://github.com/sveltejs/kit/pull/4140) and [#4184](https://github.com/sveltejs/kit/pull/4184))
-- Adapters are now required to supply a `getClientAddress` function ([#4289](https://github.com/sveltejs/kit/pull/4289))
-- `InputProps` and `OutputProps` can now be typed separately in generated `Load` ([#4305](https://github.com/sveltejs/kit/pull/4305))
-- The `\$` character is no longer allowed in dynamic parameters ([#4334](https://github.com/sveltejs/kit/pull/4334))
-- `svelte-kit package` has been marked as experimental so changes to it after Kit 1.0 will not be considered breaking ([#4164](https://github.com/sveltejs/kit/pull/4164))
-
-## New across the Svelte ecosystem
-
-- Svelte: Lots of new types for TypeScript and Svelte plugin users - including `style:` directives and Svelte Actions (**3.46.4** and **3.46.5**)
-- Language Tools: Svelte project files are now importable/findable through references without having them imported in a TS file ([105.13.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-105.13.0))
-- Language Tools: Region folding is now supported in html with `<!--#region-->`/`<!--#endregion-->` ([105.13.0](https://github.com/sveltejs/language-tools/releases/tag/extensions-105.13.0))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Launcher](https://launcher.team/) is an open-source app launcher powered by SvelteKit, Prisma, and Tailwind
-- [Paaster](https://paaster.io/) is a secure by default end to end encrypted pastebin built with Svelte, Vite, TypeScript, Python, Starlette, rclone & Docker.
-- [Simple AF Video Converter](https://github.com/berlyozzy/Simple-AF-Video-Converter) is an Electron wrapper around ffmpeg.wasm to make converting videos between formats easier
-- [Streamchaser](https://github.com/streamchaser/streamchaser) seeks to simplify movie, series and documentary search through a centralized entertainment technology platform
-- [Svelte Color Picker](https://github.com/V-Py/svelte-material-color-picker) is a simple color picker made with Svelte
-- [ConcertMash](https://github.com/mcmxcdev/ConcertMash) is a small website that interacts with the Spotify API and generates new playlists based on the upcoming concerts you're attending
-- [Modulus](https://modulus.vision/) is a Design+Code Think Tank conceived with the main mission to evolve design and technology
-- [Multiply](https://www.multiply.us/) is an integrated PR and Social agency moving at the speed of culture
-- [yia!](https://www.yia.co.nz/) is a Young Innovator Award competition in New Zealand
-- [Write to Russia](https://www.writetorussia.org/index) is a community email writing platform to communicate with public `.ru` email addresses
-- [Markdown Playground](https://github.com/Petros-K/markdown-playground) is an online playground dedicated for your markdown experiments.
-- [RatherMisty](https://rathermisty.com/) is a no frills weather app with weather data from Open-Meteo
-- [Minecraft Profile Pic (MCPFP)](https://github.com/MauritsWilke/mcpfp) is a site to generate Minecraft profile pictures with ease
-- [WebGL Fluid Simulation](https://github.com/jpaquim/svelte-webgl-fluid-simulation) is a configurable fluid simulation built with Svelte and WebGL
-- [This @NobelPeaceOslo exhibition](https://twitter.com/perbyhring/status/1504754949791621120) was built using printed graphics, projected motion graphics, particle animations and generative sound design
-
-Itching to contribute to a modern SvelteKit website? [Help build the Svelte Society site](https://github.com/svelte-society/sveltesociety.dev/issues)!
-
-**Learning Resources**
-
-_To Attend_
-
-- [Svelte Summit: Spring](https://www.sveltesummit.com/) will take place on April 30, 2022! Join us for the 5th virtual Svelte conference on [YouTube](https://www.sveltesummit.com/) and Discord 🍾
-
-_To Read_
-
-- [Svelte(Kit) TypeScript Showcase + general TypeScript tips](https://github.com/ivanhofer/sveltekit-typescript-showcase) by Hofer Ivan
-- [Local constants in Svelte with the @const tag](https://geoffrich.net/posts/local-constants/) by Geoff Rich
-- [Design Patterns for Building Reusable Svelte Components](https://render.com/blog/svelte-design-patterns) by Eric Liu
-- [Svelte is better than React](https://labs.hamy.xyz/posts/svelte-is-better-than-react/) by Hamilton Greene
-- [Making Visualizations Literally with Svelte and D3](https://www.connorrothschild.com/post/svelte-and-d3) by Connor Rothschild
-- [Coordinating Multiple Elements with Svelte Deferred Transitions](https://imfeld.dev/writing/svelte_deferred_transitions) by Daniel Imfeld
-- [Animate on scroll with Svelte Inview - Little Bits](https://dev.to/maciekgrzybek/animate-on-scroll-with-svelte-inview-266f) by Maciek Grzybek
-- [Lazy-Loading Firebase with SvelteKit](https://www.captaincodeman.com/lazy-loading-firebase-with-sveltekit) and [HeadlessUI Components with Svelte](https://www.captaincodeman.com/headlessui-components-with-svelte) by Captain Codeman
-- [SvelteKit Accessibility Testing: Automated CI A11y Tests](https://rodneylab.com/sveltekit-accessibility-testing/) by Rodney Lab
-- [Getting Started with KitQL and GraphCMS](https://scottspence.com/posts/getting-started-with-kitql-and-graphcms) by Scott Spence
-- [React ⇆ Svelte Cheatsheet](https://dev.to/joshnuss/react-to-svelte-cheatsheet-1a2a) lists the similarities and differences between the two libraries - by Joshua Nussbaum
-
-_To Watch_
-
-- [Svelte Extravaganza | Async](https://www.youtube.com/watch?v=mT4CLVHgtSg) by pngwn
-- [6 Svelte Packages You Should Know](https://www.youtube.com/watch?v=y5SrUKcX_Co) and [Basic React To Svelte Conversion](https://www.youtube.com/watch?v=DiSuwLlhOxs) by LevelUpTuts
-- [Page/Shadow Endpoint in SvelteKit](https://www.youtube.com/watch?v=j-9D5UDyVOM) by WebJeda
-- [Custom Svelte Store: Higher Order Store](https://www.youtube.com/watch?v=p1aPfVyZ1IY) by lihautan
-- [SvelteKit For Beginners (Playlist)](https://www.youtube.com/watch?v=bLBHecY4-ak&list=PLA9WiRZ-IS_zXZZyW4qfj0akvOAtk6MFS) by Joy of Code - follow along with the [blog guide](https://joyofcode.xyz/sveltekit-for-beginners)
-- [Fullstack SvelteKit Auth 🔐 with Firebase & Magic Links! 🪄](https://www.youtube.com/watch?v=MAHE4iQgh5Q) by Johnny Magrippis
-- [Firebase Authentication in SvelteKit! Full Stack App](https://www.youtube.com/watch?v=N6Y3hqhZvNI) by Ryan Boddy
-
-**Libraries, Tools & Components**
-
-- [SvelTable](https://sveltable.io/) is a feature rich, data table component built with Svelte
-- [svelte-cyberComp](https://github.com/Cybersteam00/svelte-cyberComp) is a powerful, lightweight component library written in Svelte and TypeScript
-- [Flowbite Svelte](https://github.com/shinokada/flowbite-svelte) is an unofficial Flowbite component library for Svelte
-- [Svelte-Tide-Project](https://github.com/jbertovic/svelte-tide-project) is a starter template for Svelte frontend apps with Rust Tide backend server
-- [Fetch Inject](https://github.com/vhscom/fetch-inject#sveltekit) implements a performance optimization technique for managing asynchronous JavaScript dependencies - now with Svelte support
-- [svelte-utterances](https://github.com/shinokada/svelte-utterances) is a lightweight comments widget built on GitHub issues
-- [Liquivelte](https://github.com/malipetek/liquivelte-vscode) allows you to create your Shopify theme with Svelte-like components
-- [@storyblok/svelte](https://github.com/storyblok/storyblok-svelte) is the Svelte SDK you need to interact with Storyblok API and enable the Real-time Visual Editing Experience
-- [@svelte-on-solana/wallet-adapter](https://github.com/svelte-on-solana/wallet-adapter) is a modular TypeScript wallet adapter and UI components for Solana/Anchor applications using SvelteJS as framework
-- [svelte-lookat](https://www.npmjs.com/package/svelte-lookat) creates a div which makes all its children follow the mouse cursor or the user's face when using a mobile phone
-
-Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs) to continue the conversation.
-
-See y'all next month!
diff --git a/documentation/blog/2022-05-01-whats-new-in-svelte-may-2022.md b/documentation/blog/2022-05-01-whats-new-in-svelte-may-2022.md
deleted file mode 100644
index 8961260f77..0000000000
--- a/documentation/blog/2022-05-01-whats-new-in-svelte-may-2022.md
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: "What's new in Svelte: May 2022"
-description: 'Dynamically switch between HTML element types with `<svelte:element>`'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-With yesterday's Svelte Summit behind us, we've got a lot of news to share! Check out all of the recordings on the [Svelte Society YouTube Channel](https://www.youtube.com/sveltesociety) and the rest of this month's updates below...
-
-## What's new in Svelte
-
-- The `<svelte:element>` element lets you render an element of a dynamically specified type. This is useful, for example, when rendering rich text content from a CMS. Check out the [docs](https://svelte.dev/docs#template-syntax-svelte-element) or the [tutorial](https://svelte.dev/tutorial/svelte-element) for more info (**3.47.0**)!
-
-## Language Tools updates
-
-- `svelte:element` and `sveltekit:reload` are now supported
-- Invalid Svelte import paths will now be automatically detected - see PR for getting back the old behavior ([#1448](https://github.com/sveltejs/language-tools/pull/1448))
-- `source.sortImports` lets you sort imports without deleting unused imports ([#1338](https://github.com/sveltejs/language-tools/issues/1338))
-- Hovering over HTML attributes will now show HTML hover info instead of the TS hover info - resulting in much more useful information ([#1447](https://github.com/sveltejs/language-tools/pull/1447))
-- In VS Code, you can now wrap existing blocks of code in control flow tags using the `Insert Snippet` command ([#1373](https://github.com/sveltejs/language-tools/pull/1373))
-
-## What's new in SvelteKit
-
-- Files and directories can now be named `__tests__` and `__test__` in the routes directory ([#4438](https://github.com/sveltejs/kit/pull/4438))
-- Netlify Edge Functions ([#4657](https://github.com/sveltejs/kit/pull/4657)) and the Vercel build output API ([#4663](https://github.com/sveltejs/kit/pull/4663)) are now supported
-- Custom `load` dependencies, array of strings representing URLs the page depends on, are now available when loading routes ([Docs](https://kit.svelte.dev/docs/loading#output-dependencies), [#4536](https://github.com/sveltejs/kit/pull/4536))
-
-**Breaking Changes**
-
-- Validators are now called "matchers" ([Docs](https://kit.svelte.dev/docs/routing#advanced-routing-matching), [#4358](https://github.com/sveltejs/kit/pull/4358))
-- `__layout.reset` has been replaced by named layouts - which have much configurability for shared layout elements ([Docs](https://kit.svelte.dev/docs/layouts#named-layouts), [#4388](https://github.com/sveltejs/kit/pull/4388))
-- Prerendering is now skipped for `rel="external"` links ([#4545](https://github.com/sveltejs/kit/pull/4545))
-- `maxage` is now `cache` in `LoadOutput` ([#4690](https://github.com/sveltejs/kit/pull/4690))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [polySpectra AR](https://ar.polyspectra.com/) lets you prototype faster 3D Printing with seamless AR file handoffs ([video demo](https://www.youtube.com/watch?v=VhYCeVGcG3E))
-- [Pixel Art Together](https://github.com/liveblocks/pixel-art-together) is a free multiplayer pixel art editor powered by Liveblocks
-- [Tooling Manager](https://tooling-manager.netlify.app/) lets you compare your JavaScript tech stack against industry standard boilerplates
-- [Easy Portfolio](https://easy-portfolio.com/) generates a portfolio based on your GitHub profile
-- [FLOAT](https://github.com/muttoni/float) is an attendance tracking program for events
-- [The Coin Perspective](https://thecoinperspective.com/) is a cryptocurrency price tracker and portfolio management tool
-- [Locutionis](https://github.com/pbouillon/locutionis) is a small, online reference of figures of speech (en français)
-- [ASM Editor](https://asm-editor.specy.app/) is an all in one web editor for M68K and MIPS
-- [Otium](https://github.com/alombi/otium) is a free and open source book manager and bookshelf organiser, that helps you managing your books and the ones you would like to read
-- [Sinwaver](https://github.com/Hugo-Dz/Sinwaver) is an SVG sine wave generator
-
-Want to contribute to a modern SvelteKit website? [Help build the Svelte Society site](https://github.com/svelte-society/sveltesociety.dev/issues)!
-
-**Learning Resources**
-
-_To Read_
-
-- [4 tips for cleaner Svelte components](https://geoffrich.net/posts/clean-component-tips/) by Geoff Rich
-- [Building a Clubhouse clone with Svelte and 100ms](https://www.100ms.live/blog/clubhouse-clone-with-svelte) By Seun Taiwo
-- [SvelteKit uvu Testing: Fast Component Unit Tests](https://rodneylab.com/sveltekit-uvu-testing/) by Rodney Lab
-- [SvelteKit JWT authentication tutorial](https://dev.to/pilcrowonpaper/sveltekit-jwt-authentication-tutorial-2m34) by pilcrowOnPaper
-- [Converting a Rollup-based Svelte SPA to SvelteKit](https://github.com/sveltejs/kit/discussions/4595) by Simon H
-- [Add Commitint, Commitizen, Standard Version, and Husky to SvelteKit Project](https://davipon.hashnode.dev/add-commitint-commitizen-standard-version-and-husky-to-sveltekit-project) by David Peng
-
-_To Watch or Hear_
-
-- [Rich Harris - The Road to SvelteKit 1.0 (Svelte Society NYC)](https://www.youtube.com/watch?v=s6a1pbTVcUs) by Svelte Society
-- [Svelte Fundamentals - Intro to Svelte](https://codingcat.dev/course/intro-to-svelte) by Coding Cat
-- [Svelte Components Using Custom Markdown Renderers - Weekly Svelte](https://www.youtube.com/watch?v=ZiEROAqobwM) by LevelUpTuts
-- [Implementing {@const} in if block](https://www.youtube.com/watch?v=f5iReGqjmG0) by lihautan
-- [Svelte and Contributing to Open-Source with Geoff Rich](https://podcast.20minjs.com/1952066/10417700-episode-6-svelte-and-contributing-to-open-source-with-geoff-rich) by 20minJS
-
-**Libraries, Tools & Components**
-
-- [KitDocs](https://github.com/svelteness/kit-docs) is a documentation integration for SvelteKit - like VitePress for Svelte.
-- [Svelte Copy](https://github.com/ghostdevv/svelte-copy) is a click/tap-to-copy library that makes it easy to copy to the clipboard
-- [Svend3r](https://github.com/oslabs-beta/svend3r) provides beautiful visualizations that harness the power of D3 to bring your data to life while abstracting away its imperative-style code
-- [Svelte Hamburgers](https://github.com/ghostdevv/svelte-hamburgers) is the easy to use Hamburger menu component for Svelte
-- [Svelte Droplet](https://github.com/probablykasper/svelte-droplet) is a file dropzone for Svelte
-- [Svelte MP3](https://www.npmjs.com/package/svelte-mp3) is a light blazingly fast yet simple minimalistic audio player for Svelte
-- [SvelteUI](https://github.com/Brisklemonade/svelteui) is a component library for building fully functional & accessible web applications faster than ever
-- [svelte-spotlight](https://github.com/beynar/svelte-spotlight) is a headless spotlight component to help you build your site's global search box in minutes
-- [svelte-pdf-simple](https://github.com/gspasov/svelte-pdf-simple) is a simple svelte library for displaying PDFs and giving you all the control
-- [persistent-svelte-store](https://github.com/omer-g/persistent-svelte-store) is a generic persistent writable store, built from scratch in TypeScript according to the Svelte store contract
-- [svelte-exmarkdown](https://github.com/ssssota/svelte-exmarkdown) is Svelte component to render markdown dynamically
-- [Bookit](https://github.com/leveluptuts/bookit) is a storybook-like component rendering environment - finely tuned to work directly within your SvelteKit projects
-
-Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs) to continue the conversation.
-
-If you'd prefer to join us in person, Svelte Summit is finally transitioning properly into the real world. Come join us for two days of awesome Svelte content! [Get your tickets now!](https://ti.to/svelte/svelte-summit-fall-edition)
-
-See y'all next month!
diff --git a/documentation/blog/2022-06-01-whats-new-in-svelte-june-2022.md b/documentation/blog/2022-06-01-whats-new-in-svelte-june-2022.md
deleted file mode 100644
index 0a551eed13..0000000000
--- a/documentation/blog/2022-06-01-whats-new-in-svelte-june-2022.md
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: "What's new in Svelte: June 2022"
-description: 'Cancellable dispatched events, deeper {@const} declarations and more!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-With last month's [Svelte Summit](https://www.youtube.com/watch?v=qqj2cBockqE) behind us, we're ready to apply everything we learned in this new month of June! Also new this month are some quality-of-life changes to `createEventDispatcher`, `@const` declarations and tons of progress toward SvelteKit 1.0.
-
-Let's dive in!
-
-## What's new in Svelte
-
-- Custom events can now be cancelled in the `createEventDispatcher` function (**3.48.0**, [Docs](https://svelte.dev/docs#run-time-svelte-createeventdispatcher), [PR](https://github.com/sveltejs/svelte/pull/7064))
-- The `{@const}` tag can now be used in `{#if}` blocks to conditionally define variables (**3.48.0**, [Docs](https://svelte.dev/docs#template-syntax-const), [PR](https://github.com/sveltejs/svelte/pull/7451))
-- Lots of bug fixes across `<svelte:element>`, animations and various DOM elements. Check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#3480) for a deeper dive!
-
-## What's new in SvelteKit
-
-- Vite 2.9.9 was released as one of the last Vite 2 releases. The Svelte team has been hard at work contributing to the Vite 3 release to make the integration between SvelteKit and Vite smoother than ever ([Vite 3.0 Milestone](https://github.com/vitejs/vite/milestone/5))
-- `config.kit.alias` lets you more easily declare a custom alias to replace values in `import` statements ([Docs](https://kit.svelte.dev/docs/configuration#alias), [PR](https://github.com/sveltejs/kit/pull/4964))
-- Pages marked for prerendering will now fail during SSR at runtime ([PR](https://github.com/sveltejs/kit/pull/4812))
-
-**Breaking Changes**
-
-- Node 14 is no longer supported ([PR](https://github.com/sveltejs/kit/pull/4922))
-- Requests to `/favicon.ico` will no longer be suppressed and will instead be handled as a valid route ([PR](https://github.com/sveltejs/kit/pull/5046))
-- AMP support has been moved to a separate `@sveltejs/amp` package ([Docs](https://kit.svelte.dev/docs/seo#manual-setup-amp), [PR](https://github.com/sveltejs/kit/pull/4710))
-- Generated types are now written to `_types` directories - update your imports accordingly ([PR](https://github.com/sveltejs/kit/pull/4705))
-- `%svelte.head%` and `%svelte.body%` are now `%sveltekit.head%` and `%sveltekit.body%` in `app.html` ([Docs](https://kit.svelte.dev/docs/migrating#project-files-src-template-html), [PR](https://github.com/sveltejs/kit/pull/5016/))
-- `LoadInput` is now `LoadEvent`
-- Dropped support for Wrangler 1 in favor of Wrangler 2 ([PR](https://github.com/sveltejs/kit/pull/4887))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Plantarium](https://github.com/jim-fx/plantarium) is a tool for the procedural generation of 3D plants.
-- [SPATULA](https://github.com/AlexWarnes/lamina-spatula) is a tool for building shading materials that are exportable as code material in any project that uses lamina and threejs
-- [Waaard](https://waaard.com/) lets you create and send protected links with a variety of SSO providers
-- [Magidoc](https://github.com/magidoc-org/magidoc) is a fast and highly customizable GraphQL documentation generator
-- [myMarkmap](https://github.com/eyssette/myMarkmap) is a custom editor for Markmap, built with SvelteKit
-- [PassShare](https://passshare.mynt.pw/) is a way for you to share your passwords to your friends, securely and effortlessly
-- [DashingOS](https://beta.dashingos.com/) is a tool (like Notion + CodeSandbox) to make it quick and easy to prototype and document your work all in one place
-- [worker-kit-email](https://github.com/miunau/worker-kit-email) helps you develop transactional emails quickly using regular SvelteKit routes
-- [kaios-weather-svelte](https://github.com/cyan-2048/kaios-weather-svelte) is a very familiar looking weather app for KaiOS
-- [svelte-gantt](https://github.com/ANovokmet/svelte-gantt) is a lightweight and fast interactive gantt chart/resource booking component
-- [Miru](https://github.com/ThaUnknown/miru) is a BitTorrent streaming software for cats
-
-Looking for a great SvelteKit website to contribute to? [Help build the Svelte Society site](https://github.com/svelte-society/sveltesociety.dev/issues)!
-
-**Learning Resources**
-
-_To Read_
-
-- [Component party](https://component-party.dev/) is a site that compares common patterns in different frameworks
-- [Quick tip: style prop defaults](https://geoffrich.net/posts/style-prop-defaults/) by Geoff Rich
-- [Working with reduced motion in Svelte](https://ghostdev.xyz/posts/working-with-reduced-motion-in-svelte) by GHOST
-- [Building a Musical Instrument with the Web Audio API](https://www.taniarascia.com/musical-instrument-web-audio-api/) by Tania Rascia
-- [Svelte-Cubed: Creating an Accessible and Consistent Experience Across Devices](https://dev.to/alexwarnes/svelte-cubed-creating-an-accessible-and-consistent-experience-across-devices-42ae) and [Svelte-Cubed: Loading Your glTF Models](https://dev.to/alexwarnes/svelte-cubed-loading-your-gltf-models-14lf) by Alex Warnes
-
-_To Watch_
-
-From Svelte Society:
-
-- [The Svelte Summit Spring 2022 stream recording](https://www.youtube.com/watch?v=qqj2cBockqE) has been updated with chapter markers to make it easy to watch again and again
-- [The full recording of Svelte London, April 2022](https://www.youtube.com/watch?v=zIxzJzTnoxA) is up! Check out the amazing talks from across the Svelte London community
-- [Persian Svelte Society](https://www.youtube.com/channel/UCfWH9lCsXN3j8oXq8dru82Q) is making Persian-language videos about Svelte
-- Svelte Sirens has been talking monthly to creators and contributors across the Svelte Community:
-  - [SvelteKit + Sanity.io: a match made in heaven](https://www.youtube.com/watch?v=j0_1hfiEVWA&list=PL8bMgX1kyZThkJ_Rk6AAFI4eY24g5XKwK&index=5) on May 13
-  - [Slicing up your Svelte Sites with Prismic](https://www.youtube.com/watch?v=FUbHwwMALkk) on May 20
-  - [Rendering your Svelte apps on Render](https://www.youtube.com/watch?v=SnV_hMLVyqs) on May 24
-  - [The story behind the (unofficial) Svelte newsletter](https://www.youtube.com/watch?v=aK0xXm3hPxk&list=PL8bMgX1kyZThkJ_Rk6AAFI4eY24g5XKwK&index=7) on May 27
-
-Across the Web:
-
-- [Building vite-plugin-svelte-inspector](https://www.youtube.com/watch?v=udYB24IMtsY), [What is Singleton?](https://www.youtube.com/watch?v=xhi0m1QZue0) and [What is Navigation?](https://www.youtube.com/watch?v=Ym-OnGUps2c) by lihautan
-- [Auto Import Components In Svelte Kit - Weekly Svelte](https://www.youtube.com/watch?v=JXvKBtTPr64) by LevelUpTuts
-- [🧪 Test SvelteKit with TDD & VITEST 🧪](https://www.youtube.com/watch?v=5bQD3dCoyHA) by Johnny Magrippis
-- [Google Analytics With SvelteKit](https://www.youtube.com/watch?v=l-x6H0fnqqQ), [Using WebSockets With SvelteKit](https://www.youtube.com/watch?v=mAcKzdW5fR8), [SvelteKit Authentication Using Cookies](https://www.youtube.com/watch?v=T935Ya4W5X0) and [Svelte Headless UI Component Library](https://www.reddit.com/r/sveltejs/comments/ueu849/svelte_headless_ui_component_library/) by Joy of Code
-- [Named Layouts In Nested Routes in SvelteKit](https://www.youtube.com/watch?v=hKg_V3jouLk) by The Svelte Junction
-- [SvelteKit Shiki Syntax Highlighting: Markdown Codeblocks](https://rodneylab.com/sveltekit-shiki-syntax-highlighting/) and [Svelte Capsize Styling: Typography Tooling](https://rodneylab.com/svelte-capsize-styling/) by Rodney Lab
-
-_To Hear_
-
-- Svelte Radio has been putting out weekly episodes:
-  - [The Adventures of Running a Svelte Meetup](https://www.svelteradio.com/episodes/the-adventures-of-running-a-svelte-meetup)
-  - [The other Rich! Geoff! (feat. Geoff Rich)](https://www.svelteradio.com/episodes/the-other-rich-geoff)
-  - [Inspecting Svelte Code with Dominik G.](https://www.svelteradio.com/episodes/inspecting-svelte-code-with-dominik-g)
-  - [Stores Galore](https://www.svelteradio.com/episodes/stores-galore)
-- [Svelte and the Future of Frontend Development (feat. Rich Harris)](https://thenewstack.io/svelte-and-the-future-of-front-end-development/) from The New Stack
-
-**Libraries, Tools & Components**
-
-- [vite-plugin-svelte-console-remover](https://github.com/jhubbardsf/vite-plugin-svelte-console-remover) is a Vite plugin that removes all console statements (log, group, dir, error, etc) from Svelte, JS, and TS files during build so they don't leak into production
-- [Svelte Headless Tables](https://github.com/bryanmylee/svelte-headless-table) is an unopinionated and extensible data tables for Svelte
-- [y-presence](https://github.com/nimeshnayaju/y-presence) is a lightweight set of libraries to easily add presence (live cursors/avatars) to any web application (now with Svelte support!)
-- [Svelcro](https://github.com/oslabs-beta/Svelcro) is a component performance tracker for Svelte applications
-- [Svelte-Splitpanes](https://github.com/orefalo/svelte-splitpanes) lets you create dynamic and predictable view panels to layout an application
-- [svelte-miniplayer](https://github.com/ThaUnknown/svelte-miniplayer) is a lightweight, fast, resizable and draggable miniplayer for media
-- [svelte-keybinds](https://github.com/ThaUnknown/svelte-keybinds) is a minimalistic keybinding interface, with rebinding and saving
-- [svelte-speech-recognition](https://github.com/jhubbardsf/svelte-speech-recognition) converts speech from the microphone to text and makes it available to your Svelte components
-
-**Special Feature: Svelte Stores**
-There were lots of Svelte stores released this month from a number of authors...
-
-- [svelte-mutable-store](https://github.com/feltcoop/svelte-mutable-store) is a Svelte store for mutable values with the `immutable` compiler option
-- [svelte-damped-store](https://github.com/aredridel/svelte-damped-store) is a derived writable store that can suspend updates while [svelte-lens-store](https://github.com/aredridel/svelte-lens-store) is a functional lens over Svelte stores
-- [svelte-persistent-store](https://github.com/furudean/svelte-persistent-store) is a writable svelte store that saves and loads data from `Window.localStorage` or `Window.sessionStorage`.
-
-Did we miss anything? Join us on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs) to add your voice.
-
-Don't forget that you can also join us in-person at the Svelte Summit in Stockholm! Come join us for two days of awesome Svelte content! [Get your tickets now](https://ti.to/svelte/svelte-summit-fall-edition).
-
-See y'all next month!
diff --git a/documentation/blog/2022-07-01-whats-new-in-svelte-july-2022.md b/documentation/blog/2022-07-01-whats-new-in-svelte-july-2022.md
deleted file mode 100644
index 13d61fa402..0000000000
--- a/documentation/blog/2022-07-01-whats-new-in-svelte-july-2022.md
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: "What's new in Svelte: July 2022"
-description: 'Faster SSR, language tools improvements and a new paid contributor!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-From faster SSR to support for Vitest and Storybook in SvelteKit, there's a lot to cover in this month's newsletter...
-
-So let's dive in!
-
-## OpenCollective funding drives Svelte forward
-
-Svelte supporters have donated approximately $80,000 to [the project on OpenCollective](https://opencollective.com/svelte). We're happy to share that the funds are being drawn on to move Svelte forward in a meaningful way. **[@gtm-nayan](https://github.com/gtm-nayan)** has begun triaging and fixing SvelteKit issues this past month as a paid contributor to the project to help us get SvelteKit to a 1.0 level of stability! @gtm-nayan has been an active member of the Svelte community for quite some time and is well known for writing the bot that helps keep our Discord server running. We're happy that this funding has allowed Svelte to get much more of his time.
-
-We will also be utilizing OpenCollective funds to allow Svelte core maintainers to attend [Svelte Summit](https://www.sveltesummit.com/) in person this fall. Thanks to everyone who has donated so far!
-
-## What's new in Svelte & Language Tools
-
-- [learn.svelte.dev](https://learn.svelte.dev/) is a new way to learn Svelte and SvelteKit from the ground up that is currently in development
-- Faster SSR is coming in the next Svelte release. A PR two years in the making, resulting in up to 3x faster rendering in some benchmarking tests! ([PR](https://github.com/sveltejs/svelte/pull/5701))
-- "Find File References" ([0.14.28](https://github.com/sveltejs/language-tools/releases/tag/language-server-0.14.28)) and "Find Component References" ([0.14.29](https://github.com/sveltejs/language-tools/releases/tag/language-server-0.14.29)) in the latest versions of the Svelte extension shows where Svelte files and components have been imported and used ([Demo](https://twitter.com/dummdidumm_/status/1532459709604716544/photo/1))
-- The Svelte extension now supports CSS path completion ([0.14.29](https://github.com/sveltejs/language-tools/releases/tag/language-server-0.14.29))
-
-## What's new in SvelteKit
-
-- Introduced `@sveltejs/kit/experimental/vite` which allows SvelteKit to interoperate with other tools in the Vite ecosystem like Vitest and Storybook ([#5094](https://github.com/sveltejs/kit/pull/5094)). Please [leave feedback](https://github.com/sveltejs/kit/issues/5184) as to whether the feature works and is helpful as we consider taking it out of experimental and making `vite.config.js` required for all users
-- Streaming in endpoints is now supported ([#3419](https://github.com/sveltejs/kit/issues/3419)). This was enabled by switching to the Undici `fetch` implementation ([#5117](https://github.com/sveltejs/kit/pull/5117))
-- Static assets can now be symlinked in development environments ([#5089](https://github.com/sveltejs/kit/pull/5089))
-- `server` and `prod` environment variables are now available as a corollary to `browser` and `dev` ([#5251](https://github.com/sveltejs/kit/pull/5251))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Virtual Maker](https://www.virtualmaker.net/) lets you make interactive 3D and VR scenes in your browser
-- [Apple Beta Music](https://www.reddit.com/r/sveltejs/comments/v7ic2s/apple_beta_music_uses_svelte/) appears to have been written in some combination of Svelte and web components
-- [Itatiaia](https://www.itatiaia.com.br/), the largest radio station in the country of Brazil just relaunched its news portal in SvelteKit
-- [Pronauns](https://www.pronauns.com) helps you learn pronunciation online with IPA to speak better and sound more native
-- [Immich](https://www.immich.app/) is an open source, high performance self-hosted backup solution for videos and photos on your mobile phone
-- [Pendek](https://github.com/leovoon/link-shortener) is a link shortener built with SvelteKit, Prisma and PlanetScale
-- [Grunfy](https://grunfy.com/tools) is a set of guitar tools - recently migrated to SvelteKit
-- [Radiant: The Future of Radio](https://play.google.com/store/apps/details?id=co.broadcastapp.Radiant) is a personal radio station app built with Svelte and Capacitor
-- [Imperfect Reminders](https://imperfectreminders.mildlyupset.com/) is a todo list for things that are only sort of time sensitive
-- [Periodic Table](https://github.com/janosh/periodic-table) is a dynamic Periodic Table component written in Svelte
-- [Svelvet](https://github.com/open-source-labs/Svelvet) is a lightweight Svelte component library for building interactive node-based diagrams
-- [publint](https://github.com/bluwy/publint) lints for packaging errors to ensure compatibility across environments
-- [Playlistr](https://github.com/alextana/spotify-playlist-creator) helps manage and create Spotify playlists
-- [Geoff Rich's page transitions demo](https://twitter.com/geoffrich_/status/1534980702785003520) shows how SvelteKit's `beforeNavigate`/`afterNavigate` hooks can make smooth document transitions in the latest Chrome Canary
-- [Menger Sponge](https://twitter.com/a_warnes/status/1536215896078811137) is a fractal built with Threlte
-
-Want to contribute to a site using the latest SvelteKit features? [Help build the Svelte Society site](https://github.com/svelte-society/sveltesociety.dev/issues)!
-
-**Learning Resources**
-
-_Starring the Svelte team_
-
-- [Svelte Origins: A JavaScript Documentary](https://www.youtube.com/watch?v=kMlkCYL9qo0) by OfferZen Origins
-- [Full Stack Documentation (announcing learn.svelte.dev)](https://portal.gitnation.org/contents/full-stack-documentation) by Rich Harris @ JSNation 2022
-- [All About the Sirens](https://www.svelteradio.com/episodes/all-about-the-sirens) by Svelte Radio
-
-_To Watch_
-
-- [SvelteKit Page Endpoints](https://www.youtube.com/watch?v=yQRf2wmTu5w), [Named Layouts](https://www.youtube.com/watch?v=UHX9TJ0BxZY) and [Passing data from page component to layout component with $page.stuff](https://www.youtube.com/watch?v=CXaCstU5pcw) by lihautan
-- [🍞 & 🧈: Magically load data with SvelteKit Endpoints](https://www.youtube.com/watch?v=f6prqYlbTE4) by Johnny Magrippis
-- [Svelte for React developers](https://www.youtube.com/watch?v=7tsrwrx5HtQ) by frontendtier
-- [Learn Svelte JS || JavaScript Compiler for Building Front end Applications](https://www.youtube.com/watch?v=1rKRarJJFrY&list=PLIGDNOJWiL1-7zCgdR7MKuho-tPC6Ra6C&index=1) by Code with tsksharma
-- [SvelteKit Authentication](https://www.youtube.com/watch?v=T935Ya4W5X0&list=PLA9WiRZ-IS_zKrDzhOhV5RGKKTHNIyTDO&index=1) by Joy of Code
-- [Svelte + websockets: Build a real-time Auction app](https://www.youtube.com/watch?v=CqgsWFrwQIU) by Evgeny Maksimov
-
-_To Read_
-
-- [Up-To-Date Analytics on a Static Website](https://paullj.github.io/posts/up-to-date-analytics-on-a-static-website) and [Fast, Lightweight Fuzzy Search using Fuse.js](https://paullj.github.io/posts/fast-lightweight-fuzzy-search-using-fuse.js) by paullj
-- [Use SvelteKit as a handler in the ExpressJs project](https://chientrm.medium.com/use-sveltekit-as-a-handler-in-the-expressjs-project-15524b01128f) by Tran Chien
-- [Creating a desktop application with Tauri and SvelteKit](https://github.com/Stijn-B/tauri-sveltekit-example) by Stijn-B
-- [List of awesome Svelte stores](https://github.com/samuba/awesome-svelte-stores) by samuba
-- [SvelteKit Content Security Policy: CSP for XSS Protection](https://rodneylab.com/sveltekit-content-security-policy/) by Rodney Lab
-- [SvelteKit Hooks. Everything You Need To Know](https://kudadam.com/blog/understanding-sveltekit-hooks) by Lucretius K. Biah
-- [3 tips for upgrading the performance of your Svelte stores](https://www.mathiaspicker.com/posts/3-tips-for-upgrading-the-performance-of-your-svelte-stores) by Mathias Picker
-
-**Libraries, Tools & Components**
-
-- [Svend3r](https://github.com/oslabs-beta/svend3r) is a plug and play D3 charting library for Svelte
-- [Svelte Hover Draw SVG](https://github.com/davipon/svelte-hover-draw-svg) is a lightweight Svelte component to draw SVG on hover
-- [Svelte French Toast](https://svelte-french-toast.com/) provides buttery smooth toast notifications that are lightweight, customizable, and beautiful by default
-- [SVooltip](https://svooltip.vercel.app/) is a basic Svelte tooltip directive, powered by Floating UI
-- [Svelte Brick Gallery](https://github.com/anotherempty/svelte-brick-gallery) is a masonry-like image gallery component for Svelte
-- [use-vest](https://github.com/enyo/use-vest) is a Svelte action for Vest - a library that makes it easy to validate forms and show errors when necessary
-- [Svelidate](https://github.com/svelidate/svelidate) is a simple and lightweight form validation library for Svelte with no dependencies
-- [Svve11](https://github.com/oslabs-beta/Svve11) is an "accessibility-first" component library for Svelte
-- [Slidy](https://github.com/Valexr/Slidy) is a simple, configurable & reusable carousel sliding action script with templates & some useful plugins
-- [Svelte Component Snippets](https://marketplace.visualstudio.com/items?itemName=brysonbw.svelte-component-snippets) is a VS Code extension with access to common Svelte snippets
-- [Svelte Confetti](https://github.com/Mitcheljager/svelte-confetti) adds a little bit of flair to your app with some confetti 🎊
-
-What did we miss? Let us know on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs) to add your voice.
-
-Don't forget that you can also join us in-person at the Svelte Summit in Stockholm! Come join us for two days of awesome Svelte content! [Get your tickets now](https://www.sveltesummit.com/).
-
-See y'all next month!
diff --git a/documentation/blog/2022-08-01-whats-new-in-svelte-august-2022.md b/documentation/blog/2022-08-01-whats-new-in-svelte-august-2022.md
deleted file mode 100644
index c10ed6df16..0000000000
--- a/documentation/blog/2022-08-01-whats-new-in-svelte-august-2022.md
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: "What's new in Svelte: August 2022"
-description: "Changes to SvelteKit's `load` before 1.0 plus support for Vite 3 and `vite.config.js`!"
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-There's a lot to cover this month... big changes are coming to SvelteKit's design before 1.0 can be completed. If you haven't already, check out Rich's Discussion, [Fixing `load`, and tightening up SvelteKit's design before 1.0 #5748](https://github.com/sveltejs/kit/discussions/5748).
-
-Also, [@dummdidumm](https://github.com/dummdidumm) (Simon H) [has joined Vercel to work on Svelte full-time](https://twitter.com/dummdidumm_/status/1549041206348222464) and [@tcc-sejohnson](https://github.com/tcc-sejohnson) has joined the group of SvelteKit maintainers! We're super excited to have additional maintainers now dedicated to working on Svelte and SvelteKit and have already been noticing their impact. July was the third largest month for SvelteKit changes since its inception!
-
-Now onto the rest of the updates...
-
-## What's new in SvelteKit
-
-- Dynamically imported styles are now included during SSR ([#5138](https://github.com/sveltejs/kit/pull/5138))
-- Improvements to routes and prop updates to prevent unnecessary rerendering ([#5654](https://github.com/sveltejs/kit/pull/5654), [#5671](https://github.com/sveltejs/kit/pull/5671))
-- Lots of improvements to error handling ([#4665](https://github.com/sveltejs/kit/pull/4665), [#5622](https://github.com/sveltejs/kit/pull/5622), [#5619](https://github.com/sveltejs/kit/pull/5619), [#5616](https://github.com/sveltejs/kit/pull/5616))
-- Custom Vite modes are now respected in SSR builds ([#5602](https://github.com/sveltejs/kit/pull/5602))
-- Custom Vite config locations are now supported ([#5705](https://github.com/sveltejs/kit/pull/5705))
-- Private environment variables (aka "secrets") are now much more secure. Now if you accidentally import them to client-side code, you'll see an error ([#5663](https://github.com/sveltejs/kit/pull/5663), [Docs](https://kit.svelte.dev/docs/configuration#env))
-- Vercel's v3 build output API is now being used in `adapter-vercel` ([#5514](https://github.com/sveltejs/kit/pull/5514))
-- `vite-plugin-svelte` has reached 1.0 and now supports Vite 3. You'll notice new default ports for `dev` (port 5173) and `preview` (port 4173) ([#5005](https://github.com/sveltejs/kit/pull/5005), [vite-plugin-svelte CHANGELOG](https://github.com/sveltejs/vite-plugin-svelte/blob/main/packages/vite-plugin-svelte/CHANGELOG.md))
-
-**Breaking changes:**
-
-- `mode`, `prod` and `server` are no longer available in `$app/env` ([#5602](https://github.com/sveltejs/kit/pull/5602))
-- `svelte-kit` CLI commands are now run using the `vite` command and `vite.config.js` is required. This will allow first-class support with other projects in the Vite ecosystem like Vitest and Storybook ([#5332](https://github.com/sveltejs/kit/pull/5332), [Docs](https://kit.svelte.dev/docs/project-structure#project-files-vite-config-js))
-- `endpointExtensions` is now `moduleExtensions` and can be used to filter param matchers ([#5085](https://github.com/sveltejs/kit/pull/5085), [Docs](https://kit.svelte.dev/docs/configuration#moduleextensions))
-- Node 16.9 is now the minimum version for SvelteKit ([#5395](https://github.com/sveltejs/kit/pull/5395))
-- %-encoded filenames are now allowed. If you had a `%` in your route, you must now encode it with `%25` ([#5056](https://github.com/sveltejs/kit/pull/5056))
-- Endpoint method names are now uppercased to match HTTP specifications ([#5513](https://github.com/sveltejs/kit/pull/5513), [Docs](https://kit.svelte.dev/docs/routing#endpoints))
-- `writeStatic` has been removed to align with Vite's config ([#5618](https://github.com/sveltejs/kit/pull/5618))
-- `transformPage` is now `transformPageChunk` ([#5657](https://github.com/sveltejs/kit/pull/5657), [Docs](https://kit.svelte.dev/docs/hooks#handle))
-- The `prepare` script is no longer needed in `package.json` ([#5760](https://github.com/sveltejs/kit/pull/5760))
-- `adapter-node` no longer does any compression while we wait for a [bug fix in the `compression` library](https://github.com/expressjs/compression/pull/183) ([#5560](https://github.com/sveltejs/kit/pull/5506))
-
-For a full list of changes, check out kit's [CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
-## What's new in Svelte & Language Tools
-
-- The `@layer` [CSS at-rule](https://developer.mozilla.org/en-US/docs/Web/CSS/@layer) is now supported in Svelte components (**3.49.0**, [PR](https://github.com/sveltejs/svelte/issues/7504))
-- The `inert` [HTML attribute](https://html.spec.whatwg.org/multipage/interaction.html#the-inert-attribute) is now supported in Svelte's language tools and plugins (**105.20.0**, [PR](https://github.com/sveltejs/language-tools/pull/1565))
-- The Svelte plugin will now use `SvelteComponentTyped` typings, if available (**105.19.0**, [PR](https://github.com/sveltejs/language-tools/pull/1548))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [PocketBase](https://github.com/pocketbase/pocketbase) is an open source Go backend with a single file and an admin dashboard built with Svelte
-- [Hondo](https://www.playhondo.com/how-to-play) is a word guessing game with multiple rounds
-- [Hexapipes](https://github.com/gereleth/hexapipes) is a site for playing hexagonal pipes puzzle
-- [Mail Must Move](https://www.mordon.app/) is an email made for those who want to get more done
-- [Jot Down](https://github.com/brysonbw/vscode-jot-down) is a Visual Studio Code extension for quick and simple note taking
-- [Kadium](https://kadium.kasper.space/) is an app for staying on top of YouTube channels' uploads
-- [Samen zjin we #1metS10](https://1mets10.avrotros.nl/) is a campaign website to support S10, the dutch Eurovision finalist, by sending a drawing or a wish
-- [On Writing Code](https://onwritingcode.com/) is an interactive website to learn programming design patterns
-- [Svelte-In-Motion](https://github.com/novacbn/svelte-in-motion) lets you create Svelte-animated videos in your browser
-- [Svelte Terminal](https://github.com/Nico-Mayer/svelte-terminal) is a terminal-like website
-- [Bulletlist](https://bulletlist.com/) is a simple tool with a single purpose: making lists
-- [Remind Me Again](https://github.com/probablykasper/remind-me-again) is an app for toggleable reminders on Mac, Linux and Windows
-- [Heyweek](https://heyweek.com/) is a timetracking app built for freelancers craving that extra pizzazz
-
-**Learning Resources**
-
-_Starring the Svelte team_
-
-- [The Svelte Documentary is out!](https://www.svelteradio.com/episodes/the-svelte-documentary-is-out) on Svelte Radio
-- [Beginner SvelteKit](https://vercel.com/docs/beginner-sveltekit) by Vercel
-- [Challenge: Explore Svelte by Building a Bubble Popping Game](https://prismic.io/blog/try-svelte-build-game) by Brittney Postma
-- [Let's write a Client-side Routing Library with Svelte](https://www.youtube.com/watch?v=3foVDSknGEY) by lihautan
-- [Svelte Sirens July Talk - Testing in Svelte with Jess Sachs](https://sveltesirens.dev/event/testing-in-svelte)
-
-_To Watch_
-
-- [10 Awesome Svelte UI Component Libraries](https://www.youtube.com/watch?v=RkD88ARvucM) by LevelUpTuts
-- [Learn How SvelteKit Works](https://www.youtube.com/watch?v=VizuTy3uSNE) and [SvelteKit Endpoints](https://www.youtube.com/watch?v=XnVxDLTgCgo) by Joy of Code
-- [SvelteKit using TS, and Storybook setup](https://www.youtube.com/watch?v=L4F5dSu0FcQ) by Jarrod Kane
-- [Building Apps with Svelte!](https://www.youtube.com/watch?v=prsXVk1fdW4) by Simon Grimm
-- [SvelteKit authentication, the better way - Tutorial](https://www.youtube.com/watch?v=Y98KipzwVdM) by Pilcrow
-
-_To Read_
-
-- [Some assorted Svelte demos](https://geoffrich.net/posts/assorted-svelte-demos/) by Geoff Rich
-- [Three ways to bootstrap a Svelte project](https://maier.tech/posts/three-ways-to-bootstrap-a-svelte-project) by Thilo Maier
-- [Design & build an app with Svelte](https://bootcamp.uxdesign.cc/design-build-an-app-with-svelte-ecd7ed0729da) by Hugo
-- [Define routes via JS in SvelteKit](https://dev.to/maxcore/define-routes-via-js-in-sveltekit-27e9) by Max Core
-- [Integrating Telegram api with SvelteKit](https://dev.to/theether0/integrating-telegram-api-with-sveltekit-5gb) by Shivam Meena
-- [SvelteKit SSG: how to Prerender your SvelteKit Site](https://rodneylab.com/sveltekit-ssg/) by Rodney Lab
-- [ADEO Design System: Building a Web Component library with Svelte and Rollup](https://medium.com/adeo-tech/adeo-design-system-building-a-web-component-library-with-svelte-and-rollup-72d65de50163) by Mohamed Mokhtari
-- [The Svelte Handbook](https://thevalleyofcode.com/svelte/) by The Valley of Code
-- [Test Svelte Component Using Vitest & Playwright](https://davipon.hashnode.dev/test-svelte-component-using-vitest-playwright) by David Peng
-- [Transitional Apps with Phoenix and Svelte](https://nathancahill.com/phoenix-svelte) by Nathan Cahill
-
-_Tech Demos_
-
-- [Bringing the best GraphQL experience to Svelte](https://www.the-guild.dev/blog/houdini-and-kitql) by The Guild
-- [Style your Svelte website faster with Stylify CSS](https://stylifycss.com/blog/style-your-svelte-website-faster-with-stylify-css/) by Stylify
-- [Revamped Auth Helpers for Supabase (with SvelteKit support)](https://supabase.com/blog/2022/07/13/supabase-auth-helpers-with-sveltekit-support) by Supabase
-
-**Libraries, Tools & Components**
-
-- [Lucia](https://github.com/pilcrowOnPaper/lucia-sveltekit) is a simple, JWT based authentication library for SvelteKit that connects your SvelteKit app with your database
-- [Skeleton](https://github.com/Brain-Bones/skeleton) is a UI component library for use with Svelte + Tailwind
-- [pass-composer](https://pass-composer.vercel.app/) helps you compose your postprocessing passes for threlte scenes
-- [@crikey/stores-\*](https://whenderson.github.io/stores-mono/) is a collection of libraries to extend Svelte stores for common use-cases
-- [Svelte Chrome Storage](https://github.com/shaun-wild/svelte-chrome-storage) is a lightweight abstraction between Svelte stores and Chrome extension storage
-- [Svelte Schema Form](https://github.com/restspace/svelte-schema-form) is a form generator for JSON schema
-- [svelte-gesture](https://github.com/wobsoriano/svelte-gesture) is a library that lets you bind richer mouse and touch events to any component or view
-- [Snap Layout](https://github.com/ThaUnknown/snap-layout) and [universal-title-bar](https://github.com/ThaUnknown/universal-title-bar) bring Windows 11 snap layout and title features to webapps and PWAs. Both can be imported as a `.svelte` module or as a web component
-- [svelte-adapter-bun](https://github.com/gornostay25/svelte-adapter-bun) is an adapter for SvelteKit apps that generates a standalone Bun server
-- [json2dir](https://www.npmjs.com/package/json2dir) converts JSON objects into directory trees
-- [Svelte Command Palette](https://github.com/rohitpotato/svelte-command-palette) is a drop-in command palette component
-- [svelte-use-drop-outside](https://github.com/untemps/svelte-use-drop-outside) is a Svelte action to drop an element outside an area
-- [PowerTable](https://github.com/muonw/powertable) is a JavaScript component that turns JSON data into an interactive HTML table
-- [svelte-slides](https://github.com/rajasegar/svelte-slides) is a slide show template for Svelte using Reveal.js
-- [Svelte Theme Light](https://marketplace.visualstudio.com/items?itemName=webmaek.svelte-theme-light) is a Visual Studio Code theme based on the Svelte REPL
-
-Did we miss anything? Let us know on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
-
-Still looking for something to do in September? Come join us at the Svelte Summit in Stockholm! [Get your tickets now](https://www.sveltesummit.com/).
-
-See ya next month!
diff --git a/documentation/blog/2022-09-01-whats-new-in-svelte-september-2022.md b/documentation/blog/2022-09-01-whats-new-in-svelte-september-2022.md
deleted file mode 100644
index 2127b5c79c..0000000000
--- a/documentation/blog/2022-09-01-whats-new-in-svelte-september-2022.md
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: "What's new in Svelte: September 2022"
-description: "Migrating to SvelteKit's new filesystem-based router"
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Still looking for something to do this month? It's your last chance to get tickets to Svelte Summit, Stockholm! [Join us on Sept 8-9th](https://www.sveltesummit.com/) 🎉
-
-With the redesign of SvelteKit's filesystem-based router merging early last month, there's lots to cover this month - from the [migration script](https://github.com/sveltejs/kit/discussions/5774) to a number of new blog posts, videos and tutorials.
-
-But the new routing isn't the only new feature in SvelteKit...
-
-## What's new in SvelteKit
-
-- `Link` is now supported as an HTTP header and works out of the box with Cloudflare's [Automatic Early Hints](https://github.com/sveltejs/kit/issues/5455) (**1.0.0-next.405**, [PR](https://github.com/sveltejs/kit/pull/5735))
-- `$env/static/*` are now virtual to prevent writing sensitive values to disk (**1.0.0-next.413**, [PR](https://github.com/sveltejs/kit/pull/5825))
-- `$app/stores` can now be used from anywhere on the browser (**1.0.0-next.428**, [PR](https://github.com/sveltejs/kit/pull/6100))
-- `config.kit.env.dir` is a new config that sets the directory to search for `.env` files (**1.0.0-next.430**, [PR](https://github.com/sveltejs/kit/pull/6175))
-
-**Breaking changes:**
-
-- The filesystem-based router and `load` API improves the way routes are managed. **Before installing version `@sveltejs/kit@1.0.0-next.406` or later, [follow this migration guide](https://github.com/sveltejs/kit/discussions/5774)** ([PR](https://github.com/sveltejs/kit/pull/5778), [Issue](https://github.com/sveltejs/kit/discussions/5748))
-- `event.session` has been removed from `load` along with the `session` store and `getSession`. Use `event.locals` instead (**1.0.0-next.415**, [PR](https://github.com/sveltejs/kit/pull/5946))
-- Named layouts have been removed in favor of `(groups)` (**1.0.0-next.432**, [Docs](https://kit.svelte.dev/docs/advanced-routing#advanced-layouts), [PR & Migration Instructions](https://github.com/sveltejs/kit/pull/6174))
-- `event.clientAddress` is now `event.getClientAddress()` (**1.0.0-next.438**, [PR](https://github.com/sveltejs/kit/pull/6237))
-- `$app/env` has been renamed to `$app/environment`, to disambiguate with `$env/...` (**1.0.0-next.445**, [PR](https://github.com/sveltejs/kit/pull/6334))
-
-For a full list of changes, check out kit's [CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
-**Updates to language tools**
-
-- TypeScript doesn't resolve imports to SvelteKit's $types very well, the latest version of Svelte's language tools makes it better (**105.21.0**, [#1592](https://github.com/sveltejs/language-tools/pull/1592))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [canno](https://twitter.com/a_warnes/status/1556724034959818754?s=20&t=RyKWALPByqMT5A_PkLtUew) is a simple interactive 3d physics game with adjustable gravity, cannon power, and debug visualizer - made with threlte
-- [straw.page](https://straw.page/) is an extremely simple website builder that lets you create unique websites straight from your phone
-- [Patra](https://patra.webjeda.com/) lets you share short notes just with a link. No database. No storage
-- [promptoMANIA](https://promptomania.com/) is an AI art community with an online prompt builder
-- [Album by Mood](https://www.albumbymood.com/) lets you listen to music based on your mood
-- [Daily Sumeiro](https://digivaux.com/sumeiro/daily/) is a daily game to test your math and logic skills
-- [Lofi and Games](https://www.lofiandgames.com/) - play relaxing, casual games right from your browser
-- [Pitch Pipe](https://github.com/joelgibson/pitch-pipe) is a digital pitch pipe with a frequency analyser and just-intonation intervals
-- [classes.wtf](https://github.com/ekzhang/classes.wtf) is a custom, distributed search engine written in Go and Svelte to make searching for Harvard courses much quicker than the standard course catalog
-- [Scrumpack](https://scrumpack.io/) is a set of tools to help agile/scrum teams with their ceremonies like Planning Poker and Retrospectives
-
-**Learning Resources**
-
-_Starring the Svelte team_
-
-- [Supper Club × Rich Harris, Author of Svelte — Syntax Podcast 499](https://syntax.fm/show/499/supper-club-rich-harris-author-of-svelte)
-- [Let's talk routing with Rich Harris on Svelte Radio](https://www.svelteradio.com/episodes/lets-talk-routing-with-rich-harris)
-- [2.17 - Building the Future of Svelte at Vercel with Rich Harris](https://www.youtube.com/watch?v=F1sSUDVoij4)
-- [1.15 - What's Up With SvelteKit with Shawn Wang (swyx)](https://www.youtube.com/watch?v=xLhuUShkYkM)
-- [Adding Notion Tailwindcss and DaisyUI to Svelte App](https://www.youtube.com/watch?v=l4sbqrY0XGk)
-- [Svelte 101 Session](https://www.youtube.com/watch?v=IIeBERpyxx4)
-- [Astro and Svelte](https://www.youtube.com/watch?v=iYKKg-50Gm4)
-- [Storyblok in Svelte](https://www.youtube.com/watch?v=xXHFRzqUxoE)
-- [Svelte London August Recording](https://www.youtube.com/watch?v=ua6gE2zPulw)
-
-_Learning the new SvelteKit routing_
-
-- [Migrating Breaking Changes in SvelteKit](https://www.netlify.com/blog/migrating-breaking-changes-in-sveltekit/) by Brittney Postma (Netlify)
-- [Major Svelte Kit API Change - Fixing `load`, and tightening up SvelteKit's design before 1.0](https://www.youtube.com/watch?v=OUGn7VifUCg) - Video by LevelUpTuts
-- [SvelteKit Is Never Going To Be The Same](https://www.youtube.com/watch?v=eVFcGA-15LA) - Video by Joy of Code
-- [Let's learn SvelteKit by building a static Markdown blog from scratch](https://joshcollinsworth.com/blog/build-static-sveltekit-markdown-blog) by Josh Collinsworth (updated Aug 26th to keep up with the new changes)
-
-_To Watch_
-
-- [Svelte Guide For React Developers](https://www.youtube.com/watch?v=uWDBEUkTRGk) and [Svelte State Management Guide](https://www.youtube.com/watch?v=4dDjQiOVrOo) by Joy of Code
-- [What Is Bookit? The Svelte Kit Storybook Killer](https://www.youtube.com/watch?v=aOBGhvggsq0) and [What Is @type{import In Svelte Kit - JSDoc Syntax](https://www.youtube.com/watch?v=y0DvJTVO65M) by LevelUpTuts
-- [TWF Yet another JS Framework... or not? Svelte!](https://www.youtube.com/watch?app=desktop&v=nT8QtDBIKZA) by TWF meetup
-
-_To Read_
-
-- [Creating a Figma Plugin with Svelte](https://www.lekoarts.de/javascript/creating-a-figma-plugin-with-svelte) by Lennart
-- [Svelte Video Blog: Vlog with Mux from your own SvelteKit Site](https://plus.rodneylab.com/tutorials/svelte-video-blog) and [Svelte Shy Header: Peekaboo Sticky Header with CSS](https://rodneylab.com/svelte-shy-header/) by Rodney Lab
-
-**Libraries, Tools & Components**
-
-- [@svelte-plugins/tooltips](https://github.com/svelte-plugins/tooltips) is a simple tooltip action and component designed for Svelte
-- [Lucia](https://github.com/pilcrowOnPaper/lucia-sveltekit) is a simple authentication library for SvelteKit that connects your SvelteKit app to your database
-- [remix-router-svelte](https://github.com/brophdawg11/remix-routers/tree/main/packages/svelte) is a Svelte implementation of the `react-router-dom` API (driven by `@remix-run/router`)
-- [MKRT](https://github.com/j4w8n/mkrt) is a CLI to help you create SvelteKit routes, fast
-- [Histoire](https://histoire.dev/guide/) is a tool to generate stories applications - scenarios where you showcase components for specific use cases
-- [sveltekit-flash-message](https://www.npmjs.com/package/sveltekit-flash-message) is a Sveltekit library that passes temporary data to the next request, usually from endpoints
-- [svelte-particles](https://github.com/matteobruni/tsparticles#svelte) is a lightweight TypeScript library for creating particles
-- [svelte-claps](https://github.com/bufgix/svelte-claps) adds clap button (like Medium) to any page for your SvelteKit apps
-- [Neon Flicker](https://svelte.dev/repl/fd5e3b2be7da42fe8afddf89661af7d7?version=3.49.0) is a Svelte component to make your text flicker in a cyberpunk style
-- [ComboBox](https://svelte.dev/repl/144f22d18c6943abb1fdd00f13e23fde?version=3.49.0) is a search input to help users select from a large list of items
-- [@svelte-put](https://github.com/vnphanquang/svelte-put) is useful svelte stuff to put in your projects
-- [vite-plugin-svelte-bridge](https://github.com/joshnuss/vite-plugin-svelte-bridge) lets you write Svelte components and use them from React & Vue
-
-_UI Kits and Starters_
-
-- [Svelte-spectre](https://github.com/basf/svelte-spectre) is a UI-kit based on spectre.css and powered by Svelte
-- [Skeleton](https://skeleton.brainandbonesllc.com/) allows you to build fast and reactive web UI using the power of Svelte + Tailwind
-- [iconsax-svelte](https://www.npmjs.com/package/iconsax-svelte) brings the popular icon kit to Svelte
-- [laravel-vite-svelte-spa-template](https://github.com/NukeJS/laravel-vite-svelte-spa-template) is a Laravel 9, Vite, Svelte SPA, Tailwind CSS (w/ Forms Plugin & Aspect Ratio Plugin), Axios, & TypeScript starter template
-- [neutralino-svelte-boilerplate-js](https://github.com/Raffaele/neutralino-svelte-boilerplate-js) is a cross platform desktop template for Neutralino and Svelte
-- [figma-plugin-svelte-vite](https://github.com/candidosales/figma-plugin-svelte-vite) is a boilerplate for creating Figma plugins using Svelte, Vite and Typescript
-- [Urara](https://github.com/importantimport/urara) is a sweet & powerful SvelteKit blog starter
-- [SvelteKit Commerce](https://vercel.com/templates/svelte/sveltekit-commerce) is an all-in-one starter kit for high-performance e-commerce sites built with SvelteKit by Vercel
-
-Did we miss anything? Let us know on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
-
-See ya next month!
diff --git a/documentation/blog/2022-10-01-whats-new-in-svelte-october-2022.md b/documentation/blog/2022-10-01-whats-new-in-svelte-october-2022.md
deleted file mode 100644
index 46e8a857df..0000000000
--- a/documentation/blog/2022-10-01-whats-new-in-svelte-october-2022.md
+++ /dev/null
@@ -1,149 +0,0 @@
----
-title: "What's new in Svelte: October 2022"
-description: 'Svelte Summit, `use:enhance`, and a SvelteKit Release Candidate!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-There's a bunch of updates this month... from new features in Svelte and SvelteKit to a whole 2-day _summit_! Plus, the Svelte extension gets some helpful new tools, new accessibility (a11y) warnings, and Tan Li Hau teaches us how to build our own Svelte and a Svelte spreadsheet 😎
-
-## What happened at Svelte Summit?
-
-A lot! Below you can find all the talks, by timestamp, from each livestream. Bite-size videos of the event will be coming soon to the Svelte Society channel, so be sure to [Subscribe](https://www.youtube.com/c/SvelteSociety), if you haven't already!
-
-_Day One_
-
-- [12:31](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=751s) - How to get Svelte adopted at work
-- [33:21](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=2001s) - Animating Data Visualization in Svelte
-- [2:20:36](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=8436s) - Red flags & code smells
-- [2:53:42](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=10422s) - Enhance your DX
-- [4:42:41](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=16961s) - Svelte in UBS’ knowledge graph
-- [5:06:42](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=18402s) - How to migrate react libraries to svelte
-- [5:45:27](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=20727s) - DX magic in the world of Svelte
-- [7:25:39](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=26739s) - Data visualizations powered by Svelte
-- [7:59:38](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=28778s) - Partial Hydration in Svelte for Increased Performance
-- [8:20:49](https://www.youtube.com/watch?v=pJcbZr5VlV4&t=30049s) - Building the future, faster
-
-_Day Two_
-
-- [24:09](https://www.youtube.com/watch?v=A8jkJTWacow&t=1449s) - Scrollytell me why: Ain't nothing but a piece of cake
-- [2:02:40](https://www.youtube.com/watch?v=A8jkJTWacow&t=7360s) - I told you my dog wouldn’t run
-- [2:29:43](https://www.youtube.com/watch?v=A8jkJTWacow&t=8983s) - 10Xing Svelte
-- [3:04:56](https://www.youtube.com/watch?v=A8jkJTWacow&t=11096s) - Svemix? Re-svmix? Re-svelte?: Bringing Svelte to Remix Router
-- [5:09:39](https://www.youtube.com/watch?v=A8jkJTWacow&t=18579s) - Having fun with stores: an interactive demo of Svelte’s built in state management library
-- [5:37:06](https://www.youtube.com/watch?v=A8jkJTWacow&t=20226s) - When Keeping it Svelte Goes Wrong. An Analysis of Some of the Worst Svelte I Have Ever Coded
-- [7:22:05](https://www.youtube.com/watch?v=A8jkJTWacow&t=26525s) - Getting started with Hooks
-- [7:38:14](https://www.youtube.com/watch?v=A8jkJTWacow&t=27494s) - Special Announcement\*
-
-\*In the final talk of the summit, Rich Harris announces the first Release Candidate of SvelteKit! With no planned breaking changes left, the team is hard at work squashing bugs and adding the remaining features for 1.0...
-
-## More SvelteKit Updates
-
-- `use:enhance` is the easiest way to progressively enhance a form ([Docs](https://kit.svelte.dev/docs/form-actions#progressive-enhancement-use-enhance), [#6633](https://github.com/sveltejs/kit/pull/6633), [#6828](https://github.com/sveltejs/kit/pull/6828), [#7012](https://github.com/sveltejs/kit/pull/7012))
-- The demo app has been updated to add the Sverdle game, which Rich demoed at Svelte Summit and demonstrates `use:enhance` ([#6979](https://github.com/sveltejs/kit/pull/6979))
-- Cloudflare Pages `_routes.json` specification is now supported by `adapter-cloudflare` ([#6530](https://github.com/sveltejs/kit/pull/6530))
-- Improved build performance by running asset and page compression in parallel ([#6710](https://github.com/sveltejs/kit/pull/6710))
-
-**Breaking changes:**
-
-- Node 16.14 is now the minimum version to run SvelteKit ([#6388](https://github.com/sveltejs/kit/pull/6388))
-- `App.PrivateEnv` and `App.PublicEnv` have been removed in favour of generated types ([#6413](https://github.com/sveltejs/kit/pull/6413))
-- `%sveltekit.message%` has been replaced with `%sveltekit.error.message%` ([6659](https://github.com/sveltejs/kit/pull/6659))
-- `App.PageError` is now `App.Error` - check for it in your hooks ([Docs](https://kit.svelte.dev/docs/hooks#shared-hooks-handleerror), [#6963](https://github.com/sveltejs/kit/pull/6963))
-- `externalFetch` is now `handleFetch` and will run for all fetch calls in `load` that run on the server ([#6565](https://github.com/sveltejs/kit/pull/6565))
-
-For a full list of changes, check out SvelteKit's [CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md).
-
-## Svelte Updates
-
-- New a11y warnings for `incorrect-aria-attribute-type`, `no-abstract-role`, `interactive-element-to-noninteractive-role` and `role-has-required-aria-props`.`no-noninteractive-tabindex` and `click-events-have-key-events` coming soon! (**3.50.0**)
-- New types for `ComponentEvents` and `SveltePreprocessor` (**3.50.0**)
-- Improved parsing speed when encountering large blocks of whitespace (**3.50.0**)
-- All global JavaScript objects and functions are now recognized as known globals (**3.50.1**)
-
-For all the changes to the Svelte compiler, including upcoming changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## New in Language Tools
-
-- Better code formatting for editor suggestion (**106.0.0**, [#1598](https://github.com/sveltejs/language-tools/pull/1598))
-- Easily create SvelteKit route files from the context menu or command palette (**106.1.0**, [#1620](https://github.com/sveltejs/language-tools/pull/1620))
-
----
-
-## Ask Questions in the Svelte Discord
-
-In case you missed the announcement, the Svelte Discord has an exciting new update... a forum! The new [questions channel](https://discord.com/channels/457912077277855764/1023340103071965194) utilizes Discord's new forums feature to help the community better ask, find and answer questions!
-
-It can be used for anything you may be trying to accomplish using Svelte including using SvelteKit, community libraries, tools, etc. So ask away!
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Timeflow](https://www.timeflow.site/) is a smart calendar & task manager that dynamically schedules your tasks between your events
-- [GeoQuest](https://github.com/woutdp/geoquest) is an open source geography game
-- [Houses Of](https://housesof.world/) is a project showcasing charismatic houses around the world
-- [Greenfield Brewery](https://greenfield-brewery.vercel.app/) is a tool for quickly installing a lot of homebrew casks
-- [Gram Jam](https://gramjam.app/) is a word puzzle game inspired by match three games and Scrabble
-- [Beatbump](https://github.com/snuffyDev/Beatbump) is a privacy-respecting alternative frontend for YouTube Music
-- [RoomOS Device Widgets](https://github.com/wxsd-sales/roomos-device-widgets) is an app for demoing RoomOS device capabilities in Kiosk/PWA mode
-- [World Seed](https://store.steampowered.com/app/1870320/World_Seed/) is a full blown online multiplayer game
-- [Lirify](https://lirify-tan.vercel.app/) is a song lyrics writing web app tool made in Latvia
-- [Splet Tech Konferencija](https://www.splet.rs/) is a tech conference in Serbia with a _very_ fancy website
-- [Unbounded](https://unbounded.polkadot.network/) is an open-source variable font - funded by blockchain (and an awesome-looking website)
-- [Porter's Paints](https://shop.porterspaints.com/) is an eCommerce site for (you guessed it) paints built with Svelte
-- [CRAN/E](https://www.cran-e.com/) is a search engine for modern R-packages
-
-**Learning Resources**
-
-_Starring the Svelte team_
-
-- [Upgrading SvelteKit](https://www.youtube.com/watch?v=vzeZskhjoeQ) by Svelte Sirens (with Brittney, Kev, and GHOST!)
-- [Build your own Svelte](https://www.youtube.com/watch?v=mwvyKGw2CzU) by lihautan
-- [Native Page Transitions in SvelteKit: Part 1](https://geoffrich.net/posts/page-transitions-1/) by Geoff Rich
-- [Build a cross platform app with Tauri](https://ghostdev.xyz/posts/build-a-cross-platform-app-with-tauri/) by GHOST
-
-_To Watch_
-
-- [How To Use Future CSS In Svelte](https://www.youtube.com/watch?v=eqwtoaP-0pk) and [Master Animation With Svelte](https://www.youtube.com/watch?v=3RlBfUQCiAQ) by Joy of Code
-- [Svelte Kit Form Actions 101 - New Svelte Kit API](https://www.youtube.com/watch?v=i5zdnv83mxY) and [Svelte Kit Form Actions - Real World Examples - Q&A](https://www.youtube.com/watch?v=PK2Mpt1q6K8) by LevelUpTuts
-
-_To Read_
-
-- [What's new in `svelte-kit, 1.0.0-next.445`: (group) layout](https://dev.to/parables/whats-new-in-svelte-kit-100-next445-group-layout-1ld5) by Parables
-- [Handling breaking changes in SvelteKit pre-1.0](https://maier.tech/posts/handling-breaking-changes-in-sveltekit-pre-1-0) by Thilo Maier
-- [Svelte Custom Stores Demystified](https://raqueebuddinaziz.com/blog/svelte-custom-stores-demystified/) by Raqueebuddin Aziz
-- Sveltekit Changes: [Advanced Layouts](https://dev.to/theether0/sveltekit-changes-advanced-layouts-3id4), [Form Actions and Progressive Enhancement](https://dev.to/theether0/sveltekit-changes-form-actions-and-progressive-enhancement-31h9) and [Cookies and Authentication](https://dev.to/theether0/sveltekit-changes-session-and-cookies-enb) by Shivam Meena
-- [How to add an Emoji Picker to Sveltekit](https://xvrc.net/) by Xavier Coiffard
-- [Get Started with SvelteKit Headless WordPress](https://plus.rodneylab.com/tutorials/get-started-sveltekit-headless-wordpress) by Rodney Lab
-- [Speed up SvelteKit Pages With a Redis Cache](https://www.captaincodeman.com/speed-up-sveltekit-pages-with-a-redis-cache) and [How to await Firebase Auth with SvelteKit](https://www.captaincodeman.com/how-to-await-firebase-auth-with-sveltekit) by Captain Codeman
-- [Deploying SvelteKit with NodeJS to a Server Using GitLab and PM2](https://abyteofcoding.com/blog/deploying-sveltekit-with-nodejs-pm2-to-server/) by A Byte of Coding
-- [Quality of Life Tips when using SvelteKit in VS Code](https://www.reddit.com/r/sveltejs/comments/xltgyp/quality_of_life_tips_when_using_sveltekit_in_vs/) by doa-doa
-
-**Libraries, Tools & Components**
-
-- [Svelte Fit](https://github.com/leveluptuts/svelte-fit) is an extremely simple, no dependency fit text library
-- [svelte-switch-case](https://github.com/l-portet/svelte-switch-case) is a switch case syntax for your Svelte components
-- [svelte-canvas-confetti](https://github.com/andreasmcdermott/svelte-canvas-confetti) uses a single canvas to render full-screen confetti
-- [@slidy/svelte](https://github.com/Valexr/Slidy/tree/master/packages/svelte) is a simple, configurable & reusable carousel component built with Svelte - based on `@slidy/core`
-- [svelte-currency-input](https://github.com/canutin/svelte-currency-input) is a form input that converts numbers to localized currency formats as you type
-- [Adria](https://github.com/pilcrowOnPaper/adria) is a super simple form validation library, with autocomplete and value/type checking
-- [Canopy](https://github.com/oslabs-beta/canopy) is a Svelte debugging app for the Chrome devtools panel
-- [MenuFramework](https://github.com/MyHwu9508/altv-os-menu-framework) is a menu framework written for [alt:V](https://altv.mp/#/)
-- [whyframe](https://whyframe.dev/) gives iframes superpowers, making it easy to render anything in isolation
-- [@svelte-put/modal](https://github.com/vnphanquang/svelte-put/tree/main/packages/misc/modal) is a solution to async, declarative, type-safe modals in Svelte
-- [Kitty](https://github.com/grottopress/kitty) is a collection of libraries and handlers for developing secure frontend apps
-- [svelte-turnstile](https://github.com/ghostdevv/svelte-turnstile) is a component for Cloudflare Turnstile, the privacy focused CAPTCHA replacement
-
-_UI Kits and Starters_
-
-- [QWER](https://github.com/kwchang0831/svelte-QWER) is a blog starter built with SvelteKit
-- [SvelteKit Zero API](https://github.com/Refzlund/sveltekit-zero-api) provides type-safety between the frontend and backend - creating a structure for easy APIs
-- [sveltekit-monorepo](https://github.com/sw-yx/sveltekit-monorepo) is monorepo starter with 2022 tech
-- [svelte-component-test-recipes](https://github.com/davipon/svelte-component-test-recipes) uses `vitest`, `@testing-library/svelte`, and `svelte-htm` to test Svelte components that seemed to be hard to test
-
-Whew! That's a lot of updates. Let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.com/invite/yy75DKs)!
-
-See ya next month 👋
diff --git a/documentation/blog/2022-11-01-whats-new-in-svelte-november-2022.md b/documentation/blog/2022-11-01-whats-new-in-svelte-november-2022.md
deleted file mode 100644
index eccbff9cb9..0000000000
--- a/documentation/blog/2022-11-01-whats-new-in-svelte-november-2022.md
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: "What's new in Svelte: November 2022"
-description: 'Better forms, routes and inline styles across SvelteKit and Svelte'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-It's been a busy October for the Svelte community. `use:enhance` and Advanced Routes got some great improvements in SvelteKit while the Svelte compiler released a minor version to improve the day-to-day dev experience.
-
-There's also a _huge_ showcase to cover... so let's jump in!
-
-## What's new in SvelteKit
-
-- The new `update` method for `use:enhance` lets you easily get back the default form behavior while augmenting it with your own logic ([docs](https://kit.svelte.dev/docs/form-actions#progressive-enhancement-use-enhance), [#7083](https://github.com/sveltejs/kit/pull/7083) and [#7326](https://github.com/sveltejs/kit/pull/7326))
-- `[[optional]]` parameters are now available for routing ([docs](https://kit.svelte.dev/docs/advanced-routing#optional-parameters), [#7051](https://github.com/sveltejs/kit/pull/7051))
-- `goto` now has `invalidateAll` to (re-)run all `load` functions belonging to the new active page ([docs](https://kit.svelte.dev/docs/modules#$app-navigation-goto), [#7407](https://github.com/sveltejs/kit/pull/7407))
-- `config.kit.paths.base` is now used in adapters looking for static assets - fixing 404 issues across `adapter-netlify`, `adapter-vercel`, `adapter-cloudflare`, and `adapter-cloudflare-workers` ([#4448](https://github.com/sveltejs/kit/pull/4448))
-
-**Breaking changes:**
-
-- Errors will now be thrown when routes conflict ([#7051](https://github.com/sveltejs/kit/pull/7051))
-- The global `fetch` override has been removed when prerendering ([#7318](https://github.com/sveltejs/kit/pull/7318))
-- Route IDs have been prefixed with `/` ([#7338](https://github.com/sveltejs/kit/pull/7338))
-
-## Svelte changes
-
-- New accessibility warnings, `a11y-click-events-have-key-events` and `a11y-no-noninteractive-tabindex`, will now warn when your components lack required key events or tabindex. While `a11y-role-has-required-aria-props` will no longer warn when elements match their semantic role (**3.51.0**)
-- `--style-props` are now supported on `<svelte:component>` and `<svg>` (**3.51.0**, Component Example: [Before](https://svelte.dev/repl/48984f20503f4959b70f24f4130d164b?version=3.47.0) and [After](https://svelte.dev/repl/48984f20503f4959b70f24f4130d164b?version=3.51.0), SVG Example: [Before](https://svelte.dev/repl/b7a3f94255914044b35462234ccaea43?version=3.50.0) and [After](https://svelte.dev/repl/b7a3f94255914044b35462234ccaea43?version=3.51.0))
-- "nullish" values for component event handlers are now supported (**3.51.0**, [Example](https://svelte.dev/repl/9228022922af4c76af68ce42349ccbf9?version=3.51.0))
-- Scoped styles can now be applied to `<svelte:element>` (**3.51.0**, [Example](https://svelte.dev/repl/23d982fc6f4f4f06a6aa227860fa2d84?version=3.51.0))
-- You can now use `important` in inline style tags: `style:foo|important` (**3.52.0**, [#7365](https://github.com/sveltejs/svelte/issues/7365))
-- A warning will now be thrown when using `<a target="_blank">` without `rel="noreferrer"` (**3.52.0**, [#6188](https://github.com/sveltejs/svelte/issues/6188))
-
-Tom Smykowski also released a great summary of [all the changes in 3.52.0](https://tomaszs2.medium.com/svelte-3-52-0-improves-dev-experience-45f8c460bb96)! For all the changes to the Svelte compiler, including upcoming changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [AttendZen](https://www.attendzen.io/) is an event management and marketing platform for in-person, virtual or hybrid events
-- [Gram Jam](https://gramjam.app/) is a challenging daily word game using SvelteKit
-- [Collabwriting](https://collabwriting.com/) is an actionable knowledge base for your team
-- [Dazzle](https://dazzlega.me/) is a Puzzle Game made with Svelte & DallE
-- [Figma Autoname plugin](https://github.com/Hugo-Dz/figma_autoname_client_app) automatically names your Figma layers in one click
-- [DECK](https://github.com/sfx101/deck) is powerful and high performant local web development studio for MacOS, Ubuntu and Windows
-- [Asm editor](https://github.com/Specy/asm-editor) is a webapp to write and run m68k assembly code
-- [Nucleus](https://github.com/mellobacon/Nucleus) is a text editor featuring a clean and easy to use user interface inspired by Visual Studio Code, Atom, Fleet, and others
-- [Observer](https://github.com/diamonc/observer) is a frontend for Arth Panel, an open-source & self-hosted minecraft server panel
-- [.PLAN](https://plan.lodzero.com/) is a cloud-based notetaking app with markdown and section support
-- [Stablecog](https://github.com/yekta/stablecog) is a simple, free & open source AI image generator
-- [FreeSpeech AAC](https://github.com/merkie/freespeech) is a free and open-source assistive communication app written in TypeScript
-- [sqrdoff](https://sqrdoff.cubieverse.co/) is a dots and boxes to enjoy playing with friends
-- [itty](https://launch.itty-sh.pages.dev/) is a fresh take on the traditional link-shortener
-- [splits](https://splits.best/) lets you track your splits, calculate your race pace, become a better athlete
-- [Weaver](https://jrende.xyz/weaver/) is an application for creating [weave drafts](https://www.gistyarn.com/blogs/how-to-weave/how-to-read-a-weaving-draft)
-
-**Learning Resources**
-
-_To Watch_
-
-- [Starting With Svelte - Brittney Postma](https://www.youtube.com/watch?v=pdKJzrPA0DY) by fitcevents
-- [Learn Svelte from scratch with Geoff Rich: A Svelte tutorial](https://www.youtube.com/watch?v=QoR0AZ-Rov8) by Kelvin Omereshone
-- [How To Connect to MongoDB in Svelte Kit](https://www.youtube.com/watch?v=gwktlvFHLMA) by LevelUpTuts
-- [SvelteKit Authentication Using Cookies](https://www.youtube.com/watch?v=E3VG-dLCRUk), [Make A Typing Game With Svelte](https://www.youtube.com/watch?v=kMz_Ba_OF2w) and [SvelteKit Tailwind CSS Setup With Automatic Class Sorting](https://www.youtube.com/watch?v=J_G_xP0chog) by Joy of Code
-- [Authentication with SvelteKit & PocketBase](https://www.youtube.com/watch?v=doDKaKDvB30) and [Form Actions in SvelteKit (+page)](https://www.youtube.com/watch?v=52nXUwQWeKI) by Huntabyte
-- [Sybil - Episode 1 - Rust knowledge management with SurrealDB](https://www.youtube.com/watch?v=eC7IePI5rIk) by Raphael Darley
-
-_To Read_
-
-- [4 things I miss from Svelte after working in React](https://geoffrich.net/posts/4-things-i-miss-svelte/) and [Create dynamic social card images with Svelte components](https://geoffrich.net/posts/svelte-social-image/) by Geoff Rich
-- [First-class Vite support in Storybook 7.0](https://storybook.js.org/blog/first-class-vite-support-in-storybook/) (Svelte and SvelteKit included) by Ian VanSchooten
-- [Better Svelte support is coming to WebStorm](https://blog.jetbrains.com/webstorm/2022/09/webstorm-2022-3-eap1/#information_regarding_svelte_support) from JetBrains
-- [Dark Mode](https://pyronaur.com/dark-mode/) Toggle by pyronaur
-- [HeadlessUI Components with Svelte](https://www.captaincodeman.com/headlessui-components-with-svelte) by Captain Codeman
-- [Using Sequelize with SvelteKit](https://cherrific.io/0xedB00816FB204b4CD9bCb45FF2EF693E99723484/story/23) by MetaZebre
-- [Implementing Maintenance mode on a SvelteKit site](https://blog.encodeart.dev/implementing-maintenance-mode-on-a-sveltekit-site) by Andreas Söderlund
-- [ActionStore: Real-time Svelte stores for Rails](https://dev.to/buhrmi/actionstore-real-time-svelte-stores-for-rails-4jhg) by Stefan Buhrmester
-- [Svelte CSS Image Slider: with Bouncy Overscroll](https://rodneylab.com/svelte-css-image-slider/) and [SvelteKit Local Edge Functions: Edge on Localhost](https://rodneylab.com/sveltekit-local-edge-functions/) by Rodney Lab
-- [Creating a Svelte Tabs component with Slot props](https://blog.openreplay.com/creating-a-svelte-tabs-component-with-slot-props/) by Shinichi Okada
-- [Sky Cart: An Open Source, cloud-agnostic shopping cart using Stripe Checkout](https://dev.to/stripe/sky-cart-an-open-source-cloud-agnostic-shopping-cart-using-stripe-checkout-o5k) by Mike Bifulco for Stripe
-
-**Libraries, Tools & Components**
-
-- [Threlte](https://threlte.xyz/) is a component library for Svelte to build and render three.js scenes declaratively and state-driven in Svelte apps. It's being featured again to highlight the new "Playground" button in its examples
-- [Svelte Turnstile](https://github.com/ghostdevv/svelte-turnstile) is a library to integrate Cloudflare's Turnstile (a new CAPTCHA alternative) into a Svelte app
-- [ActionStore](https://github.com/buhrmi/actionstore) allows you to push data directly into Svelte stores via ActionCable
-- [SvelteKit + `<is-land>`](https://sveltekit-is-land.vercel.app/) is an experiment with partial hydration in SvelteKit using `@11ty/is-land`
-- [Svelte Color Select](https://github.com/CaptainCodeman/svelte-color-select) is an Okhsv Color Selection component for Svelte using OKLab perceptual colorspace
-- [svelte-awesome-color-picker](https://github.com/Ennoriel/svelte-awesome-color-picker) is a highly customizable color picker component library
-- [rx-svelte-forms](https://www.npmjs.com/package/rx-svelte-forms) creates reactive Svelte forms inspired by Angular reactive forms
-- [svelte-wc-bind](https://www.npmjs.com/package/svelte-wc-bind) enables two way data binding in Svelte web components
-- [svelte-preprocess-style-child-component](https://github.com/valterkraemer/svelte-preprocess-style-child-component) allows you to style elements inside a child component using similar syntax as CSS Shadow Parts
-- [unplugin-svelte-components](https://www.npmjs.com/package/unplugin-svelte-components) allows for on-demand components auto importing for Svelte
-- [sveltekit-search-params](https://github.com/paoloricciuti/sveltekit-search-params) aims to be the fastest way to read AND WRITE from query search params in SvelteKit
-- [svelte-crop-window](https://github.com/sabine/svelte-crop-window) is a crop window component for images and videos that supports touch gestures (pinch zoom, rotate, pan), as well as mousewheel zoom, mouse-dragging the image, and rotating on right mouse button
-- [Open Graph Image Generation](https://github.com/etherCorps/sveltekit-og) lets you generate open graph images dynamically from HTML/CSS without a browser in SvelteKit
-- [Svelte Tap Hold](https://github.com/binsarjr/svelte-taphold) is a minimalistic tap and hold component for Svelte/SvelteKit
-- [svelte-copy](https://github.com/ghostdevv/svelte-copy)'s new version lets you customize the events that cause text to be copied to the clipboard
-
-_UI Kits, Integrations and Starters_
-
-- [SvelteKit Statiko](https://github.com/ivodolenc/sveltekit-statiko) is a multi-featured assistant for SvelteKit static projects
-- [Svelte-TailwindCSS UI (STWUI)](https://github.com/N00nDay/stwui) is a Tailwind-based UI that is currently in pre-release beta
-- [KitBase](https://github.com/kevmodrome/kitbase) is a starter template for SvelteKit and PocketBase
-- [UnoCSS Vite Plugin (svelte-scoped)](https://github.com/unocss/unocss/tree/main/examples/sveltekit-scoped) is a scoped-CSS utility for Vite/SvelteKit
-- [SvelteKit Auth App](https://github.com/fabiorodriguesroque/sveltekit_auth_app) is an example of how we can create an authentication system with SvelteKit using JsonWebToken and Prisma
-- [SvelteKit Supabase Dashboard](https://github.com/xulioc/sveltekit-supabase-dashboard) is a simple dashboard inspired by Supabase UI made with SvelteKit as frontend and Supabase as backend
-- [Supakit](https://github.com/j4w8n/supakit) is a Supabase auth helper for SvelteKit
-- [@bun-community/sveltekit-adapter-bun](https://www.npmjs.com/package/@bun-community/sveltekit-adapter-bun) is an adapter for SvelteKit apps that generates a standalone Bun server
-- [hooks-as-store](https://github.com/micha-lmxt/hooks-as-store) lets you use React custom hooks in Svelte Apps
-
-_Fun ones_
-
-- [svelte-typewriter-store](https://github.com/paoloricciuti/svelte-typewriter-store) is the simplest way to get a rotating typewriter effect in Svelte
-- [Aksel](https://www.npmjs.com/package/aksel) is the seagull you needed on your site
-- [Svelte-Dodge](https://github.com/WbaN314/svelte-dodge) makes components dodge the pointer
-
-That's it for this month! Let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte)
-
-See ya next month 👋
diff --git a/documentation/blog/2022-12-01-whats-new-in-svelte-december-2022.md b/documentation/blog/2022-12-01-whats-new-in-svelte-december-2022.md
deleted file mode 100644
index ccfcebf993..0000000000
--- a/documentation/blog/2022-12-01-whats-new-in-svelte-december-2022.md
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: "What's new in Svelte: December 2022"
-description: 'Rounding the corner to SvelteKit 1.0'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-SvelteKit 1.0 is just around the corner! With [99% of the milestone issues completed](https://github.com/sveltejs/kit/milestone/2), there's a lot of new changes from the last month to cover...
-
-Let's get to it!
-
-## What's new in SvelteKit
-
-- Use the `willUnload` property to find out if the navigation will result the app being unloaded (full page reload/closing/leaving to another page). ([#6813](https://github.com/sveltejs/kit/pull/6813))
-- `__data.json` requests now allows for caching while ensuring we cache matching responses for all invalidation scenarios ([#7532](https://github.com/sveltejs/kit/pull/7532))
-- Linking to `<a name="hash">` tags is now supported ([#7596](https://github.com/sveltejs/kit/pull/7596))
-- Throwing redirects in the `handle` hook is now supported ([#7612](https://github.com/sveltejs/kit/pull/7612))
-- A fallback component will now be added automatically for layouts without one ([#7619](https://github.com/sveltejs/kit/pull/7619))
-- The new `preload` function within the `resolve` hook determines what files should be added to the <head> tag to preload it ([Docs](https://kit.svelte.dev/docs/hooks#server-hooks-handle), [#4963](https://github.com/sveltejs/kit/pull/4963), [#7704](https://github.com/sveltejs/kit/pull/7704))
-- `version` is now available via `$app/environment` ([#7689](https://github.com/sveltejs/kit/pull/7689), [#7694](https://github.com/sveltejs/kit/pull/7694))
-- `handleError` can now return a promise ([#7780](https://github.com/sveltejs/kit/pull/7780))
-
-**Breaking changes:**
-
-- `routeId` is now `route.id` ([#7450](https://github.com/sveltejs/kit/pull/7450))
-- 'load' has been renamed to 'enter' and 'unload' to 'leave' in the `beforeNavigate` and `afterNavigate` methods. `beforeNavigate` is now called once with type 'unload' on external navigation and will no longer run during redirects ([#7502](https://github.com/sveltejs/kit/pull/7502), [#7529](https://github.com/sveltejs/kit/pull/7529), [#7588](https://github.com/sveltejs/kit/pull/7588))
-- The `redirect` helper will now only allow status codes between 300-308 for redirects and only `error` status codes between 400-599 are allowed ([#7767](https://github.com/sveltejs/kit/pull/7767)) ([#7615](https://github.com/sveltejs/kit/pull/7615), [#7767](https://github.com/sveltejs/kit/pull/7767))
-- Special characters will now be encoded with hex/unicode escape sequences in route directory names ([#7644](https://github.com/sveltejs/kit/pull/7644))
-- devalue is now used to (de)serialize action data - this is only a breaking change for everyone who fetches the actions directly and doesn't go through `use:enhance` ([#7494](https://github.com/sveltejs/kit/pull/7494))
-- `trailingSlash` is now a page option, rather than configuration ([#7719](https://github.com/sveltejs/kit/pull/7719))
-- The client-side router now ignores links outside `%sveltekit.body%` ([#7766](https://github.com/sveltejs/kit/pull/7766))
-- `prerendering` is now named `building`, and `config.kit.prerender.enabled` has been removed ([#7762](https://github.com/sveltejs/kit/pull/7762))
-- `getStaticDirectory()` has been removed from the builder API ([#7809](https://github.com/sveltejs/kit/pull/7809))
-- The `format` option has been removed from `generateManifest(...)` ([#7820](https://github.com/sveltejs/kit/pull/7820))
-- `data-sveltekit-prefetch` has been replaced with `-preload-code` and `-preload-data`, `prefetch` is now `preloadData` and `prefetchRoutes` is now `preloadCode` ([#7776](https://github.com/sveltejs/kit/pull/7776), [#7776](https://github.com/sveltejs/kit/pull/7776))
-- `SubmitFunction` has been moved from `$app/forms` into `@sveltejs/kit` ([#7003](https://github.com/sveltejs/kit/pull/7003))
-
-## New in Svelte
-
-- The css compiler options of `css: false` and `css: true` have been replaced with `'external' | 'injected' | 'none'` settings to speed up compilation for `ssr` builds and improve clarity (**3.53.0**)
-
-For all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Appwrite's new console](https://github.com/appwrite/console) makes its secure backend server for web, mobile & Flutter developers available in the browser
-- [RepoMagic](https://www.repomagic.com/) is a search and analytics tool for GitHub
-- [Podman Desktop](https://github.com/containers/podman-desktop) is a graphical tool for developing on containers and Kubernetes
-- [Ballerine](https://github.com/ballerine-io/ballerine) is a Know Your Customer (KYC) UX for any vertical or geography using modular building blocks, components, and 3rd party integrations
-- [Budget Pen](https://github.com/Nico-Mayer/budget_pen) is a Codepen-like browser code editor with Tailwind included
-- [doTogether](https://github.com/SarcevicAntonio/doTogether) helps you keep track of stuff you have get done via a List of recurring Tasks
-- [Webscraped College Results](https://www.redditcollegeresults.com/) is a collection of visualizations for data from r/collegeresults
-- [Let's premortem](https://letspremortem.com/) helps avoid lengthy, frustrating post-mortems after a project fails
-- [BLKMARKET.COM](https://beta.blkmarket.com/) is an illustration library for commercial and personal use
-- [Sigil](https://sigilspace.com/) is a canvas for anything with spaces organized by the most-voted content
-- [corpus-activity-streams](https://github.com/ryanatkn/corpus-activity-streams) is an unofficial ActivityStreams 2.0 vocabulary data set and alternative docs
-- [nodeMyAdmin](https://github.com/Andrea055/nodeMyAdmin) is an alternative to phpMyAdmin written with SvelteKit
-- [Image to Pattern Conversion](https://www.thread-bare.com/convert) is a cross-stitch pattern conversion tool with [a list of pre-made patterns](https://www.thread-bare.com/store) to start with
-- [Verbums](https://verbums.vdoc.dev/) is an English vocabulary trainer to improve language comprehension
-- [SVGPS](https://svgps.app/) removes the burden of working with a cluster of SVG files by converting your icons into a single JSON file
-- [This 3D retro-themed asteroid shooter](https://photon-alexwarnes.vercel.app/showcase/asteroids) was made with threlte
-
-**Learning Resources**
-
-_To Hear_
-
-- [Catching up after Svelte Summit](https://www.svelteradio.com/episodes/catching-up) and [3D, WebGL and AI](https://www.svelteradio.com/episodes/3d-webgl-and-ai) by Svelte Radio
-
-_To Watch_
-
-- [Domenik Reitzner - The easy way, an introduction to Sveltekit](https://www.youtube.com/watch?v=t-LKRrNedps) from Svelte Society Vienna
-- [Sirens: Form Actions](https://www.youtube.com/watch?v=2OISk5-EHek) - Kev joins the Sirens again to chat about Form actions in SvelteKit and create a new form for speaker submissions on SvelteSirens.dev
-- [Introduction To 3D With Svelte (Threlte)](https://www.youtube.com/watch?v=89LYeHOncVk), [How To Use Global Styles In SvelteKit](https://www.youtube.com/watch?v=jHSwChkx3TQ) and [Progressive Form Enhancement With SvelteKit](https://www.youtube.com/watch?v=6pv70d7i-3Q) by Joy of Code
-
-_To Read_
-
-- [Building tic-tac-toe with Svelte](https://geoffrich.net/posts/tic-tac-toe/) by Geoff Rich
-- [Speed up SvelteKit Pages With a Redis Cache](https://www.captaincodeman.com/speed-up-sveltekit-pages-with-a-redis-cache) by Captain Codeman
-- [Understanding environment variables in SvelteKit](https://www.okupter.com/blog/environment-variables-in-sveltekit), [Form validation with SvelteKit and Zod](https://www.okupter.com/blog/sveltekit-form-validation-with-zod) and [Build a SvelteKit application with Docker](https://www.okupter.com/blog/build-a-sveltekit-application-with-docker) by Justin Ahinon
-- [Why I failed to create the "Solid.js's store" for Svelte, and announcing svelte-store-tree v0.3.1](https://dev.to/igrep/why-i-failed-to-create-the-solidjss-store-for-svelte-and-announcing-svelte-store-tree-v031-1am2) by YAMAMOTO Yuji
-- [Create an offline-first and installable PWA with SvelteKit and workbox-precaching](https://www.sarcevic.dev/offline-first-installable-pwa-sveltekit-workbox-precaching) by Antonio Sarcevic
-
-**Libraries, Tools & Components**
-
-- [Skeleton](https://www.skeleton.dev/) is a UI toolkit to build fast and reactive web interfaces using Svelte + Tailwind CSS
-- [svelte-svg-spinners](https://github.com/luluvia/svelte-svg-spinners) is a collection of SVG Spinners components
-- [Svelte Floating UI](https://github.com/fedorovvvv/svelte-floating-ui) enables floating UIs with actions - no wrapper components or component bindings required
-- [at-html](https://github.com/micha-lmxt/at-html) lets you use `{@html }` tags with slots in Svelte apps
-- [html-svelte-parser](https://github.com/PatrickG/html-svelte-parser) is a HTML to Svelte parser that works on both the server (Node.js) and the client (browser)
-- [svelte-switcher](https://github.com/rohitpotato/svelte-switcher) is a fully customisable, touch-friendly, accessible and tiny toggle component
-- [sveltkit-hook-html-minifier](https://www.npmjs.com/package/@svackages/sveltkit-hook-html-minifier) is a hook that wrapps `html-minifier`
-- [sveltekit-hook-redirect](https://www.npmjs.com/package/@svackages/sveltekit-hook-redirect) is a hook that makes redirects easy
-- [sveltekit-video-meet](https://github.com/harshmangalam/sveltekit-video-meet) is a video calling web app built with SvelteKit and SocketIO
-- [svelte-colourpicker](https://www.npmjs.com/package/svelte-colourpicker) is a lightweight opinionated colour picker component for Svelte
-- [Svelte-HeadlessUI](https://captaincodeman.github.io/svelte-headlessui/) is an unofficial implementation of Tailwind HeadlessUI for Svelte
-- [svelte-lazyimage-cache](https://github.com/binsarjr/svelte-lazyimage-cache) is a Lazy Image component with IntersectionObserver and cache action
-- [threlte v5.0](https://www.reddit.com/r/sveltejs/comments/ywit18/threlte_v50_is_here_a_completely_new_developer/) is a completely new developer experience that is faster, more powerful, and incredibly flexible
-
-That's it for this month! Let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte)
-
-See ya next near 🎆
diff --git a/documentation/blog/2022-12-14-announcing-sveltekit-1.0.md b/documentation/blog/2022-12-14-announcing-sveltekit-1.0.md
deleted file mode 100644
index a2c569d016..0000000000
--- a/documentation/blog/2022-12-14-announcing-sveltekit-1.0.md
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Announcing SvelteKit 1.0
-description: Web development, streamlined
-author: The Svelte team
-authorURL: https://svelte.dev/
----
-
-After two years in development, [SvelteKit](https://kit.svelte.dev) has finally reached 1.0. As of today, it’s the recommended way to build Svelte apps of all shapes and sizes.
-
-We’re so excited to share this release with you. It’s the culmination of thousands of hours of work, both from the Svelte core team and the wider community, and we think it’s the most enjoyable way to build production-grade websites, whether you’re a solo developer working on a small project or part of a large team.
-
-To get started, run `npm sv create`, and visit the [docs](https://kit.svelte.dev/docs) and (experimental!) [interactive tutorial](https://learn.svelte.dev).
-
-<div class="max">
-<figure style="max-width: 960px; margin: 0 auto">
-<div style="height: 0; padding: 0 0 57.1% 0; position: relative; margin: 0 auto;">
-	<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0; margin: 0;" src="https://www.youtube-nocookie.com/embed/N4BRVkQVoMc" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-</div>
-
-<figcaption>Svelte Radio Live: the Christmas special</figcaption>
-</figure>
-</div>
-
-## What is SvelteKit?
-
-SvelteKit is a framework for building web applications on top of [Svelte](https://svelte.dev), a UI component framework [that](https://insights.stackoverflow.com/survey/2021#section-most-loved-dreaded-and-wanted-web-frameworks) [developers](https://2021.stateofjs.com/en-US/libraries/front-end-frameworks/) [love](https://twitter.com/Rich_Harris/status/1589675637195042817) for its performance and ease of use.
-
-If you’ve used component frameworks like Svelte, you’ll know that they make it much easier to build user interfaces than working with the DOM directly. But they leave a lot of questions unanswered:
-
-- How do I structure my source code?
-- How do I add server-side rendering?
-- How do I add routing that works on the server and in the browser?
-- How do I make client-side routing accessible?
-- How do I fetch data?
-- How do I mutate data?
-- How do I handle errors?
-- How do I optimise my production build?
-- How do I handle environment variables sensibly and securely?
-- How do I add CSP headers and CSRF protection?
-- How do I add a service worker that knows what to cache?
-- How do I prepare my application for deployment?
-
-An application framework is designed to answer these questions. SvelteKit does so with a design informed by the real world needs of an army of beta testers (many of whom have been running SvelteKit in production for some time — we salute your courage and thank you for the invaluable feedback) and the best ideas from other application frameworks including [Next.js](https://nextjs.org/) and [Remix](https://remix.run/).
-
-## How is it different?
-
-Web developers today are spoiled for choice. Aside from the aforementioned frameworks, there are options like [Astro](https://astro.build/), battle-tested server frameworks like [Rails](https://rubyonrails.org/) and [Laravel](https://laravel.com/), and a million static site generators. These are all wonderful tools, and you should feel good about choosing them.
-
-SvelteKit does things a little differently, however:
-
-**Unlike traditional ‘multi-page app’ or MPA frameworks,** it defaults to client-side navigation after the initial server-rendered page load. This enables faster page transitions, state that persists between pages (such as a sidebar’s scroll position), and less data usage. It also avoids re-running third party scripts like analytics on every single page load.
-
-**Unlike traditional server frameworks,** it allows you to use one language, instead of effectively having two tightly-coupled apps (one to generate HTML, one to handle client-side interaction). Because SvelteKit runs wherever JavaScript runs, you can deploy your app as a traditional Node server, or using serverless functions — including at the edge.
-
-**Unlike static site generators,** you can build apps with personalised or dynamic data — without the performance-killing, layout-shifting effects of fetching it from the browser after the page loads.
-
-With SvelteKit, you have flexibility. Many frameworks assume there’s one correct way to build an app, but reality is more nuanced. It’s not true, for example, that prerendering static pages is just a poor man’s `cache-control` — it also lets you do build-time validation or render data from the filesystem that your edge functions can’t access, and acts as a hedge against flaky databases. It’s not true that everything needs server-side rendering — it’s the right default if you want robust, performant apps with good SEO, but there are countless exceptions.
-
-In a SvelteKit app, you can make these choices with as much granularity as you need — for example the page you’re looking at is prerendered, but the [REPL](/repl) is rendered with dynamic data. Switching between the two is a single line of code. We call apps built with this approach ‘[transitional apps](https://www.youtube.com/watch?v=860d8usGC0o)’.
-
-## What can I use with SvelteKit?
-
-Because SvelteKit uses [Vite](https://vitejs.dev/), the lightning-fast build tool, it has out-of-the-box support for hot module reloading, TypeScript, and many other things that developers rely on. You can install plugins from the vast Vite and Rollup ecosystems to add support for other tools.
-
-When creating a SvelteKit project you’ll be asked if you want to add [TypeScript](https://www.typescriptlang.org/), [ESLint](https://eslint.org/), [Prettier](https://prettier.io/), [Playwright](https://playwright.dev/) (for end-to-end browser tests) and [Vitest](https://vitest.dev/) (for unit tests). Integration guides already exist for many popular projects — [Tailwind](https://tailwindcss.com/docs/guides/sveltekit) and [Supabase](https://supabase.com/docs/guides/getting-started/tutorials/with-sveltekit), for example. You can use [Storybook](https://github.com/storybookjs/storybook/blob/next/code/frameworks/sveltekit/README.md) and [Histoire](https://histoire.dev/guide/svelte3/getting-started.html) for your component stories. The community-maintained [svelte-add](https://github.com/svelte-add/svelte-add) lets you add a growing list of other integrations with a single command.
-
-And of course you have access to everything [npm](https://npmjs.com/) has to offer. (Note that some packages require Node.js, and so can only be used when deployed to Node-based platforms.)
-
-## Where can I deploy my apps?
-
-Anywhere! The SvelteKit CLI needs Node.js installed locally, but the framework itself has no dependencies on any platform. This means you can deploy it wherever JavaScript runs.
-
-This is made possible by [adapters](https://kit.svelte.dev/docs/adapters). The default adapter, [adapter-auto](https://github.com/sveltejs/kit/tree/master/packages/adapter-auto), provides zero-config support for Vercel, Netlify, Cloudflare Pages and Azure Static Web Apps, with more platforms coming in the future. Community-provided adapters add support for Deno, Bun, Firebase, App Engine, AWS Lambda and many others.
-
-You can also deploy your app as a Node.js server using [adapter-node](https://github.com/sveltejs/kit/tree/master/packages/adapter-node).
-
-If your entire app is suitable for prerendering, or is a single-page app (SPA), you can use [adapter-static](https://github.com/sveltejs/kit/tree/master/packages/adapter-static) — which turns SvelteKit into a static site generator — with any web server including [GitHub Pages](https://pages.github.com/).
-
-## Acknowledgements
-
-This release was made possible by the hard work of a great many people. First and foremost, we’d like to thank the Svelte community, whose insightful feedback and myriad contributions large and small have shaped this project into something we’re truly proud to share with the wider community of web developers.
-
-We’re also indebted to [Svelte Society](https://sveltesociety.dev/) and the community ambassadors, who, through initiatives like [Svelte Summit](https://www.sveltesummit.com/) and [Svelte Sirens](https://sveltesirens.dev/), have created a lively and welcoming space for Svelte developers, both online and IRL.
-
-There are too many content creators to name without leaving people left out, but to everyone who has released courses and produced educational content around SvelteKit: thank you.
-
-Back in early 2021, when we adopted Vite, we were the first major application framework to do so. At the time it was a risky bet, but we’re thrilled with how that bet paid off. Vite has grown to be an unstoppable force in the JavaScript world, and the Vite team have been brilliant and gracious partners.
-
-We’ve had terrific support from teams at [Vercel](https://vercel.com), [Netlify](https://netlify.app/) and [Cloudflare](https://www.cloudflare.com/) to make zero-config deployments for those platforms possible.
-
-Our friends at [StackBlitz](https://stackblitz.com/) worked feverishly to make [learn.svelte.dev](https://learn.svelte.dev), our first-of-its-kind [WebContainer](https://blog.stackblitz.com/posts/introducing-webcontainers/)-powered interactive tutorial, a reality.
-
-Finally, none of this could have happened without the project’s financial supporters. This includes hundreds of backers on [Open Collective](https://opencollective.com/svelte), and Vercel, which employs two core developers ([Rich](https://twitter.com/Rich_Harris/) and [Simon](https://twitter.com/dummdidumm_/)) to work on Svelte full time and supports the project in many other ways, such as [Steph’s](https://twitter.com/steph_dietz_) [Beginner SvelteKit](https://vercel.com/docs/beginner-sveltekit) course.
-
-## Migrating
-
-If you have an app built with pre-release versions of SvelteKit, we recommend upgrading to the final pre-release version — `@sveltejs/kit@1.0.0-next.588` — before upgrading to 1.0, as the stable release removes errors and warnings that were used for migrating between pre-release versions. We also recommend consulting [this migration guide](https://github.com/sveltejs/kit/discussions/5774), especially if you’re currently on an older version than 1.0.0-next-406.
-
-## What’s next?
-
-SvelteKit 1.0 is the beginning, not the end. It’s ready for production use today, but we’re just getting started. Our roadmap includes built-in i18n support, incremental static regeneration, granular control over deployment region and runtime, image optimisation, and many other improvements. Next year we’ll also start work on Svelte 4 — more on that later.
-
-But don’t let us have the final word. Svelte is a community project, and many of our best ideas aren’t really ours at all — they’re yours. Subscribe to Svelte Society on [Twitter](https://twitter.com/SvelteSociety) and [YouTube](https://youtube.com/sveltesociety) to stay up to date, and join us in our [Discord server](https://svelte.dev/chat) and on [GitHub](https://github.com/sveltejs) to contribute back.
-
-We can’t wait to see what you build.
diff --git a/documentation/blog/2023-01-01-whats-new-in-svelte-january-2023.md b/documentation/blog/2023-01-01-whats-new-in-svelte-january-2023.md
deleted file mode 100644
index f42c15636c..0000000000
--- a/documentation/blog/2023-01-01-whats-new-in-svelte-january-2023.md
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: "What's new in Svelte: January 2023"
-description: 'SvelteKit 1.0, learn.svelte.dev, and type definitions for Svelte elements.'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-It's been just two weeks since the release of [SvelteKit 1.0](https://svelte.dev/blog/announcing-sveltekit-1.0)! If you haven't yet, check out the [livestream](https://www.youtube.com/watch?v=N4BRVkQVoMc), [new website](https://kit.svelte.dev/) and [learn.svelte.dev](https://learn.svelte.dev/) to learn all the features of SvelteKit step-by-step.
-
-Let's dive into the details...
-
-## What's new in SvelteKit
-
-- `@sveltejs/kit` 1.0 is out! All future releases will follow semver and changes will be listed as major/minor/patch in the [CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md#100).
-- Improved support for Storybook and Histoire ([#7990](https://github.com/sveltejs/kit/pull/7990)). Work is ongoing to fully support those tools ([storybook#20239](https://github.com/storybookjs/storybook/pull/20239)).
-- `vitePreprocess` is now the default preprocessor. Please see [the docs](https://kit.svelte.dev/docs/integrations#preprocessors) for differences between `vitePreprocess` and `svelte-preprocess` ([#8036](https://github.com/sveltejs/kit/pull/8036)).
-
-**Breaking changes:**
-
-- Unknown exports (except when starting with an underscore) are no longer allowed from `+(layout|page)(.server)?.js` and `+server.js` files ([#7878](https://github.com/sveltejs/kit/pull/7878))
-- `__data.json` is now stripped from URL ([#7979](https://github.com/sveltejs/kit/pull/7979))
-- `sveltekit()` will now return a promise for an array of Vite plugins ([#7994](https://github.com/sveltejs/kit/pull/7994))
-- A new `embedded` option, turned off by default, helps with link clicks when embedding SvelteKit ([docs](https://kit.svelte.dev/docs/configuration), [#7969](https://github.com/sveltejs/kit/pull/7969))
-- Automatic fallback generation has been replaced with `builder.generateFallback(fallback)` ([#8013](https://github.com/sveltejs/kit/pull/8013))
-- `invalid()` is now `fail()` and `ValidationError` is now `ActionFailure` ([#8012](https://github.com/sveltejs/kit/pull/8012))
-- SvelteKit will now throw an error on invalid load response ([#8003](https://github.com/sveltejs/kit/pull/8003))
-- SvelteKit is now using Vite 4 and requires a Svelte `peerDependency` of `^3.54.0` ([#7543](https://github.com/sveltejs/kit/pull/7543))
-- Shells are now prerendered when `ssr` is false and `prerender` is not false - ensure prerender is false when ssr is also false ([#8131](https://github.com/sveltejs/kit/pull/8131))
-- Warnings and errors about removed/changed APIs have been removed ([#8019](https://github.com/sveltejs/kit/pull/8019))
-
-## What's new in Svelte
-
-- The `options.direction` argument can now be passed to custom transition functions (**3.54.0**, [#3918](https://github.com/sveltejs/svelte/issues/3918))
-- Variables can now be updated from a `@const` declared function (**3.54.0**, [#7843](https://github.com/sveltejs/svelte/issues/7843))
-- `svelte/elements` has been added for Svelte/HTML type definitions (**3.55.0**, [#7649](https://github.com/sveltejs/svelte/pull/7649))
-
-## What's new in Language Tools
-
-The Svelte extension and language tools now have a few new minimum version requirements:
-
-- Node version is now 16
-- TypeScript version is now 4.9
-- Svelte version is now 3.55
-
-The following features have also been released:
-
-- missing handler quick fix ([#1731](https://github.com/sveltejs/language-tools/pull/1731))
-- add Svelte anchor missing attribute code action ([#1730](https://github.com/sveltejs/language-tools/pull/1730))
-- better commit characters handling ([#1742](https://github.com/sveltejs/language-tools/pull/1742))
-- add `--preserveWatchOutput` option ([#1715](https://github.com/sveltejs/language-tools/pull/1715))
-- enhance Quickfixes to include Svelte Stores ([#1789](https://github.com/sveltejs/language-tools/pull/1789))
-- only show SvelteKit files context menu in SvelteKit projects ([#1771](https://github.com/sveltejs/language-tools/pull/1771))
-- use the `satisfies` operator if possible ([#1770](https://github.com/sveltejs/language-tools/pull/1770))
-
-For all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Svelte Recipes 🧑‍🍳](https://svelte.recipes/) provides code snippets for common data visualization problems
-- [Everything Svelte](https://www.everythingsvelte.com/) is a new course teaching everything you need to know to build a modern web application
-- [CSS Timeline](https://css-timeline.vercel.app/) is a Timeline of the history and evolution of CSS
-- [GitBar](https://github.com/mikaelkristiansson/gitbar) is a system tray app for showing your pull requested reviews
-- [Texture Lab](https://www.texturelab.xyz/) generates instant textures for games from any text
-- [Totems](https://totems-soclage.com/) is a studio creating custom-made stands and supports
-- [PeopletoNotion](https://www.peopletonotion.com/) is a Chrome Extension that adds LinkedIn profiles to Notion in one click
-- [DeckDev](https://deckdev.com/) is a deck builder for Magic: The Gathering
-- [Default Shortcuts](https://www.defaultshortcuts.com/) is a tool for searching keyboard shortcuts across browsers.
-
-**Learning Resources**
-
-_From Svelte Society_
-
-- [Svelte Society - London December 2022](https://www.youtube.com/watch?v=2ijSarsHfN0) featuring two talks by Antony and Rich, respectively. Rich's talk, "Mistakes were made" is a SvelteKit 1.0 retrospective.
-- [SvelteKit with Netlify Edge Functions](https://twitter.com/BrittneyPostma/status/1603402599742537729?s=20&t=Lw08QNMpdEP1JZzMQGXLDA) by Brittney Postma
-- [Sirens Stream: Skeleton - A fully featured UI Toolkit](https://www.youtube.com/watch?v=2OnJYCXJPK4) with Chris Simmons and Brittney Postma
-- [Sirens: SvelteKit for Enterprise](https://www.youtube.com/watch?v=_0ijqV0DmNQ) - Lacey Pevey joins the Sirens to talk through using SvelteKit at the Enterprise level
-- [Sirens: Form Actions](https://www.youtube.com/watch?v=2OISk5-EHek) - Kev joins the Sirens again to chat about Form actions in SvelteKit and create a new form for speaker submissions on SvelteSirens.dev
-
-_To Watch_
-
-- [SvelteKit is my mistress](https://www.youtube.com/watch?v=uEJ-Rnm2yOE) by Fireship
-- [Sveltekit 1.0 in under 3 minutes](https://www.youtube.com/watch?v=3KGKDgwIrkE) by Gui Bibeau
-- [What Svelte UI Library Should You Use?](https://www.youtube.com/watch?v=O0mNU0maItY) and [The Best Icon Library For Svelte (Iconify)](https://www.youtube.com/watch?v=iGVhzsTZSa8) by Joy of Code
-
-_To Read_
-
-- [Rendering emails with Svelte](https://escape.tech/blog/sveltemails/) by Gautier Ben Aïm
-- [Now That React is Dead, What’s the Next Big Thing?](https://javascript.plainenglish.io/now-that-react-js-is-dead-whats-the-next-big-thing-7fa72a36a69b) by Somnath Singh
-- [What is SvelteKit? And Why Should You Care?](https://blog.tiia.rocks/what-is-sveltekit-and-why-should-you-care) by Tila
-- [Sveltekit API endpoints](https://www.jefmeijvis.com/post/006-sveltekit-api-endpoints) by Jef Meijvis
-- [Chart.js 4.0](https://github.com/chartjs/Chart.js/discussions/10977) has been released, with updated Svelte support
-- [Creating A Custom Svelte Media Query Store](https://pqina.nl/blog/svelte-media-query-store/) by Rik Schennink
-
-**Libraries, Tools & Components**
-
-- [Konsta UI](https://konstaui.com/) is a library of pixel perfect mobile UI components built with Tailwind CSS for React, Vue & Svelte
-- [probablykasper/modal-svelte](https://github.com/probablykasper/modal-svelte) is a modal component for Svelte
-- [deepcrayon/scrolltron](https://spacecruft.org/deepcrayon/scrolltron) is a news ticker overlay for OBS Studio
-- [JetBrains WebStorm 2022.3](https://www.jetbrains.com/webstorm/whatsnew/#:~:text=Update%20about%20Svelte%20support) now has built-in support for Svelte
-- [NextAuth.js](https://vercel.com/blog/announcing-sveltekit-auth) is now available for SvelteKit
-- [SvelteKit CAS authentication](https://www.npmjs.com/package/@macfja/sveltekit-cas) is a set of functions to ease usage of a CAS/SSO in SvelteKit
-- [@macfja/sveltekit-session](https://www.npmjs.com/package/@macfja/sveltekit-session) is an easy way to do session management for SvelteKit
-- [@svelte-plugins/tooltips](https://svelte-plugins.github.io/tooltips/) is a basic tooltip component written in Svelte
-- [tRPC-SvelteKit](https://github.com/icflorescu/trpc-sveltekit) provides end-to-end typesafe APIs for your SvelteKit applications
-- [SvelteKit Tailwind Blog Starter](https://github.com/akiarostami/sveltekit-tailwind-blog-starter) is an easily configurable and customizable blog starter for SvelteKit + Tailwind CSS
-- [Free Svelte Accelerators](https://sveltekitstarter.com/) is a list of Svelte and Sveltekit open source code to jump start your project
-
-Happy new year 🎆 Let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte)
diff --git a/documentation/blog/2023-02-01-whats-new-in-svelte-february-2023.md b/documentation/blog/2023-02-01-whats-new-in-svelte-february-2023.md
deleted file mode 100644
index 98be8918ca..0000000000
--- a/documentation/blog/2023-02-01-whats-new-in-svelte-february-2023.md
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: "What's new in Svelte: February 2023"
-description: 'Minor versions and major satisfaction'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Since last month, we've seen a couple of minor versions across Svelte and SvelteKit, a bunch of educational content to support the 1.0 release, as well as the [State of JS survey](https://stateofjs.com) results...
-
-Svelte, once again, increased in satisfaction and interest, so thanks to everyone who voted!
-
-Let's dive into the updates...
-
-## What's new in SvelteKit
-
-Work in the Svelte ecosystem this month has been focused on SvelteKit bug fixes and addressing feedback from the 1.0 launch. One of the more awaited [bug fixes to SvelteKit's base path support](https://github.com/sveltejs/kit/issues/2958) landed, which means that you can now create SvelteKit projects on remote development environments. There have been several [new releases](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md) with these fixes as well as a handful of new features such as:
-
-- The submitter's value will now be included automatically when progressively enhancing <form method="get"> (**1.0.3**, [#8273](https://github.com/sveltejs/kit/pull/8273))
-- Added an error in dev mode if global fetch is used with relative URL (**1.0.8**, [#8370](https://github.com/sveltejs/kit/pull/8370))
-- A warning will now indicated that hydration may break if comments are removed from HTML (**1.0.11**, [#8423](https://github.com/sveltejs/kit/pull/8423))
-- A warning will occur when of page options are used in `.svelte` files or a missing `<slot />` in layout is detected (**1.1.0**, [#8475](https://github.com/sveltejs/kit/pull/8475))
-- The new `text(...)` helper makes it easy to generate text responses (**1.2.0**, [#8371](https://github.com/sveltejs/kit/pull/8371))
-- The public env can now be accessed within app.html (**1.2.0**, [Docs](https://kit.svelte.dev/docs/project-structure#project-files-src), [#8449](https://github.com/sveltejs/kit/pull/8449))
-- An error will now be thrown if cookie exceeds size limit (**1.2.1**, [#8591](https://github.com/sveltejs/kit/pull/8591))
-- The generated `tsconfig` can now be modified (**1.3.0**, [#8606](https://github.com/sveltejs/kit/pull/8606))
-
-## What's new in Svelte and Language Tools
-
-- Added support for `html.customData` from the VS Code HTML language service (**extensions-107.0.0**, [#1824](https://github.com/sveltejs/language-tools/pull/1824))
-- Autocompletion for stores that need to be imported ([#1823](https://github.com/sveltejs/language-tools/pull/1823)) and object/class member snippets ([#1817](https://github.com/sveltejs/language-tools/pull/1817)) has been added to the Svelte extension (**extensions-107.0.0**)
-- Improve detection of promises that are also functions (**Svelte 3.55.1**, [#8162](https://github.com/sveltejs/svelte/pull/8162))
-- Add missing types and properties for the global `part` attribute and `on:submit`, respectively (**Svelte 3.55.1**, [#8181](https://github.com/sveltejs/svelte/issues/8181))
-- Lots of performance and bug fixes (**Svelte 3.55.1\*** and **extensions-107.0.x**)
-
-\*for all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Titowest.com](https://titowest.com/) is a series of photographic films by the writer & photographer, Tito West
-- [Verve](https://github.com/ParthJadhav/verve) is a lightweight and blazingly fast launcher for accessing and opening applications, files and documents
-- [Round The World](https://rtw.voyage/) is an interactive guide to the travels of Andrew Carnegie
-- [Linear Regression](https://mlu-explain.github.io/linear-regression/) is an interactive blog post visual introduction to (almost) everything you should know about linear regression
-- [Flotes](https://flotes.app/) is a free note taking app enhanced with flashcard features
-- [nomie](https://github.com/open-nomie/nomie6-oss) is a Daily Journal for short attention spans
-- [nocode.gallery](https://nocode.gallery/) is a collection of stunning websites made with no code
-- [Whom to Follow](https://whomtofollow.com/) helps you find accounts you'll love by searching the network of accounts you already follow
-- [poker-simulator](https://github.com/hucancode/poker-simulator) is a poker simulation and evaluation tool
-- [Pixelicious](https://www.pixelicious.xyz/) converts your images into pixel art
-- [Apple Music](https://music.apple.com/us/browse) is now built with Svelte ([proof](https://twitter.com/BrittneyPostma/status/1615381017300271104))
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [SvelteKit | Rich Harris | ViteConf 2022](https://www.youtube.com/watch?v=-OMPfr56kXI)
-- [Talking Gradio and AI with pngwn 🐧](https://www.svelteradio.com/episodes/gradio-with-pngwn) from Svelte Radio
-- [Progressively enhancing the Marvel By Year filter](https://geoffrich.net/posts/marvel-filter-state/) and [Advent of SvelteKit 2022: my favorite demos](https://geoffrich.net/posts/advent-of-sveltekit-2022/) by Geoff Rich
-- [EP 13: Contributing more to open source + a Svelte Newsletter showcase rewind ⏪](https://bookmarkbeat.substack.com/p/contributing-more-to-open-source) by Dani Sandoval
-
-_To Watch or Hear_
-
-- [I built a $5 chat app with Pocketbase & Svelte. Will it scale?](https://www.youtube.com/watch?v=gUYBFDPZ5qk) by Fireship
-- [The Comprehensive Introduction To SvelteKit](https://www.youtube.com/watch?v=obmiLi3bhkQ), [What Svelte UI Library Should You Use?](https://www.youtube.com/watch?v=O0mNU0maItY) and [Learn Everything About SvelteKit Routing (Pages, Layout, Nested Routes)](https://www.youtube.com/watch?v=7hXHbGj6iE0) by Joy of Code
-- [Progressive Enhancement in SvelteKit (use:enhance)](https://www.youtube.com/watch?v=jXtzWMhdI2U), [Are Your Routes Actually Protected?](https://www.youtube.com/watch?v=UbhhJWV3bmI) and [10X Your SvelteKit Developer Experience in VS Code](https://www.youtube.com/watch?v=13v50nLh67Q) by Huntabyte
-- [The easiest realtime app I’ve ever built](https://www.youtube.com/watch?v=UbOaAtHWidc) by Beyond Fireship
-- [Angular developers can learn Svelte so fast...](https://www.youtube.com/watch?v=lKdw_z9qmPU) by Joshua Morony
-- [SvelteKit + PocketBase Integration: User Login and Registration](https://www.youtube.com/watch?v=AxPB3e-3yEM) by Jian Yuan Lee
-- [Marvels Of Using Svelte and SvelteKit - JSJ 566](https://topenddevs.com/podcasts/javascript-jabber/episodes/marvels-of-using-svelte-and-sveltekit-jsj-566) with Tracey Lee and Adam L Barrett
-
-_To Read_
-
-- [A practical first look at the Svelte framework](https://mainmatter.com/blog/2023/01/24/sveltekit-super-rentals/) by Daniel Beer
-- [State Modeling in Svelte with XState](https://github.com/annaghi/xstate-svelte-workshop) is the port of the Frontend Masters React + XState workshop written in Svelte and built with SvelteKit!
-- [🚀 Code your SvelteKit website faster with Stylify CSS](https://stylifycss.com/blog/code-your-sveltekit-website-faster-with-stylify-css/) by Stylify CSS
-- [🎮 Five Svelte Games To Learn How To Code](https://tomaszs2.medium.com/five-svelte-games-to-learn-how-to-code-f36ae6e58923) by Tom Smykowski
-- [How to make declarative (code-based) router instead of file-based router in SvelteKit](https://dev.to/devpunk/how-to-make-declarativecode-based-router-instead-of-file-based-router-in-sveltekit-2-3dd4) by Dev Punk
-- [How to import tailwindcss custom config in JS/TS parts of a SvelteKit app](https://gist.github.com/0gust1/aa8c8b831428cdd7a5535e92cbf02f04) by 0gust1
-- [SvelteKit Internals: Load function](https://www.okupter.com/blog/sveltekit-internals-load-function) and [Svelte and CSS](https://www.okupter.com/blog/svelte-and-css) by Justin Ahinon
-- [Internationalization Formatting with Intl + SSR + SvelteKit](https://www.captaincodeman.com/internationalization-formatting-with-intl-ssr-sveltekit) by Captain Codeman
-- [Typesafe i18n with SvelteKit](https://blog.encodeart.dev/typesafe-i18n-with-sveltekit) by Andreas Söderlund
-- [Authorization in your SvelteKit app](https://cerbos.dev/blog/authorization-in-your-sveltekit-app) by Adam Barrett
-- [Validate your form using Sveltekit, Tailwindcss, Felte and Yup](https://medium.com/@Heesel/validate-your-form-using-sveltekit-tailwindcss-felte-and-yup-ddc11cd04717) by Hessel
-- [SvelteKit Form Actions bound to TypeScript class + Validation (yup) w/dynamic array](http://enehana.nohea.com/general/sveltekit-form-actions-bound-to-typescript-class-validation-yup-w-dynamic-array/) by Hekili Tech
-- [Smooth Page Transitions with SvelteKit](https://philkruft.dev/blog/smooth-page-transitions-with-sveltekit/) by Phil Kruft
-- [Redis Integration in SvelteKit: A Game-Changer for Session Management](https://dev.to/theether0/redis-integration-in-sveltekit-a-game-changer-for-session-management-84i) by Shivam Meena
-- [SvelteKit and GitHub Pages](https://andrewlester.net/blog/posts/sveltekit-and-github-pages) by Andrew Lester
-- [Tailwind + Sveltekit in 2023](https://medium.com/@gentmitch/tailwind-sveltkit-in-2023-44c19d91c8fd) by Mitch Gent
-- [Svelte Stores Tutorial: Share Data Between Multiple Components](https://learnjavascripts.com/development/web-development/frameworks/svelte/svelte-stores-tutorial-share-data-between-multiple-components/) by Vincent Widerberg
-
-**Libraries, Tools & Components**
-
-- [Sveltepress](https://sveltepress.site/) is a simple, easy to use, content centered site build tool with the full power of SvelteKit
-- [Svelte Form Helper](https://www.npmjs.com/package/svelte-form-helper) is a lightweight helper for form validation with Svelte
-- [Dapper UI](https://github.com/Bastian/dapper-ui) is a sleek and modern UI component library for Svelte, offering full TypeScript support and extensive documentation
-- [TeilUI](https://sidharth-anand.github.io/teil-ui/) is a better way to build design systems with Svelte
-- [Neodrag](https://www.neodrag.dev/) is an SSR-friendly, multi-framework draggable library
-- [Svelvet](https://www.svelvet.io/), a UI library for Svelte, is now 5.0 (read more [here](https://medium.com/@efergus1/svelvet-5-0-a-community-driven-update-cfcc93e7b7a7))
-- [Svelte Inview](https://github.com/maciekgrzybek/svelte-inview) is a Svelte action that monitors an element enters or leaves the viewport/parent element
-- [html2svelte](https://github.com/drbh/html2svelte) makes it easy to convert HTML to Svelte components in a snap
-
-Thanks for reading! Feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte)
diff --git a/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md b/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
deleted file mode 100644
index a030e8fc41..0000000000
--- a/documentation/blog/2023-02-21-streaming-snapshots-sveltekit.md
+++ /dev/null
@@ -1,207 +0,0 @@
----
-title: Streaming, snapshots, and other new features since SvelteKit 1.0
-description: Exciting improvements in the latest version of SvelteKit
-author: Geoff Rich
-authorURL: https://geoffrich.net
----
-
-The Svelte team has been hard at work since the release of SvelteKit 1.0. Let’s talk about some of the major new features that have shipped since launch: [streaming non-essential data](https://kit.svelte.dev/docs/load#streaming-with-promises), [snapshots](https://kit.svelte.dev/docs/snapshots), and [route-level config](https://kit.svelte.dev/docs/page-options#config).
-
-## Stream non-essential data in load functions
-
-SvelteKit uses [load functions](https://kit.svelte.dev/docs/load) to retrieve data for a given route. When navigating between pages, it first fetches the data, and then renders the page with the result. This could be a problem if some of the data for the page takes longer to load than others, especially if the data isn’t essential – the user won’t see any part of the new page until all the data is ready.
-
-There were ways to work around this. In particular, you could fetch the slow data in the component itself, so it first renders with the data from `load` and then starts fetching the slow data. But this was not ideal: the data is even more delayed since you don’t start fetching until the client renders, and you’re also having to break SvelteKit’s `load` convention.
-
-Now, in SvelteKit 1.8, we have a new solution: you can return a nested promise from a server load function, and SvelteKit will start rendering the page before it resolves. Once it completes, the result will be [streamed](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) to the page.
-
-For example, consider the following `load` function:
-
-```ts
-// @errors: 2304
-export const load: PageServerLoad = () => {
-	return {
-		post: fetchPost(),
-		streamed: {
-			comments: fetchComments()
-		}
-	};
-};
-```
-
-SvelteKit will automatically await the `fetchPost` call before it starts rendering the page, since it’s at the top level. However, it won’t wait for the nested `fetchComments` call to complete – the page will render and `data.streamed.comments` will be a promise that will resolve as the request completes. We can show a loading state in the corresponding `+page.svelte` using Svelte’s [await block](https://svelte.dev/docs#template-syntax-await):
-
-```svelte
-<script lang="ts">
-	import type { PageData } from './$types';
-	export let data: PageData;
-</script>
-
-<article>
-	{data.post}
-</article>
-
-{#await data.streamed.comments}
-	Loading...
-{:then value}
-	<ol>
-		{#each value as comment}
-			<li>{comment}</li>
-		{/each}
-	</ol>
-{/await}
-```
-
-There is nothing unique about the property `streamed` here – all that is needed to trigger the behavior is a promise outside the top level of the returned object.
-
-SvelteKit will only be able to stream responses if your app’s hosting platform supports it. In general, any platform built around AWS Lambda (e.g. serverless functions) will not support streaming, but any traditional Node.js server or edge-based runtime will. Check your provider’s documentation for confirmation.
-
-If your platform does not support streaming, the data will still be available, but the response will be buffered and the page won’t start rendering until all data has been fetched.
-
-## How does it work?
-
-In order for data from a server `load` function to get to the browser, we have to _serialize_ it. SvelteKit uses a library called [devalue](https://github.com/Rich-Harris/devalue), which is like `JSON.stringify` but better — it can handle values that JSON can't (like dates and regular expressions), it can serialize objects that contain themselves (or that exist multiple times in the data) without breaking identity, and it protects you against [XSS vulnerabilities](https://github.com/rich-harris/devalue#xss-mitigation).
-
-When we server-render a page, we tell devalue to serialize promises as function calls that create a _deferred_. This is a simplified version of the code SvelteKit adds to the page:
-
-```js
-// @errors: 2339 7006
-const deferreds = new Map();
-
-window.defer = (id) => {
-	return new Promise((fulfil, reject) => {
-		deferreds.set(id, { fulfil, reject });
-	});
-};
-
-window.resolve = (id, data, error) => {
-	const deferred = deferreds.get(id);
-	deferreds.delete(id);
-
-	if (error) {
-		deferred.reject(error);
-	} else {
-		deferred.fulfil(data);
-	}
-};
-
-// devalue converts your data into a JavaScript expression
-const data = {
-	post: {
-		title: 'My cool blog post',
-		content: '...'
-	},
-	streamed: {
-		comments: window.defer(1)
-	}
-};
-```
-
-This code, along with the rest of the server-rendered HTML, is sent to the browser immediately, but the connection is kept open. Later, when the promise resolves, SvelteKit pushes an additional chunk of HTML to the browser:
-
-```html
-<script>
-	window.resolve(1, {
-		data: [{ comment: 'First!' }]
-	});
-</script>
-```
-
-For client-side navigation, we use a slightly different mechanism. Data from the server is serialized as [newline delimited JSON](https://dataprotocols.org/ndjson/), and SvelteKit reconstructs the values — using a similar deferred mechanism — with `devalue.parse`:
-
-```json
-// this is generated immediately — note the ["Promise",1]...
-[{"post":1,"streamed":4},{"title":2,"content":3},"My cool blog post","...",{"comments":5},["Promise",6],1]
-
-// ...then this chunk is sent to the browser once the promise resolves
-[{"id":1,"data":2},1,[3],{"comment":4},"First!"]
-```
-
-Because promises are natively supported in this way, you can put them anywhere in the data returned from `load` (except at the top level, since we automatically await those for you), and they can resolve with any type of data that devalue supports — including more promises!
-
-One caveat: this feature needs JavaScript. Because of this, we recommend that you only stream in non-essential data so that the core of the experience is available to all users.
-
-For more on this feature, see [the documentation](https://kit.svelte.dev/docs/load#streaming-with-promises). You can see a demo at [sveltekit-on-the-edge.vercel.app](https://sveltekit-on-the-edge.vercel.app/edge) (the location data is artificially delayed and streamed in) or [deploy your own on Vercel](https://vercel.com/templates/svelte/sveltekit-edge-functions), where streaming is supported in both Edge Functions and Serverless Functions.
-
-We're grateful for the inspiration from prior implementations of this idea including Qwik, Remix, Solid, Marko, React and many others.
-
-## Snapshots
-
-Previously in a SvelteKit app, if you navigated away after starting to fill out a form, going back wouldn’t restore your form state – the form would be recreated with its default values. Depending on the context, this can be frustrating for users. Since SvelteKit 1.5, we have a built-in way to address this: snapshots.
-
-Now, you can export a `snapshot` object from a `+page.svelte` or `+layout.svelte`. This object has two methods: `capture` and `restore`. The `capture` function defines what state you want to store when the user leaves the page. SvelteKit will then associate that state with the current history entry. If the user navigates back to the page, the `restore` function will be called with the state you previously had set.
-
-For example, here is how you would capture and restore the value of a textarea:
-
-```svelte
-<script lang="ts">
-	import type { Snapshot } from './$types';
-
-	let comment = '';
-
-	export const snapshot: Snapshot = {
-		capture: () => comment,
-		restore: (value) => (comment = value)
-	};
-</script>
-
-<form method="POST">
-	<label for="comment">Comment</label>
-	<textarea id="comment" bind:value={comment} />
-	<button>Post comment</button>
-</form>
-```
-
-While things like form input values and scroll positions are common examples, you can store any JSON-serializable data you like in a snapshot. The snapshot data is stored in [sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage), so it will persist even when the page is reloaded, or if the user navigates to a different site entirely. Because it’s in `sessionStorage`, you won’t be able to access it during server-side rendering.
-
-For more, see [the documentation](https://kit.svelte.dev/docs/snapshots).
-
-## Route-level deployment configuration
-
-SvelteKit uses platform-specific [adapters](https://kit.svelte.dev/docs/adapters) to transform your app code for deployment to production. Until now, you had to configure your deployment on an app-wide level. For instance, you could either deploy your app as an edge function or a serverless function, but not both. This made it impossible to take advantage of the edge for parts of your app – if any route needed Node APIs, then you couldn’t deploy any of it to the edge. The same is true for other aspects of deployment configuration, such as regions and allocated memory: you had to choose one value that applied to every route in your entire app.
-
-Now, you can export a `config` object in your `+server.js`, `+page(.server).js` and `+layout(.server).js` files to control how those routes are deployed. Doing so in a `+layout.js` will apply the configuration to all child pages. The type of `config` is unique to each adapter, since it depends on the environment you’re deploying to.
-
-```ts
-// @errors: 2307
-import type { Config } from 'some-adapter';
-
-export const config: Config = {
-	runtime: 'edge'
-};
-```
-
-Configs are merged at the top level, so you can override values set in a layout for pages further down the tree. For more details, see [the documentation](https://kit.svelte.dev/docs/page-options#config).
-
-If you deploy to Vercel, you can take advantage of this feature by installing the latest versions of SvelteKit and your adapter. This will require a major upgrade to your adapter version, since adapters supporting route-level config require SvelteKit 1.5 or later.
-
-```bash
-npm i @sveltejs/kit@latest
-npm i @sveltejs/adapter-auto@latest # or @sveltejs/adapter-vercel@latest
-```
-
-For now, only the [Vercel adapter](https://kit.svelte.dev/docs/adapter-vercel#deployment-configuration) implements route-specific config, but the building blocks are there to implement this for other platforms. If you’re an adapter author, see the changes in [the PR](https://github.com/sveltejs/kit/pull/8740) to see what is required.
-
-## Incremental static regeneration on Vercel
-
-Route-level config also unlocked another much-requested feature – you can now use [incremental static regeneration](https://kit.svelte.dev/docs/adapter-vercel#incremental-static-regeneration) (ISR) with SvelteKit apps deployed to Vercel. ISR provides the performance and cost advantages of prerendered content with the flexibility of dynamically rendered content.
-
-To add ISR to a route, include the `isr` property in your `config` object:
-
-```ts
-export const config = {
-	isr: {
-		// see Vercel adapter docs for the required options
-	}
-};
-```
-
-## And much more...
-
-- The [OPTIONS method](https://kit.svelte.dev/docs/routing#server) is now supported in `+server.js` files
-- Better error messages when you [export something that belongs in a different file](https://github.com/sveltejs/kit/pull/9055) or [forget to put a slot](https://github.com/sveltejs/kit/pull/8475) in your +layout.svelte.
-- You can now [access public environment variables in app.html](https://kit.svelte.dev/docs/project-structure#project-files-src)
-- A new [text helper](https://kit.svelte.dev/docs/modules#sveltejs-kit-text) for creating responses
-- And a ton of bug fixes – see [the changelog](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md) for the full release notes.
-
-Thank you to everyone who has contributed and uses SvelteKit in their projects. We’ve said it before, but Svelte is a community project, and it wouldn’t be possible without your feedback and contributions.
diff --git a/documentation/blog/2023-03-01-whats-new-in-svelte-march-2023.md b/documentation/blog/2023-03-01-whats-new-in-svelte-march-2023.md
deleted file mode 100644
index 657feacb7d..0000000000
--- a/documentation/blog/2023-03-01-whats-new-in-svelte-march-2023.md
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: "What's new in Svelte: March 2023"
-description: 'SvelteHack, post-1.0 SvelteKit improvements and a huge showcase'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-March is _coming in hot_ with a number of essential features having been added to SvelteKit following its 1.0 launch. Check out [last week's blog post](https://svelte.dev/blog/streaming-snapshots-sveltekit) for more details.
-
-Svelte Society also launched [SvelteHack](https://hack.sveltesociety.dev/) last month with over $12,000 in prizes - calling all Svelte developers, new and old, to make something awesome before the April 17th deadline!
-
-And, if you haven't heard already, there's going to be another Svelte Summit! Head over to [SvelteSummit.com](https://www.sveltesummit.com/) and sign up for the newsletter to get updates about the next event 📬
-
-Now let's jump into this month's changes...
-
-## What's new in SvelteKit
-
-- `$app/paths` can now be used without an app - making things like component testing with Vitest, using Storybook, etc. easier (**1.4.0**, [#8838](https://github.com/sveltejs/kit/pull/8838))
-- Adapters can now be configured at the route level (**1.5.0**, [Docs](https://kit.svelte.dev/docs/page-options#config), [#8740](https://github.com/sveltejs/kit/pull/8740))
-- The new snapshot mechanism preserves ephemeral DOM state even after navigation and page reloads (**1.5.0**,[Docs](https://kit.svelte.dev/docs/snapshots), [#8710](https://github.com/sveltejs/kit/pull/8710))
-- `OPTIONS` are now available within the server method (**1.6.0**, [Docs](https://kit.svelte.dev/docs/routing#server), [#8731](https://github.com/sveltejs/kit/pull/8731))
-- Richer error messages have been added for invalid exports (**1.7.0**, [#9055](https://github.com/sveltejs/kit/pull/9055))
-- Streaming promises are now available for server load functions (**1.8.0**, [Docs](https://kit.svelte.dev/docs/load#streaming-with-promises), [#8901](https://github.com/sveltejs/kit/pull/8901))
-- A new configuration option, `preloadStrategy`, helps tune preloading to avoid import 'waterfalls' on certain browsers (**1.8.4**, [Docs](https://kit.svelte.dev/docs/configuration#output), [#9179](https://github.com/sveltejs/kit/pull/9179))
-- The new `paths.relative` option can control interpretation of `paths.assets` and `paths.base` (**1.9.0**, [Docs](https://kit.svelte.dev/docs/configuration#paths), [#9220](https://github.com/sveltejs/kit/pull/9220))
-
-## What's new in Svelte and Language Tools
-
-- The REPL on `svelte.dev` now supports the `exports` field in `package.json` ([#445](https://github.com/sveltejs/sites/pull/445))
-- The new Call Hierarchy feature lets you see where a function or a class is called and follow the call stack up (**extensions-107.1.0**, [#1889](https://github.com/sveltejs/language-tools/pull/1889))
-- `declarationMap` support has been added to the Svelte extension. Now "go to definition" on `.svelte` files will navigate to the source code when a library has declaration maps (**extensions-107.1.0**, [#1878](https://github.com/sveltejs/language-tools/pull/1878))
-- [TypeScript Inlay Hints](https://code.visualstudio.com/docs/typescript/typescript-editing#_inlay-hints) support is now available via the Svelte Extension. Enable them with `javascript.inlayHints.*` or `typescript.inlayHints.*` (**extensions-107.1.0**, [#1855](https://github.com/sveltejs/language-tools/pull/1855))
-
-\*for all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [win32.run](https://github.com/ducbao414/win32.run) is a version of Windows XP in the browser - with a File System, programs, XP-style File Picker and Saver dialogs, 3rd-party programs, and more
-- [Svelte Radial Menu](https://github.com/tglide/svelte-radial-menu) is a radial menu experiment - based on [Rauno's radial menu](https://rauno.me/craft/radial-menu)
-- [apod color search](https://github.com/brycedorn/apod-color-search) lets you search for astronomy picture of the day (APO) photos by color
-- [SvHighlight](https://www.reddit.com/r/sveltejs/comments/10pvqfm/svhighlight_a_code_highlighter_for_sveltekit_and/) is a code highlighter for SvelteKit and TailwindCSS with blur and focus blocks
-- [Limey](https://limey.io/) lets you create beautiful one-page websites in minutes
-- [a/links](https://a-links.io/) is an extension for short, composable bookmarks
-- [Sprint Cards](https://sprint.cards) is a design challenge generator
-- [Plought](https://github.com/rossrobino/plought) is a tool to reduce noise in decision making
-- [ArcOS-Frontend](https://github.com/IzK-ArcOS/ArcOS-Frontend) is a rewrite of the Arc operating system's frontend in Svelte
-- [Poxi](https://poxi.page) is powering the user-made web with a drag-and-drop, drawable website editor that's easy to collaborate in
-- [demo-threlte-scroller-rocinante](https://twitter.com/a_warnes/status/1629235313808744449) is a "scrolly telling" proof-of-concept that combines svelte-sequence with Threlte
-- [Phonics + Stuff](https://www.phonicsandstuff.com/) is a set of resources for learning & teaching phonics
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Streaming, snapshots, and other new features since SvelteKit 1.0](https://svelte.dev/blog/streaming-snapshots-sveltekit) by Geoff Rich (on the Svelte Blog)
-- [View Transition Experiments with Svelte](https://geoffrich.net/posts/view-transition-experiments/) and [Native Page Transitions in SvelteKit (updated for 2023)](https://geoffrich.net/posts/page-transitions-1/) by Geoff Rich
-- [Ron Au's story and how to be whimsical!](https://www.svelteradio.com/episodes/ron-aus-story-and-how-to-be-whimsical) by Svelte Radio
-- [SvelteKit 1.0 with Rich Harris](https://podrocket.logrocket.com/sveltekit) by PodRocket
-- [Svelte Society Africa](https://twitter.com/SvelteAfrica/status/1620526757593116672?s=20) has formally launched!
-- [SvelteKit overview with Simon and Dominik](https://www.youtube.com/watch?v=CiOigf4FbNg) by Frontend RheinMain
-
-_To Watch or Hear_
-
-- [Delightful Web Development with SvelteKit](https://workshops.thisdot.co/learn/developing-with-sveltekit) is a workshop from This Dot Labs - taking place on April 13th.
-- [Have More Control Over Layouts With Group Layouts In SvelteKit](https://www.youtube.com/watch?v=9UpaKEVuErs) and [Learn SvelteKit Hooks Through 6 Examples](https://www.youtube.com/watch?v=Kzrz7GZ9pIg) by Joy of Code
-- [Svelte Kit Creating Popup Modals with Tailwind CSS](https://www.youtube.com/watch?v=qI4-q7SA7uM) and [SvelteKit: Creating Dynamic Tables with Tailwind CSS](https://www.youtube.com/watch?v=QqoYrdzoSSk) by Abdul Rehman 2050
-
-_To Read_
-
-- [Svelte Language Server Example](https://github.com/volarjs/svelte-language-tools) by VolarJS
-- [How I Made My App 2.4x Faster Switching to Svelte](https://blog.flotes.app/posts/flotes-2x-faster) by Erik Verduin
-- [Smooth Page Transitions with SvelteKit](https://www.philkruft.dev/blog/smooth-page-transitions-with-sveltekit/) and [How to Build a Static SvelteKit Site](https://www.philkruft.dev/blog/how-to-build-a-static-sveltekit-site/) by Phil Kruft
-- [Blazing fast PWAs with SEO power using SvelteKit and Ionic](https://ionic.io/blog/pwas-using-sveltekit-and-ionic) by Tommertom
-- [Svelte Stores Tutorial: Share Data Between Multiple Components](https://learnjavascripts.com/development/web-development/frameworks/svelte/svelte-stores-tutorial-share-data-between-multiple-components/) by Vincent Widerberg
-- [A Business Case for SvelteKit](https://elliscs.hashnode.dev/a-business-case-for-sveltekit) by Chris Ellis
-- [How to set up a new Svelte project with SvelteKit](https://www.inow.dev/how-to-set-up-a-new-svelte-project-with-sveltekit/) by Igor Nowosad
-- [How to type Events, Slots, and Props in Svelte](https://raqueebuddinaziz.com/blog/svelte-type-events-slots-and-props/) by Raqueebuddin Aziz
-- [Use TypeScript with SvelteKit and Supabase](https://blog.robino.dev/posts/supabase-sveltekit) by Ross Robino
-- [Invoking Svelte components from your Ember apps](https://dev.to/rajasegar/invoking-svelte-components-from-your-ember-apps-58h5) by Rajasegar Chandran
-- [Add a sitemap to your server side rendered SvelteKit website](https://www.okupter.com/blog/sitemap-server-side-rendered-sveltekit-website) and [State in URL: the SvelteKit approach](https://www.okupter.com/blog/state-in-url-the-sveltekit-approach) by Justin Ahinon
-- [Display crypto data real-time in a chart using Sveltekit, Chart.js & coincap.io](https://medium.com/@Heesel/display-crypto-data-real-time-in-a-chart-using-sveltekit-chart-js-coincap-io-70b90d3aac90) by Hessel
-
-**Libraries, Tools & Components**
-
-_UI Kits and Components_
-
-- [Pink](https://pink.appwrite.io/) is a framework agnostic design system from Appwrite
-- [quick-pick](https://github.com/arabisaldrin/quick-pick) is a simple search tool where you control the search catalog
-- [Grail UI](https://github.com/grail-ui/grail-ui) offers a set of component primitives, actions and utilities that help you build accessible and high quality Svelte applications faster, while providing a great developer experience
-- [svelte-image-comparison](https://www.npmjs.com/package/svelte-image-comparison) is a Svelte component to compare image or canvas elements
-- [simple-font-select](https://www.npmjs.com/package/simple-font-select) is a simple font select component that exposes all local fonts as CSS font families
-- [svelte-datatables-net](https://www.npmjs.com/package/svelte-datatables-net) is a Svelte component that turns data into an interactive HTML table
-- [svelte-flextable](https://github.com/Parazeya/svelte-flextable) is a toolkit for creating server-side processing datatable components with Svelte
-- [svelte-algolia-instantsearch](https://github.com/aymeric-giraudet/svelte-algolia-instantsearch) is a community-developed wrapper around [instantsearch.js](https://github.com/algolia/instantsearch) for Svelte
-- [svelte-deep-zoom](https://www.npmjs.com/package/svelte-deep-zoom) is a Svelte component to render interactive Deep Zoom images (tiled image pyramids)
-- [SVoast](https://github.com/gibbu/svoast) is a simple toast component for Svelte
-- [svelte-otp](https://github.com/K4UNG/svelte-otp) is a simple lightweight OTP input component for svelte
-- [trace-svelte](https://trace-svelte.vercel.app/) is a line by line highlighter for Svelte
-- [Svelte Auth UI](https://github.com/multiplehats/svelte-auth-ui) is a set of authentication components for Svelte
-- [KitDocs](https://github.com/svelteness/kit-docs) is a documentation integration for SvelteKit - a VitePress alternative for Svelte
-- [svelte-signature-pad](https://www.npmjs.com/package/svelte-signature-pad) is a Svelte action to capture smoothed signatures as SVG paths using the excellent [perfect-freehand](https://github.com/steveruizok/perfect-freehand) library
-
-_Helpers, Stores and Actions_
-
-- [SvelteKit-Document](https://github.com/barvian/sveltekit-document) is a tiny utility for SvelteKit that lets you change the `<html>`, `<head>`, and `<body>` tags from any page or layout - with full SSR support
-- [SvelteKit Form Data](https://github.com/stolinski/sk-form-data) is an automatic SvelteKit form data parser middleware
-- [sveltekit-superforms](https://github.com/ciscoheat/sveltekit-superforms) supercharges your SvelteKit forms with a bunch of quality of life features. Purports to be a "powerhouse of a library"
-- [Houdini](https://github.com/HoudiniGraphQL/houdini) - the "disappearing" GraphQL client for the SvelteKit - is now 1.0
-- [sveltekit-modal-langchain](https://github.com/semicognitive/sveltekit-modal-langchain) is an example SvelteKit project using [sveltekit-modal](https://github.com/semicognitive/sveltekit-modal), showing how easy it is to write Python endpoints in SvelteKit
-- [mdsvex-excerpt](https://www.npmjs.com/package/mdsvex-excerpt) allows you to show only a portion of document in certain layouts
-- [Svelte Action Balancer](https://www.npmjs.com/package/svelte-action-balancer) is a simple Svelte action that makes titles more readable
-- [svelte-object](https://github.com/Refzlund/svelte-object) helps create and maintain objects using components. Values are stores and can therefore be intuitively subscribed to and updated
-- [svelte-relative-time](https://www.npmjs.com/package/svelte-relative-time) is a tiny Svelte action and component to render relative times
-- [svelte-disable-preload](https://www.npmjs.com/package/svelte-disable-preload) is a simple action to apply no-op event listeners to an element that prevent the document-level SvelteKit event handlers being invoked
-- [SvelteKit Static Sitemap](https://github.com/tlaundal/sveltekit-static-sitemap) generates a sitemap.xml for your page during build
-- [svelte-intersection-observer-action](https://www.npmjs.com/package/svelte-intersection-observer-action) is a Svelte action for element position notifications using IntersectionObserver
-- [svelte-sequence](https://github.com/AlexWarnes/svelte-sequence) provides custom stores to compose tweened motion sequences over multiple steps
-- [@svelte-put/inline-svg](https://github.com/vnphanquang/svelte-put/tree/main/packages/actions/inline-svg) is a Svelte action for inlining dynamic SVGs (fetched from network)
-
-_Other cool tools_
-
-- [sveltekit-modal](https://github.com/semicognitive/sveltekit-modal) lets you write Python endpoints in SvelteKit using Modal
-- [svelte-kit-bot-block](https://www.npmjs.com/package/svelte-kit-bot-block) is a server hook to handle spam requests with SvelteKit
-- [Svelte Email](https://github.com/carstenlebek/svelte-email) lets you write and design email templates with Svelte and render them to HTML or plain text
-- [Inertia.js](https://github.com/inertiajs/inertia) lets you quickly build modern single-page React, Vue and Svelte apps using classic server-side routing and controllers
-- [svelte-adapter-bun](https://github.com/gornostay25/svelte-adapter-bun) is an adapter for SvelteKit apps that generates a standalone Bun server
-- [React in Svelte](https://github.com/frontline-hq/react-in-svelte) is a library that enables you to use React components in Svelte
-- [SvelteKit Redis Session Manager](https://github.com/etherCorps/SK-Redis-SessionManager) is a Redis integration in SvelteKit for Session Management
-
-Thanks for reading! Don't forget to try your hand at the [Svelte Hackathon](https://hack.sveltesociety.dev/)!
-
-Feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte)
diff --git a/documentation/blog/2023-03-09-zero-config-type-safety.md b/documentation/blog/2023-03-09-zero-config-type-safety.md
deleted file mode 100644
index 0ebf9e0a28..0000000000
--- a/documentation/blog/2023-03-09-zero-config-type-safety.md
+++ /dev/null
@@ -1,171 +0,0 @@
----
-title: Zero-effort type safety
-description: More convenience and correctness, less boilerplate
-author: Simon Holthausen
-authorURL: https://twitter.com/dummdidumm_
----
-
-By sprinkling type annotations into your SvelteKit apps, you can get full type safety across the network — the `data` in your page has a type that's inferred from the return values of the `load` functions that generated that data, without you having to explicitly declare anything. It's one of those things that you come to wonder how you ever lived without.
-
-But what if we didn't even need the annotations? Since `load` and `data` are part of the framework, can't the framework type them for us? This is, after all, what computers are for — doing the boring bits so we can focus on the creative stuff.
-
-As of today, yes: it can.
-
-<video src="https://sveltejs.github.io/assets/video/zero-config-types.mp4" controls muted playsinline></video>
-
-If you're using VS Code, just upgrade the Svelte extension to the latest version, and you'll never have to annotate your `load` functions or `data` props again. Extensions for other editors can also use this feature, as long as they support the Language Server Protocol and TypeScript plugins. It even works with the latest version of our CLI diagnostics tool `svelte-check`!
-
-Before we dive in, let's recap how type safety works in SvelteKit.
-
-## Generated types
-
-In SvelteKit, you get the data for a page in a `load` function. You _could_ type the event by using `ServerLoadEvent` from `@sveltejs/kit`:
-
-```ts
-const database = {
-	getPost(slug: string | undefined): Promise<string> {
-		return Promise.resolve('hello world');
-	}
-};
-// ---cut---
-// src/routes/blog/[slug]/+page.server.ts
-import type { ServerLoadEvent } from '@sveltejs/kit';
-
-export async function load(event: ServerLoadEvent) {
-	return {
-		post: await database.getPost(event.params.post)
-	};
-}
-```
-
-This works, but we can do better. Notice that we accidentally wrote `event.params.post`, even though the parameter is called `slug` (because of the `[slug]` in the filename) rather than `post`. You could type `params` yourself by adding a generic argument to `ServerLoadEvent`, but that's brittle.
-
-This is where our automatic type generation comes in. Every route directory has a hidden `$types.d.ts` file with route-specific types:
-
-```diff
-// src/routes/blog/[slug]/+page.server.ts
--import type { ServerLoadEvent } from '@sveltejs/kit';
-+import type { PageServerLoadEvent } from './$types';
-
-export async function load(event: PageServerLoadEvent) {
-    return {
--        post: await database.getPost(event.params.post)
-+        post: await database.getPost(event.params.slug)
-    };
-}
-```
-
-This reveals our typo, as it now errors on the `params.post` property access. Besides narrowing the parameter types, it also narrows the types for `await event.parent()` and the `data` passed from a server `load` function to a universal `load` function. Notice that we’re now using `PageServerLoadEvent`, to distinguish it from `LayoutServerLoadEvent`.
-
-After we have loaded our data, we want to display it in our `+page.svelte`. The same type generation mechanism ensures that the type of `data` is correct:
-
-```svelte
-<!-- src/routes/blog/[slug]/+page.svelte -->
-<script lang="ts">
-	import type { PageData } from './$types';
-
-	export let data: PageData;
-</script>
-
-<h1>{data.post.title}</h1>
-
-<div>{@html data.post.content}</div>
-```
-
-## Virtual files
-
-When running the dev server or the build, types are auto-generated. Thanks to the file-system based routing, SvelteKit is able to infer things like the correct parameters or parent data by traversing the route tree. The result is outputted into one `$types.d.ts` file for each route, which looks roughly like this:
-
-```ts
-// @errors: 2344 2694 2307
-// $types.d.ts
-import type * as Kit from '@sveltejs/kit';
-
-// types inferred from the routing tree
-type RouteParams = { slug: string };
-type RouteId = '/blog/[slug]';
-type PageParentData = {};
-
-// PageServerLoad type extends the generic Load type and fills its generics with the info we have
-export type PageServerLoad = Kit.ServerLoad<RouteParams, PageParentData, RouteId>;
-
-// The input parameter type of the load function
-export type PageServerLoadEvent = Parameters<PageServerLoad>[0];
-
-// The return type of the load function
-export type PageData = Kit.ReturnType<
-	typeof import('../src/routes/blog/[slug]/+page.server.js').load
->;
-```
-
-We don't actually write `$types.d.ts` into your `src` directory — that would be messy, and no-one likes messy code. Instead, we use a TypeScript feature called [`rootDirs`](https://www.typescriptlang.org/tsconfig#rootDirs), which lets us map ‘virtual’ directories to real ones. By setting `rootDirs` to the project root (the default) and additionally to `.svelte-kit/types` (the output folder of all the generated types) and then mirroring the route structure inside it we get the desired behavior:
-
-```
-// on disk:
-.svelte-kit/
-├ types/
-│ ├ src/
-│ │ ├ routes/
-│ │ │ ├ blog/
-│ │ │ │ ├ [slug]/
-│ │ │ │ │ └ $types.d.ts
-src/
-├ routes/
-│ ├ blog/
-│ │ ├ [slug]/
-│ │ │ ├ +page.server.ts
-│ │ │ └ +page.svelte
-
-
-// what TypeScript sees:
-src/
-├ routes/
-│ ├ blog/
-│ │ ├ [slug]/
-│ │ │ ├ $types.d.ts
-│ │ │ ├ +page.server.ts
-│ │ │ └ +page.svelte
-```
-
-## Type safety without types
-
-Thanks to the automatic type generation we get advanced type safety. Wouldn't it be great though if we could just omit writing the types at all? As of today you can do exactly that:
-
-```diff
-// src/routes/blog/[slug]/+page.server.ts
--import type { PageServerLoadEvent } from './$types';
-
--export async function load(event: PageServerLoadEvent) {
-+export async function load(event) {
-    return {
-        post: await database.getPost(event.params.post)
-    };
-}
-```
-
-```diff
-<!-- src/routes/blog/[slug]/+page.svelte -->
-<script lang="ts">
--    import type { PageData } from './$types';
--    export let data: PageData;
-+    export let data;
-</script>
-```
-
-While this is super convenient, this isn't just about that. It's also about _correctness_: When copying and pasting code it's easy to accidentally get `PageServerLoadEvent` mixed up with `LayoutServerLoadEvent` or `PageLoadEvent`, for example — similar types with subtle differences. Svelte's major insight was that by writing code in a declarative way we can get the machine to do the bulk of the work for us, correctly and efficiently. This is no different — by leveraging strong framework conventions like `+page` files, we can make it easier to do the right thing than to do the wrong thing.
-
-This works for all exports from SvelteKit files (`+page`, `+layout`, `+server`, `hooks`, `params` and so on) and for `data`, `form` and `snapshot` properties in `+page/layout.svelte` files.
-
-To use this feature with VS Code install the latest version of the Svelte for VS Code extension. For other IDEs, use the latest versions of the Svelte language server and the Svelte TypeScript plugin. Beyond the editor, our command line tool `svelte-check` also knows how to add these annotations since version 3.1.1.
-
-## How does it work?
-
-Getting this to work required changes to both the language server (which powers the IntelliSense in Svelte files) and the TypeScript plugin (which makes TypeScript understand Svelte files from within `.ts/js` files). In both we auto-insert the correct types at the correct positions and tell TypeScript to use our virtual augmented file instead of the original untyped file. That in combination with mapping the generated and original positions back and forth gives the desired result. Since `svelte-check` reuses parts of the language server under the hood, it gets that feature for free without further adjustments.
-
-We'd like to thank the Next.js team for [inspiring](https://twitter.com/shuding_/status/1625263297573400578) this feature.
-
-## What's next
-
-For the future we want to look into making even more areas of SvelteKit type-safe — links for example, be it in your HTML or through programmatically calling `goto`.
-
-TypeScript is eating the JavaScript world — and we're here for it! We care deeply about first class type safety in SvelteKit, and we provide you the tools to make the experience as smooth as possible — one that also scales beautifully to larger Svelte code bases — regardless of whether you use TypeScript or typed JavaScript through JSDoc.
diff --git a/documentation/blog/2023-04-01-whats-new-in-svelte-april-2023.md b/documentation/blog/2023-04-01-whats-new-in-svelte-april-2023.md
deleted file mode 100644
index 7849621d87..0000000000
--- a/documentation/blog/2023-04-01-whats-new-in-svelte-april-2023.md
+++ /dev/null
@@ -1,116 +0,0 @@
----
-title: "What's new in Svelte: April 2023"
-description: 'Loads of new Svelte compiler features, plus Svelte Summit and SvelteHack'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Happy April, everyone! This month, we're covering all the new features in the Svelte compiler, some quality-of-life improvements in SvelteKit and a huge showcase (like always).
-
-In core team news, Dominic Gannaway has joined Vercel to work on Svelte full-time! Dominic is a world-class expert on wringing performance out of javascript engines, on the DOM, on reactivity, on accessibility, and more! You might know him as the creator of the [Inferno](https://www.infernojs.org/) UI framework or [Lexical](https://lexical.dev/), Meta's WYSIWYG editor. It'll be great to see his talents at work across the Svelte ecosystem 🌱
-
-Don't forget! Svelte Summit Spring, Svelte's 6th virtual conference, will be happening on May 6th. Also, there's just two weeks left until the end of [SvelteHack](https://hack.sveltesociety.dev/)... It's a great opportunity to share your creations with the community and maybe even earn a prize!
-
-Now let's jump into this month's changes...
-
-## What's new in Svelte
-
-- A bunch of new features are now available as of **3.56.0**!
-  - Add `|stopImmediatePropagation` event modifier for `on:eventname` ([#5085](https://github.com/sveltejs/svelte/issues/5085), [Docs](https://svelte.dev/docs#template-syntax-element-directives-on-eventname))
-  - Add `axis` parameter to `slide` transition ([#6182](https://github.com/sveltejs/svelte/issues/6182), [Docs](https://svelte.dev/docs#run-time-svelte-transition-slide))
-  - Add `readonly` utility to convert `writable` store to readonly ([#6518](https://github.com/sveltejs/svelte/pull/6518), [Docs](https://svelte.dev/docs#run-time-svelte-store-writable))
-  - Add `readyState` binding for media elements ([#6666](https://github.com/sveltejs/svelte/issues/6666), [Docs](https://svelte.dev/docs#template-syntax-element-directives-bind-property-media-element-bindings))
-  - Add `naturalWidth` and `naturalHeight` bindings to images ([#7771](https://github.com/sveltejs/svelte/issues/7771), [Docs](https://svelte.dev/docs#template-syntax-element-directives-bind-property-image-element-bindings))
-- Support `<!-- svelte-ignore ... -->` on components ([#8082](https://github.com/sveltejs/svelte/issues/8082))
-- Inputs in a `bind:group` will clear when their value is set to `undefined` (**3.56.0**, [#8214](https://github.com/sveltejs/svelte/issues/8214))
-- `<input>` values will now persist when swapping elements with spread attributes in an `{#each}` block (**3.56.0**, [#7578](https://github.com/sveltejs/svelte/issues/7578))
-- Better warnings across the board - from `noreferrer` to `aria` rules (**3.56.0**)
-- Add <svelte:document> (**3.57.0**, [#3310](https://github.com/sveltejs/svelte/issues/3310))
-- The `style:` directive will now take precedence over a `style=` attribute (**3.57.0**, [#7475](https://github.com/sveltejs/svelte/issues/7475))
-- CSS units are now supported in the `fly` and `blur` transitions (**3.57.0**, [#7623](https://github.com/sveltejs/svelte/pull/7623), [Docs](https://svelte.dev/docs#run-time-svelte-transition))
-
-For all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## What's new in SvelteKit
-
-- You can now get all cookies for a request with `cookies.getAll` (**1.10.0**, [#9287](https://github.com/sveltejs/kit/pull/9287), [Docs](https://kit.svelte.dev/docs/types#public-types-cookies))
-- Easily manage the submission status of (multiple) forms with the new exposed `submitter` parameter in `use:enhance` (**1.12.0**, [#9425](https://github.com/sveltejs/kit/pull/9425), [Docs](https://kit.svelte.dev/docs/types#public-types-submitfunction))
-- The default error page now has dark mode styles (**1.13.0**, [#9460](https://github.com/sveltejs/kit/pull/9460))
-- You can now omit types on all methods and variables with special meaning to SvelteKit and still benefit from full type safety! Read more about it in the [announcement blog post](https://svelte.dev/blog/zero-config-type-safety)
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Peerbeer](https://peer.beer/) lets you share files peer-to-peer (p2p) without any third parties or data limits
-- [unplaneted](https://unplaneted.com/) is an interface for exploring very large space images
-- [PokeBook](https://github.com/pokegh0st/pokebook) is a digital notebook for writing poetry that provides a beautiful distraction-free environment and autosave
-- [papi](https://papi.run/) lets you create prompts for AI models and share them with others with a unique link
-- [Mathesar](https://github.com/centerofci/mathesar) is a straightforward open source tool that provides a spreadsheet-like interface to a PostgreSQL database
-- [SQLite Playground](https://neil.macmunn.com/sqlite#) lets you learn how SQLite runs and stores data in the browser
-- [svgl](https://github.com/pheralb/svgl) is a beautiful library with SVG logos
-- [Swehl](https://swehl.com/) is an eCommerce store, community and tutorial site for breastfeeding mothers
-- [Codeverter](https://github.com/TGlide/codeverter) is a GPT-powered code converter, allowing you to convert between different languages and frameworks
-- [Game On Or Not](https://gameonornot.com/) is a free web app that helps you organize sports with your friends
-- [Sveltia CMS](https://github.com/sveltia/sveltia-cms) is a Git-based lightweight headless CMS
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Streaming, snapshots, and other new features since SvelteKit 1.0](https://svelte.dev/blog/streaming-snapshots-sveltekit) by Geoff Rich on the svelte.dev Blog
-- [Dev Vlog: Rich Harris shows us what's new in Svelte and Kit, March 2023](https://www.youtube.com/watch?v=vgXgex5E-8g) from Svelte Society
-  - If you missed this one live, check out [the next one](https://www.youtube.com/watch?v=MJHO6FSioPI) - scheduled for April 5th
-- [Svelte Society - London February 2023](https://www.youtube.com/watch?v=RkQ_f7XxdMI)
-- Svelte Radio episodes from this month:
-  - [We all live in a Svelte Submarine](https://www.svelteradio.com/episodes/we-all-live-in-a-svelte-submarine)
-  - [Building furniture using Svelte with Bert Bengtson](https://www.svelteradio.com/episodes/building-furniture-using-svelte-with-bert-bengtson)
-  - [Svelte Hackathon Announcement](https://www.svelteradio.com/episodes/svelte-hackathon-announcement)
-  - [LevelUpTuts 6 months later with Scott Tolinski](https://www.svelteradio.com/episodes/leveluptuts-6-months-later-with-scott-tolinski)
-  - [I got a cold and had fever dreams about React 😱](https://www.svelteradio.com/episodes/i-got-a-cold-and-had-fever-dreams-about-react)
-- This Week In Svelte videos:
-  - [2023 March 10 - New prompts! Underline your links!](https://www.youtube.com/watch?v=WiCjQVoE-3k)
-  - [2023 March 17 - More a11y warnings! How to: Dynamic Form Actions!](https://www.youtube.com/watch?v=sRhZQ-2VxVU)
-  - [2023 March 23 - SvelteKit 1.13.0, Vitest and Playwright overview](https://www.youtube.com/watch?v=vpbhsbg2otg)
-
-_To Watch or Hear_
-
-- [Full Stack SvelteKit App Deployment Using Vercel And Supabase For $0](https://www.youtube.com/watch?v=uAF4Yd-gddo) by Joy of Code
-- [Why Is Svelte.js so Popular?](https://www.youtube.com/watch?v=73Y8Yyg54zc) by Prismic
-- [Interactive Tables in SvelteKit with TanStack Table](https://www.youtube.com/watch?v=-Zuo3UWjjI8) by hartenfellerdev
-- [SvelteKit + GraphQL with Houdini](https://www.youtube.com/watch?v=ADnaRwQZfqw&list=PLm0ILX0LGQk_220vvpsbyXH2VesRlCm-E) by Aftab Alam
-
-_To Read_
-
-- [Thoughts on Svelte](https://tyhopp.com/notes/thoughts-on-svelte) by Ty Hopp
-- [Storybook](https://storybook.js.org/blog/storybook-for-sveltekit/) on why (and how) it supports SvelteKit
-- [Svelte Authentication Tutorial with Authorizer](https://thethinks.vercel.app/blog/svelte-authorizer) by The Thinks
-- [Use Zod to Validate Forms on the Server with SvelteKit](https://blog.robino.dev/posts/svelte-zod-error) by Ross Robino
-- [Do I need a sitemap for my SvelteKit app, and how do I create it?](https://maier.tech/posts/do-i-need-a-sitemap-for-my-sveltekit-app-and-how-do-i-create-it) and [Complement zero-effort type safety in SvelteKit with Zod for even more type safety](https://maier.tech/posts/complement-zero-effort-type-safety-in-sveltekit-with-zod-for-even-more-type-safety) and [Configuring Turborepo for a SvelteKit monorepo](https://maier.tech/posts/configuring-turborepo-for-a-sveltekit-monorepo) by Thilo Maier
-- [Adding page transitions in SvelteKit](https://joshcollinsworth.com/blog/sveltekit-page-transitions) by Josh Collinsworth
-- [E2E testing with SvelteKit and Playwright](https://www.okupter.com/blog/e2e-testing-with-sveltekit-and-playwright) and [Why you should use TypeScript in your next SvelteKit projects](https://www.okupter.com/blog/sveltekit-with-typescript) by Justin Ahinon
-- [Understanding the structure of a SvelteKit project](https://www.inow.dev/understanding-the-structure-of-a-svelte-kit-project/) by Igor Nowosad
-- [Secure Authentication in Svelte using Hooks](https://dev.to/brewhousedigital/secure-authentication-in-svelte-using-hooks-k5j) by Brewhouse Digital
-
-**Libraries, Tools & Components**
-
-- [@vavite/node-loader](https://github.com/cyco130/vavite/tree/main/packages/node-loader) is a Node ESM loader that uses Vite to transpile modules to enable sourcemap and breakpoints support in SvelteKit (or any Vite) project
-- [Inlang](https://github.com/inlang/inlang) is building i18n for SvelteKit and is [looking for feedback](https://www.reddit.com/r/sveltejs/comments/11ydtui/sveltekit_and_i18n_lets_finally_solve_this_never/)
-- [Skeleton](https://www.skeleton.dev/) - the UI toolkit for Svelte and Tailwind - is now 1.0 🎉
-- [SvelteKit-integrated-WebSocket](https://github.com/suhaildawood/SvelteKit-integrated-WebSocket) provides first-class support for WebSockets within SvelteKit by attaching a WebSocket server to the global state
-- [Svelte Legos](https://github.com/ankurrsinghal/svelte-legos) is a collection of essential Svelte Composition Utilities
-- [svelte-stored-writable](https://github.com/efstajas/svelte-stored-writable) is a drop-in extension of Svelte's writable that additionally stores and restores its contents using localStorage.
-- [svelte-virtual](https://github.com/ghostebony/svelte-virtual) provides Svelte components for efficiently rendering large lists.
-- ChatGPT Clones and Starters
-  - [chatwithme.chat](https://github.com/kierangilliam/chatwithme.chat) is an open source ChatGPT UI
-  - [SlickGPT](https://github.com/ShipBit/slickgpt) is a light-weight "use-your-own-API-key" web client for the OpenAI API written in Svelte
-  - [AI Chat Bestie](https://github.com/KTruong008/aichatbestie) is an unofficial ChatGPT app
-  - [chatgpt-svelte](https://github.com/ichbtrv/chatgpt-svelte) is a simple UI for the ChatGPT Open AI API
-
-Thanks for reading! And don't forget to try your hand at the [Svelte Hackathon](https://hack.sveltesociety.dev/) 🧑‍💻
-
-As always, feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-See ya next time!
diff --git a/documentation/blog/2023-05-01-whats-new-in-svelte-may-2023.md b/documentation/blog/2023-05-01-whats-new-in-svelte-may-2023.md
deleted file mode 100644
index 77970c3ae6..0000000000
--- a/documentation/blog/2023-05-01-whats-new-in-svelte-may-2023.md
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: "What's new in Svelte: May 2023"
-description: 'New Ambassadors, a new ESLint plugin and a whole bunch of SvelteHack submissions'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Before we dive into the updates, there's a few announcements worth mentioning at the top:
-
-## New Svelte Ambassadors
-
-Regular features of this newsletter and all-around great content creators for Svelte [JoyOfCode](https://www.youtube.com/@JoyofCodeDev) and [HuntaByte](https://www.youtube.com/@Huntabyte) have been appointed as Svelte Ambassadors. Ambassadors are people who are well known for their helpfulness and contributions and for upholding Svelte’s reputation as a friendly, welcoming community, and we’re deeply grateful for their involvement!
-
-## SvelteHack winners will be announced May 6th
-
-In a just a few days, we'll find out who won [SvelteHack](https://hack.sveltesociety.dev/) - the Svelte Hackathon that took place between February 17th and April 17th. Tune in to [Svelte Summit](https://www.sveltesummit.com/) on May 6th to see if your favorite project was chosen 👀
-
-Lots of submissions to the hackathon are featured in this month's showcase... but first, let's see what's new!
-
-## What's new in Svelte
-
-- `style` blocks now support CSS `@container` queries (**3.58.0**)
-- `bind:innerText` is now available for `contenteditable` elements (**3.58.0**)
-- A new accessability warning, `a11y-interactive-supports-focus` will now warn when interactive elements are not focusable (**3.58.0**)
-
-For all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## What's new in SvelteKit
-
-- When hot module reloading (HMR) is enabled, the page will reload after an error is fixed (**1.14.0**, [#9497](https://github.com/sveltejs/kit/pull/9497))
-- Two apps loaded into the same html page can now be loaded simultaneously in "embedded" mode (**1.15.7**, [#9610](https://github.com/sveltejs/kit/pull/9610))
-- Vite's compilation will now log warnings for packages that use the `svelte` field to resolve Svelte files differently than standard Vite resolve (**vite-plugin-svelte@2.1.0**, **kit@1.15.8**)
-
-## What's new in Language Tools
-
-- Support for `<svelte:document>` ([#1958](https://github.com/sveltejs/language-tools/pull/1958)) and intellisense report for new bindings ([#1957](https://github.com/sveltejs/language-tools/pull/1957)) (**107.3.0**)
-- The new fix-all menu option for the "Quick fix..." makes it easy to "Add all missing imports" and other detected errors (**107.3.0**, [#1939](https://github.com/sveltejs/language-tools/pull/1939))
-- We have a new and better official [ESLint plugin](https://github.com/sveltejs/eslint-plugin-svelte)! Previous support for Svelte in ESLint did not handle the template AST well, resulting in false positive/negatives and a high barrier to custom ESLint rules. This new official version is based on [ota-meshi](https://github.com/ota-meshi)'s [svelte-eslint-parser](https://github.com/sveltejs/svelte-eslint-parser) and is ready for prime time. Try it out and [share your feedback](https://github.com/sveltejs/eslint-plugin-svelte/issues)!
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Sound of War](https://soundofwar.art/) is a storytelling data visualization project to help understand the scale of destruction in Ukraine
-- [Syntax FM's swag shop](https://swag.syntax.fm/) is now built with SvelteKit, PlanetScale and Prisma
-- [Appreciation Jar](https://appreciation.place/) is your own private space where you can send encouraging and appreciative messages to your partner
-- [Japanese Jouzu](https://jp-jouzu.netlify.app/) is a Japanese sound and symbol learning app
-- [MarkMyImages](https://www.markmyimages.com/) is a tool to bulk watermark, image resize, rename, effects, and more - all on-device for speed and privacy
-- [Immich](https://github.com/immich-app/immich) is a self-hosted photo and video backup solution directly from your mobile phone
-- [Earbetter](https://github.com/ryanatkn/earbetter) is an ear training game and tools for playing and programming music and audio
-- [Tune Twisters](https://tune-twisters.vercel.app/) is a guessing game for songs... in reverse
-- [ResponseHunt](https://www.responsehunt.com/) is a mystery game based on browser requests - use your programming skills to get to the “golden” response
-- [Wolfensvelte 3D](https://github.com/snuffyDev/Wolfensvelte-3D/) is a Svelte "port" of Wolfenstein 3D
-- [Code Solving](https://code-svelte.vercel.app/) teaches how to solve problems with code
-- [Make Bookmarklets](https://make-bookmarklets.com/) is a quick way to create JavaScript bookmarklets with linting, intellisense and auto-minification
-- [GeniePM](https://genie.pm) is an AI tool to help Product Managers write user stories and requirements
-- [Bitesized News](https://bitesized.news/) is an AI that delivers news digests and responds to questions via chat
-- [Open Tunings](https://www.open-tunings.com/) is a place to explore alternative guitar tunings without having to retune your guitar
-- [BlinkSMS](https://blinksms.se/#) is a text alert tool for Stockholm Student Housing to help with booking laundry times
-- [Dev Links](https://github.com/killswitchh/dev-links) helps dev showcase multiple links in a single place - similar to Linktree and Kofi
-- [Audiogest](https://audiogest.app/) is a tool to convert speech to text & summarize any audio
-- [MineSweep](https://alecames.com/minesweep) is a rendition of Minesweeper built with Svelte and JavaScript
-- [Biolytics](https://biolytics.app/) lets you import your lab tests to see all your lab tests in one place
-- [Zero share](https://github.com/ntsd/zero-share) is a secure P2P file sharing using WebRTC
-- [Svelte lab](https://www.sveltelab.dev/) is a sandbox for creating and sharing SvelteKit projects
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Dev Vlog: April 2023 - TypeScript vs JSDoc, Transitions API, Dominic Gannaway joins Svelte team](https://www.youtube.com/watch?v=MJHO6FSioPI)
-- [Rich Harris on frameworks, the web, and the edge.](https://www.youtube.com/watch?v=uXCipjbcQfM) from Vercel's Svelte Meetup in NYC
-- [Svelte & SvelteKit](https://frontendmasters.com/workshops/svelte-sveltekit/) taught by Rich Harris on Frontend Masters
-- This Week in Svelte:
-  - [2023 March 31 - SvelteKit, Svelte; static sites and headless CMS demos](https://www.youtube.com/watch?v=-YjLubiieYs)
-  - [2023 April 22 - SvelteKit 1.15.7, skip links, error handling, static assets](https://www.youtube.com/watch?v=SCMosMo85_8)
-  - [2023 April 14 - SvelteKit 1.15.5, accessible buttons, advanced toggle state 🧪🔥](https://www.youtube.com/watch?v=H2kOO5mvUQs)
-  - [2023 April 21 - SvelteKit 1.15.7, skip links, error handling, static assets](https://www.youtube.com/watch?v=SCMosMo85_8)
-- Svelte Radio
-  - [Using Svelte in React with Puru Vijay](https://www.svelteradio.com/episodes/using-svelte-in-react-with-puru-vijay)
-  - [Eric Brehault and Nuclia](https://www.svelteradio.com/episodes/eric-brehault-and-nuclia)
-  - [Svelte at AppWrite with Alex Patterson](https://www.svelteradio.com/episodes/svelte-at-appwrite-with-alex-patterson)
-  - [Svelte in Research at Dartmouth with Wasita and Eshin](https://www.svelteradio.com/episodes/svelte-in-research-at-dartmouth-with-wasita-and-eshin)
-
-_To Watch_
-
-- [The Complete SvelteKit Course For Building Modern Web Apps](https://www.youtube.com/watch?v=MoGkX4RvZ38) and [Simple SvelteKit Page Transitions](https://www.youtube.com/watch?v=gkw1wFIXM_8) by Joy of Code
-- [Svelte For React Developers | Your Next JavaScript Framework?](https://www.youtube.com/watch?v=smqE0y0z0CA) by Cretezy
-- [Svelte & SvelteKit: The Complete Guide](https://www.udemy.com/course/svelte-and-sveltekit/?ranMID=39197&ranEAID=msYS1Nvjv4c&ranSiteID=msYS1Nvjv4c-oN6aTXp3jgDgUps8JCGxcg&LSNPUBID=msYS1Nvjv4c&utm_source=aff-campaign&utm_medium=udemyads) by Ali Alaa on Udemy
-- [ChatGPT-4 with SvelteKit 🤖 Generative AI on the EDGE 🌍](https://www.youtube.com/watch?v=Uw5GZg96kD8) by Johnny Magrippis
-
-_To Read_
-
-- [Headless WordPress with GraphQL and SvelteKit](https://www.okupter.com/blog/headless-wordpress-graphql-sveltekit) and [How to fix the duplicate meta tags issue in SvelteKit](https://www.okupter.com/blog/sveltekit-fix-duplicate-metatags-issue) by Justin Ahinon
-- [How to setup tRPC in a SvelteKit project](https://raqueebuddinaziz.com/blog/how-to-setup-trpc-in-a-sveltekit-project/) by Raqueebuddin Aziz
-- [Better Data Visualizations with Svelte](https://www.newline.co/courses/better-data-visualizations-with-svelte/welcome) by newline
-- [Offline App with SvelteKit + SQLite Part 1: Setup WebAssembly SQLite](https://www.youtube.com/watch?v=Uvnzwp72Ze8) by hartenfellerdev
-
-**Libraries, Tools & Components**
-
-- [Sveltris](https://github.com/mokshit06/sveltris) lets you intermix UI primitives like components, and state primitives like hooks between frameworks, without even noticing
-- [SwiftMarket](https://github.com/SwiftMarket/swiftmarket-sveltekit) is an E-Commerce solution built with SvelteKit, Pocketbase as a database and Stripe for payments
-- [Svelegante](https://www.npmjs.com/package/svelegante) is a Classy writable store for Svelte
-- [Table Generator](https://www.table-generator.de/) lets you create, design and customize your own tables tables online using a graphical editor
-- [Svelte Animated Headline](https://www.npmjs.com/package/svelte-animated-headline) is an animated headline component that can grab attention in an informative way
-- [SvelteKit Music App Example](https://github.com/tguelcan/music) demonstrates how to connect and process data as well as some practical examples of how to develop frontend components with TailwindCSS
-- [Socio](https://www.npmjs.com/package/socio) is a WebSocket Real-Time Communication (RTC) API framework to connect your front-end logic to a back-end database reactively
-- [Flowbite Svelte](https://flowbite-svelte.com/) is an official Flowbite component library for Svelte
-- [Wundergraph](https://wundergraph.com/blog/introducing_svelte_query_client), a backend for frontend framework, just released their Svelte Query client
-- [Lucia](https://lucia-auth.com/blog/lucia-1) just reached 1.0 for their simple and flexible auth library for SvelteKit
-- [svelte-stepper](https://github.com/efstajas/svelte-stepper) is a simple library for building animated stepper flows with Svelte
-
-As always, feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-See ya next time!
diff --git a/documentation/blog/2023-06-01-whats-new-in-svelte-june-2023.md b/documentation/blog/2023-06-01-whats-new-in-svelte-june-2023.md
deleted file mode 100644
index add2d8a413..0000000000
--- a/documentation/blog/2023-06-01-whats-new-in-svelte-june-2023.md
+++ /dev/null
@@ -1,103 +0,0 @@
----
-title: "What's new in Svelte: June 2023"
-description: 'SvelteHack winners, lots of new bindings, Svelte 4.0.0-next.0, and a bunch of new features in SvelteKit'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Welcome to June everyone and [congrats to our SvelteHack winners](https://hack.sveltesociety.dev/winners), across all the categories! If you missed it, these winners were announced at Svelte Summit on May 6th 🎉
-
-The entire playlist of the summit, including all the talks broken up in to separate videos, can be found [on the Svelte Society YouTube channel](https://www.youtube.com/playlist?list=PL8bMgX1kyZTiODueVnrK5GR42u3hgN13X). So check it out, if you haven't already.
-
-Lots to cover in this month's newsletter, including a lot of improvements to both Svelte and Kit...
-
-## What's new in Svelte
-
-[Svelte 4.0.0-next.0](https://github.com/sveltejs/svelte/releases), the first pre-release version of Svelte 4.0 is out! An explanation of the changes, improvements and goals of this release can be found in [the Releases page on GitHub](https://github.com/sveltejs/svelte/releases/tag/svelte%404.0.0-next.0). Check it out to get an early sneak peek of the future of Svelte. It also includes a migration guide, for those interested in the minimal amount of breaking changes and deprecations.
-
-Svelte 3.59.0 is also out, with a ton of new features:
-
-- Restructuring arrays with the spread operator (`...`) is now handled correctly (**3.59.0**, [#8552](https://github.com/sveltejs/svelte/issues/8552), [#8554](https://github.com/sveltejs/svelte/issues/8554))
-- The new `a11y-autocomplete-valid` warning will now warn if the autocomplete attribute isn't used according to the HTML specification (**3.59.0**, [Examples](https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/d32a27fb64f4127d31e4e76bd08e319cfaf0ba53/docs/rules/autocomplete-valid.md), [#8520](https://github.com/sveltejs/svelte/pull/8520))
-- `fullscreenElement` and `visibilityState` bindings are now available for the `<svelte:document>` element (**3.59.0**, [#8507](https://github.com/sveltejs/svelte/pull/8507))
-- The `devicePixelRatio` binding is now available for the `<svelte:window>` element (**3.59.0**, [#8285](https://github.com/sveltejs/svelte/issues/8285))
-- The `ResizeObserver` bindings `contentRect`/`contentBoxSize`/`borderBoxSize`/`devicePixelContentBoxSize` are now usable with `bind:`(**3.59.0**, [#8022](https://github.com/sveltejs/svelte/pull/8022))
-
-For all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md).
-
-## What's new in SvelteKit
-
-- Route-level entry generators allow exporting an entries function from `+page`, `+page.server`, and `+server` files to supply possible values for params for prerendering (**1.16.0**, [Docs](https://kit.svelte.dev/docs/page-options#entries), [#9571](https://github.com/sveltejs/kit/pull/9571))
-- URLs in `<meta>` tags are now crawled to make programmatic social-images much easier (**1.17.0**, [Docs](https://kit.svelte.dev/docs/seo#manual-setup-title-and-meta), [#9900](https://github.com/sveltejs/kit/pull/9900))
-- `data` and `form` have been renamed to `formData` and `formElement` respectively in the `enhance` function. Using them through the old names will log a deprecation warning and they'll be removed in a future version. (**1.17.0**, [Docs](https://kit.svelte.dev/docs/form-actions#progressive-enhancement-use-enhance), [#9902](https://github.com/sveltejs/kit/pull/9902))
-- Link options can now be set to `true` and `false` (**1.19.0**, [Docs](https://kit.svelte.dev/docs/link-options#disabling-options), [#10039](https://github.com/sveltejs/kit/pull/10039))
-- The new `resolvePath` export can be used to build relative paths from route IDs and parameters (**1.19.0**, [Docs](https://kit.svelte.dev/docs/modules#sveltejs-kit-resolvepath), [#9949](https://github.com/sveltejs/kit/pull/9949))
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [a-maze](https://github.com/nedredmond/a-maze) is a simple maze generator (using DFS) with any dimensions between 5 cells and 75 cells
-- [Windows 11 in Svelte](https://github.com/yashash-pugalia/win11-svelte) attempts to replicate the Windows 11 desktop experience on web
-- [JsonCrunch](https://github.com/aghorui/jsoncrunch) is a JSON viewing, transformation and querying tool meant for quickly manipulating small to medium size pieces of JSON data
-- [Typepost](https://dezain.io/typepost/) is a simple text post generator for social media
-- [tall.ly](https://tall.ly/) is a website for sharing bookmarks ([example](https://tall.ly/zx/icons))
-- [bbchallenge](https://github.com/bbchallenge/bbchallenge) is a collaborative environment to prove or disprove the Busy Beaver conjecture
-- [Reddit Map](https://github.com/iDPI-Umass/reddit-map) is a project of computer, data, and social scientists to explore and visualize Reddit
-- [WeWatch](https://github.com/orosmatthew/wewatch) allows watching videos together in sync
-- [Wonderplan](https://wonderplan.ai/) is an AI-Powered Trip Planner tailored to your preferences and covering all aspects of your trip
-- [CodingView.io](https://codingview.io/) is an online coding interview tool
-- [MeatGPT](https://meat-gpt.sonnet.io/) is an art-site that promptly ignores your prompt
-- [Vim Ninja](https://www.vimninja.com/) is an interactive Vim course in the browser
-- [prcl](https://prcl.dev/) is a Pastebin-alternative focused on speed and simplicity
-- [md](https://github.com/rossrobino/md) is a web based markdown editor
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- This Week in Svelte:
-  - [2023 April 28](https://www.youtube.com/watch?v=LlONGghw_MA) - SK 1.15.9, colour contrast, SK reusable types, path aliases
-  - [2023 May 5](https://www.youtube.com/watch?v=jo9osUzHnHY) - SvelteKit 1.16.0, reactive statement lifecycle, custom stores
-  - [2023 May 12](https://www.youtube.com/watch?v=MBSYHW50xb8) - Svelte 4.0 preview, SvelteKit 1.16.3, Svelte 3.59.1
-  - [2023 May 19](https://www.youtube.com/watch?v=CnvU6K12iK4) - SvelteKit 1.18.0, accessible HTML tables, CSS nesting
-  - [2023 May 26](https://www.youtube.com/watch?v=oqroEq1DoKI) - SvelteKit 1.19.0, choosing a UI library, breakpoint debugging
-- Svelte Radio
-  - [Svelte Summit Hypisode](https://www.svelteradio.com/episodes/svelte-summit-hypisode) (May 4, 2023)
-  - [A primer on AI for developers with Swyx from Latent Space](https://www.svelteradio.com/episodes/a-primer-on-ai-for-developers-with-swyx-from-latent-space) (May 11, 2023 | [Video Version](https://www.youtube.com/watch?v=PzImLLdU5Wk))
-
-_To Watch_
-
-- [Build a Blazing Fast SvelteKit Markdown Blog](https://www.youtube.com/watch?v=RhScu3uqGd0), [Page Versus Standalone Endpoints In SvelteKit](https://www.youtube.com/watch?v=8OmsVZuuQMc) and [Learn How Data Flows In Your SvelteKit App](https://www.youtube.com/watch?v=ampDDmT3TU0) by Joy of Code
-- [Build a ChatGPT Plugin with SvelteKit](https://www.youtube.com/watch?v=P4wZ9JIxwjs) by SuperMilkDaddy
-- [Svelte makes Drag And Drop API easy!](https://www.youtube.com/watch?v=lTDKhj83tec) and [Simple native-like App in SvelteKit!](https://www.youtube.com/watch?v=Enl4OPQ2OAM) by Antonio Sarcevic
-- [Let's Learn Svelte.js in 60 Minutes (fun speed run).](https://www.youtube.com/watch?v=0FCbd1XVYWo) by developedbyed
-
-_To Read_
-
-- [Bridging Vue 2 and Svelte](https://workadventu.re/blog/post/bridging-vue2-and-svelte) by Alexis Faizeau
-- [Write Once, Run Anywhere](https://blog.robino.dev/posts/drizzle-svelte) by Ross Robino
-- [Reflections on Migrating my SaaS To SvelteKit](http://sveltekitsaas.com/articles/migrate-saas-to-sveltekit/) by SvelteKitSaaS
-- [Authentication system using rust (actix-web) and SvelteKit](https://dev.to/sirneij/full-stack-authentication-system-using-rust-actix-web-and-sveltekit-1cc6) by John Owolabi Idogun
-- [SvelteKit Forms: Grammar Check App](https://rodneylab.com/sveltekit-forms/), [SvelteKit Ably: Sqvuably Real‑Time Game](https://rodneylab.com/sveltekit-ably/) and [Svelte Login Form Example: Best Practices](https://rodneylab.com/svelte-login-form-example/) by Rodney Lab
-- [The Correct Way to Use Stores in SvelteKit](https://dev.to/jdgamble555/the-correct-way-to-use-stores-in-sveltekit-3h6i) and [Rich Harris is NOT Getting Rid of TS Support in Svelte](https://dev.to/jdgamble555/rich-harris-is-not-getting-rid-of-ts-support-in-svelte-pp6) by Jonathan Gamble
-- [How to add a basic SEO component to SvelteKit](https://maier.tech/posts/how-to-add-a-basic-seo-component-to-sveltekit) by Thilo Maier
-- [SvelteKit Contact Form Example with Airtable](https://scottspence.com/posts/sveltekit-contact-form-example-with-airtable) by Scott Spence
-- [Performant Reactivity with Svelte-Kit](https://itnext.io/performant-reactivity-with-svelte-kit-47d11769c5f) by Erxk
-- [Svelte stores: the curious parts](https://blog.thoughtspile.tech/2023/04/22/svelte-stores/) by Valdimir Klepov
-
-**Libraries, Tools & Components**
-
-- [svelte-svg-transform](https://github.com/bartektelec/svelte-svg-transform) is a tiny library that makes it easier for you to add SVGs and transform them in your Svelte project
-- [sirens](https://github.com/spiegelgraphics/sirens) is a visualization of active air raid sirens in Ukraine by DER SPIEGEL
-- [Sveltronics](https://github.com/vasucp1207/sveltronics) is a collection of Svelte utility functions for your project
-- [Prompta](https://github.com/iansinnott/prompta) is yet another interface for chatting with ChatGPT (or GPT-4)
-- [Colibri](https://github.com/thetinkerinc/colibri) is a lightweight, customizable component library for Svelte apps
-- [Svelte Smart Doc](https://www.sveltron.com/) is a natural language interface to search the Svelte Svelte documentation
-- [Tailwind Elements](https://tailwind-elements.com/docs/standard/integrations/svelte-integration/) now has a Svelte Integration
-
-Thanks for reading! As always, feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/blog/2023-06-22-svelte-4.md b/documentation/blog/2023-06-22-svelte-4.md
deleted file mode 100644
index 89b1e76510..0000000000
--- a/documentation/blog/2023-06-22-svelte-4.md
+++ /dev/null
@@ -1,59 +0,0 @@
----
-title: 'Announcing Svelte 4'
-description: 'Updated performance, developer experience, and site'
-author: The Svelte team
-authorURL: https://svelte.dev/
----
-
-After months in the making, we're excited to announce the stable release of Svelte 4.
-
-Time flies - Svelte 3 was released more than four years ago! In JavaScript-framework-time, that's eons. Svelte’s freshness has persisted throughout, but Node.js and browser APIs have evolved during that time and today we’re updating Svelte to take advantage of some of these improvements. Svelte 4 is mainly a maintenance release, bumping minimum version requirements and tightening up the design in specific areas. It sets the stage for the next generation of Svelte to be released as Svelte 5 - we think you’ll love it.
-
-If you haven't tried Svelte yet, take it for a spin in our [interactive tutorial](https://learn.svelte.dev/), on [StackBlitz](https://sveltekit.new/), or locally with `npx sv create`. Svelte lets you easily put together web UIs leveraging the power of HTML, CSS, JS, and the Svelte compiler. Watch [Svelte Radio Live](https://www.youtube.com/watch?v=72TIVhRtyWE) to learn more about this release.
-
-## What's new
-
-### Performance
-
-This release results in smaller and faster hydration code. To see the impact, SvelteKit users can see their compiled output shrink in size by examining the `.svelte-kit/output/client/_app/immutable/nodes` folder. For example, on [kit.svelte.dev](https://kit.svelte.dev) the JS generated across the whole site was reduced in size by 12.7% (126.3 kB to 110.2 kB).
-
-Svelte 4 reduces the Svelte package size by nearly 75% (10.6 MB down to 2.8 MB), which means less waiting on `npm install`. This improvement will be especially noticeable for users who are loading our interactive learning experience on [learn.svelte.dev](https://learn.svelte.dev) for the first time, users of the Svelte REPL, and users with limited connectivity. The majority of the remaining package size is eslint support, which necessitates distributing a CJS build, and once [the eslint rewrite](https://github.com/eslint/eslint/discussions/16557) is completed the Svelte package size can drop by over another 50%.
-
-The number of dependencies in Svelte has been greatly reduced from 61 down to 16. This means faster downloads for our users as well as less susceptibility to supply chain attacks. We also slightly reduced the number of dependencies in the latest versions of SvelteKit as well.
-
-### Developer experience
-
-Svelte 4 makes the Svelte authoring experience more intuitive and consistent: `|local` is now the default for transitions to avoid animations blocking page transitions, preprocessors are now easier to write, and multiple fixes make CSP easier to set up and use.
-
-For users of web components, the largest change is an overhaul of the way you use Svelte to author custom elements. By changing the way they are generated, a whole class of bugs and inconsistencies was eliminated.
-
-Finally, we’ve also made several [improvements to the IDE authoring experience](https://github.com/sveltejs/svelte/pull/8702):
-cmd+click in svelte modules now takes you to the implementation rather than a `.d.ts` file
-imports from `svelte/internal` are now hidden and will not clutter autocomplete suggestions
-auto-imports now work more reliably
-
-### Updated site, docs, and tutorial
-
-The official [svelte.dev](https://svelte.dev) site has gotten an overhaul. It’s now split into multiple pages with improved mobile nav, overhauled typescript docs, dark mode, and an enhanced REPL. The SvelteKit site is also being updated to match. And we’ve updated all the tutorial links to point to our new [learn.svelte.dev](https://learn.svelte.dev) experience. The old tutorial remains available for users of Safari 16.3 and earlier.
-
-Stay tuned for a more in-depth blog post about all the site changes in the coming days!
-
-## Migrating
-
-Most apps and libraries that are compatible with Svelte 3 should be compatible with Svelte 4. Library authors will need to update the version range to include Svelte 4 if `svelte` is specified in the `peerDependencies`. For application authors, the most common change required will be updating tooling to meet the new minimum version requirements such as Node.js 16. Many other migration steps can be handled with `npx sv migrate svelte-4`.
-
-Read the [migration guide](/docs/v4-migration-guide) for full details.
-
-## Svelte 5: the next generation of Svelte
-
-Svelte 5 will be a rewrite of the Svelte compiler and runtime. Svelte 4 was mainly about setting the ground for these future improvements by adopting modern tooling and dropping support for some legacy versions of various technologies such as older bundlers. These changes will help us in a number of ways such as being able to more easily compare the Svelte 5 and Svelte 4 codebases and being able to run the existing tests against the new implementation. Svelte 5 will bring major new features and performance improvements to Svelte. The changes are still baking and not quite ready to share yet, but stay tuned!
-
-## Changelog
-
-See the full list of changes in the [changelog](https://github.com/sveltejs/svelte/blob/master/packages/svelte/CHANGELOG.md).
-
-## Acknowledgements
-
-First and foremost, thank you to all of the many Svelte maintainers and contributors who made this release possible. Developers contributing multiple PRs to this release were [@dummdidumm](https://github.com/dummdidumm), [@gtm-nayan](https://github.com/gtm-nayan), [@benmccann](https://github.com/benmccann), [@tanhauhau](https://github.com/tanhauhau), [@Karlinator](https://github.com/Karlinator), and [@ngtr6788](https://github.com/ngtr6788). Also, thank you to the many community members who donated to [the Svelte OpenCollective](https://opencollective.com/svelte) - these donations sponsored the site overhaul completed by [PuruVJ](https://github.com/puruvj) as well as a number of recent fixes from [@gtm-nayan](https://github.com/gtm-nayan).
-
-Finally, thank you to the various library maintainers from across the ecosystem who helped prepare for this release. Thank you to [@jessebeach](https://github.com/jessebeach) for the help in getting out new versions of `aria-query` and `axobject-query`, [@jreinhold](https://github.com/jreinhold) for ensuring compatibility with Storybook, and [@yanick](https://github.com/yanick) for updating `svelte-testing-library`. And to ensure things stay working, the [`svelte-ecosystem-ci`](https://github.com/sveltejs/svelte-ecosystem-ci) setup by [@dominikg](https://github.com/dominikg) — which was modeled off his similar work for Vite — has been helping to test against major projects in the ecosystem on an ongoing basis.
diff --git a/documentation/blog/2023-06-29-svelte-dev-overhaul.md b/documentation/blog/2023-06-29-svelte-dev-overhaul.md
deleted file mode 100644
index a3ffd739bf..0000000000
--- a/documentation/blog/2023-06-29-svelte-dev-overhaul.md
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: 'svelte.dev: A complete overhaul'
-description: 'The new site comes with accessibility fixes, new features and bottom navbar'
-author: Puru Vijay
-authorURL: https://puruvj.dev
----
-
-When the initial version of Svelte v3 was released four years ago, it included the single-page documentation that folks have been familiar with. That documentation structure had stayed the same as Svelte's API surface increased steadily and more details were added. As a result, the single page got larger and larger to the point where it was becoming difficult to find things. The community had been asking for a revamp, and now it's here!
-
-Meet the new [svelte.dev](https://svelte.dev) — a complete overhaul of the old website.
-
-## Multi-page docs
-
-The table of contents had grown to be quite large and you had to scroll across half a dozen screens to see the whole thing. We heard you! The docs are all split up into multiple pages now and all pages list their sections in the righthand sidebar.
-
-All modules exposed by Svelte are also listed in the sidebar under the `Runtime` section:
-
-- [svelte](/docs/svelte)
-- [svelte/store](/docs/svelte-store)
-- [svelte/motion](/docs/svelte-motion)
-- [svelte/transition](/docs/svelte-transition)
-- [svelte/animate](/docs/svelte-animate)
-- [svelte/easing](/docs/svelte-easing)
-- [svelte/action](/docs/svelte-action)
-
-> [svelte/compiler](/docs/svelte-compiler) is under **Compiler and API** section
-
-We've also taken extra care to ensure that all the links from the old website will be redirected to the correct new page.
-
-## Search
-
-The lack of search functionality could make finding stuff a nuisance as <kbd>Ctrl+F</kbd> only returns results in order of occurrence and not order of importance. While <kbd>Ctrl+F</kbd> did have its benefits such as not requiring JS, now that the site has multiple pages, it's not an option anymore.
-
-And for that, the new website comes with a search bar, which searches through the docs and the API surface. Hit <kbd>Ctrl+K</kbd> (or <kbd>CMD+K</kbd> for Mac users) and start searching — it even works without JavaScript!
-
-## Lights, TypeScript, Action!
-
-The new website comes with a JavaScript / TypeScript toggle, so you can view the docs in your preferred flavour. Every module's exported types are listed at the bottom of the page for easy reference. The types are automatically generated from Svelte's source code, so they're always up to date.
-
-All the JavaScript and TypeScript code snippets have type hints available. Just hover over the variable to see its type. This allows the docs to be type checked at build time, which ensures they're never out of date.
-
-We also (finally!) added documentation for [Actions](/docs/svelte-action). Svelte Actions are a way to interact with the DOM, and are a great way to add interactivity to your app. The docs for Actions are also available in TypeScript.
-
-```svelte
-<script lang="ts">
-	import type { Action } from 'svelte/action';
-
-	const foo: Action = (node) => {
-		// the node has been mounted in the DOM
-
-		return {
-			destroy() {
-				// the node has been removed from the DOM
-			}
-		};
-	};
-</script>
-
-<div use:foo />
-```
-
-## Dark mode
-
-After many years of users asking for dark mode on the website so they can read the docs for their night-time coding sessions, we finally added it! The website now has a dark mode toggle, which is also synced with your OS's dark mode settings. It can be toggled from the top navbar (bottom navbar on mobile).
-
-## Updated REPL
-
-The REPL has been rewritten from scratch to be fully typesafe and comes with features like dark mode. It was reimplemented to upgrade to CodeMirror 6 which comes with many accessibility improvements, multi-select mode, performance improvements, tree-shaking, and many more features.
-
-## Redesigned homepage
-
-Is it a website redesign if the homepage doesn't get the same amount of love? 🙃
-
-The homepage has also been updated to align with [kit.svelte.dev](https://kit.svelte.dev) and features the beautiful Svelte Machine by [@vedam](https://github.com/vedam).
-
-## Bottom navigation!
-
-We sent out a [tweet](https://twitter.com/Rich_Harris/status/1664712880791404546) about experimenting with bottom navigation bar on mobile rather than the conventional top navbar. The response was overwhelmingly positive, so we went ahead and added it! This makes it easier to navigate the website on mobile with just one hand. We also made sure that you'll get to where you want with as few interactions as possible. If you're in the docs section of the site, you'll likely want to browse other documentation pages, which is why the navbar will show these by default when opening it with the option to go one level up to the general site navigation.
-
-If you're on mobile, you can already see it at the bottom. If you're on desktop, you can see it by resizing your browser window to a smaller size.
-
-## Unification of Svelte websites
-
-Now [svelte.dev](https://svelte.dev), [kit.svelte.dev](https://kit.svelte.dev), and [learn.svelte.dev](https://learn.svelte.dev) all use the same design system and are more consistent with each other. This makes it easier to navigate between the websites and also makes it easier to maintain them. We have a package shared across the sites called `@sveltejs/site-kit`, which went through rigorous changes over last 4 months as we have been moving all common code into this package.
-
-For example, we implemented the dark mode toggle in `@sveltejs/site-kit`. We then simply updated the package on [learn.svelte.dev](https://learn.svelte.dev) and [kit.svelte.dev](https://kit.svelte.dev) and those sites got the dark mode toggle automatically (this is also the reason why those sites got the dark mode toggle before the [svelte.dev](https://svelte.dev) relaunch).
-
-## What's next
-
-We have many more things planned to do post-launch. Some of them are:
-
-- Redesigned blog page
-- Improved search
-- Playground: a unified REPL and Examples page
-- Unify the infrastructure of the Svelte REPL and [learn.svelte.dev](https://learn.svelte.dev) by creating a webcontainer-based REPL with rollup as a fallback
-- Address any feedback
diff --git a/documentation/blog/2023-07-01-whats-new-in-svelte-july-2023.md b/documentation/blog/2023-07-01-whats-new-in-svelte-july-2023.md
deleted file mode 100644
index a9134ed5d9..0000000000
--- a/documentation/blog/2023-07-01-whats-new-in-svelte-july-2023.md
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: "What's new in Svelte: July 2023"
-description: 'Svelte 4.0, new website and a tour around the community'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Svelte 4 is out and folks have been building! There's a bunch of new showcases, libraries and tutorials to share. So let's get right into it...
-
-## What's new in Svelte
-
-The big news this month was the release of Svelte 4.0! You can read all about it in the [Announcing Svelte 4 post](https://svelte.dev/blog/svelte-4). From performance fixes and developer experience improvements to [a brand new site, docs and tutorial](https://svelte.dev/blog/svelte-dev-overhaul)... this new release sets the stage for Svelte 5 with minimal breaking changes.
-
-If you're already on Node.js 16, it's possible you won't see any breaking changes in your project. But be sure to read the [migration guide](https://svelte.dev/docs/v4-migration-guide) for all the details.
-
-For a full list of all the changes to the Svelte compiler, including unreleased changes, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/packages/svelte/CHANGELOG.md).
-
-## What's new in SvelteKit
-
-This month there were lots of awesome [bug fixes](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md), so be sure to upgrade to the latest version! There are also a few new features to mention:
-
-- The new `event.isSubRequest` boolean indicates whether this is a same-origin fetch request to one of the app's own APIs during a server request (**1.21.0**, [Docs](https://kit.svelte.dev/docs/types#public-types-requestevent), [#10170](https://github.com/sveltejs/kit/pull/10170))
-- A new config option, `config.kit.env.privatePrefix` will set a private prefix on environment variables. This defaults to `''` (**1.21.0**, [Docs](https://kit.svelte.dev/docs/configuration), [#9996](https://github.com/sveltejs/kit/pull/9996))
-- `VERSION` is now exported and accessible via `@sveltejs/kit`. This can be used for feature detection or anything else that requires knowledge of the current version of SvelteKit (**1.21.0**, [Docs](https://kit.svelte.dev/docs/modules#sveltejs-kit-version), [#9969](https://github.com/sveltejs/kit/pull/9969))
-
-For adapter-specific changes, check out the CHANGELOGs in each of [the `adapter` directories](https://github.com/sveltejs/kit/tree/master/packages).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Heerdle](https://github.com/DreaminDani/heerdle) is a remake of Spotify's now-defunct Heardle - the daily music guessing game
-- [Meoweler](https://meoweler.com/) is a travel site filled with cats and helpful facts about popular destinations
-- [A tech lead from IKEA](https://www.reddit.com/r/sveltejs/comments/13w4zg3/comment/jmaxial/?utm_source=share&utm_medium=web2x&context=3) gave a few more details on the way they build pages (and page template) using Svelte
-- [The Quest to Replace Passwords](https://notes.ekzhang.com/papers/passwords) features an interactive comparison visualization for all the popular password management tools
-- [audiogest](https://audiogest.app/en) lets you turn speech to text & summarize any audio in one click
-- [heroify](https://www.heroify.lol/) generates 3D graphics for your website with AI
-- [Diesel Legacy: The Brazen Age](https://store.steampowered.com/app/1959140/Diesel_Legacy_The_Brazen_Age/) is a fighting game whose leaderboard and profile pages were all built in Svelte
-- [markmyimages](https://www.markmyimages.com/) is a watermarking tool with bulk image resize, rename, effects, and more
-- [md.robino.dev](https://github.com/rossrobino/md) is a web based markdown editor
-- [YABin](https://github.com/Yureien/YABin) is Yet Another Pastebin with some very specific features
-
-**Learning Resources**
-
-- [Announcing Svelte 4 post](https://svelte.dev/blog/svelte-4)
-- [svelte.dev: A complete overhaul](https://svelte.dev/blog/svelte-dev-overhaul)
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Dev Vlog: June 2023](https://www.youtube.com/watch?v=AOXq89h8saI) - Svelte 4.0 with Rich Harris
-- [PodRocket: Svelte 4](https://podrocket.logrocket.com/svelte-4) with Geoff
-- [This Dot Media: Svelte 4 Launch Party](https://www.youtube.com/watch?v=-9gy_leMmcQ) with Simon, Ben, Geoff, and Puru
-- [Exposing Svelte: Between Two Nerds](https://www.youtube.com/watch?v=kAfotLrebhY) is a comedic conversation between Rich Harris and Dax Raad
-- [Community Tutorial: Self-hosting SvelteKit with a VPS, Docker, CapRover and GitHub Actions](https://www.youtube.com/watch?v=KbIFRVvdgA8) with Stanislav Khromov
-- [SvelteKit and Storybook](https://www.youtube.com/watch?v=1wH7rR7hZlg) with Jeppe Reinhold
-- This Week in Svelte:
-  - [2023 June 2](https://www.youtube.com/watch?v=B2AOYWs6eko) - SvelteKit 1.20.1, Svelte 4 pre-release, Headless UI libraries
-  - [2023 June 9](https://www.youtube.com/watch?v=OG70PKD0hEU) - Updates, Self-hosting SvelteKit, Passing styles to children
-  - [2023 June 16](https://www.youtube.com/watch?v=GNEbC5K34Po) - Svelte 4 next.1, how to create a hamburger menu, group layouts
-  - [2023 June 23](https://www.youtube.com/watch?v=o-qnnbMbmE4) - Svelte 4, Popovers and hover, Real Time requests with SvelteKit
-- Svelte Radio
-  - [SvelteLab - a Svelte REPL for SvelteKit](https://www.svelteradio.com/episodes/sveltelab-a-svelte-repl-for-sveltekit-with-antonio-and-paolo) with Antonio and Paolo
-  - [Svelte Radio Live - Svelte 4 Summer Special](https://www.youtube.com/watch?v=72TIVhRtyWE) with Simon and Puru
-- [Svelte Society - London June 2023](https://www.youtube.com/watch?v=EkH0aMgeIKw)
-- [Using The Svelte Context API With Stores](https://www.youtube.com/watch?v=dp-7NvLDrK4), [Impossible FLIP Layout Animations With Svelte And GSAP](https://www.youtube.com/watch?v=ecP8RwpkiQw) and [Create Beautiful Presentations With Svelte](https://www.youtube.com/watch?v=67lqa5kTQkA) by Joy of Code
-
-_To Watch_
-
-- [Server-side filtered, paginated and sorted Table in SvelteKit](https://www.youtube.com/watch?v=VgCU0cVWgJE) by hartenfellerdev
-- [Best Icon Library for Svelte and SvelteKit in 2023](https://www.youtube.com/watch?v=qJP6hC4YIhk) by SvelteRust
-
-_To Read_
-
-- [From Zero to Production with SvelteKit](https://www.okupter.com/events/from-zero-to-production-with-sveltekit) by Justin Ahinon
-- [Thoughts on Svelte(Kit), one year and 3 billion requests later](https://claudioholanda.ch/en/blog/svelte-kit-after-3-billion-requests/) by Claudio Holanda
-- [How I published a gratitude journaling app for iOS and Android using SvelteKit and Capacitor](https://khromov.se/how-i-published-a-gratitude-journaling-app-for-ios-and-android-using-sveltekit-and-capacitor/) by Stanislav Khromov
-- [Learning by doing - Vue devs build a Svelte Single Page App](https://www.blackspike.com/blog/learning-svelte-by-building-a-single-page-application/) by Black Spike
-- [Generate Breadcrumb and Navigation in SvelteKit](https://blog.aakashgoplani.in/generate-breadcrumb-and-navigation-in-sveltekit), [SvelteKit Authentication using SvelteKitAuth and OAuth providers: A Comprehensive Guide](https://blog.aakashgoplani.in/sveltekit-authentication-using-sveltekitauth-and-oauth-providers-a-comprehensive-guide) and [SvelteKitAuth with Salesforce OAuth provider](https://blog.aakashgoplani.in/sveltekitauth-with-salesforce-oauth-provider) by Aakash Goplani
-- [Instantly find and remove Svelte component orphans](https://node-jz.medium.com/instantly-find-and-remove-svelte-component-orphans-9b2838ea2d99) by Jeremy Zaborowski
-- [Migration Guide from Routify to SvelteKit Router](https://blog.aakashgoplani.in/migration-guide-from-routify-to-sveltekit-router) by Aakash Goplani
-- [Creating 3D data visualization using Threlte and D3](https://www.datavizcubed.com/) by DataViz Cubed
-- [Svelte Real‑time Multiplayer Game: User Presence](https://rodneylab.com/svelte-realtime-multiplayer-game/) and [SvelteKit PostCSS Tutorial: use Future CSS Today](https://rodneylab.com/sveltekit-postcss-tutorial/) by Rodney Lab
-- [SvelteKit’s World of Routing: Unleash power of your app using Dynamic Routes and Parameters](https://www.inow.dev/sveltekits-world-of-routing-unleash-power-of-your-app-using-dynamic-routes-and-parameters/) by Igor Nowosad
-
-**Libraries, Tools & Components**
-
-- [The Vercel AI SDK](https://vercel.com/blog/introducing-the-vercel-ai-sdk) is an interoperable, streaming-enabled, edge-ready software development kit for AI apps built with React and Svelte
-- [Superforms 1.0](https://superforms.rocks/) has been released. Check out the [migration guide](https://superforms.rocks/migration) and [new feature list](https://superforms.rocks/whats-new-v1) for more details
-- [Panda CSS](https://panda-css.com/docs/getting-started/svelte) is CSS-in-JS with build time generated styles, RSC compatibility and multi-variant support
-- [svelte-section-list](https://github.com/TIKramer/svelte-section-list) is a headless Svelte npm package that provides drag-and-drop functionality for managing items and sections
-- [WebStorm](https://twitter.com/tomblachut/status/1669759906579185681?t=6WzLPUi65wsLtbVvYky7UQ&s=19) is starting to use the Svelte Language Server in its IDE tooling
-- [shadcn-svelte](https://www.shadcn-svelte.com/) is an unofficial port of [shadcn/ui](https://github.com/shadcn/ui) to Svelte that makes it easy to build your component library from common base components
-- [sveltekit-multibuild](https://github.com/MrNNP/sveltekit-multibuild) is a starter repo to create Android apps, web sites, desktop apps, and Chrome extensions automatically
-- [SvelteKit AI Chatbot](https://github.com/jianyuan/sveltekit-ai-chatbot) is an open-source AI chatbot app template built with SvelteKit, the Vercel AI SDK, OpenAI, and Vercel KV.
-- [KitAI](https://kit-ai.vercel.app/) provides batteries-included AI templates for SvelteKit and Next.js
-- [Svelte Form Builder](https://github.com/pragmatic-engineering/svelte-form-builder-community) is a no-code drag&drop form builder for Svelte
-
-Thanks for reading! As always, feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/blog/2023-08-01-whats-new-in-svelte-august-2023.md b/documentation/blog/2023-08-01-whats-new-in-svelte-august-2023.md
deleted file mode 100644
index 34a482b266..0000000000
--- a/documentation/blog/2023-08-01-whats-new-in-svelte-august-2023.md
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: "What's new in Svelte: August 2023"
-description: 'Extending Custom Element Classes and new +server exports'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Some sweet new features have dropped in both Svelte and SvelteKit, this month. It's also great to see how many products and side projects have launched using Svelte as their core technology!
-
-More on all that down below...
-
-## What's new in Svelte & Language Tools
-
-There's been a bunch of minor bugfixes since the Svelte 4 release. You can find them in the [CHANGELOG](https://github.com/sveltejs/svelte/blob/master/packages/svelte/CHANGELOG.md).
-
-The **4.1.0 release** added the ability to further customize the custom element class that wraps the underlying Svelte component. Check out the [Custom Elements API docs](https://svelte.dev/docs/custom-elements-api) or the [PR](https://github.com/sveltejs/svelte/pull/8991) for more info!
-
-In addition to supporting SvelteKit's new `HEAD` server method, Svelte's language tools now support Prettier v3 (**extensions-107.9.0**) and workspace trust settings are now used to support all settings in workspace (**extensions-107.8.0**).
-
-## What's new in SvelteKit
-
-- The `HEAD` server method is now available in API routes (**1.22.0**, [Docs](https://kit.svelte.dev/docs/routing#server), [#9753](https://github.com/sveltejs/kit/pull/9753))
-- Responses with `Vary` headers are now cached, too (except for `Vary: *`) (**1.22.0**, [Docs](https://kit.svelte.dev/docs/routing#server-content-negotiation), [#9993](https://github.com/sveltejs/kit/pull/9993))
-- There's now a more helpful error for preview if SvelteKit's build output doesn't exist (**1.22.2**, [#10337](https://github.com/sveltejs/kit/pull/10337))
-
-For all the patches and performance updates from this month, check out the [SvelteKit CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md). You can also find adapter-specific CHANGELOGs in each of [the `adapter` directories](https://github.com/sveltejs/kit/tree/master/packages).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [GitLight](https://github.com/ColinLienard/gitlight) brings GitHub & GitLab notifications to your desktop
-- [Days](https://github.com/paprikka/days) is paprikka's life in days, inspired by Buster Benson's Life in Weeks
-- [Mofi](https://mofi.loud.red/) is a content-aware fill and trim for music
-- [JSON Bucket](https://github.com/Nico-Mayer/json-bucket) stores your JSON data so you can access it anywhere through generated API routes
-- [Soggy Planet](https://www.cosmicplayground.org/soggy-planet) is an interactive map of Earth where sea levels rise and fall and the lights of civilization shine through the night ([Source](https://github.com/ryanatkn/cosmicplayground))
-- [PaperClip](https://www.paperclipapp.xyz/) is a Chrome extension that makes it easy to memorize details from papers in machine learning, computer vision, and natural language processing.
-- [Maktaba](https://www.maktaba.digital/) is a bookmark manager that "you will actually use"
-- [Whispering](https://github.com/braden-w/whispering-extension) is a Chrome extension that lets you access OpenAI's Whisper API for fast transcription in the browser (including ChatGPT)
-- [DocuTalk](https://docutalk.co/) is an AI Customer Support chatbot for your website
-- [Krello](https://github.com/iamrishupatel/trello-clone) is a Trello clone built with Svelte, Appwrite and Flowbite
-- [Been](https://beeneverywhere.net/) is a map builder with travel stats like visited countries, extreme visited points, etc.
-- [image-to-social-media-thumbnail](https://brody.fyi/tools/image-to-social-media-thumbnail) lets you convert any image to a social media thumbnail
-- [Svelte Capacitor Store](https://github.com/sdekna/svelte-capacitor-store) is a persistent store that uses capacitor (preferences) storage on native devices, and localStorage otherwise, making it ideal for multi-platform projects
-
-**Learning Resources**
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Exploring Svelte 4 w/ Kevin AK: Performance, Compatibility, & Web Component Support | Modern Web Pod](https://www.youtube.com/watch?v=YOL0HGGVib4) by This Dot Media
-- [Svelte Sirens Stream Design Systems: Lessons Learned](https://www.youtube.com/live/YHZaiIGSqsE?feature=share) featuring Eric Liu, creator of Carbon Components Svelte and the `sveld` docgen library
-- This Week in Svelte:
-  - [2023 June 30](https://www.youtube.com/watch?v=sDz4_BLoYQ4) - Svelte 4.0.1, SK 1.21, lists, screen readers, loading
-  - [2023 July 7](https://www.youtube.com/watch?v=0tq1ph4DDFA) - Svelte 4.0.5, Kit 1.22.1, Svelte 5, local storage and markdown
-  - [2023 July 21](https://www.youtube.com/watch?v=AG4_3kon3zU) - Svelte 4.1.1, SvelteKit 1.22.3, Progressive enhancement
-
-_To Watch/Hear_
-
-- [What is The Transitional Web? with Chris Ferdinandi](https://www.smashingmagazine.com/2023/07/smashing-podcast-episode-63/?ref=dailydevbytes.com) by Smashing Podcast
-- [SvelteKit in 100 seconds](https://www.youtube.com/watch?v=H1eEFfAkIik) by Fireship
-- [Primo V2 Introduction](https://www.youtube.com/watch?v=ThInVXgxJ1Q) by Primo (a [visual CMS](https://primocms.org/) based on Svelte)
-- [Understanding Svelte (vs React)](https://www.youtube.com/watch?v=lYYGhm7p74Q) by Kodaps Academy
-- [Is it thàt simple? - Mastering SvelteKit](https://www.youtube.com/watch?v=6Vrc1VO8pgs) by Threeveloper
-- [Markdown in SvelteKit with custom Components: mdsvex](https://www.youtube.com/watch?v=VJFkyGd0FEA) by hartenfellerdev
-- [How To Add Confetti for Svelte and Sveltekit 🎉](https://www.youtube.com/watch?v=gXtWSb94704) and [Make Your SvelteKit Code 10x Faster With Rust and WebAssembly](https://www.youtube.com/watch?v=Vn2bIv_J_UE) by SvelteRust
-
-_To Read_
-
-- [SvelteJS: My ecosystem is bigger than yours](https://hackmd.io/@roguegpu/r1RKQMdt3) by roguegpu
-- [Avoid shared state on the server in SvelteKit](https://blog.aakashgoplani.in/avoid-shared-state-on-the-server-in-sveltekit) by Aakash Goplani
-- [SvelteKit Fontaine: Reduce Custom Font CLS](https://rodneylab.com/sveltekit-fontaine/) by Rodney Lab
-- [A Simple Guide to Redirects in Svelte Kit](https://rgbstudios.org/blog/redirects-in-svelte-kit) by Justin Golden
-- [React vs Svelte (Q3 2023)](https://gee-astro-personal.vercel.app/blog/post2) by Gee
-- [SvelteKit Page Reaction Component with Upstash Redis](https://scottspence.com/posts/sveltekit-page-reaction-component-with-upstash-redis) by Scott Spence
-- [Building a privacy-friendly, self-hosted application architecture with SvelteKit](https://khromov.se/building-a-privacy-friendly-self-hosted-application-architecture-with-sveltekit/) and [Building a privacy-friendly, self-hosted application architecture with SvelteKit](https://khromov.se/building-a-privacy-friendly-self-hosted-application-architecture-with-sveltekit/) by Stanislav Khromov
-- [Deploying Sveltekit on IIS](https://dev.to/nnutnonn/deploying-sveltekit-on-iis--5gf6) by Nutchapon Makelai
-- [Streamlined Authentication and Secrets Management](https://eman.hashnode.dev/streamlined-authentication-and-secrets-management) by Eman
-
-**Libraries, Tools & Components**
-
-- [Melt UI](https://github.com/melt-ui/melt-ui) is a set of headless, accessible component builders for Svelte
-- [MDsveX](https://github.com/pngwn/MDsveX/releases/tag/mdsvex%400.11.0) has been updated to work with Svelte 4
-- [Svelte Sonner](https://github.com/wobsoriano/svelte-sonner) is an opinionated toast component for Svelte
-- [WebExtensionTemplate](https://github.com/kyle-n/WebExtensionTemplate) lets you skip the boilerplate and write a Web Extension with TypeScript and Svelte or React
-- [svelte-rust](https://github.com/Hugo-Dz/svelte-rust) lets you run Rust code in your Svelte app
-- [SvelteKit SSE](https://github.com/tncrazvan/sveltekit-sse) provides an easy way to produce and consume server sent events
-- [better-svelte-writable](https://github.com/tnthung/better-svelte-writable) provides a type-safe writable which gives you more control over the container
-- [Svetch.ts](https://github.com/Bewinxed/svetch#readme) is a client/types/schema/docs generator for your API endpoints
-- [sveltekit-localize-url](https://github.com/rinart73/sveltekit-localize-url) handles URL localization and routing
-- [elegua](https://github.com/howesteve/elegua) is a small, reactive PWA router for Svelte
-- [Molly](https://github.com/renefournier/molly/tree/main) is a bash script and npm module that helps you clean up unused Svelte components in your project
-- [sveltekit-bot](https://github.com/begoon/sveltekit-bot) is a Telegram bot made with SvelteKit and Vercel
-
-Thanks for reading! As always, feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/blog/2023-08-31-view-transitions.md b/documentation/blog/2023-08-31-view-transitions.md
deleted file mode 100644
index 01db9262bf..0000000000
--- a/documentation/blog/2023-08-31-view-transitions.md
+++ /dev/null
@@ -1,265 +0,0 @@
----
-title: Unlocking view transitions in SvelteKit 1.24
-description: Streamlined page transitions with onNavigate
-author: Geoff Rich
-authorURL: https://geoffrich.net
----
-
-The [view transitions API](https://developer.chrome.com/docs/web-platform/view-transitions/) has been sweeping the web development world lately, and for good reason. It streamlines the process of animating between two page states, which is especially useful for page transitions.
-
-However, until now, you couldn’t easily use this API in a SvelteKit app, since it was difficult to slot into the right place in the navigation lifecycle. SvelteKit 1.24 brought a new [`onNavigate`](https://kit.svelte.dev/docs/modules#$app-navigation-onnavigate) lifecycle hook to make view transitions integration much easier – let’s dive in.
-
-## How view transitions work
-
-You can trigger a view transition by calling `document.startViewTransition` and passing a callback that updates the DOM somehow. For our purposes today, SvelteKit will update the DOM as the user navigates. Once the callback finishes, the browser will transition to the new page state — by default, it does a crossfade between the old and the new states.
-
-```js
-// @errors: 2339
-const domUpdate = async () => {};
-// ---cut---
-document.startViewTransition(async () => {
-	await domUpdate(); // mock function for demonstration purposes
-});
-```
-
-Behind the scenes, the browser does something really clever. When the transition starts, it captures the current state of the page and takes a screenshot. It then holds that screenshot in place while the DOM is updating. Once the DOM has finished updating, it captures the new state, and animates between the two states.
-
-While it’s only implemented in Chrome (and other Chromium-based browsers) for now, [WebKit is also in favor](https://github.com/WebKit/standards-positions/issues/48#issuecomment-1679760489) of it. Even if you’re on an unsupported browser, it’s a perfect candidate for progressive enhancement since we can always fall back to a non-animated navigation.
-
-It’s important to note that view transitions is a browser API, not a SvelteKit one. `onNavigate` is the only SvelteKit-specific API we’ll use today. Everything else can be used wherever you write for the web! For more on the view transitions API, I highly recommend the [Chrome explainer](https://developer.chrome.com/docs/web-platform/view-transitions/) by Jake Archibald.
-
-## How `onNavigate` works
-
-Before learning how to write view transitions, let's highlight the function that makes it all possible: [`onNavigate`](https://kit.svelte.dev/docs/modules#$app-navigation-onnavigate).
-
-Until recently, SvelteKit had two navigation lifecycle functions: [`beforeNavigate`](https://kit.svelte.dev/docs/modules#$app-navigation-beforenavigate), which fires before a navigation starts, and [`afterNavigate`](https://kit.svelte.dev/docs/modules#$app-navigation-afternavigate), which fires after the page has been updated following a navigation. SvelteKit 1.24 introduces a third: `onNavigate`, which will fire on every navigation, immediately before the new page is rendered. Importantly, it will run _after_ any data loading for the page has completed – since starting a view transition prevents any interaction with the page, we want to start it as late as possible.
-
-You can also return a promise from `onNavigate`, which will suspend the navigation until it resolves. This will let us wait to complete the navigation until the view transition has started.
-
-```js
-// @errors: 2304 7006
-function delayNavigation() {
-	return new Promise((res) => setTimeout(res, 100));
-}
-
-onNavigate(async (navigation) => {
-	// do some work immediately before the navigation completes
-
-	// optionally return a promise to delay navigation until it resolves
-	return delayNavigation();
-});
-```
-
-With that out of the way, let's see how you can use view transitions in your SvelteKit app.
-
-## Getting started with view transitions
-
-The best way to see view transitions in action is to try it yourself. You can spin up the SvelteKit demo app by running `npx sv create` in your local terminal, or in your browser on [StackBlitz](https://sveltekit.new). Make sure to use a browser that supports the view transitions API. Once you have the app running, add the following to the script block in `src/routes/+layout.svelte`.
-
-```js
-// @errors: 2305 7006 2339 2810
-import { onNavigate } from '$app/navigation';
-
-onNavigate((navigation) => {
-	if (!document.startViewTransition) return;
-
-	return new Promise((resolve) => {
-		document.startViewTransition(async () => {
-			resolve();
-			await navigation.complete;
-		});
-	});
-});
-```
-
-With that, every navigation that occurs will trigger a view transition. You can already see this in action – by default, the browser will crossfade between the old and new pages.
-
-<video src="https://sveltejs.github.io/assets/video/vt-demo-1.mp4" controls muted playsinline></video>
-
-<details>
-<summary>How the code works</summary>
-
-This code may look a bit intimidating – if you're curious, I can break it down line-by-line, but for now it’s enough to know that adding it will allow you to interact with the view transitions API during navigation.
-
-As mentioned above, the `onNavigate` callback will run immediately before the new page is rendered after a navigation. Inside the callback, we check if `document.startViewTransition` exists. If it doesn’t (i.e. the browser doesn’t support it), we exit early.
-
-We then return a promise to delay completing the navigation until the view transition has started. We use a [promise constructor](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/Promise) so that we can control when the promise resolves.
-
-```js
-// @errors: 1108
-return new Promise((resolve) => {
-	document.startViewTransition(async () => {
-		resolve();
-		await navigation.complete;
-	});
-});
-```
-
-Inside the promise constructor, we start the view transition. Inside the view transition callback we resolve the promise we just returned, which indicates to SvelteKit that it should finish the navigation. It’s important that the navigation waits to finish until _after_ we start the view transition – the browser needs to snapshot the old state so it can transition to the new state.
-
-Finally, inside the view transition callback we wait for SvelteKit to finish the navigation by awaiting `navigation.complete`. Once `navigation.complete` resolves, the new page has been loaded into the DOM and the browser can animate between the two states.
-
-It’s a bit of a mouthful, but by not abstracting it we allow you to interact with the view transition directly and make any customizations you require.
-
-</details>
-
-## Customizing the transition with CSS
-
-We can also customize this page transition using CSS animation. In the style block of your `+layout.svelte`, add the following CSS rules.
-
-```css
-@keyframes fade-in {
-	from {
-		opacity: 0;
-	}
-}
-
-@keyframes fade-out {
-	to {
-		opacity: 0;
-	}
-}
-
-@keyframes slide-from-right {
-	from {
-		transform: translateX(30px);
-	}
-}
-
-@keyframes slide-to-left {
-	to {
-		transform: translateX(-30px);
-	}
-}
-
-:root::view-transition-old(root) {
-	animation:
-		90ms cubic-bezier(0.4, 0, 1, 1) both fade-out,
-		300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-left;
-}
-
-:root::view-transition-new(root) {
-	animation:
-		210ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,
-		300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-right;
-}
-```
-
-Now when you navigate between pages, the old page will fade out and slide to the left, and the new page will fade in and slide from the right. These particular animation styles come from Jake Archibald’s excellent [Chrome Developers article on view transitions](https://developer.chrome.com/docs/web-platform/view-transitions/), which is well worth a read if you want to understand everything you can do with this API.
-
-Note that we have to add `:root` before the `::view-transition` pseudoelements – these elements are only on the root of the document, so we don’t want Svelte to [scope them](/docs/svelte-components#style) to the component.
-
-You might have noticed that the entire page slides in and out, even though the header is the same on both the old and new page. To make for a smoother transition, we can give the header a unique `view-transition-name` so that it is animated separately from the rest of the page. In `src/routes/Header.svelte`, find the `header` CSS selector in the style block and add a view transition name.
-
-```css
-header {
-	display: flex;
-	justify-content: space-between;
-	view-transition-name: header;
-}
-```
-
-Now, the header will not transition in and out on navigation, but the rest of the page will.
-
-<video src="https://sveltejs.github.io/assets/video/vt-demo-2.mp4" controls muted playsinline></video>
-
-<details>
-<summary>Fixing the types</summary>
-
-Since `startViewTransition` is not supported by all browsers, your IDE may not know that it exists. To make the errors go away and get the correct typings, add the following to your `app.d.ts`:
-
-```ts
-declare global {
-	// preserve any customizations you have here
-	namespace App {
-		// interface Error {}
-		// interface Locals {}
-		// interface PageData {}
-		// interface Platform {}
-	}
-
-	// add these lines
-	interface ViewTransition {
-		updateCallbackDone: Promise<void>;
-		ready: Promise<void>;
-		finished: Promise<void>;
-		skipTransition: () => void;
-	}
-
-	interface Document {
-		startViewTransition(updateCallback: () => Promise<void>): ViewTransition;
-	}
-}
-
-export {};
-```
-
-</details>
-
-## Transitioning individual elements
-
-We just saw how giving an element a `view-transition-name` separates it out from the rest of the page's animation. Setting a `view-transition-name` also instructs the browser to smoothly animate it to its new position after the transition completes. The `view-transition-name` acts as a unique identifier so the browser can identify matching elements from the old and new states.
-
-Let’s see what that looks like – our demo app’s navigation has a small triangle indicating the active page. Right now, it abruptly appears in the new position after we navigate. Let’s give it a `view-transition-name` so the browser animates it to its new position instead.
-
-Inside `src/routes/Header.svelte`, find the CSS rule creating the active page indicator and give it a `view-transition-name`:
-
-```css
-li[aria-current='page']::before {
-	/* other existing rules */
-	view-transition-name: active-page;
-}
-```
-
-By adding that single line, the indicator will now smoothly slide to its new position instead of jumping.
-
-<video src="https://sveltejs.github.io/assets/video/vt-demo-3.mp4" controls muted playsinline></video>
-
-(It might be easy to miss the difference – look at the small moving triangle indicator at the top of the screen!)
-
-## Reduced motion
-
-It’s important to respect our users’ [motion preferences](https://web.dev/prefers-reduced-motion/) while implementing animation on the web. Just because you can implement an extreme page transition doesn’t mean you should. To disable all page transitions for users who prefer reduced motion, you can add the following to the global `styles.css`:
-
-```css
-@media (prefers-reduced-motion) {
-	::view-transition-group(*),
-	::view-transition-old(*),
-	::view-transition-new(*) {
-		animation: none !important;
-	}
-}
-```
-
-While this may be the safest option, reduced motion does not necessarily mean no animation. Instead, you could consider your view transitions on a case-by-case basis. For instance, maybe we disable the sliding animation, but leave the default crossfade (which doesn’t involve motion). You can do so by wrapping the `::view-transition` rules you want to disable in a `prefers-reduced-motion: no-preference` media-query:
-
-```css
-@media (prefers-reduced-motion: no-preference) {
-	:root::view-transition-old(root) {
-		animation:
-			90ms cubic-bezier(0.4, 0, 1, 1) both fade-out,
-			300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-left;
-	}
-
-	:root::view-transition-new(root) {
-		animation:
-			210ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,
-			300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-right;
-	}
-}
-```
-
-## What’s next?
-
-As you can see, SvelteKit doesn’t abstract a whole lot about _how_ view transitions work – you’re interacting directly with the browser’s built-in `document.startViewTransition` and `::view-transition` APIs, rather than framework abstractions like those found in Nuxt and Astro. We’re eager to see how people end up using view transitions in SvelteKit apps, and whether it makes sense to add higher level abstractions of our own in future.
-
-## Resources
-
-You can find the demo code from this post [on GitHub](https://github.com/geoffrich/sveltekit-onnavigate-demo) and the live version [deployed to Vercel](https://sveltekit-onnavigate-demo.vercel.app/). Here are some other view transitions resources you may find helpful:
-
-- [MDN view transitions docs](https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API)
-- [Chrome view transitions API explainer](https://developer.chrome.com/docs/web-platform/view-transitions/)
-- [Rich Harris demoing view transitions with onNavigate](https://www.youtube.com/shorts/weOCWOD2UIo)
-- [My Svelte Summit video showing how to use view transitions for FLIP animations](https://youtu.be/K95TQ-Yh7Cw)
-- [Fruit list demo](https://sveltekit-shared-element-transitions-codelab.vercel.app/fruits) ([source](https://github.com/geoffrich/sveltekit-view-transitions))
-- [Svelte Summit video list demo](https://http-203-svelte.vercel.app/) (based on a [Jake Archibald demo](https://http203-playlist.netlify.app/)) ([source](https://github.com/geoffrich/http-203-svelte))
diff --git a/documentation/blog/2023-09-01-whats-new-in-svelte-september-2023.md b/documentation/blog/2023-09-01-whats-new-in-svelte-september-2023.md
deleted file mode 100644
index f68241735f..0000000000
--- a/documentation/blog/2023-09-01-whats-new-in-svelte-september-2023.md
+++ /dev/null
@@ -1,98 +0,0 @@
----
-title: "What's new in Svelte: September 2023"
-description: "New parameters in SvelteKit's redirect and an onNavigate lifecycle function come to life"
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Happy September y'all! With all the [sneak peeks at what's coming soon in Svelte 5](https://twitter.com/Rich_Harris/status/1688581184018583558), we thought it'd be best to look back at the last month to see what's shipped and what the community is building with Svelte.
-
-Before we jump in, a warm welcome to the new Svelte Ambassadors: [@cainux](https://github.com/cainux) and [@grischaerbe](https://github.com/grischaerbe)! Welcome to the crew ⛴️
-
-## What's new in Svelte & Language Tools
-
-- `svelteHTML` has moved from language-tools into Svelte core so that `svelte/element` types will now load correctly (**4.2.0** in Svelte, **107.10.0** in Language Tools)
-
-## What's new in SvelteKit
-
-- `URL` is now accepted in the `redirect` function (**1.23.0**, [Docs](https://kit.svelte.dev/docs/modules#sveltejs-kit-redirect), [#10570](https://github.com/sveltejs/kit/pull/10570))
-- Mistyped route filenames will now throw a warning (**1.23.0**, [#10558](https://github.com/sveltejs/kit/pull/10558))
-- The new `onNavigate` lifecycle function enables view transitions - Check out the [blog post](https://svelte.dev/blog/view-transitions) for more info (**1.24.0**, [Docs](https://kit.svelte.dev/docs/modules#app-navigation-onnavigate), [#9605](https://github.com/sveltejs/kit/pull/9605))
-
-But that's just the new features! For all the patches and performance updates from this month, check out the [SvelteKit CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md). You can also find adapter-specific CHANGELOGs in each of [the `adapter` directories](https://github.com/sveltejs/kit/tree/master/packages).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [Planet Of The Bugs](https://planetofthebugs.xyz/) allows developers to practice and hone their skill-sets by exposing them to an endless supply of unique, curated issues and bugs from popular open-source projects on Github
-- [Minesweeper](https://github.com/ProductionPanic/minesweeper/tree/main) is an Android game built with SvelteKit, Capacitor, TailwindCSS and DaisyUI (check it out on the [Google Play Store](https://play.google.com/store/apps/details?id=com.production.panic.minesweeper&pli=1))
-- [Pendor](https://www.pendor.ai/) is an AI component generator for Svelte
-- [Avatars Pro](https://senja.io/testimonial-widgets/avatars-pro) is a social proof widget made for the web
-- [Pomodoro Focus](https://github.com/con-dog/pomodoro-focus) is a pomodoro timer browser extension
-- [memegen](https://github.com/bhupeshpr25/memegen) is a Firefox web extension that allows users to generate memes using various templates
-- [Resgen](https://resgen.app/) is a Chrome extension that tailors resumes based on job descriptions and your experiences
-- [Icono Search](https://www.icono-search.com) is an AI-powered video search engine
-- [digital-paper](https://github.com/danferns/digital-paper) is a writing app with no backspace or undo
-- [Ubuntu 22.04 in Svelte](https://github.com/manhhungpc/ubuntu2204-svelte) aims to replicate the Ubuntu 22.04 desktop experience on the web
-- [My Queue](https://www.myqueue.so/) creates a playlist of written articles by turning them into audio stories
-
-**Learning Resources**
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Svelte Society - London August 2023](https://www.youtube.com/watch?v=90Psdk5rAnU)
-- [Building a Blog using SvelteKit and Nostr as a CMS (Part 1](https://kevinak.se/blog/building-a-blog-using-sveltekit-and-nostr-as-a-cms-part-1-1690807337563)) by Kev
-- [Mastering SvelteKit with Geoff Rich | JS Drops](https://www.youtube.com/watch?v=MaF8kRbHbi0) by This Dot Media
-- [Using GitHub Contributions To Flex On The Normies](https://youtu.be/f9fd1L1FEts?si=3hbihW-X5-GKSJxN), [Learn Svelte By Making A Matching Game](https://www.youtube.com/watch?v=w2q9caYXgkg) and [Who Needs API Permission When You Can Use Web Scraping](https://www.youtube.com/watch?v=T-lBPpeokfY) by Joy of Code
-- [The missing guide to understanding adapter-static in SvelteKit](https://khromov.se/the-missing-guide-to-understanding-adapter-static-in-sveltekit/) by Stanislav Khromov
-- This Week in Svelte:
-  - [2023 July 28](https://www.youtube.com/watch?v=mvTEQ_C0qRQ) - Screen reader market share, Svelte to plain JS, Web Components
-  - [2023 Aug 4](https://www.youtube.com/watch?v=Ye8cCJyPZjg) - Svelte 4.1.2, SvelteKit 1.22.4, ES Modules, Types in markup
-  - [2023 August 11](https://www.youtube.com/watch?v=A8XUaiCVkCI) - Svelte 4.2.0, SvelteKit 1.22.5, How to create Toggle Switches
-  - [2023 August 18](https://www.youtube.com/watch?v=nJ5Wf3uL7dM) - SvelteKit 1.22.6, accessible form error summaries
-  - [2023 August 25](https://www.youtube.com/watch?v=JoPzvlBKXXE) - SvelteKit 1.23.0, Bun and SvelteKit, Enhanced search
-- Svienna (Svelte Society Vienna) Sessions
-  - [Ermin Celikovic - You might not need a slider library](https://www.youtube.com/watch?v=dSUmtijkFOc)
-  - [Lukas Stracke - How to use sentry.io in your SvelteKit App](https://www.youtube.com/watch?v=u41-MtPGH04)
-  - [Jean-Yves Couet - SvelteKit & Remult... fullstack apps in minutes!](https://www.youtube.com/watch?v=N8d290fTzq8)
-- Sirens Sessions
-  - [Prismic Slice Machines & SvelteKit](https://www.youtube.com/watch?v=19Meb-yMsAg) with Sam Littlefair
-  - [Medusa and SvelteKit E-Commerce Stack](https://www.youtube.com/watch?v=rVVHxows9dY) with Lacey Pevey
-  - [Design Systems: Lessons Learned](https://www.youtube.com/watch?v=YHZaiIGSqsE) with Eric Liu
-
-_To Watch_
-
-- [Image optimization in SvelteKit with vite-imagetools](https://www.youtube.com/watch?v=285vSLe9LQ8) by hartenfellerdev
-- [Building a Todo App with Rust and SvelteKit: Complete Tutorial](https://www.youtube.com/watch?v=w7is2bCTUg0) and [Stripe Payment In SvelteKit With Dynamic Pricing](https://www.youtube.com/watch?v=o8gvCLgz1vs) by SvelteRust
-- [Leaflet maps in SvelteKit like it's 2023 (HowTo)](https://www.youtube.com/watch?v=JFctWXEzFZw)
-  ShipBit
-
-_To Read_
-
-- [Internationalization in SvelteKit (Series)](https://blog.aakashgoplani.in/series/i18n-in-sveltekit) by Aakash Goplani
-- [The easiest Chatbot you will ever build](https://simon-prammer.vercel.app/blog/post/sveltekit-langchain) and [Intro to LangSmith🦜️🛠️](https://simon-prammer.vercel.app/blog/post/langsmith) by Simon Prammer
-- [SvelteKit: How to make code-based router, instead of file-based router [August 2023]](https://dev.to/maxcore/sveltekit-how-to-make-code-based-router-instead-of-file-based-router-august-2023-5f9) by Max Core
-- [SvelteKit Hydration Gotcha](https://www.captaincodeman.com/sveltekit-hydration-gotcha) by Captain Codeman
-- [Automatically generate sitemap.xml in SvelteKit](https://alex-schnabl.medium.com/automatically-generate-sitemap-xml-in-sveltekit-910bd09d17e7) by Alex Schnabl
-- [Discovering Svelte: Things I Learned While Using Svelte](https://www.tronic247.com/discovering-svelte-things-i-learned-while-using-svelte/) by Posandu Mapa
-- [Typed fetch with Sveltekit and Hono using RPC](https://dev.to/subhendupsingh/typed-fetch-with-sveltekit-and-hono-using-rpc-2clf) by Subhendu Pratap Singh
-- [Svelte Context Module Scripts Explained](https://raqueebuddinaziz.com/blog/svelte-context-module-scripts-explained) by raqueebuddin aziz
-- [Building with GPT4 and Svelte](https://kvak.io/meoweler) by levmiseri
-- [Type-safe User Authentication in SvelteKit with Lucia, Planetscale, and Upstash Redis](https://upstash.com/blog/lucia-sveltekit) by Chris Jayden
-- [Document Svelte Projects with HTML and JSDoc Comments](https://blog.robino.dev/posts/doc-comments-svelte) by Ross Robino
-
-**Libraries, Tools & Components**
-
-- [Carta](https://github.com/BearToCode/carta-md) is a lightweight, fast and extensible Svelte Markdown editor and viewer, based on Marked
-- [Threlte](https://threlte.xyz/), the 3D framework built from Svelte and Three.js has released version 6
-- [vite-plugin-web-extension](https://vite-plugin-web-extension.aklinker1.io/guide/frontend-frameworks.html#svelte-integration) works great with Svelte to make building browser extensions easier
-- [Salvia-kit Svelte Dashboards](https://github.com/salvia-kit/svelte-dashboards) contains 10 free dashboard templates for SvelteKit
-- [drab](https://github.com/rossrobino/drab) is an Unstyled Svelte component library
-- [svelte-img-previewer](https://www.npmjs.com/package/svelte-img-previewer?activeTab=readme) is a tool for displaying images from input file types in Svelte
-- [sveltekit-search-params](https://github.com/paoloricciuti/sveltekit-search-params) describes itself as the fastest way to read AND write from query search params in SvelteKit
-
-That's it for this month! Feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/blog/2023-09-20-runes.md b/documentation/blog/2023-09-20-runes.md
deleted file mode 100644
index 971b4abba9..0000000000
--- a/documentation/blog/2023-09-20-runes.md
+++ /dev/null
@@ -1,223 +0,0 @@
----
-title: Introducing runes
-description: "Rethinking 'rethinking reactivity'"
-author: The Svelte team
-authorURL: /
----
-
-In 2019, Svelte 3 turned JavaScript into a [reactive language](/blog/svelte-3-rethinking-reactivity). Svelte is a web UI framework that uses a compiler to turn declarative component code like this...
-
-```svelte
-<script>
-	let count = 0;
-
-	function increment() {
-		count += 1;
-	}
-</script>
-
-<button on:click={increment}>
-	clicks: {count}
-</button>
-```
-
-...into tightly optimized JavaScript that updates the document when state like `count` changes. Because the compiler can 'see' where `count` is referenced, the generated code is [highly efficient](/blog/virtual-dom-is-pure-overhead), and because we're hijacking syntax like `let` and `=` instead of using cumbersome APIs, you can [write less code](/blog/write-less-code).
-
-A common piece of feedback we get is 'I wish I could write all my JavaScript like this'. When you're used to things inside components magically updating, going back to boring old procedural code feels like going from colour to black-and-white.
-
-Svelte 5 changes all that with _runes_, which unlock _universal, fine-grained reactivity_.
-
-<div class="max">
-<figure style="max-width: 960px; margin: 0 auto">
-<div style="aspect-ratio: 1.755; position: relative; margin: 0 auto;">
-	<iframe style="position: absolute; width: 100%; height: 100%; left: 0; top: 0; margin: 0;" src="https://www.youtube-nocookie.com/embed/RVnxF3j3N8U" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-</div>
-
-<figcaption>Introducing runes</figcaption>
-</figure>
-</div>
-
-## Before we begin
-
-Even though we're changing how things work under the hood, Svelte 5 should be a drop-in replacement for almost everyone. The new features are opt-in — your existing components will continue to work.
-
-We don't yet have a release date for Svelte 5. What we're showing you here is a work-in-progress that is likely to change!
-
-## What are runes?
-
-> **rune** /ro͞on/ _noun_
->
-> A letter or mark used as a mystical or magic symbol.
-
-Runes are symbols that influence the Svelte compiler. Whereas Svelte today uses `let`, `=`, the [`export`](https://learn.svelte.dev/tutorial/declaring-props) keyword and the [`$:`](https://learn.svelte.dev/tutorial/reactive-declarations) label to mean specific things, runes use _function syntax_ to achieve the same things and more.
-
-For example, to declare a piece of reactive state, we can use the `$state` rune:
-
-```diff
-<script>
--	let count = 0;
-+	let count = $state(0);
-
-	function increment() {
-		count += 1;
-	}
-</script>
-
-<button on:click={increment}>
-	clicks: {count}
-</button>
-```
-
-At first glance, this might seem like a step back — perhaps even [un-Svelte-like](https://twitter.com/stolinski/status/1438173489479958536). Isn't it better if `let count` is reactive by default?
-
-Well, no. The reality is that as applications grow in complexity, figuring out which values are reactive and which aren't can get tricky. And the heuristic only works for `let` declarations at the top level of a component, which can cause confusion. Having code behave one way inside `.svelte` files and another inside `.js` can make it hard to refactor code, for example if you need to turn something into a [store](https://learn.svelte.dev/tutorial/writable-stores) so that you can use it in multiple places.
-
-## Beyond components
-
-With runes, reactivity extends beyond the boundaries of your `.svelte` files. Suppose we wanted to encapsulate our counter logic in a way that could be reused between components. Today, you would use a [custom store](https://learn.svelte.dev/tutorial/custom-stores) in a `.js` or `.ts` file:
-
-```js
-import { writable } from 'svelte/store';
-
-export function createCounter() {
-	const { subscribe, update } = writable(0);
-
-	return {
-		subscribe,
-		increment: () => update((n) => n + 1)
-	};
-}
-```
-
-Because this implements the _store contract_ — the returned value has a `subscribe` method — we can reference the store value by prefixing the store name with `$`:
-
-```diff
-<script>
-+	import { createCounter } from './counter.js';
-+
-+	const counter = createCounter();
--	let count = 0;
--
--	function increment() {
--		count += 1;
--	}
-</script>
-
--<button on:click={increment}>
--	clicks: {count}
-+<button on:click={counter.increment}>
-+	clicks: {$counter}
-</button>
-```
-
-This works, but it's pretty weird! We've found that the store API can get rather unwieldy when you start doing more complex things.
-
-With runes, things get much simpler:
-
-```diff
--import { writable } from 'svelte/store';
-
-export function createCounter() {
--	const { subscribe, update } = writable(0);
-+	let count = $state(0);
-
-	return {
--		subscribe,
--		increment: () => update((n) => n + 1)
-+		get count() { return count },
-+		increment: () => count += 1
-   };
-}
-```
-
-```diff
-<script>
-	import { createCounter } from './counter.js';
-
-	const counter = createCounter();
-</script>
-
-<button on:click={counter.increment}>
--	clicks: {$counter}
-+	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 function was called.
-
-## Runtime reactivity
-
-Today, Svelte uses _compile-time reactivity_. This means that if you have some code that uses the `$:` label to re-run automatically when dependencies change, those dependencies are determined when Svelte compiles your component:
-
-```svelte
-<script>
-	export let width;
-	export let height;
-
-	// the compiler knows it should recalculate `area`
-	// when either `width` or `height` change...
-	$: area = width * height;
-
-	// ...and that it should log the value of `area`
-	// when _it_ changes
-	$: console.log(area);
-</script>
-```
-
-This works well... until it doesn't. Suppose we refactored the code above:
-
-```js
-// @errors: 7006 2304
-const multiplyByHeight = (width) => width * height;
-$: area = multiplyByHeight(width);
-```
-
-Because the `$: area = ...` declaration can only 'see' `width`, it won't be recalculated when `height` changes. As a result, code is hard to refactor, and understanding the intricacies of when Svelte chooses to update which values can become rather tricky beyond a certain level of complexity.
-
-Svelte 5 introduces the `$derived` and `$effect` runes, which instead determine the dependencies of their expressions when they are evaluated:
-
-```svelte
-<script>
-	let { width, height } = $props(); // instead of `export let`
-
-	const area = $derived(width * height);
-
-	$effect(() => {
-		console.log(area);
-	});
-</script>
-```
-
-As with `$state`, `$derived` and `$effect` can also be used in your `.js` and `.ts` files.
-
-## Signal boost
-
-Like every other framework, we've come to the realisation that [Knockout](https://knockoutjs.com/) was right all along.
-
-Svelte 5's reactivity is powered by _signals_, which are essentially [what Knockout was doing in 2010](https://dev.to/this-is-learning/the-evolution-of-signals-in-javascript-8ob). More recently, signals have been popularised by [Solid](https://www.solidjs.com/) and adopted by a multitude of other frameworks.
-
-We're doing things a bit differently though. In Svelte 5, signals are an under-the-hood implementation detail rather than something you interact with directly. As such, we don't have the same API design constraints, and can maximise both efficiency _and_ ergonomics. For example, we avoid the type narrowing issues that arise when values are accessed by function call, and when compiling in server-side rendering mode we can ditch the signals altogether, since on the server they're nothing but overhead.
-
-Signals unlock _fine-grained reactivity_, meaning that (for example) changes to a value inside a large list needn't invalidate all the _other_ members of the list. As such, Svelte 5 is ridonkulously fast.
-
-## Simpler times ahead
-
-Runes are an additive feature, but they make a whole bunch of existing concepts obsolete:
-
-- the difference between `let` at the top level of a component and everywhere else
-- `export let`
-- `$:`, with all its attendant quirks
-- different behaviour between `<script>` and `<script context="module">`
-- `$$props` and `$$restProps`
-- lifecycle functions (things like `afterUpdate` can just be `$effect` functions)
-- the store API and `$` store prefix (while stores are no longer necessary, they are not being deprecated)
-
-For those of you who already use Svelte, it's new stuff to learn, albeit hopefully stuff that makes your Svelte apps easier to build and maintain. But newcomers won't need to learn all those things — it'll just be in a section of the docs titled 'old stuff'.
-
-This is just the beginning though. We have a long list of ideas for subsequent releases that will make Svelte simpler and more capable.
-
-## Try it!
-
-You can't use Svelte 5 in production yet. We're in the thick of it at the moment and can't tell you when it'll be ready to use in your apps.
-
-But we didn't want to leave you hanging. We've created a [preview site](https://svelte-5-preview.vercel.app) with detailed explanations of the new features and an interactive playground. You can also visit the `#svelte-5-alpha` channel of the [Svelte Discord](/chat) to learn more. We'd love to have your feedback!
diff --git a/documentation/blog/2023-10-01-hacktoberfest.md b/documentation/blog/2023-10-01-hacktoberfest.md
deleted file mode 100644
index eafab46c02..0000000000
--- a/documentation/blog/2023-10-01-hacktoberfest.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: 'Hacktoberfest 2023 with SvelteKit'
-description: 'SvelteKit joins in the Hacktoberfest event in 2023'
-author: Willow (GHOST) & Braden Wiggins
-authorURL: https://ghostdev.xyz
----
-
-# Sveltekit 🧡 Hacktoberfest
-
-We're excited to announce SvelteKit's participation in this year's Hacktoberfest! Hacktoberfest is a global event that takes place every October, during which developers are encouraged to contribute to open-source projects like SvelteKit. The goal is to foster a vibrant open-source community, celebrate shared knowledge, and make the world of coding more accessible to all. You can find other participating repositories by searching the [`hacktoberfest` topic](https://github.com/topics/hacktoberfest) on github.
-
-## Getting Started
-
-The first step is to [register for Hacktoberfest](https://hacktoberfest.com/register). Once you've registered, any PRs submitted to Sveltekit will count towards your participation in the event!
-
-## Contributing
-
-If you need inspiration when looking for an issue to fix, check out the [low hanging fruit](https://github.com/sveltejs/kit/labels/low%20hanging%20fruit), [contributions-welcome](https://github.com/sveltejs/kit/labels/contributions-welcome), [ready to implement](https://github.com/sveltejs/kit/labels/ready%20to%20implement), or [documentation](https://github.com/sveltejs/kit/labels/documentation) tags.
-
-It's a good idea to communicate clearly and often about what you're trying to solve or take on. You can do this by commenting on the issues you intend to take on. This helps avoid duplicate work and ensures that your contribution is in line with the project's goals. Nobody likes to have their work rejected, so it's best to ask questions early and often!
-
-Join our [Discord](https://svelte.dev/chat) and ask questions in the dedicated `#hacktoberfest` channel. We're happy to help you get started!
-
-We're excited to see what you've got in store for SvelteKit! Happy hacking! 🎃
diff --git a/documentation/blog/2023-10-01-whats-new-in-svelte-october-2023.md b/documentation/blog/2023-10-01-whats-new-in-svelte-october-2023.md
deleted file mode 100644
index 6e9df4d1d3..0000000000
--- a/documentation/blog/2023-10-01-whats-new-in-svelte-october-2023.md
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: "What's new in Svelte: October 2023"
-description: 'Reactions to Runes and SvelteKit +server fallbacks'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Svelte 5 isn't out yet (you can, however, [preview it now](https://svelte-5-preview.vercel.app/)), but that doesn't mean we don't get a sneak peek! Most notably are [Runes](https://svelte.dev/blog/runes) - a simpler way to manage reactive variables in Svelte code. There's lots of links the showcase section for deeper dives on all things Runes, but let's talk about what else been released this month...
-
-## What's new in Svelte & Language Tools
-
-- [Svelte 4.2.1](https://github.com/sveltejs/svelte/blob/master/packages/svelte/CHANGELOG.md#421) was released with a bunch of fixes to HTML, CSS and sourcemap compilation
-- [The latest version of the Svelte language tools](https://github.com/sveltejs/language-tools/releases/tag/extensions-107.11.0) [enhances component references](https://github.com/sveltejs/language-tools/pull/2157) in the "Find All References" command, [fixes a persistent issue with automated types going missing](https://github.com/sveltejs/language-tools/pull/2160) after restarting a project and [adds fallback handling to auto-types](https://github.com/sveltejs/language-tools/issues/2156) (like those found in SvelteKit's `+server.js` files)
-
-## What's new in SvelteKit
-
-- `+server.js` now has a catch-all handler that handles all unimplemented valid server requests. Just export a `fallback` function! (**1.25.0**, [Docs](https://kit.svelte.dev/docs/routing#server-fallback-method-handler), [#9755](https://github.com/sveltejs/kit/pull/9755))
-
-That's all for the new features! If you're looking for other patches and performance updates, check out the [SvelteKit CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md). You can also find adapter-specific CHANGELOGs in each of [the `adapter` directories](https://github.com/sveltejs/kit/tree/master/packages).
-
----
-
-## Community Showcase
-
-[Svelte Summit Fall](https://www.sveltesummit.com/) is happening on Nov 11, 2023. The 7th Virtual Svelte Conference is [open for proposals until October 15](https://sessionize.com/svelte-summit-fall-2023/) - anyone can submit!
-
-Threlte [is throwing a hackathon](https://threlte.xyz/hackathon) (**motion warning for the landing page** - it will respect Reduce Motion settings). The kickoff event is on Sunday, 15 October 2023 16:00 UTC.
-
-**Apps & Sites built with Svelte**
-
-- [game-of-life-svelte](https://github.com/StephenGunn/game-of-life-svelte) is a Conway's Game of Life implementation using SvelteKit tech
-- [Limey](https://limey.io/) is an easy-to-use website builder for simple sites and landing pages
-- [Appwrite's new landing page](https://appwrite.io/) is now written with SvelteKit (previously covered was their [console UI](https://github.com/appwrite/console) in Svelte)
-- [PlaceIt](https://github.com/Dae314/placeit-game) is a game about numbers and places
-- [Sveltroid](https://sveltroid.vercel.app/) is a fan-made recreation of Metroid Prime: Remastered ([code](https://github.com/TylerTonyJohnson/Metroid))
-- [Bolighub](https://www.bolighub.dk/) is a Denmark housing search portal
-- [Dithering](https://www.sigrist.dev/dithering) is a tool to dither photos with plenty of options
-- [Rocky Mountain Slam](https://www.rockymountainslam.com/) is an interactive map to follow Jason Heyn as he attempts to complete the first ever Rocky Mountain Slam ([code](https://github.com/martyheyn/rocky-mnt-slam))
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Svelte 5: Introducing Runes... with Rich Harris](https://www.youtube.com/watch?v=RVnxF3j3N8U) and its follow-up: [Svelte 5 runes: what's the deal with getters and setters?](https://www.youtube.com/watch?v=NR8L5m73dtE)
-- [Conditionally stream data in SvelteKit](https://geoffrich.net/posts/conditionally-stream-data/) by Geoff Rich
-- [Svelte Runes Change How Reactivity Works In Svelte](https://www.youtube.com/watch?v=TOTUXiYZhf4), [Make A 3D GitHub Skyline With Svelte To Flex On Your Peers](https://www.youtube.com/watch?v=f9fd1L1FEts), [Simple Page Transitions Using The View Transitions API With SvelteKit](https://www.youtube.com/watch?v=q_2irZO4SS8) and [Using JavaScript Libraries With Svelte Is Easy](https://www.youtube.com/watch?v=N9OjaQ0XtKQ) by Joy of Code
-- [Modern Web Podcast S11E2](https://modernweb.podbean.com/e/modern-web-podcast-s11e2-exploring-svelte-open-source-and-discord-bots-with-willow-ghost/) - Exploring Svelte, Open Source, and Discord Bots with Willow (GHOST)
-- [We are back! Svelte 5, Transitions, What's New?!](https://www.svelteradio.com/episodes/we-are-back-svelte-5-transitions-whats-new) by Svelte Radio
-- This Week in Svelte:
-  - [2023 September 1](https://www.youtube.com/watch?v=fonBnVCIrjE) - SvelteKit 1.24.0, View Transitions API, AbortController
-  - [2023 September 8](https://www.youtube.com/watch?v=jfBjmczZwRc) - SvelteKit 1.24.1, Capacitor walkthrough, reusing prop types
-  - [2023 September 15](https://www.youtube.com/watch?v=qH2FavwhU88) - SvelteKit 1.25.0, deserialize form data, magic is coming
-  - [2023 September 22](https://www.youtube.com/watch?v=ek7KE1EDu2w) - Svelte 5 Runes!
-
-_To Watch_
-
-- [RUNES - Coming in Svelte v5 | My Take](https://www.youtube.com/watch?v=iCK1coch1wA) by Coding Garden
-- [Don't Sleep on Svelte 5](https://www.youtube.com/watch?v=DgNWssn2vpc) and [Level Up Your Svelte Stores](https://www.youtube.com/watch?v=-vjNAyL2JCQ) by Huntabyte
-- [Introduction To Svelte Runes (Every Svelte Rune Explained)](https://www.youtube.com/watch?v=gihSBVfyFbI) by Cooper Codes
-- [Svelte Runes: Awesome or Awful?](https://www.youtube.com/watch?v=JRZCqUOmFwY) by Jack Herrington
-- [Let Build A Youtube Clone With SvelteKit (Svelte, Tailwind Css, RapidApi, Shadcn Svelte, Axios, etc)](https://www.youtube.com/watch?v=65yMfpsoH4o) by Lawal Adebola
-
-_To Read_
-
-- [Create the Perfect Sharable Rune in Svelte](https://dev.to/jdgamble555/create-the-perfect-sharable-rune-in-svelte-ij8) by Jonathan Gamble
-- [You Don't Need to "Learn" Svelte](https://kaviisuri.com/you-dont-need-to-learn-svelte) by KaviiSuri
-- [Build Websites with Prismic and SvelteKit](https://prismic.io/blog/sveltekit-prismic-integration) by Angelo Ashmore
-- [How to embed Svelte apps inside PHP?](https://www.okupter.com/blog/php-embed-svelte) by Justin Ahinon
-- [Using Web Browser's Indexed DB in SvelteKit](https://dev.to/theether0/using-web-browsers-indexed-db-in-sveltekit-3oo3) by Shivam Meena
-- [Integrate Storybook in Svelte: Doing it the Svelte-way](https://mainmatter.com/blog/2023/09/18/integrate-storybook-in-svelte-doing-it-the-svelte-way/) by Oscar Dominguez
-- [The Sveltekit tutorial: Part 1 | What, why, and how?](https://tntman.tech/posts/sveltekit-guide-part-1) by Suyashtnt
-
-**Libraries, Tools & Components**
-
-- [KitForStartups](https://github.com/okupter/kitforstartups) is an Open Source SvelteKit SaaS boilerplate
-- [SuperNavigation](https://github.com/0xDjole/super-navigation) is a mobile-like navigation UX for the web
-- [skeleton-material-theme](https://github.com/plasmatech8/skeleton-material-theme) is a Material theme for the Skeleton UI library
-- [better-i18n-for-svelte](https://github.com/versiobit/better-i18n-for-svelte) is a SEO focused library for multi-language SvelteKit sites
-- [uico](https://github.com/rossrobino/uico) is a Tailwind plugin that provides utility classes for basic UI elements
-- [svelte-maskify](https://www.npmjs.com/package/svelte-maskify) is a action wrapper for AlpineJS masks
-- [sveltekit-capacitor](https://github.com/Hugos68/sveltekit-capacitor) is a template for building a SvelteKit SPA with Capacitor
-- [router-gen.ts](https://gist.github.com/HugeLetters/7a2813897dfe08fa948a13cac8a359c7) is a type-safe router for SvelteKit
-
-That's it for this month! Feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/blog/2023-11-01-whats-new-in-svelte-november-2023.md b/documentation/blog/2023-11-01-whats-new-in-svelte-november-2023.md
deleted file mode 100644
index 420030787a..0000000000
--- a/documentation/blog/2023-11-01-whats-new-in-svelte-november-2023.md
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: "What's new in Svelte: November 2023"
-description: 'Svelte Summit on Nov 11 and better DevEx for all!'
-author: Dani Sandoval
-authorURL: https://dreamindani.com
----
-
-Mark your calendars! [Svelte Summit Fall](https://www.sveltesummit.com/2023/fall) is on November 11th. Join us on [YouTube](https://www.youtube.com/@SvelteSociety/streams) and in the [Discord](https://svelte.dev/chat) for hours of Svelte-focused fun 🎥
-
-Every month, maintainers within the Svelte ecosystem fix bugs, improve performance and bring new features to Svelte, SvelteKit and the tooling around them. This month's releases brings an improved developer experience with better [block folding](https://code.visualstudio.com/docs/editor/codebasics#_folding), inferred types and configuration for `use:enhance`.
-
-Let's take a closer look 👀...
-
-## What's new in Svelte & Language Tools
-
-- Svelte 4.2.2 cleans up a few element-specific features ([Release Notes](https://github.com/sveltejs/svelte/blob/master/packages/svelte/CHANGELOG.md#422))
-- Extensions 107.12.0 improves block folding for functions, if statements and more ([Release Notes](https://github.com/sveltejs/language-tools/releases/tag/extensions-107.12.0), [PR](https://github.com/sveltejs/language-tools/pull/2169))
-
-## What's new in SvelteKit
-
-- Route parameter types will now be inferred from the applicable matcher's guard check (**kit@1.26.0**, [Docs](https://kit.svelte.dev/docs/advanced-routing#matching), [#10755](https://github.com/sveltejs/kit/pull/10755))
-- The new `invalidateAll` boolean option lets you turn on and off the `invalidateAll()` form function within the `enhance` callback (**kit@1.27.0**, [Docs](https://kit.svelte.dev/docs/form-actions#progressive-enhancement-use-enhance), [#9476](https://github.com/sveltejs/kit/issues/9476))
-- The output of the project creation wizard will now reflect which package manager you're using (**create-svelte@5.1.1**, [#10811](https://github.com/sveltejs/kit/pull/10811))
-
-For a complete list of bug fixes and performance updates, check out the [SvelteKit CHANGELOG](https://github.com/sveltejs/kit/blob/master/packages/kit/CHANGELOG.md). You can also find adapter-specific CHANGELOGs in each of [the `adapter` directories](https://github.com/sveltejs/kit/tree/master/packages).
-
----
-
-## Community Showcase
-
-**Apps & Sites built with Svelte**
-
-- [4THSEX](https://4thsex.com/) is a creative website for the producer / creative director with the same name
-- [Syntax.fm](https://github.com/syntaxfm/website) has been redesigned from the ground up with SvelteKit
-- [GitContext](https://gitcontext.com/) is an early-access tool to improve the process of reviewing code
-- [Lunier](https://www.lunier.fr/) is a site to browse and buy handbags (site is in French)
-- [Feldman Architecture](https://feldmanarchitecture.com/) is a portfolio set for the architects of the same name
-- [Formulator](https://formulator.app/) is a faster way to iterate, experiment, & build user interfaces
-- [Dwarf](https://www.dwarf.domains/) is a relaxed domain name marketplace for domain hoarders
-- [Teek](https://teek.vercel.app/) is a simple, free time tracker for developers with an hourly rate
-- [Sessionic](https://github.com/navorite/sessionic) is a web extension to easily save browser sessions and manage them
-- [Pilink](https://pil.ink/) is a "suckless" link shortener
-
-**Learning Resources**
-
-_Featuring Svelte Contributors and Ambassadors_
-
-- [Wolfensvelte 3D and the Svelte Language Server in the Browser with Jason Bradnick](https://www.svelteradio.com/episodes/wolfensvelte-3d-and-the-svelte-language-server-in-the-browser-with-jason-bradnick) by Svelte Radio
-- [This Is How You Sveltify Any JavaScript Library](https://www.youtube.com/watch?v=RuM4KHTZqD4), [Svelte Actions Make Svelte The Best JavaScript Framework](https://www.youtube.com/watch?v=LGOqg0Y7sAc) and [How Svelte Stores Make State Management Easy](https://www.youtube.com/watch?v=L3uBfL-4dDM) by Joy of Code
-- Svelte Society Talks
-  - [Svelte Society - San Diego October 2023](https://www.youtube.com/watch?v=9FZYJTr24ZI)
-  - [Daniils Petrovs - SvelteKit: From landing page to offline PWAs](https://www.youtube.com/watch?v=SaccqQ-JrZ4)
-  - [Lukas Stracke - State of Sentry for Svelte 2023](https://www.youtube.com/watch?v=V4Hup134wdA)
-- This Week in Svelte:
-  - [2023 September 29](https://www.youtube.com/watch?v=SduFW1onshg) - Svelte 4.2.1, SvelteKit 1.25.1, Runes FAQ, data mocking
-  - [2023 October 6](https://www.youtube.com/watch?v=CMXST0R6xRY) - Ordering attribs, client hints, async custom store with runes
-  - [2023 October 13](https://www.youtube.com/watch?v=Tp6ctouCX7A) - SvelteKit 1.25.2, How Melt UI works
-  - [2023 October 20](https://www.youtube.com/watch?v=O13bGtOV-aA) - Kit 1.26.0, Svelte 4.2.2, dynamically-loaded components
-
-_To Watch_
-
-- [SvelteKit & TailwindCSS Tutorial – Build & Deploy a Web Portfolio](https://www.youtube.com/watch?v=-2UjwQzxvBQ) by freeCodeCamp.org
-- [Why SvelteKit? [Intro to SvelteKit 1.0, part 1]](https://www.youtube.com/watch?v=FP4AylVsiT8) by Jeffrey Codes Javascript
-- [Build an AI Chatbot - it's that easy?!](https://www.youtube.com/watch?v=FcDj9_590Xg) by Simon Prammer
-- [Introduction to SvelteKit | FREE 5 HOUR SVELTE WORKSHOP 2023 | Lessons + Coding Exercises](https://www.youtube.com/watch?v=wWRhX_Hzyf8) by This Dot Media
-
-_To Read_
-
-- [What we learned from migrating our web app to SvelteKit](https://blog.datawrapper.de/migrating-our-web-app-to-sveltekit/) by Marten Sigwart
-- [SvelteKit Tutorial: Build a Website From Scratch](https://prismic.io/blog/svelte-sveltekit-tutorial) by Prismic has been updated based on the latest SvelteKit features
-- [Svelte by Example](https://sveltebyexample.com/) is a succinct, gentle introduction to Svelte & SvelteKit
-- [The Comprehensive Guide to Locals in SvelteKit](https://khromov.se/the-comprehensive-guide-to-locals-in-sveltekit/) by Stanislav Khromov
-- [How to build a blog, the hard way](https://cpf.sh/blog/2023/10/27/how-to-build-a-blog-the-hard-way) by Curtis Parfitt-Ford
-- [How to make a full-content RSS feed for your SvelteKit blog](https://www.kylenazario.com/blog/full-content-rss-feed-with-sveltekit) by Kyle Nazario
-- [A simple hash-routed dialog system with Svelte](https://inorganik.net/posts/2023-10-08-routed-svelte-dialogs) by Jamie Perkins
-- [When and Where to Render](https://blog.robino.dev/posts/rendering-strategies) and [One Less Reason to Build a Native App](https://blog.robino.dev/posts/install-web-app) by Ross Robino
-- [Open Neovim From Your Browser - Integrating nvim with Svelte’s Inspector](https://theosteiner.de/open-neovim-from-your-browser-integrating-nvim-with-sveltes-inspector) by Theo Steiner
-
-**Libraries, Tools & Components**
-
-- Work to [support SvelteKit in Deno](https://github.com/denoland/deno/issues/17248) is ongoing and [Deno now supports](https://github.com/denoland/deno/pull/21026) creating SvelteKit projects out-of-the-box!
-- [Purplix](https://github.com/WardPearce/Purplix.io) is an open-source collection of tools dedicated to user privacy and creating trust with your audience
-- [Obra Icons](https://github.com/Obra-Studio/obra-icons-svelte-public) is a simple, consistent set of icons, perfect for user interfaces
-- [svelte-chat-langchain](https://github.com/SimonPrammer/svelte-chat-langchain) is a minimal version of "Chat LangChain" implemented with SvelteKit, Vercel AI SDK and of course Langchain
-- [Cloudinary just released](https://svelte.cloudinary.dev/) an official Svelte SDK ([GitHub](https://github.com/cloudinary-community/svelte-cloudinary))
-
-That's it for this month! Feel free to let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
-
-Until next time 👋
diff --git a/documentation/examples/00-introduction/00-hello-world/App.svelte b/documentation/examples/00-introduction/00-hello-world/App.svelte
deleted file mode 100644
index aa19c0abc4..0000000000
--- a/documentation/examples/00-introduction/00-hello-world/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let name = 'world';
-</script>
-
-<h1>Hello {name}!</h1>
diff --git a/documentation/examples/00-introduction/00-hello-world/meta.json b/documentation/examples/00-introduction/00-hello-world/meta.json
deleted file mode 100644
index 86590ebcc6..0000000000
--- a/documentation/examples/00-introduction/00-hello-world/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Hello world"
-}
diff --git a/documentation/examples/00-introduction/01-dynamic-attributes/App.svelte b/documentation/examples/00-introduction/01-dynamic-attributes/App.svelte
deleted file mode 100644
index 18259f27b0..0000000000
--- a/documentation/examples/00-introduction/01-dynamic-attributes/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	let src = '/tutorial/image.gif';
-	let name = 'Rick Astley';
-</script>
-
-<!-- {src} is short for src={src} -->
-<img {src} alt="{name} dancing" />
diff --git a/documentation/examples/00-introduction/01-dynamic-attributes/meta.json b/documentation/examples/00-introduction/01-dynamic-attributes/meta.json
deleted file mode 100644
index 735b441544..0000000000
--- a/documentation/examples/00-introduction/01-dynamic-attributes/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Dynamic attributes"
-}
diff --git a/documentation/examples/00-introduction/02-styling/App.svelte b/documentation/examples/00-introduction/02-styling/App.svelte
deleted file mode 100644
index 5266147df3..0000000000
--- a/documentation/examples/00-introduction/02-styling/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<p>Styled!</p>
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
diff --git a/documentation/examples/00-introduction/02-styling/meta.json b/documentation/examples/00-introduction/02-styling/meta.json
deleted file mode 100644
index ab28e2c52f..0000000000
--- a/documentation/examples/00-introduction/02-styling/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Styling"
-}
diff --git a/documentation/examples/00-introduction/03-nested-components/App.svelte b/documentation/examples/00-introduction/03-nested-components/App.svelte
deleted file mode 100644
index 86f7f3a773..0000000000
--- a/documentation/examples/00-introduction/03-nested-components/App.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<p>These styles...</p>
-<Nested />
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
diff --git a/documentation/examples/00-introduction/03-nested-components/Nested.svelte b/documentation/examples/00-introduction/03-nested-components/Nested.svelte
deleted file mode 100644
index de5d97fa86..0000000000
--- a/documentation/examples/00-introduction/03-nested-components/Nested.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<p>...don't affect this element</p>
diff --git a/documentation/examples/00-introduction/03-nested-components/meta.json b/documentation/examples/00-introduction/03-nested-components/meta.json
deleted file mode 100644
index 5e383a49bd..0000000000
--- a/documentation/examples/00-introduction/03-nested-components/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Nested components"
-}
diff --git a/documentation/examples/00-introduction/04-html-tags/App.svelte b/documentation/examples/00-introduction/04-html-tags/App.svelte
deleted file mode 100644
index ebc5ade2bb..0000000000
--- a/documentation/examples/00-introduction/04-html-tags/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let string = `here's some <strong>HTML!!!</strong>`;
-</script>
-
-<p>{@html string}</p>
diff --git a/documentation/examples/00-introduction/04-html-tags/meta.json b/documentation/examples/00-introduction/04-html-tags/meta.json
deleted file mode 100644
index 04968c43aa..0000000000
--- a/documentation/examples/00-introduction/04-html-tags/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "HTML tags"
-}
diff --git a/documentation/examples/00-introduction/meta.json b/documentation/examples/00-introduction/meta.json
deleted file mode 100644
index fd70acd694..0000000000
--- a/documentation/examples/00-introduction/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Introduction"
-}
diff --git a/documentation/examples/01-reactivity/00-reactive-assignments/App.svelte b/documentation/examples/01-reactivity/00-reactive-assignments/App.svelte
deleted file mode 100644
index 6d78f949e1..0000000000
--- a/documentation/examples/01-reactivity/00-reactive-assignments/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	let count = 0;
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
diff --git a/documentation/examples/01-reactivity/00-reactive-assignments/meta.json b/documentation/examples/01-reactivity/00-reactive-assignments/meta.json
deleted file mode 100644
index b863d19abd..0000000000
--- a/documentation/examples/01-reactivity/00-reactive-assignments/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Reactive assignments"
-}
diff --git a/documentation/examples/01-reactivity/01-reactive-declarations/App.svelte b/documentation/examples/01-reactivity/01-reactive-declarations/App.svelte
deleted file mode 100644
index 7d2eafba9f..0000000000
--- a/documentation/examples/01-reactivity/01-reactive-declarations/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let count = 1;
-
-	// the `$:` means 're-run whenever these values change'
-	$: doubled = count * 2;
-	$: quadrupled = doubled * 2;
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Count: {count}
-</button>
-
-<p>{count} * 2 = {doubled}</p>
-<p>{doubled} * 2 = {quadrupled}</p>
diff --git a/documentation/examples/01-reactivity/01-reactive-declarations/meta.json b/documentation/examples/01-reactivity/01-reactive-declarations/meta.json
deleted file mode 100644
index cddf2d9562..0000000000
--- a/documentation/examples/01-reactivity/01-reactive-declarations/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Reactive declarations"
-}
diff --git a/documentation/examples/01-reactivity/02-reactive-statements/App.svelte b/documentation/examples/01-reactivity/02-reactive-statements/App.svelte
deleted file mode 100644
index 99590c87d7..0000000000
--- a/documentation/examples/01-reactivity/02-reactive-statements/App.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script>
-	let count = 0;
-
-	$: if (count >= 10) {
-		alert(`count is dangerously high!`);
-		count = 9;
-	}
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
diff --git a/documentation/examples/01-reactivity/02-reactive-statements/meta.json b/documentation/examples/01-reactivity/02-reactive-statements/meta.json
deleted file mode 100644
index e74b0b575a..0000000000
--- a/documentation/examples/01-reactivity/02-reactive-statements/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Reactive statements"
-}
diff --git a/documentation/examples/01-reactivity/meta.json b/documentation/examples/01-reactivity/meta.json
deleted file mode 100644
index fe8d63b26d..0000000000
--- a/documentation/examples/01-reactivity/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Reactivity"
-}
diff --git a/documentation/examples/02-props/00-declaring-props/App.svelte b/documentation/examples/02-props/00-declaring-props/App.svelte
deleted file mode 100644
index f64b69a87c..0000000000
--- a/documentation/examples/02-props/00-declaring-props/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
diff --git a/documentation/examples/02-props/00-declaring-props/Nested.svelte b/documentation/examples/02-props/00-declaring-props/Nested.svelte
deleted file mode 100644
index 7267c0edea..0000000000
--- a/documentation/examples/02-props/00-declaring-props/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	export let answer;
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/examples/02-props/00-declaring-props/meta.json b/documentation/examples/02-props/00-declaring-props/meta.json
deleted file mode 100644
index 420af805c4..0000000000
--- a/documentation/examples/02-props/00-declaring-props/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Declaring props"
-}
diff --git a/documentation/examples/02-props/01-default-values/App.svelte b/documentation/examples/02-props/01-default-values/App.svelte
deleted file mode 100644
index 27e880eb5c..0000000000
--- a/documentation/examples/02-props/01-default-values/App.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
-<Nested />
diff --git a/documentation/examples/02-props/01-default-values/Nested.svelte b/documentation/examples/02-props/01-default-values/Nested.svelte
deleted file mode 100644
index 3efe9ccb75..0000000000
--- a/documentation/examples/02-props/01-default-values/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	export let answer = 'a mystery';
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/examples/02-props/01-default-values/meta.json b/documentation/examples/02-props/01-default-values/meta.json
deleted file mode 100644
index 319a7fdbea..0000000000
--- a/documentation/examples/02-props/01-default-values/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Default values"
-}
diff --git a/documentation/examples/02-props/02-spread-props/App.svelte b/documentation/examples/02-props/02-spread-props/App.svelte
deleted file mode 100644
index d2f97713d1..0000000000
--- a/documentation/examples/02-props/02-spread-props/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import Info from './Info.svelte';
-
-	const pkg = {
-		name: 'svelte',
-		version: 3,
-		speed: 'blazing',
-		website: 'https://svelte.dev'
-	};
-</script>
-
-<Info {...pkg} />
diff --git a/documentation/examples/02-props/02-spread-props/Info.svelte b/documentation/examples/02-props/02-spread-props/Info.svelte
deleted file mode 100644
index 241b84a9af..0000000000
--- a/documentation/examples/02-props/02-spread-props/Info.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	export let name;
-	export let version;
-	export let speed;
-	export let website;
-</script>
-
-<p>
-	The <code>{name}</code> package is {speed} fast. Download version {version} from
-	<a href="https://www.npmjs.com/package/{name}">npm</a>
-	and <a href={website}>learn more here</a>
-</p>
diff --git a/documentation/examples/02-props/02-spread-props/meta.json b/documentation/examples/02-props/02-spread-props/meta.json
deleted file mode 100644
index d2185f97c1..0000000000
--- a/documentation/examples/02-props/02-spread-props/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Spread props"
-}
diff --git a/documentation/examples/02-props/meta.json b/documentation/examples/02-props/meta.json
deleted file mode 100644
index d03965c7cb..0000000000
--- a/documentation/examples/02-props/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Props"
-}
diff --git a/documentation/examples/03-logic/00-if-blocks/App.svelte b/documentation/examples/03-logic/00-if-blocks/App.svelte
deleted file mode 100644
index d986710847..0000000000
--- a/documentation/examples/03-logic/00-if-blocks/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{/if}
-
-{#if !user.loggedIn}
-	<button on:click={toggle}> Log in </button>
-{/if}
diff --git a/documentation/examples/03-logic/00-if-blocks/meta.json b/documentation/examples/03-logic/00-if-blocks/meta.json
deleted file mode 100644
index 9ea2f5724d..0000000000
--- a/documentation/examples/03-logic/00-if-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "If blocks"
-}
diff --git a/documentation/examples/03-logic/01-else-blocks/App.svelte b/documentation/examples/03-logic/01-else-blocks/App.svelte
deleted file mode 100644
index 146e54bcc0..0000000000
--- a/documentation/examples/03-logic/01-else-blocks/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{:else}
-	<button on:click={toggle}> Log in </button>
-{/if}
diff --git a/documentation/examples/03-logic/01-else-blocks/meta.json b/documentation/examples/03-logic/01-else-blocks/meta.json
deleted file mode 100644
index 46f18e058c..0000000000
--- a/documentation/examples/03-logic/01-else-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Else blocks"
-}
diff --git a/documentation/examples/03-logic/02-else-if-blocks/App.svelte b/documentation/examples/03-logic/02-else-if-blocks/App.svelte
deleted file mode 100644
index 2b740dbf9b..0000000000
--- a/documentation/examples/03-logic/02-else-if-blocks/App.svelte
+++ /dev/null
@@ -1,11 +0,0 @@
-<script>
-	let x = 7;
-</script>
-
-{#if x > 10}
-	<p>{x} is greater than 10</p>
-{:else if 5 > x}
-	<p>{x} is less than 5</p>
-{:else}
-	<p>{x} is between 5 and 10</p>
-{/if}
diff --git a/documentation/examples/03-logic/02-else-if-blocks/meta.json b/documentation/examples/03-logic/02-else-if-blocks/meta.json
deleted file mode 100644
index aa22db3f01..0000000000
--- a/documentation/examples/03-logic/02-else-if-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Else-if blocks"
-}
diff --git a/documentation/examples/03-logic/03-each-blocks/App.svelte b/documentation/examples/03-logic/03-each-blocks/App.svelte
deleted file mode 100644
index 7d08b79ab8..0000000000
--- a/documentation/examples/03-logic/03-each-blocks/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let cats = [
-		{ id: 'J---aiyznGQ', name: 'Keyboard Cat' },
-		{ id: 'z_AbfPXTKms', name: 'Maru' },
-		{ id: 'OUtn3pvWmpg', name: 'Henri The Existential Cat' }
-	];
-</script>
-
-<h1>The Famous Cats of YouTube</h1>
-
-<ul>
-	{#each cats as { id, name }, i}
-		<li>
-			<a target="_blank" rel="noreferrer" href="https://www.youtube.com/watch?v={id}">
-				{i + 1}: {name}
-			</a>
-		</li>
-	{/each}
-</ul>
diff --git a/documentation/examples/03-logic/03-each-blocks/meta.json b/documentation/examples/03-logic/03-each-blocks/meta.json
deleted file mode 100644
index d92f84ef89..0000000000
--- a/documentation/examples/03-logic/03-each-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Each blocks"
-}
diff --git a/documentation/examples/03-logic/04-keyed-each-blocks/App.svelte b/documentation/examples/03-logic/04-keyed-each-blocks/App.svelte
deleted file mode 100644
index 4f26f709e2..0000000000
--- a/documentation/examples/03-logic/04-keyed-each-blocks/App.svelte
+++ /dev/null
@@ -1,33 +0,0 @@
-<script>
-	import Thing from './Thing.svelte';
-
-	let things = [
-		{ id: 1, color: 'darkblue' },
-		{ id: 2, color: 'indigo' },
-		{ id: 3, color: 'deeppink' },
-		{ id: 4, color: 'salmon' },
-		{ id: 5, color: 'gold' }
-	];
-
-	function handleClick() {
-		things = things.slice(1);
-	}
-</script>
-
-<button on:click={handleClick}> Remove first thing </button>
-
-<div style="display: grid; grid-template-columns: 1fr 1fr; grid-gap: 1em">
-	<div>
-		<h2>Keyed</h2>
-		{#each things as thing (thing.id)}
-			<Thing current={thing.color} />
-		{/each}
-	</div>
-
-	<div>
-		<h2>Unkeyed</h2>
-		{#each things as thing}
-			<Thing current={thing.color} />
-		{/each}
-	</div>
-</div>
diff --git a/documentation/examples/03-logic/04-keyed-each-blocks/Thing.svelte b/documentation/examples/03-logic/04-keyed-each-blocks/Thing.svelte
deleted file mode 100644
index 7d069ea7e4..0000000000
--- a/documentation/examples/03-logic/04-keyed-each-blocks/Thing.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script>
-	// `current` is updated whenever the prop value changes...
-	export let current;
-
-	// ...but `initial` is fixed upon initialisation
-	const initial = current;
-</script>
-
-<p>
-	<span style="background-color: {initial}">initial</span>
-	<span style="background-color: {current}">current</span>
-</p>
-
-<style>
-	span {
-		display: inline-block;
-		padding: 0.2em 0.5em;
-		margin: 0 0.2em 0.2em 0;
-		width: 4em;
-		text-align: center;
-		border-radius: 0.2em;
-		color: white;
-	}
-</style>
diff --git a/documentation/examples/03-logic/04-keyed-each-blocks/meta.json b/documentation/examples/03-logic/04-keyed-each-blocks/meta.json
deleted file mode 100644
index fa182ae360..0000000000
--- a/documentation/examples/03-logic/04-keyed-each-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Keyed each blocks"
-}
diff --git a/documentation/examples/03-logic/05-await-blocks/App.svelte b/documentation/examples/03-logic/05-await-blocks/App.svelte
deleted file mode 100644
index fa1e4fe9cb..0000000000
--- a/documentation/examples/03-logic/05-await-blocks/App.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	let promise = getRandomNumber();
-
-	async function getRandomNumber() {
-		const res = await fetch(`/tutorial/random-number`);
-		const text = await res.text();
-
-		if (res.ok) {
-			return text;
-		} else {
-			throw new Error(text);
-		}
-	}
-
-	function handleClick() {
-		promise = getRandomNumber();
-	}
-</script>
-
-<button on:click={handleClick}> generate random number </button>
-
-{#await promise}
-	<p>...waiting</p>
-{:then number}
-	<p>The number is {number}</p>
-{:catch error}
-	<p style="color: red">{error.message}</p>
-{/await}
diff --git a/documentation/examples/03-logic/05-await-blocks/meta.json b/documentation/examples/03-logic/05-await-blocks/meta.json
deleted file mode 100644
index 6ed00514ed..0000000000
--- a/documentation/examples/03-logic/05-await-blocks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Await blocks"
-}
diff --git a/documentation/examples/03-logic/meta.json b/documentation/examples/03-logic/meta.json
deleted file mode 100644
index 22e69b0c83..0000000000
--- a/documentation/examples/03-logic/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Logic"
-}
diff --git a/documentation/examples/04-events/00-dom-events/App.svelte b/documentation/examples/04-events/00-dom-events/App.svelte
deleted file mode 100644
index 2f6eac115c..0000000000
--- a/documentation/examples/04-events/00-dom-events/App.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-
-	function handleMousemove(event) {
-		m.x = event.clientX;
-		m.y = event.clientY;
-	}
-</script>
-
-<!-- svelte-ignore a11y-no-static-element-interactions -->
-<div on:mousemove={handleMousemove}>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/examples/04-events/00-dom-events/meta.json b/documentation/examples/04-events/00-dom-events/meta.json
deleted file mode 100644
index f23a9c21d5..0000000000
--- a/documentation/examples/04-events/00-dom-events/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "DOM events"
-}
diff --git a/documentation/examples/04-events/01-inline-handlers/App.svelte b/documentation/examples/04-events/01-inline-handlers/App.svelte
deleted file mode 100644
index 4827241f30..0000000000
--- a/documentation/examples/04-events/01-inline-handlers/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-</script>
-
-<!-- svelte-ignore a11y-no-static-element-interactions -->
-<div on:mousemove={(e) => (m = { x: e.clientX, y: e.clientY })}>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/examples/04-events/01-inline-handlers/meta.json b/documentation/examples/04-events/01-inline-handlers/meta.json
deleted file mode 100644
index 5cbdbf4cb4..0000000000
--- a/documentation/examples/04-events/01-inline-handlers/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Inline handlers"
-}
diff --git a/documentation/examples/04-events/02-event-modifiers/App.svelte b/documentation/examples/04-events/02-event-modifiers/App.svelte
deleted file mode 100644
index c22168901f..0000000000
--- a/documentation/examples/04-events/02-event-modifiers/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	function handleClick() {
-		alert('no more alerts');
-	}
-</script>
-
-<button on:click|once={handleClick}> Click me </button>
diff --git a/documentation/examples/04-events/02-event-modifiers/meta.json b/documentation/examples/04-events/02-event-modifiers/meta.json
deleted file mode 100644
index ae16092f1f..0000000000
--- a/documentation/examples/04-events/02-event-modifiers/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Event modifiers"
-}
diff --git a/documentation/examples/04-events/03-component-events/App.svelte b/documentation/examples/04-events/03-component-events/App.svelte
deleted file mode 100644
index 3600b45efd..0000000000
--- a/documentation/examples/04-events/03-component-events/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Inner on:message={handleMessage} />
diff --git a/documentation/examples/04-events/03-component-events/Inner.svelte b/documentation/examples/04-events/03-component-events/Inner.svelte
deleted file mode 100644
index c2e85b4c97..0000000000
--- a/documentation/examples/04-events/03-component-events/Inner.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/examples/04-events/03-component-events/meta.json b/documentation/examples/04-events/03-component-events/meta.json
deleted file mode 100644
index 0565d335e8..0000000000
--- a/documentation/examples/04-events/03-component-events/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Component events"
-}
diff --git a/documentation/examples/04-events/04-event-forwarding/App.svelte b/documentation/examples/04-events/04-event-forwarding/App.svelte
deleted file mode 100644
index 2e8e743f4e..0000000000
--- a/documentation/examples/04-events/04-event-forwarding/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Outer from './Outer.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Outer on:message={handleMessage} />
diff --git a/documentation/examples/04-events/04-event-forwarding/Inner.svelte b/documentation/examples/04-events/04-event-forwarding/Inner.svelte
deleted file mode 100644
index c2e85b4c97..0000000000
--- a/documentation/examples/04-events/04-event-forwarding/Inner.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/examples/04-events/04-event-forwarding/Outer.svelte b/documentation/examples/04-events/04-event-forwarding/Outer.svelte
deleted file mode 100644
index 62a5d1d852..0000000000
--- a/documentation/examples/04-events/04-event-forwarding/Outer.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-</script>
-
-<Inner on:message />
diff --git a/documentation/examples/04-events/04-event-forwarding/meta.json b/documentation/examples/04-events/04-event-forwarding/meta.json
deleted file mode 100644
index 5506471c94..0000000000
--- a/documentation/examples/04-events/04-event-forwarding/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Event forwarding"
-}
diff --git a/documentation/examples/04-events/05-dom-event-forwarding/App.svelte b/documentation/examples/04-events/05-dom-event-forwarding/App.svelte
deleted file mode 100644
index 4e5764a310..0000000000
--- a/documentation/examples/04-events/05-dom-event-forwarding/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import CustomButton from './CustomButton.svelte';
-
-	function handleClick() {
-		alert('clicked');
-	}
-</script>
-
-<CustomButton on:click={handleClick} />
diff --git a/documentation/examples/04-events/05-dom-event-forwarding/CustomButton.svelte b/documentation/examples/04-events/05-dom-event-forwarding/CustomButton.svelte
deleted file mode 100644
index 1f90fac103..0000000000
--- a/documentation/examples/04-events/05-dom-event-forwarding/CustomButton.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<button on:click> Click me </button>
-
-<style>
-	button {
-		height: 4rem;
-		width: 8rem;
-		background-color: #aaa;
-		border-color: #f1c40f;
-		color: #f1c40f;
-		font-size: 1.25rem;
-		background-image: linear-gradient(45deg, #f1c40f 50%, transparent 50%);
-		background-position: 100%;
-		background-size: 400%;
-		transition: background 300ms ease-in-out;
-	}
-	button:hover {
-		background-position: 0;
-		color: #aaa;
-	}
-</style>
diff --git a/documentation/examples/04-events/05-dom-event-forwarding/meta.json b/documentation/examples/04-events/05-dom-event-forwarding/meta.json
deleted file mode 100644
index c2fdf2ddcf..0000000000
--- a/documentation/examples/04-events/05-dom-event-forwarding/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "DOM event forwarding"
-}
diff --git a/documentation/examples/04-events/meta.json b/documentation/examples/04-events/meta.json
deleted file mode 100644
index 42460e989b..0000000000
--- a/documentation/examples/04-events/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Events"
-}
diff --git a/documentation/examples/05-bindings/00-text-inputs/App.svelte b/documentation/examples/05-bindings/00-text-inputs/App.svelte
deleted file mode 100644
index 9ec139df21..0000000000
--- a/documentation/examples/05-bindings/00-text-inputs/App.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-	let name = '';
-</script>
-
-<input bind:value={name} placeholder="enter your name" />
-<p>Hello {name || 'stranger'}!</p>
diff --git a/documentation/examples/05-bindings/00-text-inputs/meta.json b/documentation/examples/05-bindings/00-text-inputs/meta.json
deleted file mode 100644
index ac90cb18c0..0000000000
--- a/documentation/examples/05-bindings/00-text-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Text inputs"
-}
diff --git a/documentation/examples/05-bindings/01-numeric-inputs/App.svelte b/documentation/examples/05-bindings/01-numeric-inputs/App.svelte
deleted file mode 100644
index 15ef23c466..0000000000
--- a/documentation/examples/05-bindings/01-numeric-inputs/App.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	let a = 1;
-	let b = 2;
-</script>
-
-<label>
-	<input type="number" bind:value={a} min="0" max="10" />
-	<input type="range" bind:value={a} min="0" max="10" />
-</label>
-
-<label>
-	<input type="number" bind:value={b} min="0" max="10" />
-	<input type="range" bind:value={b} min="0" max="10" />
-</label>
-
-<p>{a} + {b} = {a + b}</p>
diff --git a/documentation/examples/05-bindings/01-numeric-inputs/meta.json b/documentation/examples/05-bindings/01-numeric-inputs/meta.json
deleted file mode 100644
index a7218c38cd..0000000000
--- a/documentation/examples/05-bindings/01-numeric-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Numeric inputs"
-}
diff --git a/documentation/examples/05-bindings/02-checkbox-inputs/App.svelte b/documentation/examples/05-bindings/02-checkbox-inputs/App.svelte
deleted file mode 100644
index b337359317..0000000000
--- a/documentation/examples/05-bindings/02-checkbox-inputs/App.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	let yes = false;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={yes} />
-	Yes! Send me regular email spam
-</label>
-
-{#if yes}
-	<p>Thank you. We will bombard your inbox and sell your personal details.</p>
-{:else}
-	<p>You must opt-in to continue. If you're not paying, you're the product.</p>
-{/if}
-
-<button disabled={!yes}> Subscribe </button>
diff --git a/documentation/examples/05-bindings/02-checkbox-inputs/meta.json b/documentation/examples/05-bindings/02-checkbox-inputs/meta.json
deleted file mode 100644
index 262b0f00e5..0000000000
--- a/documentation/examples/05-bindings/02-checkbox-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Checkbox inputs"
-}
diff --git a/documentation/examples/05-bindings/03-group-inputs/App.svelte b/documentation/examples/05-bindings/03-group-inputs/App.svelte
deleted file mode 100644
index 0ab215d519..0000000000
--- a/documentation/examples/05-bindings/03-group-inputs/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" bind:group={scoops} value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-{#each menu as flavour}
-	<label>
-		<input type="checkbox" bind:group={flavours} value={flavour} />
-		{flavour}
-	</label>
-{/each}
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/examples/05-bindings/03-group-inputs/meta.json b/documentation/examples/05-bindings/03-group-inputs/meta.json
deleted file mode 100644
index 9c7517686d..0000000000
--- a/documentation/examples/05-bindings/03-group-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Group inputs"
-}
diff --git a/documentation/examples/05-bindings/04-textarea-inputs/App.svelte b/documentation/examples/05-bindings/04-textarea-inputs/App.svelte
deleted file mode 100644
index ecb809095d..0000000000
--- a/documentation/examples/05-bindings/04-textarea-inputs/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { marked } from 'marked';
-	let text = `Some words are *italic*, some are **bold**`;
-</script>
-
-<textarea bind:value={text} />
-
-{@html marked(text)}
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/04-textarea-inputs/meta.json b/documentation/examples/05-bindings/04-textarea-inputs/meta.json
deleted file mode 100644
index 3e7963efcd..0000000000
--- a/documentation/examples/05-bindings/04-textarea-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Textarea inputs"
-}
diff --git a/documentation/examples/05-bindings/05-file-inputs/App.svelte b/documentation/examples/05-bindings/05-file-inputs/App.svelte
deleted file mode 100644
index fdf478e1bb..0000000000
--- a/documentation/examples/05-bindings/05-file-inputs/App.svelte
+++ /dev/null
@@ -1,26 +0,0 @@
-<script>
-	let files;
-
-	$: if (files) {
-		// Note that `files` is of type `FileList`, not an Array:
-		// https://developer.mozilla.org/en-US/docs/Web/API/FileList
-		console.log(files);
-
-		for (const file of files) {
-			console.log(`${file.name}: ${file.size} bytes`);
-		}
-	}
-</script>
-
-<label for="avatar">Upload a picture:</label>
-<input accept="image/png, image/jpeg" bind:files id="avatar" name="avatar" type="file" />
-
-<label for="many">Upload multiple files of any type:</label>
-<input bind:files id="many" multiple type="file" />
-
-{#if files}
-	<h2>Selected files:</h2>
-	{#each Array.from(files) as file}
-		<p>{file.name} ({file.size} bytes)</p>
-	{/each}
-{/if}
diff --git a/documentation/examples/05-bindings/05-file-inputs/meta.json b/documentation/examples/05-bindings/05-file-inputs/meta.json
deleted file mode 100644
index 92d0587e87..0000000000
--- a/documentation/examples/05-bindings/05-file-inputs/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "File inputs"
-}
diff --git a/documentation/examples/05-bindings/06-select-bindings/App.svelte b/documentation/examples/05-bindings/06-select-bindings/App.svelte
deleted file mode 100644
index 7785258fe2..0000000000
--- a/documentation/examples/05-bindings/06-select-bindings/App.svelte
+++ /dev/null
@@ -1,41 +0,0 @@
-<script>
-	let questions = [
-		{ id: 1, text: `Where did you go to school?` },
-		{ id: 2, text: `What is your mother's name?` },
-		{ id: 3, text: `What is another personal fact that an attacker could easily find with Google?` }
-	];
-
-	let selected;
-
-	let answer = '';
-
-	function handleSubmit() {
-		alert(`answered question ${selected.id} (${selected.text}) with "${answer}"`);
-	}
-</script>
-
-<h2>Insecurity questions</h2>
-
-<form on:submit|preventDefault={handleSubmit}>
-	<select bind:value={selected} on:change={() => (answer = '')}>
-		{#each questions as question}
-			<option value={question}>
-				{question.text}
-			</option>
-		{/each}
-	</select>
-
-	<input bind:value={answer} />
-
-	<button disabled={!answer} type="submit"> Submit </button>
-</form>
-
-<p>selected question {selected ? selected.id : '[waiting...]'}</p>
-
-<style>
-	input {
-		display: block;
-		width: 500px;
-		max-width: 100%;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/06-select-bindings/meta.json b/documentation/examples/05-bindings/06-select-bindings/meta.json
deleted file mode 100644
index 0e5fdbafd3..0000000000
--- a/documentation/examples/05-bindings/06-select-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Select bindings"
-}
diff --git a/documentation/examples/05-bindings/07-multiple-select-bindings/App.svelte b/documentation/examples/05-bindings/07-multiple-select-bindings/App.svelte
deleted file mode 100644
index 2fd19c28ad..0000000000
--- a/documentation/examples/05-bindings/07-multiple-select-bindings/App.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" bind:group={scoops} value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-<select multiple bind:value={flavours}>
-	{#each menu as flavour}
-		<option value={flavour}>
-			{flavour}
-		</option>
-	{/each}
-</select>
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/examples/05-bindings/07-multiple-select-bindings/meta.json b/documentation/examples/05-bindings/07-multiple-select-bindings/meta.json
deleted file mode 100644
index 11b6cafd83..0000000000
--- a/documentation/examples/05-bindings/07-multiple-select-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Select multiple"
-}
diff --git a/documentation/examples/05-bindings/08-each-block-bindings/App.svelte b/documentation/examples/05-bindings/08-each-block-bindings/App.svelte
deleted file mode 100644
index a8118093d3..0000000000
--- a/documentation/examples/05-bindings/08-each-block-bindings/App.svelte
+++ /dev/null
@@ -1,33 +0,0 @@
-<script>
-	let todos = [
-		{ done: false, text: 'finish Svelte tutorial' },
-		{ done: false, text: 'build an app' },
-		{ done: false, text: 'world domination' }
-	];
-
-	function add() {
-		todos = todos.concat({ done: false, text: '' });
-	}
-
-	function clear() {
-		todos = todos.filter((t) => !t.done);
-	}
-
-	$: remaining = todos.filter((t) => !t.done).length;
-</script>
-
-<h1>Todos</h1>
-
-{#each todos as todo}
-	<div>
-		<input type="checkbox" bind:checked={todo.done} />
-
-		<input placeholder="What needs to be done?" bind:value={todo.text} disabled={todo.done} />
-	</div>
-{/each}
-
-<p>{remaining} remaining</p>
-
-<button on:click={add}> Add new </button>
-
-<button on:click={clear}> Clear completed </button>
diff --git a/documentation/examples/05-bindings/08-each-block-bindings/meta.json b/documentation/examples/05-bindings/08-each-block-bindings/meta.json
deleted file mode 100644
index bb4e1e1e88..0000000000
--- a/documentation/examples/05-bindings/08-each-block-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Each block bindings"
-}
diff --git a/documentation/examples/05-bindings/09-media-elements/App.svelte b/documentation/examples/05-bindings/09-media-elements/App.svelte
deleted file mode 100644
index 836804f8bc..0000000000
--- a/documentation/examples/05-bindings/09-media-elements/App.svelte
+++ /dev/null
@@ -1,134 +0,0 @@
-<script>
-	// These values are bound to properties of the video
-	let time = 0;
-	let duration;
-	let paused = true;
-
-	let showControls = true;
-	let showControlsTimeout;
-
-	// Used to track time of last mouse down event
-	let lastMouseDown;
-
-	function handleMove(e) {
-		// Make the controls visible, but fade out after
-		// 2.5 seconds of inactivity
-		clearTimeout(showControlsTimeout);
-		showControlsTimeout = setTimeout(() => (showControls = false), 2500);
-		showControls = true;
-
-		if (!duration) return; // video not loaded yet
-		if (e.type !== 'touchmove' && !(e.buttons & 1)) return; // mouse not down
-
-		const clientX = e.type === 'touchmove' ? e.touches[0].clientX : e.clientX;
-		const { left, right } = this.getBoundingClientRect();
-		time = (duration * (clientX - left)) / (right - left);
-	}
-
-	// we can't rely on the built-in click event, because it fires
-	// after a drag — we have to listen for clicks ourselves
-	function handleMousedown(e) {
-		lastMouseDown = new Date();
-	}
-
-	function handleMouseup(e) {
-		if (new Date() - lastMouseDown < 300) {
-			if (paused) e.target.play();
-			else e.target.pause();
-		}
-	}
-
-	function format(seconds) {
-		if (isNaN(seconds)) return '...';
-
-		const minutes = Math.floor(seconds / 60);
-		seconds = Math.floor(seconds % 60);
-		if (seconds < 10) seconds = '0' + seconds;
-
-		return `${minutes}:${seconds}`;
-	}
-</script>
-
-<h1>Caminandes: Llamigos</h1>
-<p>From <a href="https://studio.blender.org/films">Blender Studio</a>. CC-BY</p>
-
-<div>
-	<video
-		poster="https://sveltejs.github.io/assets/caminandes-llamigos.jpg"
-		src="https://sveltejs.github.io/assets/caminandes-llamigos.mp4"
-		on:mousemove={handleMove}
-		on:touchmove|preventDefault={handleMove}
-		on:mousedown={handleMousedown}
-		on:mouseup={handleMouseup}
-		bind:currentTime={time}
-		bind:duration
-		bind:paused
-	>
-		<track kind="captions" />
-	</video>
-
-	<div class="controls" style="opacity: {duration && showControls ? 1 : 0}">
-		<progress value={time / duration || 0} />
-
-		<div class="info">
-			<span class="time">{format(time)}</span>
-			<span>click anywhere to {paused ? 'play' : 'pause'} / drag to seek</span>
-			<span class="time">{format(duration)}</span>
-		</div>
-	</div>
-</div>
-
-<style>
-	div {
-		position: relative;
-	}
-
-	.controls {
-		position: absolute;
-		top: 0;
-		width: 100%;
-		transition: opacity 1s;
-	}
-
-	.info {
-		display: flex;
-		width: 100%;
-		justify-content: space-between;
-	}
-
-	span {
-		padding: 0.2em 0.5em;
-		color: white;
-		text-shadow: 0 0 8px black;
-		font-size: 1.4em;
-		opacity: 0.7;
-	}
-
-	.time {
-		width: 3em;
-	}
-
-	.time:last-child {
-		text-align: right;
-	}
-
-	progress {
-		display: block;
-		width: 100%;
-		height: 10px;
-		-webkit-appearance: none;
-		appearance: none;
-	}
-
-	progress::-webkit-progress-bar {
-		background-color: rgba(0, 0, 0, 0.2);
-	}
-
-	progress::-webkit-progress-value {
-		background-color: rgba(255, 255, 255, 0.6);
-	}
-
-	video {
-		width: 100%;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/09-media-elements/meta.json b/documentation/examples/05-bindings/09-media-elements/meta.json
deleted file mode 100644
index 66dfeb7047..0000000000
--- a/documentation/examples/05-bindings/09-media-elements/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Media elements"
-}
diff --git a/documentation/examples/05-bindings/10-dimensions/App.svelte b/documentation/examples/05-bindings/10-dimensions/App.svelte
deleted file mode 100644
index 4d4a8b2cf2..0000000000
--- a/documentation/examples/05-bindings/10-dimensions/App.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script>
-	let w;
-	let h;
-	let size = 42;
-	let text = 'edit me';
-</script>
-
-<input type="range" bind:value={size} />
-<input bind:value={text} />
-
-<p>size: {w}px x {h}px</p>
-
-<div bind:clientWidth={w} bind:clientHeight={h}>
-	<span style="font-size: {size}px">{text}</span>
-</div>
-
-<style>
-	input {
-		display: block;
-	}
-	div {
-		display: inline-block;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/10-dimensions/meta.json b/documentation/examples/05-bindings/10-dimensions/meta.json
deleted file mode 100644
index fe06ae404e..0000000000
--- a/documentation/examples/05-bindings/10-dimensions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Dimensions"
-}
diff --git a/documentation/examples/05-bindings/11-bind-this/App.svelte b/documentation/examples/05-bindings/11-bind-this/App.svelte
deleted file mode 100644
index fe0fbe1b01..0000000000
--- a/documentation/examples/05-bindings/11-bind-this/App.svelte
+++ /dev/null
@@ -1,51 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let canvas;
-
-	onMount(() => {
-		const ctx = canvas.getContext('2d');
-		let frame;
-
-		(function loop() {
-			frame = requestAnimationFrame(loop);
-
-			const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
-
-			for (let p = 0; p < imageData.data.length; p += 4) {
-				const i = p / 4;
-				const x = i % canvas.width;
-				const y = (i / canvas.height) >>> 0;
-
-				const t = window.performance.now();
-
-				const r = 64 + (128 * x) / canvas.width + 64 * Math.sin(t / 1000);
-				const g = 64 + (128 * y) / canvas.height + 64 * Math.cos(t / 1400);
-				const b = 128;
-
-				imageData.data[p + 0] = r;
-				imageData.data[p + 1] = g;
-				imageData.data[p + 2] = b;
-				imageData.data[p + 3] = 255;
-			}
-
-			ctx.putImageData(imageData, 0, 0);
-		})();
-
-		return () => {
-			cancelAnimationFrame(frame);
-		};
-	});
-</script>
-
-<canvas bind:this={canvas} width={32} height={32} />
-
-<style>
-	canvas {
-		width: 100%;
-		height: 100%;
-		background-color: #666;
-		-webkit-mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-		mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/11-bind-this/meta.json b/documentation/examples/05-bindings/11-bind-this/meta.json
deleted file mode 100644
index 232abf7272..0000000000
--- a/documentation/examples/05-bindings/11-bind-this/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "bind:this={canvas}"
-}
diff --git a/documentation/examples/05-bindings/12-component-bindings/App.svelte b/documentation/examples/05-bindings/12-component-bindings/App.svelte
deleted file mode 100644
index 254ced9464..0000000000
--- a/documentation/examples/05-bindings/12-component-bindings/App.svelte
+++ /dev/null
@@ -1,29 +0,0 @@
-<script>
-	import Keypad from './Keypad.svelte';
-
-	let pin;
-	$: view = pin ? pin.replace(/\d(?!$)/g, '•') : 'enter your pin';
-
-	function handleSubmit() {
-		alert(`submitted ${pin}`);
-	}
-</script>
-
-<h1 class:pin>{view}</h1>
-
-<Keypad bind:value={pin} on:submit={handleSubmit} />
-
-<style>
-	h1 {
-		color: #ccc;
-	}
-	h1.pin {
-		color: #333;
-	}
-	:global(body.dark) h1 {
-		color: #444;
-	}
-	:global(body.dark) h1.pin {
-		color: #fff;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/12-component-bindings/Keypad.svelte b/documentation/examples/05-bindings/12-component-bindings/Keypad.svelte
deleted file mode 100644
index c814a2238f..0000000000
--- a/documentation/examples/05-bindings/12-component-bindings/Keypad.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	export let value = '';
-
-	const dispatch = createEventDispatcher();
-
-	const select = (num) => () => (value += num);
-	const clear = () => (value = '');
-	const submit = () => dispatch('submit');
-</script>
-
-<div class="keypad">
-	<button on:click={select(1)}>1</button>
-	<button on:click={select(2)}>2</button>
-	<button on:click={select(3)}>3</button>
-	<button on:click={select(4)}>4</button>
-	<button on:click={select(5)}>5</button>
-	<button on:click={select(6)}>6</button>
-	<button on:click={select(7)}>7</button>
-	<button on:click={select(8)}>8</button>
-	<button on:click={select(9)}>9</button>
-
-	<button disabled={!value} on:click={clear}>clear</button>
-	<button on:click={select(0)}>0</button>
-	<button disabled={!value} on:click={submit}>submit</button>
-</div>
-
-<style>
-	.keypad {
-		display: grid;
-		grid-template-columns: repeat(3, 5em);
-		grid-template-rows: repeat(4, 3em);
-		grid-gap: 0.5em;
-	}
-
-	button {
-		margin: 0;
-	}
-</style>
diff --git a/documentation/examples/05-bindings/12-component-bindings/meta.json b/documentation/examples/05-bindings/12-component-bindings/meta.json
deleted file mode 100644
index 5ed7f96ac2..0000000000
--- a/documentation/examples/05-bindings/12-component-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Component bindings"
-}
diff --git a/documentation/examples/05-bindings/meta.json b/documentation/examples/05-bindings/meta.json
deleted file mode 100644
index b6b01225e3..0000000000
--- a/documentation/examples/05-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Bindings"
-}
diff --git a/documentation/examples/06-lifecycle/00-onmount/App.svelte b/documentation/examples/06-lifecycle/00-onmount/App.svelte
deleted file mode 100644
index c8d1f6092f..0000000000
--- a/documentation/examples/06-lifecycle/00-onmount/App.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let photos = [];
-
-	onMount(async () => {
-		const res = await fetch(`/tutorial/api/album`);
-		photos = await res.json();
-	});
-</script>
-
-<h1>Photo album</h1>
-
-<div class="photos">
-	{#each photos as photo}
-		<figure>
-			<img src={photo.thumbnailUrl} alt={photo.title} />
-			<figcaption>{photo.title}</figcaption>
-		</figure>
-	{:else}
-		<!-- this block renders when photos.length === 0 -->
-		<p>loading...</p>
-	{/each}
-</div>
-
-<style>
-	.photos {
-		width: 100%;
-		display: grid;
-		grid-template-columns: repeat(5, 1fr);
-		grid-gap: 8px;
-	}
-
-	figure,
-	img {
-		width: 100%;
-		margin: 0;
-	}
-</style>
diff --git a/documentation/examples/06-lifecycle/00-onmount/meta.json b/documentation/examples/06-lifecycle/00-onmount/meta.json
deleted file mode 100644
index a644c75073..0000000000
--- a/documentation/examples/06-lifecycle/00-onmount/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "onMount"
-}
diff --git a/documentation/examples/06-lifecycle/01-ondestroy/App.svelte b/documentation/examples/06-lifecycle/01-ondestroy/App.svelte
deleted file mode 100644
index ededcc4f9e..0000000000
--- a/documentation/examples/06-lifecycle/01-ondestroy/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { onInterval } from './utils.js';
-
-	let seconds = 0;
-	onInterval(() => (seconds += 1), 1000);
-</script>
-
-<p>
-	The page has been open for
-	{seconds}
-	{seconds === 1 ? 'second' : 'seconds'}
-</p>
diff --git a/documentation/examples/06-lifecycle/01-ondestroy/meta.json b/documentation/examples/06-lifecycle/01-ondestroy/meta.json
deleted file mode 100644
index f168949ec0..0000000000
--- a/documentation/examples/06-lifecycle/01-ondestroy/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "onDestroy"
-}
diff --git a/documentation/examples/06-lifecycle/01-ondestroy/utils.js b/documentation/examples/06-lifecycle/01-ondestroy/utils.js
deleted file mode 100644
index 42423ff320..0000000000
--- a/documentation/examples/06-lifecycle/01-ondestroy/utils.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import { onDestroy } from 'svelte';
-
-export function onInterval(callback, milliseconds) {
-	const interval = setInterval(callback, milliseconds);
-
-	onDestroy(() => {
-		clearInterval(interval);
-	});
-}
diff --git a/documentation/examples/06-lifecycle/02-update/App.svelte b/documentation/examples/06-lifecycle/02-update/App.svelte
deleted file mode 100644
index afc1b29ea8..0000000000
--- a/documentation/examples/06-lifecycle/02-update/App.svelte
+++ /dev/null
@@ -1,113 +0,0 @@
-<script>
-	import Eliza from 'elizabot';
-	import { beforeUpdate, afterUpdate } from 'svelte';
-
-	let div;
-	let autoscroll;
-
-	beforeUpdate(() => {
-		autoscroll = div && div.offsetHeight + div.scrollTop > div.scrollHeight - 20;
-	});
-
-	afterUpdate(() => {
-		if (autoscroll) div.scrollTo(0, div.scrollHeight);
-	});
-
-	const eliza = new Eliza();
-
-	let comments = [{ author: 'eliza', text: eliza.getInitial() }];
-
-	function handleKeydown(event) {
-		if (event.key === 'Enter') {
-			const text = event.target.value;
-			if (!text) return;
-
-			comments = comments.concat({
-				author: 'user',
-				text
-			});
-
-			event.target.value = '';
-
-			const reply = eliza.transform(text);
-
-			setTimeout(
-				() => {
-					comments = comments.concat({
-						author: 'eliza',
-						text: '...',
-						placeholder: true
-					});
-
-					setTimeout(
-						() => {
-							comments = comments
-								.filter((comment) => !comment.placeholder)
-								.concat({
-									author: 'eliza',
-									text: reply
-								});
-						},
-						500 + Math.random() * 500
-					);
-				},
-				200 + Math.random() * 200
-			);
-		}
-	}
-</script>
-
-<div class="chat">
-	<h1>Eliza</h1>
-
-	<div class="scrollable" bind:this={div}>
-		{#each comments as comment}
-			<article class={comment.author}>
-				<span>{comment.text}</span>
-			</article>
-		{/each}
-	</div>
-
-	<input on:keydown={handleKeydown} />
-</div>
-
-<style>
-	.chat {
-		display: flex;
-		flex-direction: column;
-		height: 100%;
-		max-width: 320px;
-	}
-
-	.scrollable {
-		flex: 1 1 auto;
-		border-top: 1px solid #eee;
-		margin: 0 0 0.5em 0;
-		overflow-y: auto;
-	}
-
-	article {
-		margin: 0.5em 0;
-	}
-
-	.user {
-		text-align: right;
-	}
-
-	span {
-		color: black;
-		padding: 0.5em 1em;
-		display: inline-block;
-	}
-
-	.eliza span {
-		background-color: #eee;
-		border-radius: 1em 1em 1em 0;
-	}
-
-	.user span {
-		background-color: #0074d9;
-		color: white;
-		border-radius: 1em 1em 0 1em;
-	}
-</style>
diff --git a/documentation/examples/06-lifecycle/02-update/meta.json b/documentation/examples/06-lifecycle/02-update/meta.json
deleted file mode 100644
index 7f4db08030..0000000000
--- a/documentation/examples/06-lifecycle/02-update/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "beforeUpdate and afterUpdate"
-}
diff --git a/documentation/examples/06-lifecycle/03-tick/App.svelte b/documentation/examples/06-lifecycle/03-tick/App.svelte
deleted file mode 100644
index 2f076946b3..0000000000
--- a/documentation/examples/06-lifecycle/03-tick/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	import { tick } from 'svelte';
-
-	let text = `Select some text and hit the tab key to toggle uppercase`;
-
-	async function handleKeydown(event) {
-		if (event.key !== 'Tab') return;
-
-		event.preventDefault();
-
-		const { selectionStart, selectionEnd, value } = this;
-		const selection = value.slice(selectionStart, selectionEnd);
-
-		const replacement = /[a-z]/.test(selection) ? selection.toUpperCase() : selection.toLowerCase();
-
-		text = value.slice(0, selectionStart) + replacement + value.slice(selectionEnd);
-
-		await tick();
-		this.selectionStart = selectionStart;
-		this.selectionEnd = selectionEnd;
-	}
-</script>
-
-<textarea value={text} on:keydown={handleKeydown} />
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/examples/06-lifecycle/03-tick/meta.json b/documentation/examples/06-lifecycle/03-tick/meta.json
deleted file mode 100644
index 4de872bf86..0000000000
--- a/documentation/examples/06-lifecycle/03-tick/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "tick"
-}
diff --git a/documentation/examples/06-lifecycle/meta.json b/documentation/examples/06-lifecycle/meta.json
deleted file mode 100644
index 5ed3972e7a..0000000000
--- a/documentation/examples/06-lifecycle/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Lifecycle"
-}
diff --git a/documentation/examples/07-stores/00-writable-stores/App.svelte b/documentation/examples/07-stores/00-writable-stores/App.svelte
deleted file mode 100644
index 3d301a760f..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-
-	let countValue;
-
-	const unsubscribe = count.subscribe((value) => {
-		countValue = value;
-	});
-</script>
-
-<h1>The count is {countValue}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/examples/07-stores/00-writable-stores/Decrementer.svelte b/documentation/examples/07-stores/00-writable-stores/Decrementer.svelte
deleted file mode 100644
index 596ba4bbab..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		count.update((n) => n - 1);
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/examples/07-stores/00-writable-stores/Incrementer.svelte b/documentation/examples/07-stores/00-writable-stores/Incrementer.svelte
deleted file mode 100644
index 1fb7dea3cb..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		count.update((n) => n + 1);
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/examples/07-stores/00-writable-stores/Resetter.svelte b/documentation/examples/07-stores/00-writable-stores/Resetter.svelte
deleted file mode 100644
index 9c8809961f..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		count.set(0);
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/examples/07-stores/00-writable-stores/meta.json b/documentation/examples/07-stores/00-writable-stores/meta.json
deleted file mode 100644
index 9e899622e3..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Writable stores"
-}
diff --git a/documentation/examples/07-stores/00-writable-stores/stores.js b/documentation/examples/07-stores/00-writable-stores/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/examples/07-stores/00-writable-stores/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/App.svelte b/documentation/examples/07-stores/01-auto-subscriptions/App.svelte
deleted file mode 100644
index 9923689329..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-</script>
-
-<h1>The count is {$count}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/Decrementer.svelte b/documentation/examples/07-stores/01-auto-subscriptions/Decrementer.svelte
deleted file mode 100644
index 596ba4bbab..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		count.update((n) => n - 1);
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/Incrementer.svelte b/documentation/examples/07-stores/01-auto-subscriptions/Incrementer.svelte
deleted file mode 100644
index 1fb7dea3cb..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		count.update((n) => n + 1);
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/Resetter.svelte b/documentation/examples/07-stores/01-auto-subscriptions/Resetter.svelte
deleted file mode 100644
index 9c8809961f..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		count.set(0);
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/meta.json b/documentation/examples/07-stores/01-auto-subscriptions/meta.json
deleted file mode 100644
index 7a4e2e7167..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Auto-subscriptions"
-}
diff --git a/documentation/examples/07-stores/01-auto-subscriptions/stores.js b/documentation/examples/07-stores/01-auto-subscriptions/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/examples/07-stores/01-auto-subscriptions/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/examples/07-stores/02-readable-stores/App.svelte b/documentation/examples/07-stores/02-readable-stores/App.svelte
deleted file mode 100644
index 6d1d80b455..0000000000
--- a/documentation/examples/07-stores/02-readable-stores/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { time } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
diff --git a/documentation/examples/07-stores/02-readable-stores/meta.json b/documentation/examples/07-stores/02-readable-stores/meta.json
deleted file mode 100644
index 1ba22f9367..0000000000
--- a/documentation/examples/07-stores/02-readable-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Readable stores"
-}
diff --git a/documentation/examples/07-stores/02-readable-stores/stores.js b/documentation/examples/07-stores/02-readable-stores/stores.js
deleted file mode 100644
index 8c11f6d3aa..0000000000
--- a/documentation/examples/07-stores/02-readable-stores/stores.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { readable } from 'svelte/store';
-
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
diff --git a/documentation/examples/07-stores/03-derived-stores/App.svelte b/documentation/examples/07-stores/03-derived-stores/App.svelte
deleted file mode 100644
index d1013c1a26..0000000000
--- a/documentation/examples/07-stores/03-derived-stores/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { time, elapsed } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
-
-<p>
-	This page has been open for
-	{$elapsed}
-	{$elapsed === 1 ? 'second' : 'seconds'}
-</p>
diff --git a/documentation/examples/07-stores/03-derived-stores/meta.json b/documentation/examples/07-stores/03-derived-stores/meta.json
deleted file mode 100644
index 5574475370..0000000000
--- a/documentation/examples/07-stores/03-derived-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Derived stores"
-}
diff --git a/documentation/examples/07-stores/03-derived-stores/stores.js b/documentation/examples/07-stores/03-derived-stores/stores.js
deleted file mode 100644
index 741f927845..0000000000
--- a/documentation/examples/07-stores/03-derived-stores/stores.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import { readable, derived } from 'svelte/store';
-
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
-
-const start = new Date();
-
-export const elapsed = derived(time, ($time) => Math.round(($time - start) / 1000));
diff --git a/documentation/examples/07-stores/04-custom-stores/App.svelte b/documentation/examples/07-stores/04-custom-stores/App.svelte
deleted file mode 100644
index dbdd299d69..0000000000
--- a/documentation/examples/07-stores/04-custom-stores/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-</script>
-
-<h1>The count is {$count}</h1>
-
-<button on:click={count.increment}>+</button>
-<button on:click={count.decrement}>-</button>
-<button on:click={count.reset}>reset</button>
diff --git a/documentation/examples/07-stores/04-custom-stores/meta.json b/documentation/examples/07-stores/04-custom-stores/meta.json
deleted file mode 100644
index 7f1b426835..0000000000
--- a/documentation/examples/07-stores/04-custom-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Custom stores"
-}
diff --git a/documentation/examples/07-stores/04-custom-stores/stores.js b/documentation/examples/07-stores/04-custom-stores/stores.js
deleted file mode 100644
index da11e88df2..0000000000
--- a/documentation/examples/07-stores/04-custom-stores/stores.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { writable } from 'svelte/store';
-
-function createCount() {
-	const { subscribe, set, update } = writable(0);
-
-	return {
-		subscribe,
-		increment: () => update((n) => n + 1),
-		decrement: () => update((n) => n - 1),
-		reset: () => set(0)
-	};
-}
-
-export const count = createCount();
diff --git a/documentation/examples/07-stores/meta.json b/documentation/examples/07-stores/meta.json
deleted file mode 100644
index c70d14efe5..0000000000
--- a/documentation/examples/07-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Stores"
-}
diff --git a/documentation/examples/08-motion/00-tweened/App.svelte b/documentation/examples/08-motion/00-tweened/App.svelte
deleted file mode 100644
index f4fb499f0f..0000000000
--- a/documentation/examples/08-motion/00-tweened/App.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	import { tweened } from 'svelte/motion';
-	import { cubicOut } from 'svelte/easing';
-
-	const progress = tweened(0, {
-		duration: 400,
-		easing: cubicOut
-	});
-</script>
-
-<progress value={$progress} />
-
-<button on:click={() => progress.set(0)}> 0% </button>
-
-<button on:click={() => progress.set(0.25)}> 25% </button>
-
-<button on:click={() => progress.set(0.5)}> 50% </button>
-
-<button on:click={() => progress.set(0.75)}> 75% </button>
-
-<button on:click={() => progress.set(1)}> 100% </button>
-
-<style>
-	progress {
-		display: block;
-		width: 100%;
-	}
-</style>
diff --git a/documentation/examples/08-motion/00-tweened/meta.json b/documentation/examples/08-motion/00-tweened/meta.json
deleted file mode 100644
index 97d369cd1b..0000000000
--- a/documentation/examples/08-motion/00-tweened/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Tweened"
-}
diff --git a/documentation/examples/08-motion/01-spring/App.svelte b/documentation/examples/08-motion/01-spring/App.svelte
deleted file mode 100644
index e5b59901aa..0000000000
--- a/documentation/examples/08-motion/01-spring/App.svelte
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-	import { spring } from 'svelte/motion';
-
-	let coords = spring(
-		{ x: 50, y: 50 },
-		{
-			stiffness: 0.1,
-			damping: 0.25
-		}
-	);
-
-	let size = spring(10);
-</script>
-
-<div style="position: absolute; right: 1em;">
-	<label>
-		<h3>stiffness ({coords.stiffness})</h3>
-		<input bind:value={coords.stiffness} type="range" min="0" max="1" step="0.01" />
-	</label>
-
-	<label>
-		<h3>damping ({coords.damping})</h3>
-		<input bind:value={coords.damping} type="range" min="0" max="1" step="0.01" />
-	</label>
-</div>
-
-<!-- svelte-ignore a11y-no-static-element-interactions -->
-<svg
-	on:mousemove={(e) => coords.set({ x: e.clientX, y: e.clientY })}
-	on:mousedown={() => size.set(30)}
-	on:mouseup={() => size.set(10)}
->
-	<circle cx={$coords.x} cy={$coords.y} r={$size} />
-</svg>
-
-<style>
-	svg {
-		width: 100%;
-		height: 100%;
-		margin: -8px;
-	}
-	circle {
-		fill: #ff3e00;
-	}
-</style>
diff --git a/documentation/examples/08-motion/01-spring/meta.json b/documentation/examples/08-motion/01-spring/meta.json
deleted file mode 100644
index 7c926445a6..0000000000
--- a/documentation/examples/08-motion/01-spring/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Spring"
-}
diff --git a/documentation/examples/08-motion/meta.json b/documentation/examples/08-motion/meta.json
deleted file mode 100644
index 14919954a9..0000000000
--- a/documentation/examples/08-motion/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Motion"
-}
diff --git a/documentation/examples/09-transitions/00-transition/App.svelte b/documentation/examples/09-transitions/00-transition/App.svelte
deleted file mode 100644
index 29e9254d14..0000000000
--- a/documentation/examples/09-transitions/00-transition/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fade>Fades in and out</p>
-{/if}
diff --git a/documentation/examples/09-transitions/00-transition/meta.json b/documentation/examples/09-transitions/00-transition/meta.json
deleted file mode 100644
index 8d466a6219..0000000000
--- a/documentation/examples/09-transitions/00-transition/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "The transition directive"
-}
diff --git a/documentation/examples/09-transitions/01-adding-parameters-to-transitions/App.svelte b/documentation/examples/09-transitions/01-adding-parameters-to-transitions/App.svelte
deleted file mode 100644
index 318739f1d0..0000000000
--- a/documentation/examples/09-transitions/01-adding-parameters-to-transitions/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fly={{ y: 200, duration: 2000 }}>Flies in and out</p>
-{/if}
diff --git a/documentation/examples/09-transitions/01-adding-parameters-to-transitions/meta.json b/documentation/examples/09-transitions/01-adding-parameters-to-transitions/meta.json
deleted file mode 100644
index 8a857ebcbb..0000000000
--- a/documentation/examples/09-transitions/01-adding-parameters-to-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Adding parameters"
-}
diff --git a/documentation/examples/09-transitions/02-in-and-out/App.svelte b/documentation/examples/09-transitions/02-in-and-out/App.svelte
deleted file mode 100644
index bb44e5ca9f..0000000000
--- a/documentation/examples/09-transitions/02-in-and-out/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fade, fly } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p in:fly={{ y: 200, duration: 2000 }} out:fade>Flies in, fades out</p>
-{/if}
diff --git a/documentation/examples/09-transitions/02-in-and-out/meta.json b/documentation/examples/09-transitions/02-in-and-out/meta.json
deleted file mode 100644
index ae0d4e800d..0000000000
--- a/documentation/examples/09-transitions/02-in-and-out/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "In and out"
-}
diff --git a/documentation/examples/09-transitions/03-custom-css-transitions/App.svelte b/documentation/examples/09-transitions/03-custom-css-transitions/App.svelte
deleted file mode 100644
index c85fe7ef89..0000000000
--- a/documentation/examples/09-transitions/03-custom-css-transitions/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-	import { elasticOut } from 'svelte/easing';
-
-	let visible = true;
-
-	function spin(node, { duration }) {
-		return {
-			duration,
-			css: (t) => {
-				const eased = elasticOut(t);
-
-				return `
-					transform: scale(${eased}) rotate(${eased * 1080}deg);
-					color: hsl(
-						${~~(t * 360)},
-						${Math.min(100, 1000 - 1000 * t)}%,
-						${Math.min(50, 500 - 500 * t)}%
-					);`;
-			}
-		};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<div class="centered" in:spin={{ duration: 8000 }} out:fade>
-		<span>transitions!</span>
-	</div>
-{/if}
-
-<style>
-	.centered {
-		position: absolute;
-		left: 50%;
-		top: 50%;
-		transform: translate(-50%, -50%);
-	}
-
-	span {
-		position: absolute;
-		transform: translate(-50%, -50%);
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/examples/09-transitions/03-custom-css-transitions/meta.json b/documentation/examples/09-transitions/03-custom-css-transitions/meta.json
deleted file mode 100644
index cbe988abc8..0000000000
--- a/documentation/examples/09-transitions/03-custom-css-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Custom CSS transitions"
-}
diff --git a/documentation/examples/09-transitions/04-custom-js-transitions/App.svelte b/documentation/examples/09-transitions/04-custom-js-transitions/App.svelte
deleted file mode 100644
index 9ccd18a0f7..0000000000
--- a/documentation/examples/09-transitions/04-custom-js-transitions/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	let visible = false;
-
-	function typewriter(node, { speed = 1 }) {
-		const valid = node.childNodes.length === 1 && node.childNodes[0].nodeType === Node.TEXT_NODE;
-
-		if (!valid) {
-			throw new Error(`This transition only works on elements with a single text node child`);
-		}
-
-		const text = node.textContent;
-		const duration = text.length / (speed * 0.01);
-
-		return {
-			duration,
-			tick: (t) => {
-				const i = ~~(text.length * t);
-				node.textContent = text.slice(0, i);
-			}
-		};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:typewriter>The quick brown fox jumps over the lazy dog</p>
-{/if}
diff --git a/documentation/examples/09-transitions/04-custom-js-transitions/meta.json b/documentation/examples/09-transitions/04-custom-js-transitions/meta.json
deleted file mode 100644
index 4ec4afdfce..0000000000
--- a/documentation/examples/09-transitions/04-custom-js-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Custom JS transitions"
-}
diff --git a/documentation/examples/09-transitions/05-transition-events/App.svelte b/documentation/examples/09-transitions/05-transition-events/App.svelte
deleted file mode 100644
index 31ef18c930..0000000000
--- a/documentation/examples/09-transitions/05-transition-events/App.svelte
+++ /dev/null
@@ -1,25 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-
-	let visible = true;
-	let status = 'waiting...';
-</script>
-
-<p>status: {status}</p>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p
-		transition:fly={{ y: 200, duration: 2000 }}
-		on:introstart={() => (status = 'intro started')}
-		on:outrostart={() => (status = 'outro started')}
-		on:introend={() => (status = 'intro ended')}
-		on:outroend={() => (status = 'outro ended')}
-	>
-		Flies in and out
-	</p>
-{/if}
diff --git a/documentation/examples/09-transitions/05-transition-events/meta.json b/documentation/examples/09-transitions/05-transition-events/meta.json
deleted file mode 100644
index cad1f94386..0000000000
--- a/documentation/examples/09-transitions/05-transition-events/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Transition events"
-}
diff --git a/documentation/examples/09-transitions/06-deferred-transitions/App.svelte b/documentation/examples/09-transitions/06-deferred-transitions/App.svelte
deleted file mode 100644
index 8f603165c1..0000000000
--- a/documentation/examples/09-transitions/06-deferred-transitions/App.svelte
+++ /dev/null
@@ -1,155 +0,0 @@
-<script>
-	import { crossfade, scale } from 'svelte/transition';
-	import images from './images.js';
-
-	const [send, receive] = crossfade({
-		duration: 200,
-		fallback: scale
-	});
-
-	let selected = null;
-	let loading = null;
-
-	const ASSETS = `https://sveltejs.github.io/assets/crossfade`;
-
-	const load = (image) => {
-		const timeout = setTimeout(() => (loading = image), 100);
-
-		const img = new Image();
-
-		img.onload = () => {
-			selected = image;
-			clearTimeout(timeout);
-			loading = null;
-		};
-
-		img.src = `${ASSETS}/${image.id}.jpg`;
-	};
-</script>
-
-<div class="container">
-	<div class="phone">
-		<h1>Photo gallery</h1>
-
-		<div class="grid">
-			{#each images as image}
-				<div class="square">
-					{#if selected !== image}
-						<button
-							style="background-color: {image.color};"
-							on:click={() => load(image)}
-							in:receive={{ key: image.id }}
-							out:send={{ key: image.id }}>{loading === image ? '...' : image.id}</button
-						>
-					{/if}
-				</div>
-			{/each}
-		</div>
-
-		{#if selected}
-			{#await selected then d}
-				<div class="photo" in:receive|global={{ key: d.id }} out:send|global={{ key: d.id }}>
-					<!-- svelte-ignore a11y-click-events-have-key-events a11y-no-noninteractive-element-interactions -->
-					<img alt={d.alt} src="{ASSETS}/{d.id}.jpg" on:click={() => (selected = null)} />
-
-					<p class="credit">
-						<a target="_blank" rel="noreferrer" href="https://www.flickr.com/photos/{d.path}"
-							>via Flickr</a
-						>
-						&ndash;
-						<a target="_blank" rel="noreferrer" href={d.license.url}>{d.license.name}</a>
-					</p>
-				</div>
-			{/await}
-		{/if}
-	</div>
-</div>
-
-<style>
-	.container {
-		position: absolute;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		width: 100%;
-		height: 100%;
-		top: 0;
-		left: 0;
-	}
-
-	.phone {
-		position: relative;
-		display: flex;
-		flex-direction: column;
-		width: 52vmin;
-		height: 76vmin;
-		border: 2vmin solid #ccc;
-		border-bottom-width: 10vmin;
-		padding: 3vmin;
-		border-radius: 2vmin;
-	}
-
-	h1 {
-		font-weight: 300;
-		text-transform: uppercase;
-		font-size: 5vmin;
-		margin: 0.2em 0 0.5em 0;
-	}
-
-	.grid {
-		display: grid;
-		flex: 1;
-		grid-template-columns: repeat(3, 1fr);
-		grid-template-rows: repeat(4, 1fr);
-		grid-gap: 2vmin;
-	}
-
-	button {
-		width: 100%;
-		height: 100%;
-		color: white;
-		font-size: 5vmin;
-		border: none;
-		margin: 0;
-		will-change: transform;
-	}
-
-	.photo,
-	img {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		overflow: hidden;
-	}
-
-	.photo {
-		display: flex;
-		align-items: stretch;
-		justify-content: flex-end;
-		flex-direction: column;
-		will-change: transform;
-	}
-
-	img {
-		object-fit: cover;
-		cursor: pointer;
-	}
-
-	.credit {
-		text-align: right;
-		font-size: 2.5vmin;
-		padding: 1em;
-		margin: 0;
-		color: white;
-		font-weight: bold;
-		opacity: 0.6;
-		background: rgba(0, 0, 0, 0.4);
-	}
-
-	.credit a,
-	.credit a:visited {
-		color: white;
-	}
-</style>
diff --git a/documentation/examples/09-transitions/06-deferred-transitions/images.js b/documentation/examples/09-transitions/06-deferred-transitions/images.js
deleted file mode 100644
index fa494ccdbc..0000000000
--- a/documentation/examples/09-transitions/06-deferred-transitions/images.js
+++ /dev/null
@@ -1,102 +0,0 @@
-const BY = {
-	name: 'CC BY 2.0',
-	url: 'https://creativecommons.org/licenses/by/2.0/'
-};
-
-const BY_SA = {
-	name: 'CC BY-SA 2.0',
-	url: 'https://creativecommons.org/licenses/by-sa/2.0/'
-};
-
-const BY_ND = {
-	name: 'CC BY-ND 2.0',
-	url: 'https://creativecommons.org/licenses/by-nd/2.0/'
-};
-
-// via http://labs.tineye.com/multicolr
-export default [
-	{
-		color: '#001f3f',
-		id: '1',
-		alt: 'Crepuscular rays',
-		path: '43428526@N03/7863279376',
-		license: BY
-	},
-	{
-		color: '#0074D9',
-		id: '2',
-		alt: 'Lapland winter scene',
-		path: '25507134@N00/6527537485',
-		license: BY
-	},
-	{
-		color: '#7FDBFF',
-		id: '3',
-		alt: 'Jellyfish',
-		path: '37707866@N00/3354331318',
-		license: BY
-	},
-	{
-		color: '#39CCCC',
-		id: '4',
-		alt: 'A man scuba diving',
-		path: '32751486@N00/4608886209',
-		license: BY_SA
-	},
-	{
-		color: '#3D9970',
-		id: '5',
-		alt: 'Underwater scene',
-		path: '25483059@N08/5548569010',
-		license: BY
-	},
-	{
-		color: '#2ECC40',
-		id: '6',
-		alt: 'Ferns',
-		path: '8404611@N06/2447470760',
-		license: BY
-	},
-	{
-		color: '#01FF70',
-		id: '7',
-		alt: 'Posters in a bar',
-		path: '33917831@N00/114428206',
-		license: BY_SA
-	},
-	{
-		color: '#FFDC00',
-		id: '8',
-		alt: 'Daffodil',
-		path: '46417125@N04/4818617089',
-		license: BY_ND
-	},
-	{
-		color: '#FF851B',
-		id: '9',
-		alt: 'Dust storm in Sydney',
-		path: '56068058@N00/3945496657',
-		license: BY
-	},
-	{
-		color: '#FF4136',
-		id: '10',
-		alt: 'Postbox',
-		path: '31883499@N05/4216820032',
-		license: BY
-	},
-	{
-		color: '#85144b',
-		id: '11',
-		alt: 'Fireworks',
-		path: '8484971@N07/2625506561',
-		license: BY_ND
-	},
-	{
-		color: '#B10DC9',
-		id: '12',
-		alt: 'The Stereophonics',
-		path: '58028312@N00/5385464371',
-		license: BY_ND
-	}
-];
diff --git a/documentation/examples/09-transitions/06-deferred-transitions/meta.json b/documentation/examples/09-transitions/06-deferred-transitions/meta.json
deleted file mode 100644
index 9b9e1e09bc..0000000000
--- a/documentation/examples/09-transitions/06-deferred-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Deferred transitions"
-}
diff --git a/documentation/examples/09-transitions/meta.json b/documentation/examples/09-transitions/meta.json
deleted file mode 100644
index 5981eece3e..0000000000
--- a/documentation/examples/09-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Transitions"
-}
diff --git a/documentation/examples/10-animations/00-animate/App.svelte b/documentation/examples/10-animations/00-animate/App.svelte
deleted file mode 100644
index 7209a25f15..0000000000
--- a/documentation/examples/10-animations/00-animate/App.svelte
+++ /dev/null
@@ -1,143 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { crossfade } from 'svelte/transition';
-	import { flip } from 'svelte/animate';
-
-	const [send, receive] = crossfade({
-		fallback(node, params) {
-			const style = getComputedStyle(node);
-			const transform = style.transform === 'none' ? '' : style.transform;
-
-			return {
-				duration: 600,
-				easing: quintOut,
-				css: (t) => `
-					transform: ${transform} scale(${t});
-					opacity: ${t}
-				`
-			};
-		}
-	});
-
-	let todos = [
-		{ id: 1, done: false, description: 'write some docs' },
-		{ id: 2, done: false, description: 'start writing JSConf talk' },
-		{ id: 3, done: true, description: 'buy some milk' },
-		{ id: 4, done: false, description: 'mow the lawn' },
-		{ id: 5, done: false, description: 'feed the turtle' },
-		{ id: 6, done: false, description: 'fix some bugs' }
-	];
-
-	let uid = todos.length + 1;
-
-	function add(input) {
-		const todo = {
-			id: uid++,
-			done: false,
-			description: input.value
-		};
-
-		todos = [todo, ...todos];
-		input.value = '';
-	}
-
-	function remove(todo) {
-		todos = todos.filter((t) => t !== todo);
-	}
-</script>
-
-<div class="board">
-	<input
-		class="new-todo"
-		placeholder="what needs to be done?"
-		on:keydown={(event) => event.key === 'Enter' && add(event.target)}
-	/>
-
-	<div class="left">
-		<h2>todo</h2>
-		{#each todos.filter((t) => !t.done) as todo (todo.id)}
-			<label in:receive={{ key: todo.id }} out:send={{ key: todo.id }} animate:flip>
-				<input type="checkbox" bind:checked={todo.done} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>x</button>
-			</label>
-		{/each}
-	</div>
-
-	<div class="right">
-		<h2>done</h2>
-		{#each todos.filter((t) => t.done) as todo (todo.id)}
-			<label in:receive={{ key: todo.id }} out:send={{ key: todo.id }} animate:flip>
-				<input type="checkbox" bind:checked={todo.done} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>x</button>
-			</label>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.new-todo {
-		font-size: 1.4em;
-		width: 100%;
-		margin: 2em 0 1em 0;
-	}
-
-	.board {
-		max-width: 36em;
-		margin: 0 auto;
-	}
-
-	.left,
-	.right {
-		float: left;
-		width: 50%;
-		padding: 0 1em 0 0;
-		box-sizing: border-box;
-	}
-
-	h2 {
-		font-size: 2em;
-		font-weight: 200;
-		user-select: none;
-	}
-
-	label {
-		top: 0;
-		left: 0;
-		display: block;
-		font-size: 1em;
-		line-height: 1;
-		padding: 0.5em;
-		margin: 0 auto 0.5em auto;
-		border-radius: 2px;
-		background-color: #eee;
-		user-select: none;
-		color: black;
-	}
-
-	input {
-		margin: 0;
-	}
-
-	.right label {
-		background-color: rgb(180, 240, 100);
-	}
-
-	button {
-		float: right;
-		height: 1em;
-		box-sizing: border-box;
-		padding: 0 0.5em;
-		line-height: 1;
-		background-color: transparent;
-		border: none;
-		color: rgb(170, 30, 30);
-		opacity: 0;
-		transition: opacity 0.2s;
-	}
-
-	label:hover button {
-		opacity: 1;
-	}
-</style>
diff --git a/documentation/examples/10-animations/00-animate/meta.json b/documentation/examples/10-animations/00-animate/meta.json
deleted file mode 100644
index 147c1a971f..0000000000
--- a/documentation/examples/10-animations/00-animate/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "The animate directive"
-}
diff --git a/documentation/examples/10-animations/meta.json b/documentation/examples/10-animations/meta.json
deleted file mode 100644
index 25cc16d8bb..0000000000
--- a/documentation/examples/10-animations/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Animations"
-}
diff --git a/documentation/examples/11-easing/00-easing/App.svelte b/documentation/examples/11-easing/00-easing/App.svelte
deleted file mode 100644
index c3814bb8bd..0000000000
--- a/documentation/examples/11-easing/00-easing/App.svelte
+++ /dev/null
@@ -1,100 +0,0 @@
-<script>
-	import { interpolateString as interpolate } from 'd3-interpolate';
-	import { tweened } from 'svelte/motion';
-
-	import Grid from './Grid.svelte';
-	import Controls from './Controls.svelte';
-
-	import { eases, types } from './eases.js';
-
-	let current_type = 'In';
-	let current_ease = 'sine';
-	let duration = 2000;
-	let current = eases.get(current_ease)[current_type];
-	let playing = false;
-	let width;
-
-	const ease_path = tweened(current.shape, { interpolate });
-	const time = tweened(0);
-	const value = tweened(1000);
-
-	async function runAnimations() {
-		playing = true;
-
-		value.set(1000, { duration: 0 });
-		time.set(0, { duration: 0 });
-
-		await ease_path.set(current.shape);
-		await Promise.all([
-			time.set(1000, { duration, easing: (x) => x }),
-			value.set(0, { duration, easing: current.fn })
-		]);
-
-		playing = false;
-	}
-
-	$: current = eases.get(current_ease)[current_type];
-	$: current && runAnimations();
-</script>
-
-<div bind:offsetWidth={width} class="easing-vis">
-	<svg viewBox="0 0 1400 1802">
-		<g class="canvas">
-			<Grid x={$time} y={$value} />
-			<g class="graph">
-				<path d={$ease_path} stroke="#ff3e00" stroke-width="2" fill="none" />
-
-				<path
-					d="M0,23.647C0,22.41 27.014,0.407 28.496,0.025C29.978,-0.357 69.188,3.744 70.104,4.744C71.02,5.745 71.02,41.499 70.104,42.5C69.188,43.501 29.978,47.601 28.496,47.219C27.014,46.837 0,24.884 0,23.647Z"
-					fill="#ff3e00"
-					style="transform: translate(1060px, {$value - 24}px)"
-				/>
-
-				<circle cx={$time} cy={$value} r="15" fill="#ff3e00" />
-			</g>
-		</g>
-	</svg>
-
-	<Controls
-		{eases}
-		{types}
-		{playing}
-		{width}
-		bind:duration
-		bind:current_ease
-		bind:current_type
-		on:play={runAnimations}
-	/>
-</div>
-
-<style>
-	:root {
-		scrollbar-gutter: stable;
-	}
-
-	.easing-vis {
-		display: flex;
-		max-height: 95%;
-		max-width: 800px;
-		margin: auto;
-		border: 1px solid #333;
-		border-radius: 2px;
-		padding: 20px;
-	}
-
-	svg {
-		width: 100%;
-		margin: 0 20px 0 0;
-	}
-
-	.graph {
-		transform: translate(200px, 400px);
-	}
-
-	@media (max-width: 600px) {
-		.easing-vis {
-			flex-direction: column;
-			max-height: calc(100% - 3rem);
-		}
-	}
-</style>
diff --git a/documentation/examples/11-easing/00-easing/Controls.svelte b/documentation/examples/11-easing/00-easing/Controls.svelte
deleted file mode 100644
index a938ee235b..0000000000
--- a/documentation/examples/11-easing/00-easing/Controls.svelte
+++ /dev/null
@@ -1,176 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	export let current_ease;
-	export let current_type;
-	export let eases;
-	export let types;
-	export let duration;
-	export let playing;
-	export let width;
-
-	const dispatch = createEventDispatcher();
-
-	$: mobile = width && width < 600;
-</script>
-
-<div class="easing-sidebar">
-	<div class="easing-types">
-		<h3>Ease</h3>
-		{#if mobile}
-			<select bind:value={current_ease}>
-				{#each [...eases] as [name]}
-					<option value={name} class:selected={name === current_ease}>
-						{name}
-					</option>
-				{/each}
-			</select>
-		{:else}
-			<ul>
-				{#each [...eases] as [name]}
-					<li class:selected={name === current_ease}>
-						<button on:click={() => (current_ease = name)}> {name}</button>
-					</li>
-				{/each}
-			</ul>
-		{/if}
-		<h3>Type</h3>
-		{#if mobile}
-			<select bind:value={current_type}>
-				{#each types as [name, type]}
-					<option value={type}>
-						{name}
-					</option>
-				{/each}
-			</select>
-		{:else}
-			<ul>
-				{#each types as [name, type]}
-					<li class:selected={type === current_type}>
-						<button on:click={() => (current_type = type)}> {name}</button>
-					</li>
-				{/each}
-			</ul>
-		{/if}
-	</div>
-	<h4>Duration</h4>
-	<div class="duration">
-		<span>
-			<input type="number" bind:value={duration} min="0" step="100" />
-			<button class="number" on:click={() => (duration -= 100)}>-</button>
-			<button class="number" on:click={() => (duration += 100)}>+</button>
-		</span>
-		<button class="play" on:click={() => dispatch('play')}>
-			{playing ? 'Restart' : 'Play'}
-		</button>
-	</div>
-</div>
-
-<style>
-	.easing-sidebar {
-		width: 11em;
-	}
-
-	ul {
-		list-style: none;
-		padding: 0;
-		display: grid;
-		grid-template-columns: 1fr;
-		gap: 3px;
-		font-size: 18px;
-	}
-
-	li {
-		display: grid;
-	}
-
-	li:hover {
-		background: #676778;
-		color: white;
-	}
-
-	button {
-		border: none;
-		border-radius: 2px;
-		padding: 2px;
-	}
-
-	.selected > button {
-		background: #ff3e00;
-		color: white;
-		font-weight: bold;
-	}
-
-	h3 {
-		margin: 0 10px 0 0;
-	}
-
-	h4 {
-		margin-bottom: 0;
-	}
-
-	select {
-		display: inline;
-		padding: 0.2em;
-		margin: 0;
-	}
-
-	.duration {
-		width: 100%;
-		display: flex;
-		align-items: center;
-		flex-wrap: wrap;
-	}
-
-	.duration span {
-		display: flex;
-	}
-
-	.duration input {
-		width: 80px;
-		margin: 10px 10px 10px 0;
-	}
-
-	.duration button {
-		margin: 10px 5px;
-	}
-
-	.duration .number {
-		width: 30px;
-	}
-
-	.duration .play {
-		margin: 0 5px 0 auto;
-		width: 100%;
-	}
-
-	@media (max-width: 600px) {
-		.easing-types {
-			display: flex;
-			align-items: center;
-			margin-top: 10px;
-		}
-
-		.easing-sidebar {
-			width: 100%;
-		}
-
-		.duration .play {
-			margin-left: auto;
-			width: unset;
-		}
-
-		h3 {
-			font-size: 0.9em;
-			display: inline;
-		}
-
-		h3:nth-of-type(2) {
-			margin-left: auto;
-		}
-
-		ul li {
-			margin-right: 10px;
-		}
-	}
-</style>
diff --git a/documentation/examples/11-easing/00-easing/Grid.svelte b/documentation/examples/11-easing/00-easing/Grid.svelte
deleted file mode 100644
index 313b46553a..0000000000
--- a/documentation/examples/11-easing/00-easing/Grid.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<svelte:options namespace="svg" />
-
-<script>
-	export let x, y;
-</script>
-
-<rect
-	x="0"
-	y="0"
-	width="1400"
-	height="1800"
-	stroke="#ccc"
-	style="opacity: 0.5"
-	fill="none"
-	stroke-width="2"
-/>
-
-{#each { length: 8 } as _, i}
-	{#if i < 6}
-		<path d="M{(i + 1) * 200} 0 L{(i + 1) * 200} 1802" class="grid-line" />
-	{/if}
-	<path d="M0 {(i + 1) * 200} L1400 {(i + 1) * 200} " class="grid-line" />
-{/each}
-
-<path style="transform: translateX({x + 200}px)" d="M0 0 L0 1800" class="grid-line-xy" />
-<path style="transform: translateY({y}px)" d="M0 400 L1400 400" class="grid-line-xy" />
-<rect x="200" y="400" width="1000" height="1000" stroke="#999" fill="none" stroke-width="2" />
-
-<style>
-	.grid-line {
-		stroke: #ccc;
-		opacity: 0.5;
-		stroke-width: 2;
-	}
-
-	.grid-line-xy {
-		stroke: tomato;
-		stroke-width: 2;
-	}
-</style>
diff --git a/documentation/examples/11-easing/00-easing/eases.js b/documentation/examples/11-easing/00-easing/eases.js
deleted file mode 100644
index c4e4ed8d47..0000000000
--- a/documentation/examples/11-easing/00-easing/eases.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import * as eases from 'svelte/easing';
-
-const processed_eases = {};
-
-for (const ease in eases) {
-	if (ease === 'linear') {
-		processed_eases.linear = eases.linear;
-	} else {
-		const name = ease.replace(/In$|InOut$|Out$/, '');
-		const type = ease.match(/In$|InOut$|Out$/)[0];
-
-		if (!(name in processed_eases)) processed_eases[name] = {};
-		processed_eases[name][type] = {};
-		processed_eases[name][type].fn = eases[ease];
-
-		let shape = 'M0 1000';
-		for (let i = 1; i <= 1000; i++) {
-			shape = `${shape} L${(i / 1000) * 1000} ${1000 - eases[ease](i / 1000) * 1000} `;
-			processed_eases[name][type].shape = shape;
-		}
-	}
-}
-
-const sorted_eases = new Map([
-	['sine', processed_eases.sine],
-	['quad', processed_eases.quad],
-	['cubic', processed_eases.cubic],
-	['quart', processed_eases.quart],
-	['quint', processed_eases.quint],
-	['expo', processed_eases.expo],
-	['circ', processed_eases.circ],
-	['back', processed_eases.back],
-	['elastic', processed_eases.elastic],
-	['bounce', processed_eases.bounce]
-]);
-
-export const types = [
-	['Ease In', 'In'],
-	['Ease Out', 'Out'],
-	['Ease In Out', 'InOut']
-];
-
-export { sorted_eases as eases };
diff --git a/documentation/examples/11-easing/00-easing/meta.json b/documentation/examples/11-easing/00-easing/meta.json
deleted file mode 100644
index 0c8a4969ff..0000000000
--- a/documentation/examples/11-easing/00-easing/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Ease Visualiser"
-}
diff --git a/documentation/examples/11-easing/meta.json b/documentation/examples/11-easing/meta.json
deleted file mode 100644
index 54bd68373d..0000000000
--- a/documentation/examples/11-easing/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Easing"
-}
diff --git a/documentation/examples/12-svg/01-clock/App.svelte b/documentation/examples/12-svg/01-clock/App.svelte
deleted file mode 100644
index 7548dff2c9..0000000000
--- a/documentation/examples/12-svg/01-clock/App.svelte
+++ /dev/null
@@ -1,85 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let time = new Date();
-
-	// these automatically update when `time`
-	// changes, because of the `$:` prefix
-	$: hours = time.getHours();
-	$: minutes = time.getMinutes();
-	$: seconds = time.getSeconds();
-
-	onMount(() => {
-		const interval = setInterval(() => {
-			time = new Date();
-		}, 1000);
-
-		return () => {
-			clearInterval(interval);
-		};
-	});
-</script>
-
-<svg viewBox="-50 -50 100 100">
-	<circle class="clock-face" r="48" />
-
-	<!-- markers -->
-	{#each [0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55] as minute}
-		<line class="major" y1="35" y2="45" transform="rotate({30 * minute})" />
-
-		{#each [1, 2, 3, 4] as offset}
-			<line class="minor" y1="42" y2="45" transform="rotate({6 * (minute + offset)})" />
-		{/each}
-	{/each}
-
-	<!-- hour hand -->
-	<line class="hour" y1="2" y2="-20" transform="rotate({30 * hours + minutes / 2})" />
-
-	<!-- minute hand -->
-	<line class="minute" y1="4" y2="-30" transform="rotate({6 * minutes + seconds / 10})" />
-
-	<!-- second hand -->
-	<g transform="rotate({6 * seconds})">
-		<line class="second" y1="10" y2="-38" />
-		<line class="second-counterweight" y1="10" y2="2" />
-	</g>
-</svg>
-
-<style>
-	svg {
-		width: 100%;
-		height: 100%;
-	}
-
-	.clock-face {
-		stroke: #333;
-		fill: white;
-	}
-
-	.minor {
-		stroke: #999;
-		stroke-width: 0.5;
-	}
-
-	.major {
-		stroke: #333;
-		stroke-width: 1;
-	}
-
-	.hour {
-		stroke: #333;
-	}
-
-	.minute {
-		stroke: #666;
-	}
-
-	.second,
-	.second-counterweight {
-		stroke: rgb(180, 0, 0);
-	}
-
-	.second-counterweight {
-		stroke-width: 3;
-	}
-</style>
diff --git a/documentation/examples/12-svg/01-clock/meta.json b/documentation/examples/12-svg/01-clock/meta.json
deleted file mode 100644
index 85917ba578..0000000000
--- a/documentation/examples/12-svg/01-clock/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Clock"
-}
diff --git a/documentation/examples/12-svg/02-bar-chart/App.svelte b/documentation/examples/12-svg/02-bar-chart/App.svelte
deleted file mode 100644
index 283b109ac0..0000000000
--- a/documentation/examples/12-svg/02-bar-chart/App.svelte
+++ /dev/null
@@ -1,118 +0,0 @@
-<script>
-	import { scaleLinear } from 'd3-scale';
-
-	const points = [
-		{ year: 1990, birthrate: 16.7 },
-		{ year: 1995, birthrate: 14.6 },
-		{ year: 2000, birthrate: 14.4 },
-		{ year: 2005, birthrate: 14 },
-		{ year: 2010, birthrate: 13 },
-		{ year: 2015, birthrate: 12.4 }
-	];
-
-	const xTicks = [1990, 1995, 2000, 2005, 2010, 2015];
-	const yTicks = [0, 5, 10, 15, 20];
-	const padding = { top: 20, right: 15, bottom: 20, left: 25 };
-
-	let width = 500;
-	let height = 200;
-
-	function formatMobile(tick) {
-		return "'" + tick.toString().slice(-2);
-	}
-
-	$: xScale = scaleLinear()
-		.domain([0, xTicks.length])
-		.range([padding.left, width - padding.right]);
-
-	$: yScale = scaleLinear()
-		.domain([0, Math.max.apply(null, yTicks)])
-		.range([height - padding.bottom, padding.top]);
-
-	$: innerWidth = width - (padding.left + padding.right);
-	$: barWidth = innerWidth / xTicks.length;
-</script>
-
-<h2>US birthrate by year</h2>
-
-<div class="chart" bind:clientWidth={width} bind:clientHeight={height}>
-	<svg>
-		<!-- y axis -->
-		<g class="axis y-axis">
-			{#each yTicks as tick}
-				<g class="tick tick-{tick}" transform="translate(0, {yScale(tick)})">
-					<line x2="100%" />
-					<text y="-4">{tick} {tick === 20 ? ' per 1,000 population' : ''}</text>
-				</g>
-			{/each}
-		</g>
-
-		<!-- x axis -->
-		<g class="axis x-axis">
-			{#each points as point, i}
-				<g class="tick" transform="translate({xScale(i)},{height})">
-					<text x={barWidth / 2} y="-4">{width > 380 ? point.year : formatMobile(point.year)}</text>
-				</g>
-			{/each}
-		</g>
-
-		<g class="bars">
-			{#each points as point, i}
-				<rect
-					x={xScale(i) + 2}
-					y={yScale(point.birthrate)}
-					width={barWidth - 4}
-					height={yScale(0) - yScale(point.birthrate)}
-				/>
-			{/each}
-		</g>
-	</svg>
-</div>
-
-<style>
-	h2 {
-		text-align: center;
-	}
-
-	.chart {
-		width: 100%;
-		max-width: 500px;
-		margin: 0 auto;
-	}
-
-	svg {
-		position: relative;
-		width: 100%;
-		height: 200px;
-	}
-
-	.tick {
-		font-family: Helvetica, Arial;
-		font-size: 0.725em;
-		font-weight: 200;
-	}
-
-	.tick line {
-		stroke: #e2e2e2;
-		stroke-dasharray: 2;
-	}
-
-	.tick text {
-		fill: #ccc;
-		text-anchor: start;
-	}
-
-	.tick.tick-0 line {
-		stroke-dasharray: 0;
-	}
-
-	.x-axis .tick text {
-		text-anchor: middle;
-	}
-
-	.bars rect {
-		fill: #a11;
-		stroke: none;
-		opacity: 0.65;
-	}
-</style>
diff --git a/documentation/examples/12-svg/02-bar-chart/meta.json b/documentation/examples/12-svg/02-bar-chart/meta.json
deleted file mode 100644
index d72e5a95a2..0000000000
--- a/documentation/examples/12-svg/02-bar-chart/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Bar chart"
-}
diff --git a/documentation/examples/12-svg/03-area-chart/App.svelte b/documentation/examples/12-svg/03-area-chart/App.svelte
deleted file mode 100644
index fb79b04878..0000000000
--- a/documentation/examples/12-svg/03-area-chart/App.svelte
+++ /dev/null
@@ -1,117 +0,0 @@
-<script>
-	import { scaleLinear } from 'd3-scale';
-	import points from './data.js';
-
-	const yTicks = [0, 2, 4, 6, 8];
-	const xTicks = [1980, 1990, 2000, 2010];
-	const padding = { top: 20, right: 15, bottom: 20, left: 25 };
-
-	let width = 500;
-	let height = 200;
-
-	$: xScale = scaleLinear()
-		.domain([minX, maxX])
-		.range([padding.left, width - padding.right]);
-
-	$: yScale = scaleLinear()
-		.domain([Math.min.apply(null, yTicks), Math.max.apply(null, yTicks)])
-		.range([height - padding.bottom, padding.top]);
-
-	$: minX = points[0].x;
-	$: maxX = points[points.length - 1].x;
-	$: path = `M${points.map((p) => `${xScale(p.x)},${yScale(p.y)}`).join('L')}`;
-	$: area = `${path}L${xScale(maxX)},${yScale(0)}L${xScale(minX)},${yScale(0)}Z`;
-
-	function formatMobile(tick) {
-		return "'" + tick.toString().slice(-2);
-	}
-</script>
-
-<h2>Arctic sea ice minimum</h2>
-
-<div class="chart" bind:clientWidth={width} bind:clientHeight={height}>
-	<svg>
-		<!-- y axis -->
-		<g class="axis y-axis" transform="translate(0, {padding.top})">
-			{#each yTicks as tick}
-				<g class="tick tick-{tick}" transform="translate(0, {yScale(tick) - padding.bottom})">
-					<line x2="100%" />
-					<text y="-4">{tick} {tick === 8 ? ' million sq km' : ''}</text>
-				</g>
-			{/each}
-		</g>
-
-		<!-- x axis -->
-		<g class="axis x-axis">
-			{#each xTicks as tick}
-				<g class="tick tick-{tick}" transform="translate({xScale(tick)},{height})">
-					<line y1="-{height}" y2="-{padding.bottom}" x1="0" x2="0" />
-					<text y="-2">{width > 380 ? tick : formatMobile(tick)}</text>
-				</g>
-			{/each}
-		</g>
-
-		<!-- data -->
-		<path class="path-area" d={area} />
-		<path class="path-line" d={path} />
-	</svg>
-</div>
-
-<p>
-	Average September extent. Source: <a href="https://climate.nasa.gov/vital-signs/arctic-sea-ice/"
-		>NSIDC/NASA</a
-	>
-</p>
-
-<style>
-	.chart,
-	h2,
-	p {
-		width: 100%;
-		max-width: 500px;
-		margin-left: auto;
-		margin-right: auto;
-	}
-
-	svg {
-		position: relative;
-		width: 100%;
-		height: 200px;
-		overflow: visible;
-	}
-
-	.tick {
-		font-size: 0.725em;
-		font-weight: 200;
-	}
-
-	.tick line {
-		stroke: #888;
-		stroke-dasharray: 2;
-	}
-
-	.tick text {
-		fill: #888;
-		text-anchor: start;
-	}
-
-	.tick.tick-0 line {
-		stroke-dasharray: 0;
-	}
-
-	.x-axis .tick text {
-		text-anchor: middle;
-	}
-
-	.path-line {
-		fill: none;
-		stroke: rgb(0, 100, 100);
-		stroke-linejoin: round;
-		stroke-linecap: round;
-		stroke-width: 2;
-	}
-
-	.path-area {
-		fill: rgba(0, 100, 100, 0.2);
-	}
-</style>
diff --git a/documentation/examples/12-svg/03-area-chart/data.js b/documentation/examples/12-svg/03-area-chart/data.js
deleted file mode 100644
index e50c29c9ac..0000000000
--- a/documentation/examples/12-svg/03-area-chart/data.js
+++ /dev/null
@@ -1,45 +0,0 @@
-export default [
-	{ x: 1979, y: 7.19 },
-	{ x: 1980, y: 7.83 },
-	{ x: 1981, y: 7.24 },
-	{ x: 1982, y: 7.44 },
-	{ x: 1983, y: 7.51 },
-	{ x: 1984, y: 7.1 },
-	{ x: 1985, y: 6.91 },
-	{ x: 1986, y: 7.53 },
-	{ x: 1987, y: 7.47 },
-	{ x: 1988, y: 7.48 },
-	{ x: 1989, y: 7.03 },
-	{ x: 1990, y: 6.23 },
-	{ x: 1991, y: 6.54 },
-	{ x: 1992, y: 7.54 },
-	{ x: 1993, y: 6.5 },
-	{ x: 1994, y: 7.18 },
-	{ x: 1995, y: 6.12 },
-	{ x: 1996, y: 7.87 },
-	{ x: 1997, y: 6.73 },
-	{ x: 1998, y: 6.55 },
-	{ x: 1999, y: 6.23 },
-	{ x: 2000, y: 6.31 },
-	{ x: 2001, y: 6.74 },
-	{ x: 2002, y: 5.95 },
-	{ x: 2003, y: 6.13 },
-	{ x: 2004, y: 6.04 },
-	{ x: 2005, y: 5.56 },
-	{ x: 2006, y: 5.91 },
-	{ x: 2007, y: 4.29 },
-	{ x: 2008, y: 4.72 },
-	{ x: 2009, y: 5.38 },
-	{ x: 2010, y: 4.92 },
-	{ x: 2011, y: 4.61 },
-	{ x: 2012, y: 3.62 },
-	{ x: 2013, y: 5.35 },
-	{ x: 2014, y: 5.28 },
-	{ x: 2015, y: 4.63 },
-	{ x: 2016, y: 4.72 },
-	{ x: 2017, y: 4.82 },
-	{ x: 2018, y: 4.79 },
-	{ x: 2019, y: 4.36 },
-	{ x: 2020, y: 4 },
-	{ x: 2021, y: 4.92 }
-];
diff --git a/documentation/examples/12-svg/03-area-chart/meta.json b/documentation/examples/12-svg/03-area-chart/meta.json
deleted file mode 100644
index fa86f9a990..0000000000
--- a/documentation/examples/12-svg/03-area-chart/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Area chart"
-}
diff --git a/documentation/examples/12-svg/04-scatterplot/App.svelte b/documentation/examples/12-svg/04-scatterplot/App.svelte
deleted file mode 100644
index 186193b119..0000000000
--- a/documentation/examples/12-svg/04-scatterplot/App.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script>
-	import Scatterplot from './Scatterplot.svelte';
-	import data from './data.js';
-</script>
-
-<div class="chart">
-	<h2>Anscombe's quartet</h2>
-
-	<Scatterplot points={data.a} />
-	<Scatterplot points={data.b} />
-	<Scatterplot points={data.c} />
-	<Scatterplot points={data.d} />
-</div>
-
-<style>
-	.chart {
-		width: 100%;
-		max-width: 640px;
-		height: calc(100% - 4em);
-		min-height: 280px;
-		max-height: 480px;
-		margin: 0 auto;
-	}
-</style>
diff --git a/documentation/examples/12-svg/04-scatterplot/Scatterplot.svelte b/documentation/examples/12-svg/04-scatterplot/Scatterplot.svelte
deleted file mode 100644
index 9c0a96efc5..0000000000
--- a/documentation/examples/12-svg/04-scatterplot/Scatterplot.svelte
+++ /dev/null
@@ -1,91 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-	import { scaleLinear } from 'd3-scale';
-
-	export let points;
-
-	let svg;
-	let width = 500;
-	let height = 200;
-
-	const padding = { top: 20, right: 40, bottom: 40, left: 25 };
-
-	$: xScale = scaleLinear()
-		.domain([0, 20])
-		.range([padding.left, width - padding.right]);
-
-	$: yScale = scaleLinear()
-		.domain([0, 12])
-		.range([height - padding.bottom, padding.top]);
-
-	$: xTicks = width > 180 ? [0, 4, 8, 12, 16, 20] : [0, 10, 20];
-
-	$: yTicks = height > 180 ? [0, 2, 4, 6, 8, 10, 12] : [0, 4, 8, 12];
-
-	onMount(resize);
-
-	function resize() {
-		({ width, height } = svg.getBoundingClientRect());
-	}
-</script>
-
-<svelte:window on:resize={resize} />
-
-<svg bind:this={svg}>
-	<!-- y axis -->
-	<g class="axis y-axis">
-		{#each yTicks as tick}
-			<g class="tick tick-{tick}" transform="translate(0, {yScale(tick)})">
-				<line x1={padding.left} x2={xScale(22)} />
-				<text x={padding.left - 8} y="+4">{tick}</text>
-			</g>
-		{/each}
-	</g>
-
-	<!-- x axis -->
-	<g class="axis x-axis">
-		{#each xTicks as tick}
-			<g class="tick" transform="translate({xScale(tick)},0)">
-				<line y1={yScale(0)} y2={yScale(13)} />
-				<text y={height - padding.bottom + 16}>{tick}</text>
-			</g>
-		{/each}
-	</g>
-
-	<!-- data -->
-	{#each points as point}
-		<circle cx={xScale(point.x)} cy={yScale(point.y)} r="5" />
-	{/each}
-</svg>
-
-<style>
-	svg {
-		width: 50%;
-		height: 50%;
-		float: left;
-	}
-
-	circle {
-		fill: orange;
-		fill-opacity: 0.6;
-		stroke: rgba(0, 0, 0, 0.5);
-	}
-
-	.tick line {
-		stroke: #ddd;
-		stroke-dasharray: 2;
-	}
-
-	text {
-		font-size: 12px;
-		fill: #999;
-	}
-
-	.x-axis text {
-		text-anchor: middle;
-	}
-
-	.y-axis text {
-		text-anchor: end;
-	}
-</style>
diff --git a/documentation/examples/12-svg/04-scatterplot/data.js b/documentation/examples/12-svg/04-scatterplot/data.js
deleted file mode 100644
index 71ce9dffe1..0000000000
--- a/documentation/examples/12-svg/04-scatterplot/data.js
+++ /dev/null
@@ -1,54 +0,0 @@
-export default {
-	a: [
-		{ x: 10, y: 8.04 },
-		{ x: 8, y: 6.95 },
-		{ x: 13, y: 7.58 },
-		{ x: 9, y: 8.81 },
-		{ x: 11, y: 8.33 },
-		{ x: 14, y: 9.96 },
-		{ x: 6, y: 7.24 },
-		{ x: 4, y: 4.26 },
-		{ x: 12, y: 10.84 },
-		{ x: 7, y: 4.82 },
-		{ x: 5, y: 5.68 }
-	],
-	b: [
-		{ x: 10, y: 9.14 },
-		{ x: 8, y: 8.14 },
-		{ x: 13, y: 8.74 },
-		{ x: 9, y: 8.77 },
-		{ x: 11, y: 9.26 },
-		{ x: 14, y: 8.1 },
-		{ x: 6, y: 6.13 },
-		{ x: 4, y: 3.1 },
-		{ x: 12, y: 9.13 },
-		{ x: 7, y: 7.26 },
-		{ x: 5, y: 4.74 }
-	],
-	c: [
-		{ x: 10, y: 7.46 },
-		{ x: 8, y: 6.77 },
-		{ x: 13, y: 12.74 },
-		{ x: 9, y: 7.11 },
-		{ x: 11, y: 7.81 },
-		{ x: 14, y: 8.84 },
-		{ x: 6, y: 6.08 },
-		{ x: 4, y: 5.39 },
-		{ x: 12, y: 8.15 },
-		{ x: 7, y: 6.42 },
-		{ x: 5, y: 5.73 }
-	],
-	d: [
-		{ x: 8, y: 6.58 },
-		{ x: 8, y: 5.76 },
-		{ x: 8, y: 7.71 },
-		{ x: 8, y: 8.84 },
-		{ x: 8, y: 8.47 },
-		{ x: 8, y: 7.04 },
-		{ x: 8, y: 5.25 },
-		{ x: 19, y: 12.5 },
-		{ x: 8, y: 5.56 },
-		{ x: 8, y: 7.91 },
-		{ x: 8, y: 6.89 }
-	]
-};
diff --git a/documentation/examples/12-svg/04-scatterplot/meta.json b/documentation/examples/12-svg/04-scatterplot/meta.json
deleted file mode 100644
index df11c668a9..0000000000
--- a/documentation/examples/12-svg/04-scatterplot/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Scatterplot"
-}
diff --git a/documentation/examples/12-svg/05-svg-transitions/App.svelte b/documentation/examples/12-svg/05-svg-transitions/App.svelte
deleted file mode 100644
index 3a4b1710c8..0000000000
--- a/documentation/examples/12-svg/05-svg-transitions/App.svelte
+++ /dev/null
@@ -1,68 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { fade, draw, fly } from 'svelte/transition';
-	import { expand } from './custom-transitions.js';
-	import { inner, outer } from './shape.js';
-
-	let visible = true;
-</script>
-
-{#if visible}
-	<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 103 124">
-		<g out:fade={{ duration: 200 }} opacity="0.2">
-			<path
-				in:expand={{ duration: 400, delay: 1000, easing: quintOut }}
-				style="stroke: #ff3e00; fill: #ff3e00; stroke-width: 50;"
-				d={outer}
-			/>
-			<path in:draw={{ duration: 1000 }} style="stroke:#ff3e00; stroke-width: 1.5" d={inner} />
-		</g>
-	</svg>
-
-	<div class="centered" out:fly={{ y: -20, duration: 800 }}>
-		{#each 'SVELTE' as char, i}
-			<span in:fade|global={{ delay: 1000 + i * 150, duration: 800 }}>{char}</span>
-		{/each}
-	</div>
-{/if}
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	toggle me
-</label>
-
-<link href="https://fonts.googleapis.com/css?family=Overpass:100,400" rel="stylesheet" />
-
-<style>
-	svg {
-		width: 100%;
-		height: 100%;
-	}
-
-	path {
-		fill: white;
-		opacity: 1;
-	}
-
-	label {
-		position: absolute;
-		top: 1em;
-		left: 1em;
-	}
-
-	.centered {
-		font-size: 20vw;
-		position: absolute;
-		left: 50%;
-		top: 50%;
-		transform: translate(-50%, -50%);
-		font-family: 'Overpass';
-		letter-spacing: 0.12em;
-		color: #676778;
-		font-weight: 400;
-	}
-
-	.centered span {
-		will-change: filter;
-	}
-</style>
diff --git a/documentation/examples/12-svg/05-svg-transitions/custom-transitions.js b/documentation/examples/12-svg/05-svg-transitions/custom-transitions.js
deleted file mode 100644
index 58b9198a8a..0000000000
--- a/documentation/examples/12-svg/05-svg-transitions/custom-transitions.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { cubicOut } from 'svelte/easing';
-
-export function expand(node, params) {
-	const { delay = 0, duration = 400, easing = cubicOut } = params;
-
-	const w = parseFloat(getComputedStyle(node).strokeWidth);
-
-	return {
-		delay,
-		duration,
-		easing,
-		css: (t) => `opacity: ${t}; stroke-width: ${t * w}`
-	};
-}
diff --git a/documentation/examples/12-svg/05-svg-transitions/meta.json b/documentation/examples/12-svg/05-svg-transitions/meta.json
deleted file mode 100644
index 79a57977d7..0000000000
--- a/documentation/examples/12-svg/05-svg-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "SVG transitions"
-}
diff --git a/documentation/examples/12-svg/05-svg-transitions/shape.js b/documentation/examples/12-svg/05-svg-transitions/shape.js
deleted file mode 100644
index 3a85ab44ba..0000000000
--- a/documentation/examples/12-svg/05-svg-transitions/shape.js
+++ /dev/null
@@ -1,2 +0,0 @@
-export const inner = `M45.41,108.86A21.81,21.81,0,0,1,22,100.18,20.2,20.2,0,0,1,18.53,84.9a19,19,0,0,1,.65-2.57l.52-1.58,1.41,1a35.32,35.32,0,0,0,10.75,5.37l1,.31-.1,1a6.2,6.2,0,0,0,1.11,4.08A6.57,6.57,0,0,0,41,95.19a6,6,0,0,0,1.68-.74L70.11,76.94a5.76,5.76,0,0,0,2.59-3.83,6.09,6.09,0,0,0-1-4.6,6.58,6.58,0,0,0-7.06-2.62,6.21,6.21,0,0,0-1.69.74L52.43,73.31a19.88,19.88,0,0,1-5.58,2.45,21.82,21.82,0,0,1-23.43-8.68A20.2,20.2,0,0,1,20,51.8a19,19,0,0,1,8.56-12.7L56,21.59a19.88,19.88,0,0,1,5.58-2.45A21.81,21.81,0,0,1,85,27.82,20.2,20.2,0,0,1,88.47,43.1a19,19,0,0,1-.65,2.57l-.52,1.58-1.41-1a35.32,35.32,0,0,0-10.75-5.37l-1-.31.1-1a6.2,6.2,0,0,0-1.11-4.08,6.57,6.57,0,0,0-7.06-2.62,6,6,0,0,0-1.68.74L36.89,51.06a5.71,5.71,0,0,0-2.58,3.83,6,6,0,0,0,1,4.6,6.58,6.58,0,0,0,7.06,2.62,6.21,6.21,0,0,0,1.69-.74l10.48-6.68a19.88,19.88,0,0,1,5.58-2.45,21.82,21.82,0,0,1,23.43,8.68A20.2,20.2,0,0,1,87,76.2a19,19,0,0,1-8.56,12.7L51,106.41a19.88,19.88,0,0,1-5.58,2.45`;
-export const outer = `M65,34 L37,52 A1 1 0 0 0 44 60 L70.5,44.5 A1 1 0 0 0 65,34Z M64,67 L36,85 A1 1 0 0 0 42 94 L68,77.5 A1 1 0 0 0 64,67Z`;
diff --git a/documentation/examples/12-svg/meta.json b/documentation/examples/12-svg/meta.json
deleted file mode 100644
index cba3160b14..0000000000
--- a/documentation/examples/12-svg/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "SVG"
-}
diff --git a/documentation/examples/13-actions/00-actions/App.svelte b/documentation/examples/13-actions/00-actions/App.svelte
deleted file mode 100644
index fcd0ca6ae3..0000000000
--- a/documentation/examples/13-actions/00-actions/App.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script>
-	import { clickOutside } from './click_outside.js';
-
-	let showModal = true;
-</script>
-
-<button on:click={() => (showModal = true)}>Show Modal</button>
-{#if showModal}
-	<div class="box" use:clickOutside on:outclick={() => (showModal = false)}>Click outside me!</div>
-{/if}
-
-<style>
-	.box {
-		--width: 100px;
-		--height: 100px;
-		position: absolute;
-		width: var(--width);
-		height: var(--height);
-		left: calc(50% - var(--width) / 2);
-		top: calc(50% - var(--height) / 2);
-		display: flex;
-		align-items: center;
-		padding: 8px;
-		border-radius: 4px;
-		background-color: #ff3e00;
-		color: #fff;
-		text-align: center;
-		font-weight: bold;
-	}
-</style>
diff --git a/documentation/examples/13-actions/00-actions/click_outside.js b/documentation/examples/13-actions/00-actions/click_outside.js
deleted file mode 100644
index 3a9a561593..0000000000
--- a/documentation/examples/13-actions/00-actions/click_outside.js
+++ /dev/null
@@ -1,15 +0,0 @@
-export function clickOutside(node) {
-	const handleClick = (event) => {
-		if (!node.contains(event.target)) {
-			node.dispatchEvent(new CustomEvent('outclick'));
-		}
-	};
-
-	document.addEventListener('click', handleClick, true);
-
-	return {
-		destroy() {
-			document.removeEventListener('click', handleClick, true);
-		}
-	};
-}
diff --git a/documentation/examples/13-actions/00-actions/meta.json b/documentation/examples/13-actions/00-actions/meta.json
deleted file mode 100644
index fb4dc640dd..0000000000
--- a/documentation/examples/13-actions/00-actions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "The use directive"
-}
diff --git a/documentation/examples/13-actions/01-adding-parameters-to-actions/App.svelte b/documentation/examples/13-actions/01-adding-parameters-to-actions/App.svelte
deleted file mode 100644
index 23cc9f2f9e..0000000000
--- a/documentation/examples/13-actions/01-adding-parameters-to-actions/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import { longpress } from './longpress.js';
-
-	let pressed = false;
-	let duration = 2000;
-</script>
-
-<label>
-	<input type="range" bind:value={duration} max={2000} step={100} />
-	{duration}ms
-</label>
-
-<button
-	use:longpress={duration}
-	on:longpress={() => (pressed = true)}
-	on:mouseenter={() => (pressed = false)}>press and hold</button
->
-
-{#if pressed}
-	<p>congratulations, you pressed and held for {duration}ms</p>
-{/if}
diff --git a/documentation/examples/13-actions/01-adding-parameters-to-actions/longpress.js b/documentation/examples/13-actions/01-adding-parameters-to-actions/longpress.js
deleted file mode 100644
index 240ecd0028..0000000000
--- a/documentation/examples/13-actions/01-adding-parameters-to-actions/longpress.js
+++ /dev/null
@@ -1,26 +0,0 @@
-export function longpress(node, duration) {
-	let timer;
-
-	const handleMousedown = () => {
-		timer = setTimeout(() => {
-			node.dispatchEvent(new CustomEvent('longpress'));
-		}, duration);
-	};
-
-	const handleMouseup = () => {
-		clearTimeout(timer);
-	};
-
-	node.addEventListener('mousedown', handleMousedown);
-	node.addEventListener('mouseup', handleMouseup);
-
-	return {
-		update(newDuration) {
-			duration = newDuration;
-		},
-		destroy() {
-			node.removeEventListener('mousedown', handleMousedown);
-			node.removeEventListener('mouseup', handleMouseup);
-		}
-	};
-}
diff --git a/documentation/examples/13-actions/01-adding-parameters-to-actions/meta.json b/documentation/examples/13-actions/01-adding-parameters-to-actions/meta.json
deleted file mode 100644
index 8a857ebcbb..0000000000
--- a/documentation/examples/13-actions/01-adding-parameters-to-actions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Adding parameters"
-}
diff --git a/documentation/examples/13-actions/03-actions-pannable/App.svelte b/documentation/examples/13-actions/03-actions-pannable/App.svelte
deleted file mode 100644
index 5fdce1131a..0000000000
--- a/documentation/examples/13-actions/03-actions-pannable/App.svelte
+++ /dev/null
@@ -1,55 +0,0 @@
-<script>
-	import { spring } from 'svelte/motion';
-	import { pannable } from './pannable.js';
-
-	const coords = spring(
-		{ x: 0, y: 0 },
-		{
-			stiffness: 0.2,
-			damping: 0.4
-		}
-	);
-
-	function handlePanStart() {
-		coords.stiffness = coords.damping = 1;
-	}
-
-	function handlePanMove(event) {
-		coords.update(($coords) => ({
-			x: $coords.x + event.detail.dx,
-			y: $coords.y + event.detail.dy
-		}));
-	}
-
-	function handlePanEnd(event) {
-		coords.stiffness = 0.2;
-		coords.damping = 0.4;
-		coords.set({ x: 0, y: 0 });
-	}
-</script>
-
-<div
-	class="box"
-	use:pannable
-	on:panstart={handlePanStart}
-	on:panmove={handlePanMove}
-	on:panend={handlePanEnd}
-	style="transform:
-		translate({$coords.x}px,{$coords.y}px)
-		rotate({$coords.x * 0.2}deg)"
-/>
-
-<style>
-	.box {
-		--width: 100px;
-		--height: 100px;
-		position: absolute;
-		width: var(--width);
-		height: var(--height);
-		left: calc(50% - var(--width) / 2);
-		top: calc(50% - var(--height) / 2);
-		border-radius: 4px;
-		background-color: #ff3e00;
-		cursor: move;
-	}
-</style>
diff --git a/documentation/examples/13-actions/03-actions-pannable/meta.json b/documentation/examples/13-actions/03-actions-pannable/meta.json
deleted file mode 100644
index 3041762ecd..0000000000
--- a/documentation/examples/13-actions/03-actions-pannable/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "A more complex action"
-}
diff --git a/documentation/examples/13-actions/03-actions-pannable/pannable.js b/documentation/examples/13-actions/03-actions-pannable/pannable.js
deleted file mode 100644
index d7d4766627..0000000000
--- a/documentation/examples/13-actions/03-actions-pannable/pannable.js
+++ /dev/null
@@ -1,53 +0,0 @@
-export function pannable(node) {
-	let x;
-	let y;
-
-	function handleMousedown(event) {
-		x = event.clientX;
-		y = event.clientY;
-
-		node.dispatchEvent(
-			new CustomEvent('panstart', {
-				detail: { x, y }
-			})
-		);
-
-		window.addEventListener('mousemove', handleMousemove);
-		window.addEventListener('mouseup', handleMouseup);
-	}
-
-	function handleMousemove(event) {
-		const dx = event.clientX - x;
-		const dy = event.clientY - y;
-		x = event.clientX;
-		y = event.clientY;
-
-		node.dispatchEvent(
-			new CustomEvent('panmove', {
-				detail: { x, y, dx, dy }
-			})
-		);
-	}
-
-	function handleMouseup(event) {
-		x = event.clientX;
-		y = event.clientY;
-
-		node.dispatchEvent(
-			new CustomEvent('panend', {
-				detail: { x, y }
-			})
-		);
-
-		window.removeEventListener('mousemove', handleMousemove);
-		window.removeEventListener('mouseup', handleMouseup);
-	}
-
-	node.addEventListener('mousedown', handleMousedown);
-
-	return {
-		destroy() {
-			node.removeEventListener('mousedown', handleMousedown);
-		}
-	};
-}
diff --git a/documentation/examples/13-actions/meta.json b/documentation/examples/13-actions/meta.json
deleted file mode 100644
index 3943482e82..0000000000
--- a/documentation/examples/13-actions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Actions"
-}
diff --git a/documentation/examples/14-classes/00-classes/App.svelte b/documentation/examples/14-classes/00-classes/App.svelte
deleted file mode 100644
index 395ed8ee5e..0000000000
--- a/documentation/examples/14-classes/00-classes/App.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	let current = 'foo';
-</script>
-
-<button class:active={current === 'foo'} on:click={() => (current = 'foo')}>foo</button>
-
-<button class:active={current === 'bar'} on:click={() => (current = 'bar')}>bar</button>
-
-<button class:active={current === 'baz'} on:click={() => (current = 'baz')}>baz</button>
-
-<style>
-	button {
-		display: block;
-	}
-
-	.active {
-		background-color: #ff3e00;
-		color: white;
-	}
-</style>
diff --git a/documentation/examples/14-classes/00-classes/meta.json b/documentation/examples/14-classes/00-classes/meta.json
deleted file mode 100644
index 82fca54c3c..0000000000
--- a/documentation/examples/14-classes/00-classes/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "The class directive"
-}
diff --git a/documentation/examples/14-classes/01-class-shorthand/App.svelte b/documentation/examples/14-classes/01-class-shorthand/App.svelte
deleted file mode 100644
index ad39916ce5..0000000000
--- a/documentation/examples/14-classes/01-class-shorthand/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let big = false;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={big} />
-	big
-</label>
-
-<div class:big>
-	some {big ? 'big' : 'small'} text
-</div>
-
-<style>
-	.big {
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/examples/14-classes/01-class-shorthand/meta.json b/documentation/examples/14-classes/01-class-shorthand/meta.json
deleted file mode 100644
index ee98f80149..0000000000
--- a/documentation/examples/14-classes/01-class-shorthand/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Shorthand class directive"
-}
diff --git a/documentation/examples/14-classes/meta.json b/documentation/examples/14-classes/meta.json
deleted file mode 100644
index b966406a4e..0000000000
--- a/documentation/examples/14-classes/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Classes"
-}
diff --git a/documentation/examples/15-composition/00-slots/App.svelte b/documentation/examples/15-composition/00-slots/App.svelte
deleted file mode 100644
index 986bdc01c5..0000000000
--- a/documentation/examples/15-composition/00-slots/App.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
diff --git a/documentation/examples/15-composition/00-slots/Box.svelte b/documentation/examples/15-composition/00-slots/Box.svelte
deleted file mode 100644
index 2d0a378d25..0000000000
--- a/documentation/examples/15-composition/00-slots/Box.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="box">
-	<slot />
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/examples/15-composition/00-slots/meta.json b/documentation/examples/15-composition/00-slots/meta.json
deleted file mode 100644
index 78e029ae70..0000000000
--- a/documentation/examples/15-composition/00-slots/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Slots"
-}
diff --git a/documentation/examples/15-composition/01-slot-fallbacks/App.svelte b/documentation/examples/15-composition/01-slot-fallbacks/App.svelte
deleted file mode 100644
index 708428d4d8..0000000000
--- a/documentation/examples/15-composition/01-slot-fallbacks/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
-
-<Box />
diff --git a/documentation/examples/15-composition/01-slot-fallbacks/Box.svelte b/documentation/examples/15-composition/01-slot-fallbacks/Box.svelte
deleted file mode 100644
index 8cb8128b31..0000000000
--- a/documentation/examples/15-composition/01-slot-fallbacks/Box.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<div class="box">
-	<slot>
-		<em>no content was provided</em>
-	</slot>
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/examples/15-composition/01-slot-fallbacks/meta.json b/documentation/examples/15-composition/01-slot-fallbacks/meta.json
deleted file mode 100644
index ccc7d49a93..0000000000
--- a/documentation/examples/15-composition/01-slot-fallbacks/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Slot fallbacks"
-}
diff --git a/documentation/examples/15-composition/02-named-slots/App.svelte b/documentation/examples/15-composition/02-named-slots/App.svelte
deleted file mode 100644
index ea27d75edf..0000000000
--- a/documentation/examples/15-composition/02-named-slots/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import ContactCard from './ContactCard.svelte';
-</script>
-
-<ContactCard>
-	<span slot="name"> P. Sherman </span>
-
-	<span slot="address">
-		42 Wallaby Way<br />
-		Sydney
-	</span>
-</ContactCard>
diff --git a/documentation/examples/15-composition/02-named-slots/ContactCard.svelte b/documentation/examples/15-composition/02-named-slots/ContactCard.svelte
deleted file mode 100644
index d72da2ad4c..0000000000
--- a/documentation/examples/15-composition/02-named-slots/ContactCard.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<article class="contact-card">
-	<h2>
-		<slot name="name">
-			<span class="missing">Unknown name</span>
-		</slot>
-	</h2>
-
-	<div class="address">
-		<slot name="address">
-			<span class="missing">Unknown address</span>
-		</slot>
-	</div>
-
-	<div class="email">
-		<slot name="email">
-			<span class="missing">Unknown email</span>
-		</slot>
-	</div>
-</article>
-
-<style>
-	.contact-card {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-	}
-
-	h2 {
-		padding: 0 0 0.2em 0;
-		margin: 0 0 1em 0;
-		border-bottom: 1px solid #ff3e00;
-	}
-
-	.address,
-	.email {
-		padding: 0 0 0 1.5em;
-		background: 0 0 no-repeat;
-		background-size: 20px 20px;
-		margin: 0 0 0.5em 0;
-		line-height: 1.2;
-	}
-
-	.address {
-		background-image: url(/tutorial/icons/map-marker.svg);
-	}
-	.email {
-		background-image: url(/tutorial/icons/email.svg);
-	}
-	.missing {
-		color: #999;
-	}
-</style>
diff --git a/documentation/examples/15-composition/02-named-slots/meta.json b/documentation/examples/15-composition/02-named-slots/meta.json
deleted file mode 100644
index b2f48bdaec..0000000000
--- a/documentation/examples/15-composition/02-named-slots/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Named slots"
-}
diff --git a/documentation/examples/15-composition/03-slot-props/App.svelte b/documentation/examples/15-composition/03-slot-props/App.svelte
deleted file mode 100644
index c281e61b04..0000000000
--- a/documentation/examples/15-composition/03-slot-props/App.svelte
+++ /dev/null
@@ -1,51 +0,0 @@
-<script>
-	import Hoverable from './Hoverable.svelte';
-</script>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<style>
-	div {
-		padding: 1em;
-		margin: 0 0 1em 0;
-		background-color: #eee;
-	}
-
-	.active {
-		background-color: #ff3e00;
-		color: white;
-	}
-
-	p {
-		pointer-events: none;
-		color: black;
-	}
-</style>
diff --git a/documentation/examples/15-composition/03-slot-props/Hoverable.svelte b/documentation/examples/15-composition/03-slot-props/Hoverable.svelte
deleted file mode 100644
index fbf45e4d30..0000000000
--- a/documentation/examples/15-composition/03-slot-props/Hoverable.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	let hovering;
-
-	function enter() {
-		hovering = true;
-	}
-
-	function leave() {
-		hovering = false;
-	}
-</script>
-
-<!-- svelte-ignore a11y-no-static-element-interactions -->
-<div on:mouseenter={enter} on:mouseleave={leave}>
-	<slot {hovering} />
-</div>
diff --git a/documentation/examples/15-composition/03-slot-props/meta.json b/documentation/examples/15-composition/03-slot-props/meta.json
deleted file mode 100644
index 4b28b342fa..0000000000
--- a/documentation/examples/15-composition/03-slot-props/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Slot props"
-}
diff --git a/documentation/examples/15-composition/04-conditional-slots/App.svelte b/documentation/examples/15-composition/04-conditional-slots/App.svelte
deleted file mode 100644
index feba6b18d6..0000000000
--- a/documentation/examples/15-composition/04-conditional-slots/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import Profile from './Profile.svelte';
-</script>
-
-<Profile>
-	<span slot="name">Bob</span>
-	<span slot="email">bob@email.com</span>
-</Profile>
-
-<Profile>
-	<span slot="name">Alice</span>
-	<span slot="phone">12345678</span>
-</Profile>
diff --git a/documentation/examples/15-composition/04-conditional-slots/Profile.svelte b/documentation/examples/15-composition/04-conditional-slots/Profile.svelte
deleted file mode 100644
index 963506ebca..0000000000
--- a/documentation/examples/15-composition/04-conditional-slots/Profile.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<section>
-	<div>Name</div>
-	<slot name="name" />
-	{#if $$slots.email}
-		<div>Email</div>
-		<slot name="email" />
-	{/if}
-	{#if $$slots.phone}
-		<div>Phone</div>
-		<slot name="phone" />
-	{/if}
-</section>
-
-<style>
-	section {
-		width: 200px;
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		padding: 16px;
-		box-shadow: 2px 2px 4px #dedede;
-		border: 1px solid #888;
-		margin-bottom: 16px;
-	}
-</style>
diff --git a/documentation/examples/15-composition/04-conditional-slots/meta.json b/documentation/examples/15-composition/04-conditional-slots/meta.json
deleted file mode 100644
index 26d24b0812..0000000000
--- a/documentation/examples/15-composition/04-conditional-slots/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Conditional Slots"
-}
diff --git a/documentation/examples/15-composition/05-modal/App.svelte b/documentation/examples/15-composition/05-modal/App.svelte
deleted file mode 100644
index 107affa11d..0000000000
--- a/documentation/examples/15-composition/05-modal/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	import Modal from './Modal.svelte';
-
-	let showModal = false;
-</script>
-
-<button on:click={() => (showModal = true)}> show modal </button>
-
-<Modal bind:showModal>
-	<h2 slot="header">
-		modal
-		<small><em>adjective</em> mod·al \ˈmō-dəl\</small>
-	</h2>
-
-	<ol class="definition-list">
-		<li>of or relating to modality in logic</li>
-		<li>
-			containing provisions as to the mode of procedure or the manner of taking effect —used of a
-			contract or legacy
-		</li>
-		<li>of or relating to a musical mode</li>
-		<li>of or relating to structure as opposed to substance</li>
-		<li>
-			of, relating to, or constituting a grammatical form or category characteristically indicating
-			predication
-		</li>
-		<li>of or relating to a statistical mode</li>
-	</ol>
-
-	<a href="https://www.merriam-webster.com/dictionary/modal">merriam-webster.com</a>
-</Modal>
diff --git a/documentation/examples/15-composition/05-modal/Modal.svelte b/documentation/examples/15-composition/05-modal/Modal.svelte
deleted file mode 100644
index 3b832030fe..0000000000
--- a/documentation/examples/15-composition/05-modal/Modal.svelte
+++ /dev/null
@@ -1,64 +0,0 @@
-<script>
-	export let showModal; // boolean
-
-	let dialog; // HTMLDialogElement
-
-	$: if (dialog && showModal) dialog.showModal();
-</script>
-
-<!-- svelte-ignore a11y-click-events-have-key-events a11y-no-noninteractive-element-interactions -->
-<dialog
-	bind:this={dialog}
-	on:close={() => (showModal = false)}
-	on:click|self={() => dialog.close()}
->
-	<!-- svelte-ignore a11y-no-static-element-interactions -->
-	<div on:click|stopPropagation>
-		<slot name="header" />
-		<hr />
-		<slot />
-		<hr />
-		<!-- svelte-ignore a11y-autofocus -->
-		<button autofocus on:click={() => dialog.close()}>close modal</button>
-	</div>
-</dialog>
-
-<style>
-	dialog {
-		max-width: 32em;
-		border-radius: 0.2em;
-		border: none;
-		padding: 0;
-	}
-	dialog::backdrop {
-		background: rgba(0, 0, 0, 0.3);
-	}
-	dialog > div {
-		padding: 1em;
-	}
-	dialog[open] {
-		animation: zoom 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
-	}
-	@keyframes zoom {
-		from {
-			transform: scale(0.95);
-		}
-		to {
-			transform: scale(1);
-		}
-	}
-	dialog[open]::backdrop {
-		animation: fade 0.2s ease-out;
-	}
-	@keyframes fade {
-		from {
-			opacity: 0;
-		}
-		to {
-			opacity: 1;
-		}
-	}
-	button {
-		display: block;
-	}
-</style>
diff --git a/documentation/examples/15-composition/05-modal/meta.json b/documentation/examples/15-composition/05-modal/meta.json
deleted file mode 100644
index 360dafa159..0000000000
--- a/documentation/examples/15-composition/05-modal/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Modal"
-}
diff --git a/documentation/examples/15-composition/meta.json b/documentation/examples/15-composition/meta.json
deleted file mode 100644
index 1d81c05f29..0000000000
--- a/documentation/examples/15-composition/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Component composition"
-}
diff --git a/documentation/examples/16-context/00-context-api/App.svelte b/documentation/examples/16-context/00-context-api/App.svelte
deleted file mode 100644
index d564c9eee6..0000000000
--- a/documentation/examples/16-context/00-context-api/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import Map from './Map.svelte';
-	import MapMarker from './MapMarker.svelte';
-</script>
-
-<Map lat={35} lon={-84} zoom={3.5}>
-	<MapMarker lat={37.8225} lon={-122.0024} label="Svelte Body Shaping" />
-	<MapMarker lat={33.8981} lon={-118.4169} label="Svelte Barbershop & Essentials" />
-	<MapMarker lat={29.723} lon={-95.4189} label="Svelte Waxing Studio" />
-	<MapMarker lat={28.3378} lon={-81.3966} label="Svelte 30 Nutritional Consultants" />
-	<MapMarker lat={40.6483} lon={-74.0237} label="Svelte Brands LLC" />
-	<MapMarker lat={40.6986} lon={-74.41} label="Svelte Medical Systems" />
-</Map>
diff --git a/documentation/examples/16-context/00-context-api/Map.svelte b/documentation/examples/16-context/00-context-api/Map.svelte
deleted file mode 100644
index a69d18c7fd..0000000000
--- a/documentation/examples/16-context/00-context-api/Map.svelte
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-	import { onDestroy, setContext } from 'svelte';
-	import { mapbox, key } from './mapbox.js';
-
-	setContext(key, {
-		getMap: () => map
-	});
-
-	export let lat;
-	export let lon;
-	export let zoom;
-
-	let container;
-	let map;
-
-	function load() {
-		map = new mapbox.Map({
-			container,
-			style: 'mapbox://styles/mapbox/streets-v9',
-			center: [lon, lat],
-			zoom
-		});
-	}
-
-	onDestroy(() => {
-		if (map) map.remove();
-	});
-</script>
-
-<svelte:head>
-	<link rel="stylesheet" href="https://unpkg.com/mapbox-gl/dist/mapbox-gl.css" on:load={load} />
-</svelte:head>
-
-<div bind:this={container}>
-	{#if map}
-		<slot />
-	{/if}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/examples/16-context/00-context-api/MapMarker.svelte b/documentation/examples/16-context/00-context-api/MapMarker.svelte
deleted file mode 100644
index 9c6df339cf..0000000000
--- a/documentation/examples/16-context/00-context-api/MapMarker.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { getContext } from 'svelte';
-	import { mapbox, key } from './mapbox.js';
-
-	const { getMap } = getContext(key);
-	const map = getMap();
-
-	export let lat;
-	export let lon;
-	export let label;
-
-	const popup = new mapbox.Popup({ offset: 25 }).setText(label);
-
-	const marker = new mapbox.Marker().setLngLat([lon, lat]).setPopup(popup).addTo(map);
-</script>
diff --git a/documentation/examples/16-context/00-context-api/mapbox.js b/documentation/examples/16-context/00-context-api/mapbox.js
deleted file mode 100644
index 42660d35ad..0000000000
--- a/documentation/examples/16-context/00-context-api/mapbox.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import mapbox from 'mapbox-gl';
-
-// https://docs.mapbox.com/help/glossary/access-token/
-mapbox.accessToken = MAPBOX_ACCESS_TOKEN;
-
-const key = {};
-
-export { mapbox, key };
diff --git a/documentation/examples/16-context/00-context-api/meta.json b/documentation/examples/16-context/00-context-api/meta.json
deleted file mode 100644
index f95f4c32b6..0000000000
--- a/documentation/examples/16-context/00-context-api/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "setContext and getContext"
-}
diff --git a/documentation/examples/16-context/meta.json b/documentation/examples/16-context/meta.json
deleted file mode 100644
index bb3c2c607d..0000000000
--- a/documentation/examples/16-context/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Context API"
-}
diff --git a/documentation/examples/17-special-elements/00-svelte-self/App.svelte b/documentation/examples/17-special-elements/00-svelte-self/App.svelte
deleted file mode 100644
index 52c6daf613..0000000000
--- a/documentation/examples/17-special-elements/00-svelte-self/App.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	import Folder from './Folder.svelte';
-
-	let root = [
-		{
-			type: 'folder',
-			name: 'Important work stuff',
-			files: [{ type: 'file', name: 'quarterly-results.xlsx' }]
-		},
-		{
-			type: 'folder',
-			name: 'Animal GIFs',
-			files: [
-				{
-					type: 'folder',
-					name: 'Dogs',
-					files: [
-						{ type: 'file', name: 'treadmill.gif' },
-						{ type: 'file', name: 'rope-jumping.gif' }
-					]
-				},
-				{
-					type: 'folder',
-					name: 'Goats',
-					files: [
-						{ type: 'file', name: 'parkour.gif' },
-						{ type: 'file', name: 'rampage.gif' }
-					]
-				},
-				{ type: 'file', name: 'cat-roomba.gif' },
-				{ type: 'file', name: 'duck-shuffle.gif' },
-				{ type: 'file', name: 'monkey-on-a-pig.gif' }
-			]
-		},
-		{ type: 'file', name: 'TODO.md' }
-	];
-</script>
-
-<Folder name="Home" files={root} expanded />
diff --git a/documentation/examples/17-special-elements/00-svelte-self/File.svelte b/documentation/examples/17-special-elements/00-svelte-self/File.svelte
deleted file mode 100644
index e769ab4841..0000000000
--- a/documentation/examples/17-special-elements/00-svelte-self/File.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	export let name;
-	$: type = name.slice(name.lastIndexOf('.') + 1);
-</script>
-
-<span style="background-image: url(/tutorial/icons/{type}.svg)">{name}</span>
-
-<style>
-	span {
-		padding: 0 0 0 1.5em;
-		background: 0 0.1em no-repeat;
-		background-size: 1em 1em;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/00-svelte-self/Folder.svelte b/documentation/examples/17-special-elements/00-svelte-self/Folder.svelte
deleted file mode 100644
index 356263a91c..0000000000
--- a/documentation/examples/17-special-elements/00-svelte-self/Folder.svelte
+++ /dev/null
@@ -1,55 +0,0 @@
-<script>
-	import File from './File.svelte';
-	import { slide } from 'svelte/transition';
-
-	export let expanded = false;
-	export let name;
-	export let files;
-
-	function toggle() {
-		expanded = !expanded;
-	}
-</script>
-
-<button class:expanded on:click={toggle}>{name}</button>
-
-{#if expanded}
-	<ul transition:slide={{ duration: 300 }}>
-		{#each files as file}
-			<li>
-				{#if file.type === 'folder'}
-					<svelte:self {...file} />
-				{:else}
-					<File {...file} />
-				{/if}
-			</li>
-		{/each}
-	</ul>
-{/if}
-
-<style>
-	button {
-		padding: 0 0 0 1.5em;
-		background: url(/tutorial/icons/folder.svg) 0 0.1em no-repeat;
-		background-size: 1em 1em;
-		font-weight: bold;
-		cursor: pointer;
-		border: none;
-		font-size: 14px;
-	}
-
-	.expanded {
-		background-image: url(/tutorial/icons/folder-open.svg);
-	}
-
-	ul {
-		padding: 0.2em 0 0 0.5em;
-		margin: 0 0 0 0.5em;
-		list-style: none;
-		border-left: 1px solid #eee;
-	}
-
-	li {
-		padding: 0.2em 0;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/00-svelte-self/meta.json b/documentation/examples/17-special-elements/00-svelte-self/meta.json
deleted file mode 100644
index db833f9acd..0000000000
--- a/documentation/examples/17-special-elements/00-svelte-self/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:self>"
-}
diff --git a/documentation/examples/17-special-elements/01-svelte-component/App.svelte b/documentation/examples/17-special-elements/01-svelte-component/App.svelte
deleted file mode 100644
index 69e51253fc..0000000000
--- a/documentation/examples/17-special-elements/01-svelte-component/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import RedThing from './RedThing.svelte';
-	import GreenThing from './GreenThing.svelte';
-	import BlueThing from './BlueThing.svelte';
-
-	const options = [
-		{ color: 'red', component: RedThing },
-		{ color: 'green', component: GreenThing },
-		{ color: 'blue', component: BlueThing }
-	];
-
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option.color}</option>
-	{/each}
-</select>
-
-<svelte:component this={selected.component} />
diff --git a/documentation/examples/17-special-elements/01-svelte-component/BlueThing.svelte b/documentation/examples/17-special-elements/01-svelte-component/BlueThing.svelte
deleted file mode 100644
index 551f1afbbe..0000000000
--- a/documentation/examples/17-special-elements/01-svelte-component/BlueThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Blue thing</strong>
-
-<style>
-	strong {
-		color: blue;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/01-svelte-component/GreenThing.svelte b/documentation/examples/17-special-elements/01-svelte-component/GreenThing.svelte
deleted file mode 100644
index a224720e6c..0000000000
--- a/documentation/examples/17-special-elements/01-svelte-component/GreenThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Green thing</strong>
-
-<style>
-	strong {
-		color: green;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/01-svelte-component/RedThing.svelte b/documentation/examples/17-special-elements/01-svelte-component/RedThing.svelte
deleted file mode 100644
index 9774363c1b..0000000000
--- a/documentation/examples/17-special-elements/01-svelte-component/RedThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Red thing</strong>
-
-<style>
-	strong {
-		color: red;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/01-svelte-component/meta.json b/documentation/examples/17-special-elements/01-svelte-component/meta.json
deleted file mode 100644
index 227316f679..0000000000
--- a/documentation/examples/17-special-elements/01-svelte-component/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:component>"
-}
diff --git a/documentation/examples/17-special-elements/02-svelte-element/App.svelte b/documentation/examples/17-special-elements/02-svelte-element/App.svelte
deleted file mode 100644
index 068f7b3c4f..0000000000
--- a/documentation/examples/17-special-elements/02-svelte-element/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	const options = ['h1', 'h3', 'p'];
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option}</option>
-	{/each}
-</select>
-
-<svelte:element this={selected}>I'm a {selected} tag</svelte:element>
diff --git a/documentation/examples/17-special-elements/02-svelte-element/meta.json b/documentation/examples/17-special-elements/02-svelte-element/meta.json
deleted file mode 100644
index 29ca542e1a..0000000000
--- a/documentation/examples/17-special-elements/02-svelte-element/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:element>"
-}
diff --git a/documentation/examples/17-special-elements/03-svelte-window/App.svelte b/documentation/examples/17-special-elements/03-svelte-window/App.svelte
deleted file mode 100644
index 8ccc87d2b3..0000000000
--- a/documentation/examples/17-special-elements/03-svelte-window/App.svelte
+++ /dev/null
@@ -1,42 +0,0 @@
-<script>
-	let key;
-	let keyCode;
-
-	function handleKeydown(event) {
-		key = event.key;
-		keyCode = event.keyCode;
-	}
-</script>
-
-<svelte:window on:keydown={handleKeydown} />
-
-<div style="text-align: center">
-	{#if key}
-		<kbd>{key === ' ' ? 'Space' : key}</kbd>
-		<p>{keyCode}</p>
-	{:else}
-		<p>Focus this window and press any key</p>
-	{/if}
-</div>
-
-<style>
-	div {
-		display: flex;
-		height: 100%;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-	}
-
-	kbd {
-		background-color: #eee;
-		border-radius: 4px;
-		font-size: 6em;
-		padding: 0.2em 0.5em;
-		border-top: 5px solid rgba(255, 255, 255, 0.5);
-		border-left: 5px solid rgba(255, 255, 255, 0.5);
-		border-right: 5px solid rgba(0, 0, 0, 0.2);
-		border-bottom: 5px solid rgba(0, 0, 0, 0.2);
-		color: #555;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/03-svelte-window/meta.json b/documentation/examples/17-special-elements/03-svelte-window/meta.json
deleted file mode 100644
index 3dbc4f0acf..0000000000
--- a/documentation/examples/17-special-elements/03-svelte-window/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:window>"
-}
diff --git a/documentation/examples/17-special-elements/04-svelte-window-bindings/App.svelte b/documentation/examples/17-special-elements/04-svelte-window-bindings/App.svelte
deleted file mode 100644
index 7e85600abe..0000000000
--- a/documentation/examples/17-special-elements/04-svelte-window-bindings/App.svelte
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
-	const layers = [0, 1, 2, 3, 4, 5, 6, 7, 8];
-
-	let y;
-</script>
-
-<svelte:window bind:scrollY={y} />
-
-<a class="parallax-container" href="https://www.firewatchgame.com">
-	{#each layers as layer}
-		<img
-			style="transform: translate(0,{(-y * layer) / (layers.length - 1)}px)"
-			src="https://www.firewatchgame.com/images/parallax/parallax{layer}.png"
-			alt="parallax layer {layer}"
-		/>
-	{/each}
-</a>
-
-<div class="text">
-	<span style="opacity: {1 - Math.max(0, y / 40)}"> scroll down </span>
-
-	<div class="foreground">
-		You have scrolled {y} pixels
-	</div>
-</div>
-
-<style>
-	.parallax-container {
-		position: fixed;
-		width: 2400px;
-		height: 712px;
-		left: 50%;
-		transform: translate(-50%, 0);
-	}
-
-	.parallax-container img {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		will-change: transform;
-	}
-
-	.parallax-container img:last-child::after {
-		content: '';
-		position: absolute;
-		width: 100%;
-		height: 100%;
-		background: rgb(45, 10, 13);
-	}
-
-	.text {
-		position: relative;
-		width: 100%;
-		height: 300vh;
-		color: rgb(220, 113, 43);
-		text-align: center;
-		padding: 4em 0.5em 0.5em 0.5em;
-		box-sizing: border-box;
-		pointer-events: none;
-	}
-
-	span {
-		display: block;
-		font-size: 1em;
-		text-transform: uppercase;
-		will-change: transform, opacity;
-	}
-
-	.foreground {
-		position: absolute;
-		top: 711px;
-		left: 0;
-		width: 100%;
-		height: calc(100% - 712px);
-		background-color: rgb(32, 0, 1);
-		color: white;
-		padding: 50vh 0 0 0;
-	}
-
-	:global(body) {
-		margin: 0;
-		padding: 0;
-		background-color: rgb(253, 174, 51);
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/04-svelte-window-bindings/meta.json b/documentation/examples/17-special-elements/04-svelte-window-bindings/meta.json
deleted file mode 100644
index c4864331cc..0000000000
--- a/documentation/examples/17-special-elements/04-svelte-window-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:window> bindings"
-}
diff --git a/documentation/examples/17-special-elements/05-svelte-document/App.svelte b/documentation/examples/17-special-elements/05-svelte-document/App.svelte
deleted file mode 100644
index e11a9005db..0000000000
--- a/documentation/examples/17-special-elements/05-svelte-document/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	let selection = '';
-
-	const handleSelectionChange = (e) => (selection = document.getSelection());
-</script>
-
-<svelte:document on:selectionchange={handleSelectionChange} />
-
-<p>Select this text to fire events</p>
-<p>Selection: {selection}</p>
diff --git a/documentation/examples/17-special-elements/05-svelte-document/meta.json b/documentation/examples/17-special-elements/05-svelte-document/meta.json
deleted file mode 100644
index c48db2e62a..0000000000
--- a/documentation/examples/17-special-elements/05-svelte-document/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:document>"
-}
diff --git a/documentation/examples/17-special-elements/06-svelte-body/App.svelte b/documentation/examples/17-special-elements/06-svelte-body/App.svelte
deleted file mode 100644
index 71edebea48..0000000000
--- a/documentation/examples/17-special-elements/06-svelte-body/App.svelte
+++ /dev/null
@@ -1,34 +0,0 @@
-<script>
-	let hereKitty = false;
-
-	const handleMouseenter = () => (hereKitty = true);
-	const handleMouseleave = () => (hereKitty = false);
-</script>
-
-<svelte:body on:mouseenter={handleMouseenter} on:mouseleave={handleMouseleave} />
-
-<!-- creative commons BY-NC http://www.pngall.com/kitten-png/download/7247 -->
-<img
-	class:curious={hereKitty}
-	alt="Kitten wants to know what's going on"
-	src="/tutorial/kitten.png"
-/>
-
-<style>
-	img {
-		position: absolute;
-		left: 0;
-		bottom: -60px;
-		transform: translate(-80%, 0) rotate(-30deg);
-		transform-origin: 100% 100%;
-		transition: transform 0.4s;
-	}
-
-	.curious {
-		transform: translate(-15%, 0) rotate(0deg);
-	}
-
-	:global(body) {
-		overflow: hidden;
-	}
-</style>
diff --git a/documentation/examples/17-special-elements/06-svelte-body/meta.json b/documentation/examples/17-special-elements/06-svelte-body/meta.json
deleted file mode 100644
index fbe7deeb96..0000000000
--- a/documentation/examples/17-special-elements/06-svelte-body/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:body>"
-}
diff --git a/documentation/examples/17-special-elements/07-svelte-head/App.svelte b/documentation/examples/17-special-elements/07-svelte-head/App.svelte
deleted file mode 100644
index 5e6bb2d945..0000000000
--- a/documentation/examples/17-special-elements/07-svelte-head/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<svelte:head>
-	<link rel="stylesheet" href="/tutorial/dark-theme.css" />
-</svelte:head>
-
-<h1>Hello world!</h1>
diff --git a/documentation/examples/17-special-elements/07-svelte-head/meta.json b/documentation/examples/17-special-elements/07-svelte-head/meta.json
deleted file mode 100644
index b69672ba02..0000000000
--- a/documentation/examples/17-special-elements/07-svelte-head/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "<svelte:head>"
-}
diff --git a/documentation/examples/17-special-elements/meta.json b/documentation/examples/17-special-elements/meta.json
deleted file mode 100644
index 6c2af96c1d..0000000000
--- a/documentation/examples/17-special-elements/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Special elements"
-}
diff --git a/documentation/examples/18-module-context/01-module-exports/App.svelte b/documentation/examples/18-module-context/01-module-exports/App.svelte
deleted file mode 100644
index a018d3429f..0000000000
--- a/documentation/examples/18-module-context/01-module-exports/App.svelte
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-	import AudioPlayer, { stopAll } from './AudioPlayer.svelte';
-</script>
-
-<button on:click={stopAll}> stop all audio </button>
-
-<!-- https://musopen.org/music/9862-the-blue-danube-op-314/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/strauss.mp3"
-	title="The Blue Danube Waltz"
-	composer="Johann Strauss"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43775-the-planets-op-32/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/holst.mp3"
-	title="Mars, the Bringer of War"
-	composer="Gustav Holst"
-	performer="USAF Heritage of America Band"
-/>
-
-<!-- https://musopen.org/music/8010-3-gymnopedies/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/satie.mp3"
-	title="Gymnopédie no. 1"
-	composer="Erik Satie"
-	performer="Prodigal Procrastinator"
-/>
-
-<!-- https://musopen.org/music/2567-symphony-no-5-in-c-minor-op-67/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/beethoven.mp3"
-	title="Symphony no. 5 in Cm, Op. 67 - I. Allegro con brio"
-	composer="Ludwig van Beethoven"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43683-requiem-in-d-minor-k-626/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/mozart.mp3"
-	title="Requiem in D minor, K. 626 - III. Sequence - Lacrymosa"
-	composer="Wolfgang Amadeus Mozart"
-	performer="Markus Staab"
-/>
diff --git a/documentation/examples/18-module-context/01-module-exports/AudioPlayer.svelte b/documentation/examples/18-module-context/01-module-exports/AudioPlayer.svelte
deleted file mode 100644
index b76601e025..0000000000
--- a/documentation/examples/18-module-context/01-module-exports/AudioPlayer.svelte
+++ /dev/null
@@ -1,57 +0,0 @@
-<script context="module">
-	const elements = new Set();
-
-	export function stopAll() {
-		elements.forEach((element) => {
-			element.pause();
-		});
-	}
-</script>
-
-<script>
-	import { onMount } from 'svelte';
-
-	export let src;
-	export let title;
-	export let composer;
-	export let performer;
-
-	let audio;
-	let paused = true;
-
-	onMount(() => {
-		elements.add(audio);
-		return () => elements.delete(audio);
-	});
-
-	function stopOthers() {
-		elements.forEach((element) => {
-			if (element !== audio) element.pause();
-		});
-	}
-</script>
-
-<article class:playing={!paused}>
-	<h2>{title}</h2>
-	<p><strong>{composer}</strong> / performed by {performer}</p>
-
-	<audio bind:this={audio} bind:paused on:play={stopOthers} controls {src} />
-</article>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-		max-width: 800px;
-	}
-	h2,
-	p {
-		margin: 0 0 0.3em 0;
-	}
-	audio {
-		width: 100%;
-		margin: 0.5em 0 1em 0;
-	}
-	.playing {
-		color: #ff3e00;
-	}
-</style>
diff --git a/documentation/examples/18-module-context/01-module-exports/meta.json b/documentation/examples/18-module-context/01-module-exports/meta.json
deleted file mode 100644
index 5d718fc840..0000000000
--- a/documentation/examples/18-module-context/01-module-exports/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Named exports"
-}
diff --git a/documentation/examples/18-module-context/meta.json b/documentation/examples/18-module-context/meta.json
deleted file mode 100644
index 772fe6de40..0000000000
--- a/documentation/examples/18-module-context/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Module context"
-}
diff --git a/documentation/examples/19-debugging/00-debug/App.svelte b/documentation/examples/19-debugging/00-debug/App.svelte
deleted file mode 100644
index 30bffc896c..0000000000
--- a/documentation/examples/19-debugging/00-debug/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let user = {
-		firstname: 'Ada',
-		lastname: 'Lovelace'
-	};
-</script>
-
-<input bind:value={user.firstname} />
-<input bind:value={user.lastname} />
-
-{@debug user}
-
-<h1>Hello {user.firstname}!</h1>
diff --git a/documentation/examples/19-debugging/00-debug/meta.json b/documentation/examples/19-debugging/00-debug/meta.json
deleted file mode 100644
index e899108a45..0000000000
--- a/documentation/examples/19-debugging/00-debug/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "The @debug tag"
-}
diff --git a/documentation/examples/19-debugging/meta.json b/documentation/examples/19-debugging/meta.json
deleted file mode 100644
index 5cfdfbc17d..0000000000
--- a/documentation/examples/19-debugging/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Debugging"
-}
diff --git a/documentation/examples/20-7guis/01-7guis-counter/App.svelte b/documentation/examples/20-7guis/01-7guis-counter/App.svelte
deleted file mode 100644
index 26c8c51477..0000000000
--- a/documentation/examples/20-7guis/01-7guis-counter/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<!-- https://eugenkiss.github.io/7guis/tasks#counter -->
-<script>
-	let count = 0;
-</script>
-
-<input type="number" bind:value={count} />
-<button on:click={() => (count += 1)}>count</button>
diff --git a/documentation/examples/20-7guis/01-7guis-counter/meta.json b/documentation/examples/20-7guis/01-7guis-counter/meta.json
deleted file mode 100644
index c7fe17ca02..0000000000
--- a/documentation/examples/20-7guis/01-7guis-counter/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Counter"
-}
diff --git a/documentation/examples/20-7guis/02-7guis-temperature/App.svelte b/documentation/examples/20-7guis/02-7guis-temperature/App.svelte
deleted file mode 100644
index e7de8eb707..0000000000
--- a/documentation/examples/20-7guis/02-7guis-temperature/App.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script>
-	let c = 0;
-	let f = 32;
-
-	function setBothFromC(value) {
-		c = +value;
-		f = +(32 + (9 / 5) * c).toFixed(1);
-	}
-
-	function setBothFromF(value) {
-		f = +value;
-		c = +((5 / 9) * (f - 32)).toFixed(1);
-	}
-</script>
-
-<!-- https://eugenkiss.github.io/7guis/tasks/#temp -->
-<input value={c} on:input={(e) => setBothFromC(e.target.value)} type="number" /> °C =
-<input value={f} on:input={(e) => setBothFromF(e.target.value)} type="number" /> °F
-
-<style>
-	input {
-		width: 5em;
-	}
-</style>
diff --git a/documentation/examples/20-7guis/02-7guis-temperature/meta.json b/documentation/examples/20-7guis/02-7guis-temperature/meta.json
deleted file mode 100644
index c5eacde091..0000000000
--- a/documentation/examples/20-7guis/02-7guis-temperature/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Temperature Converter"
-}
diff --git a/documentation/examples/20-7guis/03-7guis-flight-booker/App.svelte b/documentation/examples/20-7guis/03-7guis-flight-booker/App.svelte
deleted file mode 100644
index 42caebe506..0000000000
--- a/documentation/examples/20-7guis/03-7guis-flight-booker/App.svelte
+++ /dev/null
@@ -1,58 +0,0 @@
-<!-- https://eugenkiss.github.io/7guis/tasks/#flight -->
-<script>
-	const tomorrow = new Date(Date.now() + 86400000);
-
-	let start = [
-		tomorrow.getFullYear(),
-		pad(tomorrow.getMonth() + 1, 2),
-		pad(tomorrow.getDate(), 2)
-	].join('-');
-
-	let end = start;
-	let isReturn = false;
-
-	$: startDate = convertToDate(start);
-	$: endDate = convertToDate(end);
-
-	function bookFlight() {
-		const type = isReturn ? 'return' : 'one-way';
-
-		let message = `You have booked a ${type} flight, leaving ${startDate.toDateString()}`;
-		if (type === 'return') {
-			message += ` and returning ${endDate.toDateString()}`;
-		}
-
-		alert(message);
-	}
-
-	function convertToDate(str) {
-		const split = str.split('-');
-		return new Date(+split[0], +split[1] - 1, +split[2]);
-	}
-
-	function pad(x, len) {
-		x = String(x);
-		while (x.length < len) x = `0${x}`;
-		return x;
-	}
-</script>
-
-<select bind:value={isReturn}>
-	<option value={false}>one-way flight</option>
-	<option value={true}>return flight</option>
-</select>
-
-<input type="date" bind:value={start} />
-<input type="date" bind:value={end} disabled={!isReturn} />
-
-<button on:click={bookFlight} disabled={isReturn && startDate >= endDate}>book</button>
-
-<style>
-	select,
-	input,
-	button {
-		display: block;
-		margin: 0.5em 0;
-		font-size: inherit;
-	}
-</style>
diff --git a/documentation/examples/20-7guis/03-7guis-flight-booker/meta.json b/documentation/examples/20-7guis/03-7guis-flight-booker/meta.json
deleted file mode 100644
index 05abfec119..0000000000
--- a/documentation/examples/20-7guis/03-7guis-flight-booker/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Flight booker"
-}
diff --git a/documentation/examples/20-7guis/04-7guis-timer/App.svelte b/documentation/examples/20-7guis/04-7guis-timer/App.svelte
deleted file mode 100644
index 14103e424b..0000000000
--- a/documentation/examples/20-7guis/04-7guis-timer/App.svelte
+++ /dev/null
@@ -1,37 +0,0 @@
-<!-- https://eugenkiss.github.io/7guis/tasks#timer -->
-
-<script>
-	import { onMount } from 'svelte';
-
-	let elapsed = 0;
-	let duration = 5000;
-
-	onMount(() => {
-		let last_time = performance.now();
-
-		let frame = requestAnimationFrame(function update(time) {
-			frame = requestAnimationFrame(update);
-
-			elapsed += Math.min(time - last_time, duration - elapsed);
-			last_time = time;
-		});
-
-		return () => {
-			cancelAnimationFrame(frame);
-		};
-	});
-</script>
-
-<label>
-	elapsed time:
-	<progress value={elapsed / duration}></progress>
-</label>
-
-<div>{(elapsed / 1000).toFixed(1)}s</div>
-
-<label>
-	duration:
-	<input type="range" bind:value={duration} min="1" max="20000" />
-</label>
-
-<button on:click={() => (elapsed = 0)}>reset</button>
diff --git a/documentation/examples/20-7guis/04-7guis-timer/meta.json b/documentation/examples/20-7guis/04-7guis-timer/meta.json
deleted file mode 100644
index fdae7a752c..0000000000
--- a/documentation/examples/20-7guis/04-7guis-timer/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Timer"
-}
diff --git a/documentation/examples/20-7guis/05-7guis-crud/App.svelte b/documentation/examples/20-7guis/05-7guis-crud/App.svelte
deleted file mode 100644
index fbae236b9f..0000000000
--- a/documentation/examples/20-7guis/05-7guis-crud/App.svelte
+++ /dev/null
@@ -1,90 +0,0 @@
-<!-- https://eugenkiss.github.io/7guis/tasks#crud -->
-
-<script>
-	let people = [
-		{ first: 'Hans', last: 'Emil' },
-		{ first: 'Max', last: 'Mustermann' },
-		{ first: 'Roman', last: 'Tisch' }
-	];
-
-	let prefix = '';
-	let first = '';
-	let last = '';
-	let i = 0;
-
-	$: filteredPeople = prefix
-		? people.filter((person) => {
-				const name = `${person.last}, ${person.first}`;
-				return name.toLowerCase().startsWith(prefix.toLowerCase());
-			})
-		: people;
-
-	$: selected = filteredPeople[i];
-
-	$: reset_inputs(selected);
-
-	function create() {
-		people = people.concat({ first, last });
-		i = people.length - 1;
-		first = last = '';
-	}
-
-	function update() {
-		selected.first = first;
-		selected.last = last;
-		people = people;
-	}
-
-	function remove() {
-		// Remove selected person from the source array (people), not the filtered array
-		const index = people.indexOf(selected);
-		people = [...people.slice(0, index), ...people.slice(index + 1)];
-
-		first = last = '';
-		i = Math.min(i, filteredPeople.length - 2);
-	}
-
-	function reset_inputs(person) {
-		first = person ? person.first : '';
-		last = person ? person.last : '';
-	}
-</script>
-
-<input placeholder="filter prefix" bind:value={prefix} />
-
-<select bind:value={i} size={5}>
-	{#each filteredPeople as person, i}
-		<option value={i}>{person.last}, {person.first}</option>
-	{/each}
-</select>
-
-<label><input bind:value={first} placeholder="first" /></label>
-<label><input bind:value={last} placeholder="last" /></label>
-
-<div class="buttons">
-	<button on:click={create} disabled={!first || !last}>create</button>
-	<button on:click={update} disabled={!first || !last || !selected}>update</button>
-	<button on:click={remove} disabled={!selected}>delete</button>
-</div>
-
-<style>
-	* {
-		font-family: inherit;
-		font-size: inherit;
-	}
-
-	input {
-		display: block;
-		margin: 0 0 0.5em 0;
-	}
-
-	select {
-		float: left;
-		margin: 0 1em 1em 0;
-		width: 14em;
-	}
-
-	.buttons {
-		clear: both;
-	}
-</style>
diff --git a/documentation/examples/20-7guis/05-7guis-crud/meta.json b/documentation/examples/20-7guis/05-7guis-crud/meta.json
deleted file mode 100644
index 51e1ab9ef6..0000000000
--- a/documentation/examples/20-7guis/05-7guis-crud/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "CRUD"
-}
diff --git a/documentation/examples/20-7guis/06-7guis-circles/App.svelte b/documentation/examples/20-7guis/06-7guis-circles/App.svelte
deleted file mode 100644
index 12d79a1a05..0000000000
--- a/documentation/examples/20-7guis/06-7guis-circles/App.svelte
+++ /dev/null
@@ -1,129 +0,0 @@
-<!--
-https://eugenkiss.github.io/7guis/tasks#circle
-
-Click on the canvas to draw a circle. Click on a circle
-to select it. Right-click on the canvas to adjust the
-radius of the selected circle.
--->
-
-<script>
-	let i = 0;
-	let undoStack = [[]];
-	let circles = [];
-	let selected;
-	let adjusting = false;
-	let adjusted = false;
-
-	function handleClick(event) {
-		if (adjusting) {
-			adjusting = false;
-
-			// if circle was adjusted,
-			// push to the stack
-			if (adjusted) push();
-			return;
-		}
-
-		const circle = {
-			cx: event.clientX,
-			cy: event.clientY,
-			r: 50
-		};
-
-		circles = circles.concat(circle);
-		selected = circle;
-
-		push();
-	}
-
-	function adjust(event) {
-		selected.r = +event.target.value;
-		circles = circles;
-		adjusted = true;
-	}
-
-	function select(circle, event) {
-		if (!adjusting) {
-			event.stopPropagation();
-			selected = circle;
-		}
-	}
-
-	function push() {
-		const newUndoStack = undoStack.slice(0, ++i);
-		newUndoStack.push(clone(circles));
-		undoStack = newUndoStack;
-	}
-
-	function travel(d) {
-		circles = clone(undoStack[(i += d)]);
-		adjusting = false;
-	}
-
-	function clone(circles) {
-		return circles.map(({ cx, cy, r }) => ({ cx, cy, r }));
-	}
-</script>
-
-<div class="controls">
-	<button on:click={() => travel(-1)} disabled={i === 0}>undo</button>
-	<button on:click={() => travel(+1)} disabled={i === undoStack.length - 1}>redo</button>
-</div>
-<!-- svelte-ignore a11y-click-events-have-key-events a11y-no-static-element-interactions -->
-<svg on:click={handleClick}>
-	{#each circles as circle}
-		<!-- svelte-ignore a11y-click-events-have-key-events -->
-		<circle
-			cx={circle.cx}
-			cy={circle.cy}
-			r={circle.r}
-			on:click={(event) => select(circle, event)}
-			on:contextmenu|stopPropagation|preventDefault={() => {
-				adjusting = !adjusting;
-				if (adjusting) selected = circle;
-			}}
-			fill={circle === selected ? '#ccc' : 'white'}
-		/>
-	{/each}
-</svg>
-
-{#if adjusting}
-	<div class="adjuster">
-		<p>adjust diameter of circle at {selected.cx}, {selected.cy}</p>
-		<input type="range" value={selected.r} on:input={adjust} />
-	</div>
-{/if}
-
-<style>
-	.controls {
-		position: absolute;
-		width: 100%;
-		text-align: center;
-	}
-
-	svg {
-		background-color: #eee;
-		width: 100%;
-		height: 100%;
-	}
-
-	circle {
-		stroke: black;
-	}
-
-	.adjuster {
-		position: absolute;
-		width: 80%;
-		top: 50%;
-		left: 50%;
-		transform: translate(-50%, -50%);
-		padding: 1em;
-		text-align: center;
-		background-color: rgba(255, 255, 255, 0.7);
-		border-radius: 4px;
-	}
-
-	input[type='range'] {
-		width: 100%;
-	}
-</style>
diff --git a/documentation/examples/20-7guis/06-7guis-circles/meta.json b/documentation/examples/20-7guis/06-7guis-circles/meta.json
deleted file mode 100644
index 963e1f9421..0000000000
--- a/documentation/examples/20-7guis/06-7guis-circles/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Circle Drawer"
-}
diff --git a/documentation/examples/20-7guis/meta.json b/documentation/examples/20-7guis/meta.json
deleted file mode 100644
index 2444946b49..0000000000
--- a/documentation/examples/20-7guis/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "7GUIs"
-}
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/App.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/App.svelte
deleted file mode 100644
index e954246595..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/App.svelte
+++ /dev/null
@@ -1,53 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-	import List from './List.svelte';
-	import Item from './Item.svelte';
-
-	let item;
-	let page;
-
-	async function hashchange() {
-		// the poor man's router!
-		const path = window.location.hash.slice(1);
-
-		if (path.startsWith('/item')) {
-			const id = path.slice(6);
-			item = await fetch(`https://node-hnapi.herokuapp.com/item/${id}`).then((r) => r.json());
-
-			window.scrollTo(0, 0);
-		} else if (path.startsWith('/top')) {
-			page = +path.slice(5);
-			item = null;
-		} else {
-			window.location.hash = '/top/1';
-		}
-	}
-
-	onMount(hashchange);
-</script>
-
-<svelte:window on:hashchange={hashchange} />
-
-<main>
-	{#if item}
-		<Item {item} returnTo="#/top/{page}" />
-	{:else if page}
-		<List {page} />
-	{/if}
-</main>
-
-<style>
-	main {
-		position: relative;
-		max-width: 800px;
-		margin: 0 auto;
-		min-height: 101vh;
-		padding: 1em;
-	}
-
-	main :global(.meta) {
-		color: #999;
-		font-size: 12px;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/Comment.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/Comment.svelte
deleted file mode 100644
index 56a9c74af5..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/Comment.svelte
+++ /dev/null
@@ -1,32 +0,0 @@
-<script>
-	export let comment;
-</script>
-
-<article>
-	<p class="meta">{comment.user} {comment.time_ago}</p>
-
-	{@html comment.content}
-
-	<div class="replies">
-		{#each comment.comments as child}
-			<svelte:self comment={child} />
-		{/each}
-	</div>
-</article>
-
-<style>
-	article {
-		border-top: 1px solid #eee;
-		margin: 1em 0 0 0;
-		padding: 1em 0 0 0;
-		font-size: 14px;
-	}
-
-	.meta {
-		color: #999;
-	}
-
-	.replies {
-		padding: 0 0 0 1em;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/Item.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/Item.svelte
deleted file mode 100644
index db57a25757..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/Item.svelte
+++ /dev/null
@@ -1,43 +0,0 @@
-<script>
-	import Comment from './Comment.svelte';
-
-	export let item;
-	export let returnTo;
-
-	$: url = !item.domain ? `https://news.ycombinator.com/${item.url}` : item.url;
-</script>
-
-<a href={returnTo}>&laquo; back</a>
-
-<article>
-	<a href={url}>
-		<h1>{item.title}</h1>
-		{#if item.domain}
-			<small>{item.domain}</small>
-		{/if}
-	</a>
-
-	<p class="meta">submitted by {item.user} {item.time_ago}</p>
-</article>
-
-<div class="comments">
-	{#each item.comments as comment}
-		<Comment {comment} />
-	{/each}
-</div>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-	}
-
-	a {
-		display: block;
-		margin: 0 0 1em 0;
-	}
-
-	h1 {
-		font-size: 1.4em;
-		margin: 0;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/List.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/List.svelte
deleted file mode 100644
index e3f0b7b822..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/List.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script>
-	import { beforeUpdate } from 'svelte';
-	import Summary from './Summary.svelte';
-
-	const PAGE_SIZE = 20;
-
-	export let page;
-
-	let items;
-	let offset;
-
-	$: fetch(`https://node-hnapi.herokuapp.com/news?page=${page}`)
-		.then((r) => r.json())
-		.then((data) => {
-			items = data;
-			offset = PAGE_SIZE * (page - 1);
-			window.scrollTo(0, 0);
-		});
-</script>
-
-{#if items}
-	{#each items as item, i}
-		<Summary {item} {i} {offset} />
-	{/each}
-
-	<a href="#/top/{page + 1}">page {page + 1}</a>
-{:else}
-	<p class="loading">loading...</p>
-{/if}
-
-<style>
-	a {
-		padding: 2em;
-		display: block;
-	}
-
-	.loading {
-		opacity: 0;
-		animation: 0.4s 0.8s forwards fade-in;
-	}
-
-	@keyframes fade-in {
-		from {
-			opacity: 0;
-		}
-		to {
-			opacity: 1;
-		}
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte
deleted file mode 100644
index 360d2181b6..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte
+++ /dev/null
@@ -1,36 +0,0 @@
-<script>
-	export let item;
-	export let i;
-	export let offset;
-
-	function comment_text() {
-		const c = item.comments_count;
-		return `${c} ${c === 1 ? 'comment' : 'comments'}`;
-	}
-
-	$: url = item.type === 'ask' ? `https://news.ycombinator.com/${item.url}` : item.url;
-</script>
-
-<article>
-	<span>{i + offset + 1}</span>
-	<h2><a target="_blank" rel="noreferrer" href={url}>{item.title}</a></h2>
-	<p class="meta"><a href="#/item/{item.id}">{comment_text()}</a> by {item.user} {item.time_ago}</p>
-</article>
-
-<style>
-	article {
-		position: relative;
-		padding: 0 0 0 2em;
-		border-bottom: 1px solid #eee;
-	}
-
-	h2 {
-		font-size: 1em;
-		margin: 0.5em 0;
-	}
-
-	span {
-		position: absolute;
-		left: 0;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/meta.json b/documentation/examples/21-miscellaneous/01-hacker-news/meta.json
deleted file mode 100644
index e0ba23a6b7..0000000000
--- a/documentation/examples/21-miscellaneous/01-hacker-news/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Hacker News"
-}
diff --git a/documentation/examples/21-miscellaneous/02-immutable-data/App.svelte b/documentation/examples/21-miscellaneous/02-immutable-data/App.svelte
deleted file mode 100644
index f43f3bb767..0000000000
--- a/documentation/examples/21-miscellaneous/02-immutable-data/App.svelte
+++ /dev/null
@@ -1,36 +0,0 @@
-<script>
-	import ImmutableTodo from './ImmutableTodo.svelte';
-	import MutableTodo from './MutableTodo.svelte';
-
-	let todos = [
-		{ id: 1, done: true, text: 'wash the car' },
-		{ id: 2, done: false, text: 'take the dog for a walk' },
-		{ id: 3, done: false, text: 'mow the lawn' }
-	];
-
-	function toggle(id) {
-		todos = todos.map((todo) => {
-			if (todo.id === id) {
-				// return a new object
-				return {
-					id,
-					done: !todo.done,
-					text: todo.text
-				};
-			}
-
-			// return the same object
-			return todo;
-		});
-	}
-</script>
-
-<h2>Immutable</h2>
-{#each todos as todo}
-	<ImmutableTodo {todo} on:click={() => toggle(todo.id)} /><br />
-{/each}
-
-<h2>Mutable</h2>
-{#each todos as todo}
-	<MutableTodo {todo} on:click={() => toggle(todo.id)} /><br />
-{/each}
diff --git a/documentation/examples/21-miscellaneous/02-immutable-data/ImmutableTodo.svelte b/documentation/examples/21-miscellaneous/02-immutable-data/ImmutableTodo.svelte
deleted file mode 100644
index 72d3d83e6b..0000000000
--- a/documentation/examples/21-miscellaneous/02-immutable-data/ImmutableTodo.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<svelte:options immutable />
-
-<script>
-	import { afterUpdate } from 'svelte';
-	import flash from './flash.js';
-
-	export let todo;
-
-	let btn;
-
-	afterUpdate(() => {
-		flash(btn);
-	});
-</script>
-
-<!-- the text will flash red whenever
-		the `todo` object changes -->
-<button bind:this={btn} on:click>
-	{todo.done ? '👍' : ''}
-	{todo.text}
-</button>
-
-<style>
-	button {
-		cursor: pointer;
-		border: none;
-		background: none;
-		font-size: 14px;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/02-immutable-data/MutableTodo.svelte b/documentation/examples/21-miscellaneous/02-immutable-data/MutableTodo.svelte
deleted file mode 100644
index d2ad294728..0000000000
--- a/documentation/examples/21-miscellaneous/02-immutable-data/MutableTodo.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	import { afterUpdate } from 'svelte';
-	import flash from './flash.js';
-
-	export let todo;
-
-	let btn;
-
-	afterUpdate(() => {
-		flash(btn);
-	});
-</script>
-
-<!-- the text will flash red whenever
-		the `todo` object changes -->
-<button bind:this={btn} on:click>
-	{todo.done ? '👍' : ''}
-	{todo.text}
-</button>
-
-<style>
-	button {
-		cursor: pointer;
-		border: none;
-		background: none;
-		font-size: 14px;
-	}
-</style>
diff --git a/documentation/examples/21-miscellaneous/02-immutable-data/flash.js b/documentation/examples/21-miscellaneous/02-immutable-data/flash.js
deleted file mode 100644
index 481038d009..0000000000
--- a/documentation/examples/21-miscellaneous/02-immutable-data/flash.js
+++ /dev/null
@@ -1,13 +0,0 @@
-export default function flash(element) {
-	requestAnimationFrame(() => {
-		element.style.transition = 'none';
-		element.style.color = 'rgba(255,62,0,1)';
-		element.style.backgroundColor = 'rgba(255,62,0,0.2)';
-
-		setTimeout(() => {
-			element.style.transition = 'color 1s, background 1s';
-			element.style.color = '';
-			element.style.backgroundColor = '';
-		});
-	});
-}
diff --git a/documentation/examples/21-miscellaneous/02-immutable-data/meta.json b/documentation/examples/21-miscellaneous/02-immutable-data/meta.json
deleted file mode 100644
index a896bad1b4..0000000000
--- a/documentation/examples/21-miscellaneous/02-immutable-data/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Immutable data"
-}
diff --git a/documentation/examples/21-miscellaneous/meta.json b/documentation/examples/21-miscellaneous/meta.json
deleted file mode 100644
index 1d0c05da09..0000000000
--- a/documentation/examples/21-miscellaneous/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Miscellaneous"
-}
diff --git a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte b/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte
deleted file mode 100644
index a2046d0392..0000000000
--- a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script>
-	import { comicSans, link } from './styles.js';
-	import Hero from './Hero.svelte';
-</script>
-
-<Hero />
-
-<div class={comicSans}>
-	<p>
-		Did you enjoy your lunch, mom? You drank it fast enough. I know, I just call her Annabelle cause
-		she's shaped like a…she's the belle of the ball! YOU'RE the Chiclet! Not me. Caw ca caw, caw ca
-		caw, caw ca caw! A Colombian cartel that WON'T kidnap and kill you. You go buy a tape recorder
-		and record yourself for a whole day. <a class={link} href="https://bluthipsum.com/"
-			>I think you'll be surprised at some of your phrasing.</a
-		>
-	</p>
-</div>
diff --git a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte b/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte
deleted file mode 100644
index b59a11871a..0000000000
--- a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { title, comicSans, box } from './styles.js';
-</script>
-
-<div class="{title} {comicSans}">
-	<h1>
-		<div class={box}>
-			<div class={box}>
-				<div class={box}>CSS</div>
-				in JS
-			</div>
-			in HTML
-		</div>
-	</h1>
-</div>
diff --git a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json b/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json
deleted file mode 100644
index eaa2a1da63..0000000000
--- a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "-"
-}
diff --git a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js b/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js
deleted file mode 100644
index b54fa92763..0000000000
--- a/documentation/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import emotion from '@emotion/css@11.1.3/dist/emotion-css.umd.min.js';
-
-const { css } = emotion;
-
-const brand = '#74D900';
-
-export const title = css`
-	color: ${brand};
-	font-size: 1em;
-	white-space: nowrap;
-`;
-
-export const comicSans = css`
-	font-family: 'Comic Sans MS', cursive;
-`;
-
-export const box = css`
-	position: relative;
-	display: inline-block;
-	border: 2px solid ${brand};
-	line-height: 1;
-	padding: 4px;
-	border-radius: 4px;
-`;
-
-export const link = css`
-	color: inherit;
-	font-weight: bold;
-	text-decoration: none;
-	border-bottom: 1px solid ${brand};
-	&:hover {
-		text-decoration: none;
-		background: ${brand};
-	}
-`;
diff --git a/documentation/examples/99-embeds/20190420-blog-write-less-code/App.svelte b/documentation/examples/99-embeds/20190420-blog-write-less-code/App.svelte
deleted file mode 100644
index 89b10d2a17..0000000000
--- a/documentation/examples/99-embeds/20190420-blog-write-less-code/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	let a = 1;
-	let b = 2;
-</script>
-
-<input type="number" bind:value={a} />
-<input type="number" bind:value={b} />
-
-<p>{a} + {b} = {a + b}</p>
diff --git a/documentation/examples/99-embeds/20190420-blog-write-less-code/meta.json b/documentation/examples/99-embeds/20190420-blog-write-less-code/meta.json
deleted file mode 100644
index eaa2a1da63..0000000000
--- a/documentation/examples/99-embeds/20190420-blog-write-less-code/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "-"
-}
diff --git a/documentation/examples/99-embeds/meta.json b/documentation/examples/99-embeds/meta.json
deleted file mode 100644
index 0967ef424b..0000000000
--- a/documentation/examples/99-embeds/meta.json
+++ /dev/null
@@ -1 +0,0 @@
-{}
diff --git a/documentation/tutorial/01-introduction/01-basics/app-a/App.svelte b/documentation/tutorial/01-introduction/01-basics/app-a/App.svelte
deleted file mode 100644
index 597ecf5fc4..0000000000
--- a/documentation/tutorial/01-introduction/01-basics/app-a/App.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<h1>Hello world!</h1>
diff --git a/documentation/tutorial/01-introduction/01-basics/text.md b/documentation/tutorial/01-introduction/01-basics/text.md
deleted file mode 100644
index 3846be53e4..0000000000
--- a/documentation/tutorial/01-introduction/01-basics/text.md
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: Basics
----
-
-Welcome to the Svelte tutorial. This will teach you everything you need to know to build fast, small web applications easily.
-
-You can also consult the [API docs](/docs) and the [examples](/examples), or — if you're impatient to start hacking on your machine locally — the [60-second quickstart](/docs/introduction).
-
-## What is Svelte?
-
-Svelte is a tool for building fast web applications.
-
-It is similar to JavaScript frameworks such as React and Vue, which share a goal of making it easy to build slick interactive user interfaces.
-
-But there's a crucial difference: Svelte converts your app into ideal JavaScript at _build time_, rather than interpreting your application code at _run time_. This means you don't pay the performance cost of the framework's abstractions, and you don't incur a penalty when your app first loads.
-
-You can build your entire app with Svelte, or you can add it incrementally to an existing codebase. You can also ship components as standalone packages that work anywhere, without the overhead of a dependency on a conventional framework.
-
-## How to use this tutorial
-
-You'll need to have basic familiarity with HTML, CSS and JavaScript to understand Svelte.
-
-As you progress through the tutorial, you'll be presented with mini exercises designed to illustrate new features. Later chapters build on the knowledge gained in earlier ones, so it's recommended that you go from start to finish. If necessary, you can navigate via the dropdown above (click 'Introduction / Basics').
-
-Each tutorial chapter will have a 'Show me' button that you can click if you get stuck following the instructions. Try not to rely on it too much; you will learn faster by figuring out where to put each suggested code block and manually typing it into the editor.
-
-## Understanding components
-
-In Svelte, an application is composed from one or more _components_. A component is a reusable self-contained block of code that encapsulates HTML, CSS and JavaScript that belong together, written into a `.svelte` file. The 'hello world' example in the code editor is a simple component.
diff --git a/documentation/tutorial/01-introduction/02-adding-data/app-a/App.svelte b/documentation/tutorial/01-introduction/02-adding-data/app-a/App.svelte
deleted file mode 100644
index 597ecf5fc4..0000000000
--- a/documentation/tutorial/01-introduction/02-adding-data/app-a/App.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<h1>Hello world!</h1>
diff --git a/documentation/tutorial/01-introduction/02-adding-data/app-b/App.svelte b/documentation/tutorial/01-introduction/02-adding-data/app-b/App.svelte
deleted file mode 100644
index 5c48373a2a..0000000000
--- a/documentation/tutorial/01-introduction/02-adding-data/app-b/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let name = 'world';
-</script>
-
-<h1>Hello {name.toUpperCase()}!</h1>
diff --git a/documentation/tutorial/01-introduction/02-adding-data/text.md b/documentation/tutorial/01-introduction/02-adding-data/text.md
deleted file mode 100644
index 695d97a84f..0000000000
--- a/documentation/tutorial/01-introduction/02-adding-data/text.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Adding data
----
-
-A component that just renders some static markup isn't very interesting. Let's add some data.
-
-First, add a script tag to your component and declare a `name` variable:
-
-```svelte
-<script>
-	let name = 'world';
-</script>
-
-<h1>Hello world!</h1>
-```
-
-Then, we can refer to `name` in the markup:
-
-```svelte
-<h1>Hello {name}!</h1>
-```
-
-Inside the curly braces, we can put any JavaScript we want. Try changing `name` to `name.toUpperCase()` for a shoutier greeting.
diff --git a/documentation/tutorial/01-introduction/03-dynamic-attributes/app-a/App.svelte b/documentation/tutorial/01-introduction/03-dynamic-attributes/app-a/App.svelte
deleted file mode 100644
index 94db39ab72..0000000000
--- a/documentation/tutorial/01-introduction/03-dynamic-attributes/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let src = '/tutorial/image.gif';
-</script>
-
-<img />
diff --git a/documentation/tutorial/01-introduction/03-dynamic-attributes/app-b/App.svelte b/documentation/tutorial/01-introduction/03-dynamic-attributes/app-b/App.svelte
deleted file mode 100644
index 1ef6d8c326..0000000000
--- a/documentation/tutorial/01-introduction/03-dynamic-attributes/app-b/App.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-	let src = '/tutorial/image.gif';
-	let name = 'Rick Astley';
-</script>
-
-<img {src} alt="{name} dances." />
diff --git a/documentation/tutorial/01-introduction/03-dynamic-attributes/text.md b/documentation/tutorial/01-introduction/03-dynamic-attributes/text.md
deleted file mode 100644
index 5211869504..0000000000
--- a/documentation/tutorial/01-introduction/03-dynamic-attributes/text.md
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: Dynamic attributes
----
-
-You can use curly braces to control element attributes, just like you use them to control text.
-
-Our image is missing a `src` attribute — let's add one:
-
-<!-- prettier-ignore -->
-```svelte
-<img src={src} />
-```
-
-That's better. But Svelte is giving us a warning:
-
-> A11y: &lt;img&gt; element should have an alt attribute
-
-When building web apps, it's important to make sure that they're _accessible_ to the broadest possible userbase, including people with (for example) impaired vision or motion, or people without powerful hardware or good internet connections. Accessibility (shortened to a11y) isn't always easy to get right, but Svelte will help by warning you if you write inaccessible markup.
-
-In this case, we're missing the `alt` attribute that describes the image for people using screenreaders, or people with slow or flaky internet connections that can't download the image. Let's add one:
-
-<!-- prettier-ignore -->
-```svelte
-<img src={src} alt="A man dances." />
-```
-
-We can use curly braces _inside_ attributes. Try changing it to `"{name} dances."` — remember to declare a `name` variable in the `<script>` block.
-
-## Shorthand attributes
-
-It's not uncommon to have an attribute where the name and value are the same, like `src={src}`. Svelte gives us a convenient shorthand for these cases:
-
-```svelte
-<img {src} alt="A man dances." />
-```
diff --git a/documentation/tutorial/01-introduction/04-styling/app-a/App.svelte b/documentation/tutorial/01-introduction/04-styling/app-a/App.svelte
deleted file mode 100644
index 672b0e96c7..0000000000
--- a/documentation/tutorial/01-introduction/04-styling/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<p>This is a paragraph.</p>
-
-<style>
-	/* Write your CSS here */
-</style>
diff --git a/documentation/tutorial/01-introduction/04-styling/app-b/App.svelte b/documentation/tutorial/01-introduction/04-styling/app-b/App.svelte
deleted file mode 100644
index a6451a008a..0000000000
--- a/documentation/tutorial/01-introduction/04-styling/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<p>This is a paragraph.</p>
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
diff --git a/documentation/tutorial/01-introduction/04-styling/text.md b/documentation/tutorial/01-introduction/04-styling/text.md
deleted file mode 100644
index 41ab8c47fb..0000000000
--- a/documentation/tutorial/01-introduction/04-styling/text.md
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Styling
----
-
-Just like in HTML, you can add a `<style>` tag to your component. Let's add some styles to the `<p>` element:
-
-```svelte
-<p>This is a paragraph.</p>
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
-```
-
-Importantly, these rules are _scoped to the component_. You won't accidentally change the style of `<p>` elements elsewhere in your app, as we'll see in the next step.
diff --git a/documentation/tutorial/01-introduction/05-nested-components/app-a/App.svelte b/documentation/tutorial/01-introduction/05-nested-components/app-a/App.svelte
deleted file mode 100644
index a6451a008a..0000000000
--- a/documentation/tutorial/01-introduction/05-nested-components/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<p>This is a paragraph.</p>
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
diff --git a/documentation/tutorial/01-introduction/05-nested-components/app-a/Nested.svelte b/documentation/tutorial/01-introduction/05-nested-components/app-a/Nested.svelte
deleted file mode 100644
index 83fe98d1d9..0000000000
--- a/documentation/tutorial/01-introduction/05-nested-components/app-a/Nested.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<p>This is another paragraph.</p>
diff --git a/documentation/tutorial/01-introduction/05-nested-components/app-b/App.svelte b/documentation/tutorial/01-introduction/05-nested-components/app-b/App.svelte
deleted file mode 100644
index 8319b69efa..0000000000
--- a/documentation/tutorial/01-introduction/05-nested-components/app-b/App.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<p>This is a paragraph.</p>
-<Nested />
-
-<style>
-	p {
-		color: purple;
-		font-family: 'Comic Sans MS', cursive;
-		font-size: 2em;
-	}
-</style>
diff --git a/documentation/tutorial/01-introduction/05-nested-components/app-b/Nested.svelte b/documentation/tutorial/01-introduction/05-nested-components/app-b/Nested.svelte
deleted file mode 100644
index 83fe98d1d9..0000000000
--- a/documentation/tutorial/01-introduction/05-nested-components/app-b/Nested.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<p>This is another paragraph.</p>
diff --git a/documentation/tutorial/01-introduction/05-nested-components/text.md b/documentation/tutorial/01-introduction/05-nested-components/text.md
deleted file mode 100644
index 3259cedb20..0000000000
--- a/documentation/tutorial/01-introduction/05-nested-components/text.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Nested components
----
-
-It would be impractical to put your entire app in a single component. Instead, we can import components from other files and then use them as though we were including elements.
-
-We now present you 2 files in the editor on the right (upper bar) to click on, `App.svelte` and `Nested.svelte`.
-
-Each `.svelte` file holds a component that is a reusable self-contained block of code that encapsulates HTML, CSS, and JavaScript that belong together.
-
-Let's add a `<script>` tag to `App.svelte` that imports the file (our component) `Nested.svelte` into our app...
-
-```svelte
-<script>
-	import Nested from './Nested.svelte';
-</script>
-```
-
-...then use component `Nested` in the app markup:
-
-```svelte
-<p>This is a paragraph.</p>
-<Nested />
-```
-
-Notice that even though `Nested.svelte` has a `<p>` element, the styles from `App.svelte` don't leak in.
-
-Also notice that the component name `Nested` is capitalised. This convention has been adopted to allow us to differentiate between user-defined components and regular HTML tags.
diff --git a/documentation/tutorial/01-introduction/06-making-an-app/app-a/App.svelte b/documentation/tutorial/01-introduction/06-making-an-app/app-a/App.svelte
deleted file mode 100644
index 90035cbf1d..0000000000
--- a/documentation/tutorial/01-introduction/06-making-an-app/app-a/App.svelte
+++ /dev/null
@@ -1 +0,0 @@
-<h1>What now?</h1>
diff --git a/documentation/tutorial/01-introduction/06-making-an-app/text.md b/documentation/tutorial/01-introduction/06-making-an-app/text.md
deleted file mode 100644
index 297a5bff01..0000000000
--- a/documentation/tutorial/01-introduction/06-making-an-app/text.md
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: Making an app
----
-
-This tutorial is designed to get you familiar with the process of writing components. But at some point, you'll want to start writing components in the comfort of your own text editor.
-
-First, you'll need to integrate Svelte with a build tool. We recommend using [SvelteKit](https://kit.svelte.dev), which sets up [Vite](https://vitejs.dev/) with [vite-plugin-svelte](https://github.com/sveltejs/vite-plugin-svelte/) for you...
-
-```bash
-npx sv create myapp
-```
-
-There are also a number of [community-maintained integrations](https://sveltesociety.dev/tools).
-
-Don't worry if you're relatively new to web development and haven't used these tools before. We've prepared a simple step-by-step guide, [Svelte for new developers](/blog/svelte-for-new-developers), which walks you through the process.
-
-You'll also want to configure your text editor. There are [plugins](https://sveltesociety.dev/tools#editor-support) for many popular editors as well as an official [VS Code extension](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
-
-<!--
-NOTE: Removed until we have better place for setting-up-your-editor guide. See https://github.com/sveltejs/svelte/pull/7310#issuecomment-1049923609
-If your editor does not have a Svelte plugin then you can follow [this guide](/blog/setting-up-your-editor) to configure your text editor to treat `.svelte` files the same as `.html` for the sake of syntax highlighting. -->
-
-Then, once you've got your project set up, using Svelte components is easy. The compiler turns each component into a regular JavaScript class — just import it and instantiate with `new`:
-
-```js
-import App from './App.svelte';
-
-const app = new App({
-	target: document.body,
-	props: {
-		// we'll learn about props later
-		answer: 42
-	}
-});
-```
-
-You can then interact with `app` using the [component API](/docs/client-side-component-api) if you need to.
diff --git a/documentation/tutorial/01-introduction/meta.json b/documentation/tutorial/01-introduction/meta.json
deleted file mode 100644
index fd70acd694..0000000000
--- a/documentation/tutorial/01-introduction/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Introduction"
-}
diff --git a/documentation/tutorial/02-reactivity/01-reactive-assignments/app-a/App.svelte b/documentation/tutorial/02-reactivity/01-reactive-assignments/app-a/App.svelte
deleted file mode 100644
index 76483b567a..0000000000
--- a/documentation/tutorial/02-reactivity/01-reactive-assignments/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let count = 0;
-
-	function incrementCount() {
-		// event handler code goes here
-	}
-</script>
-
-<button>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
-
-<style>
-	button {
-		width: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/02-reactivity/01-reactive-assignments/app-b/App.svelte b/documentation/tutorial/02-reactivity/01-reactive-assignments/app-b/App.svelte
deleted file mode 100644
index 17e7c07312..0000000000
--- a/documentation/tutorial/02-reactivity/01-reactive-assignments/app-b/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let count = 0;
-
-	function incrementCount() {
-		count += 1;
-	}
-</script>
-
-<button on:click={incrementCount}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
-
-<style>
-	button {
-		width: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/02-reactivity/01-reactive-assignments/text.md b/documentation/tutorial/02-reactivity/01-reactive-assignments/text.md
deleted file mode 100644
index 6122906b0a..0000000000
--- a/documentation/tutorial/02-reactivity/01-reactive-assignments/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Assignments
----
-
-At the heart of Svelte is a powerful system of _reactivity_ for keeping the DOM in sync with your application state — for example, in response to an event.
-
-To demonstrate it, we first need to wire up an event handler. Replace line 9 with this:
-
-```svelte
-<button on:click={incrementCount}>
-```
-
-Inside the `incrementCount` function, all we need to do is change the value of `count`:
-
-```js
-function incrementCount() {
-	count += 1;
-}
-```
-
-Svelte 'instruments' this assignment with some code that tells it the DOM will need to be updated.
diff --git a/documentation/tutorial/02-reactivity/02-reactive-declarations/app-a/App.svelte b/documentation/tutorial/02-reactivity/02-reactive-declarations/app-a/App.svelte
deleted file mode 100644
index 6d78f949e1..0000000000
--- a/documentation/tutorial/02-reactivity/02-reactive-declarations/app-a/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	let count = 0;
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
diff --git a/documentation/tutorial/02-reactivity/02-reactive-declarations/app-b/App.svelte b/documentation/tutorial/02-reactivity/02-reactive-declarations/app-b/App.svelte
deleted file mode 100644
index d031bc1879..0000000000
--- a/documentation/tutorial/02-reactivity/02-reactive-declarations/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let count = 0;
-	$: doubled = count * 2;
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
-
-<p>{count} doubled is {doubled}</p>
diff --git a/documentation/tutorial/02-reactivity/02-reactive-declarations/text.md b/documentation/tutorial/02-reactivity/02-reactive-declarations/text.md
deleted file mode 100644
index f00fcade39..0000000000
--- a/documentation/tutorial/02-reactivity/02-reactive-declarations/text.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Declarations
----
-
-Svelte's reactivity not only keeps the DOM in sync with your application's variables as shown in the previous section, it can also keep variables in sync with each other using reactive declarations. They look like this:
-
-```js
-let count = 0;
-$: doubled = count * 2;
-```
-
-> Don't worry if this looks a little alien. It's [valid](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label) (if unconventional) JavaScript, which Svelte interprets to mean 're-run this code whenever any of the referenced values change'. Once you get used to it, there's no going back.
-
-Let's use `doubled` in our markup:
-
-```svelte
-<p>{count} doubled is {doubled}</p>
-```
-
-Of course, you could just write `{count * 2}` in the markup instead — you don't have to use reactive values. Reactive values become particularly valuable when you need to reference them multiple times, or you have values that depend on _other_ reactive values.
diff --git a/documentation/tutorial/02-reactivity/03-reactive-statements/app-a/App.svelte b/documentation/tutorial/02-reactivity/03-reactive-statements/app-a/App.svelte
deleted file mode 100644
index 6d78f949e1..0000000000
--- a/documentation/tutorial/02-reactivity/03-reactive-statements/app-a/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	let count = 0;
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
diff --git a/documentation/tutorial/02-reactivity/03-reactive-statements/app-b/App.svelte b/documentation/tutorial/02-reactivity/03-reactive-statements/app-b/App.svelte
deleted file mode 100644
index 8d6f7aded5..0000000000
--- a/documentation/tutorial/02-reactivity/03-reactive-statements/app-b/App.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script>
-	let count = 0;
-
-	$: if (count >= 10) {
-		alert('count is dangerously high!');
-		count = 9;
-	}
-
-	function handleClick() {
-		count += 1;
-	}
-</script>
-
-<button on:click={handleClick}>
-	Clicked {count}
-	{count === 1 ? 'time' : 'times'}
-</button>
diff --git a/documentation/tutorial/02-reactivity/03-reactive-statements/text.md b/documentation/tutorial/02-reactivity/03-reactive-statements/text.md
deleted file mode 100644
index c2715ca473..0000000000
--- a/documentation/tutorial/02-reactivity/03-reactive-statements/text.md
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Statements
----
-
-We're not limited to declaring reactive _values_ — we can also run arbitrary _statements_ reactively. For example, we can log the value of `count` whenever it changes:
-
-```js
-$: console.log('the count is ' + count);
-```
-
-You can easily group statements together with a block:
-
-```js
-$: {
-	console.log('the count is ' + count);
-	alert('I SAID THE COUNT IS ' + count);
-}
-```
-
-You can even put the `$:` in front of things like `if` blocks:
-
-```js
-$: if (count >= 10) {
-	alert('count is dangerously high!');
-	count = 9;
-}
-```
diff --git a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-a/App.svelte b/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-a/App.svelte
deleted file mode 100644
index 5b55360fe3..0000000000
--- a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-a/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let numbers = [1, 2, 3, 4];
-
-	function addNumber() {
-		numbers.push(numbers.length + 1);
-	}
-
-	$: sum = numbers.reduce((t, n) => t + n, 0);
-</script>
-
-<p>{numbers.join(' + ')} = {sum}</p>
-
-<button on:click={addNumber}> Add a number </button>
diff --git a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-b/App.svelte b/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-b/App.svelte
deleted file mode 100644
index f8583940fc..0000000000
--- a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let numbers = [1, 2, 3, 4];
-
-	function addNumber() {
-		numbers = [...numbers, numbers.length + 1];
-	}
-
-	$: sum = numbers.reduce((t, n) => t + n, 0);
-</script>
-
-<p>{numbers.join(' + ')} = {sum}</p>
-
-<button on:click={addNumber}> Add a number </button>
diff --git a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/text.md b/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/text.md
deleted file mode 100644
index 3ca961027d..0000000000
--- a/documentation/tutorial/02-reactivity/04-updating-arrays-and-objects/text.md
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: Updating arrays and objects
----
-
-Svelte's reactivity is triggered by assignments. Methods that mutate arrays or objects will not trigger updates by themselves.
-
-In this example, clicking the "Add a number" button calls the `addNumber` function, which appends a number to the array but doesn't trigger the recalculation of `sum`.
-
-One way to fix that is to assign `numbers` to itself to tell the compiler it has changed:
-
-```js
-function addNumber() {
-	numbers.push(numbers.length + 1);
-	numbers = numbers;
-}
-```
-
-You could also write this more concisely using the ES6 spread syntax:
-
-```js
-function addNumber() {
-	numbers = [...numbers, numbers.length + 1];
-}
-```
-
-The same rule applies to array methods such as `pop`, `shift`, and `splice` and to object methods such as `Map.set`, `Set.add`, etc.
-
-Assignments to _properties_ of arrays and objects — e.g. `obj.foo += 1` or `array[i] = x` — work the same way as assignments to the values themselves.
-
-```js
-function addNumber() {
-	numbers[numbers.length] = numbers.length + 1;
-}
-```
-
-However, indirect assignments to references such as this...
-
-```js
-const foo = obj.foo;
-foo.bar = 'baz';
-```
-
-or
-
-```js
-function quox(thing) {
-	thing.foo.bar = 'baz';
-}
-quox(obj);
-```
-
-...won't trigger reactivity on `obj.foo.bar`, unless you follow it up with `obj = obj`.
-
-A simple rule of thumb: the updated variable must directly appear on the left hand side of the assignment.
diff --git a/documentation/tutorial/02-reactivity/meta.json b/documentation/tutorial/02-reactivity/meta.json
deleted file mode 100644
index fe8d63b26d..0000000000
--- a/documentation/tutorial/02-reactivity/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Reactivity"
-}
diff --git a/documentation/tutorial/03-props/01-declaring-props/app-a/App.svelte b/documentation/tutorial/03-props/01-declaring-props/app-a/App.svelte
deleted file mode 100644
index f64b69a87c..0000000000
--- a/documentation/tutorial/03-props/01-declaring-props/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
diff --git a/documentation/tutorial/03-props/01-declaring-props/app-a/Nested.svelte b/documentation/tutorial/03-props/01-declaring-props/app-a/Nested.svelte
deleted file mode 100644
index 141cae3230..0000000000
--- a/documentation/tutorial/03-props/01-declaring-props/app-a/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let answer;
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/tutorial/03-props/01-declaring-props/app-b/App.svelte b/documentation/tutorial/03-props/01-declaring-props/app-b/App.svelte
deleted file mode 100644
index f64b69a87c..0000000000
--- a/documentation/tutorial/03-props/01-declaring-props/app-b/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
diff --git a/documentation/tutorial/03-props/01-declaring-props/app-b/Nested.svelte b/documentation/tutorial/03-props/01-declaring-props/app-b/Nested.svelte
deleted file mode 100644
index 7267c0edea..0000000000
--- a/documentation/tutorial/03-props/01-declaring-props/app-b/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	export let answer;
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/tutorial/03-props/01-declaring-props/text.md b/documentation/tutorial/03-props/01-declaring-props/text.md
deleted file mode 100644
index dbf13d1e2a..0000000000
--- a/documentation/tutorial/03-props/01-declaring-props/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Declaring props
----
-
-So far, we've dealt exclusively with internal state — that is to say, the values are only accessible within a given component.
-
-In any real application, you'll need to pass data from one component down to its children. To do that, we need to declare _properties_, generally shortened to 'props'. In Svelte, we do that with the `export` keyword. Edit the `Nested.svelte` component:
-
-```svelte
-<script>
-	export let answer;
-</script>
-```
-
-> Just like `$:`, this may feel a little weird at first. That's not how `export` normally works in JavaScript modules! Just roll with it for now — it'll soon become second nature.
diff --git a/documentation/tutorial/03-props/02-default-values/app-a/App.svelte b/documentation/tutorial/03-props/02-default-values/app-a/App.svelte
deleted file mode 100644
index f64b69a87c..0000000000
--- a/documentation/tutorial/03-props/02-default-values/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
diff --git a/documentation/tutorial/03-props/02-default-values/app-a/Nested.svelte b/documentation/tutorial/03-props/02-default-values/app-a/Nested.svelte
deleted file mode 100644
index 7267c0edea..0000000000
--- a/documentation/tutorial/03-props/02-default-values/app-a/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	export let answer;
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/tutorial/03-props/02-default-values/app-b/App.svelte b/documentation/tutorial/03-props/02-default-values/app-b/App.svelte
deleted file mode 100644
index 27e880eb5c..0000000000
--- a/documentation/tutorial/03-props/02-default-values/app-b/App.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-	import Nested from './Nested.svelte';
-</script>
-
-<Nested answer={42} />
-<Nested />
diff --git a/documentation/tutorial/03-props/02-default-values/app-b/Nested.svelte b/documentation/tutorial/03-props/02-default-values/app-b/Nested.svelte
deleted file mode 100644
index 3efe9ccb75..0000000000
--- a/documentation/tutorial/03-props/02-default-values/app-b/Nested.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	export let answer = 'a mystery';
-</script>
-
-<p>The answer is {answer}</p>
diff --git a/documentation/tutorial/03-props/02-default-values/text.md b/documentation/tutorial/03-props/02-default-values/text.md
deleted file mode 100644
index 47a7502c06..0000000000
--- a/documentation/tutorial/03-props/02-default-values/text.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Default values
----
-
-We can easily specify default values for props in `Nested.svelte`:
-
-```svelte
-<script>
-	export let answer = 'a mystery';
-</script>
-```
-
-If we now add a second component _without_ an `answer` prop, it will fall back to the default:
-
-```svelte
-<Nested answer={42} />
-<Nested />
-```
diff --git a/documentation/tutorial/03-props/03-spread-props/app-a/App.svelte b/documentation/tutorial/03-props/03-spread-props/app-a/App.svelte
deleted file mode 100644
index 448895faf2..0000000000
--- a/documentation/tutorial/03-props/03-spread-props/app-a/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import Info from './Info.svelte';
-
-	const pkg = {
-		name: 'svelte',
-		version: 3,
-		speed: 'blazing',
-		website: 'https://svelte.dev'
-	};
-</script>
-
-<Info name={pkg.name} version={pkg.version} speed={pkg.speed} website={pkg.website} />
diff --git a/documentation/tutorial/03-props/03-spread-props/app-a/Info.svelte b/documentation/tutorial/03-props/03-spread-props/app-a/Info.svelte
deleted file mode 100644
index 241b84a9af..0000000000
--- a/documentation/tutorial/03-props/03-spread-props/app-a/Info.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	export let name;
-	export let version;
-	export let speed;
-	export let website;
-</script>
-
-<p>
-	The <code>{name}</code> package is {speed} fast. Download version {version} from
-	<a href="https://www.npmjs.com/package/{name}">npm</a>
-	and <a href={website}>learn more here</a>
-</p>
diff --git a/documentation/tutorial/03-props/03-spread-props/app-b/App.svelte b/documentation/tutorial/03-props/03-spread-props/app-b/App.svelte
deleted file mode 100644
index d2f97713d1..0000000000
--- a/documentation/tutorial/03-props/03-spread-props/app-b/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import Info from './Info.svelte';
-
-	const pkg = {
-		name: 'svelte',
-		version: 3,
-		speed: 'blazing',
-		website: 'https://svelte.dev'
-	};
-</script>
-
-<Info {...pkg} />
diff --git a/documentation/tutorial/03-props/03-spread-props/app-b/Info.svelte b/documentation/tutorial/03-props/03-spread-props/app-b/Info.svelte
deleted file mode 100644
index 241b84a9af..0000000000
--- a/documentation/tutorial/03-props/03-spread-props/app-b/Info.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	export let name;
-	export let version;
-	export let speed;
-	export let website;
-</script>
-
-<p>
-	The <code>{name}</code> package is {speed} fast. Download version {version} from
-	<a href="https://www.npmjs.com/package/{name}">npm</a>
-	and <a href={website}>learn more here</a>
-</p>
diff --git a/documentation/tutorial/03-props/03-spread-props/text.md b/documentation/tutorial/03-props/03-spread-props/text.md
deleted file mode 100644
index 0730110754..0000000000
--- a/documentation/tutorial/03-props/03-spread-props/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Spread props
----
-
-If you have an object of properties, you can 'spread' them onto a component instead of specifying each one:
-
-```svelte
-<Info {...pkg} />
-```
-
-> Conversely, if you need to reference all the props that were passed into a component, including ones that weren't declared with `export`, you can do so by accessing `$$props` directly. It's not generally recommended, as it's difficult for Svelte to optimise, but it's useful in rare cases.
diff --git a/documentation/tutorial/03-props/meta.json b/documentation/tutorial/03-props/meta.json
deleted file mode 100644
index d03965c7cb..0000000000
--- a/documentation/tutorial/03-props/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Props"
-}
diff --git a/documentation/tutorial/04-logic/01-if-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/01-if-blocks/app-a/App.svelte
deleted file mode 100644
index a68a0b1219..0000000000
--- a/documentation/tutorial/04-logic/01-if-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,11 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-<button on:click={toggle}> Log out </button>
-
-<button on:click={toggle}> Log in </button>
diff --git a/documentation/tutorial/04-logic/01-if-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/01-if-blocks/app-b/App.svelte
deleted file mode 100644
index d986710847..0000000000
--- a/documentation/tutorial/04-logic/01-if-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{/if}
-
-{#if !user.loggedIn}
-	<button on:click={toggle}> Log in </button>
-{/if}
diff --git a/documentation/tutorial/04-logic/01-if-blocks/text.md b/documentation/tutorial/04-logic/01-if-blocks/text.md
deleted file mode 100644
index 9b45e65fc2..0000000000
--- a/documentation/tutorial/04-logic/01-if-blocks/text.md
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: If blocks
----
-
-HTML doesn't have a way of expressing _logic_, like conditionals and loops. Svelte does.
-
-To conditionally render some markup, we wrap it in an `if` block:
-
-```svelte
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{/if}
-
-{#if !user.loggedIn}
-	<button on:click={toggle}> Log in </button>
-{/if}
-```
-
-Try it — update the component, and click on the buttons.
diff --git a/documentation/tutorial/04-logic/02-else-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/02-else-blocks/app-a/App.svelte
deleted file mode 100644
index d986710847..0000000000
--- a/documentation/tutorial/04-logic/02-else-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{/if}
-
-{#if !user.loggedIn}
-	<button on:click={toggle}> Log in </button>
-{/if}
diff --git a/documentation/tutorial/04-logic/02-else-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/02-else-blocks/app-b/App.svelte
deleted file mode 100644
index 146e54bcc0..0000000000
--- a/documentation/tutorial/04-logic/02-else-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let user = { loggedIn: false };
-
-	function toggle() {
-		user.loggedIn = !user.loggedIn;
-	}
-</script>
-
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{:else}
-	<button on:click={toggle}> Log in </button>
-{/if}
diff --git a/documentation/tutorial/04-logic/02-else-blocks/text.md b/documentation/tutorial/04-logic/02-else-blocks/text.md
deleted file mode 100644
index 677ac477dc..0000000000
--- a/documentation/tutorial/04-logic/02-else-blocks/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Else blocks
----
-
-Since the two conditions — `if user.loggedIn` and `if !user.loggedIn` — are mutually exclusive, we can simplify this component slightly by using an `else` block:
-
-```svelte
-{#if user.loggedIn}
-	<button on:click={toggle}> Log out </button>
-{:else}
-	<button on:click={toggle}> Log in </button>
-{/if}
-```
-
-> A `#` character always indicates a _block opening_ tag. A `/` character always indicates a _block closing_ tag. A `:` character, as in `{:else}`, indicates a _block continuation_ tag. Don't worry — you've already learned almost all the syntax Svelte adds to HTML.
diff --git a/documentation/tutorial/04-logic/03-else-if-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/03-else-if-blocks/app-a/App.svelte
deleted file mode 100644
index fb41a894f9..0000000000
--- a/documentation/tutorial/04-logic/03-else-if-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	let x = 7;
-</script>
-
-{#if x > 10}
-	<p>{x} is greater than 10</p>
-{:else}
-	<p>{x} is between 0 and 10</p>
-{/if}
diff --git a/documentation/tutorial/04-logic/03-else-if-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/03-else-if-blocks/app-b/App.svelte
deleted file mode 100644
index 2b740dbf9b..0000000000
--- a/documentation/tutorial/04-logic/03-else-if-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,11 +0,0 @@
-<script>
-	let x = 7;
-</script>
-
-{#if x > 10}
-	<p>{x} is greater than 10</p>
-{:else if 5 > x}
-	<p>{x} is less than 5</p>
-{:else}
-	<p>{x} is between 5 and 10</p>
-{/if}
diff --git a/documentation/tutorial/04-logic/03-else-if-blocks/text.md b/documentation/tutorial/04-logic/03-else-if-blocks/text.md
deleted file mode 100644
index 15c3d08fe4..0000000000
--- a/documentation/tutorial/04-logic/03-else-if-blocks/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Else-if blocks
----
-
-Multiple conditions can be 'chained' together with `else if`:
-
-```svelte
-{#if x > 10}
-	<p>{x} is greater than 10</p>
-{:else if 5 > x}
-	<p>{x} is less than 5</p>
-{:else}
-	<p>{x} is between 5 and 10</p>
-{/if}
-```
diff --git a/documentation/tutorial/04-logic/04-each-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/04-each-blocks/app-a/App.svelte
deleted file mode 100644
index de2601e7e6..0000000000
--- a/documentation/tutorial/04-logic/04-each-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let cats = [
-		{ id: 'J---aiyznGQ', name: 'Keyboard Cat' },
-		{ id: 'z_AbfPXTKms', name: 'Maru' },
-		{ id: 'OUtn3pvWmpg', name: 'Henri The Existential Cat' }
-	];
-</script>
-
-<h1>The Famous Cats of YouTube</h1>
-
-<ul>
-	<!-- open each block -->
-	<li>
-		<a target="_blank" href="https://www.youtube.com/watch?v={cat.id}" rel="noreferrer">
-			{cat.name}
-		</a>
-	</li>
-	<!-- close each block -->
-</ul>
diff --git a/documentation/tutorial/04-logic/04-each-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/04-each-blocks/app-b/App.svelte
deleted file mode 100644
index 527372f5ed..0000000000
--- a/documentation/tutorial/04-logic/04-each-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let cats = [
-		{ id: 'J---aiyznGQ', name: 'Keyboard Cat' },
-		{ id: 'z_AbfPXTKms', name: 'Maru' },
-		{ id: 'OUtn3pvWmpg', name: 'Henri The Existential Cat' }
-	];
-</script>
-
-<h1>The Famous Cats of YouTube</h1>
-
-<ul>
-	{#each cats as { id, name }, i}
-		<li>
-			<a target="_blank" href="https://www.youtube.com/watch?v={id}" rel="noreferrer">
-				{i + 1}: {name}
-			</a>
-		</li>
-	{/each}
-</ul>
diff --git a/documentation/tutorial/04-logic/04-each-blocks/text.md b/documentation/tutorial/04-logic/04-each-blocks/text.md
deleted file mode 100644
index 8f53608b20..0000000000
--- a/documentation/tutorial/04-logic/04-each-blocks/text.md
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Each blocks
----
-
-If you need to loop over lists of data, use an `each` block:
-
-```svelte
-<ul>
-	{#each cats as cat}
-		<li>
-			<a target="_blank" href="https://www.youtube.com/watch?v={cat.id}" rel="noreferrer">
-				{cat.name}
-			</a>
-		</li>
-	{/each}
-</ul>
-```
-
-> The expression (`cats`, in this case) can be any array or array-like object (i.e. it has a `length` property). You can loop over generic iterables with `each [...iterable]`.
-
-You can get the current _index_ as a second argument, like so:
-
-```svelte
-{#each cats as cat, i}
-	<li>
-		<a target="_blank" href="https://www.youtube.com/watch?v={cat.id}" rel="noreferrer">
-			{i + 1}: {cat.name}
-		</a>
-	</li>
-{/each}
-```
-
-If you prefer, you can use destructuring — `each cats as { id, name }` — and replace `cat.id` and `cat.name` with `id` and `name`.
diff --git a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
deleted file mode 100644
index 60cd74fbe7..0000000000
--- a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import Thing from './Thing.svelte';
-
-	let things = [
-		{ id: 1, name: 'apple' },
-		{ id: 2, name: 'banana' },
-		{ id: 3, name: 'carrot' },
-		{ id: 4, name: 'doughnut' },
-		{ id: 5, name: 'egg' }
-	];
-
-	function handleClick() {
-		things = things.slice(1);
-	}
-</script>
-
-<button on:click={handleClick}> Remove first thing </button>
-
-{#each things as thing}
-	<Thing name={thing.name} />
-{/each}
diff --git a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/Thing.svelte b/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/Thing.svelte
deleted file mode 100644
index e1b0bd43e7..0000000000
--- a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-a/Thing.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { onDestroy } from 'svelte';
-
-	const emojis = {
-		apple: '🍎',
-		banana: '🍌',
-		carrot: '🥕',
-		doughnut: '🍩',
-		egg: '🥚'
-	};
-
-	// the name is updated whenever the prop value changes...
-	export let name;
-
-	// ...but the "emoji" variable is fixed upon initialisation of the component
-	const emoji = emojis[name];
-
-	// observe in the console which entry is removed
-	onDestroy(() => {
-		console.log('thing destroyed: ' + name);
-	});
-</script>
-
-<p>
-	<span>The emoji for {name} is {emoji}</span>
-</p>
-
-<style>
-	p {
-		margin: 0.8em 0;
-	}
-	span {
-		display: inline-block;
-		padding: 0.2em 1em 0.3em;
-		text-align: center;
-		border-radius: 0.2em;
-		color: #333333;
-		background-color: #ffdfd3;
-	}
-</style>
diff --git a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
deleted file mode 100644
index 4e485456da..0000000000
--- a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import Thing from './Thing.svelte';
-
-	let things = [
-		{ id: 1, name: 'apple' },
-		{ id: 2, name: 'banana' },
-		{ id: 3, name: 'carrot' },
-		{ id: 4, name: 'doughnut' },
-		{ id: 5, name: 'egg' }
-	];
-
-	function handleClick() {
-		things = things.slice(1);
-	}
-</script>
-
-<button on:click={handleClick}> Remove first thing </button>
-
-{#each things as thing (thing.id)}
-	<Thing name={thing.name} />
-{/each}
diff --git a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/Thing.svelte b/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/Thing.svelte
deleted file mode 100644
index e1b0bd43e7..0000000000
--- a/documentation/tutorial/04-logic/05-keyed-each-blocks/app-b/Thing.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { onDestroy } from 'svelte';
-
-	const emojis = {
-		apple: '🍎',
-		banana: '🍌',
-		carrot: '🥕',
-		doughnut: '🍩',
-		egg: '🥚'
-	};
-
-	// the name is updated whenever the prop value changes...
-	export let name;
-
-	// ...but the "emoji" variable is fixed upon initialisation of the component
-	const emoji = emojis[name];
-
-	// observe in the console which entry is removed
-	onDestroy(() => {
-		console.log('thing destroyed: ' + name);
-	});
-</script>
-
-<p>
-	<span>The emoji for {name} is {emoji}</span>
-</p>
-
-<style>
-	p {
-		margin: 0.8em 0;
-	}
-	span {
-		display: inline-block;
-		padding: 0.2em 1em 0.3em;
-		text-align: center;
-		border-radius: 0.2em;
-		color: #333333;
-		background-color: #ffdfd3;
-	}
-</style>
diff --git a/documentation/tutorial/04-logic/05-keyed-each-blocks/text.md b/documentation/tutorial/04-logic/05-keyed-each-blocks/text.md
deleted file mode 100644
index e3f5f1afbd..0000000000
--- a/documentation/tutorial/04-logic/05-keyed-each-blocks/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Keyed each blocks
----
-
-By default, when you modify the value of an `each` block, it will add and remove items at the _end_ of the block, and update any values that have changed. That might not be what you want.
-
-It's easier to show why than to explain. Click to expand the `Console`, then click the 'Remove first thing' button a few times, and notice what happens: it does not remove the first `<Thing>` component, but rather the _last_ DOM node. Then it updates the `name` value in the remaining DOM nodes, but not the emoji.
-
-Instead, we'd like to remove only the first `<Thing>` component and its DOM node, and leave the others unaffected.
-
-To do that, we specify a unique identifier (or "key") for the `each` block:
-
-```svelte
-{#each things as thing (thing.id)}
-	<Thing name={thing.name} />
-{/each}
-```
-
-Here, `(thing.id)` is the _key_, which tells Svelte how to figure out which DOM node to change when the component updates.
-
-> You can use any object as the key, as Svelte uses a `Map` internally — in other words you could do `(thing)` instead of `(thing.id)`. Using a string or number is generally safer, however, since it means identity persists without referential equality, for example when updating with fresh data from an API server.
diff --git a/documentation/tutorial/04-logic/06-await-blocks/app-a/App.svelte b/documentation/tutorial/04-logic/06-await-blocks/app-a/App.svelte
deleted file mode 100644
index 430bade379..0000000000
--- a/documentation/tutorial/04-logic/06-await-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,23 +0,0 @@
-<script>
-	async function getRandomNumber() {
-		const res = await fetch(`/tutorial/random-number`);
-		const text = await res.text();
-
-		if (res.ok) {
-			return text;
-		} else {
-			throw new Error(text);
-		}
-	}
-
-	let promise = getRandomNumber();
-
-	function handleClick() {
-		promise = getRandomNumber();
-	}
-</script>
-
-<button on:click={handleClick}> generate random number </button>
-
-<!-- replace this element -->
-<p>{promise}</p>
diff --git a/documentation/tutorial/04-logic/06-await-blocks/app-b/App.svelte b/documentation/tutorial/04-logic/06-await-blocks/app-b/App.svelte
deleted file mode 100644
index ac46be1d63..0000000000
--- a/documentation/tutorial/04-logic/06-await-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	async function getRandomNumber() {
-		const res = await fetch(`/tutorial/random-number`);
-		const text = await res.text();
-
-		if (res.ok) {
-			return text;
-		} else {
-			throw new Error(text);
-		}
-	}
-
-	let promise = getRandomNumber();
-
-	function handleClick() {
-		promise = getRandomNumber();
-	}
-</script>
-
-<button on:click={handleClick}> generate random number </button>
-
-{#await promise}
-	<p>...waiting</p>
-{:then number}
-	<p>The number is {number}</p>
-{:catch error}
-	<p style="color: red">{error.message}</p>
-{/await}
diff --git a/documentation/tutorial/04-logic/06-await-blocks/text.md b/documentation/tutorial/04-logic/06-await-blocks/text.md
deleted file mode 100644
index 9a528da102..0000000000
--- a/documentation/tutorial/04-logic/06-await-blocks/text.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-title: Await blocks
----
-
-Most web applications have to deal with asynchronous data at some point. Svelte makes it easy to _await_ the value of [promises](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises) directly in your markup:
-
-```svelte
-{#await promise}
-	<p>...waiting</p>
-{:then number}
-	<p>The number is {number}</p>
-{:catch error}
-	<p style="color: red">{error.message}</p>
-{/await}
-```
-
-> Only the most recent `promise` is considered, meaning you don't need to worry about race conditions.
-
-If you know that your promise can't reject, you can omit the `catch` block. You can also omit the first block if you don't want to show anything until the promise resolves:
-
-```svelte
-{#await promise then number}
-	<p>the number is {number}</p>
-{/await}
-```
diff --git a/documentation/tutorial/04-logic/meta.json b/documentation/tutorial/04-logic/meta.json
deleted file mode 100644
index 22e69b0c83..0000000000
--- a/documentation/tutorial/04-logic/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Logic"
-}
diff --git a/documentation/tutorial/05-events/01-dom-events/app-a/App.svelte b/documentation/tutorial/05-events/01-dom-events/app-a/App.svelte
deleted file mode 100644
index 5a020e0ea9..0000000000
--- a/documentation/tutorial/05-events/01-dom-events/app-a/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-
-	function handleMousemove(event) {
-		m.x = event.clientX;
-		m.y = event.clientY;
-	}
-</script>
-
-<div>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/01-dom-events/app-b/App.svelte b/documentation/tutorial/05-events/01-dom-events/app-b/App.svelte
deleted file mode 100644
index 54470a9a5e..0000000000
--- a/documentation/tutorial/05-events/01-dom-events/app-b/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-
-	function handleMousemove(event) {
-		m.x = event.clientX;
-		m.y = event.clientY;
-	}
-</script>
-
-<div on:mousemove={handleMousemove}>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/01-dom-events/text.md b/documentation/tutorial/05-events/01-dom-events/text.md
deleted file mode 100644
index 64cfa32170..0000000000
--- a/documentation/tutorial/05-events/01-dom-events/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: DOM events
----
-
-As we've briefly seen already, you can listen to any event on an element with the `on:` directive:
-
-```svelte
-<div on:mousemove={handleMousemove}>
-	The mouse position is {m.x} x {m.y}
-</div>
-```
diff --git a/documentation/tutorial/05-events/02-inline-handlers/app-a/App.svelte b/documentation/tutorial/05-events/02-inline-handlers/app-a/App.svelte
deleted file mode 100644
index 54470a9a5e..0000000000
--- a/documentation/tutorial/05-events/02-inline-handlers/app-a/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-
-	function handleMousemove(event) {
-		m.x = event.clientX;
-		m.y = event.clientY;
-	}
-</script>
-
-<div on:mousemove={handleMousemove}>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/02-inline-handlers/app-b/App.svelte b/documentation/tutorial/05-events/02-inline-handlers/app-b/App.svelte
deleted file mode 100644
index 24127035ad..0000000000
--- a/documentation/tutorial/05-events/02-inline-handlers/app-b/App.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	let m = { x: 0, y: 0 };
-</script>
-
-<div on:mousemove={(e) => (m = { x: e.clientX, y: e.clientY })}>
-	The mouse position is {m.x} x {m.y}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/02-inline-handlers/text.md b/documentation/tutorial/05-events/02-inline-handlers/text.md
deleted file mode 100644
index 99ae43c429..0000000000
--- a/documentation/tutorial/05-events/02-inline-handlers/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Inline handlers
----
-
-You can also declare event handlers inline:
-
-```svelte
-<div on:mousemove={(e) => (m = { x: e.clientX, y: e.clientY })}>
-	The mouse position is {m.x} x {m.y}
-</div>
-```
-
-> In some frameworks you may see recommendations to avoid inline event handlers for performance reasons, particularly inside loops. That advice doesn't apply to Svelte — the compiler will always do the right thing, whichever form you choose.
diff --git a/documentation/tutorial/05-events/03-event-modifiers/app-a/App.svelte b/documentation/tutorial/05-events/03-event-modifiers/app-a/App.svelte
deleted file mode 100644
index 0a000c832f..0000000000
--- a/documentation/tutorial/05-events/03-event-modifiers/app-a/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	function handleClick() {
-		alert('clicked');
-	}
-</script>
-
-<button on:click={handleClick}> Click me </button>
diff --git a/documentation/tutorial/05-events/03-event-modifiers/app-b/App.svelte b/documentation/tutorial/05-events/03-event-modifiers/app-b/App.svelte
deleted file mode 100644
index c22168901f..0000000000
--- a/documentation/tutorial/05-events/03-event-modifiers/app-b/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	function handleClick() {
-		alert('no more alerts');
-	}
-</script>
-
-<button on:click|once={handleClick}> Click me </button>
diff --git a/documentation/tutorial/05-events/03-event-modifiers/text.md b/documentation/tutorial/05-events/03-event-modifiers/text.md
deleted file mode 100644
index eea563fec2..0000000000
--- a/documentation/tutorial/05-events/03-event-modifiers/text.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Event modifiers
----
-
-DOM event handlers can have _modifiers_ that alter their behaviour. For example, a handler with a `once` modifier will only run a single time:
-
-```svelte
-<script>
-	function handleClick() {
-		alert('no more alerts');
-	}
-</script>
-
-<button on:click|once={handleClick}> Click me </button>
-```
-
-The full list of modifiers:
-
-- `preventDefault` — calls `event.preventDefault()` before running the handler. Useful for client-side form handling, for example.
-- `stopPropagation` — calls `event.stopPropagation()`, preventing the event reaching the next element
-- `passive` — improves scrolling performance on touch/wheel events (Svelte will add it automatically where it's safe to do so)
-- `nonpassive` — explicitly set `passive: false`
-- `capture` — fires the handler during the _capture_ phase instead of the _bubbling_ phase ([MDN docs](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_bubbling_and_capture))
-- `once` — remove the handler after the first time it runs
-- `self` — only trigger handler if event.target is the element itself
-- `trusted` — only trigger handler if `event.isTrusted` is `true`. I.e. if the event is triggered by a user action.
-
-You can chain modifiers together, e.g. `on:click|once|capture={...}`.
diff --git a/documentation/tutorial/05-events/04-component-events/app-a/App.svelte b/documentation/tutorial/05-events/04-component-events/app-a/App.svelte
deleted file mode 100644
index 3600b45efd..0000000000
--- a/documentation/tutorial/05-events/04-component-events/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Inner on:message={handleMessage} />
diff --git a/documentation/tutorial/05-events/04-component-events/app-a/Inner.svelte b/documentation/tutorial/05-events/04-component-events/app-a/Inner.svelte
deleted file mode 100644
index cf0d8c89f2..0000000000
--- a/documentation/tutorial/05-events/04-component-events/app-a/Inner.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	// setup code goes here
-
-	function sayHello() {}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/tutorial/05-events/04-component-events/app-b/App.svelte b/documentation/tutorial/05-events/04-component-events/app-b/App.svelte
deleted file mode 100644
index 3600b45efd..0000000000
--- a/documentation/tutorial/05-events/04-component-events/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Inner on:message={handleMessage} />
diff --git a/documentation/tutorial/05-events/04-component-events/app-b/Inner.svelte b/documentation/tutorial/05-events/04-component-events/app-b/Inner.svelte
deleted file mode 100644
index c2e85b4c97..0000000000
--- a/documentation/tutorial/05-events/04-component-events/app-b/Inner.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/tutorial/05-events/04-component-events/text.md b/documentation/tutorial/05-events/04-component-events/text.md
deleted file mode 100644
index 0df2bc68f0..0000000000
--- a/documentation/tutorial/05-events/04-component-events/text.md
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Component events
----
-
-Components can also dispatch events. To do so, they must create an event dispatcher. Update `Inner.svelte`:
-
-```svelte
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-```
-
-> `createEventDispatcher` must be called when the component is first instantiated — you can't do it later inside e.g. a `setTimeout` callback. This links `dispatch` to the component instance.
-
-Notice that the `App` component is listening to the messages dispatched by `Inner` component thanks to the `on:message` directive. This directive is an attribute prefixed with `on:` followed by the event name that we are dispatching (in this case, `message`).
-
-Without this attribute, messages would still be dispatched, but the App would not react to it. You can try removing the `on:message` attribute and pressing the button again.
-
-> You can also try changing the event name to something else. For instance, change `dispatch('message')` to `dispatch('myevent')` in `Inner.svelte` and change the attribute name from `on:message` to `on:myevent` in the `App.svelte` component.
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-a/App.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-a/App.svelte
deleted file mode 100644
index 2e8e743f4e..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Outer from './Outer.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Outer on:message={handleMessage} />
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-a/Inner.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-a/Inner.svelte
deleted file mode 100644
index c2e85b4c97..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-a/Inner.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-a/Outer.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-a/Outer.svelte
deleted file mode 100644
index 77f0490d23..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-a/Outer.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-</script>
-
-<Inner />
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-b/App.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-b/App.svelte
deleted file mode 100644
index 2e8e743f4e..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import Outer from './Outer.svelte';
-
-	function handleMessage(event) {
-		alert(event.detail.text);
-	}
-</script>
-
-<Outer on:message={handleMessage} />
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-b/Inner.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-b/Inner.svelte
deleted file mode 100644
index c2e85b4c97..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-b/Inner.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function sayHello() {
-		dispatch('message', {
-			text: 'Hello!'
-		});
-	}
-</script>
-
-<button on:click={sayHello}> Click to say hello </button>
diff --git a/documentation/tutorial/05-events/05-event-forwarding/app-b/Outer.svelte b/documentation/tutorial/05-events/05-event-forwarding/app-b/Outer.svelte
deleted file mode 100644
index 62a5d1d852..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/app-b/Outer.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import Inner from './Inner.svelte';
-</script>
-
-<Inner on:message />
diff --git a/documentation/tutorial/05-events/05-event-forwarding/text.md b/documentation/tutorial/05-events/05-event-forwarding/text.md
deleted file mode 100644
index 9257267688..0000000000
--- a/documentation/tutorial/05-events/05-event-forwarding/text.md
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: Event forwarding
----
-
-Unlike DOM events, component events don't _bubble_. If you want to listen to an event on some deeply nested component, the intermediate components must _forward_ the event.
-
-In this case, we have the same `App.svelte` and `Inner.svelte` as in the [previous chapter](/tutorial/component-events), but there's now an `Outer.svelte` component that contains `<Inner/>`.
-
-One way we could solve the problem is adding `createEventDispatcher` to `Outer.svelte`, listening for the `message` event, and creating a handler for it:
-
-```svelte
-<script>
-	import Inner from './Inner.svelte';
-	import { createEventDispatcher } from 'svelte';
-
-	const dispatch = createEventDispatcher();
-
-	function forward(event) {
-		dispatch('message', event.detail);
-	}
-</script>
-
-<Inner on:message={forward} />
-```
-
-But that's a lot of code to write, so Svelte gives us an equivalent shorthand — an `on:message` event directive without a value means 'forward all `message` events'.
-
-```svelte
-<script>
-	import Inner from './Inner.svelte';
-</script>
-
-<Inner on:message />
-```
diff --git a/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/App.svelte b/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/App.svelte
deleted file mode 100644
index f7dc6576bf..0000000000
--- a/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import CustomButton from './CustomButton.svelte';
-
-	function handleClick() {
-		alert('Button Clicked');
-	}
-</script>
-
-<CustomButton on:click={handleClick} />
diff --git a/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/CustomButton.svelte b/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/CustomButton.svelte
deleted file mode 100644
index be35e53a41..0000000000
--- a/documentation/tutorial/05-events/06-dom-event-forwarding/app-a/CustomButton.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<button> Click me </button>
-
-<style>
-	button {
-		background: #e2e8f0;
-		color: #64748b;
-		border: unset;
-		border-radius: 6px;
-		padding: 0.75rem 1.5rem;
-		cursor: pointer;
-	}
-	button:hover {
-		background: #cbd5e1;
-		color: #475569;
-	}
-	button:focus {
-		background: #94a3b8;
-		color: #f1f5f9;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte b/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte
deleted file mode 100644
index f7dc6576bf..0000000000
--- a/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import CustomButton from './CustomButton.svelte';
-
-	function handleClick() {
-		alert('Button Clicked');
-	}
-</script>
-
-<CustomButton on:click={handleClick} />
diff --git a/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte b/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte
deleted file mode 100644
index 04f17a4436..0000000000
--- a/documentation/tutorial/05-events/06-dom-event-forwarding/app-b/CustomButton.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<button on:click> Click me </button>
-
-<style>
-	button {
-		background: #e2e8f0;
-		color: #64748b;
-		border: unset;
-		border-radius: 6px;
-		padding: 0.75rem 1.5rem;
-		cursor: pointer;
-	}
-	button:hover {
-		background: #cbd5e1;
-		color: #475569;
-	}
-	button:focus {
-		background: #94a3b8;
-		color: #f1f5f9;
-	}
-</style>
diff --git a/documentation/tutorial/05-events/06-dom-event-forwarding/text.md b/documentation/tutorial/05-events/06-dom-event-forwarding/text.md
deleted file mode 100644
index de30272fd8..0000000000
--- a/documentation/tutorial/05-events/06-dom-event-forwarding/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: DOM event forwarding
----
-
-Event forwarding works for DOM events too.
-
-We want to get notified of clicks on our `<CustomButton>` — to do that, we just need to forward `click` events on the `<button>` element in `CustomButton.svelte`:
-
-```svelte
-<button on:click> Click me </button>
-```
diff --git a/documentation/tutorial/05-events/meta.json b/documentation/tutorial/05-events/meta.json
deleted file mode 100644
index 42460e989b..0000000000
--- a/documentation/tutorial/05-events/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Events"
-}
diff --git a/documentation/tutorial/06-bindings/01-text-inputs/app-a/App.svelte b/documentation/tutorial/06-bindings/01-text-inputs/app-a/App.svelte
deleted file mode 100644
index 39ae9ad6b9..0000000000
--- a/documentation/tutorial/06-bindings/01-text-inputs/app-a/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	let name = 'world';
-</script>
-
-<input value={name} />
-
-<h1>Hello {name}!</h1>
diff --git a/documentation/tutorial/06-bindings/01-text-inputs/app-b/App.svelte b/documentation/tutorial/06-bindings/01-text-inputs/app-b/App.svelte
deleted file mode 100644
index 94061c0df2..0000000000
--- a/documentation/tutorial/06-bindings/01-text-inputs/app-b/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	let name = 'world';
-</script>
-
-<input bind:value={name} />
-
-<h1>Hello {name}!</h1>
diff --git a/documentation/tutorial/06-bindings/01-text-inputs/text.md b/documentation/tutorial/06-bindings/01-text-inputs/text.md
deleted file mode 100644
index 68e0c2ff9c..0000000000
--- a/documentation/tutorial/06-bindings/01-text-inputs/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Text inputs
----
-
-As a general rule, data flow in Svelte is _top down_ — a parent component can set props on a child component, and a component can set attributes on an element, but not the other way around.
-
-Sometimes it's useful to break that rule. Take the case of the `<input>` element in this component — we _could_ add an `on:input` event handler that sets the value of `name` to `event.target.value`, but it's a bit... boilerplatey. It gets even worse with other form elements, as we'll see.
-
-Instead, we can use the `bind:value` directive:
-
-```svelte
-<input bind:value={name} />
-```
-
-This means that not only will changes to the value of `name` update the input value, but changes to the input value will update `name`.
diff --git a/documentation/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte b/documentation/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte
deleted file mode 100644
index 69f1405744..0000000000
--- a/documentation/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte
+++ /dev/null
@@ -1,26 +0,0 @@
-<script>
-	let a = 1;
-	let b = 2;
-</script>
-
-<label>
-	<input type="number" value={a} min="0" max="10" />
-	<input type="range" value={a} min="0" max="10" />
-</label>
-
-<label>
-	<input type="number" value={b} min="0" max="10" />
-	<input type="range" value={b} min="0" max="10" />
-</label>
-
-<p>{a} + {b} = {a + b}</p>
-
-<style>
-	label {
-		display: flex;
-	}
-	input,
-	p {
-		margin: 6px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte b/documentation/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte
deleted file mode 100644
index 0598d99ee0..0000000000
--- a/documentation/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte
+++ /dev/null
@@ -1,26 +0,0 @@
-<script>
-	let a = 1;
-	let b = 2;
-</script>
-
-<label>
-	<input type="number" bind:value={a} min="0" max="10" />
-	<input type="range" bind:value={a} min="0" max="10" />
-</label>
-
-<label>
-	<input type="number" bind:value={b} min="0" max="10" />
-	<input type="range" bind:value={b} min="0" max="10" />
-</label>
-
-<p>{a} + {b} = {a + b}</p>
-
-<style>
-	label {
-		display: flex;
-	}
-	input,
-	p {
-		margin: 6px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/02-numeric-inputs/text.md b/documentation/tutorial/06-bindings/02-numeric-inputs/text.md
deleted file mode 100644
index a9b539e603..0000000000
--- a/documentation/tutorial/06-bindings/02-numeric-inputs/text.md
+++ /dev/null
@@ -1,12 +0,0 @@
----
-title: Numeric inputs
----
-
-In the DOM, everything is a string. That's unhelpful when you're dealing with numeric inputs — `type="number"` and `type="range"` — as it means you have to remember to coerce `input.value` before using it.
-
-With `bind:value`, Svelte takes care of it for you:
-
-```svelte
-<input type="number" bind:value={a} min="0" max="10" />
-<input type="range" bind:value={a} min="0" max="10" />
-```
diff --git a/documentation/tutorial/06-bindings/03-checkbox-inputs/app-a/App.svelte b/documentation/tutorial/06-bindings/03-checkbox-inputs/app-a/App.svelte
deleted file mode 100644
index fcc421e3b9..0000000000
--- a/documentation/tutorial/06-bindings/03-checkbox-inputs/app-a/App.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	let yes = false;
-</script>
-
-<label>
-	<input type="checkbox" checked={yes} />
-	Yes! Send me regular email spam
-</label>
-
-{#if yes}
-	<p>Thank you. We will bombard your inbox and sell your personal details.</p>
-{:else}
-	<p>You must opt-in to continue. If you're not paying, you're the product.</p>
-{/if}
-
-<button disabled={!yes}> Subscribe </button>
diff --git a/documentation/tutorial/06-bindings/03-checkbox-inputs/app-b/App.svelte b/documentation/tutorial/06-bindings/03-checkbox-inputs/app-b/App.svelte
deleted file mode 100644
index b337359317..0000000000
--- a/documentation/tutorial/06-bindings/03-checkbox-inputs/app-b/App.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<script>
-	let yes = false;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={yes} />
-	Yes! Send me regular email spam
-</label>
-
-{#if yes}
-	<p>Thank you. We will bombard your inbox and sell your personal details.</p>
-{:else}
-	<p>You must opt-in to continue. If you're not paying, you're the product.</p>
-{/if}
-
-<button disabled={!yes}> Subscribe </button>
diff --git a/documentation/tutorial/06-bindings/03-checkbox-inputs/text.md b/documentation/tutorial/06-bindings/03-checkbox-inputs/text.md
deleted file mode 100644
index f2dd2e3c01..0000000000
--- a/documentation/tutorial/06-bindings/03-checkbox-inputs/text.md
+++ /dev/null
@@ -1,9 +0,0 @@
----
-title: Checkbox inputs
----
-
-Checkboxes are used for toggling between states. Instead of binding to `input.value`, we bind to `input.checked`:
-
-```svelte
-<input type="checkbox" bind:checked={yes} />
-```
diff --git a/documentation/tutorial/06-bindings/04-group-inputs/app-a/App.svelte b/documentation/tutorial/06-bindings/04-group-inputs/app-a/App.svelte
deleted file mode 100644
index f41a922a4b..0000000000
--- a/documentation/tutorial/06-bindings/04-group-inputs/app-a/App.svelte
+++ /dev/null
@@ -1,55 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" group={scoops} name="scoops" value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" group={scoops} name="scoops" value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" group={scoops} name="scoops" value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-<label>
-	<input type="checkbox" group={flavours} name="flavours" value="Cookies and cream" />
-	Cookies and cream
-</label>
-
-<label>
-	<input type="checkbox" group={flavours} name="flavours" value="Mint choc chip" />
-	Mint choc chip
-</label>
-
-<label>
-	<input type="checkbox" group={flavours} name="flavours" value="Raspberry ripple" />
-	Raspberry ripple
-</label>
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/tutorial/06-bindings/04-group-inputs/app-b/App.svelte b/documentation/tutorial/06-bindings/04-group-inputs/app-b/App.svelte
deleted file mode 100644
index ce0565ab8e..0000000000
--- a/documentation/tutorial/06-bindings/04-group-inputs/app-b/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" bind:group={scoops} name="scoops" value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} name="scoops" value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} name="scoops" value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-{#each menu as flavour}
-	<label>
-		<input type="checkbox" bind:group={flavours} name="flavours" value={flavour} />
-		{flavour}
-	</label>
-{/each}
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/tutorial/06-bindings/04-group-inputs/text.md b/documentation/tutorial/06-bindings/04-group-inputs/text.md
deleted file mode 100644
index 790e95ea83..0000000000
--- a/documentation/tutorial/06-bindings/04-group-inputs/text.md
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: Group inputs
----
-
-If you have multiple inputs relating to the same value, you can use `bind:group` along with the `value` attribute. Radio inputs in the same group are mutually exclusive; checkbox inputs in the same group form an array of selected values.
-
-Add `bind:group` to each input:
-
-```svelte
-<input type="radio" bind:group={scoops} name="scoops" value={1} />
-```
-
-In this case, we could make the code simpler by moving the checkbox inputs into an `each` block. First, add a `menu` variable to the `<script>` block...
-
-```js
-let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-```
-
-...then replace the second section:
-
-```svelte
-<h2>Flavours</h2>
-
-{#each menu as flavour}
-	<label>
-		<input type="checkbox" bind:group={flavours} name="flavours" value={flavour} />
-		{flavour}
-	</label>
-{/each}
-```
-
-It's now easy to expand our ice cream menu in new and exciting directions.
diff --git a/documentation/tutorial/06-bindings/05-textarea-inputs/app-a/App.svelte b/documentation/tutorial/06-bindings/05-textarea-inputs/app-a/App.svelte
deleted file mode 100644
index 8de3d510d2..0000000000
--- a/documentation/tutorial/06-bindings/05-textarea-inputs/app-a/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { marked } from 'marked';
-	let value = `Some words are *italic*, some are **bold**`;
-</script>
-
-{@html marked(value)}
-
-<textarea {value} />
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/05-textarea-inputs/app-b/App.svelte b/documentation/tutorial/06-bindings/05-textarea-inputs/app-b/App.svelte
deleted file mode 100644
index ccfaad4c2a..0000000000
--- a/documentation/tutorial/06-bindings/05-textarea-inputs/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { marked } from 'marked';
-	let value = `Some words are *italic*, some are **bold**`;
-</script>
-
-{@html marked(value)}
-
-<textarea bind:value />
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/05-textarea-inputs/text.md b/documentation/tutorial/06-bindings/05-textarea-inputs/text.md
deleted file mode 100644
index aad1b5ced0..0000000000
--- a/documentation/tutorial/06-bindings/05-textarea-inputs/text.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Textarea inputs
----
-
-The `<textarea>` element behaves similarly to a text input in Svelte — use `bind:value` to create a two-way binding between the `<textarea>` content and the `value` variable:
-
-<!-- prettier-ignore -->
-```svelte
-<textarea bind:value={value} />
-```
-
-In cases like these, where the names match, we can also use a shorthand form:
-
-```svelte
-<textarea bind:value />
-```
-
-This applies to all bindings, not just textareas.
diff --git a/documentation/tutorial/06-bindings/06-select-bindings/app-a/App.svelte b/documentation/tutorial/06-bindings/06-select-bindings/app-a/App.svelte
deleted file mode 100644
index eaaa0aeabe..0000000000
--- a/documentation/tutorial/06-bindings/06-select-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,41 +0,0 @@
-<script>
-	let questions = [
-		{ id: 1, text: `Where did you go to school?` },
-		{ id: 2, text: `What is your mother's name?` },
-		{ id: 3, text: `What is another personal fact that an attacker could easily find with Google?` }
-	];
-
-	let selected;
-
-	let answer = '';
-
-	function handleSubmit() {
-		alert(`answered question ${selected.id} (${selected.text}) with "${answer}"`);
-	}
-</script>
-
-<h2>Insecurity questions</h2>
-
-<form on:submit|preventDefault={handleSubmit}>
-	<select value={selected} on:change={() => (answer = '')}>
-		{#each questions as question}
-			<option value={question}>
-				{question.text}
-			</option>
-		{/each}
-	</select>
-
-	<input bind:value={answer} />
-
-	<button disabled={!answer} type="submit"> Submit </button>
-</form>
-
-<p>selected question {selected ? selected.id : '[waiting...]'}</p>
-
-<style>
-	input {
-		display: block;
-		width: 500px;
-		max-width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/06-select-bindings/app-b/App.svelte b/documentation/tutorial/06-bindings/06-select-bindings/app-b/App.svelte
deleted file mode 100644
index 7785258fe2..0000000000
--- a/documentation/tutorial/06-bindings/06-select-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,41 +0,0 @@
-<script>
-	let questions = [
-		{ id: 1, text: `Where did you go to school?` },
-		{ id: 2, text: `What is your mother's name?` },
-		{ id: 3, text: `What is another personal fact that an attacker could easily find with Google?` }
-	];
-
-	let selected;
-
-	let answer = '';
-
-	function handleSubmit() {
-		alert(`answered question ${selected.id} (${selected.text}) with "${answer}"`);
-	}
-</script>
-
-<h2>Insecurity questions</h2>
-
-<form on:submit|preventDefault={handleSubmit}>
-	<select bind:value={selected} on:change={() => (answer = '')}>
-		{#each questions as question}
-			<option value={question}>
-				{question.text}
-			</option>
-		{/each}
-	</select>
-
-	<input bind:value={answer} />
-
-	<button disabled={!answer} type="submit"> Submit </button>
-</form>
-
-<p>selected question {selected ? selected.id : '[waiting...]'}</p>
-
-<style>
-	input {
-		display: block;
-		width: 500px;
-		max-width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/06-select-bindings/text.md b/documentation/tutorial/06-bindings/06-select-bindings/text.md
deleted file mode 100644
index 2e076fc36f..0000000000
--- a/documentation/tutorial/06-bindings/06-select-bindings/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Select bindings
----
-
-We can also use `bind:value` with `<select>` elements. Update line 20:
-
-```svelte
-<select bind:value={selected} on:change="{() => answer = ''}">
-```
-
-Note that the `<option>` values are objects rather than strings. Svelte doesn't mind.
-
-> Because we haven't set an initial value of `selected`, the binding will set it to the default value (the first in the list) automatically. Be careful though — until the binding is initialised, `selected` remains undefined, so we can't blindly reference e.g. `selected.id` in the template. If your use case allows it, you could also set an initial value to bypass this problem.
diff --git a/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-a/App.svelte b/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-a/App.svelte
deleted file mode 100644
index 0ab215d519..0000000000
--- a/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" bind:group={scoops} value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-{#each menu as flavour}
-	<label>
-		<input type="checkbox" bind:group={flavours} value={flavour} />
-		{flavour}
-	</label>
-{/each}
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-b/App.svelte b/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-b/App.svelte
deleted file mode 100644
index 2fd19c28ad..0000000000
--- a/documentation/tutorial/06-bindings/07-multiple-select-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,50 +0,0 @@
-<script>
-	let scoops = 1;
-	let flavours = ['Mint choc chip'];
-
-	let menu = ['Cookies and cream', 'Mint choc chip', 'Raspberry ripple'];
-
-	function join(flavours) {
-		if (flavours.length === 1) return flavours[0];
-		return `${flavours.slice(0, -1).join(', ')} and ${flavours[flavours.length - 1]}`;
-	}
-</script>
-
-<h2>Size</h2>
-
-<label>
-	<input type="radio" bind:group={scoops} value={1} />
-	One scoop
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={2} />
-	Two scoops
-</label>
-
-<label>
-	<input type="radio" bind:group={scoops} value={3} />
-	Three scoops
-</label>
-
-<h2>Flavours</h2>
-
-<select multiple bind:value={flavours}>
-	{#each menu as flavour}
-		<option value={flavour}>
-			{flavour}
-		</option>
-	{/each}
-</select>
-
-{#if flavours.length === 0}
-	<p>Please select at least one flavour</p>
-{:else if flavours.length > scoops}
-	<p>Can't order more flavours than scoops!</p>
-{:else}
-	<p>
-		You ordered {scoops}
-		{scoops === 1 ? 'scoop' : 'scoops'}
-		of {join(flavours)}
-	</p>
-{/if}
diff --git a/documentation/tutorial/06-bindings/07-multiple-select-bindings/text.md b/documentation/tutorial/06-bindings/07-multiple-select-bindings/text.md
deleted file mode 100644
index 1107d74b54..0000000000
--- a/documentation/tutorial/06-bindings/07-multiple-select-bindings/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Select multiple
----
-
-A select can have a `multiple` attribute, in which case it will populate an array rather than selecting a single value.
-
-Returning to our [earlier ice cream example](/tutorial/group-inputs), we can replace the checkboxes with a `<select multiple>`:
-
-```svelte
-<h2>Flavours</h2>
-
-<select multiple bind:value={flavours}>
-	{#each menu as flavour}
-		<option value={flavour}>
-			{flavour}
-		</option>
-	{/each}
-</select>
-```
-
-> Press and hold the `control` key (or the `command` key on MacOS) for selecting multiple options.
diff --git a/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-a/App.svelte b/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-a/App.svelte
deleted file mode 100644
index 2d01a6ced8..0000000000
--- a/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let html = '<p>Write some text!</p>';
-</script>
-
-<div contenteditable="true" />
-
-<pre>{html}</pre>
-
-<style>
-	[contenteditable] {
-		padding: 0.5em;
-		border: 1px solid #eee;
-		border-radius: 4px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-b/App.svelte b/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-b/App.svelte
deleted file mode 100644
index b7c0ad8c31..0000000000
--- a/documentation/tutorial/06-bindings/08-contenteditable-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let html = '<p>Write some text!</p>';
-</script>
-
-<div contenteditable="true" bind:innerHTML={html} />
-
-<pre>{html}</pre>
-
-<style>
-	[contenteditable] {
-		padding: 0.5em;
-		border: 1px solid #eee;
-		border-radius: 4px;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/08-contenteditable-bindings/text.md b/documentation/tutorial/06-bindings/08-contenteditable-bindings/text.md
deleted file mode 100644
index 7ba124e38a..0000000000
--- a/documentation/tutorial/06-bindings/08-contenteditable-bindings/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Contenteditable bindings
----
-
-Elements with the `contenteditable` attribute support the following bindings:
-
-- [`innerHTML`](https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML)
-- [`innerText`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/innerText)
-- [`textContent`](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent)
-
-There are slight differences between each of these, read more about them [here](https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent#Differences_from_innerText).
-
-```svelte
-<div contenteditable="true" bind:innerHTML={html} />
-```
diff --git a/documentation/tutorial/06-bindings/09-each-block-bindings/app-a/App.svelte b/documentation/tutorial/06-bindings/09-each-block-bindings/app-a/App.svelte
deleted file mode 100644
index a42c8136ad..0000000000
--- a/documentation/tutorial/06-bindings/09-each-block-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	let todos = [
-		{ done: false, text: 'finish Svelte tutorial' },
-		{ done: false, text: 'build an app' },
-		{ done: false, text: 'world domination' }
-	];
-
-	function add() {
-		todos = todos.concat({ done: false, text: '' });
-	}
-
-	function clear() {
-		todos = todos.filter((t) => !t.done);
-	}
-
-	$: remaining = todos.filter((t) => !t.done).length;
-</script>
-
-<h1>Todos</h1>
-
-{#each todos as todo}
-	<div class:done={todo.done}>
-		<input type="checkbox" checked={todo.done} />
-
-		<input placeholder="What needs to be done?" value={todo.text} />
-	</div>
-{/each}
-
-<p>{remaining} remaining</p>
-
-<button on:click={add}> Add new </button>
-
-<button on:click={clear}> Clear completed </button>
-
-<style>
-	.done {
-		opacity: 0.4;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/09-each-block-bindings/app-b/App.svelte b/documentation/tutorial/06-bindings/09-each-block-bindings/app-b/App.svelte
deleted file mode 100644
index 3ddb1a4fb4..0000000000
--- a/documentation/tutorial/06-bindings/09-each-block-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	let todos = [
-		{ done: false, text: 'finish Svelte tutorial' },
-		{ done: false, text: 'build an app' },
-		{ done: false, text: 'world domination' }
-	];
-
-	function add() {
-		todos = todos.concat({ done: false, text: '' });
-	}
-
-	function clear() {
-		todos = todos.filter((t) => !t.done);
-	}
-
-	$: remaining = todos.filter((t) => !t.done).length;
-</script>
-
-<h1>Todos</h1>
-
-{#each todos as todo}
-	<div class:done={todo.done}>
-		<input type="checkbox" bind:checked={todo.done} />
-
-		<input placeholder="What needs to be done?" bind:value={todo.text} />
-	</div>
-{/each}
-
-<p>{remaining} remaining</p>
-
-<button on:click={add}> Add new </button>
-
-<button on:click={clear}> Clear completed </button>
-
-<style>
-	.done {
-		opacity: 0.4;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/09-each-block-bindings/text.md b/documentation/tutorial/06-bindings/09-each-block-bindings/text.md
deleted file mode 100644
index cbba3d97f3..0000000000
--- a/documentation/tutorial/06-bindings/09-each-block-bindings/text.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Each block bindings
----
-
-You can even bind to properties inside an `each` block.
-
-```svelte
-{#each todos as todo}
-	<div class:done={todo.done}>
-		<input type="checkbox" bind:checked={todo.done} />
-
-		<input placeholder="What needs to be done?" bind:value={todo.text} />
-	</div>
-{/each}
-```
-
-> Note that interacting with these `<input>` elements will mutate the array. If you prefer to work with immutable data, you should avoid these bindings and use event handlers instead.
diff --git a/documentation/tutorial/06-bindings/10-media-elements/app-a/App.svelte b/documentation/tutorial/06-bindings/10-media-elements/app-a/App.svelte
deleted file mode 100644
index 2ab418cc08..0000000000
--- a/documentation/tutorial/06-bindings/10-media-elements/app-a/App.svelte
+++ /dev/null
@@ -1,131 +0,0 @@
-<script>
-	// These values are bound to properties of the video
-	let time = 0;
-	let duration;
-	let paused = true;
-
-	let showControls = true;
-	let showControlsTimeout;
-
-	// Used to track time of last mouse down event
-	let lastMouseDown;
-
-	function handleMove(e) {
-		// Make the controls visible, but fade out after
-		// 2.5 seconds of inactivity
-		clearTimeout(showControlsTimeout);
-		showControlsTimeout = setTimeout(() => (showControls = false), 2500);
-		showControls = true;
-
-		if (!duration) return; // video not loaded yet
-		if (e.type !== 'touchmove' && !(e.buttons & 1)) return; // mouse not down
-
-		const clientX = e.type === 'touchmove' ? e.touches[0].clientX : e.clientX;
-		const { left, right } = this.getBoundingClientRect();
-		time = (duration * (clientX - left)) / (right - left);
-	}
-
-	// we can't rely on the built-in click event, because it fires
-	// after a drag — we have to listen for clicks ourselves
-	function handleMousedown(e) {
-		lastMouseDown = new Date();
-	}
-
-	function handleMouseup(e) {
-		if (new Date() - lastMouseDown < 300) {
-			if (paused) e.target.play();
-			else e.target.pause();
-		}
-	}
-
-	function format(seconds) {
-		if (isNaN(seconds)) return '...';
-
-		const minutes = Math.floor(seconds / 60);
-		seconds = Math.floor(seconds % 60);
-		if (seconds < 10) seconds = '0' + seconds;
-
-		return `${minutes}:${seconds}`;
-	}
-</script>
-
-<h1>Caminandes: Llamigos</h1>
-<p>From <a href="https://studio.blender.org/films">Blender Studio</a>. CC-BY</p>
-
-<div>
-	<video
-		poster="https://sveltejs.github.io/assets/caminandes-llamigos.jpg"
-		src="https://sveltejs.github.io/assets/caminandes-llamigos.mp4"
-		on:mousemove={handleMove}
-		on:touchmove|preventDefault={handleMove}
-		on:mousedown={handleMousedown}
-		on:mouseup={handleMouseup}
-	>
-		<track kind="captions" />
-	</video>
-
-	<div class="controls" style="opacity: {duration && showControls ? 1 : 0}">
-		<progress value={time / duration || 0} />
-
-		<div class="info">
-			<span class="time">{format(time)}</span>
-			<span>click anywhere to {paused ? 'play' : 'pause'} / drag to seek</span>
-			<span class="time">{format(duration)}</span>
-		</div>
-	</div>
-</div>
-
-<style>
-	div {
-		position: relative;
-	}
-
-	.controls {
-		position: absolute;
-		top: 0;
-		width: 100%;
-		transition: opacity 1s;
-	}
-
-	.info {
-		display: flex;
-		width: 100%;
-		justify-content: space-between;
-	}
-
-	span {
-		padding: 0.2em 0.5em;
-		color: white;
-		text-shadow: 0 0 8px black;
-		font-size: 1.4em;
-		opacity: 0.7;
-	}
-
-	.time {
-		width: 3em;
-	}
-
-	.time:last-child {
-		text-align: right;
-	}
-
-	progress {
-		display: block;
-		width: 100%;
-		height: 10px;
-		-webkit-appearance: none;
-		appearance: none;
-	}
-
-	progress::-webkit-progress-bar {
-		background-color: rgba(0, 0, 0, 0.2);
-	}
-
-	progress::-webkit-progress-value {
-		background-color: rgba(255, 255, 255, 0.6);
-	}
-
-	video {
-		width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/10-media-elements/app-b/App.svelte b/documentation/tutorial/06-bindings/10-media-elements/app-b/App.svelte
deleted file mode 100644
index 836804f8bc..0000000000
--- a/documentation/tutorial/06-bindings/10-media-elements/app-b/App.svelte
+++ /dev/null
@@ -1,134 +0,0 @@
-<script>
-	// These values are bound to properties of the video
-	let time = 0;
-	let duration;
-	let paused = true;
-
-	let showControls = true;
-	let showControlsTimeout;
-
-	// Used to track time of last mouse down event
-	let lastMouseDown;
-
-	function handleMove(e) {
-		// Make the controls visible, but fade out after
-		// 2.5 seconds of inactivity
-		clearTimeout(showControlsTimeout);
-		showControlsTimeout = setTimeout(() => (showControls = false), 2500);
-		showControls = true;
-
-		if (!duration) return; // video not loaded yet
-		if (e.type !== 'touchmove' && !(e.buttons & 1)) return; // mouse not down
-
-		const clientX = e.type === 'touchmove' ? e.touches[0].clientX : e.clientX;
-		const { left, right } = this.getBoundingClientRect();
-		time = (duration * (clientX - left)) / (right - left);
-	}
-
-	// we can't rely on the built-in click event, because it fires
-	// after a drag — we have to listen for clicks ourselves
-	function handleMousedown(e) {
-		lastMouseDown = new Date();
-	}
-
-	function handleMouseup(e) {
-		if (new Date() - lastMouseDown < 300) {
-			if (paused) e.target.play();
-			else e.target.pause();
-		}
-	}
-
-	function format(seconds) {
-		if (isNaN(seconds)) return '...';
-
-		const minutes = Math.floor(seconds / 60);
-		seconds = Math.floor(seconds % 60);
-		if (seconds < 10) seconds = '0' + seconds;
-
-		return `${minutes}:${seconds}`;
-	}
-</script>
-
-<h1>Caminandes: Llamigos</h1>
-<p>From <a href="https://studio.blender.org/films">Blender Studio</a>. CC-BY</p>
-
-<div>
-	<video
-		poster="https://sveltejs.github.io/assets/caminandes-llamigos.jpg"
-		src="https://sveltejs.github.io/assets/caminandes-llamigos.mp4"
-		on:mousemove={handleMove}
-		on:touchmove|preventDefault={handleMove}
-		on:mousedown={handleMousedown}
-		on:mouseup={handleMouseup}
-		bind:currentTime={time}
-		bind:duration
-		bind:paused
-	>
-		<track kind="captions" />
-	</video>
-
-	<div class="controls" style="opacity: {duration && showControls ? 1 : 0}">
-		<progress value={time / duration || 0} />
-
-		<div class="info">
-			<span class="time">{format(time)}</span>
-			<span>click anywhere to {paused ? 'play' : 'pause'} / drag to seek</span>
-			<span class="time">{format(duration)}</span>
-		</div>
-	</div>
-</div>
-
-<style>
-	div {
-		position: relative;
-	}
-
-	.controls {
-		position: absolute;
-		top: 0;
-		width: 100%;
-		transition: opacity 1s;
-	}
-
-	.info {
-		display: flex;
-		width: 100%;
-		justify-content: space-between;
-	}
-
-	span {
-		padding: 0.2em 0.5em;
-		color: white;
-		text-shadow: 0 0 8px black;
-		font-size: 1.4em;
-		opacity: 0.7;
-	}
-
-	.time {
-		width: 3em;
-	}
-
-	.time:last-child {
-		text-align: right;
-	}
-
-	progress {
-		display: block;
-		width: 100%;
-		height: 10px;
-		-webkit-appearance: none;
-		appearance: none;
-	}
-
-	progress::-webkit-progress-bar {
-		background-color: rgba(0, 0, 0, 0.2);
-	}
-
-	progress::-webkit-progress-value {
-		background-color: rgba(255, 255, 255, 0.6);
-	}
-
-	video {
-		width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/10-media-elements/text.md b/documentation/tutorial/06-bindings/10-media-elements/text.md
deleted file mode 100644
index 5ee2d4ac53..0000000000
--- a/documentation/tutorial/06-bindings/10-media-elements/text.md
+++ /dev/null
@@ -1,48 +0,0 @@
----
-title: Media elements
----
-
-The `<audio>` and `<video>` elements have several properties that you can bind to. This example demonstrates a few of them.
-
-On line 62, add `currentTime={time}`, `duration` and `paused` bindings:
-
-```svelte
-<video
-	poster="https://sveltejs.github.io/assets/caminandes-llamigos.jpg"
-	src="https://sveltejs.github.io/assets/caminandes-llamigos.mp4"
-	on:mousemove={handleMove}
-	on:touchmove|preventDefault={handleMove}
-	on:mousedown={handleMousedown}
-	on:mouseup={handleMouseup}
-	bind:currentTime={time}
-	bind:duration
-	bind:paused
->
-	<track kind="captions" />
-</video>
-```
-
-> `bind:duration` is equivalent to `bind:duration={duration}`
-
-Now, when you click on the video, it will update `time`, `duration` and `paused` as appropriate. This means we can use them to build custom controls.
-
-> Ordinarily on the web, you would track `currentTime` by listening for `timeupdate` events. But these events fire too infrequently, resulting in choppy UI. Svelte does better — it checks `currentTime` using `requestAnimationFrame`.
-
-The complete set of bindings for `<audio>` and `<video>` is as follows — six _readonly_ bindings...
-
-- `duration` (readonly) — the total duration of the video, in seconds
-- `buffered` (readonly) — an array of `{start, end}` objects
-- `seekable` (readonly) — ditto
-- `played` (readonly) — ditto
-- `seeking` (readonly) — boolean
-- `ended` (readonly) — boolean
-
-...and five _two-way_ bindings:
-
-- `currentTime` — the current point in the video, in seconds
-- `playbackRate` — how fast to play the video, where `1` is 'normal'
-- `paused` — this one should be self-explanatory
-- `volume` — a value between 0 and 1
-- `muted` — a boolean value where true is muted
-
-Videos additionally have readonly `videoWidth` and `videoHeight` bindings.
diff --git a/documentation/tutorial/06-bindings/11-dimensions/app-a/App.svelte b/documentation/tutorial/06-bindings/11-dimensions/app-a/App.svelte
deleted file mode 100644
index 96fb6d2477..0000000000
--- a/documentation/tutorial/06-bindings/11-dimensions/app-a/App.svelte
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-	let w;
-	let h;
-	let size = 42;
-	let text = 'edit me';
-</script>
-
-<input type="range" bind:value={size} />
-<input bind:value={text} />
-
-<p>size: {w}px x {h}px</p>
-
-<div>
-	<span style="font-size: {size}px">{text}</span>
-</div>
-
-<style>
-	input {
-		display: block;
-	}
-	div {
-		display: inline-block;
-	}
-	span {
-		word-break: break-all;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/11-dimensions/app-b/App.svelte b/documentation/tutorial/06-bindings/11-dimensions/app-b/App.svelte
deleted file mode 100644
index 699664748a..0000000000
--- a/documentation/tutorial/06-bindings/11-dimensions/app-b/App.svelte
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-	let w;
-	let h;
-	let size = 42;
-	let text = 'edit me';
-</script>
-
-<input type="range" bind:value={size} />
-<input bind:value={text} />
-
-<p>size: {w}px x {h}px</p>
-
-<div bind:clientWidth={w} bind:clientHeight={h}>
-	<span style="font-size: {size}px">{text}</span>
-</div>
-
-<style>
-	input {
-		display: block;
-	}
-	div {
-		display: inline-block;
-	}
-	span {
-		word-break: break-all;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/11-dimensions/text.md b/documentation/tutorial/06-bindings/11-dimensions/text.md
deleted file mode 100644
index 7b12a0827e..0000000000
--- a/documentation/tutorial/06-bindings/11-dimensions/text.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Dimensions
----
-
-Every block-level element has `clientWidth`, `clientHeight`, `offsetWidth` and `offsetHeight` bindings:
-
-```svelte
-<div bind:clientWidth={w} bind:clientHeight={h}>
-	<span style="font-size: {size}px">{text}</span>
-</div>
-```
-
-These bindings are readonly — changing the values of `w` and `h` won't have any effect.
-
-> Elements are measured using a technique similar to [this one](http://www.backalleycoder.com/2013/03/18/cross-browser-event-based-element-resize-detection/). There is some overhead involved, so it's not recommended to use this for large numbers of elements.
->
-> `display: inline` elements cannot be measured with this approach; nor can elements that can't contain other elements (such as `<canvas>`). In these cases you will need to measure a wrapper element instead.
diff --git a/documentation/tutorial/06-bindings/12-bind-this/app-a/App.svelte b/documentation/tutorial/06-bindings/12-bind-this/app-a/App.svelte
deleted file mode 100644
index b84f7f6bcc..0000000000
--- a/documentation/tutorial/06-bindings/12-bind-this/app-a/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let canvas;
-
-	onMount(() => {
-		const ctx = canvas.getContext('2d');
-		let frame = requestAnimationFrame(loop);
-
-		function loop(t) {
-			frame = requestAnimationFrame(loop);
-
-			const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
-
-			for (let p = 0; p < imageData.data.length; p += 4) {
-				const i = p / 4;
-				const x = i % canvas.width;
-				const y = (i / canvas.width) >>> 0;
-
-				const r = 64 + (128 * x) / canvas.width + 64 * Math.sin(t / 1000);
-				const g = 64 + (128 * y) / canvas.height + 64 * Math.cos(t / 1000);
-				const b = 128;
-
-				imageData.data[p + 0] = r;
-				imageData.data[p + 1] = g;
-				imageData.data[p + 2] = b;
-				imageData.data[p + 3] = 255;
-			}
-
-			ctx.putImageData(imageData, 0, 0);
-		}
-
-		return () => {
-			cancelAnimationFrame(frame);
-		};
-	});
-</script>
-
-<canvas width={32} height={32} />
-
-<style>
-	canvas {
-		width: 100%;
-		height: 100%;
-		background-color: #666;
-		-webkit-mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-		mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/12-bind-this/app-b/App.svelte b/documentation/tutorial/06-bindings/12-bind-this/app-b/App.svelte
deleted file mode 100644
index b73e800947..0000000000
--- a/documentation/tutorial/06-bindings/12-bind-this/app-b/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let canvas;
-
-	onMount(() => {
-		const ctx = canvas.getContext('2d');
-		let frame = requestAnimationFrame(loop);
-
-		function loop(t) {
-			frame = requestAnimationFrame(loop);
-
-			const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
-
-			for (let p = 0; p < imageData.data.length; p += 4) {
-				const i = p / 4;
-				const x = i % canvas.width;
-				const y = (i / canvas.width) >>> 0;
-
-				const r = 64 + (128 * x) / canvas.width + 64 * Math.sin(t / 1000);
-				const g = 64 + (128 * y) / canvas.height + 64 * Math.cos(t / 1000);
-				const b = 128;
-
-				imageData.data[p + 0] = r;
-				imageData.data[p + 1] = g;
-				imageData.data[p + 2] = b;
-				imageData.data[p + 3] = 255;
-			}
-
-			ctx.putImageData(imageData, 0, 0);
-		}
-
-		return () => {
-			cancelAnimationFrame(frame);
-		};
-	});
-</script>
-
-<canvas bind:this={canvas} width={32} height={32} />
-
-<style>
-	canvas {
-		width: 100%;
-		height: 100%;
-		background-color: #666;
-		-webkit-mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-		mask: url(/svelte-logo-mask.svg) 50% 50% no-repeat;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/12-bind-this/text.md b/documentation/tutorial/06-bindings/12-bind-this/text.md
deleted file mode 100644
index 16d3982934..0000000000
--- a/documentation/tutorial/06-bindings/12-bind-this/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: This
----
-
-The readonly `this` binding applies to every element (and component) and allows you to obtain a reference to rendered elements. For example, we can get a reference to a `<canvas>` element:
-
-```svelte
-<canvas bind:this={canvas} width={32} height={32} />
-```
-
-Note that the value of `canvas` will be `undefined` until the component has mounted, so we put the logic inside the `onMount` [lifecycle function](/tutorial/onmount).
diff --git a/documentation/tutorial/06-bindings/13-component-bindings/app-a/App.svelte b/documentation/tutorial/06-bindings/13-component-bindings/app-a/App.svelte
deleted file mode 100644
index 9a31c537a6..0000000000
--- a/documentation/tutorial/06-bindings/13-component-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	import Keypad from './Keypad.svelte';
-
-	let pin;
-	$: view = pin ? pin.replace(/\d(?!$)/g, '•') : 'enter your pin';
-
-	function handleSubmit() {
-		alert(`submitted ${pin}`);
-	}
-</script>
-
-<h1 style="color: {pin ? '#333' : '#ccc'}">{view}</h1>
-
-<Keypad on:submit={handleSubmit} />
diff --git a/documentation/tutorial/06-bindings/13-component-bindings/app-a/Keypad.svelte b/documentation/tutorial/06-bindings/13-component-bindings/app-a/Keypad.svelte
deleted file mode 100644
index c814a2238f..0000000000
--- a/documentation/tutorial/06-bindings/13-component-bindings/app-a/Keypad.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	export let value = '';
-
-	const dispatch = createEventDispatcher();
-
-	const select = (num) => () => (value += num);
-	const clear = () => (value = '');
-	const submit = () => dispatch('submit');
-</script>
-
-<div class="keypad">
-	<button on:click={select(1)}>1</button>
-	<button on:click={select(2)}>2</button>
-	<button on:click={select(3)}>3</button>
-	<button on:click={select(4)}>4</button>
-	<button on:click={select(5)}>5</button>
-	<button on:click={select(6)}>6</button>
-	<button on:click={select(7)}>7</button>
-	<button on:click={select(8)}>8</button>
-	<button on:click={select(9)}>9</button>
-
-	<button disabled={!value} on:click={clear}>clear</button>
-	<button on:click={select(0)}>0</button>
-	<button disabled={!value} on:click={submit}>submit</button>
-</div>
-
-<style>
-	.keypad {
-		display: grid;
-		grid-template-columns: repeat(3, 5em);
-		grid-template-rows: repeat(4, 3em);
-		grid-gap: 0.5em;
-	}
-
-	button {
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/13-component-bindings/app-b/App.svelte b/documentation/tutorial/06-bindings/13-component-bindings/app-b/App.svelte
deleted file mode 100644
index b3666f891d..0000000000
--- a/documentation/tutorial/06-bindings/13-component-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	import Keypad from './Keypad.svelte';
-
-	let pin;
-	$: view = pin ? pin.replace(/\d(?!$)/g, '•') : 'enter your pin';
-
-	function handleSubmit() {
-		alert(`submitted ${pin}`);
-	}
-</script>
-
-<h1 style="color: {pin ? '#333' : '#ccc'}">{view}</h1>
-
-<Keypad bind:value={pin} on:submit={handleSubmit} />
diff --git a/documentation/tutorial/06-bindings/13-component-bindings/app-b/Keypad.svelte b/documentation/tutorial/06-bindings/13-component-bindings/app-b/Keypad.svelte
deleted file mode 100644
index c814a2238f..0000000000
--- a/documentation/tutorial/06-bindings/13-component-bindings/app-b/Keypad.svelte
+++ /dev/null
@@ -1,40 +0,0 @@
-<script>
-	import { createEventDispatcher } from 'svelte';
-
-	export let value = '';
-
-	const dispatch = createEventDispatcher();
-
-	const select = (num) => () => (value += num);
-	const clear = () => (value = '');
-	const submit = () => dispatch('submit');
-</script>
-
-<div class="keypad">
-	<button on:click={select(1)}>1</button>
-	<button on:click={select(2)}>2</button>
-	<button on:click={select(3)}>3</button>
-	<button on:click={select(4)}>4</button>
-	<button on:click={select(5)}>5</button>
-	<button on:click={select(6)}>6</button>
-	<button on:click={select(7)}>7</button>
-	<button on:click={select(8)}>8</button>
-	<button on:click={select(9)}>9</button>
-
-	<button disabled={!value} on:click={clear}>clear</button>
-	<button on:click={select(0)}>0</button>
-	<button disabled={!value} on:click={submit}>submit</button>
-</div>
-
-<style>
-	.keypad {
-		display: grid;
-		grid-template-columns: repeat(3, 5em);
-		grid-template-rows: repeat(4, 3em);
-		grid-gap: 0.5em;
-	}
-
-	button {
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/06-bindings/13-component-bindings/text.md b/documentation/tutorial/06-bindings/13-component-bindings/text.md
deleted file mode 100644
index a5426fa868..0000000000
--- a/documentation/tutorial/06-bindings/13-component-bindings/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Component bindings
----
-
-Just as you can bind to properties of DOM elements, you can bind to component props. For example, we can bind to the `value` prop of this `<Keypad>` component as though it were a form element:
-
-```svelte
-<Keypad bind:value={pin} on:submit={handleSubmit} />
-```
-
-Now, when the user interacts with the keypad, the value of `pin` in the parent component is immediately updated.
-
-> Use component bindings sparingly. It can be difficult to track the flow of data around your application if you have too many of them, especially if there is no 'single source of truth'.
diff --git a/documentation/tutorial/06-bindings/14-component-this/app-a/App.svelte b/documentation/tutorial/06-bindings/14-component-this/app-a/App.svelte
deleted file mode 100644
index 41a6a10d3d..0000000000
--- a/documentation/tutorial/06-bindings/14-component-this/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	import InputField from './InputField.svelte';
-</script>
-
-<InputField />
diff --git a/documentation/tutorial/06-bindings/14-component-this/app-a/InputField.svelte b/documentation/tutorial/06-bindings/14-component-this/app-a/InputField.svelte
deleted file mode 100644
index caf9c2c9e3..0000000000
--- a/documentation/tutorial/06-bindings/14-component-this/app-a/InputField.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	let input;
-
-	export function focus() {
-		input.focus();
-	}
-</script>
-
-<input bind:this={input} />
diff --git a/documentation/tutorial/06-bindings/14-component-this/app-b/App.svelte b/documentation/tutorial/06-bindings/14-component-this/app-b/App.svelte
deleted file mode 100644
index b5bd3d2e7d..0000000000
--- a/documentation/tutorial/06-bindings/14-component-this/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import InputField from './InputField.svelte';
-
-	let field;
-</script>
-
-<InputField bind:this={field} />
-
-<button on:click={() => field.focus()}>Focus field</button>
diff --git a/documentation/tutorial/06-bindings/14-component-this/app-b/InputField.svelte b/documentation/tutorial/06-bindings/14-component-this/app-b/InputField.svelte
deleted file mode 100644
index caf9c2c9e3..0000000000
--- a/documentation/tutorial/06-bindings/14-component-this/app-b/InputField.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	let input;
-
-	export function focus() {
-		input.focus();
-	}
-</script>
-
-<input bind:this={input} />
diff --git a/documentation/tutorial/06-bindings/14-component-this/text.md b/documentation/tutorial/06-bindings/14-component-this/text.md
deleted file mode 100644
index e87f338234..0000000000
--- a/documentation/tutorial/06-bindings/14-component-this/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Binding to component instances
----
-
-Just as you can bind to DOM elements, you can bind to component instances themselves. For example, we can bind the instance of `<InputField>` to a variable named `field` in the same way we did when binding DOM Elements
-
-```svelte
-<script>
-	let field;
-</script>
-
-<InputField bind:this={field} />
-```
-
-Now we can programmatically interact with this component using `field`.
-
-```svelte
-<button on:click={() => field.focus()}> Focus field </button>
-```
-
-> Note that we can't do `{field.focus}` since field is undefined when the button is first rendered and throws an error.
diff --git a/documentation/tutorial/06-bindings/meta.json b/documentation/tutorial/06-bindings/meta.json
deleted file mode 100644
index b6b01225e3..0000000000
--- a/documentation/tutorial/06-bindings/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Bindings"
-}
diff --git a/documentation/tutorial/07-lifecycle/01-onmount/app-a/App.svelte b/documentation/tutorial/07-lifecycle/01-onmount/app-a/App.svelte
deleted file mode 100644
index 43f8fbd05c..0000000000
--- a/documentation/tutorial/07-lifecycle/01-onmount/app-a/App.svelte
+++ /dev/null
@@ -1,32 +0,0 @@
-<script>
-	let photos = [];
-</script>
-
-<h1>Photo album</h1>
-
-<div class="photos">
-	{#each photos as photo}
-		<figure>
-			<img src={photo.thumbnailUrl} alt={photo.title} />
-			<figcaption>{photo.title}</figcaption>
-		</figure>
-	{:else}
-		<!-- this block renders when photos.length === 0 -->
-		<p>loading...</p>
-	{/each}
-</div>
-
-<style>
-	.photos {
-		width: 100%;
-		display: grid;
-		grid-template-columns: repeat(5, 1fr);
-		grid-gap: 8px;
-	}
-
-	figure,
-	img {
-		width: 100%;
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/01-onmount/app-b/App.svelte b/documentation/tutorial/07-lifecycle/01-onmount/app-b/App.svelte
deleted file mode 100644
index c8d1f6092f..0000000000
--- a/documentation/tutorial/07-lifecycle/01-onmount/app-b/App.svelte
+++ /dev/null
@@ -1,39 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let photos = [];
-
-	onMount(async () => {
-		const res = await fetch(`/tutorial/api/album`);
-		photos = await res.json();
-	});
-</script>
-
-<h1>Photo album</h1>
-
-<div class="photos">
-	{#each photos as photo}
-		<figure>
-			<img src={photo.thumbnailUrl} alt={photo.title} />
-			<figcaption>{photo.title}</figcaption>
-		</figure>
-	{:else}
-		<!-- this block renders when photos.length === 0 -->
-		<p>loading...</p>
-	{/each}
-</div>
-
-<style>
-	.photos {
-		width: 100%;
-		display: grid;
-		grid-template-columns: repeat(5, 1fr);
-		grid-gap: 8px;
-	}
-
-	figure,
-	img {
-		width: 100%;
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/01-onmount/text.md b/documentation/tutorial/07-lifecycle/01-onmount/text.md
deleted file mode 100644
index 517a9304df..0000000000
--- a/documentation/tutorial/07-lifecycle/01-onmount/text.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: onMount
----
-
-Every component has a _lifecycle_ that starts when it is created, and ends when it is destroyed. There are a handful of functions that allow you to run code at key moments during that lifecycle.
-
-The one you'll use most frequently is `onMount`, which runs after the component is first rendered to the DOM. We briefly encountered it [earlier](/tutorial/bind-this) when we needed to interact with a `<canvas>` element after it had been rendered.
-
-We'll add an `onMount` handler that loads some data over the network:
-
-```svelte
-<script>
-	import { onMount } from 'svelte';
-
-	let photos = [];
-
-	onMount(async () => {
-		const res = await fetch(`/tutorial/api/album`);
-		photos = await res.json();
-	});
-</script>
-```
-
-> It's recommended to put the `fetch` in `onMount` rather than at the top level of the `<script>` because of server-side rendering (SSR). With the exception of `onDestroy`, lifecycle functions don't run during SSR, which means we can avoid fetching data that should be loaded lazily once the component has been mounted in the DOM.
-
-Lifecycle functions must be called while the component is initialising so that the callback is bound to the component instance — not (say) in a `setTimeout`.
-
-If the `onMount` callback returns a function, that function will be called when the component is destroyed.
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/App.svelte b/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/App.svelte
deleted file mode 100644
index 33a2710ba2..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import Timer from './Timer.svelte';
-
-	let open = false;
-	let seconds = 0;
-
-	const toggle = () => (open = !open);
-	const handleTick = () => (seconds += 1);
-</script>
-
-<div>
-	<button on:click={toggle}>{open ? 'Close' : 'Open'} Timer</button>
-	<p>
-		The Timer component has been open for
-		{seconds}
-		{seconds === 1 ? 'second' : 'seconds'}
-	</p>
-	{#if open}
-		<Timer callback={handleTick} />
-	{/if}
-</div>
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/Timer.svelte b/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/Timer.svelte
deleted file mode 100644
index bf801d908d..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/Timer.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	import { onInterval } from './utils.js';
-
-	export let callback;
-	export let interval = 1000;
-
-	onInterval(callback, interval);
-</script>
-
-<p>
-	This component executes a callback every
-	{interval} millisecond{interval === 1 ? '' : 's'}
-</p>
-
-<style>
-	p {
-		border: 1px solid blue;
-		padding: 5px;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/utils.js b/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/utils.js
deleted file mode 100644
index e46039fc35..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-a/utils.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import { onDestroy } from 'svelte';
-
-export function onInterval(callback, milliseconds) {
-	const interval = setInterval(callback, milliseconds);
-
-	onDestroy(() => {
-		// Fix the memory leak here
-	});
-}
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/App.svelte b/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/App.svelte
deleted file mode 100644
index 40406f6cd0..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import Timer from './Timer.svelte';
-
-	let open = true;
-	let seconds = 0;
-
-	const toggle = () => (open = !open);
-	const handleTick = () => (seconds += 1);
-</script>
-
-<div>
-	<button on:click={toggle}>{open ? 'Close' : 'Open'} Timer</button>
-	<p>
-		The Timer component has been open for
-		{seconds}
-		{seconds === 1 ? 'second' : 'seconds'}
-	</p>
-	{#if open}
-		<Timer callback={handleTick} />
-	{/if}
-</div>
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/Timer.svelte b/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/Timer.svelte
deleted file mode 100644
index bf801d908d..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/Timer.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	import { onInterval } from './utils.js';
-
-	export let callback;
-	export let interval = 1000;
-
-	onInterval(callback, interval);
-</script>
-
-<p>
-	This component executes a callback every
-	{interval} millisecond{interval === 1 ? '' : 's'}
-</p>
-
-<style>
-	p {
-		border: 1px solid blue;
-		padding: 5px;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/utils.js b/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/utils.js
deleted file mode 100644
index 42423ff320..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/app-b/utils.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import { onDestroy } from 'svelte';
-
-export function onInterval(callback, milliseconds) {
-	const interval = setInterval(callback, milliseconds);
-
-	onDestroy(() => {
-		clearInterval(interval);
-	});
-}
diff --git a/documentation/tutorial/07-lifecycle/02-ondestroy/text.md b/documentation/tutorial/07-lifecycle/02-ondestroy/text.md
deleted file mode 100644
index 63a1d67d87..0000000000
--- a/documentation/tutorial/07-lifecycle/02-ondestroy/text.md
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: onDestroy
----
-
-To run code when your component is destroyed, use `onDestroy`.
-
-For example, we can add a `setInterval` function when our component initialises, and clean it up when it's no longer relevant. Doing so prevents memory leaks.
-
-```svelte
-<script>
-	import { onDestroy } from 'svelte';
-
-	let counter = 0;
-	const interval = setInterval(() => (counter += 1), 1000);
-
-	onDestroy(() => clearInterval(interval));
-</script>
-```
-
-While it's important to call lifecycle functions during the component's initialisation, it doesn't matter _where_ you call them from. So if we wanted, we could abstract the interval logic into a helper function in `utils.js`...
-
-```js
-import { onDestroy } from 'svelte';
-
-export function onInterval(callback, milliseconds) {
-	const interval = setInterval(callback, milliseconds);
-
-	onDestroy(() => {
-		clearInterval(interval);
-	});
-}
-```
-
-...and import it into our component:
-
-```svelte
-<script>
-	import { onInterval } from './utils.js';
-
-	let counter = 0;
-	onInterval(() => (counter += 1), 1000);
-</script>
-```
-
-Open and close the timer a few times and make sure the counter keeps ticking and the CPU load increases. This is due to a memory leak as the previous timers are not deleted. Don't forget to refresh the page before solving the example.
diff --git a/documentation/tutorial/07-lifecycle/03-update/app-a/App.svelte b/documentation/tutorial/07-lifecycle/03-update/app-a/App.svelte
deleted file mode 100644
index 235b53889f..0000000000
--- a/documentation/tutorial/07-lifecycle/03-update/app-a/App.svelte
+++ /dev/null
@@ -1,113 +0,0 @@
-<script>
-	import Eliza from 'elizabot';
-	import { beforeUpdate, afterUpdate } from 'svelte';
-
-	let div;
-
-	beforeUpdate(() => {
-		// determine whether we should auto-scroll
-		// once the DOM is updated...
-	});
-
-	afterUpdate(() => {
-		// ...the DOM is now in sync with the data
-	});
-
-	const eliza = new Eliza();
-
-	let comments = [{ author: 'eliza', text: eliza.getInitial() }];
-
-	function handleKeydown(event) {
-		if (event.key === 'Enter') {
-			const text = event.target.value;
-			if (!text) return;
-
-			comments = comments.concat({
-				author: 'user',
-				text
-			});
-
-			event.target.value = '';
-
-			const reply = eliza.transform(text);
-
-			setTimeout(
-				() => {
-					comments = comments.concat({
-						author: 'eliza',
-						text: '...',
-						placeholder: true
-					});
-
-					setTimeout(
-						() => {
-							comments = comments
-								.filter((comment) => !comment.placeholder)
-								.concat({
-									author: 'eliza',
-									text: reply
-								});
-						},
-						500 + Math.random() * 500
-					);
-				},
-				200 + Math.random() * 200
-			);
-		}
-	}
-</script>
-
-<div class="chat">
-	<h1>Eliza</h1>
-
-	<div class="scrollable" bind:this={div}>
-		{#each comments as comment}
-			<article class={comment.author}>
-				<span>{comment.text}</span>
-			</article>
-		{/each}
-	</div>
-
-	<input on:keydown={handleKeydown} />
-</div>
-
-<style>
-	.chat {
-		display: flex;
-		flex-direction: column;
-		height: 100%;
-		max-width: 320px;
-	}
-
-	.scrollable {
-		flex: 1 1 auto;
-		border-top: 1px solid #eee;
-		margin: 0 0 0.5em 0;
-		overflow-y: auto;
-	}
-
-	article {
-		margin: 0.5em 0;
-	}
-
-	.user {
-		text-align: right;
-	}
-
-	span {
-		padding: 0.5em 1em;
-		display: inline-block;
-	}
-
-	.eliza span {
-		background-color: #eee;
-		border-radius: 1em 1em 1em 0;
-	}
-
-	.user span {
-		background-color: #0074d9;
-		color: white;
-		border-radius: 1em 1em 0 1em;
-		word-break: break-all;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/03-update/app-b/App.svelte b/documentation/tutorial/07-lifecycle/03-update/app-b/App.svelte
deleted file mode 100644
index 7afb5eb427..0000000000
--- a/documentation/tutorial/07-lifecycle/03-update/app-b/App.svelte
+++ /dev/null
@@ -1,113 +0,0 @@
-<script>
-	import Eliza from 'elizabot';
-	import { beforeUpdate, afterUpdate } from 'svelte';
-
-	let div;
-	let autoscroll;
-
-	beforeUpdate(() => {
-		autoscroll = div && div.offsetHeight + div.scrollTop > div.scrollHeight - 20;
-	});
-
-	afterUpdate(() => {
-		if (autoscroll) div.scrollTo(0, div.scrollHeight);
-	});
-
-	const eliza = new Eliza();
-
-	let comments = [{ author: 'eliza', text: eliza.getInitial() }];
-
-	function handleKeydown(event) {
-		if (event.key === 'Enter') {
-			const text = event.target.value;
-			if (!text) return;
-
-			comments = comments.concat({
-				author: 'user',
-				text
-			});
-
-			event.target.value = '';
-
-			const reply = eliza.transform(text);
-
-			setTimeout(
-				() => {
-					comments = comments.concat({
-						author: 'eliza',
-						text: '...',
-						placeholder: true
-					});
-
-					setTimeout(
-						() => {
-							comments = comments
-								.filter((comment) => !comment.placeholder)
-								.concat({
-									author: 'eliza',
-									text: reply
-								});
-						},
-						500 + Math.random() * 500
-					);
-				},
-				200 + Math.random() * 200
-			);
-		}
-	}
-</script>
-
-<div class="chat">
-	<h1>Eliza</h1>
-
-	<div class="scrollable" bind:this={div}>
-		{#each comments as comment}
-			<article class={comment.author}>
-				<span>{comment.text}</span>
-			</article>
-		{/each}
-	</div>
-
-	<input on:keydown={handleKeydown} />
-</div>
-
-<style>
-	.chat {
-		display: flex;
-		flex-direction: column;
-		height: 100%;
-		max-width: 320px;
-	}
-
-	.scrollable {
-		flex: 1 1 auto;
-		border-top: 1px solid #eee;
-		margin: 0 0 0.5em 0;
-		overflow-y: auto;
-	}
-
-	article {
-		margin: 0.5em 0;
-	}
-
-	.user {
-		text-align: right;
-	}
-
-	span {
-		padding: 0.5em 1em;
-		display: inline-block;
-	}
-
-	.eliza span {
-		background-color: #eee;
-		border-radius: 1em 1em 1em 0;
-	}
-
-	.user span {
-		background-color: #0074d9;
-		color: white;
-		border-radius: 1em 1em 0 1em;
-		word-break: break-all;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/03-update/text.md b/documentation/tutorial/07-lifecycle/03-update/text.md
deleted file mode 100644
index 3c791245b0..0000000000
--- a/documentation/tutorial/07-lifecycle/03-update/text.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: beforeUpdate and afterUpdate
----
-
-The `beforeUpdate` function schedules work to happen immediately before the DOM is updated. `afterUpdate` is its counterpart, used for running code once the DOM is in sync with your data.
-
-Together, they're useful for doing things imperatively that are difficult to achieve in a purely state-driven way, like updating the scroll position of an element.
-
-This [Eliza](https://en.wikipedia.org/wiki/ELIZA) chatbot is annoying to use, because you have to keep scrolling the chat window. Let's fix that.
-
-```js
-let div;
-let autoscroll;
-
-beforeUpdate(() => {
-	autoscroll = div && div.offsetHeight + div.scrollTop > div.scrollHeight - 20;
-});
-
-afterUpdate(() => {
-	if (autoscroll) div.scrollTo(0, div.scrollHeight);
-});
-```
-
-Note that `beforeUpdate` will first run before the component has mounted, so we need to check for the existence of `div` before reading its properties.
diff --git a/documentation/tutorial/07-lifecycle/04-tick/app-a/App.svelte b/documentation/tutorial/07-lifecycle/04-tick/app-a/App.svelte
deleted file mode 100644
index 28251429b5..0000000000
--- a/documentation/tutorial/07-lifecycle/04-tick/app-a/App.svelte
+++ /dev/null
@@ -1,29 +0,0 @@
-<script>
-	let text = `Select some text and hit the tab key to toggle uppercase`;
-
-	async function handleKeydown(event) {
-		if (event.key !== 'Tab') return;
-
-		event.preventDefault();
-
-		const { selectionStart, selectionEnd, value } = this;
-		const selection = value.slice(selectionStart, selectionEnd);
-
-		const replacement = /[a-z]/.test(selection) ? selection.toUpperCase() : selection.toLowerCase();
-
-		text = value.slice(0, selectionStart) + replacement + value.slice(selectionEnd);
-
-		// this has no effect, because the DOM hasn't updated yet
-		this.selectionStart = selectionStart;
-		this.selectionEnd = selectionEnd;
-	}
-</script>
-
-<textarea value={text} on:keydown={handleKeydown} />
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/04-tick/app-b/App.svelte b/documentation/tutorial/07-lifecycle/04-tick/app-b/App.svelte
deleted file mode 100644
index 2f076946b3..0000000000
--- a/documentation/tutorial/07-lifecycle/04-tick/app-b/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	import { tick } from 'svelte';
-
-	let text = `Select some text and hit the tab key to toggle uppercase`;
-
-	async function handleKeydown(event) {
-		if (event.key !== 'Tab') return;
-
-		event.preventDefault();
-
-		const { selectionStart, selectionEnd, value } = this;
-		const selection = value.slice(selectionStart, selectionEnd);
-
-		const replacement = /[a-z]/.test(selection) ? selection.toUpperCase() : selection.toLowerCase();
-
-		text = value.slice(0, selectionStart) + replacement + value.slice(selectionEnd);
-
-		await tick();
-		this.selectionStart = selectionStart;
-		this.selectionEnd = selectionEnd;
-	}
-</script>
-
-<textarea value={text} on:keydown={handleKeydown} />
-
-<style>
-	textarea {
-		width: 100%;
-		height: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/07-lifecycle/04-tick/text.md b/documentation/tutorial/07-lifecycle/04-tick/text.md
deleted file mode 100644
index a457247346..0000000000
--- a/documentation/tutorial/07-lifecycle/04-tick/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: tick
----
-
-The `tick` function is unlike other lifecycle functions in that you can call it any time, not just when the component first initialises. It returns a promise that resolves as soon as any pending state changes have been applied to the DOM (or immediately, if there are no pending state changes).
-
-When you update component state in Svelte, it doesn't update the DOM immediately. Instead, it waits until the next _microtask_ to see if there are any other changes that need to be applied, including in other components. Doing so avoids unnecessary work and allows the browser to batch things more effectively.
-
-You can see that behaviour in this example. Select a range of text and hit the tab key. Because the `<textarea>` value changes, the current selection is cleared and the cursor jumps, annoyingly, to the end. We can fix this by importing `tick`...
-
-```js
-import { tick } from 'svelte';
-```
-
-...and running it immediately before we set `this.selectionStart` and `this.selectionEnd` at the end of `handleKeydown`:
-
-```js
-await tick();
-this.selectionStart = selectionStart;
-this.selectionEnd = selectionEnd;
-```
diff --git a/documentation/tutorial/07-lifecycle/meta.json b/documentation/tutorial/07-lifecycle/meta.json
deleted file mode 100644
index 5ed3972e7a..0000000000
--- a/documentation/tutorial/07-lifecycle/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Lifecycle"
-}
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-a/App.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-a/App.svelte
deleted file mode 100644
index 4838325b67..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-
-	let countValue;
-
-	count.subscribe((value) => {
-		countValue = value;
-	});
-</script>
-
-<h1>The count is {countValue}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-a/Decrementer.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-a/Decrementer.svelte
deleted file mode 100644
index 049f8aeb47..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-a/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		// TODO decrement the count
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-a/Incrementer.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-a/Incrementer.svelte
deleted file mode 100644
index bfce8f2eac..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-a/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		// TODO increment the count
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-a/Resetter.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-a/Resetter.svelte
deleted file mode 100644
index 88f0b975d6..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-a/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		// TODO reset the count
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-a/stores.js b/documentation/tutorial/08-stores/01-writable-stores/app-a/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-a/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-b/App.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-b/App.svelte
deleted file mode 100644
index 4838325b67..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-b/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-
-	let countValue;
-
-	count.subscribe((value) => {
-		countValue = value;
-	});
-</script>
-
-<h1>The count is {countValue}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-b/Decrementer.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-b/Decrementer.svelte
deleted file mode 100644
index 596ba4bbab..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-b/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		count.update((n) => n - 1);
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-b/Incrementer.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-b/Incrementer.svelte
deleted file mode 100644
index 1fb7dea3cb..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-b/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		count.update((n) => n + 1);
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-b/Resetter.svelte b/documentation/tutorial/08-stores/01-writable-stores/app-b/Resetter.svelte
deleted file mode 100644
index 9c8809961f..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-b/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		count.set(0);
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/tutorial/08-stores/01-writable-stores/app-b/stores.js b/documentation/tutorial/08-stores/01-writable-stores/app-b/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/app-b/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/tutorial/08-stores/01-writable-stores/text.md b/documentation/tutorial/08-stores/01-writable-stores/text.md
deleted file mode 100644
index c3fb17ffad..0000000000
--- a/documentation/tutorial/08-stores/01-writable-stores/text.md
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Writable stores
----
-
-Not all application state belongs inside your application's component hierarchy. Sometimes, you'll have values that need to be accessed by multiple unrelated components, or by a regular JavaScript module.
-
-In Svelte, we do this with _stores_. A store is simply an object with a `subscribe` method that allows interested parties to be notified whenever the store value changes. In `App.svelte`, `count` is a store, and we're setting `countValue` in the `count.subscribe` callback.
-
-Click the `stores.js` tab to see the definition of `count`. It's a _writable_ store, which means it has `set` and `update` methods in addition to `subscribe`.
-
-Now go to the `Incrementer.svelte` tab so that we can wire up the `+` button:
-
-```js
-function increment() {
-	count.update((n) => n + 1);
-}
-```
-
-Clicking the `+` button should now update the count. Do the inverse for `Decrementer.svelte`.
-
-Finally, in `Resetter.svelte`, implement `reset`:
-
-```js
-function reset() {
-	count.set(0);
-}
-```
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/App.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/App.svelte
deleted file mode 100644
index 4838325b67..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-
-	let countValue;
-
-	count.subscribe((value) => {
-		countValue = value;
-	});
-</script>
-
-<h1>The count is {countValue}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Decrementer.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Decrementer.svelte
deleted file mode 100644
index 596ba4bbab..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		count.update((n) => n - 1);
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Incrementer.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Incrementer.svelte
deleted file mode 100644
index 1fb7dea3cb..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		count.update((n) => n + 1);
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Resetter.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Resetter.svelte
deleted file mode 100644
index 9c8809961f..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		count.set(0);
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/stores.js b/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-a/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/App.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/App.svelte
deleted file mode 100644
index 9923689329..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-</script>
-
-<h1>The count is {$count}</h1>
-
-<Incrementer />
-<Decrementer />
-<Resetter />
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Decrementer.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Decrementer.svelte
deleted file mode 100644
index 596ba4bbab..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Decrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function decrement() {
-		count.update((n) => n - 1);
-	}
-</script>
-
-<button on:click={decrement}> - </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Incrementer.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Incrementer.svelte
deleted file mode 100644
index 1fb7dea3cb..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Incrementer.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function increment() {
-		count.update((n) => n + 1);
-	}
-</script>
-
-<button on:click={increment}> + </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Resetter.svelte b/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Resetter.svelte
deleted file mode 100644
index 9c8809961f..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/Resetter.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-
-	function reset() {
-		count.set(0);
-	}
-</script>
-
-<button on:click={reset}> reset </button>
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/stores.js b/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/stores.js
deleted file mode 100644
index d432d339ec..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/app-b/stores.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { writable } from 'svelte/store';
-
-export const count = writable(0);
diff --git a/documentation/tutorial/08-stores/02-auto-subscriptions/text.md b/documentation/tutorial/08-stores/02-auto-subscriptions/text.md
deleted file mode 100644
index 9e641606f0..0000000000
--- a/documentation/tutorial/08-stores/02-auto-subscriptions/text.md
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: Auto-subscriptions
----
-
-The app in the previous example works, but there's a subtle bug — the store is subscribed to, but never unsubscribed. If the component was instantiated and destroyed many times, this would result in a _memory leak_.
-
-Start by declaring `unsubscribe` in `App.svelte`:
-
-```js
-const unsubscribe = count.subscribe((value) => {
-	countValue = value;
-});
-```
-
-> Calling a `subscribe` method returns an `unsubscribe` function.
-
-You now declared `unsubscribe`, but it still needs to be called, for example through the `onDestroy` [lifecycle hook](/tutorial/ondestroy):
-
-```svelte
-<script>
-	import { onDestroy } from 'svelte';
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-
-	let countValue;
-
-	const unsubscribe = count.subscribe((value) => {
-		countValue = value;
-	});
-
-	onDestroy(unsubscribe);
-</script>
-
-<h1>The count is {countValue}</h1>
-```
-
-It starts to get a bit boilerplatey though, especially if your component subscribes to multiple stores. Instead, Svelte has a trick up its sleeve — you can reference a store value by prefixing the store name with `$`:
-
-```svelte
-<script>
-	import { count } from './stores.js';
-	import Incrementer from './Incrementer.svelte';
-	import Decrementer from './Decrementer.svelte';
-	import Resetter from './Resetter.svelte';
-</script>
-
-<h1>The count is {$count}</h1>
-```
-
-> Auto-subscription only works with store variables that are declared (or imported) at the top-level scope of a component.
-
-You're not limited to using `$count` inside the markup, either — you can use it anywhere in the `<script>` as well, such as in event handlers or reactive declarations.
-
-> Any name beginning with `$` is assumed to refer to a store value. It's effectively a reserved character — Svelte will prevent you from declaring your own variables with a `$` prefix.
diff --git a/documentation/tutorial/08-stores/03-readable-stores/app-a/App.svelte b/documentation/tutorial/08-stores/03-readable-stores/app-a/App.svelte
deleted file mode 100644
index 6d1d80b455..0000000000
--- a/documentation/tutorial/08-stores/03-readable-stores/app-a/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { time } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
diff --git a/documentation/tutorial/08-stores/03-readable-stores/app-a/stores.js b/documentation/tutorial/08-stores/03-readable-stores/app-a/stores.js
deleted file mode 100644
index ec0a749d79..0000000000
--- a/documentation/tutorial/08-stores/03-readable-stores/app-a/stores.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import { readable } from 'svelte/store';
-
-export const time = readable(null, function start(set) {
-	// implementation goes here
-
-	return function stop() {};
-});
diff --git a/documentation/tutorial/08-stores/03-readable-stores/app-b/App.svelte b/documentation/tutorial/08-stores/03-readable-stores/app-b/App.svelte
deleted file mode 100644
index 6d1d80b455..0000000000
--- a/documentation/tutorial/08-stores/03-readable-stores/app-b/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import { time } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
diff --git a/documentation/tutorial/08-stores/03-readable-stores/app-b/stores.js b/documentation/tutorial/08-stores/03-readable-stores/app-b/stores.js
deleted file mode 100644
index 8c11f6d3aa..0000000000
--- a/documentation/tutorial/08-stores/03-readable-stores/app-b/stores.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { readable } from 'svelte/store';
-
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
diff --git a/documentation/tutorial/08-stores/03-readable-stores/text.md b/documentation/tutorial/08-stores/03-readable-stores/text.md
deleted file mode 100644
index 5e53852702..0000000000
--- a/documentation/tutorial/08-stores/03-readable-stores/text.md
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Readable stores
----
-
-Not all stores should be writable by whoever has a reference to them. For example, you might have a store representing the mouse position or the user's geolocation, and it doesn't make sense to be able to set those values from 'outside'. For those cases, we have _readable_ stores.
-
-Click over to the `stores.js` tab. The first argument to `readable` is an initial value, which can be `null` or `undefined` if you don't have one yet. The second argument is a `start` function that takes a `set` callback and returns a `stop` function. The `start` function is called when the store gets its first subscriber; `stop` is called when the last subscriber unsubscribes.
-
-```js
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
-```
diff --git a/documentation/tutorial/08-stores/04-derived-stores/app-a/App.svelte b/documentation/tutorial/08-stores/04-derived-stores/app-a/App.svelte
deleted file mode 100644
index d1013c1a26..0000000000
--- a/documentation/tutorial/08-stores/04-derived-stores/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { time, elapsed } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
-
-<p>
-	This page has been open for
-	{$elapsed}
-	{$elapsed === 1 ? 'second' : 'seconds'}
-</p>
diff --git a/documentation/tutorial/08-stores/04-derived-stores/app-a/stores.js b/documentation/tutorial/08-stores/04-derived-stores/app-a/stores.js
deleted file mode 100644
index 854dd7d439..0000000000
--- a/documentation/tutorial/08-stores/04-derived-stores/app-a/stores.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import { readable, derived } from 'svelte/store';
-
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
-
-const start = new Date();
-
-export const elapsed = derived(time, ($time) => {});
diff --git a/documentation/tutorial/08-stores/04-derived-stores/app-b/App.svelte b/documentation/tutorial/08-stores/04-derived-stores/app-b/App.svelte
deleted file mode 100644
index d1013c1a26..0000000000
--- a/documentation/tutorial/08-stores/04-derived-stores/app-b/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	import { time, elapsed } from './stores.js';
-
-	const formatter = new Intl.DateTimeFormat('en', {
-		hour12: true,
-		hour: 'numeric',
-		minute: '2-digit',
-		second: '2-digit'
-	});
-</script>
-
-<h1>The time is {formatter.format($time)}</h1>
-
-<p>
-	This page has been open for
-	{$elapsed}
-	{$elapsed === 1 ? 'second' : 'seconds'}
-</p>
diff --git a/documentation/tutorial/08-stores/04-derived-stores/app-b/stores.js b/documentation/tutorial/08-stores/04-derived-stores/app-b/stores.js
deleted file mode 100644
index 741f927845..0000000000
--- a/documentation/tutorial/08-stores/04-derived-stores/app-b/stores.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import { readable, derived } from 'svelte/store';
-
-export const time = readable(new Date(), function start(set) {
-	const interval = setInterval(() => {
-		set(new Date());
-	}, 1000);
-
-	return function stop() {
-		clearInterval(interval);
-	};
-});
-
-const start = new Date();
-
-export const elapsed = derived(time, ($time) => Math.round(($time - start) / 1000));
diff --git a/documentation/tutorial/08-stores/04-derived-stores/text.md b/documentation/tutorial/08-stores/04-derived-stores/text.md
deleted file mode 100644
index 45078abc5c..0000000000
--- a/documentation/tutorial/08-stores/04-derived-stores/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Derived stores
----
-
-You can create a store whose value is based on the value of one or more _other_ stores with `derived`. Building on our previous example, we can create a store that derives the time the page has been open:
-
-```js
-export const elapsed = derived(time, ($time) => Math.round(($time - start) / 1000));
-```
-
-> It's possible to derive a store from multiple inputs, and to explicitly `set` a value instead of returning it (which is useful for deriving values asynchronously). Consult the [API reference](/docs/svelte-store#derived) for more information.
diff --git a/documentation/tutorial/08-stores/05-custom-stores/app-a/App.svelte b/documentation/tutorial/08-stores/05-custom-stores/app-a/App.svelte
deleted file mode 100644
index dbdd299d69..0000000000
--- a/documentation/tutorial/08-stores/05-custom-stores/app-a/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-</script>
-
-<h1>The count is {$count}</h1>
-
-<button on:click={count.increment}>+</button>
-<button on:click={count.decrement}>-</button>
-<button on:click={count.reset}>reset</button>
diff --git a/documentation/tutorial/08-stores/05-custom-stores/app-a/stores.js b/documentation/tutorial/08-stores/05-custom-stores/app-a/stores.js
deleted file mode 100644
index 5afb62786d..0000000000
--- a/documentation/tutorial/08-stores/05-custom-stores/app-a/stores.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { writable } from 'svelte/store';
-
-function createCount() {
-	const { subscribe, set, update } = writable(0);
-
-	return {
-		subscribe,
-		increment: () => {},
-		decrement: () => {},
-		reset: () => {}
-	};
-}
-
-export const count = createCount();
diff --git a/documentation/tutorial/08-stores/05-custom-stores/app-b/App.svelte b/documentation/tutorial/08-stores/05-custom-stores/app-b/App.svelte
deleted file mode 100644
index dbdd299d69..0000000000
--- a/documentation/tutorial/08-stores/05-custom-stores/app-b/App.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script>
-	import { count } from './stores.js';
-</script>
-
-<h1>The count is {$count}</h1>
-
-<button on:click={count.increment}>+</button>
-<button on:click={count.decrement}>-</button>
-<button on:click={count.reset}>reset</button>
diff --git a/documentation/tutorial/08-stores/05-custom-stores/app-b/stores.js b/documentation/tutorial/08-stores/05-custom-stores/app-b/stores.js
deleted file mode 100644
index da11e88df2..0000000000
--- a/documentation/tutorial/08-stores/05-custom-stores/app-b/stores.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { writable } from 'svelte/store';
-
-function createCount() {
-	const { subscribe, set, update } = writable(0);
-
-	return {
-		subscribe,
-		increment: () => update((n) => n + 1),
-		decrement: () => update((n) => n - 1),
-		reset: () => set(0)
-	};
-}
-
-export const count = createCount();
diff --git a/documentation/tutorial/08-stores/05-custom-stores/text.md b/documentation/tutorial/08-stores/05-custom-stores/text.md
deleted file mode 100644
index ebc4276786..0000000000
--- a/documentation/tutorial/08-stores/05-custom-stores/text.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Custom stores
----
-
-As long as an object correctly implements the `subscribe` method, it's a store. Beyond that, anything goes. It's very easy, therefore, to create custom stores with domain-specific logic.
-
-For example, the `count` store from our earlier example could include `increment`, `decrement` and `reset` methods and avoid exposing `set` and `update`:
-
-```js
-function createCount() {
-	const { subscribe, set, update } = writable(0);
-
-	return {
-		subscribe,
-		increment: () => update((n) => n + 1),
-		decrement: () => update((n) => n - 1),
-		reset: () => set(0)
-	};
-}
-```
diff --git a/documentation/tutorial/08-stores/06-store-bindings/app-a/App.svelte b/documentation/tutorial/08-stores/06-store-bindings/app-a/App.svelte
deleted file mode 100644
index ede9beab31..0000000000
--- a/documentation/tutorial/08-stores/06-store-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,6 +0,0 @@
-<script>
-	import { name, greeting } from './stores.js';
-</script>
-
-<h1>{$greeting}</h1>
-<input value={$name} />
diff --git a/documentation/tutorial/08-stores/06-store-bindings/app-a/stores.js b/documentation/tutorial/08-stores/06-store-bindings/app-a/stores.js
deleted file mode 100644
index 58f25475c5..0000000000
--- a/documentation/tutorial/08-stores/06-store-bindings/app-a/stores.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { writable, derived } from 'svelte/store';
-
-export const name = writable('world');
-
-export const greeting = derived(name, ($name) => `Hello ${$name}!`);
diff --git a/documentation/tutorial/08-stores/06-store-bindings/app-b/App.svelte b/documentation/tutorial/08-stores/06-store-bindings/app-b/App.svelte
deleted file mode 100644
index 84331e1e7b..0000000000
--- a/documentation/tutorial/08-stores/06-store-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	import { name, greeting } from './stores.js';
-</script>
-
-<h1>{$greeting}</h1>
-<input bind:value={$name} />
-
-<button on:click={() => ($name += '!')}> Add exclamation mark! </button>
diff --git a/documentation/tutorial/08-stores/06-store-bindings/app-b/stores.js b/documentation/tutorial/08-stores/06-store-bindings/app-b/stores.js
deleted file mode 100644
index 58f25475c5..0000000000
--- a/documentation/tutorial/08-stores/06-store-bindings/app-b/stores.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { writable, derived } from 'svelte/store';
-
-export const name = writable('world');
-
-export const greeting = derived(name, ($name) => `Hello ${$name}!`);
diff --git a/documentation/tutorial/08-stores/06-store-bindings/text.md b/documentation/tutorial/08-stores/06-store-bindings/text.md
deleted file mode 100644
index 054140e8d7..0000000000
--- a/documentation/tutorial/08-stores/06-store-bindings/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Store bindings
----
-
-If a store is writable — i.e. it has a `set` method — you can bind to its value, just as you can bind to local component state.
-
-In this example we have a writable store `name` and a derived store `greeting`. Update the `<input>` element:
-
-```svelte
-<input bind:value={$name} />
-```
-
-Changing the input value will now update `name` and all its dependents.
-
-We can also assign directly to store values inside a component. Add a `<button>` element:
-
-```svelte
-<button on:click={() => ($name += '!')}> Add exclamation mark! </button>
-```
-
-The `$name += '!'` assignment is equivalent to `name.set($name + '!')`.
diff --git a/documentation/tutorial/08-stores/meta.json b/documentation/tutorial/08-stores/meta.json
deleted file mode 100644
index c70d14efe5..0000000000
--- a/documentation/tutorial/08-stores/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Stores"
-}
diff --git a/documentation/tutorial/09-motion/01-tweened/app-a/App.svelte b/documentation/tutorial/09-motion/01-tweened/app-a/App.svelte
deleted file mode 100644
index c209dcf36d..0000000000
--- a/documentation/tutorial/09-motion/01-tweened/app-a/App.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script>
-	import { writable } from 'svelte/store';
-
-	const progress = writable(0);
-</script>
-
-<progress value={$progress} />
-
-<button on:click={() => progress.set(0)}> 0% </button>
-
-<button on:click={() => progress.set(0.25)}> 25% </button>
-
-<button on:click={() => progress.set(0.5)}> 50% </button>
-
-<button on:click={() => progress.set(0.75)}> 75% </button>
-
-<button on:click={() => progress.set(1)}> 100% </button>
-
-<style>
-	progress {
-		display: block;
-		width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/09-motion/01-tweened/app-b/App.svelte b/documentation/tutorial/09-motion/01-tweened/app-b/App.svelte
deleted file mode 100644
index f4fb499f0f..0000000000
--- a/documentation/tutorial/09-motion/01-tweened/app-b/App.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	import { tweened } from 'svelte/motion';
-	import { cubicOut } from 'svelte/easing';
-
-	const progress = tweened(0, {
-		duration: 400,
-		easing: cubicOut
-	});
-</script>
-
-<progress value={$progress} />
-
-<button on:click={() => progress.set(0)}> 0% </button>
-
-<button on:click={() => progress.set(0.25)}> 25% </button>
-
-<button on:click={() => progress.set(0.5)}> 50% </button>
-
-<button on:click={() => progress.set(0.75)}> 75% </button>
-
-<button on:click={() => progress.set(1)}> 100% </button>
-
-<style>
-	progress {
-		display: block;
-		width: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/09-motion/01-tweened/text.md b/documentation/tutorial/09-motion/01-tweened/text.md
deleted file mode 100644
index 6ef4a8ac7b..0000000000
--- a/documentation/tutorial/09-motion/01-tweened/text.md
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: Tweened
----
-
-Setting values and watching the DOM update automatically is cool. Know what's even cooler? _Tweening_ those values. Svelte includes tools to help you build slick user interfaces that use animation to communicate changes.
-
-Let's start by changing the `progress` store to a `tweened` value:
-
-```svelte
-<script>
-	import { tweened } from 'svelte/motion';
-
-	const progress = tweened(0);
-</script>
-```
-
-Clicking the buttons causes the progress bar to animate to its new value. It's a bit robotic and unsatisfying though. We need to add an easing function:
-
-```svelte
-<script>
-	import { tweened } from 'svelte/motion';
-	import { cubicOut } from 'svelte/easing';
-
-	const progress = tweened(0, {
-		duration: 400,
-		easing: cubicOut
-	});
-</script>
-```
-
-> The `svelte/easing` module contains the [Penner easing equations](https://web.archive.org/web/20190805215728/http://robertpenner.com/easing/), or you can supply your own `p => t` function where `p` and `t` are both values between 0 and 1.
-
-The full set of options available to `tweened`:
-
-- `delay` — milliseconds before the tween starts
-- `duration` — either the duration of the tween in milliseconds, or a `(from, to) => milliseconds` function allowing you to (e.g.) specify longer tweens for larger changes in value
-- `easing` — a `p => t` function
-- `interpolate` — a custom `(from, to) => t => value` function for interpolating between arbitrary values. By default, Svelte will interpolate between numbers, dates, and identically-shaped arrays and objects (as long as they only contain numbers and dates or other valid arrays and objects). If you want to interpolate (for example) colour strings or transformation matrices, supply a custom interpolator
-
-You can also pass these options to `progress.set` and `progress.update` as a second argument, in which case they will override the defaults. The `set` and `update` methods both return a promise that resolves when the tween completes.
diff --git a/documentation/tutorial/09-motion/02-spring/app-a/App.svelte b/documentation/tutorial/09-motion/02-spring/app-a/App.svelte
deleted file mode 100644
index 39afc6c1a7..0000000000
--- a/documentation/tutorial/09-motion/02-spring/app-a/App.svelte
+++ /dev/null
@@ -1,37 +0,0 @@
-<script>
-	import { writable } from 'svelte/store';
-
-	let coords = writable({ x: 50, y: 50 });
-	let size = writable(10);
-</script>
-
-<div style="position: absolute; right: 1em;">
-	<label>
-		<h3>stiffness ({coords.stiffness})</h3>
-		<input bind:value={coords.stiffness} type="range" min="0" max="1" step="0.01" />
-	</label>
-
-	<label>
-		<h3>damping ({coords.damping})</h3>
-		<input bind:value={coords.damping} type="range" min="0" max="1" step="0.01" />
-	</label>
-</div>
-
-<svg
-	on:mousemove={(e) => coords.set({ x: e.clientX, y: e.clientY })}
-	on:mousedown={() => size.set(30)}
-	on:mouseup={() => size.set(10)}
->
-	<circle cx={$coords.x} cy={$coords.y} r={$size} />
-</svg>
-
-<style>
-	svg {
-		width: 100%;
-		height: 100%;
-		margin: -8px;
-	}
-	circle {
-		fill: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/09-motion/02-spring/app-b/App.svelte b/documentation/tutorial/09-motion/02-spring/app-b/App.svelte
deleted file mode 100644
index 59346dcb3b..0000000000
--- a/documentation/tutorial/09-motion/02-spring/app-b/App.svelte
+++ /dev/null
@@ -1,44 +0,0 @@
-<script>
-	import { spring } from 'svelte/motion';
-
-	let coords = spring(
-		{ x: 50, y: 50 },
-		{
-			stiffness: 0.1,
-			damping: 0.25
-		}
-	);
-
-	let size = spring(10);
-</script>
-
-<div style="position: absolute; right: 1em;">
-	<label>
-		<h3>stiffness ({coords.stiffness})</h3>
-		<input bind:value={coords.stiffness} type="range" min="0" max="1" step="0.01" />
-	</label>
-
-	<label>
-		<h3>damping ({coords.damping})</h3>
-		<input bind:value={coords.damping} type="range" min="0" max="1" step="0.01" />
-	</label>
-</div>
-
-<svg
-	on:mousemove={(e) => coords.set({ x: e.clientX, y: e.clientY })}
-	on:mousedown={() => size.set(30)}
-	on:mouseup={() => size.set(10)}
->
-	<circle cx={$coords.x} cy={$coords.y} r={$size} />
-</svg>
-
-<style>
-	svg {
-		width: 100%;
-		height: 100%;
-		margin: -8px;
-	}
-	circle {
-		fill: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/09-motion/02-spring/text.md b/documentation/tutorial/09-motion/02-spring/text.md
deleted file mode 100644
index 188151e9fc..0000000000
--- a/documentation/tutorial/09-motion/02-spring/text.md
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: Spring
----
-
-The `spring` function is an alternative to `tweened` that often works better for values that are frequently changing.
-
-In this example we have two stores — one representing the circle's coordinates, and one representing its size. Let's convert them to springs:
-
-```svelte
-<script>
-	import { spring } from 'svelte/motion';
-
-	let coords = spring({ x: 50, y: 50 });
-	let size = spring(10);
-</script>
-```
-
-Both springs have default `stiffness` and `damping` values, which control the spring's, well... springiness. We can specify our own initial values:
-
-```js
-let coords = spring(
-	{ x: 50, y: 50 },
-	{
-		stiffness: 0.1,
-		damping: 0.25
-	}
-);
-```
-
-Waggle your mouse around, and try dragging the sliders to get a feel for how they affect the spring's behaviour. Notice that you can adjust the values while the spring is still in motion.
-
-Consult the [API reference](/docs/svelte-motion#spring) for more information.
diff --git a/documentation/tutorial/09-motion/meta.json b/documentation/tutorial/09-motion/meta.json
deleted file mode 100644
index 14919954a9..0000000000
--- a/documentation/tutorial/09-motion/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Motion"
-}
diff --git a/documentation/tutorial/10-transitions/01-transition/app-a/App.svelte b/documentation/tutorial/10-transitions/01-transition/app-a/App.svelte
deleted file mode 100644
index 5ba3e7fb7b..0000000000
--- a/documentation/tutorial/10-transitions/01-transition/app-a/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p>Fades in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/01-transition/app-b/App.svelte b/documentation/tutorial/10-transitions/01-transition/app-b/App.svelte
deleted file mode 100644
index 29e9254d14..0000000000
--- a/documentation/tutorial/10-transitions/01-transition/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fade>Fades in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/01-transition/text.md b/documentation/tutorial/10-transitions/01-transition/text.md
deleted file mode 100644
index bc72fbf07b..0000000000
--- a/documentation/tutorial/10-transitions/01-transition/text.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: The transition directive
----
-
-We can make more appealing user interfaces by gracefully transitioning elements into and out of the DOM. Svelte makes this very easy with the `transition` directive.
-
-First, import the `fade` function from `svelte/transition`...
-
-```svelte
-<script>
-	import { fade } from 'svelte/transition';
-	let visible = true;
-</script>
-```
-
-...then add it to the `<p>` element:
-
-```svelte
-<p transition:fade>Fades in and out</p>
-```
diff --git a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-a/App.svelte b/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-a/App.svelte
deleted file mode 100644
index 29e9254d14..0000000000
--- a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-a/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fade>Fades in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-b/App.svelte b/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-b/App.svelte
deleted file mode 100644
index 318739f1d0..0000000000
--- a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fly={{ y: 200, duration: 2000 }}>Flies in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/text.md b/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/text.md
deleted file mode 100644
index 317930c7e4..0000000000
--- a/documentation/tutorial/10-transitions/02-adding-parameters-to-transitions/text.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Adding parameters
----
-
-Transition functions can accept parameters. Replace the `fade` transition with `fly`...
-
-```svelte
-<script>
-	import { fly } from 'svelte/transition';
-	let visible = true;
-</script>
-```
-
-...and apply it to the `<p>` along with some options:
-
-```svelte
-<p transition:fly={{ y: 200, duration: 2000 }}>Flies in and out</p>
-```
-
-Note that the transition is _reversible_ — if you toggle the checkbox while the transition is ongoing, it transitions from the current point, rather than the beginning or the end.
diff --git a/documentation/tutorial/10-transitions/03-in-and-out/app-a/App.svelte b/documentation/tutorial/10-transitions/03-in-and-out/app-a/App.svelte
deleted file mode 100644
index 318739f1d0..0000000000
--- a/documentation/tutorial/10-transitions/03-in-and-out/app-a/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fly={{ y: 200, duration: 2000 }}>Flies in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/03-in-and-out/app-b/App.svelte b/documentation/tutorial/10-transitions/03-in-and-out/app-b/App.svelte
deleted file mode 100644
index bb44e5ca9f..0000000000
--- a/documentation/tutorial/10-transitions/03-in-and-out/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { fade, fly } from 'svelte/transition';
-	let visible = true;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p in:fly={{ y: 200, duration: 2000 }} out:fade>Flies in, fades out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/03-in-and-out/text.md b/documentation/tutorial/10-transitions/03-in-and-out/text.md
deleted file mode 100644
index ed68e08219..0000000000
--- a/documentation/tutorial/10-transitions/03-in-and-out/text.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: In and out
----
-
-Instead of the `transition` directive, an element can have an `in` or an `out` directive, or both together. Import `fade` alongside `fly`...
-
-```js
-import { fade, fly } from 'svelte/transition';
-```
-
-...then replace the `transition` directive with separate `in` and `out` directives:
-
-```svelte
-<p in:fly={{ y: 200, duration: 2000 }} out:fade>Flies in, fades out</p>
-```
-
-In this case, the transitions are _not_ reversed.
diff --git a/documentation/tutorial/10-transitions/04-custom-css-transitions/app-a/App.svelte b/documentation/tutorial/10-transitions/04-custom-css-transitions/app-a/App.svelte
deleted file mode 100644
index 621a581342..0000000000
--- a/documentation/tutorial/10-transitions/04-custom-css-transitions/app-a/App.svelte
+++ /dev/null
@@ -1,38 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-
-	let visible = true;
-
-	function spin(node, { duration }) {
-		return {
-			duration,
-			css: (t) => ``
-		};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<div class="centered" in:spin={{ duration: 8000 }} out:fade>
-		<span>transitions!</span>
-	</div>
-{/if}
-
-<style>
-	.centered {
-		position: absolute;
-		left: 50%;
-		top: 50%;
-		transform: translate(-50%, -50%);
-	}
-
-	span {
-		position: absolute;
-		transform: translate(-50%, -50%);
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/04-custom-css-transitions/app-b/App.svelte b/documentation/tutorial/10-transitions/04-custom-css-transitions/app-b/App.svelte
deleted file mode 100644
index df055bd8f9..0000000000
--- a/documentation/tutorial/10-transitions/04-custom-css-transitions/app-b/App.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-	import { fade } from 'svelte/transition';
-	import { elasticOut } from 'svelte/easing';
-
-	let visible = true;
-
-	function spin(node, { duration }) {
-		return {
-			duration,
-			css: (t) => {
-				const eased = elasticOut(t);
-
-				return `
-					transform: scale(${eased}) rotate(${eased * 1080}deg);
-					color: hsl(
-						${Math.trunc(t * 360)},
-						${Math.min(100, 1000 - 1000 * t)}%,
-						${Math.min(50, 500 - 500 * t)}%
-					);`;
-			}
-		};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<div class="centered" in:spin={{ duration: 8000 }} out:fade>
-		<span>transitions!</span>
-	</div>
-{/if}
-
-<style>
-	.centered {
-		position: absolute;
-		left: 50%;
-		top: 50%;
-		transform: translate(-50%, -50%);
-	}
-
-	span {
-		position: absolute;
-		transform: translate(-50%, -50%);
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/04-custom-css-transitions/text.md b/documentation/tutorial/10-transitions/04-custom-css-transitions/text.md
deleted file mode 100644
index 0a34058ace..0000000000
--- a/documentation/tutorial/10-transitions/04-custom-css-transitions/text.md
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Custom CSS transitions
----
-
-The `svelte/transition` module has a handful of built-in transitions, but it's very easy to create your own. By way of example, this is the source of the `fade` transition:
-
-```js
-function fade(node, { delay = 0, duration = 400 }) {
-	const o = +getComputedStyle(node).opacity;
-
-	return {
-		delay,
-		duration,
-		css: (t) => `opacity: ${t * o}`
-	};
-}
-```
-
-The function takes two arguments — the node to which the transition is applied, and any parameters that were passed in — and returns a transition object which can have the following properties:
-
-- `delay` — milliseconds before the transition begins
-- `duration` — length of the transition in milliseconds
-- `easing` — a `p => t` easing function (see the chapter on [tweening](/tutorial/tweened))
-- `css` — a `(t, u) => css` function, where `u === 1 - t`
-- `tick` — a `(t, u) => {...}` function that has some effect on the node
-
-The `t` value is `0` at the beginning of an intro or the end of an outro, and `1` at the end of an intro or beginning of an outro.
-
-Most of the time you should return the `css` property and _not_ the `tick` property, as CSS animations run off the main thread to prevent jank where possible. Svelte 'simulates' the transition and constructs a CSS animation, then lets it run.
-
-For example, the `fade` transition generates a CSS animation somewhat like this:
-
-```css
-0% {
-	opacity: 0;
-}
-10% {
-	opacity: 0.1;
-}
-20% {
-	opacity: 0.2;
-}
-/* ... */
-100% {
-	opacity: 1;
-}
-```
-
-We can get a lot more creative though. Let's make something truly gratuitous:
-
-```svelte
-<script>
-	import { fade } from 'svelte/transition';
-	import { elasticOut } from 'svelte/easing';
-
-	let visible = true;
-
-	function spin(node, { duration }) {
-		return {
-			duration,
-			css: (t) => {
-				const eased = elasticOut(t);
-
-				return `
-					transform: scale(${eased}) rotate(${eased * 1080}deg);
-					color: hsl(
-						${Math.trunc(t * 360)},
-						${Math.min(100, 1000 - 1000 * t)}%,
-						${Math.min(50, 500 - 500 * t)}%
-					);`;
-			}
-		};
-	}
-</script>
-```
-
-Remember: with great power comes great responsibility.
diff --git a/documentation/tutorial/10-transitions/05-custom-js-transitions/app-a/App.svelte b/documentation/tutorial/10-transitions/05-custom-js-transitions/app-a/App.svelte
deleted file mode 100644
index d5d029f223..0000000000
--- a/documentation/tutorial/10-transitions/05-custom-js-transitions/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let visible = false;
-
-	function typewriter(node, { speed = 50 }) {
-		// implementation goes here
-
-		return {};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:typewriter>The quick brown fox jumps over the lazy dog</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/05-custom-js-transitions/app-b/App.svelte b/documentation/tutorial/10-transitions/05-custom-js-transitions/app-b/App.svelte
deleted file mode 100644
index 21536e8683..0000000000
--- a/documentation/tutorial/10-transitions/05-custom-js-transitions/app-b/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	let visible = false;
-
-	function typewriter(node, { speed = 1 }) {
-		const valid = node.childNodes.length === 1 && node.childNodes[0].nodeType === Node.TEXT_NODE;
-
-		if (!valid) {
-			throw new Error(`This transition only works on elements with a single text node child`);
-		}
-
-		const text = node.textContent;
-		const duration = text.length / (speed * 0.01);
-
-		return {
-			duration,
-			tick: (t) => {
-				const i = Math.trunc(text.length * t);
-				node.textContent = text.slice(0, i);
-			}
-		};
-	}
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:typewriter>The quick brown fox jumps over the lazy dog</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/05-custom-js-transitions/text.md b/documentation/tutorial/10-transitions/05-custom-js-transitions/text.md
deleted file mode 100644
index 3b330c6268..0000000000
--- a/documentation/tutorial/10-transitions/05-custom-js-transitions/text.md
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: Custom JS transitions
----
-
-While you should generally use CSS for transitions as much as possible, there are some effects that can't be achieved without JavaScript, such as a typewriter effect:
-
-```js
-function typewriter(node, { speed = 1 }) {
-	const valid = node.childNodes.length === 1 && node.childNodes[0].nodeType === Node.TEXT_NODE;
-
-	if (!valid) {
-		throw new Error(`This transition only works on elements with a single text node child`);
-	}
-
-	const text = node.textContent;
-	const duration = text.length / (speed * 0.01);
-
-	return {
-		duration,
-		tick: (t) => {
-			const i = Math.trunc(text.length * t);
-			node.textContent = text.slice(0, i);
-		}
-	};
-}
-```
diff --git a/documentation/tutorial/10-transitions/06-transition-events/app-a/App.svelte b/documentation/tutorial/10-transitions/06-transition-events/app-a/App.svelte
deleted file mode 100644
index 59458e9c2f..0000000000
--- a/documentation/tutorial/10-transitions/06-transition-events/app-a/App.svelte
+++ /dev/null
@@ -1,17 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-
-	let visible = true;
-	let status = 'waiting...';
-</script>
-
-<p>status: {status}</p>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p transition:fly={{ y: 200, duration: 2000 }}>Flies in and out</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/06-transition-events/app-b/App.svelte b/documentation/tutorial/10-transitions/06-transition-events/app-b/App.svelte
deleted file mode 100644
index 31ef18c930..0000000000
--- a/documentation/tutorial/10-transitions/06-transition-events/app-b/App.svelte
+++ /dev/null
@@ -1,25 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-
-	let visible = true;
-	let status = 'waiting...';
-</script>
-
-<p>status: {status}</p>
-
-<label>
-	<input type="checkbox" bind:checked={visible} />
-	visible
-</label>
-
-{#if visible}
-	<p
-		transition:fly={{ y: 200, duration: 2000 }}
-		on:introstart={() => (status = 'intro started')}
-		on:outrostart={() => (status = 'outro started')}
-		on:introend={() => (status = 'intro ended')}
-		on:outroend={() => (status = 'outro ended')}
-	>
-		Flies in and out
-	</p>
-{/if}
diff --git a/documentation/tutorial/10-transitions/06-transition-events/text.md b/documentation/tutorial/10-transitions/06-transition-events/text.md
deleted file mode 100644
index 75cf5dcfab..0000000000
--- a/documentation/tutorial/10-transitions/06-transition-events/text.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Transition events
----
-
-It can be useful to know when transitions are beginning and ending. Svelte dispatches events that you can listen to like any other DOM event:
-
-```svelte
-<p
-	transition:fly={{ y: 200, duration: 2000 }}
-	on:introstart={() => (status = 'intro started')}
-	on:outrostart={() => (status = 'outro started')}
-	on:introend={() => (status = 'intro ended')}
-	on:outroend={() => (status = 'outro ended')}
->
-	Flies in and out
-</p>
-```
diff --git a/documentation/tutorial/10-transitions/07-global-transitions/app-a/App.svelte b/documentation/tutorial/10-transitions/07-global-transitions/app-a/App.svelte
deleted file mode 100644
index 9700f945b4..0000000000
--- a/documentation/tutorial/10-transitions/07-global-transitions/app-a/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	import { slide } from 'svelte/transition';
-
-	let showItems = true;
-	let i = 5;
-	let items = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten'];
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={showItems} />
-	show list
-</label>
-
-<label>
-	<input type="range" bind:value={i} max="10" />
-</label>
-
-{#if showItems}
-	{#each items.slice(0, i) as item}
-		<div transition:slide>
-			{item}
-		</div>
-	{/each}
-{/if}
-
-<style>
-	div {
-		padding: 0.5em 0;
-		border-top: 1px solid #eee;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/07-global-transitions/app-b/App.svelte b/documentation/tutorial/10-transitions/07-global-transitions/app-b/App.svelte
deleted file mode 100644
index 93de6a0cdc..0000000000
--- a/documentation/tutorial/10-transitions/07-global-transitions/app-b/App.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script>
-	import { slide } from 'svelte/transition';
-
-	let showItems = true;
-	let i = 5;
-	let items = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten'];
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={showItems} />
-	show list
-</label>
-
-<label>
-	<input type="range" bind:value={i} max="10" />
-</label>
-
-{#if showItems}
-	{#each items.slice(0, i) as item}
-		<div transition:slide|global>
-			{item}
-		</div>
-	{/each}
-{/if}
-
-<style>
-	div {
-		padding: 0.5em 0;
-		border-top: 1px solid #eee;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/07-global-transitions/text.md b/documentation/tutorial/10-transitions/07-global-transitions/text.md
deleted file mode 100644
index 8f31620623..0000000000
--- a/documentation/tutorial/10-transitions/07-global-transitions/text.md
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Global transitions
----
-
-Ordinarily, transitions will only play on elements when their direct containing block is added or destroyed. In the example here, toggling the visibility of the entire list does not apply transitions to individual list elements.
-
-Instead, we'd like transitions to not only play when individual items are added and removed with the slider but also when we toggle the checkbox.
-
-We can achieve this with a _global_ transition, which plays when _any_ block containing the transitions is added or removed:
-
-```svelte
-<div transition:slide|global>
-	{item}
-</div>
-```
-
-> In Svelte 3, transitions were global by default and you had to use the `|local` modifier to make them local.
diff --git a/documentation/tutorial/10-transitions/08-deferred-transitions/app-a/App.svelte b/documentation/tutorial/10-transitions/08-deferred-transitions/app-a/App.svelte
deleted file mode 100644
index 71d1923c80..0000000000
--- a/documentation/tutorial/10-transitions/08-deferred-transitions/app-a/App.svelte
+++ /dev/null
@@ -1,150 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { crossfade } from 'svelte/transition';
-
-	const [send, receive] = crossfade({
-		duration: (d) => Math.sqrt(d * 200),
-
-		fallback(node, params) {
-			const style = getComputedStyle(node);
-			const transform = style.transform === 'none' ? '' : style.transform;
-
-			return {
-				duration: 600,
-				easing: quintOut,
-				css: (t) => `
-					transform: ${transform} scale(${t});
-					opacity: ${t}
-				`
-			};
-		}
-	});
-
-	let uid = 1;
-
-	let todos = [
-		{ id: uid++, done: false, description: 'write some docs' },
-		{ id: uid++, done: false, description: 'start writing blog post' },
-		{ id: uid++, done: true, description: 'buy some milk' },
-		{ id: uid++, done: false, description: 'mow the lawn' },
-		{ id: uid++, done: false, description: 'feed the turtle' },
-		{ id: uid++, done: false, description: 'fix some bugs' }
-	];
-
-	function add(input) {
-		const todo = {
-			id: uid++,
-			done: false,
-			description: input.value
-		};
-
-		todos = [todo, ...todos];
-		input.value = '';
-	}
-
-	function remove(todo) {
-		todos = todos.filter((t) => t !== todo);
-	}
-
-	function mark(todo, done) {
-		todo.done = done;
-		remove(todo);
-		todos = todos.concat(todo);
-	}
-</script>
-
-<div class="board">
-	<input
-		placeholder="what needs to be done?"
-		on:keydown={(e) => e.key === 'Enter' && add(e.target)}
-	/>
-
-	<div class="left">
-		<h2>todo</h2>
-		{#each todos.filter((t) => !t.done) as todo (todo.id)}
-			<label>
-				<input type="checkbox" on:change={() => mark(todo, true)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-
-	<div class="right">
-		<h2>done</h2>
-		{#each todos.filter((t) => t.done) as todo (todo.id)}
-			<label class="done">
-				<input type="checkbox" checked on:change={() => mark(todo, false)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.board {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		grid-gap: 1em;
-		max-width: 36em;
-		margin: 0 auto;
-	}
-
-	.board > input {
-		font-size: 1.4em;
-		grid-column: 1/3;
-	}
-
-	h2 {
-		font-size: 2em;
-		font-weight: 200;
-		user-select: none;
-		margin: 0 0 0.5em 0;
-	}
-
-	label {
-		display: block;
-		position: relative;
-		line-height: 1.2;
-		padding: 0.5em 2.5em 0.5em 2em;
-		margin: 0 0 0.5em 0;
-		border-radius: 2px;
-		user-select: none;
-		border: 1px solid hsl(240, 8%, 70%);
-		background-color: hsl(240, 8%, 93%);
-		color: #333;
-	}
-
-	input[type='checkbox'] {
-		position: absolute;
-		left: 0.5em;
-		top: 0.6em;
-		margin: 0;
-	}
-
-	.done {
-		border: 1px solid hsl(240, 8%, 90%);
-		background-color: hsl(240, 8%, 98%);
-	}
-
-	button {
-		position: absolute;
-		top: 0;
-		right: 0.2em;
-		width: 2em;
-		height: 100%;
-		background: no-repeat 50% 50%
-			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23676778' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M17,7H14.5L13.5,6H10.5L9.5,7H7V9H17V7M9,18H15A1,1 0 0,0 16,17V10H8V17A1,1 0 0,0 9,18Z'%3E%3C/path%3E%3C/svg%3E");
-		background-size: 1.4em 1.4em;
-		border: none;
-		opacity: 0;
-		transition: opacity 0.2s;
-		text-indent: -9999px;
-		cursor: pointer;
-	}
-
-	label:hover button {
-		opacity: 1;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/08-deferred-transitions/app-b/App.svelte b/documentation/tutorial/10-transitions/08-deferred-transitions/app-b/App.svelte
deleted file mode 100644
index f3850b881f..0000000000
--- a/documentation/tutorial/10-transitions/08-deferred-transitions/app-b/App.svelte
+++ /dev/null
@@ -1,150 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { crossfade } from 'svelte/transition';
-
-	const [send, receive] = crossfade({
-		duration: (d) => Math.sqrt(d * 200),
-
-		fallback(node, params) {
-			const style = getComputedStyle(node);
-			const transform = style.transform === 'none' ? '' : style.transform;
-
-			return {
-				duration: 600,
-				easing: quintOut,
-				css: (t) => `
-					transform: ${transform} scale(${t});
-					opacity: ${t}
-				`
-			};
-		}
-	});
-
-	let uid = 1;
-
-	let todos = [
-		{ id: uid++, done: false, description: 'write some docs' },
-		{ id: uid++, done: false, description: 'start writing blog post' },
-		{ id: uid++, done: true, description: 'buy some milk' },
-		{ id: uid++, done: false, description: 'mow the lawn' },
-		{ id: uid++, done: false, description: 'feed the turtle' },
-		{ id: uid++, done: false, description: 'fix some bugs' }
-	];
-
-	function add(input) {
-		const todo = {
-			id: uid++,
-			done: false,
-			description: input.value
-		};
-
-		todos = [todo, ...todos];
-		input.value = '';
-	}
-
-	function remove(todo) {
-		todos = todos.filter((t) => t !== todo);
-	}
-
-	function mark(todo, done) {
-		todo.done = done;
-		remove(todo);
-		todos = todos.concat(todo);
-	}
-</script>
-
-<div class="board">
-	<input
-		placeholder="what needs to be done?"
-		on:keydown={(e) => e.key === 'Enter' && add(e.target)}
-	/>
-
-	<div class="left">
-		<h2>todo</h2>
-		{#each todos.filter((t) => !t.done) as todo (todo.id)}
-			<label in:receive={{ key: todo.id }} out:send={{ key: todo.id }}>
-				<input type="checkbox" on:change={() => mark(todo, true)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-
-	<div class="right">
-		<h2>done</h2>
-		{#each todos.filter((t) => t.done) as todo (todo.id)}
-			<label class="done" in:receive={{ key: todo.id }} out:send={{ key: todo.id }}>
-				<input type="checkbox" checked on:change={() => mark(todo, false)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.board {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		grid-gap: 1em;
-		max-width: 36em;
-		margin: 0 auto;
-	}
-
-	.board > input {
-		font-size: 1.4em;
-		grid-column: 1/3;
-	}
-
-	h2 {
-		font-size: 2em;
-		font-weight: 200;
-		user-select: none;
-		margin: 0 0 0.5em 0;
-	}
-
-	label {
-		display: block;
-		position: relative;
-		line-height: 1.2;
-		padding: 0.5em 2.5em 0.5em 2em;
-		margin: 0 0 0.5em 0;
-		border-radius: 2px;
-		user-select: none;
-		border: 1px solid hsl(240, 8%, 70%);
-		background-color: hsl(240, 8%, 93%);
-		color: #333;
-	}
-
-	input[type='checkbox'] {
-		position: absolute;
-		left: 0.5em;
-		top: 0.6em;
-		margin: 0;
-	}
-
-	.done {
-		border: 1px solid hsl(240, 8%, 90%);
-		background-color: hsl(240, 8%, 98%);
-	}
-
-	button {
-		position: absolute;
-		top: 0;
-		right: 0.2em;
-		width: 2em;
-		height: 100%;
-		background: no-repeat 50% 50%
-			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23676778' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M17,7H14.5L13.5,6H10.5L9.5,7H7V9H17V7M9,18H15A1,1 0 0,0 16,17V10H8V17A1,1 0 0,0 9,18Z'%3E%3C/path%3E%3C/svg%3E");
-		background-size: 1.4em 1.4em;
-		border: none;
-		opacity: 0;
-		transition: opacity 0.2s;
-		text-indent: -9999px;
-		cursor: pointer;
-	}
-
-	label:hover button {
-		opacity: 1;
-	}
-</style>
diff --git a/documentation/tutorial/10-transitions/08-deferred-transitions/text.md b/documentation/tutorial/10-transitions/08-deferred-transitions/text.md
deleted file mode 100644
index b56e2fd996..0000000000
--- a/documentation/tutorial/10-transitions/08-deferred-transitions/text.md
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Deferred transitions
----
-
-A particularly powerful feature of Svelte's transition engine is the ability to _defer_ transitions, so that they can be coordinated between multiple elements.
-
-Take this pair of todo lists, in which toggling a todo sends it to the opposite list. In the real world, objects don't behave like that — instead of disappearing and reappearing in another place, they move through a series of intermediate positions. Using motion can go a long way towards helping users understand what's happening in your app.
-
-We can achieve this effect using the `crossfade` function, which creates a pair of transitions called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
-
-Find the `<label>` element on line 65, and add the `send` and `receive` transitions:
-
-```svelte
-<label
-	in:receive="{{key: todo.id}}"
-	out:send="{{key: todo.id}}"
->
-```
-
-Do the same for the next `<label>` element:
-
-```svelte
-<label
-	class="done"
-	in:receive="{{key: todo.id}}"
-	out:send="{{key: todo.id}}"
->
-```
-
-Now, when you toggle items, they move smoothly to their new location. The non-transitioning items still jump around awkwardly — we can fix that in the next chapter.
diff --git a/documentation/tutorial/10-transitions/09-key-blocks/app-a/App.svelte b/documentation/tutorial/10-transitions/09-key-blocks/app-a/App.svelte
deleted file mode 100644
index 2a318c510a..0000000000
--- a/documentation/tutorial/10-transitions/09-key-blocks/app-a/App.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-
-	let number = 0;
-</script>
-
-<div>
-	The number is:
-	<span style="display: inline-block" in:fly={{ y: -20 }}>
-		{number}
-	</span>
-</div>
-<br />
-<button
-	on:click={() => {
-		number += 1;
-	}}
->
-	Increment
-</button>
diff --git a/documentation/tutorial/10-transitions/09-key-blocks/app-b/App.svelte b/documentation/tutorial/10-transitions/09-key-blocks/app-b/App.svelte
deleted file mode 100644
index 04b06b2169..0000000000
--- a/documentation/tutorial/10-transitions/09-key-blocks/app-b/App.svelte
+++ /dev/null
@@ -1,22 +0,0 @@
-<script>
-	import { fly } from 'svelte/transition';
-
-	let number = 0;
-</script>
-
-<div>
-	The number is:
-	{#key number}
-		<span style="display: inline-block" in:fly={{ y: -20 }}>
-			{number}
-		</span>
-	{/key}
-</div>
-<br />
-<button
-	on:click={() => {
-		number += 1;
-	}}
->
-	Increment
-</button>
diff --git a/documentation/tutorial/10-transitions/09-key-blocks/text.md b/documentation/tutorial/10-transitions/09-key-blocks/text.md
deleted file mode 100644
index 4154ce5eb6..0000000000
--- a/documentation/tutorial/10-transitions/09-key-blocks/text.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Key blocks
----
-
-Key blocks destroy and recreate their contents when the value of an expression changes.
-
-```svelte
-{#key number}
-	<span style="display: inline-block" in:fly={{ y: -20 }}>
-		{number}
-	</span>
-{/key}
-```
-
-This is useful if you want an element to play its transition whenever a value changes instead of only when the element enters or leaves the DOM.
-
-Wrap the `<span>` element in a key block depending on `number`. This will make the
-animation play whenever you press the increment button.
diff --git a/documentation/tutorial/10-transitions/meta.json b/documentation/tutorial/10-transitions/meta.json
deleted file mode 100644
index 5981eece3e..0000000000
--- a/documentation/tutorial/10-transitions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Transitions"
-}
diff --git a/documentation/tutorial/11-animations/01-animate/app-a/App.svelte b/documentation/tutorial/11-animations/01-animate/app-a/App.svelte
deleted file mode 100644
index f3850b881f..0000000000
--- a/documentation/tutorial/11-animations/01-animate/app-a/App.svelte
+++ /dev/null
@@ -1,150 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { crossfade } from 'svelte/transition';
-
-	const [send, receive] = crossfade({
-		duration: (d) => Math.sqrt(d * 200),
-
-		fallback(node, params) {
-			const style = getComputedStyle(node);
-			const transform = style.transform === 'none' ? '' : style.transform;
-
-			return {
-				duration: 600,
-				easing: quintOut,
-				css: (t) => `
-					transform: ${transform} scale(${t});
-					opacity: ${t}
-				`
-			};
-		}
-	});
-
-	let uid = 1;
-
-	let todos = [
-		{ id: uid++, done: false, description: 'write some docs' },
-		{ id: uid++, done: false, description: 'start writing blog post' },
-		{ id: uid++, done: true, description: 'buy some milk' },
-		{ id: uid++, done: false, description: 'mow the lawn' },
-		{ id: uid++, done: false, description: 'feed the turtle' },
-		{ id: uid++, done: false, description: 'fix some bugs' }
-	];
-
-	function add(input) {
-		const todo = {
-			id: uid++,
-			done: false,
-			description: input.value
-		};
-
-		todos = [todo, ...todos];
-		input.value = '';
-	}
-
-	function remove(todo) {
-		todos = todos.filter((t) => t !== todo);
-	}
-
-	function mark(todo, done) {
-		todo.done = done;
-		remove(todo);
-		todos = todos.concat(todo);
-	}
-</script>
-
-<div class="board">
-	<input
-		placeholder="what needs to be done?"
-		on:keydown={(e) => e.key === 'Enter' && add(e.target)}
-	/>
-
-	<div class="left">
-		<h2>todo</h2>
-		{#each todos.filter((t) => !t.done) as todo (todo.id)}
-			<label in:receive={{ key: todo.id }} out:send={{ key: todo.id }}>
-				<input type="checkbox" on:change={() => mark(todo, true)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-
-	<div class="right">
-		<h2>done</h2>
-		{#each todos.filter((t) => t.done) as todo (todo.id)}
-			<label class="done" in:receive={{ key: todo.id }} out:send={{ key: todo.id }}>
-				<input type="checkbox" checked on:change={() => mark(todo, false)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.board {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		grid-gap: 1em;
-		max-width: 36em;
-		margin: 0 auto;
-	}
-
-	.board > input {
-		font-size: 1.4em;
-		grid-column: 1/3;
-	}
-
-	h2 {
-		font-size: 2em;
-		font-weight: 200;
-		user-select: none;
-		margin: 0 0 0.5em 0;
-	}
-
-	label {
-		display: block;
-		position: relative;
-		line-height: 1.2;
-		padding: 0.5em 2.5em 0.5em 2em;
-		margin: 0 0 0.5em 0;
-		border-radius: 2px;
-		user-select: none;
-		border: 1px solid hsl(240, 8%, 70%);
-		background-color: hsl(240, 8%, 93%);
-		color: #333;
-	}
-
-	input[type='checkbox'] {
-		position: absolute;
-		left: 0.5em;
-		top: 0.6em;
-		margin: 0;
-	}
-
-	.done {
-		border: 1px solid hsl(240, 8%, 90%);
-		background-color: hsl(240, 8%, 98%);
-	}
-
-	button {
-		position: absolute;
-		top: 0;
-		right: 0.2em;
-		width: 2em;
-		height: 100%;
-		background: no-repeat 50% 50%
-			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23676778' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M17,7H14.5L13.5,6H10.5L9.5,7H7V9H17V7M9,18H15A1,1 0 0,0 16,17V10H8V17A1,1 0 0,0 9,18Z'%3E%3C/path%3E%3C/svg%3E");
-		background-size: 1.4em 1.4em;
-		border: none;
-		opacity: 0;
-		transition: opacity 0.2s;
-		text-indent: -9999px;
-		cursor: pointer;
-	}
-
-	label:hover button {
-		opacity: 1;
-	}
-</style>
diff --git a/documentation/tutorial/11-animations/01-animate/app-b/App.svelte b/documentation/tutorial/11-animations/01-animate/app-b/App.svelte
deleted file mode 100644
index ccf09b0f4e..0000000000
--- a/documentation/tutorial/11-animations/01-animate/app-b/App.svelte
+++ /dev/null
@@ -1,151 +0,0 @@
-<script>
-	import { quintOut } from 'svelte/easing';
-	import { crossfade } from 'svelte/transition';
-	import { flip } from 'svelte/animate';
-
-	const [send, receive] = crossfade({
-		duration: (d) => Math.sqrt(d * 200),
-
-		fallback(node, params) {
-			const style = getComputedStyle(node);
-			const transform = style.transform === 'none' ? '' : style.transform;
-
-			return {
-				duration: 600,
-				easing: quintOut,
-				css: (t) => `
-					transform: ${transform} scale(${t});
-					opacity: ${t}
-				`
-			};
-		}
-	});
-
-	let uid = 1;
-
-	let todos = [
-		{ id: uid++, done: false, description: 'write some docs' },
-		{ id: uid++, done: false, description: 'start writing blog post' },
-		{ id: uid++, done: true, description: 'buy some milk' },
-		{ id: uid++, done: false, description: 'mow the lawn' },
-		{ id: uid++, done: false, description: 'feed the turtle' },
-		{ id: uid++, done: false, description: 'fix some bugs' }
-	];
-
-	function add(input) {
-		const todo = {
-			id: uid++,
-			done: false,
-			description: input.value
-		};
-
-		todos = [todo, ...todos];
-		input.value = '';
-	}
-
-	function remove(todo) {
-		todos = todos.filter((t) => t !== todo);
-	}
-
-	function mark(todo, done) {
-		todo.done = done;
-		remove(todo);
-		todos = todos.concat(todo);
-	}
-</script>
-
-<div class="board">
-	<input
-		placeholder="what needs to be done?"
-		on:keydown={(e) => e.key === 'Enter' && add(e.target)}
-	/>
-
-	<div class="left">
-		<h2>todo</h2>
-		{#each todos.filter((t) => !t.done) as todo (todo.id)}
-			<label in:receive={{ key: todo.id }} out:send={{ key: todo.id }} animate:flip>
-				<input type="checkbox" on:change={() => mark(todo, true)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-
-	<div class="right">
-		<h2>done</h2>
-		{#each todos.filter((t) => t.done) as todo (todo.id)}
-			<label class="done" in:receive={{ key: todo.id }} out:send={{ key: todo.id }} animate:flip>
-				<input type="checkbox" checked on:change={() => mark(todo, false)} />
-				{todo.description}
-				<button on:click={() => remove(todo)}>remove</button>
-			</label>
-		{/each}
-	</div>
-</div>
-
-<style>
-	.board {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		grid-gap: 1em;
-		max-width: 36em;
-		margin: 0 auto;
-	}
-
-	.board > input {
-		font-size: 1.4em;
-		grid-column: 1/3;
-	}
-
-	h2 {
-		font-size: 2em;
-		font-weight: 200;
-		user-select: none;
-		margin: 0 0 0.5em 0;
-	}
-
-	label {
-		display: block;
-		position: relative;
-		line-height: 1.2;
-		padding: 0.5em 2.5em 0.5em 2em;
-		margin: 0 0 0.5em 0;
-		border-radius: 2px;
-		user-select: none;
-		border: 1px solid hsl(240, 8%, 70%);
-		background-color: hsl(240, 8%, 93%);
-		color: #333;
-	}
-
-	input[type='checkbox'] {
-		position: absolute;
-		left: 0.5em;
-		top: 0.6em;
-		margin: 0;
-	}
-
-	.done {
-		border: 1px solid hsl(240, 8%, 90%);
-		background-color: hsl(240, 8%, 98%);
-	}
-
-	button {
-		position: absolute;
-		top: 0;
-		right: 0.2em;
-		width: 2em;
-		height: 100%;
-		background: no-repeat 50% 50%
-			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23676778' d='M12,2C17.53,2 22,6.47 22,12C22,17.53 17.53,22 12,22C6.47,22 2,17.53 2,12C2,6.47 6.47,2 12,2M17,7H14.5L13.5,6H10.5L9.5,7H7V9H17V7M9,18H15A1,1 0 0,0 16,17V10H8V17A1,1 0 0,0 9,18Z'%3E%3C/path%3E%3C/svg%3E");
-		background-size: 1.4em 1.4em;
-		border: none;
-		opacity: 0;
-		transition: opacity 0.2s;
-		text-indent: -9999px;
-		cursor: pointer;
-	}
-
-	label:hover button {
-		opacity: 1;
-	}
-</style>
diff --git a/documentation/tutorial/11-animations/01-animate/text.md b/documentation/tutorial/11-animations/01-animate/text.md
deleted file mode 100644
index 983ab0be01..0000000000
--- a/documentation/tutorial/11-animations/01-animate/text.md
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: The animate directive
----
-
-In the [previous chapter](/tutorial/deferred-transitions), we used deferred transitions to create the illusion of motion as elements move from one todo list to the other.
-
-To complete the illusion, we also need to apply motion to the elements that _aren't_ transitioning. For this, we use the `animate` directive.
-
-First, import the `flip` function — flip stands for ['First, Last, Invert, Play'](https://aerotwist.com/blog/flip-your-animations/) — from `svelte/animate`:
-
-```js
-import { flip } from 'svelte/animate';
-```
-
-Then add it to the `<label>` elements:
-
-```svelte
-<label
-	in:receive="{{key: todo.id}}"
-	out:send="{{key: todo.id}}"
-	animate:flip
->
-```
-
-The movement is a little slow in this case, so we can add a `duration` parameter:
-
-```svelte
-<label
-	in:receive="{{key: todo.id}}"
-	out:send="{{key: todo.id}}"
-	animate:flip="{{duration: 200}}"
->
-```
-
-> `duration` can also be a `d => milliseconds` function, where `d` is the number of pixels the element has to travel
-
-Note that all the transitions and animations are being applied with CSS, rather than JavaScript, meaning they won't block (or be blocked by) the main thread.
diff --git a/documentation/tutorial/11-animations/meta.json b/documentation/tutorial/11-animations/meta.json
deleted file mode 100644
index 25cc16d8bb..0000000000
--- a/documentation/tutorial/11-animations/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Animations"
-}
diff --git a/documentation/tutorial/12-actions/01-actions/app-a/App.svelte b/documentation/tutorial/12-actions/01-actions/app-a/App.svelte
deleted file mode 100644
index cc2ebf66b3..0000000000
--- a/documentation/tutorial/12-actions/01-actions/app-a/App.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	let showModal = true;
-</script>
-
-<button on:click={() => (showModal = true)}>Show Modal</button>
-{#if showModal}
-	<div class="box" on:outclick={() => (showModal = false)}>Click outside me!</div>
-{/if}
-
-<style>
-	.box {
-		--width: 100px;
-		--height: 100px;
-		position: absolute;
-		width: var(--width);
-		height: var(--height);
-		left: calc(50% - var(--width) / 2);
-		top: calc(50% - var(--height) / 2);
-		display: flex;
-		align-items: center;
-		padding: 8px;
-		border-radius: 4px;
-		background-color: #ff3e00;
-		color: #fff;
-		text-align: center;
-		font-weight: bold;
-	}
-</style>
diff --git a/documentation/tutorial/12-actions/01-actions/app-a/click_outside.js b/documentation/tutorial/12-actions/01-actions/app-a/click_outside.js
deleted file mode 100644
index c406f6e95c..0000000000
--- a/documentation/tutorial/12-actions/01-actions/app-a/click_outside.js
+++ /dev/null
@@ -1,9 +0,0 @@
-export function clickOutside(node) {
-	// setup work goes here...
-
-	return {
-		destroy() {
-			// ...cleanup goes here
-		}
-	};
-}
diff --git a/documentation/tutorial/12-actions/01-actions/app-b/App.svelte b/documentation/tutorial/12-actions/01-actions/app-b/App.svelte
deleted file mode 100644
index fcd0ca6ae3..0000000000
--- a/documentation/tutorial/12-actions/01-actions/app-b/App.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script>
-	import { clickOutside } from './click_outside.js';
-
-	let showModal = true;
-</script>
-
-<button on:click={() => (showModal = true)}>Show Modal</button>
-{#if showModal}
-	<div class="box" use:clickOutside on:outclick={() => (showModal = false)}>Click outside me!</div>
-{/if}
-
-<style>
-	.box {
-		--width: 100px;
-		--height: 100px;
-		position: absolute;
-		width: var(--width);
-		height: var(--height);
-		left: calc(50% - var(--width) / 2);
-		top: calc(50% - var(--height) / 2);
-		display: flex;
-		align-items: center;
-		padding: 8px;
-		border-radius: 4px;
-		background-color: #ff3e00;
-		color: #fff;
-		text-align: center;
-		font-weight: bold;
-	}
-</style>
diff --git a/documentation/tutorial/12-actions/01-actions/app-b/click_outside.js b/documentation/tutorial/12-actions/01-actions/app-b/click_outside.js
deleted file mode 100644
index 3a9a561593..0000000000
--- a/documentation/tutorial/12-actions/01-actions/app-b/click_outside.js
+++ /dev/null
@@ -1,15 +0,0 @@
-export function clickOutside(node) {
-	const handleClick = (event) => {
-		if (!node.contains(event.target)) {
-			node.dispatchEvent(new CustomEvent('outclick'));
-		}
-	};
-
-	document.addEventListener('click', handleClick, true);
-
-	return {
-		destroy() {
-			document.removeEventListener('click', handleClick, true);
-		}
-	};
-}
diff --git a/documentation/tutorial/12-actions/01-actions/text.md b/documentation/tutorial/12-actions/01-actions/text.md
deleted file mode 100644
index 70f5519d26..0000000000
--- a/documentation/tutorial/12-actions/01-actions/text.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: The use directive
----
-
-Actions are essentially element-level lifecycle functions. They're useful for things like:
-
-- interfacing with third-party libraries
-- lazy-loaded images
-- tooltips
-- adding custom event handlers
-
-In this app, we want to make the orange modal close when the user clicks outside it. It has an event handler for the `outclick` event, but it isn't a native DOM event. We have to dispatch it ourselves. First, import the `clickOutside` function...
-
-```js
-import { clickOutside } from './click_outside.js';
-```
-
-...then use it with the element:
-
-```svelte
-<div class="box" use:clickOutside on:outclick={() => (showModal = false)}>Click outside me!</div>
-```
-
-Open the `click_outside.js` file. Like transition functions, an action function receives a `node` (which is the element that the action is applied to) and some optional parameters, and returns an action object. That object can have a `destroy` function, which is called when the element is unmounted.
-
-We want to fire the `outclick` event when the user clicks outside the orange box. One possible implementation looks like this:
-
-```js
-export function clickOutside(node) {
-	const handleClick = (event) => {
-		if (!node.contains(event.target)) {
-			node.dispatchEvent(new CustomEvent('outclick'));
-		}
-	};
-
-	document.addEventListener('click', handleClick, true);
-
-	return {
-		destroy() {
-			document.removeEventListener('click', handleClick, true);
-		}
-	};
-}
-```
-
-Update the `clickOutside` function, click the button to show the modal and then click outside it to close it.
diff --git a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/App.svelte b/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/App.svelte
deleted file mode 100644
index 4428fa1f4f..0000000000
--- a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/App.svelte
+++ /dev/null
@@ -1,19 +0,0 @@
-<script>
-	import { longpress } from './longpress.js';
-
-	let pressed = false;
-	let duration = 2000;
-</script>
-
-<label>
-	<input type="range" bind:value={duration} max={2000} step={100} />
-	{duration}ms
-</label>
-
-<button use:longpress on:longpress={() => (pressed = true)} on:mouseenter={() => (pressed = false)}
-	>press and hold</button
->
-
-{#if pressed}
-	<p>congratulations, you pressed and held for {duration}ms</p>
-{/if}
diff --git a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/longpress.js b/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/longpress.js
deleted file mode 100644
index d4568dad7a..0000000000
--- a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-a/longpress.js
+++ /dev/null
@@ -1,24 +0,0 @@
-export function longpress(node, duration) {
-	let timer;
-
-	const handleMousedown = () => {
-		timer = setTimeout(() => {
-			node.dispatchEvent(new CustomEvent('longpress'));
-		}, 500);
-	};
-
-	const handleMouseup = () => {
-		clearTimeout(timer);
-	};
-
-	node.addEventListener('mousedown', handleMousedown);
-	node.addEventListener('mouseup', handleMouseup);
-
-	return {
-		destroy() {
-			clearTimeout(timer);
-			node.removeEventListener('mousedown', handleMousedown);
-			node.removeEventListener('mouseup', handleMouseup);
-		}
-	};
-}
diff --git a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/App.svelte b/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/App.svelte
deleted file mode 100644
index 23cc9f2f9e..0000000000
--- a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import { longpress } from './longpress.js';
-
-	let pressed = false;
-	let duration = 2000;
-</script>
-
-<label>
-	<input type="range" bind:value={duration} max={2000} step={100} />
-	{duration}ms
-</label>
-
-<button
-	use:longpress={duration}
-	on:longpress={() => (pressed = true)}
-	on:mouseenter={() => (pressed = false)}>press and hold</button
->
-
-{#if pressed}
-	<p>congratulations, you pressed and held for {duration}ms</p>
-{/if}
diff --git a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/longpress.js b/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/longpress.js
deleted file mode 100644
index 496e035efc..0000000000
--- a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/app-b/longpress.js
+++ /dev/null
@@ -1,27 +0,0 @@
-export function longpress(node, duration) {
-	let timer;
-
-	const handleMousedown = () => {
-		timer = setTimeout(() => {
-			node.dispatchEvent(new CustomEvent('longpress'));
-		}, duration);
-	};
-
-	const handleMouseup = () => {
-		clearTimeout(timer);
-	};
-
-	node.addEventListener('mousedown', handleMousedown);
-	node.addEventListener('mouseup', handleMouseup);
-
-	return {
-		update(newDuration) {
-			duration = newDuration;
-		},
-		destroy() {
-			clearTimeout(timer);
-			node.removeEventListener('mousedown', handleMousedown);
-			node.removeEventListener('mouseup', handleMouseup);
-		}
-	};
-}
diff --git a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/text.md b/documentation/tutorial/12-actions/02-adding-parameters-to-actions/text.md
deleted file mode 100644
index b1eb261d41..0000000000
--- a/documentation/tutorial/12-actions/02-adding-parameters-to-actions/text.md
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Adding parameters
----
-
-Like transitions and animations, an action can take an argument, which the action function will be called with alongside the element it belongs to.
-
-Here, we're using a `longpress` action that fires an event with the same name whenever the user presses and holds the button for a given duration. Right now, if you switch over to the `longpress.js` file, you'll see it's hardcoded to 500ms.
-
-We can change the action function to accept a `duration` as a second argument, and pass that `duration` to the `setTimeout` call:
-
-```js
-export function longpress(node, duration) {
-	// ...
-
-	const handleMousedown = () => {
-		timer = setTimeout(() => {
-			node.dispatchEvent(new CustomEvent('longpress'));
-		}, duration);
-	};
-
-	// ...
-}
-```
-
-Back in `App.svelte`, we can pass the `duration` value to the action:
-
-```svelte
-<button use:longpress={duration}
-```
-
-This _almost_ works — the event now only fires after 2 seconds. But if you slide the duration down, it will still take two seconds.
-
-To change that, we can add an `update` method in `longpress.js`. This will be called whenever the argument changes:
-
-```js
-return {
-	update(newDuration) {
-		duration = newDuration;
-	}
-	// ...
-};
-```
-
-> If you need to pass multiple arguments to an action, combine them into a single object, as in `use:longpress={{duration, spiciness}}`
diff --git a/documentation/tutorial/12-actions/meta.json b/documentation/tutorial/12-actions/meta.json
deleted file mode 100644
index 3943482e82..0000000000
--- a/documentation/tutorial/12-actions/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Actions"
-}
diff --git a/documentation/tutorial/13-advanced-styling/01-classes/app-a/App.svelte b/documentation/tutorial/13-advanced-styling/01-classes/app-a/App.svelte
deleted file mode 100644
index 15efeb2c9f..0000000000
--- a/documentation/tutorial/13-advanced-styling/01-classes/app-a/App.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	let current = 'foo';
-</script>
-
-<button class={current === 'foo' ? 'selected' : ''} on:click={() => (current = 'foo')}>foo</button>
-
-<button class={current === 'bar' ? 'selected' : ''} on:click={() => (current = 'bar')}>bar</button>
-
-<button class={current === 'baz' ? 'selected' : ''} on:click={() => (current = 'baz')}>baz</button>
-
-<style>
-	button {
-		display: block;
-	}
-
-	.selected {
-		background-color: #ff3e00;
-		color: white;
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/01-classes/app-b/App.svelte b/documentation/tutorial/13-advanced-styling/01-classes/app-b/App.svelte
deleted file mode 100644
index 1dc18806b3..0000000000
--- a/documentation/tutorial/13-advanced-styling/01-classes/app-b/App.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<script>
-	let current = 'foo';
-</script>
-
-<button class:selected={current === 'foo'} on:click={() => (current = 'foo')}>foo</button>
-
-<button class:selected={current === 'bar'} on:click={() => (current = 'bar')}>bar</button>
-
-<button class:selected={current === 'baz'} on:click={() => (current = 'baz')}>baz</button>
-
-<style>
-	button {
-		display: block;
-	}
-
-	.selected {
-		background-color: #ff3e00;
-		color: white;
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/01-classes/text.md b/documentation/tutorial/13-advanced-styling/01-classes/text.md
deleted file mode 100644
index d60a157e60..0000000000
--- a/documentation/tutorial/13-advanced-styling/01-classes/text.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-title: The class directive
----
-
-Like any other attribute, you can specify classes with a JavaScript attribute, seen here:
-
-<!-- prettier-ignore -->
-```svelte
-<button
-	class={current === 'foo' ? 'selected' : ''}
-	on:click={() => current = 'foo'}
->foo</button>
-```
-
-This is such a common pattern in UI development that Svelte includes a special directive to simplify it:
-
-<!-- prettier-ignore -->
-```svelte
-<button
-	class:selected={current === 'foo'}
-	on:click={() => current = 'foo'}
->foo</button>
-```
-
-The `selected` class is added to the element whenever the value of the expression is truthy, and removed when it's falsy.
diff --git a/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-a/App.svelte b/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-a/App.svelte
deleted file mode 100644
index ad39916ce5..0000000000
--- a/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let big = false;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={big} />
-	big
-</label>
-
-<div class:big>
-	some {big ? 'big' : 'small'} text
-</div>
-
-<style>
-	.big {
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-b/App.svelte b/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-b/App.svelte
deleted file mode 100644
index ad39916ce5..0000000000
--- a/documentation/tutorial/13-advanced-styling/02-class-shorthand/app-b/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	let big = false;
-</script>
-
-<label>
-	<input type="checkbox" bind:checked={big} />
-	big
-</label>
-
-<div class:big>
-	some {big ? 'big' : 'small'} text
-</div>
-
-<style>
-	.big {
-		font-size: 4em;
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/02-class-shorthand/text.md b/documentation/tutorial/13-advanced-styling/02-class-shorthand/text.md
deleted file mode 100644
index 1a42c23d07..0000000000
--- a/documentation/tutorial/13-advanced-styling/02-class-shorthand/text.md
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Shorthand class directive
----
-
-Often, the name of the class will be the same as the name of the value it depends on:
-
-<!-- prettier-ignore -->
-```svelte
-<div class:big={big}>
-	<!-- ... -->
-</div>
-```
-
-In those cases we can use a shorthand form:
-
-```svelte
-<div class:big>
-	<!-- ... -->
-</div>
-```
diff --git a/documentation/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte b/documentation/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
deleted file mode 100644
index 7a806717ef..0000000000
--- a/documentation/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let bgOpacity = 0.5;
-	$: color = bgOpacity < 0.6 ? '#000' : '#fff';
-</script>
-
-<input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
-
-<p>This is a paragraph.</p>
-
-<style>
-	p {
-		font-family: 'Comic Sans MS', cursive;
-		background: rgba(255, 62, 0, var(--opacity));
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte b/documentation/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
deleted file mode 100644
index 758db1c567..0000000000
--- a/documentation/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let bgOpacity = 0.5;
-	$: color = bgOpacity < 0.6 ? '#000' : '#fff';
-</script>
-
-<input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
-
-<p style="color: {color}; --opacity: {bgOpacity};">This is a paragraph.</p>
-
-<style>
-	p {
-		font-family: 'Comic Sans MS', cursive;
-		background: rgba(255, 62, 0, var(--opacity));
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/03-inline-styles/text.md b/documentation/tutorial/13-advanced-styling/03-inline-styles/text.md
deleted file mode 100644
index f558958358..0000000000
--- a/documentation/tutorial/13-advanced-styling/03-inline-styles/text.md
+++ /dev/null
@@ -1,10 +0,0 @@
----
-title: Inline styles
----
-
-Apart from adding styles inside style tags, you can also add styles to individual elements using the style attribute. Usually you will want to do styling through CSS, but this can come in handy for dynamic styles, especially when combined with CSS custom properties.
-
-Add the following style attribute to the paragraph element:
-`style="color: {color}; --opacity: {bgOpacity};"`
-
-Great, now you can style the paragraph using variables that change based on your input without having to make a class for every possible value.
diff --git a/documentation/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte b/documentation/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
deleted file mode 100644
index 758db1c567..0000000000
--- a/documentation/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let bgOpacity = 0.5;
-	$: color = bgOpacity < 0.6 ? '#000' : '#fff';
-</script>
-
-<input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
-
-<p style="color: {color}; --opacity: {bgOpacity};">This is a paragraph.</p>
-
-<style>
-	p {
-		font-family: 'Comic Sans MS', cursive;
-		background: rgba(255, 62, 0, var(--opacity));
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte b/documentation/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte
deleted file mode 100644
index d75db22ad4..0000000000
--- a/documentation/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let bgOpacity = 0.5;
-	$: color = bgOpacity < 0.6 ? '#000' : '#fff';
-</script>
-
-<input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
-
-<p style:color style:--opacity={bgOpacity}>This is a paragraph.</p>
-
-<style>
-	p {
-		font-family: 'Comic Sans MS', cursive;
-		background: rgba(255, 62, 0, var(--opacity));
-	}
-</style>
diff --git a/documentation/tutorial/13-advanced-styling/04-style-directive/text.md b/documentation/tutorial/13-advanced-styling/04-style-directive/text.md
deleted file mode 100644
index fcee97e88a..0000000000
--- a/documentation/tutorial/13-advanced-styling/04-style-directive/text.md
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: The style directive
----
-
-Being able to set CSS properties dynamically is nice. However, this can get unwieldy if you have to write a long string. Mistakes like missing any of the semicolons could make the whole string invalid. Therefore, Svelte provides a nicer way to write inline styles with the style directive.
-
-Change the style attribute of the paragraph to the following:
-
-```svelte
-<p
-	style:color
-	style:--opacity="{bgOpacity}"
->
-```
-
-The style directive shares a few qualities with the class directive. You can use a shorthand when the name of the property and the variable are the same. So `style:color="{color}"` can be written as just `style:color`.
-
-Similar to the class directive, the style directive will take precedence if you try to set the same property through a style attribute.
diff --git a/documentation/tutorial/13-advanced-styling/meta.json b/documentation/tutorial/13-advanced-styling/meta.json
deleted file mode 100644
index 7fdc33bd29..0000000000
--- a/documentation/tutorial/13-advanced-styling/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Advanced styling"
-}
diff --git a/documentation/tutorial/14-composition/01-slots/app-a/App.svelte b/documentation/tutorial/14-composition/01-slots/app-a/App.svelte
deleted file mode 100644
index 7f7b5d4437..0000000000
--- a/documentation/tutorial/14-composition/01-slots/app-a/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<!-- put content here -->
-</Box>
diff --git a/documentation/tutorial/14-composition/01-slots/app-a/Box.svelte b/documentation/tutorial/14-composition/01-slots/app-a/Box.svelte
deleted file mode 100644
index 36e57ccd88..0000000000
--- a/documentation/tutorial/14-composition/01-slots/app-a/Box.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="box">
-	<!-- content should be injected here -->
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/01-slots/app-b/App.svelte b/documentation/tutorial/14-composition/01-slots/app-b/App.svelte
deleted file mode 100644
index 986bdc01c5..0000000000
--- a/documentation/tutorial/14-composition/01-slots/app-b/App.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
diff --git a/documentation/tutorial/14-composition/01-slots/app-b/Box.svelte b/documentation/tutorial/14-composition/01-slots/app-b/Box.svelte
deleted file mode 100644
index 2d0a378d25..0000000000
--- a/documentation/tutorial/14-composition/01-slots/app-b/Box.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="box">
-	<slot />
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/01-slots/text.md b/documentation/tutorial/14-composition/01-slots/text.md
deleted file mode 100644
index b75995e9c4..0000000000
--- a/documentation/tutorial/14-composition/01-slots/text.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Slots
----
-
-Just like elements can have children...
-
-```svelte
-<div>
-	<p>I'm a child of the div</p>
-</div>
-```
-
-...so can components. Before a component can accept children, though, it needs to know where to put them. We do this with the `<slot>` element. Put this inside `Box.svelte`:
-
-```svelte
-<div class="box">
-	<slot />
-</div>
-```
-
-You can now put things in the box:
-
-```svelte
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
-```
diff --git a/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/App.svelte b/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/App.svelte
deleted file mode 100644
index 986bdc01c5..0000000000
--- a/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/App.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
diff --git a/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/Box.svelte b/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/Box.svelte
deleted file mode 100644
index 2d0a378d25..0000000000
--- a/documentation/tutorial/14-composition/02-slot-fallbacks/app-a/Box.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<div class="box">
-	<slot />
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/App.svelte b/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/App.svelte
deleted file mode 100644
index 708428d4d8..0000000000
--- a/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
-
-<Box />
diff --git a/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/Box.svelte b/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/Box.svelte
deleted file mode 100644
index 8cb8128b31..0000000000
--- a/documentation/tutorial/14-composition/02-slot-fallbacks/app-b/Box.svelte
+++ /dev/null
@@ -1,16 +0,0 @@
-<div class="box">
-	<slot>
-		<em>no content was provided</em>
-	</slot>
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/02-slot-fallbacks/text.md b/documentation/tutorial/14-composition/02-slot-fallbacks/text.md
deleted file mode 100644
index da7ab1a9f4..0000000000
--- a/documentation/tutorial/14-composition/02-slot-fallbacks/text.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Slot fallbacks
----
-
-A component can specify _fallbacks_ for any slots that are left empty, by putting content inside the `<slot>` element:
-
-```svelte
-<div class="box">
-	<slot>
-		<em>no content was provided</em>
-	</slot>
-</div>
-```
-
-We can now create instances of `<Box>` without any children:
-
-```svelte
-<Box>
-	<h2>Hello!</h2>
-	<p>This is a box. It can contain anything.</p>
-</Box>
-
-<Box />
-```
diff --git a/documentation/tutorial/14-composition/03-named-slots/app-a/App.svelte b/documentation/tutorial/14-composition/03-named-slots/app-a/App.svelte
deleted file mode 100644
index f3143305ca..0000000000
--- a/documentation/tutorial/14-composition/03-named-slots/app-a/App.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-	import ContactCard from './ContactCard.svelte';
-</script>
-
-<ContactCard>
-	<!-- contact details go here -->
-</ContactCard>
diff --git a/documentation/tutorial/14-composition/03-named-slots/app-a/ContactCard.svelte b/documentation/tutorial/14-composition/03-named-slots/app-a/ContactCard.svelte
deleted file mode 100644
index a3174a9217..0000000000
--- a/documentation/tutorial/14-composition/03-named-slots/app-a/ContactCard.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<article class="contact-card">
-	<h2>
-		<slot>
-			<span class="missing">Unknown name</span>
-		</slot>
-	</h2>
-
-	<div class="address">
-		<slot>
-			<span class="missing">Unknown address</span>
-		</slot>
-	</div>
-
-	<div class="email">
-		<slot>
-			<span class="missing">Unknown email</span>
-		</slot>
-	</div>
-</article>
-
-<style>
-	.contact-card {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-	}
-
-	h2 {
-		padding: 0 0 0.2em 0;
-		margin: 0 0 1em 0;
-		border-bottom: 1px solid #ff3e00;
-	}
-
-	.address,
-	.email {
-		padding: 0 0 0 1.5em;
-		background: 0 50% no-repeat;
-		background-size: 1em 1em;
-		margin: 0 0 0.5em 0;
-		line-height: 1.2;
-	}
-
-	.address {
-		background-image: url(/tutorial/icons/map-marker.svg);
-	}
-	.email {
-		background-image: url(/tutorial/icons/email.svg);
-	}
-	.missing {
-		color: #999;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/03-named-slots/app-b/App.svelte b/documentation/tutorial/14-composition/03-named-slots/app-b/App.svelte
deleted file mode 100644
index ea27d75edf..0000000000
--- a/documentation/tutorial/14-composition/03-named-slots/app-b/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	import ContactCard from './ContactCard.svelte';
-</script>
-
-<ContactCard>
-	<span slot="name"> P. Sherman </span>
-
-	<span slot="address">
-		42 Wallaby Way<br />
-		Sydney
-	</span>
-</ContactCard>
diff --git a/documentation/tutorial/14-composition/03-named-slots/app-b/ContactCard.svelte b/documentation/tutorial/14-composition/03-named-slots/app-b/ContactCard.svelte
deleted file mode 100644
index d72da2ad4c..0000000000
--- a/documentation/tutorial/14-composition/03-named-slots/app-b/ContactCard.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<article class="contact-card">
-	<h2>
-		<slot name="name">
-			<span class="missing">Unknown name</span>
-		</slot>
-	</h2>
-
-	<div class="address">
-		<slot name="address">
-			<span class="missing">Unknown address</span>
-		</slot>
-	</div>
-
-	<div class="email">
-		<slot name="email">
-			<span class="missing">Unknown email</span>
-		</slot>
-	</div>
-</article>
-
-<style>
-	.contact-card {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-	}
-
-	h2 {
-		padding: 0 0 0.2em 0;
-		margin: 0 0 1em 0;
-		border-bottom: 1px solid #ff3e00;
-	}
-
-	.address,
-	.email {
-		padding: 0 0 0 1.5em;
-		background: 0 0 no-repeat;
-		background-size: 20px 20px;
-		margin: 0 0 0.5em 0;
-		line-height: 1.2;
-	}
-
-	.address {
-		background-image: url(/tutorial/icons/map-marker.svg);
-	}
-	.email {
-		background-image: url(/tutorial/icons/email.svg);
-	}
-	.missing {
-		color: #999;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/03-named-slots/text.md b/documentation/tutorial/14-composition/03-named-slots/text.md
deleted file mode 100644
index f2e34ad9a0..0000000000
--- a/documentation/tutorial/14-composition/03-named-slots/text.md
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: Named slots
----
-
-The previous example contained a _default slot_, which renders the direct children of a component. Sometimes you will need more control over placement, such as with this `<ContactCard>`. In those cases, we can use _named slots_.
-
-In `ContactCard.svelte`, add a `name` attribute to each slot:
-
-```svelte
-<article class="contact-card">
-	<h2>
-		<slot name="name">
-			<span class="missing">Unknown name</span>
-		</slot>
-	</h2>
-
-	<div class="address">
-		<slot name="address">
-			<span class="missing">Unknown address</span>
-		</slot>
-	</div>
-
-	<div class="email">
-		<slot name="email">
-			<span class="missing">Unknown email</span>
-		</slot>
-	</div>
-</article>
-```
-
-Then, add elements with corresponding `slot="..."` attributes inside the `<ContactCard>` component:
-
-```svelte
-<ContactCard>
-	<span slot="name"> P. Sherman </span>
-
-	<span slot="address">
-		42 Wallaby Way<br />
-		Sydney
-	</span>
-</ContactCard>
-```
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-a/App.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-a/App.svelte
deleted file mode 100755
index f120d03a30..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-a/App.svelte
+++ /dev/null
@@ -1,47 +0,0 @@
-<script>
-	import Project from './Project.svelte';
-	import Comment from './Comment.svelte';
-</script>
-
-<h1>Projects</h1>
-
-<ul>
-	<li>
-		<Project title="Add TypeScript support" tasksCompleted={25} totalTasks={57}>
-			<div slot="comments">
-				<Comment name="Ecma Script" postedAt={new Date('2020-08-17T14:12:23')}>
-					<p>Those interface tests are now passing.</p>
-				</Comment>
-			</div>
-		</Project>
-	</li>
-	<li>
-		<Project title="Update documentation" tasksCompleted={18} totalTasks={21} />
-	</li>
-</ul>
-
-<style>
-	h1 {
-		font-weight: 300;
-		margin: 0 1rem;
-	}
-
-	ul {
-		list-style: none;
-		padding: 0;
-		margin: 0.5rem;
-		display: flex;
-	}
-
-	@media (max-width: 600px) {
-		ul {
-			flex-direction: column;
-		}
-	}
-
-	li {
-		padding: 0.5rem;
-		flex: 1 1 50%;
-		min-width: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-a/Comment.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-a/Comment.svelte
deleted file mode 100755
index 153c734376..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-a/Comment.svelte
+++ /dev/null
@@ -1,59 +0,0 @@
-<script>
-	export let name;
-	export let postedAt;
-
-	$: avatar = `https://ui-avatars.com/api/?name=${name.replace(
-		/ /g,
-		'+'
-	)}&rounded=true&background=ff3e00&color=fff&bold=true`;
-</script>
-
-<article>
-	<div class="header">
-		<img src={avatar} alt="" height="32" width="32" />
-		<div class="details">
-			<h4>{name}</h4>
-			<time datetime={postedAt.toISOString()}>{postedAt.toLocaleDateString()}</time>
-		</div>
-	</div>
-	<div class="body">
-		<slot />
-	</div>
-</article>
-
-<style>
-	article {
-		background-color: #fff;
-		border: 1px #ccc solid;
-		border-radius: 4px;
-		padding: 1rem;
-	}
-
-	.header {
-		align-items: center;
-		display: flex;
-	}
-
-	.details {
-		flex: 1 1 auto;
-		margin-left: 0.5rem;
-	}
-
-	h4 {
-		margin: 0;
-	}
-
-	time {
-		color: #777;
-		font-size: 0.75rem;
-		text-decoration: underline;
-	}
-
-	.body {
-		margin-top: 0.5rem;
-	}
-
-	.body :global(p) {
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-a/Project.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-a/Project.svelte
deleted file mode 100755
index 6c5a6b7590..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-a/Project.svelte
+++ /dev/null
@@ -1,62 +0,0 @@
-<script>
-	export let title;
-	export let tasksCompleted = 0;
-	export let totalTasks = 0;
-</script>
-
-<article class:has-discussion={true}>
-	<div>
-		<h2>{title}</h2>
-		<p>{tasksCompleted}/{totalTasks} tasks completed</p>
-	</div>
-	<div class="discussion">
-		<h3>Comments</h3>
-		<slot name="comments" />
-	</div>
-</article>
-
-<style>
-	article {
-		border: 1px #ccc solid;
-		border-radius: 4px;
-		position: relative;
-	}
-
-	article > div {
-		padding: 1.25rem;
-	}
-
-	article.has-discussion::after {
-		content: '';
-		background-color: #ff3e00;
-		border-radius: 10px;
-		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-		height: 20px;
-		position: absolute;
-		right: -10px;
-		top: -10px;
-		width: 20px;
-	}
-
-	h2,
-	h3 {
-		margin: 0 0 0.5rem;
-	}
-
-	h3 {
-		font-size: 0.875rem;
-		font-weight: 500;
-		letter-spacing: 0.08em;
-		text-transform: uppercase;
-	}
-
-	p {
-		color: #777;
-		margin: 0;
-	}
-
-	.discussion {
-		background-color: #eee;
-		border-top: 1px #ccc solid;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-b/App.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-b/App.svelte
deleted file mode 100755
index f120d03a30..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-b/App.svelte
+++ /dev/null
@@ -1,47 +0,0 @@
-<script>
-	import Project from './Project.svelte';
-	import Comment from './Comment.svelte';
-</script>
-
-<h1>Projects</h1>
-
-<ul>
-	<li>
-		<Project title="Add TypeScript support" tasksCompleted={25} totalTasks={57}>
-			<div slot="comments">
-				<Comment name="Ecma Script" postedAt={new Date('2020-08-17T14:12:23')}>
-					<p>Those interface tests are now passing.</p>
-				</Comment>
-			</div>
-		</Project>
-	</li>
-	<li>
-		<Project title="Update documentation" tasksCompleted={18} totalTasks={21} />
-	</li>
-</ul>
-
-<style>
-	h1 {
-		font-weight: 300;
-		margin: 0 1rem;
-	}
-
-	ul {
-		list-style: none;
-		padding: 0;
-		margin: 0.5rem;
-		display: flex;
-	}
-
-	@media (max-width: 600px) {
-		ul {
-			flex-direction: column;
-		}
-	}
-
-	li {
-		padding: 0.5rem;
-		flex: 1 1 50%;
-		min-width: 200px;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-b/Comment.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-b/Comment.svelte
deleted file mode 100755
index 153c734376..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-b/Comment.svelte
+++ /dev/null
@@ -1,59 +0,0 @@
-<script>
-	export let name;
-	export let postedAt;
-
-	$: avatar = `https://ui-avatars.com/api/?name=${name.replace(
-		/ /g,
-		'+'
-	)}&rounded=true&background=ff3e00&color=fff&bold=true`;
-</script>
-
-<article>
-	<div class="header">
-		<img src={avatar} alt="" height="32" width="32" />
-		<div class="details">
-			<h4>{name}</h4>
-			<time datetime={postedAt.toISOString()}>{postedAt.toLocaleDateString()}</time>
-		</div>
-	</div>
-	<div class="body">
-		<slot />
-	</div>
-</article>
-
-<style>
-	article {
-		background-color: #fff;
-		border: 1px #ccc solid;
-		border-radius: 4px;
-		padding: 1rem;
-	}
-
-	.header {
-		align-items: center;
-		display: flex;
-	}
-
-	.details {
-		flex: 1 1 auto;
-		margin-left: 0.5rem;
-	}
-
-	h4 {
-		margin: 0;
-	}
-
-	time {
-		color: #777;
-		font-size: 0.75rem;
-		text-decoration: underline;
-	}
-
-	.body {
-		margin-top: 0.5rem;
-	}
-
-	.body :global(p) {
-		margin: 0;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/app-b/Project.svelte b/documentation/tutorial/14-composition/04-optional-slots/app-b/Project.svelte
deleted file mode 100755
index 41aa4111b9..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/app-b/Project.svelte
+++ /dev/null
@@ -1,64 +0,0 @@
-<script>
-	export let title;
-	export let tasksCompleted = 0;
-	export let totalTasks = 0;
-</script>
-
-<article class:has-discussion={$$slots.comments}>
-	<div>
-		<h2>{title}</h2>
-		<p>{tasksCompleted}/{totalTasks} tasks completed</p>
-	</div>
-	{#if $$slots.comments}
-		<div class="discussion">
-			<h3>Comments</h3>
-			<slot name="comments" />
-		</div>
-	{/if}
-</article>
-
-<style>
-	article {
-		border: 1px #ccc solid;
-		border-radius: 4px;
-		position: relative;
-	}
-
-	article > div {
-		padding: 1.25rem;
-	}
-
-	article.has-discussion::after {
-		content: '';
-		background-color: #ff3e00;
-		border-radius: 10px;
-		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-		height: 20px;
-		position: absolute;
-		right: -10px;
-		top: -10px;
-		width: 20px;
-	}
-
-	h2,
-	h3 {
-		margin: 0 0 0.5rem;
-	}
-
-	h3 {
-		font-size: 0.875rem;
-		font-weight: 500;
-		letter-spacing: 0.08em;
-		text-transform: uppercase;
-	}
-
-	p {
-		color: #777;
-		margin: 0;
-	}
-
-	.discussion {
-		background-color: #eee;
-		border-top: 1px #ccc solid;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/04-optional-slots/text.md b/documentation/tutorial/14-composition/04-optional-slots/text.md
deleted file mode 100644
index 9d74e3c268..0000000000
--- a/documentation/tutorial/14-composition/04-optional-slots/text.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Checking for slot content
----
-
-In some cases, you may want to control parts of your component based on whether the parent passes in content for a certain slot. Perhaps you have a wrapper around that slot, and you don't want to render it if the slot is empty. Or perhaps you'd like to apply a class only if the slot is present. You can do this by checking the properties of the special `$$slots` variable.
-
-`$$slots` is an object whose keys are the names of the slots passed in by the parent component. If the parent leaves a slot empty, then `$$slots` will not have an entry for that slot.
-
-Notice that both instances of `<Project>` in this example render a container for comments and a notification dot, even though only one has comments. We want to use `$$slots` to make sure we only render these elements when the parent `<App>` passes in content for the `comments` slot.
-
-In `Project.svelte`, update the `class:has-discussion` directive on the `<article>`:
-
-```svelte
-<article class:has-discussion={$$slots.comments}>
-```
-
-Next, wrap the `comments` slot and its wrapping `<div>` in an `if` block that checks `$$slots`:
-
-```svelte
-{#if $$slots.comments}
-	<div class="discussion">
-		<h3>Comments</h3>
-		<slot name="comments" />
-	</div>
-{/if}
-```
-
-Now the comments container and the notification dot won't render when `<App>` leaves the `comments` slot empty.
diff --git a/documentation/tutorial/14-composition/05-slot-props/app-a/App.svelte b/documentation/tutorial/14-composition/05-slot-props/app-a/App.svelte
deleted file mode 100644
index dcf0dacae5..0000000000
--- a/documentation/tutorial/14-composition/05-slot-props/app-a/App.svelte
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-	import Hoverable from './Hoverable.svelte';
-</script>
-
-<Hoverable>
-	<div class:active={hovering}>
-		{#if hovering}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<style>
-	div {
-		padding: 1em;
-		margin: 0 0 1em 0;
-		background-color: #eee;
-		color: black;
-	}
-
-	.active {
-		background-color: #ff3e00;
-		color: white;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/05-slot-props/app-a/Hoverable.svelte b/documentation/tutorial/14-composition/05-slot-props/app-a/Hoverable.svelte
deleted file mode 100644
index cee53ffc08..0000000000
--- a/documentation/tutorial/14-composition/05-slot-props/app-a/Hoverable.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let hovering;
-
-	function enter() {
-		hovering = true;
-	}
-
-	function leave() {
-		hovering = false;
-	}
-</script>
-
-<div on:mouseenter={enter} on:mouseleave={leave}>
-	<slot />
-</div>
diff --git a/documentation/tutorial/14-composition/05-slot-props/app-b/App.svelte b/documentation/tutorial/14-composition/05-slot-props/app-b/App.svelte
deleted file mode 100644
index 024de304dc..0000000000
--- a/documentation/tutorial/14-composition/05-slot-props/app-b/App.svelte
+++ /dev/null
@@ -1,47 +0,0 @@
-<script>
-	import Hoverable from './Hoverable.svelte';
-</script>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-
-<style>
-	div {
-		padding: 1em;
-		margin: 0 0 1em 0;
-		background-color: #eee;
-		color: black;
-	}
-
-	.active {
-		background-color: #ff3e00;
-		color: white;
-	}
-</style>
diff --git a/documentation/tutorial/14-composition/05-slot-props/app-b/Hoverable.svelte b/documentation/tutorial/14-composition/05-slot-props/app-b/Hoverable.svelte
deleted file mode 100644
index 773a8ecf6a..0000000000
--- a/documentation/tutorial/14-composition/05-slot-props/app-b/Hoverable.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	let hovering;
-
-	function enter() {
-		hovering = true;
-	}
-
-	function leave() {
-		hovering = false;
-	}
-</script>
-
-<div on:mouseenter={enter} on:mouseleave={leave}>
-	<slot {hovering} />
-</div>
diff --git a/documentation/tutorial/14-composition/05-slot-props/text.md b/documentation/tutorial/14-composition/05-slot-props/text.md
deleted file mode 100644
index f7f5617b36..0000000000
--- a/documentation/tutorial/14-composition/05-slot-props/text.md
+++ /dev/null
@@ -1,49 +0,0 @@
----
-title: Slot props
----
-
-In this app, we have a `<Hoverable>` component that tracks whether the mouse is currently over it. It needs to pass that data _back_ to the parent component, so that we can update the slotted contents.
-
-For this, we use _slot props_. In `Hoverable.svelte`, pass the `hovering` value into the slot:
-
-<!-- prettier-ignore -->
-```svelte
-<div on:mouseenter={enter} on:mouseleave={leave}>
-	<slot hovering={hovering} />
-</div>
-```
-
-> Remember you can also use the `{hovering}` shorthand, if you prefer.
-
-Then, to expose `hovering` to the contents of the `<Hoverable>` component, we use the `let` directive:
-
-<!-- prettier-ignore -->
-```svelte
-<Hoverable let:hovering={hovering}>
-	<div class:active={hovering}>
-		{#if hovering}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-```
-
-You can rename the variable, if you want — let's call it `active` in the parent component:
-
-```svelte
-<Hoverable let:hovering={active}>
-	<div class:active>
-		{#if active}
-			<p>I am being hovered upon.</p>
-		{:else}
-			<p>Hover over me!</p>
-		{/if}
-	</div>
-</Hoverable>
-```
-
-You can have as many of these components as you like, and the slotted props will remain local to the component where they're declared.
-
-> Named slots can also have props; use the `let` directive on an element with a `slot="..."` attribute, instead of on the component itself.
diff --git a/documentation/tutorial/14-composition/meta.json b/documentation/tutorial/14-composition/meta.json
deleted file mode 100644
index 1d81c05f29..0000000000
--- a/documentation/tutorial/14-composition/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Component composition"
-}
diff --git a/documentation/tutorial/15-context/01-context-api/app-a/App.svelte b/documentation/tutorial/15-context/01-context-api/app-a/App.svelte
deleted file mode 100644
index d564c9eee6..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-a/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import Map from './Map.svelte';
-	import MapMarker from './MapMarker.svelte';
-</script>
-
-<Map lat={35} lon={-84} zoom={3.5}>
-	<MapMarker lat={37.8225} lon={-122.0024} label="Svelte Body Shaping" />
-	<MapMarker lat={33.8981} lon={-118.4169} label="Svelte Barbershop & Essentials" />
-	<MapMarker lat={29.723} lon={-95.4189} label="Svelte Waxing Studio" />
-	<MapMarker lat={28.3378} lon={-81.3966} label="Svelte 30 Nutritional Consultants" />
-	<MapMarker lat={40.6483} lon={-74.0237} label="Svelte Brands LLC" />
-	<MapMarker lat={40.6986} lon={-74.41} label="Svelte Medical Systems" />
-</Map>
diff --git a/documentation/tutorial/15-context/01-context-api/app-a/Map.svelte b/documentation/tutorial/15-context/01-context-api/app-a/Map.svelte
deleted file mode 100644
index 495aae6a0d..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-a/Map.svelte
+++ /dev/null
@@ -1,44 +0,0 @@
-<script>
-	import { onDestroy } from 'svelte';
-	import { mapbox } from './mapbox.js';
-
-	// set the context here...
-
-	export let lat;
-	export let lon;
-	export let zoom;
-
-	let container;
-	let map;
-
-	function load() {
-		map = new mapbox.Map({
-			container,
-			style: 'mapbox://styles/mapbox/streets-v9',
-			center: [lon, lat],
-			zoom
-		});
-	}
-
-	onDestroy(() => {
-		if (map) map.remove();
-	});
-</script>
-
-<!-- this special element will be explained in a later section -->
-<svelte:head>
-	<link rel="stylesheet" href="https://unpkg.com/mapbox-gl/dist/mapbox-gl.css" on:load={load} />
-</svelte:head>
-
-<div bind:this={container}>
-	{#if map}
-		<slot />
-	{/if}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/15-context/01-context-api/app-a/MapMarker.svelte b/documentation/tutorial/15-context/01-context-api/app-a/MapMarker.svelte
deleted file mode 100644
index 94436445c7..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-a/MapMarker.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import { mapbox } from './mapbox.js';
-
-	// ...get the context here
-
-	export let lat;
-	export let lon;
-	export let label;
-
-	const popup = new mapbox.Popup({ offset: 25 }).setText(label);
-
-	const marker = new mapbox.Marker().setLngLat([lon, lat]).setPopup(popup).addTo(map);
-</script>
diff --git a/documentation/tutorial/15-context/01-context-api/app-a/mapbox.js b/documentation/tutorial/15-context/01-context-api/app-a/mapbox.js
deleted file mode 100644
index 16a7ffa417..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-a/mapbox.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import mapbox from 'mapbox-gl';
-
-// https://docs.mapbox.com/help/glossary/access-token/
-mapbox.accessToken = MAPBOX_ACCESS_TOKEN;
-
-const key = Symbol();
-
-export { mapbox, key };
diff --git a/documentation/tutorial/15-context/01-context-api/app-b/App.svelte b/documentation/tutorial/15-context/01-context-api/app-b/App.svelte
deleted file mode 100644
index d564c9eee6..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	import Map from './Map.svelte';
-	import MapMarker from './MapMarker.svelte';
-</script>
-
-<Map lat={35} lon={-84} zoom={3.5}>
-	<MapMarker lat={37.8225} lon={-122.0024} label="Svelte Body Shaping" />
-	<MapMarker lat={33.8981} lon={-118.4169} label="Svelte Barbershop & Essentials" />
-	<MapMarker lat={29.723} lon={-95.4189} label="Svelte Waxing Studio" />
-	<MapMarker lat={28.3378} lon={-81.3966} label="Svelte 30 Nutritional Consultants" />
-	<MapMarker lat={40.6483} lon={-74.0237} label="Svelte Brands LLC" />
-	<MapMarker lat={40.6986} lon={-74.41} label="Svelte Medical Systems" />
-</Map>
diff --git a/documentation/tutorial/15-context/01-context-api/app-b/Map.svelte b/documentation/tutorial/15-context/01-context-api/app-b/Map.svelte
deleted file mode 100644
index ddc3ebe7cc..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-b/Map.svelte
+++ /dev/null
@@ -1,46 +0,0 @@
-<script>
-	import { onDestroy, setContext } from 'svelte';
-	import { mapbox, key } from './mapbox.js';
-
-	setContext(key, {
-		getMap: () => map
-	});
-
-	export let lat;
-	export let lon;
-	export let zoom;
-
-	let container;
-	let map;
-
-	function load() {
-		map = new mapbox.Map({
-			container,
-			style: 'mapbox://styles/mapbox/streets-v9',
-			center: [lon, lat],
-			zoom
-		});
-	}
-
-	onDestroy(() => {
-		if (map) map.remove();
-	});
-</script>
-
-<!-- this special element will be explained in a later section -->
-<svelte:head>
-	<link rel="stylesheet" href="https://unpkg.com/mapbox-gl/dist/mapbox-gl.css" on:load={load} />
-</svelte:head>
-
-<div bind:this={container}>
-	{#if map}
-		<slot />
-	{/if}
-</div>
-
-<style>
-	div {
-		width: 100%;
-		height: 100%;
-	}
-</style>
diff --git a/documentation/tutorial/15-context/01-context-api/app-b/MapMarker.svelte b/documentation/tutorial/15-context/01-context-api/app-b/MapMarker.svelte
deleted file mode 100644
index 9c6df339cf..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-b/MapMarker.svelte
+++ /dev/null
@@ -1,15 +0,0 @@
-<script>
-	import { getContext } from 'svelte';
-	import { mapbox, key } from './mapbox.js';
-
-	const { getMap } = getContext(key);
-	const map = getMap();
-
-	export let lat;
-	export let lon;
-	export let label;
-
-	const popup = new mapbox.Popup({ offset: 25 }).setText(label);
-
-	const marker = new mapbox.Marker().setLngLat([lon, lat]).setPopup(popup).addTo(map);
-</script>
diff --git a/documentation/tutorial/15-context/01-context-api/app-b/mapbox.js b/documentation/tutorial/15-context/01-context-api/app-b/mapbox.js
deleted file mode 100644
index 16a7ffa417..0000000000
--- a/documentation/tutorial/15-context/01-context-api/app-b/mapbox.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import mapbox from 'mapbox-gl';
-
-// https://docs.mapbox.com/help/glossary/access-token/
-mapbox.accessToken = MAPBOX_ACCESS_TOKEN;
-
-const key = Symbol();
-
-export { mapbox, key };
diff --git a/documentation/tutorial/15-context/01-context-api/text.md b/documentation/tutorial/15-context/01-context-api/text.md
deleted file mode 100644
index 86782bfc5f..0000000000
--- a/documentation/tutorial/15-context/01-context-api/text.md
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: setContext and getContext
----
-
-The context API provides a mechanism for components to 'talk' to each other without passing around data and functions as props, or dispatching lots of events. It's an advanced feature, but a useful one.
-
-Take this example app using a [Mapbox GL](https://docs.mapbox.com/mapbox-gl-js/overview/) map. We'd like to display the markers, using the `<MapMarker>` component, but we don't want to have to pass around a reference to the underlying Mapbox instance as a prop on each component.
-
-There are two halves to the context API — `setContext` and `getContext`. If a component calls `setContext(key, context)`, then any _child_ component can retrieve the context with `const context = getContext(key)`.
-
-Let's set the context first. In `Map.svelte`, import `setContext` from `svelte` and `key` from `mapbox.js` and call `setContext`:
-
-```js
-import { onDestroy, setContext } from 'svelte';
-import { mapbox, key } from './mapbox.js';
-
-setContext(key, {
-	getMap: () => map
-});
-```
-
-The context object can be anything you like. Like [lifecycle functions](/tutorial/onmount), `setContext` and `getContext` must be called during component initialisation. Calling it afterwards - for example inside `onMount` - will throw an error. In this example, since `map` isn't created until the component has mounted, our context object contains a `getMap` function rather than `map` itself.
-
-On the other side of the equation, in `MapMarker.svelte`, we can now get a reference to the Mapbox instance:
-
-```js
-import { getContext } from 'svelte';
-import { mapbox, key } from './mapbox.js';
-
-const { getMap } = getContext(key);
-const map = getMap();
-```
-
-The markers can now add themselves to the map.
-
-> A more finished version of `<MapMarker>` would also handle removal and prop changes, but we're only demonstrating context here.
-
-## Context keys
-
-In `mapbox.js` you'll see this line:
-
-```js
-const key = Symbol();
-```
-
-Technically, we can use any value as a key — we could do `setContext('mapbox', ...)` for example. The downside of using a string is that different component libraries might accidentally use the same one; using [symbols](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol), on the other hand, means that the keys are guaranteed not to conflict in any circumstance, even when you have multiple different contexts operating across many component layers, since a symbol is essentially a unique identifier.
-
-## Contexts vs. stores
-
-Contexts and stores seem similar. They differ in that stores are available to _any_ part of an app, while a context is only available to _a component and its descendants_. This can be helpful if you want to use several instances of a component without the state of one interfering with the state of the others.
-
-In fact, you might use the two together. Since context is not reactive, values that change over time should be represented as stores:
-
-```js
-const { these, are, stores } = getContext(...);
-```
diff --git a/documentation/tutorial/15-context/meta.json b/documentation/tutorial/15-context/meta.json
deleted file mode 100644
index bb3c2c607d..0000000000
--- a/documentation/tutorial/15-context/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Context API"
-}
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/App.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-a/App.svelte
deleted file mode 100644
index 38dc3a3b5e..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/App.svelte
+++ /dev/null
@@ -1,29 +0,0 @@
-<script>
-	import Folder from './Folder.svelte';
-
-	let root = [
-		{
-			name: 'Important work stuff',
-			files: [{ name: 'quarterly-results.xlsx' }]
-		},
-		{
-			name: 'Animal GIFs',
-			files: [
-				{
-					name: 'Dogs',
-					files: [{ name: 'treadmill.gif' }, { name: 'rope-jumping.gif' }]
-				},
-				{
-					name: 'Goats',
-					files: [{ name: 'parkour.gif' }, { name: 'rampage.gif' }]
-				},
-				{ name: 'cat-roomba.gif' },
-				{ name: 'duck-shuffle.gif' },
-				{ name: 'monkey-on-a-pig.gif' }
-			]
-		},
-		{ name: 'TODO.md' }
-	];
-</script>
-
-<Folder name="Home" files={root} expanded />
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/File.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-a/File.svelte
deleted file mode 100644
index e769ab4841..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/File.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	export let name;
-	$: type = name.slice(name.lastIndexOf('.') + 1);
-</script>
-
-<span style="background-image: url(/tutorial/icons/{type}.svg)">{name}</span>
-
-<style>
-	span {
-		padding: 0 0 0 1.5em;
-		background: 0 0.1em no-repeat;
-		background-size: 1em 1em;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/Folder.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-a/Folder.svelte
deleted file mode 100644
index cf49668e99..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-a/Folder.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<script>
-	import File from './File.svelte';
-
-	export let expanded = false;
-	export let name;
-	export let files;
-
-	function toggle() {
-		expanded = !expanded;
-	}
-</script>
-
-<button class:expanded on:click={toggle}>{name}</button>
-
-{#if expanded}
-	<ul>
-		{#each files as file}
-			<li>
-				{#if file.files}
-					<!-- show folder -->
-				{:else}
-					<File {...file} />
-				{/if}
-			</li>
-		{/each}
-	</ul>
-{/if}
-
-<style>
-	button {
-		padding: 0 0 0 1.5em;
-		background: url(/tutorial/icons/folder.svg) 0 0.1em no-repeat;
-		background-size: 1em 1em;
-		font-weight: bold;
-		cursor: pointer;
-		border: none;
-		margin: 0;
-	}
-
-	.expanded {
-		background-image: url(/tutorial/icons/folder-open.svg);
-	}
-
-	ul {
-		padding: 0.2em 0 0 0.5em;
-		margin: 0 0 0 0.5em;
-		list-style: none;
-		border-left: 1px solid #eee;
-	}
-
-	li {
-		padding: 0.2em 0;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/App.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-b/App.svelte
deleted file mode 100644
index 38dc3a3b5e..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/App.svelte
+++ /dev/null
@@ -1,29 +0,0 @@
-<script>
-	import Folder from './Folder.svelte';
-
-	let root = [
-		{
-			name: 'Important work stuff',
-			files: [{ name: 'quarterly-results.xlsx' }]
-		},
-		{
-			name: 'Animal GIFs',
-			files: [
-				{
-					name: 'Dogs',
-					files: [{ name: 'treadmill.gif' }, { name: 'rope-jumping.gif' }]
-				},
-				{
-					name: 'Goats',
-					files: [{ name: 'parkour.gif' }, { name: 'rampage.gif' }]
-				},
-				{ name: 'cat-roomba.gif' },
-				{ name: 'duck-shuffle.gif' },
-				{ name: 'monkey-on-a-pig.gif' }
-			]
-		},
-		{ name: 'TODO.md' }
-	];
-</script>
-
-<Folder name="Home" files={root} expanded />
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/File.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-b/File.svelte
deleted file mode 100644
index e769ab4841..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/File.svelte
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-	export let name;
-	$: type = name.slice(name.lastIndexOf('.') + 1);
-</script>
-
-<span style="background-image: url(/tutorial/icons/{type}.svg)">{name}</span>
-
-<style>
-	span {
-		padding: 0 0 0 1.5em;
-		background: 0 0.1em no-repeat;
-		background-size: 1em 1em;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/Folder.svelte b/documentation/tutorial/16-special-elements/01-svelte-self/app-b/Folder.svelte
deleted file mode 100644
index dcf80e3645..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/app-b/Folder.svelte
+++ /dev/null
@@ -1,54 +0,0 @@
-<script>
-	import File from './File.svelte';
-
-	export let expanded = false;
-	export let name;
-	export let files;
-
-	function toggle() {
-		expanded = !expanded;
-	}
-</script>
-
-<button class:expanded on:click={toggle}>{name}</button>
-
-{#if expanded}
-	<ul>
-		{#each files as file}
-			<li>
-				{#if file.files}
-					<svelte:self {...file} />
-				{:else}
-					<File {...file} />
-				{/if}
-			</li>
-		{/each}
-	</ul>
-{/if}
-
-<style>
-	button {
-		padding: 0 0 0 1.5em;
-		background: url(/tutorial/icons/folder.svg) 0 0.1em no-repeat;
-		background-size: 1em 1em;
-		font-weight: bold;
-		cursor: pointer;
-		border: none;
-		margin: 0;
-	}
-
-	.expanded {
-		background-image: url(/tutorial/icons/folder-open.svg);
-	}
-
-	ul {
-		padding: 0.2em 0 0 0.5em;
-		margin: 0 0 0 0.5em;
-		list-style: none;
-		border-left: 1px solid #eee;
-	}
-
-	li {
-		padding: 0.2em 0;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/01-svelte-self/text.md b/documentation/tutorial/16-special-elements/01-svelte-self/text.md
deleted file mode 100644
index 04d7913e4b..0000000000
--- a/documentation/tutorial/16-special-elements/01-svelte-self/text.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-title: <svelte:self>
----
-
-Svelte provides a variety of built-in elements. The first, `<svelte:self>`, allows a component to contain itself recursively.
-
-It's useful for things like this folder tree view, where folders can contain _other_ folders. In `Folder.svelte` we want to be able to do this...
-
-```svelte
-{#if file.files}
-	<Folder {...file} />
-{:else}
-	<File {...file} />
-{/if}
-```
-
-...but that's impossible, because a module can't import itself. Instead, we use `<svelte:self>`:
-
-```svelte
-{#if file.files}
-	<svelte:self {...file} />
-{:else}
-	<File {...file} />
-{/if}
-```
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/App.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-a/App.svelte
deleted file mode 100644
index 79aad72bdf..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/App.svelte
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-	import RedThing from './RedThing.svelte';
-	import GreenThing from './GreenThing.svelte';
-	import BlueThing from './BlueThing.svelte';
-
-	const options = [
-		{ color: 'red', component: RedThing },
-		{ color: 'green', component: GreenThing },
-		{ color: 'blue', component: BlueThing }
-	];
-
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option.color}</option>
-	{/each}
-</select>
-
-{#if selected.color === 'red'}
-	<RedThing />
-{:else if selected.color === 'green'}
-	<GreenThing />
-{:else if selected.color === 'blue'}
-	<BlueThing />
-{/if}
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/BlueThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-a/BlueThing.svelte
deleted file mode 100644
index 551f1afbbe..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/BlueThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Blue thing</strong>
-
-<style>
-	strong {
-		color: blue;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/GreenThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-a/GreenThing.svelte
deleted file mode 100644
index a224720e6c..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/GreenThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Green thing</strong>
-
-<style>
-	strong {
-		color: green;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/RedThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-a/RedThing.svelte
deleted file mode 100644
index 9774363c1b..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-a/RedThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Red thing</strong>
-
-<style>
-	strong {
-		color: red;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/App.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-b/App.svelte
deleted file mode 100644
index 69e51253fc..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/App.svelte
+++ /dev/null
@@ -1,21 +0,0 @@
-<script>
-	import RedThing from './RedThing.svelte';
-	import GreenThing from './GreenThing.svelte';
-	import BlueThing from './BlueThing.svelte';
-
-	const options = [
-		{ color: 'red', component: RedThing },
-		{ color: 'green', component: GreenThing },
-		{ color: 'blue', component: BlueThing }
-	];
-
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option.color}</option>
-	{/each}
-</select>
-
-<svelte:component this={selected.component} />
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/BlueThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-b/BlueThing.svelte
deleted file mode 100644
index 551f1afbbe..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/BlueThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Blue thing</strong>
-
-<style>
-	strong {
-		color: blue;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/GreenThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-b/GreenThing.svelte
deleted file mode 100644
index a224720e6c..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/GreenThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Green thing</strong>
-
-<style>
-	strong {
-		color: green;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/RedThing.svelte b/documentation/tutorial/16-special-elements/02-svelte-component/app-b/RedThing.svelte
deleted file mode 100644
index 9774363c1b..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/app-b/RedThing.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<strong>Red thing</strong>
-
-<style>
-	strong {
-		color: red;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/02-svelte-component/text.md b/documentation/tutorial/16-special-elements/02-svelte-component/text.md
deleted file mode 100644
index 5582d29d17..0000000000
--- a/documentation/tutorial/16-special-elements/02-svelte-component/text.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: <svelte:component>
----
-
-A component can change its category altogether with `<svelte:component>`. Instead of a sequence of `if` blocks...
-
-```svelte
-{#if selected.color === 'red'}
-	<RedThing />
-{:else if selected.color === 'green'}
-	<GreenThing />
-{:else if selected.color === 'blue'}
-	<BlueThing />
-{/if}
-```
-
-...we can have a single dynamic component:
-
-```svelte
-<svelte:component this={selected.component} />
-```
-
-The `this` value can be any component constructor, or a falsy value — if it's falsy, no component is rendered.
diff --git a/documentation/tutorial/16-special-elements/03-svelte-element/app-a/App.svelte b/documentation/tutorial/16-special-elements/03-svelte-element/app-a/App.svelte
deleted file mode 100644
index 0718efd949..0000000000
--- a/documentation/tutorial/16-special-elements/03-svelte-element/app-a/App.svelte
+++ /dev/null
@@ -1,18 +0,0 @@
-<script>
-	const options = ['h1', 'h3', 'p'];
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option}</option>
-	{/each}
-</select>
-
-{#if selected === 'h1'}
-	<h1>I'm a h1 tag</h1>
-{:else if selected === 'h3'}
-	<h3>I'm a h3 tag</h3>
-{:else if selected === 'p'}
-	<p>I'm a p tag</p>
-{/if}
diff --git a/documentation/tutorial/16-special-elements/03-svelte-element/app-b/App.svelte b/documentation/tutorial/16-special-elements/03-svelte-element/app-b/App.svelte
deleted file mode 100644
index 068f7b3c4f..0000000000
--- a/documentation/tutorial/16-special-elements/03-svelte-element/app-b/App.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-<script>
-	const options = ['h1', 'h3', 'p'];
-	let selected = options[0];
-</script>
-
-<select bind:value={selected}>
-	{#each options as option}
-		<option value={option}>{option}</option>
-	{/each}
-</select>
-
-<svelte:element this={selected}>I'm a {selected} tag</svelte:element>
diff --git a/documentation/tutorial/16-special-elements/03-svelte-element/text.md b/documentation/tutorial/16-special-elements/03-svelte-element/text.md
deleted file mode 100644
index 8965d5549e..0000000000
--- a/documentation/tutorial/16-special-elements/03-svelte-element/text.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: <svelte:element>
----
-
-Sometimes we don't know in advance what kind of DOM element to render. `<svelte:element>` comes in handy here. Instead of a sequence of `if` blocks...
-
-```svelte
-{#if selected === 'h1'}
-	<h1>I'm a h1 tag</h1>
-{:else if selected === 'h3'}
-	<h3>I'm a h3 tag</h3>
-{:else if selected === 'p'}
-	<p>I'm a p tag</p>
-{/if}
-```
-
-...we can have a single dynamic component:
-
-```svelte
-<svelte:element this={selected}>I'm a {selected} tag</svelte:element>
-```
-
-The `this` value can be any string, or a falsy value — if it's falsy, no element is rendered.
diff --git a/documentation/tutorial/16-special-elements/04-svelte-window/app-a/App.svelte b/documentation/tutorial/16-special-elements/04-svelte-window/app-a/App.svelte
deleted file mode 100644
index d42d315b80..0000000000
--- a/documentation/tutorial/16-special-elements/04-svelte-window/app-a/App.svelte
+++ /dev/null
@@ -1,42 +0,0 @@
-<script>
-	let key;
-	let code;
-
-	function handleKeydown(event) {
-		key = event.key;
-		code = event.code;
-	}
-</script>
-
-<svelte:window />
-
-<div style="text-align: center">
-	{#if key}
-		<kbd>{key === ' ' ? 'Space' : key}</kbd>
-		<p>{code}</p>
-	{:else}
-		<p>Focus this window and press any key</p>
-	{/if}
-</div>
-
-<style>
-	div {
-		display: flex;
-		height: 100%;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-	}
-
-	kbd {
-		background-color: #eee;
-		border-radius: 4px;
-		font-size: 6em;
-		padding: 0.2em 0.5em;
-		border-top: 5px solid rgba(255, 255, 255, 0.5);
-		border-left: 5px solid rgba(255, 255, 255, 0.5);
-		border-right: 5px solid rgba(0, 0, 0, 0.2);
-		border-bottom: 5px solid rgba(0, 0, 0, 0.2);
-		color: #555;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/04-svelte-window/app-b/App.svelte b/documentation/tutorial/16-special-elements/04-svelte-window/app-b/App.svelte
deleted file mode 100644
index 2a90bbef8b..0000000000
--- a/documentation/tutorial/16-special-elements/04-svelte-window/app-b/App.svelte
+++ /dev/null
@@ -1,42 +0,0 @@
-<script>
-	let key;
-	let code;
-
-	function handleKeydown(event) {
-		key = event.key;
-		code = event.code;
-	}
-</script>
-
-<svelte:window on:keydown={handleKeydown} />
-
-<div style="text-align: center">
-	{#if key}
-		<kbd>{key === ' ' ? 'Space' : key}</kbd>
-		<p>{code}</p>
-	{:else}
-		<p>Focus this window and press any key</p>
-	{/if}
-</div>
-
-<style>
-	div {
-		display: flex;
-		height: 100%;
-		align-items: center;
-		justify-content: center;
-		flex-direction: column;
-	}
-
-	kbd {
-		background-color: #eee;
-		border-radius: 4px;
-		font-size: 6em;
-		padding: 0.2em 0.5em;
-		border-top: 5px solid rgba(255, 255, 255, 0.5);
-		border-left: 5px solid rgba(255, 255, 255, 0.5);
-		border-right: 5px solid rgba(0, 0, 0, 0.2);
-		border-bottom: 5px solid rgba(0, 0, 0, 0.2);
-		color: #555;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/04-svelte-window/text.md b/documentation/tutorial/16-special-elements/04-svelte-window/text.md
deleted file mode 100644
index 4c6c777c71..0000000000
--- a/documentation/tutorial/16-special-elements/04-svelte-window/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: <svelte:window>
----
-
-Just as you can add event listeners to any DOM element, you can add event listeners to the `window` object with `<svelte:window>`.
-
-On line 11, add the `keydown` listener:
-
-```svelte
-<svelte:window on:keydown={handleKeydown} />
-```
-
-> As with DOM elements, you can add [event modifiers](/tutorial/event-modifiers) like `preventDefault`.
diff --git a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-a/App.svelte b/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-a/App.svelte
deleted file mode 100644
index 97e557a0b5..0000000000
--- a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-a/App.svelte
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
-	const layers = [0, 1, 2, 3, 4, 5, 6, 7, 8];
-
-	let y;
-</script>
-
-<svelte:window />
-
-<a class="parallax-container" href="https://www.firewatchgame.com">
-	{#each layers as layer}
-		<img
-			style="transform: translate(0,{(-y * layer) / (layers.length - 1)}px)"
-			src="https://www.firewatchgame.com/images/parallax/parallax{layer}.png"
-			alt="parallax layer {layer}"
-		/>
-	{/each}
-</a>
-
-<div class="text">
-	<span style="opacity: {1 - Math.max(0, y / 40)}"> scroll down </span>
-
-	<div class="foreground">
-		You have scrolled {y} pixels
-	</div>
-</div>
-
-<style>
-	.parallax-container {
-		position: fixed;
-		width: 2400px;
-		height: 712px;
-		left: 50%;
-		transform: translate(-50%, 0);
-	}
-
-	.parallax-container img {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		will-change: transform;
-	}
-
-	.parallax-container img:last-child::after {
-		content: '';
-		position: absolute;
-		width: 100%;
-		height: 100%;
-		background: rgb(45, 10, 13);
-	}
-
-	.text {
-		position: relative;
-		width: 100%;
-		height: 300vh;
-		color: rgb(220, 113, 43);
-		text-align: center;
-		padding: 4em 0.5em 0.5em 0.5em;
-		box-sizing: border-box;
-		pointer-events: none;
-	}
-
-	span {
-		display: block;
-		font-size: 1em;
-		text-transform: uppercase;
-		will-change: transform, opacity;
-	}
-
-	.foreground {
-		position: absolute;
-		top: 711px;
-		left: 0;
-		width: 100%;
-		height: calc(100% - 712px);
-		background-color: rgb(32, 0, 1);
-		color: white;
-		padding: 50vh 0 0 0;
-	}
-
-	:global(body) {
-		margin: 0;
-		padding: 0;
-		background-color: rgb(253, 174, 51);
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-b/App.svelte b/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-b/App.svelte
deleted file mode 100644
index 7e85600abe..0000000000
--- a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/app-b/App.svelte
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
-	const layers = [0, 1, 2, 3, 4, 5, 6, 7, 8];
-
-	let y;
-</script>
-
-<svelte:window bind:scrollY={y} />
-
-<a class="parallax-container" href="https://www.firewatchgame.com">
-	{#each layers as layer}
-		<img
-			style="transform: translate(0,{(-y * layer) / (layers.length - 1)}px)"
-			src="https://www.firewatchgame.com/images/parallax/parallax{layer}.png"
-			alt="parallax layer {layer}"
-		/>
-	{/each}
-</a>
-
-<div class="text">
-	<span style="opacity: {1 - Math.max(0, y / 40)}"> scroll down </span>
-
-	<div class="foreground">
-		You have scrolled {y} pixels
-	</div>
-</div>
-
-<style>
-	.parallax-container {
-		position: fixed;
-		width: 2400px;
-		height: 712px;
-		left: 50%;
-		transform: translate(-50%, 0);
-	}
-
-	.parallax-container img {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		will-change: transform;
-	}
-
-	.parallax-container img:last-child::after {
-		content: '';
-		position: absolute;
-		width: 100%;
-		height: 100%;
-		background: rgb(45, 10, 13);
-	}
-
-	.text {
-		position: relative;
-		width: 100%;
-		height: 300vh;
-		color: rgb(220, 113, 43);
-		text-align: center;
-		padding: 4em 0.5em 0.5em 0.5em;
-		box-sizing: border-box;
-		pointer-events: none;
-	}
-
-	span {
-		display: block;
-		font-size: 1em;
-		text-transform: uppercase;
-		will-change: transform, opacity;
-	}
-
-	.foreground {
-		position: absolute;
-		top: 711px;
-		left: 0;
-		width: 100%;
-		height: calc(100% - 712px);
-		background-color: rgb(32, 0, 1);
-		color: white;
-		padding: 50vh 0 0 0;
-	}
-
-	:global(body) {
-		margin: 0;
-		padding: 0;
-		background-color: rgb(253, 174, 51);
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/text.md b/documentation/tutorial/16-special-elements/05-svelte-window-bindings/text.md
deleted file mode 100644
index 6885c2974e..0000000000
--- a/documentation/tutorial/16-special-elements/05-svelte-window-bindings/text.md
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: <svelte:window> bindings
----
-
-We can also bind to certain properties of `window`, such as `scrollY`. Update line 7:
-
-```svelte
-<svelte:window bind:scrollY={y} />
-```
-
-The list of properties you can bind to is as follows:
-
-- `innerWidth`
-- `innerHeight`
-- `outerWidth`
-- `outerHeight`
-- `scrollX`
-- `scrollY`
-- `online` — an alias for `window.navigator.onLine`
-
-All except `scrollX` and `scrollY` are readonly.
diff --git a/documentation/tutorial/16-special-elements/06-svelte-document/app-a/App.svelte b/documentation/tutorial/16-special-elements/06-svelte-document/app-a/App.svelte
deleted file mode 100644
index 7b9cc7bcb7..0000000000
--- a/documentation/tutorial/16-special-elements/06-svelte-document/app-a/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	let selection = '';
-
-	const handleSelectionChange = (e) => (selection = document.getSelection());
-</script>
-
-<svelte:document />
-
-<p>Select this text to fire events</p>
-<p>Selection: {selection}</p>
diff --git a/documentation/tutorial/16-special-elements/06-svelte-document/app-b/App.svelte b/documentation/tutorial/16-special-elements/06-svelte-document/app-b/App.svelte
deleted file mode 100644
index e11a9005db..0000000000
--- a/documentation/tutorial/16-special-elements/06-svelte-document/app-b/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	let selection = '';
-
-	const handleSelectionChange = (e) => (selection = document.getSelection());
-</script>
-
-<svelte:document on:selectionchange={handleSelectionChange} />
-
-<p>Select this text to fire events</p>
-<p>Selection: {selection}</p>
diff --git a/documentation/tutorial/16-special-elements/06-svelte-document/text.md b/documentation/tutorial/16-special-elements/06-svelte-document/text.md
deleted file mode 100644
index 0f0a7e4ff1..0000000000
--- a/documentation/tutorial/16-special-elements/06-svelte-document/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: <svelte:document>
----
-
-Similar to `<svelte:window>`, the `<svelte:document>` element allows you to listen for events that fire on `document`. This is useful with events like `selectionchange`, which doesn't fire on `window`.
-
-Add the `selectionchange` handler to the `<svelte:document>` tag:
-
-```svelte
-<svelte:document on:selectionchange={handleSelectionChange} />
-```
-
-> Avoid `mouseenter` and `mouseleave` handlers on this element, these events are not fired on `document` in all browsers. Use `<svelte:body>` for this instead.
diff --git a/documentation/tutorial/16-special-elements/07-svelte-body/app-a/App.svelte b/documentation/tutorial/16-special-elements/07-svelte-body/app-a/App.svelte
deleted file mode 100644
index 43d6c6b7eb..0000000000
--- a/documentation/tutorial/16-special-elements/07-svelte-body/app-a/App.svelte
+++ /dev/null
@@ -1,34 +0,0 @@
-<script>
-	let hereKitty = false;
-
-	const handleMouseenter = () => (hereKitty = true);
-	const handleMouseleave = () => (hereKitty = false);
-</script>
-
-<svelte:body />
-
-<!-- creative commons BY-NC http://www.pngall.com/kitten-png/download/7247 -->
-<img
-	class:curious={hereKitty}
-	alt="Kitten wants to know what's going on"
-	src="/tutorial/kitten.png"
-/>
-
-<style>
-	img {
-		position: absolute;
-		left: 0;
-		bottom: -60px;
-		transform: translate(-80%, 0) rotate(-30deg);
-		transform-origin: 100% 100%;
-		transition: transform 0.4s;
-	}
-
-	.curious {
-		transform: translate(-15%, 0) rotate(0deg);
-	}
-
-	:global(body) {
-		overflow: hidden;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/07-svelte-body/app-b/App.svelte b/documentation/tutorial/16-special-elements/07-svelte-body/app-b/App.svelte
deleted file mode 100644
index 71edebea48..0000000000
--- a/documentation/tutorial/16-special-elements/07-svelte-body/app-b/App.svelte
+++ /dev/null
@@ -1,34 +0,0 @@
-<script>
-	let hereKitty = false;
-
-	const handleMouseenter = () => (hereKitty = true);
-	const handleMouseleave = () => (hereKitty = false);
-</script>
-
-<svelte:body on:mouseenter={handleMouseenter} on:mouseleave={handleMouseleave} />
-
-<!-- creative commons BY-NC http://www.pngall.com/kitten-png/download/7247 -->
-<img
-	class:curious={hereKitty}
-	alt="Kitten wants to know what's going on"
-	src="/tutorial/kitten.png"
-/>
-
-<style>
-	img {
-		position: absolute;
-		left: 0;
-		bottom: -60px;
-		transform: translate(-80%, 0) rotate(-30deg);
-		transform-origin: 100% 100%;
-		transition: transform 0.4s;
-	}
-
-	.curious {
-		transform: translate(-15%, 0) rotate(0deg);
-	}
-
-	:global(body) {
-		overflow: hidden;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/07-svelte-body/text.md b/documentation/tutorial/16-special-elements/07-svelte-body/text.md
deleted file mode 100644
index 15a57d7d51..0000000000
--- a/documentation/tutorial/16-special-elements/07-svelte-body/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: <svelte:body>
----
-
-Similar to `<svelte:window>` and `<svelte:document>`, the `<svelte:body>` element allows you to listen for events that fire on `document.body`. This is useful with the `mouseenter` and `mouseleave` events, which don't fire on `window`.
-
-Add the `mouseenter` and `mouseleave` handlers to the `<svelte:body>` tag:
-
-<!-- prettier-ignore -->
-```svelte
-<svelte:body
-	on:mouseenter={handleMouseenter}
-	on:mouseleave={handleMouseleave}
-/>
-```
diff --git a/documentation/tutorial/16-special-elements/08-svelte-head/app-a/App.svelte b/documentation/tutorial/16-special-elements/08-svelte-head/app-a/App.svelte
deleted file mode 100644
index 73477dbe9d..0000000000
--- a/documentation/tutorial/16-special-elements/08-svelte-head/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<svelte:head>
-	<!-- elements go here -->
-</svelte:head>
-
-<h1>Hello world!</h1>
diff --git a/documentation/tutorial/16-special-elements/08-svelte-head/app-b/App.svelte b/documentation/tutorial/16-special-elements/08-svelte-head/app-b/App.svelte
deleted file mode 100644
index 5e6bb2d945..0000000000
--- a/documentation/tutorial/16-special-elements/08-svelte-head/app-b/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<svelte:head>
-	<link rel="stylesheet" href="/tutorial/dark-theme.css" />
-</svelte:head>
-
-<h1>Hello world!</h1>
diff --git a/documentation/tutorial/16-special-elements/08-svelte-head/text.md b/documentation/tutorial/16-special-elements/08-svelte-head/text.md
deleted file mode 100644
index 91fd4740f5..0000000000
--- a/documentation/tutorial/16-special-elements/08-svelte-head/text.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: <svelte:head>
----
-
-The `<svelte:head>` element allows you to insert elements inside the `<head>` of your document:
-
-```svelte
-<svelte:head>
-	<link rel="stylesheet" href="/tutorial/dark-theme.css" />
-</svelte:head>
-```
-
-> In server-side rendering (SSR) mode, contents of `<svelte:head>` are returned separately from the rest of your HTML.
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/App.svelte b/documentation/tutorial/16-special-elements/09-svelte-options/app-a/App.svelte
deleted file mode 100644
index 96eb7b3977..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/App.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script>
-	import Todo from './Todo.svelte';
-
-	let todos = [
-		{ id: 1, done: true, text: 'wash the car' },
-		{ id: 2, done: false, text: 'take the dog for a walk' },
-		{ id: 3, done: false, text: 'mow the lawn' }
-	];
-
-	function toggle(toggled) {
-		todos = todos.map((todo) => {
-			if (todo === toggled) {
-				// return a new object
-				return {
-					id: todo.id,
-					text: todo.text,
-					done: !todo.done
-				};
-			}
-
-			// return the same object
-			return todo;
-		});
-	}
-</script>
-
-<h2>Todos</h2>
-{#each todos as todo}
-	<Todo {todo} on:click={() => toggle(todo)} />
-{/each}
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/Todo.svelte b/documentation/tutorial/16-special-elements/09-svelte-options/app-a/Todo.svelte
deleted file mode 100644
index 14083c0ba4..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/Todo.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script>
-	import { afterUpdate } from 'svelte';
-	import flash from './flash.js';
-
-	export let todo;
-
-	let button;
-
-	afterUpdate(() => {
-		flash(button);
-	});
-</script>
-
-<!-- the text will flash red whenever
-     the `todo` object changes -->
-<button bind:this={button} type="button" on:click>
-	{todo.done ? '👍' : ''}
-	{todo.text}
-</button>
-
-<style>
-	button {
-		all: unset;
-		display: block;
-		cursor: pointer;
-		line-height: 1.5;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/flash.js b/documentation/tutorial/16-special-elements/09-svelte-options/app-a/flash.js
deleted file mode 100644
index 481038d009..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-a/flash.js
+++ /dev/null
@@ -1,13 +0,0 @@
-export default function flash(element) {
-	requestAnimationFrame(() => {
-		element.style.transition = 'none';
-		element.style.color = 'rgba(255,62,0,1)';
-		element.style.backgroundColor = 'rgba(255,62,0,0.2)';
-
-		setTimeout(() => {
-			element.style.transition = 'color 1s, background 1s';
-			element.style.color = '';
-			element.style.backgroundColor = '';
-		});
-	});
-}
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/App.svelte b/documentation/tutorial/16-special-elements/09-svelte-options/app-b/App.svelte
deleted file mode 100644
index 96eb7b3977..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/App.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script>
-	import Todo from './Todo.svelte';
-
-	let todos = [
-		{ id: 1, done: true, text: 'wash the car' },
-		{ id: 2, done: false, text: 'take the dog for a walk' },
-		{ id: 3, done: false, text: 'mow the lawn' }
-	];
-
-	function toggle(toggled) {
-		todos = todos.map((todo) => {
-			if (todo === toggled) {
-				// return a new object
-				return {
-					id: todo.id,
-					text: todo.text,
-					done: !todo.done
-				};
-			}
-
-			// return the same object
-			return todo;
-		});
-	}
-</script>
-
-<h2>Todos</h2>
-{#each todos as todo}
-	<Todo {todo} on:click={() => toggle(todo)} />
-{/each}
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/Todo.svelte b/documentation/tutorial/16-special-elements/09-svelte-options/app-b/Todo.svelte
deleted file mode 100644
index 6104f16493..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/Todo.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<svelte:options immutable={true} />
-
-<script>
-	import { afterUpdate } from 'svelte';
-	import flash from './flash.js';
-
-	export let todo;
-
-	let button;
-
-	afterUpdate(() => {
-		flash(button);
-	});
-</script>
-
-<!-- the text will flash red whenever
-     the `todo` object changes -->
-<button bind:this={button} type="button" on:click>
-	{todo.done ? '👍' : ''}
-	{todo.text}
-</button>
-
-<style>
-	button {
-		all: unset;
-		display: block;
-		cursor: pointer;
-		line-height: 1.5;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/flash.js b/documentation/tutorial/16-special-elements/09-svelte-options/app-b/flash.js
deleted file mode 100644
index 481038d009..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/app-b/flash.js
+++ /dev/null
@@ -1,13 +0,0 @@
-export default function flash(element) {
-	requestAnimationFrame(() => {
-		element.style.transition = 'none';
-		element.style.color = 'rgba(255,62,0,1)';
-		element.style.backgroundColor = 'rgba(255,62,0,0.2)';
-
-		setTimeout(() => {
-			element.style.transition = 'color 1s, background 1s';
-			element.style.color = '';
-			element.style.backgroundColor = '';
-		});
-	});
-}
diff --git a/documentation/tutorial/16-special-elements/09-svelte-options/text.md b/documentation/tutorial/16-special-elements/09-svelte-options/text.md
deleted file mode 100644
index 2049365efc..0000000000
--- a/documentation/tutorial/16-special-elements/09-svelte-options/text.md
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: <svelte:options>
----
-
-The `<svelte:options>` element allows you to specify compiler options.
-
-We'll use the `immutable` option as an example. In this app, the `<Todo>` component flashes whenever it receives new data. Clicking on one of the items toggles its `done` state by creating an updated `todos` array. This causes the _other_ `<Todo>` items to flash, even though they don't end up making any changes to the DOM.
-
-We can optimise this by telling the `<Todo>` component to expect _immutable_ data. This means that we're promising never to _mutate_ the `todo` prop, but will instead create new todo objects whenever things change.
-
-Add this to the top of the `Todo.svelte` file:
-
-```svelte
-<svelte:options immutable={true} />
-```
-
-> You can shorten this to `<svelte:options immutable/>` if you prefer.
-
-Now, when you toggle todos by clicking on them, only the updated component flashes.
-
-The options that can be set here are:
-
-- `immutable={true}` — you never use mutable data, so the compiler can do simple referential equality checks to determine if values have changed
-- `immutable={false}` — the default. Svelte will be more conservative about whether or not mutable objects have changed
-- `accessors={true}` — adds getters and setters for the component's props
-- `accessors={false}` — the default
-- `namespace="..."` — the namespace where this component will be used, most commonly `"svg"`
-- `customElement={...}` — the [options](/docs/custom-elements-api#component-options) to use when compiling this component as a custom element. If a string is passed, it is used as the `tag` option
-
-Consult the [API reference](/docs) for more information on these options.
diff --git a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/App.svelte b/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/App.svelte
deleted file mode 100644
index d3ccc673c8..0000000000
--- a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<div slot="footer">
-		<p>All rights reserved.</p>
-		<p>Copyright (c) 2019 Svelte Industries</p>
-	</div>
-</Box>
diff --git a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/Box.svelte b/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/Box.svelte
deleted file mode 100644
index 843a3940aa..0000000000
--- a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-a/Box.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<div class="box">
-	<slot name="header">No header was provided</slot>
-	<p>Some content between header and footer</p>
-	<slot name="footer" />
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-
-		display: flex;
-		flex-direction: column;
-		gap: 1em;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/App.svelte b/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/App.svelte
deleted file mode 100644
index 9ad2616ad7..0000000000
--- a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/App.svelte
+++ /dev/null
@@ -1,10 +0,0 @@
-<script>
-	import Box from './Box.svelte';
-</script>
-
-<Box>
-	<svelte:fragment slot="footer">
-		<p>All rights reserved.</p>
-		<p>Copyright (c) 2019 Svelte Industries</p>
-	</svelte:fragment>
-</Box>
diff --git a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/Box.svelte b/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/Box.svelte
deleted file mode 100644
index 843a3940aa..0000000000
--- a/documentation/tutorial/16-special-elements/10-svelte-fragment/app-b/Box.svelte
+++ /dev/null
@@ -1,20 +0,0 @@
-<div class="box">
-	<slot name="header">No header was provided</slot>
-	<p>Some content between header and footer</p>
-	<slot name="footer" />
-</div>
-
-<style>
-	.box {
-		width: 300px;
-		border: 1px solid #aaa;
-		border-radius: 2px;
-		box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.1);
-		padding: 1em;
-		margin: 0 0 1em 0;
-
-		display: flex;
-		flex-direction: column;
-		gap: 1em;
-	}
-</style>
diff --git a/documentation/tutorial/16-special-elements/10-svelte-fragment/text.md b/documentation/tutorial/16-special-elements/10-svelte-fragment/text.md
deleted file mode 100644
index 153cf616fb..0000000000
--- a/documentation/tutorial/16-special-elements/10-svelte-fragment/text.md
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: <svelte:fragment>
----
-
-The `<svelte:fragment>` element allows you to place content in a named slot without wrapping it in a container DOM element. This keeps the flow layout of your document intact.
-
-In the example notice how we applied a flex layout with a gap of `1em` to the box.
-
-```svelte
-<!-- Box.svelte -->
-<div class="box">
-	<slot name="header">No header was provided</slot>
-	<p>Some content between header and footer</p>
-	<slot name="footer" />
-</div>
-
-<style>
-	.box {
-		display: flex;
-		flex-direction: column;
-		gap: 1em;
-	}
-</style>
-```
-
-However, the content in the footer is not spaced out according to this rhythm because wrapping it in a div created a new flow layout.
-
-We can solve this by changing `<div slot="footer">` in the `App` component. Replace the `<div>` with `<svelte:fragment>`:
-
-```svelte
-<svelte:fragment slot="footer">
-	<p>All rights reserved.</p>
-	<p>Copyright (c) 2019 Svelte Industries</p>
-</svelte:fragment>
-```
diff --git a/documentation/tutorial/16-special-elements/meta.json b/documentation/tutorial/16-special-elements/meta.json
deleted file mode 100644
index 6c2af96c1d..0000000000
--- a/documentation/tutorial/16-special-elements/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Special elements"
-}
diff --git a/documentation/tutorial/17-module-context/01-sharing-code/app-a/App.svelte b/documentation/tutorial/17-module-context/01-sharing-code/app-a/App.svelte
deleted file mode 100644
index f031b43fd5..0000000000
--- a/documentation/tutorial/17-module-context/01-sharing-code/app-a/App.svelte
+++ /dev/null
@@ -1,43 +0,0 @@
-<script>
-	import AudioPlayer from './AudioPlayer.svelte';
-</script>
-
-<!-- https://musopen.org/music/9862-the-blue-danube-op-314/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/strauss.mp3"
-	title="The Blue Danube Waltz"
-	composer="Johann Strauss"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43775-the-planets-op-32/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/holst.mp3"
-	title="Mars, the Bringer of War"
-	composer="Gustav Holst"
-	performer="USAF Heritage of America Band"
-/>
-
-<!-- https://musopen.org/music/8010-3-gymnopedies/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/satie.mp3"
-	title="Gymnopédie no. 1"
-	composer="Erik Satie"
-	performer="Prodigal Procrastinator"
-/>
-
-<!-- https://musopen.org/music/2567-symphony-no-5-in-c-minor-op-67/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/beethoven.mp3"
-	title="Symphony no. 5 in Cm, Op. 67 - I. Allegro con brio"
-	composer="Ludwig van Beethoven"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43683-requiem-in-d-minor-k-626/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/mozart.mp3"
-	title="Requiem in D minor, K. 626 - III. Sequence - Lacrymosa"
-	composer="Wolfgang Amadeus Mozart"
-	performer="Markus Staab"
-/>
diff --git a/documentation/tutorial/17-module-context/01-sharing-code/app-a/AudioPlayer.svelte b/documentation/tutorial/17-module-context/01-sharing-code/app-a/AudioPlayer.svelte
deleted file mode 100644
index 0533ec0876..0000000000
--- a/documentation/tutorial/17-module-context/01-sharing-code/app-a/AudioPlayer.svelte
+++ /dev/null
@@ -1,38 +0,0 @@
-<script>
-	export let src;
-	export let title;
-	export let composer;
-	export let performer;
-
-	let audio;
-	let paused = true;
-
-	function stopOthers() {
-		// TODO: implement stopOthers
-	}
-</script>
-
-<article class:playing={!paused}>
-	<h2>{title}</h2>
-	<p><strong>{composer}</strong> / performed by {performer}</p>
-
-	<audio bind:this={audio} bind:paused on:play={stopOthers} controls {src} />
-</article>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-		max-width: 800px;
-	}
-	h2,
-	p {
-		margin: 0 0 0.3em 0;
-	}
-	audio {
-		width: 100%;
-		margin: 0.5em 0 1em 0;
-	}
-	.playing {
-		color: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/17-module-context/01-sharing-code/app-b/App.svelte b/documentation/tutorial/17-module-context/01-sharing-code/app-b/App.svelte
deleted file mode 100644
index f031b43fd5..0000000000
--- a/documentation/tutorial/17-module-context/01-sharing-code/app-b/App.svelte
+++ /dev/null
@@ -1,43 +0,0 @@
-<script>
-	import AudioPlayer from './AudioPlayer.svelte';
-</script>
-
-<!-- https://musopen.org/music/9862-the-blue-danube-op-314/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/strauss.mp3"
-	title="The Blue Danube Waltz"
-	composer="Johann Strauss"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43775-the-planets-op-32/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/holst.mp3"
-	title="Mars, the Bringer of War"
-	composer="Gustav Holst"
-	performer="USAF Heritage of America Band"
-/>
-
-<!-- https://musopen.org/music/8010-3-gymnopedies/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/satie.mp3"
-	title="Gymnopédie no. 1"
-	composer="Erik Satie"
-	performer="Prodigal Procrastinator"
-/>
-
-<!-- https://musopen.org/music/2567-symphony-no-5-in-c-minor-op-67/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/beethoven.mp3"
-	title="Symphony no. 5 in Cm, Op. 67 - I. Allegro con brio"
-	composer="Ludwig van Beethoven"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43683-requiem-in-d-minor-k-626/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/mozart.mp3"
-	title="Requiem in D minor, K. 626 - III. Sequence - Lacrymosa"
-	composer="Wolfgang Amadeus Mozart"
-	performer="Markus Staab"
-/>
diff --git a/documentation/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte b/documentation/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte
deleted file mode 100644
index 6e2e605026..0000000000
--- a/documentation/tutorial/17-module-context/01-sharing-code/app-b/AudioPlayer.svelte
+++ /dev/null
@@ -1,43 +0,0 @@
-<script context="module">
-	let current;
-</script>
-
-<script>
-	export let src;
-	export let title;
-	export let composer;
-	export let performer;
-
-	let audio;
-	let paused = true;
-
-	function stopOthers() {
-		if (current && current !== audio) current.pause();
-		current = audio;
-	}
-</script>
-
-<article class:playing={!paused}>
-	<h2>{title}</h2>
-	<p><strong>{composer}</strong> / performed by {performer}</p>
-
-	<audio bind:this={audio} bind:paused on:play={stopOthers} controls {src} />
-</article>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-		max-width: 800px;
-	}
-	h2,
-	p {
-		margin: 0 0 0.3em 0;
-	}
-	audio {
-		width: 100%;
-		margin: 0.5em 0 1em 0;
-	}
-	.playing {
-		color: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/17-module-context/01-sharing-code/text.md b/documentation/tutorial/17-module-context/01-sharing-code/text.md
deleted file mode 100644
index 4ac909a7ef..0000000000
--- a/documentation/tutorial/17-module-context/01-sharing-code/text.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Sharing code
----
-
-In all the examples we've seen so far, the `<script>` block contains code that runs when each component instance is initialised. For the vast majority of components, that's all you'll ever need.
-
-Very occasionally, you'll need to run some code outside of an individual component instance. For example, you can play all five of these audio players simultaneously; it would be better if playing one stopped all the others.
-
-We can do that by declaring a `<script context="module">` block. Code contained inside it will run once, when the module first evaluates, rather than when a component is instantiated. Place this at the top of `AudioPlayer.svelte`:
-
-```svelte
-<script context="module">
-	let current;
-</script>
-```
-
-It's now possible for the components to 'talk' to each other without any state management:
-
-```js
-function stopOthers() {
-	if (current && current !== audio) current.pause();
-	current = audio;
-}
-```
diff --git a/documentation/tutorial/17-module-context/02-module-exports/app-a/App.svelte b/documentation/tutorial/17-module-context/02-module-exports/app-a/App.svelte
deleted file mode 100644
index 9365c46c0a..0000000000
--- a/documentation/tutorial/17-module-context/02-module-exports/app-a/App.svelte
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-	import AudioPlayer from './AudioPlayer.svelte';
-</script>
-
-<button> stop all audio </button>
-
-<!-- https://musopen.org/music/9862-the-blue-danube-op-314/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/strauss.mp3"
-	title="The Blue Danube Waltz"
-	composer="Johann Strauss"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43775-the-planets-op-32/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/holst.mp3"
-	title="Mars, the Bringer of War"
-	composer="Gustav Holst"
-	performer="USAF Heritage of America Band"
-/>
-
-<!-- https://musopen.org/music/8010-3-gymnopedies/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/satie.mp3"
-	title="Gymnopédie no. 1"
-	composer="Erik Satie"
-	performer="Prodigal Procrastinator"
-/>
-
-<!-- https://musopen.org/music/2567-symphony-no-5-in-c-minor-op-67/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/beethoven.mp3"
-	title="Symphony no. 5 in Cm, Op. 67 - I. Allegro con brio"
-	composer="Ludwig van Beethoven"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43683-requiem-in-d-minor-k-626/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/mozart.mp3"
-	title="Requiem in D minor, K. 626 - III. Sequence - Lacrymosa"
-	composer="Wolfgang Amadeus Mozart"
-	performer="Markus Staab"
-/>
diff --git a/documentation/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte b/documentation/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte
deleted file mode 100644
index 2b229e50dd..0000000000
--- a/documentation/tutorial/17-module-context/02-module-exports/app-a/AudioPlayer.svelte
+++ /dev/null
@@ -1,51 +0,0 @@
-<script context="module">
-	const elements = new Set();
-</script>
-
-<script>
-	import { onMount } from 'svelte';
-
-	export let src;
-	export let title;
-	export let composer;
-	export let performer;
-
-	let audio;
-	let paused = true;
-
-	onMount(() => {
-		elements.add(audio);
-		return () => elements.delete(audio);
-	});
-
-	function stopOthers() {
-		elements.forEach((element) => {
-			if (element !== audio) element.pause();
-		});
-	}
-</script>
-
-<article class:playing={!paused}>
-	<h2>{title}</h2>
-	<p><strong>{composer}</strong> / performed by {performer}</p>
-
-	<audio bind:this={audio} bind:paused on:play={stopOthers} controls {src} />
-</article>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-		max-width: 800px;
-	}
-	h2,
-	p {
-		margin: 0 0 0.3em 0;
-	}
-	audio {
-		width: 100%;
-		margin: 0.5em 0 1em 0;
-	}
-	.playing {
-		color: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/17-module-context/02-module-exports/app-b/App.svelte b/documentation/tutorial/17-module-context/02-module-exports/app-b/App.svelte
deleted file mode 100644
index a018d3429f..0000000000
--- a/documentation/tutorial/17-module-context/02-module-exports/app-b/App.svelte
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-	import AudioPlayer, { stopAll } from './AudioPlayer.svelte';
-</script>
-
-<button on:click={stopAll}> stop all audio </button>
-
-<!-- https://musopen.org/music/9862-the-blue-danube-op-314/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/strauss.mp3"
-	title="The Blue Danube Waltz"
-	composer="Johann Strauss"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43775-the-planets-op-32/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/holst.mp3"
-	title="Mars, the Bringer of War"
-	composer="Gustav Holst"
-	performer="USAF Heritage of America Band"
-/>
-
-<!-- https://musopen.org/music/8010-3-gymnopedies/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/satie.mp3"
-	title="Gymnopédie no. 1"
-	composer="Erik Satie"
-	performer="Prodigal Procrastinator"
-/>
-
-<!-- https://musopen.org/music/2567-symphony-no-5-in-c-minor-op-67/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/beethoven.mp3"
-	title="Symphony no. 5 in Cm, Op. 67 - I. Allegro con brio"
-	composer="Ludwig van Beethoven"
-	performer="European Archive"
-/>
-
-<!-- https://musopen.org/music/43683-requiem-in-d-minor-k-626/ -->
-<AudioPlayer
-	src="https://sveltejs.github.io/assets/music/mozart.mp3"
-	title="Requiem in D minor, K. 626 - III. Sequence - Lacrymosa"
-	composer="Wolfgang Amadeus Mozart"
-	performer="Markus Staab"
-/>
diff --git a/documentation/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte b/documentation/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte
deleted file mode 100644
index b76601e025..0000000000
--- a/documentation/tutorial/17-module-context/02-module-exports/app-b/AudioPlayer.svelte
+++ /dev/null
@@ -1,57 +0,0 @@
-<script context="module">
-	const elements = new Set();
-
-	export function stopAll() {
-		elements.forEach((element) => {
-			element.pause();
-		});
-	}
-</script>
-
-<script>
-	import { onMount } from 'svelte';
-
-	export let src;
-	export let title;
-	export let composer;
-	export let performer;
-
-	let audio;
-	let paused = true;
-
-	onMount(() => {
-		elements.add(audio);
-		return () => elements.delete(audio);
-	});
-
-	function stopOthers() {
-		elements.forEach((element) => {
-			if (element !== audio) element.pause();
-		});
-	}
-</script>
-
-<article class:playing={!paused}>
-	<h2>{title}</h2>
-	<p><strong>{composer}</strong> / performed by {performer}</p>
-
-	<audio bind:this={audio} bind:paused on:play={stopOthers} controls {src} />
-</article>
-
-<style>
-	article {
-		margin: 0 0 1em 0;
-		max-width: 800px;
-	}
-	h2,
-	p {
-		margin: 0 0 0.3em 0;
-	}
-	audio {
-		width: 100%;
-		margin: 0.5em 0 1em 0;
-	}
-	.playing {
-		color: #ff3e00;
-	}
-</style>
diff --git a/documentation/tutorial/17-module-context/02-module-exports/text.md b/documentation/tutorial/17-module-context/02-module-exports/text.md
deleted file mode 100644
index 55c94645f4..0000000000
--- a/documentation/tutorial/17-module-context/02-module-exports/text.md
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Exports
----
-
-Anything exported from a `context="module"` script block becomes an export from the module itself. If we export a `stopAll` function from `AudioPlayer.svelte`...
-
-```svelte
-<script context="module">
-	const elements = new Set();
-
-	export function stopAll() {
-		elements.forEach((element) => {
-			element.pause();
-		});
-	}
-</script>
-```
-
-...we can then import it in `App.svelte`...
-
-```svelte
-<script>
-	import AudioPlayer, { stopAll } from './AudioPlayer.svelte';
-</script>
-```
-
-...and use it in an event handler:
-
-```svelte
-<button on:click={stopAll}> stop all audio </button>
-```
-
-> You can't have a default export, because the component _is_ the default export.
diff --git a/documentation/tutorial/17-module-context/meta.json b/documentation/tutorial/17-module-context/meta.json
deleted file mode 100644
index 772fe6de40..0000000000
--- a/documentation/tutorial/17-module-context/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Module context"
-}
diff --git a/documentation/tutorial/18-special-tags/01-debug/app-a/App.svelte b/documentation/tutorial/18-special-tags/01-debug/app-a/App.svelte
deleted file mode 100644
index 78a0b81741..0000000000
--- a/documentation/tutorial/18-special-tags/01-debug/app-a/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let user = {
-		firstname: 'Ada',
-		lastname: 'Lovelace'
-	};
-</script>
-
-<input bind:value={user.firstname} />
-<input bind:value={user.lastname} />
-
-{(console.log(user), '')}
-
-<h1>Hello {user.firstname}!</h1>
diff --git a/documentation/tutorial/18-special-tags/01-debug/app-b/App.svelte b/documentation/tutorial/18-special-tags/01-debug/app-b/App.svelte
deleted file mode 100644
index 30bffc896c..0000000000
--- a/documentation/tutorial/18-special-tags/01-debug/app-b/App.svelte
+++ /dev/null
@@ -1,13 +0,0 @@
-<script>
-	let user = {
-		firstname: 'Ada',
-		lastname: 'Lovelace'
-	};
-</script>
-
-<input bind:value={user.firstname} />
-<input bind:value={user.lastname} />
-
-{@debug user}
-
-<h1>Hello {user.firstname}!</h1>
diff --git a/documentation/tutorial/18-special-tags/01-debug/text.md b/documentation/tutorial/18-special-tags/01-debug/text.md
deleted file mode 100644
index 2da1e3d2be..0000000000
--- a/documentation/tutorial/18-special-tags/01-debug/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: The @debug tag
----
-
-Occasionally, it's useful to inspect a piece of data as it flows through your app.
-
-One approach is to use `console.log(...)` inside your markup. If you want to pause execution, though, you can use the `{@debug ...}` tag with a comma-separated list of values you want to inspect:
-
-```svelte
-{@debug user}
-
-<h1>Hello {user.firstname}!</h1>
-```
-
-If you now open your devtools and start interacting with the `<input>` elements, you'll trigger the debugger as the value of `user` changes.
diff --git a/documentation/tutorial/18-special-tags/02-html-tags/app-a/App.svelte b/documentation/tutorial/18-special-tags/02-html-tags/app-a/App.svelte
deleted file mode 100644
index 77270433f1..0000000000
--- a/documentation/tutorial/18-special-tags/02-html-tags/app-a/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let string = `this string contains some <strong>HTML!!!</strong>`;
-</script>
-
-<p>{string}</p>
diff --git a/documentation/tutorial/18-special-tags/02-html-tags/app-b/App.svelte b/documentation/tutorial/18-special-tags/02-html-tags/app-b/App.svelte
deleted file mode 100644
index 463eb8250e..0000000000
--- a/documentation/tutorial/18-special-tags/02-html-tags/app-b/App.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let string = `this string contains some <strong>HTML!!!</strong>`;
-</script>
-
-<p>{@html string}</p>
diff --git a/documentation/tutorial/18-special-tags/02-html-tags/text.md b/documentation/tutorial/18-special-tags/02-html-tags/text.md
deleted file mode 100644
index ee9123dea9..0000000000
--- a/documentation/tutorial/18-special-tags/02-html-tags/text.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: HTML tags
----
-
-Ordinarily, strings are inserted as plain text, meaning that characters like `<` and `>` have no special meaning.
-
-But sometimes you need to render HTML directly into a component. For example, the words you're reading right now exist in a markdown file that gets included on this page as a blob of HTML.
-
-In Svelte, you do this with the special `{@html ...}` tag:
-
-```svelte
-<p>{@html string}</p>
-```
-
-> **Warning!** Svelte doesn't perform any sanitization of the expression inside `{@html ...}` before it gets inserted into the DOM. In other words, if you use this feature it's **critical** that you manually escape HTML that comes from sources you don't trust, otherwise you risk exposing your users to XSS attacks.
diff --git a/documentation/tutorial/18-special-tags/meta.json b/documentation/tutorial/18-special-tags/meta.json
deleted file mode 100644
index cbd6495e1c..0000000000
--- a/documentation/tutorial/18-special-tags/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Special tags"
-}
diff --git a/documentation/tutorial/19-next-steps/01-congratulations/app-a/App.svelte b/documentation/tutorial/19-next-steps/01-congratulations/app-a/App.svelte
deleted file mode 100644
index a5db2e5eab..0000000000
--- a/documentation/tutorial/19-next-steps/01-congratulations/app-a/App.svelte
+++ /dev/null
@@ -1,51 +0,0 @@
-<script>
-	import { onMount } from 'svelte';
-
-	let characters = ['🥳', '🎉', '✨'];
-
-	let confetti = new Array(100)
-		.fill()
-		.map((_, i) => {
-			return {
-				character: characters[i % characters.length],
-				x: Math.random() * 100,
-				y: -20 - Math.random() * 100,
-				r: 0.1 + Math.random() * 1
-			};
-		})
-		.sort((a, b) => a.r - b.r);
-
-	onMount(() => {
-		let frame;
-
-		function loop() {
-			frame = requestAnimationFrame(loop);
-
-			confetti = confetti.map((emoji) => {
-				emoji.y += 0.7 * emoji.r;
-				if (emoji.y > 120) emoji.y = -20;
-				return emoji;
-			});
-		}
-
-		loop();
-
-		return () => cancelAnimationFrame(frame);
-	});
-</script>
-
-{#each confetti as c}
-	<span style="left: {c.x}%; top: {c.y}%; transform: scale({c.r})">{c.character}</span>
-{/each}
-
-<style>
-	:global(body) {
-		overflow: hidden;
-	}
-
-	span {
-		position: absolute;
-		font-size: 5vw;
-		user-select: none;
-	}
-</style>
diff --git a/documentation/tutorial/19-next-steps/01-congratulations/text.md b/documentation/tutorial/19-next-steps/01-congratulations/text.md
deleted file mode 100644
index 5df63d9f6f..0000000000
--- a/documentation/tutorial/19-next-steps/01-congratulations/text.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Congratulations!
----
-
-You've now finished the Svelte tutorial and are ready to start building apps. You can refer back to individual chapters at any time (click the title above to reveal a dropdown) or continue your learning via the [API reference](/docs), [Examples](/examples) and [Blog](/blog). If you're a Twitter user, you can get updates via [@sveltejs](https://twitter.com/sveltejs).
-
-To get set up in your local development environment, check out [the quickstart guide](/docs/introduction).
-
-If you're looking for a more expansive framework that includes routing, server-side rendering and everything else, take a look at [SvelteKit](https://kit.svelte.dev).
-
-Most importantly: since you're now a member of the Svelte community, you should [join our friendly Discord chatroom](https://svelte.dev/chat). That's where you'll find fellow Svelte users, and it's where we plan the future of the framework.
diff --git a/documentation/tutorial/19-next-steps/meta.json b/documentation/tutorial/19-next-steps/meta.json
deleted file mode 100644
index e4d029eab7..0000000000
--- a/documentation/tutorial/19-next-steps/meta.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-	"title": "Next steps"
-}

From 1a8aab0e384c5706a9cf34aba69f56b050b1e549 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 26 Nov 2024 15:13:34 -0500
Subject: [PATCH 207/404] chore: remove `node.parent` and `node.prev` (#14447)

* make get_possible_element_siblings non-recursive

* treat slots as blocks

* simplify

* simplify

* add test

* changeset

* chore: remove node.parent and node.prev

* simplify
---
 packages/svelte/src/compiler/index.js         |  1 -
 packages/svelte/src/compiler/legacy.js        |  8 -----
 .../src/compiler/phases/1-parse/index.js      | 24 ++-------------
 .../compiler/phases/1-parse/read/script.js    |  1 -
 .../compiler/phases/1-parse/state/element.js  | 29 ++++++-------------
 .../src/compiler/phases/1-parse/state/tag.js  | 22 ++++++--------
 .../src/compiler/phases/1-parse/state/text.js |  2 +-
 .../src/compiler/phases/2-analyze/index.js    |  4 +--
 .../server/visitors/shared/element.js         |  4 ---
 .../src/compiler/phases/3-transform/utils.js  |  1 -
 packages/svelte/src/compiler/phases/nodes.js  |  1 -
 .../svelte/src/compiler/types/template.d.ts   |  2 --
 12 files changed, 23 insertions(+), 76 deletions(-)

diff --git a/packages/svelte/src/compiler/index.js b/packages/svelte/src/compiler/index.js
index 2b3ad99d8b..fbd9c16e5d 100644
--- a/packages/svelte/src/compiler/index.js
+++ b/packages/svelte/src/compiler/index.js
@@ -120,7 +120,6 @@ function to_public_ast(source, ast, modern) {
 	if (modern) {
 		const clean = (/** @type {any} */ node) => {
 			delete node.metadata;
-			delete node.parent;
 		};
 
 		ast.options?.attributes.forEach((attribute) => {
diff --git a/packages/svelte/src/compiler/legacy.js b/packages/svelte/src/compiler/legacy.js
index e603da312b..52b4bd5860 100644
--- a/packages/svelte/src/compiler/legacy.js
+++ b/packages/svelte/src/compiler/legacy.js
@@ -45,8 +45,6 @@ export function convert(source, ast) {
 	return /** @type {Legacy.LegacyRoot} */ (
 		walk(root, null, {
 			_(node, { next }) {
-				// @ts-ignore
-				delete node.parent;
 				// @ts-ignore
 				delete node.metadata;
 				next();
@@ -62,8 +60,6 @@ export function convert(source, ast) {
 						idx = node.fragment.nodes.length;
 					}
 
-					// @ts-ignore
-					delete options.__raw__.parent;
 					node.fragment.nodes.splice(idx, 0, /** @type {any} */ (options).__raw__);
 				}
 
@@ -85,15 +81,11 @@ export function convert(source, ast) {
 				}
 
 				if (instance) {
-					// @ts-ignore
-					delete instance.parent;
 					// @ts-ignore
 					delete instance.attributes;
 				}
 
 				if (module) {
-					// @ts-ignore
-					delete module.parent;
 					// @ts-ignore
 					delete module.attributes;
 				}
diff --git a/packages/svelte/src/compiler/phases/1-parse/index.js b/packages/svelte/src/compiler/phases/1-parse/index.js
index de29aa5261..7639c2f0ed 100644
--- a/packages/svelte/src/compiler/phases/1-parse/index.js
+++ b/packages/svelte/src/compiler/phases/1-parse/index.js
@@ -262,30 +262,12 @@ export class Parser {
 	}
 
 	/**
-	 * @template T
-	 * @param {Omit<T, 'prev' | 'parent'>} node
+	 * @template {AST.Fragment['nodes'][number]} T
+	 * @param {T} node
 	 * @returns {T}
 	 */
 	append(node) {
-		const current = this.current();
-		const fragment = this.fragments.at(-1);
-
-		Object.defineProperties(node, {
-			prev: {
-				enumerable: false,
-				value: fragment?.nodes.at(-1) ?? null
-			},
-			parent: {
-				enumerable: false,
-				configurable: true,
-				value: current
-			}
-		});
-
-		// @ts-expect-error
-		fragment.nodes.push(node);
-
-		// @ts-expect-error
+		this.fragments.at(-1)?.nodes.push(node);
 		return node;
 	}
 }
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 9675e5bbd8..85023cb781 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/script.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/script.js
@@ -84,7 +84,6 @@ export function read_script(parser, start, attributes) {
 		end: parser.index,
 		context,
 		content: ast,
-		parent: null,
 		// @ts-ignore
 		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 9082b76c49..6eed811393 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -56,7 +56,6 @@ export default function element(parser) {
 		const data = parser.read_until(regex_closing_comment);
 		parser.eat('-->', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.Comment>>} */
 		parser.append({
 			type: 'Comment',
 			start,
@@ -153,8 +152,7 @@ export default function element(parser) {
 						scoped: false,
 						has_spread: false,
 						path: []
-					},
-					parent: null
+					}
 				}
 			: /** @type {ElementLike} */ ({
 					type,
@@ -163,7 +161,6 @@ export default function element(parser) {
 					name,
 					attributes: [],
 					fragment: create_fragment(true),
-					parent: null,
 					metadata: {
 						// unpopulated at first, differs between types
 					}
@@ -348,8 +345,7 @@ export default function element(parser) {
 			end,
 			type: 'Text',
 			data,
-			raw: data,
-			parent: null
+			raw: data
 		};
 
 		element.fragment.nodes.push(node);
@@ -422,8 +418,7 @@ function read_static_attribute(parser) {
 				end: quoted ? parser.index - 1 : parser.index,
 				type: 'Text',
 				raw: raw,
-				data: decode_character_references(raw, true),
-				parent: null
+				data: decode_character_references(raw, true)
 			}
 		];
 	}
@@ -457,7 +452,6 @@ function read_attribute(parser) {
 				start,
 				end: parser.index,
 				expression,
-				parent: null,
 				metadata: {
 					expression: create_expression_metadata()
 				}
@@ -486,7 +480,6 @@ function read_attribute(parser) {
 					type: 'Identifier',
 					name
 				},
-				parent: null,
 				metadata: {
 					expression: create_expression_metadata()
 				}
@@ -531,7 +524,6 @@ function read_attribute(parser) {
 				name: directive_name,
 				modifiers: /** @type {Array<'important'>} */ (modifiers),
 				value,
-				parent: null,
 				metadata: {
 					expression: create_expression_metadata()
 				}
@@ -556,19 +548,20 @@ function read_attribute(parser) {
 		}
 
 		/** @type {Directive} */
-		// @ts-expect-error TODO can't figure out this error
 		const directive = {
 			start,
 			end,
 			type,
 			name: directive_name,
-			modifiers,
 			expression,
 			metadata: {
 				expression: create_expression_metadata()
 			}
 		};
 
+		// @ts-expect-error we do this separately from the declaration to avoid upsetting typescript
+		directive.modifiers = modifiers;
+
 		if (directive.type === 'TransitionDirective') {
 			const direction = name.slice(0, colon_index);
 			directive.intro = direction === 'in' || direction === 'transition';
@@ -623,8 +616,7 @@ function read_attribute_value(parser) {
 				end: parser.index - 1,
 				type: 'Text',
 				raw: '',
-				data: '',
-				parent: null
+				data: ''
 			}
 		];
 	}
@@ -681,8 +673,7 @@ function read_sequence(parser, done, location) {
 		end: -1,
 		type: 'Text',
 		raw: '',
-		data: '',
-		parent: null
+		data: ''
 	};
 
 	/** @type {Array<AST.Text | AST.ExpressionTag>} */
@@ -729,7 +720,6 @@ function read_sequence(parser, done, location) {
 				start: index,
 				end: parser.index,
 				expression,
-				parent: null,
 				metadata: {
 					expression: create_expression_metadata()
 				}
@@ -742,8 +732,7 @@ function read_sequence(parser, done, location) {
 				end: -1,
 				type: 'Text',
 				raw: '',
-				data: '',
-				parent: null
+				data: ''
 			};
 		} else {
 			current_chunk.raw += parser.template[parser.index++];
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 de118960ec..1632099c29 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -33,7 +33,6 @@ export default function tag(parser) {
 	parser.allow_whitespace();
 	parser.eat('}', true);
 
-	/** @type {ReturnType<typeof parser.append<AST.ExpressionTag>>} */
 	parser.append({
 		type: 'ExpressionTag',
 		start,
@@ -53,7 +52,7 @@ function open(parser) {
 	if (parser.eat('if')) {
 		parser.require_whitespace();
 
-		/** @type {ReturnType<typeof parser.append<AST.IfBlock>>} */
+		/** @type {AST.IfBlock} */
 		const block = parser.append({
 			type: 'IfBlock',
 			elseif: false,
@@ -174,7 +173,7 @@ function open(parser) {
 
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.EachBlock>>} */
+		/** @type {AST.EachBlock} */
 		const block = parser.append({
 			type: 'EachBlock',
 			start,
@@ -198,7 +197,7 @@ function open(parser) {
 		const expression = read_expression(parser);
 		parser.allow_whitespace();
 
-		/** @type {ReturnType<typeof parser.append<AST.AwaitBlock>>} */
+		/** @type {AST.AwaitBlock} */
 		const block = parser.append({
 			type: 'AwaitBlock',
 			start,
@@ -252,7 +251,7 @@ function open(parser) {
 
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.KeyBlock>>} */
+		/** @type {AST.KeyBlock} */
 		const block = parser.append({
 			type: 'KeyBlock',
 			start,
@@ -303,7 +302,7 @@ function open(parser) {
 		parser.allow_whitespace();
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.SnippetBlock>>} */
+		/** @type {AST.SnippetBlock} */
 		const block = parser.append({
 			type: 'SnippetBlock',
 			start,
@@ -355,7 +354,7 @@ function next(parser) {
 			let elseif_start = start - 1;
 			while (parser.template[elseif_start] !== '{') elseif_start -= 1;
 
-			/** @type {ReturnType<typeof parser.append<AST.IfBlock>>} */
+			/** @type {AST.IfBlock} */
 			const child = parser.append({
 				start: elseif_start,
 				end: -1,
@@ -499,7 +498,6 @@ function special(parser) {
 		parser.allow_whitespace();
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.HtmlTag>>} */
 		parser.append({
 			type: 'HtmlTag',
 			start,
@@ -537,7 +535,6 @@ function special(parser) {
 			parser.eat('}', true);
 		}
 
-		/** @type {ReturnType<typeof parser.append<AST.DebugTag>>} */
 		parser.append({
 			type: 'DebugTag',
 			start,
@@ -570,7 +567,6 @@ function special(parser) {
 
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.ConstTag>>} */
 		parser.append({
 			type: 'ConstTag',
 			start,
@@ -601,15 +597,15 @@ function special(parser) {
 		parser.allow_whitespace();
 		parser.eat('}', true);
 
-		/** @type {ReturnType<typeof parser.append<AST.RenderTag>>} */
 		parser.append({
 			type: 'RenderTag',
 			start,
 			end: parser.index,
-			expression: expression,
+			expression: /** @type {AST.RenderTag['expression']} */ (expression),
 			metadata: {
 				dynamic: false,
-				args_with_call_expression: new Set()
+				args_with_call_expression: new Set(),
+				path: []
 			}
 		});
 	}
diff --git a/packages/svelte/src/compiler/phases/1-parse/state/text.js b/packages/svelte/src/compiler/phases/1-parse/state/text.js
index 388ffa19c0..d0af3a846a 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/text.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/text.js
@@ -12,7 +12,7 @@ export default function text(parser) {
 		data += parser.template[parser.index++];
 	}
 
-	/** @type {ReturnType<typeof parser.append<AST.Text>>} */
+	/** @type {AST.Text} */
 	parser.append({
 		type: 'Text',
 		start,
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 0d8caa0a4b..ce34544eb4 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -758,8 +758,7 @@ export function analyze_component(root, source, options) {
 							data: ` ${analysis.css.hash}`,
 							raw: ` ${analysis.css.hash}`,
 							start: -1,
-							end: -1,
-							parent: null
+							end: -1
 						};
 
 						if (Array.isArray(class_attribute.value)) {
@@ -775,7 +774,6 @@ export function analyze_component(root, source, options) {
 								type: 'Text',
 								data: analysis.css.hash,
 								raw: analysis.css.hash,
-								parent: null,
 								start: -1,
 								end: -1
 							}
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 c386c4f7c0..2ab5d9b9fd 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
@@ -135,7 +135,6 @@ export function build_element_attributes(node, context) {
 							type: 'ExpressionTag',
 							start: -1,
 							end: -1,
-							parent: attribute,
 							expression: is_checkbox
 								? b.call(
 										b.member(attribute.expression, 'includes'),
@@ -159,7 +158,6 @@ export function build_element_attributes(node, context) {
 							type: 'ExpressionTag',
 							start: -1,
 							end: -1,
-							parent: attribute,
 							expression: attribute.expression,
 							metadata: {
 								expression: create_expression_metadata()
@@ -376,7 +374,6 @@ function build_class_directives(class_directives, class_attribute) {
 			type: 'Text',
 			start: -1,
 			end: -1,
-			parent: class_attribute,
 			data: ' ',
 			raw: ' '
 		});
@@ -386,7 +383,6 @@ function build_class_directives(class_directives, class_attribute) {
 		type: 'ExpressionTag',
 		start: -1,
 		end: -1,
-		parent: class_attribute,
 		expression: b.call(
 			b.member(b.call(b.member(b.array(expressions), 'filter'), b.id('Boolean')), b.id('join')),
 			b.literal(' ')
diff --git a/packages/svelte/src/compiler/phases/3-transform/utils.js b/packages/svelte/src/compiler/phases/3-transform/utils.js
index 809c627098..a1b8dc0d03 100644
--- a/packages/svelte/src/compiler/phases/3-transform/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/utils.js
@@ -277,7 +277,6 @@ export function clean_nodes(
 		trimmed.push({
 			type: 'Comment',
 			data: '',
-			parent: first.parent,
 			start: -1,
 			end: -1
 		});
diff --git a/packages/svelte/src/compiler/phases/nodes.js b/packages/svelte/src/compiler/phases/nodes.js
index ead525aaa1..1a1c21bb4b 100644
--- a/packages/svelte/src/compiler/phases/nodes.js
+++ b/packages/svelte/src/compiler/phases/nodes.js
@@ -43,7 +43,6 @@ export function create_attribute(name, start, end, value) {
 		end,
 		name,
 		value,
-		parent: null,
 		metadata: {
 			expression: create_expression_metadata(),
 			delegated: null
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index 59456412bd..0be0b25ab4 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -37,8 +37,6 @@ export namespace AST {
 		type: string;
 		start: number;
 		end: number;
-		/** @internal This is set during parsing on elements/components/expressions/text (but not attributes etc) */
-		parent: SvelteNode | null;
 	}
 
 	export interface Fragment {

From 4f318e6ad6c1fb9ec1d81c92b319461d099e391e Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 26 Nov 2024 13:12:11 -0800
Subject: [PATCH 208/404] chore: remove unused dep and upgrade another one
 (#14449)

---
 packages/svelte/package.json     |   2 +-
 playgrounds/sandbox/package.json |   1 -
 pnpm-lock.yaml                   | 154 +++++++++----------------------
 3 files changed, 43 insertions(+), 114 deletions(-)

diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 9d9b04a6eb..61f2ec2d54 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -120,7 +120,7 @@
   "devDependencies": {
     "@jridgewell/trace-mapping": "^0.3.25",
     "@playwright/test": "^1.46.1",
-    "@rollup/plugin-commonjs": "^28.0.0",
+    "@rollup/plugin-commonjs": "^28.0.1",
     "@rollup/plugin-node-resolve": "^15.3.0",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-virtual": "^3.0.2",
diff --git a/playgrounds/sandbox/package.json b/playgrounds/sandbox/package.json
index acec9f1e64..944e79621e 100644
--- a/playgrounds/sandbox/package.json
+++ b/playgrounds/sandbox/package.json
@@ -13,7 +13,6 @@
   },
   "devDependencies": {
     "@sveltejs/vite-plugin-svelte": "^4.0.0-next.6",
-    "nodemon": "^3.0.3",
     "polka": "^1.0.0-next.25",
     "svelte": "workspace:*",
     "tiny-glob": "^0.2.9",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0af617a61d..261a82f300 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -106,8 +106,8 @@ importers:
         specifier: ^1.46.1
         version: 1.46.1
       '@rollup/plugin-commonjs':
-        specifier: ^28.0.0
-        version: 28.0.0(rollup@4.22.4)
+        specifier: ^28.0.1
+        version: 28.0.1(rollup@4.22.4)
       '@rollup/plugin-node-resolve':
         specifier: ^15.3.0
         version: 15.3.0(rollup@4.22.4)
@@ -150,9 +150,6 @@ importers:
       '@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))
-      nodemon:
-        specifier: ^3.0.3
-        version: 3.0.3
       polka:
         specifier: ^1.0.0-next.25
         version: 1.0.0-next.25
@@ -279,7 +276,7 @@ importers:
         version: link:../../packages/svelte
       svelte-check:
         specifier: ^4.0.0
-        version: 4.0.1(svelte@packages+svelte)(typescript@5.5.4)
+        version: 4.0.1(picomatch@4.0.2)(svelte@packages+svelte)(typescript@5.5.4)
       typescript:
         specifier: ^5.5.4
         version: 5.5.4
@@ -719,8 +716,8 @@ packages:
   '@rollup/browser@3.29.4':
     resolution: {integrity: sha512-qkWkilNBn+90/9Xn2stuwFpXYhG/mZVPlDkTIPdQSEtJES0NS4o4atceEqeGeHOjQREY2jaIv7ld3IajA/Bmfw==}
 
-  '@rollup/plugin-commonjs@28.0.0':
-    resolution: {integrity: sha512-BJcu+a+Mpq476DMXG+hevgPSl56bkUoi88dKT8t3RyUp8kGuOh+2bU8Gs7zXDlu+fyZggnJ+iOBGrb/O1SorYg==}
+  '@rollup/plugin-commonjs@28.0.1':
+    resolution: {integrity: sha512-+tNWdlWKbpB3WgBN7ijjYkq9X5uhjmcvyjEght4NmH5fAU++zfQzAJ6wumLS+dNcvwEZhKx2Z+skY8m7v0wGSA==}
     engines: {node: '>=16.0.0 || 14 >= 14.17'}
     peerDependencies:
       rollup: ^2.68.0||^3.0.0||^4.0.0
@@ -1239,7 +1236,7 @@ packages:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
   concat-map@0.0.1:
-    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+    resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
 
   console-control-strings@1.1.0:
     resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==}
@@ -1651,10 +1648,6 @@ packages:
   graphemer@1.4.0:
     resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
 
-  has-flag@3.0.0:
-    resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==}
-    engines: {node: '>=4'}
-
   has-flag@4.0.0:
     resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
     engines: {node: '>=8'}
@@ -1700,9 +1693,6 @@ packages:
     resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
     engines: {node: '>=0.10.0'}
 
-  ignore-by-default@1.0.1:
-    resolution: {integrity: sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==}
-
   ignore-walk@5.0.1:
     resolution: {integrity: sha512-yemi4pMf51WKT7khInJqAvsIGzoqYXblnsz0ql8tM+yi1EKYTY1evX4NAbJrLL/Aanr2HyZeluqU+Oi7MGHokw==}
     engines: {node: ^12.13.0 || ^14.15.0 || >=16.0.0}
@@ -2070,15 +2060,6 @@ packages:
     resolution: {integrity: sha512-u6fs2AEUljNho3EYTJNBfImO5QTo/J/1Etd+NVdCj7qWKUSN/bSLkZwhDv7I+w/MSC6qJ4cknepkAYykDdK8og==}
     hasBin: true
 
-  nodemon@3.0.3:
-    resolution: {integrity: sha512-7jH/NXbFPxVaMwmBCC2B9F/V6X1VkEdNgx3iu9jji8WxWcvhMWkmhNWhI5077zknOnZnBzba9hZP6bCPJLSReQ==}
-    engines: {node: '>=10'}
-    hasBin: true
-
-  nopt@1.0.10:
-    resolution: {integrity: sha512-NWmpvLSqUrgrAC9HCuxEvb+PSloHpqVu+FqcO4eeF2h5qYRhA7ev6KvelyQAKtegUbC6RypJnlEOhd8vloNKYg==}
-    hasBin: true
-
   nopt@5.0.0:
     resolution: {integrity: sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==}
     engines: {node: '>=6'}
@@ -2223,6 +2204,10 @@ packages:
     resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
     engines: {node: '>=8.6'}
 
+  picomatch@4.0.2:
+    resolution: {integrity: sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==}
+    engines: {node: '>=12'}
+
   pify@4.0.1:
     resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
     engines: {node: '>=6'}
@@ -2299,9 +2284,6 @@ packages:
   psl@1.9.0:
     resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
 
-  pstree.remy@1.1.8:
-    resolution: {integrity: sha512-77DZwxQmxKnu3aR542U+X8FypNzbfJ+C5XQDk3uWjWxn6151aIMGthWYRXTqT1E5oJvg+ljaa2OJi+VfvCOQ8w==}
-
   publint@0.2.7:
     resolution: {integrity: sha512-tLU4ee3110BxWfAmCZggJmCUnYWgPTr0QLnx08sqpLYa8JHRiOudd+CgzdpfU5x5eOaW2WMkpmOrFshRFYK7Mw==}
     engines: {node: '>=16'}
@@ -2462,10 +2444,6 @@ packages:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
 
-  simple-update-notifier@2.0.0:
-    resolution: {integrity: sha512-a2B9Y0KlNXl9u/vsW6sTIu9vGEpfKu2wRV6l1H3XEas/0gUIzGzBoP/IouTcUQbm9JWZLH3COxyn03TYlFax6w==}
-    engines: {node: '>=10'}
-
   sirv@2.0.4:
     resolution: {integrity: sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==}
     engines: {node: '>= 10'}
@@ -2542,10 +2520,6 @@ packages:
   style-mod@4.1.2:
     resolution: {integrity: sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==}
 
-  supports-color@5.5.0:
-    resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
-    engines: {node: '>=4'}
-
   supports-color@7.2.0:
     resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
     engines: {node: '>=8'}
@@ -2643,10 +2617,6 @@ packages:
     resolution: {integrity: sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==}
     engines: {node: '>=6'}
 
-  touch@3.1.0:
-    resolution: {integrity: sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==}
-    hasBin: true
-
   tough-cookie@4.1.4:
     resolution: {integrity: sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==}
     engines: {node: '>=6'}
@@ -2686,9 +2656,6 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
-  undefsafe@2.0.5:
-    resolution: {integrity: sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==}
-
   undici-types@5.26.5:
     resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
 
@@ -3249,7 +3216,7 @@ snapshots:
   '@eslint/config-array@0.18.0':
     dependencies:
       '@eslint/object-schema': 2.1.4
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       minimatch: 3.1.2
     transitivePeerDependencies:
       - supports-color
@@ -3257,7 +3224,7 @@ snapshots:
   '@eslint/eslintrc@3.1.0':
     dependencies:
       ajv: 6.12.6
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       espree: 10.1.0
       globals: 14.0.0
       ignore: 5.3.2
@@ -3434,15 +3401,15 @@ snapshots:
 
   '@rollup/browser@3.29.4': {}
 
-  '@rollup/plugin-commonjs@28.0.0(rollup@4.22.4)':
+  '@rollup/plugin-commonjs@28.0.1(rollup@4.22.4)':
     dependencies:
       '@rollup/pluginutils': 5.1.0(rollup@4.22.4)
       commondir: 1.0.1
       estree-walker: 2.0.2
-      fdir: 6.3.0(picomatch@2.3.1)
+      fdir: 6.3.0(picomatch@4.0.2)
       is-reference: 1.2.1
       magic-string: 0.30.11
-      picomatch: 2.3.1
+      picomatch: 4.0.2
     optionalDependencies:
       rollup: 4.22.4
 
@@ -3586,7 +3553,7 @@ snapshots:
   '@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))
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       svelte: link:packages/svelte
       vite: 5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
     transitivePeerDependencies:
@@ -3595,7 +3562,7 @@ snapshots:
   '@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))':
     dependencies:
       '@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))
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       deepmerge: 4.3.1
       kleur: 4.1.5
       magic-string: 0.30.11
@@ -3661,7 +3628,7 @@ snapshots:
       '@typescript-eslint/types': 8.2.0
       '@typescript-eslint/typescript-estree': 8.2.0(typescript@5.5.4)
       '@typescript-eslint/visitor-keys': 8.2.0
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       eslint: 9.9.1
     optionalDependencies:
       typescript: 5.5.4
@@ -3677,7 +3644,7 @@ snapshots:
     dependencies:
       '@typescript-eslint/typescript-estree': 8.2.0(typescript@5.5.4)
       '@typescript-eslint/utils': 8.2.0(eslint@9.9.1)(typescript@5.5.4)
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       ts-api-utils: 1.3.0(typescript@5.5.4)
     optionalDependencies:
       typescript: 5.5.4
@@ -3691,7 +3658,7 @@ snapshots:
     dependencies:
       '@typescript-eslint/types': 8.2.0
       '@typescript-eslint/visitor-keys': 8.2.0
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       globby: 11.1.0
       is-glob: 4.0.3
       minimatch: 9.0.5
@@ -3721,20 +3688,20 @@ snapshots:
   '@typescript/twoslash@3.1.0':
     dependencies:
       '@typescript/vfs': 1.3.5
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       lz-string: 1.5.0
     transitivePeerDependencies:
       - supports-color
 
   '@typescript/vfs@1.3.4':
     dependencies:
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
   '@typescript/vfs@1.3.5':
     dependencies:
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
@@ -3765,7 +3732,7 @@ snapshots:
     dependencies:
       '@ampproject/remapping': 2.3.0
       '@bcoe/v8-coverage': 0.2.3
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       istanbul-lib-coverage: 3.2.2
       istanbul-lib-report: 3.0.1
       istanbul-lib-source-maps: 5.0.6
@@ -3830,13 +3797,13 @@ snapshots:
 
   agent-base@6.0.2:
     dependencies:
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
   agent-base@7.1.1:
     dependencies:
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
@@ -4022,11 +3989,9 @@ snapshots:
 
   dataloader@1.4.0: {}
 
-  debug@4.3.6(supports-color@5.5.0):
+  debug@4.3.6:
     dependencies:
       ms: 2.1.2
-    optionalDependencies:
-      supports-color: 5.5.0
 
   decimal.js@10.4.3: {}
 
@@ -4159,7 +4124,7 @@ snapshots:
     dependencies:
       '@eslint-community/eslint-utils': 4.4.0(eslint@9.9.1)
       '@jridgewell/sourcemap-codec': 1.5.0
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       eslint: 9.9.1
       eslint-compat-utils: 0.5.1(eslint@9.9.1)
       esutils: 2.0.3
@@ -4203,7 +4168,7 @@ snapshots:
       ajv: 6.12.6
       chalk: 4.1.2
       cross-spawn: 7.0.3
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       escape-string-regexp: 4.0.0
       eslint-scope: 8.0.2
       eslint-visitor-keys: 4.0.0
@@ -4306,9 +4271,9 @@ snapshots:
     dependencies:
       reusify: 1.0.4
 
-  fdir@6.3.0(picomatch@2.3.1):
+  fdir@6.3.0(picomatch@4.0.2):
     optionalDependencies:
-      picomatch: 2.3.1
+      picomatch: 4.0.2
 
   fenceparser@1.1.1: {}
 
@@ -4457,8 +4422,6 @@ snapshots:
 
   graphemer@1.4.0: {}
 
-  has-flag@3.0.0: {}
-
   has-flag@4.0.0: {}
 
   has-unicode@2.0.1: {}
@@ -4476,21 +4439,21 @@ snapshots:
   http-proxy-agent@7.0.2:
     dependencies:
       agent-base: 7.1.1
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
   https-proxy-agent@5.0.1:
     dependencies:
       agent-base: 6.0.2
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
   https-proxy-agent@7.0.5:
     dependencies:
       agent-base: 7.1.1
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
     transitivePeerDependencies:
       - supports-color
 
@@ -4506,8 +4469,6 @@ snapshots:
     dependencies:
       safer-buffer: 2.1.2
 
-  ignore-by-default@1.0.1: {}
-
   ignore-walk@5.0.1:
     dependencies:
       minimatch: 5.1.6
@@ -4596,7 +4557,7 @@ snapshots:
   istanbul-lib-source-maps@5.0.6:
     dependencies:
       '@jridgewell/trace-mapping': 0.3.25
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       istanbul-lib-coverage: 3.2.2
     transitivePeerDependencies:
       - supports-color
@@ -4833,23 +4794,6 @@ snapshots:
 
   node-gyp-build@4.8.0: {}
 
-  nodemon@3.0.3:
-    dependencies:
-      chokidar: 3.5.3
-      debug: 4.3.6(supports-color@5.5.0)
-      ignore-by-default: 1.0.1
-      minimatch: 3.1.2
-      pstree.remy: 1.1.8
-      semver: 7.6.3
-      simple-update-notifier: 2.0.0
-      supports-color: 5.5.0
-      touch: 3.1.0
-      undefsafe: 2.0.5
-
-  nopt@1.0.10:
-    dependencies:
-      abbrev: 1.1.1
-
   nopt@5.0.0:
     dependencies:
       abbrev: 1.1.1
@@ -4975,6 +4919,8 @@ snapshots:
 
   picomatch@2.3.1: {}
 
+  picomatch@4.0.2: {}
+
   pify@4.0.1: {}
 
   playwright-core@1.46.1: {}
@@ -5031,8 +4977,6 @@ snapshots:
 
   psl@1.9.0: {}
 
-  pstree.remy@1.1.8: {}
-
   publint@0.2.7:
     dependencies:
       npm-packlist: 5.1.3
@@ -5196,10 +5140,6 @@ snapshots:
 
   signal-exit@4.1.0: {}
 
-  simple-update-notifier@2.0.0:
-    dependencies:
-      semver: 7.6.3
-
   sirv@2.0.4:
     dependencies:
       '@polka/url': 1.0.0-next.25
@@ -5270,21 +5210,17 @@ snapshots:
 
   style-mod@4.1.2: {}
 
-  supports-color@5.5.0:
-    dependencies:
-      has-flag: 3.0.0
-
   supports-color@7.2.0:
     dependencies:
       has-flag: 4.0.0
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  svelte-check@4.0.1(svelte@packages+svelte)(typescript@5.5.4):
+  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@2.3.1)
+      fdir: 6.3.0(picomatch@4.0.2)
       picocolors: 1.1.0
       sade: 1.8.1
       svelte: link:packages/svelte
@@ -5365,10 +5301,6 @@ snapshots:
 
   totalist@3.0.1: {}
 
-  touch@3.1.0:
-    dependencies:
-      nopt: 1.0.10
-
   tough-cookie@4.1.4:
     dependencies:
       psl: 1.9.0
@@ -5407,8 +5339,6 @@ snapshots:
 
   typescript@5.5.4: {}
 
-  undefsafe@2.0.5: {}
-
   undici-types@5.26.5: {}
 
   universalify@0.1.2: {}
@@ -5433,7 +5363,7 @@ snapshots:
   vite-node@2.0.5(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0):
     dependencies:
       cac: 6.7.14
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       pathe: 1.1.2
       tinyrainbow: 1.2.0
       vite: 5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
@@ -5452,7 +5382,7 @@ snapshots:
     dependencies:
       '@antfu/utils': 0.7.8
       '@rollup/pluginutils': 5.1.0(rollup@4.22.4)
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       error-stack-parser-es: 0.1.1
       fs-extra: 11.2.0
       open: 10.1.0
@@ -5490,7 +5420,7 @@ snapshots:
       '@vitest/spy': 2.0.5
       '@vitest/utils': 2.0.5
       chai: 5.1.1
-      debug: 4.3.6(supports-color@5.5.0)
+      debug: 4.3.6
       execa: 8.0.1
       magic-string: 0.30.11
       pathe: 1.1.2

From 19d80ad63c545bff2b84d29563cfab8e63b5bf68 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 26 Nov 2024 22:30:21 +0100
Subject: [PATCH 209/404] fix: css pruning producing invalid css (#14448)

* fix: css pruning producing invalid css

* Update .changeset/big-hats-wonder.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/big-hats-wonder.md                 |   5 +
 .../compiler/phases/3-transform/css/index.js  |  18 +-
 .../svelte/tests/css/samples/has/expected.css |   2 +-
 .../unused-selector-in-between/expected.css   |   2 +-
 .../unused-selector-leading/expected.css      |   2 +-
 .../unused-selector-multiple/_config.js       | 160 ++++++++++++++++++
 .../unused-selector-multiple/expected.css     |  15 ++
 .../unused-selector-multiple/input.svelte     |  20 +++
 8 files changed, 211 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/big-hats-wonder.md
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-multiple/_config.js
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-multiple/expected.css
 create mode 100644 packages/svelte/tests/css/samples/unused-selector-multiple/input.svelte

diff --git a/.changeset/big-hats-wonder.md b/.changeset/big-hats-wonder.md
new file mode 100644
index 0000000000..bc2e352ffb
--- /dev/null
+++ b/.changeset/big-hats-wonder.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly remove unused selectors in middle of selector lists
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 d1f3d3baa6..c1175e4b5b 100644
--- a/packages/svelte/src/compiler/phases/3-transform/css/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/css/index.js
@@ -200,6 +200,7 @@ const visitors = {
 			let pruning = false;
 			let prune_start = children[0].start;
 			let last = prune_start;
+			let has_previous_used = false;
 
 			for (let i = 0; i < children.length; i += 1) {
 				const selector = children[i];
@@ -210,9 +211,9 @@ const visitors = {
 						while (state.code.original[i] !== ',') i--;
 
 						if (state.minify) {
-							state.code.remove(prune_start, i + 1);
+							state.code.remove(prune_start, has_previous_used ? i : i + 1);
 						} else {
-							state.code.overwrite(i, i + 1, '*/');
+							state.code.appendRight(has_previous_used ? i : i + 1, '*/');
 						}
 					} else {
 						if (i === 0) {
@@ -222,17 +223,10 @@ const visitors = {
 								state.code.prependRight(selector.start, '/* (unused) ');
 							}
 						} else {
-							// If this is not the last selector add a separator
-							const separator = i !== children.length - 1 ? ',' : '';
-
 							if (state.minify) {
 								prune_start = last;
-								if (separator) {
-									while (state.code.original[prune_start - 1] !== ',') prune_start++;
-									state.code.update(last, prune_start, separator);
-								}
 							} else {
-								state.code.overwrite(last, selector.start, `${separator} /* (unused) `);
+								state.code.overwrite(last, selector.start, ` /* (unused) `);
 							}
 						}
 					}
@@ -240,6 +234,10 @@ const visitors = {
 					pruning = !pruning;
 				}
 
+				if (!pruning && selector.metadata.used) {
+					has_previous_used = true;
+				}
+
 				last = selector.end;
 			}
 
diff --git a/packages/svelte/tests/css/samples/has/expected.css b/packages/svelte/tests/css/samples/has/expected.css
index 8eda676f93..68d6aad68a 100644
--- a/packages/svelte/tests/css/samples/has/expected.css
+++ b/packages/svelte/tests/css/samples/has/expected.css
@@ -75,7 +75,7 @@
 	/* (unused) .unused x:has(y) {
 		color: red;
 	}*/
-	/* (unused) .unused:has(.unused)*/ x.svelte-xyz:has(y:where(.svelte-xyz)) {
+	/* (unused) .unused:has(.unused),*/ x.svelte-xyz:has(y:where(.svelte-xyz)) {
 		color: green;
 	}
 
diff --git a/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css b/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
index 5a93aa53b7..43db50b0fe 100644
--- a/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
+++ b/packages/svelte/tests/css/samples/unused-selector-in-between/expected.css
@@ -1,7 +1,7 @@
 
 	h1.svelte-xyz,
 	h2.svelte-xyz,
-	h3.svelte-xyz, /* (unused) h4*/
+	h3.svelte-xyz /* (unused) h4*/,
 	p.svelte-xyz {
 		color: red;
 	}
diff --git a/packages/svelte/tests/css/samples/unused-selector-leading/expected.css b/packages/svelte/tests/css/samples/unused-selector-leading/expected.css
index 61245348fb..1a5b5d6591 100644
--- a/packages/svelte/tests/css/samples/unused-selector-leading/expected.css
+++ b/packages/svelte/tests/css/samples/unused-selector-leading/expected.css
@@ -1,3 +1,3 @@
-	/* (unused) .foo*/ .bar.svelte-xyz /* (unused) .baz*/ {
+	/* (unused) .foo,*/ .bar.svelte-xyz /* (unused) .baz*/ {
 		color: red;
 	}
diff --git a/packages/svelte/tests/css/samples/unused-selector-multiple/_config.js b/packages/svelte/tests/css/samples/unused-selector-multiple/_config.js
new file mode 100644
index 0000000000..1239fe2e35
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-multiple/_config.js
@@ -0,0 +1,160 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'a11y_missing_content',
+			message: '`<h1>` element should contain text',
+			start: {
+				line: 1,
+				column: 0,
+				character: 0
+			},
+			end: {
+				line: 1,
+				column: 9,
+				character: 9
+			}
+		},
+		{
+			code: 'a11y_missing_content',
+			message: '`<h4>` element should contain text',
+			start: {
+				line: 2,
+				column: 0,
+				character: 10
+			},
+			end: {
+				line: 2,
+				column: 9,
+				character: 19
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h2"',
+			start: {
+				line: 6,
+				column: 5,
+				character: 35
+			},
+			end: {
+				line: 6,
+				column: 7,
+				character: 37
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h3"',
+			start: {
+				line: 6,
+				column: 9,
+				character: 39
+			},
+			end: {
+				line: 6,
+				column: 11,
+				character: 41
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h2"',
+			start: {
+				line: 9,
+				column: 5,
+				character: 66
+			},
+			end: {
+				line: 9,
+				column: 7,
+				character: 68
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h2"',
+			start: {
+				line: 13,
+				column: 5,
+				character: 110
+			},
+			end: {
+				line: 13,
+				column: 7,
+				character: 112
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h3"',
+			start: {
+				line: 13,
+				column: 9,
+				character: 114
+			},
+			end: {
+				line: 13,
+				column: 11,
+				character: 116
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h2"',
+			start: {
+				line: 17,
+				column: 5,
+				character: 161
+			},
+			end: {
+				line: 17,
+				column: 7,
+				character: 163
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h3"',
+			start: {
+				line: 17,
+				column: 9,
+				character: 165
+			},
+			end: {
+				line: 17,
+				column: 11,
+				character: 167
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h5"',
+			start: {
+				line: 17,
+				column: 17,
+				character: 173
+			},
+			end: {
+				line: 17,
+				column: 19,
+				character: 175
+			}
+		},
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "h6"',
+			start: {
+				line: 17,
+				column: 21,
+				character: 177
+			},
+			end: {
+				line: 17,
+				column: 23,
+				character: 179
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/unused-selector-multiple/expected.css b/packages/svelte/tests/css/samples/unused-selector-multiple/expected.css
new file mode 100644
index 0000000000..78ddf12fec
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-multiple/expected.css
@@ -0,0 +1,15 @@
+
+	h1.svelte-xyz /* (unused) h2, h3*/ {
+		color: red;
+	}
+	h1.svelte-xyz /* (unused) h2*/ {
+		text-decoration: underline;
+	}
+
+	h1.svelte-xyz /* (unused) h2, h3*/, h4.svelte-xyz {
+		text-transform: uppercase;
+	}
+
+	h1.svelte-xyz /* (unused) h2, h3*/, h4.svelte-xyz /* (unused) h5, h6*/ {
+		background-color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/unused-selector-multiple/input.svelte b/packages/svelte/tests/css/samples/unused-selector-multiple/input.svelte
new file mode 100644
index 0000000000..b5bdb16420
--- /dev/null
+++ b/packages/svelte/tests/css/samples/unused-selector-multiple/input.svelte
@@ -0,0 +1,20 @@
+<h1></h1>
+<h4></h4>
+
+
+<style>
+	h1, h2, h3 {
+		color: red;
+	}
+	h1, h2 {
+		text-decoration: underline;
+	}
+
+	h1, h2, h3, h4 {
+		text-transform: uppercase;
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		background-color: green;
+	}
+</style>

From e9ff665bead20d84df4464526a026b2070f3278a Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 27 Nov 2024 11:55:08 -0500
Subject: [PATCH 210/404] chore: minor css-prune.js tweaks (#14457)

---
 .../phases/2-analyze/css/css-prune.js         | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

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 dec85c0361..583b2c9f2d 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
@@ -141,16 +141,12 @@ function get_relative_selectors(node) {
 
 		// nesting could be inside pseudo classes like :is, :has or :where
 		for (let selector of selectors) {
-			walk(
-				selector,
-				{},
-				{
-					// @ts-ignore
-					NestingSelector() {
-						has_explicit_nesting_selector = true;
-					}
+			walk(selector, null, {
+				// @ts-ignore
+				NestingSelector() {
+					has_explicit_nesting_selector = true;
 				}
-			);
+			});
 			// if we found one we can break from the others
 			if (has_explicit_nesting_selector) break;
 		}
@@ -881,17 +877,17 @@ function get_element_parent(node) {
 }
 
 /**
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} node
  * @param {boolean} adjacent_only
  * @returns {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>}
  */
-function get_possible_element_siblings(element, adjacent_only) {
+function get_possible_element_siblings(node, adjacent_only) {
 	/** @type {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>} */
 	const result = new Map();
-	const path = element.metadata.path;
+	const path = node.metadata.path;
 
 	/** @type {Compiler.SvelteNode} */
-	let current = element;
+	let current = node;
 
 	let i = path.length;
 

From 41e47a4c001928bc03f0deda1e2b6e861872089e Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Wed, 27 Nov 2024 16:39:52 -0800
Subject: [PATCH 211/404] chore: upgrade esm-env for Vite 6 support (#14460)

* chore: upgrade esm-env for Vite 6 support

* dedupe

---------

Co-authored-by: Conduitry <git@chor.date>
---
 .changeset/healthy-drinks-compete.md |  5 +++++
 packages/svelte/package.json         |  2 +-
 pnpm-lock.yaml                       | 18 +++++++++---------
 3 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/healthy-drinks-compete.md

diff --git a/.changeset/healthy-drinks-compete.md b/.changeset/healthy-drinks-compete.md
new file mode 100644
index 0000000000..80edab0171
--- /dev/null
+++ b/.changeset/healthy-drinks-compete.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: upgrade esm-env for Vite 6 support
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 61f2ec2d54..5bf1863bc4 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -142,7 +142,7 @@
     "acorn-typescript": "^1.4.13",
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
-    "esm-env": "^1.0.0",
+    "esm-env": "^1.2.0",
     "esrap": "^1.2.2",
     "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 261a82f300..2556f0c100 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -81,8 +81,8 @@ importers:
         specifier: ^4.1.0
         version: 4.1.0
       esm-env:
-        specifier: ^1.0.0
-        version: 1.0.0
+        specifier: ^1.2.0
+        version: 1.2.0
       esrap:
         specifier: ^1.2.2
         version: 1.2.2
@@ -224,7 +224,7 @@ importers:
         version: 6.0.1(@lezer/common@1.2.1)
       esm-env:
         specifier: ^1.0.0
-        version: 1.0.0
+        version: 1.2.0
       marked:
         specifier: ^7.0.2
         version: 7.0.5
@@ -1236,7 +1236,7 @@ packages:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
   concat-map@0.0.1:
-    resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
+    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
 
   console-control-strings@1.1.0:
     resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==}
@@ -1442,8 +1442,8 @@ packages:
       jiti:
         optional: true
 
-  esm-env@1.0.0:
-    resolution: {integrity: sha512-Cf6VksWPsTuW01vU9Mk/3vRue91Zevka5SjyNf3nEpokFRuqt/KjUQoGAwq9qMmhpLTHmXzSIrFRw8zxWzmFBA==}
+  esm-env@1.2.0:
+    resolution: {integrity: sha512-OhSQuHL3mUcaQHjGe8UMG8GsJIJHYYz0flR0h9fiTPNMupLMkb7TvcRD0EeJXW5a8GHBgfz08b6FDLNK7kkPQA==}
 
   espree@10.1.0:
     resolution: {integrity: sha512-M1M6CpiE6ffoigIOWYO9UDP8TMUw9kqb21tf+08IgDYjCsOvCuDt4jQcZmoYxx+w7zlKw9/N0KXfto+I8/FrXA==}
@@ -3531,7 +3531,7 @@ snapshots:
       '@types/cookie': 0.6.0
       cookie: 0.6.0
       devalue: 5.1.1
-      esm-env: 1.0.0
+      esm-env: 1.2.0
       import-meta-resolve: 4.1.0
       kleur: 4.1.5
       magic-string: 0.30.11
@@ -3546,7 +3546,7 @@ snapshots:
   '@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.0.0
+      esm-env: 1.2.0
       svelte: link:packages/svelte
       svelte-persisted-store: 0.9.2(svelte@packages+svelte)
 
@@ -4194,7 +4194,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  esm-env@1.0.0: {}
+  esm-env@1.2.0: {}
 
   espree@10.1.0:
     dependencies:

From d6fc176fcb2f1685e762febf88e52a8f63aecb4c Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Thu, 28 Nov 2024 01:41:36 +0100
Subject: [PATCH 212/404] fix: strip exported TypeScript function overloads
 (#14458)

fixes #14455
---
 .changeset/shy-starfishes-type.md                           | 5 +++++
 .../src/compiler/phases/1-parse/remove_typescript_nodes.js  | 6 +++++-
 .../tests/runtime-runes/samples/typescript/main.svelte      | 4 ++++
 3 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/shy-starfishes-type.md

diff --git a/.changeset/shy-starfishes-type.md b/.changeset/shy-starfishes-type.md
new file mode 100644
index 0000000000..e6c5bf51da
--- /dev/null
+++ b/.changeset/shy-starfishes-type.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: strip exported TypeScript function overloads
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index 36a25f5124..8db29ab067 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -36,7 +36,11 @@ const visitors = {
 		if (node.exportKind === 'type') return b.empty;
 
 		if (node.declaration) {
-			return context.next();
+			const result = context.next();
+			if (result?.declaration?.type === 'EmptyStatement') {
+				return b.empty;
+			}
+			return result;
 		}
 
 		if (node.specifiers) {
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index 71638688f2..8a3db5dead 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -27,6 +27,10 @@
 		export type Foo = true
 	}
 
+	export function overload(a: boolean): boolean;
+	export function overload(b: string): number;
+	export function overload(c: any): any {}
+
 	export type { Hello };
 </script>
 

From dcef8ff45a91537f5f90fe95c7845b8cb2a0dc27 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 27 Nov 2024 19:47:28 -0500
Subject: [PATCH 213/404] Version Packages (#14451)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/big-hats-wonder.md        |  5 -----
 .changeset/healthy-drinks-compete.md |  5 -----
 .changeset/shy-starfishes-type.md    |  5 -----
 packages/svelte/CHANGELOG.md         | 10 ++++++++++
 packages/svelte/package.json         |  2 +-
 packages/svelte/src/version.js       |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/big-hats-wonder.md
 delete mode 100644 .changeset/healthy-drinks-compete.md
 delete mode 100644 .changeset/shy-starfishes-type.md

diff --git a/.changeset/big-hats-wonder.md b/.changeset/big-hats-wonder.md
deleted file mode 100644
index bc2e352ffb..0000000000
--- a/.changeset/big-hats-wonder.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly remove unused selectors in middle of selector lists
diff --git a/.changeset/healthy-drinks-compete.md b/.changeset/healthy-drinks-compete.md
deleted file mode 100644
index 80edab0171..0000000000
--- a/.changeset/healthy-drinks-compete.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: upgrade esm-env for Vite 6 support
diff --git a/.changeset/shy-starfishes-type.md b/.changeset/shy-starfishes-type.md
deleted file mode 100644
index e6c5bf51da..0000000000
--- a/.changeset/shy-starfishes-type.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: strip exported TypeScript function overloads
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 13c67caa84..f1694a58fb 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.2.10
+
+### Patch Changes
+
+- fix: correctly remove unused selectors in middle of selector lists ([#14448](https://github.com/sveltejs/svelte/pull/14448))
+
+- chore: upgrade esm-env for Vite 6 support ([#14460](https://github.com/sveltejs/svelte/pull/14460))
+
+- fix: strip exported TypeScript function overloads ([#14458](https://github.com/sveltejs/svelte/pull/14458))
+
 ## 5.2.9
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 5bf1863bc4..cf679a0e34 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.2.9",
+  "version": "5.2.10",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 4fabe40a59..ecc9de1a4a 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.2.9';
+export const VERSION = '5.2.10';
 export const PUBLIC_VERSION = '5';

From c4ac0e01e75eb20e99f6a31e974c6bc5b5f00dc7 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 28 Nov 2024 07:02:18 -0500
Subject: [PATCH 214/404] fix: better account for render tags when pruning CSS
 (#14456)

Fixes #14399

Add a mechanism to connect render tags to snippets to know where to walk when coming across render tags

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/twelve-squids-wink.md              |   5 +
 .../src/compiler/phases/1-parse/state/tag.js  |   8 +-
 .../phases/2-analyze/css/css-prune.js         | 270 +++++++-----------
 .../compiler/phases/2-analyze/css/utils.js    |  11 +-
 .../src/compiler/phases/2-analyze/index.js    |  16 +-
 .../phases/2-analyze/visitors/RenderTag.js    |  19 +-
 .../phases/2-analyze/visitors/SnippetBlock.js |   2 +
 .../2-analyze/visitors/shared/component.js    |  51 ++++
 .../2-analyze/visitors/shared/snippets.js     |  17 ++
 .../svelte/src/compiler/phases/types.d.ts     |  13 +-
 .../svelte/src/compiler/types/template.d.ts   |  21 ++
 .../css/samples/child-combinator/expected.css |   2 +-
 .../samples/dynamic-element-tag/expected.css  |   2 +-
 .../expected.css                              |   4 +
 .../input.svelte                              |  13 +
 .../_config.js                                |  22 +-
 .../expected.css                              |  13 +-
 .../input.svelte                              |  12 +-
 .../expected.css                              |   2 +-
 .../expected.html                             |   2 +-
 .../general-siblings-combinator/expected.css  |   2 +-
 .../samples/has-with-render-tag/_config.js    |  20 ++
 .../samples/has-with-render-tag/expected.css  |  11 +
 .../samples/has-with-render-tag/input.svelte  |  26 ++
 .../Child.svelte                              |   5 +
 .../expected.css                              |   4 +
 .../input.svelte                              |  15 +
 .../Child.svelte                              |   5 +
 .../expected.css                              |   4 +
 .../input.svelte                              |  17 ++
 .../expected.css                              |   4 +
 .../input.svelte                              |  13 +
 .../expected.css                              |   4 +
 .../input.svelte                              |  13 +
 .../Child.svelte                              |   1 +
 .../expected.css                              |   4 +
 .../input.svelte                              |  15 +
 .../siblings-combinator-slot/_config.js       |  10 +-
 .../siblings-combinator-slot/expected.css     |   7 +-
 .../siblings-combinator-slot/input.svelte     |   6 +-
 .../siblings-combinator-star/expected.css     |   2 +-
 .../siblings-combinator-star/expected.html    |   2 +-
 .../samples/siblings-combinator/expected.css  |   2 +-
 .../tests/css/samples/snippets/_config.js     |  18 +-
 .../tests/css/samples/snippets/expected.css   |   6 +-
 .../tests/css/samples/snippets/input.svelte   |   4 +-
 46 files changed, 493 insertions(+), 232 deletions(-)
 create mode 100644 .changeset/twelve-squids-wink.md
 create mode 100644 packages/svelte/src/compiler/phases/2-analyze/visitors/shared/snippets.js
 create mode 100644 packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/expected.css
 create mode 100644 packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/has-with-render-tag/_config.js
 create mode 100644 packages/svelte/tests/css/samples/has-with-render-tag/expected.css
 create mode 100644 packages/svelte/tests/css/samples/has-with-render-tag/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/Child.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/Child.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-render-tag/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-render-tag/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/Child.svelte
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/expected.css
 create mode 100644 packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/input.svelte

diff --git a/.changeset/twelve-squids-wink.md b/.changeset/twelve-squids-wink.md
new file mode 100644
index 0000000000..0fde3dfb86
--- /dev/null
+++ b/.changeset/twelve-squids-wink.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: better account for render tags when pruning CSS
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 1632099c29..3366c9ec97 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -314,7 +314,10 @@ function open(parser) {
 				name
 			},
 			parameters: function_expression.params,
-			body: create_fragment()
+			body: create_fragment(),
+			metadata: {
+				sites: new Set()
+			}
 		});
 		parser.stack.push(block);
 		parser.fragments.push(block.body);
@@ -605,7 +608,8 @@ function special(parser) {
 			metadata: {
 				dynamic: false,
 				args_with_call_expression: new Set(),
-				path: []
+				path: [],
+				snippets: new Set()
 			}
 		});
 	}
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 583b2c9f2d..0c38114a30 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
@@ -1,16 +1,9 @@
-/** @import { Visitors } from 'zimmerframe' */
 /** @import * as Compiler from '#compiler' */
 import { walk } from 'zimmerframe';
 import { get_parent_rules, get_possible_values, is_outer_global } from './utils.js';
 import { regex_ends_with_whitespace, regex_starts_with_whitespace } from '../../patterns.js';
 import { get_attribute_chunks, is_text_attribute } from '../../../utils/ast.js';
 
-/**
- * @typedef {{
- *   element: Compiler.AST.RegularElement | Compiler.AST.SvelteElement;
- *   from_render_tag: boolean;
- * }} State
- */
 /** @typedef {NODE_PROBABLY_EXISTS | NODE_DEFINITELY_EXISTS} NodeExistsValue */
 
 const NODE_PROBABLY_EXISTS = 0;
@@ -53,78 +46,32 @@ const nesting_selector = {
 /**
  *
  * @param {Compiler.Css.StyleSheet} stylesheet
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag} element
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
  */
 export function prune(stylesheet, element) {
-	if (element.type === 'RenderTag') {
-		const parent = get_element_parent(element);
-		if (!parent) return;
-
-		walk(stylesheet, { element: parent, from_render_tag: true }, visitors);
-	} else {
-		walk(stylesheet, { element, from_render_tag: false }, visitors);
-	}
-}
-
-/** @type {Visitors<Compiler.Css.Node, State>} */
-const visitors = {
-	Rule(node, context) {
-		if (node.metadata.is_global_block) {
-			context.visit(node.prelude);
-		} else {
-			context.next();
-		}
-	},
-	ComplexSelector(node, context) {
-		const selectors = get_relative_selectors(node);
-		const inner = selectors[selectors.length - 1];
-
-		if (context.state.from_render_tag) {
-			// We're searching for a match that crosses a render tag boundary. That means we have to both traverse up
-			// the element tree (to see if we find an entry point) but also remove selectors from the end (assuming
-			// they are part of the render tag we don't see). We do all possible combinations of both until we find a match.
-			/** @type {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null} */
-			let element = context.state.element;
-
-			while (element) {
-				const selectors_to_check = selectors.slice();
-
-				while (selectors_to_check.length > 0) {
-					selectors_to_check.pop();
-
-					if (
-						apply_selector(
-							selectors_to_check,
-							/** @type {Compiler.Css.Rule} */ (node.metadata.rule),
-							element,
-							context.state
-						)
-					) {
-						mark(inner, element);
-						node.metadata.used = true;
-						return;
-					}
-				}
-
-				element = get_element_parent(element);
+	walk(/** @type {Compiler.Css.Node} */ (stylesheet), null, {
+		Rule(node, context) {
+			if (node.metadata.is_global_block) {
+				context.visit(node.prelude);
+			} else {
+				context.next();
+			}
+		},
+		ComplexSelector(node) {
+			const selectors = get_relative_selectors(node);
+
+			if (
+				apply_selector(selectors, /** @type {Compiler.Css.Rule} */ (node.metadata.rule), element)
+			) {
+				node.metadata.used = true;
 			}
-		} else if (
-			apply_selector(
-				selectors,
-				/** @type {Compiler.Css.Rule} */ (node.metadata.rule),
-				context.state.element,
-				context.state
-			)
-		) {
-			mark(inner, context.state.element);
-			node.metadata.used = true;
-		}
 
-		// note: we don't call context.next() here, we only recurse into
-		// selectors that don't belong to rules (i.e. inside `:is(...)` etc)
-		// when we encounter them below
-	}
-};
+			// note: we don't call context.next() here, we only recurse into
+			// selectors that don't belong to rules (i.e. inside `:is(...)` etc)
+			// when we encounter them below
+		}
+	});
+}
 
 /**
  * Retrieves the relative selectors (minus the trailing globals) from a complex selector.
@@ -147,6 +94,7 @@ function get_relative_selectors(node) {
 					has_explicit_nesting_selector = true;
 				}
 			});
+
 			// if we found one we can break from the others
 			if (has_explicit_nesting_selector) break;
 		}
@@ -199,89 +147,63 @@ function truncate(node) {
  * @param {Compiler.Css.RelativeSelector[]} relative_selectors
  * @param {Compiler.Css.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {State} state
  * @returns {boolean}
  */
-function apply_selector(relative_selectors, rule, element, state) {
+function apply_selector(relative_selectors, rule, element) {
 	const parent_selectors = relative_selectors.slice();
 	const relative_selector = parent_selectors.pop();
 
-	if (!relative_selector) return false;
+	const matched =
+		!!relative_selector &&
+		relative_selector_might_apply_to_node(relative_selector, rule, element) &&
+		apply_combinator(relative_selector, parent_selectors, rule, element);
 
-	const possible_match = relative_selector_might_apply_to_node(
-		relative_selector,
-		rule,
-		element,
-		state
-	);
-
-	if (!possible_match) {
-		return false;
-	}
-
-	if (relative_selector.combinator) {
-		return apply_combinator(
-			relative_selector.combinator,
-			relative_selector,
-			parent_selectors,
-			rule,
-			element,
-			state
-		);
-	}
+	if (matched) {
+		if (!is_outer_global(relative_selector)) {
+			relative_selector.metadata.scoped = true;
+		}
 
-	// if this is the left-most non-global selector, mark it — we want
-	// `x y z {...}` to become `x.blah y z.blah {...}`
-	const parent = parent_selectors[parent_selectors.length - 1];
-	if (!parent || is_global(parent, rule)) {
-		mark(relative_selector, element);
+		element.metadata.scoped = true;
 	}
 
-	return true;
+	return matched;
 }
 
 /**
- * @param {Compiler.Css.Combinator} combinator
  * @param {Compiler.Css.RelativeSelector} relative_selector
  * @param {Compiler.Css.RelativeSelector[]} parent_selectors
  * @param {Compiler.Css.Rule} rule
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {State} state
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag | Compiler.AST.Component | Compiler.AST.SvelteComponent | Compiler.AST.SvelteSelf} node
  * @returns {boolean}
  */
-function apply_combinator(combinator, relative_selector, parent_selectors, rule, element, state) {
-	const name = combinator.name;
+function apply_combinator(relative_selector, parent_selectors, rule, node) {
+	if (!relative_selector.combinator) return true;
+
+	const name = relative_selector.combinator.name;
 
 	switch (name) {
 		case ' ':
 		case '>': {
 			let parent_matched = false;
-			let crossed_component_boundary = false;
 
-			const path = element.metadata.path;
+			const path = node.metadata.path;
 			let i = path.length;
 
 			while (i--) {
 				const parent = path[i];
 
-				if (parent.type === 'Component' || parent.type === 'SvelteComponent') {
-					crossed_component_boundary = true;
-				}
-
 				if (parent.type === 'SnippetBlock') {
-					// We assume the snippet might be rendered in a place where the parent selectors match.
-					// (We could do more static analysis and check the render tag reference to see if this snippet block continues
-					// with elements that actually match the selector, but that would be a lot of work for little gain)
-					return true;
+					for (const site of parent.metadata.sites) {
+						if (apply_combinator(relative_selector, parent_selectors, rule, site)) {
+							return true;
+						}
+					}
+
+					return false;
 				}
 
 				if (parent.type === 'RegularElement' || parent.type === 'SvelteElement') {
-					if (apply_selector(parent_selectors, rule, parent, state)) {
-						// TODO the `name === ' '` causes false positives, but removing it causes false negatives...
-						if (name === ' ' || crossed_component_boundary) {
-							mark(parent_selectors[parent_selectors.length - 1], parent);
-						}
-
+					if (apply_selector(parent_selectors, rule, parent)) {
 						parent_matched = true;
 					}
 
@@ -294,7 +216,7 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 
 		case '+':
 		case '~': {
-			const siblings = get_possible_element_siblings(element, name === '+');
+			const siblings = get_possible_element_siblings(node, name === '+');
 
 			let sibling_matched = false;
 
@@ -302,18 +224,16 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 				if (possible_sibling.type === 'RenderTag' || possible_sibling.type === 'SlotElement') {
 					// `{@render foo()}<p>foo</p>` with `:global(.x) + p` is a match
 					if (parent_selectors.length === 1 && parent_selectors[0].metadata.is_global) {
-						mark(relative_selector, element);
 						sibling_matched = true;
 					}
-				} else if (apply_selector(parent_selectors, rule, possible_sibling, state)) {
-					mark(relative_selector, element);
+				} else if (apply_selector(parent_selectors, rule, possible_sibling)) {
 					sibling_matched = true;
 				}
 			}
 
 			return (
 				sibling_matched ||
-				(get_element_parent(element) === null &&
+				(get_element_parent(node) === null &&
 					parent_selectors.every((selector) => is_global(selector, rule)))
 			);
 		}
@@ -324,19 +244,6 @@ function apply_combinator(combinator, relative_selector, parent_selectors, rule,
 	}
 }
 
-/**
- * Mark both the compound selector and the node it selects as encapsulated,
- * for transformation in a later step
- * @param {Compiler.Css.RelativeSelector} relative_selector
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- */
-function mark(relative_selector, element) {
-	if (!is_outer_global(relative_selector)) {
-		relative_selector.metadata.scoped = true;
-	}
-	element.metadata.scoped = true;
-}
-
 /**
  * Returns `true` if the relative selector is global, meaning
  * it's a `:global(...)` or unscopeable selector, or
@@ -388,10 +295,9 @@ const regex_backslash_and_following_character = /\\(.)/g;
  * @param {Compiler.Css.RelativeSelector} relative_selector
  * @param {Compiler.Css.Rule} rule
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} element
- * @param {State} state
- * @returns {boolean  }
+ * @returns {boolean}
  */
-function relative_selector_might_apply_to_node(relative_selector, rule, element, state) {
+function relative_selector_might_apply_to_node(relative_selector, rule, element) {
 	// Sort :has(...) selectors in one bucket and everything else into another
 	const has_selectors = [];
 	const other_selectors = [];
@@ -416,7 +322,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 
 		// If this is a :has inside a global selector, we gotta include the element itself, too,
 		// because the global selector might be for an element that's outside the component (e.g. :root).
-		const rules = [rule, ...get_parent_rules(rule)];
+		const rules = get_parent_rules(rule);
 		const include_self =
 			rules.some((r) => r.prelude.children.some((c) => c.children.some((s) => is_global(s, r)))) ||
 			rules[rules.length - 1].prelude.children.some((c) =>
@@ -429,10 +335,12 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 			descendant_elements.push(element);
 		}
 
-		walk(
-			/** @type {Compiler.SvelteNode} */ (element.fragment),
-			{ is_child: true },
-			{
+		/**
+		 * @param {Compiler.SvelteNode} node
+		 * @param {{ is_child: boolean }} state
+		 */
+		function walk_children(node, state) {
+			walk(node, state, {
 				_(node, context) {
 					if (node.type === 'RegularElement' || node.type === 'SvelteElement') {
 						descendant_elements.push(node);
@@ -445,12 +353,18 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 						} else {
 							context.next();
 						}
+					} else if (node.type === 'RenderTag') {
+						for (const snippet of node.metadata.snippets) {
+							walk_children(snippet.body, context.state);
+						}
 					} else {
 						context.next();
 					}
 				}
-			}
-		);
+			});
+		}
+
+		walk_children(element.fragment, { is_child: true });
 
 		// :has(...) is special in that it means "look downwards in the CSS tree". Since our matching algorithm goes
 		// upwards and back-to-front, we need to first check the selectors inside :has(...), then check the rest of the
@@ -486,7 +400,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 					if (
 						selectors.length === 0 /* is :global(...) */ ||
 						(element.metadata.scoped && selector_matched) ||
-						apply_selector(selectors, rule, element, state)
+						apply_selector(selectors, rule, element)
 					) {
 						complex_selector.metadata.used = true;
 						selector_matched = matched = true;
@@ -516,7 +430,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 				) {
 					const args = selector.args;
 					const complex_selector = args.children[0];
-					return apply_selector(complex_selector.children, rule, element, state);
+					return apply_selector(complex_selector.children, rule, element);
 				}
 
 				// We came across a :global, everything beyond it is global and therefore a potential match
@@ -565,7 +479,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 						if (is_global) {
 							complex_selector.metadata.used = true;
 							matched = true;
-						} else if (apply_selector(relative, rule, element, state)) {
+						} else if (apply_selector(relative, rule, element)) {
 							complex_selector.metadata.used = true;
 							matched = true;
 						} else if (complex_selector.children.length > 1 && (name == 'is' || name == 'where')) {
@@ -649,7 +563,7 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 
 				for (const complex_selector of parent.prelude.children) {
 					if (
-						apply_selector(get_relative_selectors(complex_selector), parent, element, state) ||
+						apply_selector(get_relative_selectors(complex_selector), parent, element) ||
 						complex_selector.children.every((s) => is_global(s, parent))
 					) {
 						complex_selector.metadata.used = true;
@@ -703,17 +617,28 @@ function get_following_sibling_elements(element, include_self) {
 
 	// ...then walk them, starting from the node after the one
 	// containing the element in question
-	for (const node of nodes.slice(nodes.indexOf(start) + 1)) {
+
+	/** @param {Compiler.SvelteNode} node */
+	function get_siblings(node) {
 		walk(node, null, {
 			RegularElement(node) {
 				siblings.push(node);
 			},
 			SvelteElement(node) {
 				siblings.push(node);
+			},
+			RenderTag(node) {
+				for (const snippet of node.metadata.snippets) {
+					get_siblings(snippet.body);
+				}
 			}
 		});
 	}
 
+	for (const node of nodes.slice(nodes.indexOf(start) + 1)) {
+		get_siblings(node);
+	}
+
 	if (include_self) {
 		siblings.push(element);
 	}
@@ -858,7 +783,7 @@ function unquote(str) {
 }
 
 /**
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag} node
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag | Compiler.AST.Component | Compiler.AST.SvelteComponent | Compiler.AST.SvelteSelf} node
  * @returns {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | null}
  */
 function get_element_parent(node) {
@@ -877,7 +802,7 @@ function get_element_parent(node) {
 }
 
 /**
- * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement} node
+ * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag | Compiler.AST.Component | Compiler.AST.SvelteComponent | Compiler.AST.SvelteSelf} node
  * @param {boolean} adjacent_only
  * @returns {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>}
  */
@@ -929,7 +854,28 @@ function get_possible_element_siblings(node, adjacent_only) {
 
 		current = path[i];
 
-		if (!current || !is_block(current)) break;
+		if (!current) break;
+
+		if (
+			current.type === 'Component' ||
+			current.type === 'SvelteComponent' ||
+			current.type === 'SvelteSelf'
+		) {
+			continue;
+		}
+
+		if (current.type === 'SnippetBlock') {
+			for (const site of current.metadata.sites) {
+				const siblings = get_possible_element_siblings(site, adjacent_only);
+				add_to_map(siblings, result);
+
+				if (adjacent_only && current.metadata.sites.size === 1 && has_definite_elements(siblings)) {
+					return result;
+				}
+			}
+		}
+
+		if (!is_block(current)) break;
 
 		if (current.type === 'EachBlock' && fragment === current.body) {
 			// `{#each ...}<a /><b />{/each}` — `<b>` can be previous sibling of `<a />`
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 0226a150c9..07171a23bb 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
@@ -39,15 +39,14 @@ export function get_possible_values(chunk) {
  * @param {Css.Rule | null} rule
  */
 export function get_parent_rules(rule) {
-	const parents = [];
+	const rules = [];
 
-	let parent = rule?.metadata.parent_rule;
-	while (parent) {
-		parents.push(parent);
-		parent = parent.metadata.parent_rule;
+	while (rule) {
+		rules.push(rule);
+		rule = rule.metadata.parent_rule;
 	}
 
-	return parents;
+	return rules;
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index ce34544eb4..60f48ac70c 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -438,7 +438,9 @@ export function analyze_component(root, source, options) {
 				: '',
 			keyframes: []
 		},
-		source
+		source,
+		snippet_renderers: new Map(),
+		snippets: new Set()
 	};
 
 	if (!runes) {
@@ -698,6 +700,16 @@ export function analyze_component(root, source, options) {
 		);
 	}
 
+	for (const [node, resolved] of analysis.snippet_renderers) {
+		if (!resolved) {
+			node.metadata.snippets = analysis.snippets;
+		}
+
+		for (const snippet of node.metadata.snippets) {
+			snippet.metadata.sites.add(node);
+		}
+	}
+
 	if (
 		analysis.uses_render_tags &&
 		(analysis.uses_slots || (!analysis.custom_element && analysis.slot_names.size > 0))
@@ -726,8 +738,6 @@ export function analyze_component(root, source, options) {
 		}
 
 		outer: for (const node of analysis.elements) {
-			if (node.type === 'RenderTag') continue;
-
 			if (node.metadata.scoped) {
 				// Dynamic elements in dom mode always use spread for attributes and therefore shouldn't have a class attribute added to them
 				// TODO this happens during the analysis phase, which shouldn't know anything about client vs server
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
index 57bd80ff1c..045224276a 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RenderTag.js
@@ -4,6 +4,7 @@ import { unwrap_optional } from '../../../utils/ast.js';
 import * as e from '../../../errors.js';
 import { validate_opening_tag } from './shared/utils.js';
 import { mark_subtree_dynamic } from './shared/fragment.js';
+import { is_resolved_snippet } from './shared/snippets.js';
 
 /**
  * @param {AST.RenderTag} node
@@ -13,13 +14,25 @@ export function RenderTag(node, context) {
 	validate_opening_tag(node, context.state, '@');
 
 	node.metadata.path = [...context.path];
-	context.state.analysis.elements.push(node);
 
 	const callee = unwrap_optional(node.expression).callee;
 
-	node.metadata.dynamic =
-		callee.type !== 'Identifier' || context.state.scope.get(callee.name)?.kind !== 'normal';
+	const binding = callee.type === 'Identifier' ? context.state.scope.get(callee.name) : null;
 
+	node.metadata.dynamic = binding?.kind !== 'normal';
+
+	/**
+	 * If we can't unambiguously resolve this to a declaration, we
+	 * must assume the worst and link the render tag to every snippet
+	 */
+	let resolved = callee.type === 'Identifier' && is_resolved_snippet(binding);
+
+	if (binding?.initial?.type === 'SnippetBlock') {
+		// if this render tag unambiguously references a local snippet, our job is easy
+		node.metadata.snippets.add(binding.initial);
+	}
+
+	context.state.analysis.snippet_renderers.set(node, resolved);
 	context.state.analysis.uses_render_tags = true;
 
 	const raw_args = unwrap_optional(node.expression).arguments;
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 356cf2eeae..c94b65e361 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SnippetBlock.js
@@ -8,6 +8,8 @@ import * as e from '../../../errors.js';
  * @param {Context} context
  */
 export function SnippetBlock(node, context) {
+	context.state.analysis.snippets.add(node);
+
 	validate_block_not_empty(node.body, context);
 
 	if (context.state.analysis.runes) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
index 9a432341a0..84a7e2f130 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
@@ -9,12 +9,63 @@ import {
 	validate_slot_attribute
 } from './attribute.js';
 import { mark_subtree_dynamic } from './fragment.js';
+import { is_resolved_snippet } from './snippets.js';
 
 /**
  * @param {AST.Component | AST.SvelteComponent | AST.SvelteSelf} node
  * @param {Context} context
  */
 export function visit_component(node, context) {
+	node.metadata.path = [...context.path];
+
+	// link this node to all the snippets that it could render, so that we can prune CSS correctly
+	node.metadata.snippets = new Set();
+
+	// 'resolved' means we know which snippets this component might render. if it is `false`,
+	// then `node.metadata.snippets` is populated with every locally defined snippet
+	// once analysis is complete
+	let resolved = true;
+
+	for (const attribute of node.attributes) {
+		if (attribute.type === 'SpreadAttribute' || attribute.type === 'BindDirective') {
+			resolved = false;
+			continue;
+		}
+
+		if (attribute.type !== 'Attribute' || !is_expression_attribute(attribute)) {
+			continue;
+		}
+
+		const expression = get_attribute_expression(attribute);
+
+		// given an attribute like `foo={bar}`, if `bar` resolves to an import or a prop
+		// then we know it doesn't reference a locally defined snippet. if it resolves
+		// to a `{#snippet bar()}` then we know _which_ snippet it resolves to. in all
+		// other cases, we can't know (without much more complex static analysis) which
+		// snippets the component might render, so we treat the component as unresolved
+		if (expression.type === 'Identifier') {
+			const binding = context.state.scope.get(expression.name);
+
+			resolved &&= is_resolved_snippet(binding);
+
+			if (binding?.initial?.type === 'SnippetBlock') {
+				node.metadata.snippets.add(binding.initial);
+			}
+		} else {
+			resolved = false;
+		}
+	}
+
+	if (resolved) {
+		for (const child of node.fragment.nodes) {
+			if (child.type === 'SnippetBlock') {
+				node.metadata.snippets.add(child);
+			}
+		}
+	}
+
+	context.state.analysis.snippet_renderers.set(node, resolved);
+
 	mark_subtree_dynamic(context.path);
 
 	for (const attribute of node.attributes) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/snippets.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/snippets.js
new file mode 100644
index 0000000000..124ae0b315
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/snippets.js
@@ -0,0 +1,17 @@
+/** @import { Binding } from '#compiler' */
+
+/**
+ * Returns `true` if a binding unambiguously resolves to a specific
+ * snippet declaration, or is external to the current component
+ * @param {Binding | null} binding
+ */
+export function is_resolved_snippet(binding) {
+	return (
+		!binding ||
+		binding.declaration_kind === 'import' ||
+		binding.kind === 'prop' ||
+		binding.kind === 'rest_prop' ||
+		binding.kind === 'bindable_prop' ||
+		binding?.initial?.type === 'SnippetBlock'
+	);
+}
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index f001a0c48c..fed5d66b2c 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -37,7 +37,7 @@ export interface ComponentAnalysis extends Analysis {
 	instance: Js;
 	template: Template;
 	/** Used for CSS pruning and scoping */
-	elements: Array<AST.RegularElement | AST.SvelteElement | AST.RenderTag>;
+	elements: Array<AST.RegularElement | AST.SvelteElement>;
 	runes: boolean;
 	exports: Array<{ name: string; alias: string | null }>;
 	/** Whether the component uses `$$props` */
@@ -72,6 +72,17 @@ export interface ComponentAnalysis extends Analysis {
 		keyframes: string[];
 	};
 	source: string;
+	/**
+	 * Every render tag/component, and whether it could be definitively resolved or not
+	 */
+	snippet_renderers: Map<
+		AST.RenderTag | AST.Component | AST.SvelteComponent | AST.SvelteSelf,
+		boolean
+	>;
+	/**
+	 * Every snippet that is declared locally
+	 */
+	snippets: Set<AST.SnippetBlock>;
 }
 
 declare module 'estree' {
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index 0be0b25ab4..efce217e82 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -166,6 +166,9 @@ export namespace AST {
 			dynamic: boolean;
 			args_with_call_expression: Set<number>;
 			path: SvelteNode[];
+			/** The set of locally-defined snippets that this render tag could correspond to,
+			 * used for CSS pruning purposes */
+			snippets: Set<SnippetBlock>;
 		};
 	}
 
@@ -278,6 +281,10 @@ export namespace AST {
 		metadata: {
 			scopes: Record<string, Scope>;
 			dynamic: boolean;
+			/** The set of locally-defined snippets that this component tag could render,
+			 * used for CSS pruning purposes */
+			snippets: Set<SnippetBlock>;
+			path: SvelteNode[];
 		};
 	}
 
@@ -318,6 +325,10 @@ export namespace AST {
 		/** @internal */
 		metadata: {
 			scopes: Record<string, Scope>;
+			/** The set of locally-defined snippets that this component tag could render,
+			 * used for CSS pruning purposes */
+			snippets: Set<SnippetBlock>;
+			path: SvelteNode[];
 		};
 	}
 
@@ -369,6 +380,10 @@ export namespace AST {
 		/** @internal */
 		metadata: {
 			scopes: Record<string, Scope>;
+			/** The set of locally-defined snippets that this component tag could render,
+			 * used for CSS pruning purposes */
+			snippets: Set<SnippetBlock>;
+			path: SvelteNode[];
 		};
 	}
 
@@ -438,6 +453,12 @@ export namespace AST {
 		expression: Identifier;
 		parameters: Pattern[];
 		body: Fragment;
+		/** @internal */
+		metadata: {
+			/** The set of components/render tags that could render this snippet,
+			 * used for CSS pruning */
+			sites: Set<Component | SvelteComponent | SvelteSelf | RenderTag>;
+		};
 	}
 
 	export interface Attribute extends BaseNode {
diff --git a/packages/svelte/tests/css/samples/child-combinator/expected.css b/packages/svelte/tests/css/samples/child-combinator/expected.css
index 4d7a2096ca..3143c231be 100644
--- a/packages/svelte/tests/css/samples/child-combinator/expected.css
+++ b/packages/svelte/tests/css/samples/child-combinator/expected.css
@@ -2,6 +2,6 @@
     background-color: red;
   }
 
-  main.svelte-xyz div > button:where(.svelte-xyz) {
+  main.svelte-xyz div:where(.svelte-xyz) > button:where(.svelte-xyz) {
     background-color: blue;
   }
diff --git a/packages/svelte/tests/css/samples/dynamic-element-tag/expected.css b/packages/svelte/tests/css/samples/dynamic-element-tag/expected.css
index 80f7facd5a..edb81ed12f 100644
--- a/packages/svelte/tests/css/samples/dynamic-element-tag/expected.css
+++ b/packages/svelte/tests/css/samples/dynamic-element-tag/expected.css
@@ -7,7 +7,7 @@
 	h2.svelte-xyz span:where(.svelte-xyz) {
 		color: red;
 	}
-	h2.svelte-xyz > span > b:where(.svelte-xyz) {
+	h2.svelte-xyz > span:where(.svelte-xyz) > b:where(.svelte-xyz) {
 		color: red;
 	}
 	h2.svelte-xyz span:where(.svelte-xyz) b:where(.svelte-xyz) {
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/expected.css b/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/expected.css
new file mode 100644
index 0000000000..37cb0b8e1f
--- /dev/null
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/expected.css
@@ -0,0 +1,4 @@
+
+	h1.svelte-xyz ~ p:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/input.svelte b/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/input.svelte
new file mode 100644
index 0000000000..5a24653dcf
--- /dev/null
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-render-tag/input.svelte
@@ -0,0 +1,13 @@
+{#snippet foo()}
+	<p>this should be green</p>
+{/snippet}
+
+<h1>Hello</h1>
+
+{@render foo()}
+
+<style>
+	h1 ~ p {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/_config.js b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/_config.js
index 6fe2e4ac59..97e470d1c3 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/_config.js
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/_config.js
@@ -2,12 +2,6 @@ import { test } from '../../test';
 
 export default test({
 	warnings: [
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".a ~ .b"',
-			start: { character: 110, column: 1, line: 10 },
-			end: { character: 117, column: 8, line: 10 }
-		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".b ~ .c"',
@@ -17,26 +11,26 @@ export default test({
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".c ~ .f"',
-			start: { character: 164, column: 1, line: 12 },
-			end: { character: 171, column: 8, line: 12 }
+			start: { character: 162, column: 1, line: 12 },
+			end: { character: 169, column: 8, line: 12 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".f ~ .g"',
-			start: { character: 191, column: 1, line: 13 },
-			end: { character: 198, column: 8, line: 13 }
+			start: { character: 187, column: 1, line: 13 },
+			end: { character: 194, column: 8, line: 13 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".b ~ .f"',
-			start: { character: 218, column: 1, line: 14 },
-			end: { character: 225, column: 8, line: 14 }
+			start: { character: 212, column: 1, line: 14 },
+			end: { character: 219, column: 8, line: 14 }
 		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".b ~ .g"',
-			start: { character: 245, column: 1, line: 15 },
-			end: { character: 252, column: 8, line: 15 }
+			start: { character: 237, column: 1, line: 15 },
+			end: { character: 244, column: 8, line: 15 }
 		}
 	]
 });
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/expected.css b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/expected.css
index 06590583e8..67a19d10c9 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/expected.css
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/expected.css
@@ -1,10 +1,11 @@
+
 	.d.svelte-xyz ~ .e:where(.svelte-xyz) { color: green; }
 	.a.svelte-xyz ~ .g:where(.svelte-xyz) { color: green; }
+	.a.svelte-xyz ~ .b:where(.svelte-xyz) { color: green; }
 
 	/* no match */
-	/* (unused) .a ~ .b { color: green; }*/
-	/* (unused) .b ~ .c { color: green; }*/
-	/* (unused) .c ~ .f { color: green; }*/
-	/* (unused) .f ~ .g { color: green; }*/
-	/* (unused) .b ~ .f { color: green; }*/
-	/* (unused) .b ~ .g { color: green; }*/
+	/* (unused) .b ~ .c { color: red; }*/
+	/* (unused) .c ~ .f { color: red; }*/
+	/* (unused) .f ~ .g { color: red; }*/
+	/* (unused) .b ~ .f { color: red; }*/
+	/* (unused) .b ~ .g { color: red; }*/
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/input.svelte b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/input.svelte
index afb3b5226c..2e2846fa87 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator-slot/input.svelte
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-slot/input.svelte
@@ -5,14 +5,14 @@
 <style>
 	.d ~ .e { color: green; }
 	.a ~ .g { color: green; }
+	.a ~ .b { color: green; }
 
 	/* no match */
-	.a ~ .b { color: green; }
-	.b ~ .c { color: green; }
-	.c ~ .f { color: green; }
-	.f ~ .g { color: green; }
-	.b ~ .f { color: green; }
-	.b ~ .g { color: green; }
+	.b ~ .c { color: red; }
+	.c ~ .f { color: red; }
+	.f ~ .g { color: red; }
+	.b ~ .f { color: red; }
+	.b ~ .g { color: red; }
 </style>
 
 <div class="a"></div>
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.css b/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.css
index 7ec653d1be..530213faac 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.css
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.css
@@ -1,4 +1,4 @@
-	.match.svelte-xyz > * ~ :where(.svelte-xyz) {
+	.match.svelte-xyz > :where(.svelte-xyz) ~ :where(.svelte-xyz) {
 		margin-left: 4px;
 	}
 	/* (unused) .not-match > * ~ * {
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.html b/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.html
index c97af84a65..def6560c20 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.html
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator-star/expected.html
@@ -2,6 +2,6 @@
   <div></div>
 </div>
 <div class="match svelte-xyz">
-  <div></div>
+  <div class="svelte-xyz"></div>
   <div class="svelte-xyz"></div>
 </div>
diff --git a/packages/svelte/tests/css/samples/general-siblings-combinator/expected.css b/packages/svelte/tests/css/samples/general-siblings-combinator/expected.css
index ffdd14f5c4..ff9874b9e4 100644
--- a/packages/svelte/tests/css/samples/general-siblings-combinator/expected.css
+++ b/packages/svelte/tests/css/samples/general-siblings-combinator/expected.css
@@ -1,6 +1,6 @@
 	div.svelte-xyz ~ article:where(.svelte-xyz) { color: green; }
 	span.svelte-xyz ~ b:where(.svelte-xyz) { color: green; }
-	div.svelte-xyz span ~ b:where(.svelte-xyz) { color: green; }
+	div.svelte-xyz span:where(.svelte-xyz) ~ b:where(.svelte-xyz) { color: green; }
 	.a.svelte-xyz ~ article:where(.svelte-xyz) { color: green; }
 	div.svelte-xyz ~ .b:where(.svelte-xyz) { color: green; }
 	.a.svelte-xyz ~ .c:where(.svelte-xyz) { color: green; }
diff --git a/packages/svelte/tests/css/samples/has-with-render-tag/_config.js b/packages/svelte/tests/css/samples/has-with-render-tag/_config.js
new file mode 100644
index 0000000000..db6da8c6bd
--- /dev/null
+++ b/packages/svelte/tests/css/samples/has-with-render-tag/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "z:has(+ y)"',
+			start: {
+				line: 23,
+				column: 1,
+				character: 217
+			},
+			end: {
+				line: 23,
+				column: 11,
+				character: 227
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/has-with-render-tag/expected.css b/packages/svelte/tests/css/samples/has-with-render-tag/expected.css
new file mode 100644
index 0000000000..8efb84f565
--- /dev/null
+++ b/packages/svelte/tests/css/samples/has-with-render-tag/expected.css
@@ -0,0 +1,11 @@
+
+	x.svelte-xyz:has(y:where(.svelte-xyz)) {
+		color: green;
+	}
+	p.svelte-xyz:has(+ y:where(.svelte-xyz)) {
+		color: green;
+	}
+
+	/* (unused) z:has(+ y) {
+		color: red;
+	}*/
diff --git a/packages/svelte/tests/css/samples/has-with-render-tag/input.svelte b/packages/svelte/tests/css/samples/has-with-render-tag/input.svelte
new file mode 100644
index 0000000000..8e54e05d08
--- /dev/null
+++ b/packages/svelte/tests/css/samples/has-with-render-tag/input.svelte
@@ -0,0 +1,26 @@
+{#snippet foo()}
+	<y></y>
+{/snippet}
+
+<x>
+	this should be green
+	{@render foo()}
+</x>
+
+<z>
+	<p>this should be green</p>
+	{@render foo()}
+</z>
+
+<style>
+	x:has(y) {
+		color: green;
+	}
+	p:has(+ y) {
+		color: green;
+	}
+
+	z:has(+ y) {
+		color: red;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/Child.svelte b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/Child.svelte
new file mode 100644
index 0000000000..17d34e7cf6
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	let { children } = $props();
+</script>
+
+{@render children()}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/expected.css
new file mode 100644
index 0000000000..5e7756a4ea
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/expected.css
@@ -0,0 +1,4 @@
+
+	x.svelte-xyz + y:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/input.svelte
new file mode 100644
index 0000000000..dff35608ea
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-default-snippet/input.svelte
@@ -0,0 +1,15 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<x></x>
+
+<Child>
+	<y>this should be green</y>
+</Child>
+
+<style>
+	x + y {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/Child.svelte b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/Child.svelte
new file mode 100644
index 0000000000..1df9f35e50
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	let { foo } = $props();
+</script>
+
+{@render foo()}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/expected.css
new file mode 100644
index 0000000000..5e7756a4ea
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/expected.css
@@ -0,0 +1,4 @@
+
+	x.svelte-xyz + y:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/input.svelte
new file mode 100644
index 0000000000..c0ec3bc4db
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-component-named-snippet/input.svelte
@@ -0,0 +1,17 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<x></x>
+
+<Child>
+	{#snippet foo()}
+		<y>this should be green</y>
+	{/snippet}
+</Child>
+
+<style>
+	x + y {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/expected.css
new file mode 100644
index 0000000000..3e6114b405
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/expected.css
@@ -0,0 +1,4 @@
+
+	x.svelte-xyz + z:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/input.svelte
new file mode 100644
index 0000000000..df935eecd0
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-missing-fallback/input.svelte
@@ -0,0 +1,13 @@
+<x></x>
+
+<slot>
+	<y>fallback content</y>
+</slot>
+
+<z>this should be green if the slot fallback is not rendered</z>
+
+<style>
+	x + z {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-render-tag/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-render-tag/expected.css
new file mode 100644
index 0000000000..da1c5241a9
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-render-tag/expected.css
@@ -0,0 +1,4 @@
+
+	h1.svelte-xyz + p:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-render-tag/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-render-tag/input.svelte
new file mode 100644
index 0000000000..035ee37445
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-render-tag/input.svelte
@@ -0,0 +1,13 @@
+{#snippet foo()}
+	<p>this should be green</p>
+{/snippet}
+
+<h1>Hello</h1>
+
+{@render foo()}
+
+<style>
+	h1 + p {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/Child.svelte b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/Child.svelte
new file mode 100644
index 0000000000..4fa864ce7a
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/Child.svelte
@@ -0,0 +1 @@
+<slot />
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/expected.css
new file mode 100644
index 0000000000..5300323d85
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/expected.css
@@ -0,0 +1,4 @@
+
+	.a.svelte-xyz + .c:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/input.svelte
new file mode 100644
index 0000000000..95c6e48952
--- /dev/null
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot-named-between-default/input.svelte
@@ -0,0 +1,15 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<Child>
+	<div class="a">a</div>
+	<div class="b" slot="wut">b</div>
+	<div class="c">c</div>
+</Child>
+
+<style>
+	.a + .c {
+		color: green;
+	}
+</style>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot/_config.js b/packages/svelte/tests/css/samples/siblings-combinator-slot/_config.js
index d13a8d726b..2786baeff8 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-slot/_config.js
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot/_config.js
@@ -2,12 +2,6 @@ import { test } from '../../test';
 
 export default test({
 	warnings: [
-		{
-			code: 'css_unused_selector',
-			message: 'Unused CSS selector ".a + .b"',
-			start: { character: 83, column: 1, line: 9 },
-			end: { character: 90, column: 8, line: 9 }
-		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".b + .c"',
@@ -17,8 +11,8 @@ export default test({
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector ".c + .f"',
-			start: { character: 137, column: 1, line: 11 },
-			end: { character: 144, column: 8, line: 11 }
+			start: { character: 135, column: 1, line: 11 },
+			end: { character: 142, column: 8, line: 11 }
 		}
 	]
 });
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-slot/expected.css
index f4c2572bdc..643f6cf13f 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-slot/expected.css
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot/expected.css
@@ -1,6 +1,7 @@
+
 	.d.svelte-xyz + .e:where(.svelte-xyz) { color: green; }
+	.a.svelte-xyz + .b:where(.svelte-xyz) { color: green; }
 
 	/* no match */
-	/* (unused) .a + .b { color: green; }*/
-	/* (unused) .b + .c { color: green; }*/
-	/* (unused) .c + .f { color: green; }*/
+	/* (unused) .b + .c { color: red; }*/
+	/* (unused) .c + .f { color: red; }*/
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-slot/input.svelte b/packages/svelte/tests/css/samples/siblings-combinator-slot/input.svelte
index 630bc2fe97..1b543f97b7 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-slot/input.svelte
+++ b/packages/svelte/tests/css/samples/siblings-combinator-slot/input.svelte
@@ -4,11 +4,11 @@
 
 <style>
 	.d + .e { color: green; }
+	.a + .b { color: green; }
 
 	/* no match */
-	.a + .b { color: green; }
-	.b + .c { color: green; }
-	.c + .f { color: green; }
+	.b + .c { color: red; }
+	.c + .f { color: red; }
 </style>
 
 <div class="a"></div>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-star/expected.css b/packages/svelte/tests/css/samples/siblings-combinator-star/expected.css
index 1de61b6842..4986c4f715 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-star/expected.css
+++ b/packages/svelte/tests/css/samples/siblings-combinator-star/expected.css
@@ -1,4 +1,4 @@
-	.match.svelte-xyz > * + :where(.svelte-xyz) {
+	.match.svelte-xyz > :where(.svelte-xyz) + :where(.svelte-xyz) {
 		margin-left: 4px;
 	}
 	/* (unused) .not-match > * + * {
diff --git a/packages/svelte/tests/css/samples/siblings-combinator-star/expected.html b/packages/svelte/tests/css/samples/siblings-combinator-star/expected.html
index c97af84a65..def6560c20 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator-star/expected.html
+++ b/packages/svelte/tests/css/samples/siblings-combinator-star/expected.html
@@ -2,6 +2,6 @@
   <div></div>
 </div>
 <div class="match svelte-xyz">
-  <div></div>
+  <div class="svelte-xyz"></div>
   <div class="svelte-xyz"></div>
 </div>
diff --git a/packages/svelte/tests/css/samples/siblings-combinator/expected.css b/packages/svelte/tests/css/samples/siblings-combinator/expected.css
index 5622a66a30..97a7a46897 100644
--- a/packages/svelte/tests/css/samples/siblings-combinator/expected.css
+++ b/packages/svelte/tests/css/samples/siblings-combinator/expected.css
@@ -16,7 +16,7 @@
 	span.svelte-xyz + b:where(.svelte-xyz) {
 		color: green;
 	}
-	div.svelte-xyz span + b:where(.svelte-xyz) {
+	div.svelte-xyz span:where(.svelte-xyz) + b:where(.svelte-xyz) {
 		color: green;
 	}
 	.a.svelte-xyz + article:where(.svelte-xyz) {
diff --git a/packages/svelte/tests/css/samples/snippets/_config.js b/packages/svelte/tests/css/samples/snippets/_config.js
index f8b3b4ca39..8e3135260b 100644
--- a/packages/svelte/tests/css/samples/snippets/_config.js
+++ b/packages/svelte/tests/css/samples/snippets/_config.js
@@ -2,18 +2,32 @@ import { test } from '../../test';
 
 export default test({
 	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "p .foo"',
+			start: {
+				line: 28,
+				column: 1,
+				character: 356
+			},
+			end: {
+				line: 28,
+				column: 7,
+				character: 362
+			}
+		},
 		{
 			code: 'css_unused_selector',
 			message: 'Unused CSS selector "span div"',
 			start: {
 				line: 31,
 				column: 1,
-				character: 461
+				character: 383
 			},
 			end: {
 				line: 31,
 				column: 9,
-				character: 469
+				character: 391
 			}
 		}
 	]
diff --git a/packages/svelte/tests/css/samples/snippets/expected.css b/packages/svelte/tests/css/samples/snippets/expected.css
index 85ae5b4c25..62fadcd9e2 100644
--- a/packages/svelte/tests/css/samples/snippets/expected.css
+++ b/packages/svelte/tests/css/samples/snippets/expected.css
@@ -11,9 +11,9 @@
 	p.svelte-xyz span:where(.svelte-xyz) {
 		color: green;
 	}
-	p.svelte-xyz .foo:where(.svelte-xyz) {
-		color: purple; /* doesn't match, but our static analysis doesn't handle this currently */
-	}
+	/* (unused) p .foo {
+		color: red;
+	}*/
 	/* (unused) span div {
 		color: red;
 	}*/
diff --git a/packages/svelte/tests/css/samples/snippets/input.svelte b/packages/svelte/tests/css/samples/snippets/input.svelte
index b657e7e2bb..5dbbad0152 100644
--- a/packages/svelte/tests/css/samples/snippets/input.svelte
+++ b/packages/svelte/tests/css/samples/snippets/input.svelte
@@ -26,9 +26,9 @@
 		color: green;
 	}
 	p .foo {
-		color: purple; /* doesn't match, but our static analysis doesn't handle this currently */
+		color: red;
 	}
 	span div {
 		color: red;
 	}
-</style>
\ No newline at end of file
+</style>

From d62e7bdbe1a70381009e24bf858744b9227469fb Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Fri, 29 Nov 2024 15:09:05 +0100
Subject: [PATCH 215/404] fix: ignore text and expressions outside the template
 when validating HTML (#14468)

fixes #14466

The logic introduced in #14395 was flawed - not every text or expression outside the template is the child of an attribute. This turns it around: We know that every child of a fragment is inside the template, so we ignore all text/expression tags that are not child of a fragment
---
 .changeset/brave-keys-rescue.md                    |  5 +++++
 .../phases/2-analyze/visitors/ExpressionTag.js     |  4 ++--
 .../src/compiler/phases/2-analyze/visitors/Text.js |  4 ++--
 .../samples/invalid-node-placement-8/errors.json   | 14 ++++++++++++++
 .../samples/invalid-node-placement-8/input.svelte  |  4 ++++
 5 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/brave-keys-rescue.md
 create mode 100644 packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
 create mode 100644 packages/svelte/tests/validator/samples/invalid-node-placement-8/input.svelte

diff --git a/.changeset/brave-keys-rescue.md b/.changeset/brave-keys-rescue.md
new file mode 100644
index 0000000000..21ab4888be
--- /dev/null
+++ b/.changeset/brave-keys-rescue.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ignore text and expressions outside the template when validating HTML
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
index 7e21d5ca14..e0d2710a08 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
@@ -9,9 +9,9 @@ import { mark_subtree_dynamic } from './shared/fragment.js';
  * @param {Context} context
  */
 export function ExpressionTag(node, context) {
-	const in_attribute = context.path.at(-1)?.type === 'Attribute';
+	const in_template = context.path.at(-1)?.type === 'Fragment';
 
-	if (!in_attribute && context.state.parent_element) {
+	if (in_template && context.state.parent_element) {
 		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
 			e.node_invalid_placement(node, '`{expression}`', context.state.parent_element);
 		}
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
index 2eca7d43e9..b60030f638 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
@@ -9,9 +9,9 @@ import * as e from '../../../errors.js';
  * @param {Context} context
  */
 export function Text(node, context) {
-	const in_attribute = context.path.at(-1)?.type === 'Attribute';
+	const in_template = context.path.at(-1)?.type === 'Fragment';
 
-	if (!in_attribute && context.state.parent_element && regex_not_whitespace.test(node.data)) {
+	if (in_template && context.state.parent_element && regex_not_whitespace.test(node.data)) {
 		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
 			e.node_invalid_placement(node, 'Text node', context.state.parent_element);
 		}
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
new file mode 100644
index 0000000000..1127a76336
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
@@ -0,0 +1,14 @@
+[
+	{
+		"code": "node_invalid_placement",
+		"message": "Text node is invalid inside `<tbody>`",
+		"start": {
+			"line": 3,
+			"column": 8
+		},
+		"end": {
+			"line": 3,
+			"column": 13
+		}
+	}
+]
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-8/input.svelte b/packages/svelte/tests/validator/samples/invalid-node-placement-8/input.svelte
new file mode 100644
index 0000000000..05905594f5
--- /dev/null
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-8/input.svelte
@@ -0,0 +1,4 @@
+
+<table attr={value} style:x={y} class="I'm not {counted} as text in the table">
+	<tbody>I am {bad}</tbody>
+</table>

From ca3690f7df8c42b36c02b27a4da066fe2ac8ebd2 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Fri, 29 Nov 2024 10:33:05 -0500
Subject: [PATCH 216/404] Version Packages (#14464)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/brave-keys-rescue.md  | 5 -----
 .changeset/twelve-squids-wink.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/brave-keys-rescue.md
 delete mode 100644 .changeset/twelve-squids-wink.md

diff --git a/.changeset/brave-keys-rescue.md b/.changeset/brave-keys-rescue.md
deleted file mode 100644
index 21ab4888be..0000000000
--- a/.changeset/brave-keys-rescue.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ignore text and expressions outside the template when validating HTML
diff --git a/.changeset/twelve-squids-wink.md b/.changeset/twelve-squids-wink.md
deleted file mode 100644
index 0fde3dfb86..0000000000
--- a/.changeset/twelve-squids-wink.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: better account for render tags when pruning CSS
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index f1694a58fb..0c75e07a32 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.2.11
+
+### Patch Changes
+
+- fix: ignore text and expressions outside the template when validating HTML ([#14468](https://github.com/sveltejs/svelte/pull/14468))
+
+- fix: better account for render tags when pruning CSS ([#14456](https://github.com/sveltejs/svelte/pull/14456))
+
 ## 5.2.10
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index cf679a0e34..4a0747041a 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.2.10",
+  "version": "5.2.11",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index ecc9de1a4a..517a76e74c 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.2.10';
+export const VERSION = '5.2.11';
 export const PUBLIC_VERSION = '5';

From a60e837e44fd41d4e68f9a0d59b9d09590908465 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Fri, 29 Nov 2024 16:37:04 -0500
Subject: [PATCH 217/404] fix: prevent infinite loops when pruning CSS (#14474)

fixes #14472

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/itchy-timers-relax.md              |  5 ++++
 .../phases/2-analyze/css/css-prune.js         | 29 +++++++++++++++++--
 .../2-analyze/visitors/shared/component.js    |  2 +-
 .../css/samples/render-tag-loop/_config.js    | 20 +++++++++++++
 .../css/samples/render-tag-loop/expected.css  | 10 +++++++
 .../css/samples/render-tag-loop/input.svelte  | 25 ++++++++++++++++
 6 files changed, 88 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/itchy-timers-relax.md
 create mode 100644 packages/svelte/tests/css/samples/render-tag-loop/_config.js
 create mode 100644 packages/svelte/tests/css/samples/render-tag-loop/expected.css
 create mode 100644 packages/svelte/tests/css/samples/render-tag-loop/input.svelte

diff --git a/.changeset/itchy-timers-relax.md b/.changeset/itchy-timers-relax.md
new file mode 100644
index 0000000000..5d0913ba62
--- /dev/null
+++ b/.changeset/itchy-timers-relax.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent infinite loops when pruning CSS
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 0c38114a30..83c50c73d0 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
@@ -43,6 +43,12 @@ const nesting_selector = {
 	}
 };
 
+/**
+ * Snippets encountered already (avoids infinite loops)
+ * @type {Set<Compiler.AST.SnippetBlock>}
+ */
+const seen = new Set();
+
 /**
  *
  * @param {Compiler.Css.StyleSheet} stylesheet
@@ -60,6 +66,8 @@ export function prune(stylesheet, element) {
 		ComplexSelector(node) {
 			const selectors = get_relative_selectors(node);
 
+			seen.clear();
+
 			if (
 				apply_selector(selectors, /** @type {Compiler.Css.Rule} */ (node.metadata.rule), element)
 			) {
@@ -193,6 +201,9 @@ function apply_combinator(relative_selector, parent_selectors, rule, node) {
 				const parent = path[i];
 
 				if (parent.type === 'SnippetBlock') {
+					if (seen.has(parent)) return true;
+					seen.add(parent);
+
 					for (const site of parent.metadata.sites) {
 						if (apply_combinator(relative_selector, parent_selectors, rule, site)) {
 							return true;
@@ -335,6 +346,8 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element)
 			descendant_elements.push(element);
 		}
 
+		const seen = new Set();
+
 		/**
 		 * @param {Compiler.SvelteNode} node
 		 * @param {{ is_child: boolean }} state
@@ -355,6 +368,9 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element)
 						}
 					} else if (node.type === 'RenderTag') {
 						for (const snippet of node.metadata.snippets) {
+							if (seen.has(snippet)) continue;
+
+							seen.add(snippet);
 							walk_children(snippet.body, context.state);
 						}
 					} else {
@@ -618,6 +634,8 @@ function get_following_sibling_elements(element, include_self) {
 	// ...then walk them, starting from the node after the one
 	// containing the element in question
 
+	const seen = new Set();
+
 	/** @param {Compiler.SvelteNode} node */
 	function get_siblings(node) {
 		walk(node, null, {
@@ -629,6 +647,9 @@ function get_following_sibling_elements(element, include_self) {
 			},
 			RenderTag(node) {
 				for (const snippet of node.metadata.snippets) {
+					if (seen.has(snippet)) continue;
+
+					seen.add(snippet);
 					get_siblings(snippet.body);
 				}
 			}
@@ -804,9 +825,10 @@ function get_element_parent(node) {
 /**
  * @param {Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.RenderTag | Compiler.AST.Component | Compiler.AST.SvelteComponent | Compiler.AST.SvelteSelf} node
  * @param {boolean} adjacent_only
+ * @param {Set<Compiler.AST.SnippetBlock>} seen
  * @returns {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>}
  */
-function get_possible_element_siblings(node, adjacent_only) {
+function get_possible_element_siblings(node, adjacent_only, seen = new Set()) {
 	/** @type {Map<Compiler.AST.RegularElement | Compiler.AST.SvelteElement | Compiler.AST.SlotElement | Compiler.AST.RenderTag, NodeExistsValue>} */
 	const result = new Map();
 	const path = node.metadata.path;
@@ -865,8 +887,11 @@ function get_possible_element_siblings(node, adjacent_only) {
 		}
 
 		if (current.type === 'SnippetBlock') {
+			if (seen.has(current)) break;
+			seen.add(current);
+
 			for (const site of current.metadata.sites) {
-				const siblings = get_possible_element_siblings(site, adjacent_only);
+				const siblings = get_possible_element_siblings(site, adjacent_only, seen);
 				add_to_map(siblings, result);
 
 				if (adjacent_only && current.metadata.sites.size === 1 && has_definite_elements(siblings)) {
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
index 84a7e2f130..04bf3d2ff3 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/shared/component.js
@@ -51,7 +51,7 @@ export function visit_component(node, context) {
 			if (binding?.initial?.type === 'SnippetBlock') {
 				node.metadata.snippets.add(binding.initial);
 			}
-		} else {
+		} else if (expression.type !== 'Literal') {
 			resolved = false;
 		}
 	}
diff --git a/packages/svelte/tests/css/samples/render-tag-loop/_config.js b/packages/svelte/tests/css/samples/render-tag-loop/_config.js
new file mode 100644
index 0000000000..f623b92cc3
--- /dev/null
+++ b/packages/svelte/tests/css/samples/render-tag-loop/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector "div + div"',
+			start: {
+				line: 19,
+				column: 1,
+				character: 185
+			},
+			end: {
+				line: 19,
+				column: 10,
+				character: 194
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/render-tag-loop/expected.css b/packages/svelte/tests/css/samples/render-tag-loop/expected.css
new file mode 100644
index 0000000000..1f05ddb41c
--- /dev/null
+++ b/packages/svelte/tests/css/samples/render-tag-loop/expected.css
@@ -0,0 +1,10 @@
+
+	div div.svelte-xyz {
+		color: green;
+	}
+	/* (unused) div + div {
+		color: red; /* this is marked as unused, but only because we've written an infinite loop - worth fixing? *\/
+	}*/
+	div.svelte-xyz:has(div:where(.svelte-xyz)) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/render-tag-loop/input.svelte b/packages/svelte/tests/css/samples/render-tag-loop/input.svelte
new file mode 100644
index 0000000000..ade8df5744
--- /dev/null
+++ b/packages/svelte/tests/css/samples/render-tag-loop/input.svelte
@@ -0,0 +1,25 @@
+{#snippet a()}
+	{@render b()}
+	<div>
+		{@render b()}
+	</div>
+{/snippet}
+
+{#snippet b()}
+	{@render a()}
+	<div>
+		{@render a()}
+	</div>
+{/snippet}
+
+<style>
+	div div {
+		color: green;
+	}
+	div + div {
+		color: red; /* this is marked as unused, but only because we've written an infinite loop - worth fixing? */
+	}
+	div:has(div) {
+		color: green;
+	}
+</style>

From 00aaad16b2601ce3c94735dc4c3633107268b163 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sat, 30 Nov 2024 10:17:04 -0500
Subject: [PATCH 218/404] fix: generate correct code when encountering object
 expression statement (#14480)

* bump esrap

* changeset
---
 .changeset/sixty-kings-learn.md     |  5 +++++
 packages/svelte/package.json        |  2 +-
 pnpm-lock.yaml                      | 14 +++++++-------
 sites/svelte-5-preview/package.json |  2 +-
 4 files changed, 14 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/sixty-kings-learn.md

diff --git a/.changeset/sixty-kings-learn.md b/.changeset/sixty-kings-learn.md
new file mode 100644
index 0000000000..927e21fa78
--- /dev/null
+++ b/.changeset/sixty-kings-learn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: generate correct code when encountering object expression statement
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 4a0747041a..6b3970c7f9 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -143,7 +143,7 @@
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
     "esm-env": "^1.2.0",
-    "esrap": "^1.2.2",
+    "esrap": "^1.2.3",
     "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
     "magic-string": "^0.30.11",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2556f0c100..9609d3e575 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -84,8 +84,8 @@ importers:
         specifier: ^1.2.0
         version: 1.2.0
       esrap:
-        specifier: ^1.2.2
-        version: 1.2.2
+        specifier: ^1.2.3
+        version: 1.2.3
       is-reference:
         specifier: ^3.0.3
         version: 3.0.3
@@ -260,8 +260,8 @@ importers:
         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.2
-        version: 1.2.2
+        specifier: ^1.2.3
+        version: 1.2.3
       publint:
         specifier: ^0.2.7
         version: 0.2.7
@@ -1462,8 +1462,8 @@ packages:
     resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
     engines: {node: '>=0.10'}
 
-  esrap@1.2.2:
-    resolution: {integrity: sha512-F2pSJklxx1BlQIQgooczXCPHmcWpn6EsP5oo73LQfonG9fIlIENQ8vMmfGXeojP9MrkzUNAfyU5vdFlR9shHAw==}
+  esrap@1.2.3:
+    resolution: {integrity: sha512-ZlQmCCK+n7SGoqo7DnfKaP1sJZa49P01/dXzmjCASSo04p72w8EksT2NMK8CEX8DhKsfJXANioIw8VyHNsBfvQ==}
 
   esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@@ -4214,7 +4214,7 @@ snapshots:
     dependencies:
       estraverse: 5.3.0
 
-  esrap@1.2.2:
+  esrap@1.2.3:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
       '@types/estree': 1.0.6
diff --git a/sites/svelte-5-preview/package.json b/sites/svelte-5-preview/package.json
index db4dd6d417..356a57c3f6 100644
--- a/sites/svelte-5-preview/package.json
+++ b/sites/svelte-5-preview/package.json
@@ -19,7 +19,7 @@
     "@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.2",
+    "esrap": "^1.2.3",
     "marked": "^9.0.0",
     "publint": "^0.2.7",
     "shiki": "^0.14.7",

From 10a772972697d6b50a1de7b36558e8a7c7ed56ce Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Sat, 30 Nov 2024 07:18:00 -0800
Subject: [PATCH 219/404] chore: bump jsdom to 25.0.1 (#14473)

---
 package.json   |  2 +-
 pnpm-lock.yaml | 98 +++++++++++++++++++-------------------------------
 2 files changed, 38 insertions(+), 62 deletions(-)

diff --git a/package.json b/package.json
index bcd5962c75..57dc4cdebe 100644
--- a/package.json
+++ b/package.json
@@ -36,7 +36,7 @@
     "@vitest/coverage-v8": "^2.0.5",
     "eslint": "^9.9.1",
     "eslint-plugin-lube": "^0.4.3",
-    "jsdom": "25.0.0",
+    "jsdom": "25.0.1",
     "playwright": "^1.46.1",
     "prettier": "^3.2.4",
     "prettier-plugin-svelte": "^3.1.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9609d3e575..bc431a4096 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -22,7 +22,7 @@ importers:
         version: 20.12.7
       '@vitest/coverage-v8':
         specifier: ^2.0.5
-        version: 2.0.5(vitest@2.0.5(@types/node@20.12.7)(jsdom@25.0.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))
+        version: 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))
       eslint:
         specifier: ^9.9.1
         version: 9.9.1
@@ -30,8 +30,8 @@ importers:
         specifier: ^0.4.3
         version: 0.4.3
       jsdom:
-        specifier: 25.0.0
-        version: 25.0.0
+        specifier: 25.0.1
+        version: 25.0.1
       playwright:
         specifier: ^1.46.1
         version: 1.46.1
@@ -55,7 +55,7 @@ importers:
         version: 1.2.5
       vitest:
         specifier: ^2.0.5
-        version: 2.0.5(@types/node@20.12.7)(jsdom@25.0.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
+        version: 2.0.5(@types/node@20.12.7)(jsdom@25.0.1)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
 
   packages/svelte:
     dependencies:
@@ -143,7 +143,7 @@ importers:
         version: 5.5.4
       vitest:
         specifier: ^2.0.5
-        version: 2.0.5(@types/node@20.12.7)(jsdom@25.0.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
+        version: 2.0.5(@types/node@20.12.7)(jsdom@25.0.1)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
 
   playgrounds/sandbox:
     devDependencies:
@@ -1236,7 +1236,7 @@ packages:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
   concat-map@0.0.1:
-    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+    resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
 
   console-control-strings@1.1.0:
     resolution: {integrity: sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==}
@@ -1260,8 +1260,8 @@ packages:
     engines: {node: '>=4'}
     hasBin: true
 
-  cssstyle@4.0.1:
-    resolution: {integrity: sha512-8ZYiJ3A/3OkDd093CBT/0UKDWry7ak4BdPTFP2+QEP7cmhouyq/Up709ASSj2cK02BbZiMgk7kYjZNS4QP5qrQ==}
+  cssstyle@4.1.0:
+    resolution: {integrity: sha512-h66W1URKpBS5YMI/V8PyXvTMFT8SupJ1IzoIV8IeBC/ji8WVmrO8dGlTi+2dh6whmdk6BiKJLD/ZBkhWbcg6nA==}
     engines: {node: '>=18'}
 
   csstype@3.1.3:
@@ -1817,8 +1817,8 @@ packages:
     resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
     hasBin: true
 
-  jsdom@25.0.0:
-    resolution: {integrity: sha512-OhoFVT59T7aEq75TVw9xxEfkXgacpqAhQaYgP9y/fDqWQCMB/b1H66RfmPm/MaeaAIU9nDwMOVTlPN51+ao6CQ==}
+  jsdom@25.0.1:
+    resolution: {integrity: sha512-8i7LzZj7BF8uplX+ZyOlIz86V6TAsSs+np6m1kpW9u0JWi4z/1t+FzcK1aek+ybTnAC4KhBL4uXCNT0wcUIeCw==}
     engines: {node: '>=18'}
     peerDependencies:
       canvas: ^2.11.2
@@ -2281,9 +2281,6 @@ packages:
   pseudomap@1.0.2:
     resolution: {integrity: sha512-b/YwNhb8lk1Zz2+bXXpS/LK9OisiZZ1SNsSLxN1x2OXVEhW2Ckr/7mWE5vrC1ZTiJlD9g19jWszTmJsB+oEpFQ==}
 
-  psl@1.9.0:
-    resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
-
   publint@0.2.7:
     resolution: {integrity: sha512-tLU4ee3110BxWfAmCZggJmCUnYWgPTr0QLnx08sqpLYa8JHRiOudd+CgzdpfU5x5eOaW2WMkpmOrFshRFYK7Mw==}
     engines: {node: '>=16'}
@@ -2293,9 +2290,6 @@ packages:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
 
-  querystringify@2.2.0:
-    resolution: {integrity: sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==}
-
   queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
 
@@ -2321,9 +2315,6 @@ packages:
     resolution: {integrity: sha512-RSYAtP31mvYLkAHrOlh25pCNQ5hWnT106VukGaaFfuJrZFkGRX5GhUAdPqpSDXxOhA2c4akmRuplv1mRqnBn6Q==}
     engines: {node: '>=8'}
 
-  requires-port@1.0.0:
-    resolution: {integrity: sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==}
-
   resolve-from@4.0.0:
     resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
     engines: {node: '>=4'}
@@ -2357,9 +2348,6 @@ packages:
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
-  rrweb-cssom@0.6.0:
-    resolution: {integrity: sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==}
-
   rrweb-cssom@0.7.1:
     resolution: {integrity: sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==}
 
@@ -2601,6 +2589,13 @@ packages:
     resolution: {integrity: sha512-q5nmENpTHgiPVd1cJDDc9cVoYN5x4vCvwT3FMilvKPKneCBZAxn2YWQjDF0UMcE9k0Cay1gBiDfTMU0g+mPMQA==}
     engines: {node: '>=14.0.0'}
 
+  tldts-core@6.1.64:
+    resolution: {integrity: sha512-uqnl8vGV16KsyflHOzqrYjjArjfXaU6rMPXYy2/ZWoRKCkXtghgB4VwTDXUG+t0OTGeSewNAG31/x1gCTfLt+Q==}
+
+  tldts@6.1.64:
+    resolution: {integrity: sha512-ph4AE5BXWIOsSy9stpoeo7bYe/Cy7VfpciIH4RhVZUPItCJmhqWCN0EVzxd8BOHiyNb42vuJc6NWTjJkg91Tuw==}
+    hasBin: true
+
   tmp@0.0.33:
     resolution: {integrity: sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==}
     engines: {node: '>=0.6.0'}
@@ -2617,9 +2612,9 @@ packages:
     resolution: {integrity: sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==}
     engines: {node: '>=6'}
 
-  tough-cookie@4.1.4:
-    resolution: {integrity: sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==}
-    engines: {node: '>=6'}
+  tough-cookie@5.0.0:
+    resolution: {integrity: sha512-FRKsF7cz96xIIeMZ82ehjC3xW2E+O2+v11udrDYewUbszngYhsGa8z6YUMMzO9QJZzzyd0nGGXnML/TReX6W8Q==}
+    engines: {node: '>=16'}
 
   tr46@0.0.3:
     resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==}
@@ -2663,10 +2658,6 @@ packages:
     resolution: {integrity: sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==}
     engines: {node: '>= 4.0.0'}
 
-  universalify@0.2.0:
-    resolution: {integrity: sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==}
-    engines: {node: '>= 4.0.0'}
-
   universalify@2.0.1:
     resolution: {integrity: sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==}
     engines: {node: '>= 10.0.0'}
@@ -2674,9 +2665,6 @@ packages:
   uri-js@4.4.1:
     resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
 
-  url-parse@1.5.10:
-    resolution: {integrity: sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==}
-
   util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
 
@@ -3728,7 +3716,7 @@ snapshots:
       '@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.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0))':
+  '@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
       '@bcoe/v8-coverage': 0.2.3
@@ -3742,7 +3730,7 @@ snapshots:
       std-env: 3.7.0
       test-exclude: 7.0.1
       tinyrainbow: 1.2.0
-      vitest: 2.0.5(@types/node@20.12.7)(jsdom@25.0.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
+      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)
     transitivePeerDependencies:
       - supports-color
 
@@ -3976,9 +3964,9 @@ snapshots:
 
   cssesc@3.0.0: {}
 
-  cssstyle@4.0.1:
+  cssstyle@4.1.0:
     dependencies:
-      rrweb-cssom: 0.6.0
+      rrweb-cssom: 0.7.1
 
   csstype@3.1.3: {}
 
@@ -4582,9 +4570,9 @@ snapshots:
     dependencies:
       argparse: 2.0.1
 
-  jsdom@25.0.0:
+  jsdom@25.0.1:
     dependencies:
-      cssstyle: 4.0.1
+      cssstyle: 4.1.0
       data-urls: 5.0.0
       decimal.js: 10.4.3
       form-data: 4.0.0
@@ -4597,7 +4585,7 @@ snapshots:
       rrweb-cssom: 0.7.1
       saxes: 6.0.0
       symbol-tree: 3.2.4
-      tough-cookie: 4.1.4
+      tough-cookie: 5.0.0
       w3c-xmlserializer: 5.0.0
       webidl-conversions: 7.0.0
       whatwg-encoding: 3.1.1
@@ -4975,8 +4963,6 @@ snapshots:
 
   pseudomap@1.0.2: {}
 
-  psl@1.9.0: {}
-
   publint@0.2.7:
     dependencies:
       npm-packlist: 5.1.3
@@ -4985,8 +4971,6 @@ snapshots:
 
   punycode@2.3.1: {}
 
-  querystringify@2.2.0: {}
-
   queue-microtask@1.2.3: {}
 
   randombytes@2.1.0:
@@ -5014,8 +4998,6 @@ snapshots:
 
   regexparam@3.0.0: {}
 
-  requires-port@1.0.0: {}
-
   resolve-from@4.0.0: {}
 
   resolve-from@5.0.0: {}
@@ -5058,8 +5040,6 @@ snapshots:
       '@rollup/rollup-win32-x64-msvc': 4.22.4
       fsevents: 2.3.3
 
-  rrweb-cssom@0.6.0: {}
-
   rrweb-cssom@0.7.1: {}
 
   run-applescript@7.0.0: {}
@@ -5289,6 +5269,12 @@ snapshots:
 
   tinyspy@3.0.0: {}
 
+  tldts-core@6.1.64: {}
+
+  tldts@6.1.64:
+    dependencies:
+      tldts-core: 6.1.64
+
   tmp@0.0.33:
     dependencies:
       os-tmpdir: 1.0.2
@@ -5301,12 +5287,9 @@ snapshots:
 
   totalist@3.0.1: {}
 
-  tough-cookie@4.1.4:
+  tough-cookie@5.0.0:
     dependencies:
-      psl: 1.9.0
-      punycode: 2.3.1
-      universalify: 0.2.0
-      url-parse: 1.5.10
+      tldts: 6.1.64
 
   tr46@0.0.3: {}
 
@@ -5343,19 +5326,12 @@ snapshots:
 
   universalify@0.1.2: {}
 
-  universalify@0.2.0: {}
-
   universalify@2.0.1: {}
 
   uri-js@4.4.1:
     dependencies:
       punycode: 2.3.1
 
-  url-parse@1.5.10:
-    dependencies:
-      querystringify: 2.2.0
-      requires-port: 1.0.0
-
   util-deprecate@1.0.2: {}
 
   v8-natives@1.2.5: {}
@@ -5410,7 +5386,7 @@ snapshots:
     optionalDependencies:
       vite: 5.4.6(@types/node@20.12.7)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0)
 
-  vitest@2.0.5(@types/node@20.12.7)(jsdom@25.0.0)(lightningcss@1.23.0)(sass@1.70.0)(terser@5.27.0):
+  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
       '@vitest/expect': 2.0.5
@@ -5433,7 +5409,7 @@ snapshots:
       why-is-node-running: 2.3.0
     optionalDependencies:
       '@types/node': 20.12.7
-      jsdom: 25.0.0
+      jsdom: 25.0.1
     transitivePeerDependencies:
       - less
       - lightningcss

From 4c884312287d367d8c3c33659ba20ad74b1d9e62 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Sat, 30 Nov 2024 07:42:51 -0800
Subject: [PATCH 220/404] fix: upgrade to esm-env 1.2.1 to fix issues with
 non-Vite setups (#14470)

* fix: upgrade to esm-env 1.2.1 to fix issues with non-Vite setups

* fix (albeit with annoying warnings)

* bundle with conditions to silence noise

* production is probably better

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/gentle-bulldogs-heal.md            |  5 +++++
 packages/svelte/package.json                  |  2 +-
 packages/svelte/tests/runtime-browser/test.ts |  8 ++++++--
 pnpm-lock.yaml                                | 16 ++++++++--------
 4 files changed, 20 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/gentle-bulldogs-heal.md

diff --git a/.changeset/gentle-bulldogs-heal.md b/.changeset/gentle-bulldogs-heal.md
new file mode 100644
index 0000000000..32c1d6714c
--- /dev/null
+++ b/.changeset/gentle-bulldogs-heal.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: upgrade to esm-env 1.2.1 to fix issues with non-Vite setups
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6b3970c7f9..cd61ce2e88 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -142,7 +142,7 @@
     "acorn-typescript": "^1.4.13",
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
-    "esm-env": "^1.2.0",
+    "esm-env": "^1.2.1",
     "esrap": "^1.2.3",
     "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
diff --git a/packages/svelte/tests/runtime-browser/test.ts b/packages/svelte/tests/runtime-browser/test.ts
index 1b97988fda..582a10edf7 100644
--- a/packages/svelte/tests/runtime-browser/test.ts
+++ b/packages/svelte/tests/runtime-browser/test.ts
@@ -79,6 +79,7 @@ async function run_test(
 			__CONFIG__: path.resolve(test_dir, '_config.js'),
 			'assert.js': assert_file
 		},
+		conditions: ['browser', 'production'],
 		plugins: [
 			{
 				name: 'testing-runtime-browser',
@@ -131,6 +132,7 @@ async function run_test(
 				__MAIN_DOT_SVELTE__: path.resolve(test_dir, 'main.svelte'),
 				__CONFIG__: path.resolve(test_dir, '_config.js')
 			},
+			conditions: ['browser', 'production'],
 			plugins: [
 				{
 					name: 'testing-runtime-browser-ssr',
@@ -191,9 +193,11 @@ async function run_test(
 
 	try {
 		const page = await browser.newPage();
-		page.on('console', (type) => {
+		page.on('console', (message) => {
+			let method = message.type();
+			if (method === 'warning') method = 'warn';
 			// @ts-ignore
-			console[type.type()](type.text());
+			console[method](message.text());
 		});
 
 		if (build_result_ssr) {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index bc431a4096..b604c59f20 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -81,8 +81,8 @@ importers:
         specifier: ^4.1.0
         version: 4.1.0
       esm-env:
-        specifier: ^1.2.0
-        version: 1.2.0
+        specifier: ^1.2.1
+        version: 1.2.1
       esrap:
         specifier: ^1.2.3
         version: 1.2.3
@@ -224,7 +224,7 @@ importers:
         version: 6.0.1(@lezer/common@1.2.1)
       esm-env:
         specifier: ^1.0.0
-        version: 1.2.0
+        version: 1.2.1
       marked:
         specifier: ^7.0.2
         version: 7.0.5
@@ -1442,8 +1442,8 @@ packages:
       jiti:
         optional: true
 
-  esm-env@1.2.0:
-    resolution: {integrity: sha512-OhSQuHL3mUcaQHjGe8UMG8GsJIJHYYz0flR0h9fiTPNMupLMkb7TvcRD0EeJXW5a8GHBgfz08b6FDLNK7kkPQA==}
+  esm-env@1.2.1:
+    resolution: {integrity: sha512-U9JedYYjCnadUlXk7e1Kr+aENQhtUaoaV9+gZm1T8LC/YBAPJx3NSPIAurFOC0U5vrdSevnUJS2/wUVxGwPhng==}
 
   espree@10.1.0:
     resolution: {integrity: sha512-M1M6CpiE6ffoigIOWYO9UDP8TMUw9kqb21tf+08IgDYjCsOvCuDt4jQcZmoYxx+w7zlKw9/N0KXfto+I8/FrXA==}
@@ -3519,7 +3519,7 @@ snapshots:
       '@types/cookie': 0.6.0
       cookie: 0.6.0
       devalue: 5.1.1
-      esm-env: 1.2.0
+      esm-env: 1.2.1
       import-meta-resolve: 4.1.0
       kleur: 4.1.5
       magic-string: 0.30.11
@@ -3534,7 +3534,7 @@ snapshots:
   '@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.0
+      esm-env: 1.2.1
       svelte: link:packages/svelte
       svelte-persisted-store: 0.9.2(svelte@packages+svelte)
 
@@ -4182,7 +4182,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  esm-env@1.2.0: {}
+  esm-env@1.2.1: {}
 
   espree@10.1.0:
     dependencies:

From 6dd60b568523398691903184fce40bccda35f4e6 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sat, 30 Nov 2024 08:46:38 -0800
Subject: [PATCH 221/404] Version Packages (#14477)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/gentle-bulldogs-heal.md |  5 -----
 .changeset/itchy-timers-relax.md   |  5 -----
 .changeset/sixty-kings-learn.md    |  5 -----
 packages/svelte/CHANGELOG.md       | 10 ++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/gentle-bulldogs-heal.md
 delete mode 100644 .changeset/itchy-timers-relax.md
 delete mode 100644 .changeset/sixty-kings-learn.md

diff --git a/.changeset/gentle-bulldogs-heal.md b/.changeset/gentle-bulldogs-heal.md
deleted file mode 100644
index 32c1d6714c..0000000000
--- a/.changeset/gentle-bulldogs-heal.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: upgrade to esm-env 1.2.1 to fix issues with non-Vite setups
diff --git a/.changeset/itchy-timers-relax.md b/.changeset/itchy-timers-relax.md
deleted file mode 100644
index 5d0913ba62..0000000000
--- a/.changeset/itchy-timers-relax.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent infinite loops when pruning CSS
diff --git a/.changeset/sixty-kings-learn.md b/.changeset/sixty-kings-learn.md
deleted file mode 100644
index 927e21fa78..0000000000
--- a/.changeset/sixty-kings-learn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: generate correct code when encountering object expression statement
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 0c75e07a32..b66a6e7e4f 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.2.12
+
+### Patch Changes
+
+- fix: upgrade to esm-env 1.2.1 to fix issues with non-Vite setups ([#14470](https://github.com/sveltejs/svelte/pull/14470))
+
+- fix: prevent infinite loops when pruning CSS ([#14474](https://github.com/sveltejs/svelte/pull/14474))
+
+- fix: generate correct code when encountering object expression statement ([#14480](https://github.com/sveltejs/svelte/pull/14480))
+
 ## 5.2.11
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index cd61ce2e88..641dcfa335 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.2.11",
+  "version": "5.2.12",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 517a76e74c..500b12a06e 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.2.11';
+export const VERSION = '5.2.12';
 export const PUBLIC_VERSION = '5';

From f2eed15c021b038a77cb97e71c565823ef2c16fb Mon Sep 17 00:00:00 2001
From: Romain l'Ourson <rcrestey@gmail.com>
Date: Sat, 30 Nov 2024 18:25:14 +0100
Subject: [PATCH 222/404] docs: fix scale description (#14454)

* Fix scale description

* regenerate

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 packages/svelte/src/transition/index.js | 2 +-
 packages/svelte/types/index.d.ts        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/svelte/src/transition/index.js b/packages/svelte/src/transition/index.js
index 8cc054cba2..4123106211 100644
--- a/packages/svelte/src/transition/index.js
+++ b/packages/svelte/src/transition/index.js
@@ -136,7 +136,7 @@ export function slide(node, { delay = 0, duration = 400, easing = cubic_out, axi
 }
 
 /**
- * Animates the opacity and scale of an element. `in` transitions animate from an element's current (default) values to the provided values, passed as parameters. `out` transitions animate from the provided values to an element's default values.
+ * Animates the opacity and scale of an element. `in` transitions animate from the provided values, passed as parameters, to an element's current (default) values. `out` transitions animate from an element's default values to the provided values.
  *
  * @param {Element} node
  * @param {ScaleParams} [params]
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 01119e7485..c30662cc76 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1942,7 +1942,7 @@ declare module 'svelte/transition' {
 	 * */
 	export function slide(node: Element, { delay, duration, easing, axis }?: SlideParams | undefined): TransitionConfig;
 	/**
-	 * Animates the opacity and scale of an element. `in` transitions animate from an element's current (default) values to the provided values, passed as parameters. `out` transitions animate from the provided values to an element's default values.
+	 * Animates the opacity and scale of an element. `in` transitions animate from the provided values, passed as parameters, to an element's current (default) values. `out` transitions animate from an element's default values to the provided values.
 	 *
 	 * */
 	export function scale(node: Element, { delay, duration, easing, start, opacity }?: ScaleParams | undefined): TransitionConfig;

From ed7ebcde1e8f01c49bc3082d00724e092803ac63 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sun, 1 Dec 2024 13:53:42 +0000
Subject: [PATCH 223/404] feat: add error boundaries (#14211)

* feat: add error boundary support

tweak

tweak again

retry -> reset

tweaks

add tests

tweaks

tweaks

tweaks

more tests

more tests and tweaks

comments

tweak

tweak

tweak

tweak

tweak

* tweak

tweak

tweak

tweak

more fixes

tweak

tweak

more fixes

changeset

* Update packages/svelte/elements.d.ts

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

* Update .changeset/polite-peaches-do.md

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

* fix issue with rethrowing

* handle fallback error

* handle fallback error

* add more test coverage

* more tests

* more bug fixes

* guard against non-errors

* add component_stack to error

* alternative approach

* remove spread support

* lint

* add to legacy ast

* add to svelte-html

* disallow anything but attributes on the boundary element

* fix error

* more validation

* only create block when necessary

* swap argument order - results in nicer-looking code in many cases

* Update .changeset/polite-peaches-do.md

* simplify a bit

* simplify

* move declaration closer to usage

* push once

* unused

* tweaks

* consistent naming

* simplify

* add a couple newlines

* tweak comments

* simplify

* newlines

* placeholder documentation

* add some docs

* Update packages/svelte/src/internal/client/dom/blocks/boundary.js

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

* Update packages/svelte/src/internal/client/dom/blocks/boundary.js

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

* Update packages/svelte/src/internal/client/dom/blocks/boundary.js

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

* fix type

* fix link

* explain what happens if onerror throws

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/polite-peaches-do.md               |   5 +
 .../05-special-elements/01-svelte-boundary.md |  79 ++++++++++
 ...1-svelte-window.md => 02-svelte-window.md} |   0
 ...elte-document.md => 03-svelte-document.md} |   0
 .../{03-svelte-body.md => 04-svelte-body.md}  |   0
 .../{04-svelte-head.md => 05-svelte-head.md}  |   0
 ...svelte-element.md => 06-svelte-element.md} |   0
 ...svelte-options.md => 07-svelte-options.md} |   0
 .../98-reference/.generated/compile-errors.md |  12 ++
 packages/svelte/elements.d.ts                 |   4 +
 .../messages/compile-errors/template.md       |   8 +
 packages/svelte/src/compiler/errors.js        |  18 +++
 packages/svelte/src/compiler/legacy.js        |  14 ++
 .../compiler/phases/1-parse/state/element.js  |   3 +-
 .../src/compiler/phases/2-analyze/index.js    |   2 +
 .../2-analyze/visitors/SvelteBoundary.js      |  27 ++++
 .../3-transform/client/transform-client.js    |   2 +
 .../client/visitors/SvelteBoundary.js         |  61 ++++++++
 .../3-transform/server/transform-server.js    |   4 +-
 .../server/visitors/SvelteBoundary.js         |  17 +++
 .../src/compiler/phases/3-transform/utils.js  |   1 +
 .../svelte/src/compiler/types/template.d.ts   |   8 +-
 .../svelte/src/internal/client/constants.js   |  27 ++--
 .../internal/client/dom/blocks/boundary.js    | 134 +++++++++++++++++
 .../src/internal/client/dom/template.js       |   1 -
 packages/svelte/src/internal/client/index.js  |   1 +
 .../src/internal/client/reactivity/effects.js |   2 +-
 .../svelte/src/internal/client/runtime.js     | 142 ++++++++++++++----
 packages/svelte/svelte-html.d.ts              |   4 +
 .../samples/svelte-selfdestructive/_config.js |   2 +-
 .../samples/error-boundary-10/_config.js      |  14 ++
 .../samples/error-boundary-10/main.svelte     |  17 +++
 .../samples/error-boundary-11/_config.js      |  14 ++
 .../samples/error-boundary-11/main.svelte     |  17 +++
 .../samples/error-boundary-12/_config.js      |  13 ++
 .../samples/error-boundary-12/main.svelte     |  22 +++
 .../samples/error-boundary-13/Child.svelte    |   7 +
 .../samples/error-boundary-13/_config.js      |  13 ++
 .../samples/error-boundary-13/main.svelte     |  22 +++
 .../samples/error-boundary-14/Child.svelte    |   9 ++
 .../samples/error-boundary-14/_config.js      |   9 ++
 .../samples/error-boundary-14/main.svelte     |   9 ++
 .../samples/error-boundary-15/Child.svelte    |   9 ++
 .../samples/error-boundary-15/_config.js      |   9 ++
 .../samples/error-boundary-15/main.svelte     |  19 +++
 .../samples/error-boundary-16/Child.svelte    |  13 ++
 .../samples/error-boundary-16/_config.js      |  24 +++
 .../samples/error-boundary-16/main.svelte     |  12 ++
 .../samples/error-boundary-17/Child.svelte    |  15 ++
 .../samples/error-boundary-17/_config.js      |  15 ++
 .../samples/error-boundary-17/main.svelte     |  18 +++
 .../samples/error-boundary-18/_config.js      |  15 ++
 .../samples/error-boundary-18/main.svelte     |  16 ++
 .../samples/error-boundary-19/_config.js      |  14 ++
 .../samples/error-boundary-19/main.svelte     |  22 +++
 .../samples/error-boundary-2/_config.js       |  13 ++
 .../samples/error-boundary-2/main.svelte      |  15 ++
 .../samples/error-boundary-3/_config.js       |  14 ++
 .../samples/error-boundary-3/main.svelte      |  17 +++
 .../samples/error-boundary-4/_config.js       |  14 ++
 .../samples/error-boundary-4/main.svelte      |  17 +++
 .../samples/error-boundary-5/Child.svelte     |  13 ++
 .../samples/error-boundary-5/_config.js       |  31 ++++
 .../samples/error-boundary-5/main.svelte      |  18 +++
 .../samples/error-boundary-6/_config.js       |  13 ++
 .../samples/error-boundary-6/main.svelte      |  20 +++
 .../samples/error-boundary-7/Child.svelte     |   5 +
 .../samples/error-boundary-7/_config.js       |   8 +
 .../samples/error-boundary-7/main.svelte      |  14 ++
 .../samples/error-boundary-8/Child.svelte     |   5 +
 .../samples/error-boundary-8/_config.js       |   8 +
 .../samples/error-boundary-8/main.svelte      |  17 +++
 .../samples/error-boundary-9/Child.svelte     |   5 +
 .../samples/error-boundary-9/_config.js       |   8 +
 .../samples/error-boundary-9/main.svelte      |  20 +++
 .../samples/error-boundary/_config.js         |   9 ++
 .../samples/error-boundary/main.svelte        |  11 ++
 packages/svelte/types/index.d.ts              |   8 +-
 78 files changed, 1199 insertions(+), 49 deletions(-)
 create mode 100644 .changeset/polite-peaches-do.md
 create mode 100644 documentation/docs/05-special-elements/01-svelte-boundary.md
 rename documentation/docs/05-special-elements/{01-svelte-window.md => 02-svelte-window.md} (100%)
 rename documentation/docs/05-special-elements/{02-svelte-document.md => 03-svelte-document.md} (100%)
 rename documentation/docs/05-special-elements/{03-svelte-body.md => 04-svelte-body.md} (100%)
 rename documentation/docs/05-special-elements/{04-svelte-head.md => 05-svelte-head.md} (100%)
 rename documentation/docs/05-special-elements/{05-svelte-element.md => 06-svelte-element.md} (100%)
 rename documentation/docs/05-special-elements/{06-svelte-options.md => 07-svelte-options.md} (100%)
 create mode 100644 packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteBoundary.js
 create mode 100644 packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBoundary.js
 create mode 100644 packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteBoundary.js
 create mode 100644 packages/svelte/src/internal/client/dom/blocks/boundary.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-10/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-10/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-11/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-11/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-12/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-12/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-13/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-13/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-13/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-14/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-14/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-14/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-15/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-15/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-15/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-16/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-16/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-16/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-17/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-17/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-17/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-18/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-18/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-19/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-19/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-2/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-3/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-4/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-4/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-5/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-5/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-5/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-6/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-6/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-7/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-7/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-7/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-8/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-8/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-8/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-9/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-9/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-9/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary/main.svelte

diff --git a/.changeset/polite-peaches-do.md b/.changeset/polite-peaches-do.md
new file mode 100644
index 0000000000..7b59c33ea7
--- /dev/null
+++ b/.changeset/polite-peaches-do.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add error boundaries with `<svelte:boundary>`
diff --git a/documentation/docs/05-special-elements/01-svelte-boundary.md b/documentation/docs/05-special-elements/01-svelte-boundary.md
new file mode 100644
index 0000000000..2e9f85c83a
--- /dev/null
+++ b/documentation/docs/05-special-elements/01-svelte-boundary.md
@@ -0,0 +1,79 @@
+---
+title: <svelte:boundary>
+---
+
+```svelte
+<svelte:boundary onerror={handler}>...</svelte:boundary>
+```
+
+Boundaries allow you to guard against errors in part of your app from breaking the app as a whole, and to recover from those errors.
+
+If an error occurs while rendering or updating the children of a `<svelte:boundary>`, or running any [`$effect`]($effect) functions contained therein, the contents will be removed.
+
+Errors occurring outside the rendering process (for example, in event handlers) are _not_ caught by error boundaries.
+
+## Properties
+
+For the boundary to do anything, one or both of `failed` and `onerror` must be provided.
+
+### `failed`
+
+If an `failed` snippet is provided, it will be rendered with the error that was thrown, and a `reset` function that recreates the contents ([demo](/playground/hello-world#H4sIAAAAAAAAE3VRy26DMBD8lS2tFCIh6JkAUlWp39Cq9EBg06CAbdlLArL87zWGKk8ORnhmd3ZnrD1WtOjFXqKO2BDGW96xqpBD5gXerm5QefG39mgQY9EIWHxueRMinLosti0UPsJLzggZKTeilLWgLGc51a3gkuCjKQ7DO7cXZotgJ3kLqzC6hmex1SZnSXTWYHcrj8LJjWTk0PHoZ8VqIdCOKayPykcpuQxAokJaG1dGybYj4gw4K5u6PKTasSbjXKgnIDlA8VvUdo-pzonraBY2bsH7HAl78mKSHZpgIcuHjq9jXSpZSLixRlveKYQUXhQVhL6GPobXAAb7BbNeyvNUs4qfRg3OnELLj5hqH9eQZqCnoBwR9lYcQxuVXeBzc8kMF8yXY4yNJ5oGiUzP_aaf_waTRGJib5_Ad3P_vbCuaYxzeNpbU0eUMPAOKh7Yw1YErgtoXyuYlPLzc10_xo_5A91zkQL_AgAA)):
+
+```svelte
+<svelte:boundary>
+	<FlakyComponent />
+
+	{#snippet failed(error, reset)}
+		<button onclick={reset}>oops! try again</button>
+	{/snippet}
+</svelte:boundary>
+```
+
+> [!NOTE]
+> As with [snippets passed to components](snippet#Passing-snippets-to-components), the `failed` snippet can be passed explicitly as a property...
+>
+> ```svelte
+> <svelte:boundary {failed}>...</svelte:boundary>
+> ```
+>
+> ...or implicitly by declaring it directly inside the boundary, as in the example above.
+
+### `onerror`
+
+If an `onerror` function is provided, it will be called with the same two `error` and `reset` arguments. This is useful for tracking the error with an error reporting service...
+
+```svelte
+<svelte:boundary onerror={(e) => report(e)}>
+	...
+</svelte:boundary>
+```
+
+...or using `error` and `reset` outside the boundary itself:
+
+```svelte
+<script>
+	let error = $state(null);
+	let reset = $state(() => {});
+
+	function onerror(e, r) {
+		error = e;
+		reset = r;
+	}
+</script>
+
+<svelte:boundary {onerror}>
+	<FlakyComponent />
+</svelte:boundary>
+
+{#if error}
+	<button onclick={() => {
+		error = null;
+		reset();
+	}}>
+		oops! try again
+	</button>
+{/if}
+```
+
+If an error occurs inside the `onerror` function (or if you rethrow the error), it will be handled by a parent boundary if such exists.
diff --git a/documentation/docs/05-special-elements/01-svelte-window.md b/documentation/docs/05-special-elements/02-svelte-window.md
similarity index 100%
rename from documentation/docs/05-special-elements/01-svelte-window.md
rename to documentation/docs/05-special-elements/02-svelte-window.md
diff --git a/documentation/docs/05-special-elements/02-svelte-document.md b/documentation/docs/05-special-elements/03-svelte-document.md
similarity index 100%
rename from documentation/docs/05-special-elements/02-svelte-document.md
rename to documentation/docs/05-special-elements/03-svelte-document.md
diff --git a/documentation/docs/05-special-elements/03-svelte-body.md b/documentation/docs/05-special-elements/04-svelte-body.md
similarity index 100%
rename from documentation/docs/05-special-elements/03-svelte-body.md
rename to documentation/docs/05-special-elements/04-svelte-body.md
diff --git a/documentation/docs/05-special-elements/04-svelte-head.md b/documentation/docs/05-special-elements/05-svelte-head.md
similarity index 100%
rename from documentation/docs/05-special-elements/04-svelte-head.md
rename to documentation/docs/05-special-elements/05-svelte-head.md
diff --git a/documentation/docs/05-special-elements/05-svelte-element.md b/documentation/docs/05-special-elements/06-svelte-element.md
similarity index 100%
rename from documentation/docs/05-special-elements/05-svelte-element.md
rename to documentation/docs/05-special-elements/06-svelte-element.md
diff --git a/documentation/docs/05-special-elements/06-svelte-options.md b/documentation/docs/05-special-elements/07-svelte-options.md
similarity index 100%
rename from documentation/docs/05-special-elements/06-svelte-options.md
rename to documentation/docs/05-special-elements/07-svelte-options.md
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 16cd361e52..77166097a2 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -762,6 +762,18 @@ A component can have a single top-level `<style>` element
 `<svelte:body>` does not support non-event attributes or spread attributes
 ```
 
+### svelte_boundary_invalid_attribute
+
+```
+Valid attributes on `<svelte:boundary>` are `onerror` and `failed`
+```
+
+### svelte_boundary_invalid_attribute_value
+
+```
+Attribute value must be a non-string expression
+```
+
 ### svelte_component_invalid_this
 
 ```
diff --git a/packages/svelte/elements.d.ts b/packages/svelte/elements.d.ts
index 8b2d388bf8..035fa49c31 100644
--- a/packages/svelte/elements.d.ts
+++ b/packages/svelte/elements.d.ts
@@ -2044,6 +2044,10 @@ export interface SvelteHTMLElements {
 		[name: string]: any;
 	};
 	'svelte:head': { [name: string]: any };
+	'svelte:boundary': {
+		onerror?: (error: unknown, reset: () => void) => void;
+		failed?: import('svelte').Snippet<[error: unknown, reset: () => void]>;
+	};
 
 	[name: string]: { [name: string]: any };
 }
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index 38ff87d505..613d11ae51 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -282,6 +282,14 @@ HTML restricts where certain elements can appear. In case of a violation the bro
 
 > `<svelte:body>` does not support non-event attributes or spread attributes
 
+## svelte_boundary_invalid_attribute
+
+> Valid attributes on `<svelte:boundary>` are `onerror` and `failed`
+
+## svelte_boundary_invalid_attribute_value
+
+> Attribute value must be a non-string expression
+
 ## svelte_component_invalid_this
 
 > Invalid component definition — must be an `{expression}`
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index ad2919b34b..bb99275c6b 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -1228,6 +1228,24 @@ export function svelte_body_illegal_attribute(node) {
 	e(node, "svelte_body_illegal_attribute", "`<svelte:body>` does not support non-event attributes or spread attributes");
 }
 
+/**
+ * Valid attributes on `<svelte:boundary>` are `onerror` and `failed`
+ * @param {null | number | NodeLike} 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`");
+}
+
+/**
+ * Attribute value must be a non-string expression
+ * @param {null | number | NodeLike} 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");
+}
+
 /**
  * Invalid component definition — must be an `{expression}`
  * @param {null | number | NodeLike} node
diff --git a/packages/svelte/src/compiler/legacy.js b/packages/svelte/src/compiler/legacy.js
index 52b4bd5860..2d90988936 100644
--- a/packages/svelte/src/compiler/legacy.js
+++ b/packages/svelte/src/compiler/legacy.js
@@ -381,6 +381,20 @@ export function convert(source, ast) {
 					children: node.body.nodes.map((child) => visit(child))
 				};
 			},
+			// @ts-expect-error
+			SvelteBoundary(node, { visit }) {
+				remove_surrounding_whitespace_nodes(node.fragment.nodes);
+				return {
+					type: 'SvelteBoundary',
+					name: 'svelte:boundary',
+					start: node.start,
+					end: node.end,
+					attributes: node.attributes.map(
+						(child) => /** @type {Legacy.LegacyAttributeLike} */ (visit(child))
+					),
+					children: node.fragment.nodes.map((child) => visit(child))
+				};
+			},
 			RegularElement(node, { visit }) {
 				return {
 					type: 'Element',
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 6eed811393..45350bb1ae 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -43,7 +43,8 @@ const meta_tags = new Map([
 	['svelte:element', 'SvelteElement'],
 	['svelte:component', 'SvelteComponent'],
 	['svelte:self', 'SvelteSelf'],
-	['svelte:fragment', 'SvelteFragment']
+	['svelte:fragment', 'SvelteFragment'],
+	['svelte:boundary', 'SvelteBoundary']
 ]);
 
 /** @param {Parser} parser */
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 60f48ac70c..67eea43e1e 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -60,6 +60,7 @@ import { SvelteFragment } from './visitors/SvelteFragment.js';
 import { SvelteHead } from './visitors/SvelteHead.js';
 import { SvelteSelf } from './visitors/SvelteSelf.js';
 import { SvelteWindow } from './visitors/SvelteWindow.js';
+import { SvelteBoundary } from './visitors/SvelteBoundary.js';
 import { TaggedTemplateExpression } from './visitors/TaggedTemplateExpression.js';
 import { Text } from './visitors/Text.js';
 import { TitleElement } from './visitors/TitleElement.js';
@@ -171,6 +172,7 @@ const visitors = {
 	SvelteHead,
 	SvelteSelf,
 	SvelteWindow,
+	SvelteBoundary,
 	TaggedTemplateExpression,
 	Text,
 	TransitionDirective,
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteBoundary.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteBoundary.js
new file mode 100644
index 0000000000..d50cb80cb8
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SvelteBoundary.js
@@ -0,0 +1,27 @@
+/** @import { AST } from '#compiler' */
+/** @import { Context } from '../types' */
+import * as e from '../../../errors.js';
+
+const valid = ['onerror', 'failed'];
+
+/**
+ * @param {AST.SvelteBoundary} node
+ * @param {Context} context
+ */
+export function SvelteBoundary(node, context) {
+	for (const attribute of node.attributes) {
+		if (attribute.type !== 'Attribute' || !valid.includes(attribute.name)) {
+			e.svelte_boundary_invalid_attribute(attribute);
+		}
+
+		if (
+			attribute.value === true ||
+			(Array.isArray(attribute.value) &&
+				(attribute.value.length !== 1 || attribute.value[0].type !== 'ExpressionTag'))
+		) {
+			e.svelte_boundary_invalid_attribute_value(attribute);
+		}
+	}
+
+	context.next();
+}
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 5349f60255..99cb78358a 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
@@ -48,6 +48,7 @@ import { SvelteComponent } from './visitors/SvelteComponent.js';
 import { SvelteDocument } from './visitors/SvelteDocument.js';
 import { SvelteElement } from './visitors/SvelteElement.js';
 import { SvelteFragment } from './visitors/SvelteFragment.js';
+import { SvelteBoundary } from './visitors/SvelteBoundary.js';
 import { SvelteHead } from './visitors/SvelteHead.js';
 import { SvelteSelf } from './visitors/SvelteSelf.js';
 import { SvelteWindow } from './visitors/SvelteWindow.js';
@@ -122,6 +123,7 @@ const visitors = {
 	SvelteDocument,
 	SvelteElement,
 	SvelteFragment,
+	SvelteBoundary,
 	SvelteHead,
 	SvelteSelf,
 	SvelteWindow,
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBoundary.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBoundary.js
new file mode 100644
index 0000000000..ef9f6bd798
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SvelteBoundary.js
@@ -0,0 +1,61 @@
+/** @import { BlockStatement, Statement, Expression } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import * as b from '../../../../utils/builders.js';
+
+/**
+ * @param {AST.SvelteBoundary} node
+ * @param {ComponentContext} context
+ */
+export function SvelteBoundary(node, context) {
+	const props = b.object([]);
+
+	for (const attribute of node.attributes) {
+		if (attribute.type !== 'Attribute' || attribute.value === true) {
+			// these can't exist, because they would have caused validation
+			// to fail, but typescript doesn't know that
+			continue;
+		}
+
+		const chunk = Array.isArray(attribute.value)
+			? /** @type {AST.ExpressionTag} */ (attribute.value[0])
+			: attribute.value;
+
+		const expression = /** @type {Expression} */ (context.visit(chunk.expression, context.state));
+
+		if (attribute.metadata.expression.has_state) {
+			props.properties.push(b.get(attribute.name, [b.return(expression)]));
+		} else {
+			props.properties.push(b.init(attribute.name, expression));
+		}
+	}
+
+	const nodes = [];
+
+	/** @type {Statement[]} */
+	const snippet_statements = [];
+
+	// Capture the `failed` implicit snippet prop
+	for (const child of node.fragment.nodes) {
+		if (child.type === 'SnippetBlock' && child.expression.name === 'failed') {
+			/** @type {Statement[]} */
+			const init = [];
+			context.visit(child, { ...context.state, init });
+			props.properties.push(b.prop('init', child.expression, child.expression));
+			snippet_statements.push(...init);
+		} else {
+			nodes.push(child);
+		}
+	}
+
+	const block = /** @type {BlockStatement} */ (context.visit({ ...node.fragment, nodes }));
+
+	const boundary = b.stmt(
+		b.call('$.boundary', context.state.node, props, b.arrow([b.id('$$anchor')], block))
+	);
+
+	context.state.template.push('<!>');
+	context.state.init.push(
+		snippet_statements.length > 0 ? b.block([...snippet_statements, boundary]) : boundary
+	);
+}
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 c164aa4219..ffde76fab7 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
@@ -38,6 +38,7 @@ import { SvelteSelf } from './visitors/SvelteSelf.js';
 import { TitleElement } from './visitors/TitleElement.js';
 import { UpdateExpression } from './visitors/UpdateExpression.js';
 import { VariableDeclaration } from './visitors/VariableDeclaration.js';
+import { SvelteBoundary } from './visitors/SvelteBoundary.js';
 
 /** @type {Visitors} */
 const global_visitors = {
@@ -75,7 +76,8 @@ const template_visitors = {
 	SvelteFragment,
 	SvelteHead,
 	SvelteSelf,
-	TitleElement
+	TitleElement,
+	SvelteBoundary
 };
 
 /**
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteBoundary.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteBoundary.js
new file mode 100644
index 0000000000..0d54feee11
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteBoundary.js
@@ -0,0 +1,17 @@
+/** @import { BlockStatement } from 'estree' */
+/** @import { AST } from '#compiler' */
+/** @import { ComponentContext } from '../types' */
+import { BLOCK_CLOSE, BLOCK_OPEN } from '../../../../../internal/server/hydration.js';
+import * as b from '../../../../utils/builders.js';
+
+/**
+ * @param {AST.SvelteBoundary} node
+ * @param {ComponentContext} context
+ */
+export function SvelteBoundary(node, context) {
+	context.state.template.push(
+		b.literal(BLOCK_OPEN),
+		/** @type {BlockStatement} */ (context.visit(node.fragment)),
+		b.literal(BLOCK_CLOSE)
+	);
+}
diff --git a/packages/svelte/src/compiler/phases/3-transform/utils.js b/packages/svelte/src/compiler/phases/3-transform/utils.js
index a1b8dc0d03..14fd3aa2e8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/utils.js
@@ -305,6 +305,7 @@ export function clean_nodes(
 				parent.type === 'SnippetBlock' ||
 				parent.type === 'EachBlock' ||
 				parent.type === 'SvelteComponent' ||
+				parent.type === 'SvelteBoundary' ||
 				parent.type === 'Component' ||
 				parent.type === 'SvelteSelf') &&
 			first &&
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index efce217e82..ede4e1693c 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -363,6 +363,11 @@ export namespace AST {
 		name: 'svelte:fragment';
 	}
 
+	export interface SvelteBoundary extends BaseElement {
+		type: 'SvelteBoundary';
+		name: 'svelte:boundary';
+	}
+
 	export interface SvelteHead extends BaseElement {
 		type: 'SvelteHead';
 		name: 'svelte:head';
@@ -520,7 +525,8 @@ export type ElementLike =
 	| AST.SvelteHead
 	| AST.SvelteOptionsRaw
 	| AST.SvelteSelf
-	| AST.SvelteWindow;
+	| AST.SvelteWindow
+	| AST.SvelteBoundary;
 
 export type TemplateNode =
 	| AST.Root
diff --git a/packages/svelte/src/internal/client/constants.js b/packages/svelte/src/internal/client/constants.js
index bcf30e78db..a4840ce4eb 100644
--- a/packages/svelte/src/internal/client/constants.js
+++ b/packages/svelte/src/internal/client/constants.js
@@ -4,21 +4,22 @@ export const RENDER_EFFECT = 1 << 3;
 export const BLOCK_EFFECT = 1 << 4;
 export const BRANCH_EFFECT = 1 << 5;
 export const ROOT_EFFECT = 1 << 6;
-export const UNOWNED = 1 << 7;
-export const DISCONNECTED = 1 << 8;
-export const CLEAN = 1 << 9;
-export const DIRTY = 1 << 10;
-export const MAYBE_DIRTY = 1 << 11;
-export const INERT = 1 << 12;
-export const DESTROYED = 1 << 13;
-export const EFFECT_RAN = 1 << 14;
+export const BOUNDARY_EFFECT = 1 << 7;
+export const UNOWNED = 1 << 8;
+export const DISCONNECTED = 1 << 9;
+export const CLEAN = 1 << 10;
+export const DIRTY = 1 << 11;
+export const MAYBE_DIRTY = 1 << 12;
+export const INERT = 1 << 13;
+export const DESTROYED = 1 << 14;
+export const EFFECT_RAN = 1 << 15;
 /** 'Transparent' effects do not create a transition boundary */
-export const EFFECT_TRANSPARENT = 1 << 15;
+export const EFFECT_TRANSPARENT = 1 << 16;
 /** Svelte 4 legacy mode props need to be handled with deriveds and be recognized elsewhere, hence the dedicated flag */
-export const LEGACY_DERIVED_PROP = 1 << 16;
-export const INSPECT_EFFECT = 1 << 17;
-export const HEAD_EFFECT = 1 << 18;
-export const EFFECT_HAS_DERIVED = 1 << 19;
+export const LEGACY_DERIVED_PROP = 1 << 17;
+export const INSPECT_EFFECT = 1 << 18;
+export const HEAD_EFFECT = 1 << 19;
+export const EFFECT_HAS_DERIVED = 1 << 20;
 
 export const STATE_SYMBOL = Symbol('$state');
 export const STATE_SYMBOL_METADATA = Symbol('$state metadata');
diff --git a/packages/svelte/src/internal/client/dom/blocks/boundary.js b/packages/svelte/src/internal/client/dom/blocks/boundary.js
new file mode 100644
index 0000000000..7f4f000dce
--- /dev/null
+++ b/packages/svelte/src/internal/client/dom/blocks/boundary.js
@@ -0,0 +1,134 @@
+/** @import { Effect, TemplateNode, } from '#client' */
+
+import { BOUNDARY_EFFECT, EFFECT_TRANSPARENT } from '../../constants.js';
+import { block, branch, destroy_effect, pause_effect } from '../../reactivity/effects.js';
+import {
+	active_effect,
+	active_reaction,
+	component_context,
+	handle_error,
+	set_active_effect,
+	set_active_reaction,
+	set_component_context,
+	reset_is_throwing_error
+} from '../../runtime.js';
+import {
+	hydrate_next,
+	hydrate_node,
+	hydrating,
+	next,
+	remove_nodes,
+	set_hydrate_node
+} from '../hydration.js';
+import { queue_micro_task } from '../task.js';
+
+/**
+ * @param {Effect} boundary
+ * @param {() => void} fn
+ */
+function with_boundary(boundary, fn) {
+	var previous_effect = active_effect;
+	var previous_reaction = active_reaction;
+	var previous_ctx = component_context;
+
+	set_active_effect(boundary);
+	set_active_reaction(boundary);
+	set_component_context(boundary.ctx);
+
+	try {
+		fn();
+	} finally {
+		set_active_effect(previous_effect);
+		set_active_reaction(previous_reaction);
+		set_component_context(previous_ctx);
+	}
+}
+
+/**
+ * @param {TemplateNode} node
+ * @param {{
+ * 	 onerror?: (error: unknown, reset: () => void) => void,
+ *   failed?: (anchor: Node, error: () => unknown, reset: () => () => void) => void
+ * }} props
+ * @param {((anchor: Node) => void)} boundary_fn
+ * @returns {void}
+ */
+export function boundary(node, props, boundary_fn) {
+	var anchor = node;
+
+	/** @type {Effect} */
+	var boundary_effect;
+
+	block(() => {
+		var boundary = /** @type {Effect} */ (active_effect);
+		var hydrate_open = hydrate_node;
+		var is_creating_fallback = false;
+
+		// We re-use the effect's fn property to avoid allocation of an additional field
+		boundary.fn = (/** @type {unknown}} */ error) => {
+			var onerror = props.onerror;
+			let failed = props.failed;
+
+			// If we have nothing to capture the error, or if we hit an error while
+			// rendering the fallback, re-throw for another boundary to handle
+			if ((!onerror && !failed) || is_creating_fallback) {
+				throw error;
+			}
+
+			var reset = () => {
+				pause_effect(boundary_effect);
+
+				with_boundary(boundary, () => {
+					is_creating_fallback = false;
+					boundary_effect = branch(() => boundary_fn(anchor));
+					reset_is_throwing_error();
+				});
+			};
+
+			onerror?.(error, reset);
+
+			if (boundary_effect) {
+				destroy_effect(boundary_effect);
+			} else if (hydrating) {
+				set_hydrate_node(hydrate_open);
+				next();
+				set_hydrate_node(remove_nodes());
+			}
+
+			if (failed) {
+				// Render the `failed` snippet in a microtask
+				queue_micro_task(() => {
+					with_boundary(boundary, () => {
+						is_creating_fallback = true;
+
+						try {
+							boundary_effect = branch(() => {
+								failed(
+									anchor,
+									() => error,
+									() => reset
+								);
+							});
+						} catch (error) {
+							handle_error(error, boundary, null, boundary.ctx);
+						}
+
+						reset_is_throwing_error();
+						is_creating_fallback = false;
+					});
+				});
+			}
+		};
+
+		if (hydrating) {
+			hydrate_next();
+		}
+
+		boundary_effect = branch(() => boundary_fn(anchor));
+		reset_is_throwing_error();
+	}, EFFECT_TRANSPARENT | BOUNDARY_EFFECT);
+
+	if (hydrating) {
+		anchor = hydrate_node;
+	}
+}
diff --git a/packages/svelte/src/internal/client/dom/template.js b/packages/svelte/src/internal/client/dom/template.js
index 7ccffc7d2c..bcbae393ec 100644
--- a/packages/svelte/src/internal/client/dom/template.js
+++ b/packages/svelte/src/internal/client/dom/template.js
@@ -4,7 +4,6 @@ import { create_text, get_first_child } from './operations.js';
 import { create_fragment_from_html } from './reconciler.js';
 import { active_effect } from '../runtime.js';
 import { TEMPLATE_FRAGMENT, TEMPLATE_USE_IMPORT_NODE } from '../../../constants.js';
-import { queue_micro_task } from './task.js';
 
 /**
  * @param {TemplateNode} start
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index 6fd749b42c..e8cbefb090 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -124,6 +124,7 @@ export {
 	update_store,
 	mark_store_binding
 } from './reactivity/store.js';
+export { boundary } from './dom/blocks/boundary.js';
 export { set_text } from './render.js';
 export {
 	get,
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 66b489cf54..69b006fc0f 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -464,12 +464,12 @@ export function destroy_effect(effect, remove_dom = true) {
 	}
 
 	// `first` and `child` are nulled out in destroy_effect_children
+	// we don't null out `parent` so that error propagation can work correctly
 	effect.next =
 		effect.prev =
 		effect.teardown =
 		effect.ctx =
 		effect.deps =
-		effect.parent =
 		effect.fn =
 		effect.nodes_start =
 		effect.nodes_end =
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 8931d02009..caa481dd1f 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -24,7 +24,8 @@ import {
 	BLOCK_EFFECT,
 	ROOT_EFFECT,
 	LEGACY_DERIVED_PROP,
-	DISCONNECTED
+	DISCONNECTED,
+	BOUNDARY_EFFECT
 } from './constants.js';
 import { flush_tasks } from './dom/task.js';
 import { add_owner } from './dev/ownership.js';
@@ -37,10 +38,11 @@ import { legacy_mode_flag } from '../flags/index.js';
 
 const FLUSH_MICROTASK = 0;
 const FLUSH_SYNC = 1;
-
 // Used for DEV time error handling
 /** @param {WeakSet<Error>} value */
 const handled_errors = new WeakSet();
+export let is_throwing_error = false;
+
 // Used for controlling the flush of effects.
 let scheduler_mode = FLUSH_MICROTASK;
 // Used for handling scheduling
@@ -229,16 +231,81 @@ export function check_dirtiness(reaction) {
 }
 
 /**
- * @param {Error} error
+ * @param {unknown} error
  * @param {Effect} effect
+ */
+function propagate_error(error, effect) {
+	/** @type {Effect | null} */
+	var current = effect;
+
+	while (current !== null) {
+		if ((current.f & BOUNDARY_EFFECT) !== 0) {
+			try {
+				// @ts-expect-error
+				current.fn(error);
+				return;
+			} catch {
+				// Remove boundary flag from effect
+				current.f ^= BOUNDARY_EFFECT;
+			}
+		}
+
+		current = current.parent;
+	}
+
+	is_throwing_error = false;
+	throw error;
+}
+
+/**
+ * @param {Effect} effect
+ */
+function should_rethrow_error(effect) {
+	return (
+		(effect.f & DESTROYED) === 0 &&
+		(effect.parent === null || (effect.parent.f & BOUNDARY_EFFECT) === 0)
+	);
+}
+
+export function reset_is_throwing_error() {
+	is_throwing_error = false;
+}
+
+/**
+ * @param {unknown} error
+ * @param {Effect} effect
+ * @param {Effect | null} previous_effect
  * @param {ComponentContext | null} component_context
  */
-function handle_error(error, effect, component_context) {
-	// Given we don't yet have error boundaries, we will just always throw.
-	if (!DEV || handled_errors.has(error) || component_context === null) {
-		throw error;
+export function handle_error(error, effect, previous_effect, component_context) {
+	if (is_throwing_error) {
+		if (previous_effect === null) {
+			is_throwing_error = false;
+		}
+
+		if (should_rethrow_error(effect)) {
+			throw error;
+		}
+
+		return;
+	}
+
+	if (previous_effect !== null) {
+		is_throwing_error = true;
 	}
 
+	if (
+		!DEV ||
+		component_context === null ||
+		!(error instanceof Error) ||
+		handled_errors.has(error)
+	) {
+		propagate_error(error, effect);
+		return;
+	}
+
+	handled_errors.add(error);
+
 	const component_stack = [];
 
 	const effect_name = effect.fn?.name;
@@ -268,6 +335,9 @@ function handle_error(error, effect, component_context) {
 	define_property(error, 'message', {
 		value: error.message + `\n${component_stack.map((name) => `\n${indent}in ${name}`).join('')}\n`
 	});
+	define_property(error, 'component_stack', {
+		value: component_stack
+	});
 
 	const stack = error.stack;
 
@@ -287,8 +357,11 @@ function handle_error(error, effect, component_context) {
 		});
 	}
 
-	handled_errors.add(error);
-	throw error;
+	propagate_error(error, effect);
+
+	if (should_rethrow_error(effect)) {
+		throw error;
+	}
 }
 
 /**
@@ -449,7 +522,7 @@ export function update_effect(effect) {
 			dev_effect_stack.push(effect);
 		}
 	} catch (error) {
-		handle_error(/** @type {Error} */ (error), effect, previous_component_context);
+		handle_error(error, effect, previous_effect, previous_component_context || effect.ctx);
 	} finally {
 		active_effect = previous_effect;
 
@@ -529,22 +602,28 @@ function flush_queued_effects(effects) {
 	for (var i = 0; i < length; i++) {
 		var effect = effects[i];
 
-		if ((effect.f & (DESTROYED | INERT)) === 0 && check_dirtiness(effect)) {
-			update_effect(effect);
-
-			// Effects with no dependencies or teardown do not get added to the effect tree.
-			// Deferred effects (e.g. `$effect(...)`) _are_ added to the tree because we
-			// don't know if we need to keep them until they are executed. Doing the check
-			// here (rather than in `update_effect`) allows us to skip the work for
-			// immediate effects.
-			if (effect.deps === null && effect.first === null && effect.nodes_start === null) {
-				if (effect.teardown === null) {
-					// remove this effect from the graph
-					unlink_effect(effect);
-				} else {
-					// keep the effect in the graph, but free up some memory
-					effect.fn = null;
+		if ((effect.f & (DESTROYED | INERT)) === 0) {
+			try {
+				if (check_dirtiness(effect)) {
+					update_effect(effect);
+
+					// Effects with no dependencies or teardown do not get added to the effect tree.
+					// Deferred effects (e.g. `$effect(...)`) _are_ added to the tree because we
+					// don't know if we need to keep them until they are executed. Doing the check
+					// here (rather than in `update_effect`) allows us to skip the work for
+					// immediate effects.
+					if (effect.deps === null && effect.first === null && effect.nodes_start === null) {
+						if (effect.teardown === null) {
+							// remove this effect from the graph
+							unlink_effect(effect);
+						} else {
+							// keep the effect in the graph, but free up some memory
+							effect.fn = null;
+						}
+					}
 				}
+			} catch (error) {
+				handle_error(error, effect, null, effect.ctx);
 			}
 		}
 	}
@@ -612,13 +691,20 @@ function process_effects(effect, collected_effects) {
 		var flags = current_effect.f;
 		var is_branch = (flags & BRANCH_EFFECT) !== 0;
 		var is_skippable_branch = is_branch && (flags & CLEAN) !== 0;
+		var sibling = current_effect.next;
 
 		if (!is_skippable_branch && (flags & INERT) === 0) {
 			if ((flags & RENDER_EFFECT) !== 0) {
 				if (is_branch) {
 					current_effect.f ^= CLEAN;
-				} else if (check_dirtiness(current_effect)) {
-					update_effect(current_effect);
+				} else {
+					try {
+						if (check_dirtiness(current_effect)) {
+							update_effect(current_effect);
+						}
+					} catch (error) {
+						handle_error(error, current_effect, null, current_effect.ctx);
+					}
 				}
 
 				var child = current_effect.first;
@@ -632,8 +718,6 @@ function process_effects(effect, collected_effects) {
 			}
 		}
 
-		var sibling = current_effect.next;
-
 		if (sibling === null) {
 			let parent = current_effect.parent;
 
diff --git a/packages/svelte/svelte-html.d.ts b/packages/svelte/svelte-html.d.ts
index 50f7c25fc2..5042eaa4b8 100644
--- a/packages/svelte/svelte-html.d.ts
+++ b/packages/svelte/svelte-html.d.ts
@@ -244,6 +244,10 @@ declare global {
 			'svelte:document': HTMLProps<'svelte:document', HTMLAttributes>;
 			'svelte:fragment': { slot?: string };
 			'svelte:head': { [name: string]: any };
+			'svelte:boundary': {
+				onerror?: (error: unknown, reset: () => void) => void;
+				failed?: import('svelte').Snippet<[error: unknown, reset: () => void]>;
+			};
 			// don't type svelte:options, it would override the types in svelte/elements and it isn't extendable anyway
 
 			[name: string]: { [name: string]: any };
diff --git a/packages/svelte/tests/compiler-errors/samples/svelte-selfdestructive/_config.js b/packages/svelte/tests/compiler-errors/samples/svelte-selfdestructive/_config.js
index 371ddb81db..de5ee3bb69 100644
--- a/packages/svelte/tests/compiler-errors/samples/svelte-selfdestructive/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/svelte-selfdestructive/_config.js
@@ -4,7 +4,7 @@ export default test({
 	error: {
 		code: 'svelte_meta_invalid_tag',
 		message:
-			'Valid `<svelte:...>` tag names are svelte:head, svelte:options, svelte:window, svelte:document, svelte:body, svelte:element, svelte:component, svelte:self or svelte:fragment',
+			'Valid `<svelte:...>` tag names are svelte:head, svelte:options, svelte:window, svelte:document, svelte:body, svelte:element, svelte:component, svelte:self, svelte:fragment or svelte:boundary',
 		position: [10, 32]
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-10/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-10/_config.js
new file mode 100644
index 0000000000..b8858d41fd
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-10/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+
+		btn2?.click();
+		btn1?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught!!!']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-10/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-10/main.svelte
new file mode 100644
index 0000000000..06c5e8004b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-10/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+	let onerror = $state((e) => console.log('error caught'));
+</script>
+
+<svelte:boundary {onerror}>
+	{count > 0 ? throw_error() : null}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
+<button onclick={() => onerror = () => console.log('error caught!!!')}>change error message</button>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-11/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-11/_config.js
new file mode 100644
index 0000000000..b8858d41fd
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-11/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+
+		btn2?.click();
+		btn1?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught!!!']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-11/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-11/main.svelte
new file mode 100644
index 0000000000..f16b85527d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-11/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+	let props = $state({ onerror: (e) => console.log('error caught') });
+</script>
+
+<svelte:boundary onerror={props.onerror}>
+	{count > 0 ? throw_error() : null}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
+<button onclick={() => props = { onerror: () => console.log('error caught!!!') }}>change error message</button>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-12/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-12/_config.js
new file mode 100644
index 0000000000..b3edfefa20
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-12/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<button>change</button><p>Error occured</p>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-12/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-12/main.svelte
new file mode 100644
index 0000000000..bae46c2590
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-12/main.svelte
@@ -0,0 +1,22 @@
+<script>
+	let count = $state(0);
+
+	const things = $derived.by(() => {
+		if (count === 1) {
+			throw new Error('123')
+		}
+		return [1, 2 ,3]
+	})
+</script>
+
+<button onclick={() => count++}>change</button>
+
+<svelte:boundary>
+	{#each things as thing}
+		<p>{thing}</p>
+	{/each}
+
+	{#snippet failed()}
+		<p>Error occured</p>
+	{/snippet}
+</svelte:boundary>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-13/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/Child.svelte
new file mode 100644
index 0000000000..6e607871d3
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/Child.svelte
@@ -0,0 +1,7 @@
+<script>
+	const { things } = $props();
+
+	$effect(() => {
+		things
+	})
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-13/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/_config.js
new file mode 100644
index 0000000000..b3edfefa20
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<button>change</button><p>Error occured</p>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-13/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/main.svelte
new file mode 100644
index 0000000000..65b71106fa
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-13/main.svelte
@@ -0,0 +1,22 @@
+<script>
+	import Child from './Child.svelte';
+
+	let count = $state(0);
+
+	const things = $derived.by(() => {
+		if (count === 1) {
+			throw new Error('123')
+		}
+		return [1, 2 ,3]
+	})
+</script>
+
+<button onclick={() => count++}>change</button>
+
+<svelte:boundary>
+	<Child {things} />
+
+	{#snippet failed()}
+		<p>Error occured</p>
+	{/snippet}
+</svelte:boundary>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-14/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/Child.svelte
new file mode 100644
index 0000000000..34e9cddfda
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/Child.svelte
@@ -0,0 +1,9 @@
+<script>
+	function throw_error() {
+		throw new Error('throw_error');
+	}
+</script>
+
+{throw_error()}
+
+<div>Foo</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-14/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/_config.js
new file mode 100644
index 0000000000..1befa47b27
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+
+	test({ assert, logs }) {
+		assert.deepEqual(logs, ['error caught']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-14/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/main.svelte
new file mode 100644
index 0000000000..32abad800c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-14/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import Child from "./Child.svelte";
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<Child />
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-15/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/Child.svelte
new file mode 100644
index 0000000000..34e9cddfda
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/Child.svelte
@@ -0,0 +1,9 @@
+<script>
+	function throw_error() {
+		throw new Error('throw_error');
+	}
+</script>
+
+{throw_error()}
+
+<div>Foo</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-15/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/_config.js
new file mode 100644
index 0000000000..592cd3a00d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+
+	test({ assert, logs }) {
+		assert.deepEqual(logs, ['error caught 1', 'error caught 2']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-15/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/main.svelte
new file mode 100644
index 0000000000..e7dbf11d6e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-15/main.svelte
@@ -0,0 +1,19 @@
+<script>
+	import Child from "./Child.svelte";
+
+	function throw_error() {
+		throw new Error('test')
+	}
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught 2')}>
+	<svelte:boundary onerror={(e) => console.log('error caught 1')}>
+		<Child />
+
+		{#snippet failed()}
+			{throw_error()}
+		{/snippet}
+	</svelte:boundary>
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-16/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/Child.svelte
new file mode 100644
index 0000000000..0b78b50736
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/Child.svelte
@@ -0,0 +1,13 @@
+<script>
+	let count = $state(0);
+
+	$effect.pre(() => {
+		if (count > 1) {
+			throw new Error('too high');
+		}
+	});
+</script>
+
+{count}
+
+<button onclick={() => count++}>+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-16/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/_config.js
new file mode 100644
index 0000000000..94a3638b28
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/_config.js
@@ -0,0 +1,24 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>An error occurred!</div>\n0\n<button>+</button>`);
+
+		btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught', 'error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>An error occurred!</div>\n0\n<button>+</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-16/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/main.svelte
new file mode 100644
index 0000000000..b8db3c8c5a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-16/main.svelte
@@ -0,0 +1,12 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<Child />
+
+	{#snippet failed(err, reset)}
+		<div>An error occurred!</div>
+		<Child />
+	{/snippet}
+</svelte:boundary>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-17/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/Child.svelte
new file mode 100644
index 0000000000..b96257d961
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/Child.svelte
@@ -0,0 +1,15 @@
+<script>
+	const { initial = 0 } = $props();
+
+	let count = $state(initial);
+
+	$effect.pre(() => {
+		if (count > 1) {
+			throw 'too high';
+		}
+	});
+</script>
+
+{count}
+
+<button onclick={() => count++}>+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-17/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/_config.js
new file mode 100644
index 0000000000..5fb155f998
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/_config.js
@@ -0,0 +1,15 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught 1', 'error caught 2']);
+		assert.htmlEqual(target.innerHTML, `<div>content before</div><div>content after</div>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-17/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/main.svelte
new file mode 100644
index 0000000000..9675017d34
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-17/main.svelte
@@ -0,0 +1,18 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<div>content before</div>
+
+<svelte:boundary onerror={(e) => console.log('error caught 2')}>
+	<svelte:boundary onerror={(e) => console.log('error caught 1')}>
+		<Child />
+
+		{#snippet failed(err, reset)}
+			<div>An error occurred! {err}</div>
+			<Child initial={2} />
+		{/snippet}
+	</svelte:boundary>
+</svelte:boundary>
+
+<div>content after</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-18/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-18/_config.js
new file mode 100644
index 0000000000..fedaaa9ad1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-18/_config.js
@@ -0,0 +1,15 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+
+		assert.throws(() => {
+			flushSync();
+		}, /test\n\n\tin {expression}\n/);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-18/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-18/main.svelte
new file mode 100644
index 0000000000..b9de7126db
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-18/main.svelte
@@ -0,0 +1,16 @@
+<script>
+	let count = $state(0);
+
+	let test = $derived.by(() => {
+		if (count > 1) {
+			throw new Error('test');
+		}
+	});
+</script>
+
+<svelte:boundary onerror={(e) => { throw(e) }}>
+		<div>Count: {count}</div>
+		<button onclick={() => count++}>Increment</button>
+		{count} / {test}
+</svelte:boundary>
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-19/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-19/_config.js
new file mode 100644
index 0000000000..fd51be3ca1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-19/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught 1', 'error caught 2']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-19/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-19/main.svelte
new file mode 100644
index 0000000000..e24a94220f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-19/main.svelte
@@ -0,0 +1,22 @@
+<script>
+	let count = $state(0);
+
+	let test = $derived.by(() => {
+		if (count > 1) {
+			throw new Error('test');
+		}
+	});
+</script>
+
+<svelte:boundary onerror={(e) => {console.log('error caught 1')}}>
+		<div>Count: {count}</div>
+		<button onclick={() => count++}>Increment</button>
+		{count} / {test}
+</svelte:boundary>
+
+
+<svelte:boundary onerror={(e) => {console.log('error caught 2')}}>
+		<div>Count: {count}</div>
+		<button onclick={() => count++}>Increment</button>
+		{count} / {test}
+</svelte:boundary>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-2/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-2/_config.js
new file mode 100644
index 0000000000..5e7803fc30
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-2/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-2/main.svelte
new file mode 100644
index 0000000000..0f1c7fb54d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-2/main.svelte
@@ -0,0 +1,15 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	{count > 0 ? throw_error() : null}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-3/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-3/_config.js
new file mode 100644
index 0000000000..040e13676e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-3/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>Fallback!</div><button>+</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-3/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-3/main.svelte
new file mode 100644
index 0000000000..bad84666c0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-3/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	{count > 0 ? throw_error() : null}
+
+	{#snippet failed()}
+		<div>Fallback!</div>
+	{/snippet}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-4/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-4/_config.js
new file mode 100644
index 0000000000..040e13676e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-4/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>Fallback!</div><button>+</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-4/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-4/main.svelte
new file mode 100644
index 0000000000..36cb2b1b95
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-4/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+</script>
+
+{#snippet failed()}
+	<div>Fallback!</div>
+{/snippet}
+
+<svelte:boundary {failed} onerror={(e) => console.log('error caught')}>
+	{count > 0 ? throw_error() : null}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-5/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/Child.svelte
new file mode 100644
index 0000000000..0b78b50736
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/Child.svelte
@@ -0,0 +1,13 @@
+<script>
+	let count = $state(0);
+
+	$effect.pre(() => {
+		if (count > 1) {
+			throw new Error('too high');
+		}
+	});
+</script>
+
+{count}
+
+<button onclick={() => count++}>+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-5/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/_config.js
new file mode 100644
index 0000000000..791a4ec7a9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/_config.js
@@ -0,0 +1,31 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>too high</div><button>Retry</button>`);
+
+		const [btn2] = target.querySelectorAll('button');
+
+		btn2?.click();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `0\n<button>+</button>`);
+
+		btn = target.querySelector('button');
+
+		btn?.click();
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['error caught', 'error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>too high</div><button>Retry</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-5/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/main.svelte
new file mode 100644
index 0000000000..f0d1015ee6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-5/main.svelte
@@ -0,0 +1,18 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<svelte:boundary onerror={(e) => { throw e }}>
+		<svelte:boundary>
+			<Child />
+		</svelte:boundary>
+	</svelte:boundary>
+
+	{#snippet failed(e, retry)}
+		<div>too high</div>
+		<button onclick={retry}>Retry</button>
+	{/snippet}
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-6/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-6/_config.js
new file mode 100644
index 0000000000..6a895cfa36
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-6/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<button>+</button><div>There is an error!</div>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-6/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-6/main.svelte
new file mode 100644
index 0000000000..0ea6d964e8
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-6/main.svelte
@@ -0,0 +1,20 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+
+	let count = $state(0);
+	let error = $state();
+</script>
+
+<svelte:boundary onerror={(e) => error = e}>
+	{count > 0 ? throw_error() : null}
+</svelte:boundary>
+
+<button onclick={() => count++}>+</button>
+
+{#if error}
+	<div>There is an error!</div>
+{/if}
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-7/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/Child.svelte
new file mode 100644
index 0000000000..35e4424414
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	$effect.pre(() => {
+		throw new Error('oh noes');
+	});
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-7/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/_config.js
new file mode 100644
index 0000000000..9664c233b7
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>Error!</div><button>Retry</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-7/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/main.svelte
new file mode 100644
index 0000000000..e94dc34b48
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-7/main.svelte
@@ -0,0 +1,14 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<Child />
+
+	{#snippet failed(e, retry)}
+		<div>Error!</div>
+		<button onclick={retry}>Retry</button>
+	{/snippet}
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-8/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/Child.svelte
new file mode 100644
index 0000000000..35e4424414
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	$effect.pre(() => {
+		throw new Error('oh noes');
+	});
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-8/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/_config.js
new file mode 100644
index 0000000000..9664c233b7
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>Error!</div><button>Retry</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-8/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/main.svelte
new file mode 100644
index 0000000000..2cd07dbb46
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-8/main.svelte
@@ -0,0 +1,17 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<!-- boundary should rethrow error as there's no control flow -->
+	<svelte:boundary>
+		<Child />
+	</svelte:boundary>
+
+	{#snippet failed(e, retry)}
+		<div>Error!</div>
+		<button onclick={retry}>Retry</button>
+	{/snippet}
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-9/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/Child.svelte
new file mode 100644
index 0000000000..35e4424414
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	$effect.pre(() => {
+		throw new Error('oh noes');
+	});
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-9/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/_config.js
new file mode 100644
index 0000000000..9664c233b7
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target, logs }) {
+		assert.deepEqual(logs, ['error caught']);
+		assert.htmlEqual(target.innerHTML, `<div>Error!</div><button>Retry</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-9/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/main.svelte
new file mode 100644
index 0000000000..082fe873ee
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-9/main.svelte
@@ -0,0 +1,20 @@
+<script>
+	import Child from './Child.svelte';
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	<!-- boundary should rethrow error as there's no control flow -->
+	<svelte:boundary>
+		<!-- rethrow the error in the handler -->
+		<svelte:boundary onerror={e => { throw e }}>
+			<Child />
+		</svelte:boundary>
+	</svelte:boundary>
+
+	{#snippet failed(e, retry)}
+		<div>Error!</div>
+		<button onclick={retry}>Retry</button>
+	{/snippet}
+</svelte:boundary>
+
+
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary/_config.js
new file mode 100644
index 0000000000..1befa47b27
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+
+	test({ assert, logs }) {
+		assert.deepEqual(logs, ['error caught']);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary/main.svelte
new file mode 100644
index 0000000000..36bf871b5a
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	function throw_error() {
+		throw new Error('test')
+	}
+</script>
+
+<svelte:boundary onerror={(e) => console.log('error caught')}>
+	{throw_error()}
+</svelte:boundary>
+
+
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index c30662cc76..a03b7de570 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1163,6 +1163,11 @@ declare module 'svelte/compiler' {
 			name: 'svelte:fragment';
 		}
 
+		export interface SvelteBoundary extends BaseElement {
+			type: 'SvelteBoundary';
+			name: 'svelte:boundary';
+		}
+
 		export interface SvelteHead extends BaseElement {
 			type: 'SvelteHead';
 			name: 'svelte:head';
@@ -1280,7 +1285,8 @@ declare module 'svelte/compiler' {
 		| AST.SvelteHead
 		| AST.SvelteOptionsRaw
 		| AST.SvelteSelf
-		| AST.SvelteWindow;
+		| AST.SvelteWindow
+		| AST.SvelteBoundary;
 	/**
 	 * 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.

From f75a9a566eafccc8ef96082666166178f967a853 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 1 Dec 2024 08:57:44 -0500
Subject: [PATCH 224/404] Version Packages (#14486)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/polite-peaches-do.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/polite-peaches-do.md

diff --git a/.changeset/polite-peaches-do.md b/.changeset/polite-peaches-do.md
deleted file mode 100644
index 7b59c33ea7..0000000000
--- a/.changeset/polite-peaches-do.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add error boundaries with `<svelte:boundary>`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index b66a6e7e4f..90cdab294f 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.3.0
+
+### Minor Changes
+
+- feat: add error boundaries with `<svelte:boundary>` ([#14211](https://github.com/sveltejs/svelte/pull/14211))
+
 ## 5.2.12
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 641dcfa335..53eb447211 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.2.12",
+  "version": "5.3.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 500b12a06e..b24d5465b1 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.2.12';
+export const VERSION = '5.3.0';
 export const PUBLIC_VERSION = '5';

From 9fcfd7f0d1fc79a9e2449b5ddb3d01875ebb425f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sun, 1 Dec 2024 09:58:14 -0500
Subject: [PATCH 225/404] docs: note when boundaries were added (#14487)

---
 documentation/docs/05-special-elements/01-svelte-boundary.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/documentation/docs/05-special-elements/01-svelte-boundary.md b/documentation/docs/05-special-elements/01-svelte-boundary.md
index 2e9f85c83a..d0a2fb9ae9 100644
--- a/documentation/docs/05-special-elements/01-svelte-boundary.md
+++ b/documentation/docs/05-special-elements/01-svelte-boundary.md
@@ -6,6 +6,9 @@ title: <svelte:boundary>
 <svelte:boundary onerror={handler}>...</svelte:boundary>
 ```
 
+> [!NOTE]
+> This feature was added in 5.3.0
+
 Boundaries allow you to guard against errors in part of your app from breaking the app as a whole, and to recover from those errors.
 
 If an error occurs while rendering or updating the children of a `<svelte:boundary>`, or running any [`$effect`]($effect) functions contained therein, the contents will be removed.

From fe15ad4ae8c6523add7b2a24c86b3feafa7c5cc5 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Sun, 1 Dec 2024 10:22:51 -0500
Subject: [PATCH 226/404] fix: treat spread elements the same as call
 expressions (#14488)

---
 .changeset/silly-readers-double.md               |  5 +++++
 .../src/compiler/phases/2-analyze/index.js       |  2 ++
 .../phases/2-analyze/visitors/SpreadElement.js   | 16 ++++++++++++++++
 .../samples/props-spread-operator/Child.svelte   |  5 +++++
 .../samples/props-spread-operator/_config.js     | 13 +++++++++++++
 .../samples/props-spread-operator/main.svelte    | 10 ++++++++++
 6 files changed, 51 insertions(+)
 create mode 100644 .changeset/silly-readers-double.md
 create mode 100644 packages/svelte/src/compiler/phases/2-analyze/visitors/SpreadElement.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-spread-operator/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-spread-operator/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/props-spread-operator/main.svelte

diff --git a/.changeset/silly-readers-double.md b/.changeset/silly-readers-double.md
new file mode 100644
index 0000000000..6ed1ec41b6
--- /dev/null
+++ b/.changeset/silly-readers-double.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treat spread elements the same as call expressions
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 67eea43e1e..f5cd6ff9f7 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -51,6 +51,7 @@ import { RenderTag } from './visitors/RenderTag.js';
 import { SlotElement } from './visitors/SlotElement.js';
 import { SnippetBlock } from './visitors/SnippetBlock.js';
 import { SpreadAttribute } from './visitors/SpreadAttribute.js';
+import { SpreadElement } from './visitors/SpreadElement.js';
 import { StyleDirective } from './visitors/StyleDirective.js';
 import { SvelteBody } from './visitors/SvelteBody.js';
 import { SvelteComponent } from './visitors/SvelteComponent.js';
@@ -163,6 +164,7 @@ const visitors = {
 	SlotElement,
 	SnippetBlock,
 	SpreadAttribute,
+	SpreadElement,
 	StyleDirective,
 	SvelteBody,
 	SvelteComponent,
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/SpreadElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/SpreadElement.js
new file mode 100644
index 0000000000..c31f86e1a8
--- /dev/null
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/SpreadElement.js
@@ -0,0 +1,16 @@
+/** @import { SpreadElement } from 'estree' */
+/** @import { Context } from '../types' */
+
+/**
+ * @param {SpreadElement} node
+ * @param {Context} context
+ */
+export function SpreadElement(node, context) {
+	if (context.state.expression) {
+		// treat e.g. `[...x]` the same as `[...x.values()]`
+		context.state.expression.has_call = true;
+		context.state.expression.has_state = true;
+	}
+
+	context.next();
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/props-spread-operator/Child.svelte b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/Child.svelte
new file mode 100644
index 0000000000..9897004865
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/Child.svelte
@@ -0,0 +1,5 @@
+<script>
+	let { numbers } = $props();
+</script>
+
+{numbers.join(', ')}
diff --git a/packages/svelte/tests/runtime-runes/samples/props-spread-operator/_config.js b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/_config.js
new file mode 100644
index 0000000000..43fbae84d4
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: '<button>+1</button> 0, 1, 2',
+
+	test({ target, assert }) {
+		const btn = target.querySelector('button');
+
+		flushSync(() => btn?.click());
+		assert.htmlEqual(target.innerHTML, '<button>+1</button> 0, 1, 2, 3');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/props-spread-operator/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/main.svelte
new file mode 100644
index 0000000000..794cdec852
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/props-spread-operator/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	import { SvelteSet } from 'svelte/reactivity';
+	import Child from './Child.svelte';
+
+	const numbers = new SvelteSet([0, 1, 2]);
+</script>
+
+<button onclick={() => numbers.add(numbers.size)}>+1</button>
+
+<Child numbers={[...numbers]} />

From 945b625e95171de227bffa5a44a62dd983b15b93 Mon Sep 17 00:00:00 2001
From: ComputerGuy <63362464+Ocean-OS@users.noreply.github.com>
Date: Sun, 1 Dec 2024 07:23:04 -0800
Subject: [PATCH 227/404] fix: Prevent `$state` `bigint`s incrementing and
 decrementing from throwing (#14485)

* Fix `$.update` and `$.update_pre` for bigints

* resolve conflicts

* fix some things

* fix thing i definitely didn't just break

* hopefully this will fix it

* fix formatting

* simplify

* style consistency

* simplify

* changeset

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/young-beds-beam.md                 |  5 ++++
 .../svelte/src/internal/client/runtime.js     | 25 +++++++++++++------
 packages/svelte/tests/signals/test.ts         | 16 ++++++++++++
 3 files changed, 38 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/young-beds-beam.md

diff --git a/.changeset/young-beds-beam.md b/.changeset/young-beds-beam.md
new file mode 100644
index 0000000000..4349d82dd9
--- /dev/null
+++ b/.changeset/young-beds-beam.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly increment/decrement bigints
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index caa481dd1f..2779898d6f 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -1068,23 +1068,32 @@ function get_parent_context(component_context) {
 }
 
 /**
- * @param {Value<number>} signal
+ * @template {number | bigint} T
+ * @param {Value<T>} signal
  * @param {1 | -1} [d]
- * @returns {number}
+ * @returns {T}
  */
 export function update(signal, d = 1) {
-	var value = +get(signal);
-	set(signal, value + d);
-	return value;
+	var value = get(signal);
+	var result = d === 1 ? value++ : value--;
+
+	set(signal, value);
+
+	// @ts-expect-error
+	return result;
 }
 
 /**
- * @param {Value<number>} signal
+ * @template {number | bigint} T
+ * @param {Value<T>} signal
  * @param {1 | -1} [d]
- * @returns {number}
+ * @returns {T}
  */
 export function update_pre(signal, d = 1) {
-	return set(signal, +get(signal) + d);
+	var value = get(signal);
+
+	// @ts-expect-error
+	return set(signal, d === 1 ? ++value : --value);
 }
 
 /**
diff --git a/packages/svelte/tests/signals/test.ts b/packages/svelte/tests/signals/test.ts
index db061bfb55..6796655cc8 100644
--- a/packages/svelte/tests/signals/test.ts
+++ b/packages/svelte/tests/signals/test.ts
@@ -765,4 +765,20 @@ describe('signals', () => {
 			assert.deepEqual(a.deriveds, null);
 		};
 	});
+
+	test('bigint states update correctly', () => {
+		return () => {
+			const count = state(0n);
+
+			assert.doesNotThrow(() => $.update(count));
+			assert.equal($.get(count), 1n);
+			assert.doesNotThrow(() => $.update(count, -1));
+			assert.equal($.get(count), 0n);
+
+			assert.doesNotThrow(() => $.update_pre(count));
+			assert.equal($.get(count), 1n);
+			assert.doesNotThrow(() => $.update_pre(count, -1));
+			assert.equal($.get(count), 0n);
+		};
+	});
 });

From 99b4cfbb510af722d3d111dac4d0059766ba6610 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 1 Dec 2024 16:20:00 -0500
Subject: [PATCH 228/404] Version Packages (#14489)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/silly-readers-double.md | 5 -----
 .changeset/young-beds-beam.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/silly-readers-double.md
 delete mode 100644 .changeset/young-beds-beam.md

diff --git a/.changeset/silly-readers-double.md b/.changeset/silly-readers-double.md
deleted file mode 100644
index 6ed1ec41b6..0000000000
--- a/.changeset/silly-readers-double.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treat spread elements the same as call expressions
diff --git a/.changeset/young-beds-beam.md b/.changeset/young-beds-beam.md
deleted file mode 100644
index 4349d82dd9..0000000000
--- a/.changeset/young-beds-beam.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly increment/decrement bigints
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 90cdab294f..e840cb08ed 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.3.1
+
+### Patch Changes
+
+- fix: treat spread elements the same as call expressions ([#14488](https://github.com/sveltejs/svelte/pull/14488))
+
+- fix: correctly increment/decrement bigints ([#14485](https://github.com/sveltejs/svelte/pull/14485))
+
 ## 5.3.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 53eb447211..343508b337 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.3.0",
+  "version": "5.3.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index b24d5465b1..ef611c9365 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.3.0';
+export const VERSION = '5.3.1';
 export const PUBLIC_VERSION = '5';

From 1f25bd4f4758529f98880ce85ad215c3e28beaad Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 2 Dec 2024 04:19:27 -0500
Subject: [PATCH 229/404] fix: correctly prune CSS for elements inside snippets
 (#14494)

fixes #14483
---
 .changeset/popular-dogs-exist.md                  |  5 +++++
 .../compiler/phases/2-analyze/css/css-prune.js    | 15 +++++++++------
 .../css/samples/render-tag-loop/expected.css      |  2 +-
 .../css/samples/snippets-elements/expected.css    |  4 ++++
 .../css/samples/snippets-elements/input.svelte    | 13 +++++++++++++
 5 files changed, 32 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/popular-dogs-exist.md
 create mode 100644 packages/svelte/tests/css/samples/snippets-elements/expected.css
 create mode 100644 packages/svelte/tests/css/samples/snippets-elements/input.svelte

diff --git a/.changeset/popular-dogs-exist.md b/.changeset/popular-dogs-exist.md
new file mode 100644
index 0000000000..6d8011b0bb
--- /dev/null
+++ b/.changeset/popular-dogs-exist.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly prune CSS for elements inside snippets
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 83c50c73d0..d017b215f2 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
@@ -201,16 +201,19 @@ function apply_combinator(relative_selector, parent_selectors, rule, node) {
 				const parent = path[i];
 
 				if (parent.type === 'SnippetBlock') {
-					if (seen.has(parent)) return true;
-					seen.add(parent);
+					if (seen.has(parent)) {
+						parent_matched = true;
+					} else {
+						seen.add(parent);
 
-					for (const site of parent.metadata.sites) {
-						if (apply_combinator(relative_selector, parent_selectors, rule, site)) {
-							return true;
+						for (const site of parent.metadata.sites) {
+							if (apply_combinator(relative_selector, parent_selectors, rule, site)) {
+								parent_matched = true;
+							}
 						}
 					}
 
-					return false;
+					break;
 				}
 
 				if (parent.type === 'RegularElement' || parent.type === 'SvelteElement') {
diff --git a/packages/svelte/tests/css/samples/render-tag-loop/expected.css b/packages/svelte/tests/css/samples/render-tag-loop/expected.css
index 1f05ddb41c..9ced15e964 100644
--- a/packages/svelte/tests/css/samples/render-tag-loop/expected.css
+++ b/packages/svelte/tests/css/samples/render-tag-loop/expected.css
@@ -1,5 +1,5 @@
 
-	div div.svelte-xyz {
+	div.svelte-xyz div:where(.svelte-xyz) {
 		color: green;
 	}
 	/* (unused) div + div {
diff --git a/packages/svelte/tests/css/samples/snippets-elements/expected.css b/packages/svelte/tests/css/samples/snippets-elements/expected.css
new file mode 100644
index 0000000000..22dcfce37f
--- /dev/null
+++ b/packages/svelte/tests/css/samples/snippets-elements/expected.css
@@ -0,0 +1,4 @@
+
+	x.svelte-xyz y:where(.svelte-xyz) {
+		color: green;
+	}
diff --git a/packages/svelte/tests/css/samples/snippets-elements/input.svelte b/packages/svelte/tests/css/samples/snippets-elements/input.svelte
new file mode 100644
index 0000000000..a4d7f25375
--- /dev/null
+++ b/packages/svelte/tests/css/samples/snippets-elements/input.svelte
@@ -0,0 +1,13 @@
+{#snippet foo()}
+	<x>
+		<y></y>
+	</x>
+{/snippet}
+
+{@render foo()}
+
+<style>
+	x y {
+		color: green;
+	}
+</style>

From 83cec2f3d1690c3dc5552b2439932884f339bd0b Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 2 Dec 2024 04:23:18 -0500
Subject: [PATCH 230/404] chore: better SSR output for <svelte:element>
 (#14493)

---
 .../3-transform/server/visitors/SvelteElement.js    | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteElement.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteElement.js
index d53a223dbe..9f6faa33c8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SvelteElement.js
@@ -14,13 +14,16 @@ import { build_template } from './shared/utils.js';
  */
 export function SvelteElement(node, context) {
 	let tag = /** @type {Expression} */ (context.visit(node.tag));
-	if (tag.type !== 'Identifier') {
-		const tag_id = context.state.scope.generate('$$tag');
-		context.state.init.push(b.const(tag_id, tag));
-		tag = b.id(tag_id);
-	}
 
 	if (dev) {
+		// Ensure getters/function calls aren't called multiple times.
+		// If we ever start referencing `tag` more than once in prod, move this out of the if block.
+		if (tag.type !== 'Identifier') {
+			const tag_id = context.state.scope.generate('$$tag');
+			context.state.init.push(b.const(tag_id, tag));
+			tag = b.id(tag_id);
+		}
+
 		if (node.fragment.nodes.length > 0) {
 			context.state.init.push(b.stmt(b.call('$.validate_void_dynamic_element', b.thunk(tag))));
 		}

From ef640c3b461783aef983d091712b7e9271d2cc4d Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 2 Dec 2024 04:25:31 -0500
Subject: [PATCH 231/404] fix: render attributes during SSR regardless of case
 (#14492)

fixes part of #14479
---
 .changeset/proud-crews-itch.md                |  5 +++++
 packages/svelte/src/internal/server/index.js  |  4 +++-
 .../samples/dynamic-element-svg/_config.js    | 20 +++++++++++++++++++
 .../samples/dynamic-element-svg/main.svelte   | 11 ++++++++++
 4 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/proud-crews-itch.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/main.svelte

diff --git a/.changeset/proud-crews-itch.md b/.changeset/proud-crews-itch.md
new file mode 100644
index 0000000000..fd4657c588
--- /dev/null
+++ b/.changeset/proud-crews-itch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: render attributes during SSR regardless of case
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 615a49fbd4..b944c602b8 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -222,11 +222,13 @@ export function spread_attributes(attrs, classes, styles, flags = 0) {
 		if (name[0] === '$' && name[1] === '$') continue; // faster than name.startsWith('$$')
 		if (INVALID_ATTR_NAME_CHAR_REGEX.test(name)) continue;
 
+		var value = attrs[name];
+
 		if (lowercase) {
 			name = name.toLowerCase();
 		}
 
-		attr_str += attr(name, attrs[name], is_html && is_boolean_attribute(name));
+		attr_str += attr(name, value, is_html && is_boolean_attribute(name));
 	}
 
 	return attr_str;
diff --git a/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/_config.js b/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/_config.js
new file mode 100644
index 0000000000..b7c96dc8bd
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	mode: ['hydrate'],
+
+	test({ assert, target, hydrate }) {
+		const svg = target.querySelector('svg');
+		const circle = target.querySelector('circle');
+
+		assert.equal(svg?.getAttribute('viewBox'), '0 0 1000 1000');
+		assert.equal(svg?.namespaceURI, 'http://www.w3.org/2000/svg');
+		assert.equal(circle?.namespaceURI, 'http://www.w3.org/2000/svg');
+
+		hydrate();
+
+		assert.equal(svg?.getAttribute('viewBox'), '0 0 1000 1000');
+		assert.equal(svg?.namespaceURI, 'http://www.w3.org/2000/svg');
+		assert.equal(circle?.namespaceURI, 'http://www.w3.org/2000/svg');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/main.svelte b/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/main.svelte
new file mode 100644
index 0000000000..b7e53714ac
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/dynamic-element-svg/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	let props = {
+		height: '100px',
+		width: '100px',
+		viewBox: '0 0 1000 1000'
+	};
+</script>
+
+<svelte:element this={'svg'} {...props}>
+	<circle cx="500" cy="500" r="500"></circle>
+</svelte:element>

From a39605ec7a4437cc30e48e2f8f5f55b28a6a79c1 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 2 Dec 2024 08:18:53 -0500
Subject: [PATCH 232/404] Version Packages (#14499)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/popular-dogs-exist.md | 5 -----
 .changeset/proud-crews-itch.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/popular-dogs-exist.md
 delete mode 100644 .changeset/proud-crews-itch.md

diff --git a/.changeset/popular-dogs-exist.md b/.changeset/popular-dogs-exist.md
deleted file mode 100644
index 6d8011b0bb..0000000000
--- a/.changeset/popular-dogs-exist.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly prune CSS for elements inside snippets
diff --git a/.changeset/proud-crews-itch.md b/.changeset/proud-crews-itch.md
deleted file mode 100644
index fd4657c588..0000000000
--- a/.changeset/proud-crews-itch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: render attributes during SSR regardless of case
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index e840cb08ed..5d6f63b8c6 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.3.2
+
+### Patch Changes
+
+- fix: correctly prune CSS for elements inside snippets ([#14494](https://github.com/sveltejs/svelte/pull/14494))
+
+- fix: render attributes during SSR regardless of case ([#14492](https://github.com/sveltejs/svelte/pull/14492))
+
 ## 5.3.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 343508b337..81c37f025c 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.3.1",
+  "version": "5.3.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index ef611c9365..7307d00a3d 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.3.1';
+export const VERSION = '5.3.2';
 export const PUBLIC_VERSION = '5';

From a283083751e3fa40d50945a362ba1586fb4f36b0 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 2 Dec 2024 14:19:48 +0100
Subject: [PATCH 233/404] feat: each without as (#14396)

* feat: each without as

WIP

closes #8348

* properly

* docs

* changeset

* real world demo

* simplify

* typo

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/sixty-zoos-enjoy.md                |  5 ++
 .../docs/03-template-syntax/03-each.md        | 24 ++++++++++
 .../src/compiler/phases/1-parse/state/tag.js  | 23 +++++++---
 .../phases/2-analyze/visitors/EachBlock.js    |  2 +-
 .../3-transform/client/visitors/EachBlock.js  | 13 +++---
 .../3-transform/server/visitors/EachBlock.js  |  6 ++-
 packages/svelte/src/compiler/phases/scope.js  | 46 ++++++++++---------
 .../svelte/src/compiler/types/template.d.ts   |  3 +-
 .../samples/each-without-as/_config.js        |  5 ++
 .../samples/each-without-as/main.svelte       |  7 +++
 packages/svelte/types/index.d.ts              |  3 +-
 11 files changed, 98 insertions(+), 39 deletions(-)
 create mode 100644 .changeset/sixty-zoos-enjoy.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/each-without-as/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/each-without-as/main.svelte

diff --git a/.changeset/sixty-zoos-enjoy.md b/.changeset/sixty-zoos-enjoy.md
new file mode 100644
index 0000000000..71f3db3e1f
--- /dev/null
+++ b/.changeset/sixty-zoos-enjoy.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: support `#each` without `as`
diff --git a/documentation/docs/03-template-syntax/03-each.md b/documentation/docs/03-template-syntax/03-each.md
index e4246b6e9a..df0ba4d8f5 100644
--- a/documentation/docs/03-template-syntax/03-each.md
+++ b/documentation/docs/03-template-syntax/03-each.md
@@ -74,6 +74,30 @@ You can freely use destructuring and rest patterns in each blocks.
 {/each}
 ```
 
+## Each blocks without an item
+
+```svelte
+<!--- copy: false  --->
+{#each expression}...{/each}
+```
+
+```svelte
+<!--- copy: false  --->
+{#each expression, index}...{/each}
+```
+
+In case you just want to render something `n` times, you can omit the `as` part ([demo](/playground/untitled#H4sIAAAAAAAAE3WR0W7CMAxFf8XKNAk0WsSeUEaRpn3Guoc0MbQiJFHiMlDVf18SOrZJ48259_jaVgZmxBEZZ28thgCNFV6xBdt1GgPj7wOji0t2EqI-wa_OleGEmpLWiID_6dIaQkMxhm1UdwKpRQhVzWSaVORJNdvWpqbhAYVsYQCNZk8thzWMC_DCHMZk3wPSThNQ088I3mghD9UwSwHwlLE5PMIzVFUFq3G7WUZ2OyUvU3JOuZU332wCXTRmtPy1NgzXZtUFp8WFw9536uWqpbIgPEaDsJBW90cTOHh0KGi2XsBq5-cT6-3nPauxXqHnsHJnCFZ3CvJVkyuCQ0mFF9TZyCQ162WGvteLKfG197Y3iv_pz_fmS68Hxt8iPBPj5HscP8YvCNX7uhYCAAA=)):
+
+```svelte
+<div class="chess-board">
+	{#each { length: 8 }, rank}
+		{#each { length: 8 }, file}
+			<div class:black={(rank + file) % 2 === 1}></div>
+		{/each}
+	{/each}
+</div>
+```
+
 ## Else blocks
 
 ```svelte
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 3366c9ec97..317afe6f2f 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -1,4 +1,4 @@
-/** @import { ArrowFunctionExpression, Expression, Identifier } from 'estree' */
+/** @import { ArrowFunctionExpression, Expression, Identifier, Pattern } from 'estree' */
 /** @import { AST } from '#compiler' */
 /** @import { Parser } from '../index.js' */
 import read_pattern from '../read/context.js';
@@ -142,16 +142,25 @@ function open(parser) {
 				parser.index = end;
 			}
 		}
-		parser.eat('as', true);
-		parser.require_whitespace();
-
-		const context = read_pattern(parser);
-
-		parser.allow_whitespace();
 
+		/** @type {Pattern | null} */
+		let context = null;
 		let index;
 		let key;
 
+		if (parser.eat('as')) {
+			parser.require_whitespace();
+
+			context = read_pattern(parser);
+		} else {
+			// {#each Array.from({ length: 10 }), i} is read as a sequence expression,
+			// which is set back above - we now gotta reset the index as a consequence
+			// to properly read the , i part
+			parser.index = /** @type {number} */ (expression.end);
+		}
+
+		parser.allow_whitespace();
+
 		if (parser.eat(',')) {
 			parser.allow_whitespace();
 			index = parser.read_identifier();
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/EachBlock.js
index ac9e75bf8c..bd6c936f99 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/EachBlock.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/EachBlock.js
@@ -16,7 +16,7 @@ export function EachBlock(node, context) {
 	validate_block_not_empty(node.fallback, context);
 
 	const id = node.context;
-	if (id.type === 'Identifier' && (id.name === '$state' || id.name === '$derived')) {
+	if (id?.type === 'Identifier' && (id.name === '$state' || id.name === '$derived')) {
 		// TODO weird that this is necessary
 		e.state_invalid_placement(node, id.name);
 	}
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
index 55d7ded247..d34f39f4c7 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
@@ -47,8 +47,8 @@ export function EachBlock(node, context) {
 
 	const key_is_item =
 		node.key?.type === 'Identifier' &&
-		node.context.type === 'Identifier' &&
-		node.context.name === node.key.name;
+		node.context?.type === 'Identifier' &&
+		node.context?.name === node.key.name;
 
 	// if the each block expression references a store subscription, we need
 	// to use mutable stores internally
@@ -147,7 +147,7 @@ export function EachBlock(node, context) {
 	// which needs a reference to the index
 	const index =
 		each_node_meta.contains_group_binding || !node.index ? each_node_meta.index : b.id(node.index);
-	const item = node.context.type === 'Identifier' ? node.context : b.id('$$item');
+	const item = node.context?.type === 'Identifier' ? node.context : b.id('$$item');
 
 	let uses_index = each_node_meta.contains_group_binding;
 	let key_uses_index = false;
@@ -185,7 +185,7 @@ export function EachBlock(node, context) {
 	if (!context.state.analysis.runes) sequence.push(invalidate);
 	if (invalidate_store) sequence.push(invalidate_store);
 
-	if (node.context.type === 'Identifier') {
+	if (node.context?.type === 'Identifier') {
 		const binding = /** @type {Binding} */ (context.state.scope.get(node.context.name));
 
 		child_state.transform[node.context.name] = {
@@ -218,7 +218,7 @@ export function EachBlock(node, context) {
 		};
 
 		delete key_state.transform[node.context.name];
-	} else {
+	} else if (node.context) {
 		const unwrapped = (flags & EACH_ITEM_REACTIVE) !== 0 ? b.call('$.get', item) : item;
 
 		for (const path of extract_paths(node.context)) {
@@ -260,11 +260,12 @@ export function EachBlock(node, context) {
 	let key_function = b.id('$.index');
 
 	if (node.metadata.keyed) {
+		const pattern = /** @type {Pattern} */ (node.context); // can only be keyed when a context is provided
 		const expression = /** @type {Expression} */ (
 			context.visit(/** @type {Expression} */ (node.key), key_state)
 		);
 
-		key_function = b.arrow(key_uses_index ? [node.context, index] : [node.context], expression);
+		key_function = b.arrow(key_uses_index ? [pattern, index] : [pattern], expression);
 	}
 
 	if (node.index && each_node_meta.contains_group_binding) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/EachBlock.js
index 478bb355a7..104f1f2405 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/EachBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/EachBlock.js
@@ -21,7 +21,11 @@ export function EachBlock(node, context) {
 	state.init.push(b.const(array_id, b.call('$.ensure_array_like', collection)));
 
 	/** @type {Statement[]} */
-	const each = [b.let(/** @type {Pattern} */ (node.context), b.member(array_id, index, true))];
+	const each = [];
+
+	if (node.context) {
+		each.push(b.let(node.context, b.member(array_id, index, true)));
+	}
 
 	if (index.name !== node.index && node.index != null) {
 		each.push(b.let(node.index, index));
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 454bb8c34e..7f22aa7c87 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -527,31 +527,33 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 			const scope = state.scope.child();
 			scopes.set(node, scope);
 
-			// declarations
-			for (const id of extract_identifiers(node.context)) {
-				const binding = scope.declare(id, 'each', 'const');
-
-				let inside_rest = false;
-				let is_rest_id = false;
-				walk(node.context, null, {
-					Identifier(node) {
-						if (inside_rest && node === id) {
-							is_rest_id = true;
+			if (node.context) {
+				// declarations
+				for (const id of extract_identifiers(node.context)) {
+					const binding = scope.declare(id, 'each', 'const');
+
+					let inside_rest = false;
+					let is_rest_id = false;
+					walk(node.context, null, {
+						Identifier(node) {
+							if (inside_rest && node === id) {
+								is_rest_id = true;
+							}
+						},
+						RestElement(_, { next }) {
+							const prev = inside_rest;
+							inside_rest = true;
+							next();
+							inside_rest = prev;
 						}
-					},
-					RestElement(_, { next }) {
-						const prev = inside_rest;
-						inside_rest = true;
-						next();
-						inside_rest = prev;
-					}
-				});
+					});
 
-				binding.metadata = { inside_rest: is_rest_id };
-			}
+					binding.metadata = { inside_rest: is_rest_id };
+				}
 
-			// Visit to pick up references from default initializers
-			visit(node.context, { scope });
+				// Visit to pick up references from default initializers
+				visit(node.context, { scope });
+			}
 
 			if (node.index) {
 				const is_keyed =
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index ede4e1693c..1758b98d24 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -401,7 +401,8 @@ export namespace AST {
 	export interface EachBlock extends BaseNode {
 		type: 'EachBlock';
 		expression: Expression;
-		context: Pattern;
+		/** The `entry` in `{#each item as entry}`. `null` if `as` part is omitted */
+		context: Pattern | null;
 		body: Fragment;
 		fallback?: Fragment;
 		index?: string;
diff --git a/packages/svelte/tests/runtime-runes/samples/each-without-as/_config.js b/packages/svelte/tests/runtime-runes/samples/each-without-as/_config.js
new file mode 100644
index 0000000000..29a59cf6dd
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/each-without-as/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<div>hi</div> <div>hi</div> <div>0</div> <div>1</div>`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/each-without-as/main.svelte b/packages/svelte/tests/runtime-runes/samples/each-without-as/main.svelte
new file mode 100644
index 0000000000..975ba2667b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/each-without-as/main.svelte
@@ -0,0 +1,7 @@
+{#each [10, 20]}
+	<div>hi</div>
+{/each}
+
+{#each [10, 20], i}
+	 <div>{i}</div>
+{/each}
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index a03b7de570..0814796d27 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -1193,7 +1193,8 @@ declare module 'svelte/compiler' {
 		export interface EachBlock extends BaseNode {
 			type: 'EachBlock';
 			expression: Expression;
-			context: Pattern;
+			/** The `entry` in `{#each item as entry}`. `null` if `as` part is omitted */
+			context: Pattern | null;
 			body: Fragment;
 			fallback?: Fragment;
 			index?: string;

From a091fb5ce6f159d01e6c252c8f296954a15f4ffd Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 2 Dec 2024 08:21:53 -0500
Subject: [PATCH 234/404] Version Packages (#14501)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/sixty-zoos-enjoy.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/sixty-zoos-enjoy.md

diff --git a/.changeset/sixty-zoos-enjoy.md b/.changeset/sixty-zoos-enjoy.md
deleted file mode 100644
index 71f3db3e1f..0000000000
--- a/.changeset/sixty-zoos-enjoy.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: support `#each` without `as`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 5d6f63b8c6..a0c9e67285 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.4.0
+
+### Minor Changes
+
+- feat: support `#each` without `as` ([#14396](https://github.com/sveltejs/svelte/pull/14396))
+
 ## 5.3.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 81c37f025c..ce9d4e58f5 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.3.2",
+  "version": "5.4.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 7307d00a3d..3c7791b29c 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.3.2';
+export const VERSION = '5.4.0';
 export const PUBLIC_VERSION = '5';

From abb90d87370e2458e5342e679d92ec515e911f98 Mon Sep 17 00:00:00 2001
From: SukeshP1995 <30713956+SukeshP1995@users.noreply.github.com>
Date: Mon, 2 Dec 2024 14:36:54 +0100
Subject: [PATCH 235/404] docs: fix grammatical error (#14500)

a instead of an before failed
---
 documentation/docs/05-special-elements/01-svelte-boundary.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/05-special-elements/01-svelte-boundary.md b/documentation/docs/05-special-elements/01-svelte-boundary.md
index d0a2fb9ae9..15f249a771 100644
--- a/documentation/docs/05-special-elements/01-svelte-boundary.md
+++ b/documentation/docs/05-special-elements/01-svelte-boundary.md
@@ -21,7 +21,7 @@ For the boundary to do anything, one or both of `failed` and `onerror` must be p
 
 ### `failed`
 
-If an `failed` snippet is provided, it will be rendered with the error that was thrown, and a `reset` function that recreates the contents ([demo](/playground/hello-world#H4sIAAAAAAAAE3VRy26DMBD8lS2tFCIh6JkAUlWp39Cq9EBg06CAbdlLArL87zWGKk8ORnhmd3ZnrD1WtOjFXqKO2BDGW96xqpBD5gXerm5QefG39mgQY9EIWHxueRMinLosti0UPsJLzggZKTeilLWgLGc51a3gkuCjKQ7DO7cXZotgJ3kLqzC6hmex1SZnSXTWYHcrj8LJjWTk0PHoZ8VqIdCOKayPykcpuQxAokJaG1dGybYj4gw4K5u6PKTasSbjXKgnIDlA8VvUdo-pzonraBY2bsH7HAl78mKSHZpgIcuHjq9jXSpZSLixRlveKYQUXhQVhL6GPobXAAb7BbNeyvNUs4qfRg3OnELLj5hqH9eQZqCnoBwR9lYcQxuVXeBzc8kMF8yXY4yNJ5oGiUzP_aaf_waTRGJib5_Ad3P_vbCuaYxzeNpbU0eUMPAOKh7Yw1YErgtoXyuYlPLzc10_xo_5A91zkQL_AgAA)):
+If a `failed` snippet is provided, it will be rendered with the error that was thrown, and a `reset` function that recreates the contents ([demo](/playground/hello-world#H4sIAAAAAAAAE3VRy26DMBD8lS2tFCIh6JkAUlWp39Cq9EBg06CAbdlLArL87zWGKk8ORnhmd3ZnrD1WtOjFXqKO2BDGW96xqpBD5gXerm5QefG39mgQY9EIWHxueRMinLosti0UPsJLzggZKTeilLWgLGc51a3gkuCjKQ7DO7cXZotgJ3kLqzC6hmex1SZnSXTWYHcrj8LJjWTk0PHoZ8VqIdCOKayPykcpuQxAokJaG1dGybYj4gw4K5u6PKTasSbjXKgnIDlA8VvUdo-pzonraBY2bsH7HAl78mKSHZpgIcuHjq9jXSpZSLixRlveKYQUXhQVhL6GPobXAAb7BbNeyvNUs4qfRg3OnELLj5hqH9eQZqCnoBwR9lYcQxuVXeBzc8kMF8yXY4yNJ5oGiUzP_aaf_waTRGJib5_Ad3P_vbCuaYxzeNpbU0eUMPAOKh7Yw1YErgtoXyuYlPLzc10_xo_5A91zkQL_AgAA)):
 
 ```svelte
 <svelte:boundary>

From aaea2541020b24769180e64b106dc90d92f98f4f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 2 Dec 2024 09:50:33 -0500
Subject: [PATCH 236/404] chore: serialize bigint AST, albeit incorrectly
 (#14504)

playgrounds/sandbox/run.js doesn't work for components containing bigints, because they can't be serialized to JSON. There isn't really a great fix for this issue but this at least allows the sandbox to run
---
 playgrounds/sandbox/run.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/playgrounds/sandbox/run.js b/playgrounds/sandbox/run.js
index 4531e7182d..771dcc668e 100644
--- a/playgrounds/sandbox/run.js
+++ b/playgrounds/sandbox/run.js
@@ -46,7 +46,14 @@ for (const generate of /** @type {const} */ (['client', 'server'])) {
 				modern: true
 			});
 
-			fs.writeFileSync(`${cwd}/output/${file}.json`, JSON.stringify(ast, null, '\t'));
+			fs.writeFileSync(
+				`${cwd}/output/${file}.json`,
+				JSON.stringify(
+					ast,
+					(key, value) => (typeof value === 'bigint' ? ['BigInt', value.toString()] : value),
+					'\t'
+				)
+			);
 
 			try {
 				const migrated = migrate(source);

From b72fd2b3cd2fafc3c63454f027da90da7b432052 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 2 Dec 2024 21:08:01 +0100
Subject: [PATCH 237/404] fix: ignore TypeScript generics on variables (#14509)

fixes #14505
---
 .changeset/wild-islands-help.md                              | 5 +++++
 .../src/compiler/phases/1-parse/remove_typescript_nodes.js   | 3 +++
 .../tests/runtime-runes/samples/typescript/main.svelte       | 4 +++-
 3 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/wild-islands-help.md

diff --git a/.changeset/wild-islands-help.md b/.changeset/wild-islands-help.md
new file mode 100644
index 0000000000..5386e5d6b1
--- /dev/null
+++ b/.changeset/wild-islands-help.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ignore TypeScript generics on variables
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index 8db29ab067..b968e95213 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -104,6 +104,9 @@ const visitors = {
 		}
 		return context.visit(node.parameter);
 	},
+	TSInstantiationExpression(node, context) {
+		return context.visit(node.expression);
+	},
 	FunctionExpression: remove_this_param,
 	FunctionDeclaration: remove_this_param,
 	TSDeclareFunction() {
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index 8a3db5dead..3b98dafa05 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -8,7 +8,7 @@
 		console.log(this);
 	}
 
-	class Foo {
+	class Foo<T> {
 		public name: string;
 		x = 'x' as const;
 		constructor(name: string) {
@@ -32,6 +32,8 @@
 	export function overload(c: any): any {}
 
 	export type { Hello };
+
+	const TypedFoo = Foo<true>;
 </script>
 
 <script>

From 2e57612ef495689e628078e988126f057cc2f7a8 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Mon, 2 Dec 2024 18:44:15 -0500
Subject: [PATCH 238/404] chore: fix typo (#14513)

---
 packages/svelte/src/index.d.ts   | 2 +-
 packages/svelte/types/index.d.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index 5130721cbe..b8ba8b6f0a 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -38,7 +38,7 @@ type Properties<Props, Slots> = Props &
 /**
  * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
  * are completely different under the hood. For typing, use `Component` instead.
- * To instantiate components, use `mount` instead`.
+ * To instantiate components, use `mount` instead.
  * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
  */
 export class SvelteComponent<
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 0814796d27..5a5cc86ae6 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -35,7 +35,7 @@ declare module 'svelte' {
 	/**
 	 * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
 	 * are completely different under the hood. For typing, use `Component` instead.
-	 * To instantiate components, use `mount` instead`.
+	 * To instantiate components, use `mount` instead.
 	 * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
 	 */
 	export class SvelteComponent<

From 4d2f2fb8e615c7d375e0cee5aa9692b3c6c65918 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 3 Dec 2024 14:56:28 +0000
Subject: [PATCH 239/404] feat: allow snippets to be exported from module
 scripts (#14315)

* feat: allow snippets to be exported from module scripts

* tweak type

* fix issue + add test

* refactor

* refactor

* fix exports error

* fix lint

* fix lint

* error on undefined export

* hoisted snippets belong in transform state, not analysis

* put the code where it's used

* drop the local_. just binding. it's cleaner

* simplify

* simplify

* simplify

* simplify

* tidy up

* oops

* update message, add some details

* lint

* Apply suggestions from code review

* add some docs

* Update packages/svelte/src/compiler/phases/3-transform/utils.js

* Update .changeset/famous-parents-turn.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/famous-parents-turn.md             |  5 ++
 .../docs/03-template-syntax/06-snippet.md     | 14 +++++
 .../98-reference/.generated/compile-errors.md | 30 +++++++++++
 .../svelte/messages/compile-errors/script.md  | 26 +++++++++
 packages/svelte/src/compiler/errors.js        | 19 +++++++
 .../src/compiler/phases/1-parse/acorn.js      | 42 ++++++++++++---
 .../compiler/phases/1-parse/read/script.js    |  2 +-
 .../src/compiler/phases/1-parse/state/tag.js  |  1 +
 .../src/compiler/phases/2-analyze/index.js    | 13 ++++-
 .../phases/2-analyze/visitors/SnippetBlock.js | 54 ++++++++++++++++++-
 .../3-transform/client/transform-client.js    |  6 ++-
 .../phases/3-transform/client/types.d.ts      |  8 ++-
 .../client/visitors/SnippetBlock.js           |  6 ++-
 .../server/visitors/SnippetBlock.js           |  7 ++-
 .../svelte/src/compiler/phases/types.d.ts     |  4 +-
 packages/svelte/src/compiler/types/index.d.ts |  3 +-
 .../svelte/src/compiler/types/template.d.ts   |  1 +
 .../export-not-defined-module/_config.js      |  9 ++++
 .../export-not-defined-module/main.svelte     |  3 ++
 .../snippet-hoisted-module-2/Child.svelte     | 13 +++++
 .../snippet-hoisted-module-2/_config.js       |  8 +++
 .../snippet-hoisted-module-2/main.svelte      |  5 ++
 .../snippet-hoisted-module/Child.svelte       |  9 ++++
 .../samples/snippet-hoisted-module/_config.js |  8 +++
 .../snippet-hoisted-module/main.svelte        |  5 ++
 .../_expected/client/index.svelte.js          | 14 ++---
 .../_expected/server/index.svelte.js          |  9 ++--
 27 files changed, 292 insertions(+), 32 deletions(-)
 create mode 100644 .changeset/famous-parents-turn.md
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-not-defined-module/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/export-not-defined-module/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/main.svelte

diff --git a/.changeset/famous-parents-turn.md b/.changeset/famous-parents-turn.md
new file mode 100644
index 0000000000..38f9e1f9df
--- /dev/null
+++ b/.changeset/famous-parents-turn.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: allow snippets to be exported from module scripts
diff --git a/documentation/docs/03-template-syntax/06-snippet.md b/documentation/docs/03-template-syntax/06-snippet.md
index 4bbc970c5d..fd8cd78d6e 100644
--- a/documentation/docs/03-template-syntax/06-snippet.md
+++ b/documentation/docs/03-template-syntax/06-snippet.md
@@ -246,6 +246,20 @@ We can tighten things up further by declaring a generic, so that `data` and `row
 </script>
 ```
 
+## Exporting snippets
+
+Snippets declared at the top level of a `.svelte` file can be exported from a `<script module>` for use in other components, provided they don't reference any declarations in a non-module `<script>` (whether directly or indirectly, via other snippets) ([demo](/playground/untitled#H4sIAAAAAAAAE3WPwY7CMAxEf8UyB1hRgdhjl13Bga8gHFJipEqtGyUGFUX5dxJUtEB3b9bYM_MckHVLWOKut50TMuC5tpbEY4GnuiGP5T6gXG0-ykLSB8vW2oW_UCNZq7Snv_Rjx0Kc4kpc-6OrrfwoVlK3uQ4CaGMgwsl1LUwXy0f54J9-KV4vf20cNo7YkMu22aqAz4-oOLUI9YKluDPF4h_at-hX5PFyzA1tZ84N3fGpf8YfUU6GvDumLqDKmEqCjjCHUEX4hqDTWCU5PJ6Or38c4g1cPu9tnAEAAA==)):
+
+```svelte
+<script module>
+	export { add };
+</script>
+
+{#snippet add(a, b)}
+	{a} + {b} = {a + b}
+{/snippet}
+```
+
 ## Programmatic snippets
 
 Snippets can be created programmatically with the [`createRawSnippet`](svelte#createRawSnippet) API. This is intended for advanced use cases.
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 77166097a2..e1925324e6 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -400,6 +400,12 @@ Expected token %token%
 Expected whitespace
 ```
 
+### export_undefined
+
+```
+`%name%` is not defined
+```
+
 ### global_reference_invalid
 
 ```
@@ -694,6 +700,30 @@ Cannot use `<slot>` syntax and `{@render ...}` tags in the same component. Migra
 Cannot use explicit children snippet at the same time as implicit children content. Remove either the non-whitespace content or the children snippet block
 ```
 
+### snippet_invalid_export
+
+```
+An exported snippet can only reference things declared in a `<script module>`, or other exportable snippets
+```
+
+It's possible to export a snippet from a `<script module>` block, but only if it doesn't reference anything defined inside a non-module-level `<script>`. For example you can't do this...
+
+```svelte
+<script module>
+	export { greeting };
+</script>
+
+<script>
+	let message = 'hello';
+</script>
+
+{#snippet greeting(name)}
+	<p>{message} {name}!</p>
+{/snippet}
+```
+
+...because `greeting` references `message`, which is defined in the second `<script>`.
+
 ### snippet_invalid_rest_parameter
 
 ```
diff --git a/packages/svelte/messages/compile-errors/script.md b/packages/svelte/messages/compile-errors/script.md
index 7310749f1b..69007bfb59 100644
--- a/packages/svelte/messages/compile-errors/script.md
+++ b/packages/svelte/messages/compile-errors/script.md
@@ -38,6 +38,10 @@
 
 > `$effect()` can only be used as an expression statement
 
+## export_undefined
+
+> `%name%` is not defined
+
 ## global_reference_invalid
 
 > `%name%` is an illegal variable name. To reference a global variable called `%name%`, use `globalThis.%name%`
@@ -134,6 +138,28 @@
 
 > %name% cannot be used in runes mode
 
+## snippet_invalid_export
+
+> An exported snippet can only reference things declared in a `<script module>`, or other exportable snippets
+
+It's possible to export a snippet from a `<script module>` block, but only if it doesn't reference anything defined inside a non-module-level `<script>`. For example you can't do this...
+
+```svelte
+<script module>
+	export { greeting };
+</script>
+
+<script>
+	let message = 'hello';
+</script>
+
+{#snippet greeting(name)}
+	<p>{message} {name}!</p>
+{/snippet}
+```
+
+...because `greeting` references `message`, which is defined in the second `<script>`.
+
 ## snippet_parameter_assignment
 
 > Cannot reassign or bind to snippet parameter
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index bb99275c6b..a6e4549e2f 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -168,6 +168,16 @@ export function effect_invalid_placement(node) {
 	e(node, "effect_invalid_placement", "`$effect()` can only be used as an expression statement");
 }
 
+/**
+ * `%name%` is not defined
+ * @param {null | number | NodeLike} node
+ * @param {string} name
+ * @returns {never}
+ */
+export function export_undefined(node, name) {
+	e(node, "export_undefined", `\`${name}\` is not defined`);
+}
+
 /**
  * `%name%` is an illegal variable name. To reference a global variable called `%name%`, use `globalThis.%name%`
  * @param {null | number | NodeLike} node
@@ -395,6 +405,15 @@ export function runes_mode_invalid_import(node, name) {
 	e(node, "runes_mode_invalid_import", `${name} cannot be used in runes mode`);
 }
 
+/**
+ * An exported snippet can only reference things declared in a `<script module>`, or other exportable snippets
+ * @param {null | number | NodeLike} node
+ * @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");
+}
+
 /**
  * Cannot reassign or bind to snippet parameter
  * @param {null | number | NodeLike} node
diff --git a/packages/svelte/src/compiler/phases/1-parse/acorn.js b/packages/svelte/src/compiler/phases/1-parse/acorn.js
index 52c4b69895..6c106e0a84 100644
--- a/packages/svelte/src/compiler/phases/1-parse/acorn.js
+++ b/packages/svelte/src/compiler/phases/1-parse/acorn.js
@@ -10,17 +10,43 @@ const ParserWithTS = acorn.Parser.extend(tsPlugin({ allowSatisfies: true }));
 /**
  * @param {string} source
  * @param {boolean} typescript
+ * @param {boolean} [is_script]
  */
-export function parse(source, typescript) {
+export function parse(source, typescript, is_script) {
 	const parser = typescript ? ParserWithTS : acorn.Parser;
 	const { onComment, add_comments } = get_comment_handlers(source);
-
-	const ast = parser.parse(source, {
-		onComment,
-		sourceType: 'module',
-		ecmaVersion: 13,
-		locations: true
-	});
+	// @ts-ignore
+	const parse_statement = parser.prototype.parseStatement;
+
+	// If we're dealing with a <script> then it might contain an export
+	// for something that doesn't exist directly inside but is inside the
+	// component instead, so we need to ensure that Acorn doesn't throw
+	// an error in these cases
+	if (is_script) {
+		// @ts-ignore
+		parser.prototype.parseStatement = function (...args) {
+			const v = parse_statement.call(this, ...args);
+			// @ts-ignore
+			this.undefinedExports = {};
+			return v;
+		};
+	}
+
+	let ast;
+
+	try {
+		ast = parser.parse(source, {
+			onComment,
+			sourceType: 'module',
+			ecmaVersion: 13,
+			locations: true
+		});
+	} finally {
+		if (is_script) {
+			// @ts-ignore
+			parser.prototype.parseStatement = parse_statement;
+		}
+	}
 
 	if (typescript) amend(source, ast);
 	add_comments(ast);
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 85023cb781..87367aff08 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/script.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/script.js
@@ -34,7 +34,7 @@ export function read_script(parser, start, attributes) {
 	let ast;
 
 	try {
-		ast = acorn.parse(source, parser.ts);
+		ast = acorn.parse(source, parser.ts, true);
 	} catch (err) {
 		parser.acorn_error(err);
 	}
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 317afe6f2f..0eadd2b8b5 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -325,6 +325,7 @@ function open(parser) {
 			parameters: function_expression.params,
 			body: create_fragment(),
 			metadata: {
+				can_hoist: false,
 				sites: new Set()
 			}
 		});
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index f5cd6ff9f7..8f1efd7f63 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -429,7 +429,6 @@ export function analyze_component(root, source, options) {
 		reactive_statements: new Map(),
 		binding_groups: new Map(),
 		slot_names: new Map(),
-		top_level_snippets: [],
 		css: {
 			ast: root.css,
 			hash: root.css
@@ -443,6 +442,7 @@ export function analyze_component(root, source, options) {
 			keyframes: []
 		},
 		source,
+		undefined_exports: new Map(),
 		snippet_renderers: new Map(),
 		snippets: new Set()
 	};
@@ -697,6 +697,17 @@ export function analyze_component(root, source, options) {
 		analysis.reactive_statements = order_reactive_statements(analysis.reactive_statements);
 	}
 
+	for (const node of analysis.module.ast.body) {
+		if (node.type === 'ExportNamedDeclaration' && node.specifiers !== null) {
+			for (const specifier of node.specifiers) {
+				if (specifier.local.type !== 'Identifier') continue;
+
+				const binding = analysis.module.scope.get(specifier.local.name);
+				if (!binding) e.export_undefined(specifier, specifier.local.name);
+			}
+		}
+	}
+
 	if (analysis.event_directive_node && analysis.uses_event_attributes) {
 		e.mixed_event_handler_syntaxes(
 			analysis.event_directive_node,
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 c94b65e361..cd8af21f98 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,5 @@
-/** @import { AST } from '#compiler' */
+/** @import { AST, Binding, SvelteNode } from '#compiler' */
+/** @import { Scope } from '../../scope' */
 /** @import { Context } from '../types' */
 import { validate_block_not_empty, validate_opening_tag } from './shared/utils.js';
 import * as e from '../../../errors.js';
@@ -24,6 +25,25 @@ export function SnippetBlock(node, context) {
 
 	context.next({ ...context.state, parent_element: null });
 
+	const can_hoist =
+		context.path.length === 1 &&
+		context.path[0].type === 'Fragment' &&
+		can_hoist_snippet(context.state.scope, context.state.scopes);
+
+	const name = node.expression.name;
+
+	if (can_hoist) {
+		const binding = /** @type {Binding} */ (context.state.scope.get(name));
+		context.state.analysis.module.scope.declarations.set(name, binding);
+	} else {
+		const undefined_export = context.state.analysis.undefined_exports.get(name);
+		if (undefined_export) {
+			e.snippet_invalid_export(undefined_export);
+		}
+	}
+
+	node.metadata.can_hoist = can_hoist;
+
 	const { path } = context;
 	const parent = path.at(-2);
 	if (!parent) return;
@@ -58,3 +78,35 @@ export function SnippetBlock(node, context) {
 		}
 	}
 }
+
+/**
+ * @param {Map<SvelteNode, Scope>} scopes
+ * @param {Scope} scope
+ */
+function can_hoist_snippet(scope, scopes, visited = new Set()) {
+	for (const [reference] of scope.references) {
+		const binding = scope.get(reference);
+
+		if (!binding || binding.scope.function_depth === 0) {
+			continue;
+		}
+
+		// ignore bindings declared inside the snippet (e.g. the snippet's own parameters)
+		if (binding.scope.function_depth >= scope.function_depth) {
+			continue;
+		}
+
+		if (binding.initial?.type === 'SnippetBlock') {
+			if (visited.has(binding)) continue;
+			visited.add(binding);
+
+			if (can_hoist_snippet(binding.scope, scopes, visited)) {
+				continue;
+			}
+		}
+
+		return false;
+	}
+
+	return true;
+}
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 99cb78358a..3edbc49f16 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
@@ -165,6 +165,8 @@ export function client_component(analysis, options) {
 		private_state: new Map(),
 		transform: {},
 		in_constructor: false,
+		instance_level_snippets: [],
+		module_level_snippets: [],
 
 		// these are set inside the `Fragment` visitor, and cannot be used until then
 		before_init: /** @type {any} */ (null),
@@ -370,7 +372,7 @@ export function client_component(analysis, options) {
 		...store_setup,
 		...legacy_reactive_declarations,
 		...group_binding_declarations,
-		...analysis.top_level_snippets,
+		...state.instance_level_snippets,
 		.../** @type {ESTree.Statement[]} */ (instance.body),
 		analysis.runes || !analysis.needs_context
 			? b.empty
@@ -485,7 +487,7 @@ export function client_component(analysis, options) {
 		}
 	}
 
-	body = [...imports, ...body];
+	body = [...imports, ...state.module_level_snippets, ...body];
 
 	const component = b.function_declaration(
 		b.id(analysis.name),
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 0b54de5384..8013615995 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
@@ -6,7 +6,8 @@ import type {
 	PrivateIdentifier,
 	Expression,
 	AssignmentExpression,
-	UpdateExpression
+	UpdateExpression,
+	VariableDeclaration
 } from 'estree';
 import type { Namespace, SvelteNode, ValidatedCompileOptions } from '#compiler';
 import type { TransformState } from '../types.js';
@@ -85,6 +86,11 @@ export interface ComponentClientTransformState extends ClientTransformState {
 
 	/** The $: calls, which will be ordered in the end */
 	readonly legacy_reactive_statements: Map<LabeledStatement, Statement>;
+
+	/** Snippets hoisted to the instance */
+	readonly instance_level_snippets: VariableDeclaration[];
+	/** Snippets hoisted to the module */
+	readonly module_level_snippets: VariableDeclaration[];
 }
 
 export interface StateField {
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js
index 814fd3b0fb..7a0d6981b5 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/SnippetBlock.js
@@ -83,7 +83,11 @@ export function SnippetBlock(node, context) {
 
 	// Top-level snippets are hoisted so they can be referenced in the `<script>`
 	if (context.path.length === 1 && context.path[0].type === 'Fragment') {
-		context.state.analysis.top_level_snippets.push(declaration);
+		if (node.metadata.can_hoist) {
+			context.state.module_level_snippets.push(declaration);
+		} else {
+			context.state.instance_level_snippets.push(declaration);
+		}
 	} else {
 		context.state.init.push(declaration);
 	}
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/SnippetBlock.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SnippetBlock.js
index ec06dd5ec7..eb83917927 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/SnippetBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/SnippetBlock.js
@@ -17,6 +17,9 @@ export function SnippetBlock(node, context) {
 	// @ts-expect-error - TODO remove this hack once $$render_inner for legacy bindings is gone
 	fn.___snippet = true;
 
-	// TODO hoist where possible
-	context.state.init.push(fn);
+	if (node.metadata.can_hoist) {
+		context.state.hoisted.push(fn);
+	} else {
+		context.state.init.push(fn);
+	}
 }
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index fed5d66b2c..4e7ef867b4 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -1,5 +1,5 @@
 import type { AST, Binding, Css, SvelteNode } from '#compiler';
-import type { Identifier, LabeledStatement, Program, VariableDeclaration } from 'estree';
+import type { Identifier, LabeledStatement, Node, Program } from 'estree';
 import type { Scope, ScopeRoot } from './scope.js';
 
 export interface Js {
@@ -62,7 +62,6 @@ export interface ComponentAnalysis extends Analysis {
 	/** If `true`, should append styles through JavaScript */
 	inject_styles: boolean;
 	reactive_statements: Map<LabeledStatement, ReactiveStatement>;
-	top_level_snippets: VariableDeclaration[];
 	/** Identifiers that make up the `bind:group` expression -> internal group binding name */
 	binding_groups: Map<[key: string, bindings: Array<Binding | null>], Identifier>;
 	slot_names: Map<string, AST.SlotElement>;
@@ -72,6 +71,7 @@ export interface ComponentAnalysis extends Analysis {
 		keyframes: string[];
 	};
 	source: string;
+	undefined_exports: Map<string, Node>;
 	/**
 	 * Every render tag/component, and whether it could be definitively resolved or not
 	 */
diff --git a/packages/svelte/src/compiler/types/index.d.ts b/packages/svelte/src/compiler/types/index.d.ts
index f8aa3db69d..fe306bd020 100644
--- a/packages/svelte/src/compiler/types/index.d.ts
+++ b/packages/svelte/src/compiler/types/index.d.ts
@@ -279,7 +279,8 @@ export interface Binding {
 		| 'snippet'
 		| 'store_sub'
 		| 'legacy_reactive'
-		| 'template';
+		| 'template'
+		| 'snippet';
 	declaration_kind: DeclarationKind;
 	/**
 	 * What the value was initialized with.
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index 1758b98d24..a409cf5704 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -461,6 +461,7 @@ export namespace AST {
 		body: Fragment;
 		/** @internal */
 		metadata: {
+			can_hoist: boolean;
 			/** The set of components/render tags that could render this snippet,
 			 * used for CSS pruning */
 			sites: Set<Component | SvelteComponent | SvelteSelf | RenderTag>;
diff --git a/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/_config.js b/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/_config.js
new file mode 100644
index 0000000000..40a5ecee4c
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'export_undefined',
+		message: '`blah` is not defined',
+		position: [26, 30]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/main.svelte b/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/main.svelte
new file mode 100644
index 0000000000..1093dccff8
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/export-not-defined-module/main.svelte
@@ -0,0 +1,3 @@
+<script module>
+	export { blah };
+</script>
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/Child.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/Child.svelte
new file mode 100644
index 0000000000..902386fd7e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/Child.svelte
@@ -0,0 +1,13 @@
+<script module>
+	const message = 'hello';
+
+	export { one };
+</script>
+
+{#snippet one()}
+	{@render two()}
+{/snippet}
+
+{#snippet two()}
+	{message}
+{/snippet}
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/_config.js
new file mode 100644
index 0000000000..55ab126f89
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true // Render in dev mode to check that the validation error is not thrown
+	},
+	html: `hello`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/main.svelte
new file mode 100644
index 0000000000..11b7297397
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module-2/main.svelte
@@ -0,0 +1,5 @@
+<script>
+	import { one } from './Child.svelte';
+</script>
+
+{@render one()}
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/Child.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/Child.svelte
new file mode 100644
index 0000000000..ffa1c12b34
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/Child.svelte
@@ -0,0 +1,9 @@
+<script module>
+	export {
+		foo
+	}
+</script>
+
+{#snippet foo(a, b)}
+	Hello world {a + b}
+{/snippet}
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/_config.js b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/_config.js
new file mode 100644
index 0000000000..be8d22b4e8
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true // Render in dev mode to check that the validation error is not thrown
+	},
+	html: `Hello world 3`
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/main.svelte b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/main.svelte
new file mode 100644
index 0000000000..80e9df514b
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/snippet-hoisted-module/main.svelte
@@ -0,0 +1,5 @@
+<script>
+	import { foo } from './Child.svelte';
+</script>
+
+{@render foo(1, 2)}
diff --git a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js
index 58ccf7ed7f..bcddb6f658 100644
--- a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/client/index.svelte.js
@@ -2,17 +2,17 @@ import "svelte/internal/disclose-version";
 import * as $ from "svelte/internal/client";
 import TextInput from './Child.svelte';
 
-var root = $.template(`<!> `, 1);
+const snippet = ($$anchor) => {
+	$.next();
 
-export default function Bind_component_snippet($$anchor) {
-	const snippet = ($$anchor) => {
-		$.next();
+	var text = $.text("Something");
 
-		var text = $.text("Something");
+	$.append($$anchor, text);
+};
 
-		$.append($$anchor, text);
-	};
+var root = $.template(`<!> `, 1);
 
+export default function Bind_component_snippet($$anchor) {
 	let value = $.state('');
 	const _snippet = snippet;
 	var fragment = root();
diff --git a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js
index b645d05570..d223a31502 100644
--- a/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/bind-component-snippet/_expected/server/index.svelte.js
@@ -1,14 +1,13 @@
 import * as $ from "svelte/internal/server";
 import TextInput from './Child.svelte';
 
+function snippet($$payload) {
+	$$payload.out += `<!---->Something`;
+}
+
 export default function Bind_component_snippet($$payload) {
 	let value = '';
 	const _snippet = snippet;
-
-	function snippet($$payload) {
-		$$payload.out += `<!---->Something`;
-	}
-
 	let $$settled = true;
 	let $$inner_payload;
 

From e722ef6b15f496d5cff7637cedd2a0c057c6f20c Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 09:58:18 -0500
Subject: [PATCH 240/404] Version Packages (#14510)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/famous-parents-turn.md |  5 -----
 .changeset/wild-islands-help.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/famous-parents-turn.md
 delete mode 100644 .changeset/wild-islands-help.md

diff --git a/.changeset/famous-parents-turn.md b/.changeset/famous-parents-turn.md
deleted file mode 100644
index 38f9e1f9df..0000000000
--- a/.changeset/famous-parents-turn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: allow snippets to be exported from module scripts
diff --git a/.changeset/wild-islands-help.md b/.changeset/wild-islands-help.md
deleted file mode 100644
index 5386e5d6b1..0000000000
--- a/.changeset/wild-islands-help.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ignore TypeScript generics on variables
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index a0c9e67285..a53738689f 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.5.0
+
+### Minor Changes
+
+- feat: allow snippets to be exported from module scripts ([#14315](https://github.com/sveltejs/svelte/pull/14315))
+
+### Patch Changes
+
+- fix: ignore TypeScript generics on variables ([#14509](https://github.com/sveltejs/svelte/pull/14509))
+
 ## 5.4.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index ce9d4e58f5..fe25b0bb34 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.4.0",
+  "version": "5.5.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 3c7791b29c..1271d6cb90 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.4.0';
+export const VERSION = '5.5.0';
 export const PUBLIC_VERSION = '5';

From 7142fa0b5c6577548371884b28bb4d07e43eba20 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 10:01:55 -0500
Subject: [PATCH 241/404] docs: note requirement on 5.5.0 to export snippets
 (#14523)

---
 documentation/docs/03-template-syntax/06-snippet.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/documentation/docs/03-template-syntax/06-snippet.md b/documentation/docs/03-template-syntax/06-snippet.md
index fd8cd78d6e..f8148f3dc3 100644
--- a/documentation/docs/03-template-syntax/06-snippet.md
+++ b/documentation/docs/03-template-syntax/06-snippet.md
@@ -260,6 +260,9 @@ Snippets declared at the top level of a `.svelte` file can be exported from a `<
 {/snippet}
 ```
 
+> [!NOTE]
+> This requires Svelte 5.5.0 or newer
+
 ## Programmatic snippets
 
 Snippets can be created programmatically with the [`createRawSnippet`](svelte#createRawSnippet) API. This is intended for advanced use cases.

From 3d36e15ddd630a5b074eaaec1e19c6300f5645b9 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 3 Dec 2024 17:02:37 +0100
Subject: [PATCH 242/404] docs: add tsconfig.json info to TS docs (#14519)

Also fix adjacent code examples

closes #14187
---
 documentation/docs/07-misc/03-typescript.md | 24 +++++++++++++++------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md
index f4513a9a2d..fbf8817069 100644
--- a/documentation/docs/07-misc/03-typescript.md
+++ b/documentation/docs/07-misc/03-typescript.md
@@ -40,26 +40,26 @@ If you want to use one of these features, you need to setup up a `script` prepro
 
 To use non-type-only TypeScript features within Svelte components, you need to add a preprocessor that will turn TypeScript into JavaScript.
 
-### Using SvelteKit or Vite
-
-The easiest way to get started is scaffolding a new SvelteKit project by typing `npx sv create`, following the prompts and choosing the TypeScript option.
-
 ```ts
 /// file: svelte.config.js
 // @noErrors
-import { vitePreprocess } from '@sveltejs/kit/vite';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 
 const config = {
-	preprocess: vitePreprocess()
+	// Note the additional `{ script: true }`
+	preprocess: vitePreprocess({ script: true })
 };
 
 export default config;
 ```
 
-If you don't need or want all the features SvelteKit has to offer, you can scaffold a Svelte-flavoured Vite project instead by typing `npm create vite@latest` and selecting the `svelte-ts` option.
+### Using SvelteKit or Vite
+
+The easiest way to get started is scaffolding a new SvelteKit project by typing `npx sv create`, following the prompts and choosing the TypeScript option.
 
 ```ts
 /// file: svelte.config.js
+// @noErrors
 import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 
 const config = {
@@ -69,6 +69,8 @@ const config = {
 export default config;
 ```
 
+If you don't need or want all the features SvelteKit has to offer, you can scaffold a Svelte-flavoured Vite project instead by typing `npm create vite@latest` and selecting the `svelte-ts` option.
+
 In both cases, a `svelte.config.js` with `vitePreprocess` will be added. Vite/SvelteKit will read from this config file.
 
 ### Other build tools
@@ -77,6 +79,14 @@ If you're using tools like Rollup or Webpack instead, install their respective S
 
 > [!NOTE] If you're starting a new project, we recommend using SvelteKit or Vite instead
 
+## tsconfig.json settings
+
+When using TypeScript, make sure your `tsconfig.json` is setup correctly.
+
+- Use a [`target`](https://www.typescriptlang.org/tsconfig/#target) of at least `ES2022`, or a `target` of at least `ES2015` alongside [`useDefineForClassFields`](https://www.typescriptlang.org/tsconfig/#useDefineForClassFields). This ensures that rune declarations on class fields are not messed with, which would break the Svelte compiler
+- Set [`verbatimModuleSyntax`](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) to `true` so that imports are left as-is
+- Set [`isolatedModules`](https://www.typescriptlang.org/tsconfig/#isolatedModules) to `true` so that each file is looked at in isolation. TypeScript has a few features which require cross-file analysis and compilation, which the Svelte compiler and tooling like Vite don't do. 
+
 ## Typing `$props`
 
 Type `$props` just like a regular object with certain properties.

From 94694a5e63baf5537128527d08c424de1639bc1f Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 3 Dec 2024 17:09:59 +0000
Subject: [PATCH 243/404] chore: add test for binding event reactive context
 (#14522)

* chore: add test for binding event reactive context

* revised
---
 .../client/dom/elements/bindings/input.js     |  2 +-
 .../effect-tracking-binding-set/_config.js    |  7 ++++++
 .../effect-tracking-binding-set/main.svelte   | 24 +++++++++++++++++++
 3 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/main.svelte

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 aec6f815a0..1cbe2a731f 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -1,6 +1,6 @@
 import { DEV } from 'esm-env';
 import { render_effect, teardown } from '../../../reactivity/effects.js';
-import { listen_to_event_and_reset_event, without_reactive_context } from './shared.js';
+import { listen_to_event_and_reset_event } from './shared.js';
 import * as e from '../../../errors.js';
 import { is } from '../../../proxy.js';
 import { queue_micro_task } from '../../task.js';
diff --git a/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/_config.js b/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/_config.js
new file mode 100644
index 0000000000..aebbfec832
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs }) {
+		assert.deepEqual(logs, [false]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/main.svelte b/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/main.svelte
new file mode 100644
index 0000000000..f21ecfdce6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/effect-tracking-binding-set/main.svelte
@@ -0,0 +1,24 @@
+<script>
+	let bar = $state('');
+
+	const foo = {
+		set bar(v) {
+
+			console.log($effect.tracking());
+
+			bar = v;
+		},
+		get bar() {
+			return bar;
+		}
+	}
+
+	let input;
+
+	$effect(() => {
+		input.value = 'everybody';
+		input.dispatchEvent(new window.Event('input'));
+	})
+</script>
+
+<input type="text" bind:value={foo.bar} bind:this={input}>

From aac929d50355ab7cfbade2d1fdb76674a233c460 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 13:08:22 -0500
Subject: [PATCH 244/404] fix: leave update expressions untransformed unless a
 transformer is provided (#14507)

* fix: leave update expressions untransformed unless a transformer is provided

* fix more cases
---
 .changeset/neat-news-dance.md                 |  5 +++
 .../phases/3-transform/client/types.d.ts      |  2 +-
 .../3-transform/client/visitors/EachBlock.js  |  5 ++-
 .../3-transform/client/visitors/Program.js    | 16 ++++----
 .../client/visitors/UpdateExpression.js       | 38 +++++++------------
 .../bigint-increment-mutation/_config.js      | 15 ++++++++
 .../bigint-increment-mutation/main.svelte     | 16 ++++++++
 .../samples/bigint-increment/_config.js       |  7 ++++
 .../samples/bigint-increment/main.svelte      |  5 +++
 9 files changed, 75 insertions(+), 34 deletions(-)
 create mode 100644 .changeset/neat-news-dance.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bigint-increment/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bigint-increment/main.svelte

diff --git a/.changeset/neat-news-dance.md b/.changeset/neat-news-dance.md
new file mode 100644
index 0000000000..817c012330
--- /dev/null
+++ b/.changeset/neat-news-dance.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: leave update expressions untransformed unless a transformer is provided
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 8013615995..47af9813e2 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
@@ -32,7 +32,7 @@ export interface ClientTransformState extends TransformState {
 			/** turn `foo = bar` into e.g. `$.set(foo, bar)` */
 			assign?: (node: Identifier, value: Expression) => Expression;
 			/** turn `foo.bar = baz` into e.g. `$.mutate(foo, $.get(foo).bar = baz);` */
-			mutate?: (node: Identifier, mutation: AssignmentExpression) => Expression;
+			mutate?: (node: Identifier, mutation: AssignmentExpression | UpdateExpression) => Expression;
 			/** turn `foo++` into e.g. `$.update(foo)` */
 			update?: (node: UpdateExpression) => Expression;
 		}
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
index d34f39f4c7..9f70981205 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/EachBlock.js
@@ -214,7 +214,10 @@ export function EachBlock(node, context) {
 
 				return b.sequence([b.assignment('=', left, value), ...sequence]);
 			},
-			mutate: (_, mutation) => b.sequence([mutation, ...sequence])
+			mutate: (_, mutation) => {
+				uses_index = true;
+				return b.sequence([mutation, ...sequence]);
+			}
 		};
 
 		delete key_state.transform[node.context.name];
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Program.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Program.js
index c34a9b05c6..29403ca6ed 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/Program.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/Program.js
@@ -77,13 +77,15 @@ export function Program(_, context) {
 					return b.call(
 						'$.store_mutate',
 						get_store(),
-						b.assignment(
-							mutation.operator,
-							/** @type {MemberExpression} */ (
-								replace(/** @type {MemberExpression} */ (mutation.left))
-							),
-							mutation.right
-						),
+						mutation.type === 'AssignmentExpression'
+							? b.assignment(
+									mutation.operator,
+									/** @type {MemberExpression} */ (
+										replace(/** @type {MemberExpression} */ (mutation.left))
+									),
+									mutation.right
+								)
+							: b.update(mutation.operator, replace(mutation.argument), mutation.prefix),
 						untracked
 					);
 				},
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UpdateExpression.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UpdateExpression.js
index 91383a5679..13c1b4bc51 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UpdateExpression.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UpdateExpression.js
@@ -1,4 +1,4 @@
-/** @import { Expression, Node, Pattern, Statement, UpdateExpression } from 'estree' */
+/** @import { AssignmentExpression, Expression, UpdateExpression } from 'estree' */
 /** @import { Context } from '../types' */
 import { is_ignored } from '../../../../state.js';
 import { object } from '../../../../utils/ast.js';
@@ -34,34 +34,22 @@ export function UpdateExpression(node, context) {
 	}
 
 	const left = object(argument);
-	if (left === null) return context.next();
+	const transformers = left && context.state.transform[left.name];
 
-	if (left === argument) {
-		const transform = context.state.transform;
-		const update = transform[left.name]?.update;
-
-		if (update && Object.hasOwn(transform, left.name)) {
-			return update(node);
-		}
+	if (left === argument && transformers?.update) {
+		// we don't need to worry about ownership_invalid_mutation here, because
+		// we're not mutating but reassigning
+		return transformers.update(node);
 	}
 
-	const assignment = /** @type {Expression} */ (
-		context.visit(
-			b.assignment(
-				node.operator === '++' ? '+=' : '-=',
-				/** @type {Pattern} */ (argument),
-				b.literal(1)
-			)
-		)
-	);
+	let update = /** @type {Expression} */ (context.next());
 
-	const parent = /** @type {Node} */ (context.path.at(-1));
-	const is_standalone = parent.type === 'ExpressionStatement'; // TODO and possibly others, but not e.g. the `test` of a WhileStatement
-
-	const update =
-		node.prefix || is_standalone
-			? assignment
-			: b.binary(node.operator === '++' ? '-' : '+', assignment, b.literal(1));
+	if (left && transformers?.mutate) {
+		update = transformers.mutate(
+			left,
+			/** @type {AssignmentExpression | UpdateExpression} */ (update)
+		);
+	}
 
 	return is_ignored(node, 'ownership_invalid_mutation')
 		? b.call('$.skip_ownership_validation', b.thunk(update))
diff --git a/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/_config.js b/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/_config.js
new file mode 100644
index 0000000000..fe1e962de2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/_config.js
@@ -0,0 +1,15 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: '<button>mutate</button><button>reassign</button><p>0</p>',
+	test({ assert, target }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+
+		flushSync(() => btn1.click());
+		assert.htmlEqual(target.innerHTML, '<button>mutate</button><button>reassign</button><p>1</p>');
+
+		flushSync(() => btn2.click());
+		assert.htmlEqual(target.innerHTML, '<button>mutate</button><button>reassign</button><p>0</p>');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/main.svelte b/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/main.svelte
new file mode 100644
index 0000000000..148c7cef9f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bigint-increment-mutation/main.svelte
@@ -0,0 +1,16 @@
+<script>
+	let object = $state({ n: 0n });
+
+	function reassign() {
+		object = { n: 0n };
+	}
+
+	function mutate() {
+		return object.n++;
+	}
+</script>
+
+<button onclick={mutate}>mutate</button>
+<button onclick={reassign}>reassign</button>
+
+<p>{object.n}</p>
diff --git a/packages/svelte/tests/runtime-runes/samples/bigint-increment/_config.js b/packages/svelte/tests/runtime-runes/samples/bigint-increment/_config.js
new file mode 100644
index 0000000000..95b9addae6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bigint-increment/_config.js
@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	test({ assert, logs }) {
+		assert.deepEqual(logs, [0n, 1n, 2n, 3n, 4n, 5n]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bigint-increment/main.svelte b/packages/svelte/tests/runtime-runes/samples/bigint-increment/main.svelte
new file mode 100644
index 0000000000..a3370b5467
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bigint-increment/main.svelte
@@ -0,0 +1,5 @@
+<script>
+	for (let i = 0n; i <= 5n; i++) {
+		console.log(i);
+	}
+</script>

From 8ad9295535f5a5945f70b86e8d66b01d6af71c18 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 13:16:52 -0500
Subject: [PATCH 245/404] docs: hints on preserving reactivity (#14514)

---
 documentation/docs/02-runes/02-$state.md | 55 +++++++++++++++++++++---
 1 file changed, 48 insertions(+), 7 deletions(-)

diff --git a/documentation/docs/02-runes/02-$state.md b/documentation/docs/02-runes/02-$state.md
index e8213d3cf4..cc4ba0992c 100644
--- a/documentation/docs/02-runes/02-$state.md
+++ b/documentation/docs/02-runes/02-$state.md
@@ -36,12 +36,7 @@ let todos = $state([
 ...modifying an individual todo's property will trigger updates to anything in your UI that depends on that specific property:
 
 ```js
-// @filename: ambient.d.ts
-declare global {
-	const todos: Array<{ done: boolean, text: string }>
-}
-
-// @filename: index.js
+let todos = [{ done: false, text: 'add more todos' }];
 // ---cut---
 todos[0].done = !todos[0].done;
 ```
@@ -64,6 +59,17 @@ todos.push({
 
 > [!NOTE] When you update properties of proxies, the original object is _not_ mutated.
 
+Note that if you destructure a reactive value, the references are not reactive — as in normal JavaScript, they are evaluated at the point of destructuring:
+
+```js
+let todos = [{ done: false, text: 'add more todos' }];
+// ---cut---
+let { done, text } = todos[0];
+
+// this will not affect the value of `done`
+todos[0].done = !todos[0].done;
+```
+
 ### Classes
 
 You can also use `$state` in class fields (whether public or private):
@@ -85,7 +91,42 @@ class Todo {
 }
 ```
 
-> [!NOTE] The compiler transforms `done` and `text` into `get`/`set` methods on the class prototype referencing private fields.
+> [!NOTE] The compiler transforms `done` and `text` into `get`/`set` methods on the class prototype referencing private fields. This means the properties are not enumerable.
+
+When calling methods in JavaScript, the value of [`this`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this) matters. This won't work, because `this` inside the `reset` method will be the `<button>` rather than the `Todo`:
+
+```svelte
+<button onclick={todo.reset}>
+	reset
+</button>
+```
+
+You can either use an inline function...
+
+```svelte
+<button onclick=+++{() => todo.reset()}>+++
+	reset
+</button>
+```
+
+...or use an arrow function in the class definition:
+
+```js
+// @errors: 7006 2554
+class Todo {
+	done = $state(false);
+	text = $state();
+
+	constructor(text) {
+		this.text = text;
+	}
+
+	+++reset = () => {+++
+		this.text = '';
+		this.done = false;
+	}
+}
+```
 
 ## `$state.raw`
 

From 87863da6ff892a8678eca35876e8d863065cb1ef Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 13:17:12 -0500
Subject: [PATCH 246/404] docs: how to javascript (#14528)

---
 documentation/docs/02-runes/02-$state.md | 87 ++++++++++++++++++++++++
 1 file changed, 87 insertions(+)

diff --git a/documentation/docs/02-runes/02-$state.md b/documentation/docs/02-runes/02-$state.md
index cc4ba0992c..80bf6bd03f 100644
--- a/documentation/docs/02-runes/02-$state.md
+++ b/documentation/docs/02-runes/02-$state.md
@@ -168,3 +168,90 @@ To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snaps
 ```
 
 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`.
+
+## Passing state into functions
+
+JavaScript is a _pass-by-value_ language — when you call a function, the arguments are the _values_ rather than the _variables_. In other words:
+
+```js
+/// file: index.js
+// @filename: index.js
+// ---cut---
+/**
+ * @param {number} a
+ * @param {number} b
+ */
+function add(a, b) {
+	return a + b;
+}
+
+let a = 1;
+let b = 2;
+let total = add(a, b);
+console.log(total); // 3
+
+a = 3;
+b = 4;
+console.log(total); // still 3!
+```
+
+If `add` wanted to have access to the _current_ values of `a` and `b`, and to return the current `total` value, you would need to use functions instead:
+
+```js
+/// file: index.js
+// @filename: index.js
+// ---cut---
+/**
+ * @param {() => number} getA
+ * @param {() => number} getB
+ */
+function add(+++getA, getB+++) {
+	return +++() => getA() + getB()+++;
+}
+
+let a = 1;
+let b = 2;
+let total = add+++(() => a, () => b)+++;
+console.log(+++total()+++); // 3
+
+a = 3;
+a = 4;
+console.log(+++total()+++); // 7
+```
+
+State in Svelte is no different — when you reference something declared with the `$state` rune...
+
+```js
+let a = +++$state(1)+++;
+let b = +++$state(2)+++;
+```
+
+...you're accessing its _current value_.
+
+Note that 'functions' is broad — it encompasses properties of proxies and [`get`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get)/[`set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set) properties...
+
+```js
+/// file: index.js
+// @filename: index.js
+// ---cut---
+/**
+ * @param {{ a: number, b: number }} input
+ */
+function add(input) {
+	return {
+		get value() {
+			return input.a + input.b;
+		}
+	};
+}
+
+let input = $state({ a: 1, b: 2 });
+let total = add(input);
+console.log(total.value); // 3
+
+input.a = 3;
+input.b = 4;
+console.log(total.value); // 7
+```
+
+...though if you find yourself writing code like that, consider using [classes](#Classes) instead.

From a5de086f9507a6a1852da4926d02ec08551ae3bd Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 13:45:46 -0500
Subject: [PATCH 247/404] feat: turn
 `reactive_declaration_non_reactive_property` into a runtime warning (#14192)

* turn `reactive_declaration_non_reactive_property` into a runtime warning

* ignore warning

* Update packages/svelte/src/internal/client/reactivity/effects.js

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

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

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

* fix

* test

* changeset

* Update .changeset/witty-turtles-bake.md

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>

* add some details

* check

* regenerate

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/witty-turtles-bake.md              |  5 +++
 .../.generated/client-warnings.md             | 34 +++++++++++++++++++
 .../.generated/compile-warnings.md            |  6 ----
 .../messages/client-warnings/warnings.md      | 32 +++++++++++++++++
 .../messages/compile-warnings/script.md       |  4 ---
 .../2-analyze/visitors/MemberExpression.js    | 25 --------------
 .../client/visitors/LabeledStatement.js       | 11 +++++-
 packages/svelte/src/compiler/warnings.js      |  9 -----
 packages/svelte/src/constants.js              |  3 +-
 .../src/internal/client/dev/location.js       | 25 ++++++++++++++
 .../src/internal/client/dom/blocks/html.js    |  5 ++-
 .../src/internal/client/reactivity/effects.js | 28 +++++++++++++--
 .../svelte/src/internal/client/runtime.js     | 24 ++++++++++---
 .../svelte/src/internal/client/warnings.js    | 13 +++++++
 .../_config.js                                | 26 ++++++++++++++
 .../data.svelte.js                            | 11 ++++++
 .../main.svelte                               | 13 +++++++
 .../_config.js                                |  3 --
 .../input.svelte                              |  8 -----
 .../warnings.json                             | 14 --------
 20 files changed, 217 insertions(+), 82 deletions(-)
 create mode 100644 .changeset/witty-turtles-bake.md
 create mode 100644 packages/svelte/src/internal/client/dev/location.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte
 delete mode 100644 packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/_config.js
 delete mode 100644 packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/input.svelte
 delete mode 100644 packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/warnings.json

diff --git a/.changeset/witty-turtles-bake.md b/.changeset/witty-turtles-bake.md
new file mode 100644
index 0000000000..04637516f8
--- /dev/null
+++ b/.changeset/witty-turtles-bake.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: turn reactive_declaration_non_reactive_property into a runtime warning
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index e9f1a88c3c..6e97211341 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -86,6 +86,40 @@ 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
 ```
 
+### 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
+$: sum = a + b;
+```
+
+```js
+const sum = $derived(a + b);
+```
+
+In some cases — such as the one that triggered the above warning — they are _not_ the same:
+
+```js
+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/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index 775e0681c9..cc948e2547 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -726,12 +726,6 @@ Reactive declarations only exist at the top level of the instance script
 Reassignments of module-level declarations will not cause reactive statements to update
 ```
 
-### reactive_declaration_non_reactive_property
-
-```
-Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update
-```
-
 ### script_context_deprecated
 
 ```
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index e9014207fd..d82cdc47a1 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -54,6 +54,38 @@ The easiest way to log a value as it changes over time is to use the [`$inspect`
 
 > %component% mutated a value owned by %owner%. This is strongly discouraged. Consider passing values to child components with `bind:`, or use a callback instead
 
+## 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
+$: sum = a + b;
+```
+
+```js
+const sum = $derived(a + b);
+```
+
+In some cases — such as the one that triggered the above warning — they are _not_ the same:
+
+```js
+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/messages/compile-warnings/script.md b/packages/svelte/messages/compile-warnings/script.md
index 293f065ba7..2c891b4fc7 100644
--- a/packages/svelte/messages/compile-warnings/script.md
+++ b/packages/svelte/messages/compile-warnings/script.md
@@ -26,10 +26,6 @@
 
 > Reassignments of module-level declarations will not cause reactive statements to update
 
-## reactive_declaration_non_reactive_property
-
-> Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update
-
 ## state_referenced_locally
 
 > State referenced in its own scope will never update. Did you mean to reference it inside a closure?
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
index 1cc20c96da..6ea8f238e1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/MemberExpression.js
@@ -26,30 +26,5 @@ export function MemberExpression(node, context) {
 		context.state.analysis.needs_context = true;
 	}
 
-	if (context.state.reactive_statement) {
-		const left = object(node);
-
-		if (left !== null) {
-			const binding = context.state.scope.get(left.name);
-
-			if (binding && binding.kind === 'normal') {
-				const parent = /** @type {Node} */ (context.path.at(-1));
-
-				if (
-					binding.scope === context.state.analysis.module.scope ||
-					binding.declaration_kind === 'import' ||
-					(binding.initial &&
-						binding.initial.type !== 'ArrayExpression' &&
-						binding.initial.type !== 'ObjectExpression' &&
-						binding.scope.function_depth <= 1)
-				) {
-					if (parent.type !== 'MemberExpression' && parent.type !== 'CallExpression') {
-						w.reactive_declaration_non_reactive_property(node);
-					}
-				}
-			}
-		}
-	}
-
 	context.next();
 }
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 87f56262a8..8ca6534457 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
@@ -1,6 +1,8 @@
+/** @import { Location } from 'locate-character' */
 /** @import { Expression, LabeledStatement, Statement } from 'estree' */
 /** @import { ReactiveStatement } from '#compiler' */
 /** @import { ComponentContext } from '../types' */
+import { dev, is_ignored, locator } from '../../../../state.js';
 import * as b from '../../../../utils/builders.js';
 import { build_getter } from '../utils.js';
 
@@ -48,6 +50,11 @@ 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,
@@ -55,7 +62,9 @@ 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))
+				b.thunk(b.block(body)),
+				location && b.literal(location.line),
+				location && b.literal(location.column)
 			)
 		)
 	);
diff --git a/packages/svelte/src/compiler/warnings.js b/packages/svelte/src/compiler/warnings.js
index bd28956230..f6ed7de7d5 100644
--- a/packages/svelte/src/compiler/warnings.js
+++ b/packages/svelte/src/compiler/warnings.js
@@ -102,7 +102,6 @@ export const codes = [
 	"perf_avoid_nested_class",
 	"reactive_declaration_invalid_placement",
 	"reactive_declaration_module_script_dependency",
-	"reactive_declaration_non_reactive_property",
 	"state_referenced_locally",
 	"store_rune_conflict",
 	"css_unused_selector",
@@ -641,14 +640,6 @@ 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");
 }
 
-/**
- * Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update
- * @param {null | NodeLike} node
- */
-export function reactive_declaration_non_reactive_property(node) {
-	w(node, "reactive_declaration_non_reactive_property", "Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update");
-}
-
 /**
  * State referenced in its own scope will never update. Did you mean to reference it inside a closure?
  * @param {null | NodeLike} node
diff --git a/packages/svelte/src/constants.js b/packages/svelte/src/constants.js
index 03fddc5ebd..f8a7143b20 100644
--- a/packages/svelte/src/constants.js
+++ b/packages/svelte/src/constants.js
@@ -44,7 +44,8 @@ export const IGNORABLE_RUNTIME_WARNINGS = /** @type {const} */ ([
 	'hydration_attribute_changed',
 	'hydration_html_changed',
 	'ownership_invalid_binding',
-	'ownership_invalid_mutation'
+	'ownership_invalid_mutation',
+	'reactive_declaration_non_reactive_property'
 ]);
 
 /**
diff --git a/packages/svelte/src/internal/client/dev/location.js b/packages/svelte/src/internal/client/dev/location.js
new file mode 100644
index 0000000000..b2e16c371e
--- /dev/null
+++ b/packages/svelte/src/internal/client/dev/location.js
@@ -0,0 +1,25 @@
+import { DEV } from 'esm-env';
+import { FILENAME } from '../../../constants.js';
+import { dev_current_component_function } from '../runtime.js';
+
+/**
+ *
+ * @param {number} [line]
+ * @param {number} [column]
+ */
+export function get_location(line, column) {
+	if (!DEV || line === undefined) return undefined;
+
+	var filename = dev_current_component_function?.[FILENAME];
+	var location = filename && `${filename}:${line}:${column}`;
+
+	return sanitize_location(location);
+}
+
+/**
+ * Prevent devtools trying to make `location` a clickable link by inserting a zero-width space
+ * @param {string | undefined} location
+ */
+export function sanitize_location(location) {
+	return location?.replace(/\//g, '/\u200b');
+}
diff --git a/packages/svelte/src/internal/client/dom/blocks/html.js b/packages/svelte/src/internal/client/dom/blocks/html.js
index aa13336b29..2f815b454e 100644
--- a/packages/svelte/src/internal/client/dom/blocks/html.js
+++ b/packages/svelte/src/internal/client/dom/blocks/html.js
@@ -9,6 +9,7 @@ import { hash } from '../../../../utils.js';
 import { DEV } from 'esm-env';
 import { dev_current_component_function } from '../../runtime.js';
 import { get_first_child, get_next_sibling } from '../operations.js';
+import { sanitize_location } from '../../dev/location.js';
 
 /**
  * @param {Element} element
@@ -28,9 +29,7 @@ function check_hash(element, server_hash, value) {
 		location = `in ${dev_current_component_function[FILENAME]}`;
 	}
 
-	w.hydration_html_changed(
-		location?.replace(/\//g, '/\u200b') // prevent devtools trying to make it a clickable link by inserting a zero-width space
-	);
+	w.hydration_html_changed(sanitize_location(location));
 }
 
 /**
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 69b006fc0f..912aab37b6 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -16,7 +16,8 @@ import {
 	set_is_flushing_effect,
 	set_signal_status,
 	untrack,
-	skip_reaction
+	skip_reaction,
+	capture_signals
 } from '../runtime.js';
 import {
 	DIRTY,
@@ -39,10 +40,13 @@ import {
 } from '../constants.js';
 import { set } from './sources.js';
 import * as e from '../errors.js';
+import * as w from '../warnings.js';
 import { DEV } from 'esm-env';
 import { define_property } from '../../shared/utils.js';
 import { get_next_sibling } from '../dom/operations.js';
 import { destroy_derived } from './deriveds.js';
+import { FILENAME } from '../../../constants.js';
+import { get_location } from '../dev/location.js';
 
 /**
  * @param {'$effect' | '$effect.pre' | '$inspect'} rune
@@ -261,14 +265,21 @@ 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) {
+export function legacy_pre_effect(deps, fn, line, column) {
 	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();
 
@@ -278,7 +289,18 @@ export function legacy_pre_effect(deps, fn) {
 
 		token.ran = true;
 		set(context.l.r2, true);
-		untrack(fn);
+
+		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);
+		}
 	});
 }
 
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 2779898d6f..a3ec5bca34 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -894,15 +894,17 @@ export function safe_get(signal) {
 }
 
 /**
- * Invokes a function and captures all signals that are read during the invocation,
- * then invalidates them.
- * @param {() => any} fn
+ * Capture an array of all the signals that are read when `fn` is called
+ * @template T
+ * @param {() => T} fn
  */
-export function invalidate_inner_signals(fn) {
+export function capture_signals(fn) {
 	var previous_captured_signals = captured_signals;
 	captured_signals = new Set();
+
 	var captured = captured_signals;
 	var signal;
+
 	try {
 		untrack(fn);
 		if (previous_captured_signals !== null) {
@@ -913,7 +915,19 @@ export function invalidate_inner_signals(fn) {
 	} finally {
 		captured_signals = previous_captured_signals;
 	}
-	for (signal of captured) {
+
+	return captured;
+}
+
+/**
+ * Invokes a function and captures all signals that are read during the invocation,
+ * then invalidates them.
+ * @param {() => any} fn
+ */
+export function invalidate_inner_signals(fn) {
+	var captured = capture_signals(() => untrack(fn));
+
+	for (var signal of captured) {
 		// Go one level up because derived signals created as part of props in legacy mode
 		if ((signal.f & LEGACY_DERIVED_PROP) !== 0) {
 			for (const dep of /** @type {Derived} */ (signal).deps || []) {
diff --git a/packages/svelte/src/internal/client/warnings.js b/packages/svelte/src/internal/client/warnings.js
index 0478313719..5e38db52f0 100644
--- a/packages/svelte/src/internal/client/warnings.js
+++ b/packages/svelte/src/internal/client/warnings.js
@@ -153,6 +153,19 @@ 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`, bold, normal);
+	} else {
+		// TODO print a link to the documentation
+		console.warn("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
new file mode 100644
index 0000000000..7a77424bb2
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js
@@ -0,0 +1,26 @@
+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
new file mode 100644
index 0000000000..70fd0a6abc
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js
@@ -0,0 +1,11 @@
+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
new file mode 100644
index 0000000000..2a9b1e1f23
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte
@@ -0,0 +1,13 @@
+<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>
diff --git a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/_config.js b/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/_config.js
deleted file mode 100644
index f47bee71df..0000000000
--- a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/_config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { test } from '../../test';
-
-export default test({});
diff --git a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/input.svelte b/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/input.svelte
deleted file mode 100644
index 2582974b71..0000000000
--- a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/input.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	import { obj } from './data.js';
-
-	$: prop = obj.prop;
-	obj.foo = 'a different prop';
-</script>
-
-<p>{prop}</p>
diff --git a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/warnings.json b/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/warnings.json
deleted file mode 100644
index 4184902753..0000000000
--- a/packages/svelte/tests/validator/samples/reactive-statement-non-reactive-import-statement/warnings.json
+++ /dev/null
@@ -1,14 +0,0 @@
-[
-	{
-		"code": "reactive_declaration_non_reactive_property",
-		"message": "Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update",
-		"start": {
-			"line": 4,
-			"column": 11
-		},
-		"end": {
-			"line": 4,
-			"column": 19
-		}
-	}
-]

From 39275684e5f19c86ea976af4b2235e6b6588c27d Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 3 Dec 2024 19:49:32 +0100
Subject: [PATCH 248/404] fix: don't throw with nullish actions (#13559)

Co-authored-by: Oscar Dominguez <dominguez.celada@gmail.com>
---
 .changeset/afraid-worms-clean.md                           | 5 +++++
 .../phases/3-transform/client/visitors/UseDirective.js     | 5 ++++-
 .../tests/runtime-runes/samples/nullish-actions/_config.js | 5 +++++
 .../runtime-runes/samples/nullish-actions/main.svelte      | 7 +++++++
 4 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/afraid-worms-clean.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/nullish-actions/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/nullish-actions/main.svelte

diff --git a/.changeset/afraid-worms-clean.md b/.changeset/afraid-worms-clean.md
new file mode 100644
index 0000000000..800177b95b
--- /dev/null
+++ b/.changeset/afraid-worms-clean.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't throw with nullish actions
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
index f6d918ce45..be9eb2d516 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/UseDirective.js
@@ -20,7 +20,10 @@ export function UseDirective(node, context) {
 		context.state.node,
 		b.arrow(
 			params,
-			b.call(/** @type {Expression} */ (context.visit(parse_directive_name(node.name))), ...params)
+			b.maybe_call(
+				/** @type {Expression} */ (context.visit(parse_directive_name(node.name))),
+				...params
+			)
 		)
 	];
 
diff --git a/packages/svelte/tests/runtime-runes/samples/nullish-actions/_config.js b/packages/svelte/tests/runtime-runes/samples/nullish-actions/_config.js
new file mode 100644
index 0000000000..5d96dc96a4
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/nullish-actions/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+export default test({
+	html: '<div></div> <div></div>'
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/nullish-actions/main.svelte b/packages/svelte/tests/runtime-runes/samples/nullish-actions/main.svelte
new file mode 100644
index 0000000000..2cbeb6722d
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/nullish-actions/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	let { action_prop } = $props();
+	let action = $state();
+</script>
+
+<div use:action></div>
+<div use:action_prop></div>
\ No newline at end of file

From 2f8eda94f34f756f5f5c6ea50d202f83e0d875a8 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 13:49:57 -0500
Subject: [PATCH 249/404] fix: ensure SvelteDate cached methods have correct
 reactive context (#14525)

* fix: ensure SvelteDate cached methods have no reactive context

* fix: ensure SvelteDate cached methods have no reactive context

* fix

* lint

* use active reaction at time of instance creation

* tweak changeset

* Update packages/svelte/src/internal/client/dom/elements/bindings/shared.js

Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>

---------

Co-authored-by: Dominic Gannaway <dg@domgan.com>
Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
---
 .changeset/wicked-zebras-exist.md           |  5 ++++
 packages/svelte/src/reactivity/date.js      | 14 +++++++---
 packages/svelte/src/reactivity/date.test.ts | 30 +++++++++++++++++++++
 3 files changed, 46 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/wicked-zebras-exist.md

diff --git a/.changeset/wicked-zebras-exist.md b/.changeset/wicked-zebras-exist.md
new file mode 100644
index 0000000000..f76d77bb90
--- /dev/null
+++ b/.changeset/wicked-zebras-exist.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: use correct reaction when lazily creating deriveds inside `SvelteDate`
diff --git a/packages/svelte/src/reactivity/date.js b/packages/svelte/src/reactivity/date.js
index 2d8de624bc..33da2e1761 100644
--- a/packages/svelte/src/reactivity/date.js
+++ b/packages/svelte/src/reactivity/date.js
@@ -1,8 +1,7 @@
 /** @import { Source } from '#client' */
-import { DESTROYED } from '../internal/client/constants.js';
 import { derived } from '../internal/client/index.js';
 import { source, set } from '../internal/client/reactivity/sources.js';
-import { get } from '../internal/client/runtime.js';
+import { active_reaction, get, set_active_reaction } from '../internal/client/runtime.js';
 
 var inited = false;
 
@@ -12,6 +11,8 @@ export class SvelteDate extends Date {
 	/** @type {Map<keyof Date, Source<unknown>>} */
 	#deriveds = new Map();
 
+	#reaction = active_reaction;
+
 	/** @param {any[]} params */
 	constructor(...params) {
 		// @ts-ignore
@@ -43,7 +44,12 @@ export class SvelteDate extends Date {
 
 					var d = this.#deriveds.get(method);
 
-					if (d === undefined || (d.f & DESTROYED) !== 0) {
+					if (d === undefined) {
+						// lazily create the derived, but as though it were being
+						// created at the same time as the class instance
+						const reaction = active_reaction;
+						set_active_reaction(this.#reaction);
+
 						d = derived(() => {
 							get(this.#time);
 							// @ts-ignore
@@ -51,6 +57,8 @@ export class SvelteDate extends Date {
 						});
 
 						this.#deriveds.set(method, d);
+
+						set_active_reaction(reaction);
 					}
 
 					return get(d);
diff --git a/packages/svelte/src/reactivity/date.test.ts b/packages/svelte/src/reactivity/date.test.ts
index 87bfde41c8..f90c5a102c 100644
--- a/packages/svelte/src/reactivity/date.test.ts
+++ b/packages/svelte/src/reactivity/date.test.ts
@@ -642,3 +642,33 @@ test('Date methods invoked for the first time in a derived', () => {
 
 	cleanup();
 });
+
+test('Date methods shared between deriveds', () => {
+	const date = new SvelteDate(initial_date);
+	const log: any = [];
+
+	const cleanup = effect_root(() => {
+		const year = derived(() => {
+			return date.getFullYear();
+		});
+		const year2 = derived(() => {
+			return date.getTime(), date.getFullYear();
+		});
+
+		render_effect(() => {
+			log.push(get(year) + '/' + get(year2).toString());
+		});
+
+		flushSync(() => {
+			date.setFullYear(date.getFullYear() + 1);
+		});
+
+		flushSync(() => {
+			date.setFullYear(date.getFullYear() + 1);
+		});
+	});
+
+	assert.deepEqual(log, ['2023/2023', '2024/2024', '2025/2025']);
+
+	cleanup();
+});

From d595cc16fbc5a88e3ce0dff8c3e36c10a9e78ac9 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 13:50:54 -0500
Subject: [PATCH 250/404] Version Packages (#14529)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/afraid-worms-clean.md |  5 -----
 .changeset/neat-news-dance.md    |  5 -----
 .changeset/witty-turtles-bake.md |  5 -----
 packages/svelte/CHANGELOG.md     | 10 ++++++++++
 packages/svelte/package.json     |  2 +-
 packages/svelte/src/version.js   |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/afraid-worms-clean.md
 delete mode 100644 .changeset/neat-news-dance.md
 delete mode 100644 .changeset/witty-turtles-bake.md

diff --git a/.changeset/afraid-worms-clean.md b/.changeset/afraid-worms-clean.md
deleted file mode 100644
index 800177b95b..0000000000
--- a/.changeset/afraid-worms-clean.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't throw with nullish actions
diff --git a/.changeset/neat-news-dance.md b/.changeset/neat-news-dance.md
deleted file mode 100644
index 817c012330..0000000000
--- a/.changeset/neat-news-dance.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: leave update expressions untransformed unless a transformer is provided
diff --git a/.changeset/witty-turtles-bake.md b/.changeset/witty-turtles-bake.md
deleted file mode 100644
index 04637516f8..0000000000
--- a/.changeset/witty-turtles-bake.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: turn reactive_declaration_non_reactive_property into a runtime warning
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index a53738689f..c1a102378a 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.5.1
+
+### Patch Changes
+
+- fix: don't throw with nullish actions ([#13559](https://github.com/sveltejs/svelte/pull/13559))
+
+- fix: leave update expressions untransformed unless a transformer is provided ([#14507](https://github.com/sveltejs/svelte/pull/14507))
+
+- chore: turn reactive_declaration_non_reactive_property into a runtime warning ([#14192](https://github.com/sveltejs/svelte/pull/14192))
+
 ## 5.5.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index fe25b0bb34..6d1229415b 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.5.0",
+  "version": "5.5.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1271d6cb90..1fbb82c6fb 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.5.0';
+export const VERSION = '5.5.1';
 export const PUBLIC_VERSION = '5';

From a65e68ca37d171663feec99382efd46e7cea364f Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 13:59:16 -0500
Subject: [PATCH 251/404] Version Packages (#14530)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/wicked-zebras-exist.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/wicked-zebras-exist.md

diff --git a/.changeset/wicked-zebras-exist.md b/.changeset/wicked-zebras-exist.md
deleted file mode 100644
index f76d77bb90..0000000000
--- a/.changeset/wicked-zebras-exist.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: use correct reaction when lazily creating deriveds inside `SvelteDate`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index c1a102378a..8bf0885277 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.5.2
+
+### Patch Changes
+
+- fix: use correct reaction when lazily creating deriveds inside `SvelteDate` ([#14525](https://github.com/sveltejs/svelte/pull/14525))
+
 ## 5.5.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6d1229415b..0728adf5fc 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.5.1",
+  "version": "5.5.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1fbb82c6fb..0394adda82 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.5.1';
+export const VERSION = '5.5.2';
 export const PUBLIC_VERSION = '5';

From d5a28a01a16b1151c62dde878f69c4cb6e80d108 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 3 Dec 2024 22:31:28 +0100
Subject: [PATCH 252/404] docs: fix typo in `$state` (#14535)

---
 documentation/docs/02-runes/02-$state.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/02-runes/02-$state.md b/documentation/docs/02-runes/02-$state.md
index 80bf6bd03f..77140dc690 100644
--- a/documentation/docs/02-runes/02-$state.md
+++ b/documentation/docs/02-runes/02-$state.md
@@ -215,7 +215,7 @@ let total = add+++(() => a, () => b)+++;
 console.log(+++total()+++); // 3
 
 a = 3;
-a = 4;
+b = 4;
 console.log(+++total()+++); // 7
 ```
 

From b5588523fc03cddec877161c17dd93d524a15129 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Tue, 3 Dec 2024 22:22:23 +0000
Subject: [PATCH 253/404] fix: capture infinite_loop_guard in error boundary
 (#14534)

* fix: capture infinite_loop_guard in error boundary

* fix
---
 .changeset/hip-forks-exercise.md              |  5 ++
 .../svelte/src/internal/client/runtime.js     | 52 ++++++++++++++-----
 .../samples/error-boundary-20/Child.svelte    | 17 ++++++
 .../samples/error-boundary-20/_config.js      | 13 +++++
 .../samples/error-boundary-20/main.svelte     | 10 ++++
 5 files changed, 85 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/hip-forks-exercise.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-20/Child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-20/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/error-boundary-20/main.svelte

diff --git a/.changeset/hip-forks-exercise.md b/.changeset/hip-forks-exercise.md
new file mode 100644
index 0000000000..41df40bd6a
--- /dev/null
+++ b/.changeset/hip-forks-exercise.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: capture infinite_loop_guard in error boundary
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index a3ec5bca34..4928419d16 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -48,6 +48,9 @@ let scheduler_mode = FLUSH_MICROTASK;
 // Used for handling scheduling
 let is_micro_task_queued = false;
 
+/** @type {Effect | null} */
+let last_scheduled_effect = null;
+
 export let is_flushing_effect = false;
 export let is_destroying_effect = false;
 
@@ -532,27 +535,47 @@ export function update_effect(effect) {
 	}
 }
 
+function log_effect_stack() {
+	// eslint-disable-next-line no-console
+	console.error(
+		'Last ten effects were: ',
+		dev_effect_stack.slice(-10).map((d) => d.fn)
+	);
+	dev_effect_stack = [];
+}
+
 function infinite_loop_guard() {
 	if (flush_count > 1000) {
 		flush_count = 0;
-		if (DEV) {
-			try {
-				e.effect_update_depth_exceeded();
-			} catch (error) {
+		try {
+			e.effect_update_depth_exceeded();
+		} catch (error) {
+			if (DEV) {
 				// stack is garbage, ignore. Instead add a console.error message.
 				define_property(error, 'stack', {
 					value: ''
 				});
-				// eslint-disable-next-line no-console
-				console.error(
-					'Last ten effects were: ',
-					dev_effect_stack.slice(-10).map((d) => d.fn)
-				);
-				dev_effect_stack = [];
+			}
+			// Try and handle the error so it can be caught at a boundary, that's
+			// if there's an effect available from when it was last scheduled
+			if (last_scheduled_effect !== null) {
+				if (DEV) {
+					try {
+						handle_error(error, last_scheduled_effect, null, null);
+					} catch (e) {
+						// Only log the effect stack if the error is re-thrown
+						log_effect_stack();
+						throw e;
+					}
+				} else {
+					handle_error(error, last_scheduled_effect, null, null);
+				}
+			} else {
+				if (DEV) {
+					log_effect_stack();
+				}
 				throw error;
 			}
-		} else {
-			e.effect_update_depth_exceeded();
 		}
 	}
 	flush_count++;
@@ -637,8 +660,10 @@ function process_deferred() {
 	const previous_queued_root_effects = queued_root_effects;
 	queued_root_effects = [];
 	flush_queued_root_effects(previous_queued_root_effects);
+
 	if (!is_micro_task_queued) {
 		flush_count = 0;
+		last_scheduled_effect = null;
 		if (DEV) {
 			dev_effect_stack = [];
 		}
@@ -657,6 +682,8 @@ export function schedule_effect(signal) {
 		}
 	}
 
+	last_scheduled_effect = signal;
+
 	var effect = signal;
 
 	while (effect.parent !== null) {
@@ -776,6 +803,7 @@ export function flush_sync(fn) {
 		}
 
 		flush_count = 0;
+		last_scheduled_effect = null;
 		if (DEV) {
 			dev_effect_stack = [];
 		}
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-20/Child.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/Child.svelte
new file mode 100644
index 0000000000..ff97dd96f0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/Child.svelte
@@ -0,0 +1,17 @@
+<script>
+	let count = $state(0);
+	let clicked = $state(false);
+
+	function increment() {
+		clicked = true;
+		count++;
+	}
+
+	$effect(() => {
+		if (clicked) {
+			count++;
+		}
+	});
+</script>
+
+<button onclick={increment}>{count}</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-20/_config.js b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/_config.js
new file mode 100644
index 0000000000..ccff614ade
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/_config.js
@@ -0,0 +1,13 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	test({ assert, target }) {
+		let btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<div class="error">An error occurred!</div>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/error-boundary-20/main.svelte b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/main.svelte
new file mode 100644
index 0000000000..18f216147f
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/error-boundary-20/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	import Child from "./Child.svelte"
+</script>
+<svelte:boundary>
+	<Child />
+
+	{#snippet failed()}
+		<div class="error">An error occurred!</div>
+	{/snippet}
+</svelte:boundary>

From bbee1fc7e05a24b3b31fbce50144aee5d898009a Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 3 Dec 2024 23:24:10 +0100
Subject: [PATCH 254/404] fix: don't try to add owners to non-`$state` class
 fields (#14533)

* fix: don't try to add owners to non-`$state` class fields

`$state.raw` and `$derived(.by)` will not have a state symbol on them, potentially causing a disastrous amount of traversal to potentially not find any state symbol. So it's better to not traverse them.

Potentially 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.

Fixes #14491

* for bind:, too
---
 .changeset/giant-windows-dance.md             |  5 ++++
 .../3-transform/client/visitors/ClassBody.js  | 25 +++++++++-------
 .../client/visitors/shared/component.js       | 30 ++++++++++++-------
 3 files changed, 40 insertions(+), 20 deletions(-)
 create mode 100644 .changeset/giant-windows-dance.md

diff --git a/.changeset/giant-windows-dance.md b/.changeset/giant-windows-dance.md
new file mode 100644
index 0000000000..7ada8c4836
--- /dev/null
+++ b/.changeset/giant-windows-dance.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't try to add owners to non-`$state` class fields
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 11a524d33c..5e842a82fe 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
@@ -184,17 +184,22 @@ export function ClassBody(node, context) {
 				'method',
 				b.id('$.ADD_OWNER'),
 				[b.id('owner')],
-				Array.from(public_state.keys()).map((name) =>
-					b.stmt(
-						b.call(
-							'$.add_owner',
-							b.call('$.get', b.member(b.this, b.private_id(name))),
-							b.id('owner'),
-							b.literal(false),
-							is_ignored(node, 'ownership_invalid_binding') && b.true
+				Array.from(public_state)
+					// 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.
+					.filter(([_, { kind }]) => kind === 'state')
+					.map(([name]) =>
+						b.stmt(
+							b.call(
+								'$.add_owner',
+								b.call('$.get', b.member(b.this, b.private_id(name))),
+								b.id('owner'),
+								b.literal(false),
+								is_ignored(node, 'ownership_invalid_binding') && b.true
+							)
 						)
-					)
-				),
+					),
 				true
 			)
 		);
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 8e1a536707..5dde60b3b4 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
@@ -2,7 +2,7 @@
 /** @import { AST, TemplateNode } from '#compiler' */
 /** @import { ComponentContext } from '../../types.js' */
 import { dev, is_ignored } from '../../../../../state.js';
-import { get_attribute_chunks } from '../../../../../utils/ast.js';
+import { get_attribute_chunks, object } from '../../../../../utils/ast.js';
 import * as b from '../../../../../utils/builders.js';
 import { create_derived } from '../../utils.js';
 import { build_bind_this, validate_binding } from '../shared/utils.js';
@@ -176,16 +176,26 @@ export function build_component(node, component_name, context, anchor = context.
 				bind_this = attribute.expression;
 			} else {
 				if (dev) {
-					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
+					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
+								)
 							)
-						)
-					);
+						);
+					}
 				}
 
 				const is_store_sub =

From fe0bd299a5101c7dc24546cd92dac04857f3b53d Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 17:24:47 -0500
Subject: [PATCH 255/404] fix: proxify values when assigning using `||=`, `&&=`
 and `??=` operators (#14273)

* add failing test for #14268

* simplify

* proxify values when using ||=, &&= and ??= assignment operators

* proxify values assigned to private state fields

* changeset

* fix

* fix

* add warning

* update test
---
 .changeset/shaggy-spies-happen.md             |   5 +
 .../.generated/client-warnings.md             |  32 ++++++
 .../messages/client-warnings/warnings.md      |  30 +++++
 .../client/visitors/AssignmentExpression.js   | 104 ++++++++++++++++--
 .../svelte/src/internal/client/dev/assign.js  |  57 ++++++++++
 packages/svelte/src/internal/client/index.js  |   1 +
 .../svelte/src/internal/client/warnings.js    |  14 +++
 .../_config.js                                |  24 ++++
 .../main.svelte                               |   7 ++
 .../_config.js                                |  16 +++
 .../main.svelte                               |   7 ++
 11 files changed, 287 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/shaggy-spies-happen.md
 create mode 100644 packages/svelte/src/internal/client/dev/assign.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte

diff --git a/.changeset/shaggy-spies-happen.md b/.changeset/shaggy-spies-happen.md
new file mode 100644
index 0000000000..bb80ffd8f8
--- /dev/null
+++ b/.changeset/shaggy-spies-happen.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: proxify values when assigning using `||=`, `&&=` and `??=` operators
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 6e97211341..60eb3e126c 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -1,5 +1,37 @@
 <!-- This file is generated by scripts/process-messages/index.js. Do not edit! -->
 
+### assignment_value_stale
+
+```
+Assignment 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.
+```
+
+Given a case like this...
+
+```svelte
+<script>
+	let object = $state({ array: null });
+
+	function add() {
+		(object.array ??= []).push(object.array.length);
+	}
+</script>
+
+<button onclick={add}>add</button>
+<p>items: {JSON.stringify(object.items)}</p>
+```
+
+...the array being pushed to when the button is first clicked is the `[]` on the right-hand side of the assignment, but the resulting value of `object.array` is an empty state proxy. As a result, the pushed value will be discarded.
+
+You can fix this by separating it into two statements:
+
+```js
+function add() {
+	object.array ??= [];
+	object.array.push(object.array.length);
+}
+```
+
 ### binding_property_non_reactive
 
 ```
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index d82cdc47a1..482a3d7faa 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -1,3 +1,33 @@
+## assignment_value_stale
+
+> Assignment 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.
+
+Given a case like this...
+
+```svelte
+<script>
+	let object = $state({ array: null });
+
+	function add() {
+		(object.array ??= []).push(object.array.length);
+	}
+</script>
+
+<button onclick={add}>add</button>
+<p>items: {JSON.stringify(object.items)}</p>
+```
+
+...the array being pushed to when the button is first clicked is the `[]` on the right-hand side of the assignment, but the resulting value of `object.array` is an empty state proxy. As a result, the pushed value will be discarded.
+
+You can fix this by separating it into two statements:
+
+```js
+function add() {
+	object.array ??= [];
+	object.array.push(object.array.length);
+}
+```
+
 ## binding_property_non_reactive
 
 > `%binding%` is binding to a non-reactive property
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 ee909ede91..66ea2c4941 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
@@ -1,8 +1,14 @@
-/** @import { AssignmentExpression, AssignmentOperator, Expression, Pattern } from 'estree' */
+/** @import { Location } from 'locate-character' */
+/** @import { AssignmentExpression, AssignmentOperator, Expression, Identifier, Literal, MemberExpression, Pattern } from 'estree' */
+/** @import { AST } from '#compiler' */
 /** @import { Context } from '../types.js' */
 import * as b from '../../../../utils/builders.js';
-import { build_assignment_value } from '../../../../utils/ast.js';
-import { is_ignored } from '../../../../state.js';
+import {
+	build_assignment_value,
+	get_attribute_expression,
+	is_event_attribute
+} from '../../../../utils/ast.js';
+import { dev, filename, is_ignored, locator } from '../../../../state.js';
 import { build_proxy_reassignment, should_proxy } from '../utils.js';
 import { visit_assignment_expression } from '../../shared/assignments.js';
 
@@ -20,6 +26,24 @@ export function AssignmentExpression(node, context) {
 		: expression;
 }
 
+/**
+ * Determines whether the value will be coerced on assignment (as with e.g. `+=`).
+ * If not, we may need to proxify the value, or warn that the value will not be
+ * proxified in time
+ * @param {AssignmentOperator} operator
+ */
+function is_non_coercive_operator(operator) {
+	return ['=', '||=', '&&=', '??='].includes(operator);
+}
+
+/** @type {Record<string, string>} */
+const callees = {
+	'=': '$.assign',
+	'&&=': '$.assign_and',
+	'||=': '$.assign_or',
+	'??=': '$.assign_nullish'
+};
+
 /**
  * @param {AssignmentOperator} operator
  * @param {Pattern} left
@@ -41,7 +65,11 @@ function build_assignment(operator, left, right, context) {
 				context.visit(build_assignment_value(operator, left, right))
 			);
 
-			if (private_state.kind !== 'raw_state' && should_proxy(value, context.state.scope)) {
+			if (
+				private_state.kind === 'state' &&
+				is_non_coercive_operator(operator) &&
+				should_proxy(value, context.state.scope)
+			) {
 				value = build_proxy_reassignment(value, b.member(b.this, private_state.id));
 			}
 
@@ -73,24 +101,28 @@ function build_assignment(operator, left, right, context) {
 		? context.state.transform[object.name]
 		: null;
 
+	const path = context.path.map((node) => node.type);
+
 	// reassignment
 	if (object === left && transform?.assign) {
+		// special case — if an element binding, we know it's a primitive
+
+		const is_primitive = path.at(-1) === 'BindDirective' && path.at(-2) === 'RegularElement';
+
 		let value = /** @type {Expression} */ (
 			context.visit(build_assignment_value(operator, left, right))
 		);
 
-		// special case — if an element binding, we know it's a primitive
-		const path = context.path.map((node) => node.type);
-		const is_primitive = path.at(-1) === 'BindDirective' && path.at(-2) === 'RegularElement';
-
 		if (
 			!is_primitive &&
 			binding.kind !== 'prop' &&
 			binding.kind !== 'bindable_prop' &&
+			binding.kind !== 'raw_state' &&
 			context.state.analysis.runes &&
-			should_proxy(value, context.state.scope)
+			should_proxy(right, context.state.scope) &&
+			is_non_coercive_operator(operator)
 		) {
-			value = binding.kind === 'raw_state' ? value : build_proxy_reassignment(value, object);
+			value = build_proxy_reassignment(value, object);
 		}
 
 		return transform.assign(object, value);
@@ -108,5 +140,57 @@ function build_assignment(operator, left, right, context) {
 		);
 	}
 
+	// in cases like `(object.items ??= []).push(value)`, we may need to warn
+	// if the value gets proxified, since the proxy _isn't_ the thing that
+	// will be pushed to. we do this by transforming it to something like
+	// `$.assign_nullish(object, 'items', [])`
+	let should_transform =
+		dev && path.at(-1) !== 'ExpressionStatement' && is_non_coercive_operator(operator);
+
+	// special case — ignore `onclick={() => (...)}`
+	if (
+		path.at(-1) === 'ArrowFunctionExpression' &&
+		(path.at(-2) === 'RegularElement' || path.at(-2) === 'SvelteElement')
+	) {
+		const element = /** @type {AST.RegularElement} */ (context.path.at(-2));
+
+		const attribute = element.attributes.find((attribute) => {
+			if (attribute.type !== 'Attribute' || !is_event_attribute(attribute)) {
+				return false;
+			}
+
+			const expression = get_attribute_expression(attribute);
+
+			return expression === context.path.at(-1);
+		});
+
+		if (attribute) {
+			should_transform = false;
+		}
+	}
+
+	if (left.type === 'MemberExpression' && should_transform) {
+		const callee = callees[operator];
+
+		const loc = /** @type {Location} */ (locator(/** @type {number} */ (left.start)));
+		const location = `${filename}:${loc.line}:${loc.column}`;
+
+		return /** @type {Expression} */ (
+			context.visit(
+				b.call(
+					callee,
+					/** @type {Expression} */ (left.object),
+					/** @type {Expression} */ (
+						left.computed
+							? left.property
+							: b.literal(/** @type {Identifier} */ (left.property).name)
+					),
+					right,
+					b.literal(location)
+				)
+			)
+		);
+	}
+
 	return null;
 }
diff --git a/packages/svelte/src/internal/client/dev/assign.js b/packages/svelte/src/internal/client/dev/assign.js
new file mode 100644
index 0000000000..cf8c31a941
--- /dev/null
+++ b/packages/svelte/src/internal/client/dev/assign.js
@@ -0,0 +1,57 @@
+import * as w from '../warnings.js';
+import { sanitize_location } from './location.js';
+
+/**
+ *
+ * @param {any} a
+ * @param {any} b
+ * @param {string} property
+ * @param {string} location
+ */
+function compare(a, b, property, location) {
+	if (a !== b) {
+		w.assignment_value_stale(property, /** @type {string} */ (sanitize_location(location)));
+	}
+
+	return a;
+}
+
+/**
+ * @param {any} object
+ * @param {string} property
+ * @param {any} value
+ * @param {string} location
+ */
+export function assign(object, property, value, location) {
+	return compare((object[property] = value), object[property], property, location);
+}
+
+/**
+ * @param {any} object
+ * @param {string} property
+ * @param {any} value
+ * @param {string} location
+ */
+export function assign_and(object, property, value, location) {
+	return compare((object[property] &&= value), object[property], property, location);
+}
+
+/**
+ * @param {any} object
+ * @param {string} property
+ * @param {any} value
+ * @param {string} location
+ */
+export function assign_or(object, property, value, location) {
+	return compare((object[property] ||= value), object[property], property, location);
+}
+
+/**
+ * @param {any} object
+ * @param {string} property
+ * @param {any} value
+ * @param {string} location
+ */
+export function assign_nullish(object, property, value, location) {
+	return compare((object[property] ??= value), object[property], property, location);
+}
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index e8cbefb090..6fae2893e6 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -1,4 +1,5 @@
 export { FILENAME, HMR, NAMESPACE_SVG } from '../../constants.js';
+export { assign, assign_and, assign_or, assign_nullish } from './dev/assign.js';
 export { cleanup_styles } from './dev/css.js';
 export { add_locations } from './dev/elements.js';
 export { hmr } from './dev/hmr.js';
diff --git a/packages/svelte/src/internal/client/warnings.js b/packages/svelte/src/internal/client/warnings.js
index 5e38db52f0..2f28d3e9e3 100644
--- a/packages/svelte/src/internal/client/warnings.js
+++ b/packages/svelte/src/internal/client/warnings.js
@@ -5,6 +5,20 @@ import { DEV } from 'esm-env';
 var bold = 'font-weight: bold';
 var normal = 'font-weight: normal';
 
+/**
+ * Assignment 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.
+ * @param {string} property
+ * @param {string} location
+ */
+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);
+	} else {
+		// TODO print a link to the documentation
+		console.warn("assignment_value_stale");
+	}
+}
+
 /**
  * `%binding%` (%location%) is binding to a non-reactive property
  * @param {string} binding
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js
new file mode 100644
index 0000000000..a6d79c05ed
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/_config.js
@@ -0,0 +1,24 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: `<button>items: null</button>`,
+
+	test({ assert, target, warnings }) {
+		const btn = target.querySelector('button');
+
+		flushSync(() => btn?.click());
+		assert.htmlEqual(target.innerHTML, `<button>items: []</button>`);
+
+		flushSync(() => btn?.click());
+		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button>`);
+
+		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.'
+		]);
+	}
+});
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
new file mode 100644
index 0000000000..f151336046
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment-warning/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	let object = $state({ items: null });
+</script>
+
+<button onclick={() => (object.items ??= []).push(object.items.length)}>
+	items: {JSON.stringify(object.items)}
+</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js
new file mode 100644
index 0000000000..99d957e980
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/_config.js
@@ -0,0 +1,16 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `<button>items: null</button>`,
+
+	test({ assert, target }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+
+		flushSync(() => btn1.click());
+		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button>`);
+
+		flushSync(() => btn1.click());
+		assert.htmlEqual(target.innerHTML, `<button>items: [0,1]</button>`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte
new file mode 100644
index 0000000000..84c1c32c5c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-nullish-coalescing-assignment/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	let items = $state(null);
+</script>
+
+<button onclick={() => (items ??= []).push(items.length)}>
+	items: {JSON.stringify(items)}
+</button>

From 3d9122fcc430b65fcf6b32722d77928d62bc6a0e Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 17:51:23 -0500
Subject: [PATCH 256/404] Version Packages (#14537)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/giant-windows-dance.md |  5 -----
 .changeset/hip-forks-exercise.md  |  5 -----
 .changeset/shaggy-spies-happen.md |  5 -----
 packages/svelte/CHANGELOG.md      | 10 ++++++++++
 packages/svelte/package.json      |  2 +-
 packages/svelte/src/version.js    |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/giant-windows-dance.md
 delete mode 100644 .changeset/hip-forks-exercise.md
 delete mode 100644 .changeset/shaggy-spies-happen.md

diff --git a/.changeset/giant-windows-dance.md b/.changeset/giant-windows-dance.md
deleted file mode 100644
index 7ada8c4836..0000000000
--- a/.changeset/giant-windows-dance.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't try to add owners to non-`$state` class fields
diff --git a/.changeset/hip-forks-exercise.md b/.changeset/hip-forks-exercise.md
deleted file mode 100644
index 41df40bd6a..0000000000
--- a/.changeset/hip-forks-exercise.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: capture infinite_loop_guard in error boundary
diff --git a/.changeset/shaggy-spies-happen.md b/.changeset/shaggy-spies-happen.md
deleted file mode 100644
index bb80ffd8f8..0000000000
--- a/.changeset/shaggy-spies-happen.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: proxify values when assigning using `||=`, `&&=` and `??=` operators
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 8bf0885277..4024b6ec77 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.5.3
+
+### Patch Changes
+
+- fix: don't try to add owners to non-`$state` class fields ([#14533](https://github.com/sveltejs/svelte/pull/14533))
+
+- fix: capture infinite_loop_guard in error boundary ([#14534](https://github.com/sveltejs/svelte/pull/14534))
+
+- fix: proxify values when assigning using `||=`, `&&=` and `??=` operators ([#14273](https://github.com/sveltejs/svelte/pull/14273))
+
 ## 5.5.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 0728adf5fc..3c925c30f6 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.5.2",
+  "version": "5.5.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 0394adda82..a9ec7f8cf2 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.5.2';
+export const VERSION = '5.5.3';
 export const PUBLIC_VERSION = '5';

From 4c4f18b24c644f7e17cd9fea7fde777f3324e206 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 3 Dec 2024 18:31:53 -0500
Subject: [PATCH 257/404] chore: fix docs (#14538)

---
 .../docs/98-reference/.generated/client-warnings.md       | 8 ++++++++
 packages/svelte/messages/client-warnings/warnings.md      | 8 ++++++++
 2 files changed, 16 insertions(+)

diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 60eb3e126c..ef19a28994 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -26,6 +26,8 @@ Given a case like this...
 You can fix this by separating it into two statements:
 
 ```js
+let object = { array: [0] };
+// ---cut---
 function add() {
 	object.array ??= [];
 	object.array.push(object.array.length);
@@ -131,16 +133,22 @@ In runes mode, effects and deriveds re-run when there are changes to the values
 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
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index 482a3d7faa..019e83e7b1 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -22,6 +22,8 @@ Given a case like this...
 You can fix this by separating it into two statements:
 
 ```js
+let object = { array: [0] };
+// ---cut---
 function add() {
 	object.array ??= [];
 	object.array.push(object.array.length);
@@ -95,16 +97,22 @@ In runes mode, effects and deriveds re-run when there are changes to the values
 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

From 1f973b1770a7689b9d54012e72adfd65434da50e Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Wed, 4 Dec 2024 13:06:07 +0100
Subject: [PATCH 258/404] fix: remove spreaded event handlers when they become
 nullish (#14546)

Fixes #14539
---
 .changeset/itchy-cooks-yawn.md                |  5 +++
 .../client/dom/elements/attributes.js         |  3 ++
 .../remove-spreaded-handlers/_config.js       | 32 +++++++++++++++++++
 .../remove-spreaded-handlers/main.svelte      | 12 +++++++
 4 files changed, 52 insertions(+)
 create mode 100644 .changeset/itchy-cooks-yawn.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/main.svelte

diff --git a/.changeset/itchy-cooks-yawn.md b/.changeset/itchy-cooks-yawn.md
new file mode 100644
index 0000000000..2b23ca5d93
--- /dev/null
+++ b/.changeset/itchy-cooks-yawn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove spreaded event handlers when they become nullish
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index d927af543f..ced4c4cf25 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -281,6 +281,9 @@ export function set_attributes(
 					element[`__${event_name}`] = value;
 					delegate([event_name]);
 				}
+			} else if (delegated) {
+				// @ts-ignore
+				element[`__${event_name}`] = undefined;
 			}
 		} else if (key === 'style' && value != null) {
 			element.style.cssText = value + '';
diff --git a/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/_config.js b/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/_config.js
new file mode 100644
index 0000000000..9cff16d9f5
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/_config.js
@@ -0,0 +1,32 @@
+import { ok, test } from '../../test';
+import { flushSync } from 'svelte';
+
+export default test({
+	async test({ assert, target, instance }) {
+		const p = target.querySelector('p');
+		const btn = target.querySelector('button');
+		const input = target.querySelector('input');
+		ok(p);
+
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p.innerHTML, '1');
+
+		flushSync(() => {
+			input?.click();
+		});
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p.innerHTML, '1');
+
+		flushSync(() => {
+			input?.click();
+		});
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p.innerHTML, '2');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/main.svelte b/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/main.svelte
new file mode 100644
index 0000000000..4ca6e61339
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/remove-spreaded-handlers/main.svelte
@@ -0,0 +1,12 @@
+<script>
+	let checked = $state(true)
+	let count = $state(0)
+
+	const onclick = $derived(checked ? (() => { count++ }) : undefined)
+</script>
+
+<p>
+	{count}
+</p>
+<input type="checkbox" bind:checked />
+<button {...{onclick}}></button>

From 348185794d48544e7efb982b3b4074d82e05b860 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 4 Dec 2024 07:07:25 -0500
Subject: [PATCH 259/404] docs: tweak slot docs (#14543)

---
 .../docs/99-legacy/20-legacy-slots.md         | 28 +++++++++++--------
 1 file changed, 17 insertions(+), 11 deletions(-)

diff --git a/documentation/docs/99-legacy/20-legacy-slots.md b/documentation/docs/99-legacy/20-legacy-slots.md
index 5189f2017d..3474782e93 100644
--- a/documentation/docs/99-legacy/20-legacy-slots.md
+++ b/documentation/docs/99-legacy/20-legacy-slots.md
@@ -74,39 +74,45 @@ If no slotted content is provided, a component can define fallback content by pu
 
 Slots can be rendered zero or more times and can pass values _back_ to the parent using props. The parent exposes the values to the slot template using the `let:` directive.
 
-The usual shorthand rules apply — `let:item` is equivalent to `let:item={item}`, and `<slot {item}>` is equivalent to `<slot item={item}>`.
-
 ```svelte
-<!-- FancyList.svelte -->
+<!--- file: FancyList.svelte --->
 <ul>
-	{#each items as item}
+	{#each items as data}
 		<li class="fancy">
-			<slot prop={item} />
+			<!-- 'item' here... -->
+			<slot item={process(data)} />
 		</li>
 	{/each}
 </ul>
+```
 
-<!-- App.svelte -->
-<FancyList {items} let:prop={thing}>
-	<div>{thing.text}</div>
+```svelte
+<!--- file: App.svelte --->
+<!-- ...corresponds to 'item' here: -->
+<FancyList {items} let:item={processed}>
+	<div>{processed.text}</div>
 </FancyList>
 ```
 
+The usual shorthand rules apply — `let:item` is equivalent to `let:item={item}`, and `<slot {item}>` is equivalent to `<slot item={item}>`.
+
 Named slots can also expose values. The `let:` directive goes on the element with the `slot` attribute.
 
 ```svelte
-<!-- FancyList.svelte -->
+<!--- file: FancyList.svelte --->
 <ul>
 	{#each items as item}
 		<li class="fancy">
-			<slot name="item" {item} />
+			<slot name="item" item={process(data)} />
 		</li>
 	{/each}
 </ul>
 
 <slot name="footer" />
+```
 
-<!-- App.svelte -->
+```svelte
+<!--- file: App.svelte --->
 <FancyList {items}>
 	<div slot="item" let:item>{item.text}</div>
 	<p slot="footer">Copyright (c) 2019 Svelte Industries</p>

From d511104ee0f77272ffb81b7ff4a3a0528e0e0302 Mon Sep 17 00:00:00 2001
From: adiGuba <frederic.martini@gmail.com>
Date: Wed, 4 Dec 2024 14:23:24 +0100
Subject: [PATCH 260/404] chore: make test more robust (#14550)

---
 .../tests/runtime-runes/samples/inline-expressions/main.svelte  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte b/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
index 38a97415d2..ab48f4d5e6 100644
--- a/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/inline-expressions/main.svelte
@@ -1,6 +1,6 @@
 <p>Without text expression: 7.36</p>
 <p>With text expression: {7.36}</p>
-<p>With text expression and function call: {(7.36).toLocaleString()}</p>
+<p>With text expression and function call: {(7.36).toString()}</p>
 <p>With text expression and property access: {"test".length}</p>
 <h1>Hello {('name').toUpperCase().toLowerCase()}!</h1>
 <p>{"test".length}</p>

From 4e77bdef74e75a8816f09e43cd439d527a9d9e3f Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 4 Dec 2024 08:30:20 -0500
Subject: [PATCH 261/404] fix: respect the unidirectional nature of time
 (#14541)

* fix: respect the unidirectional nature of time

* note to our future selves
---
 .changeset/sixty-tables-fold.md             | 5 +++++
 packages/svelte/src/internal/client/loop.js | 7 +++++--
 2 files changed, 10 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/sixty-tables-fold.md

diff --git a/.changeset/sixty-tables-fold.md b/.changeset/sixty-tables-fold.md
new file mode 100644
index 0000000000..83182344ce
--- /dev/null
+++ b/.changeset/sixty-tables-fold.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: respect the unidirectional nature of time
diff --git a/packages/svelte/src/internal/client/loop.js b/packages/svelte/src/internal/client/loop.js
index d1c73e344f..9c1e972800 100644
--- a/packages/svelte/src/internal/client/loop.js
+++ b/packages/svelte/src/internal/client/loop.js
@@ -4,10 +4,13 @@ import { raf } from './timing.js';
 // TODO move this into timing.js where it probably belongs
 
 /**
- * @param {number} now
  * @returns {void}
  */
-function run_tasks(now) {
+function run_tasks() {
+	// use `raf.now()` instead of the `requestAnimationFrame` callback argument, because
+	// otherwise things can get wonky https://github.com/sveltejs/svelte/pull/14541
+	const now = raf.now();
+
 	raf.tasks.forEach((task) => {
 		if (!task.c(now)) {
 			raf.tasks.delete(task);

From 86ae349bcc0acc613b6f91757ce661a3a33f0855 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 4 Dec 2024 15:32:02 +0100
Subject: [PATCH 262/404] fix: better error messages for invalid HTML trees
 (#14445)

* fix: better error messages for invalid HTML trees

closes #13331

* fix test

* more concise

* tweak

* tweak messages

* adjust tests

* tweak message slightly, so it doesn't sound like the bad element is the one we're currently encountering

* put locations in generated message

* tidy up

* consistency

* fix

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/green-pumpkins-ring.md             |  5 ++
 .../98-reference/.generated/compile-errors.md |  4 +-
 .../.generated/compile-warnings.md            |  4 +-
 .../messages/compile-errors/template.md       |  4 +-
 .../messages/compile-warnings/template.md     |  4 +-
 packages/svelte/src/compiler/errors.js        |  9 +-
 .../2-analyze/visitors/ExpressionTag.js       |  5 +-
 .../2-analyze/visitors/RegularElement.js      | 18 ++--
 .../phases/2-analyze/visitors/Text.js         |  5 +-
 packages/svelte/src/compiler/warnings.js      |  9 +-
 packages/svelte/src/html-tree-validation.js   | 85 ++++++++++++-------
 packages/svelte/src/internal/server/dev.js    | 29 ++++---
 .../invalid-html-ssr-ancestor/_config.js      | 21 +++++
 .../invalid-html-ssr-ancestor/form.svelte     |  1 +
 .../invalid-html-ssr-ancestor/main.svelte     |  9 ++
 .../samples/invalid-html-ssr/_config.js       |  4 +-
 .../invalid-nested-svelte-element/_config.js  |  2 +-
 .../_expected_head.html                       |  2 +-
 .../invalid-node-placement-2/errors.json      |  2 +-
 .../invalid-node-placement-4/errors.json      |  2 +-
 .../invalid-node-placement-5/warnings.json    |  2 +-
 .../invalid-node-placement-6/errors.json      |  2 +-
 .../invalid-node-placement-7/errors.json      |  2 +-
 .../invalid-node-placement-8/errors.json      |  2 +-
 .../invalid-node-placement/errors.json        |  2 +-
 25 files changed, 150 insertions(+), 84 deletions(-)
 create mode 100644 .changeset/green-pumpkins-ring.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/form.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/main.svelte

diff --git a/.changeset/green-pumpkins-ring.md b/.changeset/green-pumpkins-ring.md
new file mode 100644
index 0000000000..20bed8e347
--- /dev/null
+++ b/.changeset/green-pumpkins-ring.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: better error messages for invalid HTML trees
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index e1925324e6..3bd162d8d7 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -487,12 +487,12 @@ A component cannot have a default export
 ### node_invalid_placement
 
 ```
-%thing% is invalid inside `<%parent%>`
+%message%. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.
 ```
 
 HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
 
-- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
+- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
 - `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
 - `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
 
diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index cc948e2547..481959ba3d 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -643,12 +643,12 @@ Svelte 5 components are no longer classes. Instantiate them using `mount` or `hy
 ### node_invalid_placement_ssr
 
 ```
-%thing% is invalid inside `<%parent%>`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a `hydration_mismatch` warning
+%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
 ```
 
 HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
 
-- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
+- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
 - `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
 - `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
 
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index 613d11ae51..9621a6457b 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -190,11 +190,11 @@
 
 ## node_invalid_placement
 
-> %thing% is invalid inside `<%parent%>`
+> %message%. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.
 
 HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
 
-- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
+- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
 - `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
 - `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
 
diff --git a/packages/svelte/messages/compile-warnings/template.md b/packages/svelte/messages/compile-warnings/template.md
index bfa75ac7f0..690681c172 100644
--- a/packages/svelte/messages/compile-warnings/template.md
+++ b/packages/svelte/messages/compile-warnings/template.md
@@ -40,11 +40,11 @@
 
 ## node_invalid_placement_ssr
 
-> %thing% is invalid inside `<%parent%>`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a `hydration_mismatch` warning
+> %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
 
 HTML restricts where certain elements can appear. In case of a violation the browser will 'repair' the HTML in a way that breaks Svelte's assumptions about the structure of your components. Some examples:
 
-- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` for example (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
+- `<p>hello <div>world</div></p>` will result in `<p>hello </p><div>world</div><p></p>` (the `<div>` autoclosed the `<p>` because `<p>` cannot contain block-level elements)
 - `<option><div>option a</div></option>` will result in `<option>option a</option>` (the `<div>` is removed)
 - `<table><tr><td>cell</td></tr></table>` will result in `<table><tbody><tr><td>cell</td></tr></tbody></table>` (a `<tbody>` is auto-inserted)
 
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index a6e4549e2f..901ea1983e 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -1043,14 +1043,13 @@ export function mixed_event_handler_syntaxes(node, name) {
 }
 
 /**
- * %thing% is invalid inside `<%parent%>`
+ * %message%. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.
  * @param {null | number | NodeLike} node
- * @param {string} thing
- * @param {string} parent
+ * @param {string} message
  * @returns {never}
  */
-export function node_invalid_placement(node, thing, parent) {
-	e(node, "node_invalid_placement", `${thing} is invalid inside \`<${parent}>\``);
+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.`);
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
index e0d2710a08..88fe4e6afa 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/ExpressionTag.js
@@ -12,8 +12,9 @@ export function ExpressionTag(node, context) {
 	const in_template = context.path.at(-1)?.type === 'Fragment';
 
 	if (in_template && context.state.parent_element) {
-		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
-			e.node_invalid_placement(node, '`{expression}`', context.state.parent_element);
+		const message = is_tag_valid_with_parent('#text', context.state.parent_element);
+		if (message) {
+			e.node_invalid_placement(node, message);
 		}
 	}
 
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index fa6ca0f6e9..7454ab8103 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -114,15 +114,12 @@ export function RegularElement(node, context) {
 
 			if (!past_parent) {
 				if (ancestor.type === 'RegularElement' && ancestor.name === context.state.parent_element) {
-					if (!is_tag_valid_with_parent(node.name, context.state.parent_element)) {
+					const message = is_tag_valid_with_parent(node.name, context.state.parent_element);
+					if (message) {
 						if (only_warn) {
-							w.node_invalid_placement_ssr(
-								node,
-								`\`<${node.name}>\``,
-								context.state.parent_element
-							);
+							w.node_invalid_placement_ssr(node, message);
 						} else {
-							e.node_invalid_placement(node, `\`<${node.name}>\``, context.state.parent_element);
+							e.node_invalid_placement(node, message);
 						}
 					}
 
@@ -131,11 +128,12 @@ export function RegularElement(node, context) {
 			} else if (ancestor.type === 'RegularElement') {
 				ancestors.push(ancestor.name);
 
-				if (!is_tag_valid_with_ancestor(node.name, ancestors)) {
+				const message = is_tag_valid_with_ancestor(node.name, ancestors);
+				if (message) {
 					if (only_warn) {
-						w.node_invalid_placement_ssr(node, `\`<${node.name}>\``, ancestor.name);
+						w.node_invalid_placement_ssr(node, message);
 					} else {
-						e.node_invalid_placement(node, `\`<${node.name}>\``, ancestor.name);
+						e.node_invalid_placement(node, message);
 					}
 				}
 			} else if (
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
index b60030f638..363a111b7d 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Text.js
@@ -12,8 +12,9 @@ export function Text(node, context) {
 	const in_template = context.path.at(-1)?.type === 'Fragment';
 
 	if (in_template && context.state.parent_element && regex_not_whitespace.test(node.data)) {
-		if (!is_tag_valid_with_parent('#text', context.state.parent_element)) {
-			e.node_invalid_placement(node, 'Text node', context.state.parent_element);
+		const message = is_tag_valid_with_parent('#text', context.state.parent_element);
+		if (message) {
+			e.node_invalid_placement(node, message);
 		}
 	}
 }
diff --git a/packages/svelte/src/compiler/warnings.js b/packages/svelte/src/compiler/warnings.js
index f6ed7de7d5..e193ad0f11 100644
--- a/packages/svelte/src/compiler/warnings.js
+++ b/packages/svelte/src/compiler/warnings.js
@@ -754,13 +754,12 @@ export function event_directive_deprecated(node, name) {
 }
 
 /**
- * %thing% is invalid inside `<%parent%>`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a `hydration_mismatch` warning
+ * %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
  * @param {null | NodeLike} node
- * @param {string} thing
- * @param {string} parent
+ * @param {string} message
  */
-export function node_invalid_placement_ssr(node, thing, parent) {
-	w(node, "node_invalid_placement_ssr", `${thing} is invalid inside \`<${parent}>\`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a \`hydration_mismatch\` warning`);
+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`);
 }
 
 /**
diff --git a/packages/svelte/src/html-tree-validation.js b/packages/svelte/src/html-tree-validation.js
index 0ebf45e166..98e74b638f 100644
--- a/packages/svelte/src/html-tree-validation.js
+++ b/packages/svelte/src/html-tree-validation.js
@@ -135,59 +135,85 @@ const disallowed_children = {
 };
 
 /**
- * Returns false if the tag is not allowed inside the ancestor tag (which is grandparent and above) such that it will result
+ * Returns an error message if the tag is not allowed inside the ancestor tag (which is grandparent and above) such that it will result
  * in the browser repairing the HTML, which will likely result in an error during hydration.
- * @param {string} tag
+ * @param {string} child_tag
  * @param {string[]} ancestors All nodes starting with the parent, up until the ancestor, which means two entries minimum
- * @returns {boolean}
+ * @param {string} [child_loc]
+ * @param {string} [ancestor_loc]
+ * @returns {string | null}
  */
-export function is_tag_valid_with_ancestor(tag, ancestors) {
-	if (tag.includes('-')) return true; // custom elements can be anything
+export function is_tag_valid_with_ancestor(child_tag, ancestors, child_loc, ancestor_loc) {
+	if (child_tag.includes('-')) return null; // custom elements can be anything
 
-	const target = ancestors[ancestors.length - 1];
-	const disallowed = disallowed_children[target];
-	if (!disallowed) return true;
+	const ancestor_tag = ancestors[ancestors.length - 1];
+	const disallowed = disallowed_children[ancestor_tag];
+	if (!disallowed) return null;
 
 	if ('reset_by' in disallowed && disallowed.reset_by) {
 		for (let i = ancestors.length - 2; i >= 0; i--) {
 			const ancestor = ancestors[i];
-			if (ancestor.includes('-')) return true; // custom elements can be anything
+			if (ancestor.includes('-')) return null; // custom elements can be anything
 
 			// A reset means that forbidden descendants are allowed again
 			if (disallowed.reset_by.includes(ancestors[i])) {
-				return true;
+				return null;
 			}
 		}
 	}
 
-	return 'descendant' in disallowed ? !disallowed.descendant.includes(tag) : true;
+	if ('descendant' in disallowed && disallowed.descendant.includes(child_tag)) {
+		const child = child_loc ? `\`<${child_tag}>\` (${child_loc})` : `\`<${child_tag}>\``;
+		const ancestor = ancestor_loc
+			? `\`<${ancestor_tag}>\` (${ancestor_loc})`
+			: `\`<${ancestor_tag}>\``;
+
+		return `${child} cannot be a descendant of ${ancestor}`;
+	}
+
+	return null;
 }
 
 /**
- * Returns false if the tag is not allowed inside the parent tag such that it will result
+ * Returns an error message if the tag is not allowed inside the parent tag such that it will result
  * in the browser repairing the HTML, which will likely result in an error during hydration.
- * @param {string} tag
+ * @param {string} child_tag
  * @param {string} parent_tag
- * @returns {boolean}
+ * @param {string} [child_loc]
+ * @param {string} [parent_loc]
+ * @returns {string | null}
  */
-export function is_tag_valid_with_parent(tag, parent_tag) {
-	if (tag.includes('-') || parent_tag?.includes('-')) return true; // custom elements can be anything
+export function is_tag_valid_with_parent(child_tag, parent_tag, child_loc, parent_loc) {
+	if (child_tag.includes('-') || parent_tag?.includes('-')) return null; // custom elements can be anything
 
 	const disallowed = disallowed_children[parent_tag];
 
+	const child = child_loc ? `\`<${child_tag}>\` (${child_loc})` : `\`<${child_tag}>\``;
+	const parent = parent_loc ? `\`<${parent_tag}>\` (${parent_loc})` : `\`<${parent_tag}>\``;
+
 	if (disallowed) {
-		if ('direct' in disallowed && disallowed.direct.includes(tag)) {
-			return false;
+		if ('direct' in disallowed && disallowed.direct.includes(child_tag)) {
+			return `${child} cannot be a direct child of ${parent}`;
 		}
-		if ('descendant' in disallowed && disallowed.descendant.includes(tag)) {
-			return false;
+
+		if ('descendant' in disallowed && disallowed.descendant.includes(child_tag)) {
+			return `${child} cannot be a child of ${parent}`;
 		}
+
 		if ('only' in disallowed && disallowed.only) {
-			return disallowed.only.includes(tag);
+			if (disallowed.only.includes(child_tag)) {
+				return null;
+			} else {
+				return `${child} cannot be a child of ${parent}. \`<${parent_tag}>\` only allows these children: ${disallowed.only.map((d) => `\`<${d}>\``).join(', ')}`;
+			}
 		}
 	}
 
-	switch (tag) {
+	// These tags are only valid with a few parents that have special child
+	// parsing rules - if we're down here, then none of those matched and
+	// so we allow it only if we don't know what the parent is, as all other
+	// cases are invalid (and we only get into this function if we know the parent).
+	switch (child_tag) {
 		case 'body':
 		case 'caption':
 		case 'col':
@@ -196,18 +222,17 @@ export function is_tag_valid_with_parent(tag, parent_tag) {
 		case 'frame':
 		case 'head':
 		case 'html':
+			return `${child} cannot be a child of ${parent}`;
+		case 'thead':
 		case 'tbody':
-		case 'td':
 		case 'tfoot':
+			return `${child} must be the child of a \`<table>\`, not a ${parent}`;
+		case 'td':
 		case 'th':
-		case 'thead':
+			return `${child} must be the child of a \`<tr>\`, not a ${parent}`;
 		case 'tr':
-			// These tags are only valid with a few parents that have special child
-			// parsing rules - if we're down here, then none of those matched and
-			// so we allow it only if we don't know what the parent is, as all other
-			// cases are invalid (and we only get into this function if we know the parent).
-			return false;
+			return `\`<tr>\` must be the child of a \`<thead>\`, \`<tbody>\`, or \`<tfoot>\`, not a ${parent}`;
 	}
 
-	return true;
+	return null;
 }
diff --git a/packages/svelte/src/internal/server/dev.js b/packages/svelte/src/internal/server/dev.js
index 145b37479b..ecf4e67429 100644
--- a/packages/svelte/src/internal/server/dev.js
+++ b/packages/svelte/src/internal/server/dev.js
@@ -34,12 +34,11 @@ function stringify(element) {
 
 /**
  * @param {Payload} payload
- * @param {Element} parent
- * @param {Element} child
+ * @param {string} message
  */
-function print_error(payload, parent, child) {
-	var message =
-		`node_invalid_placement_ssr: ${stringify(parent)} cannot contain ${stringify(child)}\n\n` +
+function print_error(payload, message) {
+	message =
+		`node_invalid_placement_ssr: ${message}\n\n` +
 		'This can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.';
 
 	if ((seen ??= new Set()).has(message)) return;
@@ -72,15 +71,23 @@ export function push_element(payload, tag, line, column) {
 		var ancestor = parent.parent;
 		var ancestors = [parent.tag];
 
-		if (!is_tag_valid_with_parent(tag, parent.tag)) {
-			print_error(payload, parent, child);
-		}
+		const child_loc = filename ? `${filename}:${line}:${column}` : undefined;
+		const parent_loc = parent.filename
+			? `${parent.filename}:${parent.line}:${parent.column}`
+			: undefined;
+
+		const message = is_tag_valid_with_parent(tag, parent.tag, child_loc, parent_loc);
+		if (message) print_error(payload, message);
 
 		while (ancestor != null) {
 			ancestors.push(ancestor.tag);
-			if (!is_tag_valid_with_ancestor(tag, ancestors)) {
-				print_error(payload, ancestor, child);
-			}
+			const ancestor_loc = ancestor.filename
+				? `${ancestor.filename}:${ancestor.line}:${ancestor.column}`
+				: undefined;
+
+			const message = is_tag_valid_with_ancestor(tag, ancestors, child_loc, ancestor_loc);
+			if (message) print_error(payload, message);
+
 			ancestor = ancestor.parent;
 		}
 	}
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/_config.js b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/_config.js
new file mode 100644
index 0000000000..4c45b26179
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/_config.js
@@ -0,0 +1,21 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	html: `<form><div></div></form>`,
+
+	recover: true,
+
+	mode: ['hydrate'],
+
+	errors: [
+		'node_invalid_placement_ssr: `<form>` (form.svelte:1:0) cannot be a descendant of `<form>` (main.svelte:5:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
+	],
+
+	warnings: [
+		'Hydration failed because the initial UI does not match what was rendered on the server'
+	]
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/form.svelte b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/form.svelte
new file mode 100644
index 0000000000..cddb6e3794
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/form.svelte
@@ -0,0 +1 @@
+<form></form>
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/main.svelte b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/main.svelte
new file mode 100644
index 0000000000..8aea343322
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr-ancestor/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import Form from './form.svelte';
+</script>
+
+<form>
+	<div>
+		<Form />
+	</div>
+</form>
diff --git a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
index d815d10fc7..bc4d709b19 100644
--- a/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/invalid-html-ssr/_config.js
@@ -12,8 +12,8 @@ export default test({
 	mode: ['hydrate'],
 
 	errors: [
-		'node_invalid_placement_ssr: `<p>` (main.svelte:6:0) cannot contain `<h1>` (h1.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.',
-		'node_invalid_placement_ssr: `<form>` (main.svelte:9:0) cannot contain `<form>` (form.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
+		'node_invalid_placement_ssr: `<h1>` (h1.svelte:1:0) cannot be a child of `<p>` (main.svelte:6:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.',
+		'node_invalid_placement_ssr: `<form>` (form.svelte:1:0) cannot be a child of `<form>` (main.svelte:9:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
 	],
 
 	warnings: [
diff --git a/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_config.js b/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_config.js
index 9b2688711d..71edff6a68 100644
--- a/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_config.js
+++ b/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_config.js
@@ -6,6 +6,6 @@ export default test({
 	},
 
 	errors: [
-		'node_invalid_placement_ssr: `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:1:0) cannot contain `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:2:1)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
+		'node_invalid_placement_ssr: `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:2:1) cannot be a child of `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.'
 	]
 });
diff --git a/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_expected_head.html b/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_expected_head.html
index 27c37f693b..6d9ea9de5f 100644
--- a/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_expected_head.html
+++ b/packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/_expected_head.html
@@ -1 +1 @@
-<script>console.error("node_invalid_placement_ssr: `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:1:0) cannot contain `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:2:1)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.")</script>
\ No newline at end of file
+<script>console.error("node_invalid_placement_ssr: `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:2:1) cannot be a child of `<p>` (packages/svelte/tests/server-side-rendering/samples/invalid-nested-svelte-element/main.svelte:1:0)\n\nThis can cause content to shift around as the browser repairs the HTML, and will likely result in a `hydration_mismatch` warning.")</script>
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-2/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-2/errors.json
index 3d97865823..abbded296a 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-2/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-2/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "`<div>` is invalid inside `<p>`",
+		"message": "`<div>` cannot be a descendant of `<p>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 4,
 			"column": 3
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-4/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-4/errors.json
index 4d637aed80..727bf6c258 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-4/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-4/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "`<form>` is invalid inside `<form>`",
+		"message": "`<form>` cannot be a descendant of `<form>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 4,
 			"column": 3
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-5/warnings.json b/packages/svelte/tests/validator/samples/invalid-node-placement-5/warnings.json
index e85050beb7..59c73c4e73 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-5/warnings.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-5/warnings.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement_ssr",
-		"message": "`<form>` is invalid inside `<form>`. When rendering this component on the server, the resulting HTML will be modified by the browser, likely resulting in a `hydration_mismatch` warning",
+		"message": "`<form>` cannot be a child of `<form>`. 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",
 		"start": {
 			"line": 4,
 			"column": 3
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-6/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-6/errors.json
index 63fc9c517e..4849717e14 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-6/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-6/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "`<dt>` is invalid inside `<dd>`",
+		"message": "`<dt>` cannot be a descendant of `<dd>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 16,
 			"column": 3
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-7/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-7/errors.json
index edfc158c9d..a1422c001a 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-7/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-7/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "`<tbody>` is invalid inside `<div>`",
+		"message": "`<tbody>` must be the child of a `<table>`, not a `<div>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 8,
 			"column": 1
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
index 1127a76336..d75d5d4105 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement-8/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "Text node is invalid inside `<tbody>`",
+		"message": "`<#text>` cannot be a child of `<tbody>`. `<tbody>` only allows these children: `<tr>`, `<style>`, `<script>`, `<template>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 3,
 			"column": 8
diff --git a/packages/svelte/tests/validator/samples/invalid-node-placement/errors.json b/packages/svelte/tests/validator/samples/invalid-node-placement/errors.json
index b9bdad5e72..3d4e728496 100644
--- a/packages/svelte/tests/validator/samples/invalid-node-placement/errors.json
+++ b/packages/svelte/tests/validator/samples/invalid-node-placement/errors.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "node_invalid_placement",
-		"message": "`<a>` is invalid inside `<a>`",
+		"message": "`<a>` cannot be a descendant of `<a>`. The browser will 'repair' the HTML (by moving, removing, or inserting elements) which breaks Svelte's assumptions about the structure of your components.",
 		"start": {
 			"line": 4,
 			"column": 6

From c55af4aa83dc2e440cb1a93616a1eab2061b7b4f Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 4 Dec 2024 09:46:35 -0500
Subject: [PATCH 263/404] Version Packages (#14548)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/green-pumpkins-ring.md |  5 -----
 .changeset/itchy-cooks-yawn.md    |  5 -----
 .changeset/sixty-tables-fold.md   |  5 -----
 packages/svelte/CHANGELOG.md      | 10 ++++++++++
 packages/svelte/package.json      |  2 +-
 packages/svelte/src/version.js    |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/green-pumpkins-ring.md
 delete mode 100644 .changeset/itchy-cooks-yawn.md
 delete mode 100644 .changeset/sixty-tables-fold.md

diff --git a/.changeset/green-pumpkins-ring.md b/.changeset/green-pumpkins-ring.md
deleted file mode 100644
index 20bed8e347..0000000000
--- a/.changeset/green-pumpkins-ring.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: better error messages for invalid HTML trees
diff --git a/.changeset/itchy-cooks-yawn.md b/.changeset/itchy-cooks-yawn.md
deleted file mode 100644
index 2b23ca5d93..0000000000
--- a/.changeset/itchy-cooks-yawn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove spreaded event handlers when they become nullish
diff --git a/.changeset/sixty-tables-fold.md b/.changeset/sixty-tables-fold.md
deleted file mode 100644
index 83182344ce..0000000000
--- a/.changeset/sixty-tables-fold.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: respect the unidirectional nature of time
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 4024b6ec77..40624e3498 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.5.4
+
+### Patch Changes
+
+- fix: better error messages for invalid HTML trees ([#14445](https://github.com/sveltejs/svelte/pull/14445))
+
+- fix: remove spreaded event handlers when they become nullish ([#14546](https://github.com/sveltejs/svelte/pull/14546))
+
+- fix: respect the unidirectional nature of time ([#14541](https://github.com/sveltejs/svelte/pull/14541))
+
 ## 5.5.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 3c925c30f6..b79afce440 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.5.3",
+  "version": "5.5.4",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index a9ec7f8cf2..85e9e3fd85 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.5.3';
+export const VERSION = '5.5.4';
 export const PUBLIC_VERSION = '5';

From a57e747cbb195636e6a65bae77d7d1e37f4ceb04 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 4 Dec 2024 15:47:01 +0100
Subject: [PATCH 264/404] feat: default values for form elements (#14289)

* tests

* typings

* implement for defaultValue/defaultChecked on inputs

* docs (draft)

* selected

* fix test

* remove

* tweak

* changeset

* untrack reads, they could be inside an effect

* Apply suggestions from code review

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

* handle select reset case

* handle reset case specifically: use different props/queries in that case

* enhance test

* fix

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/tidy-zebras-begin.md               |   5 +
 .../docs/03-template-syntax/11-bind.md        |  43 +++-
 packages/svelte/elements.d.ts                 |   8 +
 .../client/visitors/RegularElement.js         |  38 ++--
 .../server/visitors/shared/element.js         |   3 +-
 .../client/dom/elements/attributes.js         |  19 ++
 .../client/dom/elements/bindings/input.js     |  43 ++--
 .../client/dom/elements/bindings/select.js    |  10 +-
 .../client/dom/elements/bindings/shared.js    |   8 +-
 packages/svelte/src/internal/client/index.js  |   3 +-
 packages/svelte/src/utils.js                  |   6 +-
 .../samples/form-default-value/_config.js     | 209 ++++++++++++++++++
 .../samples/form-default-value/main.svelte    | 156 +++++++++++++
 13 files changed, 509 insertions(+), 42 deletions(-)
 create mode 100644 .changeset/tidy-zebras-begin.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte

diff --git a/.changeset/tidy-zebras-begin.md b/.changeset/tidy-zebras-begin.md
new file mode 100644
index 0000000000..cefbf2acfd
--- /dev/null
+++ b/.changeset/tidy-zebras-begin.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: support `defaultValue/defaultChecked` for inputs
diff --git a/documentation/docs/03-template-syntax/11-bind.md b/documentation/docs/03-template-syntax/11-bind.md
index 7dd03a6b04..975135f824 100644
--- a/documentation/docs/03-template-syntax/11-bind.md
+++ b/documentation/docs/03-template-syntax/11-bind.md
@@ -53,6 +53,22 @@ In the case of a numeric input (`type="number"` or `type="range"`), the value wi
 
 If the input is empty or invalid (in the case of `type="number"`), the value is `undefined`.
 
+If an `<input>` has a `defaultValue` and is part of a form, it will revert to that value instead of the empty string when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
+
+```svelte
+<script>
+	let value = $state('');
+</script>
+
+<form>
+	<input bind:value defaultValue="not the empty string">
+	<input type="reset" value="Reset">
+</form>
+```
+
+> [!NOTE]
+> Use reset buttons sparingly, and ensure that users won't accidentally click them while trying to submit the form.
+
 ## `<input bind:checked>`
 
 Checkbox and radio inputs can be bound with `bind:checked`:
@@ -64,16 +80,29 @@ Checkbox and radio inputs can be bound with `bind:checked`:
 </label>
 ```
 
+If an `<input>` has a `defaultChecked` attribute and is part of a form, it will revert to that value instead of `false` when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
+
+```svelte
+<script>
+	let checked = $state(true);
+</script>
+
+<form>
+	<input type="checkbox" bind:checked defaultChecked={true}>
+	<input type="reset" value="Reset">
+</form>
+```
+
 ## `<input bind:group>`
 
 Inputs that work together can use `bind:group`.
 
 ```svelte
 <script>
-	let tortilla = 'Plain';
+	let tortilla = $state('Plain');
 
 	/** @type {Array<string>} */
-	let fillings = [];
+	let fillings = $state([]);
 </script>
 
 <!-- grouped radio inputs are mutually exclusive -->
@@ -146,6 +175,16 @@ When the value of an `<option>` matches its text content, the attribute can be o
 </select>
 ```
 
+You can give the `<select>` a default value by adding a `selected` attribute to the`<option>` (or options, in the case of `<select multiple>`) that should be initially selected. If the `<select>` is part of a form, it will revert to that selection when the form is reset. Note that for the initial render the value of the binding takes precedence if it's not `undefined`.
+
+```svelte
+<select bind:value={selected}>
+	<option value={a}>a</option>
+	<option value={b} selected>b</option>
+	<option value={c}>c</option>
+</select>
+```
+
 ## `<audio>`
 
 `<audio>` elements have their own set of bindings — five two-way ones...
diff --git a/packages/svelte/elements.d.ts b/packages/svelte/elements.d.ts
index 035fa49c31..8800b65172 100644
--- a/packages/svelte/elements.d.ts
+++ b/packages/svelte/elements.d.ts
@@ -1103,6 +1103,11 @@ export interface HTMLInputAttributes extends HTMLAttributes<HTMLInputElement> {
 	step?: number | string | undefined | null;
 	type?: HTMLInputTypeAttribute | undefined | null;
 	value?: any;
+	// needs both casing variants because language tools does lowercase names of non-shorthand attributes
+	defaultValue?: any;
+	defaultvalue?: any;
+	defaultChecked?: any;
+	defaultchecked?: any;
 	width?: number | string | undefined | null;
 	webkitdirectory?: boolean | undefined | null;
 
@@ -1384,6 +1389,9 @@ export interface HTMLTextareaAttributes extends HTMLAttributes<HTMLTextAreaEleme
 	required?: boolean | undefined | null;
 	rows?: number | undefined | null;
 	value?: string | string[] | number | undefined | null;
+	// needs both casing variants because language tools does lowercase names of non-shorthand attributes
+	defaultValue?: string | string[] | number | undefined | null;
+	defaultvalue?: string | string[] | number | undefined | null;
 	wrap?: 'hard' | 'soft' | undefined | null;
 
 	'on:change'?: ChangeEventHandler<HTMLTextAreaElement> | undefined | null;
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 85df92e8bf..56f7b6d6f0 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
@@ -172,20 +172,28 @@ export function RegularElement(node, context) {
 		}
 	}
 
-	if (
-		node.name === 'input' &&
-		(has_spread ||
-			bindings.has('value') ||
-			bindings.has('checked') ||
-			bindings.has('group') ||
-			attributes.some(
-				(attribute) =>
-					attribute.type === 'Attribute' &&
-					(attribute.name === 'value' || attribute.name === 'checked') &&
-					!is_text_attribute(attribute)
-			))
-	) {
-		context.state.init.push(b.stmt(b.call('$.remove_input_defaults', context.state.node)));
+	if (node.name === 'input') {
+		const has_value_attribute = attributes.some(
+			(attribute) =>
+				attribute.type === 'Attribute' &&
+				(attribute.name === 'value' || attribute.name === 'checked') &&
+				!is_text_attribute(attribute)
+		);
+		const has_default_value_attribute = attributes.some(
+			(attribute) =>
+				attribute.type === 'Attribute' &&
+				(attribute.name === 'defaultValue' || attribute.name === 'defaultChecked')
+		);
+		if (
+			!has_default_value_attribute &&
+			(has_spread ||
+				bindings.has('value') ||
+				bindings.has('checked') ||
+				bindings.has('group') ||
+				(!bindings.has('group') && has_value_attribute))
+		) {
+			context.state.init.push(b.stmt(b.call('$.remove_input_defaults', context.state.node)));
+		}
 	}
 
 	if (node.name === 'textarea') {
@@ -555,6 +563,8 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 		update = b.stmt(b.call('$.set_value', node_id, value));
 	} else if (name === 'checked') {
 		update = b.stmt(b.call('$.set_checked', node_id, value));
+	} else if (name === 'selected') {
+		update = b.stmt(b.call('$.set_selected', node_id, value));
 	} else if (is_dom_property(name)) {
 		update = b.stmt(b.assignment('=', b.member(node_id, name), value));
 	} else {
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 2ab5d9b9fd..434447727b 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
@@ -82,7 +82,8 @@ export function build_element_attributes(node, context) {
 				) {
 					events_to_capture.add(attribute.name);
 				}
-			} else {
+				// the defaultValue/defaultChecked properties don't exist as attributes
+			} else if (attribute.name !== 'defaultValue' && attribute.name !== 'defaultChecked') {
 				if (attribute.name === 'class') {
 					class_index = attributes.length;
 				} else if (attribute.name === 'style') {
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index ced4c4cf25..b4dd92a9ab 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -84,6 +84,25 @@ export function set_checked(element, checked) {
 	element.checked = checked;
 }
 
+/**
+ * Sets the `selected` attribute on an `option` element.
+ * Not set through the property because that doesn't reflect to the DOM,
+ * which means it wouldn't be taken into account when a form is reset.
+ * @param {HTMLOptionElement} element
+ * @param {boolean} selected
+ */
+export function set_selected(element, selected) {
+	if (selected) {
+		// The selected option could've changed via user selection, and
+		// setting the value without this check would set it back.
+		if (!element.hasAttribute('selected')) {
+			element.setAttribute('selected', '');
+		}
+	} else {
+		element.removeAttribute('selected');
+	}
+}
+
 /**
  * @param {Element} element
  * @param {string} attribute
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 1cbe2a731f..810dcb0862 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/input.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/input.js
@@ -5,7 +5,7 @@ import * as e from '../../../errors.js';
 import { is } from '../../../proxy.js';
 import { queue_micro_task } from '../../task.js';
 import { hydrating } from '../../hydration.js';
-import { is_runes } from '../../../runtime.js';
+import { is_runes, untrack } from '../../../runtime.js';
 
 /**
  * @param {HTMLInputElement} input
@@ -16,24 +16,36 @@ import { is_runes } from '../../../runtime.js';
 export function bind_value(input, get, set = get) {
 	var runes = is_runes();
 
-	listen_to_event_and_reset_event(input, 'input', () => {
+	listen_to_event_and_reset_event(input, 'input', (is_reset) => {
 		if (DEV && input.type === 'checkbox') {
 			// TODO should this happen in prod too?
 			e.bind_invalid_checkbox_value();
 		}
 
-		/** @type {unknown} */
-		var value = is_numberlike_input(input) ? to_number(input.value) : input.value;
+		/** @type {any} */
+		var value = is_reset ? input.defaultValue : input.value;
+		value = is_numberlike_input(input) ? to_number(value) : value;
 		set(value);
 
 		// 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())) {
-			// @ts-expect-error the value is coerced on assignment
+			// the value is coerced on assignment
 			input.value = value ?? '';
 		}
 	});
 
+	if (
+		// If we are hydrating and the value has since changed,
+		// then use the updated value from the input instead.
+		(hydrating && input.defaultValue !== input.value) ||
+		// If defaultValue is set, then value == defaultValue
+		// TODO Svelte 6: remove input.value check and set to empty string?
+		(untrack(get) == null && input.value)
+	) {
+		set(is_numberlike_input(input) ? to_number(input.value) : input.value);
+	}
+
 	render_effect(() => {
 		if (DEV && input.type === 'checkbox') {
 			// TODO should this happen in prod too?
@@ -42,13 +54,6 @@ export function bind_value(input, get, set = get) {
 
 		var value = get();
 
-		// If we are hydrating and the value has since changed, then use the update value
-		// from the input instead.
-		if (hydrating && input.defaultValue !== input.value) {
-			set(is_numberlike_input(input) ? to_number(input.value) : input.value);
-			return;
-		}
-
 		if (is_numberlike_input(input) && value === to_number(input.value)) {
 			// handles 0 vs 00 case (see https://github.com/sveltejs/svelte/issues/9959)
 			return;
@@ -175,13 +180,19 @@ export function bind_group(inputs, group_index, input, get, set = get) {
  * @returns {void}
  */
 export function bind_checked(input, get, set = get) {
-	listen_to_event_and_reset_event(input, 'change', () => {
-		var value = input.checked;
+	listen_to_event_and_reset_event(input, 'change', (is_reset) => {
+		var value = is_reset ? input.defaultChecked : input.checked;
 		set(value);
 	});
 
-	if (get() == undefined) {
-		set(false);
+	if (
+		// If we are hydrating and the value has since changed,
+		// then use the update value from the input instead.
+		(hydrating && input.defaultChecked !== input.checked) ||
+		// If defaultChecked is set, then checked == defaultChecked
+		untrack(get) == null
+	) {
+		set(input.checked);
 	}
 
 	render_effect(() => {
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/select.js b/packages/svelte/src/internal/client/dom/elements/bindings/select.js
index 4d3dbff812..32cd160de2 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/select.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/select.js
@@ -80,15 +80,19 @@ export function init_select(select, get_value) {
 export function bind_select_value(select, get, set = get) {
 	var mounting = true;
 
-	listen_to_event_and_reset_event(select, 'change', () => {
+	listen_to_event_and_reset_event(select, 'change', (is_reset) => {
+		var query = is_reset ? '[selected]' : ':checked';
 		/** @type {unknown} */
 		var value;
 
 		if (select.multiple) {
-			value = [].map.call(select.querySelectorAll(':checked'), get_option_value);
+			value = [].map.call(select.querySelectorAll(query), get_option_value);
 		} else {
 			/** @type {HTMLOptionElement | null} */
-			var selected_option = select.querySelector(':checked');
+			var selected_option =
+				select.querySelector(query) ??
+				// will fall back to first non-disabled option if no option is selected
+				select.querySelector('option:not([disabled])');
 			value = selected_option && get_option_value(selected_option);
 		}
 
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/shared.js b/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
index 832b7f45e5..aa083776a5 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/shared.js
@@ -53,8 +53,8 @@ export function without_reactive_context(fn) {
  * to notify all bindings when the form is reset
  * @param {HTMLElement} element
  * @param {string} event
- * @param {() => void} handler
- * @param {() => void} [on_reset]
+ * @param {(is_reset?: true) => void} handler
+ * @param {(is_reset?: true) => void} [on_reset]
  */
 export function listen_to_event_and_reset_event(element, event, handler, on_reset = handler) {
 	element.addEventListener(event, () => without_reactive_context(handler));
@@ -65,11 +65,11 @@ export function listen_to_event_and_reset_event(element, event, handler, on_rese
 		// @ts-expect-error
 		element.__on_r = () => {
 			prev();
-			on_reset();
+			on_reset(true);
 		};
 	} else {
 		// @ts-expect-error
-		element.__on_r = on_reset;
+		element.__on_r = () => on_reset(true);
 	}
 
 	add_form_reset_listener();
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index 6fae2893e6..d514dd3de1 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -34,7 +34,8 @@ export {
 	set_xlink_attribute,
 	handle_lazy_img,
 	set_value,
-	set_checked
+	set_checked,
+	set_selected
 } from './dom/elements/attributes.js';
 export { set_class, set_svg_class, set_mathml_class, toggle_class } from './dom/elements/class.js';
 export { apply, event, delegate, replay_events } from './dom/elements/events.js';
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index 919660fd6a..75171c1786 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -193,6 +193,8 @@ const ATTRIBUTE_ALIASES = {
 	nomodule: 'noModule',
 	playsinline: 'playsInline',
 	readonly: 'readOnly',
+	defaultvalue: 'defaultValue',
+	defaultchecked: 'defaultChecked',
 	srcobject: 'srcObject'
 };
 
@@ -214,6 +216,8 @@ const DOM_PROPERTIES = [
 	'value',
 	'inert',
 	'volume',
+	'defaultValue',
+	'defaultChecked',
 	'srcObject'
 ];
 
@@ -224,7 +228,7 @@ export function is_dom_property(name) {
 	return DOM_PROPERTIES.includes(name);
 }
 
-const NON_STATIC_PROPERTIES = ['autofocus', 'muted'];
+const NON_STATIC_PROPERTIES = ['autofocus', 'muted', 'defaultValue', 'defaultChecked'];
 
 /**
  * Returns `true` if the given attribute cannot be set through the template
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
new file mode 100644
index 0000000000..7c31b99825
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value/_config.js
@@ -0,0 +1,209 @@
+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] = target.querySelectorAll('div');
+		const [test6, test7, test8, test9] = target.querySelectorAll('select');
+		const [
+			test1_span,
+			test2_span,
+			test3_span,
+			test4_span,
+			test5_span,
+			test6_span,
+			test7_span,
+			test8_span,
+			test9_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(() => {
+				console.log('-------------');
+				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', 'y');
+			assert.htmlEqual(test2_span.innerHTML, 'y y y y');
+
+			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>} */
+			const inputs = test3.querySelectorAll('input');
+			check_inputs(inputs, 'checked', true);
+			assert.htmlEqual(test3_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');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', true);
+				assert.htmlEqual(test3_span.innerHTML, 'true true');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLInputElement>} */
+			const inputs = test4.querySelectorAll('input');
+			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');
+
+			after_reset.push(() => {
+				check_inputs(inputs, 'checked', false);
+				assert.htmlEqual(test5_span.innerHTML, 'false');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test6.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, true, false]);
+			assert.htmlEqual(test6_span.innerHTML, 'b');
+
+			select_option(options[2]);
+			flushSync();
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test6_span.innerHTML, 'c');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test6_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test7.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, true, false]);
+			assert.htmlEqual(test7_span.innerHTML, 'b');
+
+			select_option(options[2]);
+			flushSync();
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test7_span.innerHTML, 'c');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test7_span.innerHTML, 'b');
+			});
+		}
+
+		{
+			/** @type {NodeListOf<HTMLOptionElement>} */
+			const options = test8.querySelectorAll('option');
+			check_inputs(options, 'selected', [false, false, true]);
+			assert.htmlEqual(test8_span.innerHTML, 'c');
+
+			select_option(options[0]);
+			flushSync();
+			check_inputs(options, 'selected', [true, false, false]);
+			assert.htmlEqual(test8_span.innerHTML, 'a');
+
+			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, false, true]);
+			assert.htmlEqual(test9_span.innerHTML, 'c');
+
+			select_option(options[0]);
+			flushSync();
+			check_inputs(options, 'selected', [true, false, false]);
+			assert.htmlEqual(test9_span.innerHTML, 'a');
+
+			after_reset.push(() => {
+				check_inputs(options, 'selected', [false, true, false]);
+				assert.htmlEqual(test9_span.innerHTML, 'b');
+			});
+		}
+
+		reset.click();
+		await Promise.resolve();
+		flushSync();
+		after_reset.forEach((fn) => fn());
+	}
+});
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
new file mode 100644
index 0000000000..d2b864e7ec
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/form-default-value/main.svelte
@@ -0,0 +1,156 @@
+<script>
+	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('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 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 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} />
+		<input {defaultValue} value={value2} />
+		<input defaultValue="x" bind:value={value3} />
+		<input defaultValue="x" value={value4} />
+		<textarea {defaultValue} value={value5}></textarea>
+		<textarea {defaultValue} bind:value={value6}></textarea>
+		<textarea defaultValue="x" value={value7}></textarea>
+		<textarea defaultValue="x" bind:value={value8}></textarea>
+	</div>
+
+	<!-- defaultValue=x, value=y -->
+	<div class="test-2">
+		<input {defaultValue} bind:value={value9} />
+		<input {defaultValue} value={value10} />
+		<input defaultValue="x" value={value11} />
+		<input defaultValue="x" bind:value={value12} />
+		<textarea {defaultValue} value={value13}></textarea>
+		<textarea {defaultValue} bind:value={value14}></textarea>
+		<textarea defaultValue="x" value={value15}></textarea>
+		<textarea defaultValue="x" bind:value={value16}></textarea>
+	</div>
+
+	<p>Input checked</p>
+	<!-- defaultChecked=true, checked=undefined -->
+	<div class="test-3">
+		<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">
+		<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=false, checked=true -->
+	<div class="test-5">
+		<input type="checkbox" defaultChecked={false} checked={checked9} />
+		<input type="checkbox" defaultChecked={false} bind:checked={checked10} />
+	</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>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>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>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>
+
+	<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">{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>
+</p>

From 350811ed8c02578610c74a37ae71f30ba90301af Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 4 Dec 2024 09:59:57 -0500
Subject: [PATCH 265/404] docs: note when defaultValue support was added
 (#14553)

---
 documentation/docs/03-template-syntax/11-bind.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/documentation/docs/03-template-syntax/11-bind.md b/documentation/docs/03-template-syntax/11-bind.md
index 975135f824..fe3cf727e2 100644
--- a/documentation/docs/03-template-syntax/11-bind.md
+++ b/documentation/docs/03-template-syntax/11-bind.md
@@ -53,7 +53,7 @@ In the case of a numeric input (`type="number"` or `type="range"`), the value wi
 
 If the input is empty or invalid (in the case of `type="number"`), the value is `undefined`.
 
-If an `<input>` has a `defaultValue` and is part of a form, it will revert to that value instead of the empty string when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
+Since 5.6.0, if an `<input>` has a `defaultValue` and is part of a form, it will revert to that value instead of the empty string when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
 
 ```svelte
 <script>
@@ -80,7 +80,7 @@ Checkbox and radio inputs can be bound with `bind:checked`:
 </label>
 ```
 
-If an `<input>` has a `defaultChecked` attribute and is part of a form, it will revert to that value instead of `false` when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
+Since 5.6.0, if an `<input>` has a `defaultChecked` attribute and is part of a form, it will revert to that value instead of `false` when the form is reset. Note that for the initial render the value of the binding takes precedence unless it is `null` or `undefined`.
 
 ```svelte
 <script>

From c0746e0e735a4fbb15818ad4eb840b11ee09cdc6 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 4 Dec 2024 10:01:48 -0500
Subject: [PATCH 266/404] Version Packages (#14552)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/tidy-zebras-begin.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/tidy-zebras-begin.md

diff --git a/.changeset/tidy-zebras-begin.md b/.changeset/tidy-zebras-begin.md
deleted file mode 100644
index cefbf2acfd..0000000000
--- a/.changeset/tidy-zebras-begin.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: support `defaultValue/defaultChecked` for inputs
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 40624e3498..2f455307ad 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.6.0
+
+### Minor Changes
+
+- feat: support `defaultValue/defaultChecked` for inputs ([#14289](https://github.com/sveltejs/svelte/pull/14289))
+
 ## 5.5.4
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index b79afce440..011b0ba5b5 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.5.4",
+  "version": "5.6.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 85e9e3fd85..65e64d4963 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.5.4';
+export const VERSION = '5.6.0';
 export const PUBLIC_VERSION = '5';

From a151ae18042af67a8dc480011b46428d760225e6 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 4 Dec 2024 17:40:52 +0100
Subject: [PATCH 267/404] fix: handle static form values in combination with
 default values (#14555)

When the `value` or `checked` attribute of an input or the contents of a textarea were static, setting the `defaulValue/defaultChecked` property caused the latter to take precedence over the former. This is due to how we transform the code: If the value is static, we put it onto
---
 .changeset/blue-fans-greet.md                 |  5 +++
 .../client/visitors/RegularElement.js         | 31 +++++++++++++++++--
 .../client/dom/elements/attributes.js         | 22 +++++++++++++
 packages/svelte/src/internal/client/index.js  |  4 ++-
 .../samples/form-default-value/_config.js     | 16 +++++++++-
 .../samples/form-default-value/main.svelte    |  7 +++++
 6 files changed, 81 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/blue-fans-greet.md

diff --git a/.changeset/blue-fans-greet.md b/.changeset/blue-fans-greet.md
new file mode 100644
index 0000000000..747f534d22
--- /dev/null
+++ b/.changeset/blue-fans-greet.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: handle static form values in combination with default values
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 56f7b6d6f0..3c0be589c3 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
@@ -291,7 +291,7 @@ export function RegularElement(node, context) {
 
 			const is = is_custom_element
 				? build_custom_element_attribute_update_assignment(node_id, attribute, context)
-				: build_element_attribute_update_assignment(node, node_id, attribute, context);
+				: build_element_attribute_update_assignment(node, node_id, attribute, attributes, context);
 			if (is) is_attributes_reactive = true;
 		}
 	}
@@ -519,10 +519,17 @@ function setup_select_synchronization(value_binding, context) {
  * @param {AST.RegularElement} element
  * @param {Identifier} node_id
  * @param {AST.Attribute} attribute
+ * @param {Array<AST.Attribute | AST.SpreadAttribute>} attributes
  * @param {ComponentContext} context
  * @returns {boolean}
  */
-function build_element_attribute_update_assignment(element, node_id, attribute, context) {
+function build_element_attribute_update_assignment(
+	element,
+	node_id,
+	attribute,
+	attributes,
+	context
+) {
 	const state = context.state;
 	const name = get_attribute_name(element, attribute);
 	const is_svg = context.state.metadata.namespace === 'svg' || element.name === 'svg';
@@ -565,6 +572,26 @@ function build_element_attribute_update_assignment(element, node_id, attribute,
 		update = b.stmt(b.call('$.set_checked', node_id, value));
 	} else if (name === 'selected') {
 		update = b.stmt(b.call('$.set_selected', node_id, value));
+	} else if (
+		// If we would just set the defaultValue property, it would override the value property,
+		// because it is set in the template which implicitly means it's also setting the default value,
+		// and if one updates the default value while the input is pristine it will also update the
+		// current value, which is not what we want, which is why we need to do some extra work.
+		name === 'defaultValue' &&
+		(attributes.some(
+			(attr) => attr.type === 'Attribute' && attr.name === 'value' && is_text_attribute(attr)
+		) ||
+			(element.name === 'textarea' && element.fragment.nodes.length > 0))
+	) {
+		update = b.stmt(b.call('$.set_default_value', node_id, value));
+	} else if (
+		// See defaultValue comment
+		name === 'defaultChecked' &&
+		attributes.some(
+			(attr) => attr.type === 'Attribute' && attr.name === 'checked' && attr.value === true
+		)
+	) {
+		update = b.stmt(b.call('$.set_default_checked', node_id, value));
 	} else if (is_dom_property(name)) {
 		update = b.stmt(b.assignment('=', b.member(node_id, name), value));
 	} else {
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index b4dd92a9ab..2229c1a361 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -103,6 +103,28 @@ export function set_selected(element, selected) {
 	}
 }
 
+/**
+ * Applies the default checked property without influencing the current checked property.
+ * @param {HTMLInputElement} element
+ * @param {boolean} checked
+ */
+export function set_default_checked(element, checked) {
+	const existing_value = element.checked;
+	element.defaultChecked = checked;
+	element.checked = existing_value;
+}
+
+/**
+ * Applies the default value property without influencing the current value property.
+ * @param {HTMLInputElement | HTMLTextAreaElement} element
+ * @param {string} value
+ */
+export function set_default_value(element, value) {
+	const existing_value = element.value;
+	element.defaultValue = value;
+	element.value = existing_value;
+}
+
 /**
  * @param {Element} element
  * @param {string} attribute
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index d514dd3de1..b706e52a53 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -35,7 +35,9 @@ export {
 	handle_lazy_img,
 	set_value,
 	set_checked,
-	set_selected
+	set_selected,
+	set_default_checked,
+	set_default_value
 } from './dom/elements/attributes.js';
 export { set_class, set_svg_class, set_mathml_class, toggle_class } from './dom/elements/class.js';
 export { apply, event, delegate, replay_events } from './dom/elements/events.js';
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 7c31b99825..3ae8b223be 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,7 +37,7 @@ export default test({
 		const after_reset = [];
 
 		const reset = /** @type {HTMLInputElement} */ (target.querySelector('input[type=reset]'));
-		const [test1, test2, test3, test4, test5] = target.querySelectorAll('div');
+		const [test1, test2, test3, test4, test5, test12] = target.querySelectorAll('div');
 		const [test6, test7, test8, test9] = target.querySelectorAll('select');
 		const [
 			test1_span,
@@ -201,6 +201,20 @@ export default test({
 			});
 		}
 
+		{
+			/** @type {NodeListOf<HTMLInputElement | HTMLTextAreaElement>} */
+			const inputs = test12.querySelectorAll('input, textarea');
+			assert.equal(inputs[0].value, 'x');
+			assert.equal(/** @type {HTMLInputElement} */ (inputs[1]).checked, true);
+			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();
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 d2b864e7ec..35d495300b 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
@@ -137,6 +137,13 @@
 		<option value="c">C</option>
 	</select>
 
+	<p>Static values</p>
+	<div class="test-12">
+		<input value="x" defaultValue="y" />
+		<input type="checkbox" checked defaultChecked={false} />
+		<textarea defaultValue="y">x</textarea>
+	</div>
+
 	<input type="reset" value="Reset" />
 </form>
 

From 51c9eac577b399dd28c9a815c2c25d7c45314846 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 4 Dec 2024 11:43:58 -0500
Subject: [PATCH 268/404] Version Packages (#14556)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/blue-fans-greet.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/blue-fans-greet.md

diff --git a/.changeset/blue-fans-greet.md b/.changeset/blue-fans-greet.md
deleted file mode 100644
index 747f534d22..0000000000
--- a/.changeset/blue-fans-greet.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: handle static form values in combination with default values
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 2f455307ad..2d2843a5e4 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.6.1
+
+### Patch Changes
+
+- fix: handle static form values in combination with default values ([#14555](https://github.com/sveltejs/svelte/pull/14555))
+
 ## 5.6.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 011b0ba5b5..bace84a037 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.0",
+  "version": "5.6.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 65e64d4963..a85274534b 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.0';
+export const VERSION = '5.6.1';
 export const PUBLIC_VERSION = '5';

From a22033001121208ca87d1c69418d051703e57547 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 4 Dec 2024 18:15:19 +0000
Subject: [PATCH 269/404] chore: make if blocks tree-shakable (#14549)

* chore: make if blocks dead code eliminable

* chore: make if blocks dead code eliminable

* chore: make if blocks dead code eliminable

* address feedback

* address feedback

* prettier

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/beige-windows-happen.md            |  5 +++
 .../3-transform/client/visitors/IfBlock.js    | 45 ++++++++++++++-----
 .../src/internal/client/dom/blocks/if.js      | 36 ++++++++++-----
 3 files changed, 65 insertions(+), 21 deletions(-)
 create mode 100644 .changeset/beige-windows-happen.md

diff --git a/.changeset/beige-windows-happen.md b/.changeset/beige-windows-happen.md
new file mode 100644
index 0000000000..00fde8a785
--- /dev/null
+++ b/.changeset/beige-windows-happen.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: make if blocks tree-shakable
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/IfBlock.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/IfBlock.js
index 0aa6e5d24a..d658f9eaf8 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/IfBlock.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/IfBlock.js
@@ -9,23 +9,44 @@ import * as b from '../../../../utils/builders.js';
  */
 export function IfBlock(node, context) {
 	context.state.template.push('<!>');
+	const statements = [];
 
 	const consequent = /** @type {BlockStatement} */ (context.visit(node.consequent));
+	const consequent_id = context.state.scope.generate('consequent');
 
+	statements.push(b.var(b.id(consequent_id), b.arrow([b.id('$$anchor')], consequent)));
+
+	let alternate_id;
+
+	if (node.alternate) {
+		const alternate = /** @type {BlockStatement} */ (context.visit(node.alternate));
+		alternate_id = context.state.scope.generate('alternate');
+		statements.push(b.var(b.id(alternate_id), b.arrow([b.id('$$anchor')], alternate)));
+	}
+
+	/** @type {Expression[]} */
 	const args = [
 		context.state.node,
-		b.thunk(/** @type {Expression} */ (context.visit(node.test))),
-		b.arrow([b.id('$$anchor')], consequent)
+		b.arrow(
+			[b.id('$$render')],
+			b.block([
+				b.if(
+					/** @type {Expression} */ (context.visit(node.test)),
+					b.stmt(b.call(b.id('$$render'), b.id(consequent_id))),
+					alternate_id
+						? b.stmt(
+								b.call(
+									b.id('$$render'),
+									b.id(alternate_id),
+									node.alternate ? b.literal(false) : undefined
+								)
+							)
+						: undefined
+				)
+			])
+		)
 	];
 
-	if (node.alternate || node.elseif) {
-		args.push(
-			node.alternate
-				? b.arrow([b.id('$$anchor')], /** @type {BlockStatement} */ (context.visit(node.alternate)))
-				: b.literal(null)
-		);
-	}
-
 	if (node.elseif) {
 		// We treat this...
 		//
@@ -51,5 +72,7 @@ export function IfBlock(node, context) {
 		args.push(b.literal(true));
 	}
 
-	context.state.init.push(b.stmt(b.call('$.if', ...args)));
+	statements.push(b.stmt(b.call('$.if', ...args)));
+
+	context.state.init.push(b.block(statements));
 }
diff --git a/packages/svelte/src/internal/client/dom/blocks/if.js b/packages/svelte/src/internal/client/dom/blocks/if.js
index 4d8e9412d3..6a880f28bc 100644
--- a/packages/svelte/src/internal/client/dom/blocks/if.js
+++ b/packages/svelte/src/internal/client/dom/blocks/if.js
@@ -13,13 +13,11 @@ import { HYDRATION_START_ELSE } from '../../../../constants.js';
 
 /**
  * @param {TemplateNode} node
- * @param {() => boolean} get_condition
- * @param {(anchor: Node) => void} consequent_fn
- * @param {null | ((anchor: Node) => void)} [alternate_fn]
+ * @param {(branch: (fn: (anchor: Node) => void, flag?: boolean) => void) => void} fn
  * @param {boolean} [elseif] True if this is an `{:else if ...}` block rather than an `{#if ...}`, as that affects which transitions are considered 'local'
  * @returns {void}
  */
-export function if_block(node, get_condition, consequent_fn, alternate_fn = null, elseif = false) {
+export function if_block(node, fn, elseif = false) {
 	if (hydrating) {
 		hydrate_next();
 	}
@@ -37,8 +35,18 @@ export function if_block(node, get_condition, consequent_fn, alternate_fn = null
 
 	var flags = elseif ? EFFECT_TRANSPARENT : 0;
 
-	block(() => {
-		if (condition === (condition = !!get_condition())) return;
+	var has_branch = false;
+
+	const set_branch = (/** @type {(anchor: Node) => void} */ fn, flag = true) => {
+		has_branch = true;
+		update_branch(flag, fn);
+	};
+
+	const update_branch = (
+		/** @type {boolean | null} */ new_condition,
+		/** @type {null | ((anchor: Node) => void)} */ fn
+	) => {
+		if (condition === (condition = new_condition)) return;
 
 		/** Whether or not there was a hydration mismatch. Needs to be a `let` or else it isn't treeshaken out */
 		let mismatch = false;
@@ -60,8 +68,8 @@ export function if_block(node, get_condition, consequent_fn, alternate_fn = null
 		if (condition) {
 			if (consequent_effect) {
 				resume_effect(consequent_effect);
-			} else {
-				consequent_effect = branch(() => consequent_fn(anchor));
+			} else if (fn) {
+				consequent_effect = branch(() => fn(anchor));
 			}
 
 			if (alternate_effect) {
@@ -72,8 +80,8 @@ export function if_block(node, get_condition, consequent_fn, alternate_fn = null
 		} else {
 			if (alternate_effect) {
 				resume_effect(alternate_effect);
-			} else if (alternate_fn) {
-				alternate_effect = branch(() => alternate_fn(anchor));
+			} else if (fn) {
+				alternate_effect = branch(() => fn(anchor));
 			}
 
 			if (consequent_effect) {
@@ -87,6 +95,14 @@ export function if_block(node, get_condition, consequent_fn, alternate_fn = null
 			// continue in hydration mode
 			set_hydrating(true);
 		}
+	};
+
+	block(() => {
+		has_branch = false;
+		fn(set_branch);
+		if (!has_branch) {
+			update_branch(null, null);
+		}
 	}, flags);
 
 	if (hydrating) {

From 85dec47a5ef366d9e26a0e517594dfba022150d3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 4 Dec 2024 13:34:12 -0500
Subject: [PATCH 270/404] Version Packages (#14557)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/beige-windows-happen.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/beige-windows-happen.md

diff --git a/.changeset/beige-windows-happen.md b/.changeset/beige-windows-happen.md
deleted file mode 100644
index 00fde8a785..0000000000
--- a/.changeset/beige-windows-happen.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: make if blocks tree-shakable
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 2d2843a5e4..6fc56c836c 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.6.2
+
+### Patch Changes
+
+- chore: make if blocks tree-shakable ([#14549](https://github.com/sveltejs/svelte/pull/14549))
+
 ## 5.6.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index bace84a037..68d6eeed9e 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.1",
+  "version": "5.6.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index a85274534b..88f83720a1 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.1';
+export const VERSION = '5.6.2';
 export const PUBLIC_VERSION = '5';

From 4b802dbed328178263aaf2f1e967655f53be2399 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Wed, 4 Dec 2024 11:56:28 -0800
Subject: [PATCH 271/404] docs: add a mobile app FAQ (#14559)

* docs: add a mobile app FAQ

* Update 99-faq.md
---
 documentation/docs/07-misc/99-faq.md | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/documentation/docs/07-misc/99-faq.md b/documentation/docs/07-misc/99-faq.md
index 4fceda03d6..b56c27af86 100644
--- a/documentation/docs/07-misc/99-faq.md
+++ b/documentation/docs/07-misc/99-faq.md
@@ -102,6 +102,12 @@ If you need hash-based routing on the client side, check out [svelte-spa-router]
 
 You can see a [community-maintained list of routers on sveltesociety.dev](https://sveltesociety.dev/packages?category=routers).
 
+## How do I write a mobile app with Svelte?
+
+While most mobile apps are written without using JavaScript, if you'd like to leverage your existing Svelte components and knowledge of Svelte when building mobile apps, you can turn a [SvelteKit SPA](https://kit.svelte.dev/docs/single-page-apps) into a mobile app with [Tauri](https://v2.tauri.app/start/frontend/sveltekit/) or [Capacitor](https://capacitorjs.com/solution/svelte). Mobile features like the camera, geolocation, and push notifications are available via plugins for both platforms.
+
+Svelte Native was an option available for Svelte 4, but note that Svelte 5 does not currently support it. Svelte Native lets you write NativeScript apps using Svelte components that contain [NativeScript UI components](https://docs.nativescript.org/ui/) rather than DOM elements, which may be familiar for users coming from React Native.
+
 ## Can I tell Svelte not to remove my unused styles?
 
 No. Svelte removes the styles from the component and warns you about them in order to prevent issues that would otherwise arise.

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 272/404] 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 687f8e93b1..09ea84f26c 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 273/404] 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 0000000000..a38b2e19d4
--- /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 2229c1a361..0276069eee 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 3ae8b223be..5ef72aaa8e 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 35d495300b..4d6a1a00b8 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 274/404] 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 0000000000..68d9f9a3e8
--- /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 0000000000..92e9c266cc
--- /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 10f52502d3..f4262a5650 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 0000000000..63deca62ea
--- /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 2757688a59..3eb9b95333 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 6240469ec3..6a6c9dcf13 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 0000000000..a2be0adc91
--- /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 f2f1dfc4eb..ae6806ec76 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 002ebf2e38..45b90240c9 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 05971b5cab..b6554e5e56 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 017b926298..380307901e 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 5a5cc86ae6..46a2137ae6 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 275/404] 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 a38b2e19d4..0000000000
--- 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 68d9f9a3e8..0000000000
--- 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 92e9c266cc..0000000000
--- 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 6fc56c836c..9b9ff754be 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 68d6eeed9e..11313d14ab 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 88f83720a1..a69d2f6b32 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 276/404] 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 72811c8f17..587d766233 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 b8ba8b6f0a..e157ce76e2 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 46a2137ae6..db6ac88c2c 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 277/404] 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 0000000000..aad4de715a
--- /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 5dde60b3b4..aa7be93cb5 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 79df3cdd04..7cabfb06c5 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 0000000000..79e7071486
--- /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 0000000000..f19f247707
--- /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 0000000000..b4dea5b588
--- /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 278/404] 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 aad4de715a..0000000000
--- 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 9b9ff754be..b19cfb355b 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 11313d14ab..6a01e01ecb 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 a69d2f6b32..331506a55a 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 279/404] 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 0000000000..c597f5ea99
--- /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 d843413e57..92d29d9e1d 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 1a9afb0781..22b8cc4af3 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 c0f55a4cca..8fb9b9e66a 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 992085b4b5..270fabd4c7 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 8f689878f7..d732dbc283 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 db6ac88c2c..f3f9580dc6 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 280/404] 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 c597f5ea99..0000000000
--- 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 b19cfb355b..8613474924 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 6a01e01ecb..97dedffbfc 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 331506a55a..f0574202b5 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 281/404] 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 8fb9b9e66a..5a6a7e0fae 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 282/404] 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 0000000000..6ba09ef148
--- /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 5a6a7e0fae..4e74d4b76f 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 f3f9580dc6..f6b5b21f80 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 283/404] 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 9cff5a754f..12d5576b40 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 62dd0c6a9e..30799215b6 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 284/404] 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 f6b5b21f80..0d761919a8 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 285/404] 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 6ba09ef148..0000000000
--- 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 8613474924..4031110fa7 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 97dedffbfc..c751a598db 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 f0574202b5..3061318cb0 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 286/404] 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 944e79621e..654a517c9f 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 287/404] 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 0000000000..2637b50b3c
--- /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 6a880f28bc..36790c05c1 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 0000000000..ffde9ee303
--- /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 0000000000..08a3809de9
--- /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 0000000000..3136406698
--- /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 0000000000..79cf2cf35f
--- /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 c6799c5f95..552c434101 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 288/404] 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 0000000000..d63141660e
--- /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 fe3cf727e2..90046c8c45 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 3bd162d8d7..d726d25fa1 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 9621a6457b..02961b61fc 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 901ea1983e..1a4525ef5c 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 5b56d9ddac..b062365380 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 79969240c7..f129e059f2 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 3c0be589c3..2c2c287f12 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 aa7be93cb5..c94c1e1b0e 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 59beacbb0c..11f76aa025 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 7cabfb06c5..0d04444335 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 434447727b..d626bb08db 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 2bd5fbbfa6..0013f5c17a 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 a409cf5704..b8724f28dc 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 0000000000..0026309d44
--- /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 0000000000..1d51c8eead
--- /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 0000000000..21646e745a
--- /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 0000000000..bea5849ec7
--- /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 0000000000..158d1e6f63
--- /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 0000000000..191a423476
--- /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 0000000000..f85363106b
--- /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 0000000000..3f8afe7655
--- /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 0d761919a8..61a34dcb8e 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 289/404] 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 d63141660e..b491d78b4c 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 290/404] 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 2637b50b3c..0000000000
--- 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 b491d78b4c..0000000000
--- 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 4031110fa7..fea90ca0ea 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 c751a598db..e5afd8e130 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 3061318cb0..f5369fe169 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 291/404] 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 df0ba4d8f5..70666f6a57 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 292/404] 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 0000000000..869599055c
--- /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 b062365380..b4de1925df 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 158d1e6f63..dd5c387405 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 191a423476..f6d908fba1 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 293/404] 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 869599055c..0000000000
--- 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 fea90ca0ea..00ef293475 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 e5afd8e130..5d662af00c 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 f5369fe169..20ff578fbe 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 294/404] 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 0000000000..39cefcc4b7
--- /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 8f1efd7f63..9e29813ee3 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 0000000000..fe51488c70
--- /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 0000000000..df50ebc1fa
--- /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 295/404] 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 0000000000..57d6f015f7
--- /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 5e842a82fe..7b3a9a4d0e 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 0000000000..f47bee71df
--- /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 0000000000..aec1e67cc6
--- /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 296/404] 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 ef19a28994..b0490b84ff 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 481959ba3d..88b1f278a6 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 8cf6727da9..c3e8b53c31 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 52ef9d5f88..0102aafcbc 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 e9327e1e98..2d23e68948 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 019e83e7b1..122c1b92a6 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 2c891b4fc7..8c32fb7082 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 6967458cf4..780f4ae9e5 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 690681c172..b15b01241b 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 80830f7903..c3acdedf3d 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 ef030c8a1c..8b4c61303a 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 c6cc81761e..c76fb10cdf 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 297/404] 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 2d23e68948..f449a4031e 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 c76fb10cdf..fb27867f9b 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 298/404] 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 0000000000..60e05c9e4a
--- /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 3360b24802..bbe257498e 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 c63a22da96..c72e9f9d5e 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 d40a59ec0c..8a9b87b760 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 0dc30b2c01..445f5d14e6 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 8300d803d5..e0c970c664 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 302b0941a1..6fb7924564 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 c63a22da96..b90994fd96 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 d40a59ec0c..0814475a05 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 1a4525ef5c..fd509eb3ab 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 e193ad0f11..b9fffc23a5 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 2d95c42365..56c0cc31df 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 2f28d3e9e3..8daba601ef 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 67f4a2dfc6..38c545c84e 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 7a8244a7c1..9c4c6f097e 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 0d72800fb7..9d94667ec2 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 37269a674e..573c5b1e73 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 ea696890b4..5e57a3a032 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 443ee02958..dd51f52eab 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 7247778d0f..3bf2dd286c 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 9e4b7222af..3eba548d7c 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 a4c705695a..441605f4f9 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 c5dfa8ecc7..022bc2df20 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 b14c0bdf4b..e6dc0f385b 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 1dcc5a58d5..99d8feba24 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 299/404] 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 60e05c9e4a..881179ef51 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 300/404] 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 881179ef51..0000000000
--- 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 39cefcc4b7..0000000000
--- 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 57d6f015f7..0000000000
--- 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 00ef293475..1d60d94073 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 5d662af00c..62160514bb 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 20ff578fbe..f72df5a489 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 301/404] 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 0000000000..6f061706a3
--- /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 810dcb0862..ec123d3968 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 302/404] 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 0000000000..7a5ac00c44
--- /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 cd8af21f98..7b8cd7593f 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 7f22aa7c87..7155d31720 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 0000000000..ae00bd9f56
--- /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 0000000000..d090460a09
--- /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 0000000000..240263603d
--- /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 0000000000..b23a69d53d
--- /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 303/404] 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 0000000000..bbdc765b4e
--- /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 66ea2c4941..5ac33e629e 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 cf8c31a941..fc1b647f78 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 0000000000..c2b06202ae
--- /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 a6d79c05ed..ad7bdc654a 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 0000000000..40592e08b8
--- /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 99d957e980..1603241227 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 f151336046..0000000000
--- 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 304/404] 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 0000000000..bf8d08ecdc
--- /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 c1175e4b5b..75b63260d5 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 3acc1b0212..8a7c493d7c 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 2f2cdfcbd5..dc1a754010 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 305/404] 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 0000000000..00d8286bcb
--- /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 cef14bc14f..4632fc3d68 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 0000000000..707c92118b
--- /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 0000000000..cb5c116f37
--- /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 306/404] 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 0000000000..0c7fc6687c
--- /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 270fabd4c7..bc30ce9578 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 307/404] 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 7a5ac00c44..0000000000
--- 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 00d8286bcb..0000000000
--- 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 6f061706a3..0000000000
--- 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 bf8d08ecdc..0000000000
--- 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 0c7fc6687c..0000000000
--- 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 bbdc765b4e..0000000000
--- 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 1d60d94073..66c49002fd 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 62160514bb..358d56ec5b 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 f72df5a489..5278972795 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 308/404] 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 0000000000..2caf6d421b
--- /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 0276069eee..8f6588e94a 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 0000000000..0679c820ba
--- /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 0000000000..09a139e642
--- /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 309/404] 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 0000000000..e17bf7ad42
--- /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 0000000000..cc544dc5ba
--- /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 358d56ec5b..922c7fc9f9 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 8083851c35..16bbf52a2e 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 95526b27a7..acb5a5b117 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 a2be0adc91..7da9ada667 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 0000000000..c7c14ad7cd
--- /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 0000000000..16e8b7b87b
--- /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 61a34dcb8e..206f9931f5 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 310/404] 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 e17bf7ad42..0000000000
--- 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 2caf6d421b..0000000000
--- 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 66c49002fd..e65cd81fd0 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 922c7fc9f9..ac204dfc1c 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 5278972795..1e33786a78 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 311/404] 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 0000000000..c671a2dc13
--- /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 75b63260d5..c5255c4bc3 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 0000000000..0c812ea27d
--- /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 0000000000..47ed8b4dc0
--- /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 312/404] 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 0000000000..e3e3511de2
--- /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 b0490b84ff..06ca578b76 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 122c1b92a6..543be71080 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 8ca6534457..3c8f57f46b 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 f8a7143b20..03fddc5ebd 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 912aab37b6..77502edb90 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 8daba601ef..24d86e2e0b 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 7a77424bb2..0000000000
--- 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 70fd0a6abc..0000000000
--- 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 2a9b1e1f23..0000000000
--- 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 313/404] 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 c671a2dc13..0000000000
--- 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 e3e3511de2..0000000000
--- 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 e65cd81fd0..f4b7c18d7d 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 ac204dfc1c..f461a4b4c3 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 1e33786a78..1cedefa314 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 314/404] 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 b90994fd96..c72e9f9d5e 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 0814475a05..8a9b87b760 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 9d94667ec2..26d6822cdb 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 573c5b1e73..83c58c9b14 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 315/404] 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 b604c59f20..250a03744e 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 c73122314a..f94dac7cc7 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 22aaf3d864..0000000000
--- 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 a4b95fb2fe..0000000000
--- 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 356a57c3f6..0000000000
--- 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 8b4da37640..0000000000
--- 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 63908c66cf..0000000000
--- 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 e20946de7f..0000000000
--- 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 13802e6076..0000000000
--- 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 19c3fcc97f..0000000000
--- 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 7b95008712..0000000000
--- 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 e268f3838e..0000000000
--- 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 d047d10637..0000000000
--- 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 7c31ce8c2c..0000000000
--- 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 db6fd95802..0000000000
--- 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 55412f40eb..0000000000
--- 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 f99f21494c..0000000000
--- 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 0db97578c1..0000000000
--- 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 94484ecf39..0000000000
--- 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 426e5044a7..0000000000
--- 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 a0f59985fe..0000000000
--- 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 ac6da48d3d..0000000000
--- 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 9018a50bee..0000000000
--- 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 0e45887bd7..0000000000
--- 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 db506ada3b..0000000000
--- 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 e2a880aff8..0000000000
--- 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 36635c7130..0000000000
--- 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 cba9721807..0000000000
--- 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 540e0b3b02..0000000000
--- 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 3ac3e457d6..0000000000
--- 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 b3f9fa8d1a..0000000000
--- 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 202a5f973a..0000000000
--- 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 f43f5f899b..0000000000
--- 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 b535c7ff04..0000000000
--- 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 e983e6d147..0000000000
--- 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 969b641408..0000000000
--- 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 867e144acc..0000000000
--- 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 a758846d29..0000000000
--- 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 d378e1d517..0000000000
--- 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 5a289fff7d..0000000000
--- 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 9e0a92dbdd..0000000000
--- 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 51e7e062a4..0000000000
--- 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 2f79b289e4..0000000000
--- 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 9cb4a8e25e..0000000000
--- 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 6ccdeffed8..0000000000
--- 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 9247894dd6..0000000000
--- 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 60351b7548..0000000000
--- 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 ff7057c9c2..0000000000
--- 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 e66e075c14..0000000000
--- 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 6d6d8a7d7c..0000000000
--- 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 640c4c57df..0000000000
--- 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 99b72d0fad..0000000000
--- 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 b54c36ee5b..0000000000
--- 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 f1bdbbbb35..0000000000
--- 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 cbb6433bf9..0000000000
--- 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 097fde98ff..0000000000
--- 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 fba7f30e4b..0000000000
--- 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 25c78ba281..0000000000
--- 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 bb5c166711..0000000000
--- 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 2e3cb987c0..0000000000
--- 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 84062a1cfa..0000000000
--- 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 b3fe34d21a..0000000000
--- 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 5124ae291d..0000000000
--- 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 7cbec56e17..0000000000
--- 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 a2a3985282..0000000000
--- 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 eba0dae563..0000000000
--- 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 6c804b03ac..0000000000
--- 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 cc95438e8c..0000000000
--- 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 bef2553063..0000000000
--- 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 9918104471..0000000000
--- 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 1cc48b20a7..0000000000
--- 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 f45b2e0416..0000000000
--- 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 0c45bdaab2..0000000000
--- 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 5b62b9209c..0000000000
--- 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 9af8d5a648..0000000000
--- 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 5d44f48bad..0000000000
--- 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 99c7324135..0000000000
--- 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 03916b4d64..0000000000
--- 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 d74a36b6a9..0000000000
--- 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 38e9deb9e8..0000000000
--- 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 55f94f155b..0000000000
--- 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 f0683c0a40..0000000000
--- 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 cfa65b0065..0000000000
--- 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 4e22542435..0000000000
--- 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 d2d2d8019d..0000000000
--- 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 f9883a3d36..0000000000
--- 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 29642f5f78..0000000000
--- 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 316/404] 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 0000000000..f32e71084b
--- /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 16e8b7b87b..8c50a5c440 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 0000000000..ee65cb76c7
--- /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 0000000000..e84e41bf63
--- /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 206f9931f5..435476d703 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 317/404] 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 f32e71084b..0000000000
--- 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 f4b7c18d7d..978e841bf8 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 f461a4b4c3..e95341a0bd 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 1cedefa314..e264eace2c 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 318/404] 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 0000000000..0fe7e70c6d
--- /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 4928419d16..5d53ca3360 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 0000000000..c309299748
--- /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 0000000000..e52264c793
--- /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 0000000000..5900ddc846
--- /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 319/404] 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 0000000000..bbe9b777ae
--- /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 823b9a4362..35d2f223ae 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 b944c602b8..b8371b7e00 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 75171c1786..9324408007 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 0000000000..4723e4e454
--- /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 0000000000..b3a4d92219
--- /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 0000000000..3904d47f73
--- /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 320/404] 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 f8148f3dc3..c9951d3f34 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 321/404] 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 0000000000..1f51572cda
--- /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 8f6588e94a..9c62d684c1 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 0000000000..26e90e431b
--- /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 0000000000..3fc7ef11a5
--- /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 5ef72aaa8e..35ab6e8ece 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 322/404] 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 88b1f278a6..f6f2585df2 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 b15b01241b..33e635bdb2 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 323/404] 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 0000000000..d249354b67
--- /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 45350bb1ae..cd5cdd3e6e 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 4bab0df72f..527d6eebf1 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 5df4d66ab6..ab2912a2c0 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 324/404] 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 d249354b67..0000000000
--- 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 bbe9b777ae..0000000000
--- 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 1f51572cda..0000000000
--- 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 0fe7e70c6d..0000000000
--- 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 978e841bf8..6f3380ff5a 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 e95341a0bd..abcda8613d 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 e264eace2c..39d89acd53 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 325/404] 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 0000000000..7940371d6f
--- /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 14fd3aa2e8..ffd07dd26a 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 0000000000..53e6203dde
--- /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 0000000000..22a2469bfb
--- /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 0000000000..8f6154462f
--- /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 326/404] 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 0000000000..430c507a0c
--- /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 2d90988936..e3f88c8f1d 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 88f9bbf0ee..1bb7a69a20 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 7639c2f0ed..c3a8a098d3 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 87367aff08..9d9ed3a1ef 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 aa835a1d96..29e8a0e541 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 cd5cdd3e6e..2b6a88f7bd 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 1dd2d9ae7c..b8c88a1023 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 d017b215f2..35bc675166 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 eab67327e2..238c83f00e 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 07171a23bb..d3fd71ec39 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 9e29813ee3..042e88fa2f 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 dedbe95ace..b4ca4dc262 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 54e5b46486..a64c89cd88 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 6c050d966a..6eb9faca6d 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 c7ade4856b..99f18ace64 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 26ba030780..a63480feaa 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 7b8cd7593f..2f6bbd785a 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 3bd16b0dd4..a5ca8463a4 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 c2c1f9cabf..198e464ac7 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 c3865166fe..f04b0e4668 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 3edbc49f16..ccbdcea4cc 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 47af9813e2..5c8476de3e 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 de821bbc45..c59a5544df 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 f129e059f2..0a49e89cfe 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 c94c1e1b0e..068971145c 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 92f99c4a8b..f23f7548ec 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 af336733bc..7674fd1eb2 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 11f76aa025..1854baa1e9 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 c5255c4bc3..5b0dcd5588 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 ffde76fab7..982b75e12f 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 716e1105f0..971271642c 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 2988c590fd..6364063b3b 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 0d04444335..695161ff9b 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 d626bb08db..5ebc647571 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 735fed0608..2c6aa2f316 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 a16fd73a2d..5d860207dd 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 ffd07dd26a..b53a3110bd 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 85d002eb09..71a6aa3a5e 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 1a1c21bb4b..7aa9fecd3a 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 7155d31720..93be67b56c 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 4e7ef867b4..6a2ea27993 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 4602f76e8e..2840c6601b 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 ba4079ecd0..7b2e6ae5f7 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 fe306bd020..b80b717e42 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 0013f5c17a..389fc92332 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 b8724f28dc..97a25df4a7 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 cc8339f16b..0a24d2ff0d 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 1c05ec8ee6..078bf589e6 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 435476d703..a36be7f2e4 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 327/404] 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 0000000000..f3005f6ec3
--- /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 7da9ada667..22310df18d 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 45b90240c9..9d7f71c9bd 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 0000000000..f7a4ca05f5
--- /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 0000000000..446a9213dd
--- /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 328/404] 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 f3005f6ec3..0000000000
--- 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 7940371d6f..0000000000
--- 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 430c507a0c..0000000000
--- 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 6f3380ff5a..90419d3454 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 abcda8613d..f38c28bce5 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 39d89acd53..57a2fda759 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 329/404] 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 0000000000..b61ee11785
--- /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 fbd9c16e5d..74678f518d 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 c3a8a098d3..390919f5cd 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 4e33c23f28..021bd95a6e 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 2b6a88f7bd..c112cf6789 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 0eadd2b8b5..423ada792c 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 aa1e072e73..4e02f06de6 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 0000000000..4489a3eb27
--- /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 0000000000..480fcf2edc
--- /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 0000000000..a0977b9a63
--- /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 0000000000..d27b6cd914
--- /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 0000000000..16fcfcf608
--- /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 0000000000..e6e909f0d5
--- /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 0000000000..ce82d23000
--- /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 0000000000..1792d6b8e6
--- /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 0000000000..10a3876b7c
--- /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 0000000000..d91cc68098
--- /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 ad93a0f2e9..987253d8d0 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 0000000000..4489a3eb27
--- /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 0000000000..46aad16b21
--- /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 0000000000..a0977b9a63
--- /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 0000000000..cdb7f66c58
--- /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 0000000000..ce82d23000
--- /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 0000000000..a0e13d4352
--- /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 0000000000..10a3876b7c
--- /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 0000000000..ec47bfc738
--- /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 04af8b0780..b47d4a4879 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 a36be7f2e4..562ce95998 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 330/404] 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 0000000000..7eaebde1f6
--- /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 ffd03d85a6..16a2c8151c 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 77502edb90..05c210978d 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 6e86968c7a..f4b7944c14 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 562ce95998..bafa7a2265 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 331/404] 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 7eaebde1f6..f8108adcee 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 332/404] 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 74678f518d..42427dd9c4 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 f4b7944c14..767b230131 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 bafa7a2265..dca0fd99f0 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 333/404] 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 f8108adcee..0000000000
--- 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 b61ee11785..0000000000
--- 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 90419d3454..cce58f7b54 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 f38c28bce5..24fa9c91b9 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 57a2fda759..4b1927606a 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';

From 5483495c8d01fe580d44d8d763e9b66abc5c6122 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sun, 15 Dec 2024 14:21:18 +0000
Subject: [PATCH 334/404] feat: add $inspect.trace rune (#14290)

* feat: add $trace rune

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

WIP

* lint

* fix

* fix

* fix

* fix

* fix

* fix

* fix

* more tweaks

* lint

* improve label for derived cached

* improve label for derived cached

* lint

* better stacks

* complete redesign

* fixes

* dead code

* dead code

* improve change detection

* rename rune

* lint

* lint

* fix bug

* tweaks

* Update packages/svelte/src/internal/client/dev/tracing.js

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

* Update packages/svelte/src/internal/client/dev/tracing.js

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

* Update packages/svelte/src/internal/client/dev/tracing.js

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

* Update packages/svelte/src/internal/client/dev/tracing.js

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

* todos

* add test + some docs

* changeset

* update messages

* address feedback

* address feedback

* limit to first statement of function

* remove unreachable trace_rune_duplicate error

* tweak message

* remove the expression statement, not the expression

* revert

* make label optional

* relax restriction on label - no longer necessary with new design

* update errors

* newline

* tweak

* add some docs

* fix playground

* fix playground

* tweak message when function runs outside an effect

* unused

* tweak

* handle async functions

* fail on generators

* regenerate, update docs

* better labelling

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/tame-ants-peel.md                  |   5 +
 documentation/docs/02-runes/07-$inspect.md    |  17 ++
 .../98-reference/.generated/compile-errors.md |  12 ++
 .../svelte/messages/compile-errors/script.md  |   8 +
 packages/svelte/src/ambient.d.ts              |  19 ++
 packages/svelte/src/compiler/errors.js        |  18 ++
 .../2-analyze/visitors/CallExpression.js      |  72 ++++++-
 .../client/visitors/AssignmentExpression.js   |   7 +-
 .../client/visitors/BlockStatement.js         |  22 ++-
 .../client/visitors/ExpressionStatement.js    |   4 +
 .../client/visitors/VariableDeclaration.js    |   1 +
 .../server/visitors/ExpressionStatement.js    |   7 +-
 packages/svelte/src/compiler/phases/scope.js  |   6 +
 packages/svelte/src/compiler/state.js         |  10 +
 .../svelte/src/internal/client/dev/assign.js  |   2 +-
 .../src/internal/client/dev/location.js       |  25 ---
 .../svelte/src/internal/client/dev/tracing.js | 180 ++++++++++++++++++
 .../src/internal/client/dom/blocks/each.js    |  55 +++++-
 .../src/internal/client/dom/blocks/html.js    |   3 +-
 packages/svelte/src/internal/client/index.js  |   1 +
 packages/svelte/src/internal/client/proxy.js  |  20 +-
 .../internal/client/reactivity/deriveds.js    |   5 +
 .../src/internal/client/reactivity/effects.js |   8 +-
 .../src/internal/client/reactivity/sources.js |  18 +-
 .../src/internal/client/reactivity/types.d.ts |   4 +
 .../svelte/src/internal/client/runtime.js     |  29 ++-
 packages/svelte/src/utils.js                  |   9 +
 .../samples/inspect-console-trace/_config.js  |  19 ++
 .../samples/inspect-console-trace/main.svelte |  11 ++
 .../samples/inspect-trace/_config.js          |  38 +++-
 .../samples/inspect-trace/main.svelte         |  15 +-
 packages/svelte/types/index.d.ts              |  19 ++
 32 files changed, 596 insertions(+), 73 deletions(-)
 create mode 100644 .changeset/tame-ants-peel.md
 delete mode 100644 packages/svelte/src/internal/client/dev/location.js
 create mode 100644 packages/svelte/src/internal/client/dev/tracing.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-console-trace/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-console-trace/main.svelte

diff --git a/.changeset/tame-ants-peel.md b/.changeset/tame-ants-peel.md
new file mode 100644
index 0000000000..ed7a69f8cc
--- /dev/null
+++ b/.changeset/tame-ants-peel.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: adds $inspect.trace rune
diff --git a/documentation/docs/02-runes/07-$inspect.md b/documentation/docs/02-runes/07-$inspect.md
index 1afe25deca..ff3d64757b 100644
--- a/documentation/docs/02-runes/07-$inspect.md
+++ b/documentation/docs/02-runes/07-$inspect.md
@@ -42,3 +42,20 @@ A convenient way to find the origin of some change is to pass `console.trace` to
 // @errors: 2304
 $inspect(stuff).with(console.trace);
 ```
+
+## $inspect.trace(...)
+
+This rune, added in 5.14, causes the surrounding function to be _traced_ in development. Any time the function re-runs as part of an [effect]($effect) or a [derived]($derived), information will be printed to the console about which pieces of reactive state caused the effect to fire.
+
+```svelte
+<script>
+	import { doSomeWork } from './elsewhere';
+
+	$effect(() => {
+		+++$inspect.trace();+++
+		doSomeWork();
+	});
+</script>
+```
+
+`$inspect.trace` takes an optional first argument which will be used as the label.
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index d726d25fa1..298363f78d 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -442,6 +442,18 @@ Expected whitespace
 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
 ```
 
+### inspect_trace_generator
+
+```
+`$inspect.trace(...)` cannot be used inside a generator function
+```
+
+### inspect_trace_invalid_placement
+
+```
+`$inspect.trace(...)` must be the first statement of a function body
+```
+
 ### invalid_arguments_usage
 
 ```
diff --git a/packages/svelte/messages/compile-errors/script.md b/packages/svelte/messages/compile-errors/script.md
index 69007bfb59..fa851cec89 100644
--- a/packages/svelte/messages/compile-errors/script.md
+++ b/packages/svelte/messages/compile-errors/script.md
@@ -54,6 +54,14 @@
 
 > 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
 
+## inspect_trace_generator
+
+> `$inspect.trace(...)` cannot be used inside a generator function
+
+## inspect_trace_invalid_placement
+
+> `$inspect.trace(...)` must be the first statement of a function body
+
 ## invalid_arguments_usage
 
 > The arguments keyword cannot be used within the template or at the top level of a component
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index fe87e446d6..4e98eb82eb 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -371,6 +371,25 @@ declare function $inspect<T extends any[]>(
 	...values: T
 ): { with: (fn: (type: 'init' | 'update', ...values: T) => void) => void };
 
+declare namespace $inspect {
+	/**
+	 * Tracks which reactive state changes caused an effect to re-run. Must be the first
+	 * statement of a function body. Example:
+	 *
+	 * ```svelte
+	 * <script>
+	 *   let count = $state(0);
+	 *
+	 *   $effect(() => {
+	 *     $inspect.trace('my effect');
+	 *
+	 *     count;
+	 *   });
+	 * </script>
+	 */
+	export function trace(name: string): void;
+}
+
 /**
  * Retrieves the `this` reference of the custom element that contains this component. Example:
  *
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index fd509eb3ab..9ea13e811e 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -206,6 +206,24 @@ 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\nhttps://svelte.dev/e/import_svelte_internal_forbidden`);
 }
 
+/**
+ * `$inspect.trace(...)` cannot be used inside a generator function
+ * @param {null | number | NodeLike} node
+ * @returns {never}
+ */
+export function inspect_trace_generator(node) {
+	e(node, "inspect_trace_generator", `\`$inspect.trace(...)\` cannot be used inside a generator function\nhttps://svelte.dev/e/inspect_trace_generator`);
+}
+
+/**
+ * `$inspect.trace(...)` must be the first statement of a function body
+ * @param {null | number | NodeLike} node
+ * @returns {never}
+ */
+export function inspect_trace_invalid_placement(node) {
+	e(node, "inspect_trace_invalid_placement", `\`$inspect.trace(...)\` must be the first statement of a function body\nhttps://svelte.dev/e/inspect_trace_invalid_placement`);
+}
+
 /**
  * The arguments keyword cannot be used within the template or at the top level of a component
  * @param {null | number | NodeLike} node
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 99f18ace64..6a301726b1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -1,11 +1,12 @@
-/** @import { CallExpression, VariableDeclarator } from 'estree' */
+/** @import { ArrowFunctionExpression, CallExpression, Expression, FunctionDeclaration, FunctionExpression, Identifier, VariableDeclarator } from 'estree' */
 /** @import { AST } from '#compiler' */
 /** @import { Context } from '../types' */
 import { get_rune } from '../../scope.js';
 import * as e from '../../../errors.js';
 import { get_parent, unwrap_optional } from '../../../utils/ast.js';
 import { is_pure, is_safe_identifier } from './shared/utils.js';
-import { mark_subtree_dynamic } from './shared/fragment.js';
+import { dev, locate_node, source } from '../../../state.js';
+import * as b from '../../../utils/builders.js';
 
 /**
  * @param {CallExpression} node
@@ -136,6 +137,45 @@ export function CallExpression(node, context) {
 
 			break;
 
+		case '$inspect.trace': {
+			if (node.arguments.length > 1) {
+				e.rune_invalid_arguments_length(node, rune, 'zero or one arguments');
+			}
+
+			const grand_parent = context.path.at(-2);
+			const fn = context.path.at(-3);
+
+			if (
+				parent.type !== 'ExpressionStatement' ||
+				grand_parent?.type !== 'BlockStatement' ||
+				!(
+					fn?.type === 'FunctionDeclaration' ||
+					fn?.type === 'FunctionExpression' ||
+					fn?.type === 'ArrowFunctionExpression'
+				) ||
+				grand_parent.body[0] !== parent
+			) {
+				e.inspect_trace_invalid_placement(node);
+			}
+
+			if (fn.generator) {
+				e.inspect_trace_generator(node);
+			}
+
+			if (dev) {
+				if (node.arguments[0]) {
+					context.state.scope.tracing = b.thunk(/** @type {Expression} */ (node.arguments[0]));
+				} else {
+					const label = get_function_label(context.path.slice(0, -2)) ?? 'trace';
+					const loc = `(${locate_node(fn)})`;
+
+					context.state.scope.tracing = b.thunk(b.literal(label + ' ' + loc));
+				}
+			}
+
+			break;
+		}
+
 		case '$state.snapshot':
 			if (node.arguments.length !== 1) {
 				e.rune_invalid_arguments_length(node, rune, 'exactly one argument');
@@ -182,3 +222,31 @@ export function CallExpression(node, context) {
 		}
 	}
 }
+
+/**
+ * @param {AST.SvelteNode[]} nodes
+ */
+function get_function_label(nodes) {
+	const fn = /** @type {FunctionExpression | FunctionDeclaration | ArrowFunctionExpression} */ (
+		nodes.at(-1)
+	);
+
+	if ((fn.type === 'FunctionDeclaration' || fn.type === 'FunctionExpression') && fn.id != null) {
+		return fn.id.name;
+	}
+
+	const parent = nodes.at(-2);
+	if (!parent) return;
+
+	if (parent.type === 'CallExpression') {
+		return source.slice(parent.callee.start, parent.callee.end) + '(...)';
+	}
+
+	if (parent.type === 'Property' && !parent.computed) {
+		return /** @type {Identifier} */ (parent.key).name;
+	}
+
+	if (parent.type === 'VariableDeclarator' && parent.id.type === 'Identifier') {
+		return parent.id.name;
+	}
+}
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 5ac33e629e..3d8b9aaa96 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
@@ -8,7 +8,7 @@ import {
 	get_attribute_expression,
 	is_event_attribute
 } from '../../../../utils/ast.js';
-import { dev, filename, is_ignored, locator } from '../../../../state.js';
+import { dev, filename, is_ignored, locate_node, locator } from '../../../../state.js';
 import { build_proxy_reassignment, should_proxy } from '../utils.js';
 import { visit_assignment_expression } from '../../shared/assignments.js';
 
@@ -183,9 +183,6 @@ function build_assignment(operator, left, right, context) {
 	if (left.type === 'MemberExpression' && should_transform) {
 		const callee = callees[operator];
 
-		const loc = /** @type {Location} */ (locator(/** @type {number} */ (left.start)));
-		const location = `${filename}:${loc.line}:${loc.column}`;
-
 		return /** @type {Expression} */ (
 			context.visit(
 				b.call(
@@ -197,7 +194,7 @@ function build_assignment(operator, left, right, context) {
 							: b.literal(/** @type {Identifier} */ (left.property).name)
 					),
 					right,
-					b.literal(location)
+					b.literal(locate_node(left))
 				)
 			)
 		);
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BlockStatement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BlockStatement.js
index 502fbd471e..5bfc8a3ef9 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/BlockStatement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/BlockStatement.js
@@ -1,6 +1,7 @@
-/** @import { BlockStatement } from 'estree' */
+/** @import { ArrowFunctionExpression, BlockStatement, CallExpression, Expression, FunctionDeclaration, FunctionExpression, Statement } from 'estree' */
 /** @import { ComponentContext } from '../types' */
 import { add_state_transformers } from './shared/declarations.js';
+import * as b from '../../../../utils/builders.js';
 
 /**
  * @param {BlockStatement} node
@@ -8,5 +9,24 @@ import { add_state_transformers } from './shared/declarations.js';
  */
 export function BlockStatement(node, context) {
 	add_state_transformers(context);
+	const tracing = context.state.scope.tracing;
+
+	if (tracing !== null) {
+		const parent =
+			/** @type {ArrowFunctionExpression | FunctionDeclaration | FunctionExpression} */ (
+				context.path.at(-1)
+			);
+
+		const is_async = parent.async;
+
+		const call = b.call(
+			'$.trace',
+			/** @type {Expression} */ (tracing),
+			b.thunk(b.block(node.body.map((n) => /** @type {Statement} */ (context.visit(n)))), is_async)
+		);
+
+		return b.block([b.return(is_async ? b.await(call) : call)]);
+	}
+
 	context.next();
 }
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/ExpressionStatement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/ExpressionStatement.js
index 22e509eb72..0424e595be 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/ExpressionStatement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/ExpressionStatement.js
@@ -20,6 +20,10 @@ export function ExpressionStatement(node, context) {
 
 			return b.stmt(expr);
 		}
+
+		if (rune === '$inspect.trace') {
+			return b.empty;
+		}
 	}
 
 	context.next();
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js
index 04685b66bd..afb90bbec7 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js
@@ -27,6 +27,7 @@ export function VariableDeclaration(node, context) {
 				rune === '$effect.tracking' ||
 				rune === '$effect.root' ||
 				rune === '$inspect' ||
+				rune === '$inspect.trace' ||
 				rune === '$state.snapshot' ||
 				rune === '$host'
 			) {
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/ExpressionStatement.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/ExpressionStatement.js
index 9db887aada..00d0dba5da 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/ExpressionStatement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/ExpressionStatement.js
@@ -10,7 +10,12 @@ import { get_rune } from '../../../scope.js';
 export function ExpressionStatement(node, context) {
 	const rune = get_rune(node.expression, context.state.scope);
 
-	if (rune === '$effect' || rune === '$effect.pre' || rune === '$effect.root') {
+	if (
+		rune === '$effect' ||
+		rune === '$effect.pre' ||
+		rune === '$effect.root' ||
+		rune === '$inspect.trace'
+	) {
 		return b.empty;
 	}
 
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 93be67b56c..3536dd6a18 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -58,6 +58,12 @@ export class Scope {
 	 */
 	function_depth = 0;
 
+	/**
+	 * If tracing of reactive dependencies is enabled for this scope
+	 * @type {null | Expression}
+	 */
+	tracing = null;
+
 	/**
 	 *
 	 * @param {ScopeRoot} root
diff --git a/packages/svelte/src/compiler/state.js b/packages/svelte/src/compiler/state.js
index 2840c6601b..1db3db917f 100644
--- a/packages/svelte/src/compiler/state.js
+++ b/packages/svelte/src/compiler/state.js
@@ -1,6 +1,8 @@
+/** @import { Location } from 'locate-character' */
 /** @import { CompileOptions } from './types' */
 /** @import { AST, Warning } from '#compiler' */
 import { getLocator } from 'locate-character';
+import { sanitize_location } from '../utils.js';
 
 /** @typedef {{ start?: number, end?: number }} NodeLike */
 
@@ -28,6 +30,14 @@ export let dev;
 
 export let locator = getLocator('', { offsetLine: 1 });
 
+/**
+ * @param {AST.SvelteNode & { start?: number | undefined }} node
+ */
+export function locate_node(node) {
+	const loc = /** @type {Location} */ (locator(/** @type {number} */ (node.start)));
+	return `${sanitize_location(filename)}:${loc?.line}:${loc.column}`;
+}
+
 /** @type {NonNullable<CompileOptions['warningFilter']>} */
 export let warning_filter;
 
diff --git a/packages/svelte/src/internal/client/dev/assign.js b/packages/svelte/src/internal/client/dev/assign.js
index fc1b647f78..d9ef7497d5 100644
--- a/packages/svelte/src/internal/client/dev/assign.js
+++ b/packages/svelte/src/internal/client/dev/assign.js
@@ -1,6 +1,6 @@
+import { sanitize_location } from '../../../utils.js';
 import { untrack } from '../runtime.js';
 import * as w from '../warnings.js';
-import { sanitize_location } from './location.js';
 
 /**
  *
diff --git a/packages/svelte/src/internal/client/dev/location.js b/packages/svelte/src/internal/client/dev/location.js
deleted file mode 100644
index b2e16c371e..0000000000
--- a/packages/svelte/src/internal/client/dev/location.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import { DEV } from 'esm-env';
-import { FILENAME } from '../../../constants.js';
-import { dev_current_component_function } from '../runtime.js';
-
-/**
- *
- * @param {number} [line]
- * @param {number} [column]
- */
-export function get_location(line, column) {
-	if (!DEV || line === undefined) return undefined;
-
-	var filename = dev_current_component_function?.[FILENAME];
-	var location = filename && `${filename}:${line}:${column}`;
-
-	return sanitize_location(location);
-}
-
-/**
- * Prevent devtools trying to make `location` a clickable link by inserting a zero-width space
- * @param {string | undefined} location
- */
-export function sanitize_location(location) {
-	return location?.replace(/\//g, '/\u200b');
-}
diff --git a/packages/svelte/src/internal/client/dev/tracing.js b/packages/svelte/src/internal/client/dev/tracing.js
new file mode 100644
index 0000000000..1426e9efc9
--- /dev/null
+++ b/packages/svelte/src/internal/client/dev/tracing.js
@@ -0,0 +1,180 @@
+/** @import { Derived, Reaction, Signal, Value } from '#client' */
+import { UNINITIALIZED } from '../../../constants.js';
+import { snapshot } from '../../shared/clone.js';
+import { define_property } from '../../shared/utils.js';
+import { DERIVED, STATE_SYMBOL } from '../constants.js';
+import { effect_tracking } from '../reactivity/effects.js';
+import { active_reaction, captured_signals, set_captured_signals, untrack } from '../runtime.js';
+
+/** @type { any } */
+export let tracing_expressions = null;
+
+/**
+ * @param { Value } signal
+ * @param { { read: Error[] } } [entry]
+ */
+function log_entry(signal, entry) {
+	const debug = signal.debug;
+	const value = signal.v;
+
+	if (value === UNINITIALIZED) {
+		return;
+	}
+
+	if (debug) {
+		var previous_captured_signals = captured_signals;
+		var captured = new Set();
+		set_captured_signals(captured);
+		try {
+			untrack(() => {
+				debug();
+			});
+		} finally {
+			set_captured_signals(previous_captured_signals);
+		}
+		if (captured.size > 0) {
+			for (const dep of captured) {
+				log_entry(dep);
+			}
+			return;
+		}
+	}
+
+	const type = (signal.f & DERIVED) !== 0 ? '$derived' : '$state';
+	const current_reaction = /** @type {Reaction} */ (active_reaction);
+	const status =
+		signal.version > current_reaction.version || current_reaction.version === 0 ? 'dirty' : 'clean';
+
+	// eslint-disable-next-line no-console
+	console.groupCollapsed(
+		`%c${type}`,
+		status !== 'clean'
+			? 'color: CornflowerBlue; font-weight: bold'
+			: 'color: grey; font-weight: bold',
+		typeof value === 'object' && STATE_SYMBOL in value ? snapshot(value, true) : value
+	);
+
+	if (type === '$derived') {
+		const deps = new Set(/** @type {Derived} */ (signal).deps);
+		for (const dep of deps) {
+			log_entry(dep);
+		}
+	}
+
+	if (signal.created) {
+		// eslint-disable-next-line no-console
+		console.log(signal.created);
+	}
+
+	if (signal.updated) {
+		// eslint-disable-next-line no-console
+		console.log(signal.updated);
+	}
+
+	const read = entry?.read;
+
+	if (read && read.length > 0) {
+		for (var stack of read) {
+			// eslint-disable-next-line no-console
+			console.log(stack);
+		}
+	}
+
+	// eslint-disable-next-line no-console
+	console.groupEnd();
+}
+
+/**
+ * @template T
+ * @param {() => string} label
+ * @param {() => T} fn
+ */
+export function trace(label, fn) {
+	var previously_tracing_expressions = tracing_expressions;
+	try {
+		tracing_expressions = { entries: new Map(), reaction: active_reaction };
+
+		var start = performance.now();
+		var value = fn();
+		var time = (performance.now() - start).toFixed(2);
+
+		if (!effect_tracking()) {
+			// eslint-disable-next-line no-console
+			console.log(`${label()} %cran outside of an effect (${time}ms)`, 'color: grey');
+		} else if (tracing_expressions.entries.size === 0) {
+			// eslint-disable-next-line no-console
+			console.log(`${label()} %cno reactive dependencies (${time}ms)`, 'color: grey');
+		} else {
+			// eslint-disable-next-line no-console
+			console.group(`${label()} %c(${time}ms)`, 'color: grey');
+
+			var entries = tracing_expressions.entries;
+
+			tracing_expressions = null;
+
+			for (const [signal, entry] of entries) {
+				log_entry(signal, entry);
+			}
+			// eslint-disable-next-line no-console
+			console.groupEnd();
+		}
+
+		if (previously_tracing_expressions !== null) {
+			for (const [signal, entry] of tracing_expressions.entries) {
+				var prev_entry = previously_tracing_expressions.get(signal);
+
+				if (prev_entry === undefined) {
+					previously_tracing_expressions.set(signal, entry);
+				} else {
+					prev_entry.read.push(...entry.read);
+				}
+			}
+		}
+
+		return value;
+	} finally {
+		tracing_expressions = previously_tracing_expressions;
+	}
+}
+
+/**
+ * @param {string} label
+ */
+export function get_stack(label) {
+	let error = Error();
+	const stack = error.stack;
+
+	if (stack) {
+		const lines = stack.split('\n');
+		const new_lines = ['\n'];
+
+		for (let i = 0; i < lines.length; i++) {
+			const line = lines[i];
+
+			if (line === 'Error') {
+				continue;
+			}
+			if (line.includes('validate_each_keys')) {
+				return null;
+			}
+			if (line.includes('svelte/src/internal')) {
+				continue;
+			}
+			new_lines.push(line);
+		}
+
+		if (new_lines.length === 1) {
+			return null;
+		}
+
+		define_property(error, 'stack', {
+			value: new_lines.join('\n')
+		});
+
+		define_property(error, 'name', {
+			// 'Error' suffix is required for stack traces to be rendered properly
+			value: `${label}Error`
+		});
+	}
+	return error;
+}
diff --git a/packages/svelte/src/internal/client/dom/blocks/each.js b/packages/svelte/src/internal/client/dom/blocks/each.js
index d62c575391..9e64055940 100644
--- a/packages/svelte/src/internal/client/dom/blocks/each.js
+++ b/packages/svelte/src/internal/client/dom/blocks/each.js
@@ -36,6 +36,7 @@ import { array_from, is_array } from '../../../shared/utils.js';
 import { INERT } from '../../constants.js';
 import { queue_micro_task } from '../task.js';
 import { active_effect, active_reaction } from '../../runtime.js';
+import { DEV } from 'esm-env';
 
 /**
  * The row of a keyed each block that is currently updating. We track this
@@ -191,7 +192,18 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
 
 				var value = array[i];
 				var key = get_key(value, i);
-				item = create_item(hydrate_node, state, prev, null, value, key, i, render_fn, flags);
+				item = create_item(
+					hydrate_node,
+					state,
+					prev,
+					null,
+					value,
+					key,
+					i,
+					render_fn,
+					flags,
+					get_collection
+				);
 				state.items.set(key, item);
 
 				prev = item;
@@ -205,7 +217,16 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
 
 		if (!hydrating) {
 			var effect = /** @type {Effect} */ (active_reaction);
-			reconcile(array, state, anchor, render_fn, flags, (effect.f & INERT) !== 0, get_key);
+			reconcile(
+				array,
+				state,
+				anchor,
+				render_fn,
+				flags,
+				(effect.f & INERT) !== 0,
+				get_key,
+				get_collection
+			);
 		}
 
 		if (fallback_fn !== null) {
@@ -251,9 +272,10 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f
  * @param {number} flags
  * @param {boolean} is_inert
  * @param {(value: V, index: number) => any} get_key
+ * @param {() => V[]} get_collection
  * @returns {void}
  */
-function reconcile(array, state, anchor, render_fn, flags, is_inert, get_key) {
+function reconcile(array, state, anchor, render_fn, flags, is_inert, get_key, get_collection) {
 	var is_animated = (flags & EACH_IS_ANIMATED) !== 0;
 	var should_update = (flags & (EACH_ITEM_REACTIVE | EACH_INDEX_REACTIVE)) !== 0;
 
@@ -319,7 +341,8 @@ function reconcile(array, state, anchor, render_fn, flags, is_inert, get_key) {
 				key,
 				i,
 				render_fn,
-				flags
+				flags,
+				get_collection
 			);
 
 			items.set(key, prev);
@@ -486,9 +509,21 @@ function update_item(item, value, index, type) {
  * @param {number} index
  * @param {(anchor: Node, item: V | Source<V>, index: number | Value<number>) => void} render_fn
  * @param {number} flags
+ * @param {() => V[]} get_collection
  * @returns {EachItem}
  */
-function create_item(anchor, state, prev, next, value, key, index, render_fn, flags) {
+function create_item(
+	anchor,
+	state,
+	prev,
+	next,
+	value,
+	key,
+	index,
+	render_fn,
+	flags,
+	get_collection
+) {
 	var previous_each_item = current_each_item;
 	var reactive = (flags & EACH_ITEM_REACTIVE) !== 0;
 	var mutable = (flags & EACH_ITEM_IMMUTABLE) === 0;
@@ -496,6 +531,16 @@ function create_item(anchor, state, prev, next, value, key, index, render_fn, fl
 	var v = reactive ? (mutable ? mutable_source(value) : source(value)) : value;
 	var i = (flags & EACH_INDEX_REACTIVE) === 0 ? index : source(index);
 
+	if (DEV && reactive) {
+		// For tracing purposes, we need to link the source signal we create with the
+		// collection + index so that tracing works as intended
+		/** @type {Value} */ (v).debug = () => {
+			var collection_index = typeof i === 'number' ? index : i.v;
+			// eslint-disable-next-line @typescript-eslint/no-unused-expressions
+			get_collection()[collection_index];
+		};
+	}
+
 	/** @type {EachItem} */
 	var item = {
 		i,
diff --git a/packages/svelte/src/internal/client/dom/blocks/html.js b/packages/svelte/src/internal/client/dom/blocks/html.js
index 2f815b454e..04ab0aee87 100644
--- a/packages/svelte/src/internal/client/dom/blocks/html.js
+++ b/packages/svelte/src/internal/client/dom/blocks/html.js
@@ -5,11 +5,10 @@ import { hydrate_next, hydrate_node, hydrating, set_hydrate_node } from '../hydr
 import { create_fragment_from_html } from '../reconciler.js';
 import { assign_nodes } from '../template.js';
 import * as w from '../../warnings.js';
-import { hash } from '../../../../utils.js';
+import { hash, sanitize_location } from '../../../../utils.js';
 import { DEV } from 'esm-env';
 import { dev_current_component_function } from '../../runtime.js';
 import { get_first_child, get_next_sibling } from '../operations.js';
-import { sanitize_location } from '../../dev/location.js';
 
 /**
  * @param {Element} element
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index b706e52a53..f22c33babc 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -12,6 +12,7 @@ export {
 	skip_ownership_validation
 } from './dev/ownership.js';
 export { check_target, legacy_api } from './dev/legacy.js';
+export { trace } from './dev/tracing.js';
 export { inspect } from './dev/inspect.js';
 export { await_block as await } from './dom/blocks/await.js';
 export { if_block as if } from './dom/blocks/if.js';
diff --git a/packages/svelte/src/internal/client/proxy.js b/packages/svelte/src/internal/client/proxy.js
index a8fd18c0dd..d74f55866f 100644
--- a/packages/svelte/src/internal/client/proxy.js
+++ b/packages/svelte/src/internal/client/proxy.js
@@ -13,6 +13,7 @@ import { source, set } from './reactivity/sources.js';
 import { STATE_SYMBOL, STATE_SYMBOL_METADATA } from './constants.js';
 import { UNINITIALIZED } from '../../constants.js';
 import * as e from './errors.js';
+import { get_stack } from './dev/tracing.js';
 
 /**
  * @template T
@@ -22,6 +23,11 @@ import * as e from './errors.js';
  * @returns {T}
  */
 export function proxy(value, parent = null, prev) {
+	/** @type {Error | null} */
+	var stack = null;
+	if (DEV) {
+		stack = get_stack('CreatedAt');
+	}
 	// if non-proxyable, or is already a proxy, return `value`
 	if (typeof value !== 'object' || value === null || STATE_SYMBOL in value) {
 		return value;
@@ -41,7 +47,7 @@ export function proxy(value, parent = null, prev) {
 	if (is_proxied_array) {
 		// We need to create the length source eagerly to ensure that
 		// mutations to the array are properly synced with our proxy
-		sources.set('length', source(/** @type {any[]} */ (value).length));
+		sources.set('length', source(/** @type {any[]} */ (value).length, stack));
 	}
 
 	/** @type {ProxyMetadata} */
@@ -87,7 +93,7 @@ export function proxy(value, parent = null, prev) {
 			var s = sources.get(prop);
 
 			if (s === undefined) {
-				s = source(descriptor.value);
+				s = source(descriptor.value, stack);
 				sources.set(prop, s);
 			} else {
 				set(s, proxy(descriptor.value, metadata));
@@ -101,7 +107,7 @@ export function proxy(value, parent = null, prev) {
 
 			if (s === undefined) {
 				if (prop in target) {
-					sources.set(prop, source(UNINITIALIZED));
+					sources.set(prop, source(UNINITIALIZED, stack));
 				}
 			} else {
 				// When working with arrays, we need to also ensure we update the length when removing
@@ -135,7 +141,7 @@ export function proxy(value, parent = null, prev) {
 
 			// create a source, but only if it's an own property and not a prototype property
 			if (s === undefined && (!exists || get_descriptor(target, prop)?.writable)) {
-				s = source(proxy(exists ? target[prop] : UNINITIALIZED, metadata));
+				s = source(proxy(exists ? target[prop] : UNINITIALIZED, metadata), stack);
 				sources.set(prop, s);
 			}
 
@@ -203,7 +209,7 @@ export function proxy(value, parent = null, prev) {
 				(active_effect !== null && (!has || get_descriptor(target, prop)?.writable))
 			) {
 				if (s === undefined) {
-					s = source(has ? proxy(target[prop], metadata) : UNINITIALIZED);
+					s = source(has ? proxy(target[prop], metadata) : UNINITIALIZED, stack);
 					sources.set(prop, s);
 				}
 
@@ -230,7 +236,7 @@ export function proxy(value, parent = null, prev) {
 						// If the item exists in the original, we need to create a uninitialized source,
 						// else a later read of the property would result in a source being created with
 						// the value of the original item at that index.
-						other_s = source(UNINITIALIZED);
+						other_s = source(UNINITIALIZED, stack);
 						sources.set(i + '', other_s);
 					}
 				}
@@ -242,7 +248,7 @@ export function proxy(value, parent = null, prev) {
 			// object property before writing to that property.
 			if (s === undefined) {
 				if (!has || get_descriptor(target, prop)?.writable) {
-					s = source(undefined);
+					s = source(undefined, stack);
 					set(s, proxy(value, metadata));
 					sources.set(prop, s);
 				}
diff --git a/packages/svelte/src/internal/client/reactivity/deriveds.js b/packages/svelte/src/internal/client/reactivity/deriveds.js
index a679d307c4..8c1a3a652b 100644
--- a/packages/svelte/src/internal/client/reactivity/deriveds.js
+++ b/packages/svelte/src/internal/client/reactivity/deriveds.js
@@ -24,6 +24,7 @@ import { equals, safe_equals } from './equality.js';
 import * as e from '../errors.js';
 import { destroy_effect } from './effects.js';
 import { inspect_effects, set_inspect_effects } from './sources.js';
+import { get_stack } from '../dev/tracing.js';
 
 /**
  * @template V
@@ -61,6 +62,10 @@ export function derived(fn) {
 		parent: parent_derived ?? active_effect
 	};
 
+	if (DEV) {
+		signal.created = get_stack('CreatedAt');
+	}
+
 	if (parent_derived !== null) {
 		(parent_derived.children ??= []).push(signal);
 	}
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index 05c210978d..bf890627f7 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -1,4 +1,4 @@
-/** @import { ComponentContext, ComponentContextLegacy, Derived, Effect, Reaction, TemplateNode, TransitionManager } from '#client' */
+/** @import { ComponentContext, ComponentContextLegacy, Derived, Effect, TemplateNode, TransitionManager } from '#client' */
 import {
 	check_dirtiness,
 	component_context,
@@ -16,8 +16,7 @@ import {
 	set_is_flushing_effect,
 	set_signal_status,
 	untrack,
-	skip_reaction,
-	capture_signals
+	skip_reaction
 } from '../runtime.js';
 import {
 	DIRTY,
@@ -40,13 +39,10 @@ import {
 } from '../constants.js';
 import { set } from './sources.js';
 import * as e from '../errors.js';
-import * as w from '../warnings.js';
 import { DEV } from 'esm-env';
 import { define_property } from '../../shared/utils.js';
 import { get_next_sibling } from '../dom/operations.js';
 import { destroy_derived } from './deriveds.js';
-import { FILENAME } from '../../../constants.js';
-import { get_location } from '../dev/location.js';
 
 /**
  * @param {'$effect' | '$effect.pre' | '$inspect'} rune
diff --git a/packages/svelte/src/internal/client/reactivity/sources.js b/packages/svelte/src/internal/client/reactivity/sources.js
index 4bbd470d08..24dd837772 100644
--- a/packages/svelte/src/internal/client/reactivity/sources.js
+++ b/packages/svelte/src/internal/client/reactivity/sources.js
@@ -33,6 +33,7 @@ import {
 } from '../constants.js';
 import * as e from '../errors.js';
 import { legacy_mode_flag } from '../../flags/index.js';
+import { get_stack } from '../dev/tracing.js';
 
 export let inspect_effects = new Set();
 
@@ -46,16 +47,25 @@ export function set_inspect_effects(v) {
 /**
  * @template V
  * @param {V} v
+ * @param {Error | null} [stack]
  * @returns {Source<V>}
  */
-export function source(v) {
-	return {
+export function source(v, stack) {
+	/** @type {Value} */
+	var signal = {
 		f: 0, // TODO ideally we could skip this altogether, but it causes type errors
 		v,
 		reactions: null,
 		equals,
 		version: 0
 	};
+
+	if (DEV) {
+		signal.created = stack ?? get_stack('CreatedAt');
+		signal.debug = null;
+	}
+
+	return signal;
 }
 
 /**
@@ -160,6 +170,10 @@ export function internal_set(source, value) {
 		source.v = value;
 		source.version = increment_version();
 
+		if (DEV) {
+			source.updated = get_stack('UpdatedAt');
+		}
+
 		mark_reactions(source, DIRTY);
 
 		// If the current signal is running for the first time, it won't have any
diff --git a/packages/svelte/src/internal/client/reactivity/types.d.ts b/packages/svelte/src/internal/client/reactivity/types.d.ts
index 395070fedd..13e14414b5 100644
--- a/packages/svelte/src/internal/client/reactivity/types.d.ts
+++ b/packages/svelte/src/internal/client/reactivity/types.d.ts
@@ -14,6 +14,10 @@ export interface Value<V = unknown> extends Signal {
 	equals: Equals;
 	/** The latest value for this signal */
 	v: V;
+	/** Dev only */
+	created?: Error | null;
+	updated?: Error | null;
+	debug?: null | (() => void);
 }
 
 export interface Reaction extends Signal {
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 5d53ca3360..ff8eaa8ef9 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -35,6 +35,7 @@ import * as e from './errors.js';
 import { lifecycle_outside_component } from '../shared/errors.js';
 import { FILENAME } from '../../constants.js';
 import { legacy_mode_flag } from '../flags/index.js';
+import { tracing_expressions, get_stack } from './dev/tracing.js';
 
 const FLUSH_MICROTASK = 0;
 const FLUSH_SYNC = 1;
@@ -136,6 +137,11 @@ export let skip_reaction = false;
 /** @type {Set<Value> | null} */
 export let captured_signals = null;
 
+/** @param {Set<Value> | null} value */
+export function set_captured_signals(value) {
+	captured_signals = value;
+}
+
 // Handling runtime component context
 /** @type {ComponentContext | null} */
 export let component_context = null;
@@ -356,7 +362,7 @@ export function handle_error(error, effect, previous_effect, component_context)
 			new_lines.push(line);
 		}
 		define_property(error, 'stack', {
-			value: error.stack + new_lines.join('\n')
+			value: new_lines.join('\n')
 		});
 	}
 
@@ -908,6 +914,27 @@ export function get(signal) {
 		}
 	}
 
+	if (
+		DEV &&
+		tracing_expressions !== null &&
+		active_reaction !== null &&
+		tracing_expressions.reaction === active_reaction
+	) {
+		// Used when mapping state between special blocks like `each`
+		if (signal.debug) {
+			signal.debug();
+		} else if (signal.created) {
+			var entry = tracing_expressions.entries.get(signal);
+
+			if (entry === undefined) {
+				entry = { read: [] };
+				tracing_expressions.entries.set(signal, entry);
+			}
+
+			entry.read.push(get_stack('TracedAt'));
+		}
+	}
+
 	return signal.v;
 }
 
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index 9324408007..e42721b4f4 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -431,6 +431,7 @@ const RUNES = /** @type {const} */ ([
 	'$effect.root',
 	'$inspect',
 	'$inspect().with',
+	'$inspect.trace',
 	'$host'
 ]);
 
@@ -449,3 +450,11 @@ const RAW_TEXT_ELEMENTS = /** @type {const} */ (['textarea', 'script', 'style',
 export function is_raw_text_element(name) {
 	return RAW_TEXT_ELEMENTS.includes(/** @type {RAW_TEXT_ELEMENTS[number]} */ (name));
 }
+
+/**
+ * Prevent devtools trying to make `location` a clickable link by inserting a zero-width space
+ * @param {string | undefined} location
+ */
+export function sanitize_location(location) {
+	return location?.replace(/\//g, '/\u200b');
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/_config.js
new file mode 100644
index 0000000000..7bb71adafb
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/_config.js
@@ -0,0 +1,19 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	async test({ assert, target, logs }) {
+		assert.deepEqual(logs, []);
+
+		const [b1, b2] = target.querySelectorAll('button');
+		b1.click();
+		b2.click();
+		await Promise.resolve();
+
+		assert.ok(logs[0].stack.startsWith('Error:') && logs[0].stack.includes('HTMLButtonElement.'));
+		assert.deepEqual(logs[1], 1);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/main.svelte
new file mode 100644
index 0000000000..d42742c5b5
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-console-trace/main.svelte
@@ -0,0 +1,11 @@
+<script>
+	let x = $state(0);
+	let y = $state(0);
+
+	$inspect(x).with((type, x) => {
+		if (type === 'update') console.log(new Error(), x);
+	});
+</script>
+
+<button on:click={() => x++}>{x}</button>
+<button on:click={() => y++}>{y}</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
index 7bb71adafb..517e11d74e 100644
--- a/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
@@ -1,19 +1,41 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
+/**
+ * @param {any[]} logs
+ */
+function normalise_trace_logs(logs) {
+	let normalised = [];
+	for (let i = 0; i < logs.length; i++) {
+		const log = logs[i];
+
+		if (typeof log === 'string' && log.includes('%c')) {
+			const split = log.split('%c');
+			normalised.push((split[0].length !== 0 ? split[0] : split[1]).trim());
+			i++;
+		} else if (log instanceof Error) {
+			continue;
+		} else {
+			normalised.push(log);
+		}
+	}
+	return normalised;
+}
+
 export default test({
 	compileOptions: {
 		dev: true
 	},
 
-	async test({ assert, target, logs }) {
-		assert.deepEqual(logs, []);
+	test({ assert, target, logs }) {
+		assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 0, '$state', 0]);
+
+		logs.length = 0;
 
-		const [b1, b2] = target.querySelectorAll('button');
-		b1.click();
-		b2.click();
-		await Promise.resolve();
+		const button = target.querySelector('button');
+		button?.click();
+		flushSync();
 
-		assert.ok(logs[0].stack.startsWith('Error:') && logs[0].stack.includes('HTMLButtonElement.'));
-		assert.deepEqual(logs[1], 1);
+		assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 2, '$state', 1]);
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
index d42742c5b5..99c30a07bf 100644
--- a/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
@@ -1,11 +1,12 @@
 <script>
-	let x = $state(0);
-	let y = $state(0);
+	let count = $state(0);
+	let double = $derived(count * 2);
 
-	$inspect(x).with((type, x) => {
-		if (type === 'update') console.log(new Error(), x);
-	});
+	$effect(() => {
+		$inspect.trace('effect');
+
+		double;
+	})
 </script>
 
-<button on:click={() => x++}>{x}</button>
-<button on:click={() => y++}>{y}</button>
+<button onclick={() => count++}>{double}</button>
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index dca0fd99f0..671f68bff7 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -3029,6 +3029,25 @@ declare function $inspect<T extends any[]>(
 	...values: T
 ): { with: (fn: (type: 'init' | 'update', ...values: T) => void) => void };
 
+declare namespace $inspect {
+	/**
+	 * Tracks which reactive state changes caused an effect to re-run. Must be the first
+	 * statement of a function body. Example:
+	 *
+	 * ```svelte
+	 * <script>
+	 *   let count = $state(0);
+	 *
+	 *   $effect(() => {
+	 *     $inspect.trace('my effect');
+	 *
+	 *     count;
+	 *   });
+	 * </script>
+	 */
+	export function trace(name: string): void;
+}
+
 /**
  * Retrieves the `this` reference of the custom element that contains this component. Example:
  *

From bbf38291fcd860319c7eb225f3f942188c1d97bd Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 15 Dec 2024 09:22:56 -0500
Subject: [PATCH 335/404] Version Packages (#14715)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/tame-ants-peel.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-ants-peel.md

diff --git a/.changeset/tame-ants-peel.md b/.changeset/tame-ants-peel.md
deleted file mode 100644
index ed7a69f8cc..0000000000
--- a/.changeset/tame-ants-peel.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: adds $inspect.trace rune
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index cce58f7b54..09e21aec84 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.14.0
+
+### Minor Changes
+
+- feat: adds $inspect.trace rune ([#14290](https://github.com/sveltejs/svelte/pull/14290))
+
 ## 5.13.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 24fa9c91b9..27e78e681e 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.13.0",
+  "version": "5.14.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 4b1927606a..4d4d7e6e86 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.13.0';
+export const VERSION = '5.14.0';
 export const PUBLIC_VERSION = '5';

From 699dc6e4f7bb9c47d19a5d7200d57bd06b6c8c09 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 16 Dec 2024 20:05:08 +0000
Subject: [PATCH 336/404] fix: improve unowned derived performance (#14724)

* fix: improve unowned derived performance

* fix: improve unowned derived performance

* changeset
---
 .changeset/many-worms-attend.md                | 5 +++++
 packages/svelte/src/internal/client/runtime.js | 5 +++--
 2 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/many-worms-attend.md

diff --git a/.changeset/many-worms-attend.md b/.changeset/many-worms-attend.md
new file mode 100644
index 0000000000..0da3699967
--- /dev/null
+++ b/.changeset/many-worms-attend.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: improve unowned derived performance
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index ff8eaa8ef9..27e174d3aa 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -230,8 +230,9 @@ export function check_dirtiness(reaction) {
 			}
 		}
 
-		// Unowned signals should never be marked as clean.
-		if (!is_unowned) {
+		// Unowned signals should never be marked as clean unless they
+		// are used within an active_effect without skip_reaction
+		if (!is_unowned || (active_effect !== null && !skip_reaction)) {
 			set_signal_status(reaction, CLEAN);
 		}
 	}

From e0e999055d1e019a928947dbcb837f6df495e51d Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 16 Dec 2024 20:13:46 +0000
Subject: [PATCH 337/404] Version Packages (#14728)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/many-worms-attend.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/many-worms-attend.md

diff --git a/.changeset/many-worms-attend.md b/.changeset/many-worms-attend.md
deleted file mode 100644
index 0da3699967..0000000000
--- a/.changeset/many-worms-attend.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: improve unowned derived performance
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 09e21aec84..598d75ca9b 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.14.1
+
+### Patch Changes
+
+- fix: improve unowned derived performance ([#14724](https://github.com/sveltejs/svelte/pull/14724))
+
 ## 5.14.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 27e78e681e..db861eced2 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.14.0",
+  "version": "5.14.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 4d4d7e6e86..78ec824169 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.14.0';
+export const VERSION = '5.14.1';
 export const PUBLIC_VERSION = '5';

From 36d73cad55cacd6f2db43c6c83186005cd1da072 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 17 Dec 2024 16:14:10 +0100
Subject: [PATCH 338/404] fix: correctly highlight first rerun of
 `$inspect.trace` (#14734)

---
 .changeset/tame-eggs-work.md                  |  5 ++
 .../svelte/src/internal/client/runtime.js     |  4 +-
 .../samples/inspect-trace/_config.js          | 64 +++++++++++++++++--
 .../samples/inspect-trace/main.svelte         |  6 +-
 4 files changed, 72 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/tame-eggs-work.md

diff --git a/.changeset/tame-eggs-work.md b/.changeset/tame-eggs-work.md
new file mode 100644
index 0000000000..2c1c59de4a
--- /dev/null
+++ b/.changeset/tame-eggs-work.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly highlight first rerun of `$inspect.trace`
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 27e174d3aa..4aa3d17a15 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -127,8 +127,8 @@ export function set_untracked_writes(value) {
 	untracked_writes = value;
 }
 
-/** @type {number} Used by sources and deriveds for handling updates to unowned deriveds */
-let current_version = 0;
+/** @type {number} Used by sources and deriveds for handling updates to unowned deriveds it starts from 1 to differentiate between a created effect and a run one for tracing */
+let current_version = 1;
 
 // If we are working with a get() chain that has no active container,
 // to prevent memory leaks, we skip adding the reaction.
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
index 517e11d74e..efa5985e4e 100644
--- a/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
@@ -11,12 +11,15 @@ function normalise_trace_logs(logs) {
 
 		if (typeof log === 'string' && log.includes('%c')) {
 			const split = log.split('%c');
-			normalised.push((split[0].length !== 0 ? split[0] : split[1]).trim());
+			normalised.push({
+				log: (split[0].length !== 0 ? split[0] : split[1]).trim(),
+				highlighted: logs[i + 1] === 'color: CornflowerBlue; font-weight: bold'
+			});
 			i++;
 		} else if (log instanceof Error) {
 			continue;
 		} else {
-			normalised.push(log);
+			normalised.push({ log });
 		}
 	}
 	return normalised;
@@ -28,7 +31,17 @@ export default test({
 	},
 
 	test({ assert, target, logs }) {
-		assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 0, '$state', 0]);
+		// initial log, everything is highlighted
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$derived', highlighted: true },
+			{ log: 0 },
+			{ log: '$state', highlighted: true },
+			{ log: 0 },
+			{ log: '$state', highlighted: true },
+			{ log: false }
+		]);
 
 		logs.length = 0;
 
@@ -36,6 +49,49 @@ export default test({
 		button?.click();
 		flushSync();
 
-		assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 2, '$state', 1]);
+		// count changed, derived and state are highlighted, last state is not
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$derived', highlighted: true },
+			{ log: 2 },
+			{ log: '$state', highlighted: true },
+			{ log: 1 },
+			{ log: '$state', highlighted: false },
+			{ log: false }
+		]);
+
+		logs.length = 0;
+
+		const input = target.querySelector('input');
+		input?.click();
+		flushSync();
+
+		// checked changed, last state is highlighted, first two are not
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$derived', highlighted: false },
+			{ log: 2 },
+			{ log: '$state', highlighted: false },
+			{ log: 1 },
+			{ log: '$state', highlighted: true },
+			{ log: true }
+		]);
+
+		logs.length = 0;
+
+		button?.click();
+		flushSync();
+
+		// count change and derived it's >=4, checked is not in the dependencies anymore
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$derived', highlighted: true },
+			{ log: 4 },
+			{ log: '$state', highlighted: true },
+			{ log: 2 }
+		]);
 	}
 });
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
index 99c30a07bf..99f246aa73 100644
--- a/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
@@ -2,11 +2,15 @@
 	let count = $state(0);
 	let double = $derived(count * 2);
 
+	let checked = $state(false);
+
 	$effect(() => {
 		$inspect.trace('effect');
 
 		double;
-	})
+		double >= 4 || checked;
+	});
 </script>
 
 <button onclick={() => count++}>{double}</button>
+<input type="checkbox" bind:checked />

From 3146e93bbb34fff06dad9c87c9fd53b3865896f7 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 17 Dec 2024 16:53:33 +0100
Subject: [PATCH 339/404] chore: loose parser improvements (#14733)

* handle invalid expression inside each key

* handle invalid expression inside each expression

* handle invalid expression inside await block

* handle "in the middle of typing" components with starting lowercase and dot at the end

* changeset
---
 .changeset/tiny-kings-serve.md                |   5 +
 .../phases/1-parse/read/expression.js         |   5 +-
 .../compiler/phases/1-parse/state/element.js  |   9 +-
 .../src/compiler/phases/1-parse/state/tag.js  |  55 +++-
 .../compiler/phases/1-parse/utils/bracket.js  |   5 +
 .../loose-invalid-expression/input.svelte     |  12 +
 .../loose-invalid-expression/output.json      | 268 +++++++++++++++++-
 .../samples/loose-unclosed-tag/input.svelte   |   8 +
 .../samples/loose-unclosed-tag/output.json    | 146 +++++++---
 .../loose-invalid-expression/input.svelte     |  12 +
 .../loose-invalid-expression/output.json      | 234 ++++++++++++++-
 .../samples/loose-unclosed-tag/input.svelte   |   8 +
 .../samples/loose-unclosed-tag/output.json    | 168 ++++++++---
 13 files changed, 836 insertions(+), 99 deletions(-)
 create mode 100644 .changeset/tiny-kings-serve.md

diff --git a/.changeset/tiny-kings-serve.md b/.changeset/tiny-kings-serve.md
new file mode 100644
index 0000000000..b883767132
--- /dev/null
+++ b/.changeset/tiny-kings-serve.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: more loose parser improvements
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 021bd95a6e..907608b11b 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/expression.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/expression.js
@@ -7,9 +7,10 @@ import { find_matching_bracket } from '../utils/bracket.js';
 
 /**
  * @param {Parser} parser
+ * @param {string} [opening_token]
  * @returns {Expression}
  */
-export default function read_expression(parser) {
+export default function read_expression(parser, opening_token) {
 	try {
 		const node = parse_expression_at(parser.template, parser.ts, parser.index);
 
@@ -42,7 +43,7 @@ export default function read_expression(parser) {
 	} 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, '{');
+			const end = find_matching_bracket(parser.template, parser.index, opening_token ?? '{');
 			if (end) {
 				const start = parser.index;
 				parser.index = end;
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 c112cf6789..66946a8f8d 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/element.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/element.js
@@ -123,8 +123,11 @@ export default function element(parser) {
 	}
 
 	if (!regex_valid_element_name.test(name) && !regex_valid_component_name.test(name)) {
-		const bounds = { start: start + 1, end: start + 1 + name.length };
-		e.tag_invalid_name(bounds);
+		// <div. -> in the middle of typing -> allow in loose mode
+		if (!parser.loose || !name.endsWith('.')) {
+			const bounds = { start: start + 1, end: start + 1 + name.length };
+			e.tag_invalid_name(bounds);
+		}
 	}
 
 	if (root_only_meta_tags.has(name)) {
@@ -141,7 +144,7 @@ export default function element(parser) {
 
 	const type = meta_tags.has(name)
 		? meta_tags.get(name)
-		: regex_valid_component_name.test(name)
+		: regex_valid_component_name.test(name) || (parser.loose && name.endsWith('.'))
 			? 'Component'
 			: name === 'title' && parent_is_head(parser.stack)
 				? 'TitleElement'
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 423ada792c..7996d64ded 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -174,13 +174,30 @@ function open(parser) {
 		if (parser.eat('(')) {
 			parser.allow_whitespace();
 
-			key = read_expression(parser);
+			key = read_expression(parser, '(');
 			parser.allow_whitespace();
 			parser.eat(')', true);
 			parser.allow_whitespace();
 		}
 
-		parser.eat('}', true);
+		const matches = parser.eat('}', true, false);
+
+		if (!matches) {
+			// Parser may have read the `as` as part of the expression (e.g. in `{#each foo. as x}`)
+			if (parser.template.slice(parser.index - 4, parser.index) === ' as ') {
+				const prev_index = parser.index;
+				context = read_pattern(parser);
+				parser.eat('}', true);
+				expression = {
+					type: 'Identifier',
+					name: '',
+					start: expression.start,
+					end: prev_index - 4
+				};
+			} else {
+				parser.eat('}', true); // rerun to produce the parser error
+			}
+		}
 
 		/** @type {AST.EachBlock} */
 		const block = parser.append({
@@ -246,7 +263,39 @@ function open(parser) {
 			parser.fragments.push(block.pending);
 		}
 
-		parser.eat('}', true);
+		const matches = parser.eat('}', true, false);
+
+		// Parser may have read the `then/catch` as part of the expression (e.g. in `{#await foo. then x}`)
+		if (!matches) {
+			if (parser.template.slice(parser.index - 6, parser.index) === ' then ') {
+				const prev_index = parser.index;
+				block.value = read_pattern(parser);
+				parser.eat('}', true);
+				block.expression = {
+					type: 'Identifier',
+					name: '',
+					start: expression.start,
+					end: prev_index - 6
+				};
+				block.then = block.pending;
+				block.pending = null;
+			} else if (parser.template.slice(parser.index - 7, parser.index) === ' catch ') {
+				const prev_index = parser.index;
+				block.error = read_pattern(parser);
+				parser.eat('}', true);
+				block.expression = {
+					type: 'Identifier',
+					name: '',
+					start: expression.start,
+					end: prev_index - 7
+				};
+				block.catch = block.pending;
+				block.pending = null;
+			} else {
+				parser.eat('}', true); // rerun to produce the parser error
+			}
+		}
+
 		parser.stack.push(block);
 
 		return;
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 4e02f06de6..e7576af955 100644
--- a/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
+++ b/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
@@ -4,6 +4,8 @@ const SQUARE_BRACKET_OPEN = '['.charCodeAt(0);
 const SQUARE_BRACKET_CLOSE = ']'.charCodeAt(0);
 const CURLY_BRACKET_OPEN = '{'.charCodeAt(0);
 const CURLY_BRACKET_CLOSE = '}'.charCodeAt(0);
+const PARENTHESES_OPEN = '('.charCodeAt(0);
+const PARENTHESES_CLOSE = ')'.charCodeAt(0);
 
 /** @param {number} code */
 export function is_bracket_open(code) {
@@ -34,6 +36,9 @@ export function get_bracket_close(open) {
 	if (open === CURLY_BRACKET_OPEN) {
 		return CURLY_BRACKET_CLOSE;
 	}
+	if (open === PARENTHESES_OPEN) {
+		return PARENTHESES_CLOSE;
+	}
 }
 
 /**
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
index a0977b9a63..b64f15c5c1 100644
--- a/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
@@ -9,3 +9,15 @@
 
 asd{a.}asd
 {foo[bar.]}
+
+{#if x.}{/if}
+
+{#each array as item (item.)}{/each}
+
+{#each obj. as item}{/each}
+
+{#await x.}{/await}
+
+{#await x. then y}{/await}
+
+{#await x. catch y}{/await}
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
index d27b6cd914..0564d6d295 100644
--- a/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
+++ b/packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
@@ -2,7 +2,7 @@
 	"html": {
 		"type": "Fragment",
 		"start": 0,
-		"end": 164,
+		"end": 324,
 		"children": [
 			{
 				"type": "Element",
@@ -236,6 +236,272 @@
 					"end": 163,
 					"name": ""
 				}
+			},
+			{
+				"type": "Text",
+				"start": 164,
+				"end": 166,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 166,
+				"end": 179,
+				"expression": {
+					"type": "Identifier",
+					"start": 171,
+					"end": 173,
+					"name": ""
+				},
+				"children": []
+			},
+			{
+				"type": "Text",
+				"start": 179,
+				"end": 181,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 181,
+				"end": 217,
+				"children": [],
+				"context": {
+					"type": "Identifier",
+					"name": "item",
+					"start": 197,
+					"loc": {
+						"start": {
+							"line": 15,
+							"column": 16,
+							"character": 197
+						},
+						"end": {
+							"line": 15,
+							"column": 20,
+							"character": 201
+						}
+					},
+					"end": 201
+				},
+				"expression": {
+					"type": "Identifier",
+					"start": 188,
+					"end": 193,
+					"loc": {
+						"start": {
+							"line": 15,
+							"column": 7
+						},
+						"end": {
+							"line": 15,
+							"column": 12
+						}
+					},
+					"name": "array"
+				},
+				"key": {
+					"type": "Identifier",
+					"start": 203,
+					"end": 208,
+					"name": ""
+				}
+			},
+			{
+				"type": "Text",
+				"start": 217,
+				"end": 219,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 219,
+				"end": 246,
+				"children": [],
+				"context": {
+					"type": "Identifier",
+					"name": "item",
+					"start": 234,
+					"loc": {
+						"start": {
+							"line": 17,
+							"column": 15,
+							"character": 234
+						},
+						"end": {
+							"line": 17,
+							"column": 19,
+							"character": 238
+						}
+					},
+					"end": 238
+				},
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 226,
+					"end": 230
+				}
+			},
+			{
+				"type": "Text",
+				"start": 246,
+				"end": 248,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 248,
+				"end": 267,
+				"expression": {
+					"type": "Identifier",
+					"start": 256,
+					"end": 258,
+					"name": ""
+				},
+				"value": null,
+				"error": null,
+				"pending": {
+					"type": "PendingBlock",
+					"start": 259,
+					"end": 259,
+					"children": [],
+					"skip": false
+				},
+				"then": {
+					"type": "ThenBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				},
+				"catch": {
+					"type": "CatchBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				}
+			},
+			{
+				"type": "Text",
+				"start": 267,
+				"end": 269,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 269,
+				"end": 295,
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 277,
+					"end": 279
+				},
+				"value": {
+					"type": "Identifier",
+					"name": "y",
+					"start": 285,
+					"loc": {
+						"start": {
+							"line": 21,
+							"column": 16,
+							"character": 285
+						},
+						"end": {
+							"line": 21,
+							"column": 17,
+							"character": 286
+						}
+					},
+					"end": 286
+				},
+				"error": null,
+				"pending": {
+					"type": "PendingBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				},
+				"then": {
+					"type": "ThenBlock",
+					"start": 287,
+					"end": 267,
+					"children": [],
+					"skip": false
+				},
+				"catch": {
+					"type": "CatchBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				}
+			},
+			{
+				"type": "Text",
+				"start": 295,
+				"end": 297,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 297,
+				"end": 324,
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 305,
+					"end": 307
+				},
+				"value": null,
+				"error": {
+					"type": "Identifier",
+					"name": "y",
+					"start": 314,
+					"loc": {
+						"start": {
+							"line": 23,
+							"column": 17,
+							"character": 314
+						},
+						"end": {
+							"line": 23,
+							"column": 18,
+							"character": 315
+						}
+					},
+					"end": 315
+				},
+				"pending": {
+					"type": "PendingBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				},
+				"then": {
+					"type": "ThenBlock",
+					"start": null,
+					"end": null,
+					"children": [],
+					"skip": true
+				},
+				"catch": {
+					"type": "CatchBlock",
+					"start": 316,
+					"end": 295,
+					"children": [],
+					"skip": false
+				}
 			}
 		]
 	}
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
index 10a3876b7c..83017c79aa 100644
--- a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
@@ -10,6 +10,14 @@
 	<span
 </div>
 
+<div>
+	<Comp.
+</div>
+
+<div>
+	<comp.
+</div>
+
 {#if foo}
 	<div>
 {/if}
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
index d91cc68098..2205a00e20 100644
--- a/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
+++ b/packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
@@ -2,7 +2,7 @@
 	"html": {
 		"type": "Fragment",
 		"start": 0,
-		"end": 160,
+		"end": 204,
 		"children": [
 			{
 				"type": "Element",
@@ -136,20 +136,82 @@
 				"data": "\n\n"
 			},
 			{
-				"type": "IfBlock",
+				"type": "Element",
 				"start": 74,
+				"end": 94,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 79,
+						"end": 81,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "InlineComponent",
+						"start": 81,
+						"end": 88,
+						"name": "Comp.",
+						"attributes": [],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 94,
 				"end": 96,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "Element",
+				"start": 96,
+				"end": 116,
+				"name": "div",
+				"attributes": [],
+				"children": [
+					{
+						"type": "Text",
+						"start": 101,
+						"end": 103,
+						"raw": "\n\t",
+						"data": "\n\t"
+					},
+					{
+						"type": "InlineComponent",
+						"start": 103,
+						"end": 110,
+						"name": "comp.",
+						"attributes": [],
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "Text",
+				"start": 116,
+				"end": 118,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"start": 118,
+				"end": 140,
 				"expression": {
 					"type": "Identifier",
-					"start": 79,
-					"end": 82,
+					"start": 123,
+					"end": 126,
 					"loc": {
 						"start": {
-							"line": 13,
+							"line": 21,
 							"column": 5
 						},
 						"end": {
-							"line": 13,
+							"line": 21,
 							"column": 8
 						}
 					},
@@ -158,15 +220,15 @@
 				"children": [
 					{
 						"type": "Element",
-						"start": 85,
-						"end": 91,
+						"start": 129,
+						"end": 135,
 						"name": "div",
 						"attributes": [],
 						"children": [
 							{
 								"type": "Text",
-								"start": 90,
-								"end": 91,
+								"start": 134,
+								"end": 135,
 								"raw": "\n",
 								"data": "\n"
 							}
@@ -176,26 +238,26 @@
 			},
 			{
 				"type": "Text",
-				"start": 96,
-				"end": 98,
+				"start": 140,
+				"end": 142,
 				"raw": "\n\n",
 				"data": "\n\n"
 			},
 			{
 				"type": "IfBlock",
-				"start": 98,
-				"end": 130,
+				"start": 142,
+				"end": 174,
 				"expression": {
 					"type": "Identifier",
-					"start": 103,
-					"end": 106,
+					"start": 147,
+					"end": 150,
 					"loc": {
 						"start": {
-							"line": 17,
+							"line": 25,
 							"column": 5
 						},
 						"end": {
-							"line": 17,
+							"line": 25,
 							"column": 8
 						}
 					},
@@ -204,31 +266,31 @@
 				"children": [
 					{
 						"type": "InlineComponent",
-						"start": 109,
-						"end": 125,
+						"start": 153,
+						"end": 169,
 						"name": "Comp",
 						"attributes": [
 							{
 								"type": "Attribute",
-								"start": 115,
-								"end": 124,
+								"start": 159,
+								"end": 168,
 								"name": "foo",
 								"value": [
 									{
 										"type": "MustacheTag",
-										"start": 119,
-										"end": 124,
+										"start": 163,
+										"end": 168,
 										"expression": {
 											"type": "Identifier",
-											"start": 120,
-											"end": 123,
+											"start": 164,
+											"end": 167,
 											"loc": {
 												"start": {
-													"line": 18,
+													"line": 26,
 													"column": 12
 												},
 												"end": {
-													"line": 18,
+													"line": 26,
 													"column": 15
 												}
 											},
@@ -244,36 +306,36 @@
 			},
 			{
 				"type": "Text",
-				"start": 130,
-				"end": 132,
+				"start": 174,
+				"end": 176,
 				"raw": "\n\n",
 				"data": "\n\n"
 			},
 			{
 				"type": "Element",
-				"start": 132,
-				"end": 160,
+				"start": 176,
+				"end": 204,
 				"name": "div",
 				"attributes": [],
 				"children": [
 					{
 						"type": "Text",
-						"start": 137,
-						"end": 138,
+						"start": 181,
+						"end": 182,
 						"raw": "\n",
 						"data": "\n"
 					},
 					{
 						"type": "Element",
-						"start": 138,
-						"end": 147,
+						"start": 182,
+						"end": 191,
 						"name": "p",
 						"attributes": [],
 						"children": [
 							{
 								"type": "Text",
-								"start": 141,
-								"end": 143,
+								"start": 185,
+								"end": 187,
 								"raw": "hi",
 								"data": "hi"
 							}
@@ -281,15 +343,15 @@
 					},
 					{
 						"type": "Text",
-						"start": 147,
-						"end": 149,
+						"start": 191,
+						"end": 193,
 						"raw": "\n\n",
 						"data": "\n\n"
 					},
 					{
 						"type": "Element",
-						"start": 149,
-						"end": 160,
+						"start": 193,
+						"end": 204,
 						"name": "open-ended",
 						"attributes": [],
 						"children": []
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
index a0977b9a63..b64f15c5c1 100644
--- a/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
@@ -9,3 +9,15 @@
 
 asd{a.}asd
 {foo[bar.]}
+
+{#if x.}{/if}
+
+{#each array as item (item.)}{/each}
+
+{#each obj. as item}{/each}
+
+{#await x.}{/await}
+
+{#await x. then y}{/await}
+
+{#await x. catch y}{/await}
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
index cdb7f66c58..56fa4286dd 100644
--- a/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
+++ b/packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
@@ -2,7 +2,7 @@
 	"css": null,
 	"js": [],
 	"start": 0,
-	"end": 164,
+	"end": 324,
 	"type": "Root",
 	"fragment": {
 		"type": "Fragment",
@@ -247,6 +247,238 @@
 					"end": 163,
 					"name": ""
 				}
+			},
+			{
+				"type": "Text",
+				"start": 164,
+				"end": 166,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 166,
+				"end": 179,
+				"test": {
+					"type": "Identifier",
+					"start": 171,
+					"end": 173,
+					"name": ""
+				},
+				"consequent": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"alternate": null
+			},
+			{
+				"type": "Text",
+				"start": 179,
+				"end": 181,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 181,
+				"end": 217,
+				"expression": {
+					"type": "Identifier",
+					"start": 188,
+					"end": 193,
+					"loc": {
+						"start": {
+							"line": 15,
+							"column": 7
+						},
+						"end": {
+							"line": 15,
+							"column": 12
+						}
+					},
+					"name": "array"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "Identifier",
+					"name": "item",
+					"start": 197,
+					"loc": {
+						"start": {
+							"line": 15,
+							"column": 16,
+							"character": 197
+						},
+						"end": {
+							"line": 15,
+							"column": 20,
+							"character": 201
+						}
+					},
+					"end": 201
+				},
+				"key": {
+					"type": "Identifier",
+					"start": 203,
+					"end": 208,
+					"name": ""
+				}
+			},
+			{
+				"type": "Text",
+				"start": 217,
+				"end": 219,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 219,
+				"end": 246,
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 226,
+					"end": 230
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "Identifier",
+					"name": "item",
+					"start": 234,
+					"loc": {
+						"start": {
+							"line": 17,
+							"column": 15,
+							"character": 234
+						},
+						"end": {
+							"line": 17,
+							"column": 19,
+							"character": 238
+						}
+					},
+					"end": 238
+				}
+			},
+			{
+				"type": "Text",
+				"start": 246,
+				"end": 248,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 248,
+				"end": 267,
+				"expression": {
+					"type": "Identifier",
+					"start": 256,
+					"end": 258,
+					"name": ""
+				},
+				"value": null,
+				"error": null,
+				"pending": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"then": null,
+				"catch": null
+			},
+			{
+				"type": "Text",
+				"start": 267,
+				"end": 269,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 269,
+				"end": 295,
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 277,
+					"end": 279
+				},
+				"value": {
+					"type": "Identifier",
+					"name": "y",
+					"start": 285,
+					"loc": {
+						"start": {
+							"line": 21,
+							"column": 16,
+							"character": 285
+						},
+						"end": {
+							"line": 21,
+							"column": 17,
+							"character": 286
+						}
+					},
+					"end": 286
+				},
+				"error": null,
+				"pending": null,
+				"then": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"catch": null
+			},
+			{
+				"type": "Text",
+				"start": 295,
+				"end": 297,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "AwaitBlock",
+				"start": 297,
+				"end": 324,
+				"expression": {
+					"type": "Identifier",
+					"name": "",
+					"start": 305,
+					"end": 307
+				},
+				"value": null,
+				"error": {
+					"type": "Identifier",
+					"name": "y",
+					"start": 314,
+					"loc": {
+						"start": {
+							"line": 23,
+							"column": 17,
+							"character": 314
+						},
+						"end": {
+							"line": 23,
+							"column": 18,
+							"character": 315
+						}
+					},
+					"end": 315
+				},
+				"pending": null,
+				"then": null,
+				"catch": {
+					"type": "Fragment",
+					"nodes": []
+				}
 			}
 		]
 	},
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
index 10a3876b7c..83017c79aa 100644
--- a/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
@@ -10,6 +10,14 @@
 	<span
 </div>
 
+<div>
+	<Comp.
+</div>
+
+<div>
+	<comp.
+</div>
+
 {#if foo}
 	<div>
 {/if}
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
index ec47bfc738..cf9138c026 100644
--- a/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json
+++ b/packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json
@@ -2,7 +2,7 @@
 	"css": null,
 	"js": [],
 	"start": 0,
-	"end": 160,
+	"end": 204,
 	"type": "Root",
 	"fragment": {
 		"type": "Fragment",
@@ -155,21 +155,95 @@
 				"data": "\n\n"
 			},
 			{
-				"type": "IfBlock",
-				"elseif": false,
+				"type": "RegularElement",
 				"start": 74,
+				"end": 94,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 79,
+							"end": 81,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 81,
+							"end": 88,
+							"name": "Comp.",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 94,
 				"end": 96,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "RegularElement",
+				"start": 96,
+				"end": 116,
+				"name": "div",
+				"attributes": [],
+				"fragment": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 101,
+							"end": 103,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "Component",
+							"start": 103,
+							"end": 110,
+							"name": "comp.",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": []
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 116,
+				"end": 118,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "IfBlock",
+				"elseif": false,
+				"start": 118,
+				"end": 140,
 				"test": {
 					"type": "Identifier",
-					"start": 79,
-					"end": 82,
+					"start": 123,
+					"end": 126,
 					"loc": {
 						"start": {
-							"line": 13,
+							"line": 21,
 							"column": 5
 						},
 						"end": {
-							"line": 13,
+							"line": 21,
 							"column": 8
 						}
 					},
@@ -180,15 +254,15 @@
 					"nodes": [
 						{
 							"type": "Text",
-							"start": 83,
-							"end": 85,
+							"start": 127,
+							"end": 129,
 							"raw": "\n\t",
 							"data": "\n\t"
 						},
 						{
 							"type": "RegularElement",
-							"start": 85,
-							"end": 91,
+							"start": 129,
+							"end": 135,
 							"name": "div",
 							"attributes": [],
 							"fragment": {
@@ -196,8 +270,8 @@
 								"nodes": [
 									{
 										"type": "Text",
-										"start": 90,
-										"end": 91,
+										"start": 134,
+										"end": 135,
 										"raw": "\n",
 										"data": "\n"
 									}
@@ -210,27 +284,27 @@
 			},
 			{
 				"type": "Text",
-				"start": 96,
-				"end": 98,
+				"start": 140,
+				"end": 142,
 				"raw": "\n\n",
 				"data": "\n\n"
 			},
 			{
 				"type": "IfBlock",
 				"elseif": false,
-				"start": 98,
-				"end": 130,
+				"start": 142,
+				"end": 174,
 				"test": {
 					"type": "Identifier",
-					"start": 103,
-					"end": 106,
+					"start": 147,
+					"end": 150,
 					"loc": {
 						"start": {
-							"line": 17,
+							"line": 25,
 							"column": 5
 						},
 						"end": {
-							"line": 17,
+							"line": 25,
 							"column": 8
 						}
 					},
@@ -241,37 +315,37 @@
 					"nodes": [
 						{
 							"type": "Text",
-							"start": 107,
-							"end": 109,
+							"start": 151,
+							"end": 153,
 							"raw": "\n\t",
 							"data": "\n\t"
 						},
 						{
 							"type": "Component",
-							"start": 109,
-							"end": 125,
+							"start": 153,
+							"end": 169,
 							"name": "Comp",
 							"attributes": [
 								{
 									"type": "Attribute",
-									"start": 115,
-									"end": 124,
+									"start": 159,
+									"end": 168,
 									"name": "foo",
 									"value": {
 										"type": "ExpressionTag",
-										"start": 119,
-										"end": 124,
+										"start": 163,
+										"end": 168,
 										"expression": {
 											"type": "Identifier",
-											"start": 120,
-											"end": 123,
+											"start": 164,
+											"end": 167,
 											"loc": {
 												"start": {
-													"line": 18,
+													"line": 26,
 													"column": 12
 												},
 												"end": {
-													"line": 18,
+													"line": 26,
 													"column": 15
 												}
 											},
@@ -291,15 +365,15 @@
 			},
 			{
 				"type": "Text",
-				"start": 130,
-				"end": 132,
+				"start": 174,
+				"end": 176,
 				"raw": "\n\n",
 				"data": "\n\n"
 			},
 			{
 				"type": "RegularElement",
-				"start": 132,
-				"end": 160,
+				"start": 176,
+				"end": 204,
 				"name": "div",
 				"attributes": [],
 				"fragment": {
@@ -307,15 +381,15 @@
 					"nodes": [
 						{
 							"type": "Text",
-							"start": 137,
-							"end": 138,
+							"start": 181,
+							"end": 182,
 							"raw": "\n",
 							"data": "\n"
 						},
 						{
 							"type": "RegularElement",
-							"start": 138,
-							"end": 147,
+							"start": 182,
+							"end": 191,
 							"name": "p",
 							"attributes": [],
 							"fragment": {
@@ -323,8 +397,8 @@
 								"nodes": [
 									{
 										"type": "Text",
-										"start": 141,
-										"end": 143,
+										"start": 185,
+										"end": 187,
 										"raw": "hi",
 										"data": "hi"
 									}
@@ -333,15 +407,15 @@
 						},
 						{
 							"type": "Text",
-							"start": 147,
-							"end": 149,
+							"start": 191,
+							"end": 193,
 							"raw": "\n\n",
 							"data": "\n\n"
 						},
 						{
 							"type": "RegularElement",
-							"start": 149,
-							"end": 160,
+							"start": 193,
+							"end": 204,
 							"name": "open-ended",
 							"attributes": [],
 							"fragment": {

From 5529ad241fd2d6b7adbc95a38ebd9765d3943ac3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 17 Dec 2024 10:56:24 -0500
Subject: [PATCH 340/404] Version Packages (#14735)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/tame-eggs-work.md   | 5 -----
 .changeset/tiny-kings-serve.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/tame-eggs-work.md
 delete mode 100644 .changeset/tiny-kings-serve.md

diff --git a/.changeset/tame-eggs-work.md b/.changeset/tame-eggs-work.md
deleted file mode 100644
index 2c1c59de4a..0000000000
--- a/.changeset/tame-eggs-work.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly highlight first rerun of `$inspect.trace`
diff --git a/.changeset/tiny-kings-serve.md b/.changeset/tiny-kings-serve.md
deleted file mode 100644
index b883767132..0000000000
--- a/.changeset/tiny-kings-serve.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: more loose parser improvements
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 598d75ca9b..0b187be338 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.14.2
+
+### Patch Changes
+
+- fix: correctly highlight first rerun of `$inspect.trace` ([#14734](https://github.com/sveltejs/svelte/pull/14734))
+
+- chore: more loose parser improvements ([#14733](https://github.com/sveltejs/svelte/pull/14733))
+
 ## 5.14.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index db861eced2..a6eb2f4a8a 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.14.1",
+  "version": "5.14.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 78ec824169..c43155a159 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.14.1';
+export const VERSION = '5.14.2';
 export const PUBLIC_VERSION = '5';

From d7e4bd2c665f22daac82a4b80cbc973d9a54d92c Mon Sep 17 00:00:00 2001
From: joakim <joakim@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:46:40 +0100
Subject: [PATCH 341/404] Link to migration guide from <svelte:component>
 documentation (#14737)

---
 documentation/docs/99-legacy/30-legacy-svelte-component.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/documentation/docs/99-legacy/30-legacy-svelte-component.md b/documentation/docs/99-legacy/30-legacy-svelte-component.md
index 5d385a9c02..3da2e3350e 100644
--- a/documentation/docs/99-legacy/30-legacy-svelte-component.md
+++ b/documentation/docs/99-legacy/30-legacy-svelte-component.md
@@ -2,7 +2,7 @@
 title: <svelte:component>
 ---
 
-In runes mode, `<MyComponent>` will re-render if the value of `MyComponent` changes.
+In runes mode, `<MyComponent>` will re-render if the value of `MyComponent` changes. See the [Svelte 5 migration guide](/docs/svelte/v5-migration-guide#Breaking-changes-in-runes-mode-svelte:component-is-no-longer-necessary) for an example.
 
 In legacy mode, it won't — we must use `<svelte:component>`, which destroys and recreates the component instance when the value of its `this` expression changes:
 

From 36a437c2f9a4ac4b10d5f6f1bead546fa7fcbd88 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 17 Dec 2024 13:04:16 -0500
Subject: [PATCH 342/404] fix: compare array contents for equality mismatch
 detections, not the arrays themselves (#14738)

---
 .changeset/tasty-deers-agree.md               |  5 +++
 .../src/internal/client/dev/equality.js       | 33 +++++++--------
 .../state-proxy-equality-mismatch/_config.js  | 41 +++++++++++++++++++
 .../state-proxy-equality-mismatch/main.svelte | 23 +++++++++++
 4 files changed, 84 insertions(+), 18 deletions(-)
 create mode 100644 .changeset/tasty-deers-agree.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/main.svelte

diff --git a/.changeset/tasty-deers-agree.md b/.changeset/tasty-deers-agree.md
new file mode 100644
index 0000000000..92901c199c
--- /dev/null
+++ b/.changeset/tasty-deers-agree.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: compare array contents for equality mismatch detections, not the arrays themselves
diff --git a/packages/svelte/src/internal/client/dev/equality.js b/packages/svelte/src/internal/client/dev/equality.js
index 170f7baf95..bbc28dc638 100644
--- a/packages/svelte/src/internal/client/dev/equality.js
+++ b/packages/svelte/src/internal/client/dev/equality.js
@@ -17,10 +17,11 @@ export function init_array_prototype_warnings() {
 		const index = indexOf.call(this, item, from_index);
 
 		if (index === -1) {
-			const test = indexOf.call(get_proxied_value(this), get_proxied_value(item), from_index);
-
-			if (test !== -1) {
-				w.state_proxy_equality_mismatch('array.indexOf(...)');
+			for (let i = from_index ?? 0; i < this.length; i += 1) {
+				if (get_proxied_value(this[i]) === item) {
+					w.state_proxy_equality_mismatch('array.indexOf(...)');
+					break;
+				}
 			}
 		}
 
@@ -33,16 +34,11 @@ export function init_array_prototype_warnings() {
 		const index = lastIndexOf.call(this, item, from_index ?? this.length - 1);
 
 		if (index === -1) {
-			// we need to specify this.length - 1 because it's probably using something like
-			// `arguments` inside so passing undefined is different from not passing anything
-			const test = lastIndexOf.call(
-				get_proxied_value(this),
-				get_proxied_value(item),
-				from_index ?? this.length - 1
-			);
-
-			if (test !== -1) {
-				w.state_proxy_equality_mismatch('array.lastIndexOf(...)');
+			for (let i = 0; i <= (from_index ?? this.length - 1); i += 1) {
+				if (get_proxied_value(this[i]) === item) {
+					w.state_proxy_equality_mismatch('array.lastIndexOf(...)');
+					break;
+				}
 			}
 		}
 
@@ -53,10 +49,11 @@ export function init_array_prototype_warnings() {
 		const has = includes.call(this, item, from_index);
 
 		if (!has) {
-			const test = includes.call(get_proxied_value(this), get_proxied_value(item), from_index);
-
-			if (test) {
-				w.state_proxy_equality_mismatch('array.includes(...)');
+			for (let i = 0; i < this.length; i += 1) {
+				if (get_proxied_value(this[i]) === item) {
+					w.state_proxy_equality_mismatch('array.includes(...)');
+					break;
+				}
 			}
 		}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/_config.js b/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/_config.js
new file mode 100644
index 0000000000..0fb086c8e0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/_config.js
@@ -0,0 +1,41 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	async test({ assert, target, warnings }) {
+		const [btn1, btn2, btn3, btn4, btn5, btn6, clear] = target.querySelectorAll('button');
+
+		flushSync(() => {
+			btn1.click();
+			btn2.click();
+			btn3.click();
+			btn4.click();
+			btn5.click();
+			btn6.click();
+		});
+
+		assert.deepEqual(warnings, [
+			'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.includes(...)` will produce unexpected results',
+			'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.indexOf(...)` will produce unexpected results',
+			'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.lastIndexOf(...)` will produce unexpected results'
+		]);
+
+		flushSync(() => clear.click());
+		warnings.length = 0;
+
+		flushSync(() => {
+			btn1.click();
+			btn2.click();
+			btn3.click();
+			btn4.click();
+			btn5.click();
+			btn6.click();
+		});
+
+		assert.deepEqual(warnings, []);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/main.svelte b/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/main.svelte
new file mode 100644
index 0000000000..1b7bf444f1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/main.svelte
@@ -0,0 +1,23 @@
+<script>
+	let primitive = 'foo';
+	let object = {};
+
+	let array = $state([primitive, object]);
+</script>
+
+<button onclick={() => array.includes(primitive)}>array.includes(primitive)</button>
+<button onclick={() => array.includes(object)}>array.includes(object)</button>
+
+<hr />
+
+<button onclick={() => array.indexOf(primitive)}>array.indexOf(primitive)</button>
+<button onclick={() => array.indexOf(object)}>array.indexOf(object)</button>
+
+<hr />
+
+<button onclick={() => array.lastIndexOf(primitive)}>array.lastIndexOf(primitive)</button>
+<button onclick={() => array.lastIndexOf(object)}>array.lastIndexOf(object)</button>
+
+<hr />
+
+<button onclick={() => (array.length = 0)}>clear</button>

From c033dae04915d5dd83c0e174c6b0b6bc7bdf85ec Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 17 Dec 2024 20:20:57 -0500
Subject: [PATCH 343/404] fix: bump esrap, prevent malformed AST (#14742)

* bump esrap, start fixing stuff

* ignore type exports when looking for undefineds

* sanitize stuff

* changeset

* fix

* oops

* try this?

* prettier
---
 .changeset/purple-donuts-talk.md              |  5 +++++
 packages/svelte/package.json                  |  2 +-
 .../phases/1-parse/remove_typescript_nodes.js | 21 +++++++++----------
 .../src/compiler/phases/2-analyze/index.js    | 10 ++++++++-
 .../src/compiler/phases/3-transform/index.js  |  4 ++++
 packages/svelte/src/compiler/phases/scope.js  |  6 ++++++
 .../samples/typescript/main.svelte            |  2 +-
 packages/svelte/tsconfig.json                 |  6 +++++-
 pnpm-lock.yaml                                | 12 +++++------
 9 files changed, 47 insertions(+), 21 deletions(-)
 create mode 100644 .changeset/purple-donuts-talk.md

diff --git a/.changeset/purple-donuts-talk.md b/.changeset/purple-donuts-talk.md
new file mode 100644
index 0000000000..2bb348cd19
--- /dev/null
+++ b/.changeset/purple-donuts-talk.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: bump esrap, prevent malformed AST
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index a6eb2f4a8a..6603fe9b42 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -147,7 +147,7 @@
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
     "esm-env": "^1.2.1",
-    "esrap": "^1.2.3",
+    "esrap": "^1.3.1",
     "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
     "magic-string": "^0.30.11",
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index b968e95213..5e4fa231de 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -17,6 +17,16 @@ function remove_this_param(node, context) {
 
 /** @type {Visitors<any, null>} */
 const visitors = {
+	_(node, context) {
+		context.next();
+
+		// TODO there may come a time when we decide to preserve type annotations.
+		// until that day comes, we just delete them so they don't confuse esrap
+		delete node.typeAnnotation;
+		delete node.typeParameters;
+		delete node.returnType;
+		delete node.accessibility;
+	},
 	Decorator(node) {
 		e.typescript_invalid_feature(node, 'decorators (related TSC proposal is not stage 4 yet)');
 	},
@@ -78,23 +88,12 @@ const visitors = {
 	TSNonNullExpression(node, context) {
 		return context.visit(node.expression);
 	},
-	TSTypeAnnotation() {
-		// This isn't correct, strictly speaking, and could result in invalid ASTs (like an empty statement within function parameters),
-		// but esrap, our printing tool, just ignores these AST nodes at invalid positions, so it's fine
-		return b.empty;
-	},
 	TSInterfaceDeclaration() {
 		return b.empty;
 	},
 	TSTypeAliasDeclaration() {
 		return b.empty;
 	},
-	TSTypeParameterDeclaration() {
-		return b.empty;
-	},
-	TSTypeParameterInstantiation() {
-		return b.empty;
-	},
 	TSEnumDeclaration(node) {
 		e.typescript_invalid_feature(node, 'enums');
 	},
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 042e88fa2f..d17cc34a5f 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -698,8 +698,16 @@ export function analyze_component(root, source, options) {
 	}
 
 	for (const node of analysis.module.ast.body) {
-		if (node.type === 'ExportNamedDeclaration' && node.specifiers !== null && node.source == null) {
+		if (
+			node.type === 'ExportNamedDeclaration' &&
+			// @ts-expect-error
+			node.exportKind !== 'type' &&
+			node.specifiers !== null &&
+			node.source == null
+		) {
 			for (const specifier of node.specifiers) {
+				// @ts-expect-error
+				if (specifier.exportKind === 'type') continue;
 				if (specifier.local.type !== 'Identifier') continue;
 
 				const binding = analysis.module.scope.get(specifier.local.name);
diff --git a/packages/svelte/src/compiler/phases/3-transform/index.js b/packages/svelte/src/compiler/phases/3-transform/index.js
index 8f6597ee12..d0739d6cc4 100644
--- a/packages/svelte/src/compiler/phases/3-transform/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/index.js
@@ -33,12 +33,15 @@ export function transform_component(analysis, source, options) {
 			: client_component(analysis, options);
 
 	const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte');
+
+	// @ts-expect-error
 	const js = print(program, {
 		// include source content; makes it easier/more robust looking up the source map code
 		// (else esrap does return null for source and sourceMapContent which may trip up tooling)
 		sourceMapContent: source,
 		sourceMapSource: js_source_name
 	});
+
 	merge_with_preprocessor_map(js, options, js_source_name);
 
 	const css =
@@ -92,6 +95,7 @@ export function transform_module(analysis, source, options) {
 	}
 
 	return {
+		// @ts-expect-error
 		js: print(program, {
 			// include source content; makes it easier/more robust looking up the source map code
 			// (else esrap does return null for source and sourceMapContent which may trip up tooling)
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 3536dd6a18..20dcfa2821 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -433,7 +433,13 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 		},
 
 		ImportDeclaration(node, { state }) {
+			// @ts-expect-error
+			if (node.importKind === 'type') return;
+
 			for (const specifier of node.specifiers) {
+				// @ts-expect-error
+				if (specifier.importKind === 'type') continue;
+
 				state.scope.declare(specifier.local, 'normal', 'import', node);
 			}
 		},
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index 3b98dafa05..cc31350601 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -24,7 +24,7 @@
 
 	declare module 'foobar' {}
 	namespace SomeNamespace {
-		export type Foo = true
+		export type Foo = true;
 	}
 
 	export function overload(a: boolean): boolean;
diff --git a/packages/svelte/tsconfig.json b/packages/svelte/tsconfig.json
index 380307901e..c9f0fb3b2b 100644
--- a/packages/svelte/tsconfig.json
+++ b/packages/svelte/tsconfig.json
@@ -40,5 +40,9 @@
 		"./tests/runtime-browser/test-ssr.ts",
 		"./tests/*/samples/*/_config.js"
 	],
-	"exclude": ["./scripts/process-messages/templates/", "./src/compiler/optimizer/"]
+	"exclude": [
+		"./scripts/process-messages/templates/",
+		"./scripts/_bundle.js",
+		"./src/compiler/optimizer/"
+	]
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 250a03744e..1de6883a48 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -84,8 +84,8 @@ importers:
         specifier: ^1.2.1
         version: 1.2.1
       esrap:
-        specifier: ^1.2.3
-        version: 1.2.3
+        specifier: ^1.3.1
+        version: 1.3.1
       is-reference:
         specifier: ^3.0.3
         version: 3.0.3
@@ -1111,8 +1111,8 @@ packages:
     resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
     engines: {node: '>=0.10'}
 
-  esrap@1.2.3:
-    resolution: {integrity: sha512-ZlQmCCK+n7SGoqo7DnfKaP1sJZa49P01/dXzmjCASSo04p72w8EksT2NMK8CEX8DhKsfJXANioIw8VyHNsBfvQ==}
+  esrap@1.3.1:
+    resolution: {integrity: sha512-KpAH3+QsDmtOP1KOW04CbD1PgzWsIHjB8tOCk3PCb8xzNGn8XkjI8zl80i09fmXdzQyaS8tcsKCCDzHF7AcowA==}
 
   esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@@ -3315,10 +3315,10 @@ snapshots:
     dependencies:
       estraverse: 5.3.0
 
-  esrap@1.2.3:
+  esrap@1.3.1:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
-      '@types/estree': 1.0.6
+      '@typescript-eslint/types': 8.2.0
 
   esrecurse@4.3.0:
     dependencies:

From 00ff60e8d562d5f8397104072d9e8a7faece01d8 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 17 Dec 2024 20:22:44 -0500
Subject: [PATCH 344/404] Version Packages (#14740)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/purple-donuts-talk.md | 5 -----
 .changeset/tasty-deers-agree.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/purple-donuts-talk.md
 delete mode 100644 .changeset/tasty-deers-agree.md

diff --git a/.changeset/purple-donuts-talk.md b/.changeset/purple-donuts-talk.md
deleted file mode 100644
index 2bb348cd19..0000000000
--- a/.changeset/purple-donuts-talk.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: bump esrap, prevent malformed AST
diff --git a/.changeset/tasty-deers-agree.md b/.changeset/tasty-deers-agree.md
deleted file mode 100644
index 92901c199c..0000000000
--- a/.changeset/tasty-deers-agree.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: compare array contents for equality mismatch detections, not the arrays themselves
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 0b187be338..4dd1cb994b 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.14.3
+
+### Patch Changes
+
+- fix: bump esrap, prevent malformed AST ([#14742](https://github.com/sveltejs/svelte/pull/14742))
+
+- fix: compare array contents for equality mismatch detections, not the arrays themselves ([#14738](https://github.com/sveltejs/svelte/pull/14738))
+
 ## 5.14.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6603fe9b42..dabe70eecc 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.14.2",
+  "version": "5.14.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c43155a159..7458849459 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.14.2';
+export const VERSION = '5.14.3';
 export const PUBLIC_VERSION = '5';

From e38975eac9dc883ef00ab75230a0ffc7eb01d7e3 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 17 Dec 2024 22:18:00 -0500
Subject: [PATCH 345/404] fix: remove unwanted properties from both replaced
 and unreplaced nodes (#14744)

---
 .changeset/famous-mugs-rhyme.md                        |  5 +++++
 .../compiler/phases/1-parse/remove_typescript_nodes.js | 10 +++++-----
 2 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/famous-mugs-rhyme.md

diff --git a/.changeset/famous-mugs-rhyme.md b/.changeset/famous-mugs-rhyme.md
new file mode 100644
index 0000000000..433d1024df
--- /dev/null
+++ b/.changeset/famous-mugs-rhyme.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove unwanted properties from both replaced and unreplaced nodes
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index 5e4fa231de..96639829bb 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -18,14 +18,14 @@ function remove_this_param(node, context) {
 /** @type {Visitors<any, null>} */
 const visitors = {
 	_(node, context) {
-		context.next();
+		const n = context.next() ?? node;
 
 		// TODO there may come a time when we decide to preserve type annotations.
 		// until that day comes, we just delete them so they don't confuse esrap
-		delete node.typeAnnotation;
-		delete node.typeParameters;
-		delete node.returnType;
-		delete node.accessibility;
+		delete n.typeAnnotation;
+		delete n.typeParameters;
+		delete n.returnType;
+		delete n.accessibility;
 	},
 	Decorator(node) {
 		e.typescript_invalid_feature(node, 'decorators (related TSC proposal is not stage 4 yet)');

From c79b909458b6265a18cc554dd2affd832b9797af Mon Sep 17 00:00:00 2001
From: Taku Fukada <naninunenor@gmail.com>
Date: Wed, 18 Dec 2024 18:15:49 +0900
Subject: [PATCH 346/404] fix: remove 'implements' from class declaration
 (#14749)

* fix: remove implements from class declaration

* add a smoke test
---
 .changeset/calm-maps-cover.md                                | 5 +++++
 .../src/compiler/phases/1-parse/remove_typescript_nodes.js   | 1 +
 .../samples/typescript-class-and-interface/_config.js        | 3 +++
 .../samples/typescript-class-and-interface/main.svelte       | 5 +++++
 4 files changed, 14 insertions(+)
 create mode 100644 .changeset/calm-maps-cover.md
 create mode 100644 packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
 create mode 100644 packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte

diff --git a/.changeset/calm-maps-cover.md b/.changeset/calm-maps-cover.md
new file mode 100644
index 0000000000..b7bd449c1a
--- /dev/null
+++ b/.changeset/calm-maps-cover.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove implements from class declarations
diff --git a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
index 96639829bb..18c805128d 100644
--- a/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
+++ b/packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
@@ -115,6 +115,7 @@ const visitors = {
 		if (node.declare) {
 			return b.empty;
 		}
+		delete node.implements;
 		return context.next();
 	},
 	VariableDeclaration(node, context) {
diff --git a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
new file mode 100644
index 0000000000..4e8f43d5db
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
@@ -0,0 +1,3 @@
+import { test } from '../../assert';
+
+export default test({});
diff --git a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte
new file mode 100644
index 0000000000..3d58f1072d
--- /dev/null
+++ b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+  // TypeScript syntax should not cause compilation failure
+  interface MyInterface {}
+  class MyClass implements MyInterface {}
+</script>
\ No newline at end of file

From 2bfdd1b436d767b20c896117992757b229263324 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 18 Dec 2024 10:47:17 +0100
Subject: [PATCH 347/404] Version Packages (#14745)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/calm-maps-cover.md   | 5 -----
 .changeset/famous-mugs-rhyme.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/calm-maps-cover.md
 delete mode 100644 .changeset/famous-mugs-rhyme.md

diff --git a/.changeset/calm-maps-cover.md b/.changeset/calm-maps-cover.md
deleted file mode 100644
index b7bd449c1a..0000000000
--- a/.changeset/calm-maps-cover.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove implements from class declarations
diff --git a/.changeset/famous-mugs-rhyme.md b/.changeset/famous-mugs-rhyme.md
deleted file mode 100644
index 433d1024df..0000000000
--- a/.changeset/famous-mugs-rhyme.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove unwanted properties from both replaced and unreplaced nodes
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 4dd1cb994b..47a67006c1 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.14.4
+
+### Patch Changes
+
+- fix: remove implements from class declarations ([#14749](https://github.com/sveltejs/svelte/pull/14749))
+
+- fix: remove unwanted properties from both replaced and unreplaced nodes ([#14744](https://github.com/sveltejs/svelte/pull/14744))
+
 ## 5.14.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index dabe70eecc..1b3df47bdf 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.14.3",
+  "version": "5.14.4",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 7458849459..e6f7bd2716 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.14.3';
+export const VERSION = '5.14.4';
 export const PUBLIC_VERSION = '5';

From 88a15cd7064f04732f1f616a6bf7964de2b0631c Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 18 Dec 2024 17:22:05 +0100
Subject: [PATCH 348/404] chore: TS fixes cleanup (#14750)

* chore: TS fixes cleanup

- move a test
- revert seemginly unnecessary code changes

* add another test
---
 packages/svelte/src/compiler/phases/2-analyze/index.js | 10 +---------
 packages/svelte/src/compiler/phases/scope.js           |  6 ------
 .../samples/typescript-class-and-interface/_config.js  |  3 ---
 .../samples/typescript-class-and-interface/main.svelte |  5 -----
 .../tests/runtime-runes/samples/typescript/main.svelte |  6 ++++++
 5 files changed, 7 insertions(+), 23 deletions(-)
 delete mode 100644 packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
 delete mode 100644 packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte

diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index d17cc34a5f..042e88fa2f 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -698,16 +698,8 @@ export function analyze_component(root, source, options) {
 	}
 
 	for (const node of analysis.module.ast.body) {
-		if (
-			node.type === 'ExportNamedDeclaration' &&
-			// @ts-expect-error
-			node.exportKind !== 'type' &&
-			node.specifiers !== null &&
-			node.source == null
-		) {
+		if (node.type === 'ExportNamedDeclaration' && node.specifiers !== null && node.source == null) {
 			for (const specifier of node.specifiers) {
-				// @ts-expect-error
-				if (specifier.exportKind === 'type') continue;
 				if (specifier.local.type !== 'Identifier') continue;
 
 				const binding = analysis.module.scope.get(specifier.local.name);
diff --git a/packages/svelte/src/compiler/phases/scope.js b/packages/svelte/src/compiler/phases/scope.js
index 20dcfa2821..3536dd6a18 100644
--- a/packages/svelte/src/compiler/phases/scope.js
+++ b/packages/svelte/src/compiler/phases/scope.js
@@ -433,13 +433,7 @@ export function create_scopes(ast, root, allow_reactive_declarations, parent) {
 		},
 
 		ImportDeclaration(node, { state }) {
-			// @ts-expect-error
-			if (node.importKind === 'type') return;
-
 			for (const specifier of node.specifiers) {
-				// @ts-expect-error
-				if (specifier.importKind === 'type') continue;
-
 				state.scope.declare(specifier.local, 'normal', 'import', node);
 			}
 		},
diff --git a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
deleted file mode 100644
index 4e8f43d5db..0000000000
--- a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/_config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import { test } from '../../assert';
-
-export default test({});
diff --git a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte b/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte
deleted file mode 100644
index 3d58f1072d..0000000000
--- a/packages/svelte/tests/runtime-browser/samples/typescript-class-and-interface/main.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script lang="ts">
-  // TypeScript syntax should not cause compilation failure
-  interface MyInterface {}
-  class MyClass implements MyInterface {}
-</script>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
index cc31350601..cd23b31096 100644
--- a/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
@@ -8,6 +8,10 @@
 		console.log(this);
 	}
 
+	function foo(): string {
+		return ""!;
+	}
+
 	class Foo<T> {
 		public name: string;
 		x = 'x' as const;
@@ -16,6 +20,8 @@
 		}
 	}
 
+	class MyClass implements Hello {}
+
 	declare const declared_const: number;
 	declare function declared_fn(): void;
 	declare class declared_class {

From bfa0b3466375b5cf4c979884d9f77fe21c678966 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 18 Dec 2024 16:48:16 -0500
Subject: [PATCH 349/404] add self-closing-tags info (#14758)

* add self-closing-tags info

* regenerate
---
 .../.generated/compile-warnings.md            | 26 +++++++++++++++++++
 .../messages/compile-warnings/template.md     | 26 +++++++++++++++++++
 2 files changed, 52 insertions(+)

diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index f6f2585df2..3d515305fe 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -630,6 +630,32 @@ In some situations a selector may target an element that is not 'visible' to the
 Self-closing HTML tags for non-void elements are ambiguous — use `<%name% ...></%name%>` rather than `<%name% ... />`
 ```
 
+In HTML, there's [no such thing as a self-closing tag](https://jakearchibald.com/2023/against-self-closing-tags-in-html/). While this _looks_ like a self-contained element with some text next to it...
+
+```html
+<div>
+	<span class="icon" /> some text!
+</div>
+```
+
+...a spec-compliant HTML parser (such as a browser) will in fact parse it like this, with the text _inside_ the icon:
+
+```html
+<div>
+	<span class="icon"> some text! </span>
+</div>
+```
+
+Some templating languages (including Svelte) will 'fix' HTML by turning `<span />` into `<span></span>`. Others adhere to the spec. Both result in ambiguity and confusion when copy-pasting code between different contexts, and as such Svelte prompts you to resolve the ambiguity directly by having an explicit closing tag.
+
+To automate this, run the dedicated migration:
+
+```bash
+npx sv migrate self-closing-tags
+```
+
+In a future version of Svelte, self-closing tags may be upgraded from a warning to an error.
+
 ### event_directive_deprecated
 
 ```
diff --git a/packages/svelte/messages/compile-warnings/template.md b/packages/svelte/messages/compile-warnings/template.md
index 33e635bdb2..c1675e5995 100644
--- a/packages/svelte/messages/compile-warnings/template.md
+++ b/packages/svelte/messages/compile-warnings/template.md
@@ -34,6 +34,32 @@
 
 > Self-closing HTML tags for non-void elements are ambiguous — use `<%name% ...></%name%>` rather than `<%name% ... />`
 
+In HTML, there's [no such thing as a self-closing tag](https://jakearchibald.com/2023/against-self-closing-tags-in-html/). While this _looks_ like a self-contained element with some text next to it...
+
+```html
+<div>
+	<span class="icon" /> some text!
+</div>
+```
+
+...a spec-compliant HTML parser (such as a browser) will in fact parse it like this, with the text _inside_ the icon:
+
+```html
+<div>
+	<span class="icon"> some text! </span>
+</div>
+```
+
+Some templating languages (including Svelte) will 'fix' HTML by turning `<span />` into `<span></span>`. Others adhere to the spec. Both result in ambiguity and confusion when copy-pasting code between different contexts, and as such Svelte prompts you to resolve the ambiguity directly by having an explicit closing tag.
+
+To automate this, run the dedicated migration:
+
+```bash
+npx sv migrate self-closing-tags
+```
+
+In a future version of Svelte, self-closing tags may be upgraded from a warning to an error.
+
 ## event_directive_deprecated
 
 > Using `on:%name%` to listen to the %name% event is deprecated. Use the event attribute `on%name%` instead

From 8705d44c6487e642f4cb23b725311a37db19f0d8 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 18 Dec 2024 23:11:11 +0000
Subject: [PATCH 350/404] fix: ensure svg namespace for `<a>` elements is
 correct (#14756)

* fix: ensure svg namespace persists from parent of if blocks

* better fix

* better fix

* address feedback
---
 .changeset/nine-buses-own.md                   |  5 +++++
 .../2-analyze/visitors/RegularElement.js       | 18 +++++++++++++++++-
 .../svg-namespace-if-block-2/_config.js        | 11 +++++++++++
 .../svg-namespace-if-block-2/main.svelte       |  7 +++++++
 4 files changed, 40 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/nine-buses-own.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/main.svelte

diff --git a/.changeset/nine-buses-own.md b/.changeset/nine-buses-own.md
new file mode 100644
index 0000000000..039f7b2001
--- /dev/null
+++ b/.changeset/nine-buses-own.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure svg namespace for `<a>`  elements is correct
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index 7454ab8103..9a891c0c49 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -86,7 +86,23 @@ export function RegularElement(node, context) {
 		(attribute) => attribute.type === 'SpreadAttribute'
 	);
 
-	node.metadata.svg = is_svg(node.name);
+	const is_svg_element = () => {
+		if (is_svg(node.name)) {
+			return true;
+		}
+		if (node.name === 'a') {
+			for (let i = context.path.length - 1; i >= 0; i--) {
+				const ancestor = context.path[i];
+				if (ancestor.type === 'RegularElement') {
+					return ancestor.metadata.svg;
+				}
+			}
+		}
+
+		return false;
+	};
+
+	node.metadata.svg = is_svg_element();
 	node.metadata.mathml = is_mathml(node.name);
 
 	if (is_custom_element_node(node) && node.attributes.length > 0) {
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/_config.js b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/_config.js
new file mode 100644
index 0000000000..7373a4043e
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/_config.js
@@ -0,0 +1,11 @@
+import { test, ok } from '../../test';
+
+export default test({
+	html: `<svg><a href="/docs"><text class="small" x="20" y="40"></text></a></svg>`,
+	test({ assert, target }) {
+		const a = target.querySelector('a');
+		ok(a);
+
+		assert.equal(a.namespaceURI, 'http://www.w3.org/2000/svg');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/main.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/main.svelte
new file mode 100644
index 0000000000..3676278c6c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-2/main.svelte
@@ -0,0 +1,7 @@
+<svg>
+	{#if true}
+		<a href="/docs">
+			<text x="20" y="40" class="small">{name}</text>
+		</a>
+	{/if}
+</svg>

From d0f156c0f9630d21a1fef40232b2d9aa87338c35 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 19 Dec 2024 14:50:00 +0000
Subject: [PATCH 351/404] fix: ensure $inspect.trace code is treeshaken out if
 unused (#14770)

* fix: ensure $inspect.trace code is treeshaken out if unused

* Update .changeset/tough-dingos-deliver.md

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/tough-dingos-deliver.md                    |  5 +++++
 packages/svelte/package.json                          |  3 +++
 packages/svelte/scripts/check-treeshakeability.js     | 11 +++++++++++
 .../svelte/src/compiler/phases/2-analyze/index.js     |  1 +
 .../phases/2-analyze/visitors/CallExpression.js       |  2 ++
 .../phases/3-transform/client/transform-client.js     |  4 ++++
 packages/svelte/src/compiler/phases/types.d.ts        |  1 +
 packages/svelte/src/internal/client/proxy.js          |  3 ++-
 .../svelte/src/internal/client/reactivity/deriveds.js |  3 ++-
 .../svelte/src/internal/client/reactivity/sources.js  |  6 +++---
 packages/svelte/src/internal/client/runtime.js        |  3 ++-
 packages/svelte/src/internal/flags/index.js           |  5 +++++
 packages/svelte/src/internal/flags/tracing.js         |  3 +++
 13 files changed, 44 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/tough-dingos-deliver.md
 create mode 100644 packages/svelte/src/internal/flags/tracing.js

diff --git a/.changeset/tough-dingos-deliver.md b/.changeset/tough-dingos-deliver.md
new file mode 100644
index 0000000000..5c0faf703c
--- /dev/null
+++ b/.changeset/tough-dingos-deliver.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treeshake `$inspect.trace` code if unused
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 1b3df47bdf..6e6075c5db 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -56,6 +56,9 @@
     "./internal/flags/legacy": {
       "default": "./src/internal/flags/legacy.js"
     },
+    "./internal/flags/tracing": {
+      "default": "./src/internal/flags/tracing.js"
+    },
     "./internal/server": {
       "default": "./src/internal/server/index.js"
     },
diff --git a/packages/svelte/scripts/check-treeshakeability.js b/packages/svelte/scripts/check-treeshakeability.js
index 1b50111b87..1501ee6954 100644
--- a/packages/svelte/scripts/check-treeshakeability.js
+++ b/packages/svelte/scripts/check-treeshakeability.js
@@ -58,6 +58,7 @@ for (const key in pkg.exports) {
 	if (key === './internal') continue;
 	if (key === './internal/disclose-version') continue;
 	if (key === './internal/flags/legacy') continue;
+	if (key === './internal/flags/tracing') continue;
 
 	for (const type of ['browser', 'default']) {
 		if (!pkg.exports[key][type]) continue;
@@ -91,6 +92,7 @@ const bundle = await bundle_code(
 </script>
 
 <svelte:head><title>hi</title></svelte:head>
+<input bind:value={foo} />
 
 <a href={foo} class={foo}>a</a>
 <a {...foo}>a</a>
@@ -134,6 +136,15 @@ if (!bundle.includes('component_context.l')) {
 	console.error(`❌ Legacy code not treeshakeable`);
 }
 
+if (!bundle.includes(`'CreatedAt'`)) {
+	// eslint-disable-next-line no-console
+	console.error(`✅ $inspect.trace code treeshakeable`);
+} else {
+	failed = true;
+	// eslint-disable-next-line no-console
+	console.error(`❌ $inspect.trace code not treeshakeable`);
+}
+
 if (failed) {
 	// eslint-disable-next-line no-console
 	console.error(bundle);
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index 042e88fa2f..a4167be3a1 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -408,6 +408,7 @@ export function analyze_component(root, source, options) {
 		template,
 		elements: [],
 		runes,
+		tracing: false,
 		immutable: runes || options.immutable,
 		exports: [],
 		uses_props: false,
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 6a301726b1..9f51cd61de 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/CallExpression.js
@@ -171,6 +171,8 @@ export function CallExpression(node, context) {
 
 					context.state.scope.tracing = b.thunk(b.literal(label + ' ' + loc));
 				}
+
+				context.state.analysis.tracing = true;
 			}
 
 			break;
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 ccbdcea4cc..8e05b44a83 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
@@ -539,6 +539,10 @@ export function client_component(analysis, options) {
 		body.unshift(b.imports([], 'svelte/internal/flags/legacy'));
 	}
 
+	if (analysis.tracing) {
+		body.unshift(b.imports([], 'svelte/internal/flags/tracing'));
+	}
+
 	if (options.discloseVersion) {
 		body.unshift(b.imports([], 'svelte/internal/disclose-version'));
 	}
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index 6a2ea27993..b4dcc270cd 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -39,6 +39,7 @@ export interface ComponentAnalysis extends Analysis {
 	/** Used for CSS pruning and scoping */
 	elements: Array<AST.RegularElement | AST.SvelteElement>;
 	runes: boolean;
+	tracing: boolean;
 	exports: Array<{ name: string; alias: string | null }>;
 	/** Whether the component uses `$$props` */
 	uses_props: boolean;
diff --git a/packages/svelte/src/internal/client/proxy.js b/packages/svelte/src/internal/client/proxy.js
index d74f55866f..6cbd6394df 100644
--- a/packages/svelte/src/internal/client/proxy.js
+++ b/packages/svelte/src/internal/client/proxy.js
@@ -14,6 +14,7 @@ import { STATE_SYMBOL, STATE_SYMBOL_METADATA } from './constants.js';
 import { UNINITIALIZED } from '../../constants.js';
 import * as e from './errors.js';
 import { get_stack } from './dev/tracing.js';
+import { tracing_mode_flag } from '../flags/index.js';
 
 /**
  * @template T
@@ -25,7 +26,7 @@ import { get_stack } from './dev/tracing.js';
 export function proxy(value, parent = null, prev) {
 	/** @type {Error | null} */
 	var stack = null;
-	if (DEV) {
+	if (DEV && tracing_mode_flag) {
 		stack = get_stack('CreatedAt');
 	}
 	// if non-proxyable, or is already a proxy, return `value`
diff --git a/packages/svelte/src/internal/client/reactivity/deriveds.js b/packages/svelte/src/internal/client/reactivity/deriveds.js
index 8c1a3a652b..5e045920bf 100644
--- a/packages/svelte/src/internal/client/reactivity/deriveds.js
+++ b/packages/svelte/src/internal/client/reactivity/deriveds.js
@@ -25,6 +25,7 @@ import * as e from '../errors.js';
 import { destroy_effect } from './effects.js';
 import { inspect_effects, set_inspect_effects } from './sources.js';
 import { get_stack } from '../dev/tracing.js';
+import { tracing_mode_flag } from '../../flags/index.js';
 
 /**
  * @template V
@@ -62,7 +63,7 @@ export function derived(fn) {
 		parent: parent_derived ?? active_effect
 	};
 
-	if (DEV) {
+	if (DEV && tracing_mode_flag) {
 		signal.created = get_stack('CreatedAt');
 	}
 
diff --git a/packages/svelte/src/internal/client/reactivity/sources.js b/packages/svelte/src/internal/client/reactivity/sources.js
index 24dd837772..3e8c4a00c8 100644
--- a/packages/svelte/src/internal/client/reactivity/sources.js
+++ b/packages/svelte/src/internal/client/reactivity/sources.js
@@ -32,7 +32,7 @@ import {
 	BLOCK_EFFECT
 } from '../constants.js';
 import * as e from '../errors.js';
-import { legacy_mode_flag } from '../../flags/index.js';
+import { legacy_mode_flag, tracing_mode_flag } from '../../flags/index.js';
 import { get_stack } from '../dev/tracing.js';
 
 export let inspect_effects = new Set();
@@ -60,7 +60,7 @@ export function source(v, stack) {
 		version: 0
 	};
 
-	if (DEV) {
+	if (DEV && tracing_mode_flag) {
 		signal.created = stack ?? get_stack('CreatedAt');
 		signal.debug = null;
 	}
@@ -170,7 +170,7 @@ export function internal_set(source, value) {
 		source.v = value;
 		source.version = increment_version();
 
-		if (DEV) {
+		if (DEV && tracing_mode_flag) {
 			source.updated = get_stack('UpdatedAt');
 		}
 
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 4aa3d17a15..4a90a21971 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -34,7 +34,7 @@ import { destroy_derived, execute_derived, update_derived } from './reactivity/d
 import * as e from './errors.js';
 import { lifecycle_outside_component } from '../shared/errors.js';
 import { FILENAME } from '../../constants.js';
-import { legacy_mode_flag } from '../flags/index.js';
+import { legacy_mode_flag, tracing_mode_flag } from '../flags/index.js';
 import { tracing_expressions, get_stack } from './dev/tracing.js';
 
 const FLUSH_MICROTASK = 0;
@@ -917,6 +917,7 @@ export function get(signal) {
 
 	if (
 		DEV &&
+		tracing_mode_flag &&
 		tracing_expressions !== null &&
 		active_reaction !== null &&
 		tracing_expressions.reaction === active_reaction
diff --git a/packages/svelte/src/internal/flags/index.js b/packages/svelte/src/internal/flags/index.js
index 767a40a765..017840f2d9 100644
--- a/packages/svelte/src/internal/flags/index.js
+++ b/packages/svelte/src/internal/flags/index.js
@@ -1,5 +1,10 @@
 export let legacy_mode_flag = false;
+export let tracing_mode_flag = false;
 
 export function enable_legacy_mode_flag() {
 	legacy_mode_flag = true;
 }
+
+export function enable_tracing_mode_flag() {
+	tracing_mode_flag = true;
+}
diff --git a/packages/svelte/src/internal/flags/tracing.js b/packages/svelte/src/internal/flags/tracing.js
new file mode 100644
index 0000000000..b2de46dcd1
--- /dev/null
+++ b/packages/svelte/src/internal/flags/tracing.js
@@ -0,0 +1,3 @@
+import { enable_tracing_mode_flag } from './index.js';
+
+enable_tracing_mode_flag();

From 7c6379a260799fdbecc43d9cb736ec9b81d21dec Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Thu, 19 Dec 2024 09:58:53 -0500
Subject: [PATCH 352/404] fix: bump esrap dependency (#14765)

* fix: bump esrap

* changeset

* ugh
---
 .changeset/cool-ducks-carry.md                      |  5 +++++
 packages/svelte/package.json                        |  2 +-
 packages/svelte/scripts/process-messages/index.js   |  1 -
 .../svelte/src/compiler/phases/3-transform/index.js |  2 --
 pnpm-lock.yaml                                      | 13 ++++++-------
 5 files changed, 12 insertions(+), 11 deletions(-)
 create mode 100644 .changeset/cool-ducks-carry.md

diff --git a/.changeset/cool-ducks-carry.md b/.changeset/cool-ducks-carry.md
new file mode 100644
index 0000000000..507bb55d13
--- /dev/null
+++ b/.changeset/cool-ducks-carry.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: bump esrap dependency
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6e6075c5db..6c919a7308 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -150,7 +150,7 @@
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
     "esm-env": "^1.2.1",
-    "esrap": "^1.3.1",
+    "esrap": "^1.3.2",
     "is-reference": "^3.0.3",
     "locate-character": "^3.0.0",
     "magic-string": "^0.30.11",
diff --git a/packages/svelte/scripts/process-messages/index.js b/packages/svelte/scripts/process-messages/index.js
index bbe257498e..80619acfa7 100644
--- a/packages/svelte/scripts/process-messages/index.js
+++ b/packages/svelte/scripts/process-messages/index.js
@@ -389,7 +389,6 @@ function transform(name, dest) {
 		ast.body.push(clone);
 	}
 
-	// @ts-expect-error
 	const module = esrap.print(ast);
 
 	fs.writeFileSync(
diff --git a/packages/svelte/src/compiler/phases/3-transform/index.js b/packages/svelte/src/compiler/phases/3-transform/index.js
index d0739d6cc4..f96fd64ec7 100644
--- a/packages/svelte/src/compiler/phases/3-transform/index.js
+++ b/packages/svelte/src/compiler/phases/3-transform/index.js
@@ -34,7 +34,6 @@ export function transform_component(analysis, source, options) {
 
 	const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte');
 
-	// @ts-expect-error
 	const js = print(program, {
 		// include source content; makes it easier/more robust looking up the source map code
 		// (else esrap does return null for source and sourceMapContent which may trip up tooling)
@@ -95,7 +94,6 @@ export function transform_module(analysis, source, options) {
 	}
 
 	return {
-		// @ts-expect-error
 		js: print(program, {
 			// include source content; makes it easier/more robust looking up the source map code
 			// (else esrap does return null for source and sourceMapContent which may trip up tooling)
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1de6883a48..f7f38700e4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -84,8 +84,8 @@ importers:
         specifier: ^1.2.1
         version: 1.2.1
       esrap:
-        specifier: ^1.3.1
-        version: 1.3.1
+        specifier: ^1.3.2
+        version: 1.3.2
       is-reference:
         specifier: ^3.0.3
         version: 3.0.3
@@ -908,7 +908,7 @@ packages:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
   concat-map@0.0.1:
-    resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
+    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
 
   cross-spawn@5.1.0:
     resolution: {integrity: sha512-pTgQJ5KC0d2hcY8eyL1IzlBPYjTkyH72XRZPnLyKus2mBfNjQs3klqbJU2VILqZryAZUt9JOb3h/mWMy23/f5A==}
@@ -1111,8 +1111,8 @@ packages:
     resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
     engines: {node: '>=0.10'}
 
-  esrap@1.3.1:
-    resolution: {integrity: sha512-KpAH3+QsDmtOP1KOW04CbD1PgzWsIHjB8tOCk3PCb8xzNGn8XkjI8zl80i09fmXdzQyaS8tcsKCCDzHF7AcowA==}
+  esrap@1.3.2:
+    resolution: {integrity: sha512-C4PXusxYhFT98GjLSmb20k9PREuUdporer50dhzGuJu9IJXktbMddVCMLAERl5dAHyAi73GWWCE4FVHGP1794g==}
 
   esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@@ -3315,10 +3315,9 @@ snapshots:
     dependencies:
       estraverse: 5.3.0
 
-  esrap@1.3.1:
+  esrap@1.3.2:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
-      '@typescript-eslint/types': 8.2.0
 
   esrecurse@4.3.0:
     dependencies:

From 69d198eb44f0a2026a3f76c7b70c847983a8529a Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 19 Dec 2024 15:58:02 +0000
Subject: [PATCH 353/404] Version Packages (#14764)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cool-ducks-carry.md     |  5 -----
 .changeset/nine-buses-own.md       |  5 -----
 .changeset/tough-dingos-deliver.md |  5 -----
 packages/svelte/CHANGELOG.md       | 10 ++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/cool-ducks-carry.md
 delete mode 100644 .changeset/nine-buses-own.md
 delete mode 100644 .changeset/tough-dingos-deliver.md

diff --git a/.changeset/cool-ducks-carry.md b/.changeset/cool-ducks-carry.md
deleted file mode 100644
index 507bb55d13..0000000000
--- a/.changeset/cool-ducks-carry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: bump esrap dependency
diff --git a/.changeset/nine-buses-own.md b/.changeset/nine-buses-own.md
deleted file mode 100644
index 039f7b2001..0000000000
--- a/.changeset/nine-buses-own.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure svg namespace for `<a>`  elements is correct
diff --git a/.changeset/tough-dingos-deliver.md b/.changeset/tough-dingos-deliver.md
deleted file mode 100644
index 5c0faf703c..0000000000
--- a/.changeset/tough-dingos-deliver.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treeshake `$inspect.trace` code if unused
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 47a67006c1..5d571ff104 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.14.5
+
+### Patch Changes
+
+- fix: bump esrap dependency ([#14765](https://github.com/sveltejs/svelte/pull/14765))
+
+- fix: ensure svg namespace for `<a>` elements is correct ([#14756](https://github.com/sveltejs/svelte/pull/14756))
+
+- fix: treeshake `$inspect.trace` code if unused ([#14770](https://github.com/sveltejs/svelte/pull/14770))
+
 ## 5.14.4
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 6c919a7308..b69cd565cc 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.14.4",
+  "version": "5.14.5",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index e6f7bd2716..1082ce5cc5 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.14.4';
+export const VERSION = '5.14.5';
 export const PUBLIC_VERSION = '5';

From 5bc403342177db2ec0b419d93e1e0722388e085c Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 19 Dec 2024 17:06:22 +0000
Subject: [PATCH 354/404] fix: treeshake `$inspect.trace` code if unused in
 modules (#14774)

---
 .changeset/modern-colts-drive.md                          | 5 +++++
 packages/svelte/src/compiler/phases/2-analyze/index.js    | 7 +++++--
 .../phases/3-transform/client/transform-client.js         | 8 +++++++-
 packages/svelte/src/compiler/phases/types.d.ts            | 1 +
 4 files changed, 18 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/modern-colts-drive.md

diff --git a/.changeset/modern-colts-drive.md b/.changeset/modern-colts-drive.md
new file mode 100644
index 0000000000..6c727d220e
--- /dev/null
+++ b/.changeset/modern-colts-drive.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treeshake `$inspect.trace` code if unused in modules
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index a4167be3a1..c0e4a65571 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -243,13 +243,15 @@ export function analyze_module(ast, options) {
 		}
 	}
 
+	const analysis = { runes: true, tracing: false };
+
 	walk(
 		/** @type {Node} */ (ast),
 		{
 			scope,
 			scopes,
 			// @ts-expect-error TODO
-			analysis: { runes: true }
+			analysis
 		},
 		visitors
 	);
@@ -259,7 +261,8 @@ export function analyze_module(ast, options) {
 		name: options.filename,
 		accessors: false,
 		runes: true,
-		immutable: true
+		immutable: true,
+		tracing: analysis.tracing
 	};
 }
 
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 8e05b44a83..90901d29ce 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
@@ -671,9 +671,15 @@ export function client_module(analysis, options) {
 		walk(/** @type {AST.SvelteNode} */ (analysis.module.ast), state, visitors)
 	);
 
+	const body = [b.import_all('$', 'svelte/internal/client')];
+
+	if (analysis.tracing) {
+		body.push(b.imports([], 'svelte/internal/flags/tracing'));
+	}
+
 	return {
 		type: 'Program',
 		sourceType: 'module',
-		body: [b.import_all('$', 'svelte/internal/client'), ...module.body]
+		body: [...body, ...module.body]
 	};
 }
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index b4dcc270cd..fe32dbba3e 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -27,6 +27,7 @@ export interface Analysis {
 	name: string; // TODO should this be filename? it's used in `compileModule` as well as `compile`
 	runes: boolean;
 	immutable: boolean;
+	tracing: boolean;
 
 	// TODO figure out if we can move this to ComponentAnalysis
 	accessors: boolean;

From 999b92d134186bba7e0eeb1de38626f07dcf7260 Mon Sep 17 00:00:00 2001
From: ottomated <31470743+ottomated@users.noreply.github.com>
Date: Thu, 19 Dec 2024 10:12:59 -0800
Subject: [PATCH 355/404] fix: intellisense DX for $props, $inspect, $bindable,
 and $host (#14777)

* remove default function types for $props, $inspect, $bindable, and $host

* changeset

* regenerate types

* add helper message for type regeneration

* append a newline to generated types

* prettier

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/three-suits-pay.md             |  5 ++
 .github/workflows/ci.yml                  |  2 +-
 .github/workflows/release.yml             |  2 +-
 packages/svelte/scripts/generate-types.js |  2 +
 packages/svelte/src/ambient.d.ts          | 90 ++++++++++++++++++++++
 packages/svelte/types/index.d.ts          | 92 ++++++++++++++++++++++-
 6 files changed, 190 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/three-suits-pay.md

diff --git a/.changeset/three-suits-pay.md b/.changeset/three-suits-pay.md
new file mode 100644
index 0000000000..51d46395e8
--- /dev/null
+++ b/.changeset/three-suits-pay.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: Improve typescript DX for $inspect, $props, $bindable, and $host
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index fbdd1e420c..b2bcb08848 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -59,7 +59,7 @@ jobs:
         run: pnpm lint
       - name: build and check generated types
         if: (${{ success() }} || ${{ failure() }}) # ensures this step runs even if previous steps fail
-        run: pnpm build && { [ "`git status --porcelain=v1`" == "" ] || (echo "Generated types have changed — please regenerate types locally and commit the changes after you have reviewed them"; git diff; exit 1); }
+        run: pnpm build && { [ "`git status --porcelain=v1`" == "" ] || (echo "Generated types have changed — please regenerate types locally with `cd packages/svelte && pnpm generate:types` and commit the changes after you have reviewed them"; git diff; exit 1); }
   Benchmarks:
     runs-on: ubuntu-latest
     timeout-minutes: 15
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index a17f49bbeb..1daef0b89c 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -33,7 +33,7 @@ jobs:
         run: pnpm install --frozen-lockfile
 
       - name: Build
-        run: pnpm build && { [ "`git status --porcelain=v1`" == "" ] || (echo "Generated types have changed — please regenerate types locally and commit the changes after you have reviewed them"; git diff; exit 1); }
+        run: pnpm build && { [ "`git status --porcelain=v1`" == "" ] || (echo "Generated types have changed — please regenerate types locally with `cd packages/svelte && pnpm generate:types` and commit the changes after you have reviewed them"; git diff; exit 1); }
 
       - name: Create Release Pull Request or Publish to npm
         id: changesets
diff --git a/packages/svelte/scripts/generate-types.js b/packages/svelte/scripts/generate-types.js
index 16bbf52a2e..d44afe8205 100644
--- a/packages/svelte/scripts/generate-types.js
+++ b/packages/svelte/scripts/generate-types.js
@@ -46,6 +46,8 @@ await createBundle({
 	}
 });
 
+fs.appendFileSync(`${dir}/types/index.d.ts`, '\n');
+
 const types = fs.readFileSync(`${dir}/types/index.d.ts`, 'utf-8');
 
 const bad_links = [...types.matchAll(/\]\((\/[^)]+)\)/g)];
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index 4e98eb82eb..9dbc61c7cb 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -338,6 +338,29 @@ declare namespace $effect {
  */
 declare function $props(): any;
 
+declare namespace $props {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
+
 /**
  * Declares a prop as bindable, meaning the parent component can use `bind:propName={value}` to bind to it.
  *
@@ -349,6 +372,29 @@ declare function $props(): any;
  */
 declare function $bindable<T>(fallback?: T): T;
 
+declare namespace $bindable {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
+
 /**
  * Inspects one or more values whenever they, or the properties they contain, change. Example:
  *
@@ -388,6 +434,27 @@ declare namespace $inspect {
 	 * </script>
 	 */
 	export function trace(name: string): void;
+
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
 }
 
 /**
@@ -410,3 +477,26 @@ declare namespace $inspect {
  * https://svelte.dev/docs/svelte/$host
  */
 declare function $host<El extends HTMLElement = HTMLElement>(): El;
+
+declare namespace $host {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index 671f68bff7..d422abebbc 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -2996,6 +2996,29 @@ declare namespace $effect {
  */
 declare function $props(): any;
 
+declare namespace $props {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
+
 /**
  * Declares a prop as bindable, meaning the parent component can use `bind:propName={value}` to bind to it.
  *
@@ -3007,6 +3030,29 @@ declare function $props(): any;
  */
 declare function $bindable<T>(fallback?: T): T;
 
+declare namespace $bindable {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
+
 /**
  * Inspects one or more values whenever they, or the properties they contain, change. Example:
  *
@@ -3046,6 +3092,27 @@ declare namespace $inspect {
 	 * </script>
 	 */
 	export function trace(name: string): void;
+
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
 }
 
 /**
@@ -3069,4 +3136,27 @@ declare namespace $inspect {
  */
 declare function $host<El extends HTMLElement = HTMLElement>(): El;
 
-//# sourceMappingURL=index.d.ts.map
\ No newline at end of file
+declare namespace $host {
+	// prevent intellisense from being unhelpful
+	/** @deprecated */
+	export const apply: never;
+	/** @deprecated */
+	// @ts-ignore
+	export const arguments: never;
+	/** @deprecated */
+	export const bind: never;
+	/** @deprecated */
+	export const call: never;
+	/** @deprecated */
+	export const caller: never;
+	/** @deprecated */
+	export const length: never;
+	/** @deprecated */
+	export const name: never;
+	/** @deprecated */
+	export const prototype: never;
+	/** @deprecated */
+	export const toString: never;
+}
+
+//# sourceMappingURL=index.d.ts.map

From 2086c199be592a9200a1f994be6650341ce8ffd6 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 19 Dec 2024 17:01:21 -0500
Subject: [PATCH 356/404] Version Packages (#14776)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/modern-colts-drive.md | 5 -----
 .changeset/three-suits-pay.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/modern-colts-drive.md
 delete mode 100644 .changeset/three-suits-pay.md

diff --git a/.changeset/modern-colts-drive.md b/.changeset/modern-colts-drive.md
deleted file mode 100644
index 6c727d220e..0000000000
--- a/.changeset/modern-colts-drive.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treeshake `$inspect.trace` code if unused in modules
diff --git a/.changeset/three-suits-pay.md b/.changeset/three-suits-pay.md
deleted file mode 100644
index 51d46395e8..0000000000
--- a/.changeset/three-suits-pay.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: Improve typescript DX for $inspect, $props, $bindable, and $host
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 5d571ff104..387162e969 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.14.6
+
+### Patch Changes
+
+- fix: treeshake `$inspect.trace` code if unused in modules ([#14774](https://github.com/sveltejs/svelte/pull/14774))
+
+- fix: Improve typescript DX for $inspect, $props, $bindable, and $host ([#14777](https://github.com/sveltejs/svelte/pull/14777))
+
 ## 5.14.5
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index b69cd565cc..1838e7c673 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.14.5",
+  "version": "5.14.6",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 1082ce5cc5..5859e82860 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.14.5';
+export const VERSION = '5.14.6';
 export const PUBLIC_VERSION = '5';

From 72b7bc7af83b52ef2a0e28f1a0011d7ffcab9df0 Mon Sep 17 00:00:00 2001
From: Bjorn Lu <bjornlu.dev@gmail.com>
Date: Thu, 19 Dec 2024 23:07:51 +0100
Subject: [PATCH 357/404] feat: add "worker" exports condition (#14779)

---
 .changeset/calm-shrimps-remain.md | 5 +++++
 packages/svelte/package.json      | 4 ++++
 2 files changed, 9 insertions(+)
 create mode 100644 .changeset/calm-shrimps-remain.md

diff --git a/.changeset/calm-shrimps-remain.md b/.changeset/calm-shrimps-remain.md
new file mode 100644
index 0000000000..280ebb3444
--- /dev/null
+++ b/.changeset/calm-shrimps-remain.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: add "worker" exports condition to better support bundling for worker-based environments
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 1838e7c673..36eb6fa0bc 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -21,6 +21,7 @@
   "exports": {
     ".": {
       "types": "./types/index.d.ts",
+      "worker": "./src/index-server.js",
       "browser": "./src/index-client.js",
       "default": "./src/index-server.js"
     },
@@ -64,6 +65,7 @@
     },
     "./legacy": {
       "types": "./types/index.d.ts",
+      "worker": "./src/legacy/legacy-server.js",
       "browser": "./src/legacy/legacy-client.js",
       "default": "./src/legacy/legacy-server.js"
     },
@@ -73,6 +75,7 @@
     },
     "./reactivity": {
       "types": "./types/index.d.ts",
+      "worker": "./src/reactivity/index-server.js",
       "browser": "./src/reactivity/index-client.js",
       "default": "./src/reactivity/index-server.js"
     },
@@ -86,6 +89,7 @@
     },
     "./store": {
       "types": "./types/index.d.ts",
+      "worker": "./src/store/index-server.js",
       "browser": "./src/store/index-client.js",
       "default": "./src/store/index-server.js"
     },

From 1d773ef3a471adb36eb3c992168b21fbaf349562 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 19 Dec 2024 17:34:10 -0500
Subject: [PATCH 358/404] Version Packages (#14782)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/calm-shrimps-remain.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/calm-shrimps-remain.md

diff --git a/.changeset/calm-shrimps-remain.md b/.changeset/calm-shrimps-remain.md
deleted file mode 100644
index 280ebb3444..0000000000
--- a/.changeset/calm-shrimps-remain.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: add "worker" exports condition to better support bundling for worker-based environments
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 387162e969..1e9c3451f3 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,11 @@
 # svelte
 
+## 5.15.0
+
+### Minor Changes
+
+- feat: add "worker" exports condition to better support bundling for worker-based environments ([#14779](https://github.com/sveltejs/svelte/pull/14779))
+
 ## 5.14.6
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 36eb6fa0bc..05169a7bc2 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.14.6",
+  "version": "5.15.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 5859e82860..00070ffab0 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.14.6';
+export const VERSION = '5.15.0';
 export const PUBLIC_VERSION = '5';

From 38a3ae321ffceccd7da838e09f092af86d1b6dc4 Mon Sep 17 00:00:00 2001
From: Andrey Sitnik <andrey@sitnik.ru>
Date: Tue, 24 Dec 2024 13:16:03 +0100
Subject: [PATCH 359/404] fix: Allow to disable animation prefix (#14822)

* fix: Allow to disable animation prefix

* Apply suggestions from code review

---------

Co-authored-by: Paolo Ricciuti <ricciutipaolo@gmail.com>
---
 .changeset/twenty-shoes-peel.md                        |  5 +++++
 .../src/compiler/phases/2-analyze/css/css-analyze.js   | 10 +++++++++-
 .../svelte/tests/css/samples/global-block/expected.css |  4 ++++
 .../svelte/tests/css/samples/global-block/input.svelte |  4 ++++
 4 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/twenty-shoes-peel.md

diff --git a/.changeset/twenty-shoes-peel.md b/.changeset/twenty-shoes-peel.md
new file mode 100644
index 0000000000..e0a8e0701d
--- /dev/null
+++ b/.changeset/twenty-shoes-peel.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't include keyframes in global scope in the keyframes to rename
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 b8c88a1023..ed22838582 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
@@ -28,11 +28,19 @@ function is_global_block_selector(simple_selector) {
 	);
 }
 
+/**
+ *
+ * @param {Array<AST.CSS.Node>} path
+ */
+function is_in_global_block(path) {
+	return path.some((node) => node.type === 'Rule' && node.metadata.is_global_block);
+}
+
 /** @type {CssVisitors} */
 const css_visitors = {
 	Atrule(node, context) {
 		if (is_keyframes_node(node)) {
-			if (!node.prelude.startsWith('-global-')) {
+			if (!node.prelude.startsWith('-global-') && !is_in_global_block(context.path)) {
 				context.state.keyframes.push(node.prelude);
 			}
 		}
diff --git a/packages/svelte/tests/css/samples/global-block/expected.css b/packages/svelte/tests/css/samples/global-block/expected.css
index 8a7c493d7c..438749224b 100644
--- a/packages/svelte/tests/css/samples/global-block/expected.css
+++ b/packages/svelte/tests/css/samples/global-block/expected.css
@@ -74,6 +74,10 @@
 			animation: svelte-xyz-test 1s;
 		}
 
+		.y{
+			animation: test-in 1s;
+		}
+
 		@keyframes test-in{
 			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 dc1a754010..a1833636a1 100644
--- a/packages/svelte/tests/css/samples/global-block/input.svelte
+++ b/packages/svelte/tests/css/samples/global-block/input.svelte
@@ -76,6 +76,10 @@
 			animation: test 1s;
 		}
 
+		.y{
+			animation: test-in 1s;
+		}
+
 		@keyframes test-in{
 			to{
 				opacity: 1;

From 015210a1a8a230383303a2c3aa044916a49d2681 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 24 Dec 2024 14:58:49 +0100
Subject: [PATCH 360/404] feat: allow objects/arrays for class attribute
 (#14714)

* WIP

* missed

* fix

* fix

* rename, smooth over incompatibilities

* spread support + test

* docs

* types

* implement CSS pruning for array/object expressions

* beefier static analysis

* lint

* rename doc

* move class after all directive docs

* tweak docs - clarify top-level falsy values, stagger examples, demonstrate composition, discourage class: more strongly

* changeset

* fix

* Update documentation/docs/03-template-syntax/18-class.md

Co-authored-by: Conduitry <git@chor.date>

* Apply suggestions from code review

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
Co-authored-by: Conduitry <git@chor.date>
---
 .changeset/thin-panthers-sing.md              |  5 ++
 .../docs/03-template-syntax/16-class.md       | 23 -----
 .../docs/03-template-syntax/18-class.md       | 90 +++++++++++++++++++
 packages/svelte/elements.d.ts                 |  4 +-
 packages/svelte/package.json                  |  1 +
 .../phases/2-analyze/css/css-prune.js         |  4 +-
 .../compiler/phases/2-analyze/css/utils.js    | 75 ++++++++++++++--
 .../src/compiler/phases/2-analyze/index.js    |  2 +
 .../phases/2-analyze/visitors/Attribute.js    | 13 +++
 .../client/visitors/RegularElement.js         |  8 +-
 .../server/visitors/shared/element.js         | 31 ++++++-
 packages/svelte/src/compiler/phases/nodes.js  |  3 +-
 .../svelte/src/compiler/types/template.d.ts   |  2 +
 .../client/dom/elements/attributes.js         |  5 ++
 .../src/internal/client/dom/elements/class.js | 22 +++--
 packages/svelte/src/internal/client/index.js  |  2 +-
 packages/svelte/src/internal/server/index.js  |  8 +-
 .../svelte/src/internal/shared/attributes.js  | 14 +++
 .../css/samples/clsx-can-prune/_config.js     | 20 +++++
 .../css/samples/clsx-can-prune/expected.css   | 12 +++
 .../css/samples/clsx-can-prune/input.svelte   | 25 ++++++
 .../samples/clsx-cannot-prune-1/expected.css  |  2 +
 .../samples/clsx-cannot-prune-1/input.svelte  |  5 ++
 .../samples/clsx-cannot-prune-2/expected.css  |  2 +
 .../samples/clsx-cannot-prune-2/input.svelte  |  5 ++
 .../samples/clsx-cannot-prune-3/expected.css  |  2 +
 .../samples/clsx-cannot-prune-3/input.svelte  |  5 ++
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../_config.js                                |  2 +-
 .../runtime-runes/samples/clsx/_config.js     | 43 +++++++++
 .../runtime-runes/samples/clsx/child.svelte   |  5 ++
 .../runtime-runes/samples/clsx/main.svelte    | 33 +++++++
 pnpm-lock.yaml                                |  9 ++
 35 files changed, 433 insertions(+), 55 deletions(-)
 create mode 100644 .changeset/thin-panthers-sing.md
 delete mode 100644 documentation/docs/03-template-syntax/16-class.md
 create mode 100644 documentation/docs/03-template-syntax/18-class.md
 create mode 100644 packages/svelte/tests/css/samples/clsx-can-prune/_config.js
 create mode 100644 packages/svelte/tests/css/samples/clsx-can-prune/expected.css
 create mode 100644 packages/svelte/tests/css/samples/clsx-can-prune/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-1/expected.css
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-1/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-2/expected.css
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-2/input.svelte
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-3/expected.css
 create mode 100644 packages/svelte/tests/css/samples/clsx-cannot-prune-3/input.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/clsx/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/clsx/child.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/clsx/main.svelte

diff --git a/.changeset/thin-panthers-sing.md b/.changeset/thin-panthers-sing.md
new file mode 100644
index 0000000000..223de002c6
--- /dev/null
+++ b/.changeset/thin-panthers-sing.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: allow `class` attribute to be an object or array, using `clsx`
diff --git a/documentation/docs/03-template-syntax/16-class.md b/documentation/docs/03-template-syntax/16-class.md
deleted file mode 100644
index cecbc7cf20..0000000000
--- a/documentation/docs/03-template-syntax/16-class.md
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: class:
----
-
-The `class:` directive is a convenient way to conditionally set classes on elements, as an alternative to using conditional expressions inside `class` attributes:
-
-```svelte
-<!-- These are equivalent -->
-<div class={isCool ? 'cool' : ''}>...</div>
-<div class:cool={isCool}>...</div>
-```
-
-As with other directives, we can use a shorthand when the name of the class coincides with the value:
-
-```svelte
-<div class:cool>...</div>
-```
-
-Multiple `class:` directives can be added to a single element:
-
-```svelte
-<div class:cool class:lame={!cool} class:potato>...</div>
-```
diff --git a/documentation/docs/03-template-syntax/18-class.md b/documentation/docs/03-template-syntax/18-class.md
new file mode 100644
index 0000000000..880a34e9ec
--- /dev/null
+++ b/documentation/docs/03-template-syntax/18-class.md
@@ -0,0 +1,90 @@
+---
+title: class
+---
+
+There are two ways to set classes on elements: the `class` attribute, and the `class:` directive.
+
+## Attributes
+
+Primitive values are treated like any other attribute:
+
+```svelte
+<div class={large ? 'large' : 'small'}>...</div>
+```
+
+> [!NOTE]
+> For historical reasons, falsy values (like `false` and `NaN`) are stringified (`class="false"`), though `class={undefined}` (or `null`) cause the attribute to be omitted altogether. In a future version of Svelte, all falsy values will cause `class` to be omitted.
+
+### Objects and arrays
+
+Since Svelte 5.16, `class` can be an object or array, and is converted to a string using [clsx](https://github.com/lukeed/clsx).
+
+If the value is an object, the truthy keys are added:
+
+```svelte
+<script>
+	let { cool } = $props();
+</script>
+
+<!-- results in `class="cool"` if `cool` is truthy,
+     `class="lame"` otherwise -->
+<div class={{ cool, lame: !cool }}>...</div>
+```
+
+If the value is an array, the truthy values are combined:
+
+```svelte
+<!-- if `faded` and `large` are both truthy, results in
+     `class="saturate-0 opacity-50 scale-200"` -->
+<div class={[faded && 'saturate-0 opacity-50', large && 'scale-200']}>...</div>
+```
+
+Note that whether we're using the array or object form, we can set multiple classes simultaneously with a single condition, which is particularly useful if you're using things like Tailwind.
+
+Arrays can contain arrays and objects, and clsx will flatten them. This is useful for combining local classes with props, for example:
+
+```svelte
+<!--- file: Button.svelte --->
+<script>
+	let props = $props();
+</script>
+
+<button {...props} class={['cool-button', props.class]}>
+	{@render props.children?.()}
+</button>
+```
+
+The user of this component has the same flexibility to use a mixture of objects, arrays and strings:
+
+```svelte
+<!--- file: App.svelte --->
+<script>
+	import Button from './Button.svelte';
+	let useTailwind = $state(false);
+</script>
+
+<Button
+	onclick={() => useTailwind = true}
+	class={{ 'bg-blue-700 sm:w-1/2': useTailwind }}
+>
+	Accept the inevitability of Tailwind
+</Button>
+```
+
+## The `class:` directive
+
+Prior to Svelte 5.16, the `class:` directive was the most convenient way to set classes on elements conditionally.
+
+```svelte
+<!-- These are equivalent -->
+<div class={{ cool, lame: !cool }}>...</div>
+<div class:cool={cool} class:lame={!cool}>...</div>
+```
+
+As with other directives, we can use a shorthand when the name of the class coincides with the value:
+
+```svelte
+<div class:cool class:lame={!cool}>...</div>
+```
+
+> [!NOTE] Unless you're using an older version of Svelte, consider avoiding `class:`, since the attribute is more powerful and composable.
diff --git a/packages/svelte/elements.d.ts b/packages/svelte/elements.d.ts
index 8800b65172..604403f0a2 100644
--- a/packages/svelte/elements.d.ts
+++ b/packages/svelte/elements.d.ts
@@ -741,7 +741,7 @@ export interface HTMLAttributes<T extends EventTarget> extends AriaAttributes, D
 	accesskey?: string | undefined | null;
 	autocapitalize?: 'characters' | 'off' | 'on' | 'none' | 'sentences' | 'words' | undefined | null;
 	autofocus?: boolean | undefined | null;
-	class?: string | undefined | null;
+	class?: string | import('clsx').ClassArray | import('clsx').ClassDictionary | undefined | null;
 	contenteditable?: Booleanish | 'inherit' | 'plaintext-only' | undefined | null;
 	contextmenu?: string | undefined | null;
 	dir?: 'ltr' | 'rtl' | 'auto' | undefined | null;
@@ -1522,7 +1522,7 @@ export interface SvelteWindowAttributes extends HTMLAttributes<Window> {
 export interface SVGAttributes<T extends EventTarget> extends AriaAttributes, DOMAttributes<T> {
 	// Attributes which also defined in HTMLAttributes
 	className?: string | undefined | null;
-	class?: string | undefined | null;
+	class?: string | import('clsx').ClassArray | import('clsx').ClassDictionary | undefined | null;
 	color?: string | undefined | null;
 	height?: number | string | undefined | null;
 	id?: string | undefined | null;
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 05169a7bc2..b9f4d3de09 100644
--- a/packages/svelte/package.json
+++ b/packages/svelte/package.json
@@ -153,6 +153,7 @@
     "acorn-typescript": "^1.4.13",
     "aria-query": "^5.3.1",
     "axobject-query": "^4.1.0",
+    "clsx": "^2.1.1",
     "esm-env": "^1.2.1",
     "esrap": "^1.3.2",
     "is-reference": "^3.0.3",
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 35bc675166..ca7476ef7f 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
@@ -731,7 +731,7 @@ function attribute_matches(node, name, expected_value, operator, case_insensitiv
 		/** @type {string[]} */
 		let prev_values = [];
 		for (const chunk of chunks) {
-			const current_possible_values = get_possible_values(chunk);
+			const current_possible_values = get_possible_values(chunk, name === 'class');
 
 			// impossible to find out all combinations
 			if (!current_possible_values) return true;
@@ -784,7 +784,7 @@ function attribute_matches(node, name, expected_value, operator, case_insensitiv
 					prev_values.push(current_possible_value);
 				}
 			});
-			if (prev_values.length < current_possible_values.size) {
+			if (prev_values.length < current_possible_values.length) {
 				prev_values.push(' ');
 			}
 			if (prev_values.length > 20) {
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 d3fd71ec39..d7544b55c0 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/css/utils.js
@@ -4,14 +4,74 @@ const UNKNOWN = {};
 
 /**
  * @param {Node} node
+ * @param {boolean} is_class
  * @param {Set<any>} set
+ * @param {boolean} is_nested
  */
-function gather_possible_values(node, set) {
+function gather_possible_values(node, is_class, set, is_nested = false) {
+	if (set.has(UNKNOWN)) {
+		// no point traversing any further
+		return;
+	}
+
 	if (node.type === 'Literal') {
 		set.add(String(node.value));
 	} else if (node.type === 'ConditionalExpression') {
-		gather_possible_values(node.consequent, set);
-		gather_possible_values(node.alternate, set);
+		gather_possible_values(node.consequent, is_class, set, is_nested);
+		gather_possible_values(node.alternate, is_class, set, is_nested);
+	} else if (node.type === 'LogicalExpression') {
+		if (node.operator === '&&') {
+			// && is a special case, because the only way the left
+			// hand value can be included is if it's falsy. this is
+			// a bit of extra work but it's worth it because
+			// `class={[condition && 'blah']}` is common,
+			// and we don't want to deopt on `condition`
+			const left = new Set();
+			gather_possible_values(node.left, is_class, left, is_nested);
+
+			if (left.has(UNKNOWN)) {
+				// add all non-nullish falsy values, unless this is a `class` attribute that
+				// will be processed by cslx, in which case falsy values are removed, unless
+				// they're not inside an array/object (TODO 6.0 remove that last part)
+				if (!is_class || !is_nested) {
+					set.add('');
+					set.add(false);
+					set.add(NaN);
+					set.add(0); // -0 and 0n are also falsy, but stringify to '0'
+				}
+			} else {
+				for (const value of left) {
+					if (!value && value != undefined && (!is_class || !is_nested)) {
+						set.add(value);
+					}
+				}
+			}
+
+			gather_possible_values(node.right, is_class, set, is_nested);
+		} else {
+			gather_possible_values(node.left, is_class, set, is_nested);
+			gather_possible_values(node.right, is_class, set, is_nested);
+		}
+	} else if (is_class && node.type === 'ArrayExpression') {
+		for (const entry of node.elements) {
+			if (entry) {
+				gather_possible_values(entry, is_class, set, true);
+			}
+		}
+	} else if (is_class && node.type === 'ObjectExpression') {
+		for (const property of node.properties) {
+			if (
+				property.type === 'Property' &&
+				!property.computed &&
+				(property.key.type === 'Identifier' || property.key.type === 'Literal')
+			) {
+				set.add(
+					property.key.type === 'Identifier' ? property.key.name : String(property.key.value)
+				);
+			} else {
+				set.add(UNKNOWN);
+			}
+		}
 	} else {
 		set.add(UNKNOWN);
 	}
@@ -19,19 +79,20 @@ function gather_possible_values(node, set) {
 
 /**
  * @param {AST.Text | AST.ExpressionTag} chunk
- * @returns {Set<string> | null}
+ * @param {boolean} is_class
+ * @returns {string[] | null}
  */
-export function get_possible_values(chunk) {
+export function get_possible_values(chunk, is_class) {
 	const values = new Set();
 
 	if (chunk.type === 'Text') {
 		values.add(chunk.data);
 	} else {
-		gather_possible_values(chunk.expression, values);
+		gather_possible_values(chunk.expression, is_class, values);
 	}
 
 	if (values.has(UNKNOWN)) return null;
-	return values;
+	return [...values].map((value) => String(value));
 }
 
 /**
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index c0e4a65571..76c1e94277 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -773,6 +773,8 @@ export function analyze_component(root, source, options) {
 
 					if (attribute.type !== 'Attribute') continue;
 					if (attribute.name.toLowerCase() !== 'class') continue;
+					// The dynamic class method appends the hash to the end of the class attribute on its own
+					if (attribute.metadata.needs_clsx) continue outer;
 
 					class_attribute = attribute;
 				}
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 6eb9faca6d..9d801e095e 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/Attribute.js
@@ -38,6 +38,19 @@ export function Attribute(node, context) {
 		mark_subtree_dynamic(context.path);
 	}
 
+	// class={[...]} or class={{...}} or `class={x}` need clsx to resolve the classes
+	if (
+		node.name === 'class' &&
+		!Array.isArray(node.value) &&
+		node.value !== true &&
+		node.value.expression.type !== 'Literal' &&
+		node.value.expression.type !== 'TemplateLiteral' &&
+		node.value.expression.type !== 'BinaryExpression'
+	) {
+		mark_subtree_dynamic(context.path);
+		node.metadata.needs_clsx = true;
+	}
+
 	if (node.value !== true) {
 		for (const chunk of get_attribute_chunks(node.value)) {
 			if (chunk.type !== 'ExpressionTag') continue;
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 2c2c287f12..59a6fafbc5 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
@@ -553,6 +553,10 @@ function build_element_attribute_update_assignment(
 	let update;
 
 	if (name === 'class') {
+		if (attribute.metadata.needs_clsx) {
+			value = b.call('$.clsx', value);
+		}
+
 		if (attribute.metadata.expression.has_state && has_call) {
 			// ensure we're not creating a separate template effect for this so that
 			// potential class directives are added to the same effect and therefore always apply
@@ -561,11 +565,13 @@ function build_element_attribute_update_assignment(
 			value = b.call('$.get', id);
 			has_call = false;
 		}
+
 		update = b.stmt(
 			b.call(
 				is_svg ? '$.set_svg_class' : is_mathml ? '$.set_mathml_class' : '$.set_class',
 				node_id,
-				value
+				value,
+				attribute.metadata.needs_clsx ? b.literal(context.state.analysis.css.hash) : undefined
 			)
 		);
 	} else if (name === 'value') {
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 5ebc647571..d0d800d3cb 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
@@ -86,10 +86,35 @@ export function build_element_attributes(node, context) {
 			} else if (attribute.name !== 'defaultValue' && attribute.name !== 'defaultChecked') {
 				if (attribute.name === 'class') {
 					class_index = attributes.length;
-				} else if (attribute.name === 'style') {
-					style_index = attributes.length;
+
+					if (attribute.metadata.needs_clsx) {
+						const clsx_value = b.call(
+							'$.clsx',
+							/** @type {AST.ExpressionTag} */ (attribute.value).expression
+						);
+						attributes.push({
+							...attribute,
+							value: {
+								.../** @type {AST.ExpressionTag} */ (attribute.value),
+								expression: context.state.analysis.css.hash
+									? b.binary(
+											'+',
+											b.binary('+', clsx_value, b.literal(' ')),
+											b.literal(context.state.analysis.css.hash)
+										)
+									: clsx_value
+							}
+						});
+					} else {
+						attributes.push(attribute);
+					}
+				} else {
+					if (attribute.name === 'style') {
+						style_index = attributes.length;
+					}
+
+					attributes.push(attribute);
 				}
-				attributes.push(attribute);
 			}
 		} else if (attribute.type === 'BindDirective') {
 			if (attribute.name === 'value' && node.name === 'select') continue;
diff --git a/packages/svelte/src/compiler/phases/nodes.js b/packages/svelte/src/compiler/phases/nodes.js
index 7aa9fecd3a..5066833feb 100644
--- a/packages/svelte/src/compiler/phases/nodes.js
+++ b/packages/svelte/src/compiler/phases/nodes.js
@@ -45,7 +45,8 @@ export function create_attribute(name, start, end, value) {
 		value,
 		metadata: {
 			expression: create_expression_metadata(),
-			delegated: null
+			delegated: null,
+			needs_clsx: false
 		}
 	};
 }
diff --git a/packages/svelte/src/compiler/types/template.d.ts b/packages/svelte/src/compiler/types/template.d.ts
index 97a25df4a7..8be9aed177 100644
--- a/packages/svelte/src/compiler/types/template.d.ts
+++ b/packages/svelte/src/compiler/types/template.d.ts
@@ -482,6 +482,8 @@ export namespace AST {
 			expression: ExpressionMetadata;
 			/** May be set if this is an event attribute */
 			delegated: null | DelegatedEvent;
+			/** May be `true` if this is a `class` attribute that needs `clsx` */
+			needs_clsx: boolean;
 		};
 	}
 
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 9c62d684c1..6656532986 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -13,6 +13,7 @@ import {
 	set_active_effect,
 	set_active_reaction
 } from '../../runtime.js';
+import { clsx } from '../../../shared/attributes.js';
 
 /**
  * The value/checked attribute in the template actually corresponds to the defaultValue property, so we need
@@ -267,6 +268,10 @@ export function set_attributes(
 		}
 	}
 
+	if (next.class) {
+		next.class = clsx(next.class);
+	}
+
 	if (css_hash !== undefined) {
 		next.class = next.class ? next.class + ' ' + css_hash : css_hash;
 	}
diff --git a/packages/svelte/src/internal/client/dom/elements/class.js b/packages/svelte/src/internal/client/dom/elements/class.js
index 22f3da0f44..62ffb6d14b 100644
--- a/packages/svelte/src/internal/client/dom/elements/class.js
+++ b/packages/svelte/src/internal/client/dom/elements/class.js
@@ -3,12 +3,13 @@ import { hydrating } from '../hydration.js';
 /**
  * @param {SVGElement} dom
  * @param {string} value
+ * @param {string} [hash]
  * @returns {void}
  */
-export function set_svg_class(dom, value) {
+export function set_svg_class(dom, value, hash) {
 	// @ts-expect-error need to add __className to patched prototype
 	var prev_class_name = dom.__className;
-	var next_class_name = to_class(value);
+	var next_class_name = to_class(value, hash);
 
 	if (hydrating && dom.getAttribute('class') === next_class_name) {
 		// In case of hydration don't reset the class as it's already correct.
@@ -32,12 +33,13 @@ export function set_svg_class(dom, value) {
 /**
  * @param {MathMLElement} dom
  * @param {string} value
+ * @param {string} [hash]
  * @returns {void}
  */
-export function set_mathml_class(dom, value) {
+export function set_mathml_class(dom, value, hash) {
 	// @ts-expect-error need to add __className to patched prototype
 	var prev_class_name = dom.__className;
-	var next_class_name = to_class(value);
+	var next_class_name = to_class(value, hash);
 
 	if (hydrating && dom.getAttribute('class') === next_class_name) {
 		// In case of hydration don't reset the class as it's already correct.
@@ -61,12 +63,13 @@ export function set_mathml_class(dom, value) {
 /**
  * @param {HTMLElement} dom
  * @param {string} value
+ * @param {string} [hash]
  * @returns {void}
  */
-export function set_class(dom, value) {
+export function set_class(dom, value, hash) {
 	// @ts-expect-error need to add __className to patched prototype
 	var prev_class_name = dom.__className;
-	var next_class_name = to_class(value);
+	var next_class_name = to_class(value, hash);
 
 	if (hydrating && dom.className === next_class_name) {
 		// In case of hydration don't reset the class as it's already correct.
@@ -79,7 +82,7 @@ export function set_class(dom, value) {
 		// Removing the attribute when the value is only an empty string causes
 		// peformance issues vs simply making the className an empty string. So
 		// we should only remove the class if the the value is nullish.
-		if (value == null) {
+		if (value == null && !hash) {
 			dom.removeAttribute('class');
 		} else {
 			dom.className = next_class_name;
@@ -93,10 +96,11 @@ export function set_class(dom, value) {
 /**
  * @template V
  * @param {V} value
+ * @param {string} [hash]
  * @returns {string | V}
  */
-function to_class(value) {
-	return value == null ? '' : value;
+function to_class(value, hash) {
+	return (value == null ? '' : value) + (hash ? ' ' + hash : '');
 }
 
 /**
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index f22c33babc..3b85ae1816 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -161,7 +161,7 @@ export {
 	$window as window,
 	$document as document
 } from './dom/operations.js';
-export { attr } from '../shared/attributes.js';
+export { attr, clsx } from '../shared/attributes.js';
 export { snapshot } from '../shared/clone.js';
 export { noop, fallback } from '../shared/utils.js';
 export {
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index b8371b7e00..89b3c33df8 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -2,7 +2,7 @@
 /** @import { Component, Payload, RenderOutput } from '#server' */
 /** @import { Store } from '#shared' */
 export { FILENAME, HMR } from '../../constants.js';
-import { attr } from '../shared/attributes.js';
+import { attr, clsx } from '../shared/attributes.js';
 import { is_promise, noop } from '../shared/utils.js';
 import { subscribe_to_store } from '../../store/utils.js';
 import {
@@ -195,6 +195,10 @@ export function spread_attributes(attrs, classes, styles, flags = 0) {
 			: style_object_to_string(styles);
 	}
 
+	if (attrs.class) {
+		attrs.class = clsx(attrs.class);
+	}
+
 	if (classes) {
 		const classlist = attrs.class ? [attrs.class] : [];
 
@@ -522,7 +526,7 @@ export function once(get_value) {
 	};
 }
 
-export { attr };
+export { attr, clsx };
 
 export { html } from './blocks/html.js';
 
diff --git a/packages/svelte/src/internal/shared/attributes.js b/packages/svelte/src/internal/shared/attributes.js
index 867d6ba5d3..a561501bf4 100644
--- a/packages/svelte/src/internal/shared/attributes.js
+++ b/packages/svelte/src/internal/shared/attributes.js
@@ -1,4 +1,5 @@
 import { escape_html } from '../../escaping.js';
+import { clsx as _clsx } from 'clsx';
 
 /**
  * `<div translate={false}>` should be rendered as `<div translate="no">` and _not_
@@ -26,3 +27,16 @@ export function attr(name, value, is_boolean = false) {
 	const assignment = is_boolean ? '' : `="${escape_html(normalized, true)}"`;
 	return ` ${name}${assignment}`;
 }
+
+/**
+ * Small wrapper around clsx to preserve Svelte's (weird) handling of falsy values.
+ * TODO Svelte 6 revisit this, and likely turn all falsy values into the empty string (what clsx also does)
+ * @param  {any} value
+ */
+export function clsx(value) {
+	if (typeof value === 'object') {
+		return _clsx(value);
+	} else {
+		return value ?? '';
+	}
+}
diff --git a/packages/svelte/tests/css/samples/clsx-can-prune/_config.js b/packages/svelte/tests/css/samples/clsx-can-prune/_config.js
new file mode 100644
index 0000000000..43c80a318d
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-can-prune/_config.js
@@ -0,0 +1,20 @@
+import { test } from '../../test';
+
+export default test({
+	warnings: [
+		{
+			code: 'css_unused_selector',
+			message: 'Unused CSS selector ".unused"\nhttps://svelte.dev/e/css_unused_selector',
+			start: {
+				line: 24,
+				column: 1,
+				character: 548
+			},
+			end: {
+				line: 24,
+				column: 8,
+				character: 555
+			}
+		}
+	]
+});
diff --git a/packages/svelte/tests/css/samples/clsx-can-prune/expected.css b/packages/svelte/tests/css/samples/clsx-can-prune/expected.css
new file mode 100644
index 0000000000..620db0f022
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-can-prune/expected.css
@@ -0,0 +1,12 @@
+
+	.used1.svelte-xyz { color: green; }
+	.used2.svelte-xyz { color: green; }
+	.used3.svelte-xyz { color: green; }
+	.used4.svelte-xyz { color: green; }
+	.used5.svelte-xyz { color: green; }
+	.used6.svelte-xyz { color: green; }
+	.used7.svelte-xyz { color: green; }
+	.used8.svelte-xyz { color: green; }
+	.used9.svelte-xyz { color: green; }
+
+	/* (unused) .unused { color: red; }*/
diff --git a/packages/svelte/tests/css/samples/clsx-can-prune/input.svelte b/packages/svelte/tests/css/samples/clsx-can-prune/input.svelte
new file mode 100644
index 0000000000..2c75a39f99
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-can-prune/input.svelte
@@ -0,0 +1,25 @@
+<script>
+	let condition = Math.random() < 0.5;
+</script>
+
+<p class={['used1']}></p>
+<p class={[{ used2: true }]}></p>
+<p class={{ used3: true }}></p>
+<p class={{ 'used4 used5': true }}></p>
+<p class={{ used6 }}></p>
+<p class={[condition ? 'used7' : 'used8']}></p>
+<p class={[condition && 'used9']}></p>
+
+<style>
+	.used1 { color: green; }
+	.used2 { color: green; }
+	.used3 { color: green; }
+	.used4 { color: green; }
+	.used5 { color: green; }
+	.used6 { color: green; }
+	.used7 { color: green; }
+	.used8 { color: green; }
+	.used9 { color: green; }
+
+	.unused { color: red; }
+</style>
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-1/expected.css b/packages/svelte/tests/css/samples/clsx-cannot-prune-1/expected.css
new file mode 100644
index 0000000000..243bdb2b82
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-1/expected.css
@@ -0,0 +1,2 @@
+
+	.x.svelte-xyz { color: green; }
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-1/input.svelte b/packages/svelte/tests/css/samples/clsx-cannot-prune-1/input.svelte
new file mode 100644
index 0000000000..d9de0bdfd4
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-1/input.svelte
@@ -0,0 +1,5 @@
+<h1 class={[foo]}>hello world</h1>
+
+<style>
+	.x { color: green; }
+</style>
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-2/expected.css b/packages/svelte/tests/css/samples/clsx-cannot-prune-2/expected.css
new file mode 100644
index 0000000000..243bdb2b82
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-2/expected.css
@@ -0,0 +1,2 @@
+
+	.x.svelte-xyz { color: green; }
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-2/input.svelte b/packages/svelte/tests/css/samples/clsx-cannot-prune-2/input.svelte
new file mode 100644
index 0000000000..212deab4f0
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-2/input.svelte
@@ -0,0 +1,5 @@
+<h1 class={{ foo: true, ...rest }}>hello world</h1>
+
+<style>
+	.x { color: green; }
+</style>
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-3/expected.css b/packages/svelte/tests/css/samples/clsx-cannot-prune-3/expected.css
new file mode 100644
index 0000000000..243bdb2b82
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-3/expected.css
@@ -0,0 +1,2 @@
+
+	.x.svelte-xyz { color: green; }
diff --git a/packages/svelte/tests/css/samples/clsx-cannot-prune-3/input.svelte b/packages/svelte/tests/css/samples/clsx-cannot-prune-3/input.svelte
new file mode 100644
index 0000000000..2dfa1afd18
--- /dev/null
+++ b/packages/svelte/tests/css/samples/clsx-cannot-prune-3/input.svelte
@@ -0,0 +1,5 @@
+<h1 class={{ [foo]: true }}>hello world</h1>
+
+<style>
+	.x { color: green; }
+</style>
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-no-style/_config.js b/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-no-style/_config.js
index a7518f7e6c..b2f0396181 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-no-style/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-no-style/_config.js
@@ -40,7 +40,7 @@ export default test({
 		assert.equal(div.className, 'true');
 
 		component.testName = {};
-		assert.equal(div.className, '[object Object]');
+		assert.equal(div.className, '');
 
 		component.testName = '';
 		assert.equal(div.className, '');
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-with-style/_config.js b/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-with-style/_config.js
index dbab9fd42b..c8710f9038 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-with-style/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-null-classname-with-style/_config.js
@@ -32,7 +32,7 @@ export default test({
 		assert.equal(div.className, 'true svelte-x1o6ra');
 
 		component.testName = {};
-		assert.equal(div.className, '[object Object] svelte-x1o6ra');
+		assert.equal(div.className, ' svelte-x1o6ra');
 
 		component.testName = '';
 		assert.equal(div.className, ' svelte-x1o6ra');
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-no-style/_config.js b/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-no-style/_config.js
index a7518f7e6c..b2f0396181 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-no-style/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-no-style/_config.js
@@ -40,7 +40,7 @@ export default test({
 		assert.equal(div.className, 'true');
 
 		component.testName = {};
-		assert.equal(div.className, '[object Object]');
+		assert.equal(div.className, '');
 
 		component.testName = '';
 		assert.equal(div.className, '');
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-with-style/_config.js b/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-with-style/_config.js
index 20426dcf4b..8d0f411b8f 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-with-style/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-null-func-classname-with-style/_config.js
@@ -40,7 +40,7 @@ export default test({
 		assert.equal(div.className, 'true svelte-x1o6ra');
 
 		component.testName = {};
-		assert.equal(div.className, '[object Object] svelte-x1o6ra');
+		assert.equal(div.className, ' svelte-x1o6ra');
 
 		component.testName = '';
 		assert.equal(div.className, ' svelte-x1o6ra');
diff --git a/packages/svelte/tests/runtime-runes/samples/clsx/_config.js b/packages/svelte/tests/runtime-runes/samples/clsx/_config.js
new file mode 100644
index 0000000000..e0813d0e6c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/clsx/_config.js
@@ -0,0 +1,43 @@
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<div class="foo svelte-owbekl"></div>
+		<div class="foo svelte-owbekl"></div>
+		<div class="foo svelte-owbekl"></div>
+		<div class="foo svelte-owbekl"></div>
+		<div class="foo svelte-owbekl"></div>
+
+		<div class="foo">child</div>
+		<div class="foo">child</div>
+		<div class="foo">child</div>
+		<div class="foo">child</div>
+		<div class="foo">child</div>
+
+		<button>update</button>
+	`,
+	test({ assert, target }) {
+		const button = target.querySelector('button');
+
+		button?.click();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`
+				<div class="foo svelte-owbekl"></div>
+				<div class="foo svelte-owbekl"></div>
+				<div class="foo svelte-owbekl"></div>
+				<div class="foo svelte-owbekl"></div>
+				<div class="foo svelte-owbekl"></div>
+
+				<div class="foo">child</div>
+				<div class="foo">child</div>
+				<div class="foo">child</div>
+				<div class="foo">child</div>
+				<div class="foo">child</div>
+
+				<button>update</button>
+			`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/clsx/child.svelte b/packages/svelte/tests/runtime-runes/samples/clsx/child.svelte
new file mode 100644
index 0000000000..1b8be697c0
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/clsx/child.svelte
@@ -0,0 +1,5 @@
+<script>
+    let { class: cls } = $props();
+</script>
+
+<div class={cls}>child</div>
diff --git a/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte b/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte
new file mode 100644
index 0000000000..bf68b42e11
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte
@@ -0,0 +1,33 @@
+<script>
+	import Child from "./child.svelte";
+
+    let foo = $state('foo');
+    let bar = $state(null);
+    let spread = { class: { foo: true, bar: false } };
+</script>
+
+<div class={{ foo: true, bar: false }}></div>
+<div class={['foo', false && 'bar']}></div>
+<div class={{ foo, bar }}></div>
+<div class={[ foo, bar ]}></div>
+<div {...spread}></div>
+
+<Child class={{ foo: true, bar: false }} />
+<Child class={['foo', false && 'bar']} />
+<Child class={{ foo, bar }} />
+<Child class={[ foo, bar ]} />
+<Child {...spread} />
+
+<button onclick={() => {
+    foo = null;
+    bar = 'bar';
+}}>update</button>
+
+<style>
+    .foo {
+        color: red;
+    }
+    .bar {
+        color: blue;
+    }
+</style>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f7f38700e4..8bf7bb4224 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -80,6 +80,9 @@ importers:
       axobject-query:
         specifier: ^4.1.0
         version: 4.1.0
+      clsx:
+        specifier: ^2.1.1
+        version: 2.1.1
       esm-env:
         specifier: ^1.2.1
         version: 1.2.1
@@ -890,6 +893,10 @@ packages:
     resolution: {integrity: sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==}
     engines: {node: '>=8'}
 
+  clsx@2.1.1:
+    resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
+    engines: {node: '>=6'}
+
   color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
     engines: {node: '>=7.0.0'}
@@ -3055,6 +3062,8 @@ snapshots:
 
   ci-info@3.9.0: {}
 
+  clsx@2.1.1: {}
+
   color-convert@2.0.1:
     dependencies:
       color-name: 1.1.4

From 97f3aa91517cabb05ecf553b5be18bf38dcef1ae Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 24 Dec 2024 09:14:56 -0500
Subject: [PATCH 361/404] docs: fix links in some errors/warnings (#14825)

* fix links in some errors/warnings

* fix
---
 .../98-reference/.generated/client-errors.md     |  8 ++++++--
 .../98-reference/.generated/client-warnings.md   |  2 +-
 .../98-reference/.generated/compile-warnings.md  |  2 +-
 packages/svelte/messages/client-errors/errors.md |  8 ++++++--
 .../svelte/messages/client-warnings/warnings.md  |  2 +-
 .../svelte/messages/compile-warnings/a11y.md     |  2 +-
 packages/svelte/src/compiler/warnings.js         |  4 ++--
 packages/svelte/src/internal/client/errors.js    |  8 ++++----
 .../warnings.json                                | 16 ++++++++--------
 .../validator/samples/slot-warning/warnings.json |  2 +-
 .../samples/slot-warning2/warnings.json          |  2 +-
 11 files changed, 32 insertions(+), 24 deletions(-)

diff --git a/documentation/docs/98-reference/.generated/client-errors.md b/documentation/docs/98-reference/.generated/client-errors.md
index 90c9c1f9d1..2c2e0707ea 100644
--- a/documentation/docs/98-reference/.generated/client-errors.md
+++ b/documentation/docs/98-reference/.generated/client-errors.md
@@ -21,15 +21,19 @@ A component is attempting to bind to a non-bindable property `%key%` belonging t
 ### component_api_changed
 
 ```
-%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
+%parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5
 ```
 
+See the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
+
 ### component_api_invalid_new
 
 ```
-Attempted 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
+Attempted 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 the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
+
 ### derived_references_self
 
 ```
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 06ca578b76..5218ec4cb1 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -52,7 +52,7 @@ Your `console.%method%` contained `$state` proxies. Consider using `$inspect(...
 
 When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.
 
-The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte.dev/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte.dev/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
+The easiest way to log a value as it changes over time is to use the [`$inspect`](/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
 
 ### event_handler_invalid
 
diff --git a/documentation/docs/98-reference/.generated/compile-warnings.md b/documentation/docs/98-reference/.generated/compile-warnings.md
index 3d515305fe..57396bd7fd 100644
--- a/documentation/docs/98-reference/.generated/compile-warnings.md
+++ b/documentation/docs/98-reference/.generated/compile-warnings.md
@@ -62,7 +62,7 @@ Enforce that `autofocus` is not used on elements. Autofocusing elements can caus
 ### 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
+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
 ```
 
 Enforce that visible, non-interactive elements with an `onclick` event are accompanied by a keyboard event handler.
diff --git a/packages/svelte/messages/client-errors/errors.md b/packages/svelte/messages/client-errors/errors.md
index 517b028fa2..ce1f222c63 100644
--- a/packages/svelte/messages/client-errors/errors.md
+++ b/packages/svelte/messages/client-errors/errors.md
@@ -12,11 +12,15 @@
 
 ## component_api_changed
 
-> %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
+> %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5
+
+See the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
 
 ## component_api_invalid_new
 
-> Attempted 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
+> Attempted 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 the [migration guide](/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
 
 ## derived_references_self
 
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index 543be71080..21db506dc9 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -42,7 +42,7 @@ function add() {
 
 When logging a [proxy](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy), browser devtools will log the proxy itself rather than the value it represents. In the case of Svelte, the 'target' of a `$state` proxy might not resemble its current value, which can be confusing.
 
-The easiest way to log a value as it changes over time is to use the [`$inspect`](https://svelte.dev/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](https://svelte.dev/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
+The easiest way to log a value as it changes over time is to use the [`$inspect`](/docs/svelte/$inspect) rune. Alternatively, to log things on a one-off basis (for example, inside an event handler) you can use [`$state.snapshot`](/docs/svelte/$state#$state.snapshot) to take a snapshot of the current value.
 
 ## event_handler_invalid
 
diff --git a/packages/svelte/messages/compile-warnings/a11y.md b/packages/svelte/messages/compile-warnings/a11y.md
index 938c0a103d..a299fa53bc 100644
--- a/packages/svelte/messages/compile-warnings/a11y.md
+++ b/packages/svelte/messages/compile-warnings/a11y.md
@@ -49,7 +49,7 @@ Enforce that `autofocus` is not used on elements. Autofocusing elements can caus
 
 ## 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
+> 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
 
 Enforce that visible, non-interactive elements with an `onclick` event are accompanied by a keyboard event handler.
 
diff --git a/packages/svelte/src/compiler/warnings.js b/packages/svelte/src/compiler/warnings.js
index b9fffc23a5..81d4e3240e 100644
--- a/packages/svelte/src/compiler/warnings.js
+++ b/packages/svelte/src/compiler/warnings.js
@@ -168,11 +168,11 @@ export function a11y_autofocus(node) {
 }
 
 /**
- * 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
+ * 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
  * @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\nhttps://svelte.dev/e/a11y_click_events_have_key_events`);
+	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\nhttps://svelte.dev/e/a11y_click_events_have_key_events`);
 }
 
 /**
diff --git a/packages/svelte/src/internal/client/errors.js b/packages/svelte/src/internal/client/errors.js
index 56c0cc31df..682816e1d6 100644
--- a/packages/svelte/src/internal/client/errors.js
+++ b/packages/svelte/src/internal/client/errors.js
@@ -54,7 +54,7 @@ export function bind_not_bindable(key, component, name) {
 }
 
 /**
- * %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
+ * %parent% called `%method%` on an instance of %component%, which is no longer valid in Svelte 5
  * @param {string} parent
  * @param {string} method
  * @param {string} component
@@ -62,7 +62,7 @@ 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\nhttps://svelte.dev/e/component_api_changed`);
+		const error = new Error(`component_api_changed\n${parent} called \`${method}\` on an instance of ${component}, which is no longer valid in Svelte 5\nhttps://svelte.dev/e/component_api_changed`);
 
 		error.name = 'Svelte error';
 		throw error;
@@ -72,14 +72,14 @@ export function component_api_changed(parent, method, component) {
 }
 
 /**
- * Attempted 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
+ * Attempted 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.
  * @param {string} component
  * @param {string} name
  * @returns {never}
  */
 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\nhttps://svelte.dev/e/component_api_invalid_new`);
+		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.\nhttps://svelte.dev/e/component_api_invalid_new`);
 
 		error.name = 'Svelte error';
 		throw error;
diff --git a/packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/warnings.json b/packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/warnings.json
index a1628842fb..0a759da957 100644
--- a/packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/warnings.json
+++ b/packages/svelte/tests/validator/samples/a11y-click-events-have-key-events/warnings.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 13,
 			"column": 0
@@ -13,7 +13,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 15,
 			"column": 0
@@ -25,7 +25,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 18,
 			"column": 0
@@ -37,7 +37,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 20,
 			"column": 0
@@ -49,7 +49,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 22,
 			"column": 0
@@ -61,7 +61,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 24,
 			"column": 0
@@ -73,7 +73,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 26,
 			"column": 0
@@ -85,7 +85,7 @@
 	},
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"line": 28,
 			"column": 0
diff --git a/packages/svelte/tests/validator/samples/slot-warning/warnings.json b/packages/svelte/tests/validator/samples/slot-warning/warnings.json
index a390d1d348..c146a7d716 100644
--- a/packages/svelte/tests/validator/samples/slot-warning/warnings.json
+++ b/packages/svelte/tests/validator/samples/slot-warning/warnings.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"column": 1,
 			"line": 7
diff --git a/packages/svelte/tests/validator/samples/slot-warning2/warnings.json b/packages/svelte/tests/validator/samples/slot-warning2/warnings.json
index 7a273cda5d..b8b9876ebb 100644
--- a/packages/svelte/tests/validator/samples/slot-warning2/warnings.json
+++ b/packages/svelte/tests/validator/samples/slot-warning2/warnings.json
@@ -1,7 +1,7 @@
 [
 	{
 		"code": "a11y_click_events_have_key_events",
-		"message": "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",
+		"message": "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",
 		"start": {
 			"column": 1,
 			"line": 8

From 7f8acb8a3705e1c9612f0d56e3a94596f0db1ef3 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 24 Dec 2024 10:39:03 -0500
Subject: [PATCH 362/404] Version Packages (#14824)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/thin-panthers-sing.md |  5 -----
 .changeset/twenty-shoes-peel.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/thin-panthers-sing.md
 delete mode 100644 .changeset/twenty-shoes-peel.md

diff --git a/.changeset/thin-panthers-sing.md b/.changeset/thin-panthers-sing.md
deleted file mode 100644
index 223de002c6..0000000000
--- a/.changeset/thin-panthers-sing.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: allow `class` attribute to be an object or array, using `clsx`
diff --git a/.changeset/twenty-shoes-peel.md b/.changeset/twenty-shoes-peel.md
deleted file mode 100644
index e0a8e0701d..0000000000
--- a/.changeset/twenty-shoes-peel.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't include keyframes in global scope in the keyframes to rename
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 1e9c3451f3..1bcf03e7aa 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.16.0
+
+### Minor Changes
+
+- feat: allow `class` attribute to be an object or array, using `clsx` ([#14714](https://github.com/sveltejs/svelte/pull/14714))
+
+### Patch Changes
+
+- fix: don't include keyframes in global scope in the keyframes to rename ([#14822](https://github.com/sveltejs/svelte/pull/14822))
+
 ## 5.15.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index b9f4d3de09..c872dcea4d 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.15.0",
+  "version": "5.16.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 00070ffab0..c66ef517d6 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.15.0';
+export const VERSION = '5.16.0';
 export const PUBLIC_VERSION = '5';

From 32348a5387ed8607e4bd688eddd3aa87c17abc21 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sat, 28 Dec 2024 21:59:21 +0000
Subject: [PATCH 363/404] fix: ensure $inspect.trace works correctly with null
 values (#14853)

* fix: ensure $inspect.trace works correctly with null values

* fix: ensure $inspect.trace works correctly with null values
---
 .changeset/rotten-ligers-agree.md                  | 5 +++++
 packages/svelte/src/internal/client/dev/tracing.js | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/rotten-ligers-agree.md

diff --git a/.changeset/rotten-ligers-agree.md b/.changeset/rotten-ligers-agree.md
new file mode 100644
index 0000000000..53c62e7602
--- /dev/null
+++ b/.changeset/rotten-ligers-agree.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure $inspect.trace works correctly with null values
diff --git a/packages/svelte/src/internal/client/dev/tracing.js b/packages/svelte/src/internal/client/dev/tracing.js
index 1426e9efc9..302a8f6480 100644
--- a/packages/svelte/src/internal/client/dev/tracing.js
+++ b/packages/svelte/src/internal/client/dev/tracing.js
@@ -51,7 +51,9 @@ function log_entry(signal, entry) {
 		status !== 'clean'
 			? 'color: CornflowerBlue; font-weight: bold'
 			: 'color: grey; font-weight: bold',
-		typeof value === 'object' && STATE_SYMBOL in value ? snapshot(value, true) : value
+		typeof value === 'object' && value !== null && STATE_SYMBOL in value
+			? snapshot(value, true)
+			: value
 	);
 
 	if (type === '$derived') {

From f7f87dcc3db76987b301d8ced0ef4669f2be53ac Mon Sep 17 00:00:00 2001
From: Sri Senthil Balaji J <50240805+SymphonySimper@users.noreply.github.com>
Date: Wed, 1 Jan 2025 20:52:09 +0530
Subject: [PATCH 364/404] chore: remove svelte.dev section from README.md
 (#14771)

* docs: update svelte.dev section in README.md

* docs: remove svelte.dev section from README.md
---
 README.md | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/README.md b/README.md
index be94cba63c..cfb1328495 100644
--- a/README.md
+++ b/README.md
@@ -24,10 +24,6 @@ You may view [our roadmap](https://svelte.dev/roadmap) if you'd like to see what
 
 Please see the [Contributing Guide](CONTRIBUTING.md) and the [`svelte`](packages/svelte) package for information on contributing to Svelte.
 
-### svelte.dev
-
-The source code for https://svelte.dev lives in the [sites](https://github.com/sveltejs/svelte/tree/master/sites/svelte.dev) folder, with all the documentation right [here](https://github.com/sveltejs/svelte/tree/master/documentation). The site is built with [SvelteKit](https://svelte.dev/docs/kit).
-
 ## Is svelte.dev down?
 
 Probably not, but it's possible. If you can't seem to access any `.dev` sites, check out [this SuperUser question and answer](https://superuser.com/q/1413402).

From 8148734812006ae52a314561e26956e02a386f21 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Thu, 2 Jan 2025 16:54:43 +0000
Subject: [PATCH 365/404] fix: ensure unowned deriveds correctly get re-linked
 to the graph (#14855)

* fix: ensure unowned deriveds correctly get re-linked to the graph

* fix: ensure unowned deriveds correctly get re-linked to the graph

* fix: ensure unowned deriveds correctly get re-linked to the graph

* add test

* add test

* cleaner apporach

* cleaner apporach

* cleaner apporach

* cleaner apporach
---
 .changeset/chatty-dolphins-complain.md        |  5 +++
 .../svelte/src/internal/client/runtime.js     | 38 +++++++++----------
 packages/svelte/tests/signals/test.ts         | 33 ++++++++++++++++
 3 files changed, 57 insertions(+), 19 deletions(-)
 create mode 100644 .changeset/chatty-dolphins-complain.md

diff --git a/.changeset/chatty-dolphins-complain.md b/.changeset/chatty-dolphins-complain.md
new file mode 100644
index 0000000000..b2c6f2b971
--- /dev/null
+++ b/.changeset/chatty-dolphins-complain.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure unowned deriveds correctly get re-linked to the graph
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 4a90a21971..83d01caabe 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -196,34 +196,34 @@ export function check_dirtiness(reaction) {
 
 		if (dependencies !== null) {
 			var i;
-
-			if ((flags & DISCONNECTED) !== 0) {
-				for (i = 0; i < dependencies.length; i++) {
-					(dependencies[i].reactions ??= []).push(reaction);
+			var dependency;
+			var is_disconnected = (flags & DISCONNECTED) !== 0;
+			var is_unowned_connected = is_unowned && active_effect !== null && !skip_reaction;
+			var length = dependencies.length;
+
+			// If we are working with a disconnected or an unowned signal that is now connected (due to an active effect)
+			// then we need to re-connect the reaction to the dependency
+			if (is_disconnected || is_unowned_connected) {
+				for (i = 0; i < length; i++) {
+					dependency = dependencies[i];
+
+					if (!dependency?.reactions?.includes(reaction)) {
+						(dependency.reactions ??= []).push(reaction);
+					}
 				}
 
-				reaction.f ^= DISCONNECTED;
+				if (is_disconnected) {
+					reaction.f ^= DISCONNECTED;
+				}
 			}
 
-			for (i = 0; i < dependencies.length; i++) {
-				var dependency = dependencies[i];
+			for (i = 0; i < length; i++) {
+				dependency = dependencies[i];
 
 				if (check_dirtiness(/** @type {Derived} */ (dependency))) {
 					update_derived(/** @type {Derived} */ (dependency));
 				}
 
-				// If we are working with an unowned signal as part of an effect (due to !skip_reaction)
-				// and the version hasn't changed, we still need to check that this reaction
-				// is linked to the dependency source – otherwise future updates will not be caught.
-				if (
-					is_unowned &&
-					active_effect !== null &&
-					!skip_reaction &&
-					!dependency?.reactions?.includes(reaction)
-				) {
-					(dependency.reactions ??= []).push(reaction);
-				}
-
 				if (dependency.version > reaction.version) {
 					return true;
 				}
diff --git a/packages/svelte/tests/signals/test.ts b/packages/svelte/tests/signals/test.ts
index 6796655cc8..0a22e30286 100644
--- a/packages/svelte/tests/signals/test.ts
+++ b/packages/svelte/tests/signals/test.ts
@@ -781,4 +781,37 @@ describe('signals', () => {
 			assert.equal($.get(count), 0n);
 		};
 	});
+
+	test('unowned deriveds correctly re-attach to their source', () => {
+		const log: any[] = [];
+
+		return () => {
+			const a = state(0);
+			const b = state(0);
+			const c = derived(() => {
+				$.get(a);
+				return $.get(b);
+			});
+
+			$.get(c);
+
+			set(a, 1);
+
+			const destroy = effect_root(() => {
+				render_effect(() => {
+					log.push($.get(c));
+				});
+			});
+
+			assert.deepEqual(log, [0]);
+
+			set(b, 1);
+
+			flushSync();
+
+			assert.deepEqual(log, [0, 1]);
+
+			destroy();
+		};
+	});
 });

From f3a7ded734982ac417b63661bc33a3df859d94f9 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Thu, 2 Jan 2025 16:56:55 +0000
Subject: [PATCH 366/404] Version Packages (#14856)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/chatty-dolphins-complain.md | 5 -----
 .changeset/rotten-ligers-agree.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/chatty-dolphins-complain.md
 delete mode 100644 .changeset/rotten-ligers-agree.md

diff --git a/.changeset/chatty-dolphins-complain.md b/.changeset/chatty-dolphins-complain.md
deleted file mode 100644
index b2c6f2b971..0000000000
--- a/.changeset/chatty-dolphins-complain.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure unowned deriveds correctly get re-linked to the graph
diff --git a/.changeset/rotten-ligers-agree.md b/.changeset/rotten-ligers-agree.md
deleted file mode 100644
index 53c62e7602..0000000000
--- a/.changeset/rotten-ligers-agree.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure $inspect.trace works correctly with null values
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 1bcf03e7aa..277d1631cb 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.16.1
+
+### Patch Changes
+
+- fix: ensure unowned deriveds correctly get re-linked to the graph ([#14855](https://github.com/sveltejs/svelte/pull/14855))
+
+- fix: ensure $inspect.trace works correctly with null values ([#14853](https://github.com/sveltejs/svelte/pull/14853))
+
 ## 5.16.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index c872dcea4d..a054f6c6d9 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.16.0",
+  "version": "5.16.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c66ef517d6..8a57832c96 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.16.0';
+export const VERSION = '5.16.1';
 export const PUBLIC_VERSION = '5';

From a91308d9db2f37f91b7c7e379c638fe6cd814d0c Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Fri, 3 Jan 2025 21:40:31 +0100
Subject: [PATCH 367/404] fix: correctly highlight sources reassigned inside
 `trace` (#14811)

* fix: correctly highlight sources reassigned inside `trace`

* chore: add missing effect logs

* fix: prevent `null` access on `tracing_expressions` for nested tracing

* chore: add test case for #14853

* fix: types for `$inpect.trace`
---
 .changeset/silver-shoes-rule.md               |  5 ++
 packages/svelte/src/ambient.d.ts              |  2 +-
 .../svelte/src/internal/client/dev/tracing.js |  4 +-
 .../src/internal/client/reactivity/sources.js |  5 ++
 .../src/internal/client/reactivity/types.d.ts |  2 +
 .../svelte/src/internal/client/runtime.js     | 17 +++++
 .../samples/inspect-trace-nested/_config.js   | 56 +++++++++++++++
 .../samples/inspect-trace-nested/main.svelte  | 13 ++++
 .../samples/inspect-trace-null/_config.js     |  8 +++
 .../samples/inspect-trace-null/main.svelte    |  9 +++
 .../inspect-trace-reassignment/_config.js     | 72 +++++++++++++++++++
 .../inspect-trace-reassignment/main.svelte    | 18 +++++
 packages/svelte/types/index.d.ts              |  2 +-
 13 files changed, 209 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/silver-shoes-rule.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-null/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-null/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/main.svelte

diff --git a/.changeset/silver-shoes-rule.md b/.changeset/silver-shoes-rule.md
new file mode 100644
index 0000000000..b1c44c9007
--- /dev/null
+++ b/.changeset/silver-shoes-rule.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly highlight sources reassigned inside `trace`
diff --git a/packages/svelte/src/ambient.d.ts b/packages/svelte/src/ambient.d.ts
index 9dbc61c7cb..fbcecba8e4 100644
--- a/packages/svelte/src/ambient.d.ts
+++ b/packages/svelte/src/ambient.d.ts
@@ -433,7 +433,7 @@ declare namespace $inspect {
 	 *   });
 	 * </script>
 	 */
-	export function trace(name: string): void;
+	export function trace(name?: string): void;
 
 	// prevent intellisense from being unhelpful
 	/** @deprecated */
diff --git a/packages/svelte/src/internal/client/dev/tracing.js b/packages/svelte/src/internal/client/dev/tracing.js
index 302a8f6480..6e759ecd59 100644
--- a/packages/svelte/src/internal/client/dev/tracing.js
+++ b/packages/svelte/src/internal/client/dev/tracing.js
@@ -15,7 +15,7 @@ export let tracing_expressions = null;
  */
 function log_entry(signal, entry) {
 	const debug = signal.debug;
-	const value = signal.v;
+	const value = signal.trace_need_increase ? signal.trace_v : signal.v;
 
 	if (value === UNINITIALIZED) {
 		return;
@@ -121,7 +121,7 @@ export function trace(label, fn) {
 			console.groupEnd();
 		}
 
-		if (previously_tracing_expressions !== null) {
+		if (previously_tracing_expressions !== null && tracing_expressions !== null) {
 			for (const [signal, entry] of tracing_expressions.entries) {
 				var prev_entry = previously_tracing_expressions.get(signal);
 
diff --git a/packages/svelte/src/internal/client/reactivity/sources.js b/packages/svelte/src/internal/client/reactivity/sources.js
index 3e8c4a00c8..fedf5b5070 100644
--- a/packages/svelte/src/internal/client/reactivity/sources.js
+++ b/packages/svelte/src/internal/client/reactivity/sources.js
@@ -167,11 +167,16 @@ export function set(source, value) {
  */
 export function internal_set(source, value) {
 	if (!source.equals(value)) {
+		var old_value = source.v;
 		source.v = value;
 		source.version = increment_version();
 
 		if (DEV && tracing_mode_flag) {
 			source.updated = get_stack('UpdatedAt');
+			if (active_effect != null) {
+				source.trace_need_increase = true;
+				source.trace_v ??= old_value;
+			}
 		}
 
 		mark_reactions(source, DIRTY);
diff --git a/packages/svelte/src/internal/client/reactivity/types.d.ts b/packages/svelte/src/internal/client/reactivity/types.d.ts
index 13e14414b5..9a6e5d8bf0 100644
--- a/packages/svelte/src/internal/client/reactivity/types.d.ts
+++ b/packages/svelte/src/internal/client/reactivity/types.d.ts
@@ -17,6 +17,8 @@ export interface Value<V = unknown> extends Signal {
 	/** Dev only */
 	created?: Error | null;
 	updated?: Error | null;
+	trace_need_increase?: boolean;
+	trace_v?: V;
 	debug?: null | (() => void);
 }
 
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 83d01caabe..c5223a6ae4 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -528,6 +528,23 @@ export function update_effect(effect) {
 		effect.teardown = typeof teardown === 'function' ? teardown : null;
 		effect.version = current_version;
 
+		var deps = effect.deps;
+
+		// In DEV, we need to handle a case where $inspect.trace() might
+		// incorrectly state a source dependency has not changed when it has.
+		// That's beacuse that source was changed by the same effect, causing
+		// the versions to match. We can avoid this by incrementing the version
+		if (DEV && tracing_mode_flag && (effect.f & DIRTY) !== 0 && deps !== null) {
+			for (let i = 0; i < deps.length; i++) {
+				var dep = deps[i];
+				if (dep.trace_need_increase) {
+					dep.version = increment_version();
+					dep.trace_need_increase = undefined;
+					dep.trace_v = undefined;
+				}
+			}
+		}
+
 		if (DEV) {
 			dev_effect_stack.push(effect);
 		}
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/_config.js
new file mode 100644
index 0000000000..f54f78f5c1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/_config.js
@@ -0,0 +1,56 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+/**
+ * @param {any[]} logs
+ */
+function normalise_trace_logs(logs) {
+	let normalised = [];
+	for (let i = 0; i < logs.length; i++) {
+		const log = logs[i];
+
+		if (typeof log === 'string' && log.includes('%c')) {
+			const split = log.split('%c');
+			normalised.push({
+				log: (split[0].length !== 0 ? split[0] : split[1]).trim(),
+				highlighted: logs[i + 1] === 'color: CornflowerBlue; font-weight: bold'
+			});
+			i++;
+		} else if (log instanceof Error) {
+			continue;
+		} else {
+			normalised.push({ log });
+		}
+	}
+	return normalised;
+}
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	test({ assert, target, logs }) {
+		// initial log, everything is highlighted
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'iife', highlighted: false },
+			{ log: '$state', highlighted: true },
+			{ log: 0 },
+			{ log: 'effect', highlighted: false }
+		]);
+
+		logs.length = 0;
+
+		const button = target.querySelector('button');
+		button?.click();
+		flushSync();
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'iife', highlighted: false },
+			{ log: '$state', highlighted: true },
+			{ log: 1 },
+			{ log: 'effect', highlighted: false }
+		]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/main.svelte
new file mode 100644
index 0000000000..f60fb0438c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-nested/main.svelte
@@ -0,0 +1,13 @@
+<script>
+	let count = $state(0);
+
+	$effect(() => {
+		$inspect.trace('effect');
+		(()=>{
+			$inspect.trace("iife");
+			count;
+		})();
+	});
+</script>
+
+<button onclick={() => count++}>{count}</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/_config.js
new file mode 100644
index 0000000000..e779a835c2
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/_config.js
@@ -0,0 +1,8 @@
+import { test } from '../../test';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+	test() {}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/main.svelte
new file mode 100644
index 0000000000..30eb95f124
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-null/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	let count = $state(null);
+	$effect(() => {
+		$inspect.trace();
+		count;
+	});
+</script>
+
+<button onclick={()=>count++}>{count}</button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/_config.js b/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/_config.js
new file mode 100644
index 0000000000..c9a66289a1
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/_config.js
@@ -0,0 +1,72 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+/**
+ * @param {any[]} logs
+ */
+function normalise_trace_logs(logs) {
+	let normalised = [];
+	for (let i = 0; i < logs.length; i++) {
+		const log = logs[i];
+
+		if (typeof log === 'string' && log.includes('%c')) {
+			const split = log.split('%c');
+			normalised.push({
+				log: (split[0].length !== 0 ? split[0] : split[1]).trim(),
+				highlighted: logs[i + 1] === 'color: CornflowerBlue; font-weight: bold'
+			});
+			i++;
+		} else if (log instanceof Error) {
+			continue;
+		} else {
+			normalised.push({ log });
+		}
+	}
+	return normalised;
+}
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+
+	test({ assert, target, logs }) {
+		// initial log, everything is highlighted
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$state', highlighted: true },
+			{ log: false }
+		]);
+
+		logs.length = 0;
+
+		const button = target.querySelector('button');
+		button?.click();
+		flushSync();
+
+		const input = target.querySelector('input');
+		input?.click();
+		flushSync();
+
+		// checked changed, effect reassign state, values should be correct and be correctly highlighted
+
+		assert.deepEqual(normalise_trace_logs(logs), [
+			{ log: 'effect', highlighted: false },
+			{ log: '$state', highlighted: true },
+			{ log: true },
+			{ log: '$state', highlighted: true },
+			{ log: 1 },
+			{ log: 'effect', highlighted: false },
+			{ log: '$state', highlighted: false },
+			{ log: true },
+			{ log: '$state', highlighted: true },
+			{ log: 2 },
+			{ log: 'effect', highlighted: false },
+			{ log: '$state', highlighted: false },
+			{ log: true },
+			{ log: '$state', highlighted: true },
+			{ log: 3 }
+		]);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/main.svelte b/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/main.svelte
new file mode 100644
index 0000000000..5028c0f251
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/inspect-trace-reassignment/main.svelte
@@ -0,0 +1,18 @@
+<script>
+	let count = $state(0);
+	let checked = $state(false);
+
+	$effect(() => {
+		$inspect.trace("effect");
+		if(checked && count > 0 && count < 3){
+			let old = count;
+			// this should not show up in the logs
+			count = 1000;
+			count = old + 1;
+		}
+	});
+</script>
+<input type="checkbox" bind:checked />
+<button onclick={()=>{
+	count++;
+}}>{count}</button>
\ No newline at end of file
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index d422abebbc..b6b76b1cb7 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -3091,7 +3091,7 @@ declare namespace $inspect {
 	 *   });
 	 * </script>
 	 */
-	export function trace(name: string): void;
+	export function trace(name?: string): void;
 
 	// prevent intellisense from being unhelpful
 	/** @deprecated */

From 82db92f8707f593a0d14c2dab4089f6f36b3ada3 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Sun, 5 Jan 2025 20:25:27 +0000
Subject: [PATCH 368/404] fix: ensure disconnected deriveds correctly connect
 again (#14899)

* fix: ensure disconnected deriveds correctly connect again

* fix: ensure disconnected deriveds correctly connect again
---
 .changeset/happy-plums-greet.md               |  5 +
 .../svelte/src/internal/client/runtime.js     |  4 +-
 .../samples/derived-disconnect/_config.js     | 96 +++++++++++++++++++
 .../samples/derived-disconnect/main.svelte    | 23 +++++
 4 files changed, 127 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/happy-plums-greet.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-disconnect/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/derived-disconnect/main.svelte

diff --git a/.changeset/happy-plums-greet.md b/.changeset/happy-plums-greet.md
new file mode 100644
index 0000000000..695fbff8fd
--- /dev/null
+++ b/.changeset/happy-plums-greet.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure disconnected deriveds correctly connect again
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index c5223a6ae4..0be91d78ba 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -207,7 +207,9 @@ export function check_dirtiness(reaction) {
 				for (i = 0; i < length; i++) {
 					dependency = dependencies[i];
 
-					if (!dependency?.reactions?.includes(reaction)) {
+					// We always re-add all reactions (even duplicates) if the derived was
+					// previously disconnected
+					if (is_disconnected || !dependency?.reactions?.includes(reaction)) {
 						(dependency.reactions ??= []).push(reaction);
 					}
 				}
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-disconnect/_config.js b/packages/svelte/tests/runtime-runes/samples/derived-disconnect/_config.js
new file mode 100644
index 0000000000..76e60b7402
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-disconnect/_config.js
@@ -0,0 +1,96 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, logs }) {
+		let [b1, b2, b3, b4, b5] = target.querySelectorAll('button');
+
+		b1?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 1</div>
+			<div>Name: a</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b2?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 2</div>
+			<div>Name: b</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b3?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 3</div>
+			<div>Name: c</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b4?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 4</div>
+			<div>Name: d</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b5?.click();
+		flushSync();
+
+		b5?.click();
+		flushSync();
+
+		[b1, b2, b3, b4, b5] = target.querySelectorAll('button');
+
+		b1?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 1</div>
+			<div>Name: a</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b2?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 2</div>
+			<div>Name: b</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b3?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 3</div>
+			<div>Name: c</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+
+		b4?.click();
+		flushSync();
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<main><div>Current ID: 4</div>
+			<div>Name: d</div><div><button>a</button></div><div><button>b</button></div><div><button>c</button></div><div><button>d</button></div><hr><div>
+			<button>Show / Hide</button></div></main>`
+		);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/derived-disconnect/main.svelte b/packages/svelte/tests/runtime-runes/samples/derived-disconnect/main.svelte
new file mode 100644
index 0000000000..8cb6ed2afd
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/derived-disconnect/main.svelte
@@ -0,0 +1,23 @@
+<script>
+	const items = [
+		{ id: 1, name: "a" },
+		{ id: 2, name: "b" },
+		{ id: 3, name: "c" },
+		{ id: 4, name: "d" },
+	];
+	let currentId = $state(1);
+	let currentItem = $derived(items.find(item => item.id === currentId));
+	let visible = $state(true);
+</script>
+
+<main>
+	{#if visible}
+		<div>Current ID: {currentId}</div>
+		<div>Name: {currentItem.name}</div>
+		{#each items as item}
+			<div><button onclick={() => { currentId = item.id; }}>{item.name}</button></div>
+		{/each}
+	{/if}
+	<hr>
+	<div><button onclick={() => { visible = !visible; }}>Show / Hide</button></div>
+</main>

From ed26c3f658acb0292f06e6a437d42bb64e804447 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Sun, 5 Jan 2025 20:38:17 +0000
Subject: [PATCH 369/404] Version Packages (#14888)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/happy-plums-greet.md | 5 -----
 .changeset/silver-shoes-rule.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/happy-plums-greet.md
 delete mode 100644 .changeset/silver-shoes-rule.md

diff --git a/.changeset/happy-plums-greet.md b/.changeset/happy-plums-greet.md
deleted file mode 100644
index 695fbff8fd..0000000000
--- a/.changeset/happy-plums-greet.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: ensure disconnected deriveds correctly connect again
diff --git a/.changeset/silver-shoes-rule.md b/.changeset/silver-shoes-rule.md
deleted file mode 100644
index b1c44c9007..0000000000
--- a/.changeset/silver-shoes-rule.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly highlight sources reassigned inside `trace`
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 277d1631cb..97aad73746 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.16.2
+
+### Patch Changes
+
+- fix: ensure disconnected deriveds correctly connect again ([#14899](https://github.com/sveltejs/svelte/pull/14899))
+
+- fix: correctly highlight sources reassigned inside `trace` ([#14811](https://github.com/sveltejs/svelte/pull/14811))
+
 ## 5.16.1
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index a054f6c6d9..f4b9a3faff 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.16.1",
+  "version": "5.16.2",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 8a57832c96..add463faef 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.16.1';
+export const VERSION = '5.16.2';
 export const PUBLIC_VERSION = '5';

From c4e9faad52c09e143148a69c3643d36462175499 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Mon, 6 Jan 2025 11:08:07 +0100
Subject: [PATCH 370/404] fix: correctly parse `each` with loose parser
 (#14887)

* fix: correctly parse `each` with loose parser

* chore: fix lint

* chore: remove unused imports

* Apply suggestions from code review

* chore: fix lint

---------

Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
---
 .changeset/famous-scissors-begin.md           |   5 +
 .../phases/1-parse/read/expression.js         |  43 ++-
 .../src/compiler/phases/1-parse/state/tag.js  |  22 +-
 .../samples/loose-valid-each-as/input.svelte  |   7 +
 .../samples/loose-valid-each-as/output.json   | 308 ++++++++++++++++++
 5 files changed, 364 insertions(+), 21 deletions(-)
 create mode 100644 .changeset/famous-scissors-begin.md
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-valid-each-as/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/loose-valid-each-as/output.json

diff --git a/.changeset/famous-scissors-begin.md b/.changeset/famous-scissors-begin.md
new file mode 100644
index 0000000000..96075d0dac
--- /dev/null
+++ b/.changeset/famous-scissors-begin.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly parse `each` with loose parser
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 907608b11b..82a667d38c 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/expression.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/expression.js
@@ -8,9 +8,31 @@ import { find_matching_bracket } from '../utils/bracket.js';
 /**
  * @param {Parser} parser
  * @param {string} [opening_token]
+ * @returns {Expression | undefined}
+ */
+export function get_loose_identifier(parser, opening_token) {
+	// Find the next } and treat it as the end of the expression
+	const end = find_matching_bracket(parser.template, parser.index, opening_token ?? '{');
+	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: ''
+		};
+	}
+}
+
+/**
+ * @param {Parser} parser
+ * @param {string} [opening_token]
+ * @param {boolean} [disallow_loose]
  * @returns {Expression}
  */
-export default function read_expression(parser, opening_token) {
+export default function read_expression(parser, opening_token, disallow_loose) {
 	try {
 		const node = parse_expression_at(parser.template, parser.ts, parser.index);
 
@@ -41,19 +63,12 @@ export default function read_expression(parser, opening_token) {
 
 		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, opening_token ?? '{');
-			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: ''
-				};
+		// If we are in an each loop we need the error to be thrown in cases like
+		// `as { y = z }` so we still throw and handle the error there
+		if (parser.loose && !disallow_loose) {
+			const expression = get_loose_identifier(parser, opening_token);
+			if (expression) {
+				return expression;
 			}
 		}
 
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 7996d64ded..95d7d00677 100644
--- a/packages/svelte/src/compiler/phases/1-parse/state/tag.js
+++ b/packages/svelte/src/compiler/phases/1-parse/state/tag.js
@@ -1,13 +1,13 @@
 /** @import { ArrowFunctionExpression, Expression, Identifier, Pattern } from 'estree' */
 /** @import { AST } from '#compiler' */
 /** @import { Parser } from '../index.js' */
-import read_pattern from '../read/context.js';
-import read_expression from '../read/expression.js';
-import * as e from '../../../errors.js';
-import { create_fragment } from '../utils/create.js';
 import { walk } from 'zimmerframe';
-import { parse_expression_at } from '../acorn.js';
+import * as e from '../../../errors.js';
 import { create_expression_metadata } from '../../nodes.js';
+import { parse_expression_at } from '../acorn.js';
+import read_pattern from '../read/context.js';
+import read_expression, { get_loose_identifier } from '../read/expression.js';
+import { create_fragment } from '../utils/create.js';
 
 const regex_whitespace_with_closing_curly_brace = /^\s*}/;
 
@@ -87,7 +87,7 @@ function open(parser) {
 		// we get a valid expression
 		while (!expression) {
 			try {
-				expression = read_expression(parser);
+				expression = read_expression(parser, undefined, true);
 			} catch (err) {
 				end = /** @type {any} */ (err).position[0] - 2;
 
@@ -95,7 +95,15 @@ function open(parser) {
 					end -= 1;
 				}
 
-				if (end <= start) throw err;
+				if (end <= start) {
+					if (parser.loose) {
+						expression = get_loose_identifier(parser);
+						if (expression) {
+							break;
+						}
+					}
+					throw err;
+				}
 
 				// @ts-expect-error parser.template is meant to be readonly, this is a special case
 				parser.template = template.slice(0, end);
diff --git a/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/input.svelte b/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/input.svelte
new file mode 100644
index 0000000000..f2cc7f5e79
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/input.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	let arr = [];
+</script>
+
+{#each arr as [key, value = 'default']}
+	<div>{key}: {value}</div>
+{/each}
diff --git a/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/output.json b/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/output.json
new file mode 100644
index 0000000000..181f1ba250
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/loose-valid-each-as/output.json
@@ -0,0 +1,308 @@
+{
+	"css": null,
+	"js": [],
+	"start": 45,
+	"end": 119,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "Text",
+				"start": 43,
+				"end": 45,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 45,
+				"end": 119,
+				"expression": {
+					"type": "Identifier",
+					"start": 52,
+					"end": 55,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 7
+						},
+						"end": {
+							"line": 5,
+							"column": 10
+						}
+					},
+					"name": "arr"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 84,
+							"end": 86,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 86,
+							"end": 111,
+							"name": "div",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "ExpressionTag",
+										"start": 91,
+										"end": 96,
+										"expression": {
+											"type": "Identifier",
+											"start": 92,
+											"end": 95,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 7
+												},
+												"end": {
+													"line": 6,
+													"column": 10
+												}
+											},
+											"name": "key"
+										}
+									},
+									{
+										"type": "Text",
+										"start": 96,
+										"end": 98,
+										"raw": ": ",
+										"data": ": "
+									},
+									{
+										"type": "ExpressionTag",
+										"start": 98,
+										"end": 105,
+										"expression": {
+											"type": "Identifier",
+											"start": 99,
+											"end": 104,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 14
+												},
+												"end": {
+													"line": 6,
+													"column": 19
+												}
+											},
+											"name": "value"
+										}
+									}
+								]
+							}
+						},
+						{
+							"type": "Text",
+							"start": 111,
+							"end": 112,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"context": {
+					"type": "ArrayPattern",
+					"start": 59,
+					"end": 83,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 15
+						},
+						"end": {
+							"line": 5,
+							"column": 39
+						}
+					},
+					"elements": [
+						{
+							"type": "Identifier",
+							"start": 60,
+							"end": 63,
+							"loc": {
+								"start": {
+									"line": 5,
+									"column": 16
+								},
+								"end": {
+									"line": 5,
+									"column": 19
+								}
+							},
+							"name": "key"
+						},
+						{
+							"type": "AssignmentPattern",
+							"start": 65,
+							"end": 82,
+							"loc": {
+								"start": {
+									"line": 5,
+									"column": 21
+								},
+								"end": {
+									"line": 5,
+									"column": 38
+								}
+							},
+							"left": {
+								"type": "Identifier",
+								"start": 65,
+								"end": 70,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 21
+									},
+									"end": {
+										"line": 5,
+										"column": 26
+									}
+								},
+								"name": "value"
+							},
+							"right": {
+								"type": "Literal",
+								"start": 73,
+								"end": 82,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 29
+									},
+									"end": {
+										"line": 5,
+										"column": 38
+									}
+								},
+								"value": "default",
+								"raw": "'default'"
+							}
+						}
+					]
+				}
+			}
+		]
+	},
+	"options": null,
+	"instance": {
+		"type": "Script",
+		"start": 0,
+		"end": 43,
+		"context": "default",
+		"content": {
+			"type": "Program",
+			"start": 18,
+			"end": 34,
+			"loc": {
+				"start": {
+					"line": 1,
+					"column": 0
+				},
+				"end": {
+					"line": 3,
+					"column": 0
+				}
+			},
+			"body": [
+				{
+					"type": "VariableDeclaration",
+					"start": 20,
+					"end": 33,
+					"loc": {
+						"start": {
+							"line": 2,
+							"column": 1
+						},
+						"end": {
+							"line": 2,
+							"column": 14
+						}
+					},
+					"declarations": [
+						{
+							"type": "VariableDeclarator",
+							"start": 24,
+							"end": 32,
+							"loc": {
+								"start": {
+									"line": 2,
+									"column": 5
+								},
+								"end": {
+									"line": 2,
+									"column": 13
+								}
+							},
+							"id": {
+								"type": "Identifier",
+								"start": 24,
+								"end": 27,
+								"loc": {
+									"start": {
+										"line": 2,
+										"column": 5
+									},
+									"end": {
+										"line": 2,
+										"column": 8
+									}
+								},
+								"name": "arr"
+							},
+							"init": {
+								"type": "ArrayExpression",
+								"start": 30,
+								"end": 32,
+								"loc": {
+									"start": {
+										"line": 2,
+										"column": 11
+									},
+									"end": {
+										"line": 2,
+										"column": 13
+									}
+								},
+								"elements": []
+							}
+						}
+					],
+					"kind": "let"
+				}
+			],
+			"sourceType": "module"
+		},
+		"attributes": [
+			{
+				"type": "Attribute",
+				"start": 8,
+				"end": 17,
+				"name": "lang",
+				"value": [
+					{
+						"start": 14,
+						"end": 16,
+						"type": "Text",
+						"raw": "ts",
+						"data": "ts"
+					}
+				]
+			}
+		]
+	}
+}

From 2e2b440954a783a836e803f7b2babc054a1a33ad Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 6 Jan 2025 16:51:32 +0100
Subject: [PATCH 371/404] fix: apply `clsx` logic to custom element `class`
 attributes (#14907)

Fixes #14902
---
 .changeset/happy-candles-clean.md                  |  5 +++++
 .../3-transform/client/visitors/RegularElement.js  | 12 +++++++++++-
 .../tests/runtime-runes/samples/clsx/_config.js    | 14 ++++++++++----
 .../tests/runtime-runes/samples/clsx/main.svelte   |  2 ++
 4 files changed, 28 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/happy-candles-clean.md

diff --git a/.changeset/happy-candles-clean.md b/.changeset/happy-candles-clean.md
new file mode 100644
index 0000000000..d08f97a247
--- /dev/null
+++ b/.changeset/happy-candles-clean.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: apply `clsx` logic to custom element `class` attributes
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 59a6fafbc5..ffd06dfd86 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
@@ -571,7 +571,9 @@ function build_element_attribute_update_assignment(
 				is_svg ? '$.set_svg_class' : is_mathml ? '$.set_mathml_class' : '$.set_class',
 				node_id,
 				value,
-				attribute.metadata.needs_clsx ? b.literal(context.state.analysis.css.hash) : undefined
+				attribute.metadata.needs_clsx && context.state.analysis.css.hash
+					? b.literal(context.state.analysis.css.hash)
+					: undefined
 			)
 		);
 	} else if (name === 'value') {
@@ -648,6 +650,14 @@ function build_custom_element_attribute_update_assignment(node_id, attribute, co
 	const name = attribute.name; // don't lowercase, as we set the element's property, which might be case sensitive
 	let { has_call, value } = build_attribute_value(attribute.value, context);
 
+	// We assume that noone's going to redefine the semantics of the class attribute on custom elements, i.e. it's still used for CSS classes
+	if (name === 'class' && attribute.metadata.needs_clsx) {
+		if (context.state.analysis.css.hash) {
+			value = b.array([value, b.literal(context.state.analysis.css.hash)]);
+		}
+		value = b.call('$.clsx', value);
+	}
+
 	const update = b.stmt(b.call('$.set_custom_element_data', node_id, b.literal(name), value));
 
 	if (attribute.metadata.expression.has_state) {
diff --git a/packages/svelte/tests/runtime-runes/samples/clsx/_config.js b/packages/svelte/tests/runtime-runes/samples/clsx/_config.js
index e0813d0e6c..202a13b1cb 100644
--- a/packages/svelte/tests/runtime-runes/samples/clsx/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/clsx/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -14,27 +15,32 @@ export default test({
 		<div class="foo">child</div>
 		<div class="foo">child</div>
 
+		<applied-to-custom-element class="foo svelte-owbekl"></applied-to-custom-element>
+
 		<button>update</button>
 	`,
 	test({ assert, target }) {
 		const button = target.querySelector('button');
 
 		button?.click();
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,
 			`
 				<div class="foo svelte-owbekl"></div>
 				<div class="foo svelte-owbekl"></div>
-				<div class="foo svelte-owbekl"></div>
-				<div class="foo svelte-owbekl"></div>
+				<div class="bar svelte-owbekl"></div>
+				<div class="bar svelte-owbekl"></div>
 				<div class="foo svelte-owbekl"></div>
 
 				<div class="foo">child</div>
 				<div class="foo">child</div>
+				<div class="bar">child</div>
+				<div class="bar">child</div>
 				<div class="foo">child</div>
-				<div class="foo">child</div>
-				<div class="foo">child</div>
+
+				<applied-to-custom-element class="bar svelte-owbekl"></applied-to-custom-element>
 
 				<button>update</button>
 			`
diff --git a/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte b/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte
index bf68b42e11..ebc0697f97 100644
--- a/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte
+++ b/packages/svelte/tests/runtime-runes/samples/clsx/main.svelte
@@ -18,6 +18,8 @@
 <Child class={[ foo, bar ]} />
 <Child {...spread} />
 
+<applied-to-custom-element class={{ foo, bar }}></applied-to-custom-element>
+
 <button onclick={() => {
     foo = null;
     bar = 'bar';

From ab91c5cddb95abf04e756e3eb6c4d99042daff6e Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Mon, 6 Jan 2025 20:18:17 +0100
Subject: [PATCH 372/404] docs: tweak links (#14915)

Remove one that is unnecessary, and make another one appear nice in markdown.
---
 packages/svelte/scripts/generate-version.js | 2 --
 packages/svelte/src/index.d.ts              | 2 +-
 packages/svelte/src/version.js              | 2 --
 packages/svelte/types/index.d.ts            | 4 +---
 4 files changed, 2 insertions(+), 8 deletions(-)

diff --git a/packages/svelte/scripts/generate-version.js b/packages/svelte/scripts/generate-version.js
index 1c392efef4..3eeeb437dd 100644
--- a/packages/svelte/scripts/generate-version.js
+++ b/packages/svelte/scripts/generate-version.js
@@ -8,8 +8,6 @@ fs.writeFileSync(
 
 /**
  * The current version, as set in package.json.
- *
- * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
 export const VERSION = '${pkg.version}';
diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts
index e157ce76e2..554510542e 100644
--- a/packages/svelte/src/index.d.ts
+++ b/packages/svelte/src/index.d.ts
@@ -278,7 +278,7 @@ declare const SnippetReturn: unique symbol;
  * ```
  * You can only call a snippet through the `{@render ...}` tag.
  *
- * https://svelte.dev/docs/svelte/snippet
+ * See the [snippet documentation](https://svelte.dev/docs/svelte/snippet) for more info.
  *
  * @template Parameters the parameters that the snippet expects (if any) as a tuple.
  */
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index add463faef..4b6e37995f 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -2,8 +2,6 @@
 
 /**
  * The current version, as set in package.json.
- *
- * https://svelte.dev/docs/svelte-compiler#svelte-version
  * @type {string}
  */
 export const VERSION = '5.16.2';
diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts
index b6b76b1cb7..d00b2b01ed 100644
--- a/packages/svelte/types/index.d.ts
+++ b/packages/svelte/types/index.d.ts
@@ -275,7 +275,7 @@ declare module 'svelte' {
 	 * ```
 	 * You can only call a snippet through the `{@render ...}` tag.
 	 *
-	 * https://svelte.dev/docs/svelte/snippet
+	 * See the [snippet documentation](https://svelte.dev/docs/svelte/snippet) for more info.
 	 *
 	 * @template Parameters the parameters that the snippet expects (if any) as a tuple.
 	 */
@@ -1339,8 +1339,6 @@ declare module 'svelte/compiler' {
 	} | undefined): Promise<Processed>;
 	/**
 	 * The current version, as set in package.json.
-	 *
-	 * https://svelte.dev/docs/svelte-compiler#svelte-version
 	 * */
 	export const VERSION: string;
 	/**

From a8ca375c57ef83b58574e5074e5aea6a5a3aa941 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 6 Jan 2025 14:19:57 -0500
Subject: [PATCH 373/404] Version Packages (#14908)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/famous-scissors-begin.md | 5 -----
 .changeset/happy-candles-clean.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/famous-scissors-begin.md
 delete mode 100644 .changeset/happy-candles-clean.md

diff --git a/.changeset/famous-scissors-begin.md b/.changeset/famous-scissors-begin.md
deleted file mode 100644
index 96075d0dac..0000000000
--- a/.changeset/famous-scissors-begin.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: correctly parse `each` with loose parser
diff --git a/.changeset/happy-candles-clean.md b/.changeset/happy-candles-clean.md
deleted file mode 100644
index d08f97a247..0000000000
--- a/.changeset/happy-candles-clean.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: apply `clsx` logic to custom element `class` attributes
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 97aad73746..99ef9c9870 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.16.3
+
+### Patch Changes
+
+- fix: correctly parse `each` with loose parser ([#14887](https://github.com/sveltejs/svelte/pull/14887))
+
+- fix: apply `clsx` logic to custom element `class` attributes ([#14907](https://github.com/sveltejs/svelte/pull/14907))
+
 ## 5.16.2
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index f4b9a3faff..3f339487d7 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.16.2",
+  "version": "5.16.3",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 4b6e37995f..81ca491654 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.16.2';
+export const VERSION = '5.16.3';
 export const PUBLIC_VERSION = '5';

From dbdb8cd7fda6ae106bdcce0d6b35eacc6bcd2f0f Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 6 Jan 2025 19:21:05 +0000
Subject: [PATCH 374/404] fix: use cached indexOf array prototype method
 internally (#14912)

---
 .changeset/real-dolphins-return.md             | 5 +++++
 packages/svelte/src/internal/client/runtime.js | 4 ++--
 packages/svelte/src/internal/shared/utils.js   | 1 +
 3 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/real-dolphins-return.md

diff --git a/.changeset/real-dolphins-return.md b/.changeset/real-dolphins-return.md
new file mode 100644
index 0000000000..bbacaff8d7
--- /dev/null
+++ b/.changeset/real-dolphins-return.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: use cached indexOf array prototype method internally
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index 0be91d78ba..a066f1c11a 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -1,6 +1,6 @@
 /** @import { ComponentContext, Derived, Effect, Reaction, Signal, Source, Value } from '#client' */
 import { DEV } from 'esm-env';
-import { define_property, get_descriptors, get_prototype_of } from '../shared/utils.js';
+import { define_property, get_descriptors, get_prototype_of, index_of } from '../shared/utils.js';
 import {
 	destroy_block_effect_children,
 	destroy_effect_children,
@@ -448,7 +448,7 @@ export function update_reaction(reaction) {
 function remove_reaction(signal, dependency) {
 	let reactions = dependency.reactions;
 	if (reactions !== null) {
-		var index = reactions.indexOf(signal);
+		var index = index_of.call(reactions, signal);
 		if (index !== -1) {
 			var new_length = reactions.length - 1;
 			if (new_length === 0) {
diff --git a/packages/svelte/src/internal/shared/utils.js b/packages/svelte/src/internal/shared/utils.js
index 92d29d9e1d..f9d52cb065 100644
--- a/packages/svelte/src/internal/shared/utils.js
+++ b/packages/svelte/src/internal/shared/utils.js
@@ -1,6 +1,7 @@
 // Store the references to globals in case someone tries to monkey patch these, causing the below
 // to de-opt (this occurs often when using popular extensions).
 export var is_array = Array.isArray;
+export var index_of = Array.prototype.indexOf;
 export var array_from = Array.from;
 export var object_keys = Object.keys;
 export var define_property = Object.defineProperty;

From a646780109246eb2b7ffe0d9d93d49f791146523 Mon Sep 17 00:00:00 2001
From: Matthijs <42407879+TheSpeedM@users.noreply.github.com>
Date: Mon, 6 Jan 2025 20:34:30 +0100
Subject: [PATCH 375/404] fix: Make Tween work with continuous target changes
 (#14895)

* Read previous_value at a later stage in Tween.set

* Add changeset

* tweak

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/violet-cows-reply.md       | 5 +++++
 packages/svelte/src/motion/tweened.js | 7 ++++---
 2 files changed, 9 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/violet-cows-reply.md

diff --git a/.changeset/violet-cows-reply.md b/.changeset/violet-cows-reply.md
new file mode 100644
index 0000000000..360dfb6a56
--- /dev/null
+++ b/.changeset/violet-cows-reply.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: make Tween work with continuous target changes
diff --git a/packages/svelte/src/motion/tweened.js b/packages/svelte/src/motion/tweened.js
index d732dbc283..8aaefe5a2c 100644
--- a/packages/svelte/src/motion/tweened.js
+++ b/packages/svelte/src/motion/tweened.js
@@ -230,7 +230,6 @@ export class Tween {
 	set(value, options) {
 		set(this.#target, value);
 
-		let previous_value = this.#current.v;
 		let previous_task = this.#task;
 
 		let started = false;
@@ -254,10 +253,12 @@ export class Tween {
 			if (!started) {
 				started = true;
 
-				fn = interpolate(/** @type {any} */ (previous_value), value);
+				const prev = this.#current.v;
+
+				fn = interpolate(prev, value);
 
 				if (typeof duration === 'function') {
-					duration = duration(/** @type {any} */ (previous_value), value);
+					duration = duration(prev, value);
 				}
 
 				previous_task?.abort();

From 1734d74f51da079404430a23b87d7145a3a2a84b Mon Sep 17 00:00:00 2001
From: Max Katz <maxktz@icloud.com>
Date: Mon, 6 Jan 2025 21:34:54 +0200
Subject: [PATCH 376/404] chore: update copyright year (#14889)

Co-authored-by: Max Katz <zrxmax@icloud.com>
---
 LICENSE.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/LICENSE.md b/LICENSE.md
index e2a8b89fa4..abbace7bfe 100644
--- a/LICENSE.md
+++ b/LICENSE.md
@@ -1,4 +1,4 @@
-Copyright (c) 2016-24 [these people](https://github.com/sveltejs/svelte/graphs/contributors)
+Copyright (c) 2016-2025 [these people](https://github.com/sveltejs/svelte/graphs/contributors)
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

From f5c285080c61e555fbbef9fcdf038cf420698b4a Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 6 Jan 2025 16:30:15 -0500
Subject: [PATCH 377/404] Version Packages (#14918)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/real-dolphins-return.md | 5 -----
 .changeset/violet-cows-reply.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/real-dolphins-return.md
 delete mode 100644 .changeset/violet-cows-reply.md

diff --git a/.changeset/real-dolphins-return.md b/.changeset/real-dolphins-return.md
deleted file mode 100644
index bbacaff8d7..0000000000
--- a/.changeset/real-dolphins-return.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: use cached indexOf array prototype method internally
diff --git a/.changeset/violet-cows-reply.md b/.changeset/violet-cows-reply.md
deleted file mode 100644
index 360dfb6a56..0000000000
--- a/.changeset/violet-cows-reply.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: make Tween work with continuous target changes
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 99ef9c9870..43898eb107 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.16.4
+
+### Patch Changes
+
+- fix: use cached indexOf array prototype method internally ([#14912](https://github.com/sveltejs/svelte/pull/14912))
+
+- fix: make Tween work with continuous target changes ([#14895](https://github.com/sveltejs/svelte/pull/14895))
+
 ## 5.16.3
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 3f339487d7..59bc861560 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.16.3",
+  "version": "5.16.4",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 81ca491654..b51c659b31 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.16.3';
+export const VERSION = '5.16.4';
 export const PUBLIC_VERSION = '5';

From 793f6f3b11ab195369c605b3ccc0ae81eb036183 Mon Sep 17 00:00:00 2001
From: ottomated <31470743+ottomated@users.noreply.github.com>
Date: Mon, 6 Jan 2025 14:35:43 -0800
Subject: [PATCH 378/404] add note about svelte/elements to $props docs
 (#14829)

---
 documentation/docs/02-runes/05-$props.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/documentation/docs/02-runes/05-$props.md b/documentation/docs/02-runes/05-$props.md
index 58e9b36f8e..4b1775bf5a 100644
--- a/documentation/docs/02-runes/05-$props.md
+++ b/documentation/docs/02-runes/05-$props.md
@@ -196,4 +196,6 @@ You can, of course, separate the type declaration from the annotation:
 </script>
 ```
 
+> [!NOTE] Interfaces for native DOM elements are provided in the `svelte/elements` module (see [Typing wrapper components](typescript#Typing-wrapper-components))
+
 Adding types is recommended, as it ensures that people using your component can easily discover which props they should provide.

From cd1adbc4e6f4305b4a7f19763299544f480484b2 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Mon, 6 Jan 2025 23:08:08 +0000
Subject: [PATCH 379/404] fix: ensure logic blocks keep consistent namespacing
 (#14817)

* fix: ensure logic blocks keep consitent namespacing

* lint

* add test

* handle `<title>` ambiguity the same as `<a>`

* update changeset

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/real-onions-confess.md                     |  5 +++++
 .../phases/2-analyze/visitors/RegularElement.js       |  7 +++++--
 .../samples/svg-namespace-if-block-3/_config.js       | 11 +++++++++++
 .../samples/svg-namespace-if-block-3/main.svelte      |  5 +++++
 4 files changed, 26 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/real-onions-confess.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/main.svelte

diff --git a/.changeset/real-onions-confess.md b/.changeset/real-onions-confess.md
new file mode 100644
index 0000000000..5f11b225ad
--- /dev/null
+++ b/.changeset/real-onions-confess.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: inherit correct namespace for `<title>` elements
diff --git a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
index 9a891c0c49..03dfaebcb7 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/visitors/RegularElement.js
@@ -90,8 +90,11 @@ export function RegularElement(node, context) {
 		if (is_svg(node.name)) {
 			return true;
 		}
-		if (node.name === 'a') {
-			for (let i = context.path.length - 1; i >= 0; i--) {
+
+		if (node.name === 'a' || node.name === 'title') {
+			let i = context.path.length;
+
+			while (i--) {
 				const ancestor = context.path[i];
 				if (ancestor.type === 'RegularElement') {
 					return ancestor.metadata.svg;
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/_config.js b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/_config.js
new file mode 100644
index 0000000000..7543278b62
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/_config.js
@@ -0,0 +1,11 @@
+import { test, ok } from '../../test';
+
+export default test({
+	html: `<svg><title>potato</title></svg>`,
+	test({ assert, target }) {
+		const title = target.querySelector('title');
+		ok(title);
+
+		assert.equal(title.namespaceURI, 'http://www.w3.org/2000/svg');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/main.svelte b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/main.svelte
new file mode 100644
index 0000000000..8be23f8b23
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/svg-namespace-if-block-3/main.svelte
@@ -0,0 +1,5 @@
+<svg>
+	{#if true}
+		<title>potato</title>
+	{/if}
+</svg>

From 72a6c7263cf01db78fc0a713bdf36e8094fd1271 Mon Sep 17 00:00:00 2001
From: Paolo Ricciuti <ricciutipaolo@gmail.com>
Date: Tue, 7 Jan 2025 00:26:00 +0100
Subject: [PATCH 380/404] fix: don't throw `bind_invalid_export` if there's
 also a bindable prop with the same name (#14813)

---
 .changeset/tidy-dragons-thank.md              |  5 +++
 .../svelte/src/internal/client/validate.js    |  2 +-
 .../bindable-prop-and-export/Component.svelte |  9 +++++
 .../bindable-prop-and-export/_config.js       | 35 +++++++++++++++++++
 .../bindable-prop-and-export/main.svelte      | 14 ++++++++
 5 files changed, 64 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/tidy-dragons-thank.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/Component.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/main.svelte

diff --git a/.changeset/tidy-dragons-thank.md b/.changeset/tidy-dragons-thank.md
new file mode 100644
index 0000000000..1257ec0210
--- /dev/null
+++ b/.changeset/tidy-dragons-thank.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: don't throw `bind_invalid_export` if there's also a bindable prop with the same name
diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js
index 951feee33b..417c145eb2 100644
--- a/packages/svelte/src/internal/client/validate.js
+++ b/packages/svelte/src/internal/client/validate.js
@@ -50,7 +50,7 @@ export function validate_prop_bindings($$props, bindable, exports, component) {
 		var name = component.name;
 
 		if (setter) {
-			if (exports.includes(key)) {
+			if (exports.includes(key) && !bindable.includes(key)) {
 				e.bind_invalid_export(component[FILENAME], key, name);
 			}
 
diff --git a/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/Component.svelte b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/Component.svelte
new file mode 100644
index 0000000000..17e895fd8c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/Component.svelte
@@ -0,0 +1,9 @@
+<script>
+	let { open: is_open = $bindable() } = $props();
+
+	export function open(){
+		is_open = !is_open;
+	}
+</script>
+
+<button onclick={open}>{is_open}</button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/_config.js b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/_config.js
new file mode 100644
index 0000000000..45cd58f55c
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/_config.js
@@ -0,0 +1,35 @@
+import { ok, test } from '../../test';
+import { flushSync } from 'svelte';
+
+export default test({
+	compileOptions: {
+		dev: true
+	},
+	html: `<button>true</button><button>true</button><input type="checkbox" />`,
+	ssrHtml: `<button>true</button><button>true</button><input type="checkbox" checked=""/>`,
+
+	async test({ assert, target, instance }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+		const input = target.querySelector('input');
+		flushSync(() => {
+			btn1.click();
+		});
+		assert.equal(btn1.innerHTML, 'false');
+		assert.equal(btn2.innerHTML, 'false');
+		assert.equal(input?.checked, false);
+
+		flushSync(() => {
+			btn2.click();
+		});
+		assert.equal(btn1.innerHTML, 'true');
+		assert.equal(btn2.innerHTML, 'true');
+		assert.equal(input?.checked, true);
+
+		flushSync(() => {
+			input?.click();
+		});
+		assert.equal(btn1.innerHTML, 'false');
+		assert.equal(btn2.innerHTML, 'false');
+		assert.equal(input?.checked, false);
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/main.svelte b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/main.svelte
new file mode 100644
index 0000000000..3b47eef156
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/bindable-prop-and-export/main.svelte
@@ -0,0 +1,14 @@
+<script>
+	import Component from "./Component.svelte";
+
+	let open = $state(true);
+	let comp;
+</script>
+
+<Component bind:this={comp} bind:open />
+
+<button onclick={()=>{
+	comp.open();
+}}>{open}</button>
+
+<input type="checkbox" bind:checked={open} />
\ No newline at end of file

From fb67bad5b04a96e416b7896f031353e18b660acb Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Mon, 6 Jan 2025 18:28:50 -0500
Subject: [PATCH 381/404] Version Packages (#14921)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/real-onions-confess.md | 5 -----
 .changeset/tidy-dragons-thank.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/real-onions-confess.md
 delete mode 100644 .changeset/tidy-dragons-thank.md

diff --git a/.changeset/real-onions-confess.md b/.changeset/real-onions-confess.md
deleted file mode 100644
index 5f11b225ad..0000000000
--- a/.changeset/real-onions-confess.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: inherit correct namespace for `<title>` elements
diff --git a/.changeset/tidy-dragons-thank.md b/.changeset/tidy-dragons-thank.md
deleted file mode 100644
index 1257ec0210..0000000000
--- a/.changeset/tidy-dragons-thank.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: don't throw `bind_invalid_export` if there's also a bindable prop with the same name
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 43898eb107..cc834a7ca3 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,13 @@
 # svelte
 
+## 5.16.5
+
+### Patch Changes
+
+- fix: inherit correct namespace for `<title>` elements ([#14817](https://github.com/sveltejs/svelte/pull/14817))
+
+- fix: don't throw `bind_invalid_export` if there's also a bindable prop with the same name ([#14813](https://github.com/sveltejs/svelte/pull/14813))
+
 ## 5.16.4
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 59bc861560..682cf30fb3 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.16.4",
+  "version": "5.16.5",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index b51c659b31..d4fd729b38 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.16.4';
+export const VERSION = '5.16.5';
 export const PUBLIC_VERSION = '5';

From 8201d7ad8b4e90f420aefbfe5f0f94fe860a0578 Mon Sep 17 00:00:00 2001
From: Felipe <felipe.santoz2013@gmail.com>
Date: Tue, 7 Jan 2025 00:41:06 +0000
Subject: [PATCH 382/404] docs: Switch typing of Action<Parameter> from null to
 undefined in 12-use.md (#14798)

* Update 12-use.md -

* Remove unecessary line in Action typing example

* drive-by formatting fix

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/03-template-syntax/12-use.md | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/documentation/docs/03-template-syntax/12-use.md b/documentation/docs/03-template-syntax/12-use.md
index f3db72a772..45de023578 100644
--- a/documentation/docs/03-template-syntax/12-use.md
+++ b/documentation/docs/03-template-syntax/12-use.md
@@ -50,17 +50,16 @@ The `Action` interface receives three optional type arguments — a node type (w
 ```svelte
 <!--- file: App.svelte --->
 <script>
-	import { on } from 'svelte/events';
-
 	/**
 	 * @type {import('svelte/action').Action<
 	 * 	HTMLDivElement,
-	 * 	null,
+	 * 	undefined,
 	 * 	{
 	 * 		onswiperight: (e: CustomEvent) => void;
 	 * 		onswipeleft: (e: CustomEvent) => void;
 	 * 		// ...
-	 * }>}
+	 * 	}
+	 * >}
 	 */
 	function gestures(node) {
 		$effect(() => {

From 08a9d123e81725189e727b18b1f99662ec2a48c8 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 7 Jan 2025 09:01:44 +0000
Subject: [PATCH 383/404] chore: use codePointAt instead of implementing it
 ourselves (#14923)

 seems to be some sort of codePointAt polyfill from ancient times before that was available on String.prototype
---
 .../src/compiler/phases/1-parse/index.js      |  5 +-
 .../compiler/phases/1-parse/read/context.js   | 44 ++++++++--------
 .../compiler/phases/1-parse/utils/bracket.js  | 50 +++++++------------
 .../phases/1-parse/utils/full_char_code_at.js | 15 ------
 4 files changed, 41 insertions(+), 73 deletions(-)
 delete mode 100644 packages/svelte/src/compiler/phases/1-parse/utils/full_char_code_at.js

diff --git a/packages/svelte/src/compiler/phases/1-parse/index.js b/packages/svelte/src/compiler/phases/1-parse/index.js
index 390919f5cd..6cc5b58aa6 100644
--- a/packages/svelte/src/compiler/phases/1-parse/index.js
+++ b/packages/svelte/src/compiler/phases/1-parse/index.js
@@ -3,7 +3,6 @@
 import { isIdentifierStart, isIdentifierChar } from 'acorn';
 import fragment from './state/fragment.js';
 import { regex_whitespace } from '../patterns.js';
-import full_char_code_at from './utils/full_char_code_at.js';
 import * as e from '../../errors.js';
 import { create_fragment } from './utils/create.js';
 import read_options from './read/options.js';
@@ -230,13 +229,13 @@ export class Parser {
 
 		let i = this.index;
 
-		const code = full_char_code_at(this.template, i);
+		const code = /** @type {number} */ (this.template.codePointAt(i));
 		if (!isIdentifierStart(code, true)) return null;
 
 		i += code <= 0xffff ? 1 : 2;
 
 		while (i < this.template.length) {
-			const code = full_char_code_at(this.template, i);
+			const code = /** @type {number} */ (this.template.codePointAt(i));
 
 			if (!isIdentifierChar(code, true)) break;
 			i += code <= 0xffff ? 1 : 2;
diff --git a/packages/svelte/src/compiler/phases/1-parse/read/context.js b/packages/svelte/src/compiler/phases/1-parse/read/context.js
index e408b5024f..e206701500 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/context.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/context.js
@@ -1,15 +1,7 @@
 /** @import { Location } from 'locate-character' */
 /** @import { Pattern } from 'estree' */
 /** @import { Parser } from '../index.js' */
-// @ts-expect-error acorn type definitions are borked in the release we use
-import { isIdentifierStart } from 'acorn';
-import full_char_code_at from '../utils/full_char_code_at.js';
-import {
-	is_bracket_open,
-	is_bracket_close,
-	is_bracket_pair,
-	get_bracket_close
-} from '../utils/bracket.js';
+import { is_bracket_open, is_bracket_close, get_bracket_close } from '../utils/bracket.js';
 import { parse_expression_at } from '../acorn.js';
 import { regex_not_newline_characters } from '../../patterns.js';
 import * as e from '../../../errors.js';
@@ -23,9 +15,9 @@ export default function read_pattern(parser) {
 	const start = parser.index;
 	let i = parser.index;
 
-	const code = full_char_code_at(parser.template, i);
-	if (isIdentifierStart(code, true)) {
-		const name = /** @type {string} */ (parser.read_identifier());
+	const name = parser.read_identifier();
+
+	if (name !== null) {
 		const annotation = read_type_annotation(parser);
 
 		return {
@@ -41,28 +33,32 @@ export default function read_pattern(parser) {
 		};
 	}
 
-	if (!is_bracket_open(code)) {
+	if (!is_bracket_open(parser.template[i])) {
 		e.expected_pattern(i);
 	}
 
-	const bracket_stack = [code];
-	i += code <= 0xffff ? 1 : 2;
+	/** @type {string[]} */
+	const bracket_stack = [];
 
 	while (i < parser.template.length) {
-		const code = full_char_code_at(parser.template, i);
-		if (is_bracket_open(code)) {
-			bracket_stack.push(code);
-		} else if (is_bracket_close(code)) {
-			const popped = /** @type {number} */ (bracket_stack.pop());
-			if (!is_bracket_pair(popped, code)) {
-				e.expected_token(i, String.fromCharCode(/** @type {number} */ (get_bracket_close(popped))));
+		const char = parser.template[i];
+
+		if (is_bracket_open(char)) {
+			bracket_stack.push(char);
+		} else if (is_bracket_close(char)) {
+			const popped = /** @type {string} */ (bracket_stack.pop());
+			const expected = /** @type {string} */ (get_bracket_close(popped));
+
+			if (char !== expected) {
+				e.expected_token(i, expected);
 			}
+
 			if (bracket_stack.length === 0) {
-				i += code <= 0xffff ? 1 : 2;
+				i += 1;
 				break;
 			}
 		}
-		i += code <= 0xffff ? 1 : 2;
+		i += 1;
 	}
 
 	parser.index = i;
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 e7576af955..b7c8cb43cd 100644
--- a/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
+++ b/packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
@@ -1,41 +1,30 @@
-import full_char_code_at from './full_char_code_at.js';
+const SQUARE_BRACKET_OPEN = '[';
+const SQUARE_BRACKET_CLOSE = ']';
+const CURLY_BRACKET_OPEN = '{';
+const CURLY_BRACKET_CLOSE = '}';
+const PARENTHESES_OPEN = '(';
+const PARENTHESES_CLOSE = ')';
 
-const SQUARE_BRACKET_OPEN = '['.charCodeAt(0);
-const SQUARE_BRACKET_CLOSE = ']'.charCodeAt(0);
-const CURLY_BRACKET_OPEN = '{'.charCodeAt(0);
-const CURLY_BRACKET_CLOSE = '}'.charCodeAt(0);
-const PARENTHESES_OPEN = '('.charCodeAt(0);
-const PARENTHESES_CLOSE = ')'.charCodeAt(0);
-
-/** @param {number} code */
-export function is_bracket_open(code) {
-	return code === SQUARE_BRACKET_OPEN || code === CURLY_BRACKET_OPEN;
+/** @param {string} char */
+export function is_bracket_open(char) {
+	return char === SQUARE_BRACKET_OPEN || char === CURLY_BRACKET_OPEN;
 }
 
-/** @param {number} code */
-export function is_bracket_close(code) {
-	return code === SQUARE_BRACKET_CLOSE || code === CURLY_BRACKET_CLOSE;
+/** @param {string} char */
+export function is_bracket_close(char) {
+	return char === SQUARE_BRACKET_CLOSE || char === CURLY_BRACKET_CLOSE;
 }
 
-/**
- * @param {number} open
- * @param {number} close
- */
-export function is_bracket_pair(open, close) {
-	return (
-		(open === SQUARE_BRACKET_OPEN && close === SQUARE_BRACKET_CLOSE) ||
-		(open === CURLY_BRACKET_OPEN && close === CURLY_BRACKET_CLOSE)
-	);
-}
-
-/** @param {number} open */
+/** @param {string} open */
 export function get_bracket_close(open) {
 	if (open === SQUARE_BRACKET_OPEN) {
 		return SQUARE_BRACKET_CLOSE;
 	}
+
 	if (open === CURLY_BRACKET_OPEN) {
 		return CURLY_BRACKET_CLOSE;
 	}
+
 	if (open === PARENTHESES_OPEN) {
 		return PARENTHESES_CLOSE;
 	}
@@ -132,8 +121,7 @@ function count_leading_backslashes(string, search_start_index) {
  * @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);
+	const close = get_bracket_close(open);
 	let brackets = 1;
 	let i = index;
 	while (brackets > 0 && i < template.length) {
@@ -159,10 +147,10 @@ export function find_matching_bracket(template, index, open) {
 				continue;
 			}
 			default: {
-				const code = full_char_code_at(template, i);
-				if (code === open_code) {
+				const char = template[i];
+				if (char === open) {
 					brackets++;
-				} else if (code === close_code) {
+				} else if (char === close) {
 					brackets--;
 				}
 				if (brackets === 0) {
diff --git a/packages/svelte/src/compiler/phases/1-parse/utils/full_char_code_at.js b/packages/svelte/src/compiler/phases/1-parse/utils/full_char_code_at.js
deleted file mode 100644
index 90e6b8def3..0000000000
--- a/packages/svelte/src/compiler/phases/1-parse/utils/full_char_code_at.js
+++ /dev/null
@@ -1,15 +0,0 @@
-// Adapted from https://github.com/acornjs/acorn/blob/6584815dca7440e00de841d1dad152302fdd7ca5/src/tokenize.js
-// Reproduced under MIT License https://github.com/acornjs/acorn/blob/master/LICENSE
-
-/**
- * @param {string} str
- * @param {number} i
- * @returns {number}
- */
-export default function full_char_code_at(str, i) {
-	const code = str.charCodeAt(i);
-	if (code <= 0xd7ff || code >= 0xe000) return code;
-
-	const next = str.charCodeAt(i + 1);
-	return (code << 10) + next - 0x35fdc00;
-}

From 77378688b9b3cb5047e0b33bf6ab630e2d62a85d Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 7 Jan 2025 10:06:11 +0000
Subject: [PATCH 384/404] fix: remove leading newline from `<pre>` contents
 (#14922)

... if it's not followed by another newline, according to the spec

Fixes #14767

---------

Co-authored-by: Simon Holthausen <simon.holthausen@vercel.com>
---
 .changeset/tricky-radios-vanish.md            |  5 ++++
 .../src/compiler/phases/3-transform/utils.js  | 17 ++++++++++++++
 .../samples/pre-first-node-newline/_config.js |  5 ++++
 .../pre-first-node-newline/_expected.html     |  7 ++++++
 .../pre-first-node-newline/main.svelte        | 23 +++++++++++++++++++
 .../runtime-legacy/samples/pre-tag/_config.js | 18 ++++-----------
 6 files changed, 62 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/tricky-radios-vanish.md
 create mode 100644 packages/svelte/tests/hydration/samples/pre-first-node-newline/_config.js
 create mode 100644 packages/svelte/tests/hydration/samples/pre-first-node-newline/_expected.html
 create mode 100644 packages/svelte/tests/hydration/samples/pre-first-node-newline/main.svelte

diff --git a/.changeset/tricky-radios-vanish.md b/.changeset/tricky-radios-vanish.md
new file mode 100644
index 0000000000..0935148fba
--- /dev/null
+++ b/.changeset/tricky-radios-vanish.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove leading newline from `<pre>` contents
diff --git a/packages/svelte/src/compiler/phases/3-transform/utils.js b/packages/svelte/src/compiler/phases/3-transform/utils.js
index b53a3110bd..62a635de35 100644
--- a/packages/svelte/src/compiler/phases/3-transform/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/utils.js
@@ -5,6 +5,7 @@
 import {
 	regex_ends_with_whitespaces,
 	regex_not_whitespace,
+	regex_starts_with_newline,
 	regex_starts_with_whitespaces
 } from '../patterns.js';
 import * as b from '../../utils/builders.js';
@@ -270,6 +271,22 @@ export function clean_nodes(
 
 	var first = trimmed[0];
 
+	// initial newline inside a `<pre>` is disregarded, if not followed by another newline
+	if (parent.type === 'RegularElement' && parent.name === 'pre' && first.type === 'Text') {
+		const text = first.data.replace(regex_starts_with_newline, '');
+		if (text !== first.data) {
+			const tmp = text.replace(regex_starts_with_newline, '');
+			if (text === tmp) {
+				first.data = text;
+				first.raw = first.raw.replace(regex_starts_with_newline, '');
+				if (first.data === '') {
+					trimmed.shift();
+					first = trimmed[0];
+				}
+			}
+		}
+	}
+
 	// Special case: Add a comment if this is a lone script tag. This ensures that our run_scripts logic in template.js
 	// will always be able to call node.replaceWith() on the script tag in order to make it run. If we don't add this
 	// and would still call node.replaceWith() on the script tag, it would be a no-op because the script tag has no parent.
diff --git a/packages/svelte/tests/hydration/samples/pre-first-node-newline/_config.js b/packages/svelte/tests/hydration/samples/pre-first-node-newline/_config.js
new file mode 100644
index 0000000000..c838aab749
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/pre-first-node-newline/_config.js
@@ -0,0 +1,5 @@
+import { test } from '../../test';
+
+// A note about _expected.html: It is different from body.html because we're
+// testing against target.innerHTML which already removed the redundant first newline
+export default test({});
diff --git a/packages/svelte/tests/hydration/samples/pre-first-node-newline/_expected.html b/packages/svelte/tests/hydration/samples/pre-first-node-newline/_expected.html
new file mode 100644
index 0000000000..26de34d1ed
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/pre-first-node-newline/_expected.html
@@ -0,0 +1,7 @@
+<!--[--><pre>static content no line</pre> <pre>	static content ignored line
+</pre> <pre>
+	static content relevant line
+</pre> <pre><div><span></span></div>
+</pre> <pre>
+<div><span></span></div>
+</pre><!--]-->
diff --git a/packages/svelte/tests/hydration/samples/pre-first-node-newline/main.svelte b/packages/svelte/tests/hydration/samples/pre-first-node-newline/main.svelte
new file mode 100644
index 0000000000..9764b49e99
--- /dev/null
+++ b/packages/svelte/tests/hydration/samples/pre-first-node-newline/main.svelte
@@ -0,0 +1,23 @@
+<script>
+	let name = $state('');
+</script>
+
+<pre>static content no line</pre>
+
+<pre>
+	static content ignored line
+</pre>
+
+<pre>
+
+	static content relevant line
+</pre>
+
+<pre>
+<div><span>{name}</span></div>
+</pre>
+
+<pre>
+
+<div><span>{name}</span></div>
+</pre>
diff --git a/packages/svelte/tests/runtime-legacy/samples/pre-tag/_config.js b/packages/svelte/tests/runtime-legacy/samples/pre-tag/_config.js
index f1a42e996a..d7e1fe9d43 100644
--- a/packages/svelte/tests/runtime-legacy/samples/pre-tag/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/pre-tag/_config.js
@@ -2,17 +2,9 @@ import { test } from '../../test';
 
 export default test({
 	mode: ['client', 'server'], // output is correct, but test suite chokes on the extra ssr comment which is harmless
-	withoutNormalizeHtml: true,
-	html: get_html(false),
-	ssrHtml: get_html(true)
-});
-
-/** @param {boolean} ssr */
-function get_html(ssr) {
-	// ssr rendered HTML has an extra newline prefixed within `<pre>` tag,
-	// if the <pre> tag starts with `\n`
-	// because when browser parses the SSR rendered HTML, it will ignore the 1st '\n' character
-	return `${ssr ? '<!--[-->' : ''}<pre id="pre">  A
+	withoutNormalizeHtml: 'only-strip-comments', // because whitespace inside pre tags is significant
+	// Note how we're testing against target.innerHTML which already removed the redundant first newline
+	html: `<pre id="pre">  A
   B
   <span>
     C
@@ -35,5 +27,5 @@ function get_html(ssr) {
 leading newlines</pre></div> <div id="pre-without-leading-newline"><pre>without spaces</pre> <pre>  with spaces  </pre> <pre>${' '}
 newline after leading space</pre></div> <pre id="pre-with-multiple-leading-newlines">
 
-multiple leading newlines</pre>${ssr ? '<!--]-->' : ''}`;
-}
+multiple leading newlines</pre>`
+});

From a1f371e78656f951ad75945493a798716ecc92c4 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 7 Jan 2025 18:06:12 +0100
Subject: [PATCH 385/404] docs: add code of files being tested (#14925)

* docs: add code of files being tested

closes #14900

* fix

* Apply suggestions from code review

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

* Update documentation/docs/07-misc/02-testing.md

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

* Apply suggestions from code review

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

* rename import

* from https://github.com/sveltejs/svelte.dev/pull/1094

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 documentation/docs/02-runes/02-$state.md |  7 +--
 documentation/docs/07-misc/02-testing.md | 61 +++++++++++++++++++++++-
 2 files changed, 60 insertions(+), 8 deletions(-)

diff --git a/documentation/docs/02-runes/02-$state.md b/documentation/docs/02-runes/02-$state.md
index 77140dc690..49e17cd08f 100644
--- a/documentation/docs/02-runes/02-$state.md
+++ b/documentation/docs/02-runes/02-$state.md
@@ -44,12 +44,7 @@ todos[0].done = !todos[0].done;
 If you push a new object to the array, it will also be proxified:
 
 ```js
-// @filename: ambient.d.ts
-declare global {
-	const todos: Array<{ done: boolean, text: string }>
-}
-
-// @filename: index.js
+let todos = [{ done: false, text: 'add more todos' }];
 // ---cut---
 todos.push({
 	done: false,
diff --git a/documentation/docs/07-misc/02-testing.md b/documentation/docs/07-misc/02-testing.md
index c8774e341f..0842019039 100644
--- a/documentation/docs/07-misc/02-testing.md
+++ b/documentation/docs/07-misc/02-testing.md
@@ -40,7 +40,7 @@ You can now write unit tests for code inside your `.js/.ts` files:
 /// file: multiplier.svelte.test.js
 import { flushSync } from 'svelte';
 import { expect, test } from 'vitest';
-import { multiplier } from './multiplier.js';
+import { multiplier } from './multiplier.svelte.js';
 
 test('Multiplier', () => {
 	let double = multiplier(0, 2);
@@ -53,9 +53,30 @@ test('Multiplier', () => {
 });
 ```
 
+```js
+/// file: multiplier.svelte.js
+/**
+ * @param {number} initial
+ * @param {number} k
+ */
+export function multiplier(initial, k) {
+	let count = $state(initial);
+
+	return {
+		get value() {
+			return count * k;
+		},
+		/** @param {number} c */
+		set: (c) => {
+			count = c;
+		}
+	};
+}
+```
+
 ### Using runes inside your test files
 
-It is possible to use runes inside your test files. First ensure your bundler knows to route the file through the Svelte compiler before running the test by adding `.svelte` to the filename (e.g `multiplier.svelte.test.js`). After that, you can use runes inside your tests.
+Since Vitest processes your test files the same way as your source files, you can use runes inside your tests as long as the filename includes `.svelte`:
 
 ```js
 /// file: multiplier.svelte.test.js
@@ -75,6 +96,21 @@ test('Multiplier', () => {
 });
 ```
 
+```js
+/// file: multiplier.svelte.js
+/**
+ * @param {() => number} getCount
+ * @param {number} k
+ */
+export function multiplier(getCount, k) {
+	return {
+		get value() {
+			return getCount() * k;
+		}
+	};
+}
+```
+
 If the code being tested uses effects, you need to wrap the test inside `$effect.root`:
 
 ```js
@@ -105,6 +141,27 @@ test('Effect', () => {
 });
 ```
 
+```js
+/// file: logger.svelte.js
+/**
+ * @param {() => any} getValue
+ */
+export function logger(getValue) {
+	/** @type {any[]} */
+	let log = $state([]);
+
+	$effect(() => {
+		log.push(getValue());
+	});
+
+	return {
+		get value() {
+			return log;
+		}
+	};
+}
+```
+
 ### Component testing
 
 It is possible to test your components in isolation using Vitest.

From c8865bb4a70ac026b1e85c4f8e8491f2e354ce7b Mon Sep 17 00:00:00 2001
From: Matthijs <42407879+TheSpeedM@users.noreply.github.com>
Date: Tue, 7 Jan 2025 20:24:26 +0100
Subject: [PATCH 386/404] fix: make Tween with duration 0 set current to target
 immediately (#14937)

* fix: Make Tween duration 0 set current to target immediately

* Run prettier on test file

* tweak

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/cold-cups-act.md           |  5 +++++
 packages/svelte/src/motion/tweened.js | 11 ++++++++---
 packages/svelte/tests/motion/test.ts  | 18 +++++++++++++++++-
 3 files changed, 30 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/cold-cups-act.md

diff --git a/.changeset/cold-cups-act.md b/.changeset/cold-cups-act.md
new file mode 100644
index 0000000000..6776d4eef3
--- /dev/null
+++ b/.changeset/cold-cups-act.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: Make Tween duration 0 set current to target immediately
diff --git a/packages/svelte/src/motion/tweened.js b/packages/svelte/src/motion/tweened.js
index 8aaefe5a2c..36d32d1f72 100644
--- a/packages/svelte/src/motion/tweened.js
+++ b/packages/svelte/src/motion/tweened.js
@@ -230,9 +230,6 @@ export class Tween {
 	set(value, options) {
 		set(this.#target, value);
 
-		let previous_task = this.#task;
-
-		let started = false;
 		let {
 			delay = 0,
 			duration = 400,
@@ -240,10 +237,18 @@ export class Tween {
 			interpolate = get_interpolator
 		} = { ...this.#defaults, ...options };
 
+		if (duration === 0) {
+			this.#task?.abort();
+			set(this.#current, value);
+			return Promise.resolve();
+		}
+
 		const start = raf.now() + delay;
 
 		/** @type {(t: number) => T} */
 		let fn;
+		let started = false;
+		let previous_task = this.#task;
 
 		this.#task = loop((now) => {
 			if (now < start) {
diff --git a/packages/svelte/tests/motion/test.ts b/packages/svelte/tests/motion/test.ts
index b6554e5e56..7d845bac3d 100644
--- a/packages/svelte/tests/motion/test.ts
+++ b/packages/svelte/tests/motion/test.ts
@@ -2,7 +2,7 @@
 import '../helpers.js'; // for the matchMedia polyfill
 import { describe, it, assert } from 'vitest';
 import { get } from 'svelte/store';
-import { spring, tweened } from 'svelte/motion';
+import { spring, tweened, Tween } from 'svelte/motion';
 
 describe('motion', () => {
 	describe('spring', () => {
@@ -39,4 +39,20 @@ describe('motion', () => {
 			assert.equal(get(size), 20);
 		});
 	});
+
+	describe('Tween', () => {
+		it('sets immediately when duration is 0', () => {
+			const size = new Tween(0);
+
+			size.set(100, { duration: 0 });
+			assert.equal(size.current, 100);
+		});
+	});
+
+	it('updates correctly when initialized with a `null`-ish value', () => {
+		const size = new Tween(undefined as unknown as number, { duration: 0 });
+
+		size.set(10);
+		assert.equal(size.current, 10);
+	});
 });

From 8241096b06d5dfb2fc5374ce704e6b30c01e26dd Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 7 Jan 2025 20:24:53 +0100
Subject: [PATCH 387/404] fix: treat `inert` as a boolean attribute (#14935)

* fix: treat `inert` as a boolean attribute

fixes #14731

* remove solo: true

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/quiet-planets-carry.md               |  5 +++++
 packages/svelte/src/utils.js                    |  2 +-
 .../samples/attribute-boolean-inert/_config.js  | 17 ++++++++++++-----
 .../samples/attribute-boolean-inert/main.svelte |  1 +
 4 files changed, 19 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/quiet-planets-carry.md

diff --git a/.changeset/quiet-planets-carry.md b/.changeset/quiet-planets-carry.md
new file mode 100644
index 0000000000..0abeffa2e8
--- /dev/null
+++ b/.changeset/quiet-planets-carry.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: treat `inert` as a boolean attribute
diff --git a/packages/svelte/src/utils.js b/packages/svelte/src/utils.js
index e42721b4f4..76486d32ac 100644
--- a/packages/svelte/src/utils.js
+++ b/packages/svelte/src/utils.js
@@ -156,6 +156,7 @@ const DOM_BOOLEAN_ATTRIBUTES = [
 	'formnovalidate',
 	'hidden',
 	'indeterminate',
+	'inert',
 	'ismap',
 	'loop',
 	'multiple',
@@ -214,7 +215,6 @@ const DOM_PROPERTIES = [
 	'playsInline',
 	'readOnly',
 	'value',
-	'inert',
 	'volume',
 	'defaultValue',
 	'defaultChecked',
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/_config.js b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/_config.js
index 1322d63b7a..26fbbc955b 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/_config.js
@@ -1,14 +1,21 @@
-import { ok, test } from '../../test';
+import { test } from '../../test';
 
 export default test({
+	ssrHtml: `
+		<div></div>
+		<div inert="">some div <button>click</button></div>
+	`,
+
 	get props() {
 		return { inert: true };
 	},
+
 	test({ assert, target, component }) {
-		const div = target.querySelector('div');
-		ok(div);
-		assert.ok(div.inert);
+		const [div1, div2] = target.querySelectorAll('div');
+		assert.ok(!div1.inert);
+		assert.ok(div2.inert);
+
 		component.inert = false;
-		assert.ok(!div.inert);
+		assert.ok(!div2.inert);
 	}
 });
diff --git a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/main.svelte b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/main.svelte
index 6c3df7e31e..3b97923713 100644
--- a/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/main.svelte
+++ b/packages/svelte/tests/runtime-legacy/samples/attribute-boolean-inert/main.svelte
@@ -2,4 +2,5 @@
 export let inert;
 </script>
 
+<div inert={false}></div>
 <div {inert}>some div <button>click</button></div>

From 34628b9c90170cf84be64bfcc18adf88623a8aa4 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 7 Jan 2025 20:25:29 +0100
Subject: [PATCH 388/404] docs: note custom elements on caveat (#14934)

closes #14727
---
 documentation/docs/07-misc/04-custom-elements.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/documentation/docs/07-misc/04-custom-elements.md b/documentation/docs/07-misc/04-custom-elements.md
index 71c66f7edc..a8e0c81763 100644
--- a/documentation/docs/07-misc/04-custom-elements.md
+++ b/documentation/docs/07-misc/04-custom-elements.md
@@ -125,3 +125,4 @@ Custom elements can be a useful way to package components for consumption in a n
 - The deprecated `let:` directive has no effect, because custom elements do not have a way to pass data to the parent component that fills the slot
 - Polyfills are required to support older browsers
 - You can use Svelte's context feature between regular Svelte components within a custom element, but you can't use them across custom elements. In other words, you can't use `setContext` on a parent custom element and read that with `getContext` in a child custom element.
+- Don't declare properties or attributes starting with `on`, as their usage will be interpreted as an event listener. In other words, Svelte treats `<custom-element oneworld={true}></custom-element>` as `customElement.addEventListener('eworld', true)` (and not as `customElement.oneworld = true`)

From 08061c85da6c2c2d5d11d6cdad0a9d387042a784 Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Tue, 7 Jan 2025 20:26:13 +0100
Subject: [PATCH 389/404] fix: guard against `customElements` being unavailable
 in browser extension contexts (#14933)

fixes #14739
---
 .changeset/forty-books-taste.md                              | 5 +++++
 .../svelte/src/internal/client/dom/elements/attributes.js    | 5 ++++-
 2 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/forty-books-taste.md

diff --git a/.changeset/forty-books-taste.md b/.changeset/forty-books-taste.md
new file mode 100644
index 0000000000..e2474c635f
--- /dev/null
+++ b/.changeset/forty-books-taste.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: guard against `customElements` being unavailable in browser extension contexts
diff --git a/packages/svelte/src/internal/client/dom/elements/attributes.js b/packages/svelte/src/internal/client/dom/elements/attributes.js
index 6656532986..a2fffe8696 100644
--- a/packages/svelte/src/internal/client/dom/elements/attributes.js
+++ b/packages/svelte/src/internal/client/dom/elements/attributes.js
@@ -221,7 +221,10 @@ export function set_custom_element_data(node, prop, value) {
 			// 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())
+			setters_cache.has(node.nodeName) ||
+			// customElements may not be available in browser extension contexts
+			!customElements ||
+			customElements.get(node.tagName.toLowerCase())
 				? get_setters(node).includes(prop)
 				: value && typeof value === 'object'
 		) {

From 19038d19cb89cb100a6820069447e6d6eb22b612 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Tue, 7 Jan 2025 20:27:03 +0000
Subject: [PATCH 390/404] docs: add section on update propagation (#14938)

---
 documentation/docs/02-runes/03-$derived.md | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/documentation/docs/02-runes/03-$derived.md b/documentation/docs/02-runes/03-$derived.md
index 6b38f99746..24ab643b68 100644
--- a/documentation/docs/02-runes/03-$derived.md
+++ b/documentation/docs/02-runes/03-$derived.md
@@ -51,3 +51,20 @@ In essence, `$derived(expression)` is equivalent to `$derived.by(() => expressio
 Anything read synchronously inside the `$derived` expression (or `$derived.by` function body) is considered a _dependency_ of the derived state. When the state changes, the derived will be marked as _dirty_ and recalculated when it is next read.
 
 To exempt a piece of state from being treated as a dependency, use [`untrack`](svelte#untrack).
+
+## Update propagation
+
+Svelte uses something called _push-pull reactivity_ — when state is updated, everything that depends on the state (whether directly or indirectly) is immediately notified of the change (the 'push'), but derived values are not re-evaluated until they are actually read (the 'pull').
+
+If the new value of a derived is referentially identical to its previous value, downstream updates will be skipped. In other words, Svelte will only update the text inside the button when `large` changes, not when `count` changes, even though `large` depends on `count`:
+
+```svelte
+<script>
+	let count = $state(0);
+	let large = $derived(count > 10);
+</script>
+
+<button onclick={() => count++}>
+	{large}
+</button>
+```

From 4aadb34c02dc6afce56bb0f66bbac117ac56c4e8 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Tue, 7 Jan 2025 15:30:56 -0500
Subject: [PATCH 391/404] Version Packages (#14924)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/cold-cups-act.md        |  5 -----
 .changeset/forty-books-taste.md    |  5 -----
 .changeset/quiet-planets-carry.md  |  5 -----
 .changeset/tricky-radios-vanish.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/cold-cups-act.md
 delete mode 100644 .changeset/forty-books-taste.md
 delete mode 100644 .changeset/quiet-planets-carry.md
 delete mode 100644 .changeset/tricky-radios-vanish.md

diff --git a/.changeset/cold-cups-act.md b/.changeset/cold-cups-act.md
deleted file mode 100644
index 6776d4eef3..0000000000
--- a/.changeset/cold-cups-act.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: Make Tween duration 0 set current to target immediately
diff --git a/.changeset/forty-books-taste.md b/.changeset/forty-books-taste.md
deleted file mode 100644
index e2474c635f..0000000000
--- a/.changeset/forty-books-taste.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: guard against `customElements` being unavailable in browser extension contexts
diff --git a/.changeset/quiet-planets-carry.md b/.changeset/quiet-planets-carry.md
deleted file mode 100644
index 0abeffa2e8..0000000000
--- a/.changeset/quiet-planets-carry.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: treat `inert` as a boolean attribute
diff --git a/.changeset/tricky-radios-vanish.md b/.changeset/tricky-radios-vanish.md
deleted file mode 100644
index 0935148fba..0000000000
--- a/.changeset/tricky-radios-vanish.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove leading newline from `<pre>` contents
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index cc834a7ca3..4a2cca8280 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,17 @@
 # svelte
 
+## 5.16.6
+
+### Patch Changes
+
+- fix: Make Tween duration 0 set current to target immediately ([#14937](https://github.com/sveltejs/svelte/pull/14937))
+
+- fix: guard against `customElements` being unavailable in browser extension contexts ([#14933](https://github.com/sveltejs/svelte/pull/14933))
+
+- fix: treat `inert` as a boolean attribute ([#14935](https://github.com/sveltejs/svelte/pull/14935))
+
+- fix: remove leading newline from `<pre>` contents ([#14922](https://github.com/sveltejs/svelte/pull/14922))
+
 ## 5.16.5
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 682cf30fb3..26907c2a5b 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.16.5",
+  "version": "5.16.6",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index d4fd729b38..c7ad6fcf63 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.16.5';
+export const VERSION = '5.16.6';
 export const PUBLIC_VERSION = '5';

From 48e3db21c187d1f4eb2aa10b417628e9ce6d17c3 Mon Sep 17 00:00:00 2001
From: Caique Torres <56696506+caiquetorres@users.noreply.github.com>
Date: Tue, 7 Jan 2025 20:31:41 -0300
Subject: [PATCH 392/404] fix: default values in object destructuring (#14554)

* fix: enhance string/expression length check and fix closing character issues

* docs: add documentation for unterminated_string_constant error

* test: add tests for object destructuring with default values in "each" blocks

* Update .changeset/clean-planets-rush.md

* refactor: clean up unnecessary comments and whitespace

* fix: resolve formatting issues

* simplify

* tweak

* regenerate

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/clean-planets-rush.md              |   5 +
 .../98-reference/.generated/compile-errors.md |   6 +
 .../messages/compile-errors/template.md       |   4 +
 packages/svelte/src/compiler/errors.js        |   9 +
 .../compiler/phases/1-parse/read/context.js   |  95 +-
 .../input.svelte                              |   9 +
 .../output.json                               | 826 +++++++++++++++++
 .../each-block-object-pattern/input.svelte    |   8 +
 .../each-block-object-pattern/output.json     | 869 +++++++++++++++++-
 9 files changed, 1806 insertions(+), 25 deletions(-)
 create mode 100644 .changeset/clean-planets-rush.md
 create mode 100644 packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/input.svelte
 create mode 100644 packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/output.json

diff --git a/.changeset/clean-planets-rush.md b/.changeset/clean-planets-rush.md
new file mode 100644
index 0000000000..d8500d4315
--- /dev/null
+++ b/.changeset/clean-planets-rush.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: handle default values in object destructuring within "each" blocks when using characters like "}" and "]"
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index 298363f78d..c498920007 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -1012,6 +1012,12 @@ Unexpected end of input
 '%word%' is a reserved word in JavaScript and cannot be used here
 ```
 
+### unterminated_string_constant
+
+```
+Unterminated string constant
+```
+
 ### void_element_invalid_content
 
 ```
diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md
index 02961b61fc..287178ef87 100644
--- a/packages/svelte/messages/compile-errors/template.md
+++ b/packages/svelte/messages/compile-errors/template.md
@@ -418,6 +418,10 @@ See https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-ele
 
 > '%word%' is a reserved word in JavaScript and cannot be used here
 
+## unterminated_string_constant
+
+> Unterminated string constant
+
 ## void_element_invalid_content
 
 > Void elements cannot have children or closing tags
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 9ea13e811e..870cd9ac09 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -1574,6 +1574,15 @@ export function unexpected_reserved_word(node, word) {
 	e(node, "unexpected_reserved_word", `'${word}' is a reserved word in JavaScript and cannot be used here\nhttps://svelte.dev/e/unexpected_reserved_word`);
 }
 
+/**
+ * Unterminated string constant
+ * @param {null | number | NodeLike} node
+ * @returns {never}
+ */
+export function unterminated_string_constant(node) {
+	e(node, "unterminated_string_constant", `Unterminated string constant\nhttps://svelte.dev/e/unterminated_string_constant`);
+}
+
 /**
  * Void elements cannot have children or closing tags
  * @param {null | number | NodeLike} node
diff --git a/packages/svelte/src/compiler/phases/1-parse/read/context.js b/packages/svelte/src/compiler/phases/1-parse/read/context.js
index e206701500..f4c73dcf40 100644
--- a/packages/svelte/src/compiler/phases/1-parse/read/context.js
+++ b/packages/svelte/src/compiler/phases/1-parse/read/context.js
@@ -37,33 +37,11 @@ export default function read_pattern(parser) {
 		e.expected_pattern(i);
 	}
 
-	/** @type {string[]} */
-	const bracket_stack = [];
-
-	while (i < parser.template.length) {
-		const char = parser.template[i];
-
-		if (is_bracket_open(char)) {
-			bracket_stack.push(char);
-		} else if (is_bracket_close(char)) {
-			const popped = /** @type {string} */ (bracket_stack.pop());
-			const expected = /** @type {string} */ (get_bracket_close(popped));
-
-			if (char !== expected) {
-				e.expected_token(i, expected);
-			}
-
-			if (bracket_stack.length === 0) {
-				i += 1;
-				break;
-			}
-		}
-		i += 1;
-	}
-
+	i = match_bracket(parser, start);
 	parser.index = i;
 
 	const pattern_string = parser.template.slice(start, i);
+
 	try {
 		// the length of the `space_with_newline` has to be start - 1
 		// because we added a `(` in front of the pattern_string,
@@ -93,6 +71,75 @@ export default function read_pattern(parser) {
 	}
 }
 
+/**
+ * @param {Parser} parser
+ * @param {number} start
+ */
+function match_bracket(parser, start) {
+	const bracket_stack = [];
+
+	let i = start;
+
+	while (i < parser.template.length) {
+		let char = parser.template[i++];
+
+		if (char === "'" || char === '"' || char === '`') {
+			i = match_quote(parser, i, char);
+			continue;
+		}
+
+		if (is_bracket_open(char)) {
+			bracket_stack.push(char);
+		} else if (is_bracket_close(char)) {
+			const popped = /** @type {string} */ (bracket_stack.pop());
+			const expected = /** @type {string} */ (get_bracket_close(popped));
+
+			if (char !== expected) {
+				e.expected_token(i - 1, expected);
+			}
+
+			if (bracket_stack.length === 0) {
+				return i;
+			}
+		}
+	}
+
+	e.unexpected_eof(parser.template.length);
+}
+
+/**
+ * @param {Parser} parser
+ * @param {number} start
+ * @param {string} quote
+ */
+function match_quote(parser, start, quote) {
+	let is_escaped = false;
+	let i = start;
+
+	while (i < parser.template.length) {
+		const char = parser.template[i++];
+
+		if (is_escaped) {
+			is_escaped = false;
+			continue;
+		}
+
+		if (char === quote) {
+			return i;
+		}
+
+		if (char === '\\') {
+			is_escaped = true;
+		}
+
+		if (quote === '`' && char === '$' && parser.template[i] === '{') {
+			i = match_bracket(parser, i);
+		}
+	}
+
+	e.unterminated_string_constant(start);
+}
+
 /**
  * @param {Parser} parser
  * @returns {any}
diff --git a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/input.svelte b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/input.svelte
new file mode 100644
index 0000000000..bc83f8e57f
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/input.svelte
@@ -0,0 +1,9 @@
+{#each x as { y = 'z' }}{/each}
+
+{#each x as { y = '{' }}{/each}
+
+{#each x as { y = ']' }}{/each}
+
+{#each x as { y = `${`"`}` }}{/each}
+
+{#each x as { y = `${`John`}` }}{/each}
diff --git a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/output.json b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/output.json
new file mode 100644
index 0000000000..b962db3226
--- /dev/null
+++ b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern-special-characters/output.json
@@ -0,0 +1,826 @@
+{
+	"css": null,
+	"js": [],
+	"start": 0,
+	"end": 176,
+	"type": "Root",
+	"fragment": {
+		"type": "Fragment",
+		"nodes": [
+			{
+				"type": "EachBlock",
+				"start": 0,
+				"end": 31,
+				"expression": {
+					"type": "Identifier",
+					"start": 7,
+					"end": 8,
+					"loc": {
+						"start": {
+							"line": 1,
+							"column": 7
+						},
+						"end": {
+							"line": 1,
+							"column": 8
+						}
+					},
+					"name": "x"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 12,
+					"end": 23,
+					"loc": {
+						"start": {
+							"line": 1,
+							"column": 12
+						},
+						"end": {
+							"line": 1,
+							"column": 23
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 14,
+							"end": 21,
+							"loc": {
+								"start": {
+									"line": 1,
+									"column": 14
+								},
+								"end": {
+									"line": 1,
+									"column": 21
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 14,
+								"end": 15,
+								"loc": {
+									"start": {
+										"line": 1,
+										"column": 14
+									},
+									"end": {
+										"line": 1,
+										"column": 15
+									}
+								},
+								"name": "y"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 14,
+								"end": 21,
+								"loc": {
+									"start": {
+										"line": 1,
+										"column": 14
+									},
+									"end": {
+										"line": 1,
+										"column": 21
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 14,
+									"end": 15,
+									"loc": {
+										"start": {
+											"line": 1,
+											"column": 14
+										},
+										"end": {
+											"line": 1,
+											"column": 15
+										}
+									},
+									"name": "y"
+								},
+								"right": {
+									"type": "Literal",
+									"start": 18,
+									"end": 21,
+									"loc": {
+										"start": {
+											"line": 1,
+											"column": 18
+										},
+										"end": {
+											"line": 1,
+											"column": 21
+										}
+									},
+									"value": "z",
+									"raw": "'z'"
+								}
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 31,
+				"end": 33,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 33,
+				"end": 64,
+				"expression": {
+					"type": "Identifier",
+					"start": 40,
+					"end": 41,
+					"loc": {
+						"start": {
+							"line": 3,
+							"column": 7
+						},
+						"end": {
+							"line": 3,
+							"column": 8
+						}
+					},
+					"name": "x"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 45,
+					"end": 56,
+					"loc": {
+						"start": {
+							"line": 3,
+							"column": 13
+						},
+						"end": {
+							"line": 3,
+							"column": 24
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 47,
+							"end": 54,
+							"loc": {
+								"start": {
+									"line": 3,
+									"column": 15
+								},
+								"end": {
+									"line": 3,
+									"column": 22
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 47,
+								"end": 48,
+								"loc": {
+									"start": {
+										"line": 3,
+										"column": 15
+									},
+									"end": {
+										"line": 3,
+										"column": 16
+									}
+								},
+								"name": "y"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 47,
+								"end": 54,
+								"loc": {
+									"start": {
+										"line": 3,
+										"column": 15
+									},
+									"end": {
+										"line": 3,
+										"column": 22
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 47,
+									"end": 48,
+									"loc": {
+										"start": {
+											"line": 3,
+											"column": 15
+										},
+										"end": {
+											"line": 3,
+											"column": 16
+										}
+									},
+									"name": "y"
+								},
+								"right": {
+									"type": "Literal",
+									"start": 51,
+									"end": 54,
+									"loc": {
+										"start": {
+											"line": 3,
+											"column": 19
+										},
+										"end": {
+											"line": 3,
+											"column": 22
+										}
+									},
+									"value": "{",
+									"raw": "'{'"
+								}
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 64,
+				"end": 66,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 66,
+				"end": 97,
+				"expression": {
+					"type": "Identifier",
+					"start": 73,
+					"end": 74,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 7
+						},
+						"end": {
+							"line": 5,
+							"column": 8
+						}
+					},
+					"name": "x"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 78,
+					"end": 89,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 13
+						},
+						"end": {
+							"line": 5,
+							"column": 24
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 80,
+							"end": 87,
+							"loc": {
+								"start": {
+									"line": 5,
+									"column": 15
+								},
+								"end": {
+									"line": 5,
+									"column": 22
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 80,
+								"end": 81,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 15
+									},
+									"end": {
+										"line": 5,
+										"column": 16
+									}
+								},
+								"name": "y"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 80,
+								"end": 87,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 15
+									},
+									"end": {
+										"line": 5,
+										"column": 22
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 80,
+									"end": 81,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 15
+										},
+										"end": {
+											"line": 5,
+											"column": 16
+										}
+									},
+									"name": "y"
+								},
+								"right": {
+									"type": "Literal",
+									"start": 84,
+									"end": 87,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 19
+										},
+										"end": {
+											"line": 5,
+											"column": 22
+										}
+									},
+									"value": "]",
+									"raw": "']'"
+								}
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 97,
+				"end": 99,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 99,
+				"end": 135,
+				"expression": {
+					"type": "Identifier",
+					"start": 106,
+					"end": 107,
+					"loc": {
+						"start": {
+							"line": 7,
+							"column": 7
+						},
+						"end": {
+							"line": 7,
+							"column": 8
+						}
+					},
+					"name": "x"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 111,
+					"end": 127,
+					"loc": {
+						"start": {
+							"line": 7,
+							"column": 13
+						},
+						"end": {
+							"line": 7,
+							"column": 29
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 113,
+							"end": 125,
+							"loc": {
+								"start": {
+									"line": 7,
+									"column": 15
+								},
+								"end": {
+									"line": 7,
+									"column": 27
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 113,
+								"end": 114,
+								"loc": {
+									"start": {
+										"line": 7,
+										"column": 15
+									},
+									"end": {
+										"line": 7,
+										"column": 16
+									}
+								},
+								"name": "y"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 113,
+								"end": 125,
+								"loc": {
+									"start": {
+										"line": 7,
+										"column": 15
+									},
+									"end": {
+										"line": 7,
+										"column": 27
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 113,
+									"end": 114,
+									"loc": {
+										"start": {
+											"line": 7,
+											"column": 15
+										},
+										"end": {
+											"line": 7,
+											"column": 16
+										}
+									},
+									"name": "y"
+								},
+								"right": {
+									"type": "TemplateLiteral",
+									"start": 117,
+									"end": 125,
+									"loc": {
+										"start": {
+											"line": 7,
+											"column": 19
+										},
+										"end": {
+											"line": 7,
+											"column": 27
+										}
+									},
+									"expressions": [
+										{
+											"type": "TemplateLiteral",
+											"start": 120,
+											"end": 123,
+											"loc": {
+												"start": {
+													"line": 7,
+													"column": 22
+												},
+												"end": {
+													"line": 7,
+													"column": 25
+												}
+											},
+											"expressions": [],
+											"quasis": [
+												{
+													"type": "TemplateElement",
+													"start": 121,
+													"end": 122,
+													"loc": {
+														"start": {
+															"line": 7,
+															"column": 23
+														},
+														"end": {
+															"line": 7,
+															"column": 24
+														}
+													},
+													"value": {
+														"raw": "\"",
+														"cooked": "\""
+													},
+													"tail": true
+												}
+											]
+										}
+									],
+									"quasis": [
+										{
+											"type": "TemplateElement",
+											"start": 118,
+											"end": 118,
+											"loc": {
+												"start": {
+													"line": 7,
+													"column": 20
+												},
+												"end": {
+													"line": 7,
+													"column": 20
+												}
+											},
+											"value": {
+												"raw": "",
+												"cooked": ""
+											},
+											"tail": false
+										},
+										{
+											"type": "TemplateElement",
+											"start": 124,
+											"end": 124,
+											"loc": {
+												"start": {
+													"line": 7,
+													"column": 26
+												},
+												"end": {
+													"line": 7,
+													"column": 26
+												}
+											},
+											"value": {
+												"raw": "",
+												"cooked": ""
+											},
+											"tail": true
+										}
+									]
+								}
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 135,
+				"end": 137,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 137,
+				"end": 176,
+				"expression": {
+					"type": "Identifier",
+					"start": 144,
+					"end": 145,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 7
+						},
+						"end": {
+							"line": 9,
+							"column": 8
+						}
+					},
+					"name": "x"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": []
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 149,
+					"end": 168,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 13
+						},
+						"end": {
+							"line": 9,
+							"column": 32
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 151,
+							"end": 166,
+							"loc": {
+								"start": {
+									"line": 9,
+									"column": 15
+								},
+								"end": {
+									"line": 9,
+									"column": 30
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 151,
+								"end": 152,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 15
+									},
+									"end": {
+										"line": 9,
+										"column": 16
+									}
+								},
+								"name": "y"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 151,
+								"end": 166,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 15
+									},
+									"end": {
+										"line": 9,
+										"column": 30
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 151,
+									"end": 152,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 15
+										},
+										"end": {
+											"line": 9,
+											"column": 16
+										}
+									},
+									"name": "y"
+								},
+								"right": {
+									"type": "TemplateLiteral",
+									"start": 155,
+									"end": 166,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 19
+										},
+										"end": {
+											"line": 9,
+											"column": 30
+										}
+									},
+									"expressions": [
+										{
+											"type": "TemplateLiteral",
+											"start": 158,
+											"end": 164,
+											"loc": {
+												"start": {
+													"line": 9,
+													"column": 22
+												},
+												"end": {
+													"line": 9,
+													"column": 28
+												}
+											},
+											"expressions": [],
+											"quasis": [
+												{
+													"type": "TemplateElement",
+													"start": 159,
+													"end": 163,
+													"loc": {
+														"start": {
+															"line": 9,
+															"column": 23
+														},
+														"end": {
+															"line": 9,
+															"column": 27
+														}
+													},
+													"value": {
+														"raw": "John",
+														"cooked": "John"
+													},
+													"tail": true
+												}
+											]
+										}
+									],
+									"quasis": [
+										{
+											"type": "TemplateElement",
+											"start": 156,
+											"end": 156,
+											"loc": {
+												"start": {
+													"line": 9,
+													"column": 20
+												},
+												"end": {
+													"line": 9,
+													"column": 20
+												}
+											},
+											"value": {
+												"raw": "",
+												"cooked": ""
+											},
+											"tail": false
+										},
+										{
+											"type": "TemplateElement",
+											"start": 165,
+											"end": 165,
+											"loc": {
+												"start": {
+													"line": 9,
+													"column": 29
+												},
+												"end": {
+													"line": 9,
+													"column": 29
+												}
+											},
+											"value": {
+												"raw": "",
+												"cooked": ""
+											},
+											"tail": true
+										}
+									]
+								}
+							}
+						}
+					]
+				}
+			}
+		]
+	},
+	"options": null
+}
diff --git a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/input.svelte b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/input.svelte
index 8ffe8a7287..c3bfdb46a6 100644
--- a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/input.svelte
+++ b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/input.svelte
@@ -1,3 +1,11 @@
 {#each people as { name, cool = true }}
 	<p>{name} is {cool ? 'cool' : 'not cool'}</p>
 {/each}
+
+{#each people as { name = `Jane ${"Doe"}`, cool = true }}
+	<p>{name} is {cool ? 'cool' : 'not cool'}</p>
+{/each}
+
+{#each people as { name = (() => { return `Jane ${"Doe"}`; })(), cool = true }}
+	<p>{name} is {cool ? 'cool' : 'not cool'}</p>
+{/each}
diff --git a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/output.json b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/output.json
index 8fc3feb916..144016417b 100644
--- a/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/output.json
+++ b/packages/svelte/tests/parser-modern/samples/each-block-object-pattern/output.json
@@ -2,7 +2,7 @@
 	"css": null,
 	"js": [],
 	"start": 0,
-	"end": 94,
+	"end": 344,
 	"type": "Root",
 	"fragment": {
 		"type": "Fragment",
@@ -307,6 +307,873 @@
 						}
 					]
 				}
+			},
+			{
+				"type": "Text",
+				"start": 94,
+				"end": 96,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 96,
+				"end": 208,
+				"expression": {
+					"type": "Identifier",
+					"start": 103,
+					"end": 109,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 7
+						},
+						"end": {
+							"line": 5,
+							"column": 13
+						}
+					},
+					"name": "people"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 153,
+							"end": 155,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 155,
+							"end": 200,
+							"name": "p",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "ExpressionTag",
+										"start": 158,
+										"end": 164,
+										"expression": {
+											"type": "Identifier",
+											"start": 159,
+											"end": 163,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 5
+												},
+												"end": {
+													"line": 6,
+													"column": 9
+												}
+											},
+											"name": "name"
+										}
+									},
+									{
+										"type": "Text",
+										"start": 164,
+										"end": 168,
+										"raw": " is ",
+										"data": " is "
+									},
+									{
+										"type": "ExpressionTag",
+										"start": 168,
+										"end": 196,
+										"expression": {
+											"type": "ConditionalExpression",
+											"start": 169,
+											"end": 195,
+											"loc": {
+												"start": {
+													"line": 6,
+													"column": 15
+												},
+												"end": {
+													"line": 6,
+													"column": 41
+												}
+											},
+											"test": {
+												"type": "Identifier",
+												"start": 169,
+												"end": 173,
+												"loc": {
+													"start": {
+														"line": 6,
+														"column": 15
+													},
+													"end": {
+														"line": 6,
+														"column": 19
+													}
+												},
+												"name": "cool"
+											},
+											"consequent": {
+												"type": "Literal",
+												"start": 176,
+												"end": 182,
+												"loc": {
+													"start": {
+														"line": 6,
+														"column": 22
+													},
+													"end": {
+														"line": 6,
+														"column": 28
+													}
+												},
+												"value": "cool",
+												"raw": "'cool'"
+											},
+											"alternate": {
+												"type": "Literal",
+												"start": 185,
+												"end": 195,
+												"loc": {
+													"start": {
+														"line": 6,
+														"column": 31
+													},
+													"end": {
+														"line": 6,
+														"column": 41
+													}
+												},
+												"value": "not cool",
+												"raw": "'not cool'"
+											}
+										}
+									}
+								]
+							}
+						},
+						{
+							"type": "Text",
+							"start": 200,
+							"end": 201,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 113,
+					"end": 152,
+					"loc": {
+						"start": {
+							"line": 5,
+							"column": 18
+						},
+						"end": {
+							"line": 5,
+							"column": 57
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 115,
+							"end": 137,
+							"loc": {
+								"start": {
+									"line": 5,
+									"column": 20
+								},
+								"end": {
+									"line": 5,
+									"column": 42
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 115,
+								"end": 119,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 20
+									},
+									"end": {
+										"line": 5,
+										"column": 24
+									}
+								},
+								"name": "name"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 115,
+								"end": 137,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 20
+									},
+									"end": {
+										"line": 5,
+										"column": 42
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 115,
+									"end": 119,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 20
+										},
+										"end": {
+											"line": 5,
+											"column": 24
+										}
+									},
+									"name": "name"
+								},
+								"right": {
+									"type": "TemplateLiteral",
+									"start": 122,
+									"end": 137,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 27
+										},
+										"end": {
+											"line": 5,
+											"column": 42
+										}
+									},
+									"expressions": [
+										{
+											"type": "Literal",
+											"start": 130,
+											"end": 135,
+											"loc": {
+												"start": {
+													"line": 5,
+													"column": 35
+												},
+												"end": {
+													"line": 5,
+													"column": 40
+												}
+											},
+											"value": "Doe",
+											"raw": "\"Doe\""
+										}
+									],
+									"quasis": [
+										{
+											"type": "TemplateElement",
+											"start": 123,
+											"end": 128,
+											"loc": {
+												"start": {
+													"line": 5,
+													"column": 28
+												},
+												"end": {
+													"line": 5,
+													"column": 33
+												}
+											},
+											"value": {
+												"raw": "Jane ",
+												"cooked": "Jane "
+											},
+											"tail": false
+										},
+										{
+											"type": "TemplateElement",
+											"start": 136,
+											"end": 136,
+											"loc": {
+												"start": {
+													"line": 5,
+													"column": 41
+												},
+												"end": {
+													"line": 5,
+													"column": 41
+												}
+											},
+											"value": {
+												"raw": "",
+												"cooked": ""
+											},
+											"tail": true
+										}
+									]
+								}
+							}
+						},
+						{
+							"type": "Property",
+							"start": 139,
+							"end": 150,
+							"loc": {
+								"start": {
+									"line": 5,
+									"column": 44
+								},
+								"end": {
+									"line": 5,
+									"column": 55
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 139,
+								"end": 143,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 44
+									},
+									"end": {
+										"line": 5,
+										"column": 48
+									}
+								},
+								"name": "cool"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 139,
+								"end": 150,
+								"loc": {
+									"start": {
+										"line": 5,
+										"column": 44
+									},
+									"end": {
+										"line": 5,
+										"column": 55
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 139,
+									"end": 143,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 44
+										},
+										"end": {
+											"line": 5,
+											"column": 48
+										}
+									},
+									"name": "cool"
+								},
+								"right": {
+									"type": "Literal",
+									"start": 146,
+									"end": 150,
+									"loc": {
+										"start": {
+											"line": 5,
+											"column": 51
+										},
+										"end": {
+											"line": 5,
+											"column": 55
+										}
+									},
+									"value": true,
+									"raw": "true"
+								}
+							}
+						}
+					]
+				}
+			},
+			{
+				"type": "Text",
+				"start": 208,
+				"end": 210,
+				"raw": "\n\n",
+				"data": "\n\n"
+			},
+			{
+				"type": "EachBlock",
+				"start": 210,
+				"end": 344,
+				"expression": {
+					"type": "Identifier",
+					"start": 217,
+					"end": 223,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 7
+						},
+						"end": {
+							"line": 9,
+							"column": 13
+						}
+					},
+					"name": "people"
+				},
+				"body": {
+					"type": "Fragment",
+					"nodes": [
+						{
+							"type": "Text",
+							"start": 289,
+							"end": 291,
+							"raw": "\n\t",
+							"data": "\n\t"
+						},
+						{
+							"type": "RegularElement",
+							"start": 291,
+							"end": 336,
+							"name": "p",
+							"attributes": [],
+							"fragment": {
+								"type": "Fragment",
+								"nodes": [
+									{
+										"type": "ExpressionTag",
+										"start": 294,
+										"end": 300,
+										"expression": {
+											"type": "Identifier",
+											"start": 295,
+											"end": 299,
+											"loc": {
+												"start": {
+													"line": 10,
+													"column": 5
+												},
+												"end": {
+													"line": 10,
+													"column": 9
+												}
+											},
+											"name": "name"
+										}
+									},
+									{
+										"type": "Text",
+										"start": 300,
+										"end": 304,
+										"raw": " is ",
+										"data": " is "
+									},
+									{
+										"type": "ExpressionTag",
+										"start": 304,
+										"end": 332,
+										"expression": {
+											"type": "ConditionalExpression",
+											"start": 305,
+											"end": 331,
+											"loc": {
+												"start": {
+													"line": 10,
+													"column": 15
+												},
+												"end": {
+													"line": 10,
+													"column": 41
+												}
+											},
+											"test": {
+												"type": "Identifier",
+												"start": 305,
+												"end": 309,
+												"loc": {
+													"start": {
+														"line": 10,
+														"column": 15
+													},
+													"end": {
+														"line": 10,
+														"column": 19
+													}
+												},
+												"name": "cool"
+											},
+											"consequent": {
+												"type": "Literal",
+												"start": 312,
+												"end": 318,
+												"loc": {
+													"start": {
+														"line": 10,
+														"column": 22
+													},
+													"end": {
+														"line": 10,
+														"column": 28
+													}
+												},
+												"value": "cool",
+												"raw": "'cool'"
+											},
+											"alternate": {
+												"type": "Literal",
+												"start": 321,
+												"end": 331,
+												"loc": {
+													"start": {
+														"line": 10,
+														"column": 31
+													},
+													"end": {
+														"line": 10,
+														"column": 41
+													}
+												},
+												"value": "not cool",
+												"raw": "'not cool'"
+											}
+										}
+									}
+								]
+							}
+						},
+						{
+							"type": "Text",
+							"start": 336,
+							"end": 337,
+							"raw": "\n",
+							"data": "\n"
+						}
+					]
+				},
+				"context": {
+					"type": "ObjectPattern",
+					"start": 227,
+					"end": 288,
+					"loc": {
+						"start": {
+							"line": 9,
+							"column": 18
+						},
+						"end": {
+							"line": 9,
+							"column": 79
+						}
+					},
+					"properties": [
+						{
+							"type": "Property",
+							"start": 229,
+							"end": 273,
+							"loc": {
+								"start": {
+									"line": 9,
+									"column": 20
+								},
+								"end": {
+									"line": 9,
+									"column": 64
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 229,
+								"end": 233,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 20
+									},
+									"end": {
+										"line": 9,
+										"column": 24
+									}
+								},
+								"name": "name"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 229,
+								"end": 273,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 20
+									},
+									"end": {
+										"line": 9,
+										"column": 64
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 229,
+									"end": 233,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 20
+										},
+										"end": {
+											"line": 9,
+											"column": 24
+										}
+									},
+									"name": "name"
+								},
+								"right": {
+									"type": "CallExpression",
+									"start": 236,
+									"end": 273,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 27
+										},
+										"end": {
+											"line": 9,
+											"column": 64
+										}
+									},
+									"callee": {
+										"type": "ArrowFunctionExpression",
+										"start": 237,
+										"end": 270,
+										"loc": {
+											"start": {
+												"line": 9,
+												"column": 28
+											},
+											"end": {
+												"line": 9,
+												"column": 61
+											}
+										},
+										"id": null,
+										"expression": false,
+										"generator": false,
+										"async": false,
+										"params": [],
+										"body": {
+											"type": "BlockStatement",
+											"start": 243,
+											"end": 270,
+											"loc": {
+												"start": {
+													"line": 9,
+													"column": 34
+												},
+												"end": {
+													"line": 9,
+													"column": 61
+												}
+											},
+											"body": [
+												{
+													"type": "ReturnStatement",
+													"start": 245,
+													"end": 268,
+													"loc": {
+														"start": {
+															"line": 9,
+															"column": 36
+														},
+														"end": {
+															"line": 9,
+															"column": 59
+														}
+													},
+													"argument": {
+														"type": "TemplateLiteral",
+														"start": 252,
+														"end": 267,
+														"loc": {
+															"start": {
+																"line": 9,
+																"column": 43
+															},
+															"end": {
+																"line": 9,
+																"column": 58
+															}
+														},
+														"expressions": [
+															{
+																"type": "Literal",
+																"start": 260,
+																"end": 265,
+																"loc": {
+																	"start": {
+																		"line": 9,
+																		"column": 51
+																	},
+																	"end": {
+																		"line": 9,
+																		"column": 56
+																	}
+																},
+																"value": "Doe",
+																"raw": "\"Doe\""
+															}
+														],
+														"quasis": [
+															{
+																"type": "TemplateElement",
+																"start": 253,
+																"end": 258,
+																"loc": {
+																	"start": {
+																		"line": 9,
+																		"column": 44
+																	},
+																	"end": {
+																		"line": 9,
+																		"column": 49
+																	}
+																},
+																"value": {
+																	"raw": "Jane ",
+																	"cooked": "Jane "
+																},
+																"tail": false
+															},
+															{
+																"type": "TemplateElement",
+																"start": 266,
+																"end": 266,
+																"loc": {
+																	"start": {
+																		"line": 9,
+																		"column": 57
+																	},
+																	"end": {
+																		"line": 9,
+																		"column": 57
+																	}
+																},
+																"value": {
+																	"raw": "",
+																	"cooked": ""
+																},
+																"tail": true
+															}
+														]
+													}
+												}
+											]
+										}
+									},
+									"arguments": [],
+									"optional": false
+								}
+							}
+						},
+						{
+							"type": "Property",
+							"start": 275,
+							"end": 286,
+							"loc": {
+								"start": {
+									"line": 9,
+									"column": 66
+								},
+								"end": {
+									"line": 9,
+									"column": 77
+								}
+							},
+							"method": false,
+							"shorthand": true,
+							"computed": false,
+							"key": {
+								"type": "Identifier",
+								"start": 275,
+								"end": 279,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 66
+									},
+									"end": {
+										"line": 9,
+										"column": 70
+									}
+								},
+								"name": "cool"
+							},
+							"kind": "init",
+							"value": {
+								"type": "AssignmentPattern",
+								"start": 275,
+								"end": 286,
+								"loc": {
+									"start": {
+										"line": 9,
+										"column": 66
+									},
+									"end": {
+										"line": 9,
+										"column": 77
+									}
+								},
+								"left": {
+									"type": "Identifier",
+									"start": 275,
+									"end": 279,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 66
+										},
+										"end": {
+											"line": 9,
+											"column": 70
+										}
+									},
+									"name": "cool"
+								},
+								"right": {
+									"type": "Literal",
+									"start": 282,
+									"end": 286,
+									"loc": {
+										"start": {
+											"line": 9,
+											"column": 73
+										},
+										"end": {
+											"line": 9,
+											"column": 77
+										}
+									},
+									"value": true,
+									"raw": "true"
+								}
+							}
+						}
+					]
+				}
 			}
 		]
 	},

From deb362fe517c6fac3b77bfb4ec0b0dc9df16a971 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 8 Jan 2025 01:37:53 +0000
Subject: [PATCH 393/404] chore: expand benchmark iterations (#14944)

---
 benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_broad.js     | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_deep.js      | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js   | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_mux.js       | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js  | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js  | 4 ++--
 benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js  | 4 ++--
 8 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js b/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
index 1237547ebe..6b058cdc3c 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_avoidable.js
@@ -45,7 +45,7 @@ export async function kairo_avoidable_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -74,7 +74,7 @@ export async function kairo_avoidable_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js b/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
index 8148a743ea..d1cde5958e 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_broad.js
@@ -51,7 +51,7 @@ export async function kairo_broad_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -80,7 +80,7 @@ export async function kairo_broad_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js b/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
index 806042cc72..149457ede1 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_deep.js
@@ -51,7 +51,7 @@ export async function kairo_deep_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -80,7 +80,7 @@ export async function kairo_deep_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js b/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
index deb9482de9..958a1bcd78 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_diamond.js
@@ -55,7 +55,7 @@ export async function kairo_diamond_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -84,7 +84,7 @@ export async function kairo_diamond_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js b/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
index 8eafacc9eb..b645051c09 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_mux.js
@@ -48,7 +48,7 @@ export async function kairo_mux_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -77,7 +77,7 @@ export async function kairo_mux_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js b/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
index 2bddf879c9..53b85acd37 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_repeated.js
@@ -52,7 +52,7 @@ export async function kairo_repeated_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -81,7 +81,7 @@ export async function kairo_repeated_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js b/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
index 9d99b7815b..b9e2ad9fa4 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_triangle.js
@@ -65,7 +65,7 @@ export async function kairo_triangle_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -94,7 +94,7 @@ export async function kairo_triangle_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
diff --git a/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js b/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
index c30c007561..0e783732dc 100644
--- a/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
+++ b/benchmarking/benchmarks/reactivity/kairo/kairo_unstable.js
@@ -51,7 +51,7 @@ export async function kairo_unstable_unowned() {
 	const { run, destroy } = setup();
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});
@@ -80,7 +80,7 @@ export async function kairo_unstable_owned() {
 	});
 
 	const { timing } = await fastest_test(10, () => {
-		for (let i = 0; i < 100; i++) {
+		for (let i = 0; i < 1000; i++) {
 			run();
 		}
 	});

From 9c20eb4815bf86147746012453a2cfd8b407c61b Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <trueadm@users.noreply.github.com>
Date: Wed, 8 Jan 2025 09:46:26 +0000
Subject: [PATCH 394/404] chore: improve signal performance by reducing
 duplicate deps (#14945)

* chore: expand benchmark iterations

* chore: improve signal performance by reducing duplicate deps

* feedback

* oops
---
 .changeset/tame-students-retire.md            |  5 ++
 .../svelte/src/internal/client/dev/tracing.js |  7 +--
 .../internal/client/reactivity/deriveds.js    |  7 ++-
 .../src/internal/client/reactivity/effects.js |  2 +-
 .../src/internal/client/reactivity/sources.js |  7 ++-
 .../src/internal/client/reactivity/types.d.ts |  8 ++-
 .../svelte/src/internal/client/runtime.js     | 63 +++++++++++--------
 packages/svelte/tests/signals/test.ts         |  3 +-
 8 files changed, 59 insertions(+), 43 deletions(-)
 create mode 100644 .changeset/tame-students-retire.md

diff --git a/.changeset/tame-students-retire.md b/.changeset/tame-students-retire.md
new file mode 100644
index 0000000000..121c3690d0
--- /dev/null
+++ b/.changeset/tame-students-retire.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: improve signal performance by reducing duplicate deps
diff --git a/packages/svelte/src/internal/client/dev/tracing.js b/packages/svelte/src/internal/client/dev/tracing.js
index 6e759ecd59..3881ef3442 100644
--- a/packages/svelte/src/internal/client/dev/tracing.js
+++ b/packages/svelte/src/internal/client/dev/tracing.js
@@ -42,15 +42,12 @@ function log_entry(signal, entry) {
 
 	const type = (signal.f & DERIVED) !== 0 ? '$derived' : '$state';
 	const current_reaction = /** @type {Reaction} */ (active_reaction);
-	const status =
-		signal.version > current_reaction.version || current_reaction.version === 0 ? 'dirty' : 'clean';
+	const dirty = signal.wv > current_reaction.wv || current_reaction.wv === 0;
 
 	// eslint-disable-next-line no-console
 	console.groupCollapsed(
 		`%c${type}`,
-		status !== 'clean'
-			? 'color: CornflowerBlue; font-weight: bold'
-			: 'color: grey; font-weight: bold',
+		dirty ? 'color: CornflowerBlue; font-weight: bold' : 'color: grey; font-weight: bold',
 		typeof value === 'object' && value !== null && STATE_SYMBOL in value
 			? snapshot(value, true)
 			: value
diff --git a/packages/svelte/src/internal/client/reactivity/deriveds.js b/packages/svelte/src/internal/client/reactivity/deriveds.js
index 5e045920bf..7ec1ed30bd 100644
--- a/packages/svelte/src/internal/client/reactivity/deriveds.js
+++ b/packages/svelte/src/internal/client/reactivity/deriveds.js
@@ -16,7 +16,7 @@ import {
 	set_signal_status,
 	skip_reaction,
 	update_reaction,
-	increment_version,
+	increment_write_version,
 	set_active_effect,
 	component_context
 } from '../runtime.js';
@@ -58,8 +58,9 @@ export function derived(fn) {
 		f: flags,
 		fn,
 		reactions: null,
+		rv: 0,
 		v: /** @type {V} */ (null),
-		version: 0,
+		wv: 0,
 		parent: parent_derived ?? active_effect
 	};
 
@@ -182,7 +183,7 @@ export function update_derived(derived) {
 
 	if (!derived.equals(value)) {
 		derived.v = value;
-		derived.version = increment_version();
+		derived.wv = increment_write_version();
 	}
 }
 
diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js
index bf890627f7..16f076edde 100644
--- a/packages/svelte/src/internal/client/reactivity/effects.js
+++ b/packages/svelte/src/internal/client/reactivity/effects.js
@@ -110,7 +110,7 @@ function create_effect(type, fn, sync, push = true) {
 		prev: null,
 		teardown: null,
 		transitions: null,
-		version: 0
+		wv: 0
 	};
 
 	if (DEV) {
diff --git a/packages/svelte/src/internal/client/reactivity/sources.js b/packages/svelte/src/internal/client/reactivity/sources.js
index fedf5b5070..e0facf3b55 100644
--- a/packages/svelte/src/internal/client/reactivity/sources.js
+++ b/packages/svelte/src/internal/client/reactivity/sources.js
@@ -12,7 +12,7 @@ import {
 	set_untracked_writes,
 	set_signal_status,
 	untrack,
-	increment_version,
+	increment_write_version,
 	update_effect,
 	derived_sources,
 	set_derived_sources,
@@ -57,7 +57,8 @@ export function source(v, stack) {
 		v,
 		reactions: null,
 		equals,
-		version: 0
+		rv: 0,
+		wv: 0
 	};
 
 	if (DEV && tracing_mode_flag) {
@@ -169,7 +170,7 @@ export function internal_set(source, value) {
 	if (!source.equals(value)) {
 		var old_value = source.v;
 		source.v = value;
-		source.version = increment_version();
+		source.wv = increment_write_version();
 
 		if (DEV && tracing_mode_flag) {
 			source.updated = get_stack('UpdatedAt');
diff --git a/packages/svelte/src/internal/client/reactivity/types.d.ts b/packages/svelte/src/internal/client/reactivity/types.d.ts
index 9a6e5d8bf0..3a76a3ff83 100644
--- a/packages/svelte/src/internal/client/reactivity/types.d.ts
+++ b/packages/svelte/src/internal/client/reactivity/types.d.ts
@@ -4,14 +4,16 @@ export interface Signal {
 	/** Flags bitmask */
 	f: number;
 	/** Write version */
-	version: number;
+	wv: number;
 }
 
 export interface Value<V = unknown> extends Signal {
-	/** Signals that read from this signal */
-	reactions: null | Reaction[];
 	/** Equality function */
 	equals: Equals;
+	/** Signals that read from this signal */
+	reactions: null | Reaction[];
+	/** Read version */
+	rv: number;
 	/** The latest value for this signal */
 	v: V;
 	/** Dev only */
diff --git a/packages/svelte/src/internal/client/runtime.js b/packages/svelte/src/internal/client/runtime.js
index a066f1c11a..202608ce06 100644
--- a/packages/svelte/src/internal/client/runtime.js
+++ b/packages/svelte/src/internal/client/runtime.js
@@ -127,8 +127,14 @@ export function set_untracked_writes(value) {
 	untracked_writes = value;
 }
 
-/** @type {number} Used by sources and deriveds for handling updates to unowned deriveds it starts from 1 to differentiate between a created effect and a run one for tracing */
-let current_version = 1;
+/**
+ * @type {number} Used by sources and deriveds for handling updates.
+ * Version starts from 1 so that unowned deriveds differentiate between a created effect and a run one for tracing
+ **/
+let write_version = 1;
+
+/** @type {number} Used to version each read of a source of derived to avoid duplicating depedencies inside a reaction */
+let read_version = 0;
 
 // If we are working with a get() chain that has no active container,
 // to prevent memory leaks, we skip adding the reaction.
@@ -168,8 +174,8 @@ export function set_dev_current_component_function(fn) {
 	dev_current_component_function = fn;
 }
 
-export function increment_version() {
-	return ++current_version;
+export function increment_write_version() {
+	return ++write_version;
 }
 
 /** @returns {boolean} */
@@ -226,7 +232,7 @@ export function check_dirtiness(reaction) {
 					update_derived(/** @type {Derived} */ (dependency));
 				}
 
-				if (dependency.version > reaction.version) {
+				if (dependency.wv > reaction.wv) {
 					return true;
 				}
 			}
@@ -398,6 +404,7 @@ export function update_reaction(reaction) {
 	skip_reaction = !is_flushing_effect && (flags & UNOWNED) !== 0;
 	derived_sources = null;
 	component_context = reaction.ctx;
+	read_version++;
 
 	try {
 		var result = /** @type {Function} */ (0, reaction.fn)();
@@ -528,7 +535,7 @@ export function update_effect(effect) {
 		execute_effect_teardown(effect);
 		var teardown = update_reaction(effect);
 		effect.teardown = typeof teardown === 'function' ? teardown : null;
-		effect.version = current_version;
+		effect.wv = write_version;
 
 		var deps = effect.deps;
 
@@ -540,7 +547,7 @@ export function update_effect(effect) {
 			for (let i = 0; i < deps.length; i++) {
 				var dep = deps[i];
 				if (dep.trace_need_increase) {
-					dep.version = increment_version();
+					dep.wv = increment_write_version();
 					dep.trace_need_increase = undefined;
 					dep.trace_v = undefined;
 				}
@@ -880,27 +887,29 @@ export function get(signal) {
 			e.state_unsafe_local_read();
 		}
 		var deps = active_reaction.deps;
+		if (signal.rv < read_version) {
+			signal.rv = read_version;
+			// If the signal is accessing the same dependencies in the same
+			// order as it did last time, increment `skipped_deps`
+			// rather than updating `new_deps`, which creates GC cost
+			if (new_deps === null && deps !== null && deps[skipped_deps] === signal) {
+				skipped_deps++;
+			} else if (new_deps === null) {
+				new_deps = [signal];
+			} else {
+				new_deps.push(signal);
+			}
 
-		// If the signal is accessing the same dependencies in the same
-		// order as it did last time, increment `skipped_deps`
-		// rather than updating `new_deps`, which creates GC cost
-		if (new_deps === null && deps !== null && deps[skipped_deps] === signal) {
-			skipped_deps++;
-		} else if (new_deps === null) {
-			new_deps = [signal];
-		} else {
-			new_deps.push(signal);
-		}
-
-		if (
-			untracked_writes !== null &&
-			active_effect !== null &&
-			(active_effect.f & CLEAN) !== 0 &&
-			(active_effect.f & BRANCH_EFFECT) === 0 &&
-			untracked_writes.includes(signal)
-		) {
-			set_signal_status(active_effect, DIRTY);
-			schedule_effect(active_effect);
+			if (
+				untracked_writes !== null &&
+				active_effect !== null &&
+				(active_effect.f & CLEAN) !== 0 &&
+				(active_effect.f & BRANCH_EFFECT) === 0 &&
+				untracked_writes.includes(signal)
+			) {
+				set_signal_status(active_effect, DIRTY);
+				schedule_effect(active_effect);
+			}
 		}
 	} else if (is_derived && /** @type {Derived} */ (signal).deps === null) {
 		var derived = /** @type {Derived} */ (signal);
diff --git a/packages/svelte/tests/signals/test.ts b/packages/svelte/tests/signals/test.ts
index 0a22e30286..e198a5a89d 100644
--- a/packages/svelte/tests/signals/test.ts
+++ b/packages/svelte/tests/signals/test.ts
@@ -296,6 +296,7 @@ describe('signals', () => {
 		const destroy = effect_root(() => {
 			user_effect(() => {
 				log.push($.get(calc));
+				$.get(calc);
 			});
 		});
 
@@ -306,7 +307,7 @@ describe('signals', () => {
 			flushSync(() => set(count, 4));
 			flushSync(() => set(count, 0));
 			// Ensure we're not leaking consumers
-			assert.deepEqual(count.reactions?.length, 2);
+			assert.deepEqual(count.reactions?.length, 1);
 			assert.deepEqual(calc.reactions?.length, 1);
 			assert.deepEqual(log, [0, 2, 'limit', 0]);
 			destroy();

From ce2566d4c41c24546a697aa5feac07a617f806c0 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:47:24 +0000
Subject: [PATCH 395/404] docs: simplify `$effect.tracking()` docs (#14939)

---
 documentation/docs/02-runes/04-$effect.md | 48 +----------------------
 1 file changed, 1 insertion(+), 47 deletions(-)

diff --git a/documentation/docs/02-runes/04-$effect.md b/documentation/docs/02-runes/04-$effect.md
index b338795220..c48a82f9a5 100644
--- a/documentation/docs/02-runes/04-$effect.md
+++ b/documentation/docs/02-runes/04-$effect.md
@@ -193,53 +193,7 @@ The `$effect.tracking` rune is an advanced feature that tells you whether or not
 <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. Here's a `readable` function that listens to changes from a callback function as long as it's inside a tracking context:
-
-```ts
-import { tick } from 'svelte';
-
-export default function readable<T>(
-	initial_value: T,
-	start: (callback: (update: (v: T) => T) => T) => () => void
-) {
-	let value = $state(initial_value);
-
-	let subscribers = 0;
-	let stop: null | (() => void) = null;
-
-	return {
-		get value() {
-			// If in a tracking context ...
-			if ($effect.tracking()) {
-				$effect(() => {
-					// ...and there's no subscribers yet...
-					if (subscribers === 0) {
-						// ...invoke the function and listen to changes to update state
-						stop = start((fn) => (value = fn(value)));
-					}
-
-					subscribers++;
-
-					// The return callback is called once a listener unlistens
-					return () => {
-						tick().then(() => {
-							subscribers--;
-							// If it was the last subscriber...
-							if (subscribers === 0) {
-								// ...stop listening to changes
-								stop?.();
-								stop = null;
-							}
-						});
-					};
-				});
-			}
-
-			return value;
-		}
-	};
-}
-```
+It is used to implement abstractions like [`createSubscriber`](/docs/svelte/svelte-reactivity#createSubscriber), which will create listeners to update reactive values but _only_ if those values are being tracked (rather than, for example, read inside an event handler).
 
 ## `$effect.root`
 

From adee13d98c09c5bddc0da41cd38c429498880a09 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:49:04 +0000
Subject: [PATCH 396/404] fix: account for min-width/height in `slide`
 transition (#14942)

---
 .changeset/gold-olives-care.md                               | 5 +++++
 packages/svelte/src/transition/index.js                      | 3 ++-
 .../samples/class-shortcut-with-transition/_config.js        | 2 +-
 3 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/gold-olives-care.md

diff --git a/.changeset/gold-olives-care.md b/.changeset/gold-olives-care.md
new file mode 100644
index 0000000000..9f7357c6da
--- /dev/null
+++ b/.changeset/gold-olives-care.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: account for min-width/height in `slide` transition
diff --git a/packages/svelte/src/transition/index.js b/packages/svelte/src/transition/index.js
index 4123106211..aacc6b6cf3 100644
--- a/packages/svelte/src/transition/index.js
+++ b/packages/svelte/src/transition/index.js
@@ -131,7 +131,8 @@ export function slide(node, { delay = 0, duration = 400, easing = cubic_out, axi
 			`margin-${secondary_properties[0]}: ${t * margin_start_value}px;` +
 			`margin-${secondary_properties[1]}: ${t * margin_end_value}px;` +
 			`border-${secondary_properties[0]}-width: ${t * border_width_start_value}px;` +
-			`border-${secondary_properties[1]}-width: ${t * border_width_end_value}px;`
+			`border-${secondary_properties[1]}-width: ${t * border_width_end_value}px;` +
+			`min-${primary_property}: 0`
 	};
 }
 
diff --git a/packages/svelte/tests/runtime-legacy/samples/class-shortcut-with-transition/_config.js b/packages/svelte/tests/runtime-legacy/samples/class-shortcut-with-transition/_config.js
index 6e3f7a3cb7..e58e8c53c5 100644
--- a/packages/svelte/tests/runtime-legacy/samples/class-shortcut-with-transition/_config.js
+++ b/packages/svelte/tests/runtime-legacy/samples/class-shortcut-with-transition/_config.js
@@ -18,7 +18,7 @@ export default test({
 		raf.tick(150);
 		assert.htmlEqual(
 			target.innerHTML,
-			'<p>foo</p><p class="red svelte-1yszte8 border" style="overflow: hidden; opacity: 0; border-top-width: 0.5px; border-bottom-width: 0.5px;">bar</p>'
+			'<p>foo</p><p class="red svelte-1yszte8 border" style="overflow: hidden; opacity: 0; border-top-width: 0.5px; border-bottom-width: 0.5px; min-height: 0;">bar</p>'
 		);
 		component.open = true;
 		raf.tick(250);

From d245bab63a3fd4fbe3d0a03d51581db5b794564e Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:49:49 +0000
Subject: [PATCH 397/404] feat: allow non-numeric values to be tweened by
 snapping immediately to new value (#14941)

---
 .changeset/cool-apples-report.md      |  5 +++++
 packages/svelte/src/motion/tweened.js |  3 ++-
 packages/svelte/tests/motion/test.ts  | 21 +++++++++++++++++++++
 3 files changed, 28 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/cool-apples-report.md

diff --git a/.changeset/cool-apples-report.md b/.changeset/cool-apples-report.md
new file mode 100644
index 0000000000..fa76c036d1
--- /dev/null
+++ b/.changeset/cool-apples-report.md
@@ -0,0 +1,5 @@
+---
+'svelte': minor
+---
+
+feat: allow non-numeric values to be tweened by snapping immediately to new value
diff --git a/packages/svelte/src/motion/tweened.js b/packages/svelte/src/motion/tweened.js
index 36d32d1f72..31cddf8f30 100644
--- a/packages/svelte/src/motion/tweened.js
+++ b/packages/svelte/src/motion/tweened.js
@@ -72,7 +72,8 @@ function get_interpolator(a, b) {
 		return (t) => a + t * delta;
 	}
 
-	throw new Error(`Cannot interpolate ${type} values`);
+	// for non-numeric values, snap to the final value immediately
+	return () => b;
 }
 
 /**
diff --git a/packages/svelte/tests/motion/test.ts b/packages/svelte/tests/motion/test.ts
index 7d845bac3d..7d0403983a 100644
--- a/packages/svelte/tests/motion/test.ts
+++ b/packages/svelte/tests/motion/test.ts
@@ -3,6 +3,7 @@ import '../helpers.js'; // for the matchMedia polyfill
 import { describe, it, assert } from 'vitest';
 import { get } from 'svelte/store';
 import { spring, tweened, Tween } from 'svelte/motion';
+import { raf } from '../animation-helpers.js';
 
 describe('motion', () => {
 	describe('spring', () => {
@@ -38,6 +39,16 @@ describe('motion', () => {
 			size.update((v) => v + 10);
 			assert.equal(get(size), 20);
 		});
+
+		it('updates non-numeric values immediately', () => {
+			raf.reset();
+			const boolean = tweened(false);
+
+			boolean.set(true, { duration: 100 });
+
+			raf.tick(1);
+			assert.equal(get(boolean), true);
+		});
 	});
 
 	describe('Tween', () => {
@@ -47,6 +58,16 @@ describe('motion', () => {
 			size.set(100, { duration: 0 });
 			assert.equal(size.current, 100);
 		});
+
+		it('updates non-numeric values immediately', () => {
+			raf.reset();
+			const boolean = new Tween(false);
+
+			boolean.set(true, { duration: 100 });
+
+			raf.tick(1);
+			assert.equal(boolean.current, true);
+		});
 	});
 
 	it('updates correctly when initialized with a `null`-ish value', () => {

From 4d2cb2734b94902225a3b960985976a81b6aa584 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:53:27 +0000
Subject: [PATCH 398/404] fix: prevent long delays causing erratic spring
 behaviour (#14940)

---
 .changeset/modern-wasps-punch.md     |  5 +++++
 packages/svelte/src/motion/spring.js | 13 +++++++++++--
 2 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/modern-wasps-punch.md

diff --git a/.changeset/modern-wasps-punch.md b/.changeset/modern-wasps-punch.md
new file mode 100644
index 0000000000..1fa0b41300
--- /dev/null
+++ b/.changeset/modern-wasps-punch.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent long delays causing erratic spring behaviour
diff --git a/packages/svelte/src/motion/spring.js b/packages/svelte/src/motion/spring.js
index bc30ce9578..1c8e5f15c0 100644
--- a/packages/svelte/src/motion/spring.js
+++ b/packages/svelte/src/motion/spring.js
@@ -108,12 +108,17 @@ export function spring(value, opts = {}) {
 					return false;
 				}
 				inv_mass = Math.min(inv_mass + inv_mass_recovery_rate, 1);
+
+				// clamp elapsed time to 1/30th of a second, so that longer pauses
+				// (blocked thread or inactive tab) don't cause the spring to go haywire
+				const elapsed = Math.min(now - last_time, 1000 / 30);
+
 				/** @type {TickContext} */
 				const ctx = {
 					inv_mass,
 					opts: spring,
 					settled: true,
-					dt: ((now - last_time) * 60) / 1000
+					dt: (elapsed * 60) / 1000
 				};
 				// @ts-ignore
 				const next_value = tick_spring(ctx, last_value, value, target_value);
@@ -236,6 +241,10 @@ export class Spring {
 			this.#task ??= loop((now) => {
 				this.#inverse_mass = Math.min(this.#inverse_mass + inv_mass_recovery_rate, 1);
 
+				// clamp elapsed time to 1/30th of a second, so that longer pauses
+				// (blocked thread or inactive tab) don't cause the spring to go haywire
+				const elapsed = Math.min(now - this.#last_time, 1000 / 30);
+
 				/** @type {import('./private').TickContext} */
 				const ctx = {
 					inv_mass: this.#inverse_mass,
@@ -245,7 +254,7 @@ export class Spring {
 						precision: this.#precision.v
 					},
 					settled: true,
-					dt: ((now - this.#last_time) * 60) / 1000
+					dt: (elapsed * 60) / 1000
 				};
 
 				var next = tick_spring(ctx, this.#last_value, this.#current.v, this.#target.v);

From d41801c75f2a232387229d2a45324affd0310808 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:54:52 +0000
Subject: [PATCH 399/404] feat: warn on using `slide` transition with invalid
 `display` styles (#14936)

* feat: warn on using `slide` transition with table elements

* more generic

* more generic
---
 .changeset/silver-humans-yawn.md                    |  5 +++++
 .../docs/98-reference/.generated/client-warnings.md | 12 ++++++++++++
 .../svelte/messages/client-warnings/warnings.md     | 10 ++++++++++
 packages/svelte/src/internal/client/warnings.js     | 12 ++++++++++++
 packages/svelte/src/transition/index.js             | 13 +++++++++++++
 5 files changed, 52 insertions(+)
 create mode 100644 .changeset/silver-humans-yawn.md

diff --git a/.changeset/silver-humans-yawn.md b/.changeset/silver-humans-yawn.md
new file mode 100644
index 0000000000..e274341079
--- /dev/null
+++ b/.changeset/silver-humans-yawn.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+feat: warn on using `slide` transition with table elements
diff --git a/documentation/docs/98-reference/.generated/client-warnings.md b/documentation/docs/98-reference/.generated/client-warnings.md
index 5218ec4cb1..284e9a7c3e 100644
--- a/documentation/docs/98-reference/.generated/client-warnings.md
+++ b/documentation/docs/98-reference/.generated/client-warnings.md
@@ -222,3 +222,15 @@ Reactive `$state(...)` proxies and the values they proxy have different identiti
 ```
 
 To resolve this, ensure you're comparing values where both values were created with `$state(...)`, or neither were. Note that `$state.raw(...)` will _not_ create a state proxy.
+
+### transition_slide_display
+
+```
+The `slide` transition does not work correctly for elements with `display: %value%`
+```
+
+The [slide](/docs/svelte/svelte-transition#slide) transition works by animating the `height` of the element, which requires a `display` style like `block`, `flex` or `grid`. It does not work for:
+
+- `display: inline` (which is the default for elements like `<span>`), and its variants like `inline-block`, `inline-flex` and `inline-grid`
+- `display: table` and `table-[name]`, which are the defaults for elements like `<table>` and `<tr>`
+- `display: contents`
diff --git a/packages/svelte/messages/client-warnings/warnings.md b/packages/svelte/messages/client-warnings/warnings.md
index 21db506dc9..943cf6f01f 100644
--- a/packages/svelte/messages/client-warnings/warnings.md
+++ b/packages/svelte/messages/client-warnings/warnings.md
@@ -186,3 +186,13 @@ To fix it, either create callback props to communicate changes, or mark `person`
 ```
 
 To resolve this, ensure you're comparing values where both values were created with `$state(...)`, or neither were. Note that `$state.raw(...)` will _not_ create a state proxy.
+
+## transition_slide_display
+
+> The `slide` transition does not work correctly for elements with `display: %value%`
+
+The [slide](/docs/svelte/svelte-transition#slide) transition works by animating the `height` of the element, which requires a `display` style like `block`, `flex` or `grid`. It does not work for:
+
+- `display: inline` (which is the default for elements like `<span>`), and its variants like `inline-block`, `inline-flex` and `inline-grid`
+- `display: table` and `table-[name]`, which are the defaults for elements like `<table>` and `<tr>`
+- `display: contents`
diff --git a/packages/svelte/src/internal/client/warnings.js b/packages/svelte/src/internal/client/warnings.js
index 24d86e2e0b..78d457f48f 100644
--- a/packages/svelte/src/internal/client/warnings.js
+++ b/packages/svelte/src/internal/client/warnings.js
@@ -165,4 +165,16 @@ export function state_proxy_equality_mismatch(operator) {
 	} else {
 		console.warn(`https://svelte.dev/e/state_proxy_equality_mismatch`);
 	}
+}
+
+/**
+ * The `slide` transition does not work correctly for elements with `display: %value%`
+ * @param {string} value
+ */
+export function transition_slide_display(value) {
+	if (DEV) {
+		console.warn(`%c[svelte] transition_slide_display\n%cThe \`slide\` transition does not work correctly for elements with \`display: ${value}\`\nhttps://svelte.dev/e/transition_slide_display`, bold, normal);
+	} else {
+		console.warn(`https://svelte.dev/e/transition_slide_display`);
+	}
 }
\ No newline at end of file
diff --git a/packages/svelte/src/transition/index.js b/packages/svelte/src/transition/index.js
index aacc6b6cf3..898a929eb1 100644
--- a/packages/svelte/src/transition/index.js
+++ b/packages/svelte/src/transition/index.js
@@ -1,4 +1,8 @@
 /** @import { BlurParams, CrossfadeParams, DrawParams, FadeParams, FlyParams, ScaleParams, SlideParams, TransitionConfig } from './public' */
+
+import { DEV } from 'esm-env';
+import * as w from '../internal/client/warnings.js';
+
 /** @param {number} x */
 const linear = (x) => x;
 
@@ -92,6 +96,8 @@ export function fly(
 	};
 }
 
+var slide_warning = false;
+
 /**
  * Slides an element in and out.
  *
@@ -101,6 +107,13 @@ export function fly(
  */
 export function slide(node, { delay = 0, duration = 400, easing = cubic_out, axis = 'y' } = {}) {
 	const style = getComputedStyle(node);
+
+	if (DEV && !slide_warning && /(contents|inline|table)/.test(style.display)) {
+		slide_warning = true;
+		Promise.resolve().then(() => (slide_warning = false));
+		w.transition_slide_display(style.display);
+	}
+
 	const opacity = +style.opacity;
 	const primary_property = axis === 'y' ? 'height' : 'width';
 	const primary_property_value = parseFloat(style[primary_property]);

From 9b71eea35d8e62e7ef008565bf23fe25c4f47ed9 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 8 Jan 2025 09:57:21 +0000
Subject: [PATCH 400/404] Version Packages (#14943)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/clean-planets-rush.md   |  5 -----
 .changeset/cool-apples-report.md   |  5 -----
 .changeset/gold-olives-care.md     |  5 -----
 .changeset/modern-wasps-punch.md   |  5 -----
 .changeset/silver-humans-yawn.md   |  5 -----
 .changeset/tame-students-retire.md |  5 -----
 packages/svelte/CHANGELOG.md       | 18 ++++++++++++++++++
 packages/svelte/package.json       |  2 +-
 packages/svelte/src/version.js     |  2 +-
 9 files changed, 20 insertions(+), 32 deletions(-)
 delete mode 100644 .changeset/clean-planets-rush.md
 delete mode 100644 .changeset/cool-apples-report.md
 delete mode 100644 .changeset/gold-olives-care.md
 delete mode 100644 .changeset/modern-wasps-punch.md
 delete mode 100644 .changeset/silver-humans-yawn.md
 delete mode 100644 .changeset/tame-students-retire.md

diff --git a/.changeset/clean-planets-rush.md b/.changeset/clean-planets-rush.md
deleted file mode 100644
index d8500d4315..0000000000
--- a/.changeset/clean-planets-rush.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: handle default values in object destructuring within "each" blocks when using characters like "}" and "]"
diff --git a/.changeset/cool-apples-report.md b/.changeset/cool-apples-report.md
deleted file mode 100644
index fa76c036d1..0000000000
--- a/.changeset/cool-apples-report.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': minor
----
-
-feat: allow non-numeric values to be tweened by snapping immediately to new value
diff --git a/.changeset/gold-olives-care.md b/.changeset/gold-olives-care.md
deleted file mode 100644
index 9f7357c6da..0000000000
--- a/.changeset/gold-olives-care.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: account for min-width/height in `slide` transition
diff --git a/.changeset/modern-wasps-punch.md b/.changeset/modern-wasps-punch.md
deleted file mode 100644
index 1fa0b41300..0000000000
--- a/.changeset/modern-wasps-punch.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: prevent long delays causing erratic spring behaviour
diff --git a/.changeset/silver-humans-yawn.md b/.changeset/silver-humans-yawn.md
deleted file mode 100644
index e274341079..0000000000
--- a/.changeset/silver-humans-yawn.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-feat: warn on using `slide` transition with table elements
diff --git a/.changeset/tame-students-retire.md b/.changeset/tame-students-retire.md
deleted file mode 100644
index 121c3690d0..0000000000
--- a/.changeset/tame-students-retire.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: improve signal performance by reducing duplicate deps
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index 4a2cca8280..daf8ed209a 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,23 @@
 # svelte
 
+## 5.17.0
+
+### Minor Changes
+
+- feat: allow non-numeric values to be tweened by snapping immediately to new value ([#14941](https://github.com/sveltejs/svelte/pull/14941))
+
+### Patch Changes
+
+- fix: handle default values in object destructuring within "each" blocks when using characters like "}" and "]" ([#14554](https://github.com/sveltejs/svelte/pull/14554))
+
+- fix: account for min-width/height in `slide` transition ([#14942](https://github.com/sveltejs/svelte/pull/14942))
+
+- fix: prevent long delays causing erratic spring behaviour ([#14940](https://github.com/sveltejs/svelte/pull/14940))
+
+- feat: warn on using `slide` transition with table elements ([#14936](https://github.com/sveltejs/svelte/pull/14936))
+
+- chore: improve signal performance by reducing duplicate deps ([#14945](https://github.com/sveltejs/svelte/pull/14945))
+
 ## 5.16.6
 
 ### Patch Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 26907c2a5b..5cd078bf77 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.16.6",
+  "version": "5.17.0",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index c7ad6fcf63..396c2b07ef 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.16.6';
+export const VERSION = '5.17.0';
 export const PUBLIC_VERSION = '5';

From ce4f9722dab8d99140d410a9d1f71ec19d16535e Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 8 Jan 2025 09:54:29 -0500
Subject: [PATCH 401/404] fix: remove bindable prop validation (#14946)

---
 .changeset/flat-otters-cheer.md               |  5 ++++
 .../3-transform/client/transform-client.js    | 22 ----------------
 packages/svelte/src/internal/client/index.js  |  2 +-
 .../src/internal/client/reactivity/props.js   |  6 +++--
 .../svelte/src/internal/client/validate.js    | 25 +------------------
 .../samples/export-binding/_config.js         | 10 --------
 .../export-binding/counter/index.svelte       |  8 ------
 .../samples/export-binding/main.svelte        |  7 ------
 .../props-not-bindable-spread/Counter.svelte  |  5 ----
 .../props-not-bindable-spread/_config.js      | 13 ----------
 .../props-not-bindable-spread/main.svelte     |  7 ------
 .../samples/props-not-bindable/Counter.svelte |  5 ----
 .../samples/props-not-bindable/_config.js     | 13 ----------
 .../samples/props-not-bindable/main.svelte    |  7 ------
 14 files changed, 11 insertions(+), 124 deletions(-)
 create mode 100644 .changeset/flat-otters-cheer.md
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/export-binding/_config.js
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/export-binding/counter/index.svelte
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/export-binding/main.svelte
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/Counter.svelte
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/_config.js
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/main.svelte
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable/Counter.svelte
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable/_config.js
 delete mode 100644 packages/svelte/tests/runtime-runes/samples/props-not-bindable/main.svelte

diff --git a/.changeset/flat-otters-cheer.md b/.changeset/flat-otters-cheer.md
new file mode 100644
index 0000000000..3f84de8242
--- /dev/null
+++ b/.changeset/flat-otters-cheer.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: remove bindable prop validation
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 90901d29ce..a969117ed3 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
@@ -299,28 +299,6 @@ export function client_component(analysis, options) {
 			(binding.kind === 'prop' || binding.kind === 'bindable_prop') && !name.startsWith('$$')
 	);
 
-	if (dev && analysis.runes) {
-		const exports = analysis.exports.map(({ name, alias }) => b.literal(alias ?? name));
-		/** @type {ESTree.Literal[]} */
-		const bindable = [];
-		for (const [name, binding] of properties) {
-			if (binding.kind === 'bindable_prop') {
-				bindable.push(b.literal(binding.prop_alias ?? name));
-			}
-		}
-		instance.body.unshift(
-			b.stmt(
-				b.call(
-					'$.validate_prop_bindings',
-					b.id('$$props'),
-					b.array(bindable),
-					b.array(exports),
-					b.id(`${analysis.name}`)
-				)
-			)
-		);
-	}
-
 	if (analysis.accessors) {
 		for (const [name, binding] of properties) {
 			const key = binding.prop_alias ?? name;
diff --git a/packages/svelte/src/internal/client/index.js b/packages/svelte/src/internal/client/index.js
index 3b85ae1816..2bf58c51f7 100644
--- a/packages/svelte/src/internal/client/index.js
+++ b/packages/svelte/src/internal/client/index.js
@@ -150,7 +150,7 @@ export {
 	setContext,
 	hasContext
 } from './runtime.js';
-export { validate_binding, validate_each_keys, validate_prop_bindings } from './validate.js';
+export { validate_binding, validate_each_keys } from './validate.js';
 export { raf } from './timing.js';
 export { proxy } from './proxy.js';
 export { create_custom_element } from './dom/elements/custom-element.js';
diff --git a/packages/svelte/src/internal/client/reactivity/props.js b/packages/svelte/src/internal/client/reactivity/props.js
index 8fb13f7e2c..3e5a0258c7 100644
--- a/packages/svelte/src/internal/client/reactivity/props.js
+++ b/packages/svelte/src/internal/client/reactivity/props.js
@@ -297,8 +297,10 @@ export function prop(props, key, flags, fallback) {
 	var is_entry_props = STATE_SYMBOL in props || LEGACY_PROPS in props;
 
 	var setter =
-		get_descriptor(props, key)?.set ??
-		(is_entry_props && bindable && key in props ? (v) => (props[key] = v) : undefined);
+		(bindable &&
+			(get_descriptor(props, key)?.set ??
+				(is_entry_props && key in props && ((v) => (props[key] = v))))) ||
+		undefined;
 
 	var fallback_value = /** @type {V} */ (fallback);
 	var fallback_dirty = true;
diff --git a/packages/svelte/src/internal/client/validate.js b/packages/svelte/src/internal/client/validate.js
index 417c145eb2..24e280edf8 100644
--- a/packages/svelte/src/internal/client/validate.js
+++ b/packages/svelte/src/internal/client/validate.js
@@ -1,5 +1,5 @@
 import { dev_current_component_function } from './runtime.js';
-import { get_descriptor, is_array } from '../shared/utils.js';
+import { is_array } from '../shared/utils.js';
 import * as e from './errors.js';
 import { FILENAME } from '../../constants.js';
 import { render_effect } from './reactivity/effects.js';
@@ -38,29 +38,6 @@ export function validate_each_keys(collection, key_fn) {
 	});
 }
 
-/**
- * @param {Record<string, any>} $$props
- * @param {string[]} bindable
- * @param {string[]} exports
- * @param {Function & { [FILENAME]: string }} component
- */
-export function validate_prop_bindings($$props, bindable, exports, component) {
-	for (const key in $$props) {
-		var setter = get_descriptor($$props, key)?.set;
-		var name = component.name;
-
-		if (setter) {
-			if (exports.includes(key) && !bindable.includes(key)) {
-				e.bind_invalid_export(component[FILENAME], key, name);
-			}
-
-			if (!bindable.includes(key)) {
-				e.bind_not_bindable(key, component[FILENAME], name);
-			}
-		}
-	}
-}
-
 /**
  * @param {string} binding
  * @param {() => Record<string, any>} get_object
diff --git a/packages/svelte/tests/runtime-runes/samples/export-binding/_config.js b/packages/svelte/tests/runtime-runes/samples/export-binding/_config.js
deleted file mode 100644
index d3b9c8e4eb..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/export-binding/_config.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	compileOptions: {
-		dev: true // to ensure we we catch the error
-	},
-	error:
-		'bind_invalid_export\n' +
-		'Component counter/index.svelte has an export named `increment` that a consumer component is trying to access using `bind:increment`, which is disallowed. Instead, use `bind:this` (e.g. `<Counter bind:this={component} />`) and then access the property on the bound component instance (e.g. `component.increment`)'
-});
diff --git a/packages/svelte/tests/runtime-runes/samples/export-binding/counter/index.svelte b/packages/svelte/tests/runtime-runes/samples/export-binding/counter/index.svelte
deleted file mode 100644
index 14e0de961b..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/export-binding/counter/index.svelte
+++ /dev/null
@@ -1,8 +0,0 @@
-<script>
-	let count = $state(0);
-	export function increment() {
-		count++;
-	}
-</script>
-
-{count}
diff --git a/packages/svelte/tests/runtime-runes/samples/export-binding/main.svelte b/packages/svelte/tests/runtime-runes/samples/export-binding/main.svelte
deleted file mode 100644
index 4ad1684701..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/export-binding/main.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-    import Counter from './counter/index.svelte';
-    let increment;
-</script>
-
-<Counter bind:increment={increment} />
-<button onclick={increment}>increment</button>
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/Counter.svelte b/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/Counter.svelte
deleted file mode 100644
index f22fd6e976..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/Counter.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let { ...rest } = $props();
-</script>
-
-{rest.count}
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/_config.js b/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/_config.js
deleted file mode 100644
index fa0994c370..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/_config.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	compileOptions: {
-		dev: true
-	},
-
-	html: '0',
-
-	error:
-		'bind_not_bindable\n' +
-		'A component is attempting to bind to a non-bindable property `count` belonging to Counter.svelte (i.e. `<Counter bind:count={...}>`). To mark a property as bindable: `let { count = $bindable() } = $props()`'
-});
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/main.svelte
deleted file mode 100644
index 80242b75c6..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable-spread/main.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-    import Counter from './Counter.svelte';
-
-    let count = $state(0);
-</script>
-
-<Counter bind:count />
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/Counter.svelte b/packages/svelte/tests/runtime-runes/samples/props-not-bindable/Counter.svelte
deleted file mode 100644
index 4bc2db3968..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/Counter.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-<script>
-	let { count } = $props();
-</script>
-
-{count}
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/_config.js b/packages/svelte/tests/runtime-runes/samples/props-not-bindable/_config.js
deleted file mode 100644
index fa0994c370..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/_config.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	compileOptions: {
-		dev: true
-	},
-
-	html: '0',
-
-	error:
-		'bind_not_bindable\n' +
-		'A component is attempting to bind to a non-bindable property `count` belonging to Counter.svelte (i.e. `<Counter bind:count={...}>`). To mark a property as bindable: `let { count = $bindable() } = $props()`'
-});
diff --git a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/main.svelte b/packages/svelte/tests/runtime-runes/samples/props-not-bindable/main.svelte
deleted file mode 100644
index 80242b75c6..0000000000
--- a/packages/svelte/tests/runtime-runes/samples/props-not-bindable/main.svelte
+++ /dev/null
@@ -1,7 +0,0 @@
-<script>
-    import Counter from './Counter.svelte';
-
-    let count = $state(0);
-</script>
-
-<Counter bind:count />

From a2565efa37dfbba2e462eb5cdbb6c47424ce98ad Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 8 Jan 2025 19:37:26 +0100
Subject: [PATCH 402/404] docs: tweak "invalid assignment" compiler error
 message (#14955)

* docs: tweak "invalid assignment" compiler error message

fixes #14702

* tweak wording

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>
---
 .changeset/sharp-dryers-try.md                |  5 +++
 .../98-reference/.generated/compile-errors.md | 34 ++++++++++++++++++-
 .../svelte/messages/compile-errors/script.md  | 34 ++++++++++++++++++-
 packages/svelte/src/compiler/errors.js        |  4 +--
 .../_config.js                                |  2 +-
 .../runes-invalid-each-binding/_config.js     |  2 +-
 .../runes-invalid-each-mutation/_config.js    |  2 +-
 7 files changed, 76 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/sharp-dryers-try.md

diff --git a/.changeset/sharp-dryers-try.md b/.changeset/sharp-dryers-try.md
new file mode 100644
index 0000000000..dcdbd99d02
--- /dev/null
+++ b/.changeset/sharp-dryers-try.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+chore: tweak "invalid assignment" compiler error message
diff --git a/documentation/docs/98-reference/.generated/compile-errors.md b/documentation/docs/98-reference/.generated/compile-errors.md
index c498920007..a867cfe88c 100644
--- a/documentation/docs/98-reference/.generated/compile-errors.md
+++ b/documentation/docs/98-reference/.generated/compile-errors.md
@@ -331,7 +331,39 @@ The $ prefix is reserved, and cannot be used for variables and imports
 ### 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`)
+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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)
+```
+
+In legacy mode, it was possible to reassign or bind to the each block argument itself:
+
+```svelte
+<script>
+	let array = [1, 2, 3];
+</script>
+
+{#each array as entry}
+	<!-- reassignment -->
+	<button on:click={() => entry = 4}>change</button>
+
+	<!-- binding -->
+	<input bind:value={entry}>
+{/each}
+```
+
+This turned out to be buggy and unpredictable, particularly when working with derived values (such as `array.map(...)`), and as such is forbidden in runes mode. You can achieve the same outcome by using the index instead:
+
+```svelte
+<script>
+	let array = $state([1, 2, 3]);
+</script>
+
+{#each array as entry, i}
+	<!-- reassignment -->
+	<button onclick={() => array[i] = 4}>change</button>
+
+	<!-- binding -->
+	<input bind:value={array[i]}>
+{/each}
 ```
 
 ### effect_invalid_placement
diff --git a/packages/svelte/messages/compile-errors/script.md b/packages/svelte/messages/compile-errors/script.md
index fa851cec89..0aa6fbed90 100644
--- a/packages/svelte/messages/compile-errors/script.md
+++ b/packages/svelte/messages/compile-errors/script.md
@@ -32,7 +32,39 @@
 
 ## 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`)
+> 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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)
+
+In legacy mode, it was possible to reassign or bind to the each block argument itself:
+
+```svelte
+<script>
+	let array = [1, 2, 3];
+</script>
+
+{#each array as entry}
+	<!-- reassignment -->
+	<button on:click={() => entry = 4}>change</button>
+
+	<!-- binding -->
+	<input bind:value={entry}>
+{/each}
+```
+
+This turned out to be buggy and unpredictable, particularly when working with derived values (such as `array.map(...)`), and as such is forbidden in runes mode. You can achieve the same outcome by using the index instead:
+
+```svelte
+<script>
+	let array = $state([1, 2, 3]);
+</script>
+
+{#each array as entry, i}
+	<!-- reassignment -->
+	<button onclick={() => array[i] = 4}>change</button>
+
+	<!-- binding -->
+	<input bind:value={array[i]}>
+{/each}
+```
 
 ## effect_invalid_placement
 
diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js
index 870cd9ac09..a997eeef8d 100644
--- a/packages/svelte/src/compiler/errors.js
+++ b/packages/svelte/src/compiler/errors.js
@@ -151,12 +151,12 @@ export function dollar_prefix_invalid(node) {
 }
 
 /**
- * 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`)
+ * 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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)
  * @param {null | number | NodeLike} 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\`)\nhttps://svelte.dev/e/each_item_invalid_assignment`);
+	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\`, or \`bind:value={array[i]}\` instead of \`bind:value={entry}\`)\nhttps://svelte.dev/e/each_item_invalid_assignment`);
 }
 
 /**
diff --git a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding-this/_config.js b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding-this/_config.js
index 524c2f161c..ed02e0960d 100644
--- a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding-this/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding-this/_config.js
@@ -4,6 +4,6 @@ export default test({
 	error: {
 		code: 'each_item_invalid_assignment',
 		message:
-			'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`)'
+			'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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)'
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding/_config.js b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding/_config.js
index 524c2f161c..ed02e0960d 100644
--- a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-binding/_config.js
@@ -4,6 +4,6 @@ export default test({
 	error: {
 		code: 'each_item_invalid_assignment',
 		message:
-			'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`)'
+			'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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)'
 	}
 });
diff --git a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-mutation/_config.js b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-mutation/_config.js
index 524c2f161c..ed02e0960d 100644
--- a/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-mutation/_config.js
+++ b/packages/svelte/tests/compiler-errors/samples/runes-invalid-each-mutation/_config.js
@@ -4,6 +4,6 @@ export default test({
 	error: {
 		code: 'each_item_invalid_assignment',
 		message:
-			'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`)'
+			'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`, or `bind:value={array[i]}` instead of `bind:value={entry}`)'
 	}
 });

From 9aae463ae1be27a75e876a7a6f6bcfe5b023c19f Mon Sep 17 00:00:00 2001
From: Simon H <5968653+dummdidumm@users.noreply.github.com>
Date: Wed, 8 Jan 2025 20:03:04 +0100
Subject: [PATCH 403/404] fix: silence false-positive statel value warning
 (#14958)

fixes #14687
---
 .changeset/tough-guests-sniff.md              |  5 ++++
 .../client/visitors/AssignmentExpression.js   |  1 +
 .../_config.js                                | 24 ++++++++++++++-----
 .../main.svelte                               |  4 +++-
 4 files changed, 27 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/tough-guests-sniff.md

diff --git a/.changeset/tough-guests-sniff.md b/.changeset/tough-guests-sniff.md
new file mode 100644
index 0000000000..fcb7b67c1a
--- /dev/null
+++ b/.changeset/tough-guests-sniff.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: silence false-positive stale value warning
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 3d8b9aaa96..0c70f7e00c 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
@@ -171,6 +171,7 @@ function build_assignment(operator, left, right, context) {
 
 	// special case — ignore `bind:prop={getter, (v) => (...)}` / `bind:value={x.y}`
 	if (
+		path.at(-1) === 'BindDirective' ||
 		path.at(-1) === 'Component' ||
 		path.at(-1) === 'SvelteComponent' ||
 		(path.at(-1) === 'ArrowFunctionExpression' &&
diff --git a/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
index ad7bdc654a..f029227472 100644
--- a/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
+++ b/packages/svelte/tests/runtime-runes/samples/proxy-coercive-assignment-warning/_config.js
@@ -1,21 +1,33 @@
 import { flushSync } from 'svelte';
-import { test } from '../../test';
+import { ok, test } from '../../test';
 
 export default test({
 	compileOptions: {
 		dev: true
 	},
 
-	html: `<button>items: null</button> <div>x</div>`,
+	html: `<button>items: null</button> <div>x</div> <input type="checkbox" value="1"><input type="checkbox" value="2">`,
 
 	test({ assert, target, warnings }) {
 		const btn = target.querySelector('button');
+		ok(btn);
 
-		flushSync(() => btn?.click());
-		assert.htmlEqual(target.innerHTML, `<button>items: []</button> <div>x</div>`);
+		flushSync(() => btn.click());
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>items: []</button> <div>x</div> <input type="checkbox" value="1"><input type="checkbox" value="2">`
+		);
 
-		flushSync(() => btn?.click());
-		assert.htmlEqual(target.innerHTML, `<button>items: [0]</button> <div>x</div>`);
+		flushSync(() => btn.click());
+		assert.htmlEqual(
+			target.innerHTML,
+			`<button>items: [0]</button> <div>x</div> <input type="checkbox" value="1"><input type="checkbox" value="2">`
+		);
+
+		const input = target.querySelector('input');
+		ok(input);
+		input.checked = true;
+		flushSync(() => input.dispatchEvent(new Event('change', { bubbles: true })));
 
 		assert.deepEqual(warnings, [
 			'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
index 40592e08b8..ad94c4e56e 100644
--- 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
@@ -2,7 +2,7 @@
 	import Test from './Test.svelte';
 
 	let entries = $state([]);
-	let object = $state({ items: null });
+	let object = $state({ items: null, group: [] });
 </script>
 
 <button onclick={() => (object.items ??= []).push(object.items.length)}>
@@ -11,6 +11,8 @@
 
 <!-- these should not emit warnings -->
 <div bind:this={entries[0]}>x</div>
+<input type="checkbox" value=1 bind:group={object.group}>
+<input type="checkbox" value=2 bind:group={object.group}>
 <Test bind:this={entries[1]}></Test>
 <Test bind:this={() => entries[2], (v) => (entries[2] = v)}></Test>
 <Test bind:x={entries[3]}></Test>

From 80d9f9996f4aec24e6ab4542225a5dffa297b5c7 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 8 Jan 2025 14:12:06 -0500
Subject: [PATCH 404/404] Version Packages (#14953)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
---
 .changeset/flat-otters-cheer.md  |  5 -----
 .changeset/sharp-dryers-try.md   |  5 -----
 .changeset/tough-guests-sniff.md |  5 -----
 packages/svelte/CHANGELOG.md     | 10 ++++++++++
 packages/svelte/package.json     |  2 +-
 packages/svelte/src/version.js   |  2 +-
 6 files changed, 12 insertions(+), 17 deletions(-)
 delete mode 100644 .changeset/flat-otters-cheer.md
 delete mode 100644 .changeset/sharp-dryers-try.md
 delete mode 100644 .changeset/tough-guests-sniff.md

diff --git a/.changeset/flat-otters-cheer.md b/.changeset/flat-otters-cheer.md
deleted file mode 100644
index 3f84de8242..0000000000
--- a/.changeset/flat-otters-cheer.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: remove bindable prop validation
diff --git a/.changeset/sharp-dryers-try.md b/.changeset/sharp-dryers-try.md
deleted file mode 100644
index dcdbd99d02..0000000000
--- a/.changeset/sharp-dryers-try.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-chore: tweak "invalid assignment" compiler error message
diff --git a/.changeset/tough-guests-sniff.md b/.changeset/tough-guests-sniff.md
deleted file mode 100644
index fcb7b67c1a..0000000000
--- a/.changeset/tough-guests-sniff.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'svelte': patch
----
-
-fix: silence false-positive stale value warning
diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md
index daf8ed209a..72fa09bf96 100644
--- a/packages/svelte/CHANGELOG.md
+++ b/packages/svelte/CHANGELOG.md
@@ -1,5 +1,15 @@
 # svelte
 
+## 5.17.1
+
+### Patch Changes
+
+- fix: remove bindable prop validation ([#14946](https://github.com/sveltejs/svelte/pull/14946))
+
+- chore: tweak "invalid assignment" compiler error message ([#14955](https://github.com/sveltejs/svelte/pull/14955))
+
+- fix: silence false-positive stale value warning ([#14958](https://github.com/sveltejs/svelte/pull/14958))
+
 ## 5.17.0
 
 ### Minor Changes
diff --git a/packages/svelte/package.json b/packages/svelte/package.json
index 5cd078bf77..ce6e4ffc42 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.17.0",
+  "version": "5.17.1",
   "type": "module",
   "types": "./types/index.d.ts",
   "engines": {
diff --git a/packages/svelte/src/version.js b/packages/svelte/src/version.js
index 396c2b07ef..bb772687fb 100644
--- a/packages/svelte/src/version.js
+++ b/packages/svelte/src/version.js
@@ -4,5 +4,5 @@
  * The current version, as set in package.json.
  * @type {string}
  */
-export const VERSION = '5.17.0';
+export const VERSION = '5.17.1';
 export const PUBLIC_VERSION = '5';