Behive Tech Component Registry

Price

v0.1.0Draft

Formatted US dollars from an integer amount of cents, rendered in a data element with a plain decimal value, in three sizes.

pnpm add @behivetech/atoms.price

Formatted US dollars from an integer amount of cents, rendered in a data element with a plain decimal value, in three sizes.

Usage

Open in new tab

The ```jsx block above runs live on the docs site. Imports are stripped and every registry export is in scope, so you can compose with other components too.

Properties

Price props

PropTypeDefaultDescription
amountCents*number—The amount in cents, as an integer; other values are rounded
classNamestring—Additional class names to merge with the component root element
currency"USD"USDThe currency code; only USD is supported, so it defaults to USD until a second currency is added
localestringen-USBCP 47 locale the amount is formatted in; defaults to en-US so the server render and hydration match
size"sm" | "md" | "lg"mdControls the type size; defaults to md

Also accepts the native attributes of its root element (className, aria-*, event handlers, …).