all repos — kōi @ main

Minimalist task manager

src/lib/components/Toast.svelte (view raw)

 1<script lang="ts">
 2  import { removeToast, type Toast } from "../store/toastStore";
 3
 4  const TOAST_TIME = 4000;
 5
 6  let { toast }: { toast: Toast } = $props();
 7
 8  setTimeout(() => {
 9    removeToast(toast.id);
10  }, TOAST_TIME);
11
12  const colorNames = {
13    info: "alert-info",
14    error: "alert-error",
15    success: "alert-success",
16    warning: "alert-warning",
17  };
18</script>
19
20<button
21  class={`alert ${colorNames[toast.type]} min-w-40`}
22  onclick={() => removeToast(toast.id)}
23>
24  <span>{toast.message}</span>
25</button>