browser-navigation-warning
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.1 • Public • Published

    Browser Navigation Warning

    npm npm

    Helpful utility function that will trigger the browsers default pop-up before navigating away.

    Reload warning screenshot Leave warning screenshot

    Installation

    npm install -D browser-navigation-warning

    Usage

    This function takes in one parameter, trigger (boolean) - this sets whether the navigation warning should be enabled/disabled.

    trigger = true will not trigger the alert immediately.
    It enables the alert which will only be triggered when the user tries to use a browser action such as refresh, previous page or next page.


    Static - always enabled

    To have the warning enabled in all your pages, add the line below in the root file of your application (Usually App).

    Otherwise, add the line below to the specific pages / components you want to have the warning enabled.

    import triggerBrowserWarning from 'browser-navigation-warning';
     
    triggerBrowserWarning(true);

    Dynamic - conditionally enabled

    Add the snippet below to your target page / component. trigger is your dynamic boolean conditional that decides whether the warning should be displayed or not.

    React example:

    import triggerBrowserWarning from 'browser-navigation-warning';
     
    useEffect(() => {
      triggerBrowserWarning(trigger);
    }, [trigger]);

    > More info on useEffect here <


    FAQ:

    Q: Can I have my own custom dialog or custom text?

    A: Nope, unfortunately browsers stopped supporting custom alert messages for navigation


    Q: I've got an idea to improve this function, how can I get it to you?

    A: Awesome! Check the contributing section below!😄


    Contributing

    PRs are welcome!

    Issues are also welcome!

    Install

    npm i browser-navigation-warning

    DownloadsWeekly Downloads

    9

    Version

    1.0.1

    License

    ISC

    Unpacked Size

    103 kB

    Total Files

    11

    Last publish

    Collaborators

    • eduardo-vargas