Share styles and update props

web-app/src/lib/components/DateTime.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  const { date } = $props<{ date: string }>();
+  const { date }: { date: string } = $props();
 
   const options: Intl.DateTimeFormatOptions = {
     year: "numeric",

web-app/src/lib/components/Modal.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import type { Snippet } from "svelte";
 
-  const { children, id, text } = $props<{ children: Snippet; id: string; text: string }>();
+  const { children, id, text }: { children: Snippet; id: string; text: string } = $props();
 </script>
 
 <a href={`#${id}`} role="button">{text}</a>

web-app/src/lib/components/SuccessOrError.svelte

@@ -1,8 +1,6 @@
 <script lang="ts">
-  const { success, message } = $props<{
-    success: boolean | undefined;
-    message: string;
-  }>();
+  const { success, message }: { success: boolean | undefined; message: string | undefined } =
+    $props();
 </script>
 
 {#if success}

web-app/src/lib/components/WebsiteEditor.svelte

@@ -9,14 +9,14 @@
     fullPreview = false,
     previewContent,
     previewScrollTop = 0
-  } = $props<{
+  }: {
     id: string;
     title: string;
     children: Snippet;
     fullPreview?: boolean;
     previewContent: string;
     previewScrollTop?: number;
-  }>();
+  } = $props();
 
   let previewElement: HTMLDivElement;