Components · Feedback
Alert / AlertStack
A badged alert (and stackable AlertStack) with a priority level (P1–P3) shown as a glyph and code, so severity reads without relying on colour. Detail wraps without clipping.
Live in all three modes
Day · Night-NVG · Mono — one component, re-themed through the token layer.
Link lost
Primary datalink dropped — failover engaged.
Signal degraded
CH 12 SNR below threshold.
Track update
14 tracks held on COP.
Link lost
Primary datalink dropped — failover engaged.
Signal degraded
CH 12 SNR below threshold.
Track update
14 tracks held on COP.
Link lost
Primary datalink dropped — failover engaged.
Signal degraded
CH 12 SNR below threshold.
Track update
14 tracks held on COP.
Variants & states
- severity: critical / caution / info
- stacked (AlertStack)
- dismissible
Tokens used
--semantic-color-status-critical--semantic-color-status-caution--semantic-color-surface-card--semantic-color-text-primary
Copy-paste
import { AlertStack } from 'operator-components';
<AlertStack items={[
{ id: '1', severity: 'critical', title: 'Link lost', detail: 'Failover engaged.' },
]} /> Figma: library link coming soon — gated until it's on sole-owned footing. (TODO: replace with the Community/library URL once published.)