React useClickOutside Hook

import { useEffect, useRef } from class=class="text-emerald-400">"text-emerald-400">'react'

function useClickOutside<T extends HTMLElement>(callback: () => void) {
  const ref = useRef<T>(null)

  useEffect(() => {
    function handleClick(event: MouseEvent) {
      if (ref.current && !ref.current.contains(event.target as Node)) {
        callback()
      }
    }

    document.addEventListener(class=class="text-emerald-400">"text-emerald-400">'mousedown', handleClick)
    return () => document.removeEventListener(class=class="text-emerald-400">"text-emerald-400">'mousedown', handleClick)
  }, [callback])

  return ref
}

export default useClickOutside