25 lines
591 B
TypeScript
25 lines
591 B
TypeScript
import { useEffect } from "react"
|
|
|
|
export default function useClickOutside(
|
|
ref: React.RefObject<HTMLElement>,
|
|
isOpen: boolean,
|
|
callback: () => void
|
|
) {
|
|
useEffect(() => {
|
|
function handleClickOutside(evt: Event) {
|
|
const target = evt.target as HTMLElement
|
|
if (ref.current && target && !ref.current.contains(target) && isOpen) {
|
|
callback()
|
|
}
|
|
}
|
|
|
|
if (isOpen) {
|
|
document.addEventListener("click", handleClickOutside)
|
|
}
|
|
|
|
return () => {
|
|
document.removeEventListener("click", handleClickOutside)
|
|
}
|
|
}, [ref, isOpen, callback])
|
|
}
|