rowboat/apps/rowboat/hooks/use-click-away.ts
2025-06-24 15:45:04 +05:30

23 lines
No EOL
725 B
TypeScript

import { useEffect, RefObject } from 'react';
export function useClickAway(
ref: RefObject<HTMLElement | null>,
handler: (event: MouseEvent | TouchEvent) => void
) {
useEffect(() => {
const listener = (event: MouseEvent | TouchEvent) => {
if (!ref.current || ref.current.contains(event.target as Node)) {
return;
}
handler(event);
};
document.addEventListener('mousedown', listener);
document.addEventListener('touchstart', listener);
return () => {
document.removeEventListener('mousedown', listener);
document.removeEventListener('touchstart', listener);
};
}, [ref, handler]);
}