prevent-navigation

Easily prevent and enable page navigation from multiple sources and keep track of those sources.

installation

npm i prevent-navigation

usage

preventNavigation

You can quickly and simply block navigation without any smartness by calling preventNavigation directly with no arguments:

import {preventNavigation} from 'prevent-navigation';

preventNavigation();

For smarter prevention or preventing in multiple places, pass in id strings:

import {preventNavigation} from 'prevent-navigation';

preventNavigation('user-form-1');

/** Multiple ids can be used at once. */
preventNavigation('user-form-2', 'user-form-3', 'user-form-4');

/** `preventNavigation` can be called again from multiple places without issue. */
preventNavigation('user-form-5');

allowNavigation

Re-enable navigation with allowNavigation:

import {allowNavigation} from 'prevent-navigation';

allowNavigation();

It can also be used with ids:

import {allowNavigation} from 'prevent-navigation';

allowNavigation('user-form-1');

/** Multiple ids can be unblocked at once. */
allowNavigation('user-form-2', 'user-form-3', 'user-form-4');

/** `allowNavigation` can be called again from multiple places without issue. */
allowNavigation('user-form-5');

Checking navigation status

import {getNavigationBlockerIds, isNavigationBlocked} from 'prevent-navigation';

/** Get all the ids currently blocking navigation (if any). */
getNavigationBlockerIds();

/** Check if navigation is blocked. */
isNavigationBlocked();