deni-react-modal

A cool way to show a modal using React

DEMOS

Usage

Create your modal by extending from DeniReactModal like this:

import { DeniReactModal } from 'deni-react-modal'

class SimpleModal extends DeniReactModal {

  getConfig() {
    return {
      title: 'Simple Modal',
      width: '650px',
    }
  }

  render() {
    return (
      <div>
        React Components Here
      </div>
    )
  }

}

export default SimpleModal;

..and then call that class like this:

import SimpleModal from './SimpleModal'
...
let modal = new SimpleModal();
modal.show();

Theming

You can use themes by passing in show method like this:

...
modal.show('indigo');

Or using "setTheme" method like this:

...
modal.setTheme('indigo');

Available themes:

• red
• pink
• purple
• deep-purple
• indigo
• blue
• light-blue
• cyan
• teal
• green
• light-green
• lime
• yellow
• amber
• orange
• deep-orange
• brown
• grey
• blue-grey

Author

Denimar de Moraes ([email protected]) is a full-stack developper at the Wplex, Florianópolis, Santa Catarina, Brazil.