chore(site): upgrade deps (#9745)

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

sites/svelte.dev/package.json

@@ -18,43 +18,42 @@
   },
   "dependencies": {
     "@jridgewell/sourcemap-codec": "^1.4.15",
-    "@supabase/supabase-js": "^2.33.2",
+    "@supabase/supabase-js": "^2.39.0",
     "@sveltejs/repl": "0.6.0",
-    "cookie": "^0.5.0",
+    "cookie": "^0.6.0",
     "devalue": "^4.3.2",
     "do-not-zip": "^1.0.0",
     "flexsearch": "^0.7.31",
     "flru": "^1.0.2"
   },
   "devDependencies": {
-    "@resvg/resvg-js": "^2.4.1",
+    "@resvg/resvg-js": "^2.6.0",
-    "@sveltejs/adapter-vercel": "^3.0.3",
+    "@sveltejs/adapter-vercel": "^3.1.0",
-    "@sveltejs/kit": "^1.26.0",
+    "@sveltejs/kit": "^1.27.6",
     "@sveltejs/site-kit": "6.0.0-next.50",
-    "@sveltejs/vite-plugin-svelte": "^2.4.6",
+    "@types/cookie": "^0.6.0",
-    "@types/cookie": "^0.5.2",
+    "@types/node": "^20.10.2",
-    "@types/node": "^20.5.9",
+    "browserslist": "^4.22.1",
-    "browserslist": "^4.21.10",
     "degit": "^2.8.4",
     "dotenv": "^16.3.1",
     "jimp": "^0.22.10",
-    "lightningcss": "^1.21.8",
+    "lightningcss": "^1.22.1",
-    "magic-string": "^0.30.3",
+    "magic-string": "^0.30.5",
-    "marked": "^9.0.0",
+    "marked": "^11.0.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.1.0",
-    "prettier-plugin-svelte": "^3.0.3",
+    "prettier-plugin-svelte": "^3.1.2",
-    "sass": "^1.67.0",
+    "sass": "^1.69.5",
-    "satori": "^0.10.4",
+    "satori": "^0.10.11",
     "satori-html": "^0.3.2",
     "shelljs": "^0.8.5",
-    "shiki": "^0.14.4",
+    "shiki": "^0.14.5",
     "shiki-twoslash": "^3.1.2",
     "svelte": "workspace:*",
-    "svelte-check": "^3.5.1",
+    "svelte-check": "^3.6.2",
-    "svelte-preprocess": "^5.0.4",
+    "svelte-preprocess": "^5.1.1",
     "tiny-glob": "^0.2.9",
-    "typescript": "^5.2.2",
+    "typescript": "^5.3.2",
-    "vite": "^4.4.9",
+    "vite": "^4.5.0",
-    "vite-imagetools": "^5.0.8"
+    "vite-imagetools": "^6.2.6"
   }
 }

sites/svelte.dev/src/routes/_components/Hero.svelte

@@ -5,8 +5,6 @@
 	import MachineDesktop from './svelte-machine-desktop.png?w=1200;2000;2800;4400&format=avif;webp;png;&as=picture';
 	// @ts-ignore
 	import MachineMobile from './svelte-machine-mobile.png?w=960&format=avif;webp;png;&as=picture';
-
-	const srcset = (sources) => sources.map(({ src, w }) => `${src} ${w}w`).join(', ');
 </script>
 
 <div class="hero">
@@ -24,24 +22,12 @@
 	</div>
 
 	<picture class="machine">
-		<source
+		<source srcset={MachineDesktop.sources.avif} type="image/avif" media="(min-width: 800px)" />
-			srcset={srcset(MachineDesktop.sources.avif)}
+		<source srcset={MachineDesktop.sources.webp} type="image/webp" media="(min-width: 800px)" />
-			type="image/avif"
+		<source srcset={MachineDesktop.sources.png} type="image/png" media="(min-width: 800px)" />
-			media="(min-width: 800px)"
+		<source srcset={MachineMobile.sources.avif} type="image/avif" />
-		/>
+		<source srcset={MachineMobile.sources.webp} type="image/webp" />
-		<source
+		<source srcset={MachineMobile.sources.png} type="image/png" />
-			srcset={srcset(MachineDesktop.sources.webp)}
-			type="image/webp"
-			media="(min-width: 800px)"
-		/>
-		<source
-			srcset={srcset(MachineDesktop.sources.png)}
-			type="image/png"
-			media="(min-width: 800px)"
-		/>
-		<source srcset={srcset(MachineMobile.sources.avif)} type="image/avif" />
-		<source srcset={srcset(MachineMobile.sources.webp)} type="image/webp" />
-		<source srcset={srcset(MachineMobile.sources.png)} type="image/png" />
 		<img alt="The Svelte compiler packaging up your component code" src={MachineMobile.img.src} />
 	</picture>
 </div>
@@ -102,7 +88,9 @@
 
 	.cta:hover {
 		text-decoration: none;
-		box-shadow: 0px 0.8px 3.8px rgba(0, 0, 0, 0.115), 0px 6px 30px rgba(0, 0, 0, 0.23);
+		box-shadow:
+			0px 0.8px 3.8px rgba(0, 0, 0, 0.115),
+			0px 6px 30px rgba(0, 0, 0, 0.23);
 	}
 
 	.cta.basic {

sites/svelte.dev/vite.config.js

@@ -1,7 +1,7 @@
 import { sveltekit } from '@sveltejs/kit/vite';
+import browserslist from 'browserslist';
 import { browserslistToTargets } from 'lightningcss';
 import { readFile } from 'node:fs/promises';
-import browserslist from 'browserslist';
 
 const plugins = [raw(['.ttf']), sveltekit()];