Description
ask-sonner is an agent skill that is a guide to Sonner, the React toast library, written by its author Emil Kowalski. It covers setting up Sonner, picking the right toast call, promise and loading toasts, updating and dismissing toasts, and styling them. The setup has two parts. A single Toaster is mounted once, as close to the root of the application as possible; in Next.js that is the root layout, and it works inside server components. And toast() is called from client code such as event handlers, effects and callbacks. It is a plain function that needs no hook or provider, but it does nothing on the server, so in a server action you return the result and call toast() in the client code that receives it. Exact prop names, types and defaults for the Toaster and toast() are in a separate API reference. Use it when you are wiring up Sonner in a React app or troubleshooting its toasts. It is part of the emilkowalski/skills repository on GitHub, which has about 46,200 stars. The listing shows it as free, and it has about 116,600 installs. Its security audits show passes from Gen Agent Trust Hub, Socket and Snyk.…
Highlights
- Setup of the Toaster at the root
- toast() calls from client code
- Promise and loading toasts
- Updating and dismissing toasts
- Works with Next.js server actions
Ratings & Reviews
No ratings yet
Be the first to rate ask-sonner.
People also visit
webapp-testing
Test local web applications using Playwright for UI verification and debugging
ask-sonner FAQ
Where should the Toaster be mounted?
Once, as close to the root as possible. In Next.js that is the root layout. Mounting it per page duplicates toasts.
Can I call toast() on the server?
No. It does nothing on the server, so return the result and call toast() in the client code that receives it.
Which toast types are covered?
Standard, promise and loading toasts, plus updating and dismissing them.
Where are the exact props?
In a separate API reference file that the skill points to.
How do I install it?
Run npx skills add https://github.com/emilkowalski/skills --skill ask-sonner.
What are the best ask-sonner alternatives?
Popular alternatives to ask-sonner include react-nextjs-development, senior-frontend and nextjs-developer. See all ask-sonner alternatives