Toasts

import { Toaster, toast } from 'scrollsheet';
import 'scrollsheet/toast.css';

// mount once, anywhere
<Toaster />;

// fire from any code, component or not
toast('Saved to your list');
toast.success('Synced', { description: 'Two seconds ago.' });
toast('Archived', { action: { label: 'Undo', onClick: restore } });

toast() and <Toaster> are part of the package, on their own primitives: a persistent element per toast, all six positions with per-toast override, stacking that hides overflow instead of dismissing it, and 2-axis swipe-to-dismiss. toast.promise(), useToasts(), classNames, and per-type icons are all there; the API reference lists the full surface.

Toast

Full source on GitHub ↗

Fire a few. They stack, self-dismiss, and swipe away.

Coming from Sonner? The API matches it, so the migration is the import line:

import { toast, Toaster } from 'sonner';
import { toast, Toaster } from 'scrollsheet';

Migrate from SonnerWhat carries over unchanged, the sonner-* CSS names that keep working, and the documented v1 gaps.