react-micro-modal

Accessible, lightweight and configurable modal component with a11y-enabled inspired by Micromodal.js.

Release notes

• NPM: npm install react-micro-modal
• Yarn: yarn add react-micro-modal

Example

Here is a minimal uncontrolled modal example in 3 lines of code.

import React from 'react';
import ReactDOM from 'react-dom';
import MicroModal from 'react-micro-modal';

const App = () => {
  return (
    <MicroModal trigger={handleOpen => <div onClick={handleOpen}>Open!</div>}>
      {handleClose => <button onClick={handleClose}>Close!</button>}
    </MicroModal>
  );
};

ReactDOM.render(<App />, document.getElementById('root'));

Live Playground

For more examples of micro-modal in action, go to https://meemaw.github.io/react-micro-modal.

OR

To run that demo on your own computer:

• Clone this repository
• npm install
• npm run storybook
• Visit http://localhost:9001/