DeadlineCountdown
Real-time deadline countdown. Transitions color from validation → caution → agency as deadline approaches. Supports critical threshold configuration.
import { DeadlineCountdown } from "@danagraph/design-system/patterns"Props
| Prop | Type | Default | Description |
|---|---|---|---|
deadlinereq | string | — | ISO timestamp of the deadline. |
label | string | — | Label prefix (default: Due). |
criticalThresholdMs | number | — | Milliseconds before deadline to show critical state (default: 3600000 = 1h). |
showSeconds | boolean | — | Include seconds in countdown (default: false). |
deadlinerequiredstringDefault —ISO timestamp of the deadline.
labelstringDefault —Label prefix (default: Due).
criticalThresholdMsnumberDefault —Milliseconds before deadline to show critical state (default: 3600000 = 1h).
showSecondsbooleanDefault —Include seconds in countdown (default: false).
This component was designed to express:
Explore Related
Localized relative timestamp that updates in real time. Shows '2 min ago', 'just now', etc. with a tooltip showing the absolute ISO time.
Time-based scale showing recency and freshness
Chronological log of agent actions with status filtering
Time-grid schedule view with columns (agents/pipelines) and rows (time slots). Tasks displayed as colored blocks with status-mapped outcome tokens.