Components

MoneyText

An amount of money written exactly from minor units, in the Provider language.

Installation

MoneyText is in the @bigbang/ui package.

import { MoneyText } from '@bigbang/ui';

<MoneyText amount={123456n} />; // ₺1,234.56 in English

Outside components, formatMoney(amount, { locale, currency }) gives the same format and minorToDecimal(minor, digits) the exact decimal string.

amountRequired

Description: The amount in minor units (kuruş, cents) as a bigint or an integer string: 123456n is 1.234,56. Never a float.
Type: MinorUnits

currency

Description: ISO 4217 currency code; its fraction digits come from Intl (2 for TRY, 0 for JPY).
Type: string
Default: 'TRY'

display

Description: How the currency is written: narrowSymbol (₺), symbol, code (TRY), name or none.
Type: 'symbol' | 'narrowSymbol' | 'code' | 'name' | 'none'
Default: 'narrowSymbol'

currencyPosition

Description: Where the currency goes. Without it, ui.money.currency-position: after the number in Turkish ("1.234,56 ₺"), the locale pattern in English.
Type: 'locale' | 'start' | 'end'

signDisplay

Description: When the sign shows. tone="sign" switches it to exceptZero, so a credit reads "+".
Type: 'negative' | 'auto' | 'always' | 'exceptZero' | 'never'
Default: 'auto'

tone

Description: sign colours positive amounts success and negative ones danger; the sign is always written too.
Type: 'default' | 'subtle' | 'sign'
Default: 'default'

size

Description: Text size: body small and medium, heading small and extra large.
Type: 'sm' | 'md' | 'lg' | 'xl'
Default: 'md'

fraction

Description: subtle sets the decimal separator and fraction smaller and lighter.
Type: 'default' | 'subtle'
Default: 'default'

compact

Description: Short compact notation, such as "1,2 Mn ₺", for charts and summaries. Never for an amount the user acts on.
Type: boolean
Default: false

hidden

Description: Replaces the amount with "••••" and the currency, for a balance the user has hidden. The amount is then nowhere in the page (text, title, aria-* or data-*), and screen readers hear "Tutar gizli" ("Amount hidden"). The show and hide toggle is app state.
Type: boolean
Default: false

className