Components · Feedback
Toast
A ToastProvider/useToast pair that queues transient notices, maps severity to the correct aria-live politeness (critical is assertive, info and caution are polite), and pauses its auto-dismiss timer on hover.
Live in all three modes
Day · Night-NVG · Mono: one component, re-themed through the token layer.
Variants & states
- severity (info/caution/critical)
- duration / sticky (0 disables auto-dismiss)
- pause on hover
Tokens used
--semantic-color-surface-card--semantic-color-status-caution--semantic-color-status-critical--semantic-color-action-primary
Copy-paste
import { ToastProvider, useToast } from 'operator-components';
function AckButton() {
const { toast } = useToast();
return (
<button onClick={() => toast({ message: 'Link re-established.', severity: 'info' })}>
Reconnect
</button>
);
} Figma: library link coming soon. Gated until it's on sole-owned footing. (TODO: replace with the Community/library URL once published.)