constate - npm Package Compare versions

Comparing version 0.4.0 to 0.5.0

dist/cjs/constate.js

@@ -82,2 +82,6 @@ 'use strict';
 
+var parseUpdater = function parseUpdater(updater, state) {
+  return typeof updater === "function" ? updater(state) : updater;
+};
+
 /* eslint-disable react/prop-types */
@@ -100,8 +104,9 @@
     var _this$props = _this.props,
-        state = _this$props.state,
-        context = _this$props.context;
+        setContextState = _this$props.setContextState,
+        context = _this$props.context,
+        initialState = _this$props.initialState;
 
-    if (!state[context]) {
-      _this.handleSetState(_this.getState, undefined, false);
-    }
+    setContextState(context)(function (state) {
+      return _extends({}, initialState, state);
+    });
     return _this;
@@ -111,35 +116,33 @@ }
   ContextContainer.prototype.componentDidMount = function componentDidMount() {
+    var _this2 = this;
+
     var _props = this.props,
+        mount = _props.mount,
         context = _props.context,
-        onMount = _props.onMount,
-        getMounted = _props.getMounted,
-        mount = _props.mount;
+        onMount = _props.onMount;
 
-    if (!getMounted(context) && typeof onMount === "function") {
-      onMount(this.getArgs());
-    }
-    mount(context);
+    this.unmount = mount(context, onMount && function () {
+      return onMount(_this2.getArgs());
+    });
   };
 
   ContextContainer.prototype.componentWillUnmount = function componentWillUnmount() {
-    var _props2 = this.props,
-        getMounted = _props2.getMounted,
-        unmount = _props2.unmount,
-        context = _props2.context,
-        onUnmount = _props2.onUnmount;
+    var _this3 = this;
 
-    if (getMounted(context) === 1 && typeof onUnmount === "function") {
-      onUnmount(this.getArgs());
-    }
-    unmount(context);
+    var onUnmount = this.props.onUnmount;
+
+    this.unmount(onUnmount && function () {
+      return onUnmount(_this3.getArgs());
+    });
   };
 
   ContextContainer.prototype.render = function render() {
-    var _props3 = this.props,
-        children = _props3.children,
-        actions = _props3.actions,
-        selectors = _props3.selectors,
-        effects = _props3.effects;
+    var _props2 = this.props,
+        children = _props2.children,
+        actions = _props2.actions,
+        selectors = _props2.selectors,
+        effects = _props2.effects;
 
-    return children(_extends({}, this.getState(), actions && mapSetStateToActions(this.handleSetState, actions), selectors && mapArgumentToFunctions(this.getState(), selectors), effects && mapArgumentToFunctions(this.getArgs(), effects)));
+    var args = this.getArgs();
+    return children(_extends({}, args.state, actions && mapSetStateToActions(args.setState, actions), selectors && mapArgumentToFunctions(args.state, selectors), effects && mapArgumentToFunctions(args, effects)));
   };
@@ -151,39 +154,31 @@
 var _initialiseProps = function _initialiseProps() {
-  var _this2 = this;
+  var _this4 = this;
 
   this.getArgs = function (additionalArgs) {
+    var _props3 = _this4.props,
+        getContextState = _props3.getContextState,
+        context = _props3.context;
+
     return _extends({
-      state: _this2.getState(),
-      setState: _this2.handleSetState
+      state: getContextState(context),
+      setState: _this4.handleSetState
     }, additionalArgs);
   };
 
-  this.getState = function () {
-    var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.props.state[_this2.props.context];
-    return _extends({}, _this2.props.initialState, state);
-  };
-
-  this.handleSetState = function (fn, cb) {
-    var emitUpdate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var _props4 = _this2.props,
+  this.handleSetState = function (updater, callback) {
+    var _props4 = _this4.props,
+        setContextState = _props4.setContextState,
         context = _props4.context,
-        onUpdate = _props4.onUpdate,
-        setState = _props4.setState;
+        onUpdate = _props4.onUpdate;
 
-    var prevState = _this2.getState();
+    var setState = setContextState(context);
+    var prevState = void 0;
 
-    var updater = function updater(state) {
-      var _ref;
-
-      return _ref = {}, _ref[context] = _extends({}, _this2.getState(state[context]), fn(_this2.getState(state[context]))), _ref;
-    };
-
-    var callback = function callback() {
-      if (emitUpdate && typeof onUpdate === "function") {
-        onUpdate(_this2.getArgs({ prevState: prevState }));
-      }
-      if (cb) cb();
-    };
-
-    setState(updater, callback);
+    setState(function (state) {
+      prevState = state;
+      return parseUpdater(updater, state);
+    }, function () {
+      if (onUpdate) onUpdate(_this4.getArgs({ prevState: prevState }));
+      if (callback) callback();
+    });
   };
@@ -209,10 +204,13 @@ };
       }, additionalArgs);
-    }, _this.handleSetState = function (fn, cb) {
-      var prevState = _this.state;
+    }, _this.handleSetState = function (updater, callback) {
+      var prevState = void 0;
 
-      _this.setState(fn, function () {
-        if (typeof _this.props.onUpdate === "function") {
+      _this.setState(function (state) {
+        prevState = state;
+        return parseUpdater(updater, state);
+      }, function () {
+        if (_this.props.onUpdate) {
           _this.props.onUpdate(_this.getArgs({ prevState: prevState }));
         }
-        if (cb) cb();
+        if (callback) callback();
       });
@@ -227,3 +225,3 @@ }, _temp), possibleConstructorReturn(_this, _ret);
 
-    if (!context && typeof onMount === "function") {
+    if (!context && onMount) {
       onMount(this.getArgs());
@@ -238,3 +236,3 @@ }
 
-    if (!context && typeof onUnmount === "function") {
+    if (!context && onUnmount) {
       onUnmount(this.getArgs({ setState: function setState() {} }));
@@ -251,4 +249,4 @@ }
         null,
-        function (state) {
-          return React.createElement(ContextContainer, _extends({}, state, _this2.props));
+        function (props) {
+          return React.createElement(ContextContainer, _extends({}, props, _this2.props));
         }
@@ -286,2 +284,68 @@ );
 
+/* eslint-disable no-param-reassign, no-use-before-define, no-unused-expressions */
+
+var getProps = function getProps(Container, props) {
+  var getNextProps = function getNextProps(rendered) {
+    var nextProps = _extends({}, rendered.props, props);
+    return getProps(rendered.type, nextProps);
+  };
+
+  if (React.isValidElement(Container)) {
+    return getNextProps(Container);
+  }
+
+  var container = new Container({ children: function children() {
+      return null;
+    } });
+  var rendered = container.render ? container.render() : container;
+
+  if (!React.isValidElement(rendered)) {
+    return props;
+  }
+
+  return getNextProps(rendered);
+};
+
+var mapToDraft = function mapToDraft(object, draft) {
+  return Object.keys(object).forEach(function (key) {
+    draft[key] = object[key];
+  });
+};
+
+var mount = function mount(Container) {
+  var _getProps = getProps(Container),
+      initialState = _getProps.initialState,
+      actions = _getProps.actions,
+      selectors = _getProps.selectors,
+      effects = _getProps.effects,
+      onMount = _getProps.onMount,
+      onUpdate = _getProps.onUpdate;
+
+  var state = _extends({}, initialState);
+
+  var setState = function setState(updater, callback) {
+    var prevState = _extends({}, state);
+    mapToDraft(parseUpdater(updater, state), state);
+    if (onUpdate) {
+      onUpdate(getArgs({ prevState: prevState }));
+    }
+    if (callback) callback();
+  };
+
+  var getArgs = function getArgs(additionalArgs) {
+    return _extends({
+      state: state,
+      setState: setState
+    }, additionalArgs);
+  };
+
+  typeof onMount === "function" && onMount(getArgs());
+
+  actions && mapToDraft(mapSetStateToActions(setState, actions), state);
+  selectors && mapToDraft(mapArgumentToFunctions(state, selectors), state);
+  effects && mapToDraft(mapArgumentToFunctions(getArgs(), effects), state);
+
+  return state;
+};
+
 /* eslint-disable react/sort-comp, react/no-unused-state */
@@ -301,20 +365,38 @@
 
-    return _ret = (_temp = (_this = possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.mounted = {}, _this.getMounted = function (context) {
-      return _this.mounted[context] || 0;
-    }, _this.mount = function (context) {
-      _this.mounted[context] = _this.getMounted(context) + 1;
-    }, _this.unmount = function (context) {
-      _this.mounted[context] = _this.getMounted(context) - 1;
-    }, _this.handleSetState = function (fn, cb) {
-      _this.setState(function (state) {
+    return _ret = (_temp = (_this = possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.containers = {}, _this.mount = function (context, onMount) {
+      if (!_this.containers[context]) {
+        _this.containers[context] = 0;
+        if (onMount) _this.setState(null, onMount);
+      }
+      _this.containers[context] += 1;
+
+      return function (onUnmount) {
+        if (_this.containers[context] === 1 && onUnmount) onUnmount();
+        _this.containers[context] -= 1;
+      };
+    }, _this.getContextState = function (context) {
+      var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _this.state;
+      return state.state[context];
+    }, _this.setContextState = function (context) {
+      return function (updater, callback) {
+        var updaterFn = function updaterFn(state) {
+          var _ref;
+
+          return _ref = {}, _ref[context] = _extends({}, state[context], parseUpdater(updater, state[context])), _ref;
+        };
+        _this.handleSetState(updaterFn, callback);
+      };
+    }, _this.handleSetState = function (updater, callback) {
+      var updaterFn = function updaterFn(state) {
         return {
-          state: _extends({}, state.state, fn(state.state))
+          state: _extends({}, state.state, parseUpdater(updater, state.state))
         };
-      }, cb);
+      };
+      _this.setState(updaterFn, callback);
     }, _this.state = {
       state: _this.props.initialState,
       setState: _this.handleSetState,
-      getMounted: _this.getMounted,
       mount: _this.mount,
-      unmount: _this.unmount
+      getContextState: _this.getContextState,
+      setContextState: _this.setContextState
     }, _temp), possibleConstructorReturn(_this, _ret);
@@ -345,2 +427,3 @@ }
 exports.ContextContainer = ContextContainer;
+exports.mount = mount;
 exports.Provider = Provider;

dist/es/constate.js

@@ -76,2 +76,6 @@ import React from 'react';
 
+var parseUpdater = function parseUpdater(updater, state) {
+  return typeof updater === "function" ? updater(state) : updater;
+};
+
 /* eslint-disable react/prop-types */
@@ -94,8 +98,9 @@
     var _this$props = _this.props,
-        state = _this$props.state,
-        context = _this$props.context;
+        setContextState = _this$props.setContextState,
+        context = _this$props.context,
+        initialState = _this$props.initialState;
 
-    if (!state[context]) {
-      _this.handleSetState(_this.getState, undefined, false);
-    }
+    setContextState(context)(function (state) {
+      return _extends({}, initialState, state);
+    });
     return _this;
@@ -105,35 +110,33 @@ }
   ContextContainer.prototype.componentDidMount = function componentDidMount() {
+    var _this2 = this;
+
     var _props = this.props,
+        mount = _props.mount,
         context = _props.context,
-        onMount = _props.onMount,
-        getMounted = _props.getMounted,
-        mount = _props.mount;
+        onMount = _props.onMount;
 
-    if (!getMounted(context) && typeof onMount === "function") {
-      onMount(this.getArgs());
-    }
-    mount(context);
+    this.unmount = mount(context, onMount && function () {
+      return onMount(_this2.getArgs());
+    });
   };
 
   ContextContainer.prototype.componentWillUnmount = function componentWillUnmount() {
-    var _props2 = this.props,
-        getMounted = _props2.getMounted,
-        unmount = _props2.unmount,
-        context = _props2.context,
-        onUnmount = _props2.onUnmount;
+    var _this3 = this;
 
-    if (getMounted(context) === 1 && typeof onUnmount === "function") {
-      onUnmount(this.getArgs());
-    }
-    unmount(context);
+    var onUnmount = this.props.onUnmount;
+
+    this.unmount(onUnmount && function () {
+      return onUnmount(_this3.getArgs());
+    });
   };
 
   ContextContainer.prototype.render = function render() {
-    var _props3 = this.props,
-        children = _props3.children,
-        actions = _props3.actions,
-        selectors = _props3.selectors,
-        effects = _props3.effects;
+    var _props2 = this.props,
+        children = _props2.children,
+        actions = _props2.actions,
+        selectors = _props2.selectors,
+        effects = _props2.effects;
 
-    return children(_extends({}, this.getState(), actions && mapSetStateToActions(this.handleSetState, actions), selectors && mapArgumentToFunctions(this.getState(), selectors), effects && mapArgumentToFunctions(this.getArgs(), effects)));
+    var args = this.getArgs();
+    return children(_extends({}, args.state, actions && mapSetStateToActions(args.setState, actions), selectors && mapArgumentToFunctions(args.state, selectors), effects && mapArgumentToFunctions(args, effects)));
   };
@@ -145,39 +148,31 @@
 var _initialiseProps = function _initialiseProps() {
-  var _this2 = this;
+  var _this4 = this;
 
   this.getArgs = function (additionalArgs) {
+    var _props3 = _this4.props,
+        getContextState = _props3.getContextState,
+        context = _props3.context;
+
     return _extends({
-      state: _this2.getState(),
-      setState: _this2.handleSetState
+      state: getContextState(context),
+      setState: _this4.handleSetState
     }, additionalArgs);
   };
 
-  this.getState = function () {
-    var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this2.props.state[_this2.props.context];
-    return _extends({}, _this2.props.initialState, state);
-  };
-
-  this.handleSetState = function (fn, cb) {
-    var emitUpdate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-    var _props4 = _this2.props,
+  this.handleSetState = function (updater, callback) {
+    var _props4 = _this4.props,
+        setContextState = _props4.setContextState,
         context = _props4.context,
-        onUpdate = _props4.onUpdate,
-        setState = _props4.setState;
+        onUpdate = _props4.onUpdate;
 
-    var prevState = _this2.getState();
+    var setState = setContextState(context);
+    var prevState = void 0;
 
-    var updater = function updater(state) {
-      var _ref;
-
-      return _ref = {}, _ref[context] = _extends({}, _this2.getState(state[context]), fn(_this2.getState(state[context]))), _ref;
-    };
-
-    var callback = function callback() {
-      if (emitUpdate && typeof onUpdate === "function") {
-        onUpdate(_this2.getArgs({ prevState: prevState }));
-      }
-      if (cb) cb();
-    };
-
-    setState(updater, callback);
+    setState(function (state) {
+      prevState = state;
+      return parseUpdater(updater, state);
+    }, function () {
+      if (onUpdate) onUpdate(_this4.getArgs({ prevState: prevState }));
+      if (callback) callback();
+    });
   };
@@ -203,10 +198,13 @@ };
       }, additionalArgs);
-    }, _this.handleSetState = function (fn, cb) {
-      var prevState = _this.state;
+    }, _this.handleSetState = function (updater, callback) {
+      var prevState = void 0;
 
-      _this.setState(fn, function () {
-        if (typeof _this.props.onUpdate === "function") {
+      _this.setState(function (state) {
+        prevState = state;
+        return parseUpdater(updater, state);
+      }, function () {
+        if (_this.props.onUpdate) {
           _this.props.onUpdate(_this.getArgs({ prevState: prevState }));
         }
-        if (cb) cb();
+        if (callback) callback();
       });
@@ -221,3 +219,3 @@ }, _temp), possibleConstructorReturn(_this, _ret);
 
-    if (!context && typeof onMount === "function") {
+    if (!context && onMount) {
       onMount(this.getArgs());
@@ -232,3 +230,3 @@ }
 
-    if (!context && typeof onUnmount === "function") {
+    if (!context && onUnmount) {
       onUnmount(this.getArgs({ setState: function setState() {} }));
@@ -245,4 +243,4 @@ }
         null,
-        function (state) {
-          return React.createElement(ContextContainer, _extends({}, state, _this2.props));
+        function (props) {
+          return React.createElement(ContextContainer, _extends({}, props, _this2.props));
         }
@@ -280,2 +278,68 @@ );
 
+/* eslint-disable no-param-reassign, no-use-before-define, no-unused-expressions */
+
+var getProps = function getProps(Container, props) {
+  var getNextProps = function getNextProps(rendered) {
+    var nextProps = _extends({}, rendered.props, props);
+    return getProps(rendered.type, nextProps);
+  };
+
+  if (React.isValidElement(Container)) {
+    return getNextProps(Container);
+  }
+
+  var container = new Container({ children: function children() {
+      return null;
+    } });
+  var rendered = container.render ? container.render() : container;
+
+  if (!React.isValidElement(rendered)) {
+    return props;
+  }
+
+  return getNextProps(rendered);
+};
+
+var mapToDraft = function mapToDraft(object, draft) {
+  return Object.keys(object).forEach(function (key) {
+    draft[key] = object[key];
+  });
+};
+
+var mount = function mount(Container) {
+  var _getProps = getProps(Container),
+      initialState = _getProps.initialState,
+      actions = _getProps.actions,
+      selectors = _getProps.selectors,
+      effects = _getProps.effects,
+      onMount = _getProps.onMount,
+      onUpdate = _getProps.onUpdate;
+
+  var state = _extends({}, initialState);
+
+  var setState = function setState(updater, callback) {
+    var prevState = _extends({}, state);
+    mapToDraft(parseUpdater(updater, state), state);
+    if (onUpdate) {
+      onUpdate(getArgs({ prevState: prevState }));
+    }
+    if (callback) callback();
+  };
+
+  var getArgs = function getArgs(additionalArgs) {
+    return _extends({
+      state: state,
+      setState: setState
+    }, additionalArgs);
+  };
+
+  typeof onMount === "function" && onMount(getArgs());
+
+  actions && mapToDraft(mapSetStateToActions(setState, actions), state);
+  selectors && mapToDraft(mapArgumentToFunctions(state, selectors), state);
+  effects && mapToDraft(mapArgumentToFunctions(getArgs(), effects), state);
+
+  return state;
+};
+
 /* eslint-disable react/sort-comp, react/no-unused-state */
@@ -295,20 +359,38 @@
 
-    return _ret = (_temp = (_this = possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.mounted = {}, _this.getMounted = function (context) {
-      return _this.mounted[context] || 0;
-    }, _this.mount = function (context) {
-      _this.mounted[context] = _this.getMounted(context) + 1;
-    }, _this.unmount = function (context) {
-      _this.mounted[context] = _this.getMounted(context) - 1;
-    }, _this.handleSetState = function (fn, cb) {
-      _this.setState(function (state) {
+    return _ret = (_temp = (_this = possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.containers = {}, _this.mount = function (context, onMount) {
+      if (!_this.containers[context]) {
+        _this.containers[context] = 0;
+        if (onMount) _this.setState(null, onMount);
+      }
+      _this.containers[context] += 1;
+
+      return function (onUnmount) {
+        if (_this.containers[context] === 1 && onUnmount) onUnmount();
+        _this.containers[context] -= 1;
+      };
+    }, _this.getContextState = function (context) {
+      var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _this.state;
+      return state.state[context];
+    }, _this.setContextState = function (context) {
+      return function (updater, callback) {
+        var updaterFn = function updaterFn(state) {
+          var _ref;
+
+          return _ref = {}, _ref[context] = _extends({}, state[context], parseUpdater(updater, state[context])), _ref;
+        };
+        _this.handleSetState(updaterFn, callback);
+      };
+    }, _this.handleSetState = function (updater, callback) {
+      var updaterFn = function updaterFn(state) {
         return {
-          state: _extends({}, state.state, fn(state.state))
+          state: _extends({}, state.state, parseUpdater(updater, state.state))
         };
-      }, cb);
+      };
+      _this.setState(updaterFn, callback);
     }, _this.state = {
       state: _this.props.initialState,
       setState: _this.handleSetState,
-      getMounted: _this.getMounted,
       mount: _this.mount,
-      unmount: _this.unmount
+      getContextState: _this.getContextState,
+      setContextState: _this.setContextState
     }, _temp), possibleConstructorReturn(_this, _ret);
@@ -336,2 +418,2 @@ }
 
-export { Consumer, Container, ContextContainer, Provider };
+export { Consumer, Container, ContextContainer, mount, Provider };

dist/umd/constate.min.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["exports","react","prop-types"],e):e(t.constate={},t.React,t.PropTypes)}(this,function(t,e,n){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e,n=n&&n.hasOwnProperty("default")?n.default:n;var o=e.createContext({}),r=o.Consumer,i=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o])}return 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)},s=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(t,e){return Object.keys(t).reduce(function(n,o){var r;return a({},n,((r={})[o]=e(t[o]),r))},{})},p=function(t,e){return c(e,function(e){return function(){return t(e.apply(void 0,arguments))}})},f=function(t,e){return c(e,function(e){return function(){return e.apply(void 0,arguments)(t)}})},l=function(t){function e(){i(this,e);for(var n=arguments.length,o=Array(n),r=0;r<n;r++)o[r]=arguments[r];var a=s(this,t.call.apply(t,[this].concat(o)));h.call(a);var u=a.props;return u.state[u.context]||a.handleSetState(a.getState,void 0,!1),a}return u(e,t),e.prototype.componentDidMount=function(){var t=this.props,e=t.context,n=t.onMount,o=t.getMounted,r=t.mount;o(e)||"function"!=typeof n||n(this.getArgs()),r(e)},e.prototype.componentWillUnmount=function(){var t=this.props,e=t.getMounted,n=t.unmount,o=t.context,r=t.onUnmount;1===e(o)&&"function"==typeof r&&r(this.getArgs()),n(o)},e.prototype.render=function(){var t=this.props,e=t.children,n=t.actions,o=t.selectors,r=t.effects;return e(a({},this.getState(),n&&p(this.handleSetState,n),o&&f(this.getState(),o),r&&f(this.getArgs(),r)))},e}(e.Component),h=function(){var t=this;this.getArgs=function(e){return a({state:t.getState(),setState:t.handleSetState},e)},this.getState=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:t.props.state[t.props.context];return a({},t.props.initialState,e)},this.handleSetState=function(e,n){var o=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],r=t.props,i=r.context,u=r.onUpdate,s=r.setState,c=t.getState();s(function(n){var o;return(o={})[i]=a({},t.getState(n[i]),e(t.getState(n[i]))),o},function(){o&&"function"==typeof u&&u(t.getArgs({prevState:c})),n&&n()})}},d=function(t){function n(){var e,o;i(this,n);for(var r=arguments.length,u=Array(r),c=0;c<r;c++)u[c]=arguments[c];return e=o=s(this,t.call.apply(t,[this].concat(u))),o.state=o.props.initialState,o.getArgs=function(t){return a({state:o.state,setState:o.handleSetState},t)},o.handleSetState=function(t,e){var n=o.state;o.setState(t,function(){"function"==typeof o.props.onUpdate&&o.props.onUpdate(o.getArgs({prevState:n})),e&&e()})},s(o,e)}return u(n,t),n.prototype.componentDidMount=function(){var t=this.props,e=t.context,n=t.onMount;e||"function"!=typeof n||n(this.getArgs())},n.prototype.componentWillUnmount=function(){var t=this.props,e=t.context,n=t.onUnmount;e||"function"!=typeof n||n(this.getArgs({setState:function(){}}))},n.prototype.render=function(){var t=this;if(this.props.context)return e.createElement(r,null,function(n){return e.createElement(l,a({},n,t.props))});var n=this.props,o=n.children,i=n.actions,u=n.selectors,s=n.effects;return o(a({},this.state,i&&p(this.handleSetState,i),u&&f(this.state,u),s&&f(this.getArgs(),s)))},n}(e.Component);d.propTypes={children:n.func.isRequired,initialState:n.object,actions:n.objectOf(n.func),selectors:n.objectOf(n.func),effects:n.objectOf(n.func),context:n.string,onMount:n.func,onUpdate:n.func,onUnmount:n.func},d.defaultProps={initialState:{}};var y=function(t){function n(){var e,o;i(this,n);for(var r=arguments.length,u=Array(r),c=0;c<r;c++)u[c]=arguments[c];return e=o=s(this,t.call.apply(t,[this].concat(u))),o.mounted={},o.getMounted=function(t){return o.mounted[t]||0},o.mount=function(t){o.mounted[t]=o.getMounted(t)+1},o.unmount=function(t){o.mounted[t]=o.getMounted(t)-1},o.handleSetState=function(t,e){o.setState(function(e){return{state:a({},e.state,t(e.state))}},e)},o.state={state:o.props.initialState,setState:o.handleSetState,getMounted:o.getMounted,mount:o.mount,unmount:o.unmount},s(o,e)}return u(n,t),n.prototype.render=function(){return e.createElement(o.Provider,{value:this.state},this.props.children)},n}(e.Component);y.propTypes={children:n.node,initialState:n.object},y.defaultProps={initialState:{}},t.Consumer=r,t.Container=d,t.ContextContainer=l,t.Provider=y,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["exports","react","prop-types"],e):e(t.constate={},t.React,t.PropTypes)}(this,function(t,e,n){"use strict";e=e&&e.hasOwnProperty("default")?e.default:e,n=n&&n.hasOwnProperty("default")?n.default:n;var r=e.createContext({}),o=r.Consumer,i=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},a=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return 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)},s=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(t,e){return Object.keys(t).reduce(function(n,r){var o;return a({},n,((o={})[r]=e(t[r]),o))},{})},p=function(t,e){return c(e,function(e){return function(){return t(e.apply(void 0,arguments))}})},f=function(t,e){return c(e,function(e){return function(){return e.apply(void 0,arguments)(t)}})},l=function(t,e){return"function"==typeof t?t(e):t},h=function(t){function e(){i(this,e);for(var n=arguments.length,r=Array(n),o=0;o<n;o++)r[o]=arguments[o];var u=s(this,t.call.apply(t,[this].concat(r)));d.call(u);var c=u.props,p=c.setContextState,f=c.context,l=c.initialState;return p(f)(function(t){return a({},l,t)}),u}return u(e,t),e.prototype.componentDidMount=function(){var t=this,e=this.props,n=e.mount,r=e.context,o=e.onMount;this.unmount=n(r,o&&function(){return o(t.getArgs())})},e.prototype.componentWillUnmount=function(){var t=this,e=this.props.onUnmount;this.unmount(e&&function(){return e(t.getArgs())})},e.prototype.render=function(){var t=this.props,e=t.children,n=t.actions,r=t.selectors,o=t.effects,i=this.getArgs();return e(a({},i.state,n&&p(i.setState,n),r&&f(i.state,r),o&&f(i,o)))},e}(e.Component),d=function(){var t=this;this.getArgs=function(e){var n=t.props,r=n.getContextState,o=n.context;return a({state:r(o),setState:t.handleSetState},e)},this.handleSetState=function(e,n){var r=t.props,o=r.setContextState,i=r.context,a=r.onUpdate,u=void 0;o(i)(function(t){return u=t,l(e,t)},function(){a&&a(t.getArgs({prevState:u})),n&&n()})}},S=function(t){function n(){var e,r;i(this,n);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return e=r=s(this,t.call.apply(t,[this].concat(u))),r.state=r.props.initialState,r.getArgs=function(t){return a({state:r.state,setState:r.handleSetState},t)},r.handleSetState=function(t,e){var n=void 0;r.setState(function(e){return n=e,l(t,e)},function(){r.props.onUpdate&&r.props.onUpdate(r.getArgs({prevState:n})),e&&e()})},s(r,e)}return u(n,t),n.prototype.componentDidMount=function(){var t=this.props,e=t.context,n=t.onMount;!e&&n&&n(this.getArgs())},n.prototype.componentWillUnmount=function(){var t=this.props,e=t.context,n=t.onUnmount;!e&&n&&n(this.getArgs({setState:function(){}}))},n.prototype.render=function(){var t=this;if(this.props.context)return e.createElement(o,null,function(n){return e.createElement(h,a({},n,t.props))});var n=this.props,r=n.children,i=n.actions,u=n.selectors,s=n.effects;return r(a({},this.state,i&&p(this.handleSetState,i),u&&f(this.state,u),s&&f(this.getArgs(),s)))},n}(e.Component);S.propTypes={children:n.func.isRequired,initialState:n.object,actions:n.objectOf(n.func),selectors:n.objectOf(n.func),effects:n.objectOf(n.func),context:n.string,onMount:n.func,onUpdate:n.func,onUnmount:n.func},S.defaultProps={initialState:{}};var v=function(t,e){return Object.keys(t).forEach(function(n){e[n]=t[n]})},y=function(t){function n(){var e,r;i(this,n);for(var o=arguments.length,u=Array(o),c=0;c<o;c++)u[c]=arguments[c];return e=r=s(this,t.call.apply(t,[this].concat(u))),r.containers={},r.mount=function(t,e){return r.containers[t]||(r.containers[t]=0,e&&r.setState(null,e)),r.containers[t]+=1,function(e){1===r.containers[t]&&e&&e(),r.containers[t]-=1}},r.getContextState=function(t){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:r.state).state[t]},r.setContextState=function(t){return function(e,n){r.handleSetState(function(n){var r;return(r={})[t]=a({},n[t],l(e,n[t])),r},n)}},r.handleSetState=function(t,e){r.setState(function(e){return{state:a({},e.state,l(t,e.state))}},e)},r.state={state:r.props.initialState,setState:r.handleSetState,mount:r.mount,getContextState:r.getContextState,setContextState:r.setContextState},s(r,e)}return u(n,t),n.prototype.render=function(){return e.createElement(r.Provider,{value:this.state},this.props.children)},n}(e.Component);y.propTypes={children:n.node,initialState:n.object},y.defaultProps={initialState:{}},t.Consumer=o,t.Container=S,t.ContextContainer=h,t.mount=function(t){var n=function t(n,r){var o=function(e){var n=a({},e.props,r);return t(e.type,n)};if(e.isValidElement(n))return o(n);var i=new n({children:function(){return null}}),u=i.render?i.render():i;return e.isValidElement(u)?o(u):r}(t),r=n.initialState,o=n.actions,i=n.selectors,u=n.effects,s=n.onMount,c=n.onUpdate,h=a({},r),d=function(t,e){var n=a({},h);v(l(t,h),h),c&&c(S({prevState:n})),e&&e()},S=function(t){return a({state:h,setState:d},t)};return"function"==typeof s&&s(S()),o&&v(p(d,o),h),i&&v(f(h,i),h),u&&v(f(S(),u),h),h},t.Provider=y,Object.defineProperty(t,"__esModule",{value:!0})});

package.json

 {
   "name": "constate",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Yet another React state management library that lets you work with local state and scale up to global state with ease",
@@ -5,0 +5,0 @@ "license": "MIT",

README.md

@@ -59,2 +59,3 @@ <p align="center">
   - [`initialState`](#initialstate-1)
+- [`mount`](#mount)
 - [Composing](#composing)
@@ -256,2 +257,4 @@ - [Testing](#testing)
 
+<p align="center"><img src="https://user-images.githubusercontent.com/3068563/40272346-be92ffb8-5b79-11e8-906f-a653e284002e.gif" alt="Example"></p>
+
 ### `onUpdate`
@@ -289,2 +292,4 @@
 
+<p align="center"><img src="https://user-images.githubusercontent.com/3068563/40272385-512d74de-5b7a-11e8-85da-974e53c7887f.gif" alt="Example"></p>
+
 ### `onUnmount`
@@ -314,3 +319,3 @@
 const Counter = () => (
-  <Container initialState={initialState} onMount={onMount} onUnmount={onUnmout}>
+  <Container initialState={initialState} onMount={onMount} onUnmount={onUnmount}>
     {({ count }) => <button>{count}</button>}
@@ -321,2 +326,4 @@ </Container>
 
+<p align="center"><img src="https://user-images.githubusercontent.com/3068563/40272496-083be31c-5b7c-11e8-9e0e-5fa623495ed4.gif" alt="Example"></p>
+
 ## `Provider`
@@ -346,2 +353,30 @@
 
+## `mount`
+
+```js
+type Mount = (Container: Function | ReactElement) => Object;
+```
+
+> Note: this is an experimental feature
+
+With `mount`, you can have a stateful object representing the `Container`:
+
+```jsx
+import { Container, mount } from "constate";
+
+const CounterContainer = props => (
+  <Container
+    initialState={{ count: 0 }}
+    actions={{ increment: () => state => ({ count: state.count + 1 }) }}
+    {...props}
+  />
+);
+
+const state = mount(CounterContainer);
+
+console.log(state.count); // 0
+state.increment();
+console.log(state.count); // 1
+```
+
 ## Composing
@@ -389,42 +424,53 @@
 
-[`actions`](#actions) and [`selectors`](#selectors) are pure functions. Testing is pretty straightfoward:
-
+[`actions`](#actions) and [`selectors`](#selectors) are pure functions and you can test them directly:
 ```js
-import { initialState, actions, selectors } from "./CounterContainer";
+test("increment", () => {
+  expect(increment(1)({ count: 0 })).toEqual({ count: 1 });
+  expect(increment(-1)({ count: 1 })).toEqual({ count: 0 });
+});
 
+test("getParity", () => {
+  expect(getParity()({ count: 0 })).toBe("even");
+  expect(getParity()({ count: 1 })).toBe("odd");
+});
+```
+
+On the other hand, [`effects`](#effects) and lifecycle methods can be a little tricky to test depending on how you implement them.
+
+You can also use [`mount`](#mount) to create integration tests. This is how we can test our `CounterContainer` with its [`tick effect`](#effects):
+
+```jsx
+import { mount } from "constate";
+import CounterContainer from "./CounterContainer";
+
 test("initialState", () => {
-  expect(initialState).toEqual({ count: 0 });
+  const state = mount(CounterContainer);
+  expect(state.count).toBe(0);
 });
 
-test("actions", () => {
-  expect(actions.increment(1)({ count: 0 })).toEqual({ count: 1 });
-  expect(actions.increment(-1)({ count: 1 })).toEqual({ count: 0 });
+test("increment", () => {
+  const state = mount(CounterContainer);
+  expect(state.count).toBe(0);
+  state.increment(1);
+  expect(state.count).toBe(1);
+  state.increment(-1);
+  expect(state.count).toBe(0);
 });
 
-test("selectors", () => {
-  expect(selectors.getParity()({ count: 0 })).toBe("even");
-  expect(selectors.getParity()({ count: 1 })).toBe("odd");
+test("getParity", () => {
+  const state = mount(<CounterContainer initialState={{ count: 1 }} />);
+  expect(state.getParity()).toBe("odd");
 });
-```
 
-Testing [`effects`](#effects) and lifecycle methods can be a little tricky depending on how you implement them. This is how we can test our `tick` effect with [Jest](https://facebook.github.io/jest):
-
-```jsx
-import { effects } from "./CounterContainer";
-
 test("tick", () => {
   jest.useFakeTimers();
+  const state = mount(CounterContainer);
+  
+  state.tick();
 
-  let state = { count: 0 };
-  const setState = fn => {
-    state = fn(state);
-  };
-
-  effects.tick()({ state, setState });
-
   jest.advanceTimersByTime(1000);
-  expect(state).toEqual({ count: 1 });
+  expect(state.count).toBe(1);
 
   jest.advanceTimersByTime(1000);
-  expect(state).toEqual({ count: 2 });
+  expect(state.count).toBe(2);
 });
@@ -431,0 +477,0 @@ ```

No alert changes

Improved metrics

Total package byte prevSize

48919

increased by15.88%

Lines of code

683

increased by24.64%

Number of lines in readme file

487

increased by10.43%

No dependency changes