Stat
@stellaria/nebula-webStatPropsPreview
Props
13| Prop | Type | Default |
|---|---|---|
align | "start" | "end" | "center" | "start" |
className | string | — |
color | ColorExtended | — |
description | ReactNode | — |
diff | ReactNode | — |
diffLabel | string | — |
icon | ReactNode | — |
label required | ReactNode | — |
reveal Animates it in when it first scrolls into view. `true` takes the catalogue entrance; an object tunes it — `index` staggers a list. It is declared here and forwarded to the root `Box` rather than inherited: `reveal` lives on `BoxOwnProps`, and most of the catalogue types its props over `StyleProps`, so nothing arrives on its own. | boolean | UseRevealOptions | — |
size | Size | "md" |
trend | StatTrend | — |
uppercase Whether the label is set in small caps with wide tracking. `false` keeps it in sentence case with the normal tracking, for products whose type never uses small caps (ADR-200). | boolean | true |
value required | ReactNode | — |
Slot props
7Each one spreads over an inner element, so you can restyle a region without forking the component.
| Prop | Type | Default |
|---|---|---|
descriptionProps The footer description. Only rendered with `description`. | TextSlotProps | — |
diffProps The change. Only rendered with `diff`, and it carries `data-trend`, which is where its colour comes from. The arrow and the screen-reader text live inside it and have no slot of their own. | TextSlotProps | — |
footProps The footer: change and description. Not rendered if both are missing. | BoxSlotProps | — |
headProps The header row: label and glyph. | BoxSlotProps | — |
iconProps The header glyph. Only rendered with `icon`, and it is `aria-hidden`. | BoxSlotProps | — |
labelProps The label, on the header row next to the glyph. | TextSlotProps | — |
valueProps The figure. Its size comes from `size`. | TextSlotProps | — |
Also accepts
On top of its own props, this component forwards these groups.