react-concurrent-router/cjs/useBeforeRouteLeave.js

Performant routing embracing React concurrent UI patterns

'use strict';

var React = require('react');
var RouterContext = require('./RouterContext-BCgWDPs4.js');

const useBeforeRouteLeave = ({
  toggle = true,
  unload = true,
  message = ''
}) => {
  const {
    history: {
      block
    }
  } = React.useContext(RouterContext.RouterContext);
  let unblock;
  const handleBeforeunload = React.useCallback(event => {
    event.preventDefault();
    event.returnValue = '';
  }, []);
  const register = React.useCallback(() => {
    unblock = block(message);
    if (unload) {
      window.addEventListener('beforeunload', handleBeforeunload);
    }
  }, [block]);
  const cleanup = React.useCallback(() => {
    unblock();
    if (unload) {
      window.removeEventListener('beforeunload', handleBeforeunload);
    }
  }, [unblock]);
  React.useEffect(() => {
    if (toggle) register();
    return () => {
      if (toggle) cleanup();
    };
  }, [toggle, register, cleanup]);
};

module.exports = useBeforeRouteLeave;