@singularsystems/neo-react 1.0.0-alpha.2 → 1.0.0-beta.0

package/dist/Routing/RouteView.js

@@ -1,144 +1,143 @@
-import { __extends } from "tslib";
-import * as React from 'react';
-import { matchPath } from 'react-router';
-import { AppServices, Misc } from '@singularsystems/neo-core';
-import ViewBase from '../Views/ViewBase';
-import { NeoReactTypes } from '../Modules/Types';
-import { Observer } from 'mobx-react';
-var RouteView = /** @class */ (function (_super) {
-    __extends(RouteView, _super);
-    function RouteView(props) {
-        var _this = _super.call(this, props) || this;
-        _this.securityService = Misc.Globals.appService.get(AppServices.NeoTypes.Security.SecurityService);
-        _this.routeSecurityService = Misc.Globals.appService.get(AppServices.NeoTypes.Routing.RouteSecurityService);
-        _this.routingState = Misc.Globals.appService.get(NeoReactTypes.Routing.GlobalRoutingState);
-        _this.state = {};
-        _this.routingState.currentRouteView = _this;
-        return _this;
-    }
-    Object.defineProperty(RouteView.prototype, "routes", {
-        get: function () {
-            return this._routes;
-        },
-        set: function (value) {
-            this._routes = value;
-            this.routingState.appRouteProvider = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    RouteView.prototype.componentDidMount = function () {
-        this.historyBlockDisposer = this.props.history.block(this.beforeLocationChanged.bind(this));
-        this.routingState.onRouteChanged();
-    };
-    RouteView.prototype.componentDidUpdate = function () {
-        this.routingState.onRouteChanged();
-    };
-    RouteView.prototype.componentWillUnmount = function () {
-        if (this.historyListenDisposer) {
-            this.historyListenDisposer();
-        }
-        if (this.historyBlockDisposer) {
-            this.historyBlockDisposer();
-        }
-    };
-    RouteView.prototype.beforeLocationChanged = function (location, action, isUnload) {
-        var _a;
-        var currentRoute = this.routingState.currentRoute;
-        var match = location ? this.getMatch(location) : undefined;
-        var changeProps = {
-            isNewView: !currentRoute || !match || match.route !== currentRoute,
-            isUnload: isUnload !== null && isUnload !== void 0 ? isUnload : false,
-            currentView: (_a = ViewBase.currentView) !== null && _a !== void 0 ? _a : undefined,
-            newRoute: match === null || match === void 0 ? void 0 : match.route,
-            match: match === null || match === void 0 ? void 0 : match.match
-        };
-        if (ViewBase.currentView) {
-            ViewBase.currentView.beforeRouteChanged(changeProps);
-            if (changeProps.leavePrompt === undefined && (changeProps.isNewView || changeProps.isUnload)) {
-                changeProps.leavePrompt = ViewBase.currentView.onLeave();
-            }
-        }
-        this.beforeRouteChanged(changeProps);
-        if (changeProps.leavePrompt === undefined) {
-            return undefined;
-        }
-        else if (typeof changeProps.leavePrompt === "string") {
-            return changeProps.leavePrompt;
-        }
-        else if (changeProps.leavePrompt === false) {
-            return false;
-        }
-        else {
-            this.routingState.leavePromise = changeProps.leavePrompt;
-            return "";
-        }
-    };
-    /**
-     * Called when the url changes, before the router renders the new view.
-     * Return a string to block navigation.
-     * @param isNewView True if the view is changing. False if a view parameter value is changing.
-     * @param currentView The current view before change.
-     */
-    RouteView.prototype.beforeRouteChanged = function (props) {
-    };
-    RouteView.prototype.getMatch = function (location) {
-        for (var _i = 0, _a = this._routes.flattenedRoutes; _i < _a.length; _i++) {
-            var route = _a[_i];
-            var match = matchPath(location.pathname, { path: route.routePath, exact: RouteView.isExact(route) });
-            if (match) {
-                return { match: match, route: route };
-            }
-        }
-        return null;
-    };
-    RouteView.isExact = function (route) {
-        if (route.exact === undefined) {
-            return route.path === "/" || (route.path !== undefined && route.children !== undefined);
-        }
-        else {
-            return route.exact;
-        }
-    };
-    RouteView.prototype.render = function () {
-        var _this = this;
-        return React.createElement(this.switchComponent, {}, [this.routes.flattenedRoutes.map(function (route) { return (React.createElement(_this.routeComponent, { key: route.key, path: route.routePath, exact: RouteView.isExact(route),
-                render: function (props) {
-                    _this.routingState.setCurrentRoute(props, route);
-                    return React.createElement(Observer, null, function () { return _this.getRouteComponent(route, props.location.pathname + props.location.search); });
-                } })); })]);
-    };
-    RouteView.prototype.getRouteComponent = function (route, path) {
-        if (!route.allowAnonymous) {
-            if (this.securityService.isAuthenticated) {
-                if (!this.isAuthorised(route)) {
-                    //Render forbidden
-                    return this.getForbiddenComponent(route);
-                }
-            }
-            else {
-                //Redirect
-                void this.securityService.authentication.beginSignIn(path);
-                return this.getSigningInComponent(route);
-            }
-        }
-        return this.getAuthorisedComponent(route, path);
-    };
-    /**
-     * Creates the routes component after authentication and authorisation checks have been done.
-     * This can be used to override all routes to display pages like terms and conditions.
-     * To redirect to a route, return a react router <Redirect to= /> component.
-     */
-    RouteView.prototype.getAuthorisedComponent = function (route, path) {
-        return React.createElement(route.component, null);
-    };
-    /**
-     * Checks if the user is authorised to access this route.
-     * Component from getForbiddenComponent() is returned if not.
-     */
-    RouteView.prototype.isAuthorised = function (route) {
-        return this.routeSecurityService.routeAllowed(route);
-    };
-    return RouteView;
-}(React.Component));
-export default RouteView;
+import { __extends } from "tslib";
+import * as React from 'react';
+import { matchPath } from 'react-router';
+import { AppServices, Misc } from '@singularsystems/neo-core';
+import { NeoReactTypes } from '../Modules/Types';
+import { Observer } from 'mobx-react';
+var RouteView = /** @class */ (function (_super) {
+    __extends(RouteView, _super);
+    function RouteView(props) {
+        var _this = _super.call(this, props) || this;
+        _this.securityService = Misc.Globals.appService.get(AppServices.NeoTypes.Security.SecurityService);
+        _this.routeSecurityService = Misc.Globals.appService.get(AppServices.NeoTypes.Routing.RouteSecurityService);
+        _this.routingState = Misc.Globals.appService.get(NeoReactTypes.Routing.GlobalRoutingState);
+        _this.state = {};
+        _this.routingState.currentRouteView = _this;
+        return _this;
+    }
+    Object.defineProperty(RouteView.prototype, "routes", {
+        get: function () {
+            return this._routes;
+        },
+        set: function (value) {
+            this._routes = value;
+            this.routingState.appRouteProvider = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    RouteView.prototype.componentDidMount = function () {
+        this.historyBlockDisposer = this.props.history.block(this.beforeLocationChanged.bind(this));
+        this.routingState.onRouteChanged();
+    };
+    RouteView.prototype.componentDidUpdate = function () {
+        this.routingState.onRouteChanged();
+    };
+    RouteView.prototype.componentWillUnmount = function () {
+        if (this.historyListenDisposer) {
+            this.historyListenDisposer();
+        }
+        if (this.historyBlockDisposer) {
+            this.historyBlockDisposer();
+        }
+    };
+    RouteView.prototype.beforeLocationChanged = function (location, action, isUnload) {
+        var _a;
+        var currentRoute = this.routingState.currentRoute;
+        var match = location ? this.getMatch(location) : undefined;
+        var changeProps = {
+            isNewView: !currentRoute || !match || match.route !== currentRoute,
+            isUnload: isUnload !== null && isUnload !== void 0 ? isUnload : false,
+            currentView: (_a = this.routingState.currentView) !== null && _a !== void 0 ? _a : undefined,
+            newRoute: match === null || match === void 0 ? void 0 : match.route,
+            match: match === null || match === void 0 ? void 0 : match.match
+        };
+        if (this.routingState.currentView) {
+            this.routingState.currentView.beforeRouteChanged(changeProps);
+            if (changeProps.leavePrompt === undefined && (changeProps.isNewView || changeProps.isUnload)) {
+                changeProps.leavePrompt = this.routingState.currentView.onLeave();
+            }
+        }
+        this.beforeRouteChanged(changeProps);
+        if (changeProps.leavePrompt === undefined) {
+            return undefined;
+        }
+        else if (typeof changeProps.leavePrompt === "string") {
+            return changeProps.leavePrompt;
+        }
+        else if (changeProps.leavePrompt === false) {
+            return false;
+        }
+        else {
+            this.routingState.leavePromise = changeProps.leavePrompt;
+            return "";
+        }
+    };
+    /**
+     * Called when the url changes, before the router renders the new view.
+     * Return a string to block navigation.
+     * @param isNewView True if the view is changing. False if a view parameter value is changing.
+     * @param currentView The current view before change.
+     */
+    RouteView.prototype.beforeRouteChanged = function (props) {
+    };
+    RouteView.prototype.getMatch = function (location) {
+        for (var _i = 0, _a = this._routes.flattenedRoutes; _i < _a.length; _i++) {
+            var route = _a[_i];
+            var match = matchPath(location.pathname, { path: route.routePath, exact: RouteView.isExact(route) });
+            if (match) {
+                return { match: match, route: route };
+            }
+        }
+        return null;
+    };
+    RouteView.isExact = function (route) {
+        if (route.exact === undefined) {
+            return route.path === "/" || (route.path !== undefined && route.children !== undefined);
+        }
+        else {
+            return route.exact;
+        }
+    };
+    RouteView.prototype.render = function () {
+        var _this = this;
+        return React.createElement(this.switchComponent, {}, [this.routes.flattenedRoutes.map(function (route) { return (React.createElement(_this.routeComponent, { key: route.key, path: route.routePath, exact: RouteView.isExact(route),
+                render: function (props) {
+                    _this.routingState.setCurrentRoute(props, route);
+                    return React.createElement(Observer, null, function () { return _this.getRouteComponent(route, props.location.pathname + props.location.search); });
+                } })); })]);
+    };
+    RouteView.prototype.getRouteComponent = function (route, path) {
+        if (!route.allowAnonymous) {
+            if (this.securityService.isAuthenticated) {
+                if (!this.isAuthorised(route)) {
+                    //Render forbidden
+                    return this.getForbiddenComponent(route);
+                }
+            }
+            else {
+                //Redirect
+                void this.securityService.authentication.beginSignIn(path);
+                return this.getSigningInComponent(route);
+            }
+        }
+        return this.getAuthorisedComponent(route, path);
+    };
+    /**
+     * Creates the routes component after authentication and authorisation checks have been done.
+     * This can be used to override all routes to display pages like terms and conditions.
+     * To redirect to a route, return a react router <Redirect to= /> component.
+     */
+    RouteView.prototype.getAuthorisedComponent = function (route, path) {
+        return React.createElement(route.component, null);
+    };
+    /**
+     * Checks if the user is authorised to access this route.
+     * Component from getForbiddenComponent() is returned if not.
+     */
+    RouteView.prototype.isAuthorised = function (route) {
+        return this.routeSecurityService.routeAllowed(route);
+    };
+    return RouteView;
+}(React.Component));
+export default RouteView;

package/dist/Routing/RoutingState.d.ts

@@ -1,15 +1,18 @@
-import { Misc } from '@singularsystems/neo-core';
-import { RouteComponentProps } from 'react-router-dom';
-import RouteProvider, { IProcessedRoute } from './RouteProvider';
-import RouteView from './RouteView';
-export declare class RoutingState {
-    appRouteProvider: RouteProvider;
-    currentRouteProps: RouteComponentProps;
-    currentRoute?: IProcessedRoute;
-    currentRouteView?: RouteView;
-    leavePromise?: Promise<boolean> | Promise<Misc.ModalResult> | Promise<void>;
-    observableRoute: IProcessedRoute | null;
-    setCurrentRoute(routeProps: RouteComponentProps, route: IProcessedRoute): void;
-    private previousRoute?;
-    onRouteChanged(): void;
-}
+import { Misc } from '@singularsystems/neo-core';
+import { RouteComponentProps } from 'react-router-dom';
+import { IViewBase } from '../Views/ViewBase';
+import RouteProvider, { IProcessedRoute } from './RouteProvider';
+import RouteView from './RouteView';
+export declare class RoutingState {
+    appRouteProvider: RouteProvider;
+    currentRouteProps: RouteComponentProps;
+    currentRoute?: IProcessedRoute;
+    currentRouteView?: RouteView;
+    leavePromise?: Promise<boolean> | Promise<Misc.ModalResult> | Promise<void>;
+    observableRoute: IProcessedRoute | null;
+    currentView: IViewBase | null;
+    constructor();
+    setCurrentRoute(routeProps: RouteComponentProps, route: IProcessedRoute): void;
+    private previousRoute?;
+    onRouteChanged(): void;
+}

package/dist/Routing/RoutingState.js

@@ -1,40 +1,45 @@
-import { __decorate, __metadata } from "tslib";
-import { injectable } from 'inversify';
-import { observable } from 'mobx';
-import { ViewBase } from '../Views';
-var RoutingState = /** @class */ (function () {
-    function RoutingState() {
-        this.observableRoute = null;
-    }
-    RoutingState.prototype.setCurrentRoute = function (routeProps, route) {
-        this.currentRouteProps = routeProps;
-        this.currentRoute = route;
-    };
-    RoutingState.prototype.onRouteChanged = function () {
-        var _a, _b;
-        if (this.previousRoute !== this.currentRoute) {
-            this.previousRoute = this.currentRoute;
-            this.observableRoute = (_a = this.currentRoute) !== null && _a !== void 0 ? _a : null;
-            if (((_b = ViewBase.currentView) === null || _b === void 0 ? void 0 : _b.constructor) !== this.currentRoute.component) {
-                ViewBase.currentView = null;
-            }
-            // Scroll back to top as if the browser had actually loaded a new page.
-            window.scrollTo(0, 0);
-        }
-        else {
-            // Same route, but parameters must have changed.
-            if (ViewBase.currentView) {
-                ViewBase.currentView.updateViewParams(this.currentRouteProps.match);
-            }
-        }
-    };
-    __decorate([
-        observable.ref,
-        __metadata("design:type", Object)
-    ], RoutingState.prototype, "observableRoute", void 0);
-    RoutingState = __decorate([
-        injectable()
-    ], RoutingState);
-    return RoutingState;
-}());
-export { RoutingState };
+import { __decorate, __metadata } from "tslib";
+import { injectable } from 'inversify';
+import { makeObservable, observable } from 'mobx';
+export var RoutingState = /** @class */ (function () {
+    function RoutingState() {
+        this.observableRoute = null;
+        this.currentView = null;
+        makeObservable(this);
+    }
+    RoutingState.prototype.setCurrentRoute = function (routeProps, route) {
+        this.currentRouteProps = routeProps;
+        this.currentRoute = route;
+    };
+    RoutingState.prototype.onRouteChanged = function () {
+        var _a, _b;
+        if (this.previousRoute !== this.currentRoute) {
+            this.previousRoute = this.currentRoute;
+            this.observableRoute = (_a = this.currentRoute) !== null && _a !== void 0 ? _a : null;
+            if (((_b = this.currentView) === null || _b === void 0 ? void 0 : _b.constructor) !== this.currentRoute.component) {
+                this.currentView = null;
+            }
+            // Scroll back to top as if the browser had actually loaded a new page.
+            window.scrollTo(0, 0);
+        }
+        else {
+            // Same route, but parameters must have changed.
+            if (this.currentView) {
+                this.currentView.updateViewParams(this.currentRouteProps.match);
+            }
+        }
+    };
+    __decorate([
+        observable.ref,
+        __metadata("design:type", Object)
+    ], RoutingState.prototype, "observableRoute", void 0);
+    __decorate([
+        observable.ref,
+        __metadata("design:type", Object)
+    ], RoutingState.prototype, "currentView", void 0);
+    RoutingState = __decorate([
+        injectable(),
+        __metadata("design:paramtypes", [])
+    ], RoutingState);
+    return RoutingState;
+}());

package/dist/Routing/ViewParameter.d.ts

@@ -1,58 +1,80 @@
-import { IRouteParameter } from './IRouteParameter';
-import { IViewParameterListInternal } from './ViewParameterList';
-import { Model } from '@singularsystems/neo-core';
-export interface IViewParameter {
-    /**
-     * Gets or sets the current parameter value.
-     */
-    value: number | string | null;
-    /**
-     * Clears the value, replacing the url instead of adding to the history.
-     * This prevents the back button returning the params to the current state.
-     */
-    reset(): void;
-    /**
-     * Gets or sets the description which corresponds with the value.
-     * Used by the breadcrumb.
-     */
-    description: string;
-    /**
-     * Returns value as a nullable int.
-     */
-    asNullableInt(): number | null;
-    /**
-     * Returns the value as a string. String will be empty if the underlying value is null.
-     */
-    asString(): string;
-    /**
-     * Allows this view parameter to automatically update when the provided properties value changes.
-     * This is one way, you will still need to set the property value in viewParamsUpdated()
-     */
-    bindTo(property: Model.IPropertyInstance): void;
-    /**
-     * Allows this view parameter to automatically update when the value returned in the provided callback changes.
-     */
-    bindTo(callback: () => (string | number | null | undefined)): void;
-}
-export declare class ViewParameter implements IViewParameter {
-    private parent;
-    name: string;
-    routeParameter: IRouteParameter;
-    private hasPendingValue;
-    private pendingValue;
-    private _value;
-    constructor(parent: IViewParameterListInternal, name: string, routeParameter: IRouteParameter);
-    bindTo(propertyOrCallback: Model.IPropertyInstance | (() => (string | number | null | undefined))): void;
-    get value(): number | string | null;
-    set value(value: number | string | null);
-    reset(): void;
-    description: string;
-    asNullableInt(): number | null;
-    asString(): string;
-    /** Sets the initial value, and returns true if the value changed. */
-    setInitial(value: string | null): boolean;
-    getParamString(state: {
-        hasQuery: boolean;
-    }): string;
-    get latestValue(): string | null;
-}
+/// <reference types="react" />
+import { IRouteParameter } from './IRouteParameter';
+import { IViewParameterListInternal } from './ViewParameterList';
+import { Model } from '@singularsystems/neo-core';
+export interface IViewParameter {
+    /**
+     * Gets or sets the current parameter value.
+     */
+    value: number | string | null;
+    /**
+     * Clears the value, replacing the url instead of adding to the history.
+     * This prevents the back button returning the params to the current state.
+     */
+    reset(): void;
+    /**
+     * Gets or sets the description which corresponds with the value.
+     * Used by the breadcrumb.
+     */
+    description: string;
+    /**
+     * Sets the description, and an optional list of prefixes.
+     * @param description Description of the current value.
+     * @param prefixes Function that returns prefixes for this breadcrumb item. The previous prefixes are passed into the function.
+     */
+    setDescription(description: string, getPrefixes?: (currentPrefixes: IViewParameterPrefix[]) => IViewParameterPrefix[]): void;
+    /**
+     * Returns value as a nullable int.
+     */
+    asNullableInt(): number | null;
+    /**
+     * Returns the value as a string. String will be empty if the underlying value is null.
+     */
+    asString(): string;
+    /**
+     * Allows this view parameter to automatically update when the provided properties value changes.
+     * This is one way, you will still need to set the property value in viewParamsUpdated()
+     */
+    bindTo(property: Model.IPropertyInstance): void;
+    /**
+     * Allows this view parameter to automatically update when the value returned in the provided callback changes.
+     */
+    bindTo(callback: () => (string | number | null | undefined)): void;
+}
+export declare class ViewParameter implements IViewParameter {
+    private parent;
+    name: string;
+    routeParameter: IRouteParameter;
+    private hasPendingValue;
+    private pendingValue;
+    private _value;
+    prefixes: IViewParameterPrefix[];
+    constructor(parent: IViewParameterListInternal, name: string, routeParameter: IRouteParameter);
+    bindTo(propertyOrCallback: Model.IPropertyInstance | (() => (string | number | null | undefined))): void;
+    get value(): number | string | null;
+    set value(value: number | string | null);
+    reset(): void;
+    _description: string;
+    get description(): string;
+    set description(value: string);
+    setDescription(description: string, getPrefixes?: (currentPrefixes: IViewParameterPrefix[]) => IViewParameterPrefix[]): void;
+    asNullableInt(): number | null;
+    asString(): string;
+    /** Updates the current value, and returns true if the value changed. */
+    update(value: string | null): boolean;
+    getParamString(state: {
+        hasQuery: boolean;
+    }): string;
+    get latestValue(): string | null;
+}
+interface IViewParameterPrefix {
+    /** Label to show on breadcrumb. */
+    label: string;
+    /** Value to use in the breadcrumb link. Clicking on the link will set the view parameter to this value. */
+    value?: number | string | null;
+    /** Custom link to use in the breadcrumb. */
+    link?: string;
+    /** Click event for the breadcrumb. */
+    onClick?: (e: React.MouseEvent) => void;
+}
+export {};