modalereacterik42
v1.0.1
Published
Modale toute prête et autonome sous React - https://github.com/Erik-42/openclassroom-projet_14-wealthhealth/tree/main/composant-npm
Downloads
12
Maintainers
Readme
ModaleErik42
Plugin du projet 14 Wealth Health - HR-Net "Faites passer une librairie jQuery vers React" OpenClassrooms.
How to install ?
npm install modalereacterik42
How to use ?
- Importez le plugin dans votre projet:
import ModaleErik42 from "modalereacterik42";
<ModaleErik42
showModale={showModal}
closeModale={handleClose}
parameter={{ backgroundColor: 'white' }}
message="Votre message ici"
/>
Accessoires
showModale(booléen) : Contrôle la visibilité de la modale.
closeModale(fonction) : Fonction permettant de fermer la modale.
parameter(objet) : Objet de style pour personnaliser l'apparence modale.
message(string) : Message à afficher à l'intérieur de la modale.
- Le state :
const [showModal, setShowModal] = useState(false);
const handleClose = () => {
setShowModal(false);
};
- Le return :
<>
<button onClick={() => setShowModal(true)}>Show Modal</button>
<ModaleErik42
showModale={showModal}
closeModale={handleClose}
parameter={{ backgroundColor: 'lightgrey' }}
message="Employé créé avec succès!"
/>
</>
Customize you modal
- paramètres de votre composant :
const modaleParameter = {
backgroundColor: "",
borderRadius: "",
boxShadow: "",
color: "",
fontSize: "",
height: "",
padding: "",
width: "",
};