React Native Modalfy
v2.x
v2.x
  • Getting started
  • Installation
  • Guides
    • Creating a stack
    • Opening & closing
    • Passing params
    • Type checking with TypeScript
    • Subscribing to events
    • Using outside React
    • Upgrading from v1.x
  • API Reference
    • Types
      • ModalStackConfig
      • ModalOptions
      • ModalProp
      • ModalComponentProp
      • ModalComponentWithOptions
    • ModalProvider
    • createModalStack
    • useModal
    • withModal
    • modalfy
  • Blog
    • Announcing Modalfy v2
    • Stacks on stacks in React Native
    • Introducing a Modal Citizen
  • Others
    • Help
    • Contributing
    • Changelog
    • Github
Powered by GitBook
On this page

Was this helpful?

  1. API Reference

modalfy

PreviouswithModalNextAnnouncing Modalfy v2

Last updated 4 years ago

Was this helpful?

Function that exposes Modalfy's API outside of React's context.

Notes:

  • Do not use if you're inside a React component. Please consider or instead.

  • You can't pass a modalName to closeModal() to close a modal that's not the currently displayed one. This is due to a current API limitation especially in the case where you'd have several modals with the same name opened, as Modalfy can't safely determine which one you wanted to close.

The object returned by modalfy()is covered in .

const modalfy = <
  P extends ModalfyParamsm,
  M extends keyof P
>(): UsableModalProp<P> => {
  const context: UsableModalProp<P> = React.useContext(ModalContext)
  return {
    closeAllModals: ModalState.closeAllModals,

    closeModal: () => ModalState.closeModal(),

    closeModals: (modalName: M) => ModalState.closeModals(modalName),

    currentModal: ModalState.getState<P>()?.currentModal,

    openModal: (modalName: M, params?: P[M]) =>
      ModalState.openModal(modalName, params, true),
  }
}
import { ModalStackParamsList } from 'App'
// ...
const { openModal } = modalfy<ModalStackParamsList>()

If you're using TypeScript and have , you can get some nice autocomplete by utilising modalfy()like this:

useModal()
withModal()
ModalProp
your params types
Types have been simplified for the sake of clarity. Refer to the exact definitions here.
https://github.com/colorfy-software/react-native-modalfy/blob/master/lib/ModalState.ts#L253