import React from 'react';
import { ModalButton } from 'react-modal-button';
 
const App = () => (
  <div>
    <h1>React Modal Button!</h1>
 
    <ModalButton
      modal={({ closeModal }) => (
        <div>
          <p>My Modal</p>
          <button onClick={closeModal}>Close</button>
        </div>
      )}
    >
      Button Text Here 🐕
    </ModalButton>
  </div>
);

import { Modal } from 'react-modal-button';
 
class App extends Component {
  state = {
    isModalOpen: false,
  };
 
  openModal = () => {
    this.setState({ isModalOpen: true });
  };
 
  closeModal = () => {
    this.setState({ isModalOpen: false });
  };
 
  render() {
    return (
      <div>
        <button onClick={this.openModal}>Open Modal</button>
 
        <Modal isOpen={this.state.isModalOpen} onClose={this.closeModal}>
          <div>Content</div>
          <button onClick={this.closeModal}>Close Modal</button>
        </Modal>
      </div>
    );
  }
}