cupcake-react-modal
cupcake-react-modal
npm i cupcake-react-modal
cupcake-react-modal

cupcake-react-modal

Modal component for React

by cupcake

1.1.2 (see all)License:BSDTypeScript:Not Found
npm i cupcake-react-modal
Readme

Modal

React component for when you need a modal.

Usage

<link href="Modal.css" rel="stylesheet" />
<script src="http://fb.me/react-0.13.3.js" type="application/javascript"></script>
<script src="Modal.js" type="application/javascript"></script>
<Modal
    visible={ Boolean() }
    closable={ Boolean() }
    onShow={ function(){} }
    onHide={ function(){} }>

    <header>
        <h1>Your Modal</h1>
    </header>

    <p>Hello there</p>
</Modal>
React.createElement(Modal, {
    visible: Boolean(),
    closable: Boolean(),
    onShow: function(){},
    onHide: function(){}
},
    React.createElement('header', null, React.createElement('h1', null, "Your Modal")),
    React.createElement('p', null, "Hello there"));
  • visible (Boolean) can be used to toggle visibility of the modal, defaults to false.

  • closable (Boolean) can be used disable rendering of the close button and prevent closing the modal when the overlay is clicked. Defaults to true.

  • onShow (function) is called when the modal becomes visible, defaults to an empty function.

  • onHide (function) is called when the modal becomes not visible, default to an empty function.

What it does

Displays a modal and prevents the document from scrolling while visible.

The modal contains a close button and clicking on the translucent part of the overlay will also cause the modal to hide.

Why

Because React is awesome and modals are useful.

How you can help

File an issue if you find anything isn't working as expected.

Pull requests are always welcome, but you should open an issue before working on a new feature (both to ensure it's within the scope of this project and that it's not already being worked on).

Downloads/wk

0

GitHub Stars

31

LAST COMMIT

NaNyrs ago

MAINTAINERS

1

CONTRIBUTORS

0

OPEN ISSUES

0

OPEN PRs

0
VersionTagPublished
1.1.2
latest
7yrs ago
No alternatives found
No tutorials found
Add a tutorial

Rate & Review

100
No reviews found
Be the first to rate