Overview:
Moon-Toast is a SolidJS library for creating customizable toast notifications. It uses the SolidJS context API for scope management and provides a variety of options for styling, positioning, and controlling toast behavior.
Features:
🔨 Customizable Toasts: Modify appearance, position, and animations.
🛠️ Context API: Encapsulates toast functionality.
⚙️ Advanced Controls: Methods for notifying, dismissing, updating, removing, and custom toasts.
🗝️ Progress Bar: Customizable look and controls.
Details:
Moon-Toast allows developers to integrate toast notifications into SolidJS applications easily.
Toasts can be customized with JSX, and their behavior can be controlled through various options, including automatic overflow prevention and pause on hover.
Installation:
# Yarn
$ yarn add solid-moon-toast
# NPM
$ npm install solid-moon-toast
# PNPM
$ pnpm install solid-moon-toast
Basic Usage:
import { ToastProvider } from 'solid-moon-toast';
import "solid-moon-toast/dist/index.css";
const App = () => (
<ToastProvider>
<ToastsPage />
</ToastProvider>
);Use Cases:
- User notifications for successful operations
- Error messages
- Informational alerts
Preview:
