The CurrencyInput component allows a user to enter a monetary value that will be auto-formatted to match a particular currency, such as pounds sterling, euros, dollars, etc.

For more information on how to use the features and props for this component, check out the developer documentation.

To learn more about configuration, visit Pega Community.

The formatting for the value entered within the CurrencyInput (e.g., separators, decimals), as well as any numerical formatting necessary for a particular locale, will be applied as a user types. You can configure the locale of your application via the Configuration component.

The CurrencyInput component is built on top of the NumberInput and thus shares certain props such as step, unitPlacement, and min and max. The component will only allow a user to enter numerical data and any other characters will be ignored.

There are a variety of formatting options for the CurrencyInput component that enable you to show decimals, show group separators, and show the currency symbol. The component also allows for standard Form field structures such as being set required, disabled, or readOnly, as well as including a label, status, or info.

alwaysShowISOCodebooleanfalse Always show ISO code
currencyISOCodestringThree letter currency shorthand ISO code. If not provided or invalid, component renders as NumberInput
onBlur(value: string) => voidCallback fired when the component loses focus.
onFocus(value: string) => voidCallback fired when the component gets focus