Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-currency-input-field

Package Overview
Dependencies
Maintainers
1
Versions
105
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-currency-input-field - npm Package Compare versions

Comparing version 3.4.2 to 3.4.3

17

dist/index.esm.js

@@ -335,5 +335,2 @@ import React, { forwardRef, useMemo, useState, useRef, useEffect } from 'react';

var _b = _a.allowDecimals, allowDecimals = _b === void 0 ? true : _b, _c = _a.allowNegativeValue, allowNegativeValue = _c === void 0 ? true : _c, id = _a.id, name = _a.name, className = _a.className, customInput = _a.customInput, decimalsLimit = _a.decimalsLimit, defaultValue = _a.defaultValue, _d = _a.disabled, disabled = _d === void 0 ? false : _d, userMaxLength = _a.maxLength, userValue = _a.value, onValueChange = _a.onValueChange, fixedDecimalLength = _a.fixedDecimalLength, placeholder = _a.placeholder, decimalScale = _a.decimalScale, prefix = _a.prefix, suffix = _a.suffix, intlConfig = _a.intlConfig, step = _a.step, min = _a.min, max = _a.max, _e = _a.disableGroupSeparators, disableGroupSeparators = _e === void 0 ? false : _e, _f = _a.disableAbbreviations, disableAbbreviations = _f === void 0 ? false : _f, _decimalSeparator = _a.decimalSeparator, _groupSeparator = _a.groupSeparator, onChange = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, props = __rest(_a, ["allowDecimals", "allowNegativeValue", "id", "name", "className", "customInput", "decimalsLimit", "defaultValue", "disabled", "maxLength", "value", "onValueChange", "fixedDecimalLength", "placeholder", "decimalScale", "prefix", "suffix", "intlConfig", "step", "min", "max", "disableGroupSeparators", "disableAbbreviations", "decimalSeparator", "groupSeparator", "onChange", "onFocus", "onBlur", "onKeyDown", "onKeyUp"]);
if (_decimalSeparator && _groupSeparator && _decimalSeparator === _groupSeparator) {
throw new Error('decimalSeparator cannot be the same as groupSeparator');
}
if (_decimalSeparator && isNumber(_decimalSeparator)) {

@@ -348,2 +345,8 @@ throw new Error('decimalSeparator cannot be a number');

var groupSeparator = _groupSeparator || localeConfig.groupSeparator || '';
if (decimalSeparator &&
groupSeparator &&
decimalSeparator === groupSeparator &&
disableGroupSeparators === false) {
throw new Error('decimalSeparator cannot be the same as groupSeparator');
}
var formatValueOptions = {

@@ -366,5 +369,5 @@ decimalSeparator: decimalSeparator,

};
var formattedStateValue = defaultValue !== undefined
var formattedStateValue = defaultValue !== undefined && defaultValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: decimalScale, value: String(defaultValue) }))
: userValue !== undefined
: userValue !== undefined && userValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: decimalScale, value: String(userValue) }))

@@ -432,3 +435,3 @@ : '';

setCursor(stateValue.length);
var currentValue = parseFloat(userValue !== undefined
var currentValue = parseFloat(userValue !== undefined && userValue !== null
? String(userValue).replace(decimalSeparator, '.')

@@ -474,3 +477,3 @@ : cleanValue(__assign({ value: stateValue }, cleanValueOptions))) || 0;

}, [stateValue, cursor, inputRef, dirty]);
var formattedPropsValue = userValue !== undefined
var formattedPropsValue = userValue !== undefined && userValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: dirty ? undefined : decimalScale, value: String(userValue) }))

@@ -477,0 +480,0 @@ : undefined;

@@ -343,5 +343,2 @@ (function (global, factory) {

var _b = _a.allowDecimals, allowDecimals = _b === void 0 ? true : _b, _c = _a.allowNegativeValue, allowNegativeValue = _c === void 0 ? true : _c, id = _a.id, name = _a.name, className = _a.className, customInput = _a.customInput, decimalsLimit = _a.decimalsLimit, defaultValue = _a.defaultValue, _d = _a.disabled, disabled = _d === void 0 ? false : _d, userMaxLength = _a.maxLength, userValue = _a.value, onValueChange = _a.onValueChange, fixedDecimalLength = _a.fixedDecimalLength, placeholder = _a.placeholder, decimalScale = _a.decimalScale, prefix = _a.prefix, suffix = _a.suffix, intlConfig = _a.intlConfig, step = _a.step, min = _a.min, max = _a.max, _e = _a.disableGroupSeparators, disableGroupSeparators = _e === void 0 ? false : _e, _f = _a.disableAbbreviations, disableAbbreviations = _f === void 0 ? false : _f, _decimalSeparator = _a.decimalSeparator, _groupSeparator = _a.groupSeparator, onChange = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, props = __rest(_a, ["allowDecimals", "allowNegativeValue", "id", "name", "className", "customInput", "decimalsLimit", "defaultValue", "disabled", "maxLength", "value", "onValueChange", "fixedDecimalLength", "placeholder", "decimalScale", "prefix", "suffix", "intlConfig", "step", "min", "max", "disableGroupSeparators", "disableAbbreviations", "decimalSeparator", "groupSeparator", "onChange", "onFocus", "onBlur", "onKeyDown", "onKeyUp"]);
if (_decimalSeparator && _groupSeparator && _decimalSeparator === _groupSeparator) {
throw new Error('decimalSeparator cannot be the same as groupSeparator');
}
if (_decimalSeparator && isNumber(_decimalSeparator)) {

@@ -356,2 +353,8 @@ throw new Error('decimalSeparator cannot be a number');

var groupSeparator = _groupSeparator || localeConfig.groupSeparator || '';
if (decimalSeparator &&
groupSeparator &&
decimalSeparator === groupSeparator &&
disableGroupSeparators === false) {
throw new Error('decimalSeparator cannot be the same as groupSeparator');
}
var formatValueOptions = {

@@ -374,5 +377,5 @@ decimalSeparator: decimalSeparator,

};
var formattedStateValue = defaultValue !== undefined
var formattedStateValue = defaultValue !== undefined && defaultValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: decimalScale, value: String(defaultValue) }))
: userValue !== undefined
: userValue !== undefined && userValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: decimalScale, value: String(userValue) }))

@@ -440,3 +443,3 @@ : '';

setCursor(stateValue.length);
var currentValue = parseFloat(userValue !== undefined
var currentValue = parseFloat(userValue !== undefined && userValue !== null
? String(userValue).replace(decimalSeparator, '.')

@@ -482,3 +485,3 @@ : cleanValue(__assign({ value: stateValue }, cleanValueOptions))) || 0;

}, [stateValue, cursor, inputRef, dirty]);
var formattedPropsValue = userValue !== undefined
var formattedPropsValue = userValue !== undefined && userValue !== null
? formatValue(__assign(__assign({}, formatValueOptions), { decimalScale: dirty ? undefined : decimalScale, value: String(userValue) }))

@@ -485,0 +488,0 @@ : undefined;

{
"name": "react-currency-input-field",
"version": "3.4.2",
"version": "3.4.3",
"description": "React <input/> component for formatting currency and numbers.",

@@ -73,3 +73,3 @@ "files": [

"lint-staged": "^11.0.0",
"parcel": "^2.0.0-beta.2",
"parcel": "^2.0.0-rc.0",
"prettier": "^2.3.0",

@@ -76,0 +76,0 @@ "react": "^17.0.2",

@@ -16,4 +16,4 @@ # React Currency Input Field Component

- [Intl Locale Config](#intl-locale-config)
- [Decimal Scale and Decimals Limit](#decimal-scale-and-decimals-limit)
- [Fixed Decimal Length](#fixed-decimal-length)
- [Decimal Scale and Decimals Limit](#decimal-scale-and-decimals-limit)
- [Format values for display](#format-values-for-display)

@@ -76,23 +76,23 @@ - [v3.0.0 Release Notes](#v300-release-notes)

| Name | Type | Default | Description |
| ---------------------- | ---------- | -------------- | ---------------------------------------------------------------------------------------------- |
| allowDecimals | `boolean` | `true` | Allow decimals |
| allowNegativeValue | `boolean` | `true` | Allow user to enter negative value |
| defaultValue | `number` | | Default value |
| value | `number` | | Programmatically set the value |
| onValueChange | `function` | | Handle change in value |
| placeholder | `string` | | Placeholder if no value |
| decimalsLimit | `number` | `2` | Limit length of decimals allowed |
| decimalScale | `number` | | Specify decimal scale for padding/trimming eg. 1.5 -> 1.50 or 1.234 -> 1.23 if decimal scale 2 |
| fixedDecimalLength | `number` | | Value will always have the specified length of decimals |
| prefix | `string` | | Include a prefix eg. £ or \$ |
| suffix | `string` | | Include a suffix eg. € or % |
| decimalSeparator | `string` | locale default | Separator between integer part and fractional part of value |
| groupSeparator | `string` | locale default | Separator between thousand, million and billion |
| intlConfig | `object` | | International locale config |
| disabled | `boolean` | `false` | Disabled |
| disableAbbreviations | `boolean` | `false` | Disable abbreviations eg. 1k -> 1,000, 2m -> 2,000,000 |
| disableGroupSeparators | `boolean` | `false` | Disable auto adding the group separator between values, eg. 1000 -> 1,000 |
| maxLength | `number` | | Maximum characters the user can enter |
| step | `number` | | Incremental value change on arrow down and arrow up key press |
| Name | Type | Default | Description |
| -------------------------------------------------- | ---------- | -------------- | ---------------------------------------------------------------------------------------------- |
| allowDecimals | `boolean` | `true` | Allow decimals |
| allowNegativeValue | `boolean` | `true` | Allow user to enter negative value |
| defaultValue | `number` | | Default value |
| value | `number` | | Programmatically set the value |
| onValueChange | `function` | | Handle change in value |
| placeholder | `string` | | Placeholder if no value |
| [decimalsLimit](#decimal-scale-and-decimals-limit) | `number` | `2` | Limit length of decimals allowed |
| [decimalScale](#decimal-scale-and-decimals-limit) | `number` | | Specify decimal scale for padding/trimming eg. 1.5 -> 1.50 or 1.234 -> 1.23 if decimal scale 2 |
| [fixedDecimalLength](#fixed-decimal-length) | `number` | | Value will always have the specified length of decimals |
| [prefix](#prefix-and-suffix) | `string` | | Include a prefix eg. £ or \$ |
| [suffix](#prefix-and-suffix) | `string` | | Include a suffix eg. € or % |
| [decimalSeparator](#separators) | `string` | locale default | Separator between integer part and fractional part of value |
| [groupSeparator](#separators) | `string` | locale default | Separator between thousand, million and billion |
| [intlConfig](#intl-locale-config) | `object` | | International locale config |
| disabled | `boolean` | `false` | Disabled |
| disableAbbreviations | `boolean` | `false` | Disable abbreviations eg. 1k -> 1,000, 2m -> 2,000,000 |
| [disableGroupSeparators](#separators) | `boolean` | `false` | Disable auto adding the group separator between values, eg. 1000 -> 1,000 |
| maxLength | `number` | | Maximum characters the user can enter |
| step | `number` | | Incremental value change on arrow down and arrow up key press |

@@ -165,2 +165,24 @@ ### Abbreviations

### Decimal Scale and Decimals Limit
`decimalsLimit` and `decimalScale` sound similar but have different usages.
`decimalsLimit` prevents the user from typing more than the limit, and `decimalScale` will format the decimals `onBlur` to the specified length, padding or trimming as necessary.
Example:
```md
If decimalScale is 2
- 1.5 becomes 1.50 (padded)
- 1.234 becomes 1.23 (trimmed)
---
If decimalLimit is 2
- User enters 1.23
- User is then prevented from entering another value
```
### Fixed Decimal Length

@@ -181,8 +203,2 @@

## Decimal Scale and Decimals Limit
`decimalsLimit` and `decimalScale` are similar, the difference is `decimalsLimit` prevents the user from typing more than the limit, and `decimalScale` will format the decimals `onBlur` to the specified length, padding or trimming as necessary.
Example: If decimal scale `2`: `1.5` becomes `1.50` and `1.234` becomes `1.23`
## Format values for display

@@ -189,0 +205,0 @@

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc