react-model/dist/react-model.modern.js

The State management library for React

import t,{enableES5 as e}from"immer";import{createContext as o,useState as a,useRef as n,PureComponent as s,createElement as r,useEffect as c,useLayoutEffect as i}from"react";function l(){return(l=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var a in o)Object.prototype.hasOwnProperty.call(o,a)&&(t[a]=o[a])}return t}).apply(this,arguments)}var u={Actions:{},AsyncState:{},Context:{__global:{}},Middlewares:{},Setter:{classSetter:void 0,functionSetter:{}},State:{},devTools:void 0,subscriptions:{},mutableState:{},gid:0,uid:0,storeId:0,currentStoreId:"0",withDevTools:!1};const S={logger:{enable:!1},devtools:{enable:!1},tryCatch:{enable:!0}},d=async(t,e)=>{const{next:o}=t;return S.tryCatch.enable?await o(e).catch(t=>console.log(t)):await o(e)},m=async(t,e)=>{const{action:o,modelName:a,consumerActions:n,params:s,next:r,Global:c,type:i}=t;return t.newState="u"===i?o():await o(s,l({actions:n(c.Actions[a],{modelName:a}),state:c.State[a]},c.Context.__global||{},c.Context[a]||{}))||null,await r(e)},b=async(t,e)=>{const{modelName:o,newState:a,next:n,Global:s,disableSelectorUpdate:r,type:c}=t;if(s.Setter.functionSetter[o]&&!r&&Object.keys(s.Setter.functionSetter[o]).map(t=>{const e=s.Setter.functionSetter[o][t];e&&e.selector&&!e.selectorRef&&(e.selectorRef=e.selector(s.State[o]))}),a||"u"===c)return E(o,a||{}),await n(e)},p=async(t,e)=>{const{modelName:o,next:a,Global:n,__hash:s}=t,r=n.Setter.functionSetter[o];return"f"===t.type&&s&&r&&r[s]&&r[s].setState&&r[s].setState(n.State[o]),await a(e)},f=async(t,e)=>{const{modelName:o,actionName:a,next:n,Global:s}=t,r="u"===t.type?s.subscriptions[o]:s.subscriptions[`${o}_${a}`];return r&&r.forEach(e=>{e(t)}),await n(e)},_=async(t,e)=>{const{Global:o}=t;if(!0===S.logger.enable||"function"==typeof S.logger.enable&&S.logger.enable(t)){console.group(`%c ${t.modelName} State Change %c ${(new Date).toLocaleTimeString()}`,"color: gray; font-weight: lighter;","color: black; font-weight: bold;"),console.log("%c Previous","color: #9E9E9E; font-weight: bold",o.State[t.modelName]),console.log("%c Action","color: #03A9F4; font-weight: bold",t.actionName,"payload: "+t.params);const a=await t.next(e);return console.log("%c Next","color: #4CAF50; font-weight: bold",o.State[t.modelName]),console.groupEnd(),a}return await t.next(e)},g=async(t,e)=>{const{Global:o}=t,a=await t.next(e);return o.withDevTools="undefined"!=typeof window&&window.__REDUX_DEVTOOLS_EXTENSION__,o.withDevTools&&h.config.devtools.enable&&!o.devTools&&(o.devTools=window.__REDUX_DEVTOOLS_EXTENSION__,o.devTools.connect()),o.withDevTools&&S.devtools.enable&&o.devTools.send("u"===t.type&&t.disableSelectorUpdate?`store[${t.modelName}].update`:`${t.modelName}_${t.actionName}`,"u"===t.type?o.mutableState[t.modelName]:o.State[t.modelName],void 0,t.modelName),a},w=async(t,e)=>{const{modelName:o,next:a,Global:n,disableSelectorUpdate:s}=t;return n.Setter.classSetter&&n.Setter.classSetter(n.State),n.Setter.functionSetter[o]&&Object.keys(n.Setter.functionSetter[o]).map(t=>{const e=n.Setter.functionSetter[o][t];if(e)if(!e.selector||s)e.setState(n.State[o]);else{const t=e.selector(n.State[o]);C(t,e.selectorRef)||(e.selectorRef=t,e.setState(n.State[o]))}}),await a(e)},y=[d,_,g,m,b,p,w,f],h={communicator:w,consoleDebugger:_,devToolsListener:g,getNewState:m,getNewStateWithCache:(t=5e3)=>async(e,o)=>{const{action:a,Global:n,modelName:s,consumerActions:r,params:c,next:i,actionName:l}=e;return e.newState=await Promise.race([a(c,{actions:r(n.Actions[s],{modelName:s}),state:n.State[s]}),R(t,$(s,l))])||null,await i(o)},setNewState:b,stateUpdater:p,subscription:f,tryCatch:d,config:S},N=async(t,e)=>(e.next=t=>t.length>0?t[0](e,t.slice(1)):e.newState,await t[0](e,t.slice(1))),O=o({}),v=O.Consumer;if(!console.group){const t=[],e="-".repeat(80);console.group=function(o){t.push(o),console.log("%c \nBEGIN GROUP: %c",e,o),console.groupEnd=function(){console.log("END GROUP: %c\n%c",t.pop(),e)}}}const A=(t,e)=>{const o={};return Object.keys(t).forEach(a=>{o[a]=((t,e)=>async(o,a)=>{const n={Global:u,action:t,actionName:t.name,consumerActions:A,middlewareConfig:a,modelName:e.modelName,newState:null,params:o,type:"o"};return await N(y,n)})(t[a],e)}),o},E=(e,o)=>{if("function"==typeof o){let a=u.State[e];a=t(a,o),u.State=t(u.State,t=>{t[e]=a})}else u.State=t(u.State,t=>{t[e]=l({},t[e],o)});return u.State},R=(t,e)=>new Promise(o=>setTimeout(()=>{console.log(t),o(e)},t)),x=async(e,o)=>{const a={__FROM_SERVER__:!0};return await Promise.all(Object.keys(u.State).map(async n=>{let s=o&&o.prefix||"";if(!e||!e.modelName||n===s+e.modelName||-1!==e.modelName.indexOf(s+n)){const s=u.AsyncState[n],r=s?await s(e):{};o&&o.isServer?a[n]=r:u.State=t(u.State,t=>{t[n]=l({},t[n],r)})}})),o&&o.isServer?a:u.State},$=(t,e)=>{const o=localStorage.getItem(`__REACT_MODELX__${t}_${e}`);return o?JSON.parse(o):null},C=(t,e)=>{if(t===e)return!0;if("object"!=typeof t||null===t||"object"!=typeof e||null===e)return!1;const o=Object.keys(t),a=Object.keys(e);if(o.length!==a.length)return!1;for(let a=0;a<o.length;a++)if(!Object.prototype.hasOwnProperty.call(e,o[a])||t[o[a]]!==e[o[a]])return!1;return!0};e();const j="undefined"==typeof window?c:i;function T(e){const o=u.currentStoreId,a=u.mutableState[o].count;return u.mutableState[o].count+=1,u.mutableState[o].hasOwnProperty(a)||(u.mutableState[o][a]="function"==typeof e?e():e),[u.mutableState[o][a],async e=>{u.mutableState[o][a]="function"==typeof e?t(u.mutableState[o][a],e):u.mutableState[o][a]&&e&&"Object"===u.mutableState[o][a].constructor.name&&"Object"===e.constructor.name?l({},u.mutableState[o][a],e):e;const n={Global:u,action:()=>"function"==typeof e?u.mutableState[o][a]:e,actionName:"setter",consumerActions:A,disableSelectorUpdate:!0,middlewareConfig:{},modelName:o,newState:{},params:void 0,type:"u"};return await N(y,n)}]}function G(t,e){const o="string"==typeof t;u.storeId+=o?0:1;const a=o?t:u.storeId.toString();u.Actions[a]||(u.Actions[a]={}),u.mutableState[a]||(u.mutableState[a]={count:0});const n=()=>(u.mutableState[a].count=0,u.currentStoreId=a,u.mutableState[a].cachedResult=e?e():t(),u.mutableState[a].cachedResult);return u.mutableState[a].selector=n,{useStore:()=>U(a,n),getState:()=>n(),getStore:()=>u.mutableState[a].cachedResult,subscribe:t=>{u.subscriptions[a]||(u.subscriptions[a]=[]),u.subscriptions[a].push(t)},unsubscribe:t=>{if(u.subscriptions[a]&&t){const e=u.subscriptions[a].indexOf(t);e>=0&&u.subscriptions[a].splice(e,1)}}}}function I(e,o,a){if(void 0!==e.state){u.storeId+=1;const a="__"+u.storeId;u.State=t(u.State,t=>{t[a]=e.state}),e.middlewares&&(u.Middlewares[a]=e.middlewares),u.Actions[a]=e.actions,u.AsyncState[a]=e.asyncState,o&&(u.Context[a]=o);const n=k(a);return{__id:a,actions:n,getState:()=>P(a),subscribe:(t,e)=>M(a,t,e),unsubscribe:t=>D(a,t),useStore:t=>U(a,t)}}{o?u.gid=1:u.gid+=1;let n="";if(u.gid>1&&(n=u.gid+"_"),e.actions){console.error("invalid model(s) schema: ",e);const t=t=>(...e)=>t;return{__ERROR__:!0,actions:t({}),getActions:t({}),getInitialState:t({}),getState:t({}),subscribe:t(),unsubscribe:t(),useStore:t([{},{}])}}o&&!o.__FROM_SERVER__&&(u.State=t(u.State,t=>{Object.assign(t,o||{})})),a&&(u.Context.__global=a);let s={};return Object.keys(e).forEach(a=>{let r=n+a;const c=e[a];if(c.__ERROR__)return console.error(r+" model's schema is invalid"),u.State=t(u.State,t=>{t[r]={}}),void(u.Actions[r]={});(t=>void 0!==t.useStore)(c)?(u.State[r]&&o||(u.State=t(u.State,t=>{t[r]=t[c.__id]})),o&&o.__FROM_SERVER__&&(u.State=t(u.State,t=>{t[r]=l({},t[c.__id],o[r])})),u.Actions[r]=u.Actions[c.__id],u.AsyncState[r]=u.AsyncState[c.__id],u.Middlewares[r]=u.Middlewares[c.__id],u.Context[r]=u.Context[c.__id]):(o&&o.__FROM_SERVER__?u.State=t(u.State,t=>{t[r]=l({},c.state,o[r])}):u.State[r]||(u.State=t(u.State,t=>{t[r]=c.state})),c.middlewares&&(u.Middlewares[r]=c.middlewares),u.Actions[r]=c.actions,u.AsyncState[r]=c.asyncState),s[a]=k(r)}),{actions:s,getActions:t=>k(n+t),getInitialState:async(t,e)=>x(t,l({},e,{prefix:n})),getState:t=>P(n+t),subscribe:(t,e,o)=>M(n+t,e,o),unsubscribe:(t,e)=>D(n+t,e),useStore:(t,e)=>U(n+t,e)}}}const D=(t,e)=>{M(t,e,void 0)},M=(t,e,o)=>{Array.isArray(e)?e.forEach(e=>{u.subscriptions[`${t}_${e}`]||(u.subscriptions[`${t}_${e}`]=[]),o?u.subscriptions[`${t}_${e}`].push(o):u.subscriptions[`${t}_${e}`]=[]}):(u.subscriptions[`${t}_${e}`]||(u.subscriptions[`${t}_${e}`]=[]),o?u.subscriptions[`${t}_${e}`].push(o):u.subscriptions[`${t}_${e}`]=[])},P=t=>u.State[t],k=(t,e={type:"o"})=>{const o={};return Object.keys(u.Actions[t]).forEach(a=>o[a]=async(o,n)=>{const s=l({action:u.Actions[t][a],actionName:a,consumerActions:A,middlewareConfig:n,modelName:t,newState:null,params:o},e,{Global:u});return u.Middlewares[t]?await N(u.Middlewares[t],s):await N(y,s)}),o},U=(t,e)=>{const o=a({})[1],s=n(""),r=(c=[t],t=>c.reduce((t,e)=>t&&t[e]?t[e]:null,t))(u.mutableState);var c;const i=!!r,l=i?r.selector:e,S=i?r:P(t);if(j(()=>{u.uid+=1;const e=""+u.uid;return s.current=e,u.Setter.functionSetter[t]||(u.Setter.functionSetter[t]={}),u.Setter.functionSetter[t][e]={setState:o,selector:l},function(){delete u.Setter.functionSetter[t][e]}},[]),i)return l(S);{const e=k(t,{__hash:s.current,type:"f"});return[l?l(S):S,e]}};class F extends s{constructor(){super(...arguments),this.state=u.State}render(){const{children:t}=this.props;return u.Setter.classSetter=this.setState.bind(this),r(O.Provider,{value:l({},this.state)},t)}}const V=(t,e,o)=>a=>class extends s{render(){const{state:n={},actions:s={}}=this.props;return r(v,null,c=>{const{[""+t]:i}=c,S=u.Actions[t];return r(a,Object.assign({},this.props,{state:l({},n,e?e(i):i),actions:l({},s,o?o(A(S,{modelName:t})):A(S,{modelName:t}))}))})}};export{v as Consumer,I as Model,F as Provider,y as actionMiddlewares,V as connect,G as createStore,x as getInitialState,P as getState,h as middlewares,T as useModel};