blob: 4b2f0e5c2e8037722554112f9469757b2dcc62a7 (
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 React from "react";
export default function useClickOutside(
element: HTMLElement | null | undefined,
onClickOutside: () => void,
nextTick?: boolean
): void {
const onClickOutsideRef = React.useRef<() => void>(onClickOutside);
React.useEffect(() => {
onClickOutsideRef.current = onClickOutside;
}, [onClickOutside]);
React.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]);
}
|
