useClickOutside

Detect clicks outside a referenced element. Perfect for closing dropdowns, modals, and popovers.

import { useClickOutside } from "@allem-sdk/hooks";

Parameters

Prop	Type	Default	Description
ref*	RefObject<HTMLElement>	—	Ref to the element to watch
handler*	() => void	—	Callback when clicked outside

Usage

const ref = useRef<HTMLDivElement>(null);
const [isOpen, setIsOpen] = useState(false);

useClickOutside(ref, () => setIsOpen(false));

<div ref={ref}>
  {isOpen && <DropdownMenu />}
</div>