fix: resolve components in legacy mode

src/components/ImageCropper.svelte

@@ -7,9 +7,11 @@
   import { uiStore } from "../stores/uiStore";
   import "cropperjs/dist/cropper.css";
 
-  export let imageSrc: string;
-  export let onCropComplete: (croppedImage: string) => void;
-  export let onCancel: () => void;
+  let { imageSrc, onCropComplete, onCancel }: {
+    imageSrc: string;
+    onCropComplete: (croppedImage: string) => void;
+    onCancel: () => void;
+  } = $props();
 
   let imageElement: HTMLImageElement;
   let cropper: Cropper | null = null;

src/components/ImageUpload.svelte

@@ -18,7 +18,7 @@
   let uploadedImage = $state<string | null>(null);
   let errorMessage = $state<string | null>(null);
 
-  $derived((uiError = $uiStore.error?.error));
+  const uiError = $derived($uiStore.error?.error);
 
   onMount(() => {
     setupPasteHandler();

src/components/PanelList.svelte

@@ -5,8 +5,10 @@
   import { panelStorage } from "../lib/utils/panelStorage";
   import type { Panel } from "../lib/types/panel";
 
-  export let onPanelSelect: (panel: Panel) => void;
-  export let onPanelDelete: (panelId: string) => void;
+  let { onPanelSelect, onPanelDelete }: {
+    onPanelSelect: (panel: Panel) => void;
+    onPanelDelete: (panelId: string) => void;
+  } = $props();
 
   let panels = $state<Panel[]>([]);
   let selectedPanelId = $state<string | null>(null);

src/components/PanelPreview.svelte

@@ -5,7 +5,9 @@
   import type { Panel } from "../lib/types/panel";
   import type { PageProps } from "./$types";
 
-  export let onDownload?: () => void;
+  let { onDownload }: {
+    onDownload?: () => void;
+  } = $props();
 
   let Stage: any = $state(undefined);
   let Layer: any = $state(undefined);

src/components/TextManager.svelte

@@ -4,7 +4,9 @@
   import type { TextItem } from "../lib/types/panel";
   import { v4 as uuidv4 } from "uuid";
 
-  export let onTextUpdate: (texts: TextItem[]) => void;
+  let { onTextUpdate }: {
+    onTextUpdate: (texts: TextItem[]) => void;
+  } = $props();
 
   let currentPanel = $state($panelStore);
   let selectedTextId = $state<string | null>(null);

svelte.config.js

@@ -13,6 +13,9 @@ const config = {
       bundleStrategy: "inline",
     },
   },
+  compilerOptions: {
+    runes: true,
+  },
 };
 
 export default config;