Status & Feedback
Toasts, alerts, progress indicators, and spinners.
Toast
Non-blocking notifications for transient feedback. Auto-dismisses by duration.
AcrossUI.showToast({
title: 'Notification',
message: 'This is a toast message.'
});
AcrossUI.showToast({ type: 'success', title: 'Saved', message: 'Your changes have been saved.' });
AcrossUI.showToast({ title: 'Custom', message: 'Top-right, 8s', position: 'top-right', duration: 8000 });Sonner
An opinionated toast component for React, now ported to Vanilla JS. Features stacking, swipe to dismiss, and rich content.
AcrossUI.showSonner('Event created', {
description: 'Sunday, December 03, 2023 at 9:00 AM',
type: 'success' // or 'error', 'info'
});Alert
Persistent message containers for info, success, warnings, and errors plus banner variant.
Information
This is an informational alert for general notices.
Success
Your changes have been saved successfully.
Warning
This action will affect all team members.
Error
Unable to save changes. Please try again.
Banner Variant
Full-width banners for global announcements at the top of the page.
<div class="across-alert across-alert--info">...</div>
<!-- Variants: --info, --success, --warning, --error -->
<div class="across-banner across-banner--brand">...</div>Progress
Progress bars for uploads, tasks, and system health with success and warning states.
Spinner
Lightweight loading indicator for async states. Available in sizes and accent colors.