1.0.2 • Published 1 year ago

@rockethell/modal v1.0.2

Weekly downloads
-
License
ISC
Repository
github
Last release
1 year ago

react modal component

Installation

npm i @rockethell/modal

Props needed

  • isOpen: state for manage the modal

  • closeModal : a function for close the modal or manage the state

  • content : the content text witch will be displayed

Example

import Modal from '@rockethell/modal';
import { useState } from 'react';

const App = () => {
  const [isOpen, setIsOpen] = useState(false);

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

  return (
    <div className='flex h-screen items-center justify-center'>
      {isOpen ? (
        <Modal
          closeModal={closeModal}
          isOpen={isOpen}
          content='This is the modal title'
        />
      ) : (
        <button
          className='mx-auto flex h-5 select-none items-center rounded-xl border bg-gray-700 p-4 text-white'
          onClick={openModal}
        >
          Open Modal
        </button>
      )}
    </div>
  );
};

export default App;
1.0.2

1 year ago

1.0.1

1 year ago

1.0.0

1 year ago