StatisticCard
ProStatisticCard is a bordered or inset card shell for composing a label, value, and supporting content such as trend indicators, charts, or progress bars.
Loading preview
Installation
Add this component with the NateUI CLI.
Examples
Basic
Header
Footer
Inset
Inset Footer
With Chart
With Progress
API
| Prop | Description | Type | Default |
|---|---|---|---|
inset | Renders the muted outer frame with an inset body, instead of the plain bordered card. | boolean | false |
header | Content shown above the body, in its own bordered/padded region. | ReactNode | string | — |
footer | Content shown below the body, in its own bordered/padded region. | ReactNode | string | — |
bodyClass | Class names applied to the inner body. Only takes effect when inset is true. | string | — |
className | Class names applied to the outermost element. | string | — |
children | The card's main content. | ReactNode | — |
...rest | Native div props. | ComponentProps<'div'> | — |