Svelte Notifications

Overview:

The Svelte Notifications is a simple and flexible notifications system for Svelte 3. It provides a way to display notifications in your Svelte application with customizable options.

Features:

• Simple and flexible notifications system
• Custom notification component
• Ability to remove default styles
• Support for different positions and types of notifications
• Option to set a timeout for notification removal
• Convenient methods to manage notifications

Installation:

To install the Svelte Notifications, you can use the following steps:

1. Install the package via npm: npm install svelte-notifications

2. Import the necessary components in your Svelte file:

import { Notifications, getNotificationsContext } from 'svelte-notifications';

3. Use the Notifications component in your Svelte template:

<Notifications>
  <!-- your Svelte code here -->
</Notifications>

4. Access the notifications store and functions using the getNotificationsContext function:

const { addNotification, removeNotification, clearNotifications, subscribe } = getNotificationsContext();

5. Use the available functions to add, remove, clear, or subscribe to notifications:

// Add a notification
addNotification({
  text: 'This is a sample notification',
  position: 'bottom-right',
  type: 'success',
  removeAfter: 3000 // 3 seconds
});

// Remove a notification
removeNotification('notification-1');

// Clear all notifications
clearNotifications();

// Subscribe to notification changes
subscribe((notifications) => {
  console.log('Notifications:', notifications);
});

Summary:

Overall, the Svelte Notifications is a useful package for adding a notifications system to your Svelte application. It provides a simple and flexible way to display notifications with customizable options. By following the installation guide and utilizing the available functions, you can easily incorporate notifications into your Svelte project.