s-m-r-t
Open the s-m-r-t source on GitHub Switch to dark color scheme
← All UI components

Analytics · Components

StatCard

Single-metric card with label, value, optional trend and subtitle

Public export

typescript 
import { StatCard } from '@happyvertical/smrt-analytics/svelte';
Import path
@happyvertical/smrt-analytics/svelte
Props
5
Props described
5 of 5
Bindable state
0
Callback events
0
Verified release
0.44.0

Props

NameTypeRequiredDescription
labelstringYesDescriptive label displayed at the top of the card.
valuenumber | stringYesNumeric value or text displayed prominently.
trend'up' | 'down' | 'flat'NoDirection indicator: up, down, or flat growth.
trendPercentnumber | nullNoPercent change; null is a zero baseline shown as 'new', undefined hides the badge.
subtitlestringNoSecondary text displayed below the value.

Bindable state

This component has no bindable public state.

Callback events

This component declares no callback event props.

Examples and explanation

UI showcase Read the curated UI story for mechanism and usage guidance. smrt-analytics package reference See package status, version, limitations, and all public subpaths.