Svelte library for displaying notifications.
src/routes/+layout.svelte
<script lang="ts">
import { NotifHost } from 'opensveltenotif';
</script>
<NotifHost />
src/routes/+page.svelte
<script lang="ts">
import { addNotification, Notification, NotificationType } from 'opensveltenotif';
const pushNotification = () => addNotification(new Notification('Title','*Description* with **markdown**', NotificationType.Info, 5000, true));
</script>
<button on:click={pushNotification}>Click Me</button>
All of the below are direct exports of the package.
addNotification(notification: Notification): void
Adds a notification to the notification queue.
removeNotification(id: string): void
Removes a notification from the notification queue.
You can get the id of a notification from the id
property of the notification object.
new Notification(title: string, description: string, type: NotificationType, duration?: number, dismissable?: boolean, actions?: NotificationAction[])
Creates a new notification.
enum NotificationType {
Info = 'info',
Success = 'success',
Warning = 'warning',
Error = 'error',
}
The type of notification.
type Callback = (action: NotificationAction, notification: INotification) => boolean | void
A callback for a notification action.
registerCallback(name: string, callback: Callback): void
Registers a callback for a notification action.
type NotificationAction = {
/** Action Callback Name */
callback?: string,
/** Action Name */
name: string,
/** Metadata */
metadata?: any,
}
An action that can be added to a notification.
This is heavily based on the notification system implemented in Moon Client's Launcher by myself.