react-input-mask
Advanced tools
Comparing version 0.9.1 to 1.0.0-beta.1
@@ -9,2 +9,295 @@ (function (global, factory) { | ||
| var defaultCharsRules = { | ||
| '9': '[0-9]', | ||
| 'a': '[A-Za-z]', | ||
| '*': '[A-Za-z0-9]' | ||
| }; | ||
| var defaultMaskChar = '_'; | ||
| var parseMask = function (mask, maskChar, charsRules) { | ||
| if (maskChar === undefined) { | ||
| maskChar = defaultMaskChar; | ||
| } | ||
| if (charsRules == null) { | ||
| charsRules = defaultCharsRules; | ||
| } | ||
| if (!mask || typeof mask !== 'string') { | ||
| return { | ||
| maskChar: maskChar, | ||
| charsRules: charsRules, | ||
| mask: null, | ||
| prefix: null, | ||
| lastEditablePos: null, | ||
| permanents: [] | ||
| }; | ||
| } | ||
| var str = ''; | ||
| var prefix = ''; | ||
| var permanents = []; | ||
| var isPermanent = false; | ||
| var lastEditablePos = null; | ||
| mask.split('').forEach(function (character, i) { | ||
| if (!isPermanent && character === '\\') { | ||
| isPermanent = true; | ||
| } else { | ||
| if (isPermanent || !charsRules[character]) { | ||
| permanents.push(str.length); | ||
| if (prefix.length === i) { | ||
| prefix += character; | ||
| } | ||
| } else { | ||
| lastEditablePos = str.length + 1; | ||
| } | ||
| str += character; | ||
| isPermanent = false; | ||
| } | ||
| }); | ||
| return { | ||
| maskChar: maskChar, | ||
| charsRules: charsRules, | ||
| prefix: prefix, | ||
| mask: str, | ||
| lastEditablePos: lastEditablePos, | ||
| permanents: permanents | ||
| }; | ||
| }; | ||
| function isAndroidBrowser() { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && !firefox.test(ua) && android.test(ua); | ||
| } | ||
| function isWindowsPhoneBrowser() { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var phone = new RegExp('phone', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return windows.test(ua) && phone.test(ua); | ||
| } | ||
| function isAndroidFirefox() { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && firefox.test(ua) && android.test(ua); | ||
| } | ||
| function isPermanentChar(maskOptions, pos) { | ||
| return maskOptions.permanents.indexOf(pos) !== -1; | ||
| } | ||
| function isAllowedChar(maskOptions, pos, character) { | ||
| var mask = maskOptions.mask, | ||
| charsRules = maskOptions.charsRules; | ||
| if (!character) { | ||
| return false; | ||
| } | ||
| if (isPermanentChar(maskOptions, pos)) { | ||
| return mask[pos] === character; | ||
| } | ||
| var ruleChar = mask[pos]; | ||
| var charRule = charsRules[ruleChar]; | ||
| return new RegExp(charRule).test(character); | ||
| } | ||
| function isEmpty(maskOptions, value) { | ||
| return value.split('').every(function (character, i) { | ||
| return isPermanentChar(maskOptions, i) || !isAllowedChar(maskOptions, i, character); | ||
| }); | ||
| } | ||
| function getFilledLength(maskOptions, value) { | ||
| var maskChar = maskOptions.maskChar, | ||
| prefix = maskOptions.prefix; | ||
| if (!maskChar) { | ||
| return value.length; | ||
| } | ||
| var filledLength = prefix.length; | ||
| for (var i = value.length; i >= prefix.length; i--) { | ||
| var character = value[i]; | ||
| var isEnteredCharacter = !isPermanentChar(maskOptions, i) && isAllowedChar(maskOptions, i, character); | ||
| if (isEnteredCharacter) { | ||
| filledLength = i + 1; | ||
| break; | ||
| } | ||
| } | ||
| return filledLength; | ||
| } | ||
| function isFilled(maskOptions, value) { | ||
| return getFilledLength(maskOptions, value) === maskOptions.mask.length; | ||
| } | ||
| function formatValue(maskOptions, value) { | ||
| var maskChar = maskOptions.maskChar, | ||
| mask = maskOptions.mask, | ||
| prefix = maskOptions.prefix; | ||
| if (!maskChar) { | ||
| value = insertString(maskOptions, '', value, 0); | ||
| value = value.slice(0, getFilledLength(maskOptions, value)); | ||
| if (value.length < prefix.length) { | ||
| value = prefix; | ||
| } | ||
| return value; | ||
| } | ||
| if (value) { | ||
| var emptyValue = formatValue(maskOptions, ''); | ||
| return insertString(maskOptions, emptyValue, value, 0); | ||
| } | ||
| for (var i = 0; i < mask.length; i++) { | ||
| if (isPermanentChar(maskOptions, i)) { | ||
| value += mask[i]; | ||
| } else { | ||
| value += maskChar; | ||
| } | ||
| } | ||
| return value; | ||
| } | ||
| function clearRange(maskOptions, value, start, len) { | ||
| var end = start + len; | ||
| var maskChar = maskOptions.maskChar, | ||
| mask = maskOptions.mask, | ||
| prefix = maskOptions.prefix; | ||
| var arrayValue = value.split(''); | ||
| if (!maskChar) { | ||
| start = Math.max(prefix.length, start); | ||
| arrayValue.splice(start, end - start); | ||
| value = arrayValue.join(''); | ||
| return formatValue(maskOptions, value); | ||
| } | ||
| return arrayValue.map(function (character, i) { | ||
| if (i < start || i >= end) { | ||
| return character; | ||
| } | ||
| if (isPermanentChar(maskOptions, i)) { | ||
| return mask[i]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| } | ||
| function insertString(maskOptions, value, insertStr, insertPos) { | ||
| var mask = maskOptions.mask, | ||
| maskChar = maskOptions.maskChar, | ||
| prefix = maskOptions.prefix; | ||
| var arrayInsertStr = insertStr.split(''); | ||
| var isInputFilled = isFilled(maskOptions, value); | ||
| var isUsablePosition = function isUsablePosition(pos, character) { | ||
| return !isPermanentChar(maskOptions, pos) || character === mask[pos]; | ||
| }; | ||
| var isUsableCharacter = function isUsableCharacter(character, pos) { | ||
| return !maskChar || !isPermanentChar(maskOptions, pos) || character !== maskChar; | ||
| }; | ||
| if (!maskChar && insertPos > value.length) { | ||
| value += mask.slice(value.length, insertPos); | ||
| } | ||
| arrayInsertStr.every(function (insertCharacter) { | ||
| while (!isUsablePosition(insertPos, insertCharacter)) { | ||
| if (insertPos >= value.length) { | ||
| value += mask[insertPos]; | ||
| } | ||
| if (!isUsableCharacter(insertCharacter, insertPos)) { | ||
| return true; | ||
| } | ||
| insertPos++; | ||
| // stop iteration if maximum value length reached | ||
| if (insertPos >= mask.length) { | ||
| return false; | ||
| } | ||
| } | ||
| var isAllowed = isAllowedChar(maskOptions, insertPos, insertCharacter) || insertCharacter === maskChar; | ||
| if (!isAllowed) { | ||
| return true; | ||
| } | ||
| if (insertPos < value.length) { | ||
| if (maskChar || isInputFilled || insertPos < prefix.length) { | ||
| value = value.slice(0, insertPos) + insertCharacter + value.slice(insertPos + 1); | ||
| } else { | ||
| value = value.slice(0, insertPos) + insertCharacter + value.slice(insertPos); | ||
| value = formatValue(maskOptions, value); | ||
| } | ||
| } else if (!maskChar) { | ||
| value += insertCharacter; | ||
| } | ||
| insertPos++; | ||
| // stop iteration if maximum value length reached | ||
| return insertPos < mask.length; | ||
| }); | ||
| return value; | ||
| } | ||
| function getInsertStringLength(maskOptions, value, insertStr, insertPos) { | ||
| var mask = maskOptions.mask, | ||
| maskChar = maskOptions.maskChar; | ||
| var arrayInsertStr = insertStr.split(''); | ||
| var initialInsertPos = insertPos; | ||
| var isUsablePosition = function isUsablePosition(pos, character) { | ||
| return !isPermanentChar(maskOptions, pos) || character === mask[pos]; | ||
| }; | ||
| arrayInsertStr.every(function (insertCharacter) { | ||
| while (!isUsablePosition(insertPos, insertCharacter)) { | ||
| insertPos++; | ||
| // stop iteration if maximum value length reached | ||
| if (insertPos >= mask.length) { | ||
| return false; | ||
| } | ||
| } | ||
| var isAllowed = isAllowedChar(maskOptions, insertPos, insertCharacter) || insertCharacter === maskChar; | ||
| if (isAllowed) { | ||
| insertPos++; | ||
| } | ||
| // stop iteration if maximum value length reached | ||
| return insertPos < mask.length; | ||
| }); | ||
| return insertPos - initialInsertPos; | ||
| } | ||
| var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
@@ -14,2 +307,4 @@ | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } | ||
@@ -24,3 +319,2 @@ | ||
| // https://github.com/sanniassin/react-input-mask | ||
| var InputElement = function (_React$Component) { | ||
@@ -36,18 +330,24 @@ _inherits(InputElement, _React$Component); | ||
| _this.hasValue = props.value != null; | ||
| _this.charsRules = props.formatChars != null ? props.formatChars : _this.defaultCharsRules; | ||
| var mask = props.mask, | ||
| maskChar = props.maskChar, | ||
| formatChars = props.formatChars, | ||
| defaultValue = props.defaultValue, | ||
| value = props.value, | ||
| alwaysShowMask = props.alwaysShowMask; | ||
| var mask = _this.parseMask(props.mask); | ||
| var defaultValue = props.defaultValue != null ? props.defaultValue : ''; | ||
| var value = props.value != null ? props.value : defaultValue; | ||
| _this.hasValue = value != null; | ||
| _this.maskOptions = parseMask(mask, maskChar, formatChars); | ||
| if (defaultValue == null) { | ||
| defaultValue = ''; | ||
| } | ||
| if (value == null) { | ||
| value = defaultValue; | ||
| } | ||
| value = _this.getStringValue(value); | ||
| _this.mask = mask.mask; | ||
| _this.permanents = mask.permanents; | ||
| _this.lastEditablePos = mask.lastEditablePos; | ||
| _this.maskChar = 'maskChar' in props ? props.maskChar : _this.defaultMaskChar; | ||
| if (_this.mask && (props.alwaysShowMask || value)) { | ||
| value = _this.formatValue(value); | ||
| if (_this.maskOptions.mask && (alwaysShowMask || value)) { | ||
| value = formatValue(_this.maskOptions, value); | ||
| } | ||
@@ -59,2 +359,9 @@ | ||
| _createClass(InputElement, [{ | ||
| key: 'componentWillUnmount', | ||
| value: function componentWillUnmount() { | ||
| this.unmounted = true; | ||
| } | ||
| }]); | ||
| return InputElement; | ||
@@ -66,31 +373,78 @@ }(React.Component); | ||
| this.defaultCharsRules = { | ||
| '9': '[0-9]', | ||
| 'a': '[A-Za-z]', | ||
| '*': '[A-Za-z0-9]' | ||
| }; | ||
| this.defaultMaskChar = '_'; | ||
| this.lastCursorPos = null; | ||
| this.isAndroidBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && !firefox.test(ua) && android.test(ua); | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = isAndroidBrowser(); | ||
| _this2.isWindowsPhoneBrowser = isWindowsPhoneBrowser(); | ||
| _this2.isAndroidFirefox = isAndroidFirefox(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.maskOptions.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.isWindowsPhoneBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var phone = new RegExp('phone', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return windows.test(ua) && phone.test(ua); | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| var oldMaskOptions = _this2.maskOptions; | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.maskOptions = parseMask(nextProps.mask, nextProps.maskChar, nextProps.formatChars); | ||
| if (!_this2.maskOptions.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var isMaskChanged = _this2.maskOptions.mask && _this2.maskOptions.mask !== oldMaskOptions.mask; | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| var newValue = _this2.hasValue ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMaskOptions.mask && !_this2.hasValue) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| if (isMaskChanged || _this2.maskOptions.mask && (newValue || showEmpty)) { | ||
| newValue = formatValue(_this2.maskOptions, newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = getFilledLength(_this2.maskOptions, newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if (isFilled(_this2.maskOptions, newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (_this2.maskOptions.mask && isEmpty(_this2.maskOptions, newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.isAndroidFirefox = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && firefox.test(ua) && android.test(ua); | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.maskOptions.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
@@ -128,5 +482,5 @@ | ||
| }, | ||
| set: function set(val) { | ||
| _this2.value = val; | ||
| _this2.valueDescriptor.set.call(input, val); | ||
| set: function set(value) { | ||
| _this2.value = value; | ||
| _this2.valueDescriptor.set.call(input, value); | ||
| } | ||
@@ -140,7 +494,8 @@ }); | ||
| if (!valueDescriptor) { | ||
| var input = _this2.getInputDOMNode(); | ||
| if (!valueDescriptor || !input) { | ||
| return; | ||
| } | ||
| _this2.valueDescriptor = null; | ||
| var input = _this2.getInputDOMNode(); | ||
| Object.defineProperty(input, 'value', valueDescriptor); | ||
@@ -164,37 +519,10 @@ }; | ||
| this.setInputValue = function (val) { | ||
| this.setInputValue = function (value) { | ||
| var input = _this2.getInputDOMNode(); | ||
| _this2.value = val; | ||
| input.value = val; | ||
| }; | ||
| this.getPrefix = function () { | ||
| var prefix = ''; | ||
| var mask = _this2.mask; | ||
| for (var i = 0; i < mask.length && _this2.isPermanentChar(i); ++i) { | ||
| prefix += mask[i]; | ||
| if (!input) { | ||
| return; | ||
| } | ||
| return prefix; | ||
| }; | ||
| this.getFilledLength = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| var i; | ||
| var maskChar = _this2.maskChar; | ||
| if (!maskChar) { | ||
| return value.length; | ||
| } | ||
| for (i = value.length - 1; i >= 0; --i) { | ||
| var character = value[i]; | ||
| if (!_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i)) { | ||
| break; | ||
| } | ||
| } | ||
| return ++i || _this2.getPrefix().length; | ||
| _this2.value = value; | ||
| input.value = value; | ||
| }; | ||
@@ -204,3 +532,3 @@ | ||
| for (var i = pos; i >= 0; --i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!isPermanentChar(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -213,6 +541,6 @@ } | ||
| this.getRightEditablePos = function (pos) { | ||
| var mask = _this2.mask; | ||
| var mask = _this2.maskOptions.mask; | ||
| for (var i = pos; i < mask.length; ++i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!isPermanentChar(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -224,169 +552,4 @@ } | ||
| this.isEmpty = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return !value.split('').some(function (character, i) { | ||
| return !_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i); | ||
| }); | ||
| }; | ||
| this.isFilled = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return _this2.getFilledLength(value) === _this2.mask.length; | ||
| }; | ||
| this.createFilledArray = function (length, val) { | ||
| var array = []; | ||
| for (var i = 0; i < length; i++) { | ||
| array[i] = val; | ||
| } | ||
| return array; | ||
| }; | ||
| this.formatValue = function (value) { | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefix = _this2.getPrefix(); | ||
| var prefixLen = prefix.length; | ||
| value = _this2.insertRawSubstr('', value, 0); | ||
| while (value.length > prefixLen && _this2.isPermanentChar(value.length - 1)) { | ||
| value = value.slice(0, value.length - 1); | ||
| } | ||
| if (value.length < prefixLen) { | ||
| value = prefix; | ||
| } | ||
| return value; | ||
| } | ||
| if (value) { | ||
| var emptyValue = _this2.formatValue(''); | ||
| return _this2.insertRawSubstr(emptyValue, value, 0); | ||
| } | ||
| return value.split('').concat(_this2.createFilledArray(mask.length - value.length, null)).map(function (character, pos) { | ||
| if (_this2.isAllowedChar(character, pos)) { | ||
| return character; | ||
| } else if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.clearRange = function (value, start, len) { | ||
| var end = start + len; | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefixLen = _this2.getPrefix().length; | ||
| value = value.split('').filter(function (character, i) { | ||
| return i < prefixLen || i < start || i >= end; | ||
| }).join(''); | ||
| return _this2.formatValue(value); | ||
| } | ||
| return value.split('').map(function (character, i) { | ||
| if (i < start || i >= end) { | ||
| return character; | ||
| } | ||
| if (_this2.isPermanentChar(i)) { | ||
| return mask[i]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.replaceSubstr = function (value, newSubstr, pos) { | ||
| return value.slice(0, pos) + newSubstr + value.slice(pos + newSubstr.length); | ||
| }; | ||
| this.insertRawSubstr = function (value, substr, pos) { | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| var isFilled = _this2.isFilled(value); | ||
| var prefixLen = _this2.getPrefix().length; | ||
| substr = substr.split(''); | ||
| if (!maskChar && pos > value.length) { | ||
| value += mask.slice(value.length, pos); | ||
| } | ||
| for (var i = pos; i < mask.length && substr.length;) { | ||
| var isPermanent = _this2.isPermanentChar(i); | ||
| if (!isPermanent || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| if (i < value.length) { | ||
| if (maskChar || isFilled || i < prefixLen) { | ||
| value = _this2.replaceSubstr(value, character, i); | ||
| } else { | ||
| value = _this2.formatValue(value.substr(0, i) + character + value.substr(i)); | ||
| } | ||
| } else if (!maskChar) { | ||
| value += character; | ||
| } | ||
| ++i; | ||
| } | ||
| } else { | ||
| if (!maskChar && i >= value.length) { | ||
| value += mask[i]; | ||
| } else if (maskChar && isPermanent && substr[0] === maskChar) { | ||
| substr.shift(); | ||
| } | ||
| ++i; | ||
| } | ||
| } | ||
| return value; | ||
| }; | ||
| this.getRawSubstrLength = function (value, substr, pos) { | ||
| var mask = _this2.mask; | ||
| var i = pos; | ||
| substr = substr.split(''); | ||
| while (i < mask.length && substr.length) { | ||
| if (!_this2.isPermanentChar(i) || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| ++i; | ||
| } | ||
| } else { | ||
| ++i; | ||
| } | ||
| } | ||
| return i - pos; | ||
| }; | ||
| this.isAllowedChar = function (character, pos) { | ||
| var allowMaskChar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos] === character; | ||
| } | ||
| var ruleChar = mask[pos]; | ||
| var charRule = _this2.charsRules[ruleChar]; | ||
| return new RegExp(charRule).test(character || '') || allowMaskChar && character === maskChar; | ||
| }; | ||
| this.isPermanentChar = function (pos) { | ||
| return _this2.permanents.indexOf(pos) !== -1; | ||
| }; | ||
| this.setCursorToEnd = function () { | ||
| var filledLen = _this2.getFilledLength(); | ||
| var filledLen = getFilledLength(_this2.maskOptions, _this2.state.value); | ||
| var pos = _this2.getRightEditablePos(filledLen); | ||
@@ -451,7 +614,7 @@ if (pos !== null) { | ||
| var setPos = _this2.setSelection.bind(_this2, pos, 0); | ||
| _this2.setSelection(pos, 0); | ||
| raf(function () { | ||
| _this2.setSelection(pos, 0); | ||
| }); | ||
| setPos(); | ||
| raf(setPos); | ||
| _this2.lastCursorPos = pos; | ||
@@ -464,36 +627,2 @@ }; | ||
| this.parseMask = function (mask) { | ||
| if (!mask || typeof mask !== 'string') { | ||
| return { | ||
| mask: null, | ||
| lastEditablePos: null, | ||
| permanents: [] | ||
| }; | ||
| } | ||
| var str = ''; | ||
| var permanents = []; | ||
| var isPermanent = false; | ||
| var lastEditablePos = null; | ||
| mask.split('').forEach(function (character) { | ||
| if (!isPermanent && character === '\\') { | ||
| isPermanent = true; | ||
| } else { | ||
| if (isPermanent || !_this2.charsRules[character]) { | ||
| permanents.push(str.length); | ||
| } else { | ||
| lastEditablePos = str.length + 1; | ||
| } | ||
| str += character; | ||
| isPermanent = false; | ||
| } | ||
| }); | ||
| return { | ||
| mask: str, | ||
| lastEditablePos: lastEditablePos, | ||
| permanents: permanents | ||
| }; | ||
| }; | ||
| this.getStringValue = function (value) { | ||
@@ -503,70 +632,2 @@ return !value && value !== 0 ? '' : value + ''; | ||
| this.componentWillMount = function () { | ||
| var mask = _this2.mask; | ||
| var value = _this2.state.value; | ||
| if (mask && value) { | ||
| _this2.setState({ value: value }); | ||
| } | ||
| }; | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.charsRules = nextProps.formatChars != null ? nextProps.formatChars : _this2.defaultCharsRules; | ||
| var oldMask = _this2.mask; | ||
| var mask = _this2.parseMask(nextProps.mask); | ||
| var isMaskChanged = mask.mask && mask.mask !== _this2.mask; | ||
| _this2.mask = mask.mask; | ||
| _this2.permanents = mask.permanents; | ||
| _this2.lastEditablePos = mask.lastEditablePos; | ||
| _this2.maskChar = 'maskChar' in nextProps ? nextProps.maskChar : _this2.defaultMaskChar; | ||
| if (!_this2.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var newValue = nextProps.value != null ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMask && nextProps.value == null) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| if (isMaskChanged || mask.mask && (newValue || showEmpty)) { | ||
| newValue = _this2.formatValue(newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = _this2.getFilledLength(newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if (_this2.isFilled(newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (mask.mask && _this2.isEmpty(newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
| this.updateUncontrolledInput = function () { | ||
@@ -579,4 +640,8 @@ if (_this2.getInputValue() !== _this2.state.value) { | ||
| this.onKeyDown = function (event) { | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyDown === 'function'; | ||
| if (event.ctrlKey || event.metaKey) { | ||
| if (ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -590,3 +655,4 @@ _this2.props.onKeyDown(event); | ||
| var value = _this2.state.value; | ||
| var key = event.key; | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var preventDefault = false; | ||
@@ -596,9 +662,8 @@ switch (key) { | ||
| case 'Delete': | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var deleteFromRight = key === 'Delete'; | ||
| var selectionRange = _this2.getSelection(); | ||
| if (selectionRange.length) { | ||
| value = _this2.clearRange(value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefixLen || !deleteFromRight && cursorPos === prefixLen) { | ||
| cursorPos = prefixLen; | ||
| value = clearRange(_this2.maskOptions, value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefix.length || !deleteFromRight && cursorPos === prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } else { | ||
@@ -608,3 +673,3 @@ var editablePos = deleteFromRight ? _this2.getRightEditablePos(cursorPos) : _this2.getLeftEditablePos(cursorPos - 1); | ||
| if (editablePos !== null) { | ||
| value = _this2.clearRange(value, editablePos, 1); | ||
| value = clearRange(_this2.maskOptions, value, editablePos, 1); | ||
| cursorPos = editablePos; | ||
@@ -624,2 +689,4 @@ } | ||
| if (value !== _this2.state.value) { | ||
| preventDefault = true; | ||
| _this2.setInputValue(value); | ||
@@ -629,3 +696,3 @@ _this2.setState({ | ||
| }); | ||
| preventDefault = true; | ||
| if (typeof _this2.props.onChange === 'function') { | ||
@@ -635,2 +702,3 @@ _this2.props.onChange(event); | ||
| } | ||
| if (preventDefault) { | ||
@@ -643,5 +711,8 @@ event.preventDefault(); | ||
| this.onKeyPress = function (event) { | ||
| var key = event.key; | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyPress === 'function'; | ||
| if (key === 'Enter' || event.ctrlKey || event.metaKey) { | ||
| if (key === 'Enter' || ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -660,15 +731,16 @@ _this2.props.onKeyPress(event); | ||
| var value = _this2.state.value; | ||
| var mask = _this2.mask, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var _maskOptions = _this2.maskOptions, | ||
| mask = _maskOptions.mask, | ||
| lastEditablePos = _maskOptions.lastEditablePos, | ||
| prefix = _maskOptions.prefix; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| if (_this2.isPermanentChar(cursorPos) && mask[cursorPos] === key) { | ||
| value = _this2.insertRawSubstr(value, key, cursorPos); | ||
| if (isPermanentChar(_this2.maskOptions, cursorPos) && mask[cursorPos] === key) { | ||
| value = insertString(_this2.maskOptions, value, key, cursorPos); | ||
| ++cursorPos; | ||
| } else { | ||
| var editablePos = _this2.getRightEditablePos(cursorPos); | ||
| if (editablePos !== null && _this2.isAllowedChar(key, editablePos)) { | ||
| value = _this2.clearRange(value, selection.start, selection.length); | ||
| value = _this2.insertRawSubstr(value, key, editablePos); | ||
| if (editablePos !== null && isAllowedChar(_this2.maskOptions, editablePos, key)) { | ||
| value = clearRange(_this2.maskOptions, value, selection.start, selection.length); | ||
| value = insertString(_this2.maskOptions, value, key, editablePos); | ||
| cursorPos = editablePos + 1; | ||
@@ -687,4 +759,6 @@ } | ||
| } | ||
| event.preventDefault(); | ||
| if (cursorPos < lastEditablePos && cursorPos > prefixLen) { | ||
| if (cursorPos < lastEditablePos && cursorPos > prefix.length) { | ||
| cursorPos = _this2.getRightEditablePos(cursorPos); | ||
@@ -696,6 +770,8 @@ } | ||
| this.onChange = function (event) { | ||
| var pasteSelection = _this2.pasteSelection, | ||
| mask = _this2.mask, | ||
| maskChar = _this2.maskChar, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var pasteSelection = _this2.pasteSelection; | ||
| var _maskOptions2 = _this2.maskOptions, | ||
| mask = _maskOptions2.mask, | ||
| maskChar = _maskOptions2.maskChar, | ||
| lastEditablePos = _maskOptions2.lastEditablePos, | ||
| prefix = _maskOptions2.prefix; | ||
@@ -720,11 +796,12 @@ var value = _this2.getInputValue(); | ||
| var oldValueLen = oldValue.length; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var clearedValue; | ||
| var enteredString; | ||
| if (valueLen > oldValueLen) { | ||
| var substrLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - substrLen; | ||
| var enteredSubstr = value.substr(startPos, substrLen); | ||
| var enteredStringLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - enteredStringLen; | ||
| enteredString = value.substr(startPos, enteredStringLen); | ||
| if (startPos < lastEditablePos && (substrLen !== 1 || enteredSubstr !== mask[startPos])) { | ||
| if (startPos < lastEditablePos && (enteredStringLen !== 1 || enteredString !== mask[startPos])) { | ||
| cursorPos = _this2.getRightEditablePos(startPos); | ||
@@ -735,11 +812,11 @@ } else { | ||
| value = value.substr(0, startPos) + value.substr(startPos + substrLen); | ||
| value = value.substr(0, startPos) + value.substr(startPos + enteredStringLen); | ||
| clearedValue = _this2.clearRange(value, startPos, maskLen - startPos); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, enteredSubstr, cursorPos); | ||
| clearedValue = clearRange(_this2.maskOptions, value, startPos, maskLen - startPos); | ||
| clearedValue = insertString(_this2.maskOptions, clearedValue, enteredString, cursorPos); | ||
| value = _this2.insertRawSubstr(oldValue, enteredSubstr, cursorPos); | ||
| value = insertString(_this2.maskOptions, oldValue, enteredString, cursorPos); | ||
| if (substrLen !== 1 || cursorPos >= prefixLen && cursorPos < lastEditablePos) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| if (enteredStringLen !== 1 || cursorPos >= prefix.length && cursorPos < lastEditablePos) { | ||
| cursorPos = getFilledLength(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < lastEditablePos) { | ||
@@ -750,20 +827,21 @@ cursorPos++; | ||
| var removedLen = maskLen - valueLen; | ||
| clearedValue = _this2.clearRange(oldValue, selection.end, removedLen); | ||
| var substr = value.substr(0, selection.end); | ||
| var clearOnly = substr === oldValue.substr(0, selection.end); | ||
| enteredString = value.substr(0, selection.end); | ||
| var clearOnly = enteredString === oldValue.substr(0, selection.end); | ||
| clearedValue = clearRange(_this2.maskOptions, oldValue, selection.end, removedLen); | ||
| if (maskChar) { | ||
| value = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| value = insertString(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| } | ||
| clearedValue = _this2.clearRange(clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| clearedValue = clearRange(_this2.maskOptions, clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = insertString(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| if (!clearOnly) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| } else if (cursorPos < prefixLen) { | ||
| cursorPos = prefixLen; | ||
| cursorPos = getFilledLength(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } | ||
| } | ||
| value = _this2.formatValue(value); | ||
| value = formatValue(_this2.maskOptions, value); | ||
@@ -773,2 +851,6 @@ if (_this2.isWindowsPhoneBrowser) { | ||
| setTimeout(function () { | ||
| if (_this2.unmounted) { | ||
| return; | ||
| } | ||
| _this2.setInputValue(value); | ||
@@ -820,5 +902,5 @@ | ||
| if (!_this2.state.value) { | ||
| var prefix = _this2.getPrefix(); | ||
| var value = _this2.formatValue(prefix); | ||
| var inputValue = _this2.formatValue(value); | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var value = formatValue(_this2.maskOptions, prefix); | ||
| var inputValue = formatValue(_this2.maskOptions, value); | ||
@@ -840,3 +922,3 @@ // do not use this.getInputValue and this.setInputValue as this.input | ||
| } | ||
| } else if (_this2.getFilledLength() < _this2.mask.length) { | ||
| } else if (getFilledLength(_this2.maskOptions, _this2.state.value) < _this2.maskOptions.mask.length) { | ||
| _this2.setCursorToEnd(); | ||
@@ -851,11 +933,14 @@ } | ||
| this.onBlur = function (event) { | ||
| if (!_this2.props.alwaysShowMask && _this2.isEmpty(_this2.state.value)) { | ||
| if (!_this2.props.alwaysShowMask && isEmpty(_this2.maskOptions, _this2.state.value)) { | ||
| var inputValue = ''; | ||
| var isInputValueChanged = inputValue !== _this2.getInputValue(); | ||
| if (isInputValueChanged) { | ||
| _this2.setInputValue(inputValue); | ||
| } | ||
| _this2.setState({ | ||
| value: _this2.hasValue ? _this2.state.value : '' | ||
| }); | ||
| if (isInputValueChanged && typeof _this2.props.onChange === 'function') { | ||
@@ -877,2 +962,3 @@ _this2.props.onChange(event); | ||
| } | ||
| var text; | ||
@@ -885,2 +971,3 @@ if (window.clipboardData && window.clipboardData.getData) { | ||
| } | ||
| if (text) { | ||
@@ -891,2 +978,3 @@ var value = _this2.state.value; | ||
| } | ||
| event.preventDefault(); | ||
@@ -898,8 +986,9 @@ }; | ||
| if (selection.length) { | ||
| value = _this2.clearRange(value, cursorPos, selection.length); | ||
| value = clearRange(_this2.maskOptions, value, cursorPos, selection.length); | ||
| } | ||
| var textLen = _this2.getRawSubstrLength(value, text, cursorPos); | ||
| value = _this2.insertRawSubstr(value, text, cursorPos); | ||
| var textLen = getInsertStringLength(_this2.maskOptions, value, text, cursorPos); | ||
| value = insertString(_this2.maskOptions, value, text, cursorPos); | ||
| cursorPos += textLen; | ||
| cursorPos = _this2.getRightEditablePos(cursorPos) || cursorPos; | ||
| if (value !== _this2.getInputValue()) { | ||
@@ -916,24 +1005,6 @@ if (event) { | ||
| } | ||
| _this2.setCursorPos(cursorPos); | ||
| }; | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = _this2.isAndroidBrowser(); | ||
| _this2.isWindowsPhoneBrowser = _this2.isWindowsPhoneBrowser(); | ||
| _this2.isAndroidFirefox = _this2.isAndroidFirefox(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.render = function () { | ||
@@ -947,3 +1018,3 @@ var _props = _this2.props, | ||
| if (_this2.mask) { | ||
| if (_this2.maskOptions.mask) { | ||
| if (!props.disabled && !props.readOnly) { | ||
@@ -960,2 +1031,3 @@ var handlersKeys = ['onFocus', 'onBlur', 'onChange', 'onKeyDown', 'onKeyPress', 'onPaste']; | ||
| } | ||
| return React.createElement('input', _extends({ ref: function ref(_ref) { | ||
@@ -962,0 +1034,0 @@ return _this2.input = _ref; |
@@ -1,1 +0,1 @@ | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.ReactInputMask=t(e.React)}(this,function(e){"use strict";function t(e,t){var n={};for(var a in e)t.indexOf(a)>=0||Object.prototype.hasOwnProperty.call(e,a)&&(n[a]=e[a]);return n}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function r(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}e="default"in e?e["default"]:e;var s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},i=function(e){function t(e){n(this,t);var r=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));l.call(r),r.hasValue=null!=e.value,r.charsRules=null!=e.formatChars?e.formatChars:r.defaultCharsRules;var s=r.parseMask(e.mask),o=null!=e.defaultValue?e.defaultValue:"",i=null!=e.value?e.value:o;return i=r.getStringValue(i),r.mask=s.mask,r.permanents=s.permanents,r.lastEditablePos=s.lastEditablePos,r.maskChar="maskChar"in e?e.maskChar:r.defaultMaskChar,r.mask&&(e.alwaysShowMask||i)&&(i=r.formatValue(i)),r.state={value:i},r}return r(t,e),t}(e.Component),l=function(){var n=this;this.defaultCharsRules={9:"[0-9]",a:"[A-Za-z]","*":"[A-Za-z0-9]"},this.defaultMaskChar="_",this.lastCursorPos=null,this.isAndroidBrowser=function(){var e=new RegExp("windows","i"),t=new RegExp("firefox","i"),n=new RegExp("android","i"),a=navigator.userAgent;return!e.test(a)&&!t.test(a)&&n.test(a)},this.isWindowsPhoneBrowser=function(){var e=new RegExp("windows","i"),t=new RegExp("phone","i"),n=navigator.userAgent;return e.test(n)&&t.test(n)},this.isAndroidFirefox=function(){var e=new RegExp("windows","i"),t=new RegExp("firefox","i"),n=new RegExp("android","i"),a=navigator.userAgent;return!e.test(a)&&t.test(a)&&n.test(a)},this.isDOMElement=function(e){return"object"===("undefined"==typeof HTMLElement?"undefined":o(HTMLElement))?e instanceof HTMLElement:1===e.nodeType&&"string"==typeof e.nodeName},this.getInputDOMNode=function(){var t=n.input;return t?n.isDOMElement(t)?t:e.findDOMNode(t):null},this.enableValueAccessors=function(){if(n.canUseAccessors){var e=n.getInputDOMNode();n.valueDescriptor=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),"value"),Object.defineProperty(e,"value",{configurable:!0,enumerable:!0,get:function(){return n.value},set:function(t){n.value=t,n.valueDescriptor.set.call(e,t)}})}},this.disableValueAccessors=function(){var e=n.valueDescriptor;if(e){n.valueDescriptor=null;var t=n.getInputDOMNode();Object.defineProperty(t,"value",e)}},this.getInputValue=function(){var e=n.getInputDOMNode(),t=n.valueDescriptor;return t?t.get.call(e):e.value},this.setInputValue=function(e){var t=n.getInputDOMNode();n.value=e,t.value=e},this.getPrefix=function(){for(var e="",t=n.mask,a=0;a<t.length&&n.isPermanentChar(a);++a)e+=t[a];return e},this.getFilledLength=function(){var e,t=arguments.length>0&&arguments[0]!==undefined?arguments[0]:n.state.value;if(!n.maskChar)return t.length;for(e=t.length-1;e>=0;--e){var a=t[e];if(!n.isPermanentChar(e)&&n.isAllowedChar(a,e))break}return++e||n.getPrefix().length},this.getLeftEditablePos=function(e){for(var t=e;t>=0;--t)if(!n.isPermanentChar(t))return t;return null},this.getRightEditablePos=function(e){for(var t=n.mask,a=e;a<t.length;++a)if(!n.isPermanentChar(a))return a;return null},this.isEmpty=function(){return!(arguments.length>0&&arguments[0]!==undefined?arguments[0]:n.state.value).split("").some(function(e,t){return!n.isPermanentChar(t)&&n.isAllowedChar(e,t)})},this.isFilled=function(){var e=arguments.length>0&&arguments[0]!==undefined?arguments[0]:n.state.value;return n.getFilledLength(e)===n.mask.length},this.createFilledArray=function(e,t){for(var n=[],a=0;a<e;a++)n[a]=t;return n},this.formatValue=function(e){var t=n.maskChar,a=n.mask;if(!t){var r=n.getPrefix(),s=r.length;for(e=n.insertRawSubstr("",e,0);e.length>s&&n.isPermanentChar(e.length-1);)e=e.slice(0,e.length-1);return e.length<s&&(e=r),e}if(e){var o=n.formatValue("");return n.insertRawSubstr(o,e,0)}return e.split("").concat(n.createFilledArray(a.length-e.length,null)).map(function(e,r){return n.isAllowedChar(e,r)?e:n.isPermanentChar(r)?a[r]:t}).join("")},this.clearRange=function(e,t,a){var r=t+a,s=n.maskChar,o=n.mask;if(!s){var i=n.getPrefix().length;return e=e.split("").filter(function(e,n){return n<i||n<t||n>=r}).join(""),n.formatValue(e)}return e.split("").map(function(e,a){return a<t||a>=r?e:n.isPermanentChar(a)?o[a]:s}).join("")},this.replaceSubstr=function(e,t,n){return e.slice(0,n)+t+e.slice(n+t.length)},this.insertRawSubstr=function(e,t,a){var r=n.mask,s=n.maskChar,o=n.isFilled(e),i=n.getPrefix().length;t=t.split(""),!s&&a>e.length&&(e+=r.slice(e.length,a));for(var l=a;l<r.length&&t.length;){var u=n.isPermanentChar(l);if(u&&r[l]!==t[0])!s&&l>=e.length?e+=r[l]:s&&u&&t[0]===s&&t.shift(),++l;else{var c=t.shift();n.isAllowedChar(c,l,!0)&&(l<e.length?e=s||o||l<i?n.replaceSubstr(e,c,l):n.formatValue(e.substr(0,l)+c+e.substr(l)):s||(e+=c),++l)}}return e},this.getRawSubstrLength=function(e,t,a){var r=n.mask,s=a;for(t=t.split("");s<r.length&&t.length;)if(n.isPermanentChar(s)&&r[s]!==t[0])++s;else{var o=t.shift();n.isAllowedChar(o,s,!0)&&++s}return s-a},this.isAllowedChar=function(e,t){var a=arguments.length>2&&arguments[2]!==undefined&&arguments[2],r=n.mask,s=n.maskChar;if(n.isPermanentChar(t))return r[t]===e;var o=r[t],i=n.charsRules[o];return new RegExp(i).test(e||"")||a&&e===s},this.isPermanentChar=function(e){return-1!==n.permanents.indexOf(e)},this.setCursorToEnd=function(){var e=n.getFilledLength(),t=n.getRightEditablePos(e);null!==t&&n.setCursorPos(t)},this.setSelection=function(e){var t=arguments.length>1&&arguments[1]!==undefined?arguments[1]:0,a=n.getInputDOMNode();if(a){var r=e+t;if("selectionStart"in a&&"selectionEnd"in a)a.selectionStart=e,a.selectionEnd=r;else{var s=a.createTextRange();s.collapse(!0),s.moveStart("character",e),s.moveEnd("character",r-e),s.select()}}},this.getSelection=function(){var e=n.getInputDOMNode(),t=0,a=0;if("selectionStart"in e&&"selectionEnd"in e)t=e.selectionStart,a=e.selectionEnd;else{var r=document.selection.createRange();r.parentElement()===e&&(t=-r.moveStart("character",-e.value.length),a=-r.moveEnd("character",-e.value.length))}return{start:t,end:a,length:a-t}},this.getCursorPos=function(){return n.getSelection().start},this.setCursorPos=function(e){var t=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){return setTimeout(e,0)},a=n.setSelection.bind(n,e,0);a(),t(a),n.lastCursorPos=e},this.isFocused=function(){return document.activeElement===n.getInputDOMNode()},this.parseMask=function(e){if(!e||"string"!=typeof e)return{mask:null,lastEditablePos:null,permanents:[]};var t="",a=[],r=!1,s=null;return e.split("").forEach(function(e){r||"\\"!==e?(r||!n.charsRules[e]?a.push(t.length):s=t.length+1,t+=e,r=!1):r=!0}),{mask:t,lastEditablePos:s,permanents:a}},this.getStringValue=function(e){return e||0===e?e+"":""},this.componentWillMount=function(){var e=n.mask,t=n.state.value;e&&t&&n.setState({value:t})},this.componentWillReceiveProps=function(e){n.hasValue=null!=e.value,n.charsRules=null!=e.formatChars?e.formatChars:n.defaultCharsRules;var t=n.mask,a=n.parseMask(e.mask),r=a.mask&&a.mask!==n.mask;if(n.mask=a.mask,n.permanents=a.permanents,n.lastEditablePos=a.lastEditablePos,n.maskChar="maskChar"in e?e.maskChar:n.defaultMaskChar,n.mask){var s=null!=e.value?n.getStringValue(e.value):n.state.value;t||null!=e.value||(s=n.getInputDOMNode().value);var o=e.alwaysShowMask||n.isFocused();if((r||a.mask&&(s||o))&&(s=n.formatValue(s),r)){var i=n.lastCursorPos,l=n.getFilledLength(s);(null===i||l<i)&&(i=n.isFilled(s)?l:n.getRightEditablePos(l),n.setCursorPos(i))}!a.mask||!n.isEmpty(s)||o||n.hasValue&&e.value||(s=""),n.value=s,n.state.value!==s&&n.setState({value:s})}else n.lastCursorPos=null},this.componentDidUpdate=function(e){(n.mask||e.mask)&&null==n.props.value&&n.updateUncontrolledInput(),n.valueDescriptor&&n.getInputValue()!==n.state.value&&n.setInputValue(n.state.value)},this.updateUncontrolledInput=function(){n.getInputValue()!==n.state.value&&n.setInputValue(n.state.value)},this.onKeyDown=function(e){var t="function"==typeof n.props.onKeyDown;if(e.ctrlKey||e.metaKey)t&&n.props.onKeyDown(e);else{var a=n.getCursorPos(),r=n.state.value,s=e.key,o=!1;switch(s){case"Backspace":case"Delete":var i=n.getPrefix().length,l="Delete"===s,u=n.getSelection();if(u.length)r=n.clearRange(r,u.start,u.length);else if(a<i||!l&&a===i)a=i;else{var c=l?n.getRightEditablePos(a):n.getLeftEditablePos(a-1);null!==c&&(r=n.clearRange(r,c,1),a=c)}o=!0}t&&n.props.onKeyDown(e),r!==n.state.value&&(n.setInputValue(r),n.setState({value:n.hasValue?n.state.value:r}),o=!0,"function"==typeof n.props.onChange&&n.props.onChange(e)),o&&(e.preventDefault(),n.setCursorPos(a))}},this.onKeyPress=function(e){var t=e.key,a="function"==typeof n.props.onKeyPress;if("Enter"===t||e.ctrlKey||e.metaKey)a&&n.props.onKeyPress(e);else if(!n.isWindowsPhoneBrowser){var r=n.getCursorPos(),s=n.getSelection(),o=n.state.value,i=n.mask,l=n.lastEditablePos,u=n.getPrefix().length;if(n.isPermanentChar(r)&&i[r]===t)o=n.insertRawSubstr(o,t,r),++r;else{var c=n.getRightEditablePos(r);null!==c&&n.isAllowedChar(t,c)&&(o=n.clearRange(o,s.start,s.length),o=n.insertRawSubstr(o,t,c),r=c+1)}o!==n.state.value&&(n.setInputValue(o),n.setState({value:n.hasValue?n.state.value:o}),"function"==typeof n.props.onChange&&n.props.onChange(e)),e.preventDefault(),r<l&&r>u&&(r=n.getRightEditablePos(r)),n.setCursorPos(r)}},this.onChange=function(e){var t=n.pasteSelection,a=n.mask,r=n.maskChar,s=n.lastEditablePos,o=n.getInputValue();if(!o&&n.preventEmptyChange)return n.disableValueAccessors(),n.preventEmptyChange=!1,void n.setInputValue(n.state.value);var i=n.state.value;if(t)return n.pasteSelection=null,void n.pasteText(i,o,t,e);var l,u=n.getSelection(),c=u.end,f=a.length,p=o.length,h=i.length,g=n.getPrefix().length;if(p>h){var d=p-h,v=u.end-d,m=o.substr(v,d);c=v<s&&(1!==d||m!==a[v])?n.getRightEditablePos(v):v,o=o.substr(0,v)+o.substr(v+d),l=n.clearRange(o,v,f-v),l=n.insertRawSubstr(l,m,c),o=n.insertRawSubstr(i,m,c),1!==d||c>=g&&c<s?c=n.getFilledLength(l):c<s&&c++}else if(p<h){var w=f-p;l=n.clearRange(i,u.end,w);var b=o.substr(0,u.end),C=b===i.substr(0,u.end);r&&(o=n.insertRawSubstr(l,b,0)),l=n.clearRange(l,u.end,f-u.end),l=n.insertRawSubstr(l,b,0),C?c<g&&(c=g):c=n.getFilledLength(l)}o=n.formatValue(o),n.isWindowsPhoneBrowser?(e.persist(),setTimeout(function(){n.setInputValue(o),n.hasValue||n.setState({value:o}),"function"==typeof n.props.onChange&&n.props.onChange(e),n.setCursorPos(c)},0)):(n.canUseAccessors&&n.isAndroidBrowser||n.setInputValue(o),n.canUseAccessors&&(n.isAndroidFirefox&&o&&!n.getInputValue()||n.isAndroidBrowser)&&(n.value=o,n.enableValueAccessors(),n.isAndroidFirefox&&(n.preventEmptyChange=!0),setTimeout(function(){n.preventEmptyChange=!1,n.disableValueAccessors()},0)),n.setState({value:n.hasValue?n.state.value:o}),"function"==typeof n.props.onChange&&n.props.onChange(e),n.setCursorPos(c))},this.onFocus=function(e){if(n.state.value)n.getFilledLength()<n.mask.length&&n.setCursorToEnd();else{var t=n.getPrefix(),a=n.formatValue(t),r=n.formatValue(a),s=r!==e.target.value;s&&(e.target.value=r),n.setState({value:n.hasValue?n.state.value:r},n.setCursorToEnd),s&&"function"==typeof n.props.onChange&&n.props.onChange(e)}"function"==typeof n.props.onFocus&&n.props.onFocus(e)},this.onBlur=function(e){if(!n.props.alwaysShowMask&&n.isEmpty(n.state.value)){var t=""!==n.getInputValue();t&&n.setInputValue(""),n.setState({value:n.hasValue?n.state.value:""}),t&&"function"==typeof n.props.onChange&&n.props.onChange(e)}"function"==typeof n.props.onBlur&&n.props.onBlur(e)},this.onPaste=function(e){if(n.isAndroidBrowser)return n.pasteSelection=n.getSelection(),void n.setInputValue("");var t;if(window.clipboardData&&window.clipboardData.getData?t=window.clipboardData.getData("Text"):e.clipboardData&&e.clipboardData.getData&&(t=e.clipboardData.getData("text/plain")),t){var a=n.state.value,r=n.getSelection();n.pasteText(a,t,r,e)}e.preventDefault()},this.pasteText=function(e,t,a,r){var s=a.start;a.length&&(e=n.clearRange(e,s,a.length));var o=n.getRawSubstrLength(e,t,s);e=n.insertRawSubstr(e,t,s),s+=o,s=n.getRightEditablePos(s)||s,e!==n.getInputValue()&&(r&&n.setInputValue(e),n.setState({value:n.hasValue?n.state.value:e}),r&&"function"==typeof n.props.onChange&&n.props.onChange(r)),n.setCursorPos(s)},this.componentDidMount=function(){n.isAndroidBrowser=n.isAndroidBrowser(),n.isWindowsPhoneBrowser=n.isWindowsPhoneBrowser(),n.isAndroidFirefox=n.isAndroidFirefox();var e=n.getInputDOMNode();if(e&&Object.getOwnPropertyDescriptor&&Object.getPrototypeOf&&Object.defineProperty){var t=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),"value");n.canUseAccessors=!!(t&&t.get&&t.set)}n.mask&&null==n.props.value&&n.updateUncontrolledInput()},this.render=function(){var a=n.props,r=(a.mask,a.alwaysShowMask,a.maskChar,a.formatChars,t(a,["mask","alwaysShowMask","maskChar","formatChars"]));return n.mask&&(r.disabled||r.readOnly||["onFocus","onBlur","onChange","onKeyDown","onKeyPress","onPaste"].forEach(function(e){r[e]=n[e]}),null!=r.value&&(r.value=n.state.value)),e.createElement("input",s({ref:function(e){return n.input=e}},r))}};return i}); | ||
| !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.ReactInputMask=t(e.React)}(this,function(e){"use strict";function t(){var e=new RegExp("windows","i"),t=new RegExp("firefox","i"),n=new RegExp("android","i"),s=navigator.userAgent;return!e.test(s)&&!t.test(s)&&n.test(s)}function n(){var e=new RegExp("windows","i"),t=new RegExp("phone","i"),n=navigator.userAgent;return e.test(n)&&t.test(n)}function s(){var e=new RegExp("windows","i"),t=new RegExp("firefox","i"),n=new RegExp("android","i"),s=navigator.userAgent;return!e.test(s)&&t.test(s)&&n.test(s)}function a(e,t){return-1!==e.permanents.indexOf(t)}function o(e,t,n){var s=e.mask,o=e.charsRules;if(!n)return!1;if(a(e,t))return s[t]===n;var r=o[s[t]];return new RegExp(r).test(n)}function r(e,t){return t.split("").every(function(t,n){return a(e,n)||!o(e,n,t)})}function i(e,t){var n=e.maskChar,s=e.prefix;if(!n)return t.length;for(var r=s.length,i=t.length;i>=s.length;i--){var u=t[i];if(!a(e,i)&&o(e,i,u)){r=i+1;break}}return r}function u(e,t){return i(e,t)===e.mask.length}function l(e,t){var n=e.maskChar,s=e.mask,o=e.prefix;if(!n)return t=c(e,"",t,0),(t=t.slice(0,i(e,t))).length<o.length&&(t=o),t;if(t)return c(e,l(e,""),t,0);for(var r=0;r<s.length;r++)a(e,r)?t+=s[r]:t+=n;return t}function p(e,t,n,s){var o=n+s,r=e.maskChar,i=e.mask,u=e.prefix,p=t.split("");return r?p.map(function(t,s){return s<n||s>=o?t:a(e,s)?i[s]:r}).join(""):(n=Math.max(u.length,n),p.splice(n,o-n),t=p.join(""),l(e,t))}function c(e,t,n,s){var r=e.mask,i=e.maskChar,p=e.prefix,c=n.split(""),f=u(e,t),h=function(t,n){return!a(e,t)||n===r[t]},g=function(t,n){return!i||!a(e,n)||t!==i};return!i&&s>t.length&&(t+=r.slice(t.length,s)),c.every(function(n){for(;!h(s,n);){if(s>=t.length&&(t+=r[s]),!g(n,s))return!0;if(++s>=r.length)return!1}return!o(e,s,n)&&n!==i||(s<t.length?i||f||s<p.length?t=t.slice(0,s)+n+t.slice(s+1):(t=t.slice(0,s)+n+t.slice(s),t=l(e,t)):i||(t+=n),++s<r.length)}),t}function f(e,t,n,s){var r=e.mask,i=e.maskChar,u=n.split(""),l=s,p=function(t,n){return!a(e,t)||n===r[t]};return u.every(function(t){for(;!p(s,t);)if(++s>=r.length)return!1;return(o(e,s,t)||t===i)&&s++,s<r.length}),s-l}function h(e,t){var n={};for(var s in e)t.indexOf(s)>=0||Object.prototype.hasOwnProperty.call(e,s)&&(n[s]=e[s]);return n}function g(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function m(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function v(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}e="default"in e?e["default"]:e;var d={9:"[0-9]",a:"[A-Za-z]","*":"[A-Za-z0-9]"},k=function(e,t,n){if(t===undefined&&(t="_"),null==n&&(n=d),!e||"string"!=typeof e)return{maskChar:t,charsRules:n,mask:null,prefix:null,lastEditablePos:null,permanents:[]};var s="",a="",o=[],r=!1,i=null;return e.split("").forEach(function(e,t){r||"\\"!==e?(r||!n[e]?(o.push(s.length),a.length===t&&(a+=e)):i=s.length+1,s+=e,r=!1):r=!0}),{maskChar:t,charsRules:n,prefix:a,mask:s,lastEditablePos:i,permanents:o}},O=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)Object.prototype.hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},b=function(){function e(e,t){for(var n=0;n<t.length;n++){var s=t[n];s.enumerable=s.enumerable||!1,s.configurable=!0,"value"in s&&(s.writable=!0),Object.defineProperty(e,s.key,s)}}return function(t,n,s){return n&&e(t.prototype,n),s&&e(t,s),t}}(),w=function(e){function t(e){g(this,t);var n=m(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));C.call(n);var s=e.mask,a=e.maskChar,o=e.formatChars,r=e.defaultValue,i=e.value,u=e.alwaysShowMask;return n.hasValue=null!=i,n.maskOptions=k(s,a,o),null==r&&(r=""),null==i&&(i=r),i=n.getStringValue(i),n.maskOptions.mask&&(u||i)&&(i=l(n.maskOptions,i)),n.state={value:i},n}return v(t,e),b(t,[{key:"componentWillUnmount",value:function(){this.unmounted=!0}}]),t}(e.Component),C=function(){var g=this;this.lastCursorPos=null,this.componentDidMount=function(){g.isAndroidBrowser=t(),g.isWindowsPhoneBrowser=n(),g.isAndroidFirefox=s();var e=g.getInputDOMNode();if(e&&Object.getOwnPropertyDescriptor&&Object.getPrototypeOf&&Object.defineProperty){var a=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),"value");g.canUseAccessors=!!(a&&a.get&&a.set)}g.maskOptions.mask&&null==g.props.value&&g.updateUncontrolledInput()},this.componentWillReceiveProps=function(e){var t=g.maskOptions;if(g.hasValue=null!=e.value,g.maskOptions=k(e.mask,e.maskChar,e.formatChars),g.maskOptions.mask){var n=g.maskOptions.mask&&g.maskOptions.mask!==t.mask,s=e.alwaysShowMask||g.isFocused(),a=g.hasValue?g.getStringValue(e.value):g.state.value;if(t.mask||g.hasValue||(a=g.getInputDOMNode().value),(n||g.maskOptions.mask&&(a||s))&&(a=l(g.maskOptions,a),n)){var o=g.lastCursorPos,p=i(g.maskOptions,a);(null===o||p<o)&&(o=u(g.maskOptions,a)?p:g.getRightEditablePos(p),g.setCursorPos(o))}!g.maskOptions.mask||!r(g.maskOptions,a)||s||g.hasValue&&e.value||(a=""),g.value=a,g.state.value!==a&&g.setState({value:a})}else g.lastCursorPos=null},this.componentDidUpdate=function(e){(g.maskOptions.mask||e.mask)&&null==g.props.value&&g.updateUncontrolledInput(),g.valueDescriptor&&g.getInputValue()!==g.state.value&&g.setInputValue(g.state.value)},this.isDOMElement=function(e){return"object"===("undefined"==typeof HTMLElement?"undefined":y(HTMLElement))?e instanceof HTMLElement:1===e.nodeType&&"string"==typeof e.nodeName},this.getInputDOMNode=function(){var t=g.input;return t?g.isDOMElement(t)?t:e.findDOMNode(t):null},this.enableValueAccessors=function(){if(g.canUseAccessors){var e=g.getInputDOMNode();g.valueDescriptor=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(e),"value"),Object.defineProperty(e,"value",{configurable:!0,enumerable:!0,get:function(){return g.value},set:function(t){g.value=t,g.valueDescriptor.set.call(e,t)}})}},this.disableValueAccessors=function(){var e=g.valueDescriptor,t=g.getInputDOMNode();e&&t&&(g.valueDescriptor=null,Object.defineProperty(t,"value",e))},this.getInputValue=function(){var e=g.getInputDOMNode(),t=g.valueDescriptor;return t?t.get.call(e):e.value},this.setInputValue=function(e){var t=g.getInputDOMNode();t&&(g.value=e,t.value=e)},this.getLeftEditablePos=function(e){for(var t=e;t>=0;--t)if(!a(g.maskOptions,t))return t;return null},this.getRightEditablePos=function(e){for(var t=g.maskOptions.mask,n=e;n<t.length;++n)if(!a(g.maskOptions,n))return n;return null},this.setCursorToEnd=function(){var e=i(g.maskOptions,g.state.value),t=g.getRightEditablePos(e);null!==t&&g.setCursorPos(t)},this.setSelection=function(e){var t=arguments.length>1&&arguments[1]!==undefined?arguments[1]:0,n=g.getInputDOMNode();if(n){var s=e+t;if("selectionStart"in n&&"selectionEnd"in n)n.selectionStart=e,n.selectionEnd=s;else{var a=n.createTextRange();a.collapse(!0),a.moveStart("character",e),a.moveEnd("character",s-e),a.select()}}},this.getSelection=function(){var e=g.getInputDOMNode(),t=0,n=0;if("selectionStart"in e&&"selectionEnd"in e)t=e.selectionStart,n=e.selectionEnd;else{var s=document.selection.createRange();s.parentElement()===e&&(t=-s.moveStart("character",-e.value.length),n=-s.moveEnd("character",-e.value.length))}return{start:t,end:n,length:n-t}},this.getCursorPos=function(){return g.getSelection().start},this.setCursorPos=function(e){var t=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){return setTimeout(e,0)};g.setSelection(e,0),t(function(){g.setSelection(e,0)}),g.lastCursorPos=e},this.isFocused=function(){return document.activeElement===g.getInputDOMNode()},this.getStringValue=function(e){return e||0===e?e+"":""},this.updateUncontrolledInput=function(){g.getInputValue()!==g.state.value&&g.setInputValue(g.state.value)},this.onKeyDown=function(e){var t=e.key,n=e.ctrlKey,s=e.metaKey,a="function"==typeof g.props.onKeyDown;if(n||s)a&&g.props.onKeyDown(e);else{var o=g.getCursorPos(),r=g.state.value,i=g.maskOptions.prefix,u=!1;switch(t){case"Backspace":case"Delete":var l="Delete"===t,c=g.getSelection();if(c.length)r=p(g.maskOptions,r,c.start,c.length);else if(o<i.length||!l&&o===i.length)o=i.length;else{var f=l?g.getRightEditablePos(o):g.getLeftEditablePos(o-1);null!==f&&(r=p(g.maskOptions,r,f,1),o=f)}u=!0}a&&g.props.onKeyDown(e),r!==g.state.value&&(u=!0,g.setInputValue(r),g.setState({value:g.hasValue?g.state.value:r}),"function"==typeof g.props.onChange&&g.props.onChange(e)),u&&(e.preventDefault(),g.setCursorPos(o))}},this.onKeyPress=function(e){var t=e.key,n=e.ctrlKey,s=e.metaKey,r="function"==typeof g.props.onKeyPress;if("Enter"===t||n||s)r&&g.props.onKeyPress(e);else if(!g.isWindowsPhoneBrowser){var i=g.getCursorPos(),u=g.getSelection(),l=g.state.value,f=g.maskOptions,h=f.mask,m=f.lastEditablePos,v=f.prefix;if(a(g.maskOptions,i)&&h[i]===t)l=c(g.maskOptions,l,t,i),++i;else{var d=g.getRightEditablePos(i);null!==d&&o(g.maskOptions,d,t)&&(l=p(g.maskOptions,l,u.start,u.length),l=c(g.maskOptions,l,t,d),i=d+1)}l!==g.state.value&&(g.setInputValue(l),g.setState({value:g.hasValue?g.state.value:l}),"function"==typeof g.props.onChange&&g.props.onChange(e)),e.preventDefault(),i<m&&i>v.length&&(i=g.getRightEditablePos(i)),g.setCursorPos(i)}},this.onChange=function(e){var t=g.pasteSelection,n=g.maskOptions,s=n.mask,a=n.maskChar,o=n.lastEditablePos,r=n.prefix,u=g.getInputValue();if(!u&&g.preventEmptyChange)return g.disableValueAccessors(),g.preventEmptyChange=!1,void g.setInputValue(g.state.value);var f=g.state.value;if(t)return g.pasteSelection=null,void g.pasteText(f,u,t,e);var h,m,v=g.getSelection(),d=v.end,k=s.length,O=u.length,y=f.length;if(O>y){var b=O-y,w=v.end-b;m=u.substr(w,b),d=w<o&&(1!==b||m!==s[w])?g.getRightEditablePos(w):w,u=u.substr(0,w)+u.substr(w+b),h=p(g.maskOptions,u,w,k-w),h=c(g.maskOptions,h,m,d),u=c(g.maskOptions,f,m,d),1!==b||d>=r.length&&d<o?d=i(g.maskOptions,h):d<o&&d++}else if(O<y){var C=k-O,P=(m=u.substr(0,v.end))===f.substr(0,v.end);h=p(g.maskOptions,f,v.end,C),a&&(u=c(g.maskOptions,h,m,0)),h=p(g.maskOptions,h,v.end,k-v.end),h=c(g.maskOptions,h,m,0),P?d<r.length&&(d=r.length):d=i(g.maskOptions,h)}u=l(g.maskOptions,u),g.isWindowsPhoneBrowser?(e.persist(),setTimeout(function(){g.unmounted||(g.setInputValue(u),g.hasValue||g.setState({value:u}),"function"==typeof g.props.onChange&&g.props.onChange(e),g.setCursorPos(d))},0)):(g.canUseAccessors&&g.isAndroidBrowser||g.setInputValue(u),g.canUseAccessors&&(g.isAndroidFirefox&&u&&!g.getInputValue()||g.isAndroidBrowser)&&(g.value=u,g.enableValueAccessors(),g.isAndroidFirefox&&(g.preventEmptyChange=!0),setTimeout(function(){g.preventEmptyChange=!1,g.disableValueAccessors()},0)),g.setState({value:g.hasValue?g.state.value:u}),"function"==typeof g.props.onChange&&g.props.onChange(e),g.setCursorPos(d))},this.onFocus=function(e){if(g.state.value)i(g.maskOptions,g.state.value)<g.maskOptions.mask.length&&g.setCursorToEnd();else{var t=g.maskOptions.prefix,n=l(g.maskOptions,t),s=l(g.maskOptions,n),a=s!==e.target.value;a&&(e.target.value=s),g.setState({value:g.hasValue?g.state.value:s},g.setCursorToEnd),a&&"function"==typeof g.props.onChange&&g.props.onChange(e)}"function"==typeof g.props.onFocus&&g.props.onFocus(e)},this.onBlur=function(e){if(!g.props.alwaysShowMask&&r(g.maskOptions,g.state.value)){var t=""!==g.getInputValue();t&&g.setInputValue(""),g.setState({value:g.hasValue?g.state.value:""}),t&&"function"==typeof g.props.onChange&&g.props.onChange(e)}"function"==typeof g.props.onBlur&&g.props.onBlur(e)},this.onPaste=function(e){if(g.isAndroidBrowser)return g.pasteSelection=g.getSelection(),void g.setInputValue("");var t;if(window.clipboardData&&window.clipboardData.getData?t=window.clipboardData.getData("Text"):e.clipboardData&&e.clipboardData.getData&&(t=e.clipboardData.getData("text/plain")),t){var n=g.state.value,s=g.getSelection();g.pasteText(n,t,s,e)}e.preventDefault()},this.pasteText=function(e,t,n,s){var a=n.start;n.length&&(e=p(g.maskOptions,e,a,n.length));var o=f(g.maskOptions,e,t,a);e=c(g.maskOptions,e,t,a),a+=o,a=g.getRightEditablePos(a)||a,e!==g.getInputValue()&&(s&&g.setInputValue(e),g.setState({value:g.hasValue?g.state.value:e}),s&&"function"==typeof g.props.onChange&&g.props.onChange(s)),g.setCursorPos(a)},this.render=function(){var t=g.props,n=(t.mask,t.alwaysShowMask,t.maskChar,t.formatChars,h(t,["mask","alwaysShowMask","maskChar","formatChars"]));return g.maskOptions.mask&&(n.disabled||n.readOnly||["onFocus","onBlur","onChange","onKeyDown","onKeyPress","onPaste"].forEach(function(e){n[e]=g[e]}),null!=n.value&&(n.value=g.state.value)),e.createElement("input",O({ref:function(e){return g.input=e}},n))}};return w}); |
623
es/index.js
@@ -5,2 +5,4 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } | ||
@@ -15,5 +17,8 @@ | ||
| // https://github.com/sanniassin/react-input-mask | ||
| import React from 'react'; | ||
| import parseMask from './utils/parseMask'; | ||
| import { isAndroidBrowser, isWindowsPhoneBrowser, isAndroidFirefox } from './utils/environment'; | ||
| import { clearRange, formatValue, getFilledLength, isFilled, isEmpty, isPermanentChar, isAllowedChar, getInsertStringLength, insertString } from './utils/string'; | ||
| var InputElement = function (_React$Component) { | ||
@@ -29,18 +34,24 @@ _inherits(InputElement, _React$Component); | ||
| _this.hasValue = props.value != null; | ||
| _this.charsRules = props.formatChars != null ? props.formatChars : _this.defaultCharsRules; | ||
| var mask = props.mask, | ||
| maskChar = props.maskChar, | ||
| formatChars = props.formatChars, | ||
| defaultValue = props.defaultValue, | ||
| value = props.value, | ||
| alwaysShowMask = props.alwaysShowMask; | ||
| var mask = _this.parseMask(props.mask); | ||
| var defaultValue = props.defaultValue != null ? props.defaultValue : ''; | ||
| var value = props.value != null ? props.value : defaultValue; | ||
| _this.hasValue = value != null; | ||
| _this.maskOptions = parseMask(mask, maskChar, formatChars); | ||
| if (defaultValue == null) { | ||
| defaultValue = ''; | ||
| } | ||
| if (value == null) { | ||
| value = defaultValue; | ||
| } | ||
| value = _this.getStringValue(value); | ||
| _this.mask = mask.mask; | ||
| _this.permanents = mask.permanents; | ||
| _this.lastEditablePos = mask.lastEditablePos; | ||
| _this.maskChar = 'maskChar' in props ? props.maskChar : _this.defaultMaskChar; | ||
| if (_this.mask && (props.alwaysShowMask || value)) { | ||
| value = _this.formatValue(value); | ||
| if (_this.maskOptions.mask && (alwaysShowMask || value)) { | ||
| value = formatValue(_this.maskOptions, value); | ||
| } | ||
@@ -52,2 +63,9 @@ | ||
| _createClass(InputElement, [{ | ||
| key: 'componentWillUnmount', | ||
| value: function componentWillUnmount() { | ||
| this.unmounted = true; | ||
| } | ||
| }]); | ||
| return InputElement; | ||
@@ -59,31 +77,78 @@ }(React.Component); | ||
| this.defaultCharsRules = { | ||
| '9': '[0-9]', | ||
| 'a': '[A-Za-z]', | ||
| '*': '[A-Za-z0-9]' | ||
| }; | ||
| this.defaultMaskChar = '_'; | ||
| this.lastCursorPos = null; | ||
| this.isAndroidBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && !firefox.test(ua) && android.test(ua); | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = isAndroidBrowser(); | ||
| _this2.isWindowsPhoneBrowser = isWindowsPhoneBrowser(); | ||
| _this2.isAndroidFirefox = isAndroidFirefox(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.maskOptions.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.isWindowsPhoneBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var phone = new RegExp('phone', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return windows.test(ua) && phone.test(ua); | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| var oldMaskOptions = _this2.maskOptions; | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.maskOptions = parseMask(nextProps.mask, nextProps.maskChar, nextProps.formatChars); | ||
| if (!_this2.maskOptions.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var isMaskChanged = _this2.maskOptions.mask && _this2.maskOptions.mask !== oldMaskOptions.mask; | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| var newValue = _this2.hasValue ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMaskOptions.mask && !_this2.hasValue) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| if (isMaskChanged || _this2.maskOptions.mask && (newValue || showEmpty)) { | ||
| newValue = formatValue(_this2.maskOptions, newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = getFilledLength(_this2.maskOptions, newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if (isFilled(_this2.maskOptions, newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (_this2.maskOptions.mask && isEmpty(_this2.maskOptions, newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.isAndroidFirefox = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && firefox.test(ua) && android.test(ua); | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.maskOptions.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
@@ -121,5 +186,5 @@ | ||
| }, | ||
| set: function set(val) { | ||
| _this2.value = val; | ||
| _this2.valueDescriptor.set.call(input, val); | ||
| set: function set(value) { | ||
| _this2.value = value; | ||
| _this2.valueDescriptor.set.call(input, value); | ||
| } | ||
@@ -133,7 +198,8 @@ }); | ||
| if (!valueDescriptor) { | ||
| var input = _this2.getInputDOMNode(); | ||
| if (!valueDescriptor || !input) { | ||
| return; | ||
| } | ||
| _this2.valueDescriptor = null; | ||
| var input = _this2.getInputDOMNode(); | ||
| Object.defineProperty(input, 'value', valueDescriptor); | ||
@@ -157,37 +223,10 @@ }; | ||
| this.setInputValue = function (val) { | ||
| this.setInputValue = function (value) { | ||
| var input = _this2.getInputDOMNode(); | ||
| _this2.value = val; | ||
| input.value = val; | ||
| }; | ||
| this.getPrefix = function () { | ||
| var prefix = ''; | ||
| var mask = _this2.mask; | ||
| for (var i = 0; i < mask.length && _this2.isPermanentChar(i); ++i) { | ||
| prefix += mask[i]; | ||
| if (!input) { | ||
| return; | ||
| } | ||
| return prefix; | ||
| }; | ||
| this.getFilledLength = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| var i; | ||
| var maskChar = _this2.maskChar; | ||
| if (!maskChar) { | ||
| return value.length; | ||
| } | ||
| for (i = value.length - 1; i >= 0; --i) { | ||
| var character = value[i]; | ||
| if (!_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i)) { | ||
| break; | ||
| } | ||
| } | ||
| return ++i || _this2.getPrefix().length; | ||
| _this2.value = value; | ||
| input.value = value; | ||
| }; | ||
@@ -197,3 +236,3 @@ | ||
| for (var i = pos; i >= 0; --i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!isPermanentChar(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -206,6 +245,6 @@ } | ||
| this.getRightEditablePos = function (pos) { | ||
| var mask = _this2.mask; | ||
| var mask = _this2.maskOptions.mask; | ||
| for (var i = pos; i < mask.length; ++i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!isPermanentChar(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -217,169 +256,4 @@ } | ||
| this.isEmpty = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return !value.split('').some(function (character, i) { | ||
| return !_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i); | ||
| }); | ||
| }; | ||
| this.isFilled = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return _this2.getFilledLength(value) === _this2.mask.length; | ||
| }; | ||
| this.createFilledArray = function (length, val) { | ||
| var array = []; | ||
| for (var i = 0; i < length; i++) { | ||
| array[i] = val; | ||
| } | ||
| return array; | ||
| }; | ||
| this.formatValue = function (value) { | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefix = _this2.getPrefix(); | ||
| var prefixLen = prefix.length; | ||
| value = _this2.insertRawSubstr('', value, 0); | ||
| while (value.length > prefixLen && _this2.isPermanentChar(value.length - 1)) { | ||
| value = value.slice(0, value.length - 1); | ||
| } | ||
| if (value.length < prefixLen) { | ||
| value = prefix; | ||
| } | ||
| return value; | ||
| } | ||
| if (value) { | ||
| var emptyValue = _this2.formatValue(''); | ||
| return _this2.insertRawSubstr(emptyValue, value, 0); | ||
| } | ||
| return value.split('').concat(_this2.createFilledArray(mask.length - value.length, null)).map(function (character, pos) { | ||
| if (_this2.isAllowedChar(character, pos)) { | ||
| return character; | ||
| } else if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.clearRange = function (value, start, len) { | ||
| var end = start + len; | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefixLen = _this2.getPrefix().length; | ||
| value = value.split('').filter(function (character, i) { | ||
| return i < prefixLen || i < start || i >= end; | ||
| }).join(''); | ||
| return _this2.formatValue(value); | ||
| } | ||
| return value.split('').map(function (character, i) { | ||
| if (i < start || i >= end) { | ||
| return character; | ||
| } | ||
| if (_this2.isPermanentChar(i)) { | ||
| return mask[i]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.replaceSubstr = function (value, newSubstr, pos) { | ||
| return value.slice(0, pos) + newSubstr + value.slice(pos + newSubstr.length); | ||
| }; | ||
| this.insertRawSubstr = function (value, substr, pos) { | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| var isFilled = _this2.isFilled(value); | ||
| var prefixLen = _this2.getPrefix().length; | ||
| substr = substr.split(''); | ||
| if (!maskChar && pos > value.length) { | ||
| value += mask.slice(value.length, pos); | ||
| } | ||
| for (var i = pos; i < mask.length && substr.length;) { | ||
| var isPermanent = _this2.isPermanentChar(i); | ||
| if (!isPermanent || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| if (i < value.length) { | ||
| if (maskChar || isFilled || i < prefixLen) { | ||
| value = _this2.replaceSubstr(value, character, i); | ||
| } else { | ||
| value = _this2.formatValue(value.substr(0, i) + character + value.substr(i)); | ||
| } | ||
| } else if (!maskChar) { | ||
| value += character; | ||
| } | ||
| ++i; | ||
| } | ||
| } else { | ||
| if (!maskChar && i >= value.length) { | ||
| value += mask[i]; | ||
| } else if (maskChar && isPermanent && substr[0] === maskChar) { | ||
| substr.shift(); | ||
| } | ||
| ++i; | ||
| } | ||
| } | ||
| return value; | ||
| }; | ||
| this.getRawSubstrLength = function (value, substr, pos) { | ||
| var mask = _this2.mask; | ||
| var i = pos; | ||
| substr = substr.split(''); | ||
| while (i < mask.length && substr.length) { | ||
| if (!_this2.isPermanentChar(i) || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| ++i; | ||
| } | ||
| } else { | ||
| ++i; | ||
| } | ||
| } | ||
| return i - pos; | ||
| }; | ||
| this.isAllowedChar = function (character, pos) { | ||
| var allowMaskChar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos] === character; | ||
| } | ||
| var ruleChar = mask[pos]; | ||
| var charRule = _this2.charsRules[ruleChar]; | ||
| return new RegExp(charRule).test(character || '') || allowMaskChar && character === maskChar; | ||
| }; | ||
| this.isPermanentChar = function (pos) { | ||
| return _this2.permanents.indexOf(pos) !== -1; | ||
| }; | ||
| this.setCursorToEnd = function () { | ||
| var filledLen = _this2.getFilledLength(); | ||
| var filledLen = getFilledLength(_this2.maskOptions, _this2.state.value); | ||
| var pos = _this2.getRightEditablePos(filledLen); | ||
@@ -444,7 +318,7 @@ if (pos !== null) { | ||
| var setPos = _this2.setSelection.bind(_this2, pos, 0); | ||
| _this2.setSelection(pos, 0); | ||
| raf(function () { | ||
| _this2.setSelection(pos, 0); | ||
| }); | ||
| setPos(); | ||
| raf(setPos); | ||
| _this2.lastCursorPos = pos; | ||
@@ -457,36 +331,2 @@ }; | ||
| this.parseMask = function (mask) { | ||
| if (!mask || typeof mask !== 'string') { | ||
| return { | ||
| mask: null, | ||
| lastEditablePos: null, | ||
| permanents: [] | ||
| }; | ||
| } | ||
| var str = ''; | ||
| var permanents = []; | ||
| var isPermanent = false; | ||
| var lastEditablePos = null; | ||
| mask.split('').forEach(function (character) { | ||
| if (!isPermanent && character === '\\') { | ||
| isPermanent = true; | ||
| } else { | ||
| if (isPermanent || !_this2.charsRules[character]) { | ||
| permanents.push(str.length); | ||
| } else { | ||
| lastEditablePos = str.length + 1; | ||
| } | ||
| str += character; | ||
| isPermanent = false; | ||
| } | ||
| }); | ||
| return { | ||
| mask: str, | ||
| lastEditablePos: lastEditablePos, | ||
| permanents: permanents | ||
| }; | ||
| }; | ||
| this.getStringValue = function (value) { | ||
@@ -496,70 +336,2 @@ return !value && value !== 0 ? '' : value + ''; | ||
| this.componentWillMount = function () { | ||
| var mask = _this2.mask; | ||
| var value = _this2.state.value; | ||
| if (mask && value) { | ||
| _this2.setState({ value: value }); | ||
| } | ||
| }; | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.charsRules = nextProps.formatChars != null ? nextProps.formatChars : _this2.defaultCharsRules; | ||
| var oldMask = _this2.mask; | ||
| var mask = _this2.parseMask(nextProps.mask); | ||
| var isMaskChanged = mask.mask && mask.mask !== _this2.mask; | ||
| _this2.mask = mask.mask; | ||
| _this2.permanents = mask.permanents; | ||
| _this2.lastEditablePos = mask.lastEditablePos; | ||
| _this2.maskChar = 'maskChar' in nextProps ? nextProps.maskChar : _this2.defaultMaskChar; | ||
| if (!_this2.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var newValue = nextProps.value != null ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMask && nextProps.value == null) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| if (isMaskChanged || mask.mask && (newValue || showEmpty)) { | ||
| newValue = _this2.formatValue(newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = _this2.getFilledLength(newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if (_this2.isFilled(newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (mask.mask && _this2.isEmpty(newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
| this.updateUncontrolledInput = function () { | ||
@@ -572,4 +344,8 @@ if (_this2.getInputValue() !== _this2.state.value) { | ||
| this.onKeyDown = function (event) { | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyDown === 'function'; | ||
| if (event.ctrlKey || event.metaKey) { | ||
| if (ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -583,3 +359,4 @@ _this2.props.onKeyDown(event); | ||
| var value = _this2.state.value; | ||
| var key = event.key; | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var preventDefault = false; | ||
@@ -589,9 +366,8 @@ switch (key) { | ||
| case 'Delete': | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var deleteFromRight = key === 'Delete'; | ||
| var selectionRange = _this2.getSelection(); | ||
| if (selectionRange.length) { | ||
| value = _this2.clearRange(value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefixLen || !deleteFromRight && cursorPos === prefixLen) { | ||
| cursorPos = prefixLen; | ||
| value = clearRange(_this2.maskOptions, value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefix.length || !deleteFromRight && cursorPos === prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } else { | ||
@@ -601,3 +377,3 @@ var editablePos = deleteFromRight ? _this2.getRightEditablePos(cursorPos) : _this2.getLeftEditablePos(cursorPos - 1); | ||
| if (editablePos !== null) { | ||
| value = _this2.clearRange(value, editablePos, 1); | ||
| value = clearRange(_this2.maskOptions, value, editablePos, 1); | ||
| cursorPos = editablePos; | ||
@@ -617,2 +393,4 @@ } | ||
| if (value !== _this2.state.value) { | ||
| preventDefault = true; | ||
| _this2.setInputValue(value); | ||
@@ -622,3 +400,3 @@ _this2.setState({ | ||
| }); | ||
| preventDefault = true; | ||
| if (typeof _this2.props.onChange === 'function') { | ||
@@ -628,2 +406,3 @@ _this2.props.onChange(event); | ||
| } | ||
| if (preventDefault) { | ||
@@ -636,5 +415,8 @@ event.preventDefault(); | ||
| this.onKeyPress = function (event) { | ||
| var key = event.key; | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyPress === 'function'; | ||
| if (key === 'Enter' || event.ctrlKey || event.metaKey) { | ||
| if (key === 'Enter' || ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -653,15 +435,16 @@ _this2.props.onKeyPress(event); | ||
| var value = _this2.state.value; | ||
| var mask = _this2.mask, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var _maskOptions = _this2.maskOptions, | ||
| mask = _maskOptions.mask, | ||
| lastEditablePos = _maskOptions.lastEditablePos, | ||
| prefix = _maskOptions.prefix; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| if (_this2.isPermanentChar(cursorPos) && mask[cursorPos] === key) { | ||
| value = _this2.insertRawSubstr(value, key, cursorPos); | ||
| if (isPermanentChar(_this2.maskOptions, cursorPos) && mask[cursorPos] === key) { | ||
| value = insertString(_this2.maskOptions, value, key, cursorPos); | ||
| ++cursorPos; | ||
| } else { | ||
| var editablePos = _this2.getRightEditablePos(cursorPos); | ||
| if (editablePos !== null && _this2.isAllowedChar(key, editablePos)) { | ||
| value = _this2.clearRange(value, selection.start, selection.length); | ||
| value = _this2.insertRawSubstr(value, key, editablePos); | ||
| if (editablePos !== null && isAllowedChar(_this2.maskOptions, editablePos, key)) { | ||
| value = clearRange(_this2.maskOptions, value, selection.start, selection.length); | ||
| value = insertString(_this2.maskOptions, value, key, editablePos); | ||
| cursorPos = editablePos + 1; | ||
@@ -680,4 +463,6 @@ } | ||
| } | ||
| event.preventDefault(); | ||
| if (cursorPos < lastEditablePos && cursorPos > prefixLen) { | ||
| if (cursorPos < lastEditablePos && cursorPos > prefix.length) { | ||
| cursorPos = _this2.getRightEditablePos(cursorPos); | ||
@@ -689,6 +474,8 @@ } | ||
| this.onChange = function (event) { | ||
| var pasteSelection = _this2.pasteSelection, | ||
| mask = _this2.mask, | ||
| maskChar = _this2.maskChar, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var pasteSelection = _this2.pasteSelection; | ||
| var _maskOptions2 = _this2.maskOptions, | ||
| mask = _maskOptions2.mask, | ||
| maskChar = _maskOptions2.maskChar, | ||
| lastEditablePos = _maskOptions2.lastEditablePos, | ||
| prefix = _maskOptions2.prefix; | ||
@@ -713,11 +500,12 @@ var value = _this2.getInputValue(); | ||
| var oldValueLen = oldValue.length; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var clearedValue; | ||
| var enteredString; | ||
| if (valueLen > oldValueLen) { | ||
| var substrLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - substrLen; | ||
| var enteredSubstr = value.substr(startPos, substrLen); | ||
| var enteredStringLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - enteredStringLen; | ||
| enteredString = value.substr(startPos, enteredStringLen); | ||
| if (startPos < lastEditablePos && (substrLen !== 1 || enteredSubstr !== mask[startPos])) { | ||
| if (startPos < lastEditablePos && (enteredStringLen !== 1 || enteredString !== mask[startPos])) { | ||
| cursorPos = _this2.getRightEditablePos(startPos); | ||
@@ -728,11 +516,11 @@ } else { | ||
| value = value.substr(0, startPos) + value.substr(startPos + substrLen); | ||
| value = value.substr(0, startPos) + value.substr(startPos + enteredStringLen); | ||
| clearedValue = _this2.clearRange(value, startPos, maskLen - startPos); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, enteredSubstr, cursorPos); | ||
| clearedValue = clearRange(_this2.maskOptions, value, startPos, maskLen - startPos); | ||
| clearedValue = insertString(_this2.maskOptions, clearedValue, enteredString, cursorPos); | ||
| value = _this2.insertRawSubstr(oldValue, enteredSubstr, cursorPos); | ||
| value = insertString(_this2.maskOptions, oldValue, enteredString, cursorPos); | ||
| if (substrLen !== 1 || cursorPos >= prefixLen && cursorPos < lastEditablePos) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| if (enteredStringLen !== 1 || cursorPos >= prefix.length && cursorPos < lastEditablePos) { | ||
| cursorPos = getFilledLength(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < lastEditablePos) { | ||
@@ -743,20 +531,21 @@ cursorPos++; | ||
| var removedLen = maskLen - valueLen; | ||
| clearedValue = _this2.clearRange(oldValue, selection.end, removedLen); | ||
| var substr = value.substr(0, selection.end); | ||
| var clearOnly = substr === oldValue.substr(0, selection.end); | ||
| enteredString = value.substr(0, selection.end); | ||
| var clearOnly = enteredString === oldValue.substr(0, selection.end); | ||
| clearedValue = clearRange(_this2.maskOptions, oldValue, selection.end, removedLen); | ||
| if (maskChar) { | ||
| value = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| value = insertString(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| } | ||
| clearedValue = _this2.clearRange(clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| clearedValue = clearRange(_this2.maskOptions, clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = insertString(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| if (!clearOnly) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| } else if (cursorPos < prefixLen) { | ||
| cursorPos = prefixLen; | ||
| cursorPos = getFilledLength(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } | ||
| } | ||
| value = _this2.formatValue(value); | ||
| value = formatValue(_this2.maskOptions, value); | ||
@@ -766,2 +555,6 @@ if (_this2.isWindowsPhoneBrowser) { | ||
| setTimeout(function () { | ||
| if (_this2.unmounted) { | ||
| return; | ||
| } | ||
| _this2.setInputValue(value); | ||
@@ -813,5 +606,5 @@ | ||
| if (!_this2.state.value) { | ||
| var prefix = _this2.getPrefix(); | ||
| var value = _this2.formatValue(prefix); | ||
| var inputValue = _this2.formatValue(value); | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var value = formatValue(_this2.maskOptions, prefix); | ||
| var inputValue = formatValue(_this2.maskOptions, value); | ||
@@ -833,3 +626,3 @@ // do not use this.getInputValue and this.setInputValue as this.input | ||
| } | ||
| } else if (_this2.getFilledLength() < _this2.mask.length) { | ||
| } else if (getFilledLength(_this2.maskOptions, _this2.state.value) < _this2.maskOptions.mask.length) { | ||
| _this2.setCursorToEnd(); | ||
@@ -844,11 +637,14 @@ } | ||
| this.onBlur = function (event) { | ||
| if (!_this2.props.alwaysShowMask && _this2.isEmpty(_this2.state.value)) { | ||
| if (!_this2.props.alwaysShowMask && isEmpty(_this2.maskOptions, _this2.state.value)) { | ||
| var inputValue = ''; | ||
| var isInputValueChanged = inputValue !== _this2.getInputValue(); | ||
| if (isInputValueChanged) { | ||
| _this2.setInputValue(inputValue); | ||
| } | ||
| _this2.setState({ | ||
| value: _this2.hasValue ? _this2.state.value : '' | ||
| }); | ||
| if (isInputValueChanged && typeof _this2.props.onChange === 'function') { | ||
@@ -870,2 +666,3 @@ _this2.props.onChange(event); | ||
| } | ||
| var text; | ||
@@ -878,2 +675,3 @@ if (window.clipboardData && window.clipboardData.getData) { | ||
| } | ||
| if (text) { | ||
@@ -884,2 +682,3 @@ var value = _this2.state.value; | ||
| } | ||
| event.preventDefault(); | ||
@@ -891,8 +690,9 @@ }; | ||
| if (selection.length) { | ||
| value = _this2.clearRange(value, cursorPos, selection.length); | ||
| value = clearRange(_this2.maskOptions, value, cursorPos, selection.length); | ||
| } | ||
| var textLen = _this2.getRawSubstrLength(value, text, cursorPos); | ||
| value = _this2.insertRawSubstr(value, text, cursorPos); | ||
| var textLen = getInsertStringLength(_this2.maskOptions, value, text, cursorPos); | ||
| value = insertString(_this2.maskOptions, value, text, cursorPos); | ||
| cursorPos += textLen; | ||
| cursorPos = _this2.getRightEditablePos(cursorPos) || cursorPos; | ||
| if (value !== _this2.getInputValue()) { | ||
@@ -909,24 +709,6 @@ if (event) { | ||
| } | ||
| _this2.setCursorPos(cursorPos); | ||
| }; | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = _this2.isAndroidBrowser(); | ||
| _this2.isWindowsPhoneBrowser = _this2.isWindowsPhoneBrowser(); | ||
| _this2.isAndroidFirefox = _this2.isAndroidFirefox(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.render = function () { | ||
@@ -940,3 +722,3 @@ var _props = _this2.props, | ||
| if (_this2.mask) { | ||
| if (_this2.maskOptions.mask) { | ||
| if (!props.disabled && !props.readOnly) { | ||
@@ -953,2 +735,3 @@ var handlersKeys = ['onFocus', 'onBlur', 'onChange', 'onKeyDown', 'onKeyPress', 'onPaste']; | ||
| } | ||
| return React.createElement('input', _extends({ ref: function ref(_ref) { | ||
@@ -955,0 +738,0 @@ return _this2.input = _ref; |
627
lib/index.js
@@ -11,2 +11,4 @@ 'use strict'; | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| var _react = require('react'); | ||
@@ -16,2 +18,10 @@ | ||
| var _parseMask = require('./utils/parseMask'); | ||
| var _parseMask2 = _interopRequireDefault(_parseMask); | ||
| var _environment = require('./utils/environment'); | ||
| var _string = require('./utils/string'); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
@@ -27,2 +37,3 @@ | ||
| var InputElement = function (_React$Component) { | ||
@@ -38,18 +49,24 @@ _inherits(InputElement, _React$Component); | ||
| _this.hasValue = props.value != null; | ||
| _this.charsRules = props.formatChars != null ? props.formatChars : _this.defaultCharsRules; | ||
| var mask = props.mask, | ||
| maskChar = props.maskChar, | ||
| formatChars = props.formatChars, | ||
| defaultValue = props.defaultValue, | ||
| value = props.value, | ||
| alwaysShowMask = props.alwaysShowMask; | ||
| var mask = _this.parseMask(props.mask); | ||
| var defaultValue = props.defaultValue != null ? props.defaultValue : ''; | ||
| var value = props.value != null ? props.value : defaultValue; | ||
| _this.hasValue = value != null; | ||
| _this.maskOptions = (0, _parseMask2.default)(mask, maskChar, formatChars); | ||
| if (defaultValue == null) { | ||
| defaultValue = ''; | ||
| } | ||
| if (value == null) { | ||
| value = defaultValue; | ||
| } | ||
| value = _this.getStringValue(value); | ||
| _this.mask = mask.mask; | ||
| _this.permanents = mask.permanents; | ||
| _this.lastEditablePos = mask.lastEditablePos; | ||
| _this.maskChar = 'maskChar' in props ? props.maskChar : _this.defaultMaskChar; | ||
| if (_this.mask && (props.alwaysShowMask || value)) { | ||
| value = _this.formatValue(value); | ||
| if (_this.maskOptions.mask && (alwaysShowMask || value)) { | ||
| value = (0, _string.formatValue)(_this.maskOptions, value); | ||
| } | ||
@@ -61,2 +78,9 @@ | ||
| _createClass(InputElement, [{ | ||
| key: 'componentWillUnmount', | ||
| value: function componentWillUnmount() { | ||
| this.unmounted = true; | ||
| } | ||
| }]); | ||
| return InputElement; | ||
@@ -68,31 +92,78 @@ }(_react2.default.Component); | ||
| this.defaultCharsRules = { | ||
| '9': '[0-9]', | ||
| 'a': '[A-Za-z]', | ||
| '*': '[A-Za-z0-9]' | ||
| }; | ||
| this.defaultMaskChar = '_'; | ||
| this.lastCursorPos = null; | ||
| this.isAndroidBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && !firefox.test(ua) && android.test(ua); | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = (0, _environment.isAndroidBrowser)(); | ||
| _this2.isWindowsPhoneBrowser = (0, _environment.isWindowsPhoneBrowser)(); | ||
| _this2.isAndroidFirefox = (0, _environment.isAndroidFirefox)(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.maskOptions.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.isWindowsPhoneBrowser = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var phone = new RegExp('phone', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return windows.test(ua) && phone.test(ua); | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| var oldMaskOptions = _this2.maskOptions; | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.maskOptions = (0, _parseMask2.default)(nextProps.mask, nextProps.maskChar, nextProps.formatChars); | ||
| if (!_this2.maskOptions.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var isMaskChanged = _this2.maskOptions.mask && _this2.maskOptions.mask !== oldMaskOptions.mask; | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| var newValue = _this2.hasValue ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMaskOptions.mask && !_this2.hasValue) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| if (isMaskChanged || _this2.maskOptions.mask && (newValue || showEmpty)) { | ||
| newValue = (0, _string.formatValue)(_this2.maskOptions, newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = (0, _string.getFilledLength)(_this2.maskOptions, newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if ((0, _string.isFilled)(_this2.maskOptions, newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (_this2.maskOptions.mask && (0, _string.isEmpty)(_this2.maskOptions, newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.isAndroidFirefox = function () { | ||
| var windows = new RegExp('windows', 'i'); | ||
| var firefox = new RegExp('firefox', 'i'); | ||
| var android = new RegExp('android', 'i'); | ||
| var ua = navigator.userAgent; | ||
| return !windows.test(ua) && firefox.test(ua) && android.test(ua); | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.maskOptions.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
@@ -130,5 +201,5 @@ | ||
| }, | ||
| set: function set(val) { | ||
| _this2.value = val; | ||
| _this2.valueDescriptor.set.call(input, val); | ||
| set: function set(value) { | ||
| _this2.value = value; | ||
| _this2.valueDescriptor.set.call(input, value); | ||
| } | ||
@@ -142,7 +213,8 @@ }); | ||
| if (!valueDescriptor) { | ||
| var input = _this2.getInputDOMNode(); | ||
| if (!valueDescriptor || !input) { | ||
| return; | ||
| } | ||
| _this2.valueDescriptor = null; | ||
| var input = _this2.getInputDOMNode(); | ||
| Object.defineProperty(input, 'value', valueDescriptor); | ||
@@ -166,37 +238,10 @@ }; | ||
| this.setInputValue = function (val) { | ||
| this.setInputValue = function (value) { | ||
| var input = _this2.getInputDOMNode(); | ||
| _this2.value = val; | ||
| input.value = val; | ||
| }; | ||
| this.getPrefix = function () { | ||
| var prefix = ''; | ||
| var mask = _this2.mask; | ||
| for (var i = 0; i < mask.length && _this2.isPermanentChar(i); ++i) { | ||
| prefix += mask[i]; | ||
| if (!input) { | ||
| return; | ||
| } | ||
| return prefix; | ||
| }; | ||
| this.getFilledLength = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| var i; | ||
| var maskChar = _this2.maskChar; | ||
| if (!maskChar) { | ||
| return value.length; | ||
| } | ||
| for (i = value.length - 1; i >= 0; --i) { | ||
| var character = value[i]; | ||
| if (!_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i)) { | ||
| break; | ||
| } | ||
| } | ||
| return ++i || _this2.getPrefix().length; | ||
| _this2.value = value; | ||
| input.value = value; | ||
| }; | ||
@@ -206,3 +251,3 @@ | ||
| for (var i = pos; i >= 0; --i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!(0, _string.isPermanentChar)(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -215,6 +260,6 @@ } | ||
| this.getRightEditablePos = function (pos) { | ||
| var mask = _this2.mask; | ||
| var mask = _this2.maskOptions.mask; | ||
| for (var i = pos; i < mask.length; ++i) { | ||
| if (!_this2.isPermanentChar(i)) { | ||
| if (!(0, _string.isPermanentChar)(_this2.maskOptions, i)) { | ||
| return i; | ||
@@ -226,169 +271,4 @@ } | ||
| this.isEmpty = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return !value.split('').some(function (character, i) { | ||
| return !_this2.isPermanentChar(i) && _this2.isAllowedChar(character, i); | ||
| }); | ||
| }; | ||
| this.isFilled = function () { | ||
| var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.state.value; | ||
| return _this2.getFilledLength(value) === _this2.mask.length; | ||
| }; | ||
| this.createFilledArray = function (length, val) { | ||
| var array = []; | ||
| for (var i = 0; i < length; i++) { | ||
| array[i] = val; | ||
| } | ||
| return array; | ||
| }; | ||
| this.formatValue = function (value) { | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefix = _this2.getPrefix(); | ||
| var prefixLen = prefix.length; | ||
| value = _this2.insertRawSubstr('', value, 0); | ||
| while (value.length > prefixLen && _this2.isPermanentChar(value.length - 1)) { | ||
| value = value.slice(0, value.length - 1); | ||
| } | ||
| if (value.length < prefixLen) { | ||
| value = prefix; | ||
| } | ||
| return value; | ||
| } | ||
| if (value) { | ||
| var emptyValue = _this2.formatValue(''); | ||
| return _this2.insertRawSubstr(emptyValue, value, 0); | ||
| } | ||
| return value.split('').concat(_this2.createFilledArray(mask.length - value.length, null)).map(function (character, pos) { | ||
| if (_this2.isAllowedChar(character, pos)) { | ||
| return character; | ||
| } else if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.clearRange = function (value, start, len) { | ||
| var end = start + len; | ||
| var maskChar = _this2.maskChar, | ||
| mask = _this2.mask; | ||
| if (!maskChar) { | ||
| var prefixLen = _this2.getPrefix().length; | ||
| value = value.split('').filter(function (character, i) { | ||
| return i < prefixLen || i < start || i >= end; | ||
| }).join(''); | ||
| return _this2.formatValue(value); | ||
| } | ||
| return value.split('').map(function (character, i) { | ||
| if (i < start || i >= end) { | ||
| return character; | ||
| } | ||
| if (_this2.isPermanentChar(i)) { | ||
| return mask[i]; | ||
| } | ||
| return maskChar; | ||
| }).join(''); | ||
| }; | ||
| this.replaceSubstr = function (value, newSubstr, pos) { | ||
| return value.slice(0, pos) + newSubstr + value.slice(pos + newSubstr.length); | ||
| }; | ||
| this.insertRawSubstr = function (value, substr, pos) { | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| var isFilled = _this2.isFilled(value); | ||
| var prefixLen = _this2.getPrefix().length; | ||
| substr = substr.split(''); | ||
| if (!maskChar && pos > value.length) { | ||
| value += mask.slice(value.length, pos); | ||
| } | ||
| for (var i = pos; i < mask.length && substr.length;) { | ||
| var isPermanent = _this2.isPermanentChar(i); | ||
| if (!isPermanent || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| if (i < value.length) { | ||
| if (maskChar || isFilled || i < prefixLen) { | ||
| value = _this2.replaceSubstr(value, character, i); | ||
| } else { | ||
| value = _this2.formatValue(value.substr(0, i) + character + value.substr(i)); | ||
| } | ||
| } else if (!maskChar) { | ||
| value += character; | ||
| } | ||
| ++i; | ||
| } | ||
| } else { | ||
| if (!maskChar && i >= value.length) { | ||
| value += mask[i]; | ||
| } else if (maskChar && isPermanent && substr[0] === maskChar) { | ||
| substr.shift(); | ||
| } | ||
| ++i; | ||
| } | ||
| } | ||
| return value; | ||
| }; | ||
| this.getRawSubstrLength = function (value, substr, pos) { | ||
| var mask = _this2.mask; | ||
| var i = pos; | ||
| substr = substr.split(''); | ||
| while (i < mask.length && substr.length) { | ||
| if (!_this2.isPermanentChar(i) || mask[i] === substr[0]) { | ||
| var character = substr.shift(); | ||
| if (_this2.isAllowedChar(character, i, true)) { | ||
| ++i; | ||
| } | ||
| } else { | ||
| ++i; | ||
| } | ||
| } | ||
| return i - pos; | ||
| }; | ||
| this.isAllowedChar = function (character, pos) { | ||
| var allowMaskChar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
| var mask = _this2.mask, | ||
| maskChar = _this2.maskChar; | ||
| if (_this2.isPermanentChar(pos)) { | ||
| return mask[pos] === character; | ||
| } | ||
| var ruleChar = mask[pos]; | ||
| var charRule = _this2.charsRules[ruleChar]; | ||
| return new RegExp(charRule).test(character || '') || allowMaskChar && character === maskChar; | ||
| }; | ||
| this.isPermanentChar = function (pos) { | ||
| return _this2.permanents.indexOf(pos) !== -1; | ||
| }; | ||
| this.setCursorToEnd = function () { | ||
| var filledLen = _this2.getFilledLength(); | ||
| var filledLen = (0, _string.getFilledLength)(_this2.maskOptions, _this2.state.value); | ||
| var pos = _this2.getRightEditablePos(filledLen); | ||
@@ -453,7 +333,7 @@ if (pos !== null) { | ||
| var setPos = _this2.setSelection.bind(_this2, pos, 0); | ||
| _this2.setSelection(pos, 0); | ||
| raf(function () { | ||
| _this2.setSelection(pos, 0); | ||
| }); | ||
| setPos(); | ||
| raf(setPos); | ||
| _this2.lastCursorPos = pos; | ||
@@ -466,36 +346,2 @@ }; | ||
| this.parseMask = function (mask) { | ||
| if (!mask || typeof mask !== 'string') { | ||
| return { | ||
| mask: null, | ||
| lastEditablePos: null, | ||
| permanents: [] | ||
| }; | ||
| } | ||
| var str = ''; | ||
| var permanents = []; | ||
| var isPermanent = false; | ||
| var lastEditablePos = null; | ||
| mask.split('').forEach(function (character) { | ||
| if (!isPermanent && character === '\\') { | ||
| isPermanent = true; | ||
| } else { | ||
| if (isPermanent || !_this2.charsRules[character]) { | ||
| permanents.push(str.length); | ||
| } else { | ||
| lastEditablePos = str.length + 1; | ||
| } | ||
| str += character; | ||
| isPermanent = false; | ||
| } | ||
| }); | ||
| return { | ||
| mask: str, | ||
| lastEditablePos: lastEditablePos, | ||
| permanents: permanents | ||
| }; | ||
| }; | ||
| this.getStringValue = function (value) { | ||
@@ -505,70 +351,2 @@ return !value && value !== 0 ? '' : value + ''; | ||
| this.componentWillMount = function () { | ||
| var mask = _this2.mask; | ||
| var value = _this2.state.value; | ||
| if (mask && value) { | ||
| _this2.setState({ value: value }); | ||
| } | ||
| }; | ||
| this.componentWillReceiveProps = function (nextProps) { | ||
| _this2.hasValue = nextProps.value != null; | ||
| _this2.charsRules = nextProps.formatChars != null ? nextProps.formatChars : _this2.defaultCharsRules; | ||
| var oldMask = _this2.mask; | ||
| var mask = _this2.parseMask(nextProps.mask); | ||
| var isMaskChanged = mask.mask && mask.mask !== _this2.mask; | ||
| _this2.mask = mask.mask; | ||
| _this2.permanents = mask.permanents; | ||
| _this2.lastEditablePos = mask.lastEditablePos; | ||
| _this2.maskChar = 'maskChar' in nextProps ? nextProps.maskChar : _this2.defaultMaskChar; | ||
| if (!_this2.mask) { | ||
| _this2.lastCursorPos = null; | ||
| return; | ||
| } | ||
| var newValue = nextProps.value != null ? _this2.getStringValue(nextProps.value) : _this2.state.value; | ||
| if (!oldMask && nextProps.value == null) { | ||
| newValue = _this2.getInputDOMNode().value; | ||
| } | ||
| var showEmpty = nextProps.alwaysShowMask || _this2.isFocused(); | ||
| if (isMaskChanged || mask.mask && (newValue || showEmpty)) { | ||
| newValue = _this2.formatValue(newValue); | ||
| if (isMaskChanged) { | ||
| var pos = _this2.lastCursorPos; | ||
| var filledLen = _this2.getFilledLength(newValue); | ||
| if (pos === null || filledLen < pos) { | ||
| if (_this2.isFilled(newValue)) { | ||
| pos = filledLen; | ||
| } else { | ||
| pos = _this2.getRightEditablePos(filledLen); | ||
| } | ||
| _this2.setCursorPos(pos); | ||
| } | ||
| } | ||
| } | ||
| if (mask.mask && _this2.isEmpty(newValue) && !showEmpty && (!_this2.hasValue || !nextProps.value)) { | ||
| newValue = ''; | ||
| } | ||
| _this2.value = newValue; | ||
| if (_this2.state.value !== newValue) { | ||
| _this2.setState({ value: newValue }); | ||
| } | ||
| }; | ||
| this.componentDidUpdate = function (prevProps) { | ||
| if ((_this2.mask || prevProps.mask) && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| if (_this2.valueDescriptor && _this2.getInputValue() !== _this2.state.value) { | ||
| _this2.setInputValue(_this2.state.value); | ||
| } | ||
| }; | ||
| this.updateUncontrolledInput = function () { | ||
@@ -581,4 +359,8 @@ if (_this2.getInputValue() !== _this2.state.value) { | ||
| this.onKeyDown = function (event) { | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyDown === 'function'; | ||
| if (event.ctrlKey || event.metaKey) { | ||
| if (ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -592,3 +374,4 @@ _this2.props.onKeyDown(event); | ||
| var value = _this2.state.value; | ||
| var key = event.key; | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var preventDefault = false; | ||
@@ -598,9 +381,8 @@ switch (key) { | ||
| case 'Delete': | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var deleteFromRight = key === 'Delete'; | ||
| var selectionRange = _this2.getSelection(); | ||
| if (selectionRange.length) { | ||
| value = _this2.clearRange(value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefixLen || !deleteFromRight && cursorPos === prefixLen) { | ||
| cursorPos = prefixLen; | ||
| value = (0, _string.clearRange)(_this2.maskOptions, value, selectionRange.start, selectionRange.length); | ||
| } else if (cursorPos < prefix.length || !deleteFromRight && cursorPos === prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } else { | ||
@@ -610,3 +392,3 @@ var editablePos = deleteFromRight ? _this2.getRightEditablePos(cursorPos) : _this2.getLeftEditablePos(cursorPos - 1); | ||
| if (editablePos !== null) { | ||
| value = _this2.clearRange(value, editablePos, 1); | ||
| value = (0, _string.clearRange)(_this2.maskOptions, value, editablePos, 1); | ||
| cursorPos = editablePos; | ||
@@ -626,2 +408,4 @@ } | ||
| if (value !== _this2.state.value) { | ||
| preventDefault = true; | ||
| _this2.setInputValue(value); | ||
@@ -631,3 +415,3 @@ _this2.setState({ | ||
| }); | ||
| preventDefault = true; | ||
| if (typeof _this2.props.onChange === 'function') { | ||
@@ -637,2 +421,3 @@ _this2.props.onChange(event); | ||
| } | ||
| if (preventDefault) { | ||
@@ -645,5 +430,8 @@ event.preventDefault(); | ||
| this.onKeyPress = function (event) { | ||
| var key = event.key; | ||
| var key = event.key, | ||
| ctrlKey = event.ctrlKey, | ||
| metaKey = event.metaKey; | ||
| var hasHandler = typeof _this2.props.onKeyPress === 'function'; | ||
| if (key === 'Enter' || event.ctrlKey || event.metaKey) { | ||
| if (key === 'Enter' || ctrlKey || metaKey) { | ||
| if (hasHandler) { | ||
@@ -662,15 +450,16 @@ _this2.props.onKeyPress(event); | ||
| var value = _this2.state.value; | ||
| var mask = _this2.mask, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var _maskOptions = _this2.maskOptions, | ||
| mask = _maskOptions.mask, | ||
| lastEditablePos = _maskOptions.lastEditablePos, | ||
| prefix = _maskOptions.prefix; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| if (_this2.isPermanentChar(cursorPos) && mask[cursorPos] === key) { | ||
| value = _this2.insertRawSubstr(value, key, cursorPos); | ||
| if ((0, _string.isPermanentChar)(_this2.maskOptions, cursorPos) && mask[cursorPos] === key) { | ||
| value = (0, _string.insertString)(_this2.maskOptions, value, key, cursorPos); | ||
| ++cursorPos; | ||
| } else { | ||
| var editablePos = _this2.getRightEditablePos(cursorPos); | ||
| if (editablePos !== null && _this2.isAllowedChar(key, editablePos)) { | ||
| value = _this2.clearRange(value, selection.start, selection.length); | ||
| value = _this2.insertRawSubstr(value, key, editablePos); | ||
| if (editablePos !== null && (0, _string.isAllowedChar)(_this2.maskOptions, editablePos, key)) { | ||
| value = (0, _string.clearRange)(_this2.maskOptions, value, selection.start, selection.length); | ||
| value = (0, _string.insertString)(_this2.maskOptions, value, key, editablePos); | ||
| cursorPos = editablePos + 1; | ||
@@ -689,4 +478,6 @@ } | ||
| } | ||
| event.preventDefault(); | ||
| if (cursorPos < lastEditablePos && cursorPos > prefixLen) { | ||
| if (cursorPos < lastEditablePos && cursorPos > prefix.length) { | ||
| cursorPos = _this2.getRightEditablePos(cursorPos); | ||
@@ -698,6 +489,8 @@ } | ||
| this.onChange = function (event) { | ||
| var pasteSelection = _this2.pasteSelection, | ||
| mask = _this2.mask, | ||
| maskChar = _this2.maskChar, | ||
| lastEditablePos = _this2.lastEditablePos; | ||
| var pasteSelection = _this2.pasteSelection; | ||
| var _maskOptions2 = _this2.maskOptions, | ||
| mask = _maskOptions2.mask, | ||
| maskChar = _maskOptions2.maskChar, | ||
| lastEditablePos = _maskOptions2.lastEditablePos, | ||
| prefix = _maskOptions2.prefix; | ||
@@ -722,11 +515,12 @@ var value = _this2.getInputValue(); | ||
| var oldValueLen = oldValue.length; | ||
| var prefixLen = _this2.getPrefix().length; | ||
| var clearedValue; | ||
| var enteredString; | ||
| if (valueLen > oldValueLen) { | ||
| var substrLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - substrLen; | ||
| var enteredSubstr = value.substr(startPos, substrLen); | ||
| var enteredStringLen = valueLen - oldValueLen; | ||
| var startPos = selection.end - enteredStringLen; | ||
| enteredString = value.substr(startPos, enteredStringLen); | ||
| if (startPos < lastEditablePos && (substrLen !== 1 || enteredSubstr !== mask[startPos])) { | ||
| if (startPos < lastEditablePos && (enteredStringLen !== 1 || enteredString !== mask[startPos])) { | ||
| cursorPos = _this2.getRightEditablePos(startPos); | ||
@@ -737,11 +531,11 @@ } else { | ||
| value = value.substr(0, startPos) + value.substr(startPos + substrLen); | ||
| value = value.substr(0, startPos) + value.substr(startPos + enteredStringLen); | ||
| clearedValue = _this2.clearRange(value, startPos, maskLen - startPos); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, enteredSubstr, cursorPos); | ||
| clearedValue = (0, _string.clearRange)(_this2.maskOptions, value, startPos, maskLen - startPos); | ||
| clearedValue = (0, _string.insertString)(_this2.maskOptions, clearedValue, enteredString, cursorPos); | ||
| value = _this2.insertRawSubstr(oldValue, enteredSubstr, cursorPos); | ||
| value = (0, _string.insertString)(_this2.maskOptions, oldValue, enteredString, cursorPos); | ||
| if (substrLen !== 1 || cursorPos >= prefixLen && cursorPos < lastEditablePos) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| if (enteredStringLen !== 1 || cursorPos >= prefix.length && cursorPos < lastEditablePos) { | ||
| cursorPos = (0, _string.getFilledLength)(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < lastEditablePos) { | ||
@@ -752,20 +546,21 @@ cursorPos++; | ||
| var removedLen = maskLen - valueLen; | ||
| clearedValue = _this2.clearRange(oldValue, selection.end, removedLen); | ||
| var substr = value.substr(0, selection.end); | ||
| var clearOnly = substr === oldValue.substr(0, selection.end); | ||
| enteredString = value.substr(0, selection.end); | ||
| var clearOnly = enteredString === oldValue.substr(0, selection.end); | ||
| clearedValue = (0, _string.clearRange)(_this2.maskOptions, oldValue, selection.end, removedLen); | ||
| if (maskChar) { | ||
| value = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| value = (0, _string.insertString)(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| } | ||
| clearedValue = _this2.clearRange(clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = _this2.insertRawSubstr(clearedValue, substr, 0); | ||
| clearedValue = (0, _string.clearRange)(_this2.maskOptions, clearedValue, selection.end, maskLen - selection.end); | ||
| clearedValue = (0, _string.insertString)(_this2.maskOptions, clearedValue, enteredString, 0); | ||
| if (!clearOnly) { | ||
| cursorPos = _this2.getFilledLength(clearedValue); | ||
| } else if (cursorPos < prefixLen) { | ||
| cursorPos = prefixLen; | ||
| cursorPos = (0, _string.getFilledLength)(_this2.maskOptions, clearedValue); | ||
| } else if (cursorPos < prefix.length) { | ||
| cursorPos = prefix.length; | ||
| } | ||
| } | ||
| value = _this2.formatValue(value); | ||
| value = (0, _string.formatValue)(_this2.maskOptions, value); | ||
@@ -775,2 +570,6 @@ if (_this2.isWindowsPhoneBrowser) { | ||
| setTimeout(function () { | ||
| if (_this2.unmounted) { | ||
| return; | ||
| } | ||
| _this2.setInputValue(value); | ||
@@ -822,5 +621,5 @@ | ||
| if (!_this2.state.value) { | ||
| var prefix = _this2.getPrefix(); | ||
| var value = _this2.formatValue(prefix); | ||
| var inputValue = _this2.formatValue(value); | ||
| var prefix = _this2.maskOptions.prefix; | ||
| var value = (0, _string.formatValue)(_this2.maskOptions, prefix); | ||
| var inputValue = (0, _string.formatValue)(_this2.maskOptions, value); | ||
@@ -842,3 +641,3 @@ // do not use this.getInputValue and this.setInputValue as this.input | ||
| } | ||
| } else if (_this2.getFilledLength() < _this2.mask.length) { | ||
| } else if ((0, _string.getFilledLength)(_this2.maskOptions, _this2.state.value) < _this2.maskOptions.mask.length) { | ||
| _this2.setCursorToEnd(); | ||
@@ -853,11 +652,14 @@ } | ||
| this.onBlur = function (event) { | ||
| if (!_this2.props.alwaysShowMask && _this2.isEmpty(_this2.state.value)) { | ||
| if (!_this2.props.alwaysShowMask && (0, _string.isEmpty)(_this2.maskOptions, _this2.state.value)) { | ||
| var inputValue = ''; | ||
| var isInputValueChanged = inputValue !== _this2.getInputValue(); | ||
| if (isInputValueChanged) { | ||
| _this2.setInputValue(inputValue); | ||
| } | ||
| _this2.setState({ | ||
| value: _this2.hasValue ? _this2.state.value : '' | ||
| }); | ||
| if (isInputValueChanged && typeof _this2.props.onChange === 'function') { | ||
@@ -879,2 +681,3 @@ _this2.props.onChange(event); | ||
| } | ||
| var text; | ||
@@ -887,2 +690,3 @@ if (window.clipboardData && window.clipboardData.getData) { | ||
| } | ||
| if (text) { | ||
@@ -893,2 +697,3 @@ var value = _this2.state.value; | ||
| } | ||
| event.preventDefault(); | ||
@@ -900,8 +705,9 @@ }; | ||
| if (selection.length) { | ||
| value = _this2.clearRange(value, cursorPos, selection.length); | ||
| value = (0, _string.clearRange)(_this2.maskOptions, value, cursorPos, selection.length); | ||
| } | ||
| var textLen = _this2.getRawSubstrLength(value, text, cursorPos); | ||
| value = _this2.insertRawSubstr(value, text, cursorPos); | ||
| var textLen = (0, _string.getInsertStringLength)(_this2.maskOptions, value, text, cursorPos); | ||
| value = (0, _string.insertString)(_this2.maskOptions, value, text, cursorPos); | ||
| cursorPos += textLen; | ||
| cursorPos = _this2.getRightEditablePos(cursorPos) || cursorPos; | ||
| if (value !== _this2.getInputValue()) { | ||
@@ -918,24 +724,6 @@ if (event) { | ||
| } | ||
| _this2.setCursorPos(cursorPos); | ||
| }; | ||
| this.componentDidMount = function () { | ||
| _this2.isAndroidBrowser = _this2.isAndroidBrowser(); | ||
| _this2.isWindowsPhoneBrowser = _this2.isWindowsPhoneBrowser(); | ||
| _this2.isAndroidFirefox = _this2.isAndroidFirefox(); | ||
| var input = _this2.getInputDOMNode(); | ||
| // workaround for Jest | ||
| // it doesn't mount a real node so input will be null | ||
| if (input && Object.getOwnPropertyDescriptor && Object.getPrototypeOf && Object.defineProperty) { | ||
| var valueDescriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(input), 'value'); | ||
| _this2.canUseAccessors = !!(valueDescriptor && valueDescriptor.get && valueDescriptor.set); | ||
| } | ||
| if (_this2.mask && _this2.props.value == null) { | ||
| _this2.updateUncontrolledInput(); | ||
| } | ||
| }; | ||
| this.render = function () { | ||
@@ -949,3 +737,3 @@ var _props = _this2.props, | ||
| if (_this2.mask) { | ||
| if (_this2.maskOptions.mask) { | ||
| if (!props.disabled && !props.readOnly) { | ||
@@ -962,2 +750,3 @@ var handlersKeys = ['onFocus', 'onBlur', 'onChange', 'onKeyDown', 'onKeyPress', 'onPaste']; | ||
| } | ||
| return _react2.default.createElement('input', _extends({ ref: function ref(_ref) { | ||
@@ -964,0 +753,0 @@ return _this2.input = _ref; |
| { | ||
| "name": "react-input-mask", | ||
| "description": "Masked input component for React", | ||
| "version": "0.9.1", | ||
| "version": "1.0.0-beta.1", | ||
| "homepage": "https://github.com/sanniassin/react-input-mask", | ||
| "license": "MIT", | ||
| "author": "Nikita Lobachev <sanniassin@yandex.ru>", | ||
| "author": "Nikita Lobachev <sanniassin@gmail.com>", | ||
| "keywords": [ | ||
@@ -61,5 +61,6 @@ "react", | ||
| "prepare": "npm test && npm run clean && npm run build", | ||
| "test": "npm run test:input && npm run test:server-render", | ||
| "test": "npm run build && npm run test:input && npm run test:server-render && npm run test:build", | ||
| "test:input": "cross-env BABEL_ENV=commonjs karma start", | ||
| "test:server-render": "cross-env BABEL_ENV=commonjs mocha --compilers js:babel-core/register ./tests/server-render" | ||
| "test:server-render": "cross-env BABEL_ENV=commonjs mocha --compilers js:babel-core/register ./tests/server-render", | ||
| "test:build": "cross-env BABEL_ENV=commonjs mocha --compilers js:babel-core/register ./tests/build" | ||
| }, | ||
@@ -66,0 +67,0 @@ "repository": { |
@@ -10,5 +10,3 @@ # react-input-mask | ||
| ## Install | ||
| ``` | ||
| npm install react-input-mask --save | ||
| ``` | ||
| ```npm install react-input-mask --save``` | ||
@@ -54,3 +52,3 @@ Also you can use it without module bundler | ||
| ## Example | ||
| ```js | ||
| ```jsx | ||
| import React from 'react'; | ||
@@ -57,0 +55,0 @@ import InputMask from 'react-input-mask'; |
No alert changes
Improved metrics
- Total package byte prevSize
- increased by5.6%
111102
- Number of package files
- increased by114.29%
15
- Lines of code
- increased by5.49%
2498
Worsened metrics
- Number of lines in readme file
- decreased by-2.9%
67
No dependency changes