react-subwindow

react-subwindow

A react way to create modals and some useful utility functions

Install

npm install --save react-subwindow

Usage

import React from 'react'

import { createSubwindow } from 'react-subwindow'
import 'react-subwindow/dist/index.css'

const App = () => {
  return (
    <div>
      <button
        onClick={() => createSubwindow(
          <div>
            <h1>Saying hello from modal</h1>
          </div>
        )}
      >Open Modal</button>
      <br/>
      <button
        onClick={
          () => {
            onConfirmationPopup("Are you sure", function confirm() {
              window.alert("This will show up if you click on 'Confirm'")
            })
          }
        }
      >
        Do something after confirmation
      </button>
    </div>
  )
}

export default App

API

import { createSubwindow, onConfirmationPopup, getZIndex, releaseZIndex } from 'react-subwindow'

createSubwindow(reactElement)

Example

createSubwindow(
  <div>
    <h1>Saying hello from modal</h1>
  </div>
)

onConfirmationPopup(title, onConfirm)

Example

onConfirmationPopup(
  "Are you sure", 
  function confirm() {
    window.alert("This will show up if you click on 'Confirm'")
  }
)

getZIndex()

Returns number lowest available z index

Use this method to book a z-index value

releaseZIndex()

Release the last z index returned by getZIndex()

License

MIT Raufoon