juliengilbertdev-mymodal v0.1.5

Modal Component

The Modal component displays a customizable modal dialog.

Installation

You can install the Modal component via npm:

npm i juliengilbertdev-mymodal

Utilisation

Exemple Basique

import React, { useState } from "react";
import Modal from "my-modal-component";

function App() {
  const [isModalOpen, setIsModalOpen] = useState(false);

  return (
    <div>
      <button onClick={() => setIsModalOpen(true)}>Ouvrir la modal</button>
      <Modal
        isOpen={isModalOpen}
        setIsOpen={setIsModalOpen}
        mainTitle="Bienvenue !"
        text="Ceci est un composant modal personnalisé."
      />
    </div>
  );
}

export default App;

Props

• isOpen: Un booléen qui contrôle la visibilité de la modal. Lorsqu'il est défini sur true, la modal est affichée.

• setIsOpen: Une fonction qui permet de changer l'état de visibilité de la modal. En l'appelant avec false, la modal se ferme.

• icon: Une chaîne de caractères représentant l'icône affichée à côté du titre principal de la modal.

• titleStyle: Une chaîne de caractères représentant la classe CSS utilisée pour styliser la section du titre de la modal.

• mainTitle: Une chaîne de caractères représentant le texte principal affiché dans la modal.

• text: Une chaîne de caractères représentant le contenu textuel supplémentaire de la modal.

Ces props vous permettent de personnaliser le contenu et le comportement de la modal en fonction de vos besoins dans votre application React.