effector-react - npm Package Compare versions

Comparing version 0.18.9 to 0.18.10

effector-react.cjs.js

@@ -1,2 +0,2 @@
-function e(e){var t,r;return r=t=class extends s.Component{constructor(...t){super(...t),this.state={currentState:e.getState()},this._unsubscribe=null,this._hasUnmounted=0}componentDidMount(){this.subscribe()}componentWillUnmount(){this.unsubscribe(),this._hasUnmounted=1}render(){return this.props.children(this.state.currentState)}subscribe(){const t=e.subscribe(e=>{this._hasUnmounted||this.setState(t=>e===t.currentState?null:{currentState:e})});this._unsubscribe=t}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},t.displayName=e.shortName+".Consumer",r}function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var s in r)({}).hasOwnProperty.call(r,s)&&(e[s]=r[s])}return e}).apply(this,arguments)}function r(r,n){const o=e(r),c=e=>s.createElement(o,null,r=>s.createElement(n,t({},e,r)));return c.displayName="Connect("+(n.displayName||n.name||'Unknown')+")",c}Object.defineProperty(exports,'__esModule',{value:1});var s=require('react'),effector=require('effector');const n=(e,t)=>t,{store:o}=effector.createDomain('Gate');exports.connect=(e=>t=>r(t,e)),exports.createComponent=function(t,r){let n;effector.is.store(t)?n=t:(effector.invariant('object'==typeof t&&null!==t,'shape should be store or object with stores'),n=effector.createStoreObject(t));const o=e(n);return class extends s.Component{constructor(...e){super(...e),this.renderProp=(e=>r(this.props,e))}render(){return s.createElement(o,null,this.renderProp)}}},exports.createContextComponent=function(t,r,n){var o,c;const u=e(t);return c=o=class extends s.Component{constructor(...e){super(...e),this.renderProp=(e=>n(this.props,e,this.context))}render(){return s.createElement(u,null,this.renderProp)}},o.contextType=r,c},exports.createGate=function e(t="gate",r={}){const n=o(0),c=o(r),{set:u}=effector.createApi(c,{set:(e,t)=>t}),{open:a,close:i,destructor:p}=effector.createApi(n,{open:()=>l.predicate()&&1,close:()=>0,destructor:()=>0});class l extends s.PureComponent{static childGate(r="Subgate"){const s=e(t+"/"+r);s.predicate=(()=>l.status.getState());let n=0,o=0;return s.open.watch(()=>{o||(n=1)}),s.close.watch(()=>{o||(n=0)}),l.status.watch(e=>{o=1,n&&e&&!s.status.getState()&&s.open(),o=0}),l.close.watch(()=>{o=1,s.close(),o=0}),l.destructor.watch(()=>s.destructor()),s}componentDidMount(){l.open()}componentWillUnmount(){l.close()}render(){return l.set(this.props),null}}l.predicate=(()=>1),l.displayName="Gate:"+t,l.isOpen=0,l.current=c.getState(),l.open=a,l.close=i,l.status=n,l.state=c,l.set=u,l.destructor=p,l.isTerminated=0;const h=n.watch(e=>l.isOpen=e),d=c.watch(e=>l.current=e);n.map(e=>{e||(l.current=r)}),c.reset(i);const m=p.watch(()=>{l.isTerminated=1}),b=p.watch(()=>{b(),h(),d(),m(),l.status.off(l.open),l.status.off(l.close),l.status.off(l.destructor),l.state.off(l.set)});return l},exports.createReactState=r,exports.createStoreConsumer=e,exports.unstable_createStoreProvider=function(e){var t,r;return r=t=class extends s.Component{constructor(...e){super(...e),this.state={currentValue:null}}static getDerivedStateFromProps(t){return e.setState(t.value),{currentValue:t.value}}render(){return this.props.children}},t.displayName=e.shortName+".Provider",t.defaultProps={children:null},r},exports.useGate=((e,t={})=>{s.useEffect(()=>(e.open(),()=>e.close()),[e]),e.set(t)}),exports.useStore=(e=>{effector.invariant(effector.is.store(e),'useStore: The argument must be Store, but you passed %s',e);const t=s.useReducer(n,void 0,e.getState)[1];return s.useLayoutEffect(()=>e.watch(t),[e]),e.getState()});
+function t(t,e){var s,r,o,u;let c,a;if(effector.isStore(t))a=t;else if('function'==typeof t)c=t;else{effector.invariant('object'==typeof t&&null!==t,'shape should be store or object with stores');const e=effector.createStoreObject(t);a=e}const i=null!==(s=null===(r=a)||void 0===r?void 0:r.shortName)&&void 0!==s?s:'Unknown',p=effector.createEvent(i+".View mounted"),l=effector.createEvent(i+".View unmounted");return u=o=class extends n.Component{constructor(...e){super(...e),this._unsubscribe=null,this._hasUnmounted=0,this.store='function'==typeof t?c(this.props):a,this.state={currentState:this.store.getState()}}componentDidMount(){p({props:this.props,state:this.store.getState()}),this.subscribe()}componentWillUnmount(){l({props:this.props,state:this.store.getState()}),this.unsubscribe(),this._hasUnmounted=1}render(){return e(this.props,this.state.currentState)}subscribe(){this._unsubscribe=this.store.watch(t=>{this._hasUnmounted||this.setState(e=>t===e.currentState?null:{currentState:t})})}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},o.displayName=i+".View",o.mounted=p,o.unmounted=l,u}function e(e){return t(e,({children:t},e)=>t(e))}function s(){return(s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var s=arguments[e];for(var r in s)({}).hasOwnProperty.call(s,r)&&(t[r]=s[r])}return t}).apply(this,arguments)}function r(t,r){const o=e(t),u=t=>n.createElement(o,null,e=>n.createElement(r,s({},t,e)));return u.displayName="Connect("+(r.displayName||r.name||'Unknown')+")",u}Object.defineProperty(exports,'__esModule',{value:1});var n=require('react'),effector=require('effector');const o=(t,e)=>e,u='undefined'!=typeof window?n.useLayoutEffect:n.useEffect,{store:c}=effector.createDomain('Gate');exports.connect=(t=>e=>r(e,t)),exports.createComponent=t,exports.createContextComponent=function(t,s,r){var o,u;const c=e(t);return u=o=class extends n.Component{constructor(...t){super(...t),this.renderProp=(t=>r(this.props,t,this.context))}render(){return n.createElement(c,null,this.renderProp)}},o.contextType=s,u},exports.createGate=function t(e="gate",s={}){const r=c(0),o=c(s),{set:u}=effector.createApi(o,{set:(t,e)=>e}),{open:a,close:i,destructor:p}=effector.createApi(r,{open:()=>l.predicate()&&1,close:()=>0,destructor:()=>0});class l extends n.PureComponent{static childGate(s="Subgate"){const r=t(e+"/"+s);r.predicate=(()=>l.status.getState());let n=0,o=0;return r.open.watch(()=>{o||(n=1)}),r.close.watch(()=>{o||(n=0)}),l.status.watch(t=>{o=1,n&&t&&!r.status.getState()&&r.open(),o=0}),l.close.watch(()=>{o=1,r.close(),o=0}),l.destructor.watch(()=>r.destructor()),r}componentDidMount(){l.open()}componentWillUnmount(){l.close()}render(){return l.set(this.props),null}}l.predicate=(()=>1),l.displayName="Gate:"+e,l.isOpen=0,l.current=o.getState(),l.open=a,l.close=i,l.status=r,l.state=o,l.set=u,l.destructor=p,l.isTerminated=0;const h=r.watch(t=>l.isOpen=t),d=o.watch(t=>l.current=t);r.map(t=>{t||(l.current=s)}),o.reset(i);const f=p.watch(()=>{l.isTerminated=1}),m=p.watch(()=>{m(),h(),d(),f(),l.status.off(l.open),l.status.off(l.close),l.status.off(l.destructor),l.state.off(l.set)});return l},exports.createReactState=r,exports.createStoreConsumer=e,exports.unstable_createStoreProvider=function(t){var e,s;return s=e=class extends n.Component{constructor(...t){super(...t),this.state={currentValue:null}}static getDerivedStateFromProps(e){return t.setState(e.value),{currentValue:e.value}}render(){return this.props.children}},e.displayName=t.shortName+".Provider",e.defaultProps={children:null},s},exports.useGate=((t,e={})=>{n.useEffect(()=>(t.open(),()=>t.close()),[t]),t.set(e)}),exports.useStore=(t=>{effector.invariant(effector.is.store(t),'useStore: The argument must be Store, but you passed %s',t);const e=n.useReducer(o,void 0,t.getState)[1];return u(()=>t.watch(e),[t]),t.getState()});
 //# sourceMappingURL=effector-react.cjs.js.map

effector-react.es.js

@@ -1,2 +0,2 @@
-function t(t){var e,s;return s=e=class extends l{constructor(...e){super(...e),this.state={currentState:t.getState()},this._unsubscribe=null,this._hasUnmounted=0}componentDidMount(){this.subscribe()}componentWillUnmount(){this.unsubscribe(),this._hasUnmounted=1}render(){return this.props.children(this.state.currentState)}subscribe(){const e=t.subscribe(t=>{this._hasUnmounted||this.setState(e=>t===e.currentState?null:{currentState:t})});this._unsubscribe=e}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},e.displayName=t.shortName+".Consumer",s}function e(t){var e,s;return s=e=class extends l{constructor(...t){super(...t),this.state={currentValue:null}}static getDerivedStateFromProps(e){return t.setState(e.value),{currentValue:e.value}}render(){return this.props.children}},e.displayName=t.shortName+".Provider",e.defaultProps={children:null},s}function s(e,s,r){var n,o;const u=t(e);return o=n=class extends l{constructor(...t){super(...t),this.renderProp=(t=>r(this.props,t,this.context))}render(){return p(u,null,this.renderProp)}},n.contextType=s,o}function r(e,s){let r;b.store(e)?r=e:(S('object'==typeof e&&null!==e,'shape should be store or object with stores'),r=w(e));const n=t(r);return class extends l{constructor(...t){super(...t),this.renderProp=(t=>s(this.props,t))}render(){return p(n,null,this.renderProp)}}}function n(t){S(b.store(t),'useStore: The argument must be Store, but you passed %s',t);const e=h(y,void 0,t.getState)[1];return d(()=>t.watch(e),[t]),t.getState()}function o(){return(o=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var s=arguments[e];for(var r in s)({}).hasOwnProperty.call(s,r)&&(t[r]=s[r])}return t}).apply(this,arguments)}function u(e,s){const r=t(e),n=t=>p(r,null,e=>p(s,o({},t,e)));return n.displayName="Connect("+(s.displayName||s.name||'Unknown')+")",n}function c(t){return e=>u(e,t)}function a(t,e={}){f(()=>(t.open(),()=>t.close()),[t]),t.set(e)}function i(t="gate",e={}){const s=x(0),r=x(e),{set:n}=v(r,{set:(t,e)=>e}),{open:o,close:u,destructor:c}=v(s,{open:()=>a.predicate()&&1,close:()=>0,destructor:()=>0});class a extends m{static childGate(e="Subgate"){const s=i(t+"/"+e);s.predicate=(()=>a.status.getState());let r=0,n=0;return s.open.watch(()=>{n||(r=1)}),s.close.watch(()=>{n||(r=0)}),a.status.watch(t=>{n=1,r&&t&&!s.status.getState()&&s.open(),n=0}),a.close.watch(()=>{n=1,s.close(),n=0}),a.destructor.watch(()=>s.destructor()),s}componentDidMount(){a.open()}componentWillUnmount(){a.close()}render(){return a.set(this.props),null}}a.predicate=(()=>1),a.displayName="Gate:"+t,a.isOpen=0,a.current=r.getState(),a.open=o,a.close=u,a.status=s,a.state=r,a.set=n,a.destructor=c,a.isTerminated=0;const l=s.watch(t=>a.isOpen=t),p=r.watch(t=>a.current=t);s.map(t=>{t||(a.current=e)}),r.reset(u);const h=c.watch(()=>{a.isTerminated=1}),d=c.watch(()=>{d(),l(),p(),h(),a.status.off(a.open),a.status.off(a.close),a.status.off(a.destructor),a.state.off(a.set)});return a}import{Component as l,createElement as p,useReducer as h,useLayoutEffect as d,useEffect as f,PureComponent as m}from'react';import{is as b,invariant as S,createStoreObject as w,createDomain as g,createApi as v}from'effector';const y=(t,e)=>e,{store:x}=g('Gate');export{c as connect,r as createComponent,s as createContextComponent,i as createGate,u as createReactState,t as createStoreConsumer,e as unstable_createStoreProvider,a as useGate,n as useStore};
+function t(t,e){var s,n,r,o;let u,c;if(b(t))c=t;else if('function'==typeof t)u=t;else{w('object'==typeof t&&null!==t,'shape should be store or object with stores');const e=S(t);c=e}const i=null!==(s=null===(n=c)||void 0===n?void 0:n.shortName)&&void 0!==s?s:'Unknown',a=g(i+".View mounted"),p=g(i+".View unmounted");return o=r=class extends l{constructor(...e){super(...e),this._unsubscribe=null,this._hasUnmounted=0,this.store='function'==typeof t?u(this.props):c,this.state={currentState:this.store.getState()}}componentDidMount(){a({props:this.props,state:this.store.getState()}),this.subscribe()}componentWillUnmount(){p({props:this.props,state:this.store.getState()}),this.unsubscribe(),this._hasUnmounted=1}render(){return e(this.props,this.state.currentState)}subscribe(){this._unsubscribe=this.store.watch(t=>{this._hasUnmounted||this.setState(e=>t===e.currentState?null:{currentState:t})})}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},r.displayName=i+".View",r.mounted=a,r.unmounted=p,o}function e(e){return t(e,({children:t},e)=>t(e))}function s(t){var e,s;return s=e=class extends l{constructor(...t){super(...t),this.state={currentValue:null}}static getDerivedStateFromProps(e){return t.setState(e.value),{currentValue:e.value}}render(){return this.props.children}},e.displayName=t.shortName+".Provider",e.defaultProps={children:null},s}function n(t,s,n){var r,o;const u=e(t);return o=r=class extends l{constructor(...t){super(...t),this.renderProp=(t=>n(this.props,t,this.context))}render(){return p(u,null,this.renderProp)}},r.contextType=s,o}function r(t){w(v.store(t),'useStore: The argument must be Store, but you passed %s',t);const e=h(x,void 0,t.getState)[1];return N(()=>t.watch(e),[t]),t.getState()}function o(){return(o=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var s=arguments[e];for(var n in s)({}).hasOwnProperty.call(s,n)&&(t[n]=s[n])}return t}).apply(this,arguments)}function u(t,s){const n=e(t),r=t=>p(n,null,e=>p(s,o({},t,e)));return r.displayName="Connect("+(s.displayName||s.name||'Unknown')+")",r}function c(t){return e=>u(e,t)}function i(t,e={}){f(()=>(t.open(),()=>t.close()),[t]),t.set(e)}function a(t="gate",e={}){const s=U(0),n=U(e),{set:r}=_(n,{set:(t,e)=>e}),{open:o,close:u,destructor:c}=_(s,{open:()=>i.predicate()&&1,close:()=>0,destructor:()=>0});class i extends m{static childGate(e="Subgate"){const s=a(t+"/"+e);s.predicate=(()=>i.status.getState());let n=0,r=0;return s.open.watch(()=>{r||(n=1)}),s.close.watch(()=>{r||(n=0)}),i.status.watch(t=>{r=1,n&&t&&!s.status.getState()&&s.open(),r=0}),i.close.watch(()=>{r=1,s.close(),r=0}),i.destructor.watch(()=>s.destructor()),s}componentDidMount(){i.open()}componentWillUnmount(){i.close()}render(){return i.set(this.props),null}}i.predicate=(()=>1),i.displayName="Gate:"+t,i.isOpen=0,i.current=n.getState(),i.open=o,i.close=u,i.status=s,i.state=n,i.set=r,i.destructor=c,i.isTerminated=0;const l=s.watch(t=>i.isOpen=t),p=n.watch(t=>i.current=t);s.map(t=>{t||(i.current=e)}),n.reset(u);const h=c.watch(()=>{i.isTerminated=1}),d=c.watch(()=>{d(),l(),p(),h(),i.status.off(i.open),i.status.off(i.close),i.status.off(i.destructor),i.state.off(i.set)});return i}import{Component as l,createElement as p,useReducer as h,useLayoutEffect as d,useEffect as f,PureComponent as m}from'react';import{isStore as b,invariant as w,createStoreObject as S,createEvent as g,is as v,createDomain as y,createApi as _}from'effector';const x=(t,e)=>e,N='undefined'!=typeof window?d:f,{store:U}=y('Gate');export{c as connect,t as createComponent,n as createContextComponent,a as createGate,u as createReactState,e as createStoreConsumer,s as unstable_createStoreProvider,i as useGate,r as useStore};
 //# sourceMappingURL=effector-react.es.js.map

effector-react.umd.js

@@ -1,2 +0,2 @@
-return e=this,t=function(e,t,effector){function r(e){var r,n;return n=r=class extends t.Component{constructor(...t){super(...t),this.state={currentState:e.getState()},this._unsubscribe=null,this._hasUnmounted=0}componentDidMount(){this.subscribe()}componentWillUnmount(){this.unsubscribe(),this._hasUnmounted=1}render(){return this.props.children(this.state.currentState)}subscribe(){const t=e.subscribe(e=>{this._hasUnmounted||this.setState(t=>e===t.currentState?null:{currentState:e})});this._unsubscribe=t}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},r.displayName=e.shortName+".Consumer",n}function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)({}).hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function s(e,s){const o=r(e),c=e=>t.createElement(o,null,r=>t.createElement(s,n({},e,r)));return c.displayName="Connect("+(s.displayName||s.name||'Unknown')+")",c}const o=(e,t)=>t,{store:c}=effector.createDomain('Gate');e.connect=(e=>t=>s(t,e)),e.createComponent=function(e,n){let s;effector.is.store(e)?s=e:(effector.invariant('object'==typeof e&&null!==e,'shape should be store or object with stores'),s=effector.createStoreObject(e));const o=r(s);return class extends t.Component{constructor(...e){super(...e),this.renderProp=(e=>n(this.props,e))}render(){return t.createElement(o,null,this.renderProp)}}},e.createContextComponent=function(e,n,s){var o,c;const u=r(e);return c=o=class extends t.Component{constructor(...e){super(...e),this.renderProp=(e=>s(this.props,e,this.context))}render(){return t.createElement(u,null,this.renderProp)}},o.contextType=n,c},e.createGate=function e(r="gate",n={}){const s=c(0),o=c(n),{set:u}=effector.createApi(o,{set:(e,t)=>t}),{open:a,close:i,destructor:l}=effector.createApi(s,{open:()=>p.predicate()&&1,close:()=>0,destructor:()=>0});class p extends t.PureComponent{static childGate(t="Subgate"){const n=e(r+"/"+t);n.predicate=(()=>p.status.getState());let s=0,o=0;return n.open.watch(()=>{o||(s=1)}),n.close.watch(()=>{o||(s=0)}),p.status.watch(e=>{o=1,s&&e&&!n.status.getState()&&n.open(),o=0}),p.close.watch(()=>{o=1,n.close(),o=0}),p.destructor.watch(()=>n.destructor()),n}componentDidMount(){p.open()}componentWillUnmount(){p.close()}render(){return p.set(this.props),null}}p.predicate=(()=>1),p.displayName="Gate:"+r,p.isOpen=0,p.current=o.getState(),p.open=a,p.close=i,p.status=s,p.state=o,p.set=u,p.destructor=l,p.isTerminated=0;const d=s.watch(e=>p.isOpen=e),h=o.watch(e=>p.current=e);s.map(e=>{e||(p.current=n)}),o.reset(i);const f=l.watch(()=>{p.isTerminated=1}),m=l.watch(()=>{m(),d(),h(),f(),p.status.off(p.open),p.status.off(p.close),p.status.off(p.destructor),p.state.off(p.set)});return p},e.createReactState=s,e.createStoreConsumer=r,e.unstable_createStoreProvider=function(e){var r,n;return n=r=class extends t.Component{constructor(...e){super(...e),this.state={currentValue:null}}static getDerivedStateFromProps(t){return e.setState(t.value),{currentValue:t.value}}render(){return this.props.children}},r.displayName=e.shortName+".Provider",r.defaultProps={children:null},n},e.useGate=((e,r={})=>{t.useEffect(()=>(e.open(),()=>e.close()),[e]),e.set(r)}),e.useStore=(e=>{effector.invariant(effector.is.store(e),'useStore: The argument must be Store, but you passed %s',e);const r=t.useReducer(o,void 0,e.getState)[1];return t.useLayoutEffect(()=>e.watch(r),[e]),e.getState()}),Object.defineProperty(e,'__esModule',{value:1})},void('object'==typeof exports&&'undefined'!=typeof module?t(exports,require('react'),require('effector')):'function'==typeof define&&define.amd?define(['exports','react','effector'],t):t((e=e||self).effectorReact={},e.React,e.effector));var e,t;
+return e=this,t=function(e,t,effector){function r(e,r){var s,n,o,c;let u,a;if(effector.isStore(e))a=e;else if('function'==typeof e)u=e;else{effector.invariant('object'==typeof e&&null!==e,'shape should be store or object with stores');const t=effector.createStoreObject(e);a=t}const i=null!==(s=null===(n=a)||void 0===n?void 0:n.shortName)&&void 0!==s?s:'Unknown',p=effector.createEvent(i+".View mounted"),l=effector.createEvent(i+".View unmounted");return c=o=class extends t.Component{constructor(...t){super(...t),this._unsubscribe=null,this._hasUnmounted=0,this.store='function'==typeof e?u(this.props):a,this.state={currentState:this.store.getState()}}componentDidMount(){p({props:this.props,state:this.store.getState()}),this.subscribe()}componentWillUnmount(){l({props:this.props,state:this.store.getState()}),this.unsubscribe(),this._hasUnmounted=1}render(){return r(this.props,this.state.currentState)}subscribe(){this._unsubscribe=this.store.watch(e=>{this._hasUnmounted||this.setState(t=>e===t.currentState?null:{currentState:e})})}unsubscribe(){'function'==typeof this._unsubscribe&&this._unsubscribe(),this._unsubscribe=null}},o.displayName=i+".View",o.mounted=p,o.unmounted=l,c}function s(e){return r(e,({children:e},t)=>e(t))}function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var s in r)({}).hasOwnProperty.call(r,s)&&(e[s]=r[s])}return e}).apply(this,arguments)}function o(e,r){const o=s(e),c=e=>t.createElement(o,null,s=>t.createElement(r,n({},e,s)));return c.displayName="Connect("+(r.displayName||r.name||'Unknown')+")",c}const c=(e,t)=>t,u='undefined'!=typeof window?t.useLayoutEffect:t.useEffect,{store:a}=effector.createDomain('Gate');e.connect=(e=>t=>o(t,e)),e.createComponent=r,e.createContextComponent=function(e,r,n){var o,c;const u=s(e);return c=o=class extends t.Component{constructor(...e){super(...e),this.renderProp=(e=>n(this.props,e,this.context))}render(){return t.createElement(u,null,this.renderProp)}},o.contextType=r,c},e.createGate=function e(r="gate",s={}){const n=a(0),o=a(s),{set:c}=effector.createApi(o,{set:(e,t)=>t}),{open:u,close:i,destructor:p}=effector.createApi(n,{open:()=>l.predicate()&&1,close:()=>0,destructor:()=>0});class l extends t.PureComponent{static childGate(t="Subgate"){const s=e(r+"/"+t);s.predicate=(()=>l.status.getState());let n=0,o=0;return s.open.watch(()=>{o||(n=1)}),s.close.watch(()=>{o||(n=0)}),l.status.watch(e=>{o=1,n&&e&&!s.status.getState()&&s.open(),o=0}),l.close.watch(()=>{o=1,s.close(),o=0}),l.destructor.watch(()=>s.destructor()),s}componentDidMount(){l.open()}componentWillUnmount(){l.close()}render(){return l.set(this.props),null}}l.predicate=(()=>1),l.displayName="Gate:"+r,l.isOpen=0,l.current=o.getState(),l.open=u,l.close=i,l.status=n,l.state=o,l.set=c,l.destructor=p,l.isTerminated=0;const d=n.watch(e=>l.isOpen=e),h=o.watch(e=>l.current=e);n.map(e=>{e||(l.current=s)}),o.reset(i);const f=p.watch(()=>{l.isTerminated=1}),m=p.watch(()=>{m(),d(),h(),f(),l.status.off(l.open),l.status.off(l.close),l.status.off(l.destructor),l.state.off(l.set)});return l},e.createReactState=o,e.createStoreConsumer=s,e.unstable_createStoreProvider=function(e){var r,s;return s=r=class extends t.Component{constructor(...e){super(...e),this.state={currentValue:null}}static getDerivedStateFromProps(t){return e.setState(t.value),{currentValue:t.value}}render(){return this.props.children}},r.displayName=e.shortName+".Provider",r.defaultProps={children:null},s},e.useGate=((e,r={})=>{t.useEffect(()=>(e.open(),()=>e.close()),[e]),e.set(r)}),e.useStore=(e=>{effector.invariant(effector.is.store(e),'useStore: The argument must be Store, but you passed %s',e);const r=t.useReducer(c,void 0,e.getState)[1];return u(()=>e.watch(r),[e]),e.getState()}),Object.defineProperty(e,'__esModule',{value:1})},void('object'==typeof exports&&'undefined'!=typeof module?t(exports,require('react'),require('effector')):'function'==typeof define&&define.amd?define(['exports','react','effector'],t):t((e=e||self).effectorReact={},e.React,e.effector));var e,t;
 //# sourceMappingURL=effector-react.umd.js.map

index.d.ts

@@ -24,2 +24,6 @@ import * as React from 'react'
 }
+export type StoreView<State, Props = {}> = React.ComponentType<Props> & {
+  mounted: Event<{props: Props; state: State}>
+  unmounted: Event<{props: Props; state: State}>
+}
 
@@ -30,6 +34,22 @@ export function useStore<State>(store: Store<State>): State
 export function createGate<Props>(name?: string): Gate<Props>
+
 export function createComponent<Props, State>(
+  storeFactory: (initialProps: Props) => Store<State>,
+  view: (props: Props, state: State) => React.ReactNode,
+): StoreView<State, Props>
+export function createComponent<Props, State>(
   store: Store<State>,
   view: (props: Props, state: State) => React.ReactNode,
-): React.ComponentType<Props>
+): StoreView<State, Props>
+export function createComponent<Props, Shape extends object>(
+  store: Shape,
+  view: (
+    props: Props,
+    state: {[K in keyof Shape]: Shape[K] extends Store<infer U> ? U : Shape[K]},
+  ) => React.ReactNode,
+): StoreView<
+  {[K in keyof Shape]: Shape[K] extends Store<infer U> ? U : Shape[K]},
+  Props
+>
+
 export function createContextComponent<Props, State, Context>(
@@ -36,0 +56,0 @@ store: Store<State>,

package.json

 {
   "name": "effector-react",
-  "version": "0.18.9",
+  "version": "0.18.10",
   "description": "React bindings for effector",
@@ -5,0 +5,0 @@ "main": "effector-react.cjs.js",

No alert changes

Improved metrics

Total package byte prevSize

70626

increased by11.94%

Lines of code

113

increased by22.83%

No dependency changes