nuke-mask - npm Package Compare versions

Comparing version 2.1.10 to 2.2.2

CHANGELOG.md

@@ -6,2 +6,37 @@ # Change Log
 
+<a name="2.2.2"></a>
+## [2.2.2](https://gitlab.alibaba-inc.com/nuke/mask/compare/v2.2.1...v2.2.2) (2018-08-23)
+
+**Note:** Version bump only for package nuke-mask
+
+
+
+
+
+<a name="2.2.1"></a>
+## [2.2.1](https://gitlab.alibaba-inc.com/nuke/mask/compare/v2.2.0...v2.2.1) (2018-08-23)
+
+**Note:** Version bump only for package nuke-mask
+
+
+
+
+
+<a name="2.2.0"></a>
+# [2.2.0](https://gitlab.alibaba-inc.com/nuke/mask/compare/v2.1.10...v2.2.0) (2018-08-23)
+
+
+### Bug Fixes
+
+* merge conflict ([7a4e427](https://gitlab.alibaba-inc.com/nuke/mask/commit/7a4e427))
+
+
+### Features
+
+* add jest test suite ([ebe6aba](https://gitlab.alibaba-inc.com/nuke/mask/commit/ebe6aba))
+
+
+
+
+
 <a name="2.1.10"></a>
@@ -8,0 +43,0 @@ ## [2.1.10](https://gitlab.alibaba-inc.com/nuke/mask/compare/v2.1.9...v2.1.10) (2018-08-20)

lib/index.js

@@ -1,1 +0,294 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _extends=Object.assign||function(target){for(var source,i=1;i<arguments.length;i++)for(var key in source=arguments[i],source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key]);return target},_createClass=function(){function defineProperties(target,props){for(var descriptor,i=0;i<props.length;i++)descriptor=props[i],descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,'value'in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,descriptor.key,descriptor)}return function(Constructor,protoProps,staticProps){return protoProps&&defineProperties(Constructor.prototype,protoProps),staticProps&&defineProperties(Constructor,staticProps),Constructor}}(),_rax=require('rax'),_nukeView=require('nuke-view'),_nukeView2=_interopRequireDefault(_nukeView),_nukeEnv=require('nuke-env'),_nukeTransition=require('nuke-transition'),_nukeTransition2=_interopRequireDefault(_nukeTransition),_nukeDimensions=require('nuke-dimensions'),_nukeDimensions2=_interopRequireDefault(_nukeDimensions);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj)0<=keys.indexOf(i)||Object.prototype.hasOwnProperty.call(obj,i)&&(target[i]=obj[i]);return target}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError('Cannot call a class as a function')}function _possibleConstructorReturn(self,call){if(!self)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return call&&('object'==typeof call||'function'==typeof call)?call:self}function _inherits(subClass,superClass){if('function'!=typeof superClass&&null!==superClass)throw new TypeError('Super expression must either be null or a function, not '+typeof superClass);subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:!1,writable:!0,configurable:!0}}),superClass&&(Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass)}var Mask=function(_Component){function Mask(props){_classCallCheck(this,Mask);var _this=_possibleConstructorReturn(this,(Mask.__proto__||Object.getPrototypeOf(Mask)).call(this,props));_this.initFlag=!1;var visible=!0;return'defaultVisible'in props&&(visible=props.defaultVisible),_this.state={visible:visible},_this}return _inherits(Mask,_Component),_createClass(Mask,[{key:'shouldComponentUpdate',value:function shouldComponentUpdate(nextProps,nextState){return!!this.initFlag||(this.initFlag=!0,nextProps.style!==this.props.style||nextState.visible!==this.state.visible)}},{key:'componentDidMount',value:function componentDidMount(){this.state.visible&&this.show()}},{key:'show',value:function show(){return this.props.animate?this.animateShow():void(this.setState({visible:!0}),this.props.onShow&&this.props.onShow())}},{key:'change',value:function change(e){this.setState({visible:e.visible||!this.state.visible}),this.props.onVisibleChanged&&this.props.onVisibleChanged(e)}},{key:'componentDidUpdate',value:function componentDidUpdate(){this.state.visible&&this.props.animate&&this.animateShow()}},{key:'animateShow',value:function animateShow(){var _this2=this,box=(0,_rax.findDOMNode)(this.maskNode),_props=this.props,effect=_props.effect,duration=_props.duration;setTimeout(function(){box&&(0,_nukeTransition2.default)(box,{opacity:1},{timingFunction:effect,duration:duration},function(){_this2.props.onShow&&_this2.props.onShow()})},10)}},{key:'hide',value:function hide(){var _this3=this,_props2=this.props,animate=_props2.animate,effect=_props2.effect,duration=_props2.duration;if(animate){var box=this.maskNode;box&&(0,_nukeTransition2.default)(box,{opacity:0},{timingFunction:effect,duration:duration},function(){_this3.setState({visible:!1}),_this3.props.onHide&&_this3.props.onHide()})}else this.setState({visible:!1}),this.props.onHide&&this.props.onHide()}},{key:'maskPress',value:function maskPress(){this.props.maskClosable&&this.hide(),this.props.onMaskPress&&this.props.onMaskPress()}},{key:'emptyEvent',value:function emptyEvent(e){_nukeEnv.isWeb&&e.stopPropagation()}},{key:'getChildren',value:function getChildren(){var _this4=this,_props3=this.props,children=_props3.children,_props3$contentStyle=_props3.contentStyle,contentStyle=void 0===_props3$contentStyle?{}:_props3$contentStyle;return children?Array.isArray(children)?1===children.length?(0,_rax.cloneElement)(children[0],{onClick:function onClick(e){_this4.emptyEvent(e)}}):(0,_rax.createElement)(_nukeView2.default,{style:contentStyle,x:'autowrap',onClick:function onClick(e){return _this4.emptyEvent(e)}},children):(0,_rax.cloneElement)(children,{onClick:function onClick(e){_this4.emptyEvent(e)}}):null}},{key:'render',value:function render(){var _this5=this,visible=this.state.visible,_props4=this.props,content=_props4.content,children=_props4.children,_props4$style=_props4.style,style=void 0===_props4$style?{}:_props4$style,onVisibleChanged=_props4.onVisibleChanged,onClick=_props4.onClick,_props4$noPress=_props4.noPress,others=_objectWithoutProperties(_props4,['content','children','style','onVisibleChanged','onClick','noPress']);if(_nukeEnv.isWeex){var nativeAttrs=_extends({},others,{style:['iOS'===_nukeEnv.appInfo.platform?styles.maskNativeIOS:{},style],onClick:function(e){return _this5.maskPress(e)},onVisibleChanged:function(e){return _this5.change(e)}});void 0!==_props4$noPress&&_props4$noPress&&delete nativeAttrs.onClick;var maskWeex=visible?(0,_rax.createElement)('mask',_extends({ref:function ref(n){_this5.maskNode=(0,_rax.findDOMNode)(n)}},nativeAttrs),this.getChildren()):null;return maskWeex}return visible?(0,_rax.createElement)('div',_extends({},others,{ref:function ref(n){_this5.maskNode=(0,_rax.findDOMNode)(n)},style:[styles.maskWeb,style],onClick:function(e){return _this5.maskPress(e)}}),this.getChildren()):null}}]),Mask}(_rax.Component),styles={maskNativeIOS:{position:'absolute',width:750,height:Math.round(_nukeDimensions2.default.get('screen').height/window.devicePixelRatio)+'wx'},maskWeb:{display:'flex',boxSizing:'border-box',flexDirection:'column',alignContent:'flex-start',flexShrink:0,position:'fixed',top:0,left:0,right:0,bottom:0,zIndex:100},transparent:{opacity:0},shown:{opacity:1}};Mask.propTypes={},Mask.defaultProps={animate:!0,effect:'ease-in-out',duration:200,contentStyle:{}},exports.default=Mask,module.exports=exports['default'];
+'use strict';
+
+/** @jsx createElement */
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+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; }; }();
+
+var _rax = require('rax');
+
+var _nukeView = require('nuke-view');
+
+var _nukeView2 = _interopRequireDefault(_nukeView);
+
+var _nukeEnv = require('nuke-env');
+
+var _nukeTransition = require('nuke-transition');
+
+var _nukeTransition2 = _interopRequireDefault(_nukeTransition);
+
+var _nukeDimensions = require('nuke-dimensions');
+
+var _nukeDimensions2 = _interopRequireDefault(_nukeDimensions);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var Mask = function (_Component) {
+  _inherits(Mask, _Component);
+
+  function Mask(props) {
+    _classCallCheck(this, Mask);
+
+    var _this = _possibleConstructorReturn(this, (Mask.__proto__ || Object.getPrototypeOf(Mask)).call(this, props));
+
+    _this.initFlag = false;
+    var visible = true;
+
+    if ('defaultVisible' in props) {
+      visible = props.defaultVisible;
+    }
+    _this.state = {
+      visible: visible
+    };
+    return _this;
+  }
+
+  _createClass(Mask, [{
+    key: 'shouldComponentUpdate',
+    value: function shouldComponentUpdate(nextProps, nextState) {
+      if (!this.initFlag) {
+        this.initFlag = true;
+        return nextProps.style !== this.props.style || nextState.visible !== this.state.visible;
+      }
+      return true;
+    }
+  }, {
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      if (this.state.visible) {
+        this.show();
+      }
+    }
+  }, {
+    key: 'show',
+    value: function show() {
+      if (this.props.animate) {
+        return this.animateShow();
+      }
+      this.setState({ visible: true });
+      this.props.onShow && this.props.onShow();
+    }
+  }, {
+    key: 'change',
+    value: function change(e) {
+      this.setState({ visible: e.visible || !this.state.visible });
+      this.props.onVisibleChanged && this.props.onVisibleChanged(e);
+    }
+  }, {
+    key: 'componentDidUpdate',
+    value: function componentDidUpdate(prevProps, prevState) {
+      if (this.state.visible && this.props.animate) {
+        this.animateShow();
+      }
+    }
+  }, {
+    key: 'animateShow',
+    value: function animateShow() {
+      var _this2 = this;
+
+      var box = (0, _rax.findDOMNode)(this.maskNode);
+      var _props = this.props,
+          effect = _props.effect,
+          duration = _props.duration;
+      // add setTimeout to avoid bugs
+
+      setTimeout(function () {
+        if (box) {
+          (0, _nukeTransition2.default)(box, { opacity: 1 }, {
+            timingFunction: effect,
+            duration: duration
+          }, function () {
+            _this2.props.onShow && _this2.props.onShow();
+          });
+        }
+      }, 10);
+    }
+  }, {
+    key: 'hide',
+    value: function hide() {
+      var _this3 = this;
+
+      var _props2 = this.props,
+          animate = _props2.animate,
+          effect = _props2.effect,
+          duration = _props2.duration;
+
+      if (animate) {
+        var box = this.maskNode;
+        if (box) {
+          (0, _nukeTransition2.default)(box, { opacity: 0 }, {
+            timingFunction: effect,
+            duration: duration
+          }, function () {
+            _this3.setState({ visible: false });
+            _this3.props.onHide && _this3.props.onHide();
+          });
+        }
+      } else {
+        this.setState({
+          visible: false
+        });
+        this.props.onHide && this.props.onHide();
+      }
+    }
+  }, {
+    key: 'maskPress',
+    value: function maskPress(e) {
+      if (this.props.maskClosable) {
+        this.hide();
+      }
+      this.props.onMaskPress && this.props.onMaskPress();
+    }
+  }, {
+    key: 'emptyEvent',
+    value: function emptyEvent(e) {
+      // EmptyEvent consumes events in android, so it would not be bubbled to mask press.
+      if (_nukeEnv.isWeb) {
+        e.stopPropagation();
+      }
+    }
+  }, {
+    key: 'getChildren',
+    value: function getChildren() {
+      var _this4 = this;
+
+      var _props3 = this.props,
+          children = _props3.children,
+          _props3$contentStyle = _props3.contentStyle,
+          contentStyle = _props3$contentStyle === undefined ? {} : _props3$contentStyle;
+
+      if (!children) return null;
+      if (!Array.isArray(children)) {
+        return (0, _rax.cloneElement)(children, {
+          onClick: function onClick(e) {
+            _this4.emptyEvent(e);
+          }
+        });
+      }
+      if (children.length === 1) {
+        return (0, _rax.cloneElement)(children[0], {
+          onClick: function onClick(e) {
+            _this4.emptyEvent(e);
+          }
+        });
+      }
+      return (0, _rax.createElement)(
+        _nukeView2.default,
+        { style: contentStyle, x: 'autowrap', onClick: function onClick(e) {
+            return _this4.emptyEvent(e);
+          } },
+        children
+      );
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _this5 = this;
+
+      var visible = this.state.visible;
+
+      var _props4 = this.props,
+          content = _props4.content,
+          children = _props4.children,
+          _props4$style = _props4.style,
+          style = _props4$style === undefined ? {} : _props4$style,
+          onVisibleChanged = _props4.onVisibleChanged,
+          onClick = _props4.onClick,
+          _props4$noPress = _props4.noPress,
+          noPress = _props4$noPress === undefined ? false : _props4$noPress,
+          others = _objectWithoutProperties(_props4, ['content', 'children', 'style', 'onVisibleChanged', 'onClick', 'noPress']);
+
+      if (_nukeEnv.isWeex) {
+        var nativeAttrs = _extends({}, others, {
+          style: [_nukeEnv.appInfo.platform === 'iOS' ? styles.maskNativeIOS : {}, style],
+          onClick: function onClick(e) {
+            return _this5.maskPress(e);
+          },
+          onVisibleChanged: function onVisibleChanged(e) {
+            return _this5.change(e);
+          }
+        });
+        if (noPress) {
+          delete nativeAttrs.onClick;
+        }
+        var maskWeex = visible ? (0, _rax.createElement)(
+          'mask',
+          _extends({
+            ref: function ref(n) {
+              _this5.maskNode = (0, _rax.findDOMNode)(n);
+            }
+          }, nativeAttrs),
+          this.getChildren()
+        ) : null;
+        return maskWeex;
+      }
+      return visible ? (0, _rax.createElement)(
+        'div',
+        _extends({}, others, {
+          ref: function ref(n) {
+            _this5.maskNode = (0, _rax.findDOMNode)(n);
+          },
+          style: [styles.maskWeb, style],
+          onClick: function onClick(e) {
+            return _this5.maskPress(e);
+          }
+        }),
+        this.getChildren()
+      ) : null;
+    }
+  }]);
+
+  return Mask;
+}(_rax.Component);
+
+var styles = {
+  // In Android width & height & position will be auto calculated while in iOS won't.
+  maskNativeIOS: {
+    position: 'absolute',
+    width: 750,
+    // To get fullscreen mask , we set screen height
+    height: Math.round(_nukeDimensions2.default.get('screen').height / window.devicePixelRatio) + 'wx'
+  },
+
+  maskWeb: {
+    display: 'flex',
+    boxSizing: 'border-box',
+    flexDirection: 'column',
+    alignContent: 'flex-start',
+    flexShrink: 0,
+    position: 'fixed',
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    zIndex: 100
+  },
+  transparent: {
+    opacity: 0
+  },
+  shown: {
+    opacity: 1
+  }
+};
+Mask.propTypes = {};
+Mask.defaultProps = {
+  animate: true,
+  effect: 'ease-in-out',
+  duration: 200,
+  contentStyle: {}
+};
+exports.default = Mask;
+module.exports = exports['default'];

package.json

 {
   "name": "nuke-mask",
-  "version": "2.1.10",
+  "version": "2.2.2",
   "description": "遮罩层",
@@ -55,19 +55,13 @@ "main": "lib/index",
   "dependencies": {
-    "nuke-dimensions": "^2.1.10",
-    "nuke-env": "^2.1.10",
-    "nuke-transition": "^2.1.10",
-    "nuke-view": "^2.1.10"
+    "nuke-dimensions": "^2.2.2",
+    "nuke-env": "^2.2.2",
+    "nuke-transition": "^2.2.2",
+    "nuke-view": "^2.2.2"
   },
   "devDependencies": {
-    "babel-eslint": "^7.2.3",
-    "eslint": "3.19.0",
-    "eslint-config-ali": "2.0.0",
-    "eslint-plugin-import": "2.6.0",
-    "eslint-plugin-jsx-a11y": "6.0.2",
-    "eslint-plugin-react": "7.1.0",
-    "nuke-button": "^2.1.10",
-    "nuke-checkbox": "^2.1.10",
-    "nuke-input": "^2.1.10",
-    "nuke-page": "^2.1.10",
-    "nuke-text": "^2.1.10"
+    "nuke-button": "^2.2.2",
+    "nuke-checkbox": "^2.2.2",
+    "nuke-input": "^2.2.2",
+    "nuke-page": "^2.2.2",
+    "nuke-text": "^2.2.2"
   },
@@ -78,3 +72,3 @@ "publishConfig": {
   "license": "Apache",
-  "gitHead": "3f456cd7f92241938769ceee9057f543a2034fd1"
+  "gitHead": "ffcb4269489cb30dfded592190c4997ff2376c18"
 }

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

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39359

increased by9.43%

Dev dependency count

5

decreased by-54.55%

Lines of code

537

increased by93.86%

Number of low quality alerts

1

decreased by-50%

Dependency changes

• Updatednuke-dimensions@^2.2.2

• Updatednuke-env@^2.2.2

• Updatednuke-transition@^2.2.2

• Updatednuke-view@^2.2.2