@dnanpm/styleguide/build/cjs/hooks/useOutsideClick.js

DNA Styleguide repository provides the set of components and theme object used in various DNA projects.

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');

/**
 * Hook to handle the click outside the referenced element
 *
 * @param {RefObject<Element>} ref - reference to the targeted element
 * @param {Function} callback - callback
 */
const useOutsideClick = (ref, callback) => {
    const handleClick = (e) => {
        if (ref.current && !ref.current.contains(e.target)) {
            callback();
        }
    };
    React.useEffect(() => {
        document.addEventListener('click', handleClick);
        return () => {
            document.removeEventListener('click', handleClick);
        };
    });
};

exports.default = useOutsideClick;