0.1.9 • Published 2 years ago
@aamal/p14-plugin-modale v0.1.9
Getting Started
The p14-plugin-modal
as its name suggests, is a plugins developed as part of my OpenClassRooms training program.
It is a React plugin allowing to display a modal alert, for more information go to the section "How the plugin works"
Installation
$ npm install --save @aamal/p14-plugin-modale
$ yarn add p14-plugin-modal
How the plugin works
Import module:
import Modal, { ModalActions, ModalContent, ModalTitle } from 'p14-plugin-modal/dist'
Create your state in your component:
const [myModal, setMyModal] = useState(false)
Render your alert in your component:
return (
<>
<Modal name="my-super-bright-alert" show={myModal} setShow={setMyModal}>
<ModalTitle> Modal Title</ModalTitle>
<ModalContent>*****Modal Message*****</ModalContent>
<ModalActions>
<button type="button" onClick={() =>setMyModal(false)}>Close Modal</button>
</ModalActions>
</Modal>
</>
)
<Modal/>
params:
- name: id of your alert title use to define Aria
- showClose: Boolean use to show or hide cross close button (
true
by default) - show: Boolean state use to show and hide your modal
- setShow: function that updates your state