@coolon/angular-ui-powerups 12.4.0-alpha.28 → 12.4.0-alpha.3

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

@@ -21,7 +21,7 @@ import { MatTableModule } from '@angular/material/table';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
 import { fas } from '@fortawesome/free-solid-svg-icons';
-import { GarbageCollector, DelegatingValueModel, assert, UnaryCommand, lang, Dsl, Logger, TrackExternal, ValueModel, StoreInValueModel, Command, MutableListModel, StoreInListModel, Disposable, MutableValueModel, DelegatingListModel, FocusManager, EventListenerList, Form, Guard, Binding, DebugContext, ListModel, MultipleSelectionModel, DelegatingSelectionModel, AbstractComputedListModel, DirtyTrackingForm, ComputedListModel, PageController, Deferred, Functions } from '@coolon/pectin';
+import { GarbageCollector, DelegatingValueModel, assert, UnaryCommand, lang, Dsl, Logger, TrackExternal, ValueModel, StoreInValueModel, Command, MutableListModel, StoreInListModel, Disposable, MutableValueModel, DelegatingListModel, FocusManager, EventListenerList, Form, Guard, Binding, DebugContext, ListModel, MultipleSelectionModel, DelegatingSelectionModel, AbstractComputedListModel, DirtyTrackingForm, ComputedListModel, PageController, Deferred, Trace, Functions } from '@coolon/pectin';
 import { __decorate, __metadata, __awaiter } from 'tslib';
 import { DomSanitizer } from '@angular/platform-browser';
 import * as _ from 'lodash';
@@ -526,30 +526,6 @@ var CommandFace;
     CommandFace.Adapter = Adapter;
 })(CommandFace || (CommandFace = {}));
 
-class AbstractCardContainerComponent extends DisposableComponent {
-    constructor() {
-        super();
-    }
-    ngOnInit() {
-    }
-}
-AbstractCardContainerComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'aup-abstract-card-container',
-                template: ''
-            },] }
-];
-AbstractCardContainerComponent.ctorParameters = () => [];
-AbstractCardContainerComponent.propDecorators = {
-    addCardCommand: [{ type: Input }],
-    addCardFace: [{ type: Input }],
-    addCardTemplate: [{ type: ContentChild, args: ['addCardTemplate',] }]
-};
-__decorate([
-    TrackExternal(),
-    __metadata("design:type", Command)
-], AbstractCardContainerComponent.prototype, "addCardCommand", void 0);
-
 /**
  * @example
  * // basic usage
@@ -567,13 +543,6 @@ __decorate([
  *   <my-card *ngFor="..."></my-card>
  * </aup-card-container>
  *
- * // use the aup-add-card-activity to display as the new card place holder and to run
- * // the activity inside teh card
- * <aup-card-container [addCardCommand]="addCard" [addCardFace]="i18n.addCard" >
- *   <my-card *ngFor="..."></my-card>
- *   <aup-add-card-activity type="inline" renderAs="card" [face]="i18n.commands.addModal" [activityClass]="AddCardActivity"></aup-add-card-activity>
- * </aup-card-container>
- *
  * // adds an add card component using the specified template.  The template
  * // will fill it's container in the grid.
  * <aup-card-container>
@@ -611,85 +580,30 @@ __decorate([
  *   --card-background: var(--card-background, #fcfcfb);
  * }
  */
-class CardContainerComponent extends AbstractCardContainerComponent {
+class CardContainerComponent extends DisposableComponent {
+    constructor() {
+        super();
+    }
+    ngOnInit() {
+    }
 }
 CardContainerComponent.decorators = [
     { type: Component, args: [{
                 selector: 'aup-card-container',
-                template: "<div class=\"card-container\">\n  <ng-content></ng-content>\n\n  <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n    <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n    <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n  </div>\n\n  <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n    <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n  </div>\n</div>\n",
+                template: "<div class=\"card-container\">\n  <ng-content></ng-content>\n\n  <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n    <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n    <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n  </div>\n\n  <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n    <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n  </div>\n\n</div>\n",
                 styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:repeat(auto-fill,var(--resolved-card-width));grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap));max-width:100%}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-container:hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
             },] }
 ];
-
-/**
- * @example
- * // basic usage
- * <aup-card-stack>
- *   <my-card *ngFor="..."></my-card>
- * </aup-card-stack>
- *
- * // adds an add button with a the '+' icon to the end of the card list.
- * <aup-card-stack [addCardCommand]="addCard">
- *   <my-card *ngFor="..."></my-card>
- * </aup-card-stack>
- *
- * // adds an add button with the specified face
- * <aup-card-stack [addCardCommand]="addCard" [addCardFace]="i18n.addCard" >
- *   <my-card *ngFor="..."></my-card>
- * </aup-card-stack>
- *
- * // use the aup-add-card-activity to display as the new card place holder and to run
- * // the activity inside teh card
- * <aup-card-stack [addCardCommand]="addCard" [addCardFace]="i18n.addCard" >
- *   <my-card *ngFor="..."></my-card>
- *   <aup-add-card-activity type="inline" renderAs="card" [face]="i18n.commands.addModal" [activityClass]="AddCardActivity"></aup-add-card-activity>
- * </aup-card-stack>
- *
- * // adds an add card component using the specified template.  The template
- * // will fill it's container in the grid.
- * <aup-card-stack>
- *   <my-card *ngFor="..."></my-card>
- *   <ng-template #addCardTemplate>
- *     <div>This is a new card template, it will the the size of the other cards.</div>
- *   </ng-template>
- * </aup-card-stack>
- *
- * // sing the default new card styles for your template
- * @import "../../../../assets/styles";
- * .my-new-card {
- *   @include aup-card-stack-new-card-style();
- *   // OR
- *   @include aup-card-stack-new-card-style(
- *      $color: rgba(0,0,0,0.54),
- *      $background-color: rgba(255,255,255,0.8),
- *      $hover-color: $color,
- *      $background-hover-color: white
- *   )
- * }
- * <aup-card-stack>
- *   <my-card *ngFor="..."></my-card>
- *   <ng-template #addCardTemplate>
- *     <div class="my-new-card" >This is a new card template, it will the the size of the other cards.</div>
- *   </ng-template>
- * </aup-card-stack>
- *
- * // CSS Vars
- * aup-card-stack {
- *   --card-gap: var(--card-gap, 16px);
- *   --card-height: var(--card-height, auto);
- *   --card-min-height: var(--card-min-height, auto);
- *   --card-background: var(--card-background, #fcfcfb);
- * }
- */
-class CardStackComponent extends AbstractCardContainerComponent {
-}
-CardStackComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'aup-card-stack',
-                template: "<div class=\"card-container\">\n  <ng-content></ng-content>\n</div>\n<div class=\"footer\">\n  <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n    <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n    <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n  </div>\n\n  <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n    <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n  </div>\n  <ng-content select=\"[aup-card-stack-footer]\"></ng-content>\n</div>\n",
-                styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);max-width:100%}.footer{align-items:stretch;padding:0 var(--resolved-card-gap) var(--resolved-card-gap)}.add-card-container,.footer{display:flex;flex-direction:column}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-container:hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
-            },] }
-];
+CardContainerComponent.ctorParameters = () => [];
+CardContainerComponent.propDecorators = {
+    addCardCommand: [{ type: Input }],
+    addCardFace: [{ type: Input }],
+    addCardTemplate: [{ type: ContentChild, args: ["addCardTemplate",] }]
+};
+__decorate([
+    TrackExternal(),
+    __metadata("design:type", Command)
+], CardContainerComponent.prototype, "addCardCommand", void 0);
 
 /**
  * Custom CSS:
@@ -1224,7 +1138,7 @@ EmptyStateComponent.decorators = [
           <ng-content></ng-content>
       </div>
   `,
-                styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:center}.container{display:flex;flex-direction:column;align-items:stretch;padding:var(--aup-default-padding);border:2px dashed rgba(0,0,0,.2);border-radius:5px;font-size:14px;font-weight:300}"]
+                styles: [":host{display:flex;flex-direction:column;justify-content:center;align-items:center}.container{padding:var(--aup-default-padding);border:2px dashed rgba(0,0,0,.2);border-radius:5px;font-size:14px;font-weight:300}"]
             },] }
 ];
 EmptyStateComponent.ctorParameters = () => [];
@@ -3600,15 +3514,15 @@ class TreeExpansionModel {
 
 class FlattenedTreeListModel extends ComputedListModel {
     constructor(source, childRef, expansionModel) {
-        super(source, {
-            initialValue: [],
-            identifiedWith: row => source.identityOf(row)
-        });
+        super(source);
         this.source = source;
         this.childRef = childRef;
         this.expansionModel = expansionModel;
         this.trackSource(expansionModel.isExpandedPredicate);
     }
+    getIdentityOf(item) {
+        return this.source.identityOf(item);
+    }
     compute(values) {
         const result = [];
         values.forEach(rootNode => {
@@ -3679,7 +3593,6 @@ class TreeTableModel extends AbstractTableModel {
         const childExtractor = _.isFunction(childAccessor) ? childAccessor : row => row[childAccessor];
         this.flattenedDataSource = this.registerDisposable(new FlattenedTreeListModel(source, childExtractor, this.treeExpansionModel));
         this.setDataSource(this.flattenedDataSource);
-        this.addRowClass('aup-node-collapsed', row => this.isCollapsed(row));
     }
     treeControlColumn(builder) {
         const columnId = 'tree-label';
@@ -4012,28 +3925,6 @@ class ComponentsModule {
 }
 ComponentsModule.decorators = [
     { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    BrowserAnimationsModule,
-                    FormsModule,
-                    MatInputModule,
-                    MatFormFieldModule,
-                    MatSelectModule,
-                    MatTabsModule,
-                    DirectivesModule,
-                    MatIconModule,
-                    MatButtonModule,
-                    MatCheckboxModule,
-                    MatTableModule,
-                    PortalModule,
-                    CdkScrollableModule,
-                    FontAwesomeModule,
-                    MatTooltipModule,
-                    MatAutocompleteModule,
-                    MatMenuModule,
-                    MatDividerModule,
-                    MatProgressSpinnerModule
-                ],
                 declarations: [
                     AbstractInputComponent,
                     AbstractValueInputComponent,
@@ -4082,9 +3973,29 @@ ComponentsModule.decorators = [
                     BusyOverlayComponent,
                     EmptyStateComponent,
                     PaginatorComponent,
-                    AbstractTableComponent,
-                    AbstractCardContainerComponent,
-                    CardStackComponent
+                    AbstractTableComponent
+                ],
+                imports: [
+                    CommonModule,
+                    BrowserAnimationsModule,
+                    FormsModule,
+                    MatInputModule,
+                    MatFormFieldModule,
+                    MatSelectModule,
+                    MatTabsModule,
+                    DirectivesModule,
+                    MatIconModule,
+                    MatButtonModule,
+                    MatCheckboxModule,
+                    MatTableModule,
+                    PortalModule,
+                    CdkScrollableModule,
+                    FontAwesomeModule,
+                    MatTooltipModule,
+                    MatAutocompleteModule,
+                    MatMenuModule,
+                    MatDividerModule,
+                    MatProgressSpinnerModule
                 ],
                 exports: [
                     NumberInputComponent,
@@ -4121,7 +4032,6 @@ ComponentsModule.decorators = [
                     BusyOverlayComponent,
                     EmptyStateComponent,
                     PaginatorComponent,
-                    CardStackComponent,
                 ],
                 providers: [
                     FocusBindingFactory
@@ -4815,9 +4725,6 @@ class AbstractActivityTriggerComponent extends DisposableComponent {
             });
         });
     }
-    get interactionContext() {
-        return lang$1.abstractMethod(this.constructor);
-    }
     ngOnInit() {
     }
     get isActive() {
@@ -5039,10 +4946,7 @@ InteractionService.ctorParameters = () => [
 class ModalActivityTriggerComponent extends AbstractActivityTriggerComponent {
     constructor(interactionService) {
         super();
-        this._interactionContext = interactionService.createModalInteractionContextDisposedWith(this);
-    }
-    get interactionContext() {
-        return this._interactionContext;
+        this.interactionContext = interactionService.createModalInteractionContextDisposedWith(this);
     }
 }
 ModalActivityTriggerComponent.decorators = [
@@ -5082,9 +4986,6 @@ class InPlaceInteractionContextComponent extends DisposableComponent {
         var _a;
         return this.animateFirstActivity ? (((_a = this.tabConfig) === null || _a === void 0 ? void 0 : _a.animationDuration) || '500ms') : '0ms';
     }
-    get active() {
-        return this.isActive();
-    }
     ngAfterViewInit() {
         this.interactionService.registerInplaceInteractionContext(this);
     }
@@ -5129,79 +5030,9 @@ InPlaceInteractionContextComponent.ctorParameters = () => [
 ];
 InPlaceInteractionContextComponent.propDecorators = {
     activityContainerComponent: [{ type: ViewChild, args: ['activityContainer', { static: true },] }],
-    animateFirstActivity: [{ type: Input }],
-    active: [{ type: HostBinding, args: ["class.active",] }]
+    animateFirstActivity: [{ type: Input }]
 };
 
-/**
- *
- */
-class AddCardActivityComponent extends AbstractActivityTriggerComponent {
-    constructor(interactionService) {
-        super();
-        this.interactionStyle = AddCardActivityComponent.InteractionType.MODAL;
-        this.renderAs = AddCardActivityComponent.RenderAs.CARD;
-        const { chain } = Dsl.disposeWith(this);
-        this.modalInteractionContext = interactionService.createModalInteractionContextDisposedWith(this);
-        this.faceList = chain(this.faceModel).mapToList(face => [face]);
-    }
-    get renderAsClass() {
-        return `render-as-${this.renderAs}`;
-    }
-    get activityTypeClass() {
-        return `${this.interactionStyle}-activity`;
-    }
-    isRenderAsCard() {
-        return this.renderAs === 'card';
-    }
-    isRenderAsButton() {
-        return this.renderAs === 'button';
-    }
-    ngOnInit() {
-    }
-    get interactionContext() {
-        switch (this.interactionStyle) {
-            case 'inline':
-                return this.inlineInteractionContext;
-            default:
-                return this.modalInteractionContext;
-        }
-    }
-    isModal() {
-        return this.interactionStyle === 'modal';
-    }
-    isInline() {
-        return this.interactionStyle === 'inline';
-    }
-}
-AddCardActivityComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'aup-add-card-activity',
-                template: "<aup-in-place-interaction-context [animateFirstActivity]=\"false\" [pectinCommand]=\"startActivityCommand\">\n  <aup-command *ngIf=\"isRenderAsButton()\" [command]=\"startActivityCommand\" [faceModel]=\"faceModel\" [alignFace]=\"alignFace\"></aup-command>\n  <section *ngIf=\"isRenderAsCard()\" class=\"face-wrapper\">\n    <aup-command-face class=\"mat-button\" [faces]=\"faceList.value\"></aup-command-face>\n  </section>\n</aup-in-place-interaction-context>\n",
-                styles: [":host{display:flex;flex-direction:column;align-items:stretch}:host[interactionStyle=inline][renderas=card]:not(.active){box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}:host[interactionStyle=inline][renderas=card]:not(.active):hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}:host[interactionStyle=inline][renderas=card]:not(.active):hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}:host[interactionStyle=modal][renderas=card]{box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}:host[interactionStyle=modal][renderas=card]:hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}:host[interactionStyle=modal][renderas=card]:hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}section.face-wrapper{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}aup-in-place-interaction-context{flex:1}aup-in-place-interaction-context.active{border:3px solid #6273c7;border-radius:4px;overflow:hidden}"]
-            },] }
-];
-AddCardActivityComponent.ctorParameters = () => [
-    { type: InteractionService }
-];
-AddCardActivityComponent.propDecorators = {
-    inlineInteractionContext: [{ type: ViewChild, args: [InPlaceInteractionContextComponent, { static: true },] }],
-    interactionStyle: [{ type: Input }],
-    renderAs: [{ type: Input }, { type: HostBinding, args: ['class',] }],
-    renderAsClass: [{ type: HostBinding, args: ['class',] }],
-    activityTypeClass: [{ type: HostBinding, args: ['class',] }]
-};
-(function (AddCardActivityComponent) {
-    AddCardActivityComponent.InteractionType = Enum({
-        MODAL: 'modal',
-        INLINE: 'inline'
-    });
-    AddCardActivityComponent.RenderAs = Enum({
-        CARD: 'card',
-        BUTTON: 'button'
-    });
-})(AddCardActivityComponent || (AddCardActivityComponent = {}));
-
 /**
  * Css Vars.
  *   --link-color
@@ -5263,9 +5094,6 @@ class InlineActivityTriggerComponent extends AbstractActivityTriggerComponent {
     constructor() {
         super();
     }
-    get interactionContext() {
-        return this._interactionContext;
-    }
 }
 InlineActivityTriggerComponent.decorators = [
     { type: Component, args: [{
@@ -5276,7 +5104,7 @@ InlineActivityTriggerComponent.decorators = [
 ];
 InlineActivityTriggerComponent.ctorParameters = () => [];
 InlineActivityTriggerComponent.propDecorators = {
-    _interactionContext: [{ type: ViewChild, args: [InPlaceInteractionContextComponent, { static: true },] }]
+    interactionContext: [{ type: ViewChild, args: [InPlaceInteractionContextComponent, { static: true },] }]
 };
 
 /**
@@ -5661,9 +5489,6 @@ class PopupActivityTriggerComponent extends AbstractActivityTriggerComponent {
         this.anchorX = 'start';
         this.anchorY = 'bottom';
     }
-    get interactionContext() {
-        return this._interactionContext;
-    }
 }
 PopupActivityTriggerComponent.decorators = [
     { type: Component, args: [{
@@ -5676,7 +5501,7 @@ PopupActivityTriggerComponent.ctorParameters = () => [];
 PopupActivityTriggerComponent.propDecorators = {
     anchorX: [{ type: Input }],
     anchorY: [{ type: Input }],
-    _interactionContext: [{ type: ViewChild, args: [PopupInteractionContextComponent, { static: true },] }]
+    interactionContext: [{ type: ViewChild, args: [PopupInteractionContextComponent, { static: true },] }]
 };
 
 class InteractionModule {
@@ -5717,8 +5542,7 @@ InteractionModule.decorators = [
                     AbstractActivityTriggerComponent,
                     PopupActivityTriggerComponent,
                     InlineActivityTriggerComponent,
-                    ModalActivityTriggerComponent,
-                    AddCardActivityComponent,
+                    ModalActivityTriggerComponent
                 ],
                 exports: [
                     ActivityContainerComponent,
@@ -5734,8 +5558,7 @@ InteractionModule.decorators = [
                     ActivityBodyComponent,
                     PopupActivityTriggerComponent,
                     InlineActivityTriggerComponent,
-                    ModalActivityTriggerComponent,
-                    AddCardActivityComponent,
+                    ModalActivityTriggerComponent
                 ],
                 entryComponents: [
                     ActivityContainerComponent,
@@ -7196,7 +7019,6 @@ class UrlSnapshot {
         this.url = url;
         this.urlTree = urlSerializer.parse(url);
     }
-    // @Trace()
     updateVisitSegments(visit) {
         const newUrlTree = this.urlSerializer.parse(this.url);
         // Ugly, but it works for now.
@@ -7273,6 +7095,12 @@ class UrlSnapshot {
         return `UrlSnapshot(${this.url})`;
     }
 }
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [Visit]),
+    __metadata("design:returntype", UrlSnapshot)
+], UrlSnapshot.prototype, "updateVisitSegments", null);
 __decorate([
     Memoize(),
     __metadata("design:type", Function),
@@ -7614,7 +7442,6 @@ class PlaceRouter extends GarbageCollector {
      * to be able to capture the back button on the first page.  If we don't then the back click will exit
      * the app directly and we don't get to ask.
      */
-    // @Trace()
     syncInteractionContextIdsWithRouter() {
         if (this.navigationSession) {
             // console.log(`Navigation active -> ${this.navigationSession.toString()}, sync delayed until finished.`);
@@ -7656,6 +7483,12 @@ PlaceRouter.ctorParameters = () => [
     { type: UrlService },
     { type: PlaceHistory }
 ];
+__decorate([
+    Trace(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", Promise)
+], PlaceRouter.prototype, "syncInteractionContextIdsWithRouter", null);
 (function (PlaceRouter) {
     class State {
         constructor(activeVisits) {
@@ -8672,5 +8505,5 @@ VisibilityService.ctorParameters = () => [
  * Generated bundle index. Do not edit.
  */
 
-export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AUP_UNAUTHORISED_PLACE_NOTICE_COMPONENT, AbstractActivityTriggerComponent, AbstractCardContainerComponent, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractPopupMenuComponent, AbstractTableComponent, AbstractTableModel, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityBodyComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, ActivityTitleComponent, AddCardActivityComponent, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CardStackComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnListModel, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandContainer, CommandDirective, CommandFace, CommandFaceComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DecoratedTreeNode, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlattenedTreeListModel, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, HighlightPipe, HighlightTextModelDirective, HorizontalAlignment, IconComponent, InPlaceInteractionContextComponent, InlineActivityTriggerComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalActivityTriggerComponent, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NotAuthorisedNoticeComponent, NumberInputComponent, POPUP_CONTAINER, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, PaginatorComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceAccessGuard, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupActivityTriggerComponent, PopupAwareComponent, PopupInteractionContextComponent, PopupMenuComponent, PopupMenuRendererComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SelfAndDescendantsVisitor, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, TreeExpansionModel, TreeInheritanceIconComponent, TreeLabelCellRendererComponent, TreeLabelColumnModel, TreeTableComponent, TreeTableModel, UrlService, UrlSnapshot, VerticalFocusContainerComponent, VisibilityService, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, treeNodeDecorator, ɵ0 };
+export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AUP_UNAUTHORISED_PLACE_NOTICE_COMPONENT, AbstractActivityTriggerComponent, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractPopupMenuComponent, AbstractTableComponent, AbstractTableModel, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityBodyComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, ActivityTitleComponent, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnListModel, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandContainer, CommandDirective, CommandFace, CommandFaceComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DecoratedTreeNode, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlattenedTreeListModel, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, HighlightPipe, HighlightTextModelDirective, HorizontalAlignment, IconComponent, InPlaceInteractionContextComponent, InlineActivityTriggerComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalActivityTriggerComponent, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NotAuthorisedNoticeComponent, NumberInputComponent, POPUP_CONTAINER, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, PaginatorComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceAccessGuard, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupActivityTriggerComponent, PopupAwareComponent, PopupInteractionContextComponent, PopupMenuComponent, PopupMenuRendererComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SelfAndDescendantsVisitor, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, TreeExpansionModel, TreeInheritanceIconComponent, TreeLabelCellRendererComponent, TreeLabelColumnModel, TreeTableComponent, TreeTableModel, UrlService, UrlSnapshot, VerticalFocusContainerComponent, VisibilityService, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, treeNodeDecorator, ɵ0 };
 //# sourceMappingURL=coolon-angular-ui-powerups.js.map