Skip to content

Stat ​

Displays a key metric with an optional trend and supporting description.

Import ​

ts
import { Stat } from '@astryx-vue/lab'

Props ​

NameTypeDefaultDescription
labelstringRequiredMetric name.
valuestringundefinedPreformatted primary value; the default slot takes precedence.
deltaStatDeltaundefinedTrend with value, direction, and optional sentiment.
descriptionstringundefinedSupporting text below the value.
size'sm' | 'md' | 'lg''md'Primary value size.

direction accepts 'up' | 'down' | 'flat'. Override the default color mapping with sentiment: 'positive' | 'negative' | 'neutral' when a downward trend is desirable.

Slots ​

NameDescription
DefaultCustom primary value content.
mediaA chart or other media below the metric.