update svelte slots

Author: le0pard

package.json

@@ -16,32 +16,32 @@
     "format": "pnpify run prettier --plugin prettier-plugin-svelte --write src"
   },
   "dependencies": {
-    "@astrojs/svelte": "^7.0.1",
+    "@astrojs/svelte": "^7.0.2",
     "@codemirror/commands": "^6.7.1",
     "@codemirror/lang-html": "6.4.9",
-    "@codemirror/language": "6.10.6",
-    "@codemirror/state": "6.4.1",
-    "@codemirror/view": "^6.35.2",
+    "@codemirror/language": "6.10.8",
+    "@codemirror/state": "6.5.0",
+    "@codemirror/view": "^6.36.1",
     "@hotwired/turbo": "8.0.12",
-    "@iconify-json/mdi": "^1.2.1",
+    "@iconify-json/mdi": "^1.2.2",
     "@lezer/common": "^1.2.3",
     "@lezer/highlight": "^1.2.1",
     "@rollup/plugin-yaml": "^4.1.2",
-    "@vite-pwa/astro": "^0.4.3",
-    "astro": "^5.0.8",
-    "astro-icon": "1.1.4",
+    "@vite-pwa/astro": "^0.5.0",
+    "astro": "^5.1.1",
+    "astro-icon": "1.1.5",
     "comlink": "^4.4.2",
     "lodash": "4.17.21",
     "normalize.css": "8.0.1",
     "postcss": "8.4.49",
     "postcss-import": "16.1.0",
     "postcss-load-config": "^6.0.1",
     "postcss-loader": "8.1.1",
-    "postcss-preset-env": "10.1.1",
+    "postcss-preset-env": "10.1.3",
     "postcss-reporter": "7.1.0",
     "rehype-external-links": "^3.0.0",
-    "svelte": "5.9.0",
-    "vite": "^6.0.3",
+    "svelte": "5.16.0",
+    "vite": "^6.0.6",
     "vite-plugin-pwa": "^0.21.1",
     "workbox-background-sync": "^7.3.0",
     "workbox-core": "^7.3.0",

src/components/App.svelte

@@ -8,7 +8,7 @@
   import ReportHeaderComponent from '@components/ReportViewHeader.svelte'
   import ReportViewComponent from '@components/ReportView.svelte'
 
-  export let webWorkerObject
+  let { webWorkerObject, githubIcon } = $props()
 
   setContext('ww', {
     getWebWorker: () => webWorkerObject
@@ -32,7 +32,9 @@
   <SplitViewComponent />
   <div class="parser-report" class:parser-report-hidden={$splitState.visible === 'left'}>
     <ReportHeaderComponent>
-      <slot slot="githubIcon" name="githubIcon" />
+      {#snippet githubIcon()}
+        {@render githubIcon()}
+      {/snippet}
     </ReportHeaderComponent>
     <ReportViewComponent />
   </div>

src/components/Parser.svelte

@@ -4,7 +4,9 @@
   import AppComponent from '@components/App.svelte'
   import ErrorComponent from '@components/Error.svelte'
 
-  let isPageRendered = false // trigger destroy for nested components, if turbo change page
+  let { githubIcon } = $props()
+
+  let isPageRendered = $state(false) // trigger destroy for nested components, if turbo change page
 
   onMount(() => {
     isPageRendered = true
@@ -40,7 +42,9 @@
   {:then webWorkerObject}
     {#if isPageRendered}
       <AppComponent webWorkerObject={webWorkerObject}>
-        <slot slot="githubIcon" name="githubIcon" />
+        {#snippet githubIcon()}
+          {@render githubIcon()}
+        {/snippet}
       </AppComponent>
     {/if}
   {:catch error}

src/components/ReportViewHeader.svelte

@@ -1,5 +1,7 @@
 <script>
   import ThemeSwitcherComponent from '@components/ThemeSwitcher.svelte'
+
+  let { githubIcon } = $props()
 </script>
 
 <div class="report-header">
@@ -14,7 +16,7 @@
       rel="noopener noreferrer"
     >
       <div class="report-header-github">
-        <slot name="githubIcon" />
+        {@render githubIcon()}
       </div>
     </a>
   </div>