Modal Library

Project 14 for OpenClassrooms - Composant : Modal

Technologies

Environments

https://github.com/gguesnet/HRnet

Installation

Prerequisites

Installing and launching

Clone the repository :

git clone https://github.com/gguesnet/modal-oc-project-hrnet.git

Inside this repository, install dependencies:

npm install

Lauch on port 3000:

npm start

HRnet is now rendered at URL http://localhost:3000

Use the library

Install in a project React :

npm install modal-oc-project-hrnet

To use the component, pass the right props :

<Modal
  title="Success!"
  text="Employee has been successfully added!"
  button="Okay!"
  toggleOpen={handleClick}
  isOpen={modalShowing}
/>

Props Types must be like this :

Modal.propTypes = {
  title: PropTypes.string,
  text: PropTypes.string,
  button: PropTypes.string,
  toggleOpen: PropTypes.func,
  isOpen: PropTypes.bool,
};

You must use useState() React Hook in the parent component to trigger the Modal like this :

const [modalShowing, setModalShowing] = useState(false);

function handleClick() {
  setModalShowing(!modalShowing);
}