34 lines
842 B
Svelte
34 lines
842 B
Svelte
<script lang="ts">
|
|
import { notify } from "../notifications";
|
|
import { fade } from "svelte/transition";
|
|
import type { Notification } from "../notifications";
|
|
|
|
let notifications: { [key: string]: Notification } = {};
|
|
|
|
notify.on("notification", (notif) => {
|
|
let id = Math.random();
|
|
notifications[id] = notif;
|
|
setTimeout(() => {
|
|
delete notifications[id];
|
|
notifications = notifications;
|
|
}, 5000);
|
|
});
|
|
|
|
const icons = {
|
|
"error": "exclamation-triangle"
|
|
}
|
|
</script>
|
|
|
|
{#each Object.values(notifications) as notification}
|
|
<div class="notification notification-{notification.level || "info"}" transition:fade>
|
|
<sl-icon name={icons[notification.level] || "bell"} />
|
|
{notification.content}
|
|
</div>
|
|
{/each}
|
|
|
|
<style scoped lang="scss">
|
|
.notification-error {
|
|
color: var(--error);
|
|
}
|
|
</style>
|