Skip to content
Data Display

Stat

client21.25 kB
@stellaria/nebula-webStatProps

Preview

Props

11
PropTypeDefault

align

"start" | "end" | "center""start"

className

string

color

ColorExtended

description

ReactNode

diff

ReactNode

diffLabel

string

icon

ReactNode

label

required
ReactNode

size

Size"md"

trend

StatTrend

value

required
ReactNode

Slot props

7

Each one spreads over an inner element, so you can restyle a region without forking the component.

PropTypeDefault

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.

Style props · 126