Reactjs-Popup

React Popup Component - Modals,Tooltips and Menus —  All in one

travisnpmnpm trendsgithub
github contributorspull requests are welcomecode of conduct
watchersgithub starstweet

Installing / Getting started

This package is available in npm repository as reactjs-popup. It will work correctly with all popular bundlers.

npm install reactjs-popup --save

Using yarn

yarn add reactjs-popup -s

Include the Component

To start using reactjs popup you just need to import the component from the reactjs-popup package.

import React from 'react'
import Popup from 'reactjs-popup'

const PopupExample =  () => (
  <Popup trigger={<button> Trigger</button>} position="right center">
    <div>Popup content here !!</div>
  </Popup>
)

You can also use it with function as children pattern

/* react-live */

const PopupExample =  () => (
  <Popup trigger={<button>Trigger</button>} position="top left">
    {close => (
      <div>
        Content here
        <a className="close" onClick={close}>
          &times;
        </a>
      </div>
    )}
  </Popup>
)

render(<PopupExample />)

You can find more examples in the Use case sections