ReactLightModal is a modal library, built in typescript light and accessible. It's goal is to provide easy, flexible, configurable and accessible way to display modals for your application.
Install ReactLightModal with npm
npm i reactlightmodalfz
Install ReactLightModal with yarn
yarn add reactlightmodalfz
import Modal from 'reactlightmodalfz';
import React, {useState} from "react;
const [modal, setModal] = useState(false);
const toggleModal = () => {
setModal(!modal)
}
function App() {
return (
<Modal />
)
}
Name | Type | Required | Description | Default value |
---|---|---|---|---|
canClose | boolean |
false |
Display cross button on the top-right of the modal box | true |
closeBtnContent | JSX.element |
false |
Custom content add on the close button (exemple: personalized icon, ...) | {<span>X</span} |
footerContent | JSX.element |
false |
Custom content to add to the footer (exemple: action buttons, ...) | {} |
haveFooter | boolean |
false |
If his value is true, the modal have footer element | false |
isOpen | boolean |
true |
If his value is true, the modal is displayed | false |
modalContent | JSX.element |
true |
Content of the modal | {} |
title | string |
false |
Modal header title | "" |
To run tests, run the following command
npm run test
Contributions are always welcome!
See contributing.md
for ways to get started.
Please adhere to this project's code of conduct
.