@coolon/angular-ui-powerups 0.0.43 → 0.0.44

package/fesm5/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 { __extends, __decorate, __metadata, __assign, __awaiter, __generator, __values } 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, 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';
 
@@ -634,7 +634,7 @@ var FocusBindingDirective = /** @class */ (function (_super) {
             }));
         }
         else {
-            Logger.get(this).warn("pectinFocusBinding was nil");
+            Logger.get(this).warn('pectinFocusBinding was nil');
         }
     };
     /**
@@ -864,6 +864,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
  */
 var ActivityOutletComponent = /** @class */ (function () {
@@ -1317,7 +1322,7 @@ var ConfirmationDialogComponent = /** @class */ (function (_super) {
     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}"]
                 }] }
     ];
@@ -1459,7 +1464,7 @@ var ActivityContainerComponent = /** @class */ (function (_super) {
     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}"]
                 }] }
     ];
@@ -1758,1040 +1763,1100 @@ var EmptyStateComponent = /** @class */ (function () {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-// 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}]
-var ParameterSnapshot = /** @class */ (function () {
-    function ParameterSnapshot(placeDefinition, resolved) {
-        this.placeDefinition = placeDefinition;
-        this.resolved = resolved;
+var PlaceDefinition = /** @class */ (function () {
+    function PlaceDefinition(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;
     }
     /**
-     * @param {?} other
      * @return {?}
      */
-    ParameterSnapshot.prototype.hasChanged = /**
-     * @param {?} other
+    PlaceDefinition.prototype.getRouteParameters = /**
      * @return {?}
      */
-    function (other) {
-        /** @type {?} */
-        var changed = this.resolved.find((/**
-         * @param {?} r
-         * @return {?}
-         */
-        function (r) {
-            return !r.isSame(other.getResolvedParameterValue(r.parameterDef));
-        }));
-        if (changed) {
-            console.log({ mine: changed, theirs: other.getResolvedParameter(changed.parameterDef) });
-        }
-        return !!changed;
+    function () {
+        return this.routeParameters;
     };
     /**
-     * @param {?} other
+     * @template T
+     * @param {?} key
+     * @param {?=} defaultValue
      * @return {?}
      */
-    ParameterSnapshot.prototype.asUrlSegment = /**
-     * @param {?} other
+    PlaceDefinition.prototype.getData = /**
+     * @template T
+     * @param {?} key
+     * @param {?=} defaultValue
      * @return {?}
      */
-    function (other) {
-        assert.isTruthy(this.hasChanged(other));
-        /** @type {?} */
-        var routeParts = [];
-        /** @type {?} */
-        var gainedId = this.getFormattedRouteId() && !other.getFormattedRouteId();
-        /** @type {?} */
-        var sameId = this.getFormattedRouteId() === other.getFormattedRouteId();
-        /** @type {?} */
-        var lostId = (!this.getFormattedRouteId() && other.getFormattedRouteId());
-        /** @type {?} */
-        var changedId = (this.getFormattedRouteId() !== other.getFormattedRouteId());
-        if (lostId || changedId) {
-            routeParts.push('..');
-            if (changedId) {
-                routeParts.push(this.getFormattedRouteId());
-            }
+    function (key, defaultValue) {
+        return this.data ?
+            ___default.isNil(this.data[key]) ? defaultValue : this.data[key] :
+            defaultValue;
+    };
+    /**
+     * @template T
+     * @param {?} keys
+     * @param {?=} defaultValue
+     * @return {?}
+     */
+    PlaceDefinition.prototype.searchData = /**
+     * @template T
+     * @param {?} keys
+     * @param {?=} defaultValue
+     * @return {?}
+     */
+    function (keys, defaultValue) {
+        var _this = this;
+        if (this.data) {
+            /** @type {?} */
+            var found = keys.find((/**
+             * @param {?} key
+             * @return {?}
+             */
+            function (key) { return !___default.isNil(_this.data[key]); }));
+            return found ? this.data[found] : defaultValue;
         }
         else {
-            routeParts.push('.');
+            return defaultValue;
         }
-        routeParts.push(this.getFormattedParameters());
-        return routeParts;
     };
+    return PlaceDefinition;
+}());
+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 {?} */
+var DEFINITION_META_DATA_KEY = 'PLACE_DEFINITION_OPTIONS';
+// this one seems ok.
+/** @type {?} */
+var ROUTE_PARAMETER_LIST_KEY = Symbol('place:route:parameters');
+var PlaceComponent = /** @class */ (function (_super) {
+    __extends(PlaceComponent, _super);
+    function PlaceComponent() {
+        return _super.call(this) || this;
+    }
     /**
-     * @template T, S
-     * @param {?} parameterDef
+     * @param {?} resolvedParameters
      * @return {?}
      */
-    ParameterSnapshot.prototype.getResolvedParameter = /**
-     * @template T, S
-     * @param {?} parameterDef
+    PlaceComponent.prototype.initialiseBindings = /**
+     * @param {?} resolvedParameters
      * @return {?}
      */
-    function (parameterDef) {
-        return this.resolved.find((/**
-         * @param {?} r
+    function (resolvedParameters) {
+        var _this = this;
+        assert.isNil(this.resolvedParameters);
+        this.resolvedParameters = resolvedParameters;
+        this.placeDefinition.getRouteParameters().forEach((/**
+         * @param {?} parameterDef
          * @return {?}
          */
-        function (r) { return r.parameterDef === parameterDef; }));
+        function (parameterDef) {
+            _this.installBinding(parameterDef);
+        }));
     };
     /**
+     * @private
      * @template T, S
      * @param {?} parameterDef
      * @return {?}
      */
-    ParameterSnapshot.prototype.getResolvedParameterValue = /**
+    PlaceComponent.prototype.installBinding = /**
+     * @private
      * @template T, S
      * @param {?} parameterDef
      * @return {?}
      */
     function (parameterDef) {
         /** @type {?} */
-        var resolvedParameter = this.getResolvedParameter(parameterDef);
-        return resolvedParameter ? resolvedParameter.value : null;
+        var model = (/** @type {?} */ (this[parameterDef.propertyName]));
+        // this.txo.observe(parameterDef.propertyName, model);
+        this.registerDisposable(new Binding(this.resolvedParameters, model, {
+            toRight: /**
+             * @param {?} parameters
+             * @return {?}
+             */
+            function (parameters) {
+                return parameters.getResolvedParameterValue(parameterDef);
+            },
+            toLeft: /**
+             * @param {?} value
+             * @param {?=} currentParameters
+             * @return {?}
+             */
+            function (value, currentParameters) {
+                return currentParameters.replace(parameterDef, value);
+            }
+        }));
     };
+    Object.defineProperty(PlaceComponent.prototype, "placeDefinition", {
+        get: /**
+         * @return {?}
+         */
+        function () {
+            return PlaceComponent.getDefinition((/** @type {?} */ ((/** @type {?} */ (this.constructor)))));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(PlaceComponent.prototype, "childPlaces", {
+        get: /**
+         * @return {?}
+         */
+        function () {
+            return this.placeDefinition.children.map((/**
+             * @param {?} d
+             * @return {?}
+             */
+            function (d) { return d.component; }));
+        },
+        enumerable: true,
+        configurable: true
+    });
     /**
      * @return {?}
      */
-    ParameterSnapshot.prototype.getRouteId = /**
+    PlaceComponent.prototype.canDeactivate = /**
      * @return {?}
      */
     function () {
-        return this.getResolvedRouteId() ? this.getResolvedRouteId().value : null;
+        return true;
     };
     /**
-     * @param {?} name
      * @return {?}
      */
-    ParameterSnapshot.prototype.getRouteParameter = /**
-     * @param {?} name
+    PlaceComponent.prototype.onPlaceReady = /**
      * @return {?}
      */
-    function (name) {
-        /** @type {?} */
-        var resolvedParameter = this.resolved.find((/**
-         * @param {?} r
-         * @return {?}
-         */
-        function (r) { return r.parameterDef.name === name; }));
-        return resolvedParameter ? resolvedParameter.value : null;
+    function () {
     };
+    __decorate([
+        Memoize(),
+        __metadata("design:type", PlaceDefinition),
+        __metadata("design:paramtypes", [])
+    ], PlaceComponent.prototype, "placeDefinition", null);
+    return PlaceComponent;
+}(DisposableComponent));
+if (false) {
     /**
+     * @type {?}
      * @private
-     * @return {?}
-     */
-    ParameterSnapshot.prototype.getResolvedRouteId = /**
-     * @private
-     * @return {?}
      */
-    function () {
-        // 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((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) { return p.parameterDef.isRouteId; }))));
-    };
+    PlaceComponent.prototype.resolvedParameters;
+}
+(function (PlaceComponent) {
     /**
+     * @param {?} target
      * @return {?}
      */
-    ParameterSnapshot.prototype.hasRouteId = /**
+    function isPlaceComponentConstructor(target) {
+        return lang.constructorChain((/** @type {?} */ (target))).includes(PlaceComponent);
+    }
+    PlaceComponent.isPlaceComponentConstructor = isPlaceComponentConstructor;
+    /**
+     * @param {?} klass
      * @return {?}
      */
-    function () {
-        return !!this.getResolvedRouteId();
-    };
+    function getRouteParameters(klass) {
+        return Klass.get(klass).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
+    }
+    PlaceComponent.getRouteParameters = getRouteParameters;
     /**
+     * @param {?} klass
      * @return {?}
      */
-    ParameterSnapshot.prototype.getFormattedRouteId = /**
+    function getDefinition(klass) {
+        return Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
+    }
+    PlaceComponent.getDefinition = getDefinition;
+    /**
+     * @param {?} klass
+     * @param {?} definition
      * @return {?}
      */
-    function () {
-        /** @type {?} */
-        var routeIdParam = this.getResolvedRouteId();
-        return routeIdParam ? routeIdParam.formattedValue() : null;
-    };
+    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
+ */
+var AbstractPlaceNavigationComponent = /** @class */ (function (_super) {
+    __extends(AbstractPlaceNavigationComponent, _super);
+    function AbstractPlaceNavigationComponent() {
+        var _this = _super.call(this) || this;
+        var _a = Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
+        _this.placeDefinitions = chain(_this.placesModel).map((/**
+         * @param {?} c
+         * @return {?}
+         */
+        function (c) { return PlaceComponent.getDefinition(c); }));
+        return _this;
+    }
     /**
+     * @param {?} placeDef
      * @return {?}
      */
-    ParameterSnapshot.prototype.getFormattedParameters = /**
+    AbstractPlaceNavigationComponent.prototype.getNav = /**
+     * @param {?} placeDef
      * @return {?}
      */
-    function () {
-        /** @type {?} */
-        var params = {};
+    function (placeDef) {
         /** @type {?} */
-        var routeIdParam = this.resolved.filter((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) { return !p.parameterDef.isRouteId; })).forEach((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) {
-            params[p.parameterDef.name] = p.formattedValue();
-        }));
-        return params;
+        var navItem = (/** @type {?} */ (placeDef.getData('nav')));
+        return {
+            title: (/**
+             * @return {?}
+             */
+            function () { return navItem ? navItem.title() : placeDef.searchData(['navTitle', 'title']); }),
+            tooltip: (/**
+             * @return {?}
+             */
+            function () { return navItem && navItem.tooltip ? navItem.tooltip() : placeDef.getData('navTooltip', null); }),
+            icon: (/**
+             * @return {?}
+             */
+            function () { return navItem && navItem.icon ? navItem.icon() : placeDef.getData('navIcon', null); })
+        };
     };
     /**
-     * @template T, S
-     * @param {?} parameter
-     * @param {?} value
      * @return {?}
      */
-    ParameterSnapshot.prototype.replace = /**
-     * @template T, S
-     * @param {?} parameter
-     * @param {?} value
+    AbstractPlaceNavigationComponent.prototype.ngOnInit = /**
      * @return {?}
      */
-    function (parameter, value) {
-        return new ParameterSnapshot(this.placeDefinition, this.resolved.map((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) {
-            return p.parameterDef === parameter ? p.replace(value) : p;
-        })));
+    function () {
     };
-    /**
-     * @param {?} url
-     * @return {?}
-     */
-    ParameterSnapshot.prototype.updateUrl = /**
-     * @param {?} url
-     * @return {?}
-     */
-    function (url) {
-        return url;
+    AbstractPlaceNavigationComponent.propDecorators = {
+        places: [{ type: Input }],
+        placesModel: [{ type: Input }]
     };
-    var _a;
     __decorate([
-        Memoize(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Object]),
-        __metadata("design:returntype", ParameterSnapshot.ResolvedParameter)
-    ], ParameterSnapshot.prototype, "getResolvedParameter", null);
+        StoreInListModel('placesModel'),
+        __metadata("design:type", Array)
+    ], AbstractPlaceNavigationComponent.prototype, "places", void 0);
     __decorate([
-        Memoize(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Object]),
-        __metadata("design:returntype", typeof (_a = typeof S !== "undefined" && S) === "function" ? _a : Object)
-    ], ParameterSnapshot.prototype, "getResolvedParameterValue", null);
+        UseDelegate(),
+        __metadata("design:type", ListModel)
+    ], AbstractPlaceNavigationComponent.prototype, "placesModel", void 0);
     __decorate([
-        Memoize(),
+        Memoize$1(),
         __metadata("design:type", Function),
-        __metadata("design:paramtypes", [String]),
+        __metadata("design:paramtypes", [PlaceDefinition]),
         __metadata("design:returntype", Object)
-    ], ParameterSnapshot.prototype, "getRouteParameter", null);
-    __decorate([
-        Memoize(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", []),
-        __metadata("design:returntype", ParameterSnapshot.ResolvedValueParameter)
-    ], ParameterSnapshot.prototype, "getResolvedRouteId", null);
-    return ParameterSnapshot;
-}());
+    ], AbstractPlaceNavigationComponent.prototype, "getNav", null);
+    return AbstractPlaceNavigationComponent;
+}(DisposableComponent));
 if (false) {
     /** @type {?} */
-    ParameterSnapshot.prototype.placeDefinition;
+    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
+ */
+var ListPlaceNavComponent = /** @class */ (function (_super) {
+    __extends(ListPlaceNavComponent, _super);
+    function ListPlaceNavComponent() {
+        var _this = _super.call(this) || this;
+        _this.expanded = true;
+        return _this;
+    }
     /**
-     * @type {?}
-     * @private
+     * @return {?}
      */
-    ParameterSnapshot.prototype.resolved;
+    ListPlaceNavComponent.prototype.expandMenu = /**
+     * @return {?}
+     */
+    function () {
+        this.expanded = true;
+    };
+    /**
+     * @return {?}
+     */
+    ListPlaceNavComponent.prototype.collapseMenu = /**
+     * @return {?}
+     */
+    function () {
+        this.expanded = false;
+    };
+    /**
+     * @return {?}
+     */
+    ListPlaceNavComponent.prototype.toggleMenu = /**
+     * @return {?}
+     */
+    function () {
+        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 = function () { return []; };
+    ListPlaceNavComponent.propDecorators = {
+        expanded: [{ type: HostBinding, args: ['class.expanded',] }]
+    };
+    return ListPlaceNavComponent;
+}(AbstractPlaceNavigationComponent));
+if (false) {
+    /** @type {?} */
+    ListPlaceNavComponent.prototype.expanded;
 }
-(function (ParameterSnapshot) {
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var PlaceHistory = /** @class */ (function () {
+    function PlaceHistory(router) {
+        this.router = router;
+        this._history = [];
+    }
     /**
-     * @param {?} placeDef
-     * @param {?} paramMap
+     * @param {?} state
      * @return {?}
      */
-    function create(placeDef, paramMap) {
+    PlaceHistory.prototype.add = /**
+     * @param {?} state
+     * @return {?}
+     */
+    function (state) {
         /** @type {?} */
-        var resolvedParameters = placeDef.getRouteParameters()
-            .map((/**
-         * @param {?} def
-         * @return {?}
-         */
-        function (def) {
-            if (def.isArray) {
-                /** @type {?} */
-                var value = paramMap.has(def.name) ? paramMap.getAll(def.name).map((/**
-                 * @param {?} raw
-                 * @return {?}
-                 */
-                function (raw) { return def.type.parse(raw); })) : null;
-                return new ResolvedArrayParameter(def, value);
-            }
-            else {
-                /** @type {?} */
-                var value = paramMap.has(def.name) ? def.type.parse(paramMap.get(def.name)) : null;
-                return new ResolvedValueParameter(def, value);
-            }
-        }));
-        return new ParameterSnapshot(placeDef, resolvedParameters);
+        var previousState = ___default.last(this._history);
+        if (!previousState || state.hasChanged(previousState)) {
+            this._history.push(state);
+            // limit our history to 100 visits
+            this._history = this._history.slice(-100);
+        }
+    };
+    PlaceHistory.decorators = [
+        { type: Injectable, args: [{
+                    providedIn: 'root'
+                },] }
+    ];
+    /** @nocollapse */
+    PlaceHistory.ctorParameters = function () { return [
+        { type: Router }
+    ]; };
+    /** @nocollapse */ PlaceHistory.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceHistory_Factory() { return new PlaceHistory(ɵɵinject(Router)); }, token: PlaceHistory, providedIn: "root" });
+    return PlaceHistory;
+}());
+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
+ */
+var PlaceRouter = /** @class */ (function () {
+    function PlaceRouter(router) {
+        this.router = router;
     }
-    ParameterSnapshot.create = create;
     /**
-     * @abstract
-     * @template T, S
+     * @param {?} activatedRoute
+     * @param {?} previous
+     * @param {?} next
+     * @return {?}
      */
-    var /**
-     * @abstract
-     * @template T, S
+    PlaceRouter.prototype.pushParameterChangesToRoute = /**
+     * @param {?} activatedRoute
+     * @param {?} previous
+     * @param {?} next
+     * @return {?}
      */
-    ResolvedParameter = /** @class */ (function () {
-        function ResolvedParameter(parameterDef, value) {
-            this.parameterDef = parameterDef;
-            this.value = value;
-        }
-        /**
-         * @return {?}
-         */
-        ResolvedParameter.prototype.isRouteId = /**
+    function (activatedRoute, previous, next) {
+        this.router.navigate(this.redirect(activatedRoute.snapshot, previous, next), {
+            relativeTo: activatedRoute
+        });
+    };
+    /**
+     * @param {?} activatedRoute
+     * @param {?} sanitised
+     * @param {?} snapshot
+     * @return {?}
+     */
+    PlaceRouter.prototype.createUrlTree = /**
+     * @param {?} activatedRoute
+     * @param {?} sanitised
+     * @param {?} snapshot
+     * @return {?}
+     */
+    function (activatedRoute, sanitised, snapshot) {
+        return this.router.createUrlTree(this.redirect(activatedRoute, snapshot, sanitised));
+    };
+    /**
+     * @protected
+     * @param {?} activatedRoute
+     * @param {?} previous
+     * @param {?} next
+     * @return {?}
+     */
+    PlaceRouter.prototype.redirect = /**
+     * @protected
+     * @param {?} activatedRoute
+     * @param {?} previous
+     * @param {?} next
+     * @return {?}
+     */
+    function (activatedRoute, previous, next) {
+        /** @type {?} */
+        var childSegments = ___default.flatten(activatedRoute.children.map((/**
+         * @param {?} child
          * @return {?}
          */
-        function () {
-            return this.parameterDef.isRouteId;
-        };
-        return ResolvedParameter;
-    }());
-    ParameterSnapshot.ResolvedParameter = ResolvedParameter;
-    if (false) {
+        function (child) { return child.url; })));
         /** @type {?} */
-        ResolvedParameter.prototype.parameterDef;
+        var relativePath = !!previous.hasRouteId() ? '..' : '.';
         /** @type {?} */
-        ResolvedParameter.prototype.value;
-        /**
-         * @abstract
-         * @param {?} dest
-         * @return {?}
-         */
-        ResolvedParameter.prototype.injectRouteParam = function (dest) { };
-        /**
-         * @abstract
-         * @param {?} otherValue
-         * @return {?}
-         */
-        ResolvedParameter.prototype.isSame = function (otherValue) { };
-        /**
-         * @abstract
-         * @return {?}
-         */
-        ResolvedParameter.prototype.formattedValue = function () { };
-        /**
-         * @abstract
-         * @param {?} value
+        var routeId = next.getFormattedRouteId();
+        /** @type {?} */
+        var path = routeId ?
+            [relativePath, routeId, next.getFormattedParameters()] :
+            [relativePath, next.getFormattedParameters()];
+        return path.concat(childSegments.map((/**
+         * @param {?} s
          * @return {?}
          */
-        ResolvedParameter.prototype.replace = function (value) { };
-    }
+        function (s) { return s.path; })));
+    };
+    PlaceRouter.decorators = [
+        { type: Injectable, args: [{
+                    providedIn: 'root'
+                },] }
+    ];
+    /** @nocollapse */
+    PlaceRouter.ctorParameters = function () { return [
+        { type: Router }
+    ]; };
+    /** @nocollapse */ PlaceRouter.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(ɵɵinject(Router)); }, token: PlaceRouter, providedIn: "root" });
+    return PlaceRouter;
+}());
+if (false) {
     /**
-     * @template T
+     * @type {?}
+     * @private
      */
-    var ResolvedValueParameter = /** @class */ (function (_super) {
-        __extends(ResolvedValueParameter, _super);
-        function ResolvedValueParameter() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        /**
-         * @param {?} otherValue
-         * @return {?}
-         */
-        ResolvedValueParameter.prototype.isSame = /**
-         * @param {?} otherValue
-         * @return {?}
-         */
-        function (otherValue) {
-            return this.value === otherValue;
-        };
-        /**
-         * @param {?} dest
-         * @return {?}
-         */
-        ResolvedValueParameter.prototype.injectRouteParam = /**
-         * @param {?} dest
-         * @return {?}
-         */
-        function (dest) {
-            dest[this.parameterDef.name] = this.parameterDef.type.format(this.value);
-        };
-        /**
-         * @param {?} value
-         * @return {?}
-         */
-        ResolvedValueParameter.prototype.replace = /**
-         * @param {?} value
-         * @return {?}
-         */
-        function (value) {
-            return new ResolvedValueParameter(this.parameterDef, value);
-        };
-        /**
-         * @return {?}
-         */
-        ResolvedValueParameter.prototype.formattedValue = /**
-         * @return {?}
-         */
-        function () {
-            return !isNil(this.value) ? this.parameterDef.type.format(this.value) : null;
-        };
-        __decorate([
-            Trace(),
-            __metadata("design:type", Function),
-            __metadata("design:paramtypes", [Object]),
-            __metadata("design:returntype", Boolean)
-        ], ResolvedValueParameter.prototype, "isSame", null);
-        return ResolvedValueParameter;
-    }(ResolvedParameter));
-    ParameterSnapshot.ResolvedValueParameter = ResolvedValueParameter;
+    PlaceRouter.prototype.router;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @abstract
+ * @template T, S
+ */
+var  /**
+ * @abstract
+ * @template T, S
+ */
+ParameterDefinition = /** @class */ (function () {
+    function ParameterDefinition(propertyName, type, options) {
+        this.propertyName = propertyName;
+        this.type = type;
+        /** @type {?} */
+        var opts = Opts.get(options);
+        this.name = opts.getOptional('as', propertyName);
+        // this.sanitiser = new DefaultParameterSanitiser(
+        //   this,
+        //   opts.getOptional('remember', false),
+        //   opts.getOptional('defaultValue', null)
+        // );
+    }
+    /**
+     * @param {?} injector
+     * @return {?}
+     */
+    ParameterDefinition.prototype.getSanitiser = /**
+     * @param {?} injector
+     * @return {?}
+     */
+    function (injector) {
+        return this.sanitiser;
+    };
+    return ParameterDefinition;
+}());
+if (false) {
+    /** @type {?} */
+    ParameterDefinition.prototype.isRouteId;
+    /** @type {?} */
+    ParameterDefinition.prototype.isArray;
+    /** @type {?} */
+    ParameterDefinition.prototype.name;
+    /** @type {?} */
+    ParameterDefinition.prototype.sanitiser;
+    /** @type {?} */
+    ParameterDefinition.prototype.propertyName;
+    /** @type {?} */
+    ParameterDefinition.prototype.type;
+}
+(function (ParameterDefinition) {
     /**
+     * @record
      * @template T
      */
-    var ResolvedArrayParameter = /** @class */ (function (_super) {
-        __extends(ResolvedArrayParameter, _super);
-        function ResolvedArrayParameter() {
-            return _super !== null && _super.apply(this, arguments) || this;
+    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
+     */
+    var /**
+     * @template T
+     */
+    RouteId = /** @class */ (function (_super) {
+        __extends(RouteId, _super);
+        function RouteId() {
+            var _this = _super !== null && _super.apply(this, arguments) || this;
+            _this.isRouteId = true;
+            _this.isArray = false;
+            return _this;
         }
-        /**
-         * @param {?} otherValue
-         * @return {?}
-         */
-        ResolvedArrayParameter.prototype.isSame = /**
-         * @param {?} otherValue
-         * @return {?}
-         */
-        function (otherValue) {
-            return isEqual(this.value, otherValue);
-        };
-        /**
-         * @param {?} dest
-         * @return {?}
-         */
-        ResolvedArrayParameter.prototype.injectRouteParam = /**
-         * @param {?} dest
-         * @return {?}
-         */
-        function (dest) {
-            var _this = this;
-            dest[this.parameterDef.name] = this.value.map((/**
-             * @param {?} v
-             * @return {?}
-             */
-            function (v) { return _this.parameterDef.type.format(v); }));
-        };
-        /**
-         * @param {?} value
-         * @return {?}
-         */
-        ResolvedArrayParameter.prototype.replace = /**
-         * @param {?} value
-         * @return {?}
-         */
-        function (value) {
-            return new ResolvedArrayParameter(this.parameterDef, value);
-        };
-        /**
-         * @return {?}
-         */
-        ResolvedArrayParameter.prototype.formattedValue = /**
-         * @return {?}
-         */
-        function () {
-            var _this = this;
-            return this.value ? this.value.map((/**
-             * @param {?} v
-             * @return {?}
-             */
-            function (v) { return _this.parameterDef.type.format(v); })) : [];
-        };
-        __decorate([
-            Trace(),
-            __metadata("design:type", Function),
-            __metadata("design:paramtypes", [Array]),
-            __metadata("design:returntype", Boolean)
-        ], ResolvedArrayParameter.prototype, "isSame", null);
-        return ResolvedArrayParameter;
-    }(ResolvedParameter));
-    ParameterSnapshot.ResolvedArrayParameter = ResolvedArrayParameter;
-})(ParameterSnapshot || (ParameterSnapshot = {}));
+        return RouteId;
+    }(ParameterDefinition));
+    ParameterDefinition.RouteId = RouteId;
+    if (false) {
+        /** @type {?} */
+        RouteId.prototype.isRouteId;
+        /** @type {?} */
+        RouteId.prototype.isArray;
+    }
+    /**
+     * @template T
+     */
+    var /**
+     * @template T
+     */
+    ValueParameter = /** @class */ (function (_super) {
+        __extends(ValueParameter, _super);
+        function ValueParameter() {
+            var _this = _super !== null && _super.apply(this, arguments) || this;
+            _this.isRouteId = false;
+            _this.isArray = false;
+            return _this;
+        }
+        return ValueParameter;
+    }(ParameterDefinition));
+    ParameterDefinition.ValueParameter = ValueParameter;
+    if (false) {
+        /** @type {?} */
+        ValueParameter.prototype.isRouteId;
+        /** @type {?} */
+        ValueParameter.prototype.isArray;
+    }
+    /**
+     * @template T
+     */
+    var /**
+     * @template T
+     */
+    ArrayParameter = /** @class */ (function (_super) {
+        __extends(ArrayParameter, _super);
+        function ArrayParameter() {
+            var _this = _super !== null && _super.apply(this, arguments) || this;
+            _this.isRouteId = false;
+            _this.isArray = true;
+            return _this;
+        }
+        return ArrayParameter;
+    }(ParameterDefinition));
+    ParameterDefinition.ArrayParameter = ArrayParameter;
+    if (false) {
+        /** @type {?} */
+        ArrayParameter.prototype.isRouteId;
+        /** @type {?} */
+        ArrayParameter.prototype.isArray;
+    }
+})(ParameterDefinition || (ParameterDefinition = {}));
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-// RAKE: making this Symbol(...) broke things.
-/** @type {?} */
-var DEFINITION_META_DATA_KEY = 'PLACE_DEFINITION_OPTIONS';
-// this one seems ok.
-/** @type {?} */
-var ROUTE_PARAMETER_LIST_KEY = Symbol('place:route:parameters');
-var PlaceComponent = /** @class */ (function (_super) {
-    __extends(PlaceComponent, _super);
-    function PlaceComponent(activatedRoute, placeService) {
-        var _this = _super.call(this) || this;
-        _this.activatedRoute = activatedRoute;
-        _this._incomingRouteChange = new MutableValueModel(false);
-        _this.resolvedParameters = new MutableValueModel();
-        var _a = Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
-        _this.placeDefinition.getRouteParameters().forEach((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) { return _this.installBinding(p); }));
-        observe.valuesFrom(activatedRoute.paramMap)
-            .last()
-            .map((/**
-         * @param {?} params
-         * @return {?}
-         */
-        function (params) { return ParameterSnapshot.create(_this.placeDefinition, params); }))
-            .subscribe((/**
-         * @param {?} resolvedParameters
-         * @return {?}
-         */
-        function (resolvedParameters) {
-            _this._incomingRouteChange.value = true;
-            _this.resolvedParameters.value = resolvedParameters;
-            _this._incomingRouteChange.value = false;
-        }));
-        when.valueOf(_this.resolvedParameters).changes((/**
-         * @param {?} params
-         * @param {?} previous
+var ParameterSnapshot = /** @class */ (function () {
+    function ParameterSnapshot(placeDefinition, resolved) {
+        this.placeDefinition = placeDefinition;
+        this.resolved = resolved;
+    }
+    /**
+     * @param {?} other
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.hasChanged = /**
+     * @param {?} other
+     * @return {?}
+     */
+    function (other) {
+        /** @type {?} */
+        var changed = this.resolved.find((/**
+         * @param {?} r
          * @return {?}
          */
-        function (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.
-            });
+        function (r) {
+            return !r.isSame(other.getResolvedParameterValue(r.parameterDef));
         }));
-        return _this;
-    }
-    Object.defineProperty(PlaceComponent.prototype, "incomingRouteChange", {
-        get: /**
+        // if (changed) {
+        //   console.log({ mine: changed, theirs: other.getResolvedParameter(changed.parameterDef) });
+        // }
+        return !!changed;
+    };
+    /**
+     * @template T, S
+     * @param {?} parameterDef
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.getResolvedParameter = /**
+     * @template T, S
+     * @param {?} parameterDef
+     * @return {?}
+     */
+    function (parameterDef) {
+        return this.resolved.find((/**
+         * @param {?} r
          * @return {?}
          */
-        function () {
-            return this._incomingRouteChange.readonly;
-        },
-        enumerable: true,
-        configurable: true
-    });
+        function (r) { return r.parameterDef === parameterDef; }));
+    };
     /**
-     * @private
      * @template T, S
      * @param {?} parameterDef
      * @return {?}
      */
-    PlaceComponent.prototype.installBinding = /**
-     * @private
+    ParameterSnapshot.prototype.getResolvedParameterValue = /**
      * @template T, S
      * @param {?} parameterDef
      * @return {?}
      */
     function (parameterDef) {
         /** @type {?} */
-        var model = (/** @type {?} */ (this[parameterDef.propertyName]));
-        // this.txo.observe(parameterDef.propertyName, model);
-        this.registerDisposable(new Binding(this.resolvedParameters, model, {
-            toRight: /**
-             * @param {?} parameters
-             * @return {?}
-             */
-            function (parameters) {
-                return parameters.getResolvedParameterValue(parameterDef);
-            },
-            toLeft: /**
-             * @param {?} value
-             * @param {?=} currentParameters
-             * @return {?}
-             */
-            function (value, currentParameters) {
-                return currentParameters.replace(parameterDef, value);
-            }
-        }));
+        var resolvedParameter = this.getResolvedParameter(parameterDef);
+        return resolvedParameter ? resolvedParameter.value : null;
     };
-    Object.defineProperty(PlaceComponent.prototype, "placeDefinition", {
-        get: /**
+    /**
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.getRouteId = /**
+     * @return {?}
+     */
+    function () {
+        return this.getResolvedRouteId() ? this.getResolvedRouteId().value : null;
+    };
+    /**
+     * @param {?} name
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.getRouteParameter = /**
+     * @param {?} name
+     * @return {?}
+     */
+    function (name) {
+        /** @type {?} */
+        var resolvedParameter = this.resolved.find((/**
+         * @param {?} r
          * @return {?}
          */
-        function () {
-            return PlaceComponent.getDefinition((/** @type {?} */ ((/** @type {?} */ (this.constructor)))));
-        },
-        enumerable: true,
-        configurable: true
-    });
+        function (r) { return r.parameterDef.name === name; }));
+        return resolvedParameter ? resolvedParameter.value : null;
+    };
     /**
+     * @private
      * @return {?}
      */
-    PlaceComponent.prototype.canDeactivate = /**
+    ParameterSnapshot.prototype.getResolvedRouteId = /**
+     * @private
      * @return {?}
      */
     function () {
-        return true;
+        // 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((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) { return p.parameterDef.isRouteId; }))));
+    };
+    /**
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.hasRouteId = /**
+     * @return {?}
+     */
+    function () {
+        return !!this.getResolvedRouteId();
     };
-    // @Trace()
-    // @Trace()
     /**
      * @return {?}
      */
-    PlaceComponent.prototype.onPlaceReady = 
-    // @Trace()
+    ParameterSnapshot.prototype.getFormattedRouteId = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var routeIdParam = this.getResolvedRouteId();
+        return routeIdParam ? routeIdParam.formattedValue() : null;
+    };
     /**
      * @return {?}
      */
+    ParameterSnapshot.prototype.getFormattedParameters = /**
+     * @return {?}
+     */
     function () {
+        /** @type {?} */
+        var params = {};
+        /** @type {?} */
+        var routeIdParam = this.resolved.filter((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) { return !p.parameterDef.isRouteId; })).forEach((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) {
+            params[p.parameterDef.name] = p.formattedValue();
+        }));
+        return params;
+    };
+    /**
+     * @template T, S
+     * @param {?} parameter
+     * @param {?} value
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.replace = /**
+     * @template T, S
+     * @param {?} parameter
+     * @param {?} value
+     * @return {?}
+     */
+    function (parameter, value) {
+        return new ParameterSnapshot(this.placeDefinition, this.resolved.map((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) {
+            return p.parameterDef === parameter ? p.replace(value) : p;
+        })));
+    };
+    /**
+     * @param {?} injector
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.sanitise = /**
+     * @param {?} injector
+     * @return {?}
+     */
+    function (injector) {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                return [2 /*return*/, this];
+            });
+        });
     };
+    var _a;
     __decorate([
         Memoize$1(),
-        __metadata("design:type", PlaceComponent.Definition),
-        __metadata("design:paramtypes", [])
-    ], PlaceComponent.prototype, "placeDefinition", null);
-    return PlaceComponent;
-}(DisposableComponent));
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [ParameterDefinition]),
+        __metadata("design:returntype", ParameterSnapshot.ResolvedParameter)
+    ], ParameterSnapshot.prototype, "getResolvedParameter", null);
+    __decorate([
+        Memoize$1(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [ParameterDefinition]),
+        __metadata("design:returntype", typeof (_a = typeof S !== "undefined" && S) === "function" ? _a : Object)
+    ], ParameterSnapshot.prototype, "getResolvedParameterValue", null);
+    __decorate([
+        Memoize$1(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [String]),
+        __metadata("design:returntype", Object)
+    ], ParameterSnapshot.prototype, "getRouteParameter", null);
+    __decorate([
+        Memoize$1(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", ParameterSnapshot.ResolvedValueParameter)
+    ], ParameterSnapshot.prototype, "getResolvedRouteId", null);
+    return ParameterSnapshot;
+}());
 if (false) {
     /** @type {?} */
-    PlaceComponent.prototype._incomingRouteChange;
+    ParameterSnapshot.prototype.placeDefinition;
     /**
      * @type {?}
      * @private
      */
-    PlaceComponent.prototype.resolvedParameters;
-    /** @type {?} */
-    PlaceComponent.prototype.activatedRoute;
+    ParameterSnapshot.prototype.resolved;
 }
-(function (PlaceComponent) {
-    var Definition = /** @class */ (function () {
-        function Definition(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 {?}
-             */
-            function (c) { return PlaceComponent.getDefinition(c).component; }));
+(function (ParameterSnapshot) {
+    /**
+     * @param {?} placeDef
+     * @param {?} paramMap
+     * @return {?}
+     */
+    function create(placeDef, paramMap) {
+        /** @type {?} */
+        var resolvedParameters = placeDef.getRouteParameters()
+            .map((/**
+         * @param {?} def
+         * @return {?}
+         */
+        function (def) {
+            if (def.isArray) {
+                /** @type {?} */
+                var value = paramMap.has(def.name) ? paramMap.getAll(def.name).map((/**
+                 * @param {?} raw
+                 * @return {?}
+                 */
+                function (raw) { return def.type.parse(raw); })) : null;
+                return new ResolvedArrayParameter(def, value);
+            }
+            else {
+                /** @type {?} */
+                var value = paramMap.has(def.name) ? def.type.parse(paramMap.get(def.name)) : null;
+                return new ResolvedValueParameter(def, value);
+            }
+        }));
+        return new ParameterSnapshot(placeDef, resolvedParameters);
+    }
+    ParameterSnapshot.create = create;
+    /**
+     * @abstract
+     * @template T, S
+     */
+    var /**
+     * @abstract
+     * @template T, S
+     */
+    ResolvedParameter = /** @class */ (function () {
+        function ResolvedParameter(parameterDef, value) {
+            this.parameterDef = parameterDef;
+            this.value = value;
         }
         /**
          * @return {?}
          */
-        Definition.prototype.getRouteParameters = /**
+        ResolvedParameter.prototype.isRouteId = /**
          * @return {?}
          */
         function () {
-            return Klass.get(this.component).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
+            return this.parameterDef.isRouteId;
         };
+        return ResolvedParameter;
+    }());
+    ParameterSnapshot.ResolvedParameter = ResolvedParameter;
+    if (false) {
+        /** @type {?} */
+        ResolvedParameter.prototype.parameterDef;
+        /** @type {?} */
+        ResolvedParameter.prototype.value;
         /**
-         * @param {?} constructable
+         * @abstract
+         * @param {?} dest
          * @return {?}
          */
-        Definition.prototype.isDescriptorForType = /**
-         * @param {?} constructable
+        ResolvedParameter.prototype.injectRouteParam = function (dest) { };
+        /**
+         * @abstract
+         * @param {?} otherValue
          * @return {?}
          */
-        function (constructable) {
-            return lang.constructorChain(constructable).includes(PlaceComponent);
-        };
+        ResolvedParameter.prototype.isSame = function (otherValue) { };
         /**
-         * @param {?} placeComponent
+         * @abstract
          * @return {?}
          */
-        Definition.prototype.isDescriptorFor = /**
-         * @param {?} placeComponent
+        ResolvedParameter.prototype.formattedValue = function () { };
+        /**
+         * @abstract
+         * @param {?} value
          * @return {?}
          */
-        function (placeComponent) {
-            return placeComponent.constructor === this.component;
-        };
+        ResolvedParameter.prototype.replace = function (value) { };
+    }
+    /**
+     * @template T
+     */
+    var /**
+     * @template T
+     */
+    ResolvedValueParameter = /** @class */ (function (_super) {
+        __extends(ResolvedValueParameter, _super);
+        function ResolvedValueParameter() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
         /**
-         * @template T
-         * @param {?} key
-         * @param {?=} defaultValue
+         * @param {?} otherValue
          * @return {?}
          */
-        Definition.prototype.getData = /**
-         * @template T
-         * @param {?} key
-         * @param {?=} defaultValue
+        ResolvedValueParameter.prototype.isSame = /**
+         * @param {?} otherValue
          * @return {?}
          */
-        function (key, defaultValue) {
-            return this.data ?
-                isNil(this.data[key]) ? defaultValue : this.data[key] :
-                defaultValue;
+        function (otherValue) {
+            return this.value === otherValue;
         };
         /**
-         * @template T
-         * @param {?} keys
-         * @param {?=} defaultValue
+         * @param {?} dest
          * @return {?}
          */
-        Definition.prototype.searchData = /**
-         * @template T
-         * @param {?} keys
-         * @param {?=} defaultValue
+        ResolvedValueParameter.prototype.injectRouteParam = /**
+         * @param {?} dest
          * @return {?}
          */
-        function (keys, defaultValue) {
-            var _this = this;
-            if (this.data) {
-                /** @type {?} */
-                var found = keys.find((/**
-                 * @param {?} key
-                 * @return {?}
-                 */
-                function (key) { return !isNil(_this.data[key]); }));
-                return found ? this.data[found] : defaultValue;
-            }
-            else {
-                return defaultValue;
-            }
+        function (dest) {
+            dest[this.parameterDef.name] = this.parameterDef.type.format(this.value);
         };
-        __decorate([
-            Memoize$1(),
-            __metadata("design:type", Function),
-            __metadata("design:paramtypes", []),
-            __metadata("design:returntype", Array)
-        ], Definition.prototype, "getRouteParameters", null);
-        return Definition;
-    }());
-    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;
-    /**
-     * @param {?} klass
-     * @param {?} options
-     * @return {?}
-     */
-    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
- */
-var AbstractPlaceNavigationComponent = /** @class */ (function (_super) {
-    __extends(AbstractPlaceNavigationComponent, _super);
-    function AbstractPlaceNavigationComponent() {
-        var _this = _super.call(this) || this;
-        var _a = Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
-        _this.placeDefinitions = chain(_this.placesModel).map((/**
-         * @param {?} c
+        /**
+         * @param {?} value
          * @return {?}
          */
-        function (c) { return PlaceComponent.getDefinition(c); }));
-        return _this;
-    }
+        ResolvedValueParameter.prototype.replace = /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) {
+            return new ResolvedValueParameter(this.parameterDef, value);
+        };
+        /**
+         * @return {?}
+         */
+        ResolvedValueParameter.prototype.formattedValue = /**
+         * @return {?}
+         */
+        function () {
+            return !___default.isNil(this.value) ? this.parameterDef.type.format(this.value) : null;
+        };
+        return ResolvedValueParameter;
+    }(ResolvedParameter));
+    ParameterSnapshot.ResolvedValueParameter = ResolvedValueParameter;
     /**
-     * @param {?} placeDef
-     * @return {?}
+     * @template T
      */
-    AbstractPlaceNavigationComponent.prototype.getNav = /**
-     * @param {?} placeDef
-     * @return {?}
+    var /**
+     * @template T
      */
-    function (placeDef) {
-        /** @type {?} */
-        var navItem = (/** @type {?} */ (placeDef.getData('nav')));
-        return {
-            title: (/**
-             * @return {?}
-             */
-            function () { return navItem ? navItem.title() : placeDef.searchData(['navTitle', 'title']); }),
-            tooltip: (/**
-             * @return {?}
-             */
-            function () { return navItem && navItem.tooltip ? navItem.tooltip() : placeDef.getData('navTooltip', null); }),
-            icon: (/**
+    ResolvedArrayParameter = /** @class */ (function (_super) {
+        __extends(ResolvedArrayParameter, _super);
+        function ResolvedArrayParameter() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        /**
+         * @param {?} otherValue
+         * @return {?}
+         */
+        ResolvedArrayParameter.prototype.isSame = /**
+         * @param {?} otherValue
+         * @return {?}
+         */
+        function (otherValue) {
+            return ___default.isEqual(this.value, otherValue);
+        };
+        /**
+         * @param {?} dest
+         * @return {?}
+         */
+        ResolvedArrayParameter.prototype.injectRouteParam = /**
+         * @param {?} dest
+         * @return {?}
+         */
+        function (dest) {
+            var _this = this;
+            dest[this.parameterDef.name] = this.value.map((/**
+             * @param {?} v
              * @return {?}
              */
-            function () { return navItem && navItem.icon ? navItem.icon() : placeDef.getData('navIcon', null); })
+            function (v) { return _this.parameterDef.type.format(v); }));
         };
-    };
-    /**
-     * @return {?}
-     */
-    AbstractPlaceNavigationComponent.prototype.ngOnInit = /**
-     * @return {?}
-     */
-    function () {
-    };
-    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);
-    return AbstractPlaceNavigationComponent;
-}(DisposableComponent));
-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
- */
-var ListPlaceNavComponent = /** @class */ (function (_super) {
-    __extends(ListPlaceNavComponent, _super);
-    function ListPlaceNavComponent() {
-        var _this = _super.call(this) || this;
-        _this.expanded = true;
-        return _this;
-    }
-    /**
-     * @return {?}
-     */
-    ListPlaceNavComponent.prototype.expandMenu = /**
-     * @return {?}
-     */
-    function () {
-        this.expanded = true;
-    };
-    /**
-     * @return {?}
-     */
-    ListPlaceNavComponent.prototype.collapseMenu = /**
-     * @return {?}
-     */
-    function () {
-        this.expanded = false;
-    };
-    /**
-     * @return {?}
-     */
-    ListPlaceNavComponent.prototype.toggleMenu = /**
-     * @return {?}
-     */
-    function () {
-        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 = function () { return []; };
-    ListPlaceNavComponent.propDecorators = {
-        expanded: [{ type: HostBinding, args: ['class.expanded',] }]
-    };
-    return ListPlaceNavComponent;
-}(AbstractPlaceNavigationComponent));
-if (false) {
-    /** @type {?} */
-    ListPlaceNavComponent.prototype.expanded;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var PlaceService = /** @class */ (function (_super) {
-    __extends(PlaceService, _super);
-    function PlaceService(router, injector) {
-        var _this = _super.call(this) || this;
-        _this.router = router;
-        _this.injector = injector;
-        _this._activePlaces = new MutableListModel();
-        return _this;
-    }
-    Object.defineProperty(PlaceService.prototype, "activePlaces", {
-        get: /**
+        /**
+         * @param {?} value
+         * @return {?}
+         */
+        ResolvedArrayParameter.prototype.replace = /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) {
+            return new ResolvedArrayParameter(this.parameterDef, value);
+        };
+        /**
+         * @return {?}
+         */
+        ResolvedArrayParameter.prototype.formattedValue = /**
          * @return {?}
          */
         function () {
-            return this._activePlaces.readonly;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    // @Trace()
-    // @Trace()
-    /**
-     * @param {?} place
-     * @return {?}
-     */
-    PlaceService.prototype.onActivate = 
-    // @Trace()
-    /**
-     * @param {?} place
-     * @return {?}
-     */
-    function (place) {
-        this._activePlaces.push(place);
-    };
-    // @Trace()
-    // @Trace()
-    /**
-     * @param {?} place
-     * @return {?}
-     */
-    PlaceService.prototype.onDeactivate = 
-    // @Trace()
-    /**
-     * @param {?} place
-     * @return {?}
-     */
-    function (place) {
-        this._activePlaces.remove(place);
-    };
-    // @Trace()
-    // @Trace()
-    /**
-     * @param {?} params
-     * @return {?}
-     */
-    PlaceService.prototype.notifyRouteParametersChanged = 
-    // @Trace()
-    /**
-     * @param {?} params
-     * @return {?}
-     */
-    function (params) {
-        // We update the router state...
-        if (params.updateRoute) {
-            /** @type {?} */
-            var routeId = params.next.getFormattedRouteId();
-            /** @type {?} */
-            var relativePath = !!params.previous.hasRouteId() ? '..' : '.';
-            /** @type {?} */
-            var path = routeId ? [relativePath, routeId, params.next.getFormattedParameters()] : [relativePath, params.next.getFormattedParameters()];
-            this.router.navigate(path, {
-                relativeTo: params.activatedRoute
-            });
-        }
-    };
-    // @Trace()
-    // @Trace()
-    /**
-     * @param {?} snapshot
-     * @return {?}
-     */
-    PlaceService.prototype.sanitise = 
-    // @Trace()
-    /**
-     * @param {?} snapshot
-     * @return {?}
-     */
-    function (snapshot) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                return [2 /*return*/, snapshot];
-            });
-        });
-    };
-    PlaceService.decorators = [
-        { type: Injectable, args: [{
-                    providedIn: 'root'
-                },] }
-    ];
-    /** @nocollapse */
-    PlaceService.ctorParameters = function () { return [
-        { type: Router },
-        { type: Injector }
-    ]; };
-    /** @nocollapse */ PlaceService.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceService_Factory() { return new PlaceService(ɵɵinject(Router), ɵɵinject(INJECTOR)); }, token: PlaceService, providedIn: "root" });
-    return PlaceService;
-}(GarbageCollector));
-if (false) {
-    /**
-     * @type {?}
-     * @private
-     */
-    PlaceService.prototype._activePlaces;
-    /**
-     * @type {?}
-     * @protected
-     */
-    PlaceService.prototype.router;
-    /**
-     * @type {?}
-     * @protected
-     */
-    PlaceService.prototype.injector;
-}
+            var _this = this;
+            return this.value ? this.value.map((/**
+             * @param {?} v
+             * @return {?}
+             */
+            function (v) { return _this.parameterDef.type.format(v); })) : [];
+        };
+        return ResolvedArrayParameter;
+    }(ResolvedParameter));
+    ParameterSnapshot.ResolvedArrayParameter = ResolvedArrayParameter;
+})(ParameterSnapshot || (ParameterSnapshot = {}));
 
 /**
  * @fileoverview added by tsickle
@@ -2844,56 +2909,88 @@ function leftRightPlaceAnimation(duration) {
     ]);
 }
 /** @type {?} */
-var LEFT_RIGHT_PLACE_ANIMATION = leftRightPlaceAnimation("0.3s");
+var 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 () { };
+}
 var PlaceOutletComponent = /** @class */ (function (_super) {
     __extends(PlaceOutletComponent, _super);
-    function PlaceOutletComponent(placeService, activatedRoute) {
+    function PlaceOutletComponent(router, placeHistory) {
         var _this = _super.call(this) || this;
-        _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();
         var _a = Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
-        _this.myPath = observe.listsFrom(activatedRoute.url).last().map((/**
-         * @param {?} s
-         * @return {?}
-         */
-        function (s) { return s.toString(); })).reduce((/**
-         * @param {?} bits
-         * @return {?}
-         */
-        function (bits) { return bits.join(','); }));
-        console.log("new outlet@(" + _this.myPath.value + ")");
-        _this.outletChildPath = chain(_this.outletUrlSegment).map((/**
-         * @param {?} s
+        _this._paramMap = chain(_this._activatedRouteModel).pullObservableValue((/**
+         * @param {?} ar
          * @return {?}
          */
-        function (s) { return s.toString(); })).reduce((/**
-         * @param {?} bits
-         * @return {?}
-         */
-        function (bits) { return bits.join(","); }));
-        _this.state = chain(_this.myPath).map((/**
-         * @param {?} path
+        function (ar) { return ar.paramMap; }));
+        _this.placeConfigured = valueOf.all(chain(_this._inOutletUpdate).isFalsey(), _this._placeDefinition, _this._paramMap).areTruthy();
+        when.valueOf(_this._paramMap).changes((/**
+         * @param {?} params
          * @return {?}
          */
-        function (path) {
-            return "outlet@(" + path + "), child path->" + _this.outletChildPath.value;
-        }), { dependsOn: _this.outletChildPath });
-        when.valueOf(_this.state).changes((/**
-         * @param {?} debug
+        function (params) {
+            /** @type {?} */
+            var snapshot = ParameterSnapshot.create(_this._placeDefinition.value, params);
+            _this._incomingRouteChange.whileTrue((/**
+             * @return {?}
+             */
+            function () {
+                _this._resolvedParameters.value = snapshot;
+                _this.placeHistory.add(snapshot);
+            }));
+        }), {
+            postponeUntil: _this.placeConfigured
+        });
+        when.valueOf(_this._resolvedParameters).changes((/**
+         * @param {?} next
+         * @param {?} previous
          * @return {?}
          */
-        function (debug) {
-            console.log("Outlet Changed -> " + debug);
-        }));
+        function (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
+        });
         return _this;
     }
+    Object.defineProperty(PlaceOutletComponent.prototype, "incomingRouteChange", {
+        get: /**
+         * @return {?}
+         */
+        function () {
+            return this._incomingRouteChange;
+        },
+        enumerable: true,
+        configurable: true
+    });
     /**
      * @return {?}
      */
@@ -2903,76 +3000,56 @@ var PlaceOutletComponent = /** @class */ (function (_super) {
     function () {
     };
     /**
+     * @param {?} routerOutlet
+     * @param {?} place
      * @return {?}
      */
-    PlaceOutletComponent.prototype.ngAfterViewInit = /**
-     * @return {?}
-     */
-    function () {
-        // this.routerOutLetQuery.changes.subscribe(() => {
-        //   this.updateRouterOutlet(this.routerOutLetQuery.first);
-        // });
-    };
-    /**
-     * @return {?}
-     */
-    PlaceOutletComponent.prototype.ngAfterViewChecked = /**
-     * @return {?}
-     */
-    function () {
-        // console.log(`@AfterViewChecked: ${this.state.value}`);
-        this.updateRouterOutlet(this.routerOutLetQuery.first);
-    };
-    // @Trace()
-    // ngOnDestroy(): void {
-    //   console.log('outletSegments', this.outletUrlSegment.value);
-    //   console.log('mySegments', this.myPath.value);
-    //   super.ngOnDestroy();
-    // }
-    // @Trace()
-    // @Trace()
-    // ngOnDestroy(): void {
-    //   console.log('outletSegments', this.outletUrlSegment.value);
-    //   console.log('mySegments', this.myPath.value);
-    //   super.ngOnDestroy();
-    // }
-    // @Trace()
-    /**
-     * @param {?} $event
-     * @return {?}
-     */
-    PlaceOutletComponent.prototype.onOutletActivated = 
-    // @Trace()
-    // ngOnDestroy(): void {
-    //   console.log('outletSegments', this.outletUrlSegment.value);
-    //   console.log('mySegments', this.myPath.value);
-    //   super.ngOnDestroy();
-    // }
-    // @Trace()
-    /**
-     * @param {?} $event
+    PlaceOutletComponent.prototype.onOutletActivated = /**
+     * @param {?} routerOutlet
+     * @param {?} place
      * @return {?}
      */
-    function ($event) {
-        // console.log(this.routerOutLet.activatedRoute.snapshot.url);
-        this.currentPlace = $event;
-        this.placeService.onActivate($event);
+    function (routerOutlet, place) {
+        var _this = this;
+        this._inOutletUpdate.whileTrue((/**
+         * @return {?}
+         */
+        function () {
+            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 {?}
      */
     PlaceOutletComponent.prototype.onOutletDeactivated = /**
+     * @param {?} routerOutlet
      * @param {?} $event
      * @return {?}
      */
-    function ($event) {
-        this.currentPlace = null;
-        this.placeService.onDeactivate($event);
+    function (routerOutlet, $event) {
+        var _this = this;
+        this._inOutletUpdate.whileTrue((/**
+         * @return {?}
+         */
+        function () {
+            _this._currentPlace = null;
+            _this._activatedRouteModel.value = null;
+            _this._placeDefinition.value = null;
+        }));
     };
     /**
      * @param {?} outlet
@@ -2992,45 +3069,54 @@ var PlaceOutletComponent = /** @class */ (function (_super) {
      * @return {?}
      */
     function () {
-        if (this.currentPlace) {
-            this.currentPlace.onPlaceReady();
+        if (this._currentPlace) {
+            this._currentPlace.onPlaceReady();
         }
     };
-    // @Trace()
-    // @Trace()
     /**
-     * @private
-     * @param {?} first
+     * @param {?} next
+     * @param {?} previous
+     * @return {?}
+     */
+    PlaceOutletComponent.prototype.pushChangesToRoute = /**
+     * @param {?} next
+     * @param {?} previous
      * @return {?}
      */
-    PlaceOutletComponent.prototype.updateRouterOutlet = 
-    // @Trace()
+    function (next, previous) {
+        /** @type {?} */
+        var activatedRoute = this._activatedRouteModel.value;
+        this.router.pushParameterChangesToRoute(activatedRoute, previous, next);
+    };
     /**
-     * @private
-     * @param {?} first
+     * @param {?} snapshot
+     * @param {?} callback
      * @return {?}
      */
-    function (first) {
-        if (first.isActivated) {
-            this.outletUrlSegment.value = first.activatedRoute.snapshot.url;
-        }
+    PlaceOutletComponent.prototype.sanitise = /**
+     * @param {?} snapshot
+     * @param {?} callback
+     * @return {?}
+     */
+    function (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 = function () { return [
-        { 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 },] }]
     };
     return PlaceOutletComponent;
 }(DisposableComponent));
@@ -3038,42 +3124,54 @@ if (false) {
     /** @type {?} */
     PlaceOutletComponent.prototype.animate;
     /** @type {?} */
-    PlaceOutletComponent.prototype.routerOutLetQuery;
+    PlaceOutletComponent.prototype.routerOut;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype._currentPlace;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype._incomingRouteChange;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.currentPlace;
+    PlaceOutletComponent.prototype._inOutletUpdate;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.myPath;
+    PlaceOutletComponent.prototype._activatedRouteModel;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.outletUrlSegment;
+    PlaceOutletComponent.prototype._placeDefinition;
     /**
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.outletChildPath;
+    PlaceOutletComponent.prototype._paramMap;
+    /** @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;
 }
 
 /**
@@ -3131,9 +3229,7 @@ var PlaceModule = /** @class */ (function () {
                         TabbedPlaceNavigationComponent,
                         ListPlaceNavComponent
                     ],
-                    providers: [
-                        PlaceService
-                    ]
+                    providers: []
                 },] }
     ];
     return PlaceModule;
@@ -3572,39 +3668,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
@@ -3619,12 +3682,37 @@ function Place(options) {
      * @return {?}
      */
     function (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 {?}
+             */
+            function (c) { return 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
@@ -3675,14 +3763,16 @@ var LeavePlaceGuard = /** @class */ (function () {
         // HACK: this will break with child routes...
         /** @type {?} */
         var 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();
@@ -3722,36 +3812,43 @@ if (false) {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var PlaceRouteGuard = /** @class */ (function () {
-    function PlaceRouteGuard(placeService, router) {
-        this.placeService = placeService;
-        this.router = router;
+    function PlaceRouteGuard(placeRouter, injector) {
+        this.placeRouter = placeRouter;
+        this.injector = injector;
     }
     /**
-     * @param {?} route
+     * @param {?} activatedRoute
      * @param {?} state
      * @return {?}
      */
     PlaceRouteGuard.prototype.canActivate = /**
-     * @param {?} route
+     * @param {?} activatedRoute
      * @param {?} state
      * @return {?}
      */
-    function (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;
+    function (activatedRoute, state) {
+        var _this = this;
+        if (PlaceComponent.isPlaceComponentConstructor(activatedRoute.component)) {
+            /** @type {?} */
+            var placeDefinition = PlaceComponent.getDefinition(activatedRoute.component);
+            /** @type {?} */
+            var snapshot_1 = ParameterSnapshot.create(placeDefinition, activatedRoute.paramMap);
+            return snapshot_1.sanitise(this.injector).then((/**
+             * @param {?} sanitised
+             * @return {?}
+             */
+            function (sanitised) {
+                if (sanitised.hasChanged(snapshot_1)) {
+                    return _this.placeRouter.createUrlTree(activatedRoute, snapshot_1, sanitised);
+                }
+                else {
+                    return true;
+                }
+            }));
+        }
+        else {
+            return lang.illegalState("expected component to be an instance of PlaceComponent, got " + activatedRoute.component);
+        }
     };
     PlaceRouteGuard.decorators = [
         { type: Injectable, args: [{
@@ -3760,10 +3857,10 @@ var PlaceRouteGuard = /** @class */ (function () {
     ];
     /** @nocollapse */
     PlaceRouteGuard.ctorParameters = function () { return [
-        { 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" });
+    /** @nocollapse */ PlaceRouteGuard.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouteGuard_Factory() { return new PlaceRouteGuard(ɵɵinject(PlaceRouter), ɵɵinject(INJECTOR)); }, token: PlaceRouteGuard, providedIn: "root" });
     return PlaceRouteGuard;
 }());
 if (false) {
@@ -3771,12 +3868,12 @@ if (false) {
      * @type {?}
      * @private
      */
-    PlaceRouteGuard.prototype.placeService;
+    PlaceRouteGuard.prototype.placeRouter;
     /**
      * @type {?}
      * @private
      */
-    PlaceRouteGuard.prototype.router;
+    PlaceRouteGuard.prototype.injector;
 }
 
 /**
@@ -3787,11 +3884,10 @@ if (false) {
  * @template T, S
  */
 var DefaultParameterSanitiser = /** @class */ (function () {
-    function DefaultParameterSanitiser(def, placeService, options) {
+    function DefaultParameterSanitiser(def, remember, defaultValue) {
         this.def = def;
-        this.placeService = placeService;
-        this.remember = isNil(options.remember) ? false : options.remember;
-        this.defaultValue = isNil(options.defaultValue) ? null : options.defaultValue;
+        this.remember = remember;
+        this.defaultValue = defaultValue;
     }
     /**
      * @param {?} value
@@ -3808,7 +3904,7 @@ var DefaultParameterSanitiser = /** @class */ (function () {
             if (this.remember) {
                 // value = null;
             }
-            return this.isBlank(value) && !isNil(this.defaultValue) ? this.defaultValue : value;
+            return this.isBlank(value) && !___default.isNil(this.defaultValue) ? this.defaultValue : value;
         }
         else {
             return value;
@@ -3826,8 +3922,8 @@ var DefaultParameterSanitiser = /** @class */ (function () {
      */
     function (value) {
         /** @type {?} */
-        var isNil$1 = isNil(value);
-        return this.def.isArray ? !isNil$1 || value['length'] < 1 : isNil$1;
+        var isNil = ___default.isNil(value);
+        return this.def.isArray ? !isNil || value['length'] < 1 : isNil;
     };
     __decorate([
         Trace(),
@@ -3842,22 +3938,11 @@ if (false) {
      * @type {?}
      * @private
      */
+    DefaultParameterSanitiser.prototype.def;
+    /** @type {?} */
     DefaultParameterSanitiser.prototype.remember;
-    /**
-     * @type {?}
-     * @private
-     */
+    /** @type {?} */
     DefaultParameterSanitiser.prototype.defaultValue;
-    /**
-     * @type {?}
-     * @private
-     */
-    DefaultParameterSanitiser.prototype.def;
-    /**
-     * @type {?}
-     * @private
-     */
-    DefaultParameterSanitiser.prototype.placeService;
 }
 
 /**
@@ -3891,8 +3976,6 @@ if (false) {
     ParameterOptions.prototype.remember;
     /** @type {?|undefined} */
     ParameterOptions.prototype.defaultValue;
-    /** @type {?|undefined} */
-    ParameterOptions.prototype.sanitiser;
 }
 /**
  * @record
@@ -3908,8 +3991,6 @@ if (false) {
     ListParameterOptions.prototype.remember;
     /** @type {?|undefined} */
     ListParameterOptions.prototype.defaultValue;
-    /** @type {?|undefined} */
-    ListParameterOptions.prototype.sanitiser;
 }
 /**
  * @template T
@@ -3918,7 +3999,6 @@ if (false) {
  * @return {?}
  */
 function RouteId(type, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3926,7 +4006,7 @@ function RouteId(type, options) {
      */
     function (prototype, propertyKey) {
         /** @type {?} */
-        var param = createDefinition(propertyKey, type, options, true);
+        var param = new ParameterDefinition.RouteId(propertyKey.toString(), type, options);
         Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
         UseDelegate()(prototype, propertyKey);
     });
@@ -3938,7 +4018,6 @@ function RouteId(type, options) {
  * @return {?}
  */
 function RouteParameter(type, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3946,7 +4025,7 @@ function RouteParameter(type, options) {
      */
     function (prototype, propertyKey) {
         /** @type {?} */
-        var param = createDefinition(propertyKey, type, options, false);
+        var param = new ParameterDefinition.ValueParameter(propertyKey.toString(), type, options);
         Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
         UseDelegate()(prototype, propertyKey);
     });
@@ -3958,7 +4037,6 @@ function RouteParameter(type, options) {
  * @return {?}
  */
 function RouteParameterList(elementType, options) {
-    // assert.isTruthy(type.isValid());
     return (/**
      * @param {?} prototype
      * @param {?} propertyKey
@@ -3966,82 +4044,11 @@ function RouteParameterList(elementType, options) {
      */
     function (prototype, propertyKey) {
         /** @type {?} */
-        var param = createArrayDefinition(propertyKey, elementType, options);
+        var 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 {?} */
-    var opts = Opts.get(options);
-    /** @type {?} */
-    var propertyNameAsString = assert.notNil(propertyName).toString();
-    /** @type {?} */
-    var 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 {?} */
-    var opts = Opts.get(options);
-    /** @type {?} */
-    var propertyNameAsString = assert.notNil(propertyName).toString();
-    /** @type {?} */
-    var 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
@@ -4060,20 +4067,6 @@ if (false) {
      */
     ParameterSanitiser.prototype.sanitise = function (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
@@ -4132,7 +4125,7 @@ var ParameterType;
          * @return {?}
          */
         function (value) {
-            return isNil(value) || isEmpty(value) ? null : +value;
+            return ___default.isNil(value) || ___default.isEmpty(value) ? null : +value;
         };
         return NumberType;
     }());
@@ -4198,7 +4191,7 @@ Sanitiser = /** @class */ (function () {
          * @return {?}
          */
         function () {
-            return !isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
+            return !___default.isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
         },
         enumerable: true,
         configurable: true
@@ -4300,11 +4293,10 @@ if (false) {
     Sanitiser.prototype.sanitiser;
 }
 var RouteParameterSanitiser = /** @class */ (function () {
-    function RouteParameterSanitiser(parameterDefs, snapshot, placeService, injector) {
+    function RouteParameterSanitiser(parameterDefs, snapshot, injector) {
         var _this = this;
         this.parameterDefs = parameterDefs;
         this.snapshot = snapshot;
-        this.placeService = placeService;
         this.injector = injector;
         this.parameterSanitisers = [];
         /** @type {?} */
@@ -4397,17 +4389,7 @@ var RouteParameterSanitiser = /** @class */ (function () {
      * @return {?}
      */
     function (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 {?}
@@ -4453,12 +4435,12 @@ var RouteParameterSanitiser = /** @class */ (function () {
      * @return {?}
      */
     function (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([
@@ -4485,8 +4467,6 @@ if (false) {
     /** @type {?} */
     RouteParameterSanitiser.prototype.snapshot;
     /** @type {?} */
-    RouteParameterSanitiser.prototype.placeService;
-    /** @type {?} */
     RouteParameterSanitiser.prototype.injector;
 }
 (function (Sanitiser) {
@@ -4628,5 +4608,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, DefaultParameterSanitiser, 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