react-input-mask - npm Package Compare versions

Comparing version 0.0.6 to 0.0.7

build/InputElement.js

@@ -183,2 +183,5 @@ "use strict";
     },
+    isFocused: function isFocused() {
+        return document.activeElement === this.getDOMNode();
+    },
     parseMask: function parseMask(mask) {
@@ -214,2 +217,5 @@ var _this4 = this;
     },
+    getStringValue: function getStringValue(value) {
+        return !value && value !== 0 ? "" : value + "";
+    },
     getInitialState: function getInitialState() {
@@ -220,7 +226,16 @@ var mask = this.parseMask(this.props.mask);
             permanents: mask.permanents,
-            value: this.props.value,
+            value: this.getStringValue(this.props.value),
             maskChar: typeof this.props.maskChar === "string" ? this.props.maskChar : this.defaultMaskChar
         };
     },
+    componentWillMount: function componentWillMount() {
+        if (this.state.mask && this.state.value) {
+            this.setState({
+                value: this.formatValue(this.state.value)
+            });
+        }
+    },
     componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
+        var _this5 = this;
+
         var mask = this.parseMask(nextProps.mask);
@@ -232,6 +247,13 @@ var state = {
         };
-        if (nextProps.value !== this.state.value) {
-            state.value = nextProps.value;
-        }
-        this.setState(state);
+        this.setState(state, function () {
+            var newValue = _this5.getStringValue(nextProps.value);
+            if (_this5.state.mask && (newValue || _this5.isFocused())) {
+                newValue = _this5.formatValue(newValue);
+            }
+            if (newValue !== _this5.state.value) {
+                _this5.setState({
+                    value: newValue
+                });
+            }
+        });
     },
@@ -238,0 +260,0 @@ onKeyDown: function onKeyDown(event) {

InputElement.js

@@ -181,2 +181,5 @@ // https://github.com/sanniassin/react-input-mask
     },
+    isFocused: function() {
+        return document.activeElement === this.getDOMNode();
+    },
     parseMask: function(mask) {
@@ -211,2 +214,5 @@ if (typeof mask !== "string") {
     },
+    getStringValue: function(value) {
+        return !value && value !== 0 ? "" : value + "";
+    },
     getInitialState: function() {
@@ -217,6 +223,13 @@ var mask = this.parseMask(this.props.mask);
             permanents: mask.permanents,
-            value: this.props.value,
+            value: this.getStringValue(this.props.value),
             maskChar: typeof this.props.maskChar === "string" ? this.props.maskChar : this.defaultMaskChar
         };
     },
+    componentWillMount: function() {
+        if (this.state.mask && this.state.value) {
+            this.setState({
+                value: this.formatValue(this.state.value)
+            });
+        }
+    },
     componentWillReceiveProps: function(nextProps) {
@@ -229,6 +242,13 @@ var mask = this.parseMask(nextProps.mask);
         };
-        if (nextProps.value !== this.state.value) {
-            state.value = nextProps.value;
-        }
-        this.setState(state);
+        this.setState(state, () => {
+            var newValue = this.getStringValue(nextProps.value);
+            if (this.state.mask && (newValue || this.isFocused())) {
+                newValue = this.formatValue(newValue);
+            }
+            if (newValue !== this.state.value) {
+                this.setState({
+                    value: newValue
+                });
+            }
+        });
     },
@@ -235,0 +255,0 @@ onKeyDown: function(event) {

package.json

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

No alert changes

Improved metrics

Total package byte prevSize

31447

increased by4.92%

Lines of code

847

increased by5.09%

No dependency changes