Lime Web Components API Documentation - v7.4.0
    Preparing search index...

    Type Alias Transition

    Navigation transition information

    Describes a pending navigation from one location to another. Provided to Blocker functions to allow inspection of the navigation and optional retry after blocking.

    import {
        Blocker,
        PlatformServiceName,
        Transition,
    } from '@limetech/lime-web-components';

    const navigator = platform.get(PlatformServiceName.Navigator);

    const blocker: Blocker = (transition: Transition) => {
        console.log('Navigating from', transition.from.path);
        console.log('Navigating to', transition.to.path);

        return transition.to.path.startsWith('/admin');
    };

    navigator.addBlocker(blocker);
    type Transition = {
        from: Location;
        retry: Retry;
        to: Location;
    }
    Index

    Properties

    from retry to

    Properties

    from: Location

    Current location before navigation

    The Location before the navigation occurs.

    retry: Retry

    Function to retry the blocked navigation

    Call this function to resume navigation after it was blocked. Typically called after user confirmation or other async conditions are met.

    import {
        Blocker,
        PlatformServiceName,
        Transition,
    } from '@limetech/lime-web-components';

    const navigator = platform.get(PlatformServiceName.Navigator);

    let hasUnsavedChanges = false;

    const blocker: Blocker = (transition: Transition) => {
        if (!hasUnsavedChanges) {
            return false;
        }

        void confirmNavigation(transition);

        // Block for now, `retry()` resumes the navigation if the user confirms
        return true;
    };

    async function confirmNavigation(transition: Transition) {
        const shouldNavigate = await showConfirmDialog();

        if (!shouldNavigate) {
            return;
        }

        hasUnsavedChanges = false;
        navigator.removeBlocker(blocker);
        transition.retry();
    }

    // Stands in for the dialog the component would open
    async function showConfirmDialog(): Promise<boolean> {
        return confirm('You have unsaved changes. Leave anyway?');
    }

    navigator.addBlocker(blocker);
    to: Location

    Target location for navigation

    The Location that will be navigated to if not blocked.

    Settings

    Member Visibility

    On This Page

    Properties