@coolon/angular-ui-powerups 0.0.63 → 0.0.65

package/bundles/coolon-angular-ui-powerups.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/material'), require('@angular/material/tabs'), require('@angular/platform-browser/animations'), require('@coolon/pectin'), require('@angular/cdk/portal'), require('@coolon/typescript-utilities'), require('@angular/material/dialog'), require('@angular/router'), require('@angular/material/icon'), require('@angular/material/list'), require('@angular/material/tooltip'), require('@typescript-plus/fast-memoize-decorator/dist/src'), require('@typescript-plus/fast-memoize-decorator'), require('reflect-metadata'), require('lodash'), require('@angular/animations'), require('resize-observer-polyfill')) :
-    typeof define === 'function' && define.amd ? define('@coolon/angular-ui-powerups', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/material', '@angular/material/tabs', '@angular/platform-browser/animations', '@coolon/pectin', '@angular/cdk/portal', '@coolon/typescript-utilities', '@angular/material/dialog', '@angular/router', '@angular/material/icon', '@angular/material/list', '@angular/material/tooltip', '@typescript-plus/fast-memoize-decorator/dist/src', '@typescript-plus/fast-memoize-decorator', 'reflect-metadata', 'lodash', '@angular/animations', 'resize-observer-polyfill'], factory) :
-    (global = global || self, factory((global.coolon = global.coolon || {}, global.coolon['angular-ui-powerups'] = {}), global.ng.common, global.ng.core, global.ng.forms, global.ng.material, global.ng.material.tabs, global.ng.platformBrowser.animations, global.pectin, global.ng.cdk.portal, global.typescriptUtilities, global.ng.material.dialog, global.ng.router, global.ng.material.icon, global.ng.material.list, global.ng.material.tooltip, global.src, global.fastMemoizeDecorator, null, global.___default, global.ng.animations, global.ResizeObserver));
-}(this, function (exports, common, core, forms, material, tabs, animations, pectin, portal, typescriptUtilities, dialog, router, icon, list, tooltip, src, fastMemoizeDecorator, reflectMetadata, ___default, animations$1, ResizeObserver) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/forms'), require('@angular/material'), require('@angular/material/tabs'), require('@angular/platform-browser/animations'), require('@coolon/pectin'), require('@angular/cdk/portal'), require('lodash'), require('@coolon/typescript-utilities'), require('@angular/material/dialog'), require('uuid'), require('@angular/material/icon'), require('@angular/material/list'), require('@angular/material/tooltip'), require('@angular/router'), require('@typescript-plus/fast-memoize-decorator/dist/src'), require('@typescript-plus/fast-memoize-decorator'), require('reflect-metadata'), require('@angular/animations'), require('resize-observer-polyfill')) :
+    typeof define === 'function' && define.amd ? define('@coolon/angular-ui-powerups', ['exports', '@angular/common', '@angular/core', '@angular/forms', '@angular/material', '@angular/material/tabs', '@angular/platform-browser/animations', '@coolon/pectin', '@angular/cdk/portal', 'lodash', '@coolon/typescript-utilities', '@angular/material/dialog', 'uuid', '@angular/material/icon', '@angular/material/list', '@angular/material/tooltip', '@angular/router', '@typescript-plus/fast-memoize-decorator/dist/src', '@typescript-plus/fast-memoize-decorator', 'reflect-metadata', '@angular/animations', 'resize-observer-polyfill'], factory) :
+    (global = global || self, factory((global.coolon = global.coolon || {}, global.coolon['angular-ui-powerups'] = {}), global.ng.common, global.ng.core, global.ng.forms, global.ng.material, global.ng.material.tabs, global.ng.platformBrowser.animations, global.pectin, global.ng.cdk.portal, global.___default, global.typescriptUtilities, global.ng.material.dialog, global.uuid, global.ng.material.icon, global.ng.material.list, global.ng.material.tooltip, global.ng.router, global.src, global.fastMemoizeDecorator, null, global.ng.animations, global.ResizeObserver));
+}(this, function (exports, common, core, forms, material, tabs, animations, pectin, portal, ___default, typescriptUtilities, dialog, uuid, icon, list, tooltip, router, src, fastMemoizeDecorator, reflectMetadata, animations$1, ResizeObserver) { 'use strict';
 
     var ___default__default = 'default' in ___default ? ___default['default'] : ___default;
     ResizeObserver = ResizeObserver && ResizeObserver.hasOwnProperty('default') ? ResizeObserver['default'] : ResizeObserver;
@@ -991,15 +991,25 @@
         function InteractionContext() {
             return _super.call(this) || this;
         }
+        Object.defineProperty(InteractionContext.prototype, "currentActivity", {
+            /**
+             * Returns the activity that is currently active.
+             * This model is only updated in the next tick after the view has been updated.
+             */
+            get: /**
+             * Returns the activity that is currently active.
+             * This model is only updated in the next tick after the view has been updated.
+             * @return {?}
+             */
+            function () {
+                return ___default.last(this.activityList.value);
+            },
+            enumerable: true,
+            configurable: true
+        });
         return InteractionContext;
     }(pectin.GarbageCollector));
     if (false) {
-        /**
-         * Returns the activity that is currently active.
-         * This model is only updated in the next tick after the view has been updated.
-         * @type {?}
-         */
-        InteractionContext.prototype.currentActivity;
         /**
          * Returns the current list of activities that are in progress.
          * This model is only updated in the next tick after the view has been updated.
@@ -1051,29 +1061,121 @@
     /** @type {?} */
     var ACTIVITY_DATA = new core.InjectionToken('InteractionActivityData');
     /**
-     * @record
+     * @abstract
      * @template D, R, E
      */
-    function Activity() { }
-    if (false) {
-        /** @type {?} */
-        Activity.prototype.busy;
+      /**
+     * @abstract
+     * @template D, R, E
+     */
+    exports.ɵba = /** @class */ (function () {
+        function Activity() {
+            this._busyModel = new pectin.DelegatingValueModel().withDefault(false);
+        }
         /**
          * @param {?} activityContext
          * @return {?}
          */
-        Activity.prototype.initialise = function (activityContext) { };
+        Activity.prototype.initialise = /**
+         * @param {?} activityContext
+         * @return {?}
+         */
+        function (activityContext) {
+            typescriptUtilities.assert.isNil(this._activityContext);
+            this._activityContext = activityContext;
+        };
         /**
-         * @param {?} result
+         * @param {?=} result
          * @return {?}
          */
-        Activity.prototype.done = function (result) { };
+        Activity.prototype.done = /**
+         * @param {?=} result
+         * @return {?}
+         */
+        function (result) {
+            return this._activityContext.onDone(result);
+        };
         /**
-         * @param {?} e
+         * @param {?=} error
          * @return {?}
          */
-        Activity.prototype.cancel = function (e) { };
+        Activity.prototype.cancel = /**
+         * @param {?=} error
+         * @return {?}
+         */
+        function (error) {
+            this._activityContext.onCancel(error);
+        };
+        // @Trace()
+        // @Trace()
+        /**
+         * @return {?}
+         */
+        Activity.prototype.onActivityReady = 
+        // @Trace()
+        /**
+         * @return {?}
+         */
+        function () {
+        };
+        Object.defineProperty(Activity.prototype, "busy", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this._busyModel.readonly;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @param {?} busyModel
+         * @return {?}
+         */
+        Activity.prototype.busyWhile = /**
+         * @param {?} busyModel
+         * @return {?}
+         */
+        function (busyModel) {
+            this._busyModel.setDelegate(busyModel);
+        };
+        /**
+         * @return {?}
+         */
+        Activity.prototype.isBusy = /**
+         * @return {?}
+         */
+        function () {
+            return this._busyModel.value;
+        };
+        return Activity;
+    }());
+    if (false) {
+        /**
+         * @type {?}
+         * @private
+         */
+        exports.ɵba.prototype._busyModel;
+        /**
+         * @type {?}
+         * @private
+         */
+        exports.ɵba.prototype._activityContext;
     }
+    (function (Activity) {
+        /**
+         * @record
+         * @template R, E
+         */
+        function Callbacks() { }
+        Activity.Callbacks = Callbacks;
+        if (false) {
+            /** @type {?} */
+            Callbacks.prototype.onDone;
+            /** @type {?} */
+            Callbacks.prototype.onCancel;
+        }
+    })(exports.ɵba || (exports.ɵba = {}));
 
     /**
      * @fileoverview added by tsickle
@@ -1094,11 +1196,19 @@
             this.injector = injector;
         }
         Object.defineProperty(ActivityOutletComponent.prototype, "activityContext", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this._activityContext;
+            },
             set: /**
              * @param {?} activityContext
              * @return {?}
              */
             function (activityContext) {
+                pectin.assert.isNil(this._activityContext);
+                this._activityContext = activityContext;
                 this.loadActivity(activityContext);
             },
             enumerable: true,
@@ -1127,7 +1237,7 @@
                 providers: [
                     {
                         provide: InteractionContext,
-                        useValue: this
+                        useValue: this.interactionContext
                     },
                     { provide: ACTIVITY_DATA, useValue: activityContext.activityData }
                 ],
@@ -1138,6 +1248,9 @@
             this.viewContainerRef.clear();
             this.activityComponentRef = this.viewContainerRef.createComponent(componentFactory, 0, injector);
             this.activityComponentRef.instance.initialise(activityContext);
+            if (this.activityContext.componentReady) {
+                this.activityContext.componentReady(this.component);
+            }
         };
         Object.defineProperty(ActivityOutletComponent.prototype, "component", {
             get: /**
@@ -1149,71 +1262,6 @@
             enumerable: true,
             configurable: true
         });
-        /**
-         * @param {?} alert
-         * @return {?}
-         */
-        ActivityOutletComponent.prototype.alert = /**
-         * @param {?} alert
-         * @return {?}
-         */
-        function (alert) {
-            return this.interactionContext.alert(alert);
-        };
-        /**
-         * @param {?} confirm
-         * @return {?}
-         */
-        ActivityOutletComponent.prototype.confirm = /**
-         * @param {?} confirm
-         * @return {?}
-         */
-        function (confirm) {
-            return this.interactionContext.confirm(confirm);
-        };
-        /**
-         * @template D1, R1, E1
-         * @param {?} confirm
-         * @param {?} activityType
-         * @param {?=} data
-         * @return {?}
-         */
-        ActivityOutletComponent.prototype.confirmThen = /**
-         * @template D1, R1, E1
-         * @param {?} confirm
-         * @param {?} activityType
-         * @param {?=} data
-         * @return {?}
-         */
-        function (confirm, activityType, data) {
-            return this.interactionContext.confirmThen(confirm, activityType, data);
-        };
-        /**
-         * @template D1, R1, E1
-         * @param {?} activityType
-         * @param {?=} data
-         * @return {?}
-         */
-        ActivityOutletComponent.prototype.startActivity = /**
-         * @template D1, R1, E1
-         * @param {?} activityType
-         * @param {?=} data
-         * @return {?}
-         */
-        function (activityType, data) {
-            return this.interactionContext.startActivity(activityType, data);
-        };
-        /**
-         * @return {?}
-         */
-        ActivityOutletComponent.prototype.notifyReady = /**
-         * @return {?}
-         */
-        function () {
-            if (this.activityComponentRef.instance['onActivityReady']) {
-                this.activityComponentRef.instance['onActivityReady']();
-            }
-        };
         ActivityOutletComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'angular-ui-powerups-activity-outlet',
@@ -1236,6 +1284,11 @@
     if (false) {
         /** @type {?} */
         ActivityOutletComponent.prototype.interactionContext;
+        /**
+         * @type {?}
+         * @private
+         */
+        ActivityOutletComponent.prototype._activityContext;
         /**
          * @type {?}
          * @private
@@ -1264,108 +1317,22 @@
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     /**
+     * Deprecated. You can now extend the Activity class directly.
+     * @abstract
      * @template D, R, E
      */
     var   /**
+     * Deprecated. You can now extend the Activity class directly.
+     * @abstract
      * @template D, R, E
      */
     AbstractActivity = /** @class */ (function (_super) {
         __extends(AbstractActivity, _super);
         function AbstractActivity() {
-            var _this = _super !== null && _super.apply(this, arguments) || this;
-            _this._busyModel = new pectin.DelegatingValueModel().withDefault(false);
-            return _this;
+            return _super !== null && _super.apply(this, arguments) || this;
         }
-        /**
-         * @param {?} activityContext
-         * @return {?}
-         */
-        AbstractActivity.prototype.initialise = /**
-         * @param {?} activityContext
-         * @return {?}
-         */
-        function (activityContext) {
-            typescriptUtilities.assert.isNil(this.activityContext);
-            this.activityContext = activityContext;
-        };
-        /**
-         * @param {?=} result
-         * @return {?}
-         */
-        AbstractActivity.prototype.done = /**
-         * @param {?=} result
-         * @return {?}
-         */
-        function (result) {
-            return this.activityContext.onDone(result);
-        };
-        /**
-         * @param {?=} error
-         * @return {?}
-         */
-        AbstractActivity.prototype.cancel = /**
-         * @param {?=} error
-         * @return {?}
-         */
-        function (error) {
-            this.activityContext.onCancel(error);
-        };
-        // @Trace()
-        // @Trace()
-        /**
-         * @return {?}
-         */
-        AbstractActivity.prototype.onActivityReady = 
-        // @Trace()
-        /**
-         * @return {?}
-         */
-        function () {
-        };
-        Object.defineProperty(AbstractActivity.prototype, "busy", {
-            get: /**
-             * @return {?}
-             */
-            function () {
-                return this._busyModel.readonly;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        /**
-         * @param {?} busyModel
-         * @return {?}
-         */
-        AbstractActivity.prototype.busyWhile = /**
-         * @param {?} busyModel
-         * @return {?}
-         */
-        function (busyModel) {
-            this._busyModel.setDelegate(busyModel);
-        };
-        /**
-         * @return {?}
-         */
-        AbstractActivity.prototype.isBusy = /**
-         * @return {?}
-         */
-        function () {
-            return this._busyModel.value;
-        };
         return AbstractActivity;
-    }(DisposableComponent));
-    if (false) {
-        /**
-         * @type {?}
-         * @private
-         */
-        AbstractActivity.prototype._busyModel;
-        /**
-         * @type {?}
-         * @private
-         */
-        AbstractActivity.prototype.activityContext;
-    }
+    }(exports.ɵba));
 
     /**
      * @fileoverview added by tsickle
@@ -1411,7 +1378,7 @@
     /**
      * @template D, R, E
      */
-    exports.ɵba = /** @class */ (function (_super) {
+    exports.ɵbc = /** @class */ (function (_super) {
         __extends(ConfirmThenDialogComponent, _super);
         function ConfirmThenDialogComponent(config, interactionContext) {
             var _this = _super.call(this) || this;
@@ -1483,9 +1450,9 @@
     }(AbstractActivity));
     if (false) {
         /** @type {?} */
-        exports.ɵba.prototype.config;
+        exports.ɵbc.prototype.config;
         /** @type {?} */
-        exports.ɵba.prototype.interactionContext;
+        exports.ɵbc.prototype.interactionContext;
     }
     (function (ConfirmThenDialogComponent) {
         /**
@@ -1502,7 +1469,7 @@
             /** @type {?} */
             Data.prototype.data;
         }
-    })(exports.ɵba || (exports.ɵba = {}));
+    })(exports.ɵbc || (exports.ɵbc = {}));
 
     /**
      * @fileoverview added by tsickle
@@ -1555,16 +1522,174 @@
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
-    exports.ɵu = /** @class */ (function (_super) {
+    /**
+     * Note: this class is mutable and is stored in a list model.  This is normally a big no no but
+     *  we're manually deriving other models from the list after view state changes.  I.e. we not
+     *  using pectin chains on any of the mutable fields.
+     * @template D, R, E
+     */
+    var /**
+     * Note: this class is mutable and is stored in a list model.  This is normally a big no no but
+     *  we're manually deriving other models from the list after view state changes.  I.e. we not
+     *  using pectin chains on any of the mutable fields.
+     * @template D, R, E
+     */
+    TabContext = /** @class */ (function () {
+        function TabContext(activityData, activityClass, interactionContext, activityCallbacks) {
+            this.activityData = activityData;
+            this.activityClass = activityClass;
+            this.interactionContext = interactionContext;
+            this.activityCallbacks = activityCallbacks;
+            this._complete = false;
+        }
+        /**
+         * @return {?}
+         */
+        TabContext.prototype.isComponentRealised = /**
+         * @return {?}
+         */
+        function () {
+            return !!this._component;
+        };
+        /**
+         * @return {?}
+         */
+        TabContext.prototype.isComplete = /**
+         * @return {?}
+         */
+        function () {
+            return this._complete;
+        };
+        /**
+         * @param {?} component
+         * @return {?}
+         */
+        TabContext.prototype.componentReady = /**
+         * @param {?} component
+         * @return {?}
+         */
+        function (component) {
+            pectin.assert.isNil(this._component);
+            this._component = component;
+        };
+        Object.defineProperty(TabContext.prototype, "component", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this._component;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        // @Trace()
+        // @Trace()
+        /**
+         * @param {?} result
+         * @return {?}
+         */
+        TabContext.prototype.onDone = 
+        // @Trace()
+        /**
+         * @param {?} result
+         * @return {?}
+         */
+        function (result) {
+            this._complete = true;
+            this.activityCallbacks.onDone(result);
+        };
+        // @Trace()
+        // @Trace()
+        /**
+         * @param {?} error
+         * @return {?}
+         */
+        TabContext.prototype.onCancel = 
+        // @Trace()
+        /**
+         * @param {?} error
+         * @return {?}
+         */
+        function (error) {
+            this._complete = true;
+            this.activityCallbacks.onCancel(error);
+        };
+        return TabContext;
+    }());
+    if (false) {
+        /**
+         * @type {?}
+         * @private
+         */
+        TabContext.prototype._complete;
+        /**
+         * @type {?}
+         * @private
+         */
+        TabContext.prototype._component;
+        /** @type {?} */
+        TabContext.prototype.activityData;
+        /** @type {?} */
+        TabContext.prototype.activityClass;
+        /** @type {?} */
+        TabContext.prototype.interactionContext;
+        /** @type {?} */
+        TabContext.prototype.activityCallbacks;
+    }
+    /**
+     * @template D, R, E
+     */
+    var ActivityContainerComponent = /** @class */ (function (_super) {
         __extends(ActivityContainerComponent, _super);
         function ActivityContainerComponent() {
             var _this = _super.call(this) || this;
-            _this.activityOutletTabs = new pectin.MutableListModel();
-            _this.obsoleteTabs = [];
+            _this.activityFinishedEvents = new pectin.MutableStream();
+            _this.activityTabs = new pectin.MutableListModel();
             _this.finished = false;
             _this._activityList = new pectin.MutableListModel();
+            var _a = pectin.Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
+            chain(_this.activityFinishedEvents).throttle(50).subscribe((/**
+             * @return {?}
+             */
+            function () { return _this.onActivityFinished(); }));
             return _this;
         }
+        Object.defineProperty(ActivityContainerComponent.prototype, "initialActivityOutletContext", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this.activityTabs.length > 0 ? this.activityTabs.value[0] : null;
+            },
+            set: /**
+             * @param {?} initialContext
+             * @return {?}
+             */
+            function (initialContext) {
+                var _this = this;
+                pectin.assert.isNil(this.initialActivityOutletContext);
+                this.activityTabs.push(new TabContext(initialContext.activityData, initialContext.activityClass, this, {
+                    onDone: (/**
+                     * @param {?} result
+                     * @return {?}
+                     */
+                    function (result) {
+                        _this.finished = true;
+                        return initialContext.onDone(result);
+                    }),
+                    onCancel: (/**
+                     * @param {?} error
+                     * @return {?}
+                     */
+                    function (error) {
+                        _this.finished = true;
+                        return initialContext.onCancel(error);
+                    })
+                }));
+            },
+            enumerable: true,
+            configurable: true
+        });
         /**
          * @return {?}
          */
@@ -1600,94 +1725,28 @@
          */
         function () {
             var _this = this;
-            var observe = pectin.Dsl.disposeWith(this).observe;
-            this._activityList.value = this.outlets.toArray().map((/**
-             * @param {?} c
+            var _a = pectin.Dsl.disposeWith(this), chain = _a.chain, observe = _a.observe;
+            observe.valuesFrom(this.outlets.changes).subscribe((/**
              * @return {?}
              */
-            function (c) { return c.component; }));
-            observe.valuesFrom(this.outlets.changes).subscribe((/**
-             * @param {?} change
+            function () { return setTimeout((/**
              * @return {?}
              */
-            function (change) {
-                _this.safelyUpdateActivityList(change.map((/**
-                 * @param {?} c
-                 * @return {?}
-                 */
-                function (c) { return c.component; })));
-            }));
+            function () { return _this.updateActivityList(); })); }));
             observe.valuesFrom(this.tabs.animationDone).subscribe((/**
              * @return {?}
              */
             function () { return _this.onAnimationFinished(); }));
+            this.updateActivityList();
         };
         /**
-         * Update in the next tick to avoid changing state in the current change detection cycle.
-         * @param activities
-         */
-        /**
-         * Update in the next tick to avoid changing state in the current change detection cycle.
-         * @private
-         * @param {?} activities
-         * @return {?}
-         */
-        ActivityContainerComponent.prototype.safelyUpdateActivityList = /**
-         * Update in the next tick to avoid changing state in the current change detection cycle.
-         * @private
-         * @param {?} activities
-         * @return {?}
-         */
-        function (activities) {
-            var _this = this;
-            setTimeout((/**
-             * @return {?}
-             */
-            function () { return _this._activityList.value = activities; }));
-        };
-        /**
-         * @template D, R, E
-         * @param {?} initialContext
-         * @return {?}
-         */
-        ActivityContainerComponent.prototype.initialise = /**
-         * @template D, R, E
-         * @param {?} initialContext
-         * @return {?}
-         */
-        function (initialContext) {
-            /** @type {?} */
-            var self = this;
-            this.initialActivityOutletContext = {
-                activityClass: initialContext.activityClass,
-                activityData: initialContext.activityData,
-                onDone: (/**
-                 * @param {?} result
-                 * @return {?}
-                 */
-                function (result) {
-                    self.finished = true;
-                    return initialContext.onDone(result);
-                }),
-                onCancel: (/**
-                 * @param {?} error
-                 * @return {?}
-                 */
-                function (error) {
-                    self.finished = true;
-                    return initialContext.onCancel(error);
-                }),
-                interactionContext: this
-            };
-        };
-        /**
-         * @template D, R, E
+         * @template D1, R1, E1
          * @param {?} activityType
          * @param {?=} data
          * @return {?}
          */
         ActivityContainerComponent.prototype.startActivity = /**
-         * @template D, R, E
+         * @template D1, R1, E1
          * @param {?} activityType
          * @param {?=} data
          * @return {?}
@@ -1703,41 +1762,26 @@
              */
             function (resolve, reject) {
                 /** @type {?} */
-                var context = {
-                    interactionContext: self,
-                    activityClass: activityType,
-                    activityData: data,
+                var context = new TabContext(data, activityType, self, {
                     onDone: (/**
                      * @param {?} result
                      * @return {?}
                      */
                     function (result) {
-                        self.obsoleteTabs.push(context);
-                        // animating on the next tick gives chained done's a chance to
-                        // finished before we start an animations
                         resolve(result);
-                        setTimeout((/**
-                         * @return {?}
-                         */
-                        function () { return self.animateTabs(); }));
+                        self.activityFinishedEvents.publish({});
                     }),
                     onCancel: (/**
                      * @param {?} error
                      * @return {?}
                      */
                     function (error) {
-                        self.obsoleteTabs.push(context);
-                        // finished before we start an animations
                         reject(error);
-                        // animating on the next tick gives chained done's a chance to complete before we animate
-                        setTimeout((/**
-                         * @return {?}
-                         */
-                        function () { return self.animateTabs(); }));
+                        self.activityFinishedEvents.publish({});
                     })
-                };
-                self.activityOutletTabs.push(context);
-                self.tabs.selectedIndex = _this.activityOutletTabs.length;
+                });
+                self.activityTabs.push(context);
+                self.tabs.selectedIndex = _this.activityTabs.length;
             }));
         };
         /**
@@ -1763,63 +1807,151 @@
             return this.startActivity(ConfirmationDialogComponent, confirm);
         };
         /**
-         * @template D, R, E
-         * @param {?} confirm
-         * @param {?} activityType
-         * @param {?=} data
+         * @template D1, R1, E1
+         * @param {?} confirm
+         * @param {?} activityType
+         * @param {?=} data
+         * @return {?}
+         */
+        ActivityContainerComponent.prototype.confirmThen = /**
+         * @template D1, R1, E1
+         * @param {?} confirm
+         * @param {?} activityType
+         * @param {?=} data
+         * @return {?}
+         */
+        function (confirm, activityType, data) {
+            return this.startActivity(exports.ɵbc, {
+                confirm: confirm,
+                activityType: activityType,
+                data: data
+            });
+        };
+        // @Trace()
+        // @Trace()
+        /**
+         * @private
+         * @return {?}
+         */
+        ActivityContainerComponent.prototype.onActivityFinished = 
+        // @Trace()
+        /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            // don't do anything if job already queued up.
+            if (!this.finished) {
+                if (this.synchroniseSelectedTabIndex()) {
+                    this.cleanupStaleActivities();
+                }
+                this.updateActivityList();
+            }
+        };
+        // @Trace()
+        // @Trace()
+        /**
+         * @private
+         * @return {?}
+         */
+        ActivityContainerComponent.prototype.cleanupStaleActivities = 
+        // @Trace()
+        /**
+         * @private
+         * @return {?}
+         */
+        function () {
+            var _this = this;
+            // clean up old tabs
+            if (this.tabs.selectedIndex < this.activityTabs.length - 1) {
+                this.activityTabs.runInTransaction((/**
+                 * @param {?} draft
+                 * @return {?}
+                 */
+                function (draft) {
+                    draft.value = draft.value.slice(0, 1 + _this.tabs.selectedIndex);
+                }));
+            }
+        };
+        /**
+         * Synchronises the selected tab index.  Returns true if there was no change to the selected index.
+         */
+        // @Trace()
+        /**
+         * Synchronises the selected tab index.  Returns true if there was no change to the selected index.
+         * @private
+         * @return {?}
+         */
+        // @Trace()
+        ActivityContainerComponent.prototype.synchroniseSelectedTabIndex = /**
+         * Synchronises the selected tab index.  Returns true if there was no change to the selected index.
+         * @private
+         * @return {?}
+         */
+        // @Trace()
+        function () {
+            /** @type {?} */
+            var previousIndex = this.tabs.selectedIndex;
+            /** @type {?} */
+            var newIndex = this.activityTabs.query().findIndex((/**
+             * @param {?} t
+             * @return {?}
+             */
+            function (t) { return t.isComplete(); })) - 1;
+            this.tabs.selectedIndex = newIndex;
+            return previousIndex === newIndex;
+        };
+        // @Trace()
+        // @Trace()
+        /**
+         * @private
          * @return {?}
          */
-        ActivityContainerComponent.prototype.confirmThen = /**
-         * @template D, R, E
-         * @param {?} confirm
-         * @param {?} activityType
-         * @param {?=} data
+        ActivityContainerComponent.prototype.onAnimationFinished = 
+        // @Trace()
+        /**
+         * @private
          * @return {?}
          */
-        function (confirm, activityType, data) {
-            return this.startActivity(exports.ɵba, {
-                confirm: confirm,
-                activityType: activityType,
-                data: data
-            });
+        function () {
+            this.getSelectedOutlet().component.onActivityReady();
+            this.cleanupStaleActivities();
+            this.updateActivityList();
         };
         /**
          * @private
          * @return {?}
          */
-        ActivityContainerComponent.prototype.onAnimationFinished = /**
+        ActivityContainerComponent.prototype.updateActivityList = /**
          * @private
          * @return {?}
          */
         function () {
-            var _this = this;
-            this.activityOutletTabs.value = this.activityOutletTabs.value.filter((/**
-             * @param {?} tab
+            this._activityList.value = this.activityTabs.value.filter((/**
+             * @param {?} t
              * @return {?}
              */
-            function (tab) {
-                return !_this.obsoleteTabs.includes(tab);
-            }));
-            this.obsoleteTabs = [];
-            this.outlets.toArray()[this.tabs.selectedIndex].notifyReady();
+            function (t) { return !t.isComplete() && t.isComponentRealised(); })).map((/**
+             * @param {?} t
+             * @return {?}
+             */
+            function (t) { return t.component; }));
         };
         /**
          * @private
          * @return {?}
          */
-        ActivityContainerComponent.prototype.animateTabs = /**
+        ActivityContainerComponent.prototype.getSelectedOutlet = /**
          * @private
          * @return {?}
          */
         function () {
-            if (!this.finished) {
-                this.tabs.selectedIndex = this.activityOutletTabs.length - this.obsoleteTabs.length;
-            }
+            return this.outlets.toArray()[this.tabs.selectedIndex];
         };
         ActivityContainerComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'angular-ui-powerups-activity-container',
-                        template: "<mat-tab-group #tabs no-tab-header [dynamicHeight]=\"true\">\n  <mat-tab>\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\"\n                                         [activityContext]=\"initialActivityOutletContext\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n  <mat-tab *ngFor=\"let tab of activityOutletTabs.value\">\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\"\n                                         [activityContext]=\"tab\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n</mat-tab-group>\n",
+                        template: "<mat-tab-group #tabs no-tab-header [dynamicHeight]=\"true\">\n  <mat-tab *ngFor=\"let tab of activityTabs.value\">\n    <angular-ui-powerups-activity-outlet [interactionContext]=\"this\"\n                                         [activityContext]=\"tab\"></angular-ui-powerups-activity-outlet>\n  </mat-tab>\n</mat-tab-group>\n",
                         styles: [":host{display:block}"]
                     }] }
         ];
@@ -1832,54 +1964,32 @@
             outlets: [{ type: core.ViewChildren, args: [ActivityOutletComponent,] }]
         };
         return ActivityContainerComponent;
-    }(DisposableComponent));
+    }(InteractionContext));
     if (false) {
-        /** @type {?} */
-        exports.ɵu.prototype.parentInteractionContext;
-        /** @type {?} */
-        exports.ɵu.prototype.initialActivityOutletContext;
-        /** @type {?} */
-        exports.ɵu.prototype.currentActivity;
-        /** @type {?} */
-        exports.ɵu.prototype.tabs;
-        /** @type {?} */
-        exports.ɵu.prototype.outlets;
-        /** @type {?} */
-        exports.ɵu.prototype.activityOutletTabs;
         /**
          * @type {?}
          * @private
          */
-        exports.ɵu.prototype.obsoleteTabs;
+        ActivityContainerComponent.prototype.activityFinishedEvents;
+        /** @type {?} */
+        ActivityContainerComponent.prototype.parentInteractionContext;
+        /** @type {?} */
+        ActivityContainerComponent.prototype.tabs;
+        /** @type {?} */
+        ActivityContainerComponent.prototype.outlets;
+        /** @type {?} */
+        ActivityContainerComponent.prototype.activityTabs;
         /**
          * @type {?}
          * @private
          */
-        exports.ɵu.prototype.finished;
+        ActivityContainerComponent.prototype.finished;
         /**
          * @type {?}
          * @private
          */
-        exports.ɵu.prototype._activityList;
+        ActivityContainerComponent.prototype._activityList;
     }
-    (function (ActivityContainerComponent) {
-        /**
-         * @record
-         * @template D, R, E
-         */
-        function ActivityContext() { }
-        ActivityContainerComponent.ActivityContext = ActivityContext;
-        if (false) {
-            /** @type {?} */
-            ActivityContext.prototype.activityClass;
-            /** @type {?} */
-            ActivityContext.prototype.activityData;
-            /** @type {?} */
-            ActivityContext.prototype.onDone;
-            /** @type {?} */
-            ActivityContext.prototype.onCancel;
-        }
-    })(exports.ɵu || (exports.ɵu = {}));
 
     /**
      * @fileoverview added by tsickle
@@ -1887,19 +1997,68 @@
      */
     /** @type {?} */
     var DIALOG_INTERACTION_SERVICE_DEFAULTS = new core.InjectionToken('DIALOG_INTERACTION_SERVICE_DEFAULTS');
+    var Guard = /** @class */ (function (_super) {
+        __extends(Guard, _super);
+        function Guard() {
+            return _super.call(this, { initialValue: false }) || this;
+        }
+        Object.defineProperty(Guard.prototype, "value", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this.store.read();
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @template R
+         * @param {?} fun
+         * @return {?}
+         */
+        Guard.prototype.whileTrue = /**
+         * @template R
+         * @param {?} fun
+         * @return {?}
+         */
+        function (fun) {
+            this.startTransaction().commit(true);
+            try {
+                return fun();
+            }
+            finally {
+                this.startTransaction().commit(false);
+            }
+        };
+        /**
+         * @template R
+         * @param {?} fun
+         * @param {?=} defaultValue
+         * @return {?}
+         */
+        Guard.prototype.runIfFalse = /**
+         * @template R
+         * @param {?} fun
+         * @param {?=} defaultValue
+         * @return {?}
+         */
+        function (fun, defaultValue) {
+            if (defaultValue === void 0) { defaultValue = null; }
+            return !this.value ? fun() : defaultValue;
+        };
+        return Guard;
+    }(pectin.ValueModel));
     var DialogInteractionService = /** @class */ (function (_super) {
         __extends(DialogInteractionService, _super);
-        function DialogInteractionService(dialogService, router, dialogServiceDefaults, matDialogDefaultConfig) {
+        function DialogInteractionService(dialogService, dialogServiceDefaults, matDialogDefaultConfig) {
             var _this = _super.call(this) || this;
             _this.dialogService = dialogService;
-            _this.router = router;
             _this.dialogServiceDefaults = dialogServiceDefaults;
             _this.matDialogDefaultConfig = matDialogDefaultConfig;
             _this._activityList = new pectin.DelegatingListModel();
-            _this._active = false;
+            _this.startingGuard = new Guard();
             typescriptUtilities.assert.notNil(dialogService);
-            var _a = pectin.Dsl.disposeWith(_this), chain = _a.chain, observe = _a.observe;
-            _this.currentActivity = chain(_this.activityList).last();
             return _this;
         }
         /**
@@ -1909,7 +2068,7 @@
          * @return {?}
          */
         function () {
-            return this._active;
+            return !!this.currentActivityId;
         };
         /**
          * @return {?}
@@ -1918,7 +2077,7 @@
          * @return {?}
          */
         function () {
-            this.currentActivity.value.cancel(null);
+            this.currentActivity.cancel(null);
         };
         Object.defineProperty(DialogInteractionService.prototype, "activityList", {
             get: /**
@@ -1971,56 +2130,59 @@
                  */
                 function (a) { return a.constructor.name; })).join(', '));
             }
-            this._active = true;
-            /** @type {?} */
-            var self = this;
-            /** @type {?} */
-            var config = __assign({ autoFocus: false, hasBackdrop: true, closeOnNavigation: false }, this.matDialogDefaultConfig, this.dialogServiceDefaults, {
-                data: data,
-                disableClose: disableClose,
-                panelClass: 'dialog-interaction-service'
-            });
-            /** @type {?} */
-            var matDialogRef = (/** @type {?} */ (this.dialogService.open(exports.ɵu, config)));
-            return new Promise((/**
-             * @param {?} resolve
-             * @param {?} reject
+            return this.startingGuard.whileTrue((/**
              * @return {?}
              */
-            function (resolve, reject) {
+            function () {
+                _this.currentActivityId = uuid.v1();
                 /** @type {?} */
-                var activityContainer = matDialogRef.componentInstance;
-                activityContainer.parentInteractionContext = _this;
-                self.safelyUpdateActivityListDelegate(activityContainer.activityList);
-                activityContainer.initialise({
-                    activityClass: activityType,
-                    activityData: data,
-                    onDone: /**
-                     * @param {?} result
-                     * @return {?}
-                     */
-                    function (result) {
-                        // TODO: should I be calling resolve after close?
-                        resolve(result);
-                        matDialogRef.close(result);
-                    },
-                    onCancel: /**
-                     * @param {?} error
-                     * @return {?}
-                     */
-                    function (error) {
-                        // TODO: should I be calling reject after close?
-                        reject(error);
-                        matDialogRef.close(error);
-                    }
+                var self = _this;
+                /** @type {?} */
+                var config = __assign({ autoFocus: false, hasBackdrop: true, closeOnNavigation: false }, _this.matDialogDefaultConfig, _this.dialogServiceDefaults, {
+                    data: data,
+                    disableClose: disableClose,
+                    panelClass: 'dialog-interaction-service'
                 });
-                matDialogRef.updateSize();
-            })).finally((/**
-             * @return {?}
-             */
-            function () {
-                self.safelyUpdateActivityListDelegate(null);
-                self._active = false;
+                /** @type {?} */
+                var matDialogRef = (/** @type {?} */ (_this.dialogService.open(ActivityContainerComponent, config)));
+                return new Promise((/**
+                 * @param {?} resolve
+                 * @param {?} reject
+                 * @return {?}
+                 */
+                function (resolve, reject) {
+                    /** @type {?} */
+                    var activityContainer = matDialogRef.componentInstance;
+                    activityContainer.parentInteractionContext = _this;
+                    self.safelyUpdateActivityListDelegate(activityContainer.activityList);
+                    activityContainer.initialActivityOutletContext = {
+                        activityClass: activityType,
+                        activityData: data,
+                        onDone: /**
+                         * @param {?} result
+                         * @return {?}
+                         */
+                        function (result) {
+                            resolve(result);
+                            matDialogRef.close(result);
+                        },
+                        onCancel: /**
+                         * @param {?} error
+                         * @return {?}
+                         */
+                        function (error) {
+                            reject(error);
+                            matDialogRef.close(error);
+                        }
+                    };
+                    matDialogRef.updateSize();
+                })).finally((/**
+                 * @return {?}
+                 */
+                function () {
+                    _this.currentActivityId = null;
+                    self.safelyUpdateActivityListDelegate(null);
+                }));
             }));
         };
         /**
@@ -2081,7 +2243,7 @@
          * @return {?}
          */
         function (confirm, activityType, data) {
-            return this._startActivity(exports.ɵba, {
+            return this._startActivity(exports.ɵbc, {
                 confirm: confirm,
                 activityType: activityType,
                 data: data
@@ -2095,16 +2257,13 @@
         /** @nocollapse */
         DialogInteractionService.ctorParameters = function () { return [
             { type: material.MatDialog },
-            { type: router.Router },
             { type: dialog.MatDialogConfig, decorators: [{ type: core.Optional }, { type: core.Inject, args: [DIALOG_INTERACTION_SERVICE_DEFAULTS,] }] },
             { type: dialog.MatDialogConfig, decorators: [{ type: core.Optional }, { type: core.Inject, args: [dialog.MAT_DIALOG_DEFAULT_OPTIONS,] }] }
         ]; };
-        /** @nocollapse */ DialogInteractionService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function DialogInteractionService_Factory() { return new DialogInteractionService(core.ɵɵinject(dialog.MatDialog), core.ɵɵinject(router.Router), core.ɵɵinject(DIALOG_INTERACTION_SERVICE_DEFAULTS, 8), core.ɵɵinject(dialog.MAT_DIALOG_DEFAULT_OPTIONS, 8)); }, token: DialogInteractionService, providedIn: "root" });
+        /** @nocollapse */ DialogInteractionService.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function DialogInteractionService_Factory() { return new DialogInteractionService(core.ɵɵinject(dialog.MatDialog), core.ɵɵinject(DIALOG_INTERACTION_SERVICE_DEFAULTS, 8), core.ɵɵinject(dialog.MAT_DIALOG_DEFAULT_OPTIONS, 8)); }, token: DialogInteractionService, providedIn: "root" });
         return DialogInteractionService;
     }(InteractionContext));
     if (false) {
-        /** @type {?} */
-        DialogInteractionService.prototype.currentActivity;
         /**
          * @type {?}
          * @private
@@ -2114,17 +2273,17 @@
          * @type {?}
          * @private
          */
-        DialogInteractionService.prototype._active;
+        DialogInteractionService.prototype.startingGuard;
         /**
          * @type {?}
          * @private
          */
-        DialogInteractionService.prototype.dialogService;
+        DialogInteractionService.prototype.currentActivityId;
         /**
          * @type {?}
          * @private
          */
-        DialogInteractionService.prototype.router;
+        DialogInteractionService.prototype.dialogService;
         /** @type {?} */
         DialogInteractionService.prototype.dialogServiceDefaults;
         /** @type {?} */
@@ -2148,20 +2307,20 @@
                             portal.PortalModule
                         ],
                         declarations: [
-                            exports.ɵu,
+                            ActivityContainerComponent,
                             ConfirmationDialogComponent,
-                            exports.ɵba,
+                            exports.ɵbc,
                             AlertDialogComponent,
                             ActivityOutletComponent
                         ],
                         exports: [
-                            exports.ɵu,
+                            ActivityContainerComponent,
                             ActivityOutletComponent,
                         ],
                         entryComponents: [
-                            exports.ɵu,
+                            ActivityContainerComponent,
                             ConfirmationDialogComponent,
-                            exports.ɵba,
+                            exports.ɵbc,
                             AlertDialogComponent
                         ],
                         providers: [
@@ -2714,10 +2873,92 @@
      * @fileoverview added by tsickle
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
+    var NavigationSession = /** @class */ (function () {
+        function NavigationSession(isPopState, initialUrl) {
+            this.isPopState = isPopState;
+            this.initialUrl = initialUrl;
+            this._alreadyAccepted = [];
+            console.log('NavigationSession', { isPopState: isPopState, initialUrl: initialUrl });
+        }
+        /**
+         * @param {?} placeComponent
+         * @return {?}
+         */
+        NavigationSession.prototype.alreadyAccepted = /**
+         * @param {?} placeComponent
+         * @return {?}
+         */
+        function (placeComponent) {
+            return this._alreadyAccepted.includes(placeComponent);
+        };
+        /**
+         * @param {?} component
+         * @return {?}
+         */
+        NavigationSession.prototype.rememberAcceptanceOf = /**
+         * @param {?} component
+         * @return {?}
+         */
+        function (component) {
+            this._alreadyAccepted.push(component);
+        };
+        return NavigationSession;
+    }());
+    if (false) {
+        /**
+         * @type {?}
+         * @private
+         */
+        NavigationSession.prototype._alreadyAccepted;
+        /** @type {?} */
+        NavigationSession.prototype.isPopState;
+        /** @type {?} */
+        NavigationSession.prototype.initialUrl;
+    }
     var PlaceRouter = /** @class */ (function () {
-        function PlaceRouter(router) {
-            this.router = router;
+        function PlaceRouter(router$1, angularLocation) {
+            var _this = this;
+            this.router = router$1;
+            this._navigationSession = new pectin.MutableValueModel();
+            angularLocation.onUrlChange((/**
+             * @param {?} url
+             * @return {?}
+             */
+            function (url) {
+                console.log("### " + url);
+            }));
+            this.router.events.subscribe((/**
+             * @param {?} event
+             * @return {?}
+             */
+            function (event) {
+                // console.log(`${event.constructor.name}`, location.pathname, angularLocation.getState());
+                // NavigationStart -> .... -> NavigationCancel === redirect (so don't ask again)
+                // NavigationStart -> .... -> NavigationEnd === navigated (so ask next time)
+                // NavigationStart -> .... -> NavigationError === canceled (guard cancelled so ask next time)
+                if (event instanceof router.NavigationStart && !_this.navigationSession) {
+                    _this._navigationSession.value = new NavigationSession(event.navigationTrigger === 'popstate', _this.router.routerState.snapshot.url);
+                }
+                if (event instanceof router.NavigationEnd) {
+                    console.log('navigation ended');
+                    _this._navigationSession.value = null;
+                }
+                if (event instanceof router.NavigationError) {
+                    console.log('navigation errored');
+                    _this._navigationSession.value = null;
+                }
+            }));
         }
+        Object.defineProperty(PlaceRouter.prototype, "navigationSession", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return this._navigationSession.value;
+            },
+            enumerable: true,
+            configurable: true
+        });
         /**
          * @param {?} activatedRoute
          * @param {?} previous
@@ -2760,7 +3001,6 @@
             var commands = (weHaveARouteId) ?
                 [urlSegments[0].path, sanitised.getFormattedRouteId(), sanitised.getFormattedParameters()] :
                 [urlSegments[0].path, sanitised.getFormattedParameters()];
-            console.log("redirect path", commands);
             return this.router.createUrlTree(commands);
         };
         /**
@@ -2804,12 +3044,18 @@
         ];
         /** @nocollapse */
         PlaceRouter.ctorParameters = function () { return [
-            { type: router.Router }
+            { type: router.Router },
+            { type: common.Location }
         ]; };
-        /** @nocollapse */ PlaceRouter.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(core.ɵɵinject(router.Router)); }, token: PlaceRouter, providedIn: "root" });
+        /** @nocollapse */ PlaceRouter.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceRouter_Factory() { return new PlaceRouter(core.ɵɵinject(router.Router), core.ɵɵinject(common.Location)); }, token: PlaceRouter, providedIn: "root" });
         return PlaceRouter;
     }());
     if (false) {
+        /**
+         * @type {?}
+         * @private
+         */
+        PlaceRouter.prototype._navigationSession;
         /**
          * @type {?}
          * @private
@@ -4593,16 +4839,15 @@
      */
     function ActivityOutletContext() { }
     if (false) {
-        /** @type {?} */
-        ActivityOutletContext.prototype.interactionContext;
         /** @type {?} */
         ActivityOutletContext.prototype.activityClass;
         /** @type {?} */
         ActivityOutletContext.prototype.activityData;
-        /** @type {?} */
-        ActivityOutletContext.prototype.onDone;
-        /** @type {?} */
-        ActivityOutletContext.prototype.onCancel;
+        /**
+         * @param {?} component
+         * @return {?}
+         */
+        ActivityOutletContext.prototype.componentReady = function (component) { };
     }
 
     /**
@@ -4765,33 +5010,12 @@
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     var LeavePlaceGuard = /** @class */ (function () {
-        function LeavePlaceGuard(router$1, injector, interactionContext, location) {
-            this.router = router$1;
+        function LeavePlaceGuard(router, injector, placeRouter, interactionContext, angularLocation) {
+            this.router = router;
             this.injector = injector;
+            this.placeRouter = placeRouter;
             this.interactionContext = interactionContext;
-            this.location = location;
-            // TODO: should probably replace this with a RouteTracker thingy.
-            this._alreadyAccepted = [];
-            console.log('***** Created new guard ******');
-            /** @type {?} */
-            var self = this;
-            this.router.events.subscribe((/**
-             * @param {?} event
-             * @return {?}
-             */
-            function (event) {
-                // NavigationStart -> .... -> NavigationCancel === redirect (so don't ask again)
-                // NavigationStart -> .... -> NavigationEnd === navigated (so ask next time)
-                // NavigationStart -> .... -> NavigationError === canceled (guard cancelled so ask next time)
-                if (event instanceof router.NavigationEnd) {
-                    console.log('navigation ended');
-                    self._alreadyAccepted = [];
-                }
-                if (event instanceof router.NavigationError) {
-                    console.log('navigation errored');
-                    self._alreadyAccepted = [];
-                }
-            }));
+            this.angularLocation = angularLocation;
         }
         /**
          * @param {?} component
@@ -4808,105 +5032,45 @@
          * @return {?}
          */
         function (component, currentRoute, currentState, nextState) {
-            var _this = this;
-            /** @type {?} */
-            var placeDefinitionPath = "/" + component.placeDefinition.path;
-            console.log('canDeactivate', {
-                staticPath: placeDefinitionPath,
-                currentStateUrl: currentState.url,
-                nextStateUrl: nextState.url,
-                alreadyDeclined: this._alreadyAccepted
-            });
-            // Example of the above when navigating to a different child route.
-            // canDeactivate {staticPath: "/hero-details",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-details",
-            //    nextStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats"
-            // }
-            // Example clicking on router tab of the parent component (de-activates the parent due to route param changes)
-            // canDeactivate {
-            //    staticPath: "/hero-stats",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats",
-            //    nextStateUrl: "/route-parameters/"
-            // }
-            // canDeactivate {
-            //    staticPath: "/route-parameters",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats",
-            //    nextStateUrl: "/route-parameters/"
-            // }
-            // logger.class.js:54 ParameterSnapshot.sanitise -> {idModel: -1, pv: undefined, pl: Array(0), dv: undefined, dl: Array(0), …}
-            // parameter-snapshot.ts:20 {name: "idModel", mine: -1, theirs: null}
-            // place-router.ts:28 redirect path (3) ["route-parameters", "-1", {…}]
-            // canDeactivate {
-            //    staticPath: "/hero-stats",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats",
-            //    nextStateUrl: "/route-parameters/-1"
-            // }
-            // canDeactivate {
-            //    staticPath: "/route-parameters",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats",
-            //    nextStateUrl: "/route-parameters/-1"
-            // }
-            // logger.class.js:54 ParameterSnapshot.sanitise -> {idModel: -1, pv: undefined, pl: Array(0), dv: "A", dl: Array(3), …}
-            // parameter-snapshot.ts:20 {name: "dv", mine: "A", theirs: undefined}
-            // place-router.ts:28 redirect path (3) ["route-parameters", "-1", {…}]
-            // canDeactivate {
-            //    staticPath: "/hero-stats",
-            //    currentStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c/hero-stats",
-            //    nextStateUrl: "/route-parameters/-1;dv=A;dl=a,b,c;rdv=A;rdl=a,b,c"
-            // }
-            // HACK: this will break with child routes...
-            if (this.alreadyAccepted(component)) {
-                return true;
-            }
-            else {
-                if (!nextState.url.startsWith(placeDefinitionPath)) {
-                    /** @type {?} */
-                    var self_1 = this;
-                    return Promise.resolve(component.canDeactivate())
-                        .then((/**
-                     * @param {?} canLeave
-                     * @return {?}
-                     */
-                    function (canLeave) {
-                        if (!canLeave) {
-                            // Angular doesn't preserve the url when a guard cancels the back button.
-                            // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
-                            _this.location.go(currentState.url);
-                            return false;
-                        }
-                        else {
-                            if (_this.interactionContext.isActive()) {
-                                _this.interactionContext.currentActivity.value.cancel(null);
-                                return false;
+            return __awaiter(this, void 0, void 0, function () {
+                var placeDefinitionPath, self_1, canLeave;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            placeDefinitionPath = "/" + component.placeDefinition.path;
+                            if (!this.placeRouter.navigationSession.alreadyAccepted(component)) return [3 /*break*/, 1];
+                            return [2 /*return*/, true];
+                        case 1:
+                            if (!!nextState.url.startsWith(placeDefinitionPath)) return [3 /*break*/, 3];
+                            self_1 = this;
+                            return [4 /*yield*/, component.canDeactivate()];
+                        case 2:
+                            canLeave = _a.sent();
+                            // component is happy to leave but we need to check if it's left an interaction
+                            // open.  If so we close and stay where we are.
+                            if (canLeave && this.interactionContext.isActive()) {
+                                canLeave = false;
+                                console.log("cancelling", { activity: this.interactionContext.currentActivity });
+                                this.interactionContext.currentActivity.cancel(null);
+                            }
+                            // If we're still leaving then remember it since angular will call this method multiple
+                            // times if any route parameters are changed along the way.
+                            if (canLeave) {
+                                self_1.placeRouter.navigationSession.rememberAcceptanceOf(component);
                             }
                             else {
-                                return true;
+                                // Angular doesn't preserve the url when a guard cancels the back button.
+                                // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+                                if (this.placeRouter.navigationSession.isPopState) {
+                                    console.log('cancelled during popstate');
+                                    this.angularLocation.go(this.placeRouter.navigationSession.initialUrl);
+                                }
                             }
-                        }
-                    })).then((/**
-                     * @param {?} canDeactivate
-                     * @return {?}
-                     */
-                    function (canDeactivate) {
-                        if (canDeactivate) {
-                            self_1._alreadyAccepted.push(component);
-                        }
-                        return canDeactivate;
-                    }));
-                }
-                return true;
-            }
-        };
-        /**
-         * @param {?} placeComponent
-         * @return {?}
-         */
-        LeavePlaceGuard.prototype.alreadyAccepted = /**
-         * @param {?} placeComponent
-         * @return {?}
-         */
-        function (placeComponent) {
-            return this._alreadyAccepted.includes(placeComponent);
+                            return [2 /*return*/, canLeave];
+                        case 3: return [2 /*return*/, true];
+                    }
+                });
+            });
         };
         LeavePlaceGuard.decorators = [
             { type: core.Injectable, args: [{
@@ -4917,16 +5081,11 @@
         LeavePlaceGuard.ctorParameters = function () { return [
             { type: router.Router },
             { type: core.Injector },
+            { type: PlaceRouter },
             { type: InteractionContext },
             { type: common.Location }
         ]; };
-        /** @nocollapse */ LeavePlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function LeavePlaceGuard_Factory() { return new LeavePlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(core.INJECTOR), core.ɵɵinject(InteractionContext), core.ɵɵinject(common.Location)); }, token: LeavePlaceGuard, providedIn: "root" });
-        __decorate([
-            pectin.Trace(),
-            __metadata("design:type", Function),
-            __metadata("design:paramtypes", [exports.PlaceComponent]),
-            __metadata("design:returntype", Boolean)
-        ], LeavePlaceGuard.prototype, "alreadyAccepted", null);
+        /** @nocollapse */ LeavePlaceGuard.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function LeavePlaceGuard_Factory() { return new LeavePlaceGuard(core.ɵɵinject(router.Router), core.ɵɵinject(core.INJECTOR), core.ɵɵinject(PlaceRouter), core.ɵɵinject(InteractionContext), core.ɵɵinject(common.Location)); }, token: LeavePlaceGuard, providedIn: "root" });
         return LeavePlaceGuard;
     }());
     if (false) {
@@ -4934,21 +5093,21 @@
          * @type {?}
          * @private
          */
-        LeavePlaceGuard.prototype._alreadyAccepted;
+        LeavePlaceGuard.prototype.router;
         /**
          * @type {?}
          * @private
          */
-        LeavePlaceGuard.prototype.router;
+        LeavePlaceGuard.prototype.injector;
         /**
          * @type {?}
          * @private
          */
-        LeavePlaceGuard.prototype.injector;
+        LeavePlaceGuard.prototype.placeRouter;
         /** @type {?} */
         LeavePlaceGuard.prototype.interactionContext;
         /** @type {?} */
-        LeavePlaceGuard.prototype.location;
+        LeavePlaceGuard.prototype.angularLocation;
     }
 
     /**
@@ -5241,14 +5400,15 @@
     exports.AbstractActivity = AbstractActivity;
     exports.AbstractInputComponent = AbstractInputComponent;
     exports.AbstractPlaceNavigationComponent = AbstractPlaceNavigationComponent;
-    exports.ActivityContainerComponent = exports.ɵu;
+    exports.Activity = exports.ɵba;
+    exports.ActivityContainerComponent = ActivityContainerComponent;
     exports.ActivityOutletComponent = ActivityOutletComponent;
     exports.AlertDialogComponent = AlertDialogComponent;
     exports.AngularUiPowerupsModule = AngularUiPowerupsModule;
     exports.BusyOverlayComponent = BusyOverlayComponent;
     exports.CloseInteractionGuard = CloseInteractionGuard;
     exports.CommandDirective = CommandDirective;
-    exports.ConfirmThenDialogComponent = exports.ɵba;
+    exports.ConfirmThenDialogComponent = exports.ɵbc;
     exports.ConfirmationDialogComponent = ConfirmationDialogComponent;
     exports.DEFINITION_META_DATA_KEY = DEFINITION_META_DATA_KEY;
     exports.DIALOG_INTERACTION_SERVICE_DEFAULTS = DIALOG_INTERACTION_SERVICE_DEFAULTS;
@@ -5284,10 +5444,9 @@
     exports.slideDownAndUpAnimation = slideDownAndUpAnimation;
     exports.ɵa = CommandDirective;
     exports.ɵb = FocusBindingDirective;
-    exports.ɵbb = InteractionContext;
-    exports.ɵbc = AlertDialogComponent;
-    exports.ɵbe = DIALOG_INTERACTION_SERVICE_DEFAULTS;
-    exports.ɵbf = DialogInteractionService;
+    exports.ɵbd = AlertDialogComponent;
+    exports.ɵbf = DIALOG_INTERACTION_SERVICE_DEFAULTS;
+    exports.ɵbg = DialogInteractionService;
     exports.ɵc = DisposableComponent;
     exports.ɵd = NumberInputComponent;
     exports.ɵe = AbstractInputComponent;
@@ -5306,10 +5465,12 @@
     exports.ɵr = AbstractPlaceNavigationComponent;
     exports.ɵs = ListPlaceNavComponent;
     exports.ɵt = InteractionModule;
-    exports.ɵv = ActivityOutletComponent;
-    exports.ɵw = ConfirmationDialogComponent;
-    exports.ɵx = AbstractActivity;
-    exports.ɵy = ACTIVITY_DATA;
+    exports.ɵu = ActivityContainerComponent;
+    exports.ɵv = InteractionContext;
+    exports.ɵw = ActivityOutletComponent;
+    exports.ɵx = ConfirmationDialogComponent;
+    exports.ɵy = AbstractActivity;
+    exports.ɵz = ACTIVITY_DATA;
 
     Object.defineProperty(exports, '__esModule', { value: true });