Props

Your modal components will receive the following props when opened:


interface ModalProps<ReturnValue = any> extends Record<string, any> {
  // whether this modal is the top most modal in the stack
  isOpen: boolean
 
  // the unique id of the modal
  id: string
 
  // the index of the modal in the stack
  index: number
 
  // closes the modal with an optional return value
  close: (value?: ReturnValue) => void
}

Typescript

If you’re using Typescript, you should use this interface to define the props of your modal components.


 
import type { ModalProps } from 'react-easy-modals'
 
// optional
type CloseValue = 'cancel' | 'confirm'
 
interface MyModalProps extends ModalProps<CloseValue> {
  title: string
}
 
function handleConfirm() {
  // uses CloseValue
  close('confirm')
}