0.1.9 • Published 9 months ago
simple-modal-library v0.1.9
simple-modal-libraryA library of React components created using create-react-app
.
1/ InstallationRun the following command:
npm install simple-modal-library
2/ Import the component from the library :
import { Modal } from 'simple-modal-library'
import React from 'react'
import styles from "./style.module.css"
3/ Place this state hook (concerning the opening/closing of the modal) at the start of the function that uses the Modal component :
cconst [showModal, setShowModal] = useState(false)
4/ In the return of the function, call the Modal component :
{showModal && (<Modal className={styles["box-modal"]} message="Employee Created!" onClose={closeModal} /> )}
5/ Example :
import React, { useState } from 'react'
import { Modal } from '../components/Modal'
export default function Home() {
const [isOpen, setIsOpen] = useState(false)
const name = 'John Smith'
return (
<>
<h1>Modal Test</h1>
<button onClick={() => setIsOpen(true)}>Open Modal</button>
{showModal && (
<Modal className={styles["box-modal"]} message="Employee Created!" onClose={closeModal} />
)}
</>
)
}