useTransitionState.js

function useTransitionState(ref) {
  let [pending, setPending] = useState(false);
  useLayoutEffect(() => {
    let target = ref.current;
    let handler = {
      handleEvent(event) {
        setPending(event.type === 'transitionstart');
      }
    }
    target.addEventListener('transitionstart', handler);
    target.addEventListener('transitionend', handler);
    return () => {
      target.removeEventListener('transitionstart', handler);
      target.removeEventListener('transitionend', handler);
    }
  }, []);
  return pending;
}