From 1e9771bd2484c812c7c68b3585927563e5f433c9 Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Thu, 3 Oct 2024 18:33:51 +0200
Subject: [PATCH 01/18] chore: update `demo` template to svelte-5

---
 .../templates/demo/src/routes/+layout.svelte  |  5 ++-
 .../templates/demo/src/routes/Counter.svelte  | 13 ++++---
 .../demo/src/routes/sverdle/+page.svelte      | 38 +++++++++++--------
 3 files changed, 35 insertions(+), 21 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/+layout.svelte b/packages/create/templates/demo/src/routes/+layout.svelte
index ccc5c9f1f..7b1b1419e 100644
--- a/packages/create/templates/demo/src/routes/+layout.svelte
+++ b/packages/create/templates/demo/src/routes/+layout.svelte
@@ -1,13 +1,16 @@
 <script>
 	import Header from './Header.svelte';
 	import '../app.css';
+
+	/** @type {{children?: import('svelte').Snippet}} */
+	let { children } = $props();
 </script>
 
 <div class="app">
 	<Header />
 
 	<main>
-		<slot />
+		{@render children?.()}
 	</main>
 
 	<footer>
diff --git a/packages/create/templates/demo/src/routes/Counter.svelte b/packages/create/templates/demo/src/routes/Counter.svelte
index e40221d44..304263346 100644
--- a/packages/create/templates/demo/src/routes/Counter.svelte
+++ b/packages/create/templates/demo/src/routes/Counter.svelte
@@ -1,11 +1,14 @@
 <script lang="ts">
 	import { spring } from 'svelte/motion';
 
-	let count = 0;
+	let count = $state(0);
 
 	const displayed_count = spring();
-	$: displayed_count.set(count);
-	$: offset = modulo($displayed_count, 1);
+
+	$effect(() => {
+		displayed_count.set(count);
+	});
+	let offset = $derived(modulo($displayed_count, 1));
 
 	/**
 	 * @param {number} n
@@ -18,7 +21,7 @@
 </script>
 
 <div class="counter">
-	<button on:click={() => (count -= 1)} aria-label="Decrease the counter by one">
+	<button onclick={() => (count -= 1)} aria-label="Decrease the counter by one">
 		<svg aria-hidden="true" viewBox="0 0 1 1">
 			<path d="M0,0.5 L1,0.5" />
 		</svg>
@@ -31,7 +34,7 @@
 		</div>
 	</div>
 
-	<button on:click={() => (count += 1)} aria-label="Increase the counter by one">
+	<button onclick={() => (count += 1)} aria-label="Increase the counter by one">
 		<svg aria-hidden="true" viewBox="0 0 1 1">
 			<path d="M0,0.5 L1,0.5 M0.5,0 L0.5,1" />
 		</svg>
diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 42d987106..ef057a831 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -1,42 +1,49 @@
 <script lang="ts">
+	import { run } from 'svelte/legacy';
 	import { confetti } from '@neoconfetti/svelte';
 	import { enhance } from '$app/forms';
 	import type { PageData, ActionData } from './$types';
 	import { reduced_motion } from './reduced-motion';
 
-	/** @type {import('./$types').PageData} */
-	export let data: PageData;
+	interface Props {
+		/** @type {import('./$types').PageData} */
+		data: PageData;
+		/** @type {import('./$types').ActionData} */
+		form: ActionData;
+	}
 
-	/** @type {import('./$types').ActionData} */
-	export let form: ActionData;
+	let { data, form = $bindable() }: Props = $props();
 
 	/** Whether or not the user has won */
-	$: won = data.answers.at(-1) === 'xxxxx';
+	let won = $derived(data.answers.at(-1) === 'xxxxx');
 
 	/** The index of the current guess */
-	$: i = won ? -1 : data.answers.length;
+	let i = $derived(won ? -1 : data.answers.length);
 
 	/** The current guess */
-	$: currentGuess = data.guesses[i] || '';
+	let currentGuess = $state('');
+	run(() => {
+		currentGuess = data.guesses[i] || '';
+	});
 
 	/** Whether the current guess can be submitted */
-	$: submittable = currentGuess.length === 5;
+	let submittable = $derived(currentGuess.length === 5);
 
 	/**
 	 * A map of classnames for all letters that have been guessed,
 	 * used for styling the keyboard
 	 * @type {Record<string, 'exact' | 'close' | 'missing'>}
 	 */
-	let classnames: Record<string, 'exact' | 'close' | 'missing'>;
+	let classnames: Record<string, 'exact' | 'close' | 'missing'> = $state({});
 
 	/**
 	 * A map of descriptions for all letters that have been guessed,
 	 * used for adding text for assistive technology (e.g. screen readers)
 	 * @type {Record<string, string>}
 	 */
-	let description: Record<string, string>;
+	let description: Record<string, string> = $state({});
 
-	$: {
+	run(() => {
 		classnames = {};
 		description = {};
 
@@ -55,7 +62,7 @@
 				}
 			}
 		});
-	}
+	});
 
 	/**
 	 * Modify the game state without making a trip to the server,
@@ -63,6 +70,7 @@
 	 * @param {MouseEvent} event
 	 */
 	function update(event: MouseEvent) {
+		event.preventDefault();
 		const key = /** @type {HTMLButtonElement} */ (event.target as HTMLButtonElement).getAttribute(
 			'data-key'
 		);
@@ -91,7 +99,7 @@
 	}
 </script>
 
-<svelte:window on:keydown={keydown} />
+<svelte:window onkeydown={keydown} />
 
 <svelte:head>
 	<title>Sverdle</title>
@@ -158,7 +166,7 @@
 				<button data-key="enter" class:selected={submittable} disabled={!submittable}>enter</button>
 
 				<button
-					on:click|preventDefault={update}
+					onclick={update}
 					data-key="backspace"
 					formaction="?/update"
 					name="key"
@@ -171,7 +179,7 @@
 					<div class="row">
 						{#each row as letter}
 							<button
-								on:click|preventDefault={update}
+								onclick={update}
 								data-key={letter}
 								class={classnames[letter]}
 								disabled={submittable}

From 314e82c9c8fa80bea15c83185f01a9eedc23b82a Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:10:03 +0200
Subject: [PATCH 02/18] chore: fix sverdle route

---
 .../demo/src/routes/sverdle/+page.svelte      | 43 ++++++++-----------
 1 file changed, 17 insertions(+), 26 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index ef057a831..0abd6534b 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -1,14 +1,12 @@
 <script lang="ts">
-	import { run } from 'svelte/legacy';
-	import { confetti } from '@neoconfetti/svelte';
 	import { enhance } from '$app/forms';
-	import type { PageData, ActionData } from './$types';
+	import { confetti } from '@neoconfetti/svelte';
+	import type { ActionData, PageData } from './$types';
 	import { reduced_motion } from './reduced-motion';
+	import { untrack } from 'svelte';
 
 	interface Props {
-		/** @type {import('./$types').PageData} */
 		data: PageData;
-		/** @type {import('./$types').ActionData} */
 		form: ActionData;
 	}
 
@@ -22,7 +20,7 @@
 
 	/** The current guess */
 	let currentGuess = $state('');
-	run(() => {
+	$effect(() => {
 		currentGuess = data.guesses[i] || '';
 	});
 
@@ -32,48 +30,42 @@
 	/**
 	 * A map of classnames for all letters that have been guessed,
 	 * used for styling the keyboard
-	 * @type {Record<string, 'exact' | 'close' | 'missing'>}
 	 */
 	let classnames: Record<string, 'exact' | 'close' | 'missing'> = $state({});
 
 	/**
 	 * A map of descriptions for all letters that have been guessed,
 	 * used for adding text for assistive technology (e.g. screen readers)
-	 * @type {Record<string, string>}
 	 */
 	let description: Record<string, string> = $state({});
 
-	run(() => {
+	$effect(() => {
 		classnames = {};
 		description = {};
-
 		data.answers.forEach((answer, i) => {
 			const guess = data.guesses[i];
-
-			for (let i = 0; i < 5; i += 1) {
-				const letter = guess[i];
-
-				if (answer[i] === 'x') {
-					classnames[letter] = 'exact';
-					description[letter] = 'correct';
-				} else if (!classnames[letter]) {
-					classnames[letter] = answer[i] === 'c' ? 'close' : 'missing';
-					description[letter] = answer[i] === 'c' ? 'present' : 'absent';
+			untrack(() => {
+				for (let i = 0; i < 5; i += 1) {
+					const letter = guess[i];
+					if (answer[i] === 'x') {
+						classnames[letter] = 'exact';
+						description[letter] = 'correct';
+					} else if (!classnames[letter]) {
+						classnames[letter] = answer[i] === 'c' ? 'close' : 'missing';
+						description[letter] = answer[i] === 'c' ? 'present' : 'absent';
+					}
 				}
-			}
+			});
 		});
 	});
 
 	/**
 	 * Modify the game state without making a trip to the server,
 	 * if client-side JavaScript is enabled
-	 * @param {MouseEvent} event
 	 */
 	function update(event: MouseEvent) {
 		event.preventDefault();
-		const key = /** @type {HTMLButtonElement} */ (event.target as HTMLButtonElement).getAttribute(
-			'data-key'
-		);
+		const key = (event.target as HTMLButtonElement).getAttribute('data-key');
 
 		if (key === 'backspace') {
 			currentGuess = currentGuess.slice(0, -1);
@@ -86,7 +78,6 @@
 	/**
 	 * Trigger form logic in response to a keydown event, so that
 	 * desktop users can use the keyboard to play the game
-	 * @param {KeyboardEvent} event
 	 */
 	function keydown(event: KeyboardEvent) {
 		if (event.metaKey) return;

From cfa48fa7b22576fcda606989b17cb94879c1cf41 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:10:12 +0200
Subject: [PATCH 03/18] chore: prevent flash of NaN

---
 packages/create/templates/demo/src/routes/Counter.svelte | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/create/templates/demo/src/routes/Counter.svelte b/packages/create/templates/demo/src/routes/Counter.svelte
index 304263346..b18a0bf86 100644
--- a/packages/create/templates/demo/src/routes/Counter.svelte
+++ b/packages/create/templates/demo/src/routes/Counter.svelte
@@ -3,7 +3,8 @@
 
 	let count = $state(0);
 
-	const displayed_count = spring();
+	// svelte-ignore state_referenced_locally
+	const displayed_count = spring(count);
 
 	$effect(() => {
 		displayed_count.set(count);

From 246d2fabce02f2a678880c46311721f1a5ebef1b Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:16:06 +0200
Subject: [PATCH 04/18] fix: properly ssr sverdle component

---
 .../demo/src/routes/sverdle/+page.svelte          | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 0abd6534b..bb565605c 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -4,6 +4,7 @@
 	import type { ActionData, PageData } from './$types';
 	import { reduced_motion } from './reduced-motion';
 	import { untrack } from 'svelte';
+	import { browser } from '$app/environment';
 
 	interface Props {
 		data: PageData;
@@ -19,7 +20,9 @@
 	let i = $derived(won ? -1 : data.answers.length);
 
 	/** The current guess */
-	let currentGuess = $state('');
+	// svelte-ignore state_referenced_locally
+	let currentGuess = $state(data.guesses[i] || '');
+
 	$effect(() => {
 		currentGuess = data.guesses[i] || '';
 	});
@@ -39,7 +42,7 @@
 	 */
 	let description: Record<string, string> = $state({});
 
-	$effect(() => {
+	function setClassnamesAndDescription() {
 		classnames = {};
 		description = {};
 		data.answers.forEach((answer, i) => {
@@ -57,7 +60,13 @@
 				}
 			});
 		});
-	});
+	}
+
+	if (!browser) {
+		setClassnamesAndDescription();
+	}
+
+	$effect(setClassnamesAndDescription);
 
 	/**
 	 * Modify the game state without making a trip to the server,

From d066ca275bc228791f217c6cb1abe750b555688c Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:23:49 +0200
Subject: [PATCH 05/18] chore: reintroduce JSDoc comments

---
 .../templates/demo/src/routes/sverdle/+page.svelte     | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index bb565605c..900e1f0ac 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -7,7 +7,9 @@
 	import { browser } from '$app/environment';
 
 	interface Props {
+		/** @type {import('./$types').PageData} */
 		data: PageData;
+		/** @type {import('./$types').ActionData} */
 		form: ActionData;
 	}
 
@@ -33,12 +35,14 @@
 	/**
 	 * A map of classnames for all letters that have been guessed,
 	 * used for styling the keyboard
+	 * @type {Record<string, 'exact' | 'close' | 'missing'>}
 	 */
 	let classnames: Record<string, 'exact' | 'close' | 'missing'> = $state({});
 
 	/**
 	 * A map of descriptions for all letters that have been guessed,
 	 * used for adding text for assistive technology (e.g. screen readers)
+	 * @type {Record<string, string>}
 	 */
 	let description: Record<string, string> = $state({});
 
@@ -71,10 +75,13 @@
 	/**
 	 * Modify the game state without making a trip to the server,
 	 * if client-side JavaScript is enabled
+	 * @param {MouseEvent} event
 	 */
 	function update(event: MouseEvent) {
 		event.preventDefault();
-		const key = (event.target as HTMLButtonElement).getAttribute('data-key');
+		const key = /** @type {HTMLButtonElement} */ (event.target as HTMLButtonElement).getAttribute(
+			'data-key'
+		);
 
 		if (key === 'backspace') {
 			currentGuess = currentGuess.slice(0, -1);
@@ -87,6 +94,7 @@
 	/**
 	 * Trigger form logic in response to a keydown event, so that
 	 * desktop users can use the keyboard to play the game
+	 * @param {KeyboardEvent} event
 	 */
 	function keydown(event: KeyboardEvent) {
 		if (event.metaKey) return;

From 36caa7800f24a05b579018c7cd7fbe73572665c5 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:31:43 +0200
Subject: [PATCH 06/18] chore: fix jsdoc declaration for props

---
 .../templates/demo/src/routes/sverdle/+page.svelte     | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 900e1f0ac..05cf0560d 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -7,12 +7,18 @@
 	import { browser } from '$app/environment';
 
 	interface Props {
-		/** @type {import('./$types').PageData} */
 		data: PageData;
-		/** @type {import('./$types').ActionData} */
 		form: ActionData;
 	}
+	/**
+	 * @typedef Props
+	 * @property {import('./$types').PageData} data
+	 * @property {import('./$types').ActionData} form
+	 */
 
+	/**
+	 * @type {Props}
+	 */
 	let { data, form = $bindable() }: Props = $props();
 
 	/** Whether or not the user has won */

From 2b44ac5add85e7eb29e2d2f432983c3b3aa176e3 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 19:40:33 +0200
Subject: [PATCH 07/18] fix: use `$derived.by` for classnames and description

---
 .../demo/src/routes/sverdle/+page.svelte      | 40 +++++++------------
 1 file changed, 15 insertions(+), 25 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 05cf0560d..c666e17e3 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -4,7 +4,6 @@
 	import type { ActionData, PageData } from './$types';
 	import { reduced_motion } from './reduced-motion';
 	import { untrack } from 'svelte';
-	import { browser } from '$app/environment';
 
 	interface Props {
 		data: PageData;
@@ -38,23 +37,19 @@
 	/** Whether the current guess can be submitted */
 	let submittable = $derived(currentGuess.length === 5);
 
-	/**
-	 * A map of classnames for all letters that have been guessed,
-	 * used for styling the keyboard
-	 * @type {Record<string, 'exact' | 'close' | 'missing'>}
-	 */
-	let classnames: Record<string, 'exact' | 'close' | 'missing'> = $state({});
-
-	/**
-	 * A map of descriptions for all letters that have been guessed,
-	 * used for adding text for assistive technology (e.g. screen readers)
-	 * @type {Record<string, string>}
-	 */
-	let description: Record<string, string> = $state({});
-
-	function setClassnamesAndDescription() {
-		classnames = {};
-		description = {};
+	const { classnames, description } = $derived.by(() => {
+		/**
+		 * A map of classnames for all letters that have been guessed,
+		 * used for styling the keyboard
+		 * @type {Record<string, 'exact' | 'close' | 'missing'>}
+		 */
+		let classnames: Record<string, 'exact' | 'close' | 'missing'> = {};
+		/**
+		 * A map of descriptions for all letters that have been guessed,
+		 * used for adding text for assistive technology (e.g. screen readers)
+		 * @type {Record<string, string>}
+		 */
+		let description: Record<string, string> = {};
 		data.answers.forEach((answer, i) => {
 			const guess = data.guesses[i];
 			untrack(() => {
@@ -70,13 +65,8 @@
 				}
 			});
 		});
-	}
-
-	if (!browser) {
-		setClassnamesAndDescription();
-	}
-
-	$effect(setClassnamesAndDescription);
+		return { classnames, description };
+	});
 
 	/**
 	 * Modify the game state without making a trip to the server,

From 419057d2a5c1020891c5e4c5d153f55eb0b670a0 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 21:54:45 +0200
Subject: [PATCH 08/18] fix: remove unneeded untrack

---
 .../demo/src/routes/sverdle/+page.svelte      | 21 ++++++++-----------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index c666e17e3..c487c3445 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -3,7 +3,6 @@
 	import { confetti } from '@neoconfetti/svelte';
 	import type { ActionData, PageData } from './$types';
 	import { reduced_motion } from './reduced-motion';
-	import { untrack } from 'svelte';
 
 	interface Props {
 		data: PageData;
@@ -52,18 +51,16 @@
 		let description: Record<string, string> = {};
 		data.answers.forEach((answer, i) => {
 			const guess = data.guesses[i];
-			untrack(() => {
-				for (let i = 0; i < 5; i += 1) {
-					const letter = guess[i];
-					if (answer[i] === 'x') {
-						classnames[letter] = 'exact';
-						description[letter] = 'correct';
-					} else if (!classnames[letter]) {
-						classnames[letter] = answer[i] === 'c' ? 'close' : 'missing';
-						description[letter] = answer[i] === 'c' ? 'present' : 'absent';
-					}
+			for (let i = 0; i < 5; i += 1) {
+				const letter = guess[i];
+				if (answer[i] === 'x') {
+					classnames[letter] = 'exact';
+					description[letter] = 'correct';
+				} else if (!classnames[letter]) {
+					classnames[letter] = answer[i] === 'c' ? 'close' : 'missing';
+					description[letter] = answer[i] === 'c' ? 'present' : 'absent';
 				}
-			});
+			}
 		});
 		return { classnames, description };
 	});

From dd2705659382d29fdf7046759deff5ec2f2ef5a5 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 22:34:04 +0200
Subject: [PATCH 09/18] fix: tests

---
 .../create/templates/demo/src/routes/sverdle/+page.svelte  | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index c487c3445..02b54a522 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -9,9 +9,10 @@
 		form: ActionData;
 	}
 	/**
-	 * @typedef Props
-	 * @property {import('./$types').PageData} data
-	 * @property {import('./$types').ActionData} form
+	 * @typedef {{
+	 * 	data: import('./$types').PageData,
+	 * 	form: import('./$types').ActionData
+	 * }} Props
 	 */
 
 	/**

From 55d384588aca050c434882fa6248b75f91d6cb68 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Thu, 3 Oct 2024 22:43:25 +0200
Subject: [PATCH 10/18] chore: back to more legible JSDoc without weird non
 space character

---
 .../create/templates/demo/src/routes/sverdle/+page.svelte  | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 02b54a522..2ec81bea1 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -9,10 +9,9 @@
 		form: ActionData;
 	}
 	/**
-	 * @typedef {{
-	 * 	data: import('./$types').PageData,
-	 * 	form: import('./$types').ActionData
-	 * }} Props
+	 * @typedef {Object} Props
+	 * @property {import('./$types').PageData} data
+	 * @property {import('./$types').ActionData} form
 	 */
 
 	/**

From 60d7166e71ef1c5a3ddcd487df301b36edf5d33e Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Fri, 4 Oct 2024 15:56:38 +0200
Subject: [PATCH 11/18] remove optional chaining for `+layout.svelte`

---
 packages/create/templates/demo/src/routes/+layout.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/create/templates/demo/src/routes/+layout.svelte b/packages/create/templates/demo/src/routes/+layout.svelte
index 7b1b1419e..f793e70bd 100644
--- a/packages/create/templates/demo/src/routes/+layout.svelte
+++ b/packages/create/templates/demo/src/routes/+layout.svelte
@@ -10,7 +10,7 @@
 	<Header />
 
 	<main>
-		{@render children?.()}
+		{@render children()}
 	</main>
 
 	<footer>

From 5ff086db6f485d4a162ef0d7e4c50351182ab732 Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Fri, 4 Oct 2024 16:14:07 +0200
Subject: [PATCH 12/18] remove optional chaining for `+layout.svelte`

---
 packages/create/templates/demo/src/routes/+layout.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/create/templates/demo/src/routes/+layout.svelte b/packages/create/templates/demo/src/routes/+layout.svelte
index f793e70bd..7bd27ff66 100644
--- a/packages/create/templates/demo/src/routes/+layout.svelte
+++ b/packages/create/templates/demo/src/routes/+layout.svelte
@@ -2,7 +2,7 @@
 	import Header from './Header.svelte';
 	import '../app.css';
 
-	/** @type {{children?: import('svelte').Snippet}} */
+	/** @type {{children: import('svelte').Snippet}} */
 	let { children } = $props();
 </script>
 

From 6bcacfec3ff5a09bb389784cfd51ffc547cdf2e9 Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Fri, 4 Oct 2024 16:24:58 +0200
Subject: [PATCH 13/18] fix tests?

---
 packages/create/package.json |   3 +-
 pnpm-lock.yaml               | 115 +++++++++++++++--------------------
 2 files changed, 51 insertions(+), 67 deletions(-)

diff --git a/packages/create/package.json b/packages/create/package.json
index 52d03744f..b1b977563 100644
--- a/packages/create/package.json
+++ b/packages/create/package.json
@@ -33,7 +33,8 @@
 		"@types/gitignore-parser": "^0.0.3",
 		"gitignore-parser": "^0.0.2",
 		"sucrase": "^3.34.0",
-		"tiny-glob": "^0.2.9"
+		"tiny-glob": "^0.2.9",
+		"svelte": "^5.0.0-next.1"
 	},
 	"scripts": {
 		"lint": "prettier --check . --config ../../.prettierrc --ignore-path ../../.gitignore --ignore-path .gitignore --ignore-path ../../.prettierignore",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 253b90859..1a43f5754 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -28,7 +28,7 @@ importers:
         version: link:packages/create
       '@sveltejs/eslint-config':
         specifier: ^8.0.1
-        version: 8.0.1(@stylistic/eslint-plugin-js@2.8.0(eslint@9.10.0))(eslint-config-prettier@9.1.0(eslint@9.10.0))(eslint-plugin-n@17.10.2(eslint@9.10.0))(eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@4.2.19))(eslint@9.10.0)(typescript-eslint@8.5.0(eslint@9.10.0)(typescript@5.6.2))(typescript@5.6.2)
+        version: 8.0.1(@stylistic/eslint-plugin-js@2.8.0(eslint@9.10.0))(eslint-config-prettier@9.1.0(eslint@9.10.0))(eslint-plugin-n@17.10.2(eslint@9.10.0))(eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@5.0.0-next.262))(eslint@9.10.0)(typescript-eslint@8.5.0(eslint@9.10.0)(typescript@5.6.2))(typescript@5.6.2)
       '@svitejs/changesets-changelog-github-compact':
         specifier: ^1.1.0
         version: 1.1.0
@@ -49,7 +49,7 @@ importers:
         version: 3.3.3
       prettier-plugin-svelte:
         specifier: ^3.2.6
-        version: 3.2.6(prettier@3.3.3)(svelte@4.2.19)
+        version: 3.2.6(prettier@3.3.3)(svelte@5.0.0-next.262)
       rollup:
         specifier: ^4.21.2
         version: 4.21.2
@@ -218,6 +218,9 @@ importers:
       sucrase:
         specifier: ^3.34.0
         version: 3.35.0
+      svelte:
+        specifier: ^5.0.0-next.1
+        version: 5.0.0-next.262
       tiny-glob:
         specifier: ^0.2.9
         version: 0.2.9
@@ -834,6 +837,11 @@ packages:
     peerDependencies:
       acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
 
+  acorn-typescript@1.4.13:
+    resolution: {integrity: sha512-xsc9Xv0xlVfwp2o7sQ+GCQ1PgbkdcpWdTzrwXxO3xDMTAywVS3oXVOcOHuRjAPkS4P9b+yc/qNF15460v+jp4Q==}
+    peerDependencies:
+      acorn: '>=8.9.0'
+
   acorn@8.12.1:
     resolution: {integrity: sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==}
     engines: {node: '>=0.4.0'}
@@ -871,8 +879,9 @@ packages:
   argparse@2.0.1:
     resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
 
-  aria-query@5.3.0:
-    resolution: {integrity: sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==}
+  aria-query@5.3.2:
+    resolution: {integrity: sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==}
+    engines: {node: '>= 0.4'}
 
   array-union@2.1.0:
     resolution: {integrity: sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==}
@@ -964,9 +973,6 @@ packages:
     resolution: {integrity: sha512-NIxF55hv4nSqQswkAeiOi1r83xy8JldOFDTWiug55KBu9Jnblncd2U6ViHmYgHf01TPZS77NJBhBMKdWj9HQMQ==}
     engines: {node: '>=8'}
 
-  code-red@1.0.4:
-    resolution: {integrity: sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==}
-
   color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
     engines: {node: '>=7.0.0'}
@@ -995,10 +1001,6 @@ packages:
     resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
     engines: {node: '>= 8'}
 
-  css-tree@2.3.1:
-    resolution: {integrity: sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==}
-    engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0}
-
   cssesc@3.0.0:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
@@ -1039,10 +1041,6 @@ packages:
     resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==}
     engines: {node: '>=0.10.0'}
 
-  dequal@2.0.3:
-    resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
-    engines: {node: '>=6'}
-
   detect-indent@6.1.0:
     resolution: {integrity: sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==}
     engines: {node: '>=8'}
@@ -1164,6 +1162,9 @@ packages:
       jiti:
         optional: true
 
+  esm-env@1.0.0:
+    resolution: {integrity: sha512-Cf6VksWPsTuW01vU9Mk/3vRue91Zevka5SjyNf3nEpokFRuqt/KjUQoGAwq9qMmhpLTHmXzSIrFRw8zxWzmFBA==}
+
   espree@10.1.0:
     resolution: {integrity: sha512-M1M6CpiE6ffoigIOWYO9UDP8TMUw9kqb21tf+08IgDYjCsOvCuDt4jQcZmoYxx+w7zlKw9/N0KXfto+I8/FrXA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
@@ -1181,6 +1182,9 @@ packages:
     resolution: {integrity: sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==}
     engines: {node: '>=0.10'}
 
+  esrap@1.2.2:
+    resolution: {integrity: sha512-F2pSJklxx1BlQIQgooczXCPHmcWpn6EsP5oo73LQfonG9fIlIENQ8vMmfGXeojP9MrkzUNAfyU5vdFlR9shHAw==}
+
   esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
     engines: {node: '>=4.0'}
@@ -1487,9 +1491,6 @@ packages:
   magic-string@0.30.11:
     resolution: {integrity: sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==}
 
-  mdn-data@2.0.30:
-    resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==}
-
   merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
 
@@ -1644,9 +1645,6 @@ packages:
     resolution: {integrity: sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==}
     engines: {node: '>= 14.16'}
 
-  periscopic@3.1.0:
-    resolution: {integrity: sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==}
-
   picocolors@1.1.0:
     resolution: {integrity: sha512-TQ92mBOW0l3LeMeyLV6mzy/kWr8lkd/hp3mTg7wYK7zJhuBStmGMBG0BdeDZS/dZx1IukaX6Bk11zcln25o1Aw==}
 
@@ -1905,9 +1903,9 @@ packages:
       svelte:
         optional: true
 
-  svelte@4.2.19:
-    resolution: {integrity: sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==}
-    engines: {node: '>=16'}
+  svelte@5.0.0-next.262:
+    resolution: {integrity: sha512-gAY0POArLN5yI/ihvItG0wQCh7ycfvxSvvVlvPECshFKmR/ep6ZAlqX50+aUGDSG/5megFqnSJfP7piC6lOtew==}
+    engines: {node: '>=18'}
 
   tapable@2.2.1:
     resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
@@ -2648,13 +2646,13 @@ snapshots:
       eslint-visitor-keys: 4.0.0
       espree: 10.1.0
 
-  '@sveltejs/eslint-config@8.0.1(@stylistic/eslint-plugin-js@2.8.0(eslint@9.10.0))(eslint-config-prettier@9.1.0(eslint@9.10.0))(eslint-plugin-n@17.10.2(eslint@9.10.0))(eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@4.2.19))(eslint@9.10.0)(typescript-eslint@8.5.0(eslint@9.10.0)(typescript@5.6.2))(typescript@5.6.2)':
+  '@sveltejs/eslint-config@8.0.1(@stylistic/eslint-plugin-js@2.8.0(eslint@9.10.0))(eslint-config-prettier@9.1.0(eslint@9.10.0))(eslint-plugin-n@17.10.2(eslint@9.10.0))(eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@5.0.0-next.262))(eslint@9.10.0)(typescript-eslint@8.5.0(eslint@9.10.0)(typescript@5.6.2))(typescript@5.6.2)':
     dependencies:
       '@stylistic/eslint-plugin-js': 2.8.0(eslint@9.10.0)
       eslint: 9.10.0
       eslint-config-prettier: 9.1.0(eslint@9.10.0)
       eslint-plugin-n: 17.10.2(eslint@9.10.0)
-      eslint-plugin-svelte: 2.43.0(eslint@9.10.0)(svelte@4.2.19)
+      eslint-plugin-svelte: 2.43.0(eslint@9.10.0)(svelte@5.0.0-next.262)
       globals: 15.9.0
       typescript: 5.6.2
       typescript-eslint: 8.5.0(eslint@9.10.0)(typescript@5.6.2)
@@ -2818,6 +2816,10 @@ snapshots:
     dependencies:
       acorn: 8.12.1
 
+  acorn-typescript@1.4.13(acorn@8.12.1):
+    dependencies:
+      acorn: 8.12.1
+
   acorn@8.12.1: {}
 
   ajv@6.12.6:
@@ -2847,9 +2849,7 @@ snapshots:
 
   argparse@2.0.1: {}
 
-  aria-query@5.3.0:
-    dependencies:
-      dequal: 2.0.3
+  aria-query@5.3.2: {}
 
   array-union@2.1.0: {}
 
@@ -2937,14 +2937,6 @@ snapshots:
 
   ci-info@3.9.0: {}
 
-  code-red@1.0.4:
-    dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.0
-      '@types/estree': 1.0.5
-      acorn: 8.12.1
-      estree-walker: 3.0.3
-      periscopic: 3.1.0
-
   color-convert@2.0.1:
     dependencies:
       color-name: 1.1.4
@@ -2971,11 +2963,6 @@ snapshots:
       shebang-command: 2.0.0
       which: 2.0.2
 
-  css-tree@2.3.1:
-    dependencies:
-      mdn-data: 2.0.30
-      source-map-js: 1.2.1
-
   cssesc@3.0.0: {}
 
   dataloader@1.4.0: {}
@@ -2994,8 +2981,6 @@ snapshots:
 
   deepmerge@4.3.1: {}
 
-  dequal@2.0.3: {}
-
   detect-indent@6.1.0: {}
 
   dir-glob@3.0.1:
@@ -3102,7 +3087,7 @@ snapshots:
       minimatch: 9.0.5
       semver: 7.6.3
 
-  eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@4.2.19):
+  eslint-plugin-svelte@2.43.0(eslint@9.10.0)(svelte@5.0.0-next.262):
     dependencies:
       '@eslint-community/eslint-utils': 4.4.0(eslint@9.10.0)
       '@jridgewell/sourcemap-codec': 1.5.0
@@ -3115,9 +3100,9 @@ snapshots:
       postcss-safe-parser: 6.0.0(postcss@8.4.45)
       postcss-selector-parser: 6.1.2
       semver: 7.6.3
-      svelte-eslint-parser: 0.41.0(svelte@4.2.19)
+      svelte-eslint-parser: 0.41.0(svelte@5.0.0-next.262)
     optionalDependencies:
-      svelte: 4.2.19
+      svelte: 5.0.0-next.262
     transitivePeerDependencies:
       - ts-node
 
@@ -3174,6 +3159,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  esm-env@1.0.0: {}
+
   espree@10.1.0:
     dependencies:
       acorn: 8.12.1
@@ -3192,6 +3179,11 @@ snapshots:
     dependencies:
       estraverse: 5.3.0
 
+  esrap@1.2.2:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.0
+      '@types/estree': 1.0.5
+
   esrecurse@4.3.0:
     dependencies:
       estraverse: 5.3.0
@@ -3488,8 +3480,6 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.0
 
-  mdn-data@2.0.30: {}
-
   merge-stream@2.0.0: {}
 
   merge2@1.4.1: {}
@@ -3620,12 +3610,6 @@ snapshots:
 
   pathval@2.0.0: {}
 
-  periscopic@3.1.0:
-    dependencies:
-      '@types/estree': 1.0.5
-      estree-walker: 3.0.3
-      is-reference: 3.0.2
-
   picocolors@1.1.0: {}
 
   picomatch@2.3.1: {}
@@ -3662,10 +3646,10 @@ snapshots:
 
   prelude-ls@1.2.1: {}
 
-  prettier-plugin-svelte@3.2.6(prettier@3.3.3)(svelte@4.2.19):
+  prettier-plugin-svelte@3.2.6(prettier@3.3.3)(svelte@5.0.0-next.262):
     dependencies:
       prettier: 3.3.3
-      svelte: 4.2.19
+      svelte: 5.0.0-next.262
 
   prettier@2.8.8: {}
 
@@ -3858,7 +3842,7 @@ snapshots:
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  svelte-eslint-parser@0.41.0(svelte@4.2.19):
+  svelte-eslint-parser@0.41.0(svelte@5.0.0-next.262):
     dependencies:
       eslint-scope: 7.2.2
       eslint-visitor-keys: 3.4.3
@@ -3866,24 +3850,23 @@ snapshots:
       postcss: 8.4.45
       postcss-scss: 4.0.9(postcss@8.4.45)
     optionalDependencies:
-      svelte: 4.2.19
+      svelte: 5.0.0-next.262
 
-  svelte@4.2.19:
+  svelte@5.0.0-next.262:
     dependencies:
       '@ampproject/remapping': 2.3.0
       '@jridgewell/sourcemap-codec': 1.5.0
-      '@jridgewell/trace-mapping': 0.3.25
       '@types/estree': 1.0.5
       acorn: 8.12.1
-      aria-query: 5.3.0
+      acorn-typescript: 1.4.13(acorn@8.12.1)
+      aria-query: 5.3.2
       axobject-query: 4.1.0
-      code-red: 1.0.4
-      css-tree: 2.3.1
-      estree-walker: 3.0.3
+      esm-env: 1.0.0
+      esrap: 1.2.2
       is-reference: 3.0.2
       locate-character: 3.0.0
       magic-string: 0.30.11
-      periscopic: 3.1.0
+      zimmerframe: 1.1.2
 
   tapable@2.2.1: {}
 

From 95198f98a489a36cebe710058849b16207d6184b Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Fri, 4 Oct 2024 17:00:35 +0200
Subject: [PATCH 14/18] better fix for tests

---
 package.json                 | 1 +
 packages/create/package.json | 3 +--
 pnpm-lock.yaml               | 6 +++---
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index b651f0bdf..a8cf02214 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
 		"rollup-plugin-esbuild": "^6.1.1",
 		"rollup-plugin-preserve-shebangs": "^0.2.0",
 		"sv": "workspace:*",
+		"svelte": "^5.0.0-next.1",
 		"typescript": "^5.6.2",
 		"typescript-eslint": "^8.5.0",
 		"unplugin-isolated-decl": "^0.6.5",
diff --git a/packages/create/package.json b/packages/create/package.json
index b1b977563..52d03744f 100644
--- a/packages/create/package.json
+++ b/packages/create/package.json
@@ -33,8 +33,7 @@
 		"@types/gitignore-parser": "^0.0.3",
 		"gitignore-parser": "^0.0.2",
 		"sucrase": "^3.34.0",
-		"tiny-glob": "^0.2.9",
-		"svelte": "^5.0.0-next.1"
+		"tiny-glob": "^0.2.9"
 	},
 	"scripts": {
 		"lint": "prettier --check . --config ../../.prettierrc --ignore-path ../../.gitignore --ignore-path .gitignore --ignore-path ../../.prettierignore",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1a43f5754..b42e08dec 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -62,6 +62,9 @@ importers:
       sv:
         specifier: workspace:*
         version: link:packages/cli
+      svelte:
+        specifier: ^5.0.0-next.1
+        version: 5.0.0-next.262
       typescript:
         specifier: ^5.6.2
         version: 5.6.2
@@ -218,9 +221,6 @@ importers:
       sucrase:
         specifier: ^3.34.0
         version: 3.35.0
-      svelte:
-        specifier: ^5.0.0-next.1
-        version: 5.0.0-next.262
       tiny-glob:
         specifier: ^0.2.9
         version: 0.2.9

From 99373cf68855ae4bef3fafe6633dfb37695b6e8a Mon Sep 17 00:00:00 2001
From: AdrianGonz97 <31664583+AdrianGonz97@users.noreply.github.com>
Date: Fri, 4 Oct 2024 13:50:07 -0400
Subject: [PATCH 15/18] dedupe

---
 pnpm-lock.yaml | 27 +++++----------------------
 1 file changed, 5 insertions(+), 22 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b42e08dec..0ad67e3a3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -609,15 +609,6 @@ packages:
       rollup:
         optional: true
 
-  '@rollup/pluginutils@5.1.0':
-    resolution: {integrity: sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==}
-    engines: {node: '>=14.0.0'}
-    peerDependencies:
-      rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
-    peerDependenciesMeta:
-      rollup:
-        optional: true
-
   '@rollup/pluginutils@5.1.2':
     resolution: {integrity: sha512-/FIdS3PyZ39bjZlwqFnWqCOVnW7o963LtKMwQOD0NhQqw22gSr2YY1afu3FxRip4ZCZNsD5jq6Aaz6QV3D/Njw==}
     engines: {node: '>=14.0.0'}
@@ -2540,7 +2531,7 @@ snapshots:
 
   '@rollup/plugin-commonjs@26.0.1(rollup@4.21.2)':
     dependencies:
-      '@rollup/pluginutils': 5.1.0(rollup@4.21.2)
+      '@rollup/pluginutils': 5.1.2(rollup@4.21.2)
       commondir: 1.0.1
       estree-walker: 2.0.2
       glob: 10.4.5
@@ -2551,7 +2542,7 @@ snapshots:
 
   '@rollup/plugin-dynamic-import-vars@2.1.2(rollup@4.21.2)':
     dependencies:
-      '@rollup/pluginutils': 5.1.0(rollup@4.21.2)
+      '@rollup/pluginutils': 5.1.2(rollup@4.21.2)
       astring: 1.8.6
       estree-walker: 2.0.2
       fast-glob: 3.3.2
@@ -2561,13 +2552,13 @@ snapshots:
 
   '@rollup/plugin-json@6.1.0(rollup@4.21.2)':
     dependencies:
-      '@rollup/pluginutils': 5.1.0(rollup@4.21.2)
+      '@rollup/pluginutils': 5.1.2(rollup@4.21.2)
     optionalDependencies:
       rollup: 4.21.2
 
   '@rollup/plugin-node-resolve@15.2.3(rollup@4.21.2)':
     dependencies:
-      '@rollup/pluginutils': 5.1.0(rollup@4.21.2)
+      '@rollup/pluginutils': 5.1.2(rollup@4.21.2)
       '@types/resolve': 1.20.2
       deepmerge: 4.3.1
       is-builtin-module: 3.2.1
@@ -2576,14 +2567,6 @@ snapshots:
     optionalDependencies:
       rollup: 4.21.2
 
-  '@rollup/pluginutils@5.1.0(rollup@4.21.2)':
-    dependencies:
-      '@types/estree': 1.0.5
-      estree-walker: 2.0.2
-      picomatch: 2.3.1
-    optionalDependencies:
-      rollup: 4.21.2
-
   '@rollup/pluginutils@5.1.2(rollup@4.21.2)':
     dependencies:
       '@types/estree': 1.0.5
@@ -3701,7 +3684,7 @@ snapshots:
 
   rollup-plugin-esbuild@6.1.1(esbuild@0.21.5)(rollup@4.21.2):
     dependencies:
-      '@rollup/pluginutils': 5.1.0(rollup@4.21.2)
+      '@rollup/pluginutils': 5.1.2(rollup@4.21.2)
       debug: 4.3.7
       es-module-lexer: 1.5.4
       esbuild: 0.21.5

From c7761b2f2faf59fbaf7b1f2c4dfcb7529040f5a8 Mon Sep 17 00:00:00 2001
From: AdrianGonz97 <31664583+AdrianGonz97@users.noreply.github.com>
Date: Fri, 4 Oct 2024 13:55:32 -0400
Subject: [PATCH 16/18] always include `lang="ts"`

---
 packages/create/templates/demo/src/routes/+layout.svelte | 2 +-
 packages/create/templates/demo/src/routes/+page.svelte   | 2 +-
 packages/create/templates/demo/src/routes/Header.svelte  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/+layout.svelte b/packages/create/templates/demo/src/routes/+layout.svelte
index 7bd27ff66..b2ff3de52 100644
--- a/packages/create/templates/demo/src/routes/+layout.svelte
+++ b/packages/create/templates/demo/src/routes/+layout.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 	import Header from './Header.svelte';
 	import '../app.css';
 
diff --git a/packages/create/templates/demo/src/routes/+page.svelte b/packages/create/templates/demo/src/routes/+page.svelte
index 97201ef36..7ab89a7fb 100644
--- a/packages/create/templates/demo/src/routes/+page.svelte
+++ b/packages/create/templates/demo/src/routes/+page.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 	import Counter from './Counter.svelte';
 	import welcome from '$lib/images/svelte-welcome.webp';
 	import welcome_fallback from '$lib/images/svelte-welcome.png';
diff --git a/packages/create/templates/demo/src/routes/Header.svelte b/packages/create/templates/demo/src/routes/Header.svelte
index 368b721e8..bf608e5f2 100644
--- a/packages/create/templates/demo/src/routes/Header.svelte
+++ b/packages/create/templates/demo/src/routes/Header.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
 	import { page } from '$app/stores';
 	import logo from '$lib/images/svelte-logo.svg';
 	import github from '$lib/images/github.svg';

From 28d7b40ff9191c07fc777e70b1adc4f2d4ea345d Mon Sep 17 00:00:00 2001
From: Manuel Serret <mserret99@gmail.com>
Date: Sat, 5 Oct 2024 19:10:35 +0200
Subject: [PATCH 17/18] update to camelCase

---
 .../templates/demo/src/routes/+page.svelte       |  4 ++--
 .../templates/demo/src/routes/Counter.svelte     | 10 +++++-----
 .../demo/src/routes/sverdle/reduced-motion.ts    | 16 ++++++++--------
 3 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/+page.svelte b/packages/create/templates/demo/src/routes/+page.svelte
index 7ab89a7fb..a328ff63a 100644
--- a/packages/create/templates/demo/src/routes/+page.svelte
+++ b/packages/create/templates/demo/src/routes/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import Counter from './Counter.svelte';
 	import welcome from '$lib/images/svelte-welcome.webp';
-	import welcome_fallback from '$lib/images/svelte-welcome.png';
+	import welcomeFallback from '$lib/images/svelte-welcome.png';
 </script>
 
 <svelte:head>
@@ -14,7 +14,7 @@
 		<span class="welcome">
 			<picture>
 				<source srcset={welcome} type="image/webp" />
-				<img src={welcome_fallback} alt="Welcome" />
+				<img src={welcomeFallback} alt="Welcome" />
 			</picture>
 		</span>
 
diff --git a/packages/create/templates/demo/src/routes/Counter.svelte b/packages/create/templates/demo/src/routes/Counter.svelte
index b18a0bf86..398dbb6ce 100644
--- a/packages/create/templates/demo/src/routes/Counter.svelte
+++ b/packages/create/templates/demo/src/routes/Counter.svelte
@@ -4,12 +4,12 @@
 	let count = $state(0);
 
 	// svelte-ignore state_referenced_locally
-	const displayed_count = spring(count);
+	const displayedCount = spring(count);
 
 	$effect(() => {
-		displayed_count.set(count);
+		displayedCount.set(count);
 	});
-	let offset = $derived(modulo($displayed_count, 1));
+	let offset = $derived(modulo($displayedCount, 1));
 
 	/**
 	 * @param {number} n
@@ -30,8 +30,8 @@
 
 	<div class="counter-viewport">
 		<div class="counter-digits" style="transform: translate(0, {100 * offset}%)">
-			<strong class="hidden" aria-hidden="true">{Math.floor($displayed_count + 1)}</strong>
-			<strong>{Math.floor($displayed_count)}</strong>
+			<strong class="hidden" aria-hidden="true">{Math.floor($displayedCount + 1)}</strong>
+			<strong>{Math.floor($displayedCount)}</strong>
 		</div>
 	</div>
 
diff --git a/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts b/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
index 27b9d5116..1f22e646f 100644
--- a/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
+++ b/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
@@ -1,26 +1,26 @@
 import { readable } from 'svelte/store';
 import { browser } from '$app/environment';
 
-const reduced_motion_query = '(prefers-reduced-motion: reduce)';
+const reducedMotionQuery = '(prefers-reduced-motion: reduce)';
 
-const get_initial_motion_preference = () => {
+const getInitialMotionPreference = () => {
 	if (!browser) return false;
-	return window.matchMedia(reduced_motion_query).matches;
+	return window.matchMedia(reducedMotionQuery).matches;
 };
 
-export const reduced_motion = readable(get_initial_motion_preference(), (set) => {
+export const reduced_motion = readable(getInitialMotionPreference(), (set) => {
 	if (browser) {
 		/**
 		 * @param {MediaQueryListEvent} event
 		 */
-		const set_reduced_motion = (event: MediaQueryListEvent) => {
+		const setReducedMotion = (event: MediaQueryListEvent) => {
 			set(event.matches);
 		};
-		const media_query_list = window.matchMedia(reduced_motion_query);
-		media_query_list.addEventListener('change', set_reduced_motion);
+		const mediaQueryList = window.matchMedia(reducedMotionQuery);
+		mediaQueryList.addEventListener('change', setReducedMotion);
 
 		return () => {
-			media_query_list.removeEventListener('change', set_reduced_motion);
+			mediaQueryList.removeEventListener('change', setReducedMotion);
 		};
 	}
 });

From f19a7fee95248ea552dc197ce4cd6ee56aeca6ef Mon Sep 17 00:00:00 2001
From: AdrianGonz97 <31664583+AdrianGonz97@users.noreply.github.com>
Date: Sat, 5 Oct 2024 14:14:26 -0400
Subject: [PATCH 18/18] camelCase

---
 .../create/templates/demo/src/routes/sverdle/+page.svelte     | 4 ++--
 .../templates/demo/src/routes/sverdle/reduced-motion.ts       | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/create/templates/demo/src/routes/sverdle/+page.svelte b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
index 2ec81bea1..4605dbdd5 100644
--- a/packages/create/templates/demo/src/routes/sverdle/+page.svelte
+++ b/packages/create/templates/demo/src/routes/sverdle/+page.svelte
@@ -2,7 +2,7 @@
 	import { enhance } from '$app/forms';
 	import { confetti } from '@neoconfetti/svelte';
 	import type { ActionData, PageData } from './$types';
-	import { reduced_motion } from './reduced-motion';
+	import { reducedMotion } from './reduced-motion';
 
 	interface Props {
 		data: PageData;
@@ -203,7 +203,7 @@
 	<div
 		style="position: absolute; left: 50%; top: 30%"
 		use:confetti={{
-			particleCount: $reduced_motion ? 0 : undefined,
+			particleCount: $reducedMotion ? 0 : undefined,
 			force: 0.7,
 			stageWidth: window.innerWidth,
 			stageHeight: window.innerHeight,
diff --git a/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts b/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
index 1f22e646f..83d32906b 100644
--- a/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
+++ b/packages/create/templates/demo/src/routes/sverdle/reduced-motion.ts
@@ -8,7 +8,7 @@ const getInitialMotionPreference = () => {
 	return window.matchMedia(reducedMotionQuery).matches;
 };
 
-export const reduced_motion = readable(getInitialMotionPreference(), (set) => {
+export const reducedMotion = readable(getInitialMotionPreference(), (set) => {
 	if (browser) {
 		/**
 		 * @param {MediaQueryListEvent} event