@jsmine/react-popup-utils

react-popup-utils

A react component which can be used as wrapper for any popup. This component easily detects mouse clicks done on its wrapped element or out side and triggers the call back. It also triggers callback on esc key and on timeout.

Example

Getting Started

install the react-popup-utils via npm:

npm i @jsmine/react-popup-utils

import it in your file:

import PopupUtils from '@jsmine/react-popup-utils

wrap your popup:

<PopupUtils closePopup={()=>'your popup close handler'}>
    <div>popup</div>
</PopupUtils>

Props

props	type	default value	description
closePopup	function	none	function passed in this prop will be called on getting clicked or on other callback triggers
closeOnSelfClick	bool	false	if set true, popup close handler will trigger even on getting clicked on wrapped element
closeOnClickOutSide	bool	true	if set false, popup close handler will not trigger
closeOnEscape	bool	true	if set true, popup close handler will trigger on clicking esc key
setTimeout	bool	false	if set true, popup close handler will trigger after specified time
timeoutTime	number	1500 milliseconds	it takes timeout time in millisecond