ModalProp
Interface of the
modal prop exposed by the library to regular components.TypeScript
type ModalProp<P extends ModalfyParams, Props = unknown> = Props & {
modal: UsableModalProp<P>
}
// ------------------ INTERNAL TYPES ------------------ //
type ModalfyParams = { [key: string]: any }
interface UsableModalProp<
P extends ModalfyParams,
M extends Exclude<keyof P, symbol | number> = Exclude<
keyof P,
symbol | number
>
> {
closeAllModals: (callback?: () => void) => void
closeModal: (modalName?: M, callback?: () => void) => void
closeModals: (modalName: M, callback?: () => void) => boolean
currentModal: M | null
openModal: (modalName: M, params?: P[M], callback?: () => void) => void
}github
closeAllModals: (callback?: () => void) => void
This function closes every open modal.
Example:
modal.closeAllModals()modalfy().closeAllModals()
modalfy().closeAllModals(() => console.log('All modals closed'))
closeModal: (modalName?: M, callback?: () => void) => void
This function closes the currently displayed modal by default. Incidentally, you can also provide a
modalName if you want to close a different modal than the latest opened.Examples:
modalfy().closeModal()
modalfy().closeModal('UserModal', () => console.log('Latest UserModal modal closed'))
modalfy().closeModal(undefined, () => console.log('Latest modal closed'))
closeModals: (modalName: M, callback?: () => void) => boolean
This function closes all the instances of a given modal. You can use it whenever you have the same modal opened several times, to close all of them at once.
Example:
modalfy().closeModals(
'ErrorModal',
() => console.log('All ErrorModal modals closed')
)
Returns: boolean indicating whether or not Modalfy found any open modal corresponding to the provided
modalName (and then closed them).currentModal: M | null
This value returns the current open modal (
null if none).Example:
modal.currentValueopenModal: (modalName: M, params?: P[M], callback?: () => void) => void
This function opens a modal based on the provided
modalName. It will look at the stack passed to <ModalProvider> and add the corresponding component to the current stack of open modals. Alternatively, you can also provide some params that will be accessible to that component.Example:
modalfy().openModal(
'PokedexEntryModal',
{ id: 619, name: 'Lin-Fu' },
() => console.log('PokédexEntryModal modal opened'),
)
Last modified 3mo ago