react-responsive-modal
A simple responsive react modal.
You can find a demo here. Or you can run examples
git clone https://github.com/pradel/react-responsive-modal
cd react-responsive-modal
yarn
yarn run build:examples
open examples/index.html
Installation
With npm: npm install react-responsive-modal --save
Or with yarn: yarn add react-responsive-modal
Usage
;;; Component { superprops; thisonOpenModal = thisonOpenModal; thisonCloseModal = thisonCloseModal; thisstate = open: false ; } { this; } { this; } { const open = thisstate; return <div> <button onClick=thisonOpenModal>Open modal</button> <Modal open=open onClose=thisonCloseModal little> <h2>Simple centered modal</h2> </Modal> </div> ; } ReactDOM;
Props
open
: (Bool) Required Control if the modal is open or not.
onClose
: (Function) Required Fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.
closeOnEsc
: (Bool) default: true is the modal closable when user press esc key.
closeOnOverlayClick
: (Bool) default: true is the modal closable when user click on overlay.
little
: (Bool) Is the dialog centered When you don't have a lot of content.
showCloseIcon
: (Bool) default: true Show the close icon.
closeIconSize
: (Number) default: 28 Close icon size.
children
: (Node) The content of the modal.
overlayClassName
: (String) Classname for overlay div.
modalClassName
: (String) Classname for modal content div.
closeIconClassName
: (String) Classname for close icon svg.
overlayStyle
: (Object) Inline style for overlay div.
modalStyle
: (Object) Inline style for modal content div.