reactive-di - npm Package Compare versions

Comparing version 6.1.0 to 7.0.0

CHANGELOG.md

@@ -5,2 +5,7 @@ # Change Log
 
+<a name="7.0.0"></a>
+# [7.0.0](https://github.com/zerkalica/reactive-di/compare/v6.1.0...v7.0.0) (2018-03-01)
+
+
+
 <a name="6.1.0"></a>
@@ -7,0 +12,0 @@ # [6.1.0](https://github.com/zerkalica/reactive-di/compare/v6.0.9...v6.1.0) (2018-02-03)

dist/reactive-di.es.js

@@ -7,29 +7,8 @@ function _inheritsLoose(subClass, superClass) {
 
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object['ke' + 'ys'](descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
-
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   }
 
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
-
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
-
-  if (desc.initializer === void 0) {
-    Object['define' + 'Property'](target, property, desc);
-    desc = null;
-  }
-
-  return desc;
+  return self;
 }
@@ -142,3 +121,2 @@
         for (var prop in state) {
-          
           value[prop] = state[prop];
@@ -355,5 +333,3 @@ }
 
-function createReactWrapper(BaseComponent, ErrorComponent, detached, rootInjector, isFullEqual) {
-  var _class, _class2, _temp;
-
+function createReactWrapper(BaseComponent, ErrorComponent, Reaction, rootInjector, isFullEqual) {
   if (rootInjector === void 0) {
@@ -367,3 +343,3 @@ rootInjector = new Injector();
 
-  var AtomizedComponent = (_class = (_temp = _class2 =
+  var AtomizedComponent =
   /*#__PURE__*/
@@ -377,7 +353,4 @@ function (_BaseComponent) {
       _this = _BaseComponent.call(this, props, reactContext) || this;
-      _this._propsChanged = true;
-      _this._el = undefined;
       _this._lastData = null;
       var injector = rootInjector;
-      _this._keys = undefined;
       var cns = _this.constructor;
@@ -387,4 +360,2 @@ var name = cns.displayName;
       if (props) {
-        _this._keys = Object.keys(props);
-        if (_this._keys.length === 0) _this._keys = undefined;
         if (props.__lom_ctx !== undefined) injector = props.__lom_ctx;
@@ -399,2 +370,3 @@ if (props.id) name = props.id;
       cns.instance++;
+      _this._reaction = new Reaction(name, _assertThisInitialized(_this));
       return _this;
@@ -410,16 +382,16 @@ }
     // }
+    //
 
 
     _proto.shouldComponentUpdate = function shouldComponentUpdate(props) {
-      if (this._keys === undefined) return false;
       var oldProps = this.props;
-      var keys = this._keys;
       this._injector.props = props;
+      var count = 0;
 
-      for (var i = 0, l = keys.length; i < l; i++) {
-        // eslint-disable-line
-        var k = keys[i];
+      for (var k in oldProps) {
+        count++;
 
         if (oldProps[k] !== props[k]) {
-          this._propsChanged = true;
+          this._reaction.reset();
+
           return true;
@@ -429,8 +401,18 @@ }
 
-      if (this.constructor.isFullEqual === true) {
-        this._keys = Object.keys(props);
-        this._propsChanged = keys.length !== this._keys.length;
-        return this._propsChanged;
+      for (var _k in props) {
+        count--;
+
+        if (oldProps[_k] !== props[_k]) {
+          this._reaction.reset();
+
+          return true;
+        }
       }
 
+      if (count !== 0) {
+        this._reaction.reset();
+
+        return true;
+      }
+
       return false;
@@ -440,5 +422,4 @@ };
     _proto.componentWillUnmount = function componentWillUnmount() {
-      this['r()'].destructor();
-      this._el = undefined;
-      this._keys = undefined;
+      this._reaction.destructor();
+
       this.props = undefined;
@@ -456,5 +437,4 @@ this._lastData = null;
 
-    _proto.r = function r(force) {
+    _proto.value = function value(propsChanged) {
       var data = null;
-      var render = this._render;
       var prevContext = Injector.parentContext;
@@ -464,6 +444,6 @@ var injector = Injector.parentContext = this._injector;
       try {
-        data = injector.invokeWithProps(render, this.props, this._propsChanged);
+        data = injector.invokeWithProps(this._render, this.props, propsChanged);
         this._lastData = data;
       } catch (error) {
-        data = injector.invokeWithProps(render.onError || ErrorComponent, {
+        data = injector.invokeWithProps(this._render.onError || ErrorComponent, {
           error: error,
@@ -475,10 +455,2 @@ children: this._lastData
       Injector.parentContext = prevContext;
-
-      if (!this._propsChanged) {
-        this._el = data;
-        this.forceUpdate();
-        this._el = undefined;
-      }
-
-      this._propsChanged = false;
       return data;
@@ -488,7 +460,9 @@ };
     _proto.render = function render() {
-      return this._el === undefined ? this.r(this._propsChanged) : this._el;
+      return this._reaction.value();
     };
 
     return AtomizedComponent;
-  }(BaseComponent), _class2.isFullEqual = isFullEqual, _temp), _applyDecoratedDescriptor(_class.prototype, "r", [detached], Object.getOwnPropertyDescriptor(_class.prototype, "r"), _class.prototype), _class);
+  }(BaseComponent);
+
+  AtomizedComponent.isFullEqual = isFullEqual;
   var names = new Map();
@@ -698,88 +672,58 @@ return function reactWrapper(render) {
 
-function createMobxDetached(Reaction) {
-  var LomReaction =
-  /*#__PURE__*/
-  function () {
-    function LomReaction(name, host, propName, reactions) {
-      var _this = this;
+function createMobxReaction(Reaction) {
+  return (
+    /*#__PURE__*/
+    function () {
+      function RdiMobxReaction(name, host) {
+        var _this = this;
 
-      this._force = false;
-      this._cache = undefined;
-      this._host = host;
-      this._propName = propName;
-      this._reactions = reactions;
+        this._cache = undefined;
+        this._host = host;
 
-      var onInvalidate = function onInvalidate() {
-        return _this._onInvalidate();
-      };
+        this._track = function () {
+          return _this.__track();
+        };
 
-      this._track = function () {
-        return _this.__track();
-      };
+        this._reaction = new Reaction(name, function () {
+          return _this._onInvalidate();
+        });
+      }
 
-      this._reaction = new Reaction(name, onInvalidate);
-    }
+      var _proto = RdiMobxReaction.prototype;
 
-    var _proto = LomReaction.prototype;
+      _proto._onInvalidate = function _onInvalidate() {
+        this._cache = undefined;
+        this.value();
 
-    _proto._onInvalidate = function _onInvalidate() {
-      this._cache = undefined;
-      this.value(false);
-    };
+        this._host.forceUpdate();
+      };
 
-    _proto.__track = function __track() {
-      this._cache = this._host[this._propName](this._force);
-    };
+      _proto.__track = function __track() {
+        this._cache = this._host.value();
+      };
 
-    _proto.value = function value(force) {
-      if (this._cache === undefined || force) {
-        this._force = force;
+      _proto.reset = function reset() {
+        this._cache = undefined;
+      };
 
-        this._reaction.track(this._track);
+      _proto.value = function value() {
+        if (this._cache === undefined) {
+          this._reaction.track(this._track);
+        }
 
-        this._force = false;
-      }
+        return this._cache;
+      };
 
-      return this._cache;
-    };
+      _proto.destructor = function destructor() {
+        this._reaction.dispose();
 
-    _proto.destructor = function destructor() {
-      this._reaction.dispose();
+        this._reaction = undefined;
+        this._host = undefined;
+        this._cache = undefined;
+        this._track = undefined;
+      };
 
-      this._reactions.delete(this);
-
-      this._reaction = undefined;
-      this._host = undefined;
-      this._cache = undefined;
-      this._track = undefined;
-    };
-
-    return LomReaction;
-  }();
-
-  return function mobxDetached(proto, name, descr) {
-    var value = descr.value;
-    var reactions = new WeakMap();
-    Object.defineProperty(proto, name + "()", {
-      get: function get() {
-        return reactions.get(this);
-      }
-    });
-    proto[name + '$'] = value;
-    return {
-      enumerable: descr.enumerable,
-      configurable: descr.configurable,
-      value: function value(force) {
-        var reaction = reactions.get(this);
-
-        if (!reaction) {
-          var di = this[rdiInst];
-          reaction = new LomReaction(di ? di.displayName + "." + name : name, this, name + '$', reactions);
-          reactions.set(this, reaction);
-        }
-
-        return reaction.value(force);
-      }
-    };
-  };
+      return RdiMobxReaction;
+    }()
+  );
 }
@@ -902,7 +846,5 @@
 
-var scheduleNative = typeof requestAnimationFrame === 'function' ? function (handler) {
-  return requestAnimationFrame(handler);
-} : function (handler) {
-  return setTimeout(handler, 16);
-};
+function defaultSchedule(cb) {
+  setTimeout(cb, 16);
+}
 
@@ -912,6 +854,11 @@ var JssSheetManager =
 function () {
-  function JssSheetManager(jss) {
+  function JssSheetManager(jss, schedule) {
+    if (schedule === void 0) {
+      schedule = defaultSchedule;
+    }
+
     _initialiseProps.call(this);
 
     this._jss = jss;
+    this._schedule = schedule;
   }
@@ -921,3 +868,3 @@
     return function generateClassName(rule, sheet) {
-      return "" + sheet.options.classNamePrefix + (rule.key ? "-" + rule.key : '');
+      return "" + (sheet ? sheet.options.classNamePrefix : '') + (rule.key ? "-" + rule.key : '');
     };
@@ -951,3 +898,3 @@ };
     if (scheduled.length === 0) {
-      scheduleNative(this._sync);
+      this._schedule(this._sync);
     }
@@ -1002,3 +949,3 @@
 
-function themeProp(proto, name, descr, isSelf) {
+function themeProp(proto, name, descr) {
   var className = proto.constructor.displayName || proto.constructor.name;
@@ -1026,13 +973,8 @@ var getSheet = descr.get;
 
-function themeSelf(proto, name, descr) {
-  return themeProp(proto, name, descr, true);
-}
-
 function theme(proto, name, descr) {
   return themeProp(proto, name, descr);
 }
-theme.self = themeSelf;
 theme.fn = addDebugInfo;
 
-export { createReactWrapper, createCreateElement, Injector, cloneComponent, props, createMobxDetached, theme, JssSheetManager };
+export { createReactWrapper, createCreateElement, Injector, cloneComponent, props, createMobxReaction, theme, JssSheetManager };
 //# sourceMappingURL=reactive-di.es.js.map

dist/reactive-di.js

@@ -11,29 +11,8 @@ 'use strict';
 
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object['ke' + 'ys'](descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
-
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   }
 
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
-
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
-
-  if (desc.initializer === void 0) {
-    Object['define' + 'Property'](target, property, desc);
-    desc = null;
-  }
-
-  return desc;
+  return self;
 }
@@ -146,3 +125,2 @@
         for (var prop in state) {
-          
           value[prop] = state[prop];
@@ -359,5 +337,3 @@ }
 
-function createReactWrapper(BaseComponent, ErrorComponent, detached, rootInjector, isFullEqual) {
-  var _class, _class2, _temp;
-
+function createReactWrapper(BaseComponent, ErrorComponent, Reaction, rootInjector, isFullEqual) {
   if (rootInjector === void 0) {
@@ -371,3 +347,3 @@ rootInjector = new Injector();
 
-  var AtomizedComponent = (_class = (_temp = _class2 =
+  var AtomizedComponent =
   /*#__PURE__*/
@@ -381,7 +357,4 @@ function (_BaseComponent) {
       _this = _BaseComponent.call(this, props, reactContext) || this;
-      _this._propsChanged = true;
-      _this._el = undefined;
       _this._lastData = null;
       var injector = rootInjector;
-      _this._keys = undefined;
       var cns = _this.constructor;
@@ -391,4 +364,2 @@ var name = cns.displayName;
       if (props) {
-        _this._keys = Object.keys(props);
-        if (_this._keys.length === 0) _this._keys = undefined;
         if (props.__lom_ctx !== undefined) injector = props.__lom_ctx;
@@ -403,2 +374,3 @@ if (props.id) name = props.id;
       cns.instance++;
+      _this._reaction = new Reaction(name, _assertThisInitialized(_this));
       return _this;
@@ -414,16 +386,16 @@ }
     // }
+    //
 
 
     _proto.shouldComponentUpdate = function shouldComponentUpdate(props) {
-      if (this._keys === undefined) return false;
       var oldProps = this.props;
-      var keys = this._keys;
       this._injector.props = props;
+      var count = 0;
 
-      for (var i = 0, l = keys.length; i < l; i++) {
-        // eslint-disable-line
-        var k = keys[i];
+      for (var k in oldProps) {
+        count++;
 
         if (oldProps[k] !== props[k]) {
-          this._propsChanged = true;
+          this._reaction.reset();
+
           return true;
@@ -433,8 +405,18 @@ }
 
-      if (this.constructor.isFullEqual === true) {
-        this._keys = Object.keys(props);
-        this._propsChanged = keys.length !== this._keys.length;
-        return this._propsChanged;
+      for (var _k in props) {
+        count--;
+
+        if (oldProps[_k] !== props[_k]) {
+          this._reaction.reset();
+
+          return true;
+        }
       }
 
+      if (count !== 0) {
+        this._reaction.reset();
+
+        return true;
+      }
+
       return false;
@@ -444,5 +426,4 @@ };
     _proto.componentWillUnmount = function componentWillUnmount() {
-      this['r()'].destructor();
-      this._el = undefined;
-      this._keys = undefined;
+      this._reaction.destructor();
+
       this.props = undefined;
@@ -460,5 +441,4 @@ this._lastData = null;
 
-    _proto.r = function r(force) {
+    _proto.value = function value(propsChanged) {
       var data = null;
-      var render = this._render;
       var prevContext = Injector.parentContext;
@@ -468,6 +448,6 @@ var injector = Injector.parentContext = this._injector;
       try {
-        data = injector.invokeWithProps(render, this.props, this._propsChanged);
+        data = injector.invokeWithProps(this._render, this.props, propsChanged);
         this._lastData = data;
       } catch (error) {
-        data = injector.invokeWithProps(render.onError || ErrorComponent, {
+        data = injector.invokeWithProps(this._render.onError || ErrorComponent, {
           error: error,
@@ -479,10 +459,2 @@ children: this._lastData
       Injector.parentContext = prevContext;
-
-      if (!this._propsChanged) {
-        this._el = data;
-        this.forceUpdate();
-        this._el = undefined;
-      }
-
-      this._propsChanged = false;
       return data;
@@ -492,7 +464,9 @@ };
     _proto.render = function render() {
-      return this._el === undefined ? this.r(this._propsChanged) : this._el;
+      return this._reaction.value();
     };
 
     return AtomizedComponent;
-  }(BaseComponent), _class2.isFullEqual = isFullEqual, _temp), _applyDecoratedDescriptor(_class.prototype, "r", [detached], Object.getOwnPropertyDescriptor(_class.prototype, "r"), _class.prototype), _class);
+  }(BaseComponent);
+
+  AtomizedComponent.isFullEqual = isFullEqual;
   var names = new Map();
@@ -702,88 +676,58 @@ return function reactWrapper(render) {
 
-function createMobxDetached(Reaction) {
-  var LomReaction =
-  /*#__PURE__*/
-  function () {
-    function LomReaction(name, host, propName, reactions) {
-      var _this = this;
+function createMobxReaction(Reaction) {
+  return (
+    /*#__PURE__*/
+    function () {
+      function RdiMobxReaction(name, host) {
+        var _this = this;
 
-      this._force = false;
-      this._cache = undefined;
-      this._host = host;
-      this._propName = propName;
-      this._reactions = reactions;
+        this._cache = undefined;
+        this._host = host;
 
-      var onInvalidate = function onInvalidate() {
-        return _this._onInvalidate();
-      };
+        this._track = function () {
+          return _this.__track();
+        };
 
-      this._track = function () {
-        return _this.__track();
-      };
+        this._reaction = new Reaction(name, function () {
+          return _this._onInvalidate();
+        });
+      }
 
-      this._reaction = new Reaction(name, onInvalidate);
-    }
+      var _proto = RdiMobxReaction.prototype;
 
-    var _proto = LomReaction.prototype;
+      _proto._onInvalidate = function _onInvalidate() {
+        this._cache = undefined;
+        this.value();
 
-    _proto._onInvalidate = function _onInvalidate() {
-      this._cache = undefined;
-      this.value(false);
-    };
+        this._host.forceUpdate();
+      };
 
-    _proto.__track = function __track() {
-      this._cache = this._host[this._propName](this._force);
-    };
+      _proto.__track = function __track() {
+        this._cache = this._host.value();
+      };
 
-    _proto.value = function value(force) {
-      if (this._cache === undefined || force) {
-        this._force = force;
+      _proto.reset = function reset() {
+        this._cache = undefined;
+      };
 
-        this._reaction.track(this._track);
+      _proto.value = function value() {
+        if (this._cache === undefined) {
+          this._reaction.track(this._track);
+        }
 
-        this._force = false;
-      }
+        return this._cache;
+      };
 
-      return this._cache;
-    };
+      _proto.destructor = function destructor() {
+        this._reaction.dispose();
 
-    _proto.destructor = function destructor() {
-      this._reaction.dispose();
+        this._reaction = undefined;
+        this._host = undefined;
+        this._cache = undefined;
+        this._track = undefined;
+      };
 
-      this._reactions.delete(this);
-
-      this._reaction = undefined;
-      this._host = undefined;
-      this._cache = undefined;
-      this._track = undefined;
-    };
-
-    return LomReaction;
-  }();
-
-  return function mobxDetached(proto, name, descr) {
-    var value = descr.value;
-    var reactions = new WeakMap();
-    Object.defineProperty(proto, name + "()", {
-      get: function get() {
-        return reactions.get(this);
-      }
-    });
-    proto[name + '$'] = value;
-    return {
-      enumerable: descr.enumerable,
-      configurable: descr.configurable,
-      value: function value(force) {
-        var reaction = reactions.get(this);
-
-        if (!reaction) {
-          var di = this[rdiInst];
-          reaction = new LomReaction(di ? di.displayName + "." + name : name, this, name + '$', reactions);
-          reactions.set(this, reaction);
-        }
-
-        return reaction.value(force);
-      }
-    };
-  };
+      return RdiMobxReaction;
+    }()
+  );
 }
@@ -906,7 +850,5 @@
 
-var scheduleNative = typeof requestAnimationFrame === 'function' ? function (handler) {
-  return requestAnimationFrame(handler);
-} : function (handler) {
-  return setTimeout(handler, 16);
-};
+function defaultSchedule(cb) {
+  setTimeout(cb, 16);
+}
 
@@ -916,6 +858,11 @@ var JssSheetManager =
 function () {
-  function JssSheetManager(jss) {
+  function JssSheetManager(jss, schedule) {
+    if (schedule === void 0) {
+      schedule = defaultSchedule;
+    }
+
     _initialiseProps.call(this);
 
     this._jss = jss;
+    this._schedule = schedule;
   }
@@ -925,3 +872,3 @@
     return function generateClassName(rule, sheet) {
-      return "" + sheet.options.classNamePrefix + (rule.key ? "-" + rule.key : '');
+      return "" + (sheet ? sheet.options.classNamePrefix : '') + (rule.key ? "-" + rule.key : '');
     };
@@ -955,3 +902,3 @@ };
     if (scheduled.length === 0) {
-      scheduleNative(this._sync);
+      this._schedule(this._sync);
     }
@@ -1006,3 +953,3 @@
 
-function themeProp(proto, name, descr, isSelf) {
+function themeProp(proto, name, descr) {
   var className = proto.constructor.displayName || proto.constructor.name;
@@ -1030,10 +977,5 @@ var getSheet = descr.get;
 
-function themeSelf(proto, name, descr) {
-  return themeProp(proto, name, descr, true);
-}
-
 function theme(proto, name, descr) {
   return themeProp(proto, name, descr);
 }
-theme.self = themeSelf;
 theme.fn = addDebugInfo;
@@ -1046,4 +988,4 @@
 exports.props = props;
-exports.createMobxDetached = createMobxDetached;
+exports.createMobxReaction = createMobxReaction;
 exports.theme = theme;
 exports.JssSheetManager = JssSheetManager;

dist/reactive-di.umd.js

@@ -13,29 +13,8 @@ (function (global, factory) {
 
-function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
-  var desc = {};
-  Object['ke' + 'ys'](descriptor).forEach(function (key) {
-    desc[key] = descriptor[key];
-  });
-  desc.enumerable = !!desc.enumerable;
-  desc.configurable = !!desc.configurable;
-
-  if ('value' in desc || desc.initializer) {
-    desc.writable = true;
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
   }
 
-  desc = decorators.slice().reverse().reduce(function (desc, decorator) {
-    return decorator(target, property, desc) || desc;
-  }, desc);
-
-  if (context && desc.initializer !== void 0) {
-    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
-    desc.initializer = undefined;
-  }
-
-  if (desc.initializer === void 0) {
-    Object['define' + 'Property'](target, property, desc);
-    desc = null;
-  }
-
-  return desc;
+  return self;
 }
@@ -148,3 +127,2 @@
         for (var prop in state) {
-          
           value[prop] = state[prop];
@@ -361,5 +339,3 @@ }
 
-function createReactWrapper(BaseComponent, ErrorComponent, detached, rootInjector, isFullEqual) {
-  var _class, _class2, _temp;
-
+function createReactWrapper(BaseComponent, ErrorComponent, Reaction, rootInjector, isFullEqual) {
   if (rootInjector === void 0) {
@@ -373,3 +349,3 @@ rootInjector = new Injector();
 
-  var AtomizedComponent = (_class = (_temp = _class2 =
+  var AtomizedComponent =
   /*#__PURE__*/
@@ -383,7 +359,4 @@ function (_BaseComponent) {
       _this = _BaseComponent.call(this, props, reactContext) || this;
-      _this._propsChanged = true;
-      _this._el = undefined;
       _this._lastData = null;
       var injector = rootInjector;
-      _this._keys = undefined;
       var cns = _this.constructor;
@@ -393,4 +366,2 @@ var name = cns.displayName;
       if (props) {
-        _this._keys = Object.keys(props);
-        if (_this._keys.length === 0) _this._keys = undefined;
         if (props.__lom_ctx !== undefined) injector = props.__lom_ctx;
@@ -405,2 +376,3 @@ if (props.id) name = props.id;
       cns.instance++;
+      _this._reaction = new Reaction(name, _assertThisInitialized(_this));
       return _this;
@@ -416,16 +388,16 @@ }
     // }
+    //
 
 
     _proto.shouldComponentUpdate = function shouldComponentUpdate(props) {
-      if (this._keys === undefined) return false;
       var oldProps = this.props;
-      var keys = this._keys;
       this._injector.props = props;
+      var count = 0;
 
-      for (var i = 0, l = keys.length; i < l; i++) {
-        // eslint-disable-line
-        var k = keys[i];
+      for (var k in oldProps) {
+        count++;
 
         if (oldProps[k] !== props[k]) {
-          this._propsChanged = true;
+          this._reaction.reset();
+
           return true;
@@ -435,8 +407,18 @@ }
 
-      if (this.constructor.isFullEqual === true) {
-        this._keys = Object.keys(props);
-        this._propsChanged = keys.length !== this._keys.length;
-        return this._propsChanged;
+      for (var _k in props) {
+        count--;
+
+        if (oldProps[_k] !== props[_k]) {
+          this._reaction.reset();
+
+          return true;
+        }
       }
 
+      if (count !== 0) {
+        this._reaction.reset();
+
+        return true;
+      }
+
       return false;
@@ -446,5 +428,4 @@ };
     _proto.componentWillUnmount = function componentWillUnmount() {
-      this['r()'].destructor();
-      this._el = undefined;
-      this._keys = undefined;
+      this._reaction.destructor();
+
       this.props = undefined;
@@ -462,5 +443,4 @@ this._lastData = null;
 
-    _proto.r = function r(force) {
+    _proto.value = function value(propsChanged) {
       var data = null;
-      var render = this._render;
       var prevContext = Injector.parentContext;
@@ -470,6 +450,6 @@ var injector = Injector.parentContext = this._injector;
       try {
-        data = injector.invokeWithProps(render, this.props, this._propsChanged);
+        data = injector.invokeWithProps(this._render, this.props, propsChanged);
         this._lastData = data;
       } catch (error) {
-        data = injector.invokeWithProps(render.onError || ErrorComponent, {
+        data = injector.invokeWithProps(this._render.onError || ErrorComponent, {
           error: error,
@@ -481,10 +461,2 @@ children: this._lastData
       Injector.parentContext = prevContext;
-
-      if (!this._propsChanged) {
-        this._el = data;
-        this.forceUpdate();
-        this._el = undefined;
-      }
-
-      this._propsChanged = false;
       return data;
@@ -494,7 +466,9 @@ };
     _proto.render = function render() {
-      return this._el === undefined ? this.r(this._propsChanged) : this._el;
+      return this._reaction.value();
     };
 
     return AtomizedComponent;
-  }(BaseComponent), _class2.isFullEqual = isFullEqual, _temp), _applyDecoratedDescriptor(_class.prototype, "r", [detached], Object.getOwnPropertyDescriptor(_class.prototype, "r"), _class.prototype), _class);
+  }(BaseComponent);
+
+  AtomizedComponent.isFullEqual = isFullEqual;
   var names = new Map();
@@ -704,88 +678,58 @@ return function reactWrapper(render) {
 
-function createMobxDetached(Reaction) {
-  var LomReaction =
-  /*#__PURE__*/
-  function () {
-    function LomReaction(name, host, propName, reactions) {
-      var _this = this;
+function createMobxReaction(Reaction) {
+  return (
+    /*#__PURE__*/
+    function () {
+      function RdiMobxReaction(name, host) {
+        var _this = this;
 
-      this._force = false;
-      this._cache = undefined;
-      this._host = host;
-      this._propName = propName;
-      this._reactions = reactions;
+        this._cache = undefined;
+        this._host = host;
 
-      var onInvalidate = function onInvalidate() {
-        return _this._onInvalidate();
-      };
+        this._track = function () {
+          return _this.__track();
+        };
 
-      this._track = function () {
-        return _this.__track();
-      };
+        this._reaction = new Reaction(name, function () {
+          return _this._onInvalidate();
+        });
+      }
 
-      this._reaction = new Reaction(name, onInvalidate);
-    }
+      var _proto = RdiMobxReaction.prototype;
 
-    var _proto = LomReaction.prototype;
+      _proto._onInvalidate = function _onInvalidate() {
+        this._cache = undefined;
+        this.value();
 
-    _proto._onInvalidate = function _onInvalidate() {
-      this._cache = undefined;
-      this.value(false);
-    };
+        this._host.forceUpdate();
+      };
 
-    _proto.__track = function __track() {
-      this._cache = this._host[this._propName](this._force);
-    };
+      _proto.__track = function __track() {
+        this._cache = this._host.value();
+      };
 
-    _proto.value = function value(force) {
-      if (this._cache === undefined || force) {
-        this._force = force;
+      _proto.reset = function reset() {
+        this._cache = undefined;
+      };
 
-        this._reaction.track(this._track);
+      _proto.value = function value() {
+        if (this._cache === undefined) {
+          this._reaction.track(this._track);
+        }
 
-        this._force = false;
-      }
+        return this._cache;
+      };
 
-      return this._cache;
-    };
+      _proto.destructor = function destructor() {
+        this._reaction.dispose();
 
-    _proto.destructor = function destructor() {
-      this._reaction.dispose();
+        this._reaction = undefined;
+        this._host = undefined;
+        this._cache = undefined;
+        this._track = undefined;
+      };
 
-      this._reactions.delete(this);
-
-      this._reaction = undefined;
-      this._host = undefined;
-      this._cache = undefined;
-      this._track = undefined;
-    };
-
-    return LomReaction;
-  }();
-
-  return function mobxDetached(proto, name, descr) {
-    var value = descr.value;
-    var reactions = new WeakMap();
-    Object.defineProperty(proto, name + "()", {
-      get: function get() {
-        return reactions.get(this);
-      }
-    });
-    proto[name + '$'] = value;
-    return {
-      enumerable: descr.enumerable,
-      configurable: descr.configurable,
-      value: function value(force) {
-        var reaction = reactions.get(this);
-
-        if (!reaction) {
-          var di = this[rdiInst];
-          reaction = new LomReaction(di ? di.displayName + "." + name : name, this, name + '$', reactions);
-          reactions.set(this, reaction);
-        }
-
-        return reaction.value(force);
-      }
-    };
-  };
+      return RdiMobxReaction;
+    }()
+  );
 }
@@ -908,7 +852,5 @@
 
-var scheduleNative = typeof requestAnimationFrame === 'function' ? function (handler) {
-  return requestAnimationFrame(handler);
-} : function (handler) {
-  return setTimeout(handler, 16);
-};
+function defaultSchedule(cb) {
+  setTimeout(cb, 16);
+}
 
@@ -918,6 +860,11 @@ var JssSheetManager =
 function () {
-  function JssSheetManager(jss) {
+  function JssSheetManager(jss, schedule) {
+    if (schedule === void 0) {
+      schedule = defaultSchedule;
+    }
+
     _initialiseProps.call(this);
 
     this._jss = jss;
+    this._schedule = schedule;
   }
@@ -927,3 +874,3 @@
     return function generateClassName(rule, sheet) {
-      return "" + sheet.options.classNamePrefix + (rule.key ? "-" + rule.key : '');
+      return "" + (sheet ? sheet.options.classNamePrefix : '') + (rule.key ? "-" + rule.key : '');
     };
@@ -957,3 +904,3 @@ };
     if (scheduled.length === 0) {
-      scheduleNative(this._sync);
+      this._schedule(this._sync);
     }
@@ -1008,3 +955,3 @@
 
-function themeProp(proto, name, descr, isSelf) {
+function themeProp(proto, name, descr) {
   var className = proto.constructor.displayName || proto.constructor.name;
@@ -1032,10 +979,5 @@ var getSheet = descr.get;
 
-function themeSelf(proto, name, descr) {
-  return themeProp(proto, name, descr, true);
-}
-
 function theme(proto, name, descr) {
   return themeProp(proto, name, descr);
 }
-theme.self = themeSelf;
 theme.fn = addDebugInfo;
@@ -1048,3 +990,3 @@
 exports.props = props;
-exports.createMobxDetached = createMobxDetached;
+exports.createMobxReaction = createMobxReaction;
 exports.theme = theme;
@@ -1051,0 +993,0 @@ exports.JssSheetManager = JssSheetManager;

package.json

 {
   "name": "reactive-di",
-  "version": "6.1.0",
+  "version": "7.0.0",
   "description": "Reactive dependency injection",
@@ -57,22 +57,22 @@ "publishConfig": {
   "devDependencies": {
-    "@babel/core": "=7.0.0-beta.39",
-    "@babel/plugin-external-helpers": "=7.0.0-beta.39",
-    "@babel/plugin-proposal-class-properties": "=7.0.0-beta.39",
-    "@babel/plugin-proposal-decorators": "=7.0.0-beta.39",
-    "@babel/plugin-proposal-object-rest-spread": "=7.0.0-beta.39",
-    "@babel/plugin-transform-flow-strip-types": "=7.0.0-beta.39",
-    "@babel/preset-es2015": "=7.0.0-beta.39",
+    "@babel/core": "=7.0.0-beta.40",
     "@babel/plugin-check-constants": "^7.0.0-beta.38",
-    "@babel/register": "=7.0.0-beta.39",
+    "@babel/plugin-external-helpers": "=7.0.0-beta.40",
+    "@babel/plugin-proposal-class-properties": "=7.0.0-beta.40",
+    "@babel/plugin-proposal-decorators": "=7.0.0-beta.40",
+    "@babel/plugin-proposal-object-rest-spread": "=7.0.0-beta.40",
+    "@babel/plugin-transform-flow-strip-types": "^7.0.0-beta.40",
+    "@babel/preset-es2015": "^7.0.0-beta.40",
+    "@babel/register": "^7.0.0-beta.40",
     "chokidar-cli": "^1.2.0",
-    "flow-bin": "^0.64.0",
-    "lom_atom": "^3.1.3",
-    "mobx": "^3.4.1",
-    "mocha": "^5.0.0",
+    "flow-bin": "^0.66.0",
+    "lom_atom": "^4.0.0",
+    "mobx": "^3.5.1",
+    "mocha": "^5.0.1",
     "preact": "^8.2.7",
     "preact-render-to-string": "^3.7.0",
     "rimraf": "^2.6.2",
-    "rollup": "^0.55.3",
-    "rollup-plugin-babel": "^4.0.0-beta.0",
-    "rollup-plugin-node-resolve": "^3.0.2",
+    "rollup": "^0.56.3",
+    "rollup-plugin-babel": "^4.0.0-beta.2",
+    "rollup-plugin-node-resolve": "^3.0.3",
     "rollup-plugin-uglify": "^3.0.0",
@@ -79,0 +79,0 @@ "standard-version": "^4.3.0",

README.md

@@ -92,3 +92,3 @@ # Reactive DI  [![Build Status](https://secure.travis-ci.org/zerkalica/reactive-di.png)](http://travis-ci.org/zerkalica/reactive-di)
 // @flow
-import {detached, mem, AtomWait, action} from 'lom_atom'
+import {ReactAtom, mem, AtomWait, action} from 'lom_atom'
 import {createReactWrapper, createCreateElement} from 'reactive-di'
@@ -118,3 +118,3 @@ import {render, h, Component} from 'preact'
         ErrorableView,
-        detached
+        ReactAtom
     ),
@@ -163,3 +163,3 @@ (h: React$CreateElement)
 import {Reaction} from 'mobx'
-import {createReactWrapper, createCreateElement, createMobxDetached} from 'reactive-di'
+import {createReactWrapper, createCreateElement, createMobxReaction} from 'reactive-di'
 import {createElement, Component} from 'react'
@@ -189,3 +189,3 @@ import {render} from 'react-dom'
         ErrorableView,
-        createMobxDetached(Reaction)
+        createMobxReaction(Reaction)
     ),
@@ -318,3 +318,3 @@ createElement
         ErrorableView,
-        detached
+        ReactAtom
     ),
@@ -514,4 +514,4 @@ h
 // @flow
-import {detached, mem} from 'lom_atom'
-import {createReactWrapper, createCreateElement, Injector} from 'reactive-di'
+import {ReactAtom, mem, defer} from 'lom_atom'
+import {JssSheetManager, createReactWrapper, createCreateElement, Injector} from 'reactive-di'
 
@@ -523,3 +523,3 @@ import {h, Component} from 'preact'
 
-const jss = createJss()
+const jss = new JssSheetManager(createJss(), defer.add)
 /*
@@ -541,3 +541,3 @@ jss must implements IProcessor interface:
         ErrorableView,
-        detached,
+        ReactAtom,
         new Injector([], jss)
@@ -544,0 +544,0 @@ ),

src/createReactWrapper.js

 // @flow
 import type {TypedPropertyDescriptor} from './interfaces'
-
+import type {IReaction} from './reactivity/interfaces'
 import Injector from './Injector'
@@ -15,3 +15,3 @@ import type {IAtomize, IFromError, IRenderFn, IReactComponent, IProvideItem, IArg, IPropsWithContext} from './interfaces'
     ErrorComponent: IFromError<IElement>,
-    detached: TypedPropertyDescriptor<(force?: boolean) => any>,
+    Reaction: Class<IReaction<any>>,
     rootInjector?: Injector = new Injector(),
@@ -23,3 +23,2 @@ isFullEqual?: boolean = false
         static displayName: string
-        _propsChanged: boolean = true
         _injector: Injector
@@ -31,4 +30,4 @@
 
-        _keys: string[] | void
         _render: IRenderFn<IElement, State>
+        _reaction: IReaction<any>
 
@@ -41,8 +40,5 @@ constructor(
             let injector: Injector = rootInjector
-            this._keys = undefined
             const cns = this.constructor
             let name = cns.displayName
             if (props) {
-                this._keys = Object.keys(props)
-                if (this._keys.length === 0) this._keys = (undefined: any)
                 if (props.__lom_ctx !== undefined) injector = props.__lom_ctx
@@ -56,2 +52,3 @@ if (props.id) name = props.id
             cns.instance++
+            this._reaction = new Reaction(name, this)
         }
@@ -66,20 +63,26 @@
         // }
+        //
 
         shouldComponentUpdate(props: IPropsWithContext) {
-            if (this._keys === undefined) return false
             const oldProps = this.props
-            const keys = this._keys
             this._injector.props = props
-            for (let i = 0, l = keys.length; i < l; i++) { // eslint-disable-line
-                const k = keys[i]
+            let count = 0
+            for (let k in oldProps) {
+                count++
                 if (oldProps[k] !== props[k]) {
-                    this._propsChanged = true
+                    this._reaction.reset()
                     return true
                 }
             }
-            if (this.constructor.isFullEqual === true) {
-                this._keys = Object.keys(props)
-                this._propsChanged = keys.length !== this._keys.length
-                return this._propsChanged
+            for (let k in props) {
+                count--
+                if (oldProps[k] !== props[k]) {
+                    this._reaction.reset()
+                    return true
+                }
             }
+            if (count !== 0) {
+                this._reaction.reset()
+                return true
+            }
             return false
@@ -89,5 +92,3 @@ }
         componentWillUnmount() {
-            this['r()'].destructor()
-            this._el = undefined
-            this._keys = undefined
+            this._reaction.destructor()
             this.props = (undefined: any)
@@ -102,26 +103,16 @@ this._lastData = null
 
-        _el: ?(IElement | void) = undefined
         _lastData: ?IElement = null
-        @detached r(force: boolean): ?IElement {
+
+        value(propsChanged: boolean): ?IElement {
             let data: ?IElement = null
-
-            const render = this._render
-
             const prevContext = Injector.parentContext
             const injector = Injector.parentContext = this._injector
             try {
-                data = injector.invokeWithProps(render, this.props, this._propsChanged)
+                data = injector.invokeWithProps(this._render, this.props, propsChanged)
                 this._lastData = data
             } catch (error) {
-                data = injector.invokeWithProps(render.onError || ErrorComponent, {error, children: this._lastData})
+                data = injector.invokeWithProps(this._render.onError || ErrorComponent, {error, children: this._lastData})
             }
             Injector.parentContext = prevContext
 
-            if (!this._propsChanged) {
-                this._el = data
-                this.forceUpdate()
-                this._el = undefined
-            }
-            this._propsChanged = false
-
             return data
@@ -131,5 +122,3 @@ }
         render() {
-            return this._el === undefined
-                ? this.r(this._propsChanged)
-                : this._el
+            return this._reaction.value()
         }
@@ -136,0 +125,0 @@ }

src/index.js

@@ -8,3 +8,3 @@ // @flow
 export {default as props} from './props'
-export {default as createMobxDetached} from './createMobxDetached'
+export {default as createMobxReaction} from './reactivity/createMobxReaction'
 export {default as theme} from './theming/theme'
@@ -11,0 +11,0 @@ export {default as JssSheetManager} from './theming/JssSheetManager'

src/theming/JssSheetManager.js

@@ -141,5 +141,5 @@ // @flow
 
-export const scheduleNative: (handler: () => void) => mixed = typeof requestAnimationFrame === 'function'
-    ? (handler: () => void) => requestAnimationFrame(handler)
-    : (handler: () => void) => setTimeout(handler, 16)
+function defaultSchedule(cb: () => void) {
+    setTimeout(cb, 16)
+}
 
@@ -151,10 +151,11 @@ export default class JssSheetManager implements ISheetManager {
     _badClassSymbols = BAD_CLASS_SYMBOLS
-
-    constructor(jss: any) {
+    _schedule: (cb: () => void) => void
+    constructor(jss: any, schedule?: (cb: () => void) => void = defaultSchedule) {
         this._jss = jss
+        this._schedule = schedule
     }
 
-    static createGenerateClassName() {
-        return function generateClassName(rule: JSSSRule, sheet: JSSSheet): string {
-            return `${sheet.options.classNamePrefix}${rule.key ? `-${rule.key}` : ''}`
+    static createGenerateClassName(): (a: any, b: any) => string {
+        return function generateClassName(rule: {+key?: string}, sheet?: {options: {classNamePrefix: string}}): string {
+            return `${sheet ? sheet.options.classNamePrefix : ''}${rule.key ? `-${rule.key}` : ''}`
         }
@@ -185,3 +186,3 @@ }
         if (scheduled.length === 0) {
-            scheduleNative(this._sync)
+            this._schedule(this._sync)
         }
@@ -188,0 +189,0 @@ scheduled.push(sheet)

src/theming/theme.js

@@ -20,4 +20,3 @@ // @flow
     name: string,
-    descr: TypedPropertyDescriptor<V>,
-    isSelf?: boolean
+    descr: TypedPropertyDescriptor<V>
 ) {
@@ -52,10 +51,2 @@ const className: string = proto.constructor.displayName || proto.constructor.name
 
-function themeSelf<V: Object>(
-    proto: Object,
-    name: string,
-    descr: TypedPropertyDescriptor<V>
-) {
-    return themeProp(proto, name, descr, true)
-}
-
 export default function theme<V: Object>(
@@ -69,3 +60,2 @@ proto: Object,
 
-theme.self = themeSelf
 theme.fn = addDebugInfo

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

Number of package files

26

increased by4%

Worsened metrics

Total package byte prevSize

205193

decreased by-6.14%

Lines of code

3177

decreased by-5.89%

No dependency changes