Rewrite PointListModal with svelte5 runes. fixes reactivity

src/lib/components/Toast.svelte

@@ -15,6 +15,17 @@
     /** @type {import('svelte/store').Writable<ToastMessage[]>} */
     export const toasts = writable([]);
 
+    const TOAST_ICONS = {
+        primary: 'info-circle-fill',
+        secondary: 'info-circle-fill',
+        success: 'check-circle-fill',
+        danger: 'exclamation-triangle-fill',
+        warning: 'exclamation-circle-fill',
+        info: 'info-circle-fill',
+        light: 'lightbulb',
+        dark: 'question'
+    };
+
     /**
      * Adds a new toast to the list.
      * @param {Omit<ToastMessage, 'id'>} toast
@@ -48,7 +59,7 @@
 </script>
 
 <script>
-    import { Toast, ToastBody, ToastHeader } from '@sveltestrap/sveltestrap';
+    import { Toast, ToastBody, ToastHeader, Icon } from '@sveltestrap/sveltestrap';
 
     /**
      * Removes a toast from the list by its ID.
@@ -80,7 +91,8 @@
             color={toast.color || 'info'}
             on:close={() => removeToast(toast.id)}
         >
-            <ToastHeader toggle={() => removeToast(toast.id)}>
+            <ToastHeader toggle={() => removeToast(toast.id)} class={`text-${toast.color || 'text-info'}`}>
+                <Icon slot="icon" name={TOAST_ICONS[toast.color ? toast.color : 'info']} class="me-2" color={toast.color || 'info'} />
                 {toast.header}
             </ToastHeader>
             <ToastBody>