@coolon/angular-ui-powerups 0.0.43 → 0.0.46

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

@@ -5,7 +5,7 @@ import { MatDialog, MatButtonModule, MatDialogModule, MatTabsModule, MatProgress
 import { MatTabsModule as MatTabsModule$1 } from '@angular/material/tabs';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { __decorate, __metadata, __awaiter } from 'tslib';
-import { GarbageCollector, DelegatingFormValueModel, UseDelegate, ValueModel, ListModel, StoreInListModel, assert, UnaryCommand, lang, Dsl, Logger, EventListenerList, DelegatingValueModel, Trace, MutableListModel, StoreInValueModel, MutableValueModel, Binding, OptionsHelper, ValueHolder } from '@coolon/pectin';
+import { GarbageCollector, DelegatingFormValueModel, UseDelegate, ValueModel, ListModel, StoreInListModel, assert, UnaryCommand, lang, Dsl, Logger, EventListenerList, DelegatingValueModel, Trace, MutableListModel, StoreInValueModel, Binding, Guard, MutableValueModel, OptionsHelper, ValueHolder } from '@coolon/pectin';
 import { PortalModule } from '@angular/cdk/portal';
 import { Deferred } from '@coolon/pectin/lib/promise/deferred.class';
 import { assert as assert$1, Klass, Opts } from '@coolon/typescript-utilities';
@@ -13,11 +13,11 @@ import { MatDialog as MatDialog$1 } from '@angular/material/dialog';
 import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { Router, ActivatedRoute, RouterOutlet, RouterModule, PRIMARY_OUTLET } from '@angular/router';
-import { Memoize } from '@typescript-plus/fast-memoize-decorator/dist/src';
-import { Memoize as Memoize$1 } from '@typescript-plus/fast-memoize-decorator';
-import { isNil, isEqual, isEmpty, isFunction } from 'lodash';
+import { Router, ActivatedRouteSnapshot, UrlTree, RouterModule } from '@angular/router';
+import { Memoize as Memoize$1 } from '@typescript-plus/fast-memoize-decorator/dist/src';
+import { Memoize } from '@typescript-plus/fast-memoize-decorator';
 import 'reflect-metadata';
+import ___default, { isNil } from 'lodash';
 import { style, query, group, animate, trigger, transition } from '@angular/animations';
 import ResizeObserver from 'resize-observer-polyfill';
 
@@ -529,7 +529,7 @@ class FocusBindingDirective extends DisposableComponent {
             }));
         }
         else {
-            Logger.get(this).warn("pectinFocusBinding was nil");
+            Logger.get(this).warn('pectinFocusBinding was nil');
         }
     }
     /**
@@ -713,6 +713,11 @@ if (false) {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
+ * ActivityOutletComponent creates and displays an activity and delegates the interaction context functionality to an
+ * external service.
+ *
+ * It might be nice to have wrapper component that allows more declarative use, i.e.
+ * <activity-view [activityClass]="...", [activityData]="..." (done)=".." (cancel)="..."></activity-view>
  * @template D, R, E
  */
 class ActivityOutletComponent {
@@ -1081,7 +1086,7 @@ class ConfirmationDialogComponent extends AbstractActivity {
 ConfirmationDialogComponent.decorators = [
     { type: Component, args: [{
                 selector: 'angular-ui-powerups-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<p matDialogActions>\n  <button mat-button (click)=\"cancel()\">{{confirm.cancel()}}</button>\n  <button mat-raised-button [color]=\"isDestructive() ? 'warn' : 'primary'\" (click)=\"done(true)\">{{confirm.ok()}}</button>\n</p>\n\n",
+                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<p matDialogActions>\n  <button mat-button (click)=\"cancel()\">{{confirm.cancel()}}</button>\n  <button mat-raised-button [color]=\"isDestructive() ? 'warn' : 'primary'\"\n          (click)=\"done(true)\">{{confirm.ok()}}</button>\n</p>\n\n",
                 styles: [":host{display:block;padding:var(--angular-ui-powerups-default-padding)}.mat-dialog-actions{justify-content:flex-end}"]
             }] }
 ];
@@ -1188,7 +1193,7 @@ class ActivityContainerComponent extends DisposableComponent {
 ActivityContainerComponent.decorators = [
     { type: Component, args: [{
                 selector: 'angular-ui-powerups-activity-container',
-                template: "<mat-tab-group #tabs no-tab-header [dynamicHeight]=\"true\">\n  <mat-tab>\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\" [activityContext]=\"initialActivityOutlet\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n  <mat-tab *ngFor=\"let tab of activityOutletTabs.value\">\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\" [activityContext]=\"tab\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n</mat-tab-group>\n",
+                template: "<mat-tab-group #tabs no-tab-header [dynamicHeight]=\"true\">\n  <mat-tab>\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\"\n                                         [activityContext]=\"initialActivityOutlet\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n  <mat-tab *ngFor=\"let tab of activityOutletTabs.value\">\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\"\n                                         [activityContext]=\"tab\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n</mat-tab-group>\n",
                 styles: [":host{display:block}"]
             }] }
 ];
@@ -1450,11 +1455,603 @@ EmptyStateComponent.decorators = [
 /** @nocollapse */
 EmptyStateComponent.ctorParameters = () => [];
 
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class PlaceDefinition {
+    /**
+     * @param {?} component
+     * @param {?} path
+     * @param {?} authenticate
+     * @param {?} order
+     * @param {?} data
+     * @param {?} routeParameters
+     * @param {?} children
+     */
+    constructor(component, path, authenticate, order, data, routeParameters, children) {
+        this.component = component;
+        this.path = path;
+        this.authenticate = authenticate;
+        this.order = order;
+        this.data = data;
+        this.routeParameters = routeParameters;
+        this.children = children;
+    }
+    /**
+     * @return {?}
+     */
+    getRouteParameters() {
+        return this.routeParameters;
+    }
+    /**
+     * @template T
+     * @param {?} key
+     * @param {?=} defaultValue
+     * @return {?}
+     */
+    getData(key, defaultValue) {
+        return this.data ?
+            ___default.isNil(this.data[key]) ? defaultValue : this.data[key] :
+            defaultValue;
+    }
+    /**
+     * @template T
+     * @param {?} keys
+     * @param {?=} defaultValue
+     * @return {?}
+     */
+    searchData(keys, defaultValue) {
+        if (this.data) {
+            /** @type {?} */
+            const found = keys.find((/**
+             * @param {?} key
+             * @return {?}
+             */
+            key => !___default.isNil(this.data[key])));
+            return found ? this.data[found] : defaultValue;
+        }
+        else {
+            return defaultValue;
+        }
+    }
+}
+if (false) {
+    /** @type {?} */
+    PlaceDefinition.prototype.component;
+    /** @type {?} */
+    PlaceDefinition.prototype.path;
+    /** @type {?} */
+    PlaceDefinition.prototype.authenticate;
+    /** @type {?} */
+    PlaceDefinition.prototype.order;
+    /** @type {?} */
+    PlaceDefinition.prototype.data;
+    /** @type {?} */
+    PlaceDefinition.prototype.routeParameters;
+    /** @type {?} */
+    PlaceDefinition.prototype.children;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+// RAKE: making this Symbol(...) broke things.
+/** @type {?} */
+const DEFINITION_META_DATA_KEY = 'PLACE_DEFINITION_OPTIONS';
+// this one seems ok.
+/** @type {?} */
+const ROUTE_PARAMETER_LIST_KEY = Symbol('place:route:parameters');
+class PlaceComponent extends DisposableComponent {
+    constructor() {
+        super();
+    }
+    /**
+     * @param {?} resolvedParameters
+     * @return {?}
+     */
+    initialiseBindings(resolvedParameters) {
+        assert.isNil(this.resolvedParameters);
+        this.resolvedParameters = resolvedParameters;
+        this.placeDefinition.getRouteParameters().forEach((/**
+         * @param {?} parameterDef
+         * @return {?}
+         */
+        parameterDef => {
+            this.installBinding(parameterDef);
+        }));
+    }
+    /**
+     * @private
+     * @template T, S
+     * @param {?} parameterDef
+     * @return {?}
+     */
+    installBinding(parameterDef) {
+        /** @type {?} */
+        const model = (/** @type {?} */ (this[parameterDef.propertyName]));
+        // this.txo.observe(parameterDef.propertyName, model);
+        this.registerDisposable(new Binding(this.resolvedParameters, model, {
+            /**
+             * @param {?} parameters
+             * @return {?}
+             */
+            toRight(parameters) {
+                return parameters.getValueOf(parameterDef);
+            },
+            /**
+             * @param {?} value
+             * @param {?=} currentParameters
+             * @return {?}
+             */
+            toLeft(value, currentParameters) {
+                return currentParameters.replace(parameterDef, value);
+            }
+        }));
+    }
+    /**
+     * @return {?}
+     */
+    get placeDefinition() {
+        return PlaceComponent.getDefinition((/** @type {?} */ ((/** @type {?} */ (this.constructor)))));
+    }
+    /**
+     * @return {?}
+     */
+    get childPlaces() {
+        return this.placeDefinition.children.map((/**
+         * @param {?} d
+         * @return {?}
+         */
+        d => d.component));
+    }
+    /**
+     * @return {?}
+     */
+    canDeactivate() {
+        return true;
+    }
+    /**
+     * @return {?}
+     */
+    onPlaceReady() {
+    }
+}
+__decorate([
+    Memoize(),
+    __metadata("design:type", PlaceDefinition),
+    __metadata("design:paramtypes", [])
+], PlaceComponent.prototype, "placeDefinition", null);
+if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceComponent.prototype.resolvedParameters;
+}
+(function (PlaceComponent) {
+    /**
+     * @param {?} target
+     * @return {?}
+     */
+    function isPlaceComponentConstructor(target) {
+        return lang.constructorChain((/** @type {?} */ (target))).includes(PlaceComponent);
+    }
+    PlaceComponent.isPlaceComponentConstructor = isPlaceComponentConstructor;
+    /**
+     * @param {?} klass
+     * @return {?}
+     */
+    function getRouteParameters(klass) {
+        return Klass.get(klass).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
+    }
+    PlaceComponent.getRouteParameters = getRouteParameters;
+    /**
+     * @param {?} klass
+     * @return {?}
+     */
+    function getDefinition(klass) {
+        return Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
+    }
+    PlaceComponent.getDefinition = getDefinition;
+    /**
+     * @param {?} klass
+     * @param {?} definition
+     * @return {?}
+     */
+    function injectDefinition(klass, definition) {
+        Reflect.defineMetadata(DEFINITION_META_DATA_KEY, definition, klass);
+    }
+    PlaceComponent.injectDefinition = injectDefinition;
+})(PlaceComponent || (PlaceComponent = {}));
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class AbstractPlaceNavigationComponent extends DisposableComponent {
+    constructor() {
+        super();
+        const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
+        this.placeDefinitions = chain(this.placesModel).map((/**
+         * @param {?} c
+         * @return {?}
+         */
+        c => PlaceComponent.getDefinition(c)));
+    }
+    /**
+     * @param {?} placeDef
+     * @return {?}
+     */
+    getNav(placeDef) {
+        /** @type {?} */
+        const navItem = (/** @type {?} */ (placeDef.getData('nav')));
+        return {
+            title: (/**
+             * @return {?}
+             */
+            () => navItem ? navItem.title() : placeDef.searchData(['navTitle', 'title'])),
+            tooltip: (/**
+             * @return {?}
+             */
+            () => navItem && navItem.tooltip ? navItem.tooltip() : placeDef.getData('navTooltip', null)),
+            icon: (/**
+             * @return {?}
+             */
+            () => navItem && navItem.icon ? navItem.icon() : placeDef.getData('navIcon', null))
+        };
+    }
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+    }
+}
+AbstractPlaceNavigationComponent.propDecorators = {
+    places: [{ type: Input }],
+    placesModel: [{ type: Input }]
+};
+__decorate([
+    StoreInListModel('placesModel'),
+    __metadata("design:type", Array)
+], AbstractPlaceNavigationComponent.prototype, "places", void 0);
+__decorate([
+    UseDelegate(),
+    __metadata("design:type", ListModel)
+], AbstractPlaceNavigationComponent.prototype, "placesModel", void 0);
+__decorate([
+    Memoize$1(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [PlaceDefinition]),
+    __metadata("design:returntype", Object)
+], AbstractPlaceNavigationComponent.prototype, "getNav", null);
+if (false) {
+    /** @type {?} */
+    AbstractPlaceNavigationComponent.prototype.places;
+    /** @type {?} */
+    AbstractPlaceNavigationComponent.prototype.placesModel;
+    /** @type {?} */
+    AbstractPlaceNavigationComponent.prototype.placeDefinitions;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class ListPlaceNavComponent extends AbstractPlaceNavigationComponent {
+    constructor() {
+        super();
+        this.expanded = true;
+    }
+    /**
+     * @return {?}
+     */
+    expandMenu() {
+        this.expanded = true;
+    }
+    /**
+     * @return {?}
+     */
+    collapseMenu() {
+        this.expanded = false;
+    }
+    /**
+     * @return {?}
+     */
+    toggleMenu() {
+        this.expanded = !this.expanded;
+    }
+}
+ListPlaceNavComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'angular-ui-powerups-list-place-nav',
+                template: "<mat-nav-list class=\"app-menu\">\n  <a mat-list-item *ngFor=\"let place of placeDefinitions.value\"\n     [routerLink]='place.path'\n     routerLinkActive #rla=\"routerLinkActive\"\n     [matTooltip]=\"getNav(place).tooltip()\">\n    <mat-icon *ngIf=\"getNav(place).icon()\">{{getNav(place).icon()}}</mat-icon>\n    <span class=\"expanded-only\">{{getNav(place).title()}}</span>\n  </a>\n</mat-nav-list>\n",
+                styles: [":host{display:flex;flex-direction:column;--expanded-width:235px;--nav-item-width:var(--nav-bar-height);width:var(--nav-item-width);transition:width 125ms linear}:host.expanded{width:var(--expanded-width);max-width:var(--expanded-width)}.expanded-only{max-width:0;overflow:hidden}.collapsed-only{max-width:100%;overflow:hidden}.header{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;height:var(--nav-bar-height);border-bottom:var(--pinstripe-border);cursor:pointer}.header .menu{flex:1}.header button{color:inherit;width:var(--nav-item-width);height:var(--nav-bar-height)}mat-nav-list{flex:1;display:flex;flex-direction:column}.mat-list-item{width:var(--nav-item-width);height:var(--nav-bar-height);color:inherit}mat-icon{color:inherit}mat-icon.flip-horizontal{transform:scaleX(-1)}:host-context(.expanded) .expanded-only{max-width:100%}:host-context(.expanded) .collapsed-only{max-width:0}:host-context(.expanded) .mat-list-item mat-icon{margin-right:12px}:host-context(.expanded) .mat-list-item span{text-wrap:none;white-space:nowrap}a[ng-reflect-router-link=manage-instruments] mat-icon{transform:rotate(90deg)}.app-menu{padding-top:0}"]
+            }] }
+];
+/** @nocollapse */
+ListPlaceNavComponent.ctorParameters = () => [];
+ListPlaceNavComponent.propDecorators = {
+    expanded: [{ type: HostBinding, args: ['class.expanded',] }]
+};
+if (false) {
+    /** @type {?} */
+    ListPlaceNavComponent.prototype.expanded;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class PlaceHistory {
+    /**
+     * @param {?} router
+     */
+    constructor(router) {
+        this.router = router;
+        this._history = new Map();
+    }
+    /**
+     * @param {?} state
+     * @return {?}
+     */
+    add(state) {
+        /** @type {?} */
+        const history = this.getHistory(state.placeDefinition);
+        /** @type {?} */
+        const previousState = ___default.last(history);
+        if (!previousState || state.hasChanged(previousState)) {
+            history.unshift(state); // LIFO
+            this.setHistory(state.placeDefinition, history.slice(-3)); // limit our history to 3 visits
+        }
+    }
+    /**
+     * @param {?} placeDef
+     * @return {?}
+     */
+    getHistory(placeDef) {
+        /** @type {?} */
+        let history = this._history.get(placeDef);
+        if (!history) {
+            history = [];
+            this.setHistory(placeDef, history);
+        }
+        return history;
+    }
+    /**
+     * @private
+     * @param {?} placeDef
+     * @param {?} history
+     * @return {?}
+     */
+    setHistory(placeDef, history) {
+        this._history.set(placeDef, history);
+    }
+}
+PlaceHistory.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
+];
+/** @nocollapse */
+PlaceHistory.ctorParameters = () => [
+    { type: Router }
+];
+/** @nocollapse */ PlaceHistory.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceHistory_Factory() { return new PlaceHistory(ɵɵinject(Router)); }, token: PlaceHistory, providedIn: "root" });
+if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceHistory.prototype._history;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceHistory.prototype.router;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @abstract
+ * @template T, S
+ */
+class ParameterDefinition {
+    /**
+     * @param {?} propertyName
+     * @param {?} type
+     * @param {?} options
+     */
+    constructor(propertyName, type, options) {
+        this.propertyName = propertyName;
+        this.type = type;
+        /** @type {?} */
+        const opts = Opts.get(options);
+        this.name = opts.getOptional('as', propertyName);
+        this.remember = opts.getOptional('remember', false);
+        this.defaultValue = opts.getOptional('defaultValue', null);
+    }
+    /**
+     * @param {?} injector
+     * @return {?}
+     */
+    getSanitiser(injector) {
+        if (this.remember || !___default.isNil(this.defaultValue)) {
+            return new ParameterDefinition.DefaultParameterSanitiser(this.remember, this.defaultValue, injector.get(PlaceHistory));
+        }
+        else {
+            return null;
+        }
+    }
+}
+if (false) {
+    /** @type {?} */
+    ParameterDefinition.prototype.isRouteId;
+    /** @type {?} */
+    ParameterDefinition.prototype.isArray;
+    /** @type {?} */
+    ParameterDefinition.prototype.name;
+    /**
+     * @type {?}
+     * @private
+     */
+    ParameterDefinition.prototype.remember;
+    /**
+     * @type {?}
+     * @private
+     */
+    ParameterDefinition.prototype.defaultValue;
+    /** @type {?} */
+    ParameterDefinition.prototype.propertyName;
+    /** @type {?} */
+    ParameterDefinition.prototype.type;
+}
+(function (ParameterDefinition) {
+    /**
+     * @record
+     * @template T
+     */
+    function Options() { }
+    ParameterDefinition.Options = Options;
+    if (false) {
+        /** @type {?|undefined} */
+        Options.prototype.as;
+        /** @type {?|undefined} */
+        Options.prototype.optional;
+        /** @type {?|undefined} */
+        Options.prototype.remember;
+        /** @type {?|undefined} */
+        Options.prototype.defaultValue;
+    }
+    /**
+     * @template T
+     */
+    class RouteId extends ParameterDefinition {
+        constructor() {
+            super(...arguments);
+            this.isRouteId = true;
+            this.isArray = false;
+        }
+    }
+    ParameterDefinition.RouteId = RouteId;
+    if (false) {
+        /** @type {?} */
+        RouteId.prototype.isRouteId;
+        /** @type {?} */
+        RouteId.prototype.isArray;
+    }
+    /**
+     * @template T
+     */
+    class ValueParameter extends ParameterDefinition {
+        constructor() {
+            super(...arguments);
+            this.isRouteId = false;
+            this.isArray = false;
+        }
+    }
+    ParameterDefinition.ValueParameter = ValueParameter;
+    if (false) {
+        /** @type {?} */
+        ValueParameter.prototype.isRouteId;
+        /** @type {?} */
+        ValueParameter.prototype.isArray;
+    }
+    /**
+     * @template T
+     */
+    class ArrayParameter extends ParameterDefinition {
+        constructor() {
+            super(...arguments);
+            this.isRouteId = false;
+            this.isArray = true;
+        }
+    }
+    ParameterDefinition.ArrayParameter = ArrayParameter;
+    if (false) {
+        /** @type {?} */
+        ArrayParameter.prototype.isRouteId;
+        /** @type {?} */
+        ArrayParameter.prototype.isArray;
+    }
+    /**
+     * @template T, S
+     */
+    class DefaultParameterSanitiser {
+        /**
+         * @param {?} remember
+         * @param {?} defaultValue
+         * @param {?} placeHistory
+         */
+        constructor(remember, defaultValue, placeHistory) {
+            this.remember = remember;
+            this.defaultValue = defaultValue;
+            this.placeHistory = placeHistory;
+        }
+        /**
+         * @param {?} parameterDef
+         * @param {?} value
+         * @param {?=} visit
+         * @return {?}
+         */
+        sanitise(parameterDef, value, visit) {
+            if (this.isBlank(parameterDef, value)) {
+                if (this.remember) {
+                    /** @type {?} */
+                    const visits = this.placeHistory.getHistory(visit.placeDefinition);
+                    value = visits.map((/**
+                     * @param {?} v
+                     * @return {?}
+                     */
+                    v => v.getValueOf(parameterDef)))
+                        .filter((/**
+                     * @param {?} v
+                     * @return {?}
+                     */
+                    v => !___default.isNil(v)))
+                        .find((/**
+                     * @param {?} v
+                     * @return {?}
+                     */
+                    v => !this.isBlank(parameterDef, v)));
+                }
+                value = this.isBlank(parameterDef, value) ? this.defaultValue : value;
+                console.log(`${parameterDef.name} is blank, returning: ${value}`);
+                return value;
+            }
+            else {
+                console.log(`${parameterDef.name} is not blank`);
+                return value;
+            }
+        }
+        /**
+         * @private
+         * @param {?} def
+         * @param {?} value
+         * @return {?}
+         */
+        isBlank(def, value) {
+            /** @type {?} */
+            const isNil = ___default.isNil(value);
+            return isNil ? true : def.isArray ? value['length'] < 1 : false;
+        }
+    }
+    ParameterDefinition.DefaultParameterSanitiser = DefaultParameterSanitiser;
+    if (false) {
+        /** @type {?} */
+        DefaultParameterSanitiser.prototype.remember;
+        /** @type {?} */
+        DefaultParameterSanitiser.prototype.defaultValue;
+        /** @type {?} */
+        DefaultParameterSanitiser.prototype.placeHistory;
+    }
+})(ParameterDefinition || (ParameterDefinition = {}));
+
 var _a;
-// TODO: there are really two types of snapshot, ones with id's and ones without.
-// Id snapshot are repesented by 2 url segments
-// ID => [{'/basePath', params}, {'id', params}]
-// NO ID => [{'/basePath', params}]
 class ParameterSnapshot {
     /**
      * @param {?} placeDefinition
@@ -1466,56 +2063,33 @@ class ParameterSnapshot {
     }
     /**
      * @param {?} other
+     * @param {?=} debug
      * @return {?}
      */
-    hasChanged(other) {
+    hasChanged(other, debug = false) {
         /** @type {?} */
         const changed = this.resolved.find((/**
          * @param {?} r
          * @return {?}
          */
         (r) => {
-            return !r.isSame(other.getResolvedParameterValue(r.parameterDef));
+            return !r.isSame(other.getValueOf(r.parameterDef));
         }));
-        if (changed) {
-            console.log({ mine: changed, theirs: other.getResolvedParameter(changed.parameterDef) });
+        if (changed && debug) {
+            console.log({
+                name: changed.parameterDef.name,
+                mine: changed.value,
+                theirs: other.getValueOf(changed.parameterDef)
+            });
         }
         return !!changed;
     }
-    /**
-     * @param {?} other
-     * @return {?}
-     */
-    asUrlSegment(other) {
-        assert.isTruthy(this.hasChanged(other));
-        /** @type {?} */
-        const routeParts = [];
-        /** @type {?} */
-        const gainedId = this.getFormattedRouteId() && !other.getFormattedRouteId();
-        /** @type {?} */
-        const sameId = this.getFormattedRouteId() === other.getFormattedRouteId();
-        /** @type {?} */
-        const lostId = (!this.getFormattedRouteId() && other.getFormattedRouteId());
-        /** @type {?} */
-        const changedId = (this.getFormattedRouteId() !== other.getFormattedRouteId());
-        if (lostId || changedId) {
-            routeParts.push('..');
-            if (changedId) {
-                routeParts.push(this.getFormattedRouteId());
-            }
-        }
-        else {
-            routeParts.push('.');
-        }
-        routeParts.push(this.getFormattedParameters());
-        return routeParts;
-    }
     /**
      * @template T, S
      * @param {?} parameterDef
      * @return {?}
      */
-    getResolvedParameter(parameterDef) {
+    getParameter(parameterDef) {
         return this.resolved.find((/**
          * @param {?} r
          * @return {?}
@@ -1527,22 +2101,22 @@ class ParameterSnapshot {
      * @param {?} parameterDef
      * @return {?}
      */
-    getResolvedParameterValue(parameterDef) {
+    getValueOf(parameterDef) {
         /** @type {?} */
-        const resolvedParameter = this.getResolvedParameter(parameterDef);
+        const resolvedParameter = this.getParameter(parameterDef);
         return resolvedParameter ? resolvedParameter.value : null;
     }
     /**
      * @return {?}
      */
-    getRouteId() {
-        return this.getResolvedRouteId() ? this.getResolvedRouteId().value : null;
+    getRouteIdValue() {
+        return this.getRouteIdParameter() ? this.getRouteIdParameter().value : null;
     }
     /**
      * @param {?} name
      * @return {?}
      */
-    getRouteParameter(name) {
+    getParameterValue(name) {
         /** @type {?} */
         const resolvedParameter = this.resolved.find((/**
          * @param {?} r
@@ -1555,7 +2129,7 @@ class ParameterSnapshot {
      * @private
      * @return {?}
      */
-    getResolvedRouteId() {
+    getRouteIdParameter() {
         // RouteId's are never arrays: see parameter-decorators.ts createDefinition methods. It would be nice to
         // capture this in the type system though
         return (/** @type {?} */ (this.resolved.find((/**
@@ -1564,18 +2138,29 @@ class ParameterSnapshot {
          */
         p => p.parameterDef.isRouteId))));
     }
+    /**
+     * @private
+     * @return {?}
+     */
+    getRouteParameters() {
+        return this.resolved.filter((/**
+         * @param {?} r
+         * @return {?}
+         */
+        r => !r.parameterDef.isRouteId));
+    }
     /**
      * @return {?}
      */
     hasRouteId() {
-        return !!this.getResolvedRouteId();
+        return !!this.getRouteIdParameter();
     }
     /**
      * @return {?}
      */
     getFormattedRouteId() {
         /** @type {?} */
-        const routeIdParam = this.getResolvedRouteId();
+        const routeIdParam = this.getRouteIdParameter();
         return routeIdParam ? routeIdParam.formattedValue() : null;
     }
     /**
@@ -1598,6 +2183,22 @@ class ParameterSnapshot {
         }));
         return params;
     }
+    /**
+     * @return {?}
+     */
+    getAllFormattedParameters() {
+        /** @type {?} */
+        const params = {};
+        /** @type {?} */
+        const routeIdParam = this.resolved.forEach((/**
+         * @param {?} p
+         * @return {?}
+         */
+        p => {
+            params[p.parameterDef.name] = p.formattedValue();
+        }));
+        return params;
+    }
     /**
      * @template T, S
      * @param {?} parameter
@@ -1614,37 +2215,73 @@ class ParameterSnapshot {
         })));
     }
     /**
-     * @param {?} url
+     * @param {?} injector
      * @return {?}
      */
-    updateUrl(url) {
-        return url;
+    sanitise(injector) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.hasRouteId()) {
+                /** @type {?} */
+                const routeId = this.getRouteIdParameter();
+                /** @type {?} */
+                const sanitisedValue = yield routeId.sanitise(this, injector);
+                if (!routeId.isSame(sanitisedValue)) {
+                    // if the route id has changed we redirect immediately as other
+                    // parameter sanitisers might use it.
+                    return this.replace(routeId.parameterDef, sanitisedValue);
+                }
+            }
+            /** @type {?} */
+            let result = this;
+            /** @type {?} */
+            const routeParameters = this.getRouteParameters();
+            for (let i = 0; i < routeParameters.length; i++) {
+                /** @type {?} */
+                const sanitisedValue = yield routeParameters[i].sanitise(this, injector);
+                if (!routeParameters[i].isSame(sanitisedValue)) {
+                    result = this.replace(routeParameters[i].parameterDef, sanitisedValue);
+                }
+            }
+            return result;
+        });
     }
 }
 __decorate([
-    Memoize(),
+    Memoize$1(),
     __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
+    __metadata("design:paramtypes", [ParameterDefinition]),
     __metadata("design:returntype", ParameterSnapshot.ResolvedParameter)
-], ParameterSnapshot.prototype, "getResolvedParameter", null);
+], ParameterSnapshot.prototype, "getParameter", null);
 __decorate([
-    Memoize(),
+    Memoize$1(),
     __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
+    __metadata("design:paramtypes", [ParameterDefinition]),
     __metadata("design:returntype", typeof (_a = typeof S !== "undefined" && S) === "function" ? _a : Object)
-], ParameterSnapshot.prototype, "getResolvedParameterValue", null);
+], ParameterSnapshot.prototype, "getValueOf", null);
 __decorate([
-    Memoize(),
+    Memoize$1(),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [String]),
     __metadata("design:returntype", Object)
-], ParameterSnapshot.prototype, "getRouteParameter", null);
+], ParameterSnapshot.prototype, "getParameterValue", null);
 __decorate([
-    Memoize(),
+    Memoize$1(),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", ParameterSnapshot.ResolvedValueParameter)
-], ParameterSnapshot.prototype, "getResolvedRouteId", null);
+], ParameterSnapshot.prototype, "getRouteIdParameter", null);
+__decorate([
+    Memoize$1(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", Array)
+], ParameterSnapshot.prototype, "getRouteParameters", null);
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Injector]),
+    __metadata("design:returntype", Promise)
+], ParameterSnapshot.prototype, "sanitise", null);
 if (false) {
     /** @type {?} */
     ParameterSnapshot.prototype.placeDefinition;
@@ -1657,10 +2294,13 @@ if (false) {
 (function (ParameterSnapshot) {
     /**
      * @param {?} placeDef
-     * @param {?} paramMap
+     * @param {?} params
+     * @param {?} urlSegments
      * @return {?}
      */
-    function create(placeDef, paramMap) {
+    function create(placeDef, params, urlSegments) {
+        /** @type {?} */
+        const paramMap = new ConsolidatedParameterMap(params, urlSegments);
         /** @type {?} */
         const resolvedParameters = placeDef.getRouteParameters()
             .map((/**
@@ -1670,7 +2310,11 @@ if (false) {
         def => {
             if (def.isArray) {
                 /** @type {?} */
-                const value = paramMap.has(def.name) ? paramMap.getAll(def.name).map((/**
+                const value = paramMap.has(def.name) ? paramMap.getAll(def.name).filter((/**
+                 * @param {?} s
+                 * @return {?}
+                 */
+                s => !___default.isEmpty(s))).map((/**
                  * @param {?} raw
                  * @return {?}
                  */
@@ -1687,613 +2331,342 @@ if (false) {
     }
     ParameterSnapshot.create = create;
     /**
-     * @abstract
-     * @template T, S
+     * This a work around for the fact that an activated route with multiple segments doesn't
+     * include the segment params in the paramMap as well as each segment returns an empty
+     * param map even when `parameter`s has content.
      */
-    class ResolvedParameter {
+    class ConsolidatedParameterMap {
         /**
-         * @param {?} parameterDef
-         * @param {?} value
+         * @param {?} paramMap
+         * @param {?} urlSegments
          */
-        constructor(parameterDef, value) {
-            this.parameterDef = parameterDef;
-            this.value = value;
+        constructor(paramMap, urlSegments) {
+            this.paramMaps = [paramMap].concat((urlSegments || []).map((/**
+             * @param {?} s
+             * @return {?}
+             */
+            s => new ParamMapAdapter(s.parameters)))).filter((/**
+             * @param {?} m
+             * @return {?}
+             */
+            m => !!m)); // the activated route param map can be null
         }
         /**
+         * @param {?} name
          * @return {?}
          */
-        isRouteId() {
-            return this.parameterDef.isRouteId;
+        get(name) {
+            return this.paramMaps.find((/**
+             * @param {?} m
+             * @return {?}
+             */
+            m => m.has(name))).get(name);
         }
-    }
-    ParameterSnapshot.ResolvedParameter = ResolvedParameter;
-    if (false) {
-        /** @type {?} */
-        ResolvedParameter.prototype.parameterDef;
-        /** @type {?} */
-        ResolvedParameter.prototype.value;
         /**
-         * @abstract
-         * @param {?} dest
+         * @param {?} name
          * @return {?}
          */
-        ResolvedParameter.prototype.injectRouteParam = function (dest) { };
+        getAll(name) {
+            return this.paramMaps.find((/**
+             * @param {?} m
+             * @return {?}
+             */
+            m => m.has(name))).getAll(name);
+        }
         /**
-         * @abstract
-         * @param {?} otherValue
+         * @param {?} name
          * @return {?}
          */
-        ResolvedParameter.prototype.isSame = function (otherValue) { };
+        has(name) {
+            return !!this.paramMaps.find((/**
+             * @param {?} m
+             * @return {?}
+             */
+            m => m.has(name)));
+        }
+    }
+    if (false) {
         /**
-         * @abstract
-         * @return {?}
+         * @type {?}
+         * @private
          */
-        ResolvedParameter.prototype.formattedValue = function () { };
+        ConsolidatedParameterMap.prototype.paramMaps;
+    }
+    class ParamMapAdapter {
         /**
-         * @abstract
-         * @param {?} value
-         * @return {?}
+         * @param {?} params
          */
-        ResolvedParameter.prototype.replace = function (value) { };
-    }
-    /**
-     * @template T
-     */
-    class ResolvedValueParameter extends ResolvedParameter {
+        constructor(params) {
+            this.params = params;
+        }
         /**
-         * @param {?} otherValue
+         * @param {?} name
          * @return {?}
          */
-        isSame(otherValue) {
-            return this.value === otherValue;
+        get(name) {
+            return this.params[name];
         }
         /**
-         * @param {?} dest
+         * @param {?} name
          * @return {?}
          */
-        injectRouteParam(dest) {
-            dest[this.parameterDef.name] = this.parameterDef.type.format(this.value);
+        getAll(name) {
+            /** @type {?} */
+            const value = this.get(name);
+            return Array.isArray(value) ? value : [value];
         }
         /**
-         * @param {?} value
+         * @param {?} name
          * @return {?}
          */
-        replace(value) {
-            return new ResolvedValueParameter(this.parameterDef, value);
+        has(name) {
+            return this.keys.includes(name);
         }
         /**
          * @return {?}
          */
-        formattedValue() {
-            return !isNil(this.value) ? this.parameterDef.type.format(this.value) : null;
+        get keys() {
+            return Object.keys(this.params);
         }
     }
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Object]),
-        __metadata("design:returntype", Boolean)
-    ], ResolvedValueParameter.prototype, "isSame", null);
-    ParameterSnapshot.ResolvedValueParameter = ResolvedValueParameter;
-    /**
-     * @template T
-     */
-    class ResolvedArrayParameter extends ResolvedParameter {
+    if (false) {
         /**
-         * @param {?} otherValue
-         * @return {?}
+         * @type {?}
+         * @private
          */
-        isSame(otherValue) {
-            return isEqual(this.value, otherValue);
-        }
+        ParamMapAdapter.prototype.params;
+    }
+    /**
+     * @abstract
+     * @template T, S
+     */
+    class ResolvedParameter {
         /**
-         * @param {?} dest
-         * @return {?}
+         * @param {?} parameterDef
+         * @param {?} value
          */
-        injectRouteParam(dest) {
-            dest[this.parameterDef.name] = this.value.map((/**
-             * @param {?} v
-             * @return {?}
-             */
-            v => this.parameterDef.type.format(v)));
+        constructor(parameterDef, value) {
+            this.parameterDef = parameterDef;
+            this.value = value;
         }
         /**
-         * @param {?} value
          * @return {?}
          */
-        replace(value) {
-            return new ResolvedArrayParameter(this.parameterDef, value);
+        isRouteId() {
+            return this.parameterDef.isRouteId;
         }
         /**
+         * @param {?} visit
+         * @param {?} injector
          * @return {?}
          */
-        formattedValue() {
-            return this.value ? this.value.map((/**
-             * @param {?} v
-             * @return {?}
-             */
-            v => this.parameterDef.type.format(v))) : [];
+        sanitise(visit, injector) {
+            return __awaiter(this, void 0, void 0, function* () {
+                /** @type {?} */
+                const sanitiser = this.parameterDef.getSanitiser(injector);
+                if (sanitiser) {
+                    return sanitiser.sanitise(this.parameterDef, this.value, visit);
+                }
+                else {
+                    return this.value;
+                }
+            });
         }
     }
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Array]),
-        __metadata("design:returntype", Boolean)
-    ], ResolvedArrayParameter.prototype, "isSame", null);
-    ParameterSnapshot.ResolvedArrayParameter = ResolvedArrayParameter;
-})(ParameterSnapshot || (ParameterSnapshot = {}));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-// RAKE: making this Symbol(...) broke things.
-/** @type {?} */
-const DEFINITION_META_DATA_KEY = 'PLACE_DEFINITION_OPTIONS';
-// this one seems ok.
-/** @type {?} */
-const ROUTE_PARAMETER_LIST_KEY = Symbol('place:route:parameters');
-class PlaceComponent extends DisposableComponent {
-    /**
-     * @param {?} activatedRoute
-     * @param {?} placeService
-     */
-    constructor(activatedRoute, placeService) {
-        super();
-        this.activatedRoute = activatedRoute;
-        this._incomingRouteChange = new MutableValueModel(false);
-        this.resolvedParameters = new MutableValueModel();
-        const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        this.placeDefinition.getRouteParameters().forEach((/**
-         * @param {?} p
-         * @return {?}
-         */
-        p => this.installBinding(p)));
-        observe.valuesFrom(activatedRoute.paramMap)
-            .last()
-            .map((/**
-         * @param {?} params
+    ParameterSnapshot.ResolvedParameter = ResolvedParameter;
+    if (false) {
+        /** @type {?} */
+        ResolvedParameter.prototype.parameterDef;
+        /** @type {?} */
+        ResolvedParameter.prototype.value;
+        /**
+         * @abstract
+         * @param {?} dest
          * @return {?}
          */
-        params => ParameterSnapshot.create(this.placeDefinition, params)))
-            .subscribe((/**
-         * @param {?} resolvedParameters
+        ResolvedParameter.prototype.injectRouteParam = function (dest) { };
+        /**
+         * @abstract
+         * @param {?} otherValue
          * @return {?}
          */
-        resolvedParameters => {
-            this._incomingRouteChange.value = true;
-            this.resolvedParameters.value = resolvedParameters;
-            this._incomingRouteChange.value = false;
-        }));
-        when.valueOf(this.resolvedParameters).changes((/**
-         * @param {?} params
-         * @param {?} previous
+        ResolvedParameter.prototype.isSame = function (otherValue) { };
+        /**
+         * @abstract
          * @return {?}
          */
-        (params, previous) => {
-            placeService.notifyRouteParametersChanged({
-                activatedRoute: this.activatedRoute,
-                next: params,
-                previous: previous,
-                updateRoute: !this.incomingRouteChange.value // we update the route if it's a component triggered change.
-            });
-        }));
-    }
-    /**
-     * @return {?}
-     */
-    get incomingRouteChange() {
-        return this._incomingRouteChange.readonly;
-    }
-    /**
-     * @private
-     * @template T, S
-     * @param {?} parameterDef
-     * @return {?}
-     */
-    installBinding(parameterDef) {
-        /** @type {?} */
-        const model = (/** @type {?} */ (this[parameterDef.propertyName]));
-        // this.txo.observe(parameterDef.propertyName, model);
-        this.registerDisposable(new Binding(this.resolvedParameters, model, {
-            /**
-             * @param {?} parameters
-             * @return {?}
-             */
-            toRight(parameters) {
-                return parameters.getResolvedParameterValue(parameterDef);
-            },
-            /**
-             * @param {?} value
-             * @param {?=} currentParameters
-             * @return {?}
-             */
-            toLeft(value, currentParameters) {
-                return currentParameters.replace(parameterDef, value);
-            }
-        }));
-    }
-    /**
-     * @return {?}
-     */
-    get placeDefinition() {
-        return PlaceComponent.getDefinition((/** @type {?} */ ((/** @type {?} */ (this.constructor)))));
-    }
-    /**
-     * @return {?}
-     */
-    canDeactivate() {
-        return true;
-    }
-    // @Trace()
-    /**
-     * @return {?}
-     */
-    onPlaceReady() {
-    }
-}
-__decorate([
-    Memoize$1(),
-    __metadata("design:type", PlaceComponent.Definition),
-    __metadata("design:paramtypes", [])
-], PlaceComponent.prototype, "placeDefinition", null);
-if (false) {
-    /** @type {?} */
-    PlaceComponent.prototype._incomingRouteChange;
-    /**
-     * @type {?}
-     * @private
-     */
-    PlaceComponent.prototype.resolvedParameters;
-    /** @type {?} */
-    PlaceComponent.prototype.activatedRoute;
-}
-(function (PlaceComponent) {
-    class Definition {
-        /**
-         * @param {?} component
-         * @param {?} options
-         */
-        constructor(component, options) {
-            this.component = component;
-            assert.notNil(options);
-            this.path = options.path;
-            this.order = options.order;
-            this.data = options.data;
-            this.authenticate = isNil(options.authenticate) || options.authenticate;
-            this.children = (options.children || []).map((/**
-             * @param {?} c
-             * @return {?}
-             */
-            c => PlaceComponent.getDefinition(c).component));
-        }
+        ResolvedParameter.prototype.formattedValue = function () { };
         /**
+         * @abstract
+         * @param {?} value
          * @return {?}
          */
-        getRouteParameters() {
-            return Klass.get(this.component).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
-        }
+        ResolvedParameter.prototype.replace = function (value) { };
+    }
+    /**
+     * @template T
+     */
+    class ResolvedValueParameter extends ResolvedParameter {
         /**
-         * @param {?} constructable
+         * @param {?} otherValue
          * @return {?}
          */
-        isDescriptorForType(constructable) {
-            return lang.constructorChain(constructable).includes(PlaceComponent);
+        isSame(otherValue) {
+            return this.value === otherValue;
         }
         /**
-         * @param {?} placeComponent
+         * @param {?} dest
          * @return {?}
          */
-        isDescriptorFor(placeComponent) {
-            return placeComponent.constructor === this.component;
+        injectRouteParam(dest) {
+            dest[this.parameterDef.name] = this.parameterDef.type.format(this.value);
         }
         /**
-         * @template T
-         * @param {?} key
-         * @param {?=} defaultValue
+         * @param {?} value
          * @return {?}
          */
-        getData(key, defaultValue) {
-            return this.data ?
-                isNil(this.data[key]) ? defaultValue : this.data[key] :
-                defaultValue;
+        replace(value) {
+            return new ResolvedValueParameter(this.parameterDef, value);
         }
         /**
-         * @template T
-         * @param {?} keys
-         * @param {?=} defaultValue
          * @return {?}
          */
-        searchData(keys, defaultValue) {
-            if (this.data) {
-                /** @type {?} */
-                const found = keys.find((/**
-                 * @param {?} key
-                 * @return {?}
-                 */
-                key => !isNil(this.data[key])));
-                return found ? this.data[found] : defaultValue;
-            }
-            else {
-                return defaultValue;
-            }
+        formattedValue() {
+            return !___default.isNil(this.value) ? this.parameterDef.type.format(this.value) : null;
         }
     }
-    __decorate([
-        Memoize$1(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", []),
-        __metadata("design:returntype", Array)
-    ], Definition.prototype, "getRouteParameters", null);
-    PlaceComponent.Definition = Definition;
-    if (false) {
-        /** @type {?} */
-        Definition.prototype.path;
-        /** @type {?} */
-        Definition.prototype.authenticate;
-        /** @type {?} */
-        Definition.prototype.order;
-        /** @type {?} */
-        Definition.prototype.data;
-        /** @type {?} */
-        Definition.prototype.children;
-        /** @type {?} */
-        Definition.prototype.component;
-    }
-    /**
-     * @record
-     */
-    function Options() { }
-    PlaceComponent.Options = Options;
-    if (false) {
-        /** @type {?} */
-        Options.prototype.path;
-        /** @type {?} */
-        Options.prototype.order;
-        /** @type {?|undefined} */
-        Options.prototype.data;
-        /** @type {?|undefined} */
-        Options.prototype.authenticate;
-        /** @type {?|undefined} */
-        Options.prototype.children;
-    }
-    /**
-     * @record
-     */
-    function ChildOptions() { }
-    PlaceComponent.ChildOptions = ChildOptions;
-    if (false) {
-        /** @type {?} */
-        ChildOptions.prototype.parent;
-    }
-    /**
-     * @param {?} klass
-     * @return {?}
-     */
-    function getDefinition(klass) {
-        return Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
-    }
-    PlaceComponent.getDefinition = getDefinition;
+    ParameterSnapshot.ResolvedValueParameter = ResolvedValueParameter;
     /**
-     * @param {?} klass
-     * @param {?} options
-     * @return {?}
+     * @template T
      */
-    function injectDefinition(klass, options) {
-        Reflect.defineMetadata(DEFINITION_META_DATA_KEY, new Definition(klass, options), klass);
-    }
-    PlaceComponent.injectDefinition = injectDefinition;
-})(PlaceComponent || (PlaceComponent = {}));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class AbstractPlaceNavigationComponent extends DisposableComponent {
-    constructor() {
-        super();
-        const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        this.placeDefinitions = chain(this.placesModel).map((/**
-         * @param {?} c
+    class ResolvedArrayParameter extends ResolvedParameter {
+        /**
+         * @param {?} otherValue
          * @return {?}
          */
-        c => PlaceComponent.getDefinition(c)));
-    }
-    /**
-     * @param {?} placeDef
-     * @return {?}
-     */
-    getNav(placeDef) {
-        /** @type {?} */
-        const navItem = (/** @type {?} */ (placeDef.getData('nav')));
-        return {
-            title: (/**
-             * @return {?}
-             */
-            () => navItem ? navItem.title() : placeDef.searchData(['navTitle', 'title'])),
-            tooltip: (/**
+        isSame(otherValue) {
+            return ___default.isEqual(this.value, otherValue);
+        }
+        /**
+         * @param {?} dest
+         * @return {?}
+         */
+        injectRouteParam(dest) {
+            dest[this.parameterDef.name] = this.value.map((/**
+             * @param {?} v
              * @return {?}
              */
-            () => navItem && navItem.tooltip ? navItem.tooltip() : placeDef.getData('navTooltip', null)),
-            icon: (/**
+            v => this.parameterDef.type.format(v)));
+        }
+        /**
+         * @param {?} value
+         * @return {?}
+         */
+        replace(value) {
+            return new ResolvedArrayParameter(this.parameterDef, value);
+        }
+        /**
+         * @return {?}
+         */
+        formattedValue() {
+            return this.value ? this.value.map((/**
+             * @param {?} v
              * @return {?}
              */
-            () => navItem && navItem.icon ? navItem.icon() : placeDef.getData('navIcon', null))
-        };
-    }
-    /**
-     * @return {?}
-     */
-    ngOnInit() {
-    }
-}
-AbstractPlaceNavigationComponent.propDecorators = {
-    places: [{ type: Input }],
-    placesModel: [{ type: Input }]
-};
-__decorate([
-    StoreInListModel('placesModel'),
-    __metadata("design:type", Array)
-], AbstractPlaceNavigationComponent.prototype, "places", void 0);
-__decorate([
-    UseDelegate(),
-    __metadata("design:type", ListModel)
-], AbstractPlaceNavigationComponent.prototype, "placesModel", void 0);
-__decorate([
-    Memoize(),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [PlaceComponent.Definition]),
-    __metadata("design:returntype", Object)
-], AbstractPlaceNavigationComponent.prototype, "getNav", null);
-if (false) {
-    /** @type {?} */
-    AbstractPlaceNavigationComponent.prototype.places;
-    /** @type {?} */
-    AbstractPlaceNavigationComponent.prototype.placesModel;
-    /** @type {?} */
-    AbstractPlaceNavigationComponent.prototype.placeDefinitions;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-class ListPlaceNavComponent extends AbstractPlaceNavigationComponent {
-    constructor() {
-        super();
-        this.expanded = true;
-    }
-    /**
-     * @return {?}
-     */
-    expandMenu() {
-        this.expanded = true;
-    }
-    /**
-     * @return {?}
-     */
-    collapseMenu() {
-        this.expanded = false;
-    }
-    /**
-     * @return {?}
-     */
-    toggleMenu() {
-        this.expanded = !this.expanded;
+            v => this.parameterDef.type.format(v))) : [];
+        }
     }
-}
-ListPlaceNavComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'angular-ui-powerups-list-place-nav',
-                template: "<mat-nav-list class=\"app-menu\">\n  <a mat-list-item *ngFor=\"let place of placeDefinitions.value\"\n     [routerLink]='place.path'\n     routerLinkActive #rla=\"routerLinkActive\"\n     [matTooltip]=\"getNav(place).tooltip()\">\n    <mat-icon *ngIf=\"getNav(place).icon()\">{{getNav(place).icon()}}</mat-icon>\n    <span class=\"expanded-only\">{{getNav(place).title()}}</span>\n  </a>\n</mat-nav-list>\n",
-                styles: [":host{display:flex;flex-direction:column;--expanded-width:235px;--nav-item-width:var(--nav-bar-height);width:var(--nav-item-width);transition:width 125ms linear}:host.expanded{width:var(--expanded-width);max-width:var(--expanded-width)}.expanded-only{max-width:0;overflow:hidden}.collapsed-only{max-width:100%;overflow:hidden}.header{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;height:var(--nav-bar-height);border-bottom:var(--pinstripe-border);cursor:pointer}.header .menu{flex:1}.header button{color:inherit;width:var(--nav-item-width);height:var(--nav-bar-height)}mat-nav-list{flex:1;display:flex;flex-direction:column}.mat-list-item{width:var(--nav-item-width);height:var(--nav-bar-height);color:inherit}mat-icon{color:inherit}mat-icon.flip-horizontal{transform:scaleX(-1)}:host-context(.expanded) .expanded-only{max-width:100%}:host-context(.expanded) .collapsed-only{max-width:0}:host-context(.expanded) .mat-list-item mat-icon{margin-right:12px}:host-context(.expanded) .mat-list-item span{text-wrap:none;white-space:nowrap}a[ng-reflect-router-link=manage-instruments] mat-icon{transform:rotate(90deg)}.app-menu{padding-top:0}"]
-            }] }
-];
-/** @nocollapse */
-ListPlaceNavComponent.ctorParameters = () => [];
-ListPlaceNavComponent.propDecorators = {
-    expanded: [{ type: HostBinding, args: ['class.expanded',] }]
-};
-if (false) {
-    /** @type {?} */
-    ListPlaceNavComponent.prototype.expanded;
-}
+    ParameterSnapshot.ResolvedArrayParameter = ResolvedArrayParameter;
+})(ParameterSnapshot || (ParameterSnapshot = {}));
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-class PlaceService extends GarbageCollector {
+class PlaceRouter {
     /**
      * @param {?} router
-     * @param {?} injector
      */
-    constructor(router, injector) {
-        super();
+    constructor(router) {
         this.router = router;
-        this.injector = injector;
-        this._activePlaces = new MutableListModel();
-    }
-    /**
-     * @return {?}
-     */
-    get activePlaces() {
-        return this._activePlaces.readonly;
     }
-    // @Trace()
     /**
-     * @param {?} place
+     * @param {?} activatedRoute
+     * @param {?} previous
+     * @param {?} next
      * @return {?}
      */
-    onActivate(place) {
-        this._activePlaces.push(place);
+    pushParameterChangesToRoute(activatedRoute, previous, next) {
+        /** @type {?} */
+        const relativePath = !!previous.hasRouteId() ? '..' : '.';
+        this.router.navigate([relativePath].concat(this.createRouteParameters(next), this.getChildPath(activatedRoute.snapshot)), {
+            relativeTo: activatedRoute
+        });
     }
-    // @Trace()
     /**
-     * @param {?} place
+     * @param {?} activatedRoute
+     * @param {?} sanitised
      * @return {?}
      */
-    onDeactivate(place) {
-        this._activePlaces.remove(place);
+    getRedirectUrlTree(activatedRoute, sanitised) {
+        /** @type {?} */
+        const urlSegments = activatedRoute.url;
+        /** @type {?} */
+        const weHaveARouteId = sanitised.hasRouteId() && sanitised.getFormattedRouteId();
+        /** @type {?} */
+        const commands = (weHaveARouteId) ?
+            [urlSegments[0].path, sanitised.getFormattedRouteId(), sanitised.getFormattedParameters()] :
+            [urlSegments[0].path, sanitised.getFormattedParameters()];
+        console.log("redirect path", commands);
+        return this.router.createUrlTree(commands);
     }
-    // @Trace()
     /**
-     * @param {?} params
+     * @protected
+     * @param {?} activatedRoute
      * @return {?}
      */
-    notifyRouteParametersChanged(params) {
-        // We update the router state...
-        if (params.updateRoute) {
-            /** @type {?} */
-            const routeId = params.next.getFormattedRouteId();
-            /** @type {?} */
-            const relativePath = !!params.previous.hasRouteId() ? '..' : '.';
-            /** @type {?} */
-            const path = routeId ? [relativePath, routeId, params.next.getFormattedParameters()] : [relativePath, params.next.getFormattedParameters()];
-            this.router.navigate(path, {
-                relativeTo: params.activatedRoute
-            });
-        }
+    getChildPath(activatedRoute) {
+        return ___default.flatten(activatedRoute.children.map((/**
+         * @param {?} child
+         * @return {?}
+         */
+        child => child.url)));
     }
-    // @Trace()
     /**
-     * @param {?} snapshot
+     * @protected
+     * @param {?} parameters
      * @return {?}
      */
-    sanitise(snapshot) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return snapshot;
-        });
+    createRouteParameters(parameters) {
+        /** @type {?} */
+        const routeId = parameters.getFormattedRouteId();
+        return routeId ?
+            [routeId, parameters.getFormattedParameters()] :
+            [parameters.getFormattedParameters()];
     }
 }
-PlaceService.decorators = [
+PlaceRouter.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root'
             },] }
 ];
 /** @nocollapse */
-PlaceService.ctorParameters = () => [
-    { type: Router },
-    { type: Injector }
+PlaceRouter.ctorParameters = () => [
+    { type: Router }
 ];
-/** @nocollapse */ PlaceService.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceService_Factory() { return new PlaceService(ɵɵinject(Router), ɵɵinject(INJECTOR)); }, token: PlaceService, providedIn: "root" });
+/** @nocollapse */ PlaceRouter.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(ɵɵinject(Router)); }, token: PlaceRouter, providedIn: "root" });
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [ActivatedRouteSnapshot, ParameterSnapshot]),
+    __metadata("design:returntype", UrlTree)
+], PlaceRouter.prototype, "getRedirectUrlTree", null);
 if (false) {
     /**
      * @type {?}
      * @private
      */
-    PlaceService.prototype._activePlaces;
-    /**
-     * @type {?}
-     * @protected
-     */
-    PlaceService.prototype.router;
-    /**
-     * @type {?}
-     * @protected
-     */
-    PlaceService.prototype.injector;
+    PlaceRouter.prototype.router;
 }
 
 /**
@@ -2347,105 +2720,140 @@ function leftRightPlaceAnimation(duration) {
     ]);
 }
 /** @type {?} */
-const LEFT_RIGHT_PLACE_ANIMATION = leftRightPlaceAnimation("0.3s");
+const LEFT_RIGHT_PLACE_ANIMATION = leftRightPlaceAnimation('0.3s');
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+/**
+ * @record
+ */
+function PlaceRef() { }
+if (false) {
+    /** @type {?} */
+    PlaceRef.prototype.placeDefinition;
+    /**
+     * @param {?} param
+     * @return {?}
+     */
+    PlaceRef.prototype.initialiseBindings = function (param) { };
+    /**
+     * @return {?}
+     */
+    PlaceRef.prototype.onPlaceReady = function () { };
+}
 class PlaceOutletComponent extends DisposableComponent {
     /**
-     * @param {?} placeService
-     * @param {?} activatedRoute
+     * @param {?} router
+     * @param {?} placeHistory
      */
-    constructor(placeService, activatedRoute) {
+    constructor(router, placeHistory) {
         super();
-        this.placeService = placeService;
-        this.activatedRoute = activatedRoute;
+        this.router = router;
+        this.placeHistory = placeHistory;
         this.animate = true;
-        this.outletUrlSegment = new MutableListModel();
+        this._incomingRouteChange = new Guard();
+        this._inOutletUpdate = new Guard();
+        this._activatedRouteModel = new MutableValueModel();
+        this._placeDefinition = new MutableValueModel();
+        this._resolvedParameters = new MutableValueModel();
         const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        this.myPath = observe.listsFrom(activatedRoute.url).last().map((/**
-         * @param {?} s
-         * @return {?}
-         */
-        s => s.toString())).reduce((/**
-         * @param {?} bits
-         * @return {?}
-         */
-        bits => bits.join(',')));
-        console.log(`new outlet@(${this.myPath.value})`);
-        this.outletChildPath = chain(this.outletUrlSegment).map((/**
-         * @param {?} s
+        /** @type {?} */
+        const paramMap = chain(this._activatedRouteModel).pullObservableValue((/**
+         * @param {?} ar
          * @return {?}
          */
-        s => s.toString())).reduce((/**
-         * @param {?} bits
+        ar => ar.paramMap));
+        /** @type {?} */
+        const urls = chain(this._activatedRouteModel).pullObservableValue((/**
+         * @param {?} ar
          * @return {?}
          */
-        bits => bits.join(",")));
-        this.state = chain(this.myPath).map((/**
-         * @param {?} path
+        ar => ar.url));
+        this.placeConfigured = valueOf.all(chain(this._inOutletUpdate).isFalsey(), this._placeDefinition, paramMap, urls).areTruthy();
+        when.anyOf(paramMap, urls).changes((/**
          * @return {?}
          */
-        path => {
-            return `outlet@(${path}), child path->${this.outletChildPath.value}`;
-        }), { dependsOn: this.outletChildPath });
-        when.valueOf(this.state).changes((/**
-         * @param {?} debug
+        () => {
+            /** @type {?} */
+            const snapshot = ParameterSnapshot.create(this._placeDefinition.value, paramMap.value, urls.value);
+            this._incomingRouteChange.whileTrue((/**
+             * @return {?}
+             */
+            () => {
+                this._resolvedParameters.value = snapshot;
+                this.placeHistory.add(snapshot);
+            }));
+        }), {
+            postponeUntil: this.placeConfigured
+        });
+        when.valueOf(this._resolvedParameters).changes((/**
+         * @param {?} next
+         * @param {?} previous
          * @return {?}
          */
-        debug => {
-            console.log(`Outlet Changed -> ${debug}`);
-        }));
-    }
-    /**
-     * @return {?}
-     */
-    ngOnInit() {
+        (next, previous) => {
+            this.pushChangesToRoute(next, previous);
+            this.placeHistory.add(next); // the above route change doesn't seem to propagate back in, so I'm add the state to the history manually for now.
+        }), {
+            unless: this.incomingRouteChange
+        });
+        // const txo = new TransactionObserver().onEvent(e => console.log(e.toString()));
+        // txo.observe('paramMap', paramMap);
+        // txo.observe('urls', urls);
+        // txo.observe('this._resolvedParameters', this._resolvedParameters);
     }
     /**
      * @return {?}
      */
-    ngAfterViewInit() {
-        // this.routerOutLetQuery.changes.subscribe(() => {
-        //   this.updateRouterOutlet(this.routerOutLetQuery.first);
-        // });
+    get incomingRouteChange() {
+        return this._incomingRouteChange;
     }
     /**
      * @return {?}
      */
-    ngAfterViewChecked() {
-        // console.log(`@AfterViewChecked: ${this.state.value}`);
-        this.updateRouterOutlet(this.routerOutLetQuery.first);
+    ngOnInit() {
     }
-    // @Trace()
-    // ngOnDestroy(): void {
-    //   console.log('outletSegments', this.outletUrlSegment.value);
-    //   console.log('mySegments', this.myPath.value);
-    //   super.ngOnDestroy();
-    // }
-    // @Trace()
     /**
-     * @param {?} $event
+     * @param {?} routerOutlet
+     * @param {?} place
      * @return {?}
      */
-    onOutletActivated($event) {
-        // console.log(this.routerOutLet.activatedRoute.snapshot.url);
-        this.currentPlace = $event;
-        this.placeService.onActivate($event);
+    onOutletActivated(routerOutlet, place) {
+        this._inOutletUpdate.whileTrue((/**
+         * @return {?}
+         */
+        () => {
+            try {
+                this._currentPlace = place;
+                this._activatedRouteModel.value = routerOutlet.activatedRoute;
+                this._placeDefinition.value = place.placeDefinition;
+                place.initialiseBindings(this._resolvedParameters);
+            }
+            catch (error) {
+                console.error(error);
+            }
+        }));
         if (!this.animate) {
             // we're not animating so trigger any post animation callbacks now.
             this.animationDone();
         }
     }
     /**
+     * @param {?} routerOutlet
      * @param {?} $event
      * @return {?}
      */
-    onOutletDeactivated($event) {
-        this.currentPlace = null;
-        this.placeService.onDeactivate($event);
+    onOutletDeactivated(routerOutlet, $event) {
+        this._inOutletUpdate.whileTrue((/**
+         * @return {?}
+         */
+        () => {
+            this._currentPlace = null;
+            this._activatedRouteModel.value = null;
+            this._placeDefinition.value = null;
+        }));
     }
     /**
      * @param {?} outlet
@@ -2458,79 +2866,93 @@ class PlaceOutletComponent extends DisposableComponent {
      * @return {?}
      */
     animationDone() {
-        if (this.currentPlace) {
-            this.currentPlace.onPlaceReady();
+        if (this._currentPlace) {
+            this._currentPlace.onPlaceReady();
         }
     }
-    // @Trace()
     /**
-     * @private
-     * @param {?} first
+     * @param {?} next
+     * @param {?} previous
      * @return {?}
      */
-    updateRouterOutlet(first) {
-        if (first.isActivated) {
-            this.outletUrlSegment.value = first.activatedRoute.snapshot.url;
-        }
+    pushChangesToRoute(next, previous) {
+        /** @type {?} */
+        const activatedRoute = this._activatedRouteModel.value;
+        this.router.pushParameterChangesToRoute(activatedRoute, previous, next);
+    }
+    /**
+     * @param {?} snapshot
+     * @param {?} callback
+     * @return {?}
+     */
+    sanitise(snapshot, callback) {
+        return snapshot;
     }
 }
 PlaceOutletComponent.decorators = [
     { type: Component, args: [{
                 selector: 'angular-ui-powerups-place-outlet',
-                template: "<div class=\"router-outlet-container\"\n     [@routeAnimations]=\"getPlaceOrder(routerOutlet)\"\n     (@routeAnimations.done)=\"animationDone()\"\n>\n  <router-outlet #routerOutlet=\"outlet\"\n                 (activate)=\"onOutletActivated($event)\"\n                 (deactivate)=\"onOutletDeactivated($event)\">\n  </router-outlet>\n</div>\n\n",
+                template: "<div class=\"router-outlet-container\"\n     [@routeAnimations]=\"getPlaceOrder(routerOutlet)\"\n     (@routeAnimations.done)=\"animationDone()\"\n>\n  <router-outlet #routerOutlet=\"outlet\"\n                 (activate)=\"onOutletActivated(routerOutlet, $event)\"\n                 (deactivate)=\"onOutletDeactivated(routerOutlet, $event)\">\n  </router-outlet>\n</div>\n\n",
                 animations: [LEFT_RIGHT_PLACE_ANIMATION],
                 styles: [":host{display:flex;flex-direction:column;min-height:0}.router-outlet-container{flex:1;display:block;position:relative;min-height:0}router-outlet{display:none}"]
             }] }
 ];
 /** @nocollapse */
 PlaceOutletComponent.ctorParameters = () => [
-    { type: PlaceService },
-    { type: ActivatedRoute }
+    { type: PlaceRouter },
+    { type: PlaceHistory }
 ];
 PlaceOutletComponent.propDecorators = {
     animate: [{ type: Input }],
-    routerOutLetQuery: [{ type: ViewChildren, args: [RouterOutlet,] }]
+    routerOut: [{ type: ViewChild, args: ['routeOutlet', { static: true },] }]
 };
 if (false) {
     /** @type {?} */
     PlaceOutletComponent.prototype.animate;
     /** @type {?} */
-    PlaceOutletComponent.prototype.routerOutLetQuery;
+    PlaceOutletComponent.prototype.routerOut;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype._currentPlace;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.currentPlace;
+    PlaceOutletComponent.prototype._incomingRouteChange;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.myPath;
+    PlaceOutletComponent.prototype._inOutletUpdate;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.outletUrlSegment;
+    PlaceOutletComponent.prototype._activatedRouteModel;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.outletChildPath;
+    PlaceOutletComponent.prototype._placeDefinition;
+    /** @type {?} */
+    PlaceOutletComponent.prototype._resolvedParameters;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.state;
+    PlaceOutletComponent.prototype.placeConfigured;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.placeService;
+    PlaceOutletComponent.prototype.router;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.activatedRoute;
+    PlaceOutletComponent.prototype.placeHistory;
 }
 
 /**
@@ -2585,9 +3007,7 @@ PlaceModule.decorators = [
                     TabbedPlaceNavigationComponent,
                     ListPlaceNavComponent
                 ],
-                providers: [
-                    PlaceService
-                ]
+                providers: []
             },] }
 ];
 
@@ -2991,39 +3411,6 @@ if (false) {
     NavItem.prototype.tooltip = function () { };
 }
 
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- */
-function PlaceComponentLike() { }
-if (false) {
-    /** @type {?} */
-    PlaceComponentLike.prototype.activatedRoute;
-    /**
-     * @return {?}
-     */
-    PlaceComponentLike.prototype.onPlaceReady = function () { };
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- */
-function PlaceUpdatesService() { }
-if (false) {
-    /**
-     * @param {?} params
-     * @return {?}
-     */
-    PlaceUpdatesService.prototype.notifyRouteParametersChanged = function (params) { };
-}
-
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -3038,12 +3425,37 @@ function Place(options) {
      * @return {?}
      */
     (target) => {
-        if (!lang.constructorChain((/** @type {?} */ (target))).includes(PlaceComponent)) {
+        if (PlaceComponent.isPlaceComponentConstructor(target)) {
+            PlaceComponent.injectDefinition(target, new PlaceDefinition(target, options.path, isNil(options.authenticate) ? false : options.authenticate, options.order, options.data, PlaceComponent.getRouteParameters(target), (options.children || []).map((/**
+             * @param {?} c
+             * @return {?}
+             */
+            c => PlaceComponent.getDefinition(c)))));
+        }
+        else {
             lang.illegalState(`${target} must extend PlaceComponent to use the @Place decorator`);
         }
-        PlaceComponent.injectDefinition((/** @type {?} */ (target)), options);
     });
 }
+(function (Place) {
+    /**
+     * @record
+     */
+    function Options() { }
+    Place.Options = Options;
+    if (false) {
+        /** @type {?} */
+        Options.prototype.path;
+        /** @type {?} */
+        Options.prototype.order;
+        /** @type {?|undefined} */
+        Options.prototype.data;
+        /** @type {?|undefined} */
+        Options.prototype.authenticate;
+        /** @type {?|undefined} */
+        Options.prototype.children;
+    }
+})(Place || (Place = {}));
 
 /**
  * @fileoverview added by tsickle
@@ -3059,12 +3471,12 @@ if (false) {
     /**
      * @return {?}
      */
-    Visit.prototype.getRouteId = function () { };
+    Visit.prototype.getRouteIdValue = function () { };
     /**
      * @param {?} name
      * @return {?}
      */
-    Visit.prototype.getRouteParameter = function (name) { };
+    Visit.prototype.getParameterValue = function (name) { };
 }
 
 /**
@@ -3091,14 +3503,16 @@ class LeavePlaceGuard {
         // HACK: this will break with child routes...
         /** @type {?} */
         const path = `/${component.placeDefinition.path}`;
-        console.log({
-            placePath: path,
-            currentRoute: currentRoute.toString(),
-            currentStateUrl: currentState.url,
-            nextStateUrl: nextState.url,
-            currentStateUrlTree: this.router.parseUrl(currentState.url).root.children[PRIMARY_OUTLET].segments,
-            nextStateUrlTree: this.router.parseUrl(nextState.url).root.children[PRIMARY_OUTLET].segments
-        });
+        // let thisTree = this.router.parseUrl(currentState.url);
+        // let nextTree = this.router.parseUrl(nextState.url);
+        // console.log({
+        //   placePath: path,
+        //   currentRoute: currentRoute.toString(),
+        //   currentStateUrl: currentState.url,
+        //   nextStateUrl: nextState.url,
+        //   currentStateUrlTree: thisTree.root.children[PRIMARY_OUTLET].segments,
+        //   nextStateUrlTree: nextTree.root.children[PRIMARY_OUTLET].segments
+        // });
         // nextState is the full path...
         if (!nextState.url.startsWith(path)) {
             return component.canDeactivate();
@@ -3138,34 +3552,40 @@ if (false) {
  */
 class PlaceRouteGuard {
     /**
-     * @param {?} placeService
-     * @param {?} router
+     * @param {?} placeRouter
+     * @param {?} injector
      */
-    constructor(placeService, router) {
-        this.placeService = placeService;
-        this.router = router;
+    constructor(placeRouter, injector) {
+        this.placeRouter = placeRouter;
+        this.injector = injector;
     }
     /**
-     * @param {?} route
+     * @param {?} activatedRoute
      * @param {?} state
      * @return {?}
      */
-    canActivate(route, state) {
-        // Implement this when adding child routes.
-        // TODO: there are really two types of snapshot, ones with id's and ones without.
-        // Id snapshot are repesented by 2 url segments
-        // ID => [{'/basePath', params}, {'id', params}]
-        // NO ID => [{'/basePath', params}]
-        // console.log({urlSegments: route.url});
-        // const snapshot = ParameterSnapshot.create(PlaceComponent.getDefinition(route.component as Constructable<PlaceComponent>), route.paramMap);
-        // return this.placeService.sanitise(snapshot).then(sanitised => {
-        //   if (sanitised.hasChanged(snapshot)) {
-        //     return this.router.createUrlTree(snapshot.updateUrl(route.url))
-        //   } else {
-        //     return true;
-        //   }
-        // });
-        return true;
+    canActivate(activatedRoute, state) {
+        if (PlaceComponent.isPlaceComponentConstructor(activatedRoute.component)) {
+            /** @type {?} */
+            const placeDefinition = PlaceComponent.getDefinition(activatedRoute.component);
+            /** @type {?} */
+            const snapshot = ParameterSnapshot.create(placeDefinition, activatedRoute.paramMap, activatedRoute.url);
+            return snapshot.sanitise(this.injector).then((/**
+             * @param {?} sanitised
+             * @return {?}
+             */
+            sanitised => {
+                if (sanitised.hasChanged(snapshot, true)) {
+                    return this.placeRouter.getRedirectUrlTree(activatedRoute, sanitised);
+                }
+                else {
+                    return true;
+                }
+            }));
+        }
+        else {
+            return lang.illegalState(`expected component to be an instance of PlaceComponent, got ${activatedRoute.component}`);
+        }
     }
 }
 PlaceRouteGuard.decorators = [
@@ -3175,96 +3595,21 @@ PlaceRouteGuard.decorators = [
 ];
 /** @nocollapse */
 PlaceRouteGuard.ctorParameters = () => [
-    { type: PlaceService },
-    { type: Router }
+    { type: PlaceRouter },
+    { type: Injector }
 ];
-/** @nocollapse */ PlaceRouteGuard.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouteGuard_Factory() { return new PlaceRouteGuard(ɵɵinject(PlaceService), ɵɵinject(Router)); }, token: PlaceRouteGuard, providedIn: "root" });
-if (false) {
-    /**
-     * @type {?}
-     * @private
-     */
-    PlaceRouteGuard.prototype.placeService;
-    /**
-     * @type {?}
-     * @private
-     */
-    PlaceRouteGuard.prototype.router;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @template T, S
- */
-class DefaultParameterSanitiser {
-    /**
-     * @param {?} def
-     * @param {?} placeService
-     * @param {?} options
-     */
-    constructor(def, placeService, options) {
-        this.def = def;
-        this.placeService = placeService;
-        this.remember = isNil(options.remember) ? false : options.remember;
-        this.defaultValue = isNil(options.defaultValue) ? null : options.defaultValue;
-    }
-    /**
-     * @param {?} value
-     * @param {?} visit
-     * @return {?}
-     */
-    sanitise(value, visit) {
-        if (this.isBlank(value)) {
-            if (this.remember) {
-                // value = null;
-            }
-            return this.isBlank(value) && !isNil(this.defaultValue) ? this.defaultValue : value;
-        }
-        else {
-            return value;
-        }
-    }
-    /**
-     * @private
-     * @param {?} value
-     * @return {?}
-     */
-    isBlank(value) {
-        /** @type {?} */
-        const isNil$1 = isNil(value);
-        return this.def.isArray ? !isNil$1 || value['length'] < 1 : isNil$1;
-    }
-}
-__decorate([
-    Trace(),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, Object]),
-    __metadata("design:returntype", Object)
-], DefaultParameterSanitiser.prototype, "sanitise", null);
+/** @nocollapse */ PlaceRouteGuard.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouteGuard_Factory() { return new PlaceRouteGuard(ɵɵinject(PlaceRouter), ɵɵinject(INJECTOR)); }, token: PlaceRouteGuard, providedIn: "root" });
 if (false) {
     /**
      * @type {?}
      * @private
      */
-    DefaultParameterSanitiser.prototype.remember;
-    /**
-     * @type {?}
-     * @private
-     */
-    DefaultParameterSanitiser.prototype.defaultValue;
-    /**
-     * @type {?}
-     * @private
-     */
-    DefaultParameterSanitiser.prototype.def;
+    PlaceRouteGuard.prototype.placeRouter;
     /**
      * @type {?}
      * @private
      */
-    DefaultParameterSanitiser.prototype.placeService;
+    PlaceRouteGuard.prototype.injector;
 }
 
 /**
@@ -3298,8 +3643,6 @@ if (false) {
     ParameterOptions.prototype.remember;
     /** @type {?|undefined} */
     ParameterOptions.prototype.defaultValue;
-    /** @type {?|undefined} */
-    ParameterOptions.prototype.sanitiser;
 }
 /**
  * @record
@@ -3315,8 +3658,6 @@ if (false) {
     ListParameterOptions.prototype.remember;
     /** @type {?|undefined} */
     ListParameterOptions.prototype.defaultValue;
-    /** @type {?|undefined} */
-    ListParameterOptions.prototype.sanitiser;
 }
 /**
  * @template T
@@ -3325,7 +3666,6 @@ if (false) {
  * @return {?}
  */
 function RouteId(type, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3333,7 +3673,7 @@ function RouteId(type, options) {
      */
     (prototype, propertyKey) => {
         /** @type {?} */
-        const param = createDefinition(propertyKey, type, options, true);
+        const param = new ParameterDefinition.RouteId(propertyKey.toString(), type, options);
         Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
         UseDelegate()(prototype, propertyKey);
     });
@@ -3345,7 +3685,6 @@ function RouteId(type, options) {
  * @return {?}
  */
 function RouteParameter(type, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3353,7 +3692,7 @@ function RouteParameter(type, options) {
      */
     (prototype, propertyKey) => {
         /** @type {?} */
-        const param = createDefinition(propertyKey, type, options, false);
+        const param = new ParameterDefinition.ValueParameter(propertyKey.toString(), type, options);
         Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
         UseDelegate()(prototype, propertyKey);
     });
@@ -3365,7 +3704,6 @@ function RouteParameter(type, options) {
  * @return {?}
  */
 function RouteParameterList(elementType, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3373,82 +3711,11 @@ function RouteParameterList(elementType, options) {
      */
     (prototype, propertyKey) => {
         /** @type {?} */
-        const param = createArrayDefinition(propertyKey, elementType, options);
+        const param = new ParameterDefinition.ArrayParameter(propertyKey.toString(), elementType, options);
         Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
         UseDelegate()(prototype, propertyKey);
     });
 }
-/**
- * @template T
- * @param {?} propertyName
- * @param {?} type
- * @param {?} options
- * @param {?} routeId
- * @return {?}
- */
-function createDefinition(propertyName, type, options, routeId) {
-    /** @type {?} */
-    const opts = Opts.get(options);
-    /** @type {?} */
-    const propertyNameAsString = assert.notNil(propertyName).toString();
-    /** @type {?} */
-    const def = {
-        name: opts.getOptional('as', propertyNameAsString),
-        propertyName: propertyNameAsString,
-        type: assert.notNil(type),
-        sanitiser: opts.getOptional('sanitiser', null),
-        isRouteId: routeId,
-        isArray: false
-    };
-    return def;
-}
-/**
- * @template T
- * @param {?} propertyName
- * @param {?} type
- * @param {?} options
- * @return {?}
- */
-function createArrayDefinition(propertyName, type, options) {
-    /** @type {?} */
-    const opts = Opts.get(options);
-    /** @type {?} */
-    const propertyNameAsString = assert.notNil(propertyName).toString();
-    /** @type {?} */
-    const def = {
-        name: opts.getOptional('as', propertyNameAsString),
-        propertyName: propertyNameAsString,
-        type: assert.notNil(type),
-        sanitiser: opts.getOptional('sanitiser', null),
-        isRouteId: false,
-        isArray: true
-    };
-    return def;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- * @template T, S
- */
-function ParameterDefinition() { }
-if (false) {
-    /** @type {?} */
-    ParameterDefinition.prototype.name;
-    /** @type {?} */
-    ParameterDefinition.prototype.propertyName;
-    /** @type {?} */
-    ParameterDefinition.prototype.type;
-    /** @type {?} */
-    ParameterDefinition.prototype.sanitiser;
-    /** @type {?} */
-    ParameterDefinition.prototype.isRouteId;
-    /** @type {?} */
-    ParameterDefinition.prototype.isArray;
-}
 
 /**
  * @fileoverview added by tsickle
@@ -3456,31 +3723,18 @@ if (false) {
  */
 /**
  * @record
- * @template T
+ * @template S
  */
 function ParameterSanitiser() { }
 if (false) {
     /**
+     * @param {?} parameterDef
      * @param {?} value
      * @param {?=} visit
      * @return {?}
      */
-    ParameterSanitiser.prototype.sanitise = function (value, visit) { };
+    ParameterSanitiser.prototype.sanitise = function (parameterDef, value, visit) { };
 }
-(function (ParameterSanitiser) {
-    /**
-     * @record
-     * @template T
-     */
-    function Options() { }
-    ParameterSanitiser.Options = Options;
-    if (false) {
-        /** @type {?|undefined} */
-        Options.prototype.remember;
-        /** @type {?|undefined} */
-        Options.prototype.defaultValue;
-    }
-})(ParameterSanitiser || (ParameterSanitiser = {}));
 
 /**
  * @fileoverview added by tsickle
@@ -3518,7 +3772,7 @@ var ParameterType;
          * @return {?}
          */
         parse(value) {
-            return isNil(value) || isEmpty(value) ? null : +value;
+            return ___default.isNil(value) || ___default.isEmpty(value) ? null : +value;
         }
     }
     class BooleanType {
@@ -3570,7 +3824,7 @@ class Sanitiser {
      * @return {?}
      */
     get valueChanged() {
-        return !isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
+        return !___default.isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
     }
     /**
      * @return {?}
@@ -3609,7 +3863,7 @@ class Sanitiser {
         return __awaiter(this, void 0, void 0, function* () {
             if (this.sanitiser) {
                 this.initialValue = this.readFrom(this.snapshot);
-                this._sanitisedValue = yield this.sanitiser.sanitise(this.initialValue);
+                this._sanitisedValue = yield this.sanitiser.sanitise(null, this.initialValue);
                 if (this.initialValue !== this._sanitisedValue) {
                     return false;
                 }
@@ -3640,13 +3894,11 @@ class RouteParameterSanitiser {
     /**
      * @param {?} parameterDefs
      * @param {?} snapshot
-     * @param {?} placeService
      * @param {?} injector
      */
-    constructor(parameterDefs, snapshot, placeService, injector) {
+    constructor(parameterDefs, snapshot, injector) {
         this.parameterDefs = parameterDefs;
         this.snapshot = snapshot;
-        this.placeService = placeService;
         this.injector = injector;
         this.parameterSanitisers = [];
         /** @type {?} */
@@ -3700,17 +3952,7 @@ class RouteParameterSanitiser {
      * @return {?}
      */
     getSanitiser(def) {
-        if (def.sanitiser) {
-            if (this.isSanitiserContructor(def.sanitiser)) {
-                return this.injector.get(def.sanitiser, new def.sanitiser());
-            }
-            else {
-                return new DefaultParameterSanitiser(def, this.placeService, def.sanitiser);
-            }
-        }
-        else {
-            return null;
-        }
+        return def.getSanitiser(this.injector);
     }
     /**
      * @return {?}
@@ -3744,13 +3986,13 @@ class RouteParameterSanitiser {
      * @return {?}
      */
     isSanitiserContructor(value) {
-        return isFunction(value) && lang.constructorChain((/** @type {?} */ ((/** @type {?} */ (value))))).includes(Sanitiser);
+        return ___default.isFunction(value) && lang.constructorChain((/** @type {?} */ ((/** @type {?} */ (value))))).includes(Sanitiser);
     }
 }
 __decorate([
-    Memoize(),
+    Memoize$1(),
     __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
+    __metadata("design:paramtypes", [ParameterDefinition]),
     __metadata("design:returntype", Object)
 ], RouteParameterSanitiser.prototype, "getSanitiser", null);
 __decorate([
@@ -3775,8 +4017,6 @@ if (false) {
     /** @type {?} */
     RouteParameterSanitiser.prototype.snapshot;
     /** @type {?} */
-    RouteParameterSanitiser.prototype.placeService;
-    /** @type {?} */
     RouteParameterSanitiser.prototype.injector;
 }
 (function (Sanitiser) {
@@ -3872,5 +4112,5 @@ if (false) {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { ACTIVITY_DATA, AbstractActivity, AbstractInputComponent, AbstractPlaceNavigationComponent, ActivityContainerComponent, ActivityOutletComponent, AlertDialogComponent, AngularUiPowerupsModule, Bounds, BusyOverlayComponent, CommandDirective, ConfirmationDialogComponent, DEFINITION_META_DATA_KEY, DefaultParameterSanitiser, DialogInteractionService, Dimension, DisposableComponent, EmptyStateComponent, FocusBindingDirective, INTERACTION_CONTEXT, InteractionContext, InteractionModule, LEFT_RIGHT_PLACE_ANIMATION, LeavePlaceGuard, ListPlaceNavComponent, NumberInputComponent, ParameterSnapshot, ParameterType, PasswordInputComponent, Place, PlaceComponent, PlaceModule, PlaceOutletComponent, PlaceRouteGuard, PlaceService, Point, ROUTE_PARAMETER_LIST_KEY, ResizeAwareComponent, RouteId, RouteParameter, RouteParameterList, RouteParameterSanitiser, Sanitiser, SelectInputComponent, StringInputComponent, TabbedPlaceNavigationComponent, leftRightPlaceAnimation, slideDownAndUpAnimation, CommandDirective as ɵa, FocusBindingDirective as ɵb, DialogInteractionService as ɵbb, InteractionContext as ɵbc, DisposableComponent as ɵc, NumberInputComponent as ɵd, AbstractInputComponent as ɵe, StringInputComponent as ɵf, PasswordInputComponent as ɵg, SelectInputComponent as ɵh, PlaceModule as ɵi, EmptyStateComponent as ɵj, BusyOverlayComponent as ɵk, PlaceOutletComponent as ɵl, leftRightPlaceAnimation as ɵm, LEFT_RIGHT_PLACE_ANIMATION as ɵn, PlaceService as ɵo, TabbedPlaceNavigationComponent as ɵp, AbstractPlaceNavigationComponent as ɵq, ListPlaceNavComponent as ɵr, InteractionModule as ɵs, ActivityContainerComponent as ɵt, ActivityOutletComponent as ɵu, ConfirmationDialogComponent as ɵv, AbstractActivity as ɵw, ACTIVITY_DATA as ɵx, AlertDialogComponent as ɵz };
+export { ACTIVITY_DATA, AbstractActivity, AbstractInputComponent, AbstractPlaceNavigationComponent, ActivityContainerComponent, ActivityOutletComponent, AlertDialogComponent, AngularUiPowerupsModule, Bounds, BusyOverlayComponent, CommandDirective, ConfirmationDialogComponent, DEFINITION_META_DATA_KEY, DialogInteractionService, Dimension, DisposableComponent, EmptyStateComponent, FocusBindingDirective, INTERACTION_CONTEXT, InteractionContext, InteractionModule, LEFT_RIGHT_PLACE_ANIMATION, LeavePlaceGuard, ListPlaceNavComponent, NumberInputComponent, ParameterDefinition, ParameterSnapshot, ParameterType, PasswordInputComponent, Place, PlaceComponent, PlaceDefinition, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouteGuard, PlaceRouter, Point, ROUTE_PARAMETER_LIST_KEY, ResizeAwareComponent, RouteId, RouteParameter, RouteParameterList, RouteParameterSanitiser, Sanitiser, SelectInputComponent, StringInputComponent, TabbedPlaceNavigationComponent, leftRightPlaceAnimation, slideDownAndUpAnimation, CommandDirective as ɵa, FocusBindingDirective as ɵb, AlertDialogComponent as ɵba, DialogInteractionService as ɵbc, InteractionContext as ɵbd, DisposableComponent as ɵc, NumberInputComponent as ɵd, AbstractInputComponent as ɵe, StringInputComponent as ɵf, PasswordInputComponent as ɵg, SelectInputComponent as ɵh, PlaceModule as ɵi, EmptyStateComponent as ɵj, BusyOverlayComponent as ɵk, PlaceOutletComponent as ɵl, leftRightPlaceAnimation as ɵm, LEFT_RIGHT_PLACE_ANIMATION as ɵn, PlaceRouter as ɵo, PlaceHistory as ɵp, TabbedPlaceNavigationComponent as ɵq, AbstractPlaceNavigationComponent as ɵr, ListPlaceNavComponent as ɵs, InteractionModule as ɵt, ActivityContainerComponent as ɵu, ActivityOutletComponent as ɵv, ConfirmationDialogComponent as ɵw, AbstractActivity as ɵx, ACTIVITY_DATA as ɵy };
 //# sourceMappingURL=coolon-angular-ui-powerups.js.map