File size: 778 Bytes
9705b6c |
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 |
import { useEffect, RefObject } from 'react';
type Handler = () => void;
export default function useOnClickOutside(
ref: RefObject<HTMLElement>,
handler: Handler,
excludeIds: string[],
): void {
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
const target = event.target as Node | null;
if (target && 'id' in target && excludeIds.includes((target as HTMLElement).id)) {
return;
}
if (ref.current && !ref.current.contains(target)) {
handler();
}
};
document.addEventListener('mousedown', handleClickOutside);
return () => {
document.removeEventListener('mousedown', handleClickOutside);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [ref, handler]);
}
|