react-currency-input
Advanced tools
Comparing version 1.3.0 to 1.3.1
@@ -76,2 +76,3 @@ 'use strict'; | ||
delete customProps.onChange; | ||
delete customProps.onChangeEvent; | ||
delete customProps.value; | ||
@@ -78,0 +79,0 @@ delete customProps.decimalSeparator; |
{ | ||
"name": "react-currency-input", | ||
"version": "1.3.0", | ||
"version": "1.3.1", | ||
"description": "React component for inputing currency amounts", | ||
@@ -5,0 +5,0 @@ "main": "lib/index.js", |
# react-currency-input | ||
An es6 react component for currency. Supports custom decimal and thousand separators as well as precision. | ||
An ES2015 react component for currency. Supports custom decimal and thousand separators as well as precision. | ||
[![Build Status](https://travis-ci.org/jsillitoe/react-currency-input.svg?branch=master)](https://travis-ci.org/jsillitoe/react-currency-input) | ||
## Changes | ||
V1.3.0: | ||
------- | ||
* Depecrated "onChange" option in favor of "onChangeEvent". This fixes the argument order to better match React's default input handling | ||
* Updated dependencies to React 15 | ||
* Added parseFloat polyfill | ||
* Persist events to deal with an issue of event pooling | ||
* Other bug fixes. | ||
## v1.3.0: | ||
- Deprecated "onChange" option in favor of "onChangeEvent". This fixes the argument order to better match React's default input handling | ||
- Updated dependencies to React 15 | ||
- Added parseFloat polyfill | ||
- Persist events to deal with an issue of event pooling | ||
- Other bug fixes. | ||
## Installation | ||
``` | ||
@@ -23,5 +23,4 @@ npm install react-currency-input --save | ||
## Integration | ||
## Integration | ||
You can store the value passed in to the change handler in your state. | ||
@@ -37,3 +36,3 @@ | ||
}, | ||
handleChange(event, maskedvalue, floatvalue){ | ||
@@ -53,5 +52,4 @@ this.setState({amount: maskedvalue}); | ||
You can also assign a reference then access the value using a call to getMaskedValue(). | ||
You can also assign a reference then access the value using a call to getMaskedValue() | ||
```javascript | ||
@@ -77,8 +75,6 @@ import React from 'react' | ||
## Separators and Precision | ||
Specify custom decimal and thousand separators: | ||
Specify custom decimal and thousand separators: | ||
```javascript | ||
@@ -90,2 +86,3 @@ // 1.234.567,89 | ||
Specify a specific precision: | ||
```javascript | ||
@@ -101,6 +98,6 @@ // 123,456.789 | ||
## Currency | ||
Optionally set a currency symbol as a prefix or suffix | ||
```javascript | ||
@@ -116,4 +113,4 @@ // $1,234,567.89 | ||
Negative signs come before the prefix | ||
Negative signs come before the prefix | ||
```javascript | ||
@@ -124,7 +121,4 @@ // -$20.00 | ||
All other attributes are applied to the input element. For example, you can integrate bootstrap styling: | ||
All other attributes are applied to the input element. For example, you can integrate bootstrap styling: | ||
```javascript | ||
@@ -134,24 +128,18 @@ <CurrencyInput className="form-control" /> | ||
## Options | ||
Option | Default Value | Description | ||
----------------- | ------------- | ----------------------------------------------------------------------------- | ||
value | 0 | The initial currency value | ||
onChange | n/a | Callback function to handle value changes. Deprecated, use onChangeEvent. | ||
onChangeEvent | n/a | Callback function to handle value changes | ||
precision | 2 | Number of digits after the decimal separator | ||
decimalSeparator | '.' | The decimal separator | ||
thousandSeparator | ',' | The thousand separator | ||
inputType | "text" | Input field tag type. You may want to use `number` or `tel`* | ||
allowNegative | false | Allows negative numbers in the input | ||
allowEmpty | false | If no `value` is given, defines if it starts as null (`true`) or '' (`false`) | ||
prefix | '' | Currency prefix | ||
suffix | '' | Currency suffix | ||
| Option | Default Value | Description | | ||
| ------------- | ----------- | ----------- | | ||
| value | 0 | The initial currency value | | ||
| onChange | n/a | Callback function to handle value changes. Deprecated, use onChangeEvent. | | ||
| onChangeEvent | n/a | Callback function to handle value changes | | ||
| precision | 2 | Number of digits after the decimal separator | | ||
| decimalSeparator | '.' | The decimal separator | | ||
| thousandSeparator | ',' | The thousand separator | | ||
| inputType | "text" | Input field tag type. You may want to use `number` or `tel`* | | ||
| allowNegative | false | Allows negative numbers in the input | | ||
| allowEmpty | false | If no `value` is given, defines if it starts as null (`true`) or '' (`false`) | | ||
| prefix | '' | Currency prefix | | ||
| suffix | '' | Currency suffix | | ||
__*Note:__ Enabling any mask-related features such as prefix, suffix or separators | ||
with an inputType="number" or "tel" could trigger errors. Most of those characters | ||
would be invalid in such input types. | ||
***Note:** Enabling any mask-related features such as prefix, suffix or separators with an inputType="number" or "tel" could trigger errors. Most of those characters would be invalid in such input types. |
133043
359
137