@lomray/react-mobx-manager 1.5.3-beta.1 → 2.0.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -8,6 +8,7 @@
8
8
  - Manage your Mobx stores like a boss - debug like a hacker.
9
9
  - Simple idea - simple implementation.
10
10
  - Small package size.
11
+ - Support render to stream.
11
12
  - Support code splitting out of the box.
12
13
  - Access stores from other stores.
13
14
  - Can be a replacement for react context.
@@ -471,6 +472,13 @@ class MyStore {
471
472
  }
472
473
  ```
473
474
 
475
+ Lifecycles:
476
+ - constructor
477
+ - wakeup (restore state from persisted store)
478
+ - init
479
+ - onMount
480
+ - onDestroy
481
+
474
482
  ## React Native debug plugin
475
483
  For debug state, you can use [Reactotron debug plugin](https://github.com/Lomray-Software/reactotron-mobx-store-manager)
476
484
 
package/lib/context.d.ts CHANGED
@@ -12,6 +12,10 @@ interface IStoreManagerParentProvider {
12
12
  children?: React.ReactNode;
13
13
  parentId: string;
14
14
  }
15
+ interface IStoreManagerSuspenseProvider {
16
+ children?: React.ReactNode;
17
+ id: string | null;
18
+ }
15
19
  /**
16
20
  * Mobx store manager context
17
21
  */
@@ -19,7 +23,16 @@ declare const StoreManagerContext: React.Context<Manager>;
19
23
  /**
20
24
  * To spread relationships
21
25
  */
22
- declare const StoreManagerParentContext: React.Context<IStoreManagerParentProvider>;
26
+ declare const StoreManagerParentContext: React.Context<string>;
27
+ /**
28
+ * Generate id for suspended component stores
29
+ */
30
+ declare const StoreManagerSuspenseContext: React.Context<string | null>;
31
+ /**
32
+ * Mobx store manager parent provider
33
+ * @constructor
34
+ */
35
+ declare const StoreManagerSuspenseProvider: FC<IStoreManagerSuspenseProvider>;
23
36
  /**
24
37
  * Mobx store manager parent provider
25
38
  * @constructor
@@ -31,5 +44,6 @@ declare const StoreManagerParentProvider: FC<Omit<IStoreManagerParentProvider, '
31
44
  */
32
45
  declare const StoreManagerProvider: FC<IStoreManagerProvider>;
33
46
  declare const useStoreManagerContext: () => Manager;
34
- declare const useStoreManagerParentContext: () => Omit<IStoreManagerParentProvider, 'children'>;
35
- export { StoreManagerProvider, StoreManagerContext, StoreManagerParentContext, useStoreManagerContext, StoreManagerParentProvider, useStoreManagerParentContext };
47
+ declare const useStoreManagerParentContext: () => IStoreManagerParentProvider['parentId'];
48
+ declare const useStoreManagerSuspenseContext: () => IStoreManagerSuspenseProvider['id'];
49
+ export { StoreManagerContext, StoreManagerParentContext, StoreManagerSuspenseContext, StoreManagerProvider, StoreManagerParentProvider, StoreManagerSuspenseProvider, useStoreManagerContext, useStoreManagerParentContext, useStoreManagerSuspenseContext };
package/lib/context.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=t(e);const a=r.default.createContext({}),n=r.default.createContext({parentId:"root"}),o=({children:t,parentId:a})=>{const o=e.useMemo((()=>({parentId:a})),[a]);return r.default.createElement(n.Provider,{value:o,children:t})};exports.StoreManagerContext=a,exports.StoreManagerParentContext=n,exports.StoreManagerParentProvider=o,exports.StoreManagerProvider=({children:t,storeManager:n,fallback:u,shouldInit:s=!1})=>{const[d,l]=e.useState(!s);return e.useEffect((()=>{s&&n.init().then((()=>l(!0))).catch((e=>{console.error("Failed initialized store manager: ",e)}))}),[s,n]),r.default.createElement(a.Provider,{value:n},r.default.createElement(o,{parentId:"root"},d?t:u||t))},exports.useStoreManagerContext=()=>e.useContext(a),exports.useStoreManagerParentContext=()=>e.useContext(n);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=t(e);const a=r.default.createContext({}),n=r.default.createContext("root"),o=r.default.createContext(null),s=({children:e,parentId:t})=>r.default.createElement(n.Provider,{value:t,children:e});exports.StoreManagerContext=a,exports.StoreManagerParentContext=n,exports.StoreManagerParentProvider=s,exports.StoreManagerProvider=({children:t,storeManager:n,fallback:o,shouldInit:u=!1})=>{const[l,d]=e.useState(!u);return e.useEffect((()=>{u&&n.init().then((()=>d(!0))).catch((e=>{console.error("Failed initialized store manager: ",e)}))}),[u,n]),r.default.createElement(a.Provider,{value:n},r.default.createElement(s,{parentId:"root"},l?t:o||t))},exports.StoreManagerSuspenseContext=o,exports.StoreManagerSuspenseProvider=({children:e,id:t})=>r.default.createElement(o.Provider,{value:t,children:e}),exports.useStoreManagerContext=()=>e.useContext(a),exports.useStoreManagerParentContext=()=>e.useContext(n),exports.useStoreManagerSuspenseContext=()=>e.useContext(o);
package/lib/index.d.ts CHANGED
@@ -1,9 +1,8 @@
1
- export * from "./types-c6a5e53a.js";
1
+ export * from "./types-abd34741.js";
2
2
  export * from "./context.js";
3
3
  export { default as Manager } from "./manager.js";
4
4
  export { default as onChangeListener } from "./on-change-listener.js";
5
5
  export { default as wakeup } from "./wakeup.js";
6
6
  export { default as withStores } from "./with-stores.js";
7
- export { default as MobxLocalStorage } from "./storages/local-storage.js";
8
- export { default as MobxAsyncStorage } from "./storages/async-storage.js";
9
7
  export { default as Events } from "./events.js";
8
+ export { default as MobxSuspense } from "./mobx-suspense.js";
package/lib/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./context.js"),r=require("./manager.js"),t=require("./on-change-listener.js"),o=require("./wakeup.js"),a=require("./with-stores.js"),s=require("./storages/local-storage.js"),n=require("./storages/async-storage.js"),x=require("./events.js");exports.StoreManagerContext=e.StoreManagerContext,exports.StoreManagerParentContext=e.StoreManagerParentContext,exports.StoreManagerParentProvider=e.StoreManagerParentProvider,exports.StoreManagerProvider=e.StoreManagerProvider,exports.useStoreManagerContext=e.useStoreManagerContext,exports.useStoreManagerParentContext=e.useStoreManagerParentContext,exports.Manager=r,exports.onChangeListener=t,exports.wakeup=o,exports.withStores=a,exports.MobxLocalStorage=s,exports.MobxAsyncStorage=n,exports.Events=x;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./context.js"),r=require("./manager.js"),t=require("./on-change-listener.js"),o=require("./wakeup.js"),n=require("./with-stores.js"),s=require("./events.js"),a=require("./mobx-suspense.js");exports.StoreManagerContext=e.StoreManagerContext,exports.StoreManagerParentContext=e.StoreManagerParentContext,exports.StoreManagerParentProvider=e.StoreManagerParentProvider,exports.StoreManagerProvider=e.StoreManagerProvider,exports.StoreManagerSuspenseContext=e.StoreManagerSuspenseContext,exports.StoreManagerSuspenseProvider=e.StoreManagerSuspenseProvider,exports.useStoreManagerContext=e.useStoreManagerContext,exports.useStoreManagerParentContext=e.useStoreManagerParentContext,exports.useStoreManagerSuspenseContext=e.useStoreManagerSuspenseContext,exports.Manager=r,exports.onChangeListener=t,exports.wakeup=o,exports.withStores=n,exports.Events=s,exports.MobxSuspense=a;
package/lib/manager.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { IConstructableStore, IManagerParams, IStorage, IStore, TStoreDefinition, IManagerOptions, TStores, IStoreLifecycle, TInitStore, IStoreParams } from "./types-c6a5e53a.js";
1
+ import { IConstructableStore, IManagerParams, IStorage, IStore, TStoreDefinition, IManagerOptions, TStores, IStoreLifecycle, TInitStore, IStoreParams } from "./types-abd34741.js";
2
2
  /**
3
3
  * Mobx stores manager
4
4
  */
@@ -90,6 +90,11 @@ declare class Manager {
90
90
  * Get persisted stores ids
91
91
  */
92
92
  static getPersistedStoresIds(): Set<string>;
93
+ /**
94
+ * Push initial state dynamically
95
+ * E.g. when stream html
96
+ */
97
+ pushInitState: (storesState?: Record<string, any>) => void;
93
98
  /**
94
99
  * Get store identity
95
100
  * @protected
@@ -169,7 +174,7 @@ declare class Manager {
169
174
  /**
170
175
  * Get store's state
171
176
  */
172
- toJSON(): Record<string, any>;
177
+ toJSON(ids?: string[]): Record<string, any>;
173
178
  /**
174
179
  * Get persisted store's data
175
180
  */
package/lib/manager.js CHANGED
@@ -1 +1 @@
1
- "use strict";var e=require("@lomray/event-manager"),t=require("mobx"),s=require("./events.js"),r=require("./on-change-listener.js"),o=require("./wakeup.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);class a{constructor({initState:e,storesParams:t,storage:s,options:r}={}){Object.defineProperty(this,"stores",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),Object.defineProperty(this,"storesRelations",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),Object.defineProperty(this,"initState",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"storage",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"persistData",{enumerable:!0,configurable:!0,writable:!0,value:{}}),Object.defineProperty(this,"storesParams",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:{shouldDisablePersist:!1,shouldRemoveInitState:!0,isSSR:!1}}),this.initState=e||{},this.storesParams=t||{},this.storage=s,Object.assign(this.options,r||{}),a.instance=this}async init(){return this.storage&&(this.persistData=await this.storage.get()||{}),this}static get(){if(!a.instance)throw new Error("Store manager is not initialized.");return a.instance}getStores(){return this.stores}getStoresRelations(){return this.storesRelations}static getPersistedStoresIds(){return a.persistedStores}getStoreId(e,t={}){const{id:s,contextId:r,key:o}=t;if(s)return s;if(e.libStoreId)return e.libStoreId;let i=e.name||e.constructor.name;return e.isSingleton?i:(i=`${i}--${r}`,o?`${i}--${o}`:i)}createContextId(e){return`ctx${e||this.storesRelations.size+1}`}getStore(e,t={}){const s=this.getStoreId(e,t);return this.stores.has(s)?this.stores.get(s):e.isSingleton?this.createStore(e,{id:s,contextId:"singleton",parentId:"root",componentName:"root-app",componentProps:{}}):this.lookupStore(s,t)}lookupStore(e,t){var s,r;const{contextId:o,parentId:i}=t,n=null===(s=e.split("--"))||void 0===s?void 0:s[0],{ids:a,parentId:l}=null!==(r=this.storesRelations.get(o))&&void 0!==r?r:{ids:new Set,parentId:i},d=[...a].filter((e=>e.startsWith(`${n}--`)));if(1===d.length)return this.stores.get(d[0]);if(d.length>1)console.error("Parent context has multiple stores with the same id, please pass key to getStore function.");else if(l&&"root"!==l)return this.lookupStore(e,{contextId:l})}createStore(e,t){var r,o;const{isSSR:i}=this.options,{id:l,contextId:d,parentId:u,componentName:p,componentProps:c}=t;if((e.isSingleton||i)&&this.stores.has(l))return this.stores.get(l);const h=new e({...this.storesParams,storeManager:this,getStore:(e,t={contextId:d,parentId:u})=>this.getStore(e,t),componentProps:c});h.libStoreId=l,h.isSingleton=e.isSingleton,h.libStoreContextId=e.isSingleton?"singleton":d,h.libStoreParentId=e.isSingleton||!u||u===d?"root":u,h.libStoreComponentName=p;const S=this.initState[l],b=this.persistData[l];return S&&Object.assign(h,S),n.default.publish(s.CREATE_STORE,{store:e}),"wakeup"in h&&a.persistedStores.has(l)&&(null===(r=h.wakeup)||void 0===r||r.call(h,h,{initState:S,persistedState:b})),null===(o=h.init)||void 0===o||o.call(h),this.prepareStore(h),(h.isSingleton||i)&&this.prepareMount(h),h}createStores(e,t,s,r,o={}){return e.reduce(((e,[i,n])=>{const[a,l]="store"in n?[n.store,n.id]:[n,this.getStoreId(n,{key:i,contextId:s})];return{...e,[i]:this.createStore(a,{id:l,contextId:s,parentId:t,componentName:r,componentProps:o})}}),{})}prepareStore(e){const t=e.libStoreId,r=e.libStoreContextId;this.storesRelations.has(r)||this.storesRelations.set(r,{ids:new Set,parentId:e.libStoreParentId&&e.libStoreParentId!==r?e.libStoreParentId:"root",componentName:e.libStoreComponentName});const{ids:o}=this.storesRelations.get(r);this.stores.has(t)||(this.stores.set(t,e),o.add(t),n.default.publish(s.ADD_STORE,{store:e}))}prepareMount(e){const{shouldRemoveInitState:t}=this.options,s=e.libStoreId,r=[];return a.persistedStores.has(s)&&"addOnChangeListener"in e&&r.push(e.addOnChangeListener(e,this)),t&&this.initState[s]&&delete this.initState[s],r}mountStores(e){const t=[];return Object.values(e).forEach((e=>{var r;if(t.push(...this.prepareMount(e)),n.default.publish(s.MOUNT_STORE,{store:e}),"onMount"in e){const s=null===(r=e.onMount)||void 0===r?void 0:r.call(e);"function"==typeof s&&t.push(s)}"onDestroy"in e&&t.push((()=>{var t;return null===(t=e.onDestroy)||void 0===t?void 0:t.call(e)}))})),()=>{t.forEach((e=>e())),Object.values(e).forEach((e=>{var t;const r=e.libStoreId;if(n.default.publish(s.UNMOUNT_STORE,{store:e}),!e.isSingleton){const{ids:o}=null!==(t=this.storesRelations.get(e.libStoreContextId))&&void 0!==t?t:{ids:new Set};this.stores.delete(r),o.delete(r),n.default.publish(s.DELETE_STORE,{store:e}),o.size||this.storesRelations.delete(e.libStoreContextId)}}))}}toJSON(){var e,t;const s={};for(const[r,o]of this.stores.entries())s[r]=null!==(t=null===(e=o.toJSON)||void 0===e?void 0:e.call(o))&&void 0!==t?t:a.getObservableProps(o);return s}toPersistedJSON(){var e,t;const s={};for(const r of a.persistedStores){const o=this.stores.get(r);o&&(s[r]=null!==(t=null===(e=o.toJSON)||void 0===e?void 0:e.call(o))&&void 0!==t?t:a.getObservableProps(o))}return s}static getObservableProps(e){const s=t.toJS(e);return Object.entries(s).reduce(((s,[r,o])=>({...s,...t.isObservableProp(e,r)?{[r]:o}:{}})),{})}static persistStore(e,t){return a.persistedStores.has(t)?(console.warn(`Duplicate serializable store key: ${t}`),e):(a.persistedStores.add(t),e.libStoreId=t,"wakeup"in e.prototype||(e.prototype.wakeup=o),"addOnChangeListener"in e.prototype||(e.prototype.addOnChangeListener=r),e)}}Object.defineProperty(a,"persistedStores",{enumerable:!0,configurable:!0,writable:!0,value:new Set}),module.exports=a;
1
+ "use strict";var e=require("@lomray/event-manager"),t=require("mobx"),s=require("./events.js"),r=require("./on-change-listener.js"),o=require("./wakeup.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);class a{constructor({initState:e,storesParams:t,storage:s,options:r}={}){Object.defineProperty(this,"stores",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),Object.defineProperty(this,"storesRelations",{enumerable:!0,configurable:!0,writable:!0,value:new Map}),Object.defineProperty(this,"initState",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"storage",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"persistData",{enumerable:!0,configurable:!0,writable:!0,value:{}}),Object.defineProperty(this,"storesParams",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"options",{enumerable:!0,configurable:!0,writable:!0,value:{shouldDisablePersist:!1,shouldRemoveInitState:!0,isSSR:!1}}),Object.defineProperty(this,"pushInitState",{enumerable:!0,configurable:!0,writable:!0,value:(e={})=>{for(const[t,s]of Object.entries(e))this.initState[t]=s}}),this.initState=e||{},this.storesParams=t||{},this.storage=s,Object.assign(this.options,r||{}),a.instance=this,"undefined"==typeof window||window.mobxManager||(window.mobxManager={pushInit:this.pushInitState})}async init(){return this.storage&&(this.persistData=await this.storage.get()||{}),this}static get(){if(!a.instance)throw new Error("Store manager is not initialized.");return a.instance}getStores(){return this.stores}getStoresRelations(){return this.storesRelations}static getPersistedStoresIds(){return a.persistedStores}getStoreId(e,t={}){const{id:s,contextId:r,key:o}=t;if(s)return s;if(e.libStoreId)return e.libStoreId;let i=e.name||e.constructor.name;return e.isSingleton?i:(i=`${i}--${r}`,o?`${i}--${o}`:i)}createContextId(e){return`ctx${e||this.storesRelations.size+1}`}getStore(e,t={}){const s=this.getStoreId(e,t);return this.stores.has(s)?this.stores.get(s):e.isSingleton?this.createStore(e,{id:s,contextId:"singleton",parentId:"root",componentName:"root-app",componentProps:{}}):this.lookupStore(s,t)}lookupStore(e,t){var s,r;const{contextId:o,parentId:i}=t,n=null===(s=e.split("--"))||void 0===s?void 0:s[0],{ids:a,parentId:l}=null!==(r=this.storesRelations.get(o))&&void 0!==r?r:{ids:new Set,parentId:i},d=[...a].filter((e=>e.startsWith(`${n}--`)));if(1===d.length)return this.stores.get(d[0]);if(d.length>1)console.error("Parent context has multiple stores with the same id, please pass key to getStore function.");else if(l&&"root"!==l)return this.lookupStore(e,{contextId:l})}createStore(e,t){var r,o;const{isSSR:i}=this.options,{id:l,contextId:d,parentId:u,componentName:p,componentProps:c}=t;if((e.isSingleton||i)&&this.stores.has(l))return this.stores.get(l);const h=new e({...this.storesParams,storeManager:this,getStore:(e,t={contextId:d,parentId:u})=>this.getStore(e,t),componentProps:c});h.libStoreId=l,h.isSingleton=e.isSingleton,h.libStoreContextId=e.isSingleton?"singleton":d,h.libStoreParentId=e.isSingleton||!u||u===d?"root":u,h.libStoreComponentName=p;const S=this.initState[l],b=this.persistData[l];return S&&Object.assign(h,S),n.default.publish(s.CREATE_STORE,{store:e}),"wakeup"in h&&a.persistedStores.has(l)&&(null===(r=h.wakeup)||void 0===r||r.call(h,h,{initState:S,persistedState:b})),null===(o=h.init)||void 0===o||o.call(h),this.prepareStore(h),(h.isSingleton||i)&&this.prepareMount(h),h}createStores(e,t,s,r,o={}){return e.reduce(((e,[i,n])=>{const[a,l]="store"in n?[n.store,n.id]:[n,this.getStoreId(n,{key:i,contextId:s})];return{...e,[i]:this.createStore(a,{id:l,contextId:s,parentId:t,componentName:r,componentProps:o})}}),{})}prepareStore(e){const t=e.libStoreId,r=e.libStoreContextId;this.storesRelations.has(r)||this.storesRelations.set(r,{ids:new Set,parentId:e.libStoreParentId&&e.libStoreParentId!==r?e.libStoreParentId:"root",componentName:e.libStoreComponentName});const{ids:o}=this.storesRelations.get(r);this.stores.has(t)||(this.stores.set(t,e),o.add(t),n.default.publish(s.ADD_STORE,{store:e}))}prepareMount(e){const{shouldRemoveInitState:t}=this.options,s=e.libStoreId,r=[];return a.persistedStores.has(s)&&"addOnChangeListener"in e&&r.push(e.addOnChangeListener(e,this)),t&&this.initState[s]&&delete this.initState[s],r}mountStores(e){const t=[];return Object.values(e).forEach((e=>{var r;if(this.prepareStore(e),t.push(...this.prepareMount(e)),n.default.publish(s.MOUNT_STORE,{store:e}),"onMount"in e){const s=null===(r=e.onMount)||void 0===r?void 0:r.call(e);"function"==typeof s&&t.push(s)}"onDestroy"in e&&t.push((()=>{var t;return null===(t=e.onDestroy)||void 0===t?void 0:t.call(e)}))})),()=>{t.forEach((e=>e())),Object.values(e).forEach((e=>{var t;const r=e.libStoreId;if(n.default.publish(s.UNMOUNT_STORE,{store:e}),!e.isSingleton){const{ids:o}=null!==(t=this.storesRelations.get(e.libStoreContextId))&&void 0!==t?t:{ids:new Set};this.stores.delete(r),o.delete(r),n.default.publish(s.DELETE_STORE,{store:e}),o.size||this.storesRelations.delete(e.libStoreContextId)}}))}}toJSON(e){var t,s,r;const o={},i=null!==(t=null==e?void 0:e.reduce(((e,t)=>(this.stores.has(t)&&e.set(t,this.stores.get(t)),e)),new Map))&&void 0!==t?t:this.stores;for(const[e,t]of i.entries())o[e]=null!==(r=null===(s=t.toJSON)||void 0===s?void 0:s.call(t))&&void 0!==r?r:a.getObservableProps(t);return o}toPersistedJSON(){var e,t;const s={};for(const r of a.persistedStores){const o=this.stores.get(r);o&&(s[r]=null!==(t=null===(e=o.toJSON)||void 0===e?void 0:e.call(o))&&void 0!==t?t:a.getObservableProps(o))}return s}static getObservableProps(e){const s=t.toJS(e);return Object.entries(s).reduce(((s,[r,o])=>({...s,...t.isObservableProp(e,r)?{[r]:o}:{}})),{})}static persistStore(e,t){return a.persistedStores.has(t)?(console.warn(`Duplicate serializable store key: ${t}`),e):(a.persistedStores.add(t),e.libStoreId=t,"wakeup"in e.prototype||(e.prototype.wakeup=o),"addOnChangeListener"in e.prototype||(e.prototype.addOnChangeListener=r),e)}}Object.defineProperty(a,"persistedStores",{enumerable:!0,configurable:!0,writable:!0,value:new Set}),module.exports=a;
@@ -0,0 +1,8 @@
1
+ import { FC, SuspenseProps } from 'react';
2
+ /**
3
+ * Wrapper around react suspense
4
+ * Create unique id for each suspense (used for create/stream stores state)
5
+ * @constructor
6
+ */
7
+ declare const MobxSuspense: FC<SuspenseProps>;
8
+ export { MobxSuspense as default };
@@ -0,0 +1 @@
1
+ "use strict";var e=require("react"),t=require("./context.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=a(e);module.exports=({children:a,fallback:l,...n})=>{var u;const d=e.useId(),c=e.Children.map(a,((e,a)=>r.default.createElement(t.StoreManagerSuspenseProvider,{id:`${d}${a}`},e))),i=r.default.createElement(r.default.Fragment,null,r.default.createElement("script",{"data-context-id":d,"data-count":null!==(u=null==c?void 0:c.length)&&void 0!==u?u:0}),l);return r.default.createElement(e.Suspense,{...n,children:c,fallback:i})};
@@ -1,4 +1,4 @@
1
- import { IStorePersisted } from "./types-c6a5e53a.js";
1
+ import { IStorePersisted } from "./types-abd34741.js";
2
2
  /**
3
3
  * Listen persist store changes
4
4
  */
@@ -0,0 +1,72 @@
1
+ import { Response } from 'express';
2
+ import Manager from "../manager.js";
3
+ /**
4
+ * Stream mobx manager stores
5
+ * NOTE: use with renderToPipeableStream
6
+ */
7
+ declare class StreamStores {
8
+ /**
9
+ * Obtained suspensions from application shell
10
+ * @protected
11
+ */
12
+ protected suspendIds: Record<string, {
13
+ contextId: string;
14
+ count: number;
15
+ }>;
16
+ /**
17
+ * Mobx store manager instance
18
+ * @protected
19
+ */
20
+ protected readonly manager: Manager;
21
+ /**
22
+ * @constructor
23
+ * @protected
24
+ */
25
+ /**
26
+ * @constructor
27
+ * @protected
28
+ */
29
+ protected constructor(manager: Manager);
30
+ /**
31
+ * Listen react stream and push suspense stores state to client
32
+ */
33
+ /**
34
+ * Listen react stream and push suspense stores state to client
35
+ */
36
+ static stream(res: Response, manager: Manager): StreamStores;
37
+ /**
38
+ * Begin listen stream
39
+ */
40
+ /**
41
+ * Begin listen stream
42
+ */
43
+ protected beginStream(res: Response): void;
44
+ /**
45
+ * Parse suspensions and related stores context id from application shell
46
+ * @protected
47
+ */
48
+ /**
49
+ * Parse suspensions and related stores context id from application shell
50
+ * @protected
51
+ */
52
+ protected obtainSuspensions(html: string): void;
53
+ /**
54
+ * Replace suspend id
55
+ * @protected
56
+ */
57
+ /**
58
+ * Replace suspend id
59
+ * @protected
60
+ */
61
+ protected replaceSuspendIds(formId: string, toId: string): string | undefined;
62
+ /**
63
+ * Parse complete suspense chunk
64
+ * @protected
65
+ */
66
+ /**
67
+ * Parse complete suspense chunk
68
+ * @protected
69
+ */
70
+ protected obtainCompleteSuspense(html: string): Uint8Array | undefined;
71
+ }
72
+ export { StreamStores as default };
@@ -0,0 +1 @@
1
+ "use strict";class t{constructor(t){Object.defineProperty(this,"suspendIds",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"manager",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),this.manager=t}static stream(e,s){const n=new t(s);return n.beginStream(e),n}beginStream(t){const e=t.write.bind(t);t.write=(t,...s)=>{const n=Buffer.from(t).toString();this.obtainSuspensions(n);const r=this.obtainCompleteSuspense(n);return r?e(Buffer.concat([r,t]),...s):e(t,...s)}}obtainSuspensions(t){if(this.suspendIds)return;const e=[...t.matchAll(/<template id="(?<templateId>[^"]+)".+?<script data-context-id="(?<contextId>[^"]+)".+?data-count="(?<count>[^"]+)">/g)];e.length&&(this.suspendIds=e.reduce(((t,{groups:e})=>{const{templateId:s,contextId:n,count:r}=null!=e?e:{};return s?{...t,[s]:{contextId:n,count:Number(r)}}:t}),{}))}replaceSuspendIds(t,e){if(t)return this.suspendIds[e]=this.suspendIds[t],delete this.suspendIds[t],e}obtainCompleteSuspense(t){var e,s,n;if(!t.startsWith("<div hidden id="))return;const{from:r,to:i}=null!==(s=null===(e=t.match(/\$RC\("(?<from>[^"]+)","(?<to>[^"]+)"\)/))||void 0===e?void 0:e.groups)&&void 0!==s?s:{},o=this.replaceSuspendIds(r,i);if(!o)return;const{contextId:u,count:d}=null!==(n=this.suspendIds[o])&&void 0!==n?n:{};if(!u||!d)return;const a=this.manager.getStoresRelations(),c=this.manager.createContextId(u),l=[...Array(d)].reduce(((t,e,s)=>{const n=`${c}${s}`;return a.has(n)&&t.push(...a.get(n).ids),t}),[]);if(!l.length)return;const p=JSON.stringify(this.manager.toJSON(l));return Buffer.from(`<script>window.mobxManager.pushInit(${p});<\/script>`,"utf8")}}module.exports=t;
@@ -1,4 +1,4 @@
1
- import { IStorage } from "../types-c6a5e53a.js";
1
+ import { IStorage } from "../types-abd34741.js";
2
2
  interface IAsyncStorage {
3
3
  getItem: (key: string) => Promise<string | null>;
4
4
  setItem: (key: string, value: string) => Promise<void>;
@@ -1,4 +1,4 @@
1
- import { IStorage } from "../types-c6a5e53a.js";
1
+ import { IStorage } from "../types-abd34741.js";
2
2
  /**
3
3
  * Local storage for mobx store manager
4
4
  */
@@ -0,0 +1,50 @@
1
+ import { TInitStore } from "./types-abd34741.js";
2
+ interface IPromise<TReturn> extends Promise<TReturn> {
3
+ status?: 'fulfilled' | 'pending' | 'rejected';
4
+ value?: TReturn;
5
+ reason?: any;
6
+ }
7
+ interface ISuspenseQueryParams {
8
+ fieldName?: string;
9
+ }
10
+ /**
11
+ * Run request and cache promise
12
+ * Sync suspense status between server and client
13
+ */
14
+ declare class SuspenseQuery {
15
+ /**
16
+ * @private
17
+ */
18
+ protected promise: Promise<any> | undefined;
19
+ /**
20
+ * @private
21
+ */
22
+ protected error?: Error;
23
+ /**
24
+ * Target store
25
+ * @private
26
+ */
27
+ protected readonly store: TInitStore;
28
+ /**
29
+ * @protected
30
+ */
31
+ protected readonly params: Required<ISuspenseQueryParams>;
32
+ /**
33
+ * @constructor
34
+ */
35
+ /**
36
+ * @constructor
37
+ */
38
+ constructor(store: TInitStore, { fieldName, ...rest }?: ISuspenseQueryParams);
39
+ /**
40
+ * Run request
41
+ * Save request resolve status
42
+ */
43
+ query: <TReturn>(promise: () => Promise<TReturn>) => TReturn | undefined;
44
+ /**
45
+ * Change status of promise.
46
+ * Throw promise to react suspense
47
+ */
48
+ static run: <TReturn>(promise: IPromise<TReturn> | undefined) => TReturn | undefined;
49
+ }
50
+ export { SuspenseQuery as default };
@@ -0,0 +1 @@
1
+ "use strict";var e=require("mobx");class r{constructor(t,{fieldName:i="isSuspenseDone",...s}={}){Object.defineProperty(this,"promise",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"error",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"store",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"params",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"query",{enumerable:!0,configurable:!0,writable:!0,value:e=>{const{fieldName:t}=this.params;if(!this.store[t])return this.promise||(this.promise=e(),this.promise.then((()=>{this.store[t]=!0}),(e=>{this.store[t]=!0,this.error=e}))),r.run(this.promise)}}),this.store=t,this.params={...s,fieldName:i},e.extendObservable(t,{[i]:!1},{[i]:e.observable})}}Object.defineProperty(r,"run",{enumerable:!0,configurable:!0,writable:!0,value:e=>{if(e){switch(e.status){case"fulfilled":return e.value;case"pending":throw e;case"rejected":throw e.reason;default:e.status="pending",e.then((r=>{e.status="fulfilled",e.value=r}),(r=>{e.status="rejected",e.reason=r}))}throw e}}}),module.exports=r;
@@ -1,4 +1,12 @@
1
1
  import Manager from "./manager.js";
2
+ interface IWindowManager {
3
+ pushInit: (state: Record<string, any>) => void;
4
+ }
5
+ declare global {
6
+ interface Window {
7
+ mobxManager: IWindowManager;
8
+ }
9
+ }
2
10
  interface IConstructorParams<TProps = Record<string, any>> {
3
11
  storeManager: Manager;
4
12
  getStore: <T>(store: IConstructableStore<T>, params?: Partial<IStoreParams>) => T | undefined;
@@ -76,4 +84,7 @@ interface IStoreParams {
76
84
  componentName?: string;
77
85
  componentProps?: Record<string, any>;
78
86
  }
79
- export { IConstructorParams, IStoreLifecycle, IStore, IStorePersisted, TInitStore, IConstructableStore, IStoreConfig, TStoreDefinition, TMapStores, IManagerParams, TWakeup, IStorage, IManagerOptions, TStores, ClassReturnType, StoresType, IStoreParams };
87
+ interface IWithStoreOptions {
88
+ customContextId?: string;
89
+ }
90
+ export { IWindowManager, IConstructorParams, IStoreLifecycle, IStore, IStorePersisted, TInitStore, IConstructableStore, IStoreConfig, TStoreDefinition, TMapStores, IManagerParams, TWakeup, IStorage, IManagerOptions, TStores, ClassReturnType, StoresType, IStoreParams, IWithStoreOptions };
package/lib/wakeup.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { IStorePersisted } from "./types-c6a5e53a.js";
1
+ import { IStorePersisted } from "./types-abd34741.js";
2
2
  /**
3
3
  * Restore store state from initial state
4
4
  */
@@ -1,7 +1,7 @@
1
1
  import { FC } from 'react';
2
- import { TMapStores } from "./types-c6a5e53a.js";
2
+ import { TMapStores, IWithStoreOptions } from "./types-abd34741.js";
3
3
  /**
4
4
  * Make component observable and pass stores as props
5
5
  */
6
- declare const withStores: <T extends Record<string, any>, TS extends TMapStores>(Component: FC<T>, stores: TS, customContextId?: string) => FC<Omit<T, keyof TS>>;
6
+ declare const withStores: <T extends Record<string, any>, TS extends TMapStores>(Component: FC<T>, stores: TS, { customContextId }?: IWithStoreOptions) => FC<Omit<T, keyof TS>>;
7
7
  export { withStores as default };
@@ -1 +1 @@
1
- "use strict";var e=require("hoist-non-react-statics"),t=require("mobx-react-lite"),r=require("react"),a=require("./context.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e),u=n(r);module.exports=(e,n,s)=>{const i=t.observer(e),c=s||e.libStoreContextId,d=e.displayName||e.name,l=({...e})=>{var t;const o=a.useStoreManagerContext(),{parentId:s}=a.useStoreManagerParentContext(),l=null===(t=u.default.useId)||void 0===t?void 0:t.call(u.default),[{contextId:f,initStores:x}]=r.useState((()=>{const t=o.createContextId(c||l);return{contextId:t,initStores:o.createStores(Object.entries(n),s,t,d,e)}}));return r.useEffect((()=>o.mountStores(x)),[x,o]),u.default.createElement(a.StoreManagerParentProvider,{parentId:f},u.default.createElement(i,{...x,...e}))};return o.default(l,e),l.displayName=`Mobx(${d})`,l};
1
+ "use strict";var e=require("hoist-non-react-statics"),t=require("mobx-react-lite"),r=require("react"),n=require("./context.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=a(e),u=a(r);module.exports=(e,a,{customContextId:s}={})=>{const d=t.observer(e),i=s||e.libStoreContextId,c=e.displayName||e.name,l=e=>{var t;const o=n.useStoreManagerContext(),s=n.useStoreManagerParentContext(),l=n.useStoreManagerSuspenseContext(),S=null===(t=u.default.useId)||void 0===t?void 0:t.call(u.default),[{contextId:f,initStores:x}]=r.useState((()=>{const t=o.createContextId(i||l||S);return{contextId:t,initStores:o.createStores(Object.entries(a),s,t,c,e)}}));return r.useEffect((()=>o.mountStores(x)),[x,o]),u.default.createElement(n.StoreManagerSuspenseProvider,{id:null},u.default.createElement(n.StoreManagerParentProvider,{parentId:f},u.default.createElement(d,{...x,...e})))};return o.default(l,e),l.displayName=`Mobx(${c})`,l};
package/package.json CHANGED
@@ -1,9 +1,22 @@
1
1
  {
2
2
  "name": "@lomray/react-mobx-manager",
3
- "version": "1.5.3-beta.1",
3
+ "version": "2.0.0-beta.2",
4
4
  "description": "This package provides Mobx stores manager for react.",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib/index.d.ts",
7
+ "exports": {
8
+ ".": "./lib/index.js",
9
+ "./*": "./lib/*.js"
10
+ },
11
+ "typesVersions": {
12
+ "*": {
13
+ "./*": [
14
+ "lib/*",
15
+ "lib/storages/*",
16
+ "lib/server/*"
17
+ ]
18
+ }
19
+ },
7
20
  "repository": {
8
21
  "type": "git",
9
22
  "url": "https://github.com/Lomray-Software/react-mobx-manager"
@@ -38,12 +51,16 @@
38
51
  "ts:check": "tsc --project ./tsconfig.checks.json --skipLibCheck --noemit",
39
52
  "prepare": "husky install"
40
53
  },
54
+ "dependencies": {
55
+ "@lomray/event-manager": "^1.2.2"
56
+ },
41
57
  "devDependencies": {
42
58
  "@commitlint/cli": "^17.6.3",
43
59
  "@commitlint/config-conventional": "^17.6.3",
44
60
  "@lomray/eslint-config-react": "^3.0.0",
45
61
  "@lomray/prettier-config": "^1.2.0",
46
62
  "@rollup/plugin-terser": "^0.4.3",
63
+ "@types/express": "^4.17.17",
47
64
  "@types/hoist-non-react-statics": "^3.3.1",
48
65
  "@types/react": "^18.2.7",
49
66
  "eslint": "^8.41.0",
@@ -64,8 +81,5 @@
64
81
  "mobx": "^6.9.0",
65
82
  "mobx-react-lite": "^3.4.3",
66
83
  "react": "^18 || ^17"
67
- },
68
- "dependencies": {
69
- "@lomray/event-manager": "^1.2.1"
70
84
  }
71
85
  }
package/.nvmrc DELETED
@@ -1 +0,0 @@
1
- 18.13.0
@@ -1,6 +0,0 @@
1
- {
2
- "extends": "./tsconfig.json",
3
- "include": [
4
- "src/**/*"
5
- ]
6
- }