0.1.2 • Published 11 months ago
p14-modal-opc v0.1.2
Description
P14-modal-opc is a versatile and intuitive modal library that can be easily integrated into any React application. Developed as part of Project 14 of the OpenClassroom course, this open-source library provides a seamless way to add modals to your projects and is available for free.
It was created for Projet 14 of OpenClassroom course and it shows how use create and use an library in NPM.
Install
npm install p14-modal-opc
How to use
//This is the modal state, it will define if it's open or closed
const [showModal, setShowModal] = useState(false);
const handleSubmit = (event) => {
event.preventDefault();
//This is will change the state of the modal
setShowModal(true);}
return
//This is the modal in your code, it's necessary use a message as string and integrate correctly with your useState.
<Modal isOpen={showModal} message={'Employee created!'} closeModal={() => setShowModal(false)}/></div>
<form onSubmit={handleSubmit}>
<div>
<label htmlFor="name">Name:</label>
<input
type="text"
id="name"
value={name}
onChange={(e) => setName(e.target.value)}
/>
</div>
<div>
<label htmlFor="password">Password:</label>
<input
type="password"
id="password"
value={password}
onChange={(e) => setPassword(e.target.value)}
/>
</div>
<button type="submit">Submit</button>
</form>