Toast
Brief notification messages
Preview
Interactive preview of the Toast component
Toast component requires the Toaster component and useToast hook. See documentation for usage.
Usage Guidelines
When to use
- Use toast components when you need to display or organize content
- Consider using toast for structured content presentation
Best practices
- Maintain consistent styling across similar toast components
- Ensure proper labeling and accessibility attributes
- Use appropriate variants for different contexts and purposes
Accessibility
The Toast component follows accessibility best practices:
- Uses semantic HTML elements when appropriate
- Supports keyboard navigation
- Includes proper ARIA attributes
- Maintains sufficient color contrast
Used On Pages
The Toast component is used on the following pages: