intelicoreact 0.1.67 → 0.1.70

package/dist/Atomic/FormElements/InputMask/InputMask.js

@@ -9,6 +9,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = InputMask;
 
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
 var _toArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toArray"));
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
@@ -119,7 +123,7 @@ function InputMask() {
       isFocused = _useState6[0],
       setFocused = _useState6[1];
 
-  var _useState7 = (0, _react.useState)(null),
+  var _useState7 = (0, _react.useState)(false),
       _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
       isInitValue = _useState8[0],
       setIsInitValue = _useState8[1]; // ERRORS MANAGEMENT FUNCTIONS | START //
@@ -474,7 +478,11 @@ function InputMask() {
     if (isSpecialSymbol) return onBackspaceDown(e, prevIndex);
 
     if (maskAsPlaceholder) {
-      var newText = getInnerValueAsString().substring(0, prevIndex) + getInnerValueAsString().substring(i, maxEditableLen !== -1 ? maxEditableLen : getInnerValueAsString().length);
+      var newText = innerValue.slice(0, prevIndex).concat(innerValue.slice(i, maxEditableLen !== -1 ? maxEditableLen : innerValue.length)).reduce(function (text, _ref12) {
+        var char = _ref12.char;
+        return text.concat(char);
+      }, ''); // const newText = getInnerValueAsString().substring(0, prevIndex) + getInnerValueAsString().substring(i, maxEditableLen !== -1 ? maxEditableLen : getInnerValueAsString().length);
+
       resetInnerValue();
 
       _onPaste({
@@ -490,34 +498,84 @@ function InputMask() {
     return true;
   };
 
-  var onDeleteDown = function onDeleteDown(e, i) {
-    if ((0, _functions.getSelectionText)().length) return deleteSelectedText();
-    var nextIndex = i + 1;
-    var charObj = getCharByIndex(i);
-    if (!charObj) return false;
-    var char = charObj.char,
-        isSpecialSymbol = charObj.isSpecialSymbol;
-    if (isSpecialSymbol) return onDeleteDown(e, i + 1);
-    if (char === '') return false;
-
-    if (maskAsPlaceholder) {
-      var newText = getInnerValueAsString().substring(0, i) + getInnerValueAsString().substring(nextIndex, maxEditableLen !== -1 ? maxEditableLen : getInnerValueAsString().length);
-      resetInnerValue();
-
-      _onPaste({
-        text: newText
-      }, 0);
-
-      setFocusOnChar(i, i);
-    } else {
-      updateInnerValueChar({
-        char: ''
-      }, i);
-      setFocusOnChar(nextIndex, i);
-    }
+  var onDeleteDown = /*#__PURE__*/function () {
+    var _ref13 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(e, i) {
+      var nextIndex, charObj, char, isSpecialSymbol, newText;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(0, _functions.getSelectionText)().length) {
+                _context.next = 2;
+                break;
+              }
+
+              return _context.abrupt("return", deleteSelectedText());
+
+            case 2:
+              nextIndex = i + 1;
+              charObj = getCharByIndex(i);
+
+              if (charObj) {
+                _context.next = 6;
+                break;
+              }
+
+              return _context.abrupt("return", false);
+
+            case 6:
+              char = charObj.char, isSpecialSymbol = charObj.isSpecialSymbol;
+
+              if (!isSpecialSymbol) {
+                _context.next = 9;
+                break;
+              }
+
+              return _context.abrupt("return", onDeleteDown(e, i + 1));
+
+            case 9:
+              if (!(char === '')) {
+                _context.next = 11;
+                break;
+              }
+
+              return _context.abrupt("return", false);
+
+            case 11:
+              if (maskAsPlaceholder) {
+                newText = innerValue.slice(0, i).concat(innerValue.slice(nextIndex, maxEditableLen !== -1 ? maxEditableLen : innerValue.length)).reduce(function (text, _ref14) {
+                  var char = _ref14.char;
+                  return text.concat(char);
+                }, ''); // const newText = getInnerValueAsString().substring(0, i) + getInnerValueAsString().substring(nextIndex, maxEditableLen !== -1 ? maxEditableLen : getInnerValueAsString().length);
+
+                resetInnerValue();
+
+                _onPaste({
+                  text: newText
+                }, 0);
+
+                setFocusOnChar(i, i);
+              } else {
+                updateInnerValueChar({
+                  char: ''
+                }, i);
+                setFocusOnChar(nextIndex, i);
+              }
+
+              return _context.abrupt("return", true);
+
+            case 13:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
 
-    return true;
-  };
+    return function onDeleteDown(_x, _x2) {
+      return _ref13.apply(this, arguments);
+    };
+  }();
 
   var onHomeDown = function onHomeDown(e, i) {
     return setFocusOnChar(0, -1);
@@ -565,58 +623,160 @@ function InputMask() {
     }
   };
 
-  var handleKeyDown = function handleKeyDown(e, i) {
-    var _getClearInnerValueAs;
-
-    var _ref12 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
-        _ref12$disableErrors = _ref12.disableErrors,
-        disableErrors = _ref12$disableErrors === void 0 ? false : _ref12$disableErrors;
-
-    try {
-      e.stopPropagation();
-      e.preventDefault();
-    } catch (e) {}
-
-    var key = e.key;
-    var charObj = getCharByIndex(i);
-    if (!charObj || i === innerValue.length - 1) return false;
-    if (maskAsPlaceholder && i > getLastTypedIndex() + 1) return handleKeyDown(e, getLastTypedIndex() === 0 ? 0 : getLastTypedIndex() + 1, {
-      disableErrors: disableErrors
-    });
-    var isSpecialSymbol = charObj.isSpecialSymbol,
-        maskChar = charObj.maskChar,
-        isReadOnly = charObj.isReadOnly;
-    if (isReadOnly) return false; //IF DEFAULT CHAR IS SPACE, SWITCH TO NEXT INPUT
-
-    if (maskChar === _config.SPACE_CHAR) return handleKeyDown(e, i + 1);
-    if (isSpecialSymbol && maskChar !== key) return false;
-    if (!isValidChar({
-      char: key,
-      i: i,
-      disableErrors: disableErrors
-    })) return false;
-
-    if (maskAsPlaceholder && ((_getClearInnerValueAs = getClearInnerValueAsString(i)) === null || _getClearInnerValueAs === void 0 ? void 0 : _getClearInnerValueAs.length) !== 0) {
-      var fromIndex = i + 1;
-      var text = innerValue.slice().filter(function (_ref13, index) {
-        var isCharSymbol = _ref13.isCharSymbol;
-        return index >= i && !isCharSymbol;
-      }).map(function (_ref14, index) {
-        var char = _ref14.char;
-        return char;
-      }).join('');
-
-      _onPaste({
-        text: text
-      }, fromIndex, false);
-    }
+  var handleKeyDown = /*#__PURE__*/function () {
+    var _ref15 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(e, i) {
+      var _getClearInnerValueAs;
+
+      var _ref16,
+          _ref16$disableErrors,
+          disableErrors,
+          key,
+          keyCode,
+          charObj,
+          charRef,
+          isSpecialSymbol,
+          maskChar,
+          isReadOnly,
+          fromIndex,
+          text,
+          _args2 = arguments;
+
+      return _regenerator.default.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _ref16 = _args2.length > 2 && _args2[2] !== undefined ? _args2[2] : {}, _ref16$disableErrors = _ref16.disableErrors, disableErrors = _ref16$disableErrors === void 0 ? false : _ref16$disableErrors;
+
+              try {
+                e.stopPropagation();
+                e.preventDefault();
+              } catch (e) {}
+
+              key = e.key, keyCode = e.keyCode;
+              charObj = getCharByIndex(i); // Android Text Typing FIX
+              // eslint-disable-next-line eqeqeq
+
+              if (!(keyCode == _config.ANDROID_CHROME_TEXT_CODE)) {
+                _context2.next = 9;
+                break;
+              }
+
+              charRef = charObj.ref;
+              _context2.next = 8;
+              return new Promise(function (resolve) {
+                setTimeout(function () {
+                  var _charRef$current, _charRef$current$inne;
+
+                  //Typed Text
+                  if ((charRef === null || charRef === void 0 ? void 0 : (_charRef$current = charRef.current) === null || _charRef$current === void 0 ? void 0 : (_charRef$current$inne = _charRef$current.innerText) === null || _charRef$current$inne === void 0 ? void 0 : _charRef$current$inne.length) >= 2) {
+                    var _charRef$current2;
+
+                    var _charRef$current$inne2 = charRef === null || charRef === void 0 ? void 0 : (_charRef$current2 = charRef.current) === null || _charRef$current2 === void 0 ? void 0 : _charRef$current2.innerText,
+                        _charRef$current$inne3 = (0, _slicedToArray2.default)(_charRef$current$inne2, 2),
+                        _key = _charRef$current$inne3[0],
+                        prevChar = _charRef$current$inne3[1];
+
+                    charRef.current.innerText = prevChar;
+                    resolve(_key);
+                  } else {
+                    resolve(null);
+                  }
+                }, 1);
+              });
+
+            case 8:
+              key = _context2.sent;
+
+            case 9:
+              if (!(!charObj || i === innerValue.length - 1)) {
+                _context2.next = 11;
+                break;
+              }
+
+              return _context2.abrupt("return", false);
+
+            case 11:
+              if (!(maskAsPlaceholder && i > getLastTypedIndex() + 1)) {
+                _context2.next = 13;
+                break;
+              }
+
+              return _context2.abrupt("return", handleKeyDown(e, getLastTypedIndex() === 0 ? 0 : getLastTypedIndex() + 1, {
+                disableErrors: disableErrors
+              }));
+
+            case 13:
+              isSpecialSymbol = charObj.isSpecialSymbol, maskChar = charObj.maskChar, isReadOnly = charObj.isReadOnly;
+
+              if (!isReadOnly) {
+                _context2.next = 16;
+                break;
+              }
+
+              return _context2.abrupt("return", false);
+
+            case 16:
+              if (!(maskChar === _config.SPACE_CHAR)) {
+                _context2.next = 18;
+                break;
+              }
+
+              return _context2.abrupt("return", handleKeyDown(e, i + 1));
+
+            case 18:
+              if (!(isSpecialSymbol && maskChar !== key)) {
+                _context2.next = 20;
+                break;
+              }
+
+              return _context2.abrupt("return", false);
+
+            case 20:
+              if (isValidChar({
+                char: key,
+                i: i,
+                disableErrors: disableErrors
+              })) {
+                _context2.next = 22;
+                break;
+              }
+
+              return _context2.abrupt("return", false);
+
+            case 22:
+              if (maskAsPlaceholder && ((_getClearInnerValueAs = getClearInnerValueAsString(i)) === null || _getClearInnerValueAs === void 0 ? void 0 : _getClearInnerValueAs.length) !== 0) {
+                fromIndex = i + 1;
+                text = innerValue.slice().filter(function (_ref17, index) {
+                  var isCharSymbol = _ref17.isCharSymbol;
+                  return index >= i && !isCharSymbol;
+                }).map(function (_ref18, index) {
+                  var char = _ref18.char;
+                  return char;
+                }).join('');
+
+                _onPaste({
+                  text: text
+                }, fromIndex, false);
+              }
+
+              updateInnerValueChar({
+                char: key
+              }, i);
+              onArrowRightDown(e, i);
+              return _context2.abrupt("return", true);
+
+            case 26:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
 
-    updateInnerValueChar({
-      char: key
-    }, i);
-    onArrowRightDown(e, i);
-    return true;
-  };
+    return function handleKeyDown(_x3, _x4) {
+      return _ref15.apply(this, arguments);
+    };
+  }();
 
   var handleKeyCombinations = function handleKeyCombinations(e, i) {
     var key = e.key,
@@ -655,9 +815,9 @@ function InputMask() {
   };
 
   var onClick = function onClick(e, cb) {
-    var _ref15 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
-        _ref15$ignoreIsSelect = _ref15.ignoreIsSelecting,
-        ignoreIsSelecting = _ref15$ignoreIsSelect === void 0 ? false : _ref15$ignoreIsSelect;
+    var _ref19 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+        _ref19$ignoreIsSelect = _ref19.ignoreIsSelecting,
+        ignoreIsSelecting = _ref19$ignoreIsSelect === void 0 ? false : _ref19$ignoreIsSelect;
 
     try {
       e.stopPropagation();
@@ -670,9 +830,9 @@ function InputMask() {
   };
 
   var onCharClick = function onCharClick(e, i) {
-    e.preventDefault();
-    e.stopPropagation();
-
+    // ??????????????????? DON'T REMOVE !
+    // e.preventDefault();
+    // e.stopPropagation();
     var _getCharByIndex2 = getCharByIndex(i),
         char = _getCharByIndex2.char,
         maskChar = _getCharByIndex2.maskChar;
@@ -741,7 +901,7 @@ function InputMask() {
   };
 
   var _onPaste = function onPaste(e, i) {
-    var _ref16, _window, _e$clipboardData;
+    var _ref20, _window, _e$clipboardData;
 
     var setFocusToEnd = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
 
@@ -752,17 +912,17 @@ function InputMask() {
 
     setIsSelecting(false);
     (0, _functions.resetSelectionText)();
-    var pastedText = ((_ref16 = (e === null || e === void 0 ? void 0 : e.clipboardData) || ((_window = window) === null || _window === void 0 ? void 0 : _window.clipboardData)) === null || _ref16 === void 0 ? void 0 : _ref16.getData('text/plain')) || (e === null || e === void 0 ? void 0 : (_e$clipboardData = e.clipboardData) === null || _e$clipboardData === void 0 ? void 0 : _e$clipboardData.getData('Text')) || e.text;
+    var pastedText = ((_ref20 = (e === null || e === void 0 ? void 0 : e.clipboardData) || ((_window = window) === null || _window === void 0 ? void 0 : _window.clipboardData)) === null || _ref20 === void 0 ? void 0 : _ref20.getData('text/plain')) || (e === null || e === void 0 ? void 0 : (_e$clipboardData = e.clipboardData) === null || _e$clipboardData === void 0 ? void 0 : _e$clipboardData.getData('Text')) || e.text;
     if (!pastedText) return false;
     var replacedIndexes = [];
 
     if (maskAsPlaceholder && (e === null || e === void 0 ? void 0 : e.type) === 'paste') {
       var fromIndex = i + parseInt(pastedText === null || pastedText === void 0 ? void 0 : pastedText.length);
-      var text = innerValue.slice().filter(function (_ref17, index) {
-        var isCharSymbol = _ref17.isCharSymbol;
+      var text = innerValue.slice().filter(function (_ref21, index) {
+        var isCharSymbol = _ref21.isCharSymbol;
         return index >= i && !isCharSymbol;
-      }).map(function (_ref18, index) {
-        var char = _ref18.char;
+      }).map(function (_ref22, index) {
+        var char = _ref22.char;
         return char;
       }).join('');
 
@@ -885,13 +1045,13 @@ function InputMask() {
     (0, _functions.resetSelectionText)();
 
     if (maskAsPlaceholder && ((_getClearInnerValueAs2 = getClearInnerValueAsString(selEndInd + 1)) === null || _getClearInnerValueAs2 === void 0 ? void 0 : _getClearInnerValueAs2.length) !== 0) {
-      var text = innerValue.slice().filter(function (_ref19, index) {
-        var isSpecialSymbol = _ref19.isSpecialSymbol,
-            isCharSymbol = _ref19.isCharSymbol;
+      var text = innerValue.slice().filter(function (_ref23, index) {
+        var isSpecialSymbol = _ref23.isSpecialSymbol,
+            isCharSymbol = _ref23.isCharSymbol;
         if (maxEditableLen !== -1 && index > maxEditableLen - 1) return false;
         return (index < selStartInd || index >= selEndInd) && !isSpecialSymbol && !isCharSymbol;
-      }).map(function (_ref20, index) {
-        var char = _ref20.char;
+      }).map(function (_ref24, index) {
+        var char = _ref24.char;
         return char;
       }).join('');
       resetInnerValue();
@@ -933,18 +1093,22 @@ function InputMask() {
     setMaskRendered(true);
   }, [maskPattern]);
   (0, _react.useEffect)(function () {
-    if (!isMaskRendered || isInitValue) return false;
+    if (!isMaskRendered || isInitValue || maskPattern.replace(/D/g, '') === (value === null || value === void 0 ? void 0 : value.toString())) return false;
 
     if (value && value !== '' && value !== getClearInnerValueAsString()) {
       var valueCharIndex = 0;
-      innerValue.map(function (_ref21, i) {
-        var isSpecialSymbol = _ref21.isSpecialSymbol;
+      innerValue.map(function (_ref25, i) {
+        var _maskPattern;
+
+        var isSpecialSymbol = _ref25.isSpecialSymbol;
         if (isSpecialSymbol) return false;
         var char = value[valueCharIndex];
+        var whileLimit = ((_maskPattern = maskPattern) === null || _maskPattern === void 0 ? void 0 : _maskPattern.length) || 0;
 
-        while (isSpecialSymbolChar({
+        while (whileLimit && isSpecialSymbolChar({
           char: value[valueCharIndex]
         })) {
+          whileLimit--;
           char = value[++valueCharIndex];
         } //If Valid
 
@@ -962,9 +1126,9 @@ function InputMask() {
         ++valueCharIndex;
       });
     }
-  }, [isMaskRendered,
-  /*value,*/
-  isInitValue]); // Focus Observer
+
+    setIsInitValue(true);
+  }, [isMaskRendered, value, isInitValue]); // Focus Observer
 
   (0, _react.useEffect)(function () {
     if (!isFocused) {
@@ -981,8 +1145,7 @@ function InputMask() {
   (0, _react.useEffect)(function () {
     if (!isMaskRendered) return false;
     setError(false);
-    clearErrorMessage(); //console.log('getClearInnerValueAsString', getClearInnerValueAsString())
-
+    clearErrorMessage();
     onChangeProp(getClearInnerValueAsString(), getInnerValueAsString({
       replaceSpace: true
     }));
@@ -1060,7 +1223,6 @@ function InputMask() {
     return /*#__PURE__*/_react.default.createElement("span", {
       tabIndex: i === 0 ? 0 : -1,
       key: i,
-      maxLength: 1,
       "attr-char-id": i,
       className: "\n          input-mask_value_item\n          ".concat(className, "\n          ").concat((0, _functions.isDigitMaskChar)(obj.maskChar) ? 'input-mask_value_item--digit' : '', "\n          ").concat((0, _functions.isLetterMaskChar)(obj.maskChar) ? 'input-mask_value_item--letter' : '', "\n          ").concat(obj.isSpecialSymbol ? 'input-mask_value_item--spec' : '', "\n        ") // ${char === '' || isSpecialSymbol ? 'unselectable' : ''}
       // ${!isSelecting && (char === '' || isSpecialSymbol) ? 'unselectable' : ''}

package/dist/Atomic/FormElements/InputMask/config.js

@@ -5,6 +5,7 @@ module.exports = {
   LOWERCASE_LETTER_MASK_CHAR: 'l',
   DIGIT_MASK_CHAR: 'D',
   SPACE_CHAR: "\xA0",
+  ANDROID_CHROME_TEXT_CODE: 229,
   EXCLUDED_KEYS: ['Tab'],
   DEFAULT_ERRORS: {
     onlyLetter: 'Type letter',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "intelicoreact",
-  "version": "0.1.67",
+  "version": "0.1.70",
   "description": "fix input mask cycling",
   "main": "dist/index.js",
   "files": [