Components · Mobile only · Inputs
Expressive Money Input
AlphaiOS & Android
The big amount on a send-money screen; pair with NumericKeypad.
Usage
@nexub/react-nativeWeb: MoneyInput
import { ExpressiveMoneyInput } from '@nexub/react-native';
<ExpressiveMoneyInput label="Amount" currency="SGD" value={v} onValueChange={setV} caption="Balance S$2,400" />Interactive preview of @nexub/react-native rendered for the web. Native chrome (switches, pickers, Liquid Glass) looks like the platform on a device.
On device
iPhone (iOS simulator)
Pixel (Android emulator)
Screenshots from the latest CI run of the showcase app; the live frame renders the same code for the web.
ExpressiveMoneyInput props
| Prop | Type | Default | Description |
|---|---|---|---|
| currencyrequired | string | — | — |
| value | number | null | — | — |
| onValueChange | (value: number | null) => void | — | — |
| labelrequired | string | — | Accessible name, e.g. "Amount to send". |
| locale | string | — | — |
| caption | string | — | Shown under the amount, e.g. "Balance $1,240.00" or an error. |
| error | boolean | — | — |
| style | StyleProp<ViewStyle> | — | — |