https://react.dev/blog/2024/04/25/react-19-upgrade-guide https://react.dev/blog/2024/12/05/react-19
19 lines
533 B
TypeScript
19 lines
533 B
TypeScript
import { RefObject, useEffect } from "react";
|
|
|
|
export const useHandleClickOutside = (
|
|
ref: RefObject<HTMLDivElement | null>,
|
|
onClickOutside: any,
|
|
) => {
|
|
useEffect(() => {
|
|
const outsideListenerEvent = (event: MouseEvent) => {
|
|
if (!ref.current || ref.current.contains(event.target as Node)) {
|
|
return;
|
|
}
|
|
onClickOutside();
|
|
};
|
|
document.addEventListener("click", outsideListenerEvent, true);
|
|
return () =>
|
|
document.removeEventListener("click", outsideListenerEvent, true);
|
|
}, []);
|
|
};
|