Stat
Stat is the metric-summary widget.
Use it when one value deserves emphasis but still needs a label and possibly a short explanation. It works well in dashboards, sidebars, billing summaries, and health indicators.
Example
use fission::prelude::*;
let widget: Widget = Stat {
label: "Open issues".into(),
value: view.state().open_issue_count.to_string(),
help_text: Some("Updated 2 minutes ago".into()),
}
.into();
Field table
Field | Type | Meaning | Notes / default behavior |
|---|---|---|---|
label | String | Small explanatory label above the value. | Required. |
value | String | Main emphasized value. | Required. Format numbers, currency, or percentages upstream. |
help_text | Option<String> | Extra context below the value. | Defaults to None. |
Specific advice
Keep the value itself clean and short. If the user must parse a whole sentence to understand the metric, a stat is probably the wrong presentation.
Production checklist
For Stat, review the fields that change behavior before treating the widget as finished: label, value, help_text. The goal is to make the product rule visible in state and actions, not hidden inside ad-hoc construction code.
•
If this widget appears inside an interactive flow, keep the surrounding action binding in the parent component and test that the flow still has one clear reducer path.
•
Check the semantics tree for the user-facing label or role that makes this widget understandable without relying only on pixels.
•
Add at least one component or harness test that confirms the visible text, semantic role, action dispatch, and layout constraint that matter for this widget in context.
If a screen starts repeating the same Stat setup, extract a named component around this widget. That keeps the reference API small while making product code easier to read and safer for generated code to copy.
Related
Badge, Card, Text, and CircularProgress.