useRelativeClick React Hook

useRelativeClick.tsx

import { useEffect } from "react";

export function useRelativeClick(ref, callback: (inside: boolean) => any) {
  function handleClickOutside(event) {
    if (ref.current) {
      const insideClick = ref.current.contains(event.target)
      callback(insideClick)
    }
  }

  useEffect(() => {
    document.addEventListener("mousedown", handleClickOutside);
    return () => {
      document.removeEventListener("mousedown", handleClickOutside);
    };
  // tslint:disable-next-line: align
  }, [ref]);
}