react-modal-port 0.1.0 → 0.1.2

package/dist/cjs/index.cjs

@@ -0,0 +1,2 @@
+var e=require("react/jsx-runtime"),t=require("react");function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},r.apply(this,arguments)}var n=t.createContext({stack:[],launchModal:function(){},updateStack:function(){},updateState:function(){}});function o(){return t.useContext(n)}exports.ModalContextProvider=function(o){var a=o.children,c=t.useState([]),u=c[0],l=c[1];return e.jsx(n.Provider,{value:{stack:u,launchModal:function(e,t,r){var n=Object.keys(t).reduce(function(e,r){var n=t[r];return e[r]=function(e){try{return Promise.resolve(n(e)).then(function(e){return l(u.slice(0,-1)),e})}catch(e){return Promise.reject(e)}},e},{});l([].concat(u,[{render:e,resolvers:n,onBackdropClickUse:r,state:{}}]))},updateStack:l,updateState:function(e){var t=[].concat(u);t[u.length-1].state=r({},e),l(t)}},children:a})},exports.ModalPort=function(r){var n=r.onModalLaunch,a=r.onModalClose,c=r.render,u=o().stack,l=t.useMemo(function(){return u.length>0?u[u.length-1]:null},[u]),s=t.useCallback(function(e){e.currentTarget===e.target&&(null==l?void 0:l.onBackdropClickUse)&&l.resolvers[l.onBackdropClickUse](e)},[l]);return t.useEffect(function(){l?n&&n():a&&a()},[l,n,a]),l&&e.jsx(c,{onBackdropClick:s,children:l.render(l.resolvers)})||null},exports.useModal=function(){return o().launchModal},exports.useModalContext=o;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/context.tsx","../../src/modal-port.tsx"],"sourcesContent":["import { \n  createContext, \n  useContext, \n  useState, \n  type SyntheticEvent \n} from 'react';\nimport { \n  type ModalStackItem,\n  type ModalContextProperties,\n  type LaunchModal,\n  type LaunchModalResolvers,\n  type ModalState,\n  type UpdateModalState,\n} from '../types';\n\nexport const ModalContext = createContext<ModalContextProperties>({\n  stack: [],\n  launchModal: () => {},\n  updateStack: () => {},\n  updateState: () => {},\n});\n\nexport const ModalContextProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {\n\n  const [ stack, updateStack ] = useState<ModalStackItem[]>([]);\n\n  const launchModal: LaunchModal = (render, resolvers, onBackdropClickUse) => {\n    // Wrap resolvers to update the stack\n    const wrappedResovers = Object.keys(resolvers).reduce((acc, key) => {\n      const resolver = resolvers[key];\n      acc[key] = async (ev?: SyntheticEvent) => {\n        const result = await resolver(ev);\n        updateStack(stack.slice(0, -1));\n        return result;\n      };\n      return acc;\n    }, {} as LaunchModalResolvers);\n    updateStack([\n      ...stack,\n      {\n        render,\n        resolvers: wrappedResovers,\n        onBackdropClickUse,\n        state: {},\n      },\n    ]);\n  };\n\n  const updateState = (newState: ModalState) => {\n    const updatedStack = [\n      ...stack,\n    ];\n    updatedStack[stack.length - 1].state = { ...newState };\n    updateStack(updatedStack);\n  };\n\n  const contextProperties: ModalContextProperties = {\n    stack,\n    launchModal,\n    updateStack,\n    updateState,\n  };\n\n  return <ModalContext.Provider value={contextProperties}>{children}</ModalContext.Provider>;\n\n};\n\n/**\n * Get properties from the modal context\n * @returns {ModalContextProperties} Object with the modal context properties\n */\nexport function useModalContext(): ModalContextProperties {\n  return useContext(ModalContext);\n}\n\n/**\n * Short-hand for `useModalContext().launchModal`\n * @returns {LaunchModal} The launchModal function\n */\nexport function useModal(): LaunchModal {\n  const { launchModal } = useModalContext();\n  return launchModal;\n}\n\n/**\n * Get access to the current modal state and a function to update it\n * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it\n */\nexport function useModalState(): [ ModalState, UpdateModalState ] {\n  const { stack, updateState } = useModalContext();\n  if (stack.length === 0) \n    throw new Error('Trying to access modal state while no modal is open');\n  const state = stack[stack.length - 1].state;\n  return [ state, updateState ];\n}\n","import { \n  type ModalPortProps, \n  type ModalStackItem \n} from \"../types\";\nimport { useModalContext } from \"./context\";\nimport { \n  type SyntheticEvent, \n  useCallback, \n  useEffect, \n  useMemo\n} from \"react\";\n\nconst ModalPort: React.FC<ModalPortProps> = ({\n  onModalLaunch,\n  onModalClose,\n  render: Backdrop\n}) => {\n\n  const { stack } = useModalContext();\n  const currentModal: ModalStackItem | null = useMemo(\n    () => stack.length > 0 ? stack[stack.length - 1] : null,\n    [ stack ]\n  );\n  const onBackdropClick = useCallback((ev: SyntheticEvent) => {\n    if (ev.currentTarget !== ev.target) return;\n    currentModal?.onBackdropClickUse &&\n    currentModal.resolvers[currentModal.onBackdropClickUse](ev);\n  }, [ currentModal ]);\n\n  useEffect(() => {\n    if (currentModal) {\n      onModalLaunch && onModalLaunch();\n    } else {\n      onModalClose && onModalClose();\n    }\n  }, [ currentModal, onModalLaunch, onModalClose ]);\n\n  return currentModal && (\n    <Backdrop onBackdropClick={onBackdropClick}>\n      {currentModal.render(currentModal.resolvers)}\n    </Backdrop>\n  ) || null;\n};\n\nexport default ModalPort;\n"],"names":["ModalContext","createContext","stack","launchModal","updateStack","updateState","useModalContext","useContext","_ref","children","_useState","useState","_jsx","Provider","value","render","resolvers","onBackdropClickUse","wrappedResovers","Object","keys","reduce","acc","key","resolver","ev","Promise","resolve","then","result","slice","e","reject","concat","state","newState","updatedStack","length","_extends","onModalLaunch","onModalClose","Backdrop","currentModal","useMemo","onBackdropClick","useCallback","currentTarget","target","useEffect"],"mappings":"0RAea,IAAAA,EAAeC,EAAAA,cAAsC,CAChEC,MAAO,GACPC,YAAa,WAAK,EAClBC,YAAa,WAAQ,EACrBC,YAAa,WACd,IAmDe,SAAAC,IACd,OAAOC,EAAAA,WAAWP,EACpB,8BAnDoC,SAAHQ,GAA6D,IAAvDC,EAAQD,EAARC,SAErCC,EAA+BC,EAAQA,SAAmB,IAAlDT,EAAKQ,EAAEN,GAAAA,EAAWM,EAAA,GAuC1B,OAAOE,EAAAA,IAACZ,EAAaa,SAAQ,CAACC,MAPoB,CAChDZ,MAAAA,EACAC,YAhC+B,SAACY,EAAQC,EAAWC,GAEnD,IAAMC,EAAkBC,OAAOC,KAAKJ,GAAWK,OAAO,SAACC,EAAKC,GAC1D,IAAMC,EAAWR,EAAUO,GAM3B,OALAD,EAAIC,YAAcE,GAAmB,WAAIC,QAAAC,QAClBH,EAASC,IAAGG,KAA3BC,SAAAA,GAEN,OADAzB,EAAYF,EAAM4B,MAAM,GAAI,IACrBD,CAAO,EAChB,CAAC,MAAAE,GAAA,OAAAL,QAAAM,OAAAD,EAAA,CAAA,EACMT,CACT,EAAG,CAA0B,GAC7BlB,KAAW6B,OACN/B,EACH,CAAA,CACEa,OAAAA,EACAC,UAAWE,EACXD,mBAAAA,EACAiB,MAAO,MAGb,EAaE9B,YAAAA,EACAC,YAZkB,SAAC8B,GACnB,IAAMC,KAAYH,OACb/B,GAELkC,EAAalC,EAAMmC,OAAS,GAAGH,MAAKI,EAAA,CAAA,EAAQH,GAC5C/B,EAAYgC,EACd,GASsD3B,SAAGA,GAE3D,oBCrD4C,SAA7BD,GAIV,IAHH+B,EAAa/B,EAAb+B,cACAC,EAAYhC,EAAZgC,aACQC,EAAQjC,EAAhBO,OAGQb,EAAUI,IAAVJ,MACFwC,EAAsCC,EAAOA,QACjD,WAAA,OAAMzC,EAAMmC,OAAS,EAAInC,EAAMA,EAAMmC,OAAS,GAAK,IAAI,EACvD,CAAEnC,IAEE0C,EAAkBC,EAAWA,YAAC,SAACpB,GAC/BA,EAAGqB,gBAAkBrB,EAAGsB,SAChB,MAAZL,OAAY,EAAZA,EAAczB,qBACdyB,EAAa1B,UAAU0B,EAAazB,oBAAoBQ,EAC1D,EAAG,CAAEiB,IAUL,OARAM,EAAAA,UAAU,WACJN,EACFH,GAAiBA,IAEjBC,GAAgBA,GAEpB,EAAG,CAAEE,EAAcH,EAAeC,IAE3BE,GACL9B,EAAAA,IAAC6B,EAAS,CAAAG,gBAAiBA,EACxBnC,SAAAiC,EAAa3B,OAAO2B,EAAa1B,cAEjC,IACP,8BDuCE,OADwBV,IAAhBH,WAEV"}

package/dist/esm/index.mjs

@@ -0,0 +1,2 @@
+import{jsx as n}from"react/jsx-runtime";import{createContext as r,useState as t,useContext as e,useMemo as c,useCallback as o,useEffect as a}from"react";function u(){return u=Object.assign?Object.assign.bind():function(n){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var e in t)Object.prototype.hasOwnProperty.call(t,e)&&(n[e]=t[e])}return n},u.apply(this,arguments)}var i=r({stack:[],launchModal:function(){},updateStack:function(){},updateState:function(){}}),l=function(r){var e=r.children,c=t([]),o=c[0],a=c[1];return n(i.Provider,{value:{stack:o,launchModal:function(n,r,t){var e=Object.keys(r).reduce(function(n,t){var e=r[t];return n[t]=function(n){try{return Promise.resolve(e(n)).then(function(n){return a(o.slice(0,-1)),n})}catch(n){return Promise.reject(n)}},n},{});a([].concat(o,[{render:n,resolvers:e,onBackdropClickUse:t,state:{}}]))},updateStack:a,updateState:function(n){var r=[].concat(o);r[o.length-1].state=u({},n),a(r)}},children:e})};function s(){return e(i)}function d(){return s().launchModal}var f=function(r){var t=r.onModalLaunch,e=r.onModalClose,u=r.render,i=s().stack,l=c(function(){return i.length>0?i[i.length-1]:null},[i]),d=o(function(n){n.currentTarget===n.target&&(null==l?void 0:l.onBackdropClickUse)&&l.resolvers[l.onBackdropClickUse](n)},[l]);return a(function(){l?t&&t():e&&e()},[l,t,e]),l&&n(u,{onBackdropClick:d,children:l.render(l.resolvers)})||null};export{l as ModalContextProvider,f as ModalPort,d as useModal,s as useModalContext};
+//# sourceMappingURL=index.mjs.map

package/dist/esm/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/context.tsx","../../src/modal-port.tsx"],"sourcesContent":["import { \n  createContext, \n  useContext, \n  useState, \n  type SyntheticEvent \n} from 'react';\nimport { \n  type ModalStackItem,\n  type ModalContextProperties,\n  type LaunchModal,\n  type LaunchModalResolvers,\n  type ModalState,\n  type UpdateModalState,\n} from '../types';\n\nexport const ModalContext = createContext<ModalContextProperties>({\n  stack: [],\n  launchModal: () => {},\n  updateStack: () => {},\n  updateState: () => {},\n});\n\nexport const ModalContextProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {\n\n  const [ stack, updateStack ] = useState<ModalStackItem[]>([]);\n\n  const launchModal: LaunchModal = (render, resolvers, onBackdropClickUse) => {\n    // Wrap resolvers to update the stack\n    const wrappedResovers = Object.keys(resolvers).reduce((acc, key) => {\n      const resolver = resolvers[key];\n      acc[key] = async (ev?: SyntheticEvent) => {\n        const result = await resolver(ev);\n        updateStack(stack.slice(0, -1));\n        return result;\n      };\n      return acc;\n    }, {} as LaunchModalResolvers);\n    updateStack([\n      ...stack,\n      {\n        render,\n        resolvers: wrappedResovers,\n        onBackdropClickUse,\n        state: {},\n      },\n    ]);\n  };\n\n  const updateState = (newState: ModalState) => {\n    const updatedStack = [\n      ...stack,\n    ];\n    updatedStack[stack.length - 1].state = { ...newState };\n    updateStack(updatedStack);\n  };\n\n  const contextProperties: ModalContextProperties = {\n    stack,\n    launchModal,\n    updateStack,\n    updateState,\n  };\n\n  return <ModalContext.Provider value={contextProperties}>{children}</ModalContext.Provider>;\n\n};\n\n/**\n * Get properties from the modal context\n * @returns {ModalContextProperties} Object with the modal context properties\n */\nexport function useModalContext(): ModalContextProperties {\n  return useContext(ModalContext);\n}\n\n/**\n * Short-hand for `useModalContext().launchModal`\n * @returns {LaunchModal} The launchModal function\n */\nexport function useModal(): LaunchModal {\n  const { launchModal } = useModalContext();\n  return launchModal;\n}\n\n/**\n * Get access to the current modal state and a function to update it\n * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it\n */\nexport function useModalState(): [ ModalState, UpdateModalState ] {\n  const { stack, updateState } = useModalContext();\n  if (stack.length === 0) \n    throw new Error('Trying to access modal state while no modal is open');\n  const state = stack[stack.length - 1].state;\n  return [ state, updateState ];\n}\n","import { \n  type ModalPortProps, \n  type ModalStackItem \n} from \"../types\";\nimport { useModalContext } from \"./context\";\nimport { \n  type SyntheticEvent, \n  useCallback, \n  useEffect, \n  useMemo\n} from \"react\";\n\nconst ModalPort: React.FC<ModalPortProps> = ({\n  onModalLaunch,\n  onModalClose,\n  render: Backdrop\n}) => {\n\n  const { stack } = useModalContext();\n  const currentModal: ModalStackItem | null = useMemo(\n    () => stack.length > 0 ? stack[stack.length - 1] : null,\n    [ stack ]\n  );\n  const onBackdropClick = useCallback((ev: SyntheticEvent) => {\n    if (ev.currentTarget !== ev.target) return;\n    currentModal?.onBackdropClickUse &&\n    currentModal.resolvers[currentModal.onBackdropClickUse](ev);\n  }, [ currentModal ]);\n\n  useEffect(() => {\n    if (currentModal) {\n      onModalLaunch && onModalLaunch();\n    } else {\n      onModalClose && onModalClose();\n    }\n  }, [ currentModal, onModalLaunch, onModalClose ]);\n\n  return currentModal && (\n    <Backdrop onBackdropClick={onBackdropClick}>\n      {currentModal.render(currentModal.resolvers)}\n    </Backdrop>\n  ) || null;\n};\n\nexport default ModalPort;\n"],"names":["ModalContext","createContext","stack","launchModal","updateStack","updateState","ModalContextProvider","_ref","children","_useState","useState","_jsx","Provider","value","render","resolvers","onBackdropClickUse","wrappedResovers","Object","keys","reduce","acc","key","resolver","ev","Promise","resolve","then","result","slice","e","reject","concat","state","newState","updatedStack","length","_extends","useModalContext","useContext","useModal","ModalPort","onModalLaunch","onModalClose","Backdrop","currentModal","useMemo","onBackdropClick","useCallback","currentTarget","target","useEffect"],"mappings":"6XAea,IAAAA,EAAeC,EAAsC,CAChEC,MAAO,GACPC,YAAa,WAAK,EAClBC,YAAa,WAAQ,EACrBC,YAAa,WACd,IAEYC,EAAuB,SAAHC,GAA6D,IAAvDC,EAAQD,EAARC,SAErCC,EAA+BC,EAA2B,IAAlDR,EAAKO,EAAEL,GAAAA,EAAWK,EAAA,GAuC1B,OAAOE,EAACX,EAAaY,SAAQ,CAACC,MAPoB,CAChDX,MAAAA,EACAC,YAhC+B,SAACW,EAAQC,EAAWC,GAEnD,IAAMC,EAAkBC,OAAOC,KAAKJ,GAAWK,OAAO,SAACC,EAAKC,GAC1D,IAAMC,EAAWR,EAAUO,GAM3B,OALAD,EAAIC,YAAcE,GAAmB,WAAIC,QAAAC,QAClBH,EAASC,IAAGG,KAA3BC,SAAAA,GAEN,OADAxB,EAAYF,EAAM2B,MAAM,GAAI,IACrBD,CAAO,EAChB,CAAC,MAAAE,GAAA,OAAAL,QAAAM,OAAAD,EAAA,CAAA,EACMT,CACT,EAAG,CAA0B,GAC7BjB,KAAW4B,OACN9B,EACH,CAAA,CACEY,OAAAA,EACAC,UAAWE,EACXD,mBAAAA,EACAiB,MAAO,MAGb,EAaE7B,YAAAA,EACAC,YAZkB,SAAC6B,GACnB,IAAMC,KAAYH,OACb9B,GAELiC,EAAajC,EAAMkC,OAAS,GAAGH,MAAKI,EAAA,CAAA,EAAQH,GAC5C9B,EAAY+B,EACd,GASsD3B,SAAGA,GAE3D,EAMgB,SAAA8B,IACd,OAAOC,EAAWvC,EACpB,UAMgBwC,IAEd,OADwBF,IAAhBnC,WAEV,CCtEM,IAAAsC,EAAsC,SAA7BlC,GAIV,IAHHmC,EAAanC,EAAbmC,cACAC,EAAYpC,EAAZoC,aACQC,EAAQrC,EAAhBO,OAGQZ,EAAUoC,IAAVpC,MACF2C,EAAsCC,EAC1C,WAAA,OAAM5C,EAAMkC,OAAS,EAAIlC,EAAMA,EAAMkC,OAAS,GAAK,IAAI,EACvD,CAAElC,IAEE6C,EAAkBC,EAAY,SAACxB,GAC/BA,EAAGyB,gBAAkBzB,EAAG0B,SAChB,MAAZL,OAAY,EAAZA,EAAc7B,qBACd6B,EAAa9B,UAAU8B,EAAa7B,oBAAoBQ,EAC1D,EAAG,CAAEqB,IAUL,OARAM,EAAU,WACJN,EACFH,GAAiBA,IAEjBC,GAAgBA,GAEpB,EAAG,CAAEE,EAAcH,EAAeC,IAE3BE,GACLlC,EAACiC,EAAS,CAAAG,gBAAiBA,EACxBvC,SAAAqC,EAAa/B,OAAO+B,EAAa9B,cAEjC,IACP"}

package/dist/esm/index.modern.mjs

@@ -0,0 +1,2 @@
+import{jsx as t}from"react/jsx-runtime";import{createContext as e,useState as r,useContext as n,useMemo as c,useCallback as o,useEffect as a}from"react";function l(){return l=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t},l.apply(this,arguments)}const s=e({stack:[],launchModal:()=>{},updateStack:()=>{},updateState:()=>{}}),u=({children:e})=>{const[n,c]=r([]);return t(s.Provider,{value:{stack:n,launchModal:(t,e,r)=>{const o=Object.keys(e).reduce((t,r)=>{const o=e[r];return t[r]=async t=>{const e=await o(t);return c(n.slice(0,-1)),e},t},{});c([...n,{render:t,resolvers:o,onBackdropClickUse:r,state:{}}])},updateStack:c,updateState:t=>{const e=[...n];e[n.length-1].state=l({},t),c(e)}},children:e})};function d(){return n(s)}function i(){const{launchModal:t}=d();return t}const p=({onModalLaunch:e,onModalClose:r,render:n})=>{const{stack:l}=d(),s=c(()=>l.length>0?l[l.length-1]:null,[l]),u=o(t=>{t.currentTarget===t.target&&(null==s?void 0:s.onBackdropClickUse)&&s.resolvers[s.onBackdropClickUse](t)},[s]);return a(()=>{s?e&&e():r&&r()},[s,e,r]),s&&t(n,{onBackdropClick:u,children:s.render(s.resolvers)})||null};export{u as ModalContextProvider,p as ModalPort,i as useModal,d as useModalContext};
+//# sourceMappingURL=index.modern.mjs.map

package/dist/esm/index.modern.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.modern.mjs","sources":["../../src/context.tsx","../../src/modal-port.tsx"],"sourcesContent":["import { \n  createContext, \n  useContext, \n  useState, \n  type SyntheticEvent \n} from 'react';\nimport { \n  type ModalStackItem,\n  type ModalContextProperties,\n  type LaunchModal,\n  type LaunchModalResolvers,\n  type ModalState,\n  type UpdateModalState,\n} from '../types';\n\nexport const ModalContext = createContext<ModalContextProperties>({\n  stack: [],\n  launchModal: () => {},\n  updateStack: () => {},\n  updateState: () => {},\n});\n\nexport const ModalContextProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {\n\n  const [ stack, updateStack ] = useState<ModalStackItem[]>([]);\n\n  const launchModal: LaunchModal = (render, resolvers, onBackdropClickUse) => {\n    // Wrap resolvers to update the stack\n    const wrappedResovers = Object.keys(resolvers).reduce((acc, key) => {\n      const resolver = resolvers[key];\n      acc[key] = async (ev?: SyntheticEvent) => {\n        const result = await resolver(ev);\n        updateStack(stack.slice(0, -1));\n        return result;\n      };\n      return acc;\n    }, {} as LaunchModalResolvers);\n    updateStack([\n      ...stack,\n      {\n        render,\n        resolvers: wrappedResovers,\n        onBackdropClickUse,\n        state: {},\n      },\n    ]);\n  };\n\n  const updateState = (newState: ModalState) => {\n    const updatedStack = [\n      ...stack,\n    ];\n    updatedStack[stack.length - 1].state = { ...newState };\n    updateStack(updatedStack);\n  };\n\n  const contextProperties: ModalContextProperties = {\n    stack,\n    launchModal,\n    updateStack,\n    updateState,\n  };\n\n  return <ModalContext.Provider value={contextProperties}>{children}</ModalContext.Provider>;\n\n};\n\n/**\n * Get properties from the modal context\n * @returns {ModalContextProperties} Object with the modal context properties\n */\nexport function useModalContext(): ModalContextProperties {\n  return useContext(ModalContext);\n}\n\n/**\n * Short-hand for `useModalContext().launchModal`\n * @returns {LaunchModal} The launchModal function\n */\nexport function useModal(): LaunchModal {\n  const { launchModal } = useModalContext();\n  return launchModal;\n}\n\n/**\n * Get access to the current modal state and a function to update it\n * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it\n */\nexport function useModalState(): [ ModalState, UpdateModalState ] {\n  const { stack, updateState } = useModalContext();\n  if (stack.length === 0) \n    throw new Error('Trying to access modal state while no modal is open');\n  const state = stack[stack.length - 1].state;\n  return [ state, updateState ];\n}\n","import { \n  type ModalPortProps, \n  type ModalStackItem \n} from \"../types\";\nimport { useModalContext } from \"./context\";\nimport { \n  type SyntheticEvent, \n  useCallback, \n  useEffect, \n  useMemo\n} from \"react\";\n\nconst ModalPort: React.FC<ModalPortProps> = ({\n  onModalLaunch,\n  onModalClose,\n  render: Backdrop\n}) => {\n\n  const { stack } = useModalContext();\n  const currentModal: ModalStackItem | null = useMemo(\n    () => stack.length > 0 ? stack[stack.length - 1] : null,\n    [ stack ]\n  );\n  const onBackdropClick = useCallback((ev: SyntheticEvent) => {\n    if (ev.currentTarget !== ev.target) return;\n    currentModal?.onBackdropClickUse &&\n    currentModal.resolvers[currentModal.onBackdropClickUse](ev);\n  }, [ currentModal ]);\n\n  useEffect(() => {\n    if (currentModal) {\n      onModalLaunch && onModalLaunch();\n    } else {\n      onModalClose && onModalClose();\n    }\n  }, [ currentModal, onModalLaunch, onModalClose ]);\n\n  return currentModal && (\n    <Backdrop onBackdropClick={onBackdropClick}>\n      {currentModal.render(currentModal.resolvers)}\n    </Backdrop>\n  ) || null;\n};\n\nexport default ModalPort;\n"],"names":["ModalContext","createContext","stack","launchModal","updateStack","updateState","ModalContextProvider","children","useState","_jsx","Provider","value","render","resolvers","onBackdropClickUse","wrappedResovers","Object","keys","reduce","acc","key","resolver","async","result","ev","slice","state","newState","updatedStack","length","_extends","useModalContext","useContext","useModal","ModalPort","onModalLaunch","onModalClose","Backdrop","currentModal","useMemo","onBackdropClick","useCallback","currentTarget","target","useEffect"],"mappings":"6XAea,MAAAA,EAAeC,EAAsC,CAChEC,MAAO,GACPC,YAAaA,OACbC,YAAaA,OACbC,YAAaA,SAGFC,EAAuBA,EAAGC,eAErC,MAAQL,EAAOE,GAAgBI,EAA2B,IAuC1D,OAAOC,EAACT,EAAaU,SAAQ,CAACC,MAPoB,CAChDT,QACAC,YAhC+BA,CAACS,EAAQC,EAAWC,KAEnD,MAAMC,EAAkBC,OAAOC,KAAKJ,GAAWK,OAAO,CAACC,EAAKC,KAC1D,MAAMC,EAAWR,EAAUO,GAM3B,OALAD,EAAIC,GAAOE,UACT,MAAMC,QAAeF,EAASG,GAE9B,OADApB,EAAYF,EAAMuB,MAAM,GAAI,IACrBF,GAEFJ,GACN,CAA0B,GAC7Bf,EAAY,IACPF,EACH,CACEU,SACAC,UAAWE,EACXD,qBACAY,MAAO,CAAA,IAGb,EAaEtB,cACAC,YAZmBsB,IACnB,MAAMC,EAAe,IAChB1B,GAEL0B,EAAa1B,EAAM2B,OAAS,GAAGH,MAAKI,EAAA,CAAA,EAAQH,GAC5CvB,EAAYwB,EACd,GASsDrB,SAAGA,GAAQ,EAQnD,SAAAwB,IACd,OAAOC,EAAWhC,EACpB,CAMgB,SAAAiC,IACd,MAAM9B,YAAEA,GAAgB4B,IACxB,OAAO5B,CACT,CCtEM,MAAA+B,EAAsCA,EAC1CC,gBACAC,eACAxB,OAAQyB,MAGR,MAAMnC,MAAEA,GAAU6B,IACZO,EAAsCC,EAC1C,IAAMrC,EAAM2B,OAAS,EAAI3B,EAAMA,EAAM2B,OAAS,GAAK,KACnD,CAAE3B,IAEEsC,EAAkBC,EAAajB,IAC/BA,EAAGkB,gBAAkBlB,EAAGmB,eAC5BL,SAAAA,EAAcxB,qBACdwB,EAAazB,UAAUyB,EAAaxB,oBAAoBU,EAAE,EACzD,CAAEc,IAUL,OARAM,EAAU,KACJN,EACFH,GAAiBA,IAEjBC,GAAgBA,GAClB,EACC,CAAEE,EAAcH,EAAeC,IAE3BE,GACL7B,EAAC4B,EAAS,CAAAG,gBAAiBA,EACxBjC,SAAA+B,EAAa1B,OAAO0B,EAAazB,cAEjC"}

package/dist/umd/index.umd.js

@@ -0,0 +1,2 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react/jsx-runtime"),require("react")):"function"==typeof define&&define.amd?define(["exports","react/jsx-runtime","react"],t):t((e||self).reactModalPort={},e.jsxRuntime,e.react)}(this,function(e,t,n){function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},r.apply(this,arguments)}var o=n.createContext({stack:[],launchModal:function(){},updateStack:function(){},updateState:function(){}});function c(){return n.useContext(o)}e.ModalContextProvider=function(e){var c=e.children,a=n.useState([]),u=a[0],i=a[1];return t.jsx(o.Provider,{value:{stack:u,launchModal:function(e,t,n){var r=Object.keys(t).reduce(function(e,n){var r=t[n];return e[n]=function(e){try{return Promise.resolve(r(e)).then(function(e){return i(u.slice(0,-1)),e})}catch(e){return Promise.reject(e)}},e},{});i([].concat(u,[{render:e,resolvers:r,onBackdropClickUse:n,state:{}}]))},updateStack:i,updateState:function(e){var t=[].concat(u);t[u.length-1].state=r({},e),i(t)}},children:c})},e.ModalPort=function(e){var r=e.onModalLaunch,o=e.onModalClose,a=e.render,u=c().stack,i=n.useMemo(function(){return u.length>0?u[u.length-1]:null},[u]),l=n.useCallback(function(e){e.currentTarget===e.target&&(null==i?void 0:i.onBackdropClickUse)&&i.resolvers[i.onBackdropClickUse](e)},[i]);return n.useEffect(function(){i?r&&r():o&&o()},[i,r,o]),i&&t.jsx(a,{onBackdropClick:l,children:i.render(i.resolvers)})||null},e.useModal=function(){return c().launchModal},e.useModalContext=c});
+//# sourceMappingURL=index.umd.js.map

package/dist/umd/index.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.js","sources":["../../src/context.tsx","../../src/modal-port.tsx"],"sourcesContent":["import { \n  createContext, \n  useContext, \n  useState, \n  type SyntheticEvent \n} from 'react';\nimport { \n  type ModalStackItem,\n  type ModalContextProperties,\n  type LaunchModal,\n  type LaunchModalResolvers,\n  type ModalState,\n  type UpdateModalState,\n} from '../types';\n\nexport const ModalContext = createContext<ModalContextProperties>({\n  stack: [],\n  launchModal: () => {},\n  updateStack: () => {},\n  updateState: () => {},\n});\n\nexport const ModalContextProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {\n\n  const [ stack, updateStack ] = useState<ModalStackItem[]>([]);\n\n  const launchModal: LaunchModal = (render, resolvers, onBackdropClickUse) => {\n    // Wrap resolvers to update the stack\n    const wrappedResovers = Object.keys(resolvers).reduce((acc, key) => {\n      const resolver = resolvers[key];\n      acc[key] = async (ev?: SyntheticEvent) => {\n        const result = await resolver(ev);\n        updateStack(stack.slice(0, -1));\n        return result;\n      };\n      return acc;\n    }, {} as LaunchModalResolvers);\n    updateStack([\n      ...stack,\n      {\n        render,\n        resolvers: wrappedResovers,\n        onBackdropClickUse,\n        state: {},\n      },\n    ]);\n  };\n\n  const updateState = (newState: ModalState) => {\n    const updatedStack = [\n      ...stack,\n    ];\n    updatedStack[stack.length - 1].state = { ...newState };\n    updateStack(updatedStack);\n  };\n\n  const contextProperties: ModalContextProperties = {\n    stack,\n    launchModal,\n    updateStack,\n    updateState,\n  };\n\n  return <ModalContext.Provider value={contextProperties}>{children}</ModalContext.Provider>;\n\n};\n\n/**\n * Get properties from the modal context\n * @returns {ModalContextProperties} Object with the modal context properties\n */\nexport function useModalContext(): ModalContextProperties {\n  return useContext(ModalContext);\n}\n\n/**\n * Short-hand for `useModalContext().launchModal`\n * @returns {LaunchModal} The launchModal function\n */\nexport function useModal(): LaunchModal {\n  const { launchModal } = useModalContext();\n  return launchModal;\n}\n\n/**\n * Get access to the current modal state and a function to update it\n * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it\n */\nexport function useModalState(): [ ModalState, UpdateModalState ] {\n  const { stack, updateState } = useModalContext();\n  if (stack.length === 0) \n    throw new Error('Trying to access modal state while no modal is open');\n  const state = stack[stack.length - 1].state;\n  return [ state, updateState ];\n}\n","import { \n  type ModalPortProps, \n  type ModalStackItem \n} from \"../types\";\nimport { useModalContext } from \"./context\";\nimport { \n  type SyntheticEvent, \n  useCallback, \n  useEffect, \n  useMemo\n} from \"react\";\n\nconst ModalPort: React.FC<ModalPortProps> = ({\n  onModalLaunch,\n  onModalClose,\n  render: Backdrop\n}) => {\n\n  const { stack } = useModalContext();\n  const currentModal: ModalStackItem | null = useMemo(\n    () => stack.length > 0 ? stack[stack.length - 1] : null,\n    [ stack ]\n  );\n  const onBackdropClick = useCallback((ev: SyntheticEvent) => {\n    if (ev.currentTarget !== ev.target) return;\n    currentModal?.onBackdropClickUse &&\n    currentModal.resolvers[currentModal.onBackdropClickUse](ev);\n  }, [ currentModal ]);\n\n  useEffect(() => {\n    if (currentModal) {\n      onModalLaunch && onModalLaunch();\n    } else {\n      onModalClose && onModalClose();\n    }\n  }, [ currentModal, onModalLaunch, onModalClose ]);\n\n  return currentModal && (\n    <Backdrop onBackdropClick={onBackdropClick}>\n      {currentModal.render(currentModal.resolvers)}\n    </Backdrop>\n  ) || null;\n};\n\nexport default ModalPort;\n"],"names":["ModalContext","createContext","stack","launchModal","updateStack","updateState","useModalContext","useContext","_ref","children","_useState","useState","_jsx","Provider","value","render","resolvers","onBackdropClickUse","wrappedResovers","Object","keys","reduce","acc","key","resolver","ev","Promise","resolve","then","result","slice","e","reject","concat","state","newState","updatedStack","length","_extends","onModalLaunch","onModalClose","Backdrop","currentModal","useMemo","onBackdropClick","useCallback","currentTarget","target","useEffect"],"mappings":"+iBAea,IAAAA,EAAeC,EAAAA,cAAsC,CAChEC,MAAO,GACPC,YAAa,WAAK,EAClBC,YAAa,WAAQ,EACrBC,YAAa,WACd,IAmDe,SAAAC,IACd,OAAOC,EAAAA,WAAWP,EACpB,wBAnDoC,SAAHQ,GAA6D,IAAvDC,EAAQD,EAARC,SAErCC,EAA+BC,EAAQA,SAAmB,IAAlDT,EAAKQ,EAAEN,GAAAA,EAAWM,EAAA,GAuC1B,OAAOE,EAAAA,IAACZ,EAAaa,SAAQ,CAACC,MAPoB,CAChDZ,MAAAA,EACAC,YAhC+B,SAACY,EAAQC,EAAWC,GAEnD,IAAMC,EAAkBC,OAAOC,KAAKJ,GAAWK,OAAO,SAACC,EAAKC,GAC1D,IAAMC,EAAWR,EAAUO,GAM3B,OALAD,EAAIC,YAAcE,GAAmB,WAAIC,QAAAC,QAClBH,EAASC,IAAGG,KAA3BC,SAAAA,GAEN,OADAzB,EAAYF,EAAM4B,MAAM,GAAI,IACrBD,CAAO,EAChB,CAAC,MAAAE,GAAA,OAAAL,QAAAM,OAAAD,EAAA,CAAA,EACMT,CACT,EAAG,CAA0B,GAC7BlB,KAAW6B,OACN/B,EACH,CAAA,CACEa,OAAAA,EACAC,UAAWE,EACXD,mBAAAA,EACAiB,MAAO,MAGb,EAaE9B,YAAAA,EACAC,YAZkB,SAAC8B,GACnB,IAAMC,KAAYH,OACb/B,GAELkC,EAAalC,EAAMmC,OAAS,GAAGH,MAAKI,EAAA,CAAA,EAAQH,GAC5C/B,EAAYgC,EACd,GASsD3B,SAAGA,GAE3D,cCrD4C,SAA7BD,GAIV,IAHH+B,EAAa/B,EAAb+B,cACAC,EAAYhC,EAAZgC,aACQC,EAAQjC,EAAhBO,OAGQb,EAAUI,IAAVJ,MACFwC,EAAsCC,EAAOA,QACjD,WAAA,OAAMzC,EAAMmC,OAAS,EAAInC,EAAMA,EAAMmC,OAAS,GAAK,IAAI,EACvD,CAAEnC,IAEE0C,EAAkBC,EAAWA,YAAC,SAACpB,GAC/BA,EAAGqB,gBAAkBrB,EAAGsB,SAChB,MAAZL,OAAY,EAAZA,EAAczB,qBACdyB,EAAa1B,UAAU0B,EAAazB,oBAAoBQ,EAC1D,EAAG,CAAEiB,IAUL,OARAM,EAAAA,UAAU,WACJN,EACFH,GAAiBA,IAEjBC,GAAgBA,GAEpB,EAAG,CAAEE,EAAcH,EAAeC,IAE3BE,GACL9B,EAAAA,IAAC6B,EAAS,CAAAG,gBAAiBA,EACxBnC,SAAAiC,EAAa3B,OAAO2B,EAAa1B,cAEjC,IACP,wBDuCE,OADwBV,IAAhBH,WAEV"}

package/package.json

@@ -1,14 +1,17 @@
 {
   "name": "react-modal-port",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Launch modals from any React component.",
   "type": "module",
-  "types": "./types/index.d.ts",
-  "main": "./dist/cjs/index.js",
-  "module": "./dist/esm/index.js",
+  "source": "src/index.ts",
+  "types": "types/index.d.ts",
+  "main": "dist/cjs/index.cjs",
+  "main:umd": "dist/umd/index.js",
+  "module": "dist/esm/index.mjs",
   "exports": {
-    "import": "./dist/esm/index.js",
-    "require": "./dist/cjs/index.js",
+    "default": "./dist/esm/index.modern.mjs",
+    "import": "./dist/esm/index.mjs",
+    "require": "./dist/cjs/index.cjs",
     "types": "./types/index.d.ts"
   },
   "files": [
@@ -16,9 +19,11 @@
     "types"
   ],
   "scripts": {
-    "build": "npm run build:esm && npm run build:cjs",
-    "build:esm": "tsc --outDir dist/esm --module esnext",
-    "build:cjs": "tsc --outDir dist/cjs --module commonjs",
+    "build": "npm run build:esm && npm run build:esm-modern && npm run build:cjs && npm run build:umd",
+    "build:esm": "microbundle -o dist/esm/index.mjs --format esm",
+    "build:esm-modern": "microbundle -o dist/esm/index.modern.mjs --format modern",
+    "build:cjs": "microbundle -o dist/cjs/index.cjs --format cjs",
+    "build:umd": "microbundle -o dist/umd/index.js --format umd",
     "prepare": "npm run build",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
@@ -46,6 +51,7 @@
   "devDependencies": {
     "@types/react": "^18",
     "@types/react-dom": "^18.2.19",
+    "microbundle": "^0.15.1",
     "react": "^18.2.0",
     "react-dom": "^18",
     "tslib": "^2.6.2",

package/readme.md

@@ -112,7 +112,7 @@ The `launchModal` function expects the following arguments:
 | Argument | Type | Description |
 |----------|------|-------------|
 | render | `React.FC` | A function that renders the modal and returns a `ReactNode`. |
-| resolvers | `{ [key: string]: (ev?: SyntheticEvent) => Promise<any>\|void }` | An object of resolver functions that will be passed as props to `render`. |
+| resolvers | `{ [key: string]: (...args: any[]) => Promise<void>\|void }` | An object of resolver functions that will be passed as props to `render`. |
 | onBackdropClickUse | `string` | Optional: The key of the resolver function in the `resolvers` object that should be passed to the backdrop component’s `onBackdropClick` prop. |
 
 Modals can be created and designed to fully fit your needs. The only requirement is to define the functions to resolve them, for example, when clicking a button. The modal component for the example above could look like this:

package/dist/cjs/context.js

@@ -1,140 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useModalState = exports.useModal = exports.useModalContext = exports.ModalContextProvider = exports.ModalContext = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-exports.ModalContext = (0, react_1.createContext)({
-    stack: [],
-    launchModal: function () { },
-    updateStack: function () { },
-    updateState: function () { },
-});
-var ModalContextProvider = function (_a) {
-    var children = _a.children;
-    var _b = (0, react_1.useState)([]), stack = _b[0], updateStack = _b[1];
-    var launchModal = function (render, resolvers, onBackdropClickUse) {
-        // Wrap resolvers to update the stack
-        var wrappedResovers = Object.keys(resolvers).reduce(function (acc, key) {
-            var resolver = resolvers[key];
-            acc[key] = function (ev) { return __awaiter(void 0, void 0, void 0, function () {
-                var result;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, resolver(ev)];
-                        case 1:
-                            result = _a.sent();
-                            updateStack(stack.slice(0, -1));
-                            return [2 /*return*/, result];
-                    }
-                });
-            }); };
-            return acc;
-        }, {});
-        updateStack(__spreadArray(__spreadArray([], stack, true), [
-            {
-                render: render,
-                resolvers: wrappedResovers,
-                onBackdropClickUse: onBackdropClickUse,
-                state: {},
-            },
-        ], false));
-    };
-    var updateState = function (newState) {
-        var updatedStack = __spreadArray([], stack, true);
-        updatedStack[stack.length - 1].state = __assign({}, newState);
-        updateStack(updatedStack);
-    };
-    var contextProperties = {
-        stack: stack,
-        launchModal: launchModal,
-        updateStack: updateStack,
-        updateState: updateState,
-    };
-    return (0, jsx_runtime_1.jsx)(exports.ModalContext.Provider, { value: contextProperties, children: children });
-};
-exports.ModalContextProvider = ModalContextProvider;
-/**
- * Get properties from the modal context
- * @returns {ModalContextProperties} Object with the modal context properties
- */
-function useModalContext() {
-    return (0, react_1.useContext)(exports.ModalContext);
-}
-exports.useModalContext = useModalContext;
-/**
- * Short-hand for `useModalContext().launchModal`
- * @returns {LaunchModal} The launchModal function
- */
-function useModal() {
-    var launchModal = useModalContext().launchModal;
-    return launchModal;
-}
-exports.useModal = useModal;
-/**
- * Get access to the current modal state and a function to update it
- * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it
- */
-function useModalState() {
-    var _a = useModalContext(), stack = _a.stack, updateState = _a.updateState;
-    if (stack.length === 0)
-        throw new Error('Trying to access modal state while no modal is open');
-    var state = stack[stack.length - 1].state;
-    return [state, updateState];
-}
-exports.useModalState = useModalState;

package/dist/cjs/index.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ModalPort = exports.useModal = exports.useModalContext = exports.ModalContextProvider = void 0;
-var context_1 = require("./context");
-Object.defineProperty(exports, "ModalContextProvider", { enumerable: true, get: function () { return context_1.ModalContextProvider; } });
-Object.defineProperty(exports, "useModalContext", { enumerable: true, get: function () { return context_1.useModalContext; } });
-Object.defineProperty(exports, "useModal", { enumerable: true, get: function () { return context_1.useModal; } });
-var modal_port_1 = require("./modal-port");
-Object.defineProperty(exports, "ModalPort", { enumerable: true, get: function () { return __importDefault(modal_port_1).default; } });

package/dist/cjs/modal-port.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var jsx_runtime_1 = require("react/jsx-runtime");
-var context_1 = require("./context");
-var react_1 = require("react");
-var ModalPort = function (_a) {
-    var onModalLaunch = _a.onModalLaunch, onModalClose = _a.onModalClose, Backdrop = _a.render;
-    var stack = (0, context_1.useModalContext)().stack;
-    var currentModal = (0, react_1.useMemo)(function () { return stack.length > 0 ? stack[stack.length - 1] : null; }, [stack]);
-    var onBackdropClick = (0, react_1.useCallback)(function (ev) {
-        if (ev.currentTarget !== ev.target)
-            return;
-        (currentModal === null || currentModal === void 0 ? void 0 : currentModal.onBackdropClickUse) &&
-            currentModal.resolvers[currentModal.onBackdropClickUse](ev);
-    }, [currentModal]);
-    (0, react_1.useEffect)(function () {
-        if (currentModal) {
-            onModalLaunch && onModalLaunch();
-        }
-        else {
-            onModalClose && onModalClose();
-        }
-    }, [currentModal, onModalLaunch, onModalClose]);
-    return currentModal && ((0, jsx_runtime_1.jsx)(Backdrop, { onBackdropClick: onBackdropClick, children: currentModal.render(currentModal.resolvers) })) || null;
-};
-exports.default = ModalPort;

package/dist/esm/context.js

@@ -1,133 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext, useContext, useState } from 'react';
-export var ModalContext = createContext({
-    stack: [],
-    launchModal: function () { },
-    updateStack: function () { },
-    updateState: function () { },
-});
-export var ModalContextProvider = function (_a) {
-    var children = _a.children;
-    var _b = useState([]), stack = _b[0], updateStack = _b[1];
-    var launchModal = function (render, resolvers, onBackdropClickUse) {
-        // Wrap resolvers to update the stack
-        var wrappedResovers = Object.keys(resolvers).reduce(function (acc, key) {
-            var resolver = resolvers[key];
-            acc[key] = function (ev) { return __awaiter(void 0, void 0, void 0, function () {
-                var result;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0: return [4 /*yield*/, resolver(ev)];
-                        case 1:
-                            result = _a.sent();
-                            updateStack(stack.slice(0, -1));
-                            return [2 /*return*/, result];
-                    }
-                });
-            }); };
-            return acc;
-        }, {});
-        updateStack(__spreadArray(__spreadArray([], stack, true), [
-            {
-                render: render,
-                resolvers: wrappedResovers,
-                onBackdropClickUse: onBackdropClickUse,
-                state: {},
-            },
-        ], false));
-    };
-    var updateState = function (newState) {
-        var updatedStack = __spreadArray([], stack, true);
-        updatedStack[stack.length - 1].state = __assign({}, newState);
-        updateStack(updatedStack);
-    };
-    var contextProperties = {
-        stack: stack,
-        launchModal: launchModal,
-        updateStack: updateStack,
-        updateState: updateState,
-    };
-    return _jsx(ModalContext.Provider, { value: contextProperties, children: children });
-};
-/**
- * Get properties from the modal context
- * @returns {ModalContextProperties} Object with the modal context properties
- */
-export function useModalContext() {
-    return useContext(ModalContext);
-}
-/**
- * Short-hand for `useModalContext().launchModal`
- * @returns {LaunchModal} The launchModal function
- */
-export function useModal() {
-    var launchModal = useModalContext().launchModal;
-    return launchModal;
-}
-/**
- * Get access to the current modal state and a function to update it
- * @returns {[ ModalState, UpdateModalState ]} A tuple with the current modal state and a function to update it
- */
-export function useModalState() {
-    var _a = useModalContext(), stack = _a.stack, updateState = _a.updateState;
-    if (stack.length === 0)
-        throw new Error('Trying to access modal state while no modal is open');
-    var state = stack[stack.length - 1].state;
-    return [state, updateState];
-}

package/dist/esm/index.js

@@ -1,2 +0,0 @@
-export { ModalContextProvider, useModalContext, useModal, } from './context';
-export { default as ModalPort } from './modal-port';

package/dist/esm/modal-port.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useModalContext } from "./context";
-import { useCallback, useEffect, useMemo } from "react";
-var ModalPort = function (_a) {
-    var onModalLaunch = _a.onModalLaunch, onModalClose = _a.onModalClose, Backdrop = _a.render;
-    var stack = useModalContext().stack;
-    var currentModal = useMemo(function () { return stack.length > 0 ? stack[stack.length - 1] : null; }, [stack]);
-    var onBackdropClick = useCallback(function (ev) {
-        if (ev.currentTarget !== ev.target)
-            return;
-        (currentModal === null || currentModal === void 0 ? void 0 : currentModal.onBackdropClickUse) &&
-            currentModal.resolvers[currentModal.onBackdropClickUse](ev);
-    }, [currentModal]);
-    useEffect(function () {
-        if (currentModal) {
-            onModalLaunch && onModalLaunch();
-        }
-        else {
-            onModalClose && onModalClose();
-        }
-    }, [currentModal, onModalLaunch, onModalClose]);
-    return currentModal && (_jsx(Backdrop, { onBackdropClick: onBackdropClick, children: currentModal.render(currentModal.resolvers) })) || null;
-};
-export default ModalPort;