import { type RefObject, useEffect } from "react";

export function useClickOutside<T extends HTMLElement>(
	refs: RefObject<T | null>[],
	handler: (event: MouseEvent | TouchEvent) => void,
): void {
	useEffect(() => {
		const handleClickOutside = (event: MouseEvent | TouchEvent) => {
			if (refs.some((ref) => ref.current?.contains(event.target as Node))) {
				return;
			}

			handler(event);
		};

		document.addEventListener("mousedown", handleClickOutside);
		document.addEventListener("touchstart", handleClickOutside);

		return () => {
			document.removeEventListener("mousedown", handleClickOutside);
			document.removeEventListener("touchstart", handleClickOutside);
		};
	}, [refs, handler]);
}
