@coolon/angular-ui-powerups 1.0.1 → 1.0.2

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

@@ -1,6 +1,6 @@
 import { __extends, __decorate, __metadata, __param, __awaiter, __generator, __spread, __assign } from 'tslib';
 import { DOCUMENT, CommonModule, Location } from '@angular/common';
-import { ElementRef, Inject, Input, HostListener, Directive, NgZone, NgModule, EventEmitter, Output, Component, ContentChild, TemplateRef, InjectionToken, Injector, ComponentFactoryResolver, ViewContainerRef, ViewChild, ViewChildren, QueryList, ɵɵdefineInjectable, ɵɵinject, Injectable, Optional, SkipSelf, HostBinding } from '@angular/core';
+import { ElementRef, Inject, Input, HostListener, Directive, NgZone, NgModule, EventEmitter, Output, Component, ContentChild, TemplateRef, ChangeDetectorRef, ContentChildren, QueryList, InjectionToken, Injector, ComponentFactoryResolver, ViewContainerRef, ViewChild, ViewChildren, ɵɵdefineInjectable, ɵɵinject, Injectable, Optional, SkipSelf, HostBinding } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
@@ -60,7 +60,7 @@ var CommandDirective = /** @class */ (function (_super) {
         assert.notNil(this.pectinCommand);
         if (this.pectinCommand instanceof UnaryCommand) {
             if (!this._commandParameterProvided) {
-                lang.illegalState('UnaryCommands required the command parameter to be specified.');
+                lang.illegalState('UnaryCommands require the command parameter to be specified.');
             }
         }
         else {
@@ -73,8 +73,8 @@ var CommandDirective = /** @class */ (function (_super) {
         var _this = this;
         // for some reason mat-buttons kills the disabled host binding.  It works on a regular button but for now
         // we need to do this.
-        var chain = Dsl.disposeWith(this).chain;
-        chain(this._commandEnabled).subscribe(function (enabled) {
+        var when = Dsl.disposeWith(this).when;
+        when.valueOf(this._commandEnabled).changes(function (enabled) {
             if (enabled) {
                 _this.elementRef.nativeElement.removeAttribute('disabled');
                 if (_this.elementRef.nativeElement.tagName === 'A') {
@@ -87,7 +87,7 @@ var CommandDirective = /** @class */ (function (_super) {
                     _this.elementRef.nativeElement.removeAttribute('href');
                 }
             }
-        });
+        }, { initialValue: 'triggerChange' });
     };
     CommandDirective.prototype.ngOnDestroy = function () {
         this.dispose();
@@ -177,12 +177,12 @@ var FocusBindingDirective = /** @class */ (function (_super) {
         var _this = this;
         // TODO: Make this also track the current enabled/disabled state.
         if (this.hasBinding()) {
-            var chain = Dsl.disposeWith(this).chain;
-            chain(this.pectinFocusBinding.focusContext.focused).subscribe(function (focused) {
+            var when = Dsl.disposeWith(this).when;
+            when.valueOf(this.pectinFocusBinding.focusContext.focused).changes(function (focused) {
                 if (focused && !_this.alreadyHasFocus()) {
                     _this.tryAndFocus();
                 }
-            });
+            }, { initialValue: 'triggerChange' });
         }
         else {
             Logger.get(this).warn('pectinFocusBinding was nil');
@@ -310,7 +310,18 @@ var AbstractInputComponent = /** @class */ (function (_super) {
     __extends(AbstractInputComponent, _super);
     function AbstractInputComponent() {
         var _this = _super.call(this) || this;
-        _this.delegatingFormValueModel = new DelegatingFormValueModel();
+        /**
+         * A backing model for all our @Input() valueModel properties which should be defined as follows.
+         *
+         *    @Input() @UseDelegate({useExisting: "delegatingFormValueModel"})
+         *    valueModel: FormValueModel<string> | MutableValueModel<string>;
+         *
+         * This approach allows the input to accept plain or form models but all backed by a form
+         * friendly delegate.  We have to use an existing delegate for union types as pectin just
+         * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).
+         */
+        // We have to register it as a disposable so it ditches any listeners when we're disposed.
+        _this.delegatingFormValueModel = _this.registerDisposable(new DelegatingFormValueModel());
         // TODO: fix this.
         // tslint:disable-next-line:no-output-native
         _this.focus = new EventEmitter();
@@ -620,6 +631,142 @@ var ScrollContainerComponent = /** @class */ (function () {
     return ScrollContainerComponent;
 }());
 
+var SwitchCaseOption = /** @class */ (function () {
+    function SwitchCaseOption(templateRef) {
+        this.templateRef = templateRef;
+    }
+    Object.defineProperty(SwitchCaseOption.prototype, "name", {
+        get: function () {
+            return this.constructor.name;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    return SwitchCaseOption;
+}());
+var SwitchCaseWhenDirective = /** @class */ (function (_super) {
+    __extends(SwitchCaseWhenDirective, _super);
+    function SwitchCaseWhenDirective(templateRef) {
+        var _this = _super.call(this, templateRef) || this;
+        _this.isDefault = false;
+        return _this;
+    }
+    SwitchCaseWhenDirective_1 = SwitchCaseWhenDirective;
+    SwitchCaseWhenDirective.prototype.matches = function (value) {
+        return this.aupSwitchCaseWhen === value;
+    };
+    var SwitchCaseWhenDirective_1;
+    SwitchCaseWhenDirective.ctorParameters = function () { return [
+        { type: TemplateRef }
+    ]; };
+    __decorate([
+        Input(),
+        __metadata("design:type", Object)
+    ], SwitchCaseWhenDirective.prototype, "aupSwitchCaseWhen", void 0);
+    SwitchCaseWhenDirective = SwitchCaseWhenDirective_1 = __decorate([
+        Directive({
+            selector: '[aupSwitchCaseWhen]',
+            providers: [{ provide: SwitchCaseOption, useExisting: SwitchCaseWhenDirective_1 }]
+        }),
+        __metadata("design:paramtypes", [TemplateRef])
+    ], SwitchCaseWhenDirective);
+    return SwitchCaseWhenDirective;
+}(SwitchCaseOption));
+var SwitchCaseDefaultDirective = /** @class */ (function (_super) {
+    __extends(SwitchCaseDefaultDirective, _super);
+    function SwitchCaseDefaultDirective(templateRef) {
+        var _this = _super.call(this, templateRef) || this;
+        _this.isDefault = true;
+        return _this;
+    }
+    SwitchCaseDefaultDirective_1 = SwitchCaseDefaultDirective;
+    SwitchCaseDefaultDirective.prototype.matches = function (value) {
+        return false;
+    };
+    var SwitchCaseDefaultDirective_1;
+    SwitchCaseDefaultDirective.ctorParameters = function () { return [
+        { type: TemplateRef }
+    ]; };
+    SwitchCaseDefaultDirective = SwitchCaseDefaultDirective_1 = __decorate([
+        Directive({
+            selector: '[aupSwitchCaseDefault]',
+            providers: [{ provide: SwitchCaseOption, useExisting: SwitchCaseDefaultDirective_1 }]
+        }),
+        __metadata("design:paramtypes", [TemplateRef])
+    ], SwitchCaseDefaultDirective);
+    return SwitchCaseDefaultDirective;
+}(SwitchCaseOption));
+var SwitchCaseComponent = /** @class */ (function (_super) {
+    __extends(SwitchCaseComponent, _super);
+    function SwitchCaseComponent(cdr) {
+        var _this = _super.call(this) || this;
+        _this.cdr = cdr;
+        _this.selectedIndex = 0;
+        return _this;
+    }
+    SwitchCaseComponent.prototype.ngOnInit = function () {
+    };
+    SwitchCaseComponent.prototype.ngAfterContentInit = function () {
+        var _this = this;
+        var subscription = this.switchCaseOptions.changes.subscribe(function (change) { return _this.updateSelection(); });
+        this.onDispose(function () { return subscription.unsubscribe(); });
+        var _a = Dsl.disposeWith(this), chain = _a.chain, when = _a.when;
+        when.valueOf(this.switchModel).changes(function () { return _this.updateSelection(); }, { initialValue: 'triggerChange' });
+        this.cdr.detectChanges();
+    };
+    SwitchCaseComponent.prototype.updateSelection = function () {
+        var _this = this;
+        var matchingIndicies = [];
+        this.switchCaseOptions.forEach(function (option, index) {
+            if (option.matches(_this.switchModel.value)) {
+                matchingIndicies.push(index);
+            }
+        });
+        if (matchingIndicies.length > 1) {
+            console.warn("found " + matchingIndicies.length + " matching case values, displaying the first.");
+        }
+        if (matchingIndicies.length === 0) {
+            this.switchCaseOptions.forEach(function (option, index) {
+                matchingIndicies.push(index);
+            });
+            if (matchingIndicies.length > 1) {
+                console.warn("found " + matchingIndicies.length + " default case values, displaying the first.");
+            }
+        }
+        if (matchingIndicies.length > 0) {
+            this.selectedIndex = matchingIndicies[0];
+        }
+        else {
+            console.warn("found no matching or default case values.");
+            this.selectedIndex = -1;
+        }
+    };
+    SwitchCaseComponent.ctorParameters = function () { return [
+        { type: ChangeDetectorRef }
+    ]; };
+    __decorate([
+        Input(), UseDelegate(),
+        __metadata("design:type", ValueModel)
+    ], SwitchCaseComponent.prototype, "switchModel", void 0);
+    __decorate([
+        Input(), StoreInValueModel('switchModel'),
+        __metadata("design:type", Object)
+    ], SwitchCaseComponent.prototype, "switch", void 0);
+    __decorate([
+        ContentChildren(SwitchCaseOption),
+        __metadata("design:type", QueryList)
+    ], SwitchCaseComponent.prototype, "switchCaseOptions", void 0);
+    SwitchCaseComponent = __decorate([
+        Component({
+            selector: 'aup-switch-case',
+            template: "<mat-tab-group class=\"content-wrapper\" no-tab-header full-height-tabs [selectedIndex]=\"selectedIndex\">\n  <mat-tab *ngFor=\"let option of switchCaseOptions\">\n    <ng-template [ngTemplateOutlet]=\"option.templateRef\"></ng-template>\n  </mat-tab>\n</mat-tab-group>\n\n\n",
+            styles: [":host{display:flex;flex-direction:column;align-items:stretch}mat-tab-group{flex:1}"]
+        }),
+        __metadata("design:paramtypes", [ChangeDetectorRef])
+    ], SwitchCaseComponent);
+    return SwitchCaseComponent;
+}(DisposableComponent));
+
 var ComponentsModule = /** @class */ (function () {
     function ComponentsModule() {
     }
@@ -632,7 +779,10 @@ var ComponentsModule = /** @class */ (function () {
                 SelectInputComponent,
                 ScrollContainerComponent,
                 NoopComponent,
-                AbstractInputComponent
+                AbstractInputComponent,
+                SwitchCaseComponent,
+                SwitchCaseWhenDirective,
+                SwitchCaseDefaultDirective
             ],
             imports: [
                 CommonModule,
@@ -652,7 +802,10 @@ var ComponentsModule = /** @class */ (function () {
                 PasswordInputComponent,
                 SelectInputComponent,
                 ScrollContainerComponent,
-                NoopComponent
+                NoopComponent,
+                SwitchCaseComponent,
+                SwitchCaseWhenDirective,
+                SwitchCaseDefaultDirective
             ]
         })
     ], ComponentsModule);
@@ -724,7 +877,7 @@ var AlertDialogComponent = /** @class */ (function (_super) {
         Component({
             selector: 'aup-alert-dialog',
             template: "<h3 matDialogTitle *ngIf=\"alert.title\">{{alert.title()}}</h3>\n<div matDialogContent>\n  <p *ngFor=\"let line of alert.content()\">{{line}}</p>\n</div>\n<div matDialogActions>\n  <button mat-raised-button color=\"primary\" (click)=\"done()\" data-cy=\"close-button\">{{alert.ok()}}</button>\n</div>\n",
-            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{justify-content:flex-end}"]
+            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{margin-bottom:0!important;padding:0;align-items:flex-end;justify-content:flex-end}"]
         }),
         __param(0, Inject(ACTIVITY_DATA)),
         __metadata("design:paramtypes", [Object])
@@ -765,7 +918,7 @@ var ConfirmThenDialogComponent = /** @class */ (function (_super) {
         Component({
             selector: 'aup-confirmation-dialog',
             template: "<h3 matDialogTitle *ngIf=\"confirm.title\">{{confirm.title()}}</h3>\n<div matDialogContent>\n  <p *ngFor=\"let line of confirm.content()\">{{line}}</p>\n</div>\n<div matDialogActions>\n  <button mat-button (click)=\"cancel()\" data-cy=\"cancel-button\">{{confirm.cancel()}}</button>\n  <button mat-raised-button [color]=\"isDestructive() ? 'warn' : 'primary'\"\n          (click)=\"onConfirm()\" data-cy=\"confirm-button\">{{confirm.ok()}}</button>\n</div>\n\n",
-            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{justify-content:flex-end}"]
+            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{margin-bottom:0!important;padding:0;align-items:flex-end;justify-content:flex-end}"]
         }),
         __param(0, Inject(ACTIVITY_DATA)),
         __metadata("design:paramtypes", [Object])
@@ -793,7 +946,7 @@ var ConfirmationDialogComponent = /** @class */ (function (_super) {
         Component({
             selector: 'aup-confirmation-dialog',
             template: "<h3 matDialogTitle *ngIf=\"confirm.title\">{{confirm.title()}}</h3>\n<div matDialogContent>\n  <p *ngFor=\"let line of confirm.content()\">{{line}}</p>\n</div>\n<div matDialogActions>\n  <button mat-button (click)=\"cancel()\" data-cy=\"cancel-button\">{{confirm.cancel()}}</button>\n  <button mat-raised-button [color]=\"isDestructive() ? 'warn' : 'primary'\"\n          (click)=\"done()\" data-cy=\"confirm-button\">{{confirm.ok()}}</button>\n</div>\n\n",
-            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{justify-content:flex-end}"]
+            styles: [":host{display:block;padding:var(--aup-default-padding)}.mat-dialog-content{margin:0;padding:0}.mat-dialog-actions{margin-bottom:0!important;padding:0;align-items:flex-end;justify-content:flex-end}"]
         }),
         __param(0, Inject(ACTIVITY_DATA)),
         __metadata("design:paramtypes", [Object])
@@ -1484,22 +1637,22 @@ var ParameterDefinition = /** @class */ (function () {
         return this.options.getOptional(key, null);
     };
     // @Trace()
-    ParameterDefinition.prototype.sanitise = function (value, visit, placeHistory, injector) {
+    ParameterDefinition.prototype.sanitise = function (value, visit, placeHistory, injector, isPopState) {
         return __awaiter(this, void 0, void 0, function () {
-            var previousVisit;
+            var returningFromSomewhereElse, lastKnownVisit;
             return __generator(this, function (_a) {
                 if (this.isMissingFrom(visit)) {
-                    previousVisit = ___default.first(placeHistory.getHistory(visit.placeDefinition));
-                    if (this.remember && previousVisit) {
-                        value = previousVisit.getParameter(this.name);
+                    returningFromSomewhereElse = !placeHistory.lastVisitIncluded(visit.placeDefinition);
+                    if (returningFromSomewhereElse) {
+                        lastKnownVisit = placeHistory.getMostRecentVisitFor(visit.placeDefinition);
+                        if (this.remember && lastKnownVisit) {
+                            value = lastKnownVisit.getParameter(this.name);
+                        }
+                        return [2 /*return*/, this.isEmptyValue(value) ? this.defaultValue : value];
                     }
-                    return [2 /*return*/, this.isEmptyValue(value) ? this.defaultValue : value];
-                }
-                else {
-                    // todo: add custom sanitiser
-                    return [2 /*return*/, value];
                 }
-                return [2 /*return*/];
+                // todo: add custom sanitiser
+                return [2 /*return*/, value];
             });
         });
     };
@@ -1746,11 +1899,11 @@ var PlaceComponent = /** @class */ (function (_super) {
         var binding = this.registerDisposable(new Binding(this.visitModel, model, {
             toRight: function (visit) {
                 var value = visit.getParameter(parameterDef.name);
-                console.log('push to component', { name: parameterDef.name, value: value, visit: visit });
+                // console.log('push to component', { name: parameterDef.name, value, visit });
                 return value;
             },
             toLeft: function (value, currentVisit) {
-                console.log('push to route', { name: parameterDef.name, value: value, currentVisit: currentVisit });
+                // console.log('push to route', { name: parameterDef.name, value, currentVisit });
                 return currentVisit.replace(parameterDef, value);
             }
         }));
@@ -2571,19 +2724,32 @@ var PopStateNavigation = /** @class */ (function (_super) {
 
 var PlaceHistory = /** @class */ (function () {
     function PlaceHistory() {
-        this._history = new Map();
+        this._archive = new Map();
+        this.placeHistoryDepth = 4;
     }
-    // @Trace()
-    PlaceHistory.prototype.add = function (state) {
-        var history = this.getHistory(state.placeDefinition);
-        var previousState = ___default.first(history);
-        if (!previousState || state.hasChangedFrom(previousState)) {
-            history.unshift(state); // LIFO
-            this.setHistory(state.placeDefinition, history.slice(0, 3)); // limit our history to 4 visits
+    PlaceHistory_1 = PlaceHistory;
+    PlaceHistory.prototype.notifyNavigationStarted = function () {
+        if (this._activeVisits) {
+            this.archive(this._activeVisits.visits);
+            this._previousVisits = this._activeVisits;
         }
     };
+    PlaceHistory.prototype.notifyNavigationFinished = function (visits) {
+        this._activeVisits = new PlaceHistory_1.VisitRecord(visits);
+    };
+    PlaceHistory.prototype.updateVisit = function (visit) {
+        assert.isTruthy(this._activeVisits);
+        this._activeVisits.update(visit);
+    };
+    PlaceHistory.prototype.lastVisitIncluded = function (placeDef) {
+        var _a;
+        return !!((_a = this._previousVisits) === null || _a === void 0 ? void 0 : _a.getVisitFor(placeDef));
+    };
+    PlaceHistory.prototype.getMostRecentVisitFor = function (placeDef) {
+        return ___default.first(this.getHistory(placeDef));
+    };
     PlaceHistory.prototype.getHistory = function (placeDef) {
-        var history = this._history.get(placeDef);
+        var history = this._archive.get(placeDef);
         if (!history) {
             history = [];
             this.setHistory(placeDef, history);
@@ -2591,10 +2757,22 @@ var PlaceHistory = /** @class */ (function () {
         return history;
     };
     PlaceHistory.prototype.setHistory = function (placeDef, history) {
-        this._history.set(placeDef, history);
+        this._archive.set(placeDef, history);
     };
+    PlaceHistory.prototype.archive = function (visits) {
+        var _this = this;
+        visits.forEach(function (state) {
+            var history = _this.getHistory(state.placeDefinition);
+            var previousState = ___default.first(history);
+            if (!previousState || state.hasChangedFrom(previousState)) {
+                history.unshift(state); // LIFO
+                _this.setHistory(state.placeDefinition, history.slice(0, _this.placeHistoryDepth));
+            }
+        });
+    };
+    var PlaceHistory_1;
     PlaceHistory.ɵprov = ɵɵdefineInjectable({ factory: function PlaceHistory_Factory() { return new PlaceHistory(); }, token: PlaceHistory, providedIn: "root" });
-    PlaceHistory = __decorate([
+    PlaceHistory = PlaceHistory_1 = __decorate([
         Injectable({
             providedIn: 'root'
         }),
@@ -2602,6 +2780,86 @@ var PlaceHistory = /** @class */ (function () {
     ], PlaceHistory);
     return PlaceHistory;
 }());
+(function (PlaceHistory) {
+    var VisitRecord = /** @class */ (function () {
+        function VisitRecord(visits) {
+            this.visits = visits;
+        }
+        VisitRecord.prototype.update = function (visit) {
+            this.visits = this.visits.filter(function (v) { return v.placeDefinition !== visit.placeDefinition; }).concat(visit);
+        };
+        VisitRecord.prototype.getVisitFor = function (placeDef) {
+            return this.visits.find(function (v) { return v.placeDefinition === placeDef; });
+        };
+        return VisitRecord;
+    }());
+    PlaceHistory.VisitRecord = VisitRecord;
+    // export class Query {
+    //   private _history: Visit.State[];
+    //   private _places: Place[];
+    //   private _predicate: (visit: any) => boolean;
+    //   private _limit: number;
+    //
+    //   constructor(history, limit = history.length) {
+    //     this._history = history;
+    //     this._places = [];
+    //     this._predicate = (visit => true);
+    //     this._limit = limit;
+    //   }
+    //
+    //   to(...places:Place[]):this {
+    //     this._places = places;
+    //     return this;
+    //   }
+    //
+    //   with(parameters: { [parameter: string]: any }): this {
+    //     this.matching(state => {
+    //       return Object.keys(parameters).reduce((acc, key) => {
+    //         const matchValue = parameters[key];
+    //         const visitValue = state.get(key);
+    //         const matched = matchValue === '*' ? !_.isNil(visitValue) : visitValue == matchValue;
+    //         // Logger.get(this).info(`matched=${matched}`, parameters, visitValue);
+    //         return acc && matched;
+    //       }, true);
+    //     });
+    //     return this;
+    //   }
+    //
+    //   last(): Visit.State {
+    //     return _.findLast(this._history, visit => this._matches(visit))
+    //   }
+    //
+    //   // @trace
+    //   allThatMatch(): Visit.State[] {
+    //     return _.filter(this._history, visit => this._matches(visit)).slice(-this._limit);
+    //   }
+    //
+    //   // @trace
+    //   mostRecentValueOf<T=any>(param: string, defaultValue: T = null): T {
+    //     const lastStateWithParam = _.findLast(this.allThatMatch(), state => !_.isNil(state.get(param)));
+    //     return _.isNil(lastStateWithParam) ? defaultValue : lastStateWithParam.get(param);
+    //   }
+    //
+    //   limit(limit: number): this {
+    //     this._limit = limit;
+    //     return this;
+    //   }
+    //
+    //   matching(predicate: (visit: Visit.State) => boolean): this {
+    //     this._predicate = predicate;
+    //     return this;
+    //   }
+    //
+    //   _matches(visit: Visit.State) {
+    //     return this._isPlaceMatch(visit) && this._predicate(visit);
+    //   }
+    //
+    //   _isPlaceMatch(visit: Visit.State) {
+    //     return this._places.length < 1 || this._places.includes(visit.place)
+    //   }
+    //
+    // }
+})(PlaceHistory || (PlaceHistory = {}));
 
 var UrlSnapshot = /** @class */ (function () {
     // TODO: Update this accept a url Parser so it can be immutable and generate new trees on mutation using toString() are parseUrl.
@@ -2765,6 +3023,75 @@ var UrlService = /** @class */ (function () {
     return UrlService;
 }());
 
+var Visit = /** @class */ (function () {
+    function Visit(placeDefinition, visitParameters) {
+        if (visitParameters === void 0) { visitParameters = {}; }
+        this.placeDefinition = placeDefinition;
+        this.visitParameters = visitParameters;
+    }
+    // @Trace()
+    Visit.prototype.getRouteId = function () {
+        return this.placeDefinition.getRouteIdFrom(this);
+    };
+    // @Trace()
+    Visit.prototype.hasRouteId = function () {
+        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.
+     */
+    Visit.prototype.getParameter = function (parameterName) {
+        return this.visitParameters[parameterName];
+    };
+    // @Trace()
+    Visit.prototype.hasParameter = function (parameterName) {
+        return Object.keys(this.visitParameters).includes(parameterName);
+    };
+    Visit.prototype.replace = function (parameter, value) {
+        var _a;
+        return new Visit(this.placeDefinition, __assign(__assign({}, this.visitParameters), (_a = {}, _a[parameter.name] = value, _a)));
+    };
+    Visit.prototype.mergeRouteParameters = function (routeParams) {
+        var _this = this;
+        // todo: whitelist parameters.
+        var routeParameterKeys = Object.keys(routeParams);
+        var params = {};
+        this.placeDefinition.getVisitParameterDefs().forEach(function (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.
+                var value = _this.getParameter(def.name);
+                if (_this.hasParameter(def.name)) {
+                    params[def.name] = value;
+                }
+            }
+        });
+        return new Visit(this.placeDefinition, params);
+    };
+    Visit.prototype.hasRoutingChangedFrom = function (other) {
+        var samePlace = other.placeDefinition === this.placeDefinition;
+        var sameRouteParameters = isEqual(this.placeDefinition.getFormattedRouteParameters(this, true), this.placeDefinition.getFormattedRouteParameters(other, true));
+        return !samePlace || !sameRouteParameters;
+    };
+    Visit.prototype.hasChangedFrom = function (other) {
+        var sameNonRouteParameters = isEqual(this.placeDefinition.getNonRouteParameters(this), this.placeDefinition.getNonRouteParameters(other));
+        return !sameNonRouteParameters || this.hasRoutingChangedFrom(other);
+    };
+    Visit.prototype.toDebugString = function () {
+        var _this = this;
+        return Object.keys(this.visitParameters).map(function (k) { return k + "=" + _this.visitParameters[k]; }).join(",");
+    };
+    return Visit;
+}());
+
 var PlaceRouter = /** @class */ (function (_super) {
     __extends(PlaceRouter, _super);
     function PlaceRouter(angularRouter, angularLocation, interactionService, urlService, placeHistory) {
@@ -2960,14 +3287,11 @@ var PlaceRouter = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
-    // @Trace()
     PlaceRouter.prototype.pushVisitChangesToRoute = function (previous, next) {
         return __awaiter(this, void 0, void 0, function () {
             var _this = this;
             return __generator(this, function (_a) {
-                // we have to push to history so our remember sanitisers don't pick up the previous value
-                // when it's been cleared by the user.
-                this.placeHistory.add(next);
+                this.placeHistory.updateVisit(next);
                 // FIXME: no route id -> route id duplicates route parameters
                 if (next.hasRoutingChangedFrom(previous)) {
                     return [2 /*return*/, this.doNavigation(next, function (router) {
@@ -2989,6 +3313,9 @@ var PlaceRouter = /** @class */ (function (_super) {
     // @Trace()
     PlaceRouter.prototype.transitionTo = function (next) {
         var previous = this.navigationSessionModel.value;
+        if (!previous) {
+            this.placeHistory.notifyNavigationStarted();
+        }
         assert.isTruthy(next !== previous);
         Logger.get(this).info("### Router State Transition: " + (previous ? previous.toString() : 'null') + " -> " + next.toString());
         this.navigationSessionModel.value = next;
@@ -2999,10 +3326,9 @@ var PlaceRouter = /** @class */ (function (_super) {
     };
     // @Trace()
     PlaceRouter.prototype.routingSessionFinished = function (visits) {
-        var _this = this;
         if (visits && visits.length > 0) {
             assert.isTruthy(this.navigationInProgress.value);
-            visits.forEach(function (v) { return _this.placeHistory.add(v); });
+            this.placeHistory.notifyNavigationFinished(visits);
             // We update the active visits before we finish the session so the
             // place outlets can ignore the incoming changes until things are
             // settled. TODO: can we removed the event'ness here and just do a push?
@@ -3061,6 +3387,12 @@ var PlaceRouter = /** @class */ (function (_super) {
         { type: PlaceHistory }
     ]; };
     PlaceRouter.ɵprov = ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(ɵɵinject(Router), ɵɵinject(Location), ɵɵinject(InteractionService), ɵɵinject(UrlService), ɵɵinject(PlaceHistory)); }, token: PlaceRouter, providedIn: "root" });
+    __decorate([
+        Trace(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Visit, Visit]),
+        __metadata("design:returntype", Promise)
+    ], PlaceRouter.prototype, "pushVisitChangesToRoute", null);
     PlaceRouter = __decorate([
         Injectable({
             providedIn: 'root'
@@ -3074,75 +3406,6 @@ var PlaceRouter = /** @class */ (function (_super) {
     return PlaceRouter;
 }(GarbageCollector));
 
-var Visit = /** @class */ (function () {
-    function Visit(placeDefinition, visitParameters) {
-        if (visitParameters === void 0) { visitParameters = {}; }
-        this.placeDefinition = placeDefinition;
-        this.visitParameters = visitParameters;
-    }
-    // @Trace()
-    Visit.prototype.getRouteId = function () {
-        return this.placeDefinition.getRouteIdFrom(this);
-    };
-    // @Trace()
-    Visit.prototype.hasRouteId = function () {
-        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.
-     */
-    Visit.prototype.getParameter = function (parameterName) {
-        return this.visitParameters[parameterName];
-    };
-    // @Trace()
-    Visit.prototype.hasParameter = function (parameterName) {
-        return Object.keys(this.visitParameters).includes(parameterName);
-    };
-    Visit.prototype.replace = function (parameter, value) {
-        var _a;
-        return new Visit(this.placeDefinition, __assign(__assign({}, this.visitParameters), (_a = {}, _a[parameter.name] = value, _a)));
-    };
-    Visit.prototype.mergeRouteParameters = function (routeParams) {
-        var _this = this;
-        // todo: whitelist parameters.
-        var routeParameterKeys = Object.keys(routeParams);
-        var params = {};
-        this.placeDefinition.getVisitParameterDefs().forEach(function (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.
-                var value = _this.getParameter(def.name);
-                if (_this.hasParameter(def.name)) {
-                    params[def.name] = value;
-                }
-            }
-        });
-        return new Visit(this.placeDefinition, params);
-    };
-    Visit.prototype.hasRoutingChangedFrom = function (other) {
-        var samePlace = other.placeDefinition === this.placeDefinition;
-        var sameRouteParameters = isEqual(this.placeDefinition.getFormattedRouteParameters(this, true), this.placeDefinition.getFormattedRouteParameters(other, true));
-        return !samePlace || !sameRouteParameters;
-    };
-    Visit.prototype.hasChangedFrom = function (other) {
-        var sameNonRouteParameters = isEqual(this.placeDefinition.getNonRouteParameters(this), this.placeDefinition.getNonRouteParameters(other));
-        return !sameNonRouteParameters || this.hasRoutingChangedFrom(other);
-    };
-    Visit.prototype.toDebugString = function () {
-        var _this = this;
-        return Object.keys(this.visitParameters).map(function (k) { return k + "=" + _this.visitParameters[k]; }).join(",");
-    };
-    return Visit;
-}());
-
 var AUP_PLACE_CONFIG = new InjectionToken('AUP_PLACE_CONFIG');
 
 // Freezes the state of the components at the start of the animation.
@@ -3944,13 +4207,13 @@ var NoopAuthGuard = /** @class */ (function () {
 }());
 
 var VisitSanitiser = /** @class */ (function () {
-    function VisitSanitiser(activatedRoute, router, placeHistory, injector) {
+    function VisitSanitiser(navigationSession, activatedRoute, router, placeHistory, injector) {
+        this.navigationSession = navigationSession;
         this.activatedRoute = activatedRoute;
         this.router = router;
         this.placeHistory = placeHistory;
         this.injector = injector;
     }
-    // @Trace()
     VisitSanitiser.prototype.sanitise = function (visit) {
         return __awaiter(this, void 0, void 0, function () {
             var placeDef, routeIdDef, routeId, sanitisedValue, parameterDefs, sanitisedVisit, i, def, value, sanitisedValue;
@@ -3961,10 +4224,10 @@ var VisitSanitiser = /** @class */ (function () {
                         if (!placeDef.hasRouteId()) return [3 /*break*/, 2];
                         routeIdDef = placeDef.getRouteIdParameterDef();
                         routeId = visit.getRouteId();
-                        return [4 /*yield*/, routeIdDef.sanitise(routeId, visit, this.placeHistory, this.injector)];
+                        return [4 /*yield*/, routeIdDef.sanitise(routeId, visit, this.placeHistory, this.injector, this.navigationSession.isPopState)];
                     case 1:
                         sanitisedValue = _a.sent();
-                        // console.log({routeId, sanitisedValue});
+                        console.log({ routeId: routeId, sanitisedValue: sanitisedValue });
                         // ###------- EARLY EXIT --------###
                         if (routeIdDef.hasChanged(routeId, sanitisedValue)) {
                             // if the route id has changed we redirect immediately as other
@@ -3984,7 +4247,7 @@ var VisitSanitiser = /** @class */ (function () {
                         if (!(i < parameterDefs.length)) return [3 /*break*/, 6];
                         def = parameterDefs[i];
                         value = visit.getParameter(def.name);
-                        return [4 /*yield*/, def.sanitise(value, sanitisedVisit, this.placeHistory, this.injector)];
+                        return [4 /*yield*/, def.sanitise(value, sanitisedVisit, this.placeHistory, this.injector, this.navigationSession.isPopState)];
                     case 4:
                         sanitisedValue = _a.sent();
                         if (def.hasChanged(value, sanitisedValue)) {
@@ -3999,6 +4262,12 @@ var VisitSanitiser = /** @class */ (function () {
             });
         });
     };
+    __decorate([
+        Trace(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Visit]),
+        __metadata("design:returntype", Promise)
+    ], VisitSanitiser.prototype, "sanitise", null);
     return VisitSanitiser;
 }());
 
@@ -4024,19 +4293,20 @@ var PlaceGuard = /** @class */ (function () {
                         return __generator(this, function (_a) {
                             switch (_a.label) {
                                 case 0: return [4 /*yield*/, this.cleanInteractionState(activatedRoute, state, function () { return __awaiter(_this, void 0, void 0, function () {
-                                        var params, parsedParams, initialVisit, sanitiser, sanitisedVisit, urlSnapshot;
+                                        var params, parsedParams, navigationSession, initialVisit, sanitiser, sanitisedVisit, urlSnapshot;
                                         return __generator(this, function (_a) {
                                             switch (_a.label) {
                                                 case 0:
                                                     params = new ConsolidatedParameterMap(activatedRoute.paramMap, activatedRoute.url);
                                                     parsedParams = placeDefinition.parseRouteParams(params);
-                                                    initialVisit = this.placeRouter.navigationSession.getVisitFor(placeDefinition) || new Visit(placeDefinition, parsedParams);
-                                                    sanitiser = new VisitSanitiser(activatedRoute, this.router, this.placeHistory, this.injector);
+                                                    navigationSession = this.placeRouter.navigationSession;
+                                                    initialVisit = navigationSession.getVisitFor(placeDefinition) || new Visit(placeDefinition, parsedParams);
+                                                    sanitiser = new VisitSanitiser(navigationSession, activatedRoute, this.router, this.placeHistory, this.injector);
                                                     return [4 /*yield*/, sanitiser.sanitise(initialVisit.mergeRouteParameters(parsedParams))];
                                                 case 1:
                                                     sanitisedVisit = _a.sent();
                                                     // Save the visit with any updated parameters.  We need to save it so we remember any non route parameters
-                                                    this.placeRouter.navigationSession.storeVisit(sanitisedVisit);
+                                                    navigationSession.storeVisit(sanitisedVisit);
                                                     if (initialVisit.hasRoutingChangedFrom(sanitisedVisit)) {
                                                         urlSnapshot = this.urlService.parseUrl(state.url).updateVisitSegments(sanitisedVisit);
                                                         // console.log('##### Place Guard Redirect', urlSnapshot);
@@ -4256,5 +4526,5 @@ function VisitParameterList(options) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AbstractInputComponent, AbstractInteractionContext, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, Activity, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, AlertDialogComponent, AngularUiPowerupsModule, Bounds, BusyOverlayComponent, CommandDirective, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EmptyStateComponent, EventCleanUpSession, FocusBindingDirective, Formatter, InPlaceInteractionContextComponent, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ModalInteractionContextFactory, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NumberInputComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SelectInputComponent, StringInputComponent, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, UrlService, UrlSnapshot, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationEventsFinish, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, DirectivesModule as ɵa, CommandDirective as ɵb, AbstractPlaceNavigationComponent as ɵba, ListPlaceNavComponent as ɵbb, InteractionModule as ɵbc, ActivityContainerComponent as ɵbd, AbstractInteractionContext as ɵbe, ActivityOutletComponent as ɵbf, ConfirmationDialogComponent as ɵbg, ACTIVITY_DATA as ɵbh, Activity as ɵbi, ConfirmThenDialogComponent as ɵbk, AlertDialogComponent as ɵbl, InPlaceInteractionContextComponent as ɵbn, FocusBindingDirective as ɵc, DisposableComponent as ɵd, ComponentsModule as ɵe, NumberInputComponent as ɵf, AbstractInputComponent as ɵg, StringInputComponent as ɵh, PasswordInputComponent as ɵi, SelectInputComponent as ɵj, ScrollContainerComponent as ɵk, NoopComponent as ɵl, PlaceModule as ɵm, EmptyStateComponent as ɵn, BusyOverlayComponent as ɵo, PlaceOutletComponent as ɵp, leftRightPlaceAnimation as ɵq, LEFT_RIGHT_PLACE_ANIMATION as ɵr, AUP_PLACE_CONFIG as ɵs, PlaceRouter as ɵu, InteractionService as ɵv, ModalInteractionContextFactory as ɵw, UrlService as ɵx, PlaceHistory as ɵy, TabbedPlaceNavigationComponent as ɵz };
+export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AbstractInputComponent, AbstractInteractionContext, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, Activity, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, AlertDialogComponent, AngularUiPowerupsModule, Bounds, BusyOverlayComponent, CommandDirective, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EmptyStateComponent, EventCleanUpSession, FocusBindingDirective, Formatter, InPlaceInteractionContextComponent, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ModalInteractionContextFactory, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NumberInputComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SelectInputComponent, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, UrlService, UrlSnapshot, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationEventsFinish, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, DirectivesModule as ɵa, CommandDirective as ɵb, ModalInteractionContextFactory as ɵba, UrlService as ɵbb, PlaceHistory as ɵbc, TabbedPlaceNavigationComponent as ɵbd, AbstractPlaceNavigationComponent as ɵbe, ListPlaceNavComponent as ɵbf, InteractionModule as ɵbg, ActivityContainerComponent as ɵbh, AbstractInteractionContext as ɵbi, ActivityOutletComponent as ɵbj, ConfirmationDialogComponent as ɵbk, ACTIVITY_DATA as ɵbl, Activity as ɵbm, ConfirmThenDialogComponent as ɵbo, AlertDialogComponent as ɵbp, InPlaceInteractionContextComponent as ɵbr, FocusBindingDirective as ɵc, DisposableComponent as ɵd, ComponentsModule as ɵe, NumberInputComponent as ɵf, AbstractInputComponent as ɵg, StringInputComponent as ɵh, PasswordInputComponent as ɵi, SelectInputComponent as ɵj, ScrollContainerComponent as ɵk, NoopComponent as ɵl, SwitchCaseOption as ɵm, SwitchCaseWhenDirective as ɵn, SwitchCaseDefaultDirective as ɵo, SwitchCaseComponent as ɵp, PlaceModule as ɵq, EmptyStateComponent as ɵr, BusyOverlayComponent as ɵs, PlaceOutletComponent as ɵt, leftRightPlaceAnimation as ɵu, LEFT_RIGHT_PLACE_ANIMATION as ɵv, AUP_PLACE_CONFIG as ɵw, PlaceRouter as ɵy, InteractionService as ɵz };
 //# sourceMappingURL=coolon-angular-ui-powerups.js.map