FeedbackLiquid Glass
Toast
Transient Liquid Glass notifications with imperative API and stacking. Preview live, copy the source, or install with the CLI into your Next.js project.
Install
npx @intellihelper/cli@latest add toastImperative toasts
Mount Toaster once, then call toast() from anywhere.
Actions & promises
Undo actions, loading → success updates, and toast.promise.
Positions
Six viewport anchors — top/bottom × left/center/right.
Static surfaces
Compose Toast primitives without the imperative store.
About this component
Toast is part of Feedback. Transient Liquid Glass notifications with imperative API and stacking.
Install with npx @intellihelper/cli@latest add toast. Files land in your project so you can customize styles, variants, and behavior without a locked package.
Prefer AI-assisted install? Use the agent plugin or the MCP server.
When to use Toast
Use when
- Use Toast when transient Liquid Glass notifications with imperative API and stacking.
- Status, progress, toasts, badges, alerts, and spinners.
- Non-blocking confirmation that an action succeeded or failed.
Avoid when
- Permanent page content (use surfaces or typography).
- Errors that block progress without an inline form message.
Accessibility notes
- Toasts and alerts should use appropriate roles (status/alert) without over-notifying.
- Progress indicators need accessible names for screen readers.
Interactive primitives build on accessible patterns (including Radix where applicable). Always verify focus order and contrast on your mesh or product background.
Composition tips
- Use toast for transient success; alert for persistent page-level issues.
- Badges annotate; they should not be the only interactive control.