useClickOutside

Hook to detect clicks outside a referenced element.

Usage

import { useRef } from "react";
import { useClickOutside } from "@spectre-ui/hooks";

function Dropdown() {
  const ref = useRef(null);
  const [open, setOpen] = useState(true);

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

  return open ? <div ref={ref}>Dropdown content</div> : null;
}