blob: 828ce7e385703f4dad066a3d3b0cf2f143535962 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
import { useRef, useEffect } from "react";
export default function useClickOutside(
element: HTMLElement | null | undefined,
onClickOutside: () => void,
nextTick?: boolean,
): void {
const onClickOutsideRef = useRef<() => void>(onClickOutside);
useEffect(() => {
onClickOutsideRef.current = onClickOutside;
}, [onClickOutside]);
useEffect(() => {
if (element != null) {
const handler = (event: MouseEvent): void => {
let e: HTMLElement | null = event.target as HTMLElement;
while (e) {
if (e == element) {
return;
}
e = e.parentElement;
}
onClickOutsideRef.current();
};
if (nextTick) {
setTimeout(() => {
document.addEventListener("click", handler);
});
} else {
document.addEventListener("click", handler);
}
return () => {
document.removeEventListener("click", handler);
};
}
}, [element, nextTick]);
}
|