@comparaonline/ui-modal

Styled version of [React Modal](http://reactcommunity.org/react-modal/)

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
@comparaonline/ui-modal
Minified + gzip package size for @comparaonline/ui-modal in KB

Readme

@comparaonline/ui-modal

Styled version of React Modal

Installation

It has a react-modal as peer dependency.

yarn add react-modal @comparaonline/ui-modal

Usage

import Modal from '@comparaonline/ui-modal';

props => <Modal {...props} />;

Proptypes

Name Type Default Description
renderTitle func () => {} Function that renders a component to be used as the modal title
renderDismissAction func () => {} Function that renders a component to be used as the dismiss (close) action
renderConfirmAction func () => {} Function that renders a component to be used as the affirmative action

For more information about the props see the React Modal usage summary.

Avoid the body scroll

If you need to block the scroll of the background content, add this classes to your global CSS. You may need to change the class names if you set a different bodyOpenClassName or htmlOpenClassName values in the Modal component.

.ReactModal__Body--open,
.ReactModal__Html--open {
  overflow: hidden;
}

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.