Basic Toast

Lightweight toast notifications with types and auto-dismiss.

Open in v0~1.1 kB

Last updated: March 7, 2026

Installation

npx smoothui-cli add basic-toast

Features

  • Support for success, error, warning, and info types
  • Configurable message, duration, and manual close
  • Portals-friendly and stackable design
  • Minimal styles for easy theming
  • Accessible announcements

Accessibility

Screen Reader

  • Each toast type (success, error, warning, info) displays a corresponding icon with semantic color for visual distinction
  • The close button allows manual dismissal of the notification

Reduced Motion

This component respects the prefers-reduced-motion media query via useReducedMotion from Motion. When reduced motion is preferred, the slide-in entrance and exit animations are disabled instantly.

Props

On this page

Created by

Powered by

lucide.dev
motion.dev