reacthook-withclickoutside

Installation:

npm install --save-dev reacthook-withclickoutside

Parameter:

| property | Description | Example |
|-----------|:----------------------:|-----------------------:|
| handler | If click is outside, this function will execute | () => { //Do something here...} | | excludeContainerIds | Some frameworks render something like menu-item or select-option in different container, therefore you must exclude them.| ['id1','id2']| | excludeQuerySelectors | Sometime different container doesn't have id so you can replace it with querySelector | ['selector1','selector2']| | isInitContainersAllTimes | Set it false to find all containers once time. | true or false|

Usage:

import withClickOutside from 'reacthook-withclickoutside'
export default function Component() {
  const ref = withClickOutside({
        handler: () => {
            setIsOpen(!isOpen)
        },
        excludeContainerIds: ["id1", "id2"],
        excludeQuerySelectors: ["div.class-name", "div[attribute='value']"]
    })
  render(
    <div ref={refClickOutside}></div>
  )
}