0.1.3 • Published 1 year ago
@8uk0w5k1/simple_modal v0.1.3
Modal Component in React
A styled modal component using the styled-components library. The component contains various styles for the different components.
How to install the Modal
You can find the npm package here.\
you can install it with the following code :
npm -i @8uk0w5k1/simple_modal@0.1.2
OR
yarn add @8uk0w5k1/simple_modal@0.1.2
import React, from 'react';
import Modal from '@8uk0w5k1/simple_modal';
const Exemple = () => {
const [isOpen, setIsOpen] = useState(false);
function openModal() {
setIsOpen(true);
//console.log('opened Modal');
}
return (
<>
{isOpen && (
<Modal
setIsOpen={setIsOpen}
title='Parfait!'
content='Votre employé à bien été ajouté à votre base de données, Félicitations! 😀'
/>
)}
<button
className='bg-[#eae7b1] hover:bg-[#61876e] py-3 px-8 rounded-lg text-black border-b-4 border-[#3c6255] hover:border-[#3c6255] transition duration-300 cursor-pointer'
onClick={openModal}>My Button</button>
</>
);
};
Props
What props can you add ?
Modal.defaultProps = { isOpen: false, handleClose: () => setIsOpen(false), iconSize: 24, iconColor: '#000', font: 'Arial, sans-serif', title: 'Modal title', content: 'your personal content', };