@singularsystems/neo-react 1.0.22 → 1.1.1

package/dist/ReactComponents/Transitions/TransitionController.d.ts

@@ -0,0 +1,33 @@
+import { Transition } from "./Transition";
+export declare class TransitionController {
+    /** Global default transition. */
+    static transition: Transition;
+    /**
+     * Creates a transition controller.
+     * @param initialName Name of the panel to display initially. Not required if `isVisible` props are defined on the panels.
+     * @param transition Transition type to use by default on all panels.
+     */
+    constructor(initialName?: string, transition?: Transition);
+    private _selectedName;
+    private defaultTransition;
+    private direction;
+    private isFirstTransition;
+    private isTransitioning;
+    private panels;
+    private panelStates;
+    private containerElement?;
+    /**
+     * Returns the name of the selected panel.
+     */
+    get selectedPanel(): string;
+    /**
+     * Begins a transition to the specified panel.
+     * @param waitFor A promise on which to wait before showing the to panel. Use if data needs to be loaded.
+     */
+    transition(toPanelName: string, waitFor?: Promise<any>): void;
+    forward(toPanelName?: string, waitFor?: Promise<any>): void;
+    back(toPanelName?: string, waitFor?: Promise<any>): void;
+    private doTransition;
+    private beginRemove;
+    private transitionElement;
+}

package/dist/ReactComponents/Transitions/TransitionController.js

@@ -0,0 +1,231 @@
+import { __awaiter, __decorate, __generator, __metadata } from "tslib";
+import { Components } from "@singularsystems/neo-core";
+import { Transition } from "./Transition";
+import { makeObservable, observable } from "mobx";
+var TransitionController = /** @class */ (function () {
+    /**
+     * Creates a transition controller.
+     * @param initialName Name of the panel to display initially. Not required if `isVisible` props are defined on the panels.
+     * @param transition Transition type to use by default on all panels.
+     */
+    function TransitionController(initialName, transition) {
+        this._selectedName = "";
+        this.direction = 1;
+        this.isFirstTransition = true;
+        this.isTransitioning = false;
+        /**
+         * @internal
+         */
+        this.wasAutoCreated = false;
+        this.panels = [];
+        this.panelStates = [];
+        this._selectedName = initialName !== null && initialName !== void 0 ? initialName : "";
+        makeObservable(this);
+        this.defaultTransition = transition !== null && transition !== void 0 ? transition : TransitionController.transition;
+    }
+    Object.defineProperty(TransitionController.prototype, "selectedPanel", {
+        /**
+         * Returns the name of the selected panel.
+         */
+        get: function () {
+            return this._selectedName;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /**
+     * Begins a transition to the specified panel.
+     * @param waitFor A promise on which to wait before showing the to panel. Use if data needs to be loaded.
+     */
+    TransitionController.prototype.transition = function (toPanelName, waitFor) {
+        if (!this.isTransitioning) {
+            var currentIndex = this.panels.indexOf(this._selectedName);
+            var newIndex = this.panels.indexOf(toPanelName);
+            this.doTransition(toPanelName, newIndex - currentIndex, waitFor);
+        }
+    };
+    TransitionController.prototype.forward = function (toPanelName, waitFor) {
+        this.doTransition(toPanelName !== null && toPanelName !== void 0 ? toPanelName : "", 1, waitFor);
+    };
+    TransitionController.prototype.back = function (toPanelName, waitFor) {
+        this.doTransition(toPanelName !== null && toPanelName !== void 0 ? toPanelName : "", -1, waitFor);
+    };
+    /**
+     * @internal
+     * Called by the container on mount.
+     */
+    TransitionController.prototype.registerContainer = function (element) {
+        this.containerElement = element;
+    };
+    /**
+     * @internal
+     * Called by the container on unmount.
+     */
+    TransitionController.prototype.disposeContainer = function () {
+        this.containerElement = undefined;
+    };
+    /**
+     * @internal
+     * Called by each panel on mount.
+     */
+    TransitionController.prototype.registerPanel = function (name, hasVisibleProp) {
+        if (this.wasAutoCreated && !hasVisibleProp) {
+            throw "Panel with name ".concat(name, " must specify the isVisible prop, or you must pass a TransitionController to the TransitionContainer.");
+        }
+        if (this.panels.indexOf(name) < 0) {
+            this.panels.push(name);
+        }
+    };
+    /**
+     * @internal
+     * Called by each panel on unmount.
+     */
+    TransitionController.prototype.disposePanel = function (name) {
+        this.panels.remove(name);
+        var panelState = this.panelStates.find(function (c) { return c.name === name; });
+        if (panelState) {
+            clearTimeout(panelState.inTimer);
+            clearTimeout(panelState.outTimer);
+        }
+    };
+    /**
+     * @internal
+     * Called by each panel after render.
+     */
+    TransitionController.prototype.afterUpdate = function (name, element, transition) {
+        if (this._selectedName === name && !this.isTransitioning) {
+            var panelState_1 = this.panelStates.find(function (c) { return c.name === name; });
+            var transitionIn = false;
+            if (!panelState_1) {
+                panelState_1 = { name: name, element: element, transition: transition };
+                this.panelStates.push(panelState_1);
+                transitionIn = true;
+            }
+            if (panelState_1.outTimer) {
+                clearTimeout(panelState_1.outTimer);
+                panelState_1.outTimer = undefined;
+                transitionIn = true;
+            }
+            if (transitionIn && !this.isFirstTransition) {
+                panelState_1.inTimer = this.transitionElement(panelState_1.element, panelState_1.transition, this.direction > 0, false, function () {
+                    panelState_1.inTimer = undefined;
+                });
+            }
+            this.isFirstTransition = false;
+        }
+    };
+    /**
+     * @internal
+     * If the panel is selected, or is busy transitioning.
+     */
+    TransitionController.prototype.isPanelVisible = function (name) {
+        return this._selectedName === name ||
+            this.panelStates.find(function (c) { return c.name === name; }) !== undefined;
+    };
+    TransitionController.prototype.doTransition = function (toName, direction, waitFor) {
+        return __awaiter(this, void 0, void 0, function () {
+            var e_1, oldKey;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!(this._selectedName !== toName)) return [3 /*break*/, 5];
+                        this.direction = direction;
+                        this.isTransitioning = true;
+                        this.beginRemove();
+                        if (!waitFor) return [3 /*break*/, 4];
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, , 4]);
+                        return [4 /*yield*/, waitFor];
+                    case 2:
+                        _a.sent();
+                        return [3 /*break*/, 4];
+                    case 3:
+                        e_1 = _a.sent();
+                        this.isTransitioning = false;
+                        oldKey = this._selectedName;
+                        this._selectedName = "";
+                        this._selectedName = oldKey;
+                        return [3 /*break*/, 4];
+                    case 4:
+                        // This will cause the panel to render, and call registerPanel().
+                        this._selectedName = toName;
+                        this.isTransitioning = false;
+                        _a.label = 5;
+                    case 5: return [2 /*return*/];
+                }
+            });
+        });
+    };
+    TransitionController.prototype.beginRemove = function () {
+        var _this = this;
+        var _loop_1 = function (panelState) {
+            if (panelState.inTimer) {
+                clearTimeout(panelState.inTimer);
+                panelState.inTimer = undefined;
+            }
+            if (!panelState.outTimer) {
+                panelState.outTimer = this_1.transitionElement(panelState.element, panelState.transition, this_1.direction > 0, true, function () {
+                    _this.panelStates.remove(panelState);
+                });
+            }
+        };
+        var this_1 = this;
+        for (var _i = 0, _a = this.panelStates; _i < _a.length; _i++) {
+            var panelState = _a[_i];
+            _loop_1(panelState);
+        }
+    };
+    TransitionController.prototype.transitionElement = function (element, transition, toLeft, out, onComplete) {
+        var _this = this;
+        transition !== null && transition !== void 0 ? transition : (transition = this.defaultTransition);
+        element.style.overflow = "hidden";
+        var elementHeight = element.getBoundingClientRect().height;
+        if (this.containerElement && !this.containerElement.classList.contains("transitioning")) {
+            this.containerElement.style.height = elementHeight + "px";
+            this.containerElement.classList.add("transitioning");
+        }
+        element.style.opacity = out ? "1" : "0";
+        transition.setBeforeStyles(element, out, toLeft);
+        Components.AnimationHelper.triggerReflow(element);
+        element.classList.add("animate-".concat(out ? "out" : "in"));
+        Components.AnimationHelper.triggerReflow(element);
+        if (!out && this.containerElement) {
+            Components.AnimationHelper.triggerReflow(this.containerElement);
+            this.containerElement.style.height = elementHeight + "px";
+        }
+        element.style.opacity = out ? "0" : "1";
+        transition.setAfterStyles(element, out, toLeft);
+        var duration = parseFloat(window.getComputedStyle(element).transitionDuration) * 1000;
+        return setTimeout(function () {
+            if (out) {
+                // Element will be removed from the dom, no need to cleanup props.
+            }
+            else {
+                element.classList.remove("animate-in");
+                element.style.opacity = "";
+                element.style.overflow = "";
+                transition.cleanup(element);
+            }
+            onComplete();
+            if (_this.containerElement && !_this.panelStates.some(function (c) { return c.inTimer; })) {
+                _this.containerElement.classList.remove("transitioning");
+                if (_this.panelStates.length > 0) {
+                    _this.containerElement.style.height = "";
+                }
+            }
+        }, duration);
+    };
+    /** Global default transition. */
+    TransitionController.transition = Transition.leftRight;
+    __decorate([
+        observable.ref,
+        __metadata("design:type", String)
+    ], TransitionController.prototype, "_selectedName", void 0);
+    __decorate([
+        observable.shallow,
+        __metadata("design:type", Array)
+    ], TransitionController.prototype, "panelStates", void 0);
+    return TransitionController;
+}());
+export { TransitionController };

package/dist/ReactComponents/Transitions/TransitionPanel.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+import { Transition } from "./Transition";
+import { TransitionContext } from "./TransitionContainer";
+interface ITransitionPanelProps<T> {
+    /**
+     * The panel name unique within a transition container.
+     */
+    name?: string;
+    children: React.ReactNode | ((value: T) => React.ReactNode);
+    /**
+     * Data which will be passed into a child callback method.
+     * Use this to temporarily keep a reference to the data used in the panel while it is transitioned out.
+     */
+    data?: T | null;
+    /**
+     * Controls whether the panel is visible.
+     * If the value is an object, then it is also used as the `data` prop and will be passed into a child callback method.
+     * Not recommended when more than 2 panels are used. In that case, manually control the selected panel using a TransitionController. */
+    isVisible?: boolean | T | null;
+    /** Override the transition for this panel only. */
+    transition?: Transition;
+}
+export default class TransitionPanel<T = any> extends React.Component<ITransitionPanelProps<T>> {
+    static contextType: React.Context<import("./TransitionContainer").ITransitionContextState>;
+    context: React.ContextType<typeof TransitionContext>;
+    constructor(props: ITransitionPanelProps<T>);
+    private name;
+    private currentData?;
+    private panelRef;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    private afterRender;
+    componentWillUnmount(): void;
+    get isVisible(): boolean;
+    render(): React.JSX.Element | undefined;
+}
+export {};

package/dist/ReactComponents/Transitions/TransitionPanel.js

@@ -0,0 +1,64 @@
+import { __decorate, __extends, __metadata } from "tslib";
+import { computed, makeObservable } from "mobx";
+import { observer } from "mobx-react";
+import React from "react";
+import { TransitionContext } from "./TransitionContainer";
+import { Utils } from "@singularsystems/neo-core";
+var TransitionPanel = /** @class */ (function (_super) {
+    __extends(TransitionPanel, _super);
+    function TransitionPanel(props) {
+        var _a;
+        var _this = _super.call(this, props) || this;
+        _this.panelRef = React.createRef();
+        makeObservable(_this);
+        _this.name = (_a = _this.props.name) !== null && _a !== void 0 ? _a : Utils.uuidv4();
+        return _this;
+    }
+    TransitionPanel.prototype.componentDidMount = function () {
+        this.context.controller.registerPanel(this.name, this.props.isVisible !== undefined);
+        this.afterRender();
+    };
+    TransitionPanel.prototype.componentDidUpdate = function () {
+        this.afterRender();
+    };
+    TransitionPanel.prototype.afterRender = function () {
+        if (this.props.isVisible) {
+            this.context.controller.transition(this.name);
+        }
+        if (this.panelRef.current) {
+            this.context.controller.afterUpdate(this.name, this.panelRef.current, this.props.transition);
+        }
+    };
+    TransitionPanel.prototype.componentWillUnmount = function () {
+        this.context.controller.disposePanel(this.name);
+    };
+    Object.defineProperty(TransitionPanel.prototype, "isVisible", {
+        get: function () {
+            return this.context.controller.isPanelVisible(this.name);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    TransitionPanel.prototype.render = function () {
+        var _a = this.props, name = _a.name, data = _a.data, isVisible = _a.isVisible, children = _a.children;
+        if (data) {
+            this.currentData = data;
+        }
+        else if (isVisible && typeof isVisible === "object") {
+            this.currentData = isVisible;
+        }
+        return this.context.controller.isPanelVisible(this.name) ? (React.createElement("div", { ref: this.panelRef, className: "neo-transition-panel" }, typeof children === "function" ? (this.currentData ? children(this.currentData) : undefined) : children)) : undefined;
+    };
+    TransitionPanel.contextType = TransitionContext;
+    __decorate([
+        computed,
+        __metadata("design:type", Object),
+        __metadata("design:paramtypes", [])
+    ], TransitionPanel.prototype, "isVisible", null);
+    TransitionPanel = __decorate([
+        observer,
+        __metadata("design:paramtypes", [Object])
+    ], TransitionPanel);
+    return TransitionPanel;
+}(React.Component));
+export default TransitionPanel;

package/dist/ReactComponents/Transitions/TransitionReplacer.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Transition } from "./Transition";
+interface ITransitionReplacerProps {
+    children: JSX.Element | null;
+    forward?: boolean;
+    transition?: Transition;
+}
+export declare class TransitionReplacer extends React.Component<ITransitionReplacerProps> {
+    private componentA;
+    private componentB;
+    private transitionController;
+    render(): React.JSX.Element;
+    private transitionTo;
+}
+export {};

package/dist/ReactComponents/Transitions/TransitionReplacer.js

@@ -0,0 +1,52 @@
+import { __extends } from "tslib";
+import React from "react";
+import { TransitionController } from "./TransitionController";
+import TransitionContainer from "./TransitionContainer";
+import TransitionPanel from "./TransitionPanel";
+var TransitionReplacer = /** @class */ (function (_super) {
+    __extends(TransitionReplacer, _super);
+    function TransitionReplacer() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.componentA = null;
+        _this.componentB = null;
+        _this.transitionController = new TransitionController("A", _this.props.transition);
+        return _this;
+    }
+    TransitionReplacer.prototype.render = function () {
+        var _a, _b;
+        var component = this.props.children;
+        if (component && component.type === ((_a = this.componentA) === null || _a === void 0 ? void 0 : _a.type)) {
+            if (this.transitionController.selectedPanel === "B") {
+                this.transitionTo("A");
+            }
+        }
+        else if (component && component.type === ((_b = this.componentB) === null || _b === void 0 ? void 0 : _b.type)) {
+            if (this.transitionController.selectedPanel === "A") {
+                this.transitionTo("B");
+            }
+        }
+        else {
+            if (this.transitionController.selectedPanel === "A") {
+                this.componentB = component;
+                this.transitionTo("B");
+            }
+            else {
+                this.componentA = component;
+                this.transitionTo("A");
+            }
+        }
+        return React.createElement(TransitionContainer, { controller: this.transitionController },
+            React.createElement(TransitionPanel, { name: "A" }, this.componentA),
+            React.createElement(TransitionPanel, { name: "B" }, this.componentB));
+    };
+    TransitionReplacer.prototype.transitionTo = function (panel) {
+        if (this.props.forward !== false) {
+            this.transitionController.forward(panel);
+        }
+        else {
+            this.transitionController.back(panel);
+        }
+    };
+    return TransitionReplacer;
+}(React.Component));
+export { TransitionReplacer };

package/dist/ReactComponents/Transitions/TransitionSwitcher.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Transition } from "./Transition";
+interface ITransitionSwitcherProps {
+    children: JSX.Element | null;
+    forward?: boolean;
+    transition?: Transition;
+}
+export default class TransitionSwitcher extends React.Component<ITransitionSwitcherProps> {
+    private componentA;
+    private componentB;
+    private transitionController;
+    render(): React.JSX.Element;
+    private transitionTo;
+}
+export {};

package/dist/ReactComponents/Transitions/TransitionSwitcher.js

@@ -0,0 +1,55 @@
+import { __extends } from "tslib";
+import React from "react";
+import { TransitionController } from "./TransitionController";
+import TransitionContainer from "./TransitionContainer";
+import TransitionPanel from "./TransitionPanel";
+var TransitionSwitcher = /** @class */ (function (_super) {
+    __extends(TransitionSwitcher, _super);
+    function TransitionSwitcher() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.componentA = null;
+        _this.componentB = null;
+        _this.transitionController = new TransitionController("A", _this.props.transition);
+        return _this;
+    }
+    TransitionSwitcher.prototype.render = function () {
+        var _a, _b;
+        var component = this.props.children;
+        if (typeof (component === null || component === void 0 ? void 0 : component.type) === "string") {
+            throw "TransitionSwitcher can only have components as children.";
+        }
+        if (component && component.type === ((_a = this.componentA) === null || _a === void 0 ? void 0 : _a.type)) {
+            if (this.transitionController.selectedPanel === "B") {
+                this.transitionTo("A");
+            }
+        }
+        else if (component && component.type === ((_b = this.componentB) === null || _b === void 0 ? void 0 : _b.type)) {
+            if (this.transitionController.selectedPanel === "A") {
+                this.transitionTo("B");
+            }
+        }
+        else {
+            if (this.transitionController.selectedPanel === "A") {
+                this.componentB = component;
+                this.transitionTo("B");
+            }
+            else {
+                this.componentA = component;
+                this.transitionTo("A");
+            }
+        }
+        return React.createElement(TransitionContainer, { controller: this.transitionController },
+            React.createElement(TransitionPanel, { name: "A" }, this.componentA),
+            React.createElement(TransitionPanel, { name: "B" }, this.componentB));
+    };
+    TransitionSwitcher.prototype.transitionTo = function (panel) {
+        if (this.props.forward !== false) {
+            this.transitionController.forward(panel);
+        }
+        else {
+            this.transitionController.back(panel);
+        }
+    };
+    return TransitionSwitcher;
+}(React.Component));
+export default TransitionSwitcher;

package/dist/ReactComponents/Transitions/_Exports.d.ts

@@ -0,0 +1,2 @@
+export { Transition } from './Transition';
+export { TransitionController } from './TransitionController';

package/dist/ReactComponents/Transitions/_Exports.js

@@ -0,0 +1,2 @@
+export { Transition } from './Transition';
+export { TransitionController } from './TransitionController';

package/dist/ReactComponents/_Exports.d.ts

@@ -33,6 +33,8 @@ import PageSizeControl from './Paging/PageSizeControl';
 import ProgressBar from './ProgressBar';
 import RadioList from './RadioList';
 import Slider from './Slider';
+import TransitionContainer from "./Transitions/TransitionContainer";
+import TransitionPanel from "./Transitions/TransitionPanel";
 import TabContainer from './Tabs/TabContainer';
 import Tab from './Tabs/Tab';
 import Toast from './Notifications/Toast';
@@ -40,4 +42,4 @@ import ToastContainer from './Notifications/ToastContainer';
 import Tooltip from './Tooltip';
 import TooltipProvider from './TooltipProvider';
 import ValidationSummary from './ValidationSummary';
-export { Alert, AutoCompleteDropDown, Badge, Button, Card, Checkbox, Collapsable, ColorPicker, ContextMenuContainer, DatePicker, DropDown, FileBasicInput, FileContext, FileDropArea, FileInput, FileUploadButton, FileUploadProgress, Form, FormContext, FormGroup, FormGroupFloating, FormGroupInline, GridLayout, Icon, Input, Link, Loader, Modal, ModalContainer, NumberInput, Pager, PagerControlsBasic, PageSizeControl, Passwordbox, ProgressBar, RadioList, Slider, TabContainer, Tab, Textbox, Toast, ToastContainer, Tooltip, TooltipProvider, ValidationSummary };
+export { Alert, AutoCompleteDropDown, Badge, Button, Card, Checkbox, Collapsable, ColorPicker, ContextMenuContainer, DatePicker, DropDown, FileBasicInput, FileContext, FileDropArea, FileInput, FileUploadButton, FileUploadProgress, Form, FormContext, FormGroup, FormGroupFloating, FormGroupInline, GridLayout, Icon, Input, Link, Loader, Modal, ModalContainer, NumberInput, Pager, PagerControlsBasic, PageSizeControl, Passwordbox, ProgressBar, RadioList, Slider, TabContainer, Tab, Textbox, TransitionContainer, TransitionPanel, Toast, ToastContainer, Tooltip, TooltipProvider, ValidationSummary };

package/dist/ReactComponents/_Exports.js

@@ -33,6 +33,8 @@ import PageSizeControl from './Paging/PageSizeControl';
 import ProgressBar from './ProgressBar';
 import RadioList from './RadioList';
 import Slider from './Slider';
+import TransitionContainer from "./Transitions/TransitionContainer";
+import TransitionPanel from "./Transitions/TransitionPanel";
 import TabContainer from './Tabs/TabContainer';
 import Tab from './Tabs/Tab';
 import Toast from './Notifications/Toast';
@@ -40,4 +42,4 @@ import ToastContainer from './Notifications/ToastContainer';
 import Tooltip from './Tooltip';
 import TooltipProvider from './TooltipProvider';
 import ValidationSummary from './ValidationSummary';
-export { Alert, AutoCompleteDropDown, Badge, Button, Card, Checkbox, Collapsable, ColorPicker, ContextMenuContainer, DatePicker, DropDown, FileBasicInput, FileContext, FileDropArea, FileInput, FileUploadButton, FileUploadProgress, Form, FormContext, FormGroup, FormGroupFloating, FormGroupInline, GridLayout, Icon, Input, Link, Loader, Modal, ModalContainer, NumberInput, Pager, PagerControlsBasic, PageSizeControl, Passwordbox, ProgressBar, RadioList, Slider, TabContainer, Tab, Textbox, Toast, ToastContainer, Tooltip, TooltipProvider, ValidationSummary };
+export { Alert, AutoCompleteDropDown, Badge, Button, Card, Checkbox, Collapsable, ColorPicker, ContextMenuContainer, DatePicker, DropDown, FileBasicInput, FileContext, FileDropArea, FileInput, FileUploadButton, FileUploadProgress, Form, FormContext, FormGroup, FormGroupFloating, FormGroupInline, GridLayout, Icon, Input, Link, Loader, Modal, ModalContainer, NumberInput, Pager, PagerControlsBasic, PageSizeControl, Passwordbox, ProgressBar, RadioList, Slider, TabContainer, Tab, Textbox, TransitionContainer, TransitionPanel, Toast, ToastContainer, Tooltip, TooltipProvider, ValidationSummary };

package/dist/Routing/BreadCrumbItem.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare class BreadCrumbItem {
     /** Text to show in the breadcrumb component. */
     label: string | (() => string);

package/dist/Routing/IRouteChangedProps.d.ts

@@ -1,5 +1,5 @@
 import { Misc, Routing, Views } from "@singularsystems/neo-core";
-import { match } from "react-router-dom";
+export type RouteChangedLeavePrompt = string | false | Promise<boolean> | Promise<Misc.ModalResult>;
 export interface IRouteChangedProps {
     /**
      * True if the user is navigating to a new view or leaving the site. False if navigating to a sub route in this view.
@@ -20,12 +20,14 @@ export interface IRouteChangedProps {
     /**
      * The url match information. Url parameter values can be viewed on this object.
      */
-    readonly match?: match;
+    readonly params?: {
+        [index: string]: any;
+    };
     /**
      * A leave prompt to show the user before the location is changed.
      * If you want to display your own prompt, set this to the promise returned by the modal.
      * If you want to block navigation (with no option for the user to continue), return false.
      * Note: if `isUnload` is true, the browser will show a native leave prompt regardless of whether you show a custom prompt.
      */
-    leavePrompt?: string | false | Promise<boolean> | Promise<Misc.ModalResult> | Promise<void>;
+    leavePrompt?: RouteChangedLeavePrompt;
 }

package/dist/Routing/NavigationHelper.d.ts

@@ -1,8 +1,8 @@
 import ViewBase from '../Views/ViewBase';
-import { RouteComponentProps } from 'react-router';
 import { RoutingState } from './RoutingState';
 import { INavigationHelper as INeoNavigationHelper } from '@singularsystems/neo-core/dist/Routing/INavigationHelper';
 import { RouteParameterObject } from './IRouteParameter';
+import type { IPageLeaveHandler } from "./PageLeaveHandler";
 export type ViewConstructor<TParams extends RouteParameterObject<TParams>> = new (...args: any) => ViewBase<any, TParams>;
 export type ParamValues<TParams> = {
     [P in keyof TParams]?: number | string | null;
@@ -25,17 +25,18 @@ export interface INavigationHelper extends INeoNavigationHelper {
      * Gets the path of the currently rendered view, without parameter components.
      */
     getCurrentViewPath(): string;
-    /**
-     * Gets the react-router properties for the current route.
-     */
-    readonly currentRouteProps: RouteComponentProps;
 }
 export default class NavigationHelper implements INavigationHelper {
     private routingState;
-    constructor(routingState: RoutingState);
-    navigateInternal(url: string, replace?: boolean): void;
+    private pageLeaveHandler;
+    constructor(routingState: RoutingState, pageLeaveHandler: IPageLeaveHandler);
+    private prevUrls;
+    private isPrompting;
+    navigateInternal(url: string, replace?: boolean): Promise<boolean>;
     navigateToView<TParams extends RouteParameterObject<TParams>>(view: ViewConstructor<TParams>, paramValues?: ParamValues<TParams>): void;
     getPathForView<TParams extends RouteParameterObject<TParams>>(view: ViewConstructor<TParams>, paramValues?: ParamValues<TParams>): string;
     getCurrentViewPath(): string;
-    get currentRouteProps(): import("react-router").RouteComponentProps<{}, import("react-router").StaticContext, unknown>;
+    private historyPopState;
+    private windowUnload;
+    private beforeLocationChanged;
 }