useClickAway.ts

import * as React from 'react';

React.useEffectEvent = React.experimental_useEffectEvent;

export function useClickAway(callback) {
  const ref = React.useRef(null);

  const onEventHandler = React.useEffectEvent((e) => {
    const element = ref.current;

    if (element && !element.contains(e.target)) {
      callback(e);
    }
  });

  React.useEffect(() => {
    document.addEventListener('mousedown', onEventHandler);
    document.addEventListener('touchstart', onEventHandler);

    return () => {
      document.removeEventListener('mousedown', onEventHandler);
      document.removeEventListener('touchstart', onEventHandler);
    };
  }, []);

  return ref;
}

https://stackblitz.com/edit/stackblitz-starters-axu6qg?file=src%2FApp.tsx