diff --git a/CHANGELOG.md b/CHANGELOG.md
index d1fc7f80..aa64d285 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,17 @@
## Unreleased
+## [1.10.0] - 2019-01-06
+
+### Added
+
+- Credit Card Mask: adding support for `diners` and `amex`. (Thanks to [Marin Bezhanov](https://github.com/mbezhanov))
+
+### Fix
+
+- [#107](https://github.com/benhurott/react-native-masked-text/issues/107): Props missing - TypeScript map out of date.
+- [#115](https://github.com/benhurott/react-native-masked-text/issues/115): setNativeProps is not a function
+
## [1.9.2] - 2018-10-06
### Fixed
diff --git a/README.md b/README.md
index 37900f58..64196711 100644
--- a/README.md
+++ b/README.md
@@ -313,8 +313,13 @@ Some types accept options, use it like this: `
-- _options={...}_ \* `obfuscated` (Boolean, default false): if the mask must be `9999 **** **** 9999`
-
+- _options={...}_
+ - `obfuscated` (Boolean, default false): if the mask must be `9999 **** **** 9999`.
+ - `issuer` (String, default 'visa-or-mastercard'): the credit card issuer.
+ - options:
+ - `visa-or-mastercard`: will apply the mask `9999 9999 9999 9999` / `9999 **** **** 9999`.
+ - `amex`: will apply the mask `9999 999999 99999` / `9999 ****** 99999`.
+ - `diners`: will apply the mask `9999 999999 9999` / `9999 ****** 9999`.
### Methods
- `getElement()`: return the instance of _TextInput_ component.
diff --git a/__tests__/mask/credit-card.mask.test.js b/__tests__/mask/credit-card.mask.test.js
index 86e3c57b..0760d828 100644
--- a/__tests__/mask/credit-card.mask.test.js
+++ b/__tests__/mask/credit-card.mask.test.js
@@ -88,3 +88,19 @@ test('getMask obfuscated returns 9999 **** **** 9999', () => {
expect(received).toBe(expected)
})
+
+test('get masked value with amex issuer must return 1234 123456 12345', () => {
+ var mask = new CreditCardMask()
+ var expected = '1234 123456 12345'
+ var received = mask.getValue('123412345612345', { issuer: 'amex' })
+
+ expect(received).toBe(expected)
+})
+
+test('getMask with diners issuer must return 1234 123456 1234', () => {
+ var mask = new CreditCardMask()
+ var expected = '1234 123456 1234'
+ var received = mask.getValue('12341234561234', { issuer: 'diners' })
+
+ expect(received).toBe(expected)
+})
\ No newline at end of file
diff --git a/dist/lib/masks/credit-card.mask.js b/dist/lib/masks/credit-card.mask.js
index c3a2ef2d..d38ca78d 100644
--- a/dist/lib/masks/credit-card.mask.js
+++ b/dist/lib/masks/credit-card.mask.js
@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});var _createClass=function(){function defineProperties(target,props){for(var i=0;i boolean
onChangeText?: (text: string) => void
refInput?: (ref: any) => void
+ customTextInput?: any
+ customTextInputProps?: Object
}
// TextInputMask Component
diff --git a/lib/masks/credit-card.mask.js b/lib/masks/credit-card.mask.js
index 0422863c..8db3fe7d 100644
--- a/lib/masks/credit-card.mask.js
+++ b/lib/masks/credit-card.mask.js
@@ -1,11 +1,24 @@
import BaseMask from './_base.mask'
import CustomMask from './custom.mask'
-const CREDIT_CARD_MASK = '9999 9999 9999 9999'
-const CREDIT_CARD_OBFUSCATED_MASK = '9999 **** **** 9999'
+const CREDIT_CARD_MASKS = {
+ 'visa-or-mastercard': {
+ regular: '9999 9999 9999 9999',
+ obfuscated: '9999 **** **** 9999'
+ },
+ 'amex': {
+ regular: '9999 999999 99999',
+ obfuscated: '9999 ****** 99999'
+ },
+ 'diners': {
+ regular: '9999 999999 9999',
+ obfuscated: '9999 ****** 9999'
+ },
+}
const CREDIT_CARD_SETTINGS = {
- obfuscated: false
+ obfuscated: false,
+ issuer: 'visa-or-mastercard'
}
const MASK_TRANSLATION = {
@@ -46,9 +59,14 @@ export default class CreditCardMask extends BaseMask {
getMask(value, settings) {
let mergedSettings = super.mergeSettings(CREDIT_CARD_SETTINGS, settings)
- let selectedMask = mergedSettings.obfuscated
- ? CREDIT_CARD_OBFUSCATED_MASK
- : CREDIT_CARD_MASK
+ const selectedMask = this._selectMask(mergedSettings.issuer, mergedSettings.obfuscated)
+
return selectedMask
}
+
+ _selectMask(issuer, obfuscated) {
+ const maskType = obfuscated ? 'obfuscated' : 'regular'
+
+ return CREDIT_CARD_MASKS[issuer][maskType]
+ }
}
diff --git a/lib/text-input-mask.js b/lib/text-input-mask.js
index f3a2363b..916c1f22 100644
--- a/lib/text-input-mask.js
+++ b/lib/text-input-mask.js
@@ -17,12 +17,20 @@ export default class TextInputMask extends BaseTextComponent {
self.updateValue(text).then(maskedText => {
if (self.props.onChangeText) {
- this.getElement().setNativeProps({ text: maskedText })
+ this._trySetNativeProps(maskedText)
self.props.onChangeText(maskedText)
}
})
}
+ _trySetNativeProps(maskedText) {
+ try {
+ this.getElement().setNativeProps({ text: maskedText })
+ } catch (error) {
+ // silent
+ }
+ }
+
_checkText(text) {
if (this.props.checkText) {
return this.props.checkText(this.state.value, text)
diff --git a/package.json b/package.json
index c34571bd..7c224a97 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-native-masked-text",
- "version": "1.9.2",
+ "version": "1.10.0",
"description": "Text and TextInput with mask for React Native applications",
"licenses": [
{