@lomray/react-mobx-manager 4.2.1 → 4.3.0-beta.1

package/types.d.ts

@@ -19,7 +19,9 @@ interface IConstructorParams<TProps = any> {
     initState?: Record<string, any>;
 }
 interface IStoreLifecycle {
+    init?: () => void | (() => void);
     onDestroy?: () => void;
+    onComponentPropsUpdate?: (props: Record<string, any>) => void;
 }
 interface IStore extends IStoreLifecycle {
     libStoreId?: string;
@@ -30,7 +32,6 @@ interface IStore extends IStoreLifecycle {
     libStoreStatus?: StoreStatus;
     libDestroyTimer?: ReturnType<typeof setTimeout>;
     isGlobal?: boolean;
-    init?: () => void;
     toJSON?: () => Record<string, any>;
 }
 interface IStorePersisted extends IStore {

package/with-stores.js

@@ -1,2 +1,2 @@
-import{useConsistentSuspense as e,useId as t}from"@lomray/consistent-suspense";import o from"hoist-non-react-statics";import{observer as r}from"mobx-react-lite";import s,{useState as a,useEffect as n}from"react";import{useStoreManager as m,useStoreManagerParent as c,StoreManagerParentProvider as i}from"./context.js";const l=(l,u,{customContextId:p}={})=>{const S=r(l),b=p||l.libStoreContextId,d=l.displayName||l.name,x=o=>{const r=m(),l=c(),{suspenseId:p}=e(),x=t(),[{contextId:f,hasFailure:h,touchableStores:I,componentStores:y,mountStores:j}]=a(()=>{const e=b||x,t=r.createStores(Object.entries(u),l,e,p,d,o),{globalStores:s,relativeStores:a,parentStores:n,hasCreationFailure:m}=t,c={...a,...s};return{contextId:e,hasFailure:m,touchableStores:c,componentStores:{...c,...n},mountStores:()=>r.mountStores(e,t)}});return n(j,[j]),s.createElement(i,{parentId:f,touchableStores:I},!h&&s.createElement(S,{...o,...y}))};return o(x,l),x.displayName=`Mobx(${d})`,Object.defineProperty(x,"name",{value:x.displayName,writable:!1,enumerable:!1})};export{l as default};
+import{useConsistentSuspense as e,useId as t}from"@lomray/consistent-suspense";import o from"hoist-non-react-statics";import{observer as r}from"mobx-react-lite";import s,{useState as a,useRef as n,useEffect as c}from"react";import{useStoreManager as m,useStoreManagerParent as l,StoreManagerParentProvider as i}from"./context.js";const u=(u,p,{customContextId:S}={})=>{const b=r(u),d=S||u.libStoreContextId,f=u.displayName||u.name,h=o=>{const r=m(),u=l(),{suspenseId:S}=e(),h=t(),[{contextId:x,hasFailure:I,touchableStores:v,componentStores:y,relativeStores:j,mountStores:C}]=a(()=>{const e=d||h,t=r.createStores(Object.entries(p),u,e,S,f,o),{globalStores:s,relativeStores:a,parentStores:n,hasCreationFailure:c}=t,m={...a,...s};return{contextId:e,hasFailure:c,touchableStores:m,componentStores:{...m,...n},relativeStores:a,mountStores:()=>r.mountStores(e,t)}}),E=n(!1);return c(C,[C]),c(()=>{E.current?Object.values(j).forEach(e=>{e.onComponentPropsUpdate?.(o)}):E.current=!0},[o,j]),s.createElement(i,{parentId:x,touchableStores:v},!I&&s.createElement(b,{...o,...y}))};return o(h,u),h.displayName=`Mobx(${f})`,Object.defineProperty(h,"name",{value:h.displayName,writable:!1,enumerable:!1})};export{u as default};
 //# sourceMappingURL=with-stores.js.map

package/with-stores.js.map

@@ -1 +1 @@
-{"version":3,"file":"with-stores.js","sources":["../src/with-stores.tsx"],"sourcesContent":["import { useConsistentSuspense, useId } from '@lomray/consistent-suspense';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport { observer } from 'mobx-react-lite';\nimport type { FC } from 'react';\nimport React, { useEffect, useState } from 'react';\nimport { useStoreManager, useStoreManagerParent, StoreManagerParentProvider } from './context';\nimport type { TMapStores, IWithStoreOptions } from './types';\n\n/**\n * Make component observable and pass stores as props\n */\nconst withStores = <T extends Record<string, any>, TS extends TMapStores>(\n  Component: FC<T>,\n  stores: TS,\n  { customContextId }: IWithStoreOptions = {},\n): FC<Omit<T, keyof TS>> => {\n  const ObservableComponent = observer(Component) as FC;\n  const manualContextId = customContextId || (Component['libStoreContextId'] as string);\n  const componentName = Component.displayName || Component.name;\n\n  const Element: FC<Omit<T, keyof TS>> = (props) => {\n    const storeManager = useStoreManager();\n    const parentId = useStoreManagerParent();\n    const { suspenseId } = useConsistentSuspense();\n    const id = useId();\n    const [{ contextId, hasFailure, touchableStores, componentStores, mountStores }] = useState(\n      () => {\n        const ctxId = manualContextId || id;\n        const groupedStores = storeManager.createStores(\n          Object.entries(stores),\n          parentId,\n          ctxId,\n          suspenseId,\n          componentName,\n          props,\n        );\n        const { globalStores, relativeStores, parentStores, hasCreationFailure } = groupedStores;\n        const tStores = { ...relativeStores, ...globalStores };\n\n        return {\n          contextId: ctxId,\n          hasFailure: hasCreationFailure,\n          touchableStores: tStores,\n          componentStores: { ...tStores, ...parentStores },\n          mountStores: () => storeManager.mountStores(ctxId, groupedStores),\n        };\n      },\n    );\n\n    useEffect(mountStores, [mountStores]);\n\n    return (\n      <StoreManagerParentProvider parentId={contextId} touchableStores={touchableStores}>\n        {!hasFailure && <ObservableComponent {...props} {...componentStores} />}\n      </StoreManagerParentProvider>\n    );\n  };\n\n  hoistNonReactStatics(Element, Component);\n  Element.displayName = `Mobx(${componentName})`;\n\n  return Object.defineProperty(Element, 'name', {\n    value: Element.displayName,\n    writable: false,\n    enumerable: false,\n  });\n};\n\nexport default withStores;\n"],"names":["withStores","Component","stores","customContextId","ObservableComponent","observer","manualContextId","componentName","displayName","name","Element","props","storeManager","useStoreManager","parentId","useStoreManagerParent","suspenseId","useConsistentSuspense","id","useId","contextId","hasFailure","touchableStores","componentStores","mountStores","useState","ctxId","groupedStores","createStores","Object","entries","globalStores","relativeStores","parentStores","hasCreationFailure","tStores","useEffect","React","createElement","StoreManagerParentProvider","hoistNonReactStatics","defineProperty","value","writable","enumerable"],"mappings":"8TAWA,MAAMA,EAAa,CACjBC,EACAC,GACEC,mBAAuC,CAAA,KAEzC,MAAMC,EAAsBC,EAASJ,GAC/BK,EAAkBH,GAAoBF,EAA6B,kBACnEM,EAAgBN,EAAUO,aAAeP,EAAUQ,KAEnDC,EAAkCC,IACtC,MAAMC,EAAeC,IACfC,EAAWC,KACXC,WAAEA,GAAeC,IACjBC,EAAKC,MACJC,UAAEA,EAASC,WAAEA,EAAUC,gBAAEA,EAAeC,gBAAEA,EAAeC,YAAEA,IAAiBC,EACjF,KACE,MAAMC,EAAQpB,GAAmBY,EAC3BS,EAAgBf,EAAagB,aACjCC,OAAOC,QAAQ5B,GACfY,EACAY,EACAV,EACAT,EACAI,IAEIoB,aAAEA,EAAYC,eAAEA,EAAcC,aAAEA,EAAYC,mBAAEA,GAAuBP,EACrEQ,EAAU,IAAKH,KAAmBD,GAExC,MAAO,CACLX,UAAWM,EACXL,WAAYa,EACZZ,gBAAiBa,EACjBZ,gBAAiB,IAAKY,KAAYF,GAClCT,YAAa,IAAMZ,EAAaY,YAAYE,EAAOC,MAOzD,OAFAS,EAAUZ,EAAa,CAACA,IAGtBa,EAAAC,cAACC,EAA0B,CAACzB,SAAUM,EAAWE,gBAAiBA,IAC9DD,GAAcgB,EAAAC,cAAClC,EAAmB,IAAKO,KAAWY,MAQ1D,OAHAiB,EAAqB9B,EAAST,GAC9BS,EAAQF,YAAc,QAAQD,KAEvBsB,OAAOY,eAAe/B,EAAS,OAAQ,CAC5CgC,MAAOhC,EAAQF,YACfmC,UAAU,EACVC,YAAY"}
+{"version":3,"file":"with-stores.js","sources":["../src/with-stores.tsx"],"sourcesContent":["import { useConsistentSuspense, useId } from '@lomray/consistent-suspense';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport { observer } from 'mobx-react-lite';\nimport type { FC } from 'react';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useStoreManager, useStoreManagerParent, StoreManagerParentProvider } from './context';\nimport type { TMapStores, IWithStoreOptions } from './types';\n\n/**\n * Make component observable and pass stores as props\n */\nconst withStores = <T extends Record<string, any>, TS extends TMapStores>(\n  Component: FC<T>,\n  stores: TS,\n  { customContextId }: IWithStoreOptions = {},\n): FC<Omit<T, keyof TS>> => {\n  const ObservableComponent = observer(Component) as FC;\n  const manualContextId = customContextId || (Component['libStoreContextId'] as string);\n  const componentName = Component.displayName || Component.name;\n\n  const Element: FC<Omit<T, keyof TS>> = (props) => {\n    const storeManager = useStoreManager();\n    const parentId = useStoreManagerParent();\n    const { suspenseId } = useConsistentSuspense();\n    const id = useId();\n    const [\n      { contextId, hasFailure, touchableStores, componentStores, relativeStores, mountStores },\n    ] = useState(() => {\n      const ctxId = manualContextId || id;\n      const groupedStores = storeManager.createStores(\n        Object.entries(stores),\n        parentId,\n        ctxId,\n        suspenseId,\n        componentName,\n        props,\n      );\n      const {\n        globalStores,\n        relativeStores: createdRelativeStores,\n        parentStores,\n        hasCreationFailure,\n      } = groupedStores;\n      const tStores = { ...createdRelativeStores, ...globalStores };\n\n      return {\n        contextId: ctxId,\n        hasFailure: hasCreationFailure,\n        touchableStores: tStores,\n        componentStores: { ...tStores, ...parentStores },\n        relativeStores: createdRelativeStores,\n        mountStores: () => storeManager.mountStores(ctxId, groupedStores),\n      };\n    });\n    const isMounted = useRef(false);\n\n    useEffect(mountStores, [mountStores]);\n    useEffect(() => {\n      if (!isMounted.current) {\n        isMounted.current = true;\n\n        return;\n      }\n\n      Object.values(relativeStores).forEach((store) => {\n        store.onComponentPropsUpdate?.(props);\n      });\n    }, [props, relativeStores]);\n\n    return (\n      <StoreManagerParentProvider parentId={contextId} touchableStores={touchableStores}>\n        {!hasFailure && <ObservableComponent {...props} {...componentStores} />}\n      </StoreManagerParentProvider>\n    );\n  };\n\n  hoistNonReactStatics(Element, Component);\n  Element.displayName = `Mobx(${componentName})`;\n\n  return Object.defineProperty(Element, 'name', {\n    value: Element.displayName,\n    writable: false,\n    enumerable: false,\n  });\n};\n\nexport default withStores;\n"],"names":["withStores","Component","stores","customContextId","ObservableComponent","observer","manualContextId","componentName","displayName","name","Element","props","storeManager","useStoreManager","parentId","useStoreManagerParent","suspenseId","useConsistentSuspense","id","useId","contextId","hasFailure","touchableStores","componentStores","relativeStores","mountStores","useState","ctxId","groupedStores","createStores","Object","entries","globalStores","createdRelativeStores","parentStores","hasCreationFailure","tStores","isMounted","useRef","useEffect","current","values","forEach","store","onComponentPropsUpdate","React","createElement","StoreManagerParentProvider","hoistNonReactStatics","defineProperty","value","writable","enumerable"],"mappings":"0UAWA,MAAMA,EAAa,CACjBC,EACAC,GACEC,mBAAuC,CAAA,KAEzC,MAAMC,EAAsBC,EAASJ,GAC/BK,EAAkBH,GAAoBF,EAA6B,kBACnEM,EAAgBN,EAAUO,aAAeP,EAAUQ,KAEnDC,EAAkCC,IACtC,MAAMC,EAAeC,IACfC,EAAWC,KACXC,WAAEA,GAAeC,IACjBC,EAAKC,MAETC,UAAEA,EAASC,WAAEA,EAAUC,gBAAEA,EAAeC,gBAAEA,EAAeC,eAAEA,EAAcC,YAAEA,IACzEC,EAAS,KACX,MAAMC,EAAQrB,GAAmBY,EAC3BU,EAAgBhB,EAAaiB,aACjCC,OAAOC,QAAQ7B,GACfY,EACAa,EACAX,EACAT,EACAI,IAEIqB,aACJA,EACAR,eAAgBS,EAAqBC,aACrCA,EAAYC,mBACZA,GACEP,EACEQ,EAAU,IAAKH,KAA0BD,GAE/C,MAAO,CACLZ,UAAWO,EACXN,WAAYc,EACZb,gBAAiBc,EACjBb,gBAAiB,IAAKa,KAAYF,GAClCV,eAAgBS,EAChBR,YAAa,IAAMb,EAAaa,YAAYE,EAAOC,MAGjDS,EAAYC,GAAO,GAezB,OAbAC,EAAUd,EAAa,CAACA,IACxBc,EAAU,KACHF,EAAUG,QAMfV,OAAOW,OAAOjB,GAAgBkB,QAASC,IACrCA,EAAMC,yBAAyBjC,KAN/B0B,EAAUG,SAAU,GAQrB,CAAC7B,EAAOa,IAGTqB,EAAAC,cAACC,EAA0B,CAACjC,SAAUM,EAAWE,gBAAiBA,IAC9DD,GAAcwB,EAAAC,cAAC1C,EAAmB,IAAKO,KAAWY,MAQ1D,OAHAyB,EAAqBtC,EAAST,GAC9BS,EAAQF,YAAc,QAAQD,KAEvBuB,OAAOmB,eAAevC,EAAS,OAAQ,CAC5CwC,MAAOxC,EAAQF,YACf2C,UAAU,EACVC,YAAY"}