0.0.4 • Published 1 year ago
@wibmw/custom-modal v0.0.4
Custom Modal
An Easy React Customizable Modal
🚀 Getting Started
Using yarn
:
yarn add @wibmw\custom-modal
✨ Usage
How to use CustomModal
in your project:
import CustomModal from 'custom-modal';
export default () => {
// Modal Open/Close toggle
const [isOpen, setisOpen] = useState(false)
const toggle = () => setisOpen(!isOpen)
return (
<>
{/** *********** Page ******************/}
<main className='...'>
<section className='...'>
.....
</section>
{/** *********** Custom Modal ******************/}
<CustomModal {...{ isOpen, toggle }} >
<div>Successfully Registered !</div>
<br />
<div className='form-button' onClick={() => navigate('/next-page')}>
Link to the next page
</div>
</CustomModal>
</main>
</>
)
}
📌 Props
Prop | Type | Default | Required |
---|---|---|---|
isOpen | Boolean | false | Yes |
toggle | () => void | Yes | |
children | ReactNode | No |