Beta
Amount
Money-formatting family — Fiat, Crypto and Percent agree on symbol placement, precision, abbreviation and sign colouring, so every number in a screen reads the same.
Amount
Money-formatting family — Fiat, Crypto and Percent agree on symbol placement, precision, abbreviation and sign colouring, so every number in a screen reads the same.
When to use it
Use this everywhere money appears in a product, so precision, symbol placement and sign colour are decided once rather than per screen. Consistency here is what stops a dashboard reading as several products stitched together.
Install
Adds Amount and its dependencies to your project through the shadcn CLI.
$ npx shadcn@latest add https://www.ssicevs.com/r/amount.jsonProps · FiatAmount
| Prop | Type | Default |
|---|---|---|
| value | number | — |
| abbr? | booleanCollapse large values to K / M / B / T. | — |
| dp? | numberDecimal places (sub-cent values still widen to 4). | — |
| symbol? | string | — |
| muted? | booleanRender in the muted ink instead of the primary one. | — |
Generated from the component source. Run npm run props:extract after changing a signature.