@growth-ui/currency-input

Growth UI

React Currency Input Field Component

Install

npm install @growth-ui/currency-input

or

yarn add @growth-ui/currency-input

Usage

import CurrencyInput from ' @growth-ui/currency-input';

<CurrencyInput
  defaultValue={0}
  fixed={2}
  onChange={(value, props) => console.log(value, props)}
/>;

Props

Name	Type	Default	Description
basic	boolean	false	An input can be just pure html input look and feel.
compact	boolean	false	An input can reduce its padding to fit into tighter spaces.
decimalsLimit	number	2	Limit length of decimals allowed.
defaultValue	number		Default value.
error	boolean		An Input field can show the data contains errors.
fixed	number		Value will always have the specified length of decimals.
focus	boolean		An input field can show a user is currently interacting with it.
onBlur	func		Called on blur.
onChange	func		Called on change.
onFocus	func		Called on focus.
placeholder	string		Placeholder if no value
prefix	string		An input can be descriptive. e.g) $
separators	boolean		An input can format number with commas as thousands separators.
size	number		An input can have different sizes.
value	number		An input value.

Prefix

You can add a prefix or suffix by passing in prefix or suffix.

import CurrencyInput from ' @growth-ui/currency-input';

<CurrencyInput prefix="£" value={123} />;
// £123

For more examples and interactions, visit growth-ui-react.

Looking for UI library?

Check out our react ui library Growth-UI-React.

Check out our native ui library Growth-UI-Native.

Credit

Created by @kyuhakyuk.