reusale-dialog
v1.0.4
Published
title:- Dialog Header isOpen:- Dialog Open state needs to be created in parent and pass it as a prop. handleClose:- Handle Dialog Close also needs to be created in Parent and should be passed as a prop.
Downloads
4
Readme
This Package contains a reusable Dialog or Modal that you an integrate in your React Project.
PROPS DESCRIPTION
title:- Dialog Header isOpen:- Dialog Open state needs to be created in parent and pass it as a prop. handleClose:- Handle Dialog Close also needs to be created in Parent and should be passed as a prop.
SAMPLE EXAMPLE: (USAGE)
function App() {
const [isOpen, setIsOpen] = useState(false); const handleClose = () => { setIsOpen(false); };
return (
<div className="App">
<Button variant="contained" onClick={(e) => setIsOpen(true)}>
Open Dialog
</Button>
{/* Reusable Dialog (Pass All the Necessary Props) */}
<ReusableDialog
title="Sample Title"
isOpen={isOpen}
handleClose={handleClose}
>
{/* Pass Dialog Content as Chldren Prop */}
Add Dialog Content Here
</ReusableDialog>
</div>
); }
export default App;
Hopefully the above example will help you and this dialog makes your task easier and fits perfectly in your project.