1.0.0 • Published 2 years ago

react-modal-zineb v1.0.0

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

React Modal Zineb

Description

A customizable and reusable React modal component.

Installation

npm install react-modal-zineb

Usage

import React from 'react';
import Modal from 'react-modal-zineb';

const App = () => {
  const [isModalOpen, setModalOpen] = React.useState(false);

  const openModal = () => setModalOpen(true);
  const closeModal = () => setModalOpen(false);

    const handleEvent = () => {
    // This function is called during an event
    // It opens the modal to indicate information
    openModal();
  };

  return (
    <div>
      <button onClick={handleEvent}>Open</button>
      <Modal isOpen={isModalOpen} onClose={closeModal} contentBtn="Close">
        {/* Modal content goes here */}
        Hello, this is my modal!
      </Modal>
    </div>
  );
};

export default App;

Props

  • isOpen (boolean): Controls whether the modal is open or closed.
  • onClose (function): Callback function triggered when the modal is requested to be closed.
  • children (node): Content of the modal.
  • contentBtn (node): Button for closing the modal .
1.0.0

2 years ago