@coolon/angular-ui-powerups 0.0.37 → 0.0.41

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

@@ -1,26 +1,25 @@
 import { DOCUMENT, CommonModule } from '@angular/common';
-import { EventEmitter, Input, Output, HostListener, Component, Directive, ElementRef, Inject, NgZone, InjectionToken, Injector, ComponentFactoryResolver, ViewContainerRef, ViewChild, ViewChildren, Injectable, ɵɵdefineInjectable, ɵɵinject, NgModule, INJECTOR } from '@angular/core';
+import { EventEmitter, Input, Output, HostListener, Component, Directive, ElementRef, Inject, NgZone, InjectionToken, Injector, ComponentFactoryResolver, ViewContainerRef, ViewChild, ViewChildren, Injectable, ɵɵdefineInjectable, ɵɵinject, NgModule, HostBinding, INJECTOR } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatDialog, MatButtonModule, MatDialogModule, MatTabsModule, MatProgressSpinnerModule, MatInputModule, MatFormFieldModule, MatSelectModule } from '@angular/material';
-import { BrowserModule } from '@angular/platform-browser';
+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, assert, UnaryCommand, lang, Dsl, Logger, ListModel, StoreInListModel, EventListenerList, DelegatingValueModel, Trace, MutableListModel, StoreInValueModel, MutableValueModel, TransactionObserver, Binding, OptionsHelper, ValueHolder } from '@coolon/pectin';
+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 { 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';
 import { MatDialog as MatDialog$1 } from '@angular/material/dialog';
 import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
-import { MatTabsModule as MatTabsModule$1 } from '@angular/material/tabs';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { Router, RouterModule, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
-import { Memoize } from '@typescript-plus/fast-memoize-decorator';
-import { isNil } from 'lodash';
+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 'reflect-metadata';
 import { style, query, group, animate, trigger, transition } from '@angular/animations';
 import ResizeObserver from 'resize-observer-polyfill';
-import { Memoize as Memoize$1 } from '@typescript-plus/fast-memoize-decorator/dist/src';
 
 /**
  * @fileoverview added by tsickle
@@ -298,6 +297,126 @@ var NumberInputComponent = /** @class */ (function (_super) {
     return NumberInputComponent;
 }(AbstractInputComponent));
 
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var PasswordInputComponent = /** @class */ (function (_super) {
+    __extends(PasswordInputComponent, _super);
+    function PasswordInputComponent() {
+        return _super.call(this) || this;
+    }
+    /**
+     * @return {?}
+     */
+    PasswordInputComponent.prototype.ngOnInit = /**
+     * @return {?}
+     */
+    function () {
+    };
+    PasswordInputComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'angular-ui-powerups-password-input',
+                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"password\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"valueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"valueModel\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
+                    styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}"]
+                }] }
+    ];
+    /** @nocollapse */
+    PasswordInputComponent.ctorParameters = function () { return []; };
+    return PasswordInputComponent;
+}(AbstractInputComponent));
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @template T
+ */
+var SelectInputComponent = /** @class */ (function (_super) {
+    __extends(SelectInputComponent, _super);
+    function SelectInputComponent() {
+        var _this = _super.call(this) || this;
+        _this.optionLabelFormat = (/**
+         * @param {?} option
+         * @return {?}
+         */
+        function (option) { return (option && _this.optionLabel) ? option[_this.optionLabel] : option; });
+        return _this;
+    }
+    /**
+     * @return {?}
+     */
+    SelectInputComponent.prototype.ngOnInit = /**
+     * @return {?}
+     */
+    function () {
+    };
+    SelectInputComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'angular-ui-powerups-select-input',
+                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <mat-select placeholder=\"{{placeholder}}\"\n              [(ngModel)]=\"valueModel.value\"\n              [disabled]=\"!enabled.value\"\n              (keydown.enter)=\"notifyEnterKey()\"\n              (keydown.escape)=\"notifyEscapeKey()\"\n              [pectinFocusBinding]=\"valueModel\"\n              [errorStateMatcher]=\"errorStateMatcher\"\n  >\n    <mat-option *ngFor=\"let option of optionsModel.value\" [value]=\"option\">{{optionLabelFormat(option)}}\n    </mat-option>\n  </mat-select>\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
+                    styles: [":host{display:inline-block}mat-form-field{width:100%}"]
+                }] }
+    ];
+    /** @nocollapse */
+    SelectInputComponent.ctorParameters = function () { return []; };
+    SelectInputComponent.propDecorators = {
+        optionsModel: [{ type: Input }],
+        options: [{ type: Input }],
+        optionLabel: [{ type: Input }],
+        optionLabelFormat: [{ type: Input }]
+    };
+    __decorate([
+        UseDelegate(),
+        __metadata("design:type", ListModel)
+    ], SelectInputComponent.prototype, "optionsModel", void 0);
+    __decorate([
+        StoreInListModel('optionsModel'),
+        __metadata("design:type", Array)
+    ], SelectInputComponent.prototype, "options", void 0);
+    return SelectInputComponent;
+}(AbstractInputComponent));
+if (false) {
+    /** @type {?} */
+    SelectInputComponent.prototype.optionsModel;
+    /** @type {?} */
+    SelectInputComponent.prototype.options;
+    /** @type {?} */
+    SelectInputComponent.prototype.optionLabel;
+    /** @type {?} */
+    SelectInputComponent.prototype.optionLabelFormat;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var StringInputComponent = /** @class */ (function (_super) {
+    __extends(StringInputComponent, _super);
+    function StringInputComponent() {
+        return _super.call(this) || this;
+    }
+    /**
+     * @return {?}
+     */
+    StringInputComponent.prototype.ngOnInit = /**
+     * @return {?}
+     */
+    function () {
+    };
+    StringInputComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'angular-ui-powerups-string-input',
+                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"valueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"valueModel\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
+                    styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}"]
+                }] }
+    ];
+    /** @nocollapse */
+    StringInputComponent.ctorParameters = function () { return []; };
+    return StringInputComponent;
+}(AbstractInputComponent));
+
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -674,126 +793,6 @@ if (false) {
     FocusBindingDirective.prototype.ngZone;
 }
 
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var StringInputComponent = /** @class */ (function (_super) {
-    __extends(StringInputComponent, _super);
-    function StringInputComponent() {
-        return _super.call(this) || this;
-    }
-    /**
-     * @return {?}
-     */
-    StringInputComponent.prototype.ngOnInit = /**
-     * @return {?}
-     */
-    function () {
-    };
-    StringInputComponent.decorators = [
-        { type: Component, args: [{
-                    selector: 'angular-ui-powerups-string-input',
-                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"valueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"valueModel\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
-                    styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}"]
-                }] }
-    ];
-    /** @nocollapse */
-    StringInputComponent.ctorParameters = function () { return []; };
-    return StringInputComponent;
-}(AbstractInputComponent));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var PasswordInputComponent = /** @class */ (function (_super) {
-    __extends(PasswordInputComponent, _super);
-    function PasswordInputComponent() {
-        return _super.call(this) || this;
-    }
-    /**
-     * @return {?}
-     */
-    PasswordInputComponent.prototype.ngOnInit = /**
-     * @return {?}
-     */
-    function () {
-    };
-    PasswordInputComponent.decorators = [
-        { type: Component, args: [{
-                    selector: 'angular-ui-powerups-password-input',
-                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <input type=\"password\"\n         matInput\n         placeholder=\"{{placeholder}}\"\n         [(ngModel)]=\"valueModel.value\"\n         [disabled]=\"!enabled.value\"\n         (keydown.enter)=\"notifyEnterKey()\"\n         (keydown.escape)=\"notifyEscapeKey()\"\n         [pectinFocusBinding]=\"valueModel\"\n         [errorStateMatcher]=\"errorStateMatcher\"\n  >\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
-                    styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}"]
-                }] }
-    ];
-    /** @nocollapse */
-    PasswordInputComponent.ctorParameters = function () { return []; };
-    return PasswordInputComponent;
-}(AbstractInputComponent));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @template T
- */
-var SelectInputComponent = /** @class */ (function (_super) {
-    __extends(SelectInputComponent, _super);
-    function SelectInputComponent() {
-        var _this = _super.call(this) || this;
-        _this.optionLabelFormat = (/**
-         * @param {?} option
-         * @return {?}
-         */
-        function (option) { return (option && _this.optionLabel) ? option[_this.optionLabel] : option; });
-        return _this;
-    }
-    /**
-     * @return {?}
-     */
-    SelectInputComponent.prototype.ngOnInit = /**
-     * @return {?}
-     */
-    function () {
-    };
-    SelectInputComponent.decorators = [
-        { type: Component, args: [{
-                    selector: 'angular-ui-powerups-select-input',
-                    template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\n  <mat-select placeholder=\"{{placeholder}}\"\n              [(ngModel)]=\"valueModel.value\"\n              [disabled]=\"!enabled.value\"\n              (keydown.enter)=\"notifyEnterKey()\"\n              (keydown.escape)=\"notifyEscapeKey()\"\n              [pectinFocusBinding]=\"valueModel\"\n              [errorStateMatcher]=\"errorStateMatcher\"\n  >\n    <mat-option *ngFor=\"let option of optionsModel.value\" [value]=\"option\">{{optionLabelFormat(option)}}\n    </mat-option>\n  </mat-select>\n  <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n  <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
-                    styles: [":host{display:inline-block}mat-form-field{width:100%}"]
-                }] }
-    ];
-    /** @nocollapse */
-    SelectInputComponent.ctorParameters = function () { return []; };
-    SelectInputComponent.propDecorators = {
-        optionsModel: [{ type: Input }],
-        options: [{ type: Input }],
-        optionLabel: [{ type: Input }],
-        optionLabelFormat: [{ type: Input }]
-    };
-    __decorate([
-        UseDelegate(),
-        __metadata("design:type", ListModel)
-    ], SelectInputComponent.prototype, "optionsModel", void 0);
-    __decorate([
-        StoreInListModel('optionsModel'),
-        __metadata("design:type", Array)
-    ], SelectInputComponent.prototype, "options", void 0);
-    return SelectInputComponent;
-}(AbstractInputComponent));
-if (false) {
-    /** @type {?} */
-    SelectInputComponent.prototype.optionsModel;
-    /** @type {?} */
-    SelectInputComponent.prototype.options;
-    /** @type {?} */
-    SelectInputComponent.prototype.optionLabel;
-    /** @type {?} */
-    SelectInputComponent.prototype.optionLabelFormat;
-}
-
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -1296,7 +1295,6 @@ var ConfirmationDialogComponent = /** @class */ (function (_super) {
         var _this = _super.call(this) || this;
         _this.confirm = confirm;
         assert.notNil(confirm);
-        console.log(confirm);
         return _this;
     }
     /**
@@ -1449,7 +1447,6 @@ var ActivityContainerComponent = /** @class */ (function (_super) {
      */
     function () {
         var _this = this;
-        // TODO: notify selected tab they are ready.  activty.afterAnimationComplete
         this.activityTabs.value = this.activityTabs.value.filter((/**
          * @param {?} tab
          * @return {?}
@@ -1757,88 +1754,175 @@ var EmptyStateComponent = /** @class */ (function () {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-var ResolvedRouteParameterSnapshot = /** @class */ (function () {
-    function ResolvedRouteParameterSnapshot(parameters) {
-        this.parameters = parameters;
+// 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;
     }
     /**
-     * @template T
-     * @param {?} parameter
+     * @param {?} other
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.get = /**
-     * @template T
-     * @param {?} parameter
+    ParameterSnapshot.prototype.hasChanged = /**
+     * @param {?} other
      * @return {?}
      */
-    function (parameter) {
+    function (other) {
         /** @type {?} */
-        var resolved = this.parameters.find((/**
-         * @param {?} p
+        var changed = this.resolved.find((/**
+         * @param {?} r
          * @return {?}
          */
-        function (p) { return p.parameterDef === parameter; }));
-        return resolved ? resolved.resolvedValue : null;
+        function (r) {
+            return !r.isSame(other.getResolvedParameterValue(r.parameterDef));
+        }));
+        if (changed) {
+            console.log({ mine: changed, theirs: other.getResolvedParameter(changed.parameterDef) });
+        }
+        return !!changed;
     };
     /**
-     * @template T
-     * @param {?} parameter
-     * @param {?} value
+     * @param {?} other
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.replace = /**
-     * @template T
-     * @param {?} parameter
-     * @param {?} value
+    ParameterSnapshot.prototype.asUrlSegment = /**
+     * @param {?} other
      * @return {?}
      */
-    function (parameter, value) {
-        return new ResolvedRouteParameterSnapshot(this.parameters.filter((/**
-         * @param {?} p
+    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());
+            }
+        }
+        else {
+            routeParts.push('.');
+        }
+        routeParts.push(this.getFormattedParameters());
+        return routeParts;
+    };
+    /**
+     * @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 (p) { return p.parameterDef !== parameter; })).concat({
-            parameterDef: parameter,
-            resolvedValue: value
-        }));
+        function (r) { return r.parameterDef === parameterDef; }));
+    };
+    /**
+     * @template T, S
+     * @param {?} parameterDef
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.getResolvedParameterValue = /**
+     * @template T, S
+     * @param {?} parameterDef
+     * @return {?}
+     */
+    function (parameterDef) {
+        /** @type {?} */
+        var resolvedParameter = this.getResolvedParameter(parameterDef);
+        return resolvedParameter ? resolvedParameter.value : null;
     };
     /**
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.getFormattedRouteId = /**
+    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 routeIdParam = this.getRouteIdParam();
-        return routeIdParam ? routeIdParam.parameterDef.type.format(routeIdParam.resolvedValue) : null;
+        var resolvedParameter = this.resolved.find((/**
+         * @param {?} r
+         * @return {?}
+         */
+        function (r) { return r.parameterDef.name === name; }));
+        return resolvedParameter ? resolvedParameter.value : null;
     };
     /**
      * @private
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.getRouteIdParam = /**
+    ParameterSnapshot.prototype.getResolvedRouteId = /**
      * @private
      * @return {?}
      */
     function () {
-        return this.parameters.find((/**
+        // 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; }));
+        function (p) { return p.parameterDef.isRouteId; }))));
+    };
+    /**
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.hasRouteId = /**
+     * @return {?}
+     */
+    function () {
+        return !!this.getResolvedRouteId();
+    };
+    /**
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.getFormattedRouteId = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var routeIdParam = this.getResolvedRouteId();
+        return routeIdParam ? routeIdParam.formattedValue() : null;
     };
     /**
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.getFormattedParameters = /**
+    ParameterSnapshot.prototype.getFormattedParameters = /**
      * @return {?}
      */
     function () {
         /** @type {?} */
         var params = {};
         /** @type {?} */
-        var routeIdParam = this.parameters.filter((/**
+        var routeIdParam = this.resolved.filter((/**
          * @param {?} p
          * @return {?}
          */
@@ -1847,91 +1931,325 @@ var ResolvedRouteParameterSnapshot = /** @class */ (function () {
          * @return {?}
          */
         function (p) {
-            params[p.parameterDef.name] = p.parameterDef.type.format(p.resolvedValue);
+            params[p.parameterDef.name] = p.formattedValue();
         }));
         return params;
     };
     /**
+     * @template T, S
+     * @param {?} parameter
+     * @param {?} value
      * @return {?}
      */
-    ResolvedRouteParameterSnapshot.prototype.hasRouteId = /**
+    ParameterSnapshot.prototype.replace = /**
+     * @template T, S
+     * @param {?} parameter
+     * @param {?} value
      * @return {?}
      */
-    function () {
-        return !!this.getRouteIdParam();
+    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 {?} url
+     * @return {?}
+     */
+    ParameterSnapshot.prototype.updateUrl = /**
+     * @param {?} url
+     * @return {?}
+     */
+    function (url) {
+        return url;
     };
+    var _a;
     __decorate([
-        Trace(),
+        Memoize(),
         __metadata("design:type", Function),
-        __metadata("design:paramtypes", []),
-        __metadata("design:returntype", void 0)
-    ], ResolvedRouteParameterSnapshot.prototype, "getFormattedRouteId", null);
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", ParameterSnapshot.ResolvedParameter)
+    ], ParameterSnapshot.prototype, "getResolvedParameter", null);
     __decorate([
-        Trace(),
+        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);
+    __decorate([
+        Memoize(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [String]),
+        __metadata("design:returntype", Object)
+    ], ParameterSnapshot.prototype, "getRouteParameter", null);
+    __decorate([
+        Memoize(),
         __metadata("design:type", Function),
         __metadata("design:paramtypes", []),
-        __metadata("design:returntype", void 0)
-    ], ResolvedRouteParameterSnapshot.prototype, "getFormattedParameters", null);
-    return ResolvedRouteParameterSnapshot;
+        __metadata("design:returntype", ParameterSnapshot.ResolvedValueParameter)
+    ], ParameterSnapshot.prototype, "getResolvedRouteId", null);
+    return ParameterSnapshot;
 }());
 if (false) {
     /** @type {?} */
-    ResolvedRouteParameterSnapshot.prototype.parameters;
+    ParameterSnapshot.prototype.placeDefinition;
+    /**
+     * @type {?}
+     * @private
+     */
+    ParameterSnapshot.prototype.resolved;
 }
+(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 {?}
+         */
+        ResolvedParameter.prototype.isRouteId = /**
+         * @return {?}
+         */
+        function () {
+            return this.parameterDef.isRouteId;
+        };
+        return ResolvedParameter;
+    }());
+    ParameterSnapshot.ResolvedParameter = ResolvedParameter;
+    if (false) {
+        /** @type {?} */
+        ResolvedParameter.prototype.parameterDef;
+        /** @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
+         * @return {?}
+         */
+        ResolvedParameter.prototype.replace = function (value) { };
+    }
+    /**
+     * @template T
+     */
+    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;
+    /**
+     * @template T
+     */
+    var 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 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 = {}));
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-var RouteParameterBindings = /** @class */ (function (_super) {
-    __extends(RouteParameterBindings, _super);
-    function RouteParameterBindings(component, placeService) {
+// 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.component = component;
+        _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;
-        _this.txo = new TransactionObserver(); //.onEvent(e => console.log(e.toString()));
-        //.onEvent(e => console.log(e.toString()));
-        /** @type {?} */
-        var routeParameterDefs = Klass.get(component).getMetadataList(RouteParameterBindings.ROUTE_PARAMETER_LIST_KEY);
-        routeParameterDefs.forEach((/**
-         * @param {?} parameter
+        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 (parameter) { return _this.installBinding(parameter); }));
-        /** @type {?} */
-        var incomingResolvedRouteParameters = observe.valuesFrom(component.activatedRoute.paramMap)
+        function (p) { return _this.installBinding(p); }));
+        observe.valuesFrom(activatedRoute.paramMap)
             .last()
             .map((/**
          * @param {?} params
          * @return {?}
          */
-        function (params) {
-            /** @type {?} */
-            var result = [];
-            routeParameterDefs.forEach((/**
-             * @param {?} parameterDef
-             * @return {?}
-             */
-            function (parameterDef) {
-                /** @type {?} */
-                var resolvedValue;
-                if (parameterDef.isArray) {
-                    resolvedValue = params.getAll(parameterDef.name).map((/**
-                     * @param {?} v
-                     * @return {?}
-                     */
-                    function (v) { return parameterDef.type.parse(v); }));
-                }
-                else {
-                    resolvedValue = parameterDef.type.parse(params.get(parameterDef.name));
-                }
-                result.push({ parameterDef: parameterDef, resolvedValue: resolvedValue });
-            }));
-            return new ResolvedRouteParameterSnapshot(result);
-        }));
-        incomingResolvedRouteParameters.subscribe((/**
+        function (params) { return ParameterSnapshot.create(_this.placeDefinition, params); }))
+            .subscribe((/**
          * @param {?} resolvedParameters
          * @return {?}
          */
@@ -1947,17 +2265,15 @@ var RouteParameterBindings = /** @class */ (function (_super) {
          */
         function (params, previous) {
             placeService.notifyRouteParametersChanged({
-                placeComponent: component,
+                activatedRoute: _this.activatedRoute,
                 next: params,
                 previous: previous,
                 updateRoute: !_this.incomingRouteChange.value // we update the route if it's a component triggered change.
             });
         }));
-        _this.txo.observe('incomingResolvedRouteParameters', incomingResolvedRouteParameters);
-        _this.txo.observe('this.routeIsChanging', _this.incomingRouteChange);
         return _this;
     }
-    Object.defineProperty(RouteParameterBindings.prototype, "incomingRouteChange", {
+    Object.defineProperty(PlaceComponent.prototype, "incomingRouteChange", {
         get: /**
          * @return {?}
          */
@@ -1968,28 +2284,28 @@ var RouteParameterBindings = /** @class */ (function (_super) {
         configurable: true
     });
     /**
-     * @protected
-     * @template T
-     * @param {?} parameter
+     * @private
+     * @template T, S
+     * @param {?} parameterDef
      * @return {?}
      */
-    RouteParameterBindings.prototype.installBinding = /**
-     * @protected
-     * @template T
-     * @param {?} parameter
+    PlaceComponent.prototype.installBinding = /**
+     * @private
+     * @template T, S
+     * @param {?} parameterDef
      * @return {?}
      */
-    function (parameter) {
+    function (parameterDef) {
         /** @type {?} */
-        var model = this.getModelFor(parameter);
-        // this.txo.observe(parameter.propertyName, model);
+        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.get(parameter);
+                return parameters.getResolvedParameterValue(parameterDef);
             },
             toLeft: /**
              * @param {?} value
@@ -1997,66 +2313,11 @@ var RouteParameterBindings = /** @class */ (function (_super) {
              * @return {?}
              */
             function (value, currentParameters) {
-                return currentParameters.replace(parameter, value);
+                return currentParameters.replace(parameterDef, value);
             }
         }));
     };
-    /**
-     * @private
-     * @template T
-     * @param {?} parameter
-     * @return {?}
-     */
-    RouteParameterBindings.prototype.getModelFor = /**
-     * @private
-     * @template T
-     * @param {?} parameter
-     * @return {?}
-     */
-    function (parameter) {
-        return this.component[parameter.propertyName];
-    };
-    return RouteParameterBindings;
-}(GarbageCollector));
-if (false) {
-    /** @type {?} */
-    RouteParameterBindings.prototype._incomingRouteChange;
-    /**
-     * @type {?}
-     * @private
-     */
-    RouteParameterBindings.prototype.txo;
-    /**
-     * @type {?}
-     * @private
-     */
-    RouteParameterBindings.prototype.resolvedParameters;
-    /**
-     * @type {?}
-     * @private
-     */
-    RouteParameterBindings.prototype.component;
-}
-(function (RouteParameterBindings) {
-    RouteParameterBindings.ROUTE_PARAMETER_LIST_KEY = Symbol('place:route:parameters');
-})(RouteParameterBindings || (RouteParameterBindings = {}));
-
-/**
- * @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';
-var PlaceComponent = /** @class */ (function (_super) {
-    __extends(PlaceComponent, _super);
-    function PlaceComponent(activatedRoute, placeService) {
-        var _this = _super.call(this) || this;
-        _this.activatedRoute = activatedRoute;
-        _this.routeBindingMediator = _this.registerDisposable(new RouteParameterBindings(_this, placeService));
-        return _this;
-    }
-    Object.defineProperty(PlaceComponent.prototype, "placeConfig", {
+    Object.defineProperty(PlaceComponent.prototype, "placeDefinition", {
         get: /**
          * @return {?}
          */
@@ -2075,33 +2336,33 @@ var PlaceComponent = /** @class */ (function (_super) {
     function () {
         return true;
     };
+    // @Trace()
+    // @Trace()
     /**
      * @return {?}
      */
-    PlaceComponent.prototype.onPlaceReady = /**
+    PlaceComponent.prototype.onPlaceReady = 
+    // @Trace()
+    /**
      * @return {?}
      */
     function () {
     };
     __decorate([
-        Memoize(),
+        Memoize$1(),
         __metadata("design:type", PlaceComponent.Definition),
         __metadata("design:paramtypes", [])
-    ], PlaceComponent.prototype, "placeConfig", null);
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", []),
-        __metadata("design:returntype", void 0)
-    ], PlaceComponent.prototype, "onPlaceReady", null);
+    ], PlaceComponent.prototype, "placeDefinition", null);
     return PlaceComponent;
 }(DisposableComponent));
 if (false) {
+    /** @type {?} */
+    PlaceComponent.prototype._incomingRouteChange;
     /**
      * @type {?}
      * @private
      */
-    PlaceComponent.prototype.routeBindingMediator;
+    PlaceComponent.prototype.resolvedParameters;
     /** @type {?} */
     PlaceComponent.prototype.activatedRoute;
 }
@@ -2114,17 +2375,31 @@ if (false) {
             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; }));
         }
         /**
-         * @param {?} construcable
+         * @return {?}
+         */
+        Definition.prototype.getRouteParameters = /**
+         * @return {?}
+         */
+        function () {
+            return Klass.get(this.component).getMetadataList(ROUTE_PARAMETER_LIST_KEY);
+        };
+        /**
+         * @param {?} constructable
          * @return {?}
          */
         Definition.prototype.isDescriptorForType = /**
-         * @param {?} construcable
+         * @param {?} constructable
          * @return {?}
          */
-        function (construcable) {
-            return lang.constructorChain(construcable).includes(PlaceComponent);
+        function (constructable) {
+            return lang.constructorChain(constructable).includes(PlaceComponent);
         };
         /**
          * @param {?} placeComponent
@@ -2181,6 +2456,12 @@ if (false) {
                 return defaultValue;
             }
         };
+        __decorate([
+            Memoize$1(),
+            __metadata("design:type", Function),
+            __metadata("design:paramtypes", []),
+            __metadata("design:returntype", Array)
+        ], Definition.prototype, "getRouteParameters", null);
         return Definition;
     }());
     PlaceComponent.Definition = Definition;
@@ -2194,6 +2475,8 @@ if (false) {
         /** @type {?} */
         Definition.prototype.data;
         /** @type {?} */
+        Definition.prototype.children;
+        /** @type {?} */
         Definition.prototype.component;
     }
     /**
@@ -2210,15 +2493,24 @@ if (false) {
         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) {
-        /** @type {?} */
-        var placeOptions = Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
-        return new Definition(klass, placeOptions);
+        return Reflect.getMetadata(DEFINITION_META_DATA_KEY, klass);
     }
     PlaceComponent.getDefinition = getDefinition;
     /**
@@ -2227,20 +2519,157 @@ if (false) {
      * @return {?}
      */
     function injectDefinition(klass, options) {
-        Reflect.defineMetadata(DEFINITION_META_DATA_KEY, options, klass);
+        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
+         * @return {?}
+         */
+        function (c) { return PlaceComponent.getDefinition(c); }));
+        return _this;
+    }
+    /**
+     * @param {?} placeDef
+     * @return {?}
+     */
+    AbstractPlaceNavigationComponent.prototype.getNav = /**
+     * @param {?} placeDef
+     * @return {?}
+     */
+    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: (/**
+             * @return {?}
+             */
+            function () { return navItem && navItem.icon ? navItem.icon() : placeDef.getData('navIcon', null); })
+        };
+    };
+    /**
+     * @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) {
+    function PlaceService(router, injector) {
         var _this = _super.call(this) || this;
         _this.router = router;
+        _this.injector = injector;
         _this._activePlaces = new MutableListModel();
         return _this;
     }
@@ -2254,33 +2683,45 @@ var PlaceService = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
+    // @Trace()
+    // @Trace()
     /**
      * @param {?} place
      * @return {?}
      */
-    PlaceService.prototype.onActivate = /**
+    PlaceService.prototype.onActivate = 
+    // @Trace()
+    /**
      * @param {?} place
      * @return {?}
      */
     function (place) {
         this._activePlaces.push(place);
     };
+    // @Trace()
+    // @Trace()
     /**
      * @param {?} place
      * @return {?}
      */
-    PlaceService.prototype.onDeactivate = /**
+    PlaceService.prototype.onDeactivate = 
+    // @Trace()
+    /**
      * @param {?} place
      * @return {?}
      */
     function (place) {
         this._activePlaces.remove(place);
     };
+    // @Trace()
+    // @Trace()
     /**
      * @param {?} params
      * @return {?}
      */
-    PlaceService.prototype.notifyRouteParametersChanged = /**
+    PlaceService.prototype.notifyRouteParametersChanged = 
+    // @Trace()
+    /**
      * @param {?} params
      * @return {?}
      */
@@ -2294,10 +2735,29 @@ var PlaceService = /** @class */ (function (_super) {
             /** @type {?} */
             var path = routeId ? [relativePath, routeId, params.next.getFormattedParameters()] : [relativePath, params.next.getFormattedParameters()];
             this.router.navigate(path, {
-                relativeTo: params.placeComponent.activatedRoute
+                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'
@@ -2305,27 +2765,10 @@ var PlaceService = /** @class */ (function (_super) {
     ];
     /** @nocollapse */
     PlaceService.ctorParameters = function () { return [
-        { type: Router }
+        { type: Router },
+        { type: Injector }
     ]; };
-    /** @nocollapse */ PlaceService.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceService_Factory() { return new PlaceService(ɵɵinject(Router)); }, token: PlaceService, providedIn: "root" });
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [PlaceComponent]),
-        __metadata("design:returntype", void 0)
-    ], PlaceService.prototype, "onActivate", null);
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [PlaceComponent]),
-        __metadata("design:returntype", void 0)
-    ], PlaceService.prototype, "onDeactivate", null);
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Object]),
-        __metadata("design:returntype", void 0)
-    ], PlaceService.prototype, "notifyRouteParametersChanged", null);
+    /** @nocollapse */ PlaceService.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceService_Factory() { return new PlaceService(ɵɵinject(Router), ɵɵinject(INJECTOR)); }, token: PlaceService, providedIn: "root" });
     return PlaceService;
 }(GarbageCollector));
 if (false) {
@@ -2339,6 +2782,11 @@ if (false) {
      * @protected
      */
     PlaceService.prototype.router;
+    /**
+     * @type {?}
+     * @protected
+     */
+    PlaceService.prototype.injector;
 }
 
 /**
@@ -2381,20 +2829,66 @@ var right = [
         })
     ])
 ];
+/**
+ * @param {?} duration
+ * @return {?}
+ */
+function leftRightPlaceAnimation(duration) {
+    return trigger('routeAnimations', [
+        transition(':increment', right, { params: { duration: duration } }),
+        transition(':decrement', left, { params: { duration: duration } })
+    ]);
+}
 /** @type {?} */
-var LEFT_RIGHT_PLACE_ANIMATION = trigger('routeAnimations', [
-    transition(':increment', right, { params: { duration: '.3s' } }),
-    transition(':decrement', left, { params: { duration: '.3s' } })
-]);
+var LEFT_RIGHT_PLACE_ANIMATION = leftRightPlaceAnimation("0.3s");
 
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-var PlaceOutletComponent = /** @class */ (function () {
-    function PlaceOutletComponent(placeService) {
-        this.placeService = placeService;
-        this.animate = true;
+var PlaceOutletComponent = /** @class */ (function (_super) {
+    __extends(PlaceOutletComponent, _super);
+    function PlaceOutletComponent(placeService, activatedRoute) {
+        var _this = _super.call(this) || this;
+        _this.placeService = placeService;
+        _this.activatedRoute = activatedRoute;
+        _this.animate = true;
+        _this.outletUrlSegment = new MutableListModel();
+        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
+         * @return {?}
+         */
+        function (s) { return s.toString(); })).reduce((/**
+         * @param {?} bits
+         * @return {?}
+         */
+        function (bits) { return bits.join(","); }));
+        _this.state = chain(_this.myPath).map((/**
+         * @param {?} path
+         * @return {?}
+         */
+        function (path) {
+            return "outlet@(" + path + "), child path->" + _this.outletChildPath.value;
+        }), { dependsOn: _this.outletChildPath });
+        when.valueOf(_this.state).changes((/**
+         * @param {?} debug
+         * @return {?}
+         */
+        function (debug) {
+            console.log("Outlet Changed -> " + debug);
+        }));
+        return _this;
     }
     /**
      * @return {?}
@@ -2404,26 +2898,71 @@ var PlaceOutletComponent = /** @class */ (function () {
      */
     function () {
     };
+    /**
+     * @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.onActivate = /**
+    PlaceOutletComponent.prototype.onOutletActivated = 
+    // @Trace()
+    // ngOnDestroy(): void {
+    //   console.log('outletSegments', this.outletUrlSegment.value);
+    //   console.log('mySegments', this.myPath.value);
+    //   super.ngOnDestroy();
+    // }
+    // @Trace()
+    /**
      * @param {?} $event
      * @return {?}
      */
     function ($event) {
+        // console.log(this.routerOutLet.activatedRoute.snapshot.url);
         this.currentPlace = $event;
         this.placeService.onActivate($event);
         if (!this.animate) {
-            this.notifyPlaceReady();
+            // we're not animating so trigger any post animation callbacks now.
+            this.animationDone();
         }
     };
     /**
      * @param {?} $event
      * @return {?}
      */
-    PlaceOutletComponent.prototype.onDeactivate = /**
+    PlaceOutletComponent.prototype.onOutletDeactivated = /**
      * @param {?} $event
      * @return {?}
      */
@@ -2449,44 +2988,53 @@ var PlaceOutletComponent = /** @class */ (function () {
      * @return {?}
      */
     function () {
-        this.notifyPlaceReady();
+        if (this.currentPlace) {
+            this.currentPlace.onPlaceReady();
+        }
     };
+    // @Trace()
+    // @Trace()
     /**
      * @private
+     * @param {?} first
      * @return {?}
      */
-    PlaceOutletComponent.prototype.notifyPlaceReady = /**
+    PlaceOutletComponent.prototype.updateRouterOutlet = 
+    // @Trace()
+    /**
      * @private
+     * @param {?} first
      * @return {?}
      */
-    function () {
-        if (this.currentPlace) {
-            this.currentPlace.onPlaceReady();
+    function (first) {
+        if (first.isActivated) {
+            this.outletUrlSegment.value = first.activatedRoute.snapshot.url;
         }
     };
     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)=\"onActivate($event)\"\n                 (deactivate)=\"onDeactivate($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($event)\"\n                 (deactivate)=\"onOutletDeactivated($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: PlaceService },
+        { type: ActivatedRoute }
     ]; };
     PlaceOutletComponent.propDecorators = {
         animate: [{ type: Input }],
-        routerOutLet: [{ type: ViewChild, args: ['routerOutlet', { static: false },] }]
+        routerOutLetQuery: [{ type: ViewChildren, args: [RouterOutlet,] }]
     };
     return PlaceOutletComponent;
-}());
+}(DisposableComponent));
 if (false) {
     /** @type {?} */
     PlaceOutletComponent.prototype.animate;
     /** @type {?} */
-    PlaceOutletComponent.prototype.routerOutLet;
+    PlaceOutletComponent.prototype.routerOutLetQuery;
     /**
      * @type {?}
      * @private
@@ -2496,64 +3044,54 @@ if (false) {
      * @type {?}
      * @private
      */
-    PlaceOutletComponent.prototype.placeService;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var TabbedPlaceNavigationComponent = /** @class */ (function (_super) {
-    __extends(TabbedPlaceNavigationComponent, _super);
-    function TabbedPlaceNavigationComponent() {
-        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.orderedPlaces = chain(_this.placesModel).map((/**
-         * @param {?} c
-         * @return {?}
-         */
-        function (c) { return PlaceComponent.getDefinition(c); })).sortBy('order');
-        return _this;
-    }
+    PlaceOutletComponent.prototype.myPath;
     /**
-     * @return {?}
+     * @type {?}
+     * @private
      */
-    TabbedPlaceNavigationComponent.prototype.ngOnInit = /**
-     * @return {?}
+    PlaceOutletComponent.prototype.outletUrlSegment;
+    /**
+     * @type {?}
+     * @private
      */
-    function () {
-    };
+    PlaceOutletComponent.prototype.outletChildPath;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype.state;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype.placeService;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceOutletComponent.prototype.activatedRoute;
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var TabbedPlaceNavigationComponent = /** @class */ (function (_super) {
+    __extends(TabbedPlaceNavigationComponent, _super);
+    function TabbedPlaceNavigationComponent() {
+        return _super.call(this) || this;
+    }
     TabbedPlaceNavigationComponent.decorators = [
         { type: Component, args: [{
                     selector: 'angular-ui-powerups-tabbed-place-navigation',
-                    template: "<nav mat-tab-nav-bar>\n  <a mat-tab-link *ngFor=\"let placeDescriptor of orderedPlaces.value\"\n     [routerLink]='placeDescriptor.path'\n     routerLinkActive #rla=\"routerLinkActive\"\n     [active]=\"rla.isActive\"\n     [matTooltip]=\"placeDescriptor.searchData(['navTooltip', 'navTitle'])\">\n    <mat-icon *ngIf=\"placeDescriptor.getData('navIcon')\">{{placeDescriptor.getData('navIcon')}}</mat-icon>\n    <span>{{placeDescriptor.getData(\"navTitle\", 'missing @Place({data: {navTitle: ??}\\})')}}</span>\n  </a>\n</nav>\n",
+                    template: "<nav mat-tab-nav-bar>\n  <a mat-tab-link *ngFor=\"let place of placeDefinitions.value\"\n     [routerLink]='place.path'\n     routerLinkActive #rla=\"routerLinkActive\"\n     [active]=\"rla.isActive\"\n     [matTooltip]=\"getNav(place).tooltip()\">\n    <mat-icon *ngIf=\"getNav(place).icon()\">{{getNav(place).icon()}}</mat-icon>\n    <span>{{getNav(place).title()}}</span>\n  </a>\n</nav>\n",
                     styles: [""]
                 }] }
     ];
     /** @nocollapse */
     TabbedPlaceNavigationComponent.ctorParameters = function () { return []; };
-    TabbedPlaceNavigationComponent.propDecorators = {
-        places: [{ type: Input }],
-        placesModel: [{ type: Input }]
-    };
-    __decorate([
-        StoreInListModel('placesModel'),
-        __metadata("design:type", Array)
-    ], TabbedPlaceNavigationComponent.prototype, "places", void 0);
-    __decorate([
-        UseDelegate(),
-        __metadata("design:type", ListModel)
-    ], TabbedPlaceNavigationComponent.prototype, "placesModel", void 0);
     return TabbedPlaceNavigationComponent;
-}(DisposableComponent));
-if (false) {
-    /** @type {?} */
-    TabbedPlaceNavigationComponent.prototype.places;
-    /** @type {?} */
-    TabbedPlaceNavigationComponent.prototype.placesModel;
-    /** @type {?} */
-    TabbedPlaceNavigationComponent.prototype.orderedPlaces;
-}
+}(AbstractPlaceNavigationComponent));
 
 /**
  * @fileoverview added by tsickle
@@ -2578,14 +3116,16 @@ var PlaceModule = /** @class */ (function () {
                         EmptyStateComponent,
                         BusyOverlayComponent,
                         PlaceOutletComponent,
-                        TabbedPlaceNavigationComponent
+                        TabbedPlaceNavigationComponent,
+                        ListPlaceNavComponent
                     ],
                     entryComponents: [BusyOverlayComponent],
                     exports: [
                         BusyOverlayComponent,
                         PlaceOutletComponent,
                         EmptyStateComponent,
-                        TabbedPlaceNavigationComponent
+                        TabbedPlaceNavigationComponent,
+                        ListPlaceNavComponent
                     ],
                     providers: [
                         PlaceService
@@ -2610,16 +3150,16 @@ var AngularUiPowerupsModule = /** @class */ (function () {
                         NumberInputComponent,
                         StringInputComponent,
                         PasswordInputComponent,
-                        SelectInputComponent,
+                        SelectInputComponent
                     ],
                     imports: [
                         CommonModule,
-                        BrowserModule,
                         BrowserAnimationsModule,
                         FormsModule,
                         MatInputModule,
                         MatFormFieldModule,
                         MatSelectModule,
+                        MatTabsModule$1,
                         PlaceModule,
                         InteractionModule
                     ],
@@ -2631,7 +3171,7 @@ var AngularUiPowerupsModule = /** @class */ (function () {
                         PasswordInputComponent,
                         SelectInputComponent,
                         InteractionModule,
-                        PlaceModule,
+                        PlaceModule
                     ]
                 },] }
     ];
@@ -3012,14 +3552,37 @@ if (false) {
 /**
  * @record
  */
-function IPlaceComponent() { }
+function NavItem() { }
+if (false) {
+    /**
+     * @return {?}
+     */
+    NavItem.prototype.title = function () { };
+    /**
+     * @return {?}
+     */
+    NavItem.prototype.icon = function () { };
+    /**
+     * @return {?}
+     */
+    NavItem.prototype.tooltip = function () { };
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ */
+function PlaceComponentLike() { }
 if (false) {
     /** @type {?} */
-    IPlaceComponent.prototype.activatedRoute;
+    PlaceComponentLike.prototype.activatedRoute;
     /**
      * @return {?}
      */
-    IPlaceComponent.prototype.onPlaceReady = function () { };
+    PlaceComponentLike.prototype.onPlaceReady = function () { };
 }
 
 /**
@@ -3029,13 +3592,13 @@ if (false) {
 /**
  * @record
  */
-function IPlaceService() { }
+function PlaceUpdatesService() { }
 if (false) {
     /**
      * @param {?} params
      * @return {?}
      */
-    IPlaceService.prototype.notifyRouteParametersChanged = function (params) { };
+    PlaceUpdatesService.prototype.notifyRouteParametersChanged = function (params) { };
 }
 
 /**
@@ -3059,6 +3622,28 @@ function Place(options) {
     });
 }
 
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ */
+function Visit() { }
+if (false) {
+    /** @type {?} */
+    Visit.prototype.placeDefinition;
+    /**
+     * @return {?}
+     */
+    Visit.prototype.getRouteId = function () { };
+    /**
+     * @param {?} name
+     * @return {?}
+     */
+    Visit.prototype.getRouteParameter = function (name) { };
+}
+
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -3083,7 +3668,24 @@ var LeavePlaceGuard = /** @class */ (function () {
      * @return {?}
      */
     function (component, currentRoute, currentState, nextState) {
-        return component.canDeactivate();
+        // 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
+        });
+        // nextState is the full path...
+        if (!nextState.url.startsWith(path)) {
+            return component.canDeactivate();
+        }
+        else {
+            return true;
+        }
     };
     LeavePlaceGuard.decorators = [
         { type: Injectable, args: [{
@@ -3115,765 +3717,892 @@ if (false) {
  * @fileoverview added by tsickle
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
+var PlaceRouteGuard = /** @class */ (function () {
+    function PlaceRouteGuard(placeService, router) {
+        this.placeService = placeService;
+        this.router = router;
+    }
+    /**
+     * @param {?} route
+     * @param {?} state
+     * @return {?}
+     */
+    PlaceRouteGuard.prototype.canActivate = /**
+     * @param {?} route
+     * @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;
+    };
+    PlaceRouteGuard.decorators = [
+        { type: Injectable, args: [{
+                    providedIn: 'root'
+                },] }
+    ];
+    /** @nocollapse */
+    PlaceRouteGuard.ctorParameters = function () { return [
+        { type: PlaceService },
+        { type: Router }
+    ]; };
+    /** @nocollapse */ PlaceRouteGuard.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouteGuard_Factory() { return new PlaceRouteGuard(ɵɵinject(PlaceService), ɵɵinject(Router)); }, token: PlaceRouteGuard, providedIn: "root" });
+    return PlaceRouteGuard;
+}());
+if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceRouteGuard.prototype.placeService;
+    /**
+     * @type {?}
+     * @private
+     */
+    PlaceRouteGuard.prototype.router;
+}
+
 /**
- * @abstract
- * @template T, S
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-var  /**
- * @abstract
+/**
  * @template T, S
  */
-Sanitiser = /** @class */ (function () {
-    function Sanitiser(parameterDef, snapshot, sanitiser) {
-        this.parameterDef = parameterDef;
-        this.snapshot = snapshot;
-        this.sanitiser = sanitiser;
+var DefaultParameterSanitiser = /** @class */ (function () {
+    function DefaultParameterSanitiser(def, placeService, options) {
+        this.def = def;
+        this.placeService = placeService;
+        this.remember = isNil(options.remember) ? false : options.remember;
+        this.defaultValue = isNil(options.defaultValue) ? null : options.defaultValue;
     }
     /**
+     * @param {?} value
+     * @param {?} visit
      * @return {?}
      */
-    Sanitiser.prototype.isRouteId = /**
+    DefaultParameterSanitiser.prototype.sanitise = /**
+     * @param {?} value
+     * @param {?} visit
      * @return {?}
      */
-    function () {
-        return this.parameterDef.isRouteId;
+    function (value, visit) {
+        if (this.isBlank(value)) {
+            if (this.remember) {
+                // value = null;
+            }
+            return this.isBlank(value) && !isNil(this.defaultValue) ? this.defaultValue : value;
+        }
+        else {
+            return value;
+        }
     };
-    Object.defineProperty(Sanitiser.prototype, "valueChanged", {
-        get: /**
-         * @return {?}
-         */
-        function () {
-            return !isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(Sanitiser.prototype, "sanitisedValue", {
-        get: /**
-         * @return {?}
-         */
-        function () {
-            return this._sanitisedValue;
-        },
-        enumerable: true,
-        configurable: true
-    });
     /**
+     * @private
+     * @param {?} value
      * @return {?}
      */
-    Sanitiser.prototype.sanitize = /**
+    DefaultParameterSanitiser.prototype.isBlank = /**
+     * @private
+     * @param {?} value
      * @return {?}
      */
-    function () {
-        return __awaiter(this, void 0, void 0, function () {
-            var _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
-                    case 0:
-                        if (!this.sanitiser) return [3 /*break*/, 2];
-                        this.initialValue = this.readFrom(this.snapshot);
-                        _a = this;
-                        return [4 /*yield*/, this.sanitiser.sanitise(this.initialValue)];
-                    case 1:
-                        _a._sanitisedValue = _b.sent();
-                        if (this.initialValue !== this._sanitisedValue) {
-                            return [2 /*return*/, false];
-                        }
-                        _b.label = 2;
-                    case 2: return [2 /*return*/, true];
-                }
-            });
-        });
+    function (value) {
+        /** @type {?} */
+        var isNil$1 = isNil(value);
+        return this.def.isArray ? !isNil$1 || value['length'] < 1 : isNil$1;
     };
-    return Sanitiser;
+    __decorate([
+        Trace(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object, Object]),
+        __metadata("design:returntype", Object)
+    ], DefaultParameterSanitiser.prototype, "sanitise", null);
+    return DefaultParameterSanitiser;
 }());
 if (false) {
     /**
      * @type {?}
      * @private
      */
-    Sanitiser.prototype.initialValue;
+    DefaultParameterSanitiser.prototype.remember;
     /**
      * @type {?}
      * @private
      */
-    Sanitiser.prototype._sanitisedValue;
-    /** @type {?} */
-    Sanitiser.prototype.parameterDef;
-    /** @type {?} */
-    Sanitiser.prototype.snapshot;
-    /** @type {?} */
-    Sanitiser.prototype.sanitiser;
-    /**
-     * @abstract
-     * @protected
-     * @param {?} snapshot
-     * @return {?}
-     */
-    Sanitiser.prototype.readFrom = function (snapshot) { };
+    DefaultParameterSanitiser.prototype.defaultValue;
     /**
-     * @abstract
-     * @protected
-     * @param {?} initialValue
-     * @param {?} sanitisedValue
-     * @return {?}
+     * @type {?}
+     * @private
      */
-    Sanitiser.prototype.hasChanged = function (initialValue, sanitisedValue) { };
+    DefaultParameterSanitiser.prototype.def;
     /**
-     * @abstract
-     * @param {?} dest
-     * @return {?}
+     * @type {?}
+     * @private
      */
-    Sanitiser.prototype.injectRouteParam = function (dest) { };
+    DefaultParameterSanitiser.prototype.placeService;
 }
-var RouteParameterSanitiser = /** @class */ (function () {
-    function RouteParameterSanitiser(parameterDefs, snapshot, injector) {
-        var _this = this;
-        this.parameterDefs = parameterDefs;
-        this.snapshot = snapshot;
-        this.injector = injector;
-        this.parameterSanitisers = [];
-        /** @type {?} */
-        var sanitisers = parameterDefs.map((/**
-         * @param {?} def
-         * @return {?}
-         */
-        function (def) {
-            return def.isArray ?
-                new Sanitiser.Array(def, snapshot, _this.getSanitiser(def)) :
-                new Sanitiser.Value(def, snapshot, _this.getSanitiser(def));
-        }));
-        this.routeIdSanitiser = sanitisers.find((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) { return p.isRouteId(); }));
-        this.parameterSanitisers = sanitisers.filter((/**
-         * @param {?} p
-         * @return {?}
-         */
-        function (p) { return !p.isRouteId(); }));
-    }
-    /**
-     * @return {?}
-     */
-    RouteParameterSanitiser.prototype.sanitise = /**
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ */
+function JsonArray() { }
+/**
+ * @record
+ */
+function JsonMap() { }
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ * @template T
+ */
+function ParameterOptions() { }
+if (false) {
+    /** @type {?|undefined} */
+    ParameterOptions.prototype.as;
+    /** @type {?|undefined} */
+    ParameterOptions.prototype.optional;
+    /** @type {?|undefined} */
+    ParameterOptions.prototype.remember;
+    /** @type {?|undefined} */
+    ParameterOptions.prototype.defaultValue;
+    /** @type {?|undefined} */
+    ParameterOptions.prototype.sanitiser;
+}
+/**
+ * @record
+ * @template T
+ */
+function ListParameterOptions() { }
+if (false) {
+    /** @type {?|undefined} */
+    ListParameterOptions.prototype.as;
+    /** @type {?|undefined} */
+    ListParameterOptions.prototype.optional;
+    /** @type {?|undefined} */
+    ListParameterOptions.prototype.remember;
+    /** @type {?|undefined} */
+    ListParameterOptions.prototype.defaultValue;
+    /** @type {?|undefined} */
+    ListParameterOptions.prototype.sanitiser;
+}
+/**
+ * @template T
+ * @param {?} type
+ * @param {?=} options
+ * @return {?}
+ */
+function RouteId(type, options) {
+    // assert.isTruthy(type.isValid());
+    return (/**
+     * @param {?} prototype
+     * @param {?} propertyKey
      * @return {?}
      */
-    function () {
-        return __awaiter(this, void 0, void 0, function () {
-            var e_1, _a, _b, _c, sanitiser, e_1_1;
-            return __generator(this, function (_d) {
-                switch (_d.label) {
-                    case 0:
-                        if (!this.routeIdSanitiser) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.routeIdSanitiser.sanitize()];
-                    case 1:
-                        _d.sent();
-                        if (this.routeIdSanitiser.valueChanged) {
-                            // if the route id isn't ok we redirect immediately as the query params may need to be sanitised in the
-                            // context of the route id.
-                            return [2 /*return*/, false];
-                        }
-                        _d.label = 2;
-                    case 2:
-                        _d.trys.push([2, 7, 8, 9]);
-                        _b = __values(this.parameterSanitisers), _c = _b.next();
-                        _d.label = 3;
-                    case 3:
-                        if (!!_c.done) return [3 /*break*/, 6];
-                        sanitiser = _c.value;
-                        return [4 /*yield*/, sanitiser.sanitize()];
-                    case 4:
-                        _d.sent();
-                        _d.label = 5;
-                    case 5:
-                        _c = _b.next();
-                        return [3 /*break*/, 3];
-                    case 6: return [3 /*break*/, 9];
-                    case 7:
-                        e_1_1 = _d.sent();
-                        e_1 = { error: e_1_1 };
-                        return [3 /*break*/, 9];
-                    case 8:
-                        try {
-                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                        return [7 /*endfinally*/];
-                    case 9: return [2 /*return*/, !this.parameterSanitisers.find((/**
-                         * @param {?} s
-                         * @return {?}
-                         */
-                        function (s) { return s.valueChanged; }))];
-                }
-            });
-        });
-    };
-    /**
-     * @param {?} router
+    function (prototype, propertyKey) {
+        /** @type {?} */
+        var param = createDefinition(propertyKey, type, options, true);
+        Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
+        UseDelegate()(prototype, propertyKey);
+    });
+}
+/**
+ * @template T
+ * @param {?} type
+ * @param {?=} options
+ * @return {?}
+ */
+function RouteParameter(type, options) {
+    // assert.isTruthy(type.isValid());
+    return (/**
+     * @param {?} prototype
+     * @param {?} propertyKey
      * @return {?}
      */
-    RouteParameterSanitiser.prototype.redirect = /**
-     * @param {?} router
+    function (prototype, propertyKey) {
+        /** @type {?} */
+        var param = createDefinition(propertyKey, type, options, false);
+        Klass.get(prototype).addToOwnMetadataList(ROUTE_PARAMETER_LIST_KEY, param);
+        UseDelegate()(prototype, propertyKey);
+    });
+}
+/**
+ * @template E
+ * @param {?} elementType
+ * @param {?=} options
+ * @return {?}
+ */
+function RouteParameterList(elementType, options) {
+    // assert.isTruthy(type.isValid());
+    return (/**
+     * @param {?} prototype
+     * @param {?} propertyKey
      * @return {?}
      */
-    function (router) {
-        assert.isTruthy(this.parameterSanitisers.length !== 0);
-        if (this.routeIdSanitiser.valueChanged) {
-            return router.navigate(['..', this.routeIdSanitiser.sanitisedValue]);
-        }
-        else {
-            /** @type {?} */
-            var routeParams_1 = {};
-            this.parameterSanitisers.forEach((/**
-             * @param {?} s
-             * @return {?}
-             */
-            function (s) { return s.injectRouteParam(routeParams_1); }));
-            return router.navigate(['.', routeParams_1]);
-        }
+    function (prototype, propertyKey) {
+        /** @type {?} */
+        var param = createArrayDefinition(propertyKey, 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
     };
-    /**
-     * @private
-     * @template T, S
-     * @param {?} def
-     * @return {?}
-     */
-    RouteParameterSanitiser.prototype.getSanitiser = /**
-     * @private
-     * @template T, S
-     * @param {?} def
-     * @return {?}
-     */
-    function (def) {
-        return def.sanitiser ? this.injector.get(def.sanitiser, new def.sanitiser()) : null;
+    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
     };
-    __decorate([
-        Memoize$1(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [Object]),
-        __metadata("design:returntype", Object)
-    ], RouteParameterSanitiser.prototype, "getSanitiser", null);
-    return RouteParameterSanitiser;
-}());
+    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 {?}
-     * @private
-     */
-    RouteParameterSanitiser.prototype.routeIdSanitiser;
-    /**
-     * @type {?}
-     * @private
-     */
-    RouteParameterSanitiser.prototype.parameterSanitisers;
     /** @type {?} */
-    RouteParameterSanitiser.prototype.parameterDefs;
+    ParameterDefinition.prototype.name;
     /** @type {?} */
-    RouteParameterSanitiser.prototype.snapshot;
+    ParameterDefinition.prototype.propertyName;
     /** @type {?} */
-    RouteParameterSanitiser.prototype.injector;
+    ParameterDefinition.prototype.type;
+    /** @type {?} */
+    ParameterDefinition.prototype.sanitiser;
+    /** @type {?} */
+    ParameterDefinition.prototype.isRouteId;
+    /** @type {?} */
+    ParameterDefinition.prototype.isArray;
 }
-(function (Sanitiser) {
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @record
+ * @template T
+ */
+function ParameterSanitiser() { }
+if (false) {
     /**
-     * @template T
+     * @param {?} value
+     * @param {?=} visit
+     * @return {?}
      */
-    var /**
+    ParameterSanitiser.prototype.sanitise = function (value, visit) { };
+}
+(function (ParameterSanitiser) {
+    /**
+     * @record
      * @template T
      */
-    Value = /** @class */ (function (_super) {
-        __extends(Value, _super);
-        function Value() {
-            return _super !== null && _super.apply(this, arguments) || this;
+    function Options() { }
+    ParameterSanitiser.Options = Options;
+    if (false) {
+        /** @type {?|undefined} */
+        Options.prototype.remember;
+        /** @type {?|undefined} */
+        Options.prototype.defaultValue;
+    }
+})(ParameterSanitiser || (ParameterSanitiser = {}));
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+// WARNING: interface has both a type and a value, skipping emit
+var ParameterType;
+(function (ParameterType) {
+    var StringType = /** @class */ (function () {
+        function StringType() {
         }
         /**
-         * @param {?} snapshot
+         * @param {?} value
          * @return {?}
          */
-        Value.prototype.readFrom = /**
-         * @param {?} snapshot
+        StringType.prototype.format = /**
+         * @param {?} value
          * @return {?}
          */
-        function (snapshot) {
-            /** @type {?} */
-            var rawValue = this.parameterDef.isRouteId ?
-                snapshot.paramMap.get(this.parameterDef.name) :
-                snapshot.queryParamMap.get(this.parameterDef.name);
-            return this.parameterDef.type.parse(rawValue);
+        function (value) {
+            return value;
         };
         /**
-         * @protected
-         * @param {?} initialValue
-         * @param {?} sanitisedValue
+         * @param {?} value
          * @return {?}
          */
-        Value.prototype.hasChanged = /**
-         * @protected
-         * @param {?} initialValue
-         * @param {?} sanitisedValue
+        StringType.prototype.parse = /**
+         * @param {?} value
          * @return {?}
          */
-        function (initialValue, sanitisedValue) {
-            return initialValue !== sanitisedValue;
+        function (value) {
+            return value;
         };
+        return StringType;
+    }());
+    var NumberType = /** @class */ (function () {
+        function NumberType() {
+        }
         /**
-         * @param {?} dest
+         * @param {?} value
          * @return {?}
          */
-        Value.prototype.injectRouteParam = /**
-         * @param {?} dest
+        NumberType.prototype.format = /**
+         * @param {?} value
          * @return {?}
          */
-        function (dest) {
-            dest[this.parameterDef.name] = this.parameterDef.type.format(this.sanitisedValue);
+        function (value) {
+            return "" + value;
         };
-        return Value;
-    }(Sanitiser));
-    Sanitiser.Value = Value;
-    /**
-     * @template T
-     */
-    var /**
-     * @template T
-     */
-    Array = /** @class */ (function (_super) {
-        __extends(Array, _super);
-        function Array() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
         /**
-         * @param {?} snapshot
+         * @param {?} value
          * @return {?}
          */
-        Array.prototype.readFrom = /**
-         * @param {?} snapshot
+        NumberType.prototype.parse = /**
+         * @param {?} value
          * @return {?}
          */
-        function (snapshot) {
-            var _this = this;
-            /** @type {?} */
-            var rawValues = snapshot.queryParamMap.getAll(this.parameterDef.name);
-            return rawValues.map((/**
-             * @param {?} value
-             * @return {?}
-             */
-            function (value) { return _this.parameterDef.type.parse(value); }));
+        function (value) {
+            return isNil(value) || isEmpty(value) ? null : +value;
         };
+        return NumberType;
+    }());
+    var BooleanType = /** @class */ (function () {
+        function BooleanType() {
+        }
         /**
-         * @protected
-         * @param {?} initialValue
-         * @param {?} sanitisedValue
+         * @param {?} value
          * @return {?}
          */
-        Array.prototype.hasChanged = /**
-         * @protected
-         * @param {?} initialValue
-         * @param {?} sanitisedValue
+        BooleanType.prototype.format = /**
+         * @param {?} value
          * @return {?}
          */
-        function (initialValue, sanitisedValue) {
-            return initialValue !== sanitisedValue;
+        function (value) {
+            return value ? 'true' : 'false';
         };
         /**
-         * @param {?} dest
+         * @param {?} value
+         * @return {?}
+         */
+        BooleanType.prototype.parse = /**
+         * @param {?} value
+         * @return {?}
+         */
+        function (value) {
+            return value === 'true';
+        };
+        return BooleanType;
+    }());
+    ParameterType.STRING = new StringType();
+    ParameterType.NUMBER = new NumberType();
+    ParameterType.BOOLEAN = new BooleanType();
+})(ParameterType || (ParameterType = {}));
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+/**
+ * @template T, S
+ */
+var  /**
+ * @template T, S
+ */
+Sanitiser = /** @class */ (function () {
+    function Sanitiser(parameterDef, snapshot, sanitiser) {
+        this.parameterDef = parameterDef;
+        this.snapshot = snapshot;
+        this.sanitiser = sanitiser;
+    }
+    /**
+     * @return {?}
+     */
+    Sanitiser.prototype.isRouteId = /**
+     * @return {?}
+     */
+    function () {
+        return this.parameterDef.isRouteId;
+    };
+    Object.defineProperty(Sanitiser.prototype, "valueChanged", {
+        get: /**
+         * @return {?}
+         */
+        function () {
+            return !isNil(this.initialValue) && this.hasChanged(this.initialValue, this.sanitisedValue);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(Sanitiser.prototype, "sanitisedValue", {
+        get: /**
+         * @return {?}
+         */
+        function () {
+            return this._sanitisedValue;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    /**
+     * @protected
+     * @param {?} snapshot
+     * @return {?}
+     */
+    Sanitiser.prototype.readFrom = /**
+     * @protected
+     * @param {?} snapshot
+     * @return {?}
+     */
+    function (snapshot) {
+        return lang.abstractMethod(this.constructor);
+    };
+    /**
+     * @protected
+     * @param {?} initialValue
+     * @param {?} sanitisedValue
+     * @return {?}
+     */
+    Sanitiser.prototype.hasChanged = /**
+     * @protected
+     * @param {?} initialValue
+     * @param {?} sanitisedValue
+     * @return {?}
+     */
+    function (initialValue, sanitisedValue) {
+        return lang.abstractMethod(this.constructor);
+    };
+    /**
+     * @param {?} dest
+     * @return {?}
+     */
+    Sanitiser.prototype.injectRouteParam = /**
+     * @param {?} dest
+     * @return {?}
+     */
+    function (dest) {
+        lang.abstractMethod(this.constructor);
+    };
+    /**
+     * @return {?}
+     */
+    Sanitiser.prototype.sanitize = /**
+     * @return {?}
+     */
+    function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var _a;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        if (!this.sanitiser) return [3 /*break*/, 2];
+                        this.initialValue = this.readFrom(this.snapshot);
+                        _a = this;
+                        return [4 /*yield*/, this.sanitiser.sanitise(this.initialValue)];
+                    case 1:
+                        _a._sanitisedValue = _b.sent();
+                        if (this.initialValue !== this._sanitisedValue) {
+                            return [2 /*return*/, false];
+                        }
+                        _b.label = 2;
+                    case 2: return [2 /*return*/, true];
+                }
+            });
+        });
+    };
+    return Sanitiser;
+}());
+if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    Sanitiser.prototype.initialValue;
+    /**
+     * @type {?}
+     * @private
+     */
+    Sanitiser.prototype._sanitisedValue;
+    /** @type {?} */
+    Sanitiser.prototype.parameterDef;
+    /** @type {?} */
+    Sanitiser.prototype.snapshot;
+    /** @type {?} */
+    Sanitiser.prototype.sanitiser;
+}
+var RouteParameterSanitiser = /** @class */ (function () {
+    function RouteParameterSanitiser(parameterDefs, snapshot, placeService, injector) {
+        var _this = this;
+        this.parameterDefs = parameterDefs;
+        this.snapshot = snapshot;
+        this.placeService = placeService;
+        this.injector = injector;
+        this.parameterSanitisers = [];
+        /** @type {?} */
+        var sanitisers = parameterDefs.map((/**
+         * @param {?} def
          * @return {?}
          */
-        Array.prototype.injectRouteParam = /**
-         * @param {?} dest
+        function (def) {
+            return def.isArray ?
+                new Sanitiser.Array(def, snapshot, _this.getSanitiser(def)) :
+                new Sanitiser.Value(def, snapshot, _this.getSanitiser(def));
+        }));
+        this.routeIdSanitiser = sanitisers.find((/**
+         * @param {?} p
          * @return {?}
          */
-        function (dest) {
-            var _this = this;
-            dest[this.parameterDef.name] = this.sanitisedValue.map((/**
-             * @param {?} v
-             * @return {?}
-             */
-            function (v) { return _this.parameterDef.type.format(v); }));
-        };
-        return Array;
-    }(Sanitiser));
-    Sanitiser.Array = Array;
-})(Sanitiser || (Sanitiser = {}));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var PlaceRouteGuard = /** @class */ (function () {
-    function PlaceRouteGuard(router, injector) {
-        this.router = router;
-        this.injector = injector;
+        function (p) { return p.isRouteId(); }));
+        this.parameterSanitisers = sanitisers.filter((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) { return !p.isRouteId(); }));
     }
     /**
-     * @param {?} route
-     * @param {?} state
      * @return {?}
      */
-    PlaceRouteGuard.prototype.canActivate = /**
-     * @param {?} route
-     * @param {?} state
+    RouteParameterSanitiser.prototype.sanitise = /**
      * @return {?}
      */
-    function (route, state) {
-        var _this = this;
-        /** @type {?} */
-        var routeParameters = Klass.get(route.component).getMetadataList(RouteParameterBindings.ROUTE_PARAMETER_LIST_KEY);
-        /** @type {?} */
-        var sanitiser = new RouteParameterSanitiser(routeParameters, route, this.injector);
-        return sanitiser.sanitise().then((/**
-         * @param {?} proceed
-         * @return {?}
-         */
-        function (proceed) {
-            if (!proceed) {
-                sanitiser.redirect(_this.router);
-            }
-            return proceed;
-        }));
+    function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var e_1, _a, _b, _c, sanitiser, e_1_1;
+            return __generator(this, function (_d) {
+                switch (_d.label) {
+                    case 0:
+                        if (!this.routeIdSanitiser) return [3 /*break*/, 2];
+                        return [4 /*yield*/, this.routeIdSanitiser.sanitize()];
+                    case 1:
+                        _d.sent();
+                        if (this.routeIdSanitiser.valueChanged) {
+                            // if the route id isn't ok we redirect immediately as the query params may need to be sanitised in the
+                            // context of the route id.
+                            return [2 /*return*/, false];
+                        }
+                        _d.label = 2;
+                    case 2:
+                        _d.trys.push([2, 7, 8, 9]);
+                        _b = __values(this.parameterSanitisers), _c = _b.next();
+                        _d.label = 3;
+                    case 3:
+                        if (!!_c.done) return [3 /*break*/, 6];
+                        sanitiser = _c.value;
+                        return [4 /*yield*/, sanitiser.sanitize()];
+                    case 4:
+                        _d.sent();
+                        _d.label = 5;
+                    case 5:
+                        _c = _b.next();
+                        return [3 /*break*/, 3];
+                    case 6: return [3 /*break*/, 9];
+                    case 7:
+                        e_1_1 = _d.sent();
+                        e_1 = { error: e_1_1 };
+                        return [3 /*break*/, 9];
+                    case 8:
+                        try {
+                            if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                        return [7 /*endfinally*/];
+                    case 9: return [2 /*return*/, !this.parameterSanitisers.find((/**
+                         * @param {?} s
+                         * @return {?}
+                         */
+                        function (s) { return s.valueChanged; }))];
+                }
+            });
+        });
     };
-    PlaceRouteGuard.decorators = [
-        { type: Injectable, args: [{
-                    providedIn: 'root'
-                },] }
-    ];
-    /** @nocollapse */
-    PlaceRouteGuard.ctorParameters = function () { return [
-        { type: Router },
-        { type: Injector }
-    ]; };
-    /** @nocollapse */ PlaceRouteGuard.ngInjectableDef = ɵɵdefineInjectable({ factory: function PlaceRouteGuard_Factory() { return new PlaceRouteGuard(ɵɵinject(Router), ɵɵinject(INJECTOR)); }, token: PlaceRouteGuard, providedIn: "root" });
-    __decorate([
-        Trace(),
-        __metadata("design:type", Function),
-        __metadata("design:paramtypes", [ActivatedRouteSnapshot, RouterStateSnapshot]),
-        __metadata("design:returntype", Object)
-    ], PlaceRouteGuard.prototype, "canActivate", null);
-    return PlaceRouteGuard;
-}());
-if (false) {
     /**
-     * @type {?}
      * @private
+     * @template T, S
+     * @param {?} def
+     * @return {?}
      */
-    PlaceRouteGuard.prototype.router;
-    /**
-     * @type {?}
+    RouteParameterSanitiser.prototype.getSanitiser = /**
      * @private
-     */
-    PlaceRouteGuard.prototype.injector;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- */
-function JsonArray() { }
-/**
- * @record
- */
-function JsonMap() { }
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- * @template T
- */
-function ParameterOptions() { }
-if (false) {
-    /** @type {?|undefined} */
-    ParameterOptions.prototype.as;
-    /** @type {?|undefined} */
-    ParameterOptions.prototype.optional;
-    /** @type {?|undefined} */
-    ParameterOptions.prototype.sanitiser;
-}
-/**
- * @record
- * @template T
- */
-function ListParameterOptions() { }
-if (false) {
-    /** @type {?|undefined} */
-    ListParameterOptions.prototype.as;
-    /** @type {?|undefined} */
-    ListParameterOptions.prototype.optional;
-    /** @type {?|undefined} */
-    ListParameterOptions.prototype.listSanitiser;
-}
-/**
- * @template T
- * @param {?} type
- * @param {?=} options
- * @return {?}
- */
-function RouteId(type, options) {
-    // assert.isTruthy(type.isValid());
-    return (/**
-     * @param {?} prototype
-     * @param {?} propertyKey
+     * @template T, S
+     * @param {?} def
      * @return {?}
      */
-    function (prototype, propertyKey) {
-        /** @type {?} */
-        var param = createDefinition(propertyKey, type, options, true);
-        Klass.get(prototype).addToOwnMetadataList(RouteParameterBindings.ROUTE_PARAMETER_LIST_KEY, param);
-        UseDelegate()(prototype, propertyKey);
-    });
-}
-/**
- * @template T
- * @param {?} type
- * @param {?=} options
- * @return {?}
- */
-function RouteParameter(type, options) {
-    // assert.isTruthy(type.isValid());
-    return (/**
-     * @param {?} prototype
-     * @param {?} propertyKey
+    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 {?}
      */
-    function (prototype, propertyKey) {
-        /** @type {?} */
-        var param = createDefinition(propertyKey, type, options, false);
-        Klass.get(prototype).addToOwnMetadataList(RouteParameterBindings.ROUTE_PARAMETER_LIST_KEY, param);
-        UseDelegate()(prototype, propertyKey);
-    });
-}
-/**
- * @template E
- * @param {?} elementType
- * @param {?=} options
- * @return {?}
- */
-function RouteParameterList(elementType, options) {
-    // assert.isTruthy(type.isValid());
-    return (/**
-     * @param {?} prototype
-     * @param {?} propertyKey
+    RouteParameterSanitiser.prototype.routeIdHasChanged = /**
      * @return {?}
      */
-    function (prototype, propertyKey) {
-        /** @type {?} */
-        var param = createArrayDefinition(propertyKey, elementType, options);
-        Klass.get(prototype).addToOwnMetadataList(RouteParameterBindings.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
+    function () {
+        assert.isTruthy(this.parameterSanitisers.length !== 0);
+        return this.routeIdSanitiser && this.routeIdSanitiser.valueChanged;
+    };
+    /**
+     * @return {?}
+     */
+    RouteParameterSanitiser.prototype.getRedirectParams = /**
+     * @return {?}
+     */
+    function () {
+        if (this.routeIdHasChanged()) {
+            return [this.routeIdSanitiser.sanitisedValue];
+        }
+        else {
+            /** @type {?} */
+            var routeParams_1 = {};
+            this.parameterSanitisers.forEach((/**
+             * @param {?} s
+             * @return {?}
+             */
+            function (s) { return s.injectRouteParam(routeParams_1); }));
+            return [routeParams_1];
+        }
     };
-    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('listSanitiser', null),
-        isRouteId: false,
-        isArray: true
+    /**
+     * @private
+     * @template S
+     * @param {?} value
+     * @return {?}
+     */
+    RouteParameterSanitiser.prototype.isSanitiserContructor = /**
+     * @private
+     * @template S
+     * @param {?} value
+     * @return {?}
+     */
+    function (value) {
+        return isFunction(value) && lang.constructorChain((/** @type {?} */ ((/** @type {?} */ (value))))).includes(Sanitiser);
     };
-    return def;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- * @template E, S
- */
-function ParameterDefinition() { }
+    __decorate([
+        Memoize(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", Object)
+    ], RouteParameterSanitiser.prototype, "getSanitiser", null);
+    __decorate([
+        Trace(),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", Array)
+    ], RouteParameterSanitiser.prototype, "getRedirectParams", null);
+    return RouteParameterSanitiser;
+}());
 if (false) {
+    /**
+     * @type {?}
+     * @private
+     */
+    RouteParameterSanitiser.prototype.routeIdSanitiser;
+    /**
+     * @type {?}
+     * @private
+     */
+    RouteParameterSanitiser.prototype.parameterSanitisers;
     /** @type {?} */
-    ParameterDefinition.prototype.name;
-    /** @type {?} */
-    ParameterDefinition.prototype.propertyName;
-    /** @type {?} */
-    ParameterDefinition.prototype.type;
+    RouteParameterSanitiser.prototype.parameterDefs;
     /** @type {?} */
-    ParameterDefinition.prototype.sanitiser;
+    RouteParameterSanitiser.prototype.snapshot;
     /** @type {?} */
-    ParameterDefinition.prototype.isRouteId;
+    RouteParameterSanitiser.prototype.placeService;
     /** @type {?} */
-    ParameterDefinition.prototype.isArray;
+    RouteParameterSanitiser.prototype.injector;
 }
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- * @template T
- */
-function ParameterSanitiser() { }
-if (false) {
+(function (Sanitiser) {
     /**
-     * @param {?} value
-     * @return {?}
+     * @template T
      */
-    ParameterSanitiser.prototype.sanitise = function (value) { };
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-// WARNING: interface has both a type and a value, skipping emit
-var ParameterType;
-(function (ParameterType) {
-    var StringType = /** @class */ (function () {
-        function StringType() {
+    var /**
+     * @template T
+     */
+    Value = /** @class */ (function (_super) {
+        __extends(Value, _super);
+        function Value() {
+            return _super !== null && _super.apply(this, arguments) || this;
         }
         /**
-         * @param {?} value
+         * @param {?} snapshot
          * @return {?}
          */
-        StringType.prototype.format = /**
-         * @param {?} value
+        Value.prototype.readFrom = /**
+         * @param {?} snapshot
          * @return {?}
          */
-        function (value) {
-            return value;
+        function (snapshot) {
+            /** @type {?} */
+            var rawValue = snapshot.paramMap.get(this.parameterDef.name);
+            return this.parameterDef.type.parse(rawValue);
         };
         /**
-         * @param {?} value
+         * @protected
+         * @param {?} initialValue
+         * @param {?} sanitisedValue
          * @return {?}
          */
-        StringType.prototype.parse = /**
-         * @param {?} value
+        Value.prototype.hasChanged = /**
+         * @protected
+         * @param {?} initialValue
+         * @param {?} sanitisedValue
          * @return {?}
          */
-        function (value) {
-            return value;
+        function (initialValue, sanitisedValue) {
+            return initialValue !== sanitisedValue;
         };
-        return StringType;
-    }());
-    var NumberType = /** @class */ (function () {
-        function NumberType() {
-        }
         /**
-         * @param {?} value
+         * @param {?} dest
          * @return {?}
          */
-        NumberType.prototype.format = /**
-         * @param {?} value
+        Value.prototype.injectRouteParam = /**
+         * @param {?} dest
          * @return {?}
          */
-        function (value) {
-            return "" + value;
+        function (dest) {
+            dest[this.parameterDef.name] = this.parameterDef.type.format(this.sanitisedValue);
         };
+        return Value;
+    }(Sanitiser));
+    Sanitiser.Value = Value;
+    /**
+     * @template T
+     */
+    var /**
+     * @template T
+     */
+    Array = /** @class */ (function (_super) {
+        __extends(Array, _super);
+        function Array() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
         /**
-         * @param {?} value
+         * @param {?} snapshot
          * @return {?}
          */
-        NumberType.prototype.parse = /**
-         * @param {?} value
+        Array.prototype.readFrom = /**
+         * @param {?} snapshot
          * @return {?}
          */
-        function (value) {
-            return +value;
+        function (snapshot) {
+            var _this = this;
+            /** @type {?} */
+            var rawValues = snapshot.paramMap.getAll(this.parameterDef.name);
+            return rawValues.map((/**
+             * @param {?} value
+             * @return {?}
+             */
+            function (value) { return _this.parameterDef.type.parse(value); }));
         };
-        return NumberType;
-    }());
-    var BooleanType = /** @class */ (function () {
-        function BooleanType() {
-        }
         /**
-         * @param {?} value
+         * @protected
+         * @param {?} initialValue
+         * @param {?} sanitisedValue
          * @return {?}
          */
-        BooleanType.prototype.format = /**
-         * @param {?} value
+        Array.prototype.hasChanged = /**
+         * @protected
+         * @param {?} initialValue
+         * @param {?} sanitisedValue
          * @return {?}
          */
-        function (value) {
-            return value ? 'true' : 'false';
+        function (initialValue, sanitisedValue) {
+            return initialValue !== sanitisedValue;
         };
         /**
-         * @param {?} value
+         * @param {?} dest
          * @return {?}
          */
-        BooleanType.prototype.parse = /**
-         * @param {?} value
+        Array.prototype.injectRouteParam = /**
+         * @param {?} dest
          * @return {?}
          */
-        function (value) {
-            return value === 'true';
+        function (dest) {
+            var _this = this;
+            dest[this.parameterDef.name] = this.sanitisedValue.map((/**
+             * @param {?} v
+             * @return {?}
+             */
+            function (v) { return _this.parameterDef.type.format(v); }));
         };
-        return BooleanType;
-    }());
-    ParameterType.STRING = new StringType();
-    ParameterType.NUMBER = new NumberType();
-    ParameterType.BOOLEAN = new BooleanType();
-})(ParameterType || (ParameterType = {}));
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-/**
- * @record
- * @template T
- */
-function ResolvedParameter() { }
-if (false) {
-    /** @type {?} */
-    ResolvedParameter.prototype.parameterDef;
-    /** @type {?} */
-    ResolvedParameter.prototype.resolvedValue;
-}
-
-/**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-var VisitSnapshot = /** @class */ (function () {
-    function VisitSnapshot() {
-    }
-    return VisitSnapshot;
-}());
+        return Array;
+    }(Sanitiser));
+    Sanitiser.Array = Array;
+})(Sanitiser || (Sanitiser = {}));
 
 /**
  * @fileoverview added by tsickle
@@ -3895,5 +4624,5 @@ var VisitSnapshot = /** @class */ (function () {
  * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { ACTIVITY_DATA, AbstractActivity, AbstractInputComponent, ActivityContainerComponent, ActivityOutletComponent, AlertDialogComponent, AngularUiPowerupsModule, Bounds, BusyOverlayComponent, CommandDirective, ConfirmationDialogComponent, DEFINITION_META_DATA_KEY, DialogInteractionService, Dimension, DisposableComponent, EmptyStateComponent, FocusBindingDirective, INTERACTION_CONTEXT, InteractionContext, InteractionModule, LEFT_RIGHT_PLACE_ANIMATION, LeavePlaceGuard, NumberInputComponent, ParameterType, PasswordInputComponent, Place, PlaceComponent, PlaceModule, PlaceOutletComponent, PlaceRouteGuard, PlaceService, Point, ResizeAwareComponent, ResolvedRouteParameterSnapshot, RouteId, RouteParameter, RouteParameterBindings, RouteParameterList, RouteParameterSanitiser, Sanitiser, SelectInputComponent, StringInputComponent, TabbedPlaceNavigationComponent, VisitSnapshot, slideDownAndUpAnimation, CommandDirective as ɵa, FocusBindingDirective as ɵb, 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, LEFT_RIGHT_PLACE_ANIMATION as ɵm, PlaceService as ɵn, TabbedPlaceNavigationComponent as ɵo, InteractionModule as ɵp, ActivityContainerComponent as ɵq, ActivityOutletComponent as ɵr, ConfirmationDialogComponent as ɵs, AbstractActivity as ɵt, ACTIVITY_DATA as ɵu, AlertDialogComponent as ɵw, DialogInteractionService as ɵy, InteractionContext 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, 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 };
 //# sourceMappingURL=coolon-angular-ui-powerups.js.map