1 files changed, 15 insertions, 9 deletions
diff --git a/src/lib/Notification/Notification.svelte b/src/lib/Notification/Notification.svelte
index 6764f46e..f2b6ac44 100644
--- a/src/lib/Notification/Notification.svelte
+++ b/src/lib/Notification/Notification.svelte
@@ -1,12 +1,18 @@
 <script lang="ts">
+  import { preventDefault } from 'svelte/legacy';
+
   import settings from '$stores/settings';
   import { onMount } from 'svelte';
 
-  export let notification: { [key: string]: any } = {};
-  export let onRemove: () => void = () => {
+  interface Props {
+    notification?: { [key: string]: any };
+    onRemove?: () => void;
+    removed?: boolean;
+  }
+
+  let { notification = {}, onRemove = () => {
     return;
-  };
-  export let removed = false;
+  }, removed = $bindable(false) }: Props = $props();
 
   onMount(() => setTimeout(remove, notification.duration));
 
@@ -21,20 +27,20 @@
   <div
     id="notification-container"
     class={removed ? 'fade-out' : 'fade-in'}
-    on:click={remove}
-    on:keydown={() => {
+    onclick={remove}
+    onkeydown={() => {
       return;
     }}
     role="button"
     tabindex="0"
   >
     {#if notification.description}
-      <!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
+      <!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
       <details
         open
         id="notification"
-        on:click|preventDefault={(event) => event.preventDefault()}
-        on:keydown={() => {
+        onclick={preventDefault((event) => event.preventDefault())}
+        onkeydown={() => {
           return;
         }}
       >