@coolon/angular-ui-powerups 0.0.77 → 0.0.79

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

@@ -1760,6 +1760,10 @@
              */
             function (initialContext) {
                 pectin.assert.isNil(this._initialActivityOutletContext);
+                // we clean up at the start as we leave the initial activity in place after it finishes
+                // so that the activity remains visible during the inplace-interaction-context animations.
+                this.activityTabs.value = [];
+                this._activityList.value = [];
                 /** @type {?} */
                 var self = this;
                 if (initialContext) {
@@ -1794,7 +1798,7 @@
          * @return {?}
          */
         function () {
-            return this._activityList.length > 0;
+            return !!this._initialActivityOutletContext;
         };
         Object.defineProperty(ActivityContainerComponent.prototype, "activityList", {
             get: /**
@@ -1860,6 +1864,7 @@
          */
         function (activityType, data) {
             var _this = this;
+            this.cleanupStaleNestedActivities();
             /** @type {?} */
             var self = this;
             return new Promise((/**
@@ -1944,8 +1949,6 @@
          */
         function () {
             this._initialActivityOutletContext = null;
-            this.activityTabs.value = [];
-            this._activityList.value = [];
             this.initialActivityOutletContextEvent.emit(null);
         };
         // @Trace()
@@ -1961,10 +1964,7 @@
          * @return {?}
          */
         function () {
-            // don't do anything if job already queued up.
-            if (this.synchroniseSelectedTabIndex()) {
-                this.cleanupStaleNestedActivities();
-            }
+            this.synchroniseSelectedTabIndex();
             this.updateActivityList();
         };
         // @Trace()
@@ -2655,7 +2655,7 @@
                             AlertDialogComponent
                         ],
                         providers: [
-                            DialogInteractionService
+                            DialogInteractionService,
                         ]
                     },] }
         ];
@@ -3913,8 +3913,7 @@
      * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
      */
     var PlaceHistory = /** @class */ (function () {
-        function PlaceHistory(router) {
-            this.router = router;
+        function PlaceHistory() {
             this._history = new Map();
         }
         // @Trace()
@@ -3977,10 +3976,8 @@
                     },] }
         ];
         /** @nocollapse */
-        PlaceHistory.ctorParameters = function () { return [
-            { type: router.Router }
-        ]; };
-        /** @nocollapse */ PlaceHistory.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceHistory_Factory() { return new PlaceHistory(core.ɵɵinject(router.Router)); }, token: PlaceHistory, providedIn: "root" });
+        PlaceHistory.ctorParameters = function () { return []; };
+        /** @nocollapse */ PlaceHistory.ngInjectableDef = core.ɵɵdefineInjectable({ factory: function PlaceHistory_Factory() { return new PlaceHistory(); }, token: PlaceHistory, providedIn: "root" });
         return PlaceHistory;
     }());
     if (false) {
@@ -3989,11 +3986,6 @@
          * @private
          */
         PlaceHistory.prototype._history;
-        /**
-         * @type {?}
-         * @private
-         */
-        PlaceHistory.prototype.router;
     }
 
     /**
@@ -4376,12 +4368,15 @@
         animations$1.query(':enter, :leave', animationStartStyle, { optional: true }),
         animations$1.group([
             animations$1.query(':enter', [
-                animations$1.style({ transform: 'translateX(100%)' }),
+                animations$1.style({ transform: 'translateX(100%)', minHeight: '1px' }),
                 animations$1.animate('{{duration}} ease-out', animations$1.style({ transform: 'translateX(0%)' }))
             ], {
                 optional: true
             }),
-            animations$1.query(':leave', [animations$1.style({ transform: 'translateX(0%)' }), animations$1.animate('{{duration}} ease-out', animations$1.style({ transform: 'translateX(-100%)' }))], {
+            animations$1.query(':leave', [animations$1.style({ transform: 'translateX(0%)' }), animations$1.animate('{{duration}} ease-out', animations$1.style({
+                    transform: 'translateX(-100%)',
+                    minHeight: '1px'
+                }))], {
                 optional: true
             })
         ])
@@ -4650,7 +4645,7 @@
                         selector: 'aup-place-outlet',
                         template: "<div class=\"router-outlet-container\"\n     [@routeAnimations]=\"placeAnimationOrder.value\"\n     (@routeAnimations.done)=\"animationDone()\"\n>\n  <router-outlet #routerOutlet=\"outlet\"\n                 (activate)=\"onOutletActivated(routerOutlet, $event)\"\n                 (deactivate)=\"onOutletDeactivated(routerOutlet, $event)\">\n  </router-outlet>\n</div>\n\n",
                         animations: [LEFT_RIGHT_PLACE_ANIMATION],
-                        styles: [":host{display:flex;flex-direction:column;min-height:0}.router-outlet-container{flex:1;display:block;position:relative;min-height:0}router-outlet{display:none}"]
+                        styles: [":host{display:flex;flex-direction:column;min-height:0;overflow-x:hidden}.router-outlet-container{flex:1;display:block;position:relative;min-height:0}router-outlet{display:none}"]
                     }] }
         ];
         /** @nocollapse */
@@ -4756,11 +4751,6 @@
              * @return {?}
              */
             function (c) { return exports.PlaceComponent.getDefinition(c); }));
-            _this.relativeToModel = chain(_this.placeOutletModel).pullValueModel((/**
-             * @param {?} o
-             * @return {?}
-             */
-            function (o) { return o.activatedRouteModel; }));
             _this.commandFactory = pectin.Command.createFactory((/**
              * @param {?} placeDefinition
              * @return {?}
@@ -4768,6 +4758,11 @@
             function (placeDefinition) {
                 _this.placeOutlet.navigate(new Visit(placeDefinition));
             }));
+            _this.activePlaceDefinition = chain(_this.placeOutletModel).pullValueModel((/**
+             * @param {?} o
+             * @return {?}
+             */
+            function (o) { return o.activePlaceModel; })).pluck("placeDefinition");
             return _this;
         }
         /**
@@ -4796,6 +4791,17 @@
                 function () { return navItem && navItem.icon ? navItem.icon() : placeDef.getPlaceData('navIcon', null); })
             };
         };
+        /**
+         * @param {?} place
+         * @return {?}
+         */
+        AbstractPlaceNavigationComponent.prototype.isActive = /**
+         * @param {?} place
+         * @return {?}
+         */
+        function (place) {
+            return this.activePlaceDefinition.query().equals(place);
+        };
         /**
          * @return {?}
          */
@@ -4845,13 +4851,10 @@
         AbstractPlaceNavigationComponent.prototype.placeOutletModel;
         /** @type {?} */
         AbstractPlaceNavigationComponent.prototype.placeDefinitions;
-        /**
-         * @type {?}
-         * @protected
-         */
-        AbstractPlaceNavigationComponent.prototype.relativeToModel;
         /** @type {?} */
         AbstractPlaceNavigationComponent.prototype.commandFactory;
+        /** @type {?} */
+        AbstractPlaceNavigationComponent.prototype.activePlaceDefinition;
     }
 
     /**
@@ -4895,8 +4898,8 @@
         ListPlaceNavComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'aup-list-place-nav',
-                        template: "<mat-nav-list class=\"app-menu\">\n  <a mat-list-item *ngFor=\"let place of placeDefinitions.value\"\n     [pectinCommand]=\"commandFactory.create(place)\"\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}"]
+                        template: "<mat-nav-list class=\"app-menu\">\n  <a mat-list-item *ngFor=\"let placeDefinition of placeDefinitions.value\"\n     [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n     [class.active]=\"isActive(placeDefinition)\"\n     [matTooltip]=\"getNav(placeDefinition).tooltip()\">\n    <mat-icon *ngIf=\"getNav(placeDefinition).icon()\">{{getNav(placeDefinition).icon()}}</mat-icon>\n    <span class=\"expanded-only\">{{getNav(placeDefinition).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:rgba(0,0,0,.6)}.mat-list-item.active{background-color:rgba(0,0,0,.1);color:rgba(0,0,0,.9)}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 */
@@ -4923,7 +4926,7 @@
         TabbedPlaceNavigationComponent.decorators = [
             { type: core.Component, args: [{
                         selector: 'aup-tabbed-place-navigation',
-                        template: "<nav mat-tab-nav-bar>\n  <a mat-tab-link *ngFor=\"let place of placeDefinitions.value\"\n     [pectinCommand]=\"commandFactory.create(place)\"\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",
+                        template: "<nav mat-tab-nav-bar>\n  <a mat-tab-link *ngFor=\"let placeDefinition of placeDefinitions.value\"\n     [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n     [active]=\"isActive(placeDefinition)\"\n     [matTooltip]=\"getNav(placeDefinition).tooltip()\">\n    <mat-icon *ngIf=\"getNav(placeDefinition).icon()\">{{getNav(placeDefinition).icon()}}</mat-icon>\n    <span>{{getNav(placeDefinition).title()}}</span>\n  </a>\n</nav>\n",
                         styles: [""]
                     }] }
         ];