A React modal component that comes with an explosion effect when the modal window is launched.
How to use it:
1. Install and import the ReactplosiveModal.
# Yarn $ yarn add reactplosive-modal # NPM $ npm i reactplosive-modal
import ReactplosiveModal from "reactplosive-modal";
2. Basic usage.
const YourComponent = () => { const [isModalVisible, setIsModalVisible] = useState(false); return ( <ReactplosiveModal title={<h4>Modal Title</h4>} isVisible={isModalVisible} onClose={() => setIsModalVisible(false)} > <p>Modal Content</p> <button>Modal Button</button> </ReactplosiveModal> ); };
3. Available component props.
{ title?: ReactNode, children: ReactNode, isVisible: boolean, width?: string, // default: 500px onClose: (visibility: boolean) => void, outsideClickEnabled?: boolean, // default: true };
Preview:
Download Details:
Author: mburakerman
Live Demo: View The Demo
Download Link: Download The Source Code
Official Website: https://github.com/mburakerman/reactplosive-modal
License: MIT