react-modal-component-tool v0.1.4

React Modal Component Tool

Use this modal if you want a free, easy-to-use component. Several parameters will be added over time.

Installation

You can install the component by using :

npm i react-modal-component-tool

Usage

Open your React project and go to the file requiring the modal component and import the modal :

import { Modal } from "react-modal-component-tool";

Props (params)

How to use it

Once your import is complete, set up a useState to determine the modal toggle

    const [ setModalOpen, isModalOpen ] = useState(false);
    const handleClick = () => {
        isModalOpen(!setModalOpen);
    }

Then, in your return, set a condition to find out if the value of "setModalOpen" is true. If it is, it displays the modal.

    {setModalOpen ? 
        <>
            <Modal addCSS="testMVP">
                <p>some content...</p>
            </Modal>
        </>
        :
        null
    }

Don't forget to position your handleClick so that you can toggle the modal on a button.

    <button onClick={handleClick}>Modal</button>

For future updates

Additional parameters will be added so that you can take full advantage of the modal as freely as possible.