click outside of button/dropdowqn as hook

This commit is contained in:
2026-06-09 14:53:05 +02:00
parent 07068ab4fa
commit 43d7eaa77f
3 changed files with 42 additions and 39 deletions
+34
View File
@@ -0,0 +1,34 @@
import { type RefObject, useEffect } from "react";
interface IProps {
isOpen: boolean;
setIsOpen: (isOpen: boolean) => void;
ref: RefObject<HTMLDivElement | null>;
setSearch: (search: string) => void;
}
export const useClickOutside = ({
isOpen,
setIsOpen,
setSearch,
ref,
}: IProps) => {
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (
isOpen &&
ref.current &&
!ref.current.contains(event.target as Node)
) {
setIsOpen(false);
setSearch("");
}
};
document.addEventListener("mousedown", handleClickOutside);
return () => {
document.removeEventListener("mousedown", handleClickOutside);
};
}, [isOpen, setIsOpen, setSearch, ref]);
};