easy-modal-dialog
v0.0.5
Published
This modal is designed to fit according to the parent component's size, providing a seamless user experience.
Downloads
8
Maintainers
Keywords
Readme
Easy-Modal-Dialog
This modal is designed to fit according to the parent component's size, providing a seamless user experience.
Installation
npm i easy-modal-dialog
Usage
import React, { useState } from "react";
import EasyModal from "easy-modal-dialog";
function App() {
const [open, setOpen] = useState(false);
const handleClose = () => setOpen(false);
const Body = (
<>
<h5>I am a Modal which can wrap over any Element</h5>
</>
);
return (
<div>
<EasyModal open={open} onClose={handleClose} body={Body} />
</div>
);
}
)
Features
- The modal is centered within the parent component, ensuring that it is always visible to the user.
- The modal adapts to the size of the parent component, providing an optimal viewing experience on any screen.
- The modal can be easily triggered by a button or link, allowing for a smooth transition between the parent component and the modal.
Browser Support
This modal has been tested and is compatible with the latest versions of Chrome, Firefox, Safari, and Edge.
About Author
Official NPM Package