react-input-mask - npm Package Compare versions

Comparing version 0.0.14 to 0.0.15

build/InputElement.js

@@ -32,2 +32,6 @@ "use strict";
 
+        if (!maskChar) {
+            return value.length;
+        }
+
         for (i = value.length - 1; i >= 0; --i) {
@@ -74,2 +78,10 @@ var char = value[i];
 
+        if (!maskChar) {
+            var prefixLen = this.getPrefix().length;
+            value = this.insertRawSubstr("", value, 0);
+            while (value.length > prefixLen && this.isPermanentChar(value.length - 1)) {
+                value = value.slice(0, value.length - 1);
+            }
+            return value;
+        }
         return value.split("").concat(Array.apply(null, Array(mask.length - value.length))).map(function (char, pos) {
@@ -87,5 +99,12 @@ if (_this2.isAllowedChar(char, pos, newState)) {
 
+        var end = start + len;
         var maskChar = this.state.maskChar;
+        if (!maskChar) {
+            var prefixLen = this.getPrefix().length;
+            value = value.split("").filter(function (char, i) {
+                return i < prefixLen || i < start || i >= end;
+            }).join("");
+            return this.formatValue(value);
+        }
         var mask = this.state.mask;
-        var end = start + len;
         return value.split("").map(function (char, i) {
@@ -108,12 +127,20 @@ if (i < start || i >= end) {
         var mask = _ref2.mask;
+        var maskChar = _ref2.maskChar;
 
         substr = substr.split("");
-        for (var i = pos; i < value.length && substr.length;) {
+        for (var i = pos; i < mask.length && substr.length;) {
             if (!this.isPermanentChar(i, newState) || mask[i] === substr[0]) {
                 var char = substr.shift();
                 if (this.isAllowedChar(char, i, newState)) {
-                    value = this.replaceSubstr(value, char, i);
+                    if (i < value.length) {
+                        value = this.replaceSubstr(value, char, i);
+                    } else if (!maskChar) {
+                        value += char;
+                    }
                     ++i;
                 }
             } else {
+                if (!maskChar && i >= value.length) {
+                    value += mask[i];
+                }
                 ++i;
@@ -252,3 +279,3 @@ }
             value: this.getStringValue(value),
-            maskChar: typeof this.props.maskChar === "string" ? this.props.maskChar : this.defaultMaskChar
+            maskChar: "maskChar" in this.props ? this.props.maskChar : this.defaultMaskChar
         };
@@ -265,3 +292,3 @@ },
         var mask = this.parseMask(nextProps.mask);
-        var maskChar = typeof this.props.maskChar === "string" ? nextProps.maskChar : this.defaultMaskChar;
+        var maskChar = "maskChar" in nextProps ? nextProps.maskChar : this.defaultMaskChar;
         var state = {
@@ -310,3 +337,2 @@ mask: mask.mask,
         var preventDefault = false;
-        var maskChar = this.state.maskChar;
         switch (key) {
@@ -325,3 +351,3 @@ case "Backspace":
                     if (editablePos !== null) {
-                        value = this.replaceSubstr(value, maskChar, editablePos);
+                        value = this.clearRange(value, editablePos, 1);
                         caretPos = editablePos;
@@ -366,8 +392,12 @@ }
         var caretPos = this.getCaretPos();
-        var value = this.state.value;
-        var maskLen = this.state.mask.length;
-        var mask = this.state.mask;
+        var _state = this.state;
+        var value = _state.value;
+        var mask = _state.mask;
+        var maskChar = _state.maskChar;
+
+        var maskLen = mask.length;
         var prefixLen = this.getPrefix().length;
 
         if (this.isPermanentChar(caretPos) && mask[caretPos] === key) {
+            value = this.insertRawSubstr(value, key, caretPos);
             ++caretPos;
@@ -377,3 +407,8 @@ } else {
             if (editablePos !== null && this.isAllowedChar(key, editablePos)) {
-                value = this.replaceSubstr(value, key, editablePos);
+                if (!maskChar && value.length < mask.length) {
+                    var substr = key + value.slice(caretPos);
+                    value = this.insertRawSubstr(value, substr, caretPos);
+                } else {
+                    value = this.insertRawSubstr(value, key, caretPos);
+                }
                 caretPos = editablePos + 1;
@@ -380,0 +415,0 @@ }

InputElement.js

@@ -26,2 +26,6 @@ // https://github.com/sanniassin/react-input-mask
 
+        if (!maskChar) {
+            return value.length;
+        }
+
         for (i = value.length - 1; i >= 0; --i) {
@@ -60,2 +64,10 @@ var char = value[i];
         var { maskChar, mask } = newState || this.state;
+        if (!maskChar) {
+            var prefixLen = this.getPrefix().length;
+            value = this.insertRawSubstr("", value, 0);
+            while (value.length > prefixLen && this.isPermanentChar(value.length - 1)) {
+                value = value.slice(0, value.length - 1);
+            }
+            return value;
+        }
         return value.split("")
@@ -75,5 +87,12 @@ .concat(Array.apply(null, Array(mask.length - value.length)))
     clearRange: function(value, start, len) {
+        var end = start + len;
         var maskChar = this.state.maskChar;
+        if (!maskChar) {
+            var prefixLen = this.getPrefix().length;
+            value = value.split("")
+                         .filter((char, i) => i < prefixLen || i < start || i >= end)
+                         .join("");
+            return this.formatValue(value);
+        }
         var mask = this.state.mask;
-        var end = start + len;
         return value.split("")
@@ -95,9 +114,14 @@ .map((char, i) => {
     insertRawSubstr: function(value, substr, pos, newState) {
-        var { mask } = newState || this.state;
+        var { mask, maskChar } = newState || this.state;
         substr = substr.split("");
-        for (var i = pos; i < value.length && substr.length; ) {
+        for (var i = pos; i < mask.length && substr.length; ) {
             if (!this.isPermanentChar(i, newState) || mask[i] === substr[0]) {
                 var char = substr.shift();
                 if (this.isAllowedChar(char, i, newState)) {
-                    value = this.replaceSubstr(value, char, i);
+                    if (i < value.length) {
+                        value = this.replaceSubstr(value, char, i);
+                    }
+                    else if (!maskChar) {
+                        value += char;
+                    }
                     ++i;
@@ -107,2 +131,5 @@ }
             else {
+                if (!maskChar && i >= value.length) {
+                    value += mask[i];
+                }
                 ++i;
@@ -248,3 +275,3 @@ }
             value: this.getStringValue(value),
-            maskChar: typeof this.props.maskChar === "string" ? this.props.maskChar : this.defaultMaskChar
+            maskChar: "maskChar" in this.props ? this.props.maskChar : this.defaultMaskChar
         };
@@ -261,3 +288,3 @@ },
         var mask = this.parseMask(nextProps.mask);
-        var maskChar = typeof this.props.maskChar === "string" ? nextProps.maskChar : this.defaultMaskChar;
+        var maskChar = "maskChar" in nextProps ? nextProps.maskChar : this.defaultMaskChar;
         var state = {
@@ -308,3 +335,2 @@ mask: mask.mask,
         var preventDefault = false;
-        var maskChar = this.state.maskChar;
         switch (key) {
@@ -325,3 +351,3 @@ case "Backspace":
                     if (editablePos !== null) {
-                        value = this.replaceSubstr(value, maskChar, editablePos);
+                        value = this.clearRange(value, editablePos, 1);
                         caretPos = editablePos;
@@ -366,8 +392,8 @@ }
         var caretPos = this.getCaretPos();
-        var value = this.state.value;
-        var maskLen = this.state.mask.length;
-        var mask = this.state.mask;
+        var { value, mask, maskChar } = this.state;
+        var maskLen = mask.length;
         var prefixLen = this.getPrefix().length;
 
         if (this.isPermanentChar(caretPos) && mask[caretPos] === key) {
+            value = this.insertRawSubstr(value, key, caretPos);
             ++caretPos;
@@ -378,3 +404,9 @@ }
             if (editablePos !== null && this.isAllowedChar(key, editablePos)) {
-                value = this.replaceSubstr(value, key, editablePos);
+                if (!maskChar && value.length < mask.length) {
+                    var substr = key + value.slice(caretPos);
+                    value = this.insertRawSubstr(value, substr, caretPos);
+                }
+                else {
+                    value = this.insertRawSubstr(value, key, caretPos);
+                }
                 caretPos = editablePos + 1;
@@ -381,0 +413,0 @@ }

package.json

 {
   "name": "react-input-mask",
   "description": "Masked input component for React",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "homepage": "https://github.com/sanniassin/react-input-mask",
@@ -6,0 +6,0 @@ "license": "MIT",

README.md

@@ -20,3 +20,3 @@ # react-input-mask
 
-Character to cover unfilled editable parts of mask. Default character is "_"
+Character to cover unfilled editable parts of mask. Default character is "_". If set to null, unfilled parts will be empty, like in ordinary input.
 
@@ -23,0 +23,0 @@ ## Example

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35786

increased by7.59%

Lines of code

950

increased by7.22%

No dependency changes