react-imask - npm Package Compare versions

Comparing version 4.1.0 to 4.1.1

dist/react-imask.js

@@ -181,5 +181,11 @@ (function (global, factory) {
     // dynamic
-    dispatch: PropTypes.func
+    dispatch: PropTypes.func,
+    // ref
+    inputRef: PropTypes.func
   };
   var MASK_PROPS_NAMES = Object.keys(MASK_PROPS);
+  var NON_MASK_OPTIONS_PROPS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
+  var MASK_OPTIONS_PROPS_NAMES = MASK_PROPS_NAMES.filter(function (pName) {
+    return NON_MASK_OPTIONS_PROPS_NAMES.indexOf(pName) < 0;
+  });
   function IMaskMixin(ComposedComponent) {
@@ -192,5 +198,15 @@ var MaskedComponent =
       function MaskedComponent() {
+        var _getPrototypeOf2;
+
+        var _this;
+
         _classCallCheck(this, MaskedComponent);
 
-        return _possibleConstructorReturn(this, _getPrototypeOf(MaskedComponent).apply(this, arguments));
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+
+        _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(MaskedComponent)).call.apply(_getPrototypeOf2, [this].concat(args)));
+        _this._inputRef = _this._inputRef.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+        return _this;
       }
@@ -209,3 +225,3 @@
 
-          var maskOptions = this._extractOptionsFromProps(props);
+          var maskOptions = this._extractMaskOptionsFromProps(props);
 
@@ -215,5 +231,6 @@ if (maskOptions.mask) {
               this.maskRef.updateOptions(maskOptions);
-              if ('value' in props) this.maskValue = props.value;
+              if ('value' in props && props.value !== this.maskValue) this.maskValue = props.value;
             } else {
               this.initMask(maskOptions);
+              if (props.value !== this.maskValue) this._onAccept();
             }
@@ -231,11 +248,13 @@ } else {
       }, {
+        key: "_inputRef",
+        value: function _inputRef(el) {
+          this.element = el;
+          if (this.props.inputRef) this.props.inputRef(el);
+        }
+      }, {
         key: "render",
         value: function render() {
-          var _this = this;
-
           return React.createElement(ComposedComponent, _objectSpread({}, this._extractNonMaskProps(this.props), {
             defaultValue: this.props.value,
-            inputRef: function inputRef(el) {
-              return _this.element = el;
-            }
+            inputRef: this._inputRef
           }));
@@ -246,3 +265,3 @@ }
         value: function initMask() {
-          var maskOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this._extractOptionsFromProps(_objectSpread({}, this.props));
+          var maskOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this._extractMaskOptionsFromProps(_objectSpread({}, this.props));
           this.maskRef = new IMask(this.element, maskOptions).on('accept', this._onAccept.bind(this)).on('complete', this._onComplete.bind(this));
@@ -260,13 +279,11 @@ this.maskValue = this.props.value;
       }, {
-        key: "_extractOptionsFromProps",
-        value: function _extractOptionsFromProps(props) {
-          props = _objectSpread({}, props); // keep only mask props
+        key: "_extractMaskOptionsFromProps",
+        value: function _extractMaskOptionsFromProps(props) {
+          props = _objectSpread({}, props); // keep only mask options props
 
           Object.keys(props).filter(function (prop) {
-            return MASK_PROPS_NAMES.indexOf(prop) < 0;
+            return MASK_OPTIONS_PROPS_NAMES.indexOf(prop) < 0;
           }).forEach(function (nonMaskProp) {
             delete props[nonMaskProp];
           });
-          delete props.value;
-          delete props.unmask;
           return props;
@@ -273,0 +290,0 @@ }

package.json

@@ -5,3 +5,3 @@ {
   "license": "MIT",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "homepage": "https://unmanner.github.io/imaskjs/",
@@ -25,3 +25,3 @@ "description": "React input mask",
   "dependencies": {
-    "imask": "^4.1.0",
+    "imask": "^4.1.1",
     "prop-types": "^15.6.0"
@@ -35,3 +35,3 @@ },
   },
-  "gitHead": "2fdb82ae45333a5eee9a6105af9cbe72deda851c"
+  "gitHead": "35944593bb467268ad3c3a5f6501672241a58d62"
 }

src/imask.mixin.js

@@ -51,11 +51,22 @@ import React from 'react';
   // dynamic
-  dispatch: PropTypes.func
+  dispatch: PropTypes.func,
+
+  // ref
+  inputRef: PropTypes.func
 };
 
 const MASK_PROPS_NAMES = Object.keys(MASK_PROPS);
+const NON_MASK_OPTIONS_PROPS_NAMES = ['value', 'unmask', 'onAccept', 'onComplete', 'inputRef'];
+const MASK_OPTIONS_PROPS_NAMES = MASK_PROPS_NAMES.filter(pName =>
+  NON_MASK_OPTIONS_PROPS_NAMES.indexOf(pName) < 0
+);
 
-
 export
 function IMaskMixin(ComposedComponent) {
   const MaskedComponent = class extends React.Component {
+    constructor (...args) {
+      super(...args);
+      this._inputRef = this._inputRef.bind(this);
+    }
+
     componentDidMount () {
@@ -69,9 +80,10 @@ if (!this.props.mask) return;
       const props = {...this.props, ...nextProps};
-      const maskOptions = this._extractOptionsFromProps(props);
+      const maskOptions = this._extractMaskOptionsFromProps(props);
       if (maskOptions.mask) {
         if (this.maskRef) {
           this.maskRef.updateOptions(maskOptions);
-          if ('value' in props) this.maskValue = props.value;
+          if ('value' in props && props.value !== this.maskValue) this.maskValue = props.value;
         } else {
           this.initMask(maskOptions);
+          if (props.value !== this.maskValue) this._onAccept();
         }
@@ -88,2 +100,7 @@ } else {
 
+    _inputRef (el) {
+      this.element = el;
+      if (this.props.inputRef) this.props.inputRef(el);
+    }
+
     render () {
@@ -93,7 +110,7 @@ return React.createElement(ComposedComponent, {
         defaultValue: this.props.value,
-        inputRef: (el) => this.element = el,
+        inputRef: this._inputRef,
       });
     }
 
-    initMask (maskOptions=this._extractOptionsFromProps({...this.props})) {
+    initMask (maskOptions=this._extractMaskOptionsFromProps({...this.props})) {
       this.maskRef = new IMask(this.element, maskOptions)
@@ -113,8 +130,8 @@ .on('accept', this._onAccept.bind(this))
 
-    _extractOptionsFromProps (props) {
+    _extractMaskOptionsFromProps (props) {
       props = {...props};
 
-      // keep only mask props
+      // keep only mask options props
       Object.keys(props)
-        .filter(prop => MASK_PROPS_NAMES.indexOf(prop) < 0)
+        .filter(prop => MASK_OPTIONS_PROPS_NAMES.indexOf(prop) < 0)
         .forEach(nonMaskProp => {
@@ -124,4 +141,2 @@ delete props[nonMaskProp];
 
-      delete props.value;
-      delete props.unmask;
 
@@ -128,0 +143,0 @@ return props;

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

32093

increased by8.67%

Lines of code

453

increased by6.59%

Dependency changes

• Updatedimask@^4.1.1