@casl/react - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

CHANGELOG.md

@@ -5,2 +5,9 @@ # Change Log
 
+# [@casl/react-v1.0.2](https://github.com/stalniy/casl/compare/@casl/react@1.0.1...@casl/react@1.0.2) (2019-02-16)
+
+
+### Performance Improvements
+
+* **react:** checks whether ability changed before unsubsribing ([d865fa8](https://github.com/stalniy/casl/commit/d865fa8)), closes [#159](https://github.com/stalniy/casl/issues/159)
+
 # [@casl/react-v1.0.1](https://github.com/stalniy/casl/compare/@casl/react@1.0.0...@casl/react@1.0.1) (2019-02-10)
@@ -7,0 +14,0 @@

dist/es5m/index.js

@@ -5,54 +5,45 @@ import React, { Fragment, createElement, PureComponent } from 'react';
 
-var classCallCheck = function (instance, Constructor) {
-  if (!(instance instanceof Constructor)) {
-    throw new TypeError("Cannot call a class as a 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);
   }
-};
+}
 
-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);
-    }
-  }
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
 
-  return function (Constructor, protoProps, staticProps) {
-    if (protoProps) defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) defineProperties(Constructor, staticProps);
-    return Constructor;
-  };
-}();
-
-var inherits = function (subClass, superClass) {
-  if (typeof superClass !== "function" && superClass !== null) {
-    throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
   }
 
-  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;
-};
+  return obj;
+}
 
-var possibleConstructorReturn = function (self, call) {
-  if (!self) {
-    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-  }
+function _inheritsLoose(subClass, superClass) {
+  subClass.prototype = Object.create(superClass.prototype);
+  subClass.prototype.constructor = subClass;
+  subClass.__proto__ = superClass;
+}
 
-  return call && (typeof call === "object" || typeof call === "function") ? call : self;
-};
+var noop = function noop() {};
 
-var noop = function noop() {};
 var _renderChildren = Fragment ? function (children) {
   return createElement.apply(null, [Fragment, null].concat(children));
 } : React.Children.only;
+
 var propTypes = {};
@@ -65,6 +56,2 @@
     return function (props) {
-      for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-        args[_key - 1] = arguments[_key];
-      }
-
       // eslint-disable-line
@@ -74,3 +61,7 @@ if (!names.split(' ').some(function (name) {
       })) {
-        return validate.apply(undefined, [props].concat(args));
+        for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+          args[_key - 1] = arguments[_key];
+        }
+
+        return validate.apply(void 0, [props].concat(args));
       }
@@ -95,28 +86,39 @@ };
 
-var Can = function (_PureComponent) {
-  inherits(Can, _PureComponent);
+var Can =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Can, _PureComponent);
 
   function Can() {
-    classCallCheck(this, Can);
+    var _this;
 
-    for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
 
-    var _this = possibleConstructorReturn(this, _PureComponent.call.apply(_PureComponent, [this].concat(args)));
-
+    _this = _PureComponent.call.apply(_PureComponent, [this].concat(args)) || this;
     _this.unsubscribeFromAbility = noop;
+    _this._isAllowed = false;
+    _this._ability = null;
     return _this;
   }
 
-  Can.prototype.componentWillUnmount = function componentWillUnmount() {
+  var _proto = Can.prototype;
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
     this.unsubscribeFromAbility();
   };
 
-  Can.prototype.connectToAbility = function connectToAbility(ability) {
+  _proto.connectToAbility = function connectToAbility(ability) {
     var _this2 = this;
 
+    if (ability === this._ability) {
+      return;
+    }
+
     this.unsubscribeFromAbility();
+    this._ability = null;
 
     if (ability) {
+      this._ability = ability;
       this.unsubscribeFromAbility = ability.on('updated', function () {
@@ -128,3 +130,3 @@ return _this2.forceUpdate();
 
-  Can.prototype.isAllowed = function isAllowed() {
+  _proto.isAllowed = function isAllowed() {
     var params = this.props;
@@ -138,7 +140,6 @@
     var can = params.not ? 'cannot' : 'can';
-
     return params.ability[can](action, subject, field);
   };
 
-  Can.prototype.render = function render() {
+  _proto.render = function render() {
     this.connectToAbility(this.props.ability);
@@ -149,22 +150,21 @@ this._isAllowed = this.isAllowed();
 
-  Can.prototype.renderChildren = function renderChildren() {
-    var _props = this.props,
-        children = _props.children,
-        ability = _props.ability;
-
+  _proto.renderChildren = function renderChildren() {
+    var _this$props = this.props,
+        children = _this$props.children,
+        ability = _this$props.ability;
     var elements = typeof children === 'function' ? children(this._isAllowed, ability) : children;
-
     return _renderChildren(elements);
   };
 
-  createClass(Can, [{
-    key: 'allowed',
-    get: function get$$1() {
+  _createClass(Can, [{
+    key: "allowed",
+    get: function get() {
       return this._isAllowed;
     }
   }]);
+
   return Can;
 }(PureComponent);
 
-Can.propTypes = propTypes;
+_defineProperty(Can, "propTypes", propTypes);
 
@@ -174,18 +174,18 @@ function createCanBoundTo(ability) {
 
-  return _temp = _class = function (_Can) {
-    inherits(BoundCan, _Can);
+  return _temp = _class =
+  /*#__PURE__*/
+  function (_Can) {
+    _inheritsLoose(BoundCan, _Can);
 
     function BoundCan() {
-      classCallCheck(this, BoundCan);
-      return possibleConstructorReturn(this, _Can.apply(this, arguments));
+      return _Can.apply(this, arguments) || this;
     }
 
     return BoundCan;
-  }(Can), _class.propTypes = Object.assign({}, Can.propTypes, {
+  }(Can), _defineProperty(_class, "propTypes", Object.assign({}, Can.propTypes, {
     ability: PropTypes.instanceOf(Ability)
-  }), _class.defaultProps = {
+  })), _defineProperty(_class, "defaultProps", {
     ability: ability
-  }, _temp;
+  }), _temp;
 }
-
 function createContextualCan(Consumer) {
@@ -192,0 +192,0 @@ return function ContextualCan(props) {

dist/es6/index.js

@@ -5,3 +5,19 @@ import React, { PureComponent, Fragment, createElement } from 'react';
 
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+}
+
 const noop = () => {};
+
 const renderChildren = Fragment ? children => createElement.apply(null, [Fragment, null].concat(children)) : React.Children.only;
@@ -36,6 +52,7 @@ let propTypes = {};
 class Can extends PureComponent {
-
   constructor(...args) {
     super(...args);
     this.unsubscribeFromAbility = noop;
+    this._isAllowed = false;
+    this._ability = null;
   }
@@ -48,5 +65,11 @@
   connectToAbility(ability) {
+    if (ability === this._ability) {
+      return;
+    }
+
     this.unsubscribeFromAbility();
+    this._ability = null;
 
     if (ability) {
+      this._ability = ability;
       this.unsubscribeFromAbility = ability.on('updated', () => this.forceUpdate());
@@ -65,3 +88,2 @@ }
     const can = params.not ? 'cannot' : 'can';
-
     return params.ability[can](action, subject, field);
@@ -77,20 +99,23 @@ }
   renderChildren() {
-    const { children, ability } = this.props;
+    const {
+      children,
+      ability
+    } = this.props;
     const elements = typeof children === 'function' ? children(this._isAllowed, ability) : children;
-
     return renderChildren(elements);
   }
+
 }
-Can.propTypes = propTypes;
 
+_defineProperty(Can, "propTypes", propTypes);
+
 function createCanBoundTo(ability) {
   var _class, _temp;
 
-  return _temp = _class = class BoundCan extends Can {}, _class.propTypes = Object.assign({}, Can.propTypes, {
+  return _temp = _class = class BoundCan extends Can {}, _defineProperty(_class, "propTypes", Object.assign({}, Can.propTypes, {
     ability: PropTypes.instanceOf(Ability)
-  }), _class.defaultProps = {
+  })), _defineProperty(_class, "defaultProps", {
     ability
-  }, _temp;
+  }), _temp;
 }
-
 function createContextualCan(Consumer) {
@@ -97,0 +122,0 @@ return function ContextualCan(props) {

dist/umd/index.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types"),require("@casl/ability")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@casl/ability"],e):e(((t=t||self).casl=t.casl||{},t.casl.react={}),t.React,t.React.PropTypes,t.casl)}(this,function(t,n,r,o){"use strict";var e="default"in n?n.default:n;r=r&&r.hasOwnProperty("default")?r.default:r;var a=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},s=function(){function r(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(t,e,n){return e&&r(t.prototype,e),n&&r(t,n),t}}(),u=function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)},l=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e},c=function(){},p=n.Fragment?function(t){return n.createElement.apply(null,[n.Fragment,null].concat(t))}:e.Children.only,i={};if("production"!==process.env.NODE_ENV){var f=r.oneOfType([r.object,r.string]).isRequired,y=function(o,i){return function(e){for(var t=arguments.length,n=Array(1<t?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];if(!o.split(" ").some(function(t){return e[t]}))return i.apply(void 0,[e].concat(n))}};i={I:y("do",r.string.isRequired),a:y("on this of an",f),an:y("on this of a",f),of:y("on a this an",f),this:y("on a of an",f),do:y("I",r.string.isRequired),on:y("this a of an",f),not:r.bool,passThrough:r.bool,children:r.any.isRequired,ability:r.instanceOf(o.Ability).isRequired}}var h=function(o){function i(){a(this,i);for(var t=arguments.length,e=Array(t),n=0;n<t;n++)e[n]=arguments[n];var r=l(this,o.call.apply(o,[this].concat(e)));return r.unsubscribeFromAbility=c,r}return u(i,o),i.prototype.componentWillUnmount=function(){this.unsubscribeFromAbility()},i.prototype.connectToAbility=function(t){var e=this;this.unsubscribeFromAbility(),t&&(this.unsubscribeFromAbility=t.on("updated",function(){return e.forceUpdate()}))},i.prototype.isAllowed=function(){var t=this.props,e=(t.I||t.do).split(/\s+/),n=e[0],r=e[1],o=t.of||t.a||t.this||t.on,i=t.not?"cannot":"can";return t.ability[i](n,o,r)},i.prototype.render=function(){return this.connectToAbility(this.props.ability),this._isAllowed=this.isAllowed(),this.props.passThrough||this._isAllowed?this.renderChildren():null},i.prototype.renderChildren=function(){var t=this.props,e=t.children,n=t.ability,r="function"==typeof e?e(this._isAllowed,n):e;return p(r)},s(i,[{key:"allowed",get:function(){return this._isAllowed}}]),i}(n.PureComponent);h.propTypes=i,t.Can=h,t.createCanBoundTo=function(t){var e,n;return n=e=function(t){function e(){return a(this,e),l(this,t.apply(this,arguments))}return u(e,t),e}(h),e.propTypes=Object.assign({},h.propTypes,{ability:r.instanceOf(o.Ability)}),e.defaultProps={ability:t},n},t.createContextualCan=function(t){return function(e){return n.createElement(t,null,function(t){return n.createElement(h,{ability:e.ability||t,I:e.I||e.do,a:e.on||e.a||e.an||e.of||e.this,not:e.not,children:e.children,passThrough:e.passThrough})})}},Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types"),require("@casl/ability")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@casl/ability"],e):e(((t=t||self).casl=t.casl||{},t.casl.react={}),t.React,t.React.PropTypes,t.casl)}(this,function(t,n,i,r){"use strict";var e="default"in n?n.default:n;function a(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function o(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function l(t,e){t.prototype=Object.create(e.prototype),(t.prototype.constructor=t).__proto__=e}i=i&&i.hasOwnProperty("default")?i.default:i;var s=function(){},u=n.Fragment?function(t){return n.createElement.apply(null,[n.Fragment,null].concat(t))}:e.Children.only,c={};if("production"!==process.env.NODE_ENV){var p=i.oneOfType([i.object,i.string]).isRequired,f=function(r,o){return function(e){if(!r.split(" ").some(function(t){return e[t]})){for(var t=arguments.length,n=new Array(1<t?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];return o.apply(void 0,[e].concat(n))}}};c={I:f("do",i.string.isRequired),a:f("on this of an",p),an:f("on this of a",p),of:f("on a this an",p),this:f("on a of an",p),do:f("I",i.string.isRequired),on:f("this a of an",p),not:i.bool,passThrough:i.bool,children:i.any.isRequired,ability:i.instanceOf(r.Ability).isRequired}}var y=function(r){function t(){for(var t,e=arguments.length,n=new Array(e),i=0;i<e;i++)n[i]=arguments[i];return(t=r.call.apply(r,[this].concat(n))||this).unsubscribeFromAbility=s,t._isAllowed=!1,t._ability=null,t}l(t,r);var e,n,i,o=t.prototype;return o.componentWillUnmount=function(){this.unsubscribeFromAbility()},o.connectToAbility=function(t){var e=this;t!==this._ability&&(this.unsubscribeFromAbility(),this._ability=null,t&&(this._ability=t,this.unsubscribeFromAbility=t.on("updated",function(){return e.forceUpdate()})))},o.isAllowed=function(){var t=this.props,e=(t.I||t.do).split(/\s+/),n=e[0],i=e[1],r=t.of||t.a||t.this||t.on,o=t.not?"cannot":"can";return t.ability[o](n,r,i)},o.render=function(){return this.connectToAbility(this.props.ability),this._isAllowed=this.isAllowed(),this.props.passThrough||this._isAllowed?this.renderChildren():null},o.renderChildren=function(){var t=this.props,e=t.children,n=t.ability,i="function"==typeof e?e(this._isAllowed,n):e;return u(i)},e=t,(n=[{key:"allowed",get:function(){return this._isAllowed}}])&&a(e.prototype,n),i&&a(e,i),t}(n.PureComponent);o(y,"propTypes",c),t.Can=y,t.createCanBoundTo=function(t){var e,n;return n=e=function(t){function e(){return t.apply(this,arguments)||this}return l(e,t),e}(y),o(e,"propTypes",Object.assign({},y.propTypes,{ability:i.instanceOf(r.Ability)})),o(e,"defaultProps",{ability:t}),n},t.createContextualCan=function(t){return function(e){return n.createElement(t,null,function(t){return n.createElement(y,{ability:e.ability||t,I:e.I||e.do,a:e.on||e.a||e.an||e.of||e.this,not:e.not,children:e.children,passThrough:e.passThrough})})}},Object.defineProperty(t,"__esModule",{value:!0})});

package.json

 {
   "name": "@casl/react",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "React component for CASL which makes it easy to add permissions in any React application",
@@ -5,0 +5,0 @@ "main": "dist/umd/index.js",

No alert changes

Improved metrics

Total package byte prevSize

29350

increased by0.25%

Lines of code

321

increased by8.08%

No dependency changes