ProgressCard
ProgressCard — Prism component.
Signature
Density
Viewport
Theme follows the navbar ☀/☾ toggleWhen to use
ProgressCard — Prism component.
Accessibility
When the whole card is actionable, expose a single accessible name and make it reachable with Tab + Enter. Decorative imagery uses empty alt.
Import
const { ProgressCard } = window.PrismDesignSystem_39d121;
Props
| Prop | Type | Required | Description |
|---|---|---|---|
title | React.ReactNode | — | |
subtitle | React.ReactNode | — | |
value | number | — | |
max | number | — | |
tone | "accent" | "positive" | "notice" | "negative" | — | |
showPercent | boolean | — | Show the % figure top-right. Default true. |
bar | React.ReactNode | — | Supply a custom ProgressBar/node; otherwise one is rendered from value/max. |
actions | React.ReactNode | — | |
className | string | — |