Stat
data-displayKPI stat card with label, large value, trend direction indicator, and optional icon. Token-driven colors and typography.
Import
typescript
import { Stat } from "packages/ui/src";Props
StatProps
| Prop | Type | Required |
|---|---|---|
label | string | Yes |
value | string | number | Yes |
trend | StatTrend | No |
trendText | string | No |
icon | ReactNode | No |
Examples
Stat Cards
KPI stat cards with trend indicators for dashboards and metrics displays.
Dashboard Stats
Components
60+5 this sessionTokens
911+64 this sessionTests
435+40 this sessionDrift Score
100/100MaintainedTrend Directions
Revenue
$42K+12% from last monthBounce Rate
32%-5% from last weekUptime
99.9%StableMinimal (No Trend)
Active Users
1,247Projects
5Routes
62