@coolon/angular-ui-powerups 3.5.3 → 3.7.0-alpha.0

package/fesm2015/coolon-angular-ui-powerups.js

@@ -1,5 +1,5 @@
 import { DOCUMENT, CommonModule, Location } from '@angular/common';
-import { Directive, ElementRef, Inject, Host, Optional, Input, HostListener, NgZone, ɵɵdefineInjectable, ɵɵinject, Injectable, NgModule, Component, ContentChild, EventEmitter, SkipSelf, ViewChild, Output, ViewChildren, HostBinding, ViewEncapsulation, Self, TemplateRef, ChangeDetectorRef, ContentChildren, ViewContainerRef, InjectionToken, Injector, ComponentFactoryResolver } from '@angular/core';
+import { Directive, ElementRef, Inject, Host, Optional, Input, HostListener, NgZone, ɵɵdefineInjectable, ɵɵinject, Injectable, NgModule, Component, ContentChild, EventEmitter, SkipSelf, ViewChild, Output, ViewChildren, HostBinding, ViewEncapsulation, Self, TemplateRef, ChangeDetectorRef, ContentChildren, ViewContainerRef, InjectionToken, Injector, ComponentFactoryResolver, INJECTOR } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
@@ -21,13 +21,13 @@ import { fas } from '@fortawesome/free-solid-svg-icons';
 import { GarbageCollector, DelegatingValueModel, assert, UnaryCommand, lang, Dsl, Logger, TrackExternal, Command, MutableValueModel, StoreInValueModel, ValueModel, MutableListModel, ListModel, StoreInListModel, FocusManager, EventListenerList, Form, Guard, Binding, DebugContext, MultipleSelectionModel, DirtyTrackingForm, DelegatingCommand, Deferred, Trace, Functions } from '@coolon/pectin';
 import { __decorate, __metadata, __awaiter } from 'tslib';
 import { Memoize } from '@typescript-plus/fast-memoize-decorator/dist/src';
-import _, { isEqual, isNil } from 'lodash';
+import _, { isNil, isEqual } from 'lodash';
 import { Enum } from 'typescript-string-enums';
 import { assert as assert$1, Opts, lang as lang$1, Klass } from '@coolon/typescript-utilities';
 import produce from 'immer';
 import { FlexModule, GridModule } from '@angular/flex-layout';
 import { MatDialogModule, MatDialog, MAT_DIALOG_DEFAULT_OPTIONS, MatDialogConfig } from '@angular/material/dialog';
-import { RouterModule, NavigationStart, NavigationCancel, UrlSegment, Router, UrlSerializer, NavigationEnd, NavigationError, RouterOutlet } from '@angular/router';
+import { RouterModule, ActivatedRouteSnapshot, NavigationStart, NavigationCancel, UrlSegment, Router, UrlSerializer, NavigationEnd, NavigationError, RouterOutlet, RouterStateSnapshot } from '@angular/router';
 import { Overlay, CdkScrollable } from '@angular/cdk/overlay';
 import ResizeObserver from 'resize-observer-polyfill';
 import { MatListModule } from '@angular/material/list';
@@ -35,7 +35,6 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { Memoize as Memoize$1 } from '@typescript-plus/fast-memoize-decorator';
 import 'reflect-metadata';
 import { style, query, group, animate, trigger, transition } from '@angular/animations';
-import { Observable } from 'rxjs';
 
 class CommandDirective extends GarbageCollector {
     constructor(elementRef, matButton, matMenuItem) {
@@ -1617,8 +1616,6 @@ __decorate([
 class NumberInputComponent extends AbstractValueInputComponent {
     constructor() {
         super();
-        // @Input() @TrackExternal({ delegateTo: 'inputModel' })
-        // valueModel: Form.ValueModelBase<number> | MutableValueModel<number>;
         this.min = Number.MIN_SAFE_INTEGER;
         this.max = Number.MAX_SAFE_INTEGER;
     }
@@ -1628,19 +1625,18 @@ class NumberInputComponent extends AbstractValueInputComponent {
 NumberInputComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-number-input',
-                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"number\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n         [min]=\"min\"\n         [max]=\"max\"\n  >\n  <mat-hint *ngIf=\"hint && !dense\" >{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
+                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"number\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [attr.autocomplete]=\"autocomplete\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n         [min]=\"min\"\n         [max]=\"max\"\n  >\n  <mat-hint *ngIf=\"hint && !dense\" >{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
                 styles: [""]
             },] }
 ];
 NumberInputComponent.ctorParameters = () => [];
 NumberInputComponent.propDecorators = {
+    autocomplete: [{ type: Input }],
     min: [{ type: Input }],
     max: [{ type: Input }]
 };
 
 class PasswordInputComponent extends AbstractValueInputComponent {
-    // @Input() @TrackExternal({ delegateTo: 'inputModel' })
-    // valueModel: Form.ValueModelBase<string> | MutableValueModel<string>;
     constructor() {
         super();
     }
@@ -1650,11 +1646,14 @@ class PasswordInputComponent extends AbstractValueInputComponent {
 PasswordInputComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-password-input',
-                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"password\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
+                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"password\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [attr.autocomplete]=\"autocomplete\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
                 styles: [""]
             },] }
 ];
 PasswordInputComponent.ctorParameters = () => [];
+PasswordInputComponent.propDecorators = {
+    autocomplete: [{ type: Input }]
+};
 
 /**
  * Using templates:
@@ -1712,12 +1711,13 @@ class StringInputComponent extends AbstractValueInputComponent {
 StringInputComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-string-input',
-                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n  <button mat-button mat-icon-button matSuffix *ngIf=\"enableClear\" [pectinCommand]=\"clearCommand\">\n    <aup-icon icon=\"mat:close\"></aup-icon>\n  </button>\n</mat-form-field>\n\n",
+                template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input matInput\n         placeholder=\"{{placeholder}}\"\n         [attr.autocomplete]=\"autocomplete\"\n         [(ngModel)]=\"componentValueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"focusContext\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n  <button mat-button mat-icon-button matSuffix *ngIf=\"enableClear\" [pectinCommand]=\"clearCommand\">\n    <aup-icon icon=\"mat:close\"></aup-icon>\n  </button>\n</mat-form-field>\n\n",
                 styles: ["button[disabled]{visibility:hidden}"]
             },] }
 ];
 StringInputComponent.ctorParameters = () => [];
 StringInputComponent.propDecorators = {
+    autocomplete: [{ type: Input }],
     enableClearModel: [{ type: Input }],
     enableClear: [{ type: Input }]
 };
@@ -3867,6 +3867,18 @@ InteractionService.ctorParameters = () => [
     InteractionService.ApiAdapter = ApiAdapter;
 })(InteractionService || (InteractionService = {}));
 
+/**
+ * @example
+ *   <aup-in-place-interaction-context #inPlaceInteractionContext>
+ *
+ *   </aup-in-place-interaction-context>
+ *
+ *   in your component
+ *     @ViewChild('inPlaceInteractionContext', { static: true })
+ *     interactionContext: InteractionContext;
+ *
+ *
+ */
 class InPlaceInteractionContextComponent extends DisposableComponent {
     constructor(interactionService, tabConfig) {
         super();
@@ -4376,6 +4388,8 @@ InteractionModule.decorators = [
             },] }
 ];
 
+const PLACE_AUTH_SERVICE = new InjectionToken("PlaceAuthService");
+
 class ParameterDefinition {
     constructor(propertyName, options, urlFormat) {
         this.propertyName = propertyName;
@@ -4461,10 +4475,11 @@ class ParameterDefinition {
 })(ParameterDefinition || (ParameterDefinition = {}));
 
 class PlaceDefinition {
-    constructor(component, path, authenticate, data, routeParameters, children) {
+    constructor(component, path, authenticate, roles, data, routeParameters, children) {
         this.component = component;
         this.path = path;
         this.authenticate = authenticate;
+        this.roles = roles;
         this.data = data;
         this.routeParameters = routeParameters;
         this.children = children;
@@ -4684,8 +4699,17 @@ __decorate([
         return Klass.get(klass).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
     }
     PlaceComponent.getRouteParameters = getRouteParameters;
-    function getDefinition(klass) {
-        return Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
+    function getDefinition(snapshotOrConstructor) {
+        if (snapshotOrConstructor instanceof ActivatedRouteSnapshot) {
+            const component = snapshotOrConstructor.component;
+            if (!isPlaceComponentConstructor(component)) {
+                throw new Error(`ActivatedRouteSnapshot component is not a PlaceComponent, got ${component}`);
+            }
+            return Reflect.getMetadata(DEFINITION_META_DATA_KEY, component);
+        }
+        else {
+            return Reflect.getMetadata(DEFINITION_META_DATA_KEY, snapshotOrConstructor);
+        }
     }
     PlaceComponent.getDefinition = getDefinition;
     function injectDefinition(klass, definition) {
@@ -4694,6 +4718,72 @@ __decorate([
     PlaceComponent.injectDefinition = injectDefinition;
 })(PlaceComponent || (PlaceComponent = {}));
 
+class Visit {
+    constructor(placeDefinition, visitParameters = {}) {
+        this.placeDefinition = placeDefinition;
+        this.visitParameters = visitParameters;
+    }
+    // @Trace()
+    getRouteId() {
+        return this.placeDefinition.getRouteIdFrom(this);
+    }
+    // @Trace()
+    hasRouteId() {
+        return !isNil(this.getRouteId());
+    }
+    /**
+     * Returns the value of the place parameter with the specified name.  The parameter
+     * name is taken from the `as` option, e.g. {as: 'aCustomName'} otherwise it is the
+     * same as the the ValueModel property name.
+     * @param parameterName the field name of the property model or the `as` option if specified.
+     */
+    getParameter(parameterName) {
+        return this.visitParameters[parameterName];
+    }
+    // @Trace()
+    hasParameter(parameterName) {
+        return Object.keys(this.visitParameters).includes(parameterName);
+    }
+    replace(parameter, value) {
+        return new Visit(this.placeDefinition, Object.assign(Object.assign({}, this.visitParameters), { [parameter.name]: value }));
+    }
+    mergeRouteParameters(routeParams) {
+        // todo: whitelist parameters.
+        const routeParameterKeys = Object.keys(routeParams);
+        const params = {};
+        this.placeDefinition.getVisitParameterDefs().forEach(def => {
+            if (def.isRouteId || def.isRouteParameter) {
+                if (routeParameterKeys.includes(def.name)) {
+                    params[def.name] = routeParams[def.name];
+                }
+            }
+            else {
+                // copy non route params as is, but only if they already exist otherwise we'll inject nil values and break the
+                // defaults and remember sanitisation process.
+                const value = this.getParameter(def.name);
+                if (this.hasParameter(def.name)) {
+                    params[def.name] = value;
+                }
+            }
+        });
+        return new Visit(this.placeDefinition, params);
+    }
+    hasRoutingChangedFrom(other) {
+        const samePlace = other.placeDefinition === this.placeDefinition;
+        const sameRouteParameters = isEqual(this.placeDefinition.getFormattedRouteParameters(this, true), this.placeDefinition.getFormattedRouteParameters(other, true));
+        return !samePlace || !sameRouteParameters;
+    }
+    hasChangedFrom(other) {
+        const sameNonRouteParameters = isEqual(this.placeDefinition.getNonRouteParameters(this), this.placeDefinition.getNonRouteParameters(other));
+        return !sameNonRouteParameters || this.hasRoutingChangedFrom(other);
+    }
+    toDebugString() {
+        return Object.keys(this.visitParameters).map(k => `${k}=${this.visitParameters[k]}`).join(",");
+    }
+}
+
+const AUP_PLACE_CONFIG = new InjectionToken('AUP_PLACE_CONFIG');
+
 /**
  * This class handles the logic around canDeactivate for a given router state transition.  It's core responsibilities are:
  * 1. Ensure we only ask the component to deactivate once on a given navigation cycle (since visit sanitisation can result in multiple round trips to through the router.)
@@ -5762,6 +5852,9 @@ class PlaceRouter extends GarbageCollector {
         this.navigationSessionModel = new MutableValueModel();
         this._activeVisits = new MutableListModel();
         this.sessionFinishedJobs = [];
+        if (window['Cypress']) {
+            window['aup.PlaceRouter'] = this;
+        }
         this.routerInteractionAdapter = interactionService.registerPlaceRouter(this);
         // TODO: Make this an interface and use 'this' instead.
         this.navigationContext = new NavigationContext.Impl(this.urlService, this.routerInteractionAdapter, (urlSnapshot, options) => {
@@ -5823,6 +5916,9 @@ class PlaceRouter extends GarbageCollector {
     get currentSession() {
         return this.navigationSessionModel.value;
     }
+    isNavigating() {
+        return this.navigationInProgress.value;
+    }
     // @Trace()
     onPopState(event) {
         assert.isTruthy(event.navigationTrigger === 'popstate');
@@ -6015,72 +6111,6 @@ PlaceRouter.ctorParameters = () => [
     { type: PlaceHistory }
 ];
 
-class Visit {
-    constructor(placeDefinition, visitParameters = {}) {
-        this.placeDefinition = placeDefinition;
-        this.visitParameters = visitParameters;
-    }
-    // @Trace()
-    getRouteId() {
-        return this.placeDefinition.getRouteIdFrom(this);
-    }
-    // @Trace()
-    hasRouteId() {
-        return !isNil(this.getRouteId());
-    }
-    /**
-     * Returns the value of the place parameter with the specified name.  The parameter
-     * name is taken from the `as` option, e.g. {as: 'aCustomName'} otherwise it is the
-     * same as the the ValueModel property name.
-     * @param parameterName the field name of the property model or the `as` option if specified.
-     */
-    getParameter(parameterName) {
-        return this.visitParameters[parameterName];
-    }
-    // @Trace()
-    hasParameter(parameterName) {
-        return Object.keys(this.visitParameters).includes(parameterName);
-    }
-    replace(parameter, value) {
-        return new Visit(this.placeDefinition, Object.assign(Object.assign({}, this.visitParameters), { [parameter.name]: value }));
-    }
-    mergeRouteParameters(routeParams) {
-        // todo: whitelist parameters.
-        const routeParameterKeys = Object.keys(routeParams);
-        const params = {};
-        this.placeDefinition.getVisitParameterDefs().forEach(def => {
-            if (def.isRouteId || def.isRouteParameter) {
-                if (routeParameterKeys.includes(def.name)) {
-                    params[def.name] = routeParams[def.name];
-                }
-            }
-            else {
-                // copy non route params as is, but only if they already exist otherwise we'll inject nil values and break the
-                // defaults and remember sanitisation process.
-                const value = this.getParameter(def.name);
-                if (this.hasParameter(def.name)) {
-                    params[def.name] = value;
-                }
-            }
-        });
-        return new Visit(this.placeDefinition, params);
-    }
-    hasRoutingChangedFrom(other) {
-        const samePlace = other.placeDefinition === this.placeDefinition;
-        const sameRouteParameters = isEqual(this.placeDefinition.getFormattedRouteParameters(this, true), this.placeDefinition.getFormattedRouteParameters(other, true));
-        return !samePlace || !sameRouteParameters;
-    }
-    hasChangedFrom(other) {
-        const sameNonRouteParameters = isEqual(this.placeDefinition.getNonRouteParameters(this), this.placeDefinition.getNonRouteParameters(other));
-        return !sameNonRouteParameters || this.hasRoutingChangedFrom(other);
-    }
-    toDebugString() {
-        return Object.keys(this.visitParameters).map(k => `${k}=${this.visitParameters[k]}`).join(",");
-    }
-}
-
-const AUP_PLACE_CONFIG = new InjectionToken('AUP_PLACE_CONFIG');
-
 // Freezes the state of the components at the start of the animation.
 const animationStartStyle = style({ position: 'absolute', top: '0', left: '0', bottom: '0', right: '0' });
 const left = [
@@ -6336,11 +6366,13 @@ __decorate([
 ], PlaceOutletComponent.prototype, "onOutletDeactivated", null);
 
 class AbstractPlaceNavigationComponent extends DisposableComponent {
-    constructor(placeRouter) {
+    constructor(authService) {
         super();
         this._activePlaceComponent = new DelegatingValueModel();
         const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        this.placeDefinitions = chain(this.placesModel).map(c => PlaceComponent.getDefinition(c));
+        this.placeDefinitions = chain(this.placesModel)
+            .map(c => PlaceComponent.getDefinition(c))
+            .select(d => authService.authoriserModel.value(d), { dependsOn: authService.authoriserModel });
         this.commandFactory = Command.createFactory((placeDefinition) => {
             this.placeOutlet.navigate(new Visit(placeDefinition));
         });
@@ -6372,7 +6404,7 @@ AbstractPlaceNavigationComponent.decorators = [
             },] }
 ];
 AbstractPlaceNavigationComponent.ctorParameters = () => [
-    { type: PlaceRouter }
+    { type: undefined, decorators: [{ type: Inject, args: [PLACE_AUTH_SERVICE,] }] }
 ];
 AbstractPlaceNavigationComponent.propDecorators = {
     places: [{ type: Input }],
@@ -6450,19 +6482,19 @@ EmptyStateComponent.decorators = [
 EmptyStateComponent.ctorParameters = () => [];
 
 class ListPlaceNavComponent extends AbstractPlaceNavigationComponent {
-    constructor(placeRouter) {
-        super(placeRouter);
+    constructor(authService) {
+        super(authService);
     }
 }
 ListPlaceNavComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-list-place-nav',
                 template: "<mat-nav-list fxFlex>\n  <a mat-list-item *ngFor=\"let placeDefinition of placeDefinitions.value\"\n     [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n     [class.active]=\"isActive(placeDefinition)\"\n     [matTooltip]=\"getNavigationFace(placeDefinition).tooltip()\">\n    <aup-command-face [faces]=\"[getNavigationFace(placeDefinition)]\"></aup-command-face>\n  </a>\n</mat-nav-list>\n",
-                styles: [":host{--selected-background:#f1f1f1;--selected-border-color:#838383;--selected-color:inherit;display:flex;flex-direction:column}mat-nav-list{padding-top:0}a.active{background:var(--selected-background);border-right:2px solid var(--selected-border-color);color:var(--selected-color)}"]
+                styles: [":host{--selected-background:#f1f1f1;--selected-border-color:#838383;--selected-color:inherit;display:flex;flex-direction:column}mat-nav-list{padding-top:0}a{border-right:2px solid transparent}a.active{background:var(--selected-background);border-right:2px solid var(--selected-border-color);color:var(--selected-color)}"]
             },] }
 ];
 ListPlaceNavComponent.ctorParameters = () => [
-    { type: PlaceRouter }
+    { type: undefined, decorators: [{ type: Inject, args: [PLACE_AUTH_SERVICE,] }] }
 ];
 
 /**
@@ -6508,8 +6540,8 @@ ListPlaceNavComponent.ctorParameters = () => [
  * })
  */
 class SidePlaceNavigationComponent extends AbstractPlaceNavigationComponent {
-    constructor(router, placeRouter) {
-        super(placeRouter);
+    constructor(router, authService) {
+        super(authService);
         this.router = router;
         this.expanded = false;
     }
@@ -6532,7 +6564,7 @@ SidePlaceNavigationComponent.decorators = [
 ];
 SidePlaceNavigationComponent.ctorParameters = () => [
     { type: Router },
-    { type: PlaceRouter }
+    { type: undefined, decorators: [{ type: Inject, args: [PLACE_AUTH_SERVICE,] }] }
 ];
 SidePlaceNavigationComponent.propDecorators = {
     expanded: [{ type: HostBinding, args: ['class.expanded',] }],
@@ -6540,8 +6572,8 @@ SidePlaceNavigationComponent.propDecorators = {
 };
 
 class TabbedPlaceNavigationComponent extends AbstractPlaceNavigationComponent {
-    constructor(placeRouter) {
-        super(placeRouter);
+    constructor(authService) {
+        super(authService);
     }
 }
 TabbedPlaceNavigationComponent.decorators = [
@@ -6552,7 +6584,7 @@ TabbedPlaceNavigationComponent.decorators = [
             },] }
 ];
 TabbedPlaceNavigationComponent.ctorParameters = () => [
-    { type: PlaceRouter }
+    { type: undefined, decorators: [{ type: Inject, args: [PLACE_AUTH_SERVICE,] }] }
 ];
 
 class PlaceModule {
@@ -6745,7 +6777,7 @@ DialogInteractionContextFactory.ctorParameters = () => [
 function Place(options) {
     return (target) => {
         if (PlaceComponent.isPlaceComponentConstructor(target)) {
-            PlaceComponent.injectDefinition(target, new PlaceDefinition(target, options.path, isNil(options.authenticate) ? true : options.authenticate, options.data, PlaceComponent.getRouteParameters(target), (options.children || []).map(c => PlaceComponent.getDefinition(c))));
+            PlaceComponent.injectDefinition(target, new PlaceDefinition(target, options.path, isNil(options.authenticate) ? true : options.authenticate, isNil(options.roles) ? [] : options.roles, options.data, PlaceComponent.getRouteParameters(target), (options.children || []).map(c => PlaceComponent.getDefinition(c))));
         }
         else {
             lang.illegalState(`${target} must extend PlaceComponent to use the @Place decorator`);
@@ -6862,20 +6894,27 @@ class VisitSanitiser {
 }
 
 class PlaceGuard {
-    constructor(router, urlService, placeRouter, placeHistory, interactionService, injector) {
+    constructor(router, urlService, placeRouter, placeHistory, placeAuthService, interactionService, injector) {
         this.router = router;
         this.urlService = urlService;
         this.placeRouter = placeRouter;
         this.placeHistory = placeHistory;
+        this.placeAuthService = placeAuthService;
         this.interactionService = interactionService;
         this.injector = injector;
     }
-    // @Trace()
     canActivate(activatedRoute, state) {
         return __awaiter(this, void 0, void 0, function* () {
-            // TODO: this is ugly now that I'm return UrlSnapshots and not UrlTrees.  It'd be better if the functions
-            //        weren't nested or if I implemented a handler chain.
-            return this.authorisePlaceThen(activatedRoute, state, (placeDefinition) => __awaiter(this, void 0, void 0, function* () {
+            if (PlaceComponent.isPlaceComponentConstructor(activatedRoute.component)) {
+                const placeDefinition = PlaceComponent.getDefinition(activatedRoute.component);
+                const needsAuth = placeDefinition.authenticate;
+                const proceed = !needsAuth || (yield this.placeAuthService.isAuthenticated());
+                if (!proceed) {
+                    return this.handleGuardResult(this.placeAuthService.handleNotAuthenticated(activatedRoute, state));
+                }
+                if (!this.placeAuthService.isAuthorised(placeDefinition)) {
+                    return this.handleGuardResult(this.placeAuthService.handleNotAuthorisation(activatedRoute, state));
+                }
                 const result = yield this.cleanInteractionState(activatedRoute, state, () => __awaiter(this, void 0, void 0, function* () {
                     // Parse our route params.
                     const params = new ConsolidatedParameterMap(activatedRoute.paramMap, activatedRoute.url);
@@ -6896,57 +6935,51 @@ class PlaceGuard {
                         return true;
                     }
                 }));
-                return this.handleGuardResult(result);
-            }));
+                return result instanceof UrlSnapshot ? result.urlTree : result;
+            }
+            else {
+                return lang.illegalState(`expected component to be an instance of PlaceComponent, got ${activatedRoute.component}`);
+            }
         });
     }
-    // @Trace()
     canDeactivate(component, currentRoute, currentState, nextState) {
         return __awaiter(this, void 0, void 0, function* () {
             const currentUrl = this.urlService.parseUrl(currentState.url);
             const nextUrl = this.urlService.parseUrl(nextState.url);
             const result = yield this.placeRouter.navigationSession.canDeactivatePlace(component, currentUrl, nextUrl);
-            return this.handleGuardResult(result);
+            return result instanceof UrlSnapshot ? result.urlTree : result;
         });
     }
-    // @Trace()
     handleGuardResult(result) {
         if (result instanceof UrlSnapshot) {
             return result.urlTree;
         }
         else {
-            return result;
+            return this.urlService.createUrlSnapshot(result).urlTree;
         }
     }
+    // protected async ensureAuthenticatedThen(activatedRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot, next: (placeDefinition: PlaceDefinition) => Promise<boolean | UrlTree>): Promise<boolean | UrlTree> {
+    //   const authoriseResult = placeDefinition.authenticate ? await this.isAuthorised(activatedRoute, state) : true;
+    //   if (authoriseResult === true) {
+    //     // we're authorised, now run the place guards.
+    //     return next(placeDefinition);
+    //   } else {
+    //     console.log('not authorised result', authoriseResult);
+    //     return authoriseResult;
+    //   }
+    // }
+    //
+    // // @Trace()
+    // protected async ensureAuthorisedThen(activatedRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot, next: (placeDefinition: PlaceDefinition) => Promise<boolean | UrlTree>): Promise<boolean | UrlTree> {
+    //
+    // }
     // @Trace()
-    authorisePlaceThen(activatedRoute, state, runPlaceGuards) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (PlaceComponent.isPlaceComponentConstructor(activatedRoute.component)) {
-                const placeDefinition = PlaceComponent.getDefinition(activatedRoute.component);
-                const authoriseResult = placeDefinition.authenticate ? yield this.isAuthorised(activatedRoute, state) : true;
-                if (authoriseResult === true) {
-                    // we're authorised, now run the place guards.
-                    return runPlaceGuards(placeDefinition);
-                }
-                else {
-                    console.log('not authorised result', authoriseResult);
-                    return authoriseResult;
-                }
-            }
-            else {
-                return lang.illegalState(`expected component to be an instance of PlaceComponent, got ${activatedRoute.component}`);
-            }
-        });
-    }
-    // @Trace()
-    isAuthorised(activatedRoute, state) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const authorised = this.getAuthGuard(this.injector).canActivate(activatedRoute, state);
-            return (authorised instanceof Observable) ? authorised.toPromise() : authorised;
-        });
-    }
-    // @Trace()
-    cleanInteractionState(route, state, then) {
+    // async isAuthorised(activatedRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean | UrlTree> {
+    //   const authorised = this.getAuthGuard(this.injector).canActivate(activatedRoute, state);
+    //   return (authorised instanceof Observable) ? authorised.toPromise() : authorised;
+    // }
+    // abstract getAuthGuard(injector: Injector): CanActivate;
+    cleanInteractionState(route, state, next) {
         return __awaiter(this, void 0, void 0, function* () {
             const url = this.urlService.parseUrl(state.url);
             if (!this.interactionService.isActive() && url.hasInteractions()) {
@@ -6955,11 +6988,48 @@ class PlaceGuard {
                 return url.removeInteractionIds();
             }
             else {
-                return then();
+                return next();
             }
         });
     }
 }
+PlaceGuard.ɵprov = ɵɵdefineInjectable({ factory: function PlaceGuard_Factory() { return new PlaceGuard(ɵɵinject(Router), ɵɵinject(UrlService), ɵɵinject(PlaceRouter), ɵɵinject(PlaceHistory), ɵɵinject(PLACE_AUTH_SERVICE), ɵɵinject(InteractionService), ɵɵinject(INJECTOR)); }, token: PlaceGuard, providedIn: "root" });
+PlaceGuard.decorators = [
+    { type: Injectable, args: [{ providedIn: 'root' },] }
+];
+PlaceGuard.ctorParameters = () => [
+    { type: Router },
+    { type: UrlService },
+    { type: PlaceRouter },
+    { type: PlaceHistory },
+    { type: undefined, decorators: [{ type: Inject, args: [PLACE_AUTH_SERVICE,] }] },
+    { type: InteractionService },
+    { type: Injector }
+];
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [ActivatedRouteSnapshot, RouterStateSnapshot]),
+    __metadata("design:returntype", Promise)
+], PlaceGuard.prototype, "canActivate", null);
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [PlaceComponent, ActivatedRouteSnapshot, RouterStateSnapshot, RouterStateSnapshot]),
+    __metadata("design:returntype", Promise)
+], PlaceGuard.prototype, "canDeactivate", null);
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Object]),
+    __metadata("design:returntype", void 0)
+], PlaceGuard.prototype, "handleGuardResult", null);
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [ActivatedRouteSnapshot, RouterStateSnapshot, Function]),
+    __metadata("design:returntype", Promise)
+], PlaceGuard.prototype, "cleanInteractionState", null);
 
 var Formatter;
 (function (Formatter) {
@@ -7061,5 +7131,5 @@ function VisitParameterList(options) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandDirective, CommandFace, CommandFaceComponent, CommandGroup, CommandGroupComponent, CommandGroupMenuRendererComponent, CommandGroupRendererComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, IconComponent, InPlaceInteractionContextComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NumberInputComponent, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, ParameterDefinition, PasswordInputComponent, Place, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupInteractionContextComponent, PopupMenuComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, Registration, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, UrlService, UrlSnapshot, VerticalFocusContainerComponent, ViewData, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, ɵ0 };
+export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandDirective, CommandFace, CommandFaceComponent, CommandGroup, CommandGroupComponent, CommandGroupMenuRendererComponent, CommandGroupRendererComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, IconComponent, InPlaceInteractionContextComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NumberInputComponent, PLACE_AUTH_SERVICE, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, ParameterDefinition, PasswordInputComponent, Place, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupInteractionContextComponent, PopupMenuComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, Registration, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, UrlService, UrlSnapshot, VerticalFocusContainerComponent, ViewData, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, ɵ0 };
 //# sourceMappingURL=coolon-angular-ui-powerups.js.map