@hitachivantara/uikit-react-core/dist/esm/hooks/useClickOutside.js

Core React components for the NEXT Design System.

import { useEffect } from "react";
const useClickOutside = (ref, handler) => {
  useEffect(() => {
    const listener = (event) => {
      const el = ref?.current;
      const isKeyUp = event.type === "keyup";
      const isEscape = event.key === "Escape";
      if (!el || el.contains(event?.target || null)) {
        return {};
      }
      return isKeyUp ? isEscape ? handler(event) : null : handler(event);
    };
    document.addEventListener("click", listener);
    document.addEventListener("touchstart", listener);
    document.addEventListener("keyup", listener);
    return () => {
      document.removeEventListener("click", listener);
      document.removeEventListener("touchstart", listener);
      document.removeEventListener("keyup", listener);
    };
  }, [ref, handler]);
};
export {
  useClickOutside
};