@coolon/angular-ui-powerups 2.0.0-alpha.28 → 2.0.0-alpha.29

package/esm2015/lib/components/commands/popup-menu/abstract-popup-menu.component.js

@@ -1,5 +1,5 @@
 import { __decorate, __metadata } from "tslib";
-import { Component, Input, ViewChild } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { CommandContainer } from '../command-container';
 import { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';
@@ -7,11 +7,15 @@ import { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-re
  *
  */
 let AbstractPopupMenuComponent = class AbstractPopupMenuComponent extends CommandContainer {
-    constructor() {
+    constructor(cdr) {
         super();
+        this.cdr = cdr;
         this.xPosition = 'after';
         this.yPosition = 'below';
     }
+    ngAfterViewInit() {
+        this.cdr.detectChanges();
+    }
     get matMenuComponent() {
         var _a;
         return (_a = this.popupMenu) === null || _a === void 0 ? void 0 : _a.matMenu;
@@ -23,6 +27,9 @@ let AbstractPopupMenuComponent = class AbstractPopupMenuComponent extends Comman
         return registration.faceAdapter.destructive ? 'warn' : undefined;
     }
 };
+AbstractPopupMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(),
     __metadata("design:type", String)
@@ -44,7 +51,7 @@ AbstractPopupMenuComponent = __decorate([
         selector: 'aup-abstract-popup-menu',
         template: ''
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], AbstractPopupMenuComponent);
 export { AbstractPopupMenuComponent };
 //# sourceMappingURL=abstract-popup-menu.component.js.map

package/esm2015/lib/components/commands/popup-menu/abstract-popup-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/abstract-popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAc,KAAK,EAAU,SAAS,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAW,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG;;GAEG;AAKH,IAAa,0BAA0B,GAAvC,MAAa,0BAA2B,SAAQ,gBAAgB;IAc9D;QACE,KAAK,EAAE,CAAC;QAZV,cAAS,GAAuB,OAAO,CAAC;QAGxC,cAAS,GAAsB,OAAO,CAAC;IAUvC,CAAC;IAED,IAAI,gBAAgB;;QAClB,aAAO,IAAI,CAAC,SAAS,0CAAE,OAAO,CAAC;IACjC,CAAC;IAED,SAAS;QACP,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,cAAc,CAAC,YAA2C;QACxD,OAAO,YAAY,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,CAAC;CAEF,CAAA;AA3BC;IADC,KAAK,EAAE;;6DACgC;AAGxC;IADC,KAAK,EAAE;;6DAC+B;AAGvC;IADC,SAAS,CAAC,0BAA0B,CAAC;8BACnB,0BAA0B;6DAAC;AAG9C;IADC,SAAS,CAAC,cAAc,CAAC;8BACb,cAAc;+DAAC;AAZjB,0BAA0B;IAJtC,SAAS,CAAC;QACT,QAAQ,EAAE,yBAAyB;QACnC,QAAQ,EAAE,EAAE;KACb,CAAC;;GACW,0BAA0B,CA8BtC;SA9BY,0BAA0B","sourcesContent":["import { Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';\nimport { MatMenu, MatMenuTrigger } from '@angular/material/menu';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-abstract-popup-menu',\n  template: '',\n})\nexport class AbstractPopupMenuComponent extends CommandContainer {\n\n  @Input()\n  xPosition: 'before' | 'after' = 'after';\n\n  @Input()\n  yPosition: 'above' | 'below' = 'below';\n\n  @ViewChild(PopupMenuRendererComponent)\n  private popupMenu: PopupMenuRendererComponent;\n\n  @ViewChild(MatMenuTrigger)\n  menuTrigger: MatMenuTrigger;\n\n  constructor() {\n    super();\n  }\n\n  get matMenuComponent(): MatMenu {\n    return this.popupMenu?.matMenu;\n  }\n\n  closeMenu() {\n    this.menuTrigger.closeMenu();\n  }\n\n  getButtonColor(registration: CommandContainer.Registration) {\n    return registration.faceAdapter.destructive ? 'warn' : undefined;\n  }\n\n}\n"]}
+{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/abstract-popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAClH,OAAO,EAAW,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG;;GAEG;AAKH,IAAa,0BAA0B,GAAvC,MAAa,0BAA2B,SAAQ,gBAAgB;IAc9D,YAA6B,GAAsB;QACjD,KAAK,EAAE,CAAC;QADmB,QAAG,GAAH,GAAG,CAAmB;QAXnD,cAAS,GAAuB,OAAO,CAAC;QAGxC,cAAS,GAAsB,OAAO,CAAC;IAUvC,CAAC;IAED,eAAe;QACb,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAA;IAC1B,CAAC;IAGD,IAAI,gBAAgB;;QAClB,aAAO,IAAI,CAAC,SAAS,0CAAE,OAAO,CAAC;IACjC,CAAC;IAED,SAAS;QACP,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,cAAc,CAAC,YAA2C;QACxD,OAAO,YAAY,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,CAAC;CAEF,CAAA;;YArBmC,iBAAiB;;AAXnD;IADC,KAAK,EAAE;;6DACgC;AAGxC;IADC,KAAK,EAAE;;6DAC+B;AAGvC;IADC,SAAS,CAAC,0BAA0B,CAAC;8BACnB,0BAA0B;6DAAC;AAG9C;IADC,SAAS,CAAC,cAAc,CAAC;8BACb,cAAc;+DAAC;AAZjB,0BAA0B;IAJtC,SAAS,CAAC;QACT,QAAQ,EAAE,yBAAyB;QACnC,QAAQ,EAAE,EAAE;KACb,CAAC;qCAekC,iBAAiB;GAdxC,0BAA0B,CAmCtC;SAnCY,0BAA0B","sourcesContent":["import { AfterViewInit, ChangeDetectorRef, Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';\nimport { MatMenu, MatMenuTrigger } from '@angular/material/menu';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-abstract-popup-menu',\n  template: '',\n})\nexport class AbstractPopupMenuComponent extends CommandContainer implements AfterViewInit {\n\n  @Input()\n  xPosition: 'before' | 'after' = 'after';\n\n  @Input()\n  yPosition: 'above' | 'below' = 'below';\n\n  @ViewChild(PopupMenuRendererComponent)\n  private popupMenu: PopupMenuRendererComponent;\n\n  @ViewChild(MatMenuTrigger)\n  menuTrigger: MatMenuTrigger;\n\n  constructor(private readonly cdr: ChangeDetectorRef) {\n    super();\n  }\n\n  ngAfterViewInit(): void {\n    this.cdr.detectChanges()\n  }\n\n\n  get matMenuComponent(): MatMenu {\n    return this.popupMenu?.matMenu;\n  }\n\n  closeMenu() {\n    this.menuTrigger.closeMenu();\n  }\n\n  getButtonColor(registration: CommandContainer.Registration) {\n    return registration.faceAdapter.destructive ? 'warn' : undefined;\n  }\n\n}\n"]}

package/esm2015/lib/components/commands/popup-menu/abstract-popup-menu.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"AbstractPopupMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":15,"character":48},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"aup-abstract-popup-menu","template":""}]}],"members":{"xPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"yPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"popupMenu":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":23,"character":3},"arguments":[{"__symbolic":"reference","module":"../popup-menu-renderer/popup-menu-renderer.component","name":"PopupMenuRendererComponent","line":23,"character":13}]}]}],"menuTrigger":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuTrigger","line":26,"character":13}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"closeMenu":[{"__symbolic":"method"}],"getButtonColor":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"AbstractPopupMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":15,"character":48},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"aup-abstract-popup-menu","template":""}]}],"members":{"xPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"yPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"popupMenu":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":23,"character":3},"arguments":[{"__symbolic":"reference","module":"../popup-menu-renderer/popup-menu-renderer.component","name":"PopupMenuRendererComponent","line":23,"character":13}]}]}],"menuTrigger":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuTrigger","line":26,"character":13}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":29,"character":36}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"closeMenu":[{"__symbolic":"method"}],"getButtonColor":[{"__symbolic":"method"}]}}}}]

package/esm2015/lib/components/commands/popup-menu/more-menu.component.js

@@ -1,16 +1,20 @@
 var MoreMenuComponent_1;
 import { __decorate, __metadata } from "tslib";
-import { Component, forwardRef, Input } from '@angular/core';
+import { ChangeDetectorRef, Component, forwardRef, Input } from '@angular/core';
 import { CommandContainer } from '../command-container';
 import { AbstractPopupMenuComponent } from './abstract-popup-menu.component';
 /**
  *
  */
 let MoreMenuComponent = MoreMenuComponent_1 = class MoreMenuComponent extends AbstractPopupMenuComponent {
-    constructor() {
-        super();
+    constructor(cdr) {
+        super(cdr);
+        this.xPosition = "before"; // this should be the default unless overriden by the user.
     }
 };
+MoreMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(),
     __metadata("design:type", String)
@@ -24,12 +28,13 @@ MoreMenuComponent = MoreMenuComponent_1 = __decorate([
       <mat-icon>more_vert</mat-icon>
     </button>
     <aup-popup-menu-renderer [commandRegistrations]="commandRegistrations"
-                             [yPosition]="yPosition" [xPosition]="xPosition"
+                             [xPosition]="xPosition"
+                             [yPosition]="yPosition"
                              (commandExecuted)="closeMenu()"></aup-popup-menu-renderer>
   `,
         providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent_1) }]
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], MoreMenuComponent);
 export { MoreMenuComponent };
 //# sourceMappingURL=more-menu.component.js.map

package/esm2015/lib/components/commands/popup-menu/more-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"more-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/more-menu.component.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAcH,IAAa,iBAAiB,yBAA9B,MAAa,iBAAkB,SAAQ,0BAA0B;IAK/D;QACE,KAAK,EAAE,CAAC;IACV,CAAC;CAEF,CAAA;AANC;IADC,KAAK,EAAE;;kDACQ;AAHL,iBAAiB;IAb7B,SAAS,CAAC;QACT,QAAQ,EAAE,eAAe;QACzB,QAAQ,EAAE;;;;;;;;GAQT;QACD,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,mBAAiB,CAAC,EAAE,CAAC;KAC7F,CAAC;;GACW,iBAAiB,CAS7B;SATY,iBAAiB","sourcesContent":["import { Component, forwardRef, Input } from '@angular/core';\nimport { CommandContainer } from '../command-container';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-more-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [yPosition]=\"yPosition\" [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent) }]\n})\nexport class MoreMenuComponent extends AbstractPopupMenuComponent {\n\n  @Input()\n  tooltip: string;\n\n  constructor() {\n    super();\n  }\n\n}\n"]}
+{"version":3,"file":"more-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/more-menu.component.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH,IAAa,iBAAiB,yBAA9B,MAAa,iBAAkB,SAAQ,0BAA0B;IAK/D,YAAY,GAAsB;QAChC,KAAK,CAAC,GAAG,CAAC,CAAC;QACX,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,CAAC,2DAA2D;IACxF,CAAC;CAEF,CAAA;;YALkB,iBAAiB;;AAFlC;IADC,KAAK,EAAE;;kDACQ;AAHL,iBAAiB;IAd7B,SAAS,CAAC;QACT,QAAQ,EAAE,eAAe;QACzB,QAAQ,EAAE;;;;;;;;;GAST;QACD,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,mBAAiB,CAAC,EAAE,CAAC;KAC7F,CAAC;qCAMiB,iBAAiB;GALvB,iBAAiB,CAU7B;SAVY,iBAAiB","sourcesContent":["import { ChangeDetectorRef, Component, forwardRef, Input } from '@angular/core';\nimport { CommandContainer } from '../command-container';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-more-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [xPosition]=\"xPosition\"\n                             [yPosition]=\"yPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent) }]\n})\nexport class MoreMenuComponent extends AbstractPopupMenuComponent {\n\n  @Input()\n  tooltip: string;\n\n  constructor(cdr: ChangeDetectorRef) {\n    super(cdr);\n    this.xPosition = \"before\"; // this should be the default unless overriden by the user.\n  }\n\n}\n"]}

package/esm2015/lib/components/commands/popup-menu/more-menu.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"MoreMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-popup-menu.component","name":"AbstractPopupMenuComponent","line":20,"character":39},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"aup-more-menu","template":"\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [yPosition]=\"yPosition\" [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ","providers":[{"provide":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":18,"character":25},"useExisting":{"__symbolic":"reference","name":"MoreMenuComponent"}}]}]}],"members":{"tooltip":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"MoreMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-popup-menu.component","name":"AbstractPopupMenuComponent","line":21,"character":39},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"aup-more-menu","template":"\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [xPosition]=\"xPosition\"\n                             [yPosition]=\"yPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ","providers":[{"provide":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":19,"character":25},"useExisting":{"__symbolic":"reference","name":"MoreMenuComponent"}}]}]}],"members":{"tooltip":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":26,"character":19}]}]}}}}]

package/esm2015/lib/components/commands/popup-menu/popup-menu.component.js

@@ -1,6 +1,6 @@
 var PopupMenuComponent_1;
 import { __decorate, __metadata } from "tslib";
-import { Component, forwardRef, Input } from '@angular/core';
+import { ChangeDetectorRef, Component, forwardRef, Input, OnInit } from '@angular/core';
 import { Dsl, MutableValueModel, StoreInValueModel } from '@coolon/pectin';
 import { CommandContainer } from '../command-container';
 import { CommandFace } from '../command-face';
@@ -9,8 +9,8 @@ import { AbstractPopupMenuComponent } from './abstract-popup-menu.component';
  *
  */
 let PopupMenuComponent = PopupMenuComponent_1 = class PopupMenuComponent extends AbstractPopupMenuComponent {
-    constructor() {
-        super();
+    constructor(cdr) {
+        super(cdr);
         this.faceModel = new MutableValueModel();
         const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
         const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));
@@ -22,6 +22,9 @@ let PopupMenuComponent = PopupMenuComponent_1 = class PopupMenuComponent extends
     ngOnInit() {
     }
 };
+PopupMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(), StoreInValueModel('faceModel'),
     __metadata("design:type", Object)
@@ -40,7 +43,7 @@ PopupMenuComponent = PopupMenuComponent_1 = __decorate([
   `,
         providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent_1) }]
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], PopupMenuComponent);
 export { PopupMenuComponent };
 //# sourceMappingURL=popup-menu.component.js.map

package/esm2015/lib/components/commands/popup-menu/popup-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/popup-menu.component.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAErE,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,iBAAiB,EAAmB,MAAM,gBAAgB,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH,IAAa,kBAAkB,0BAA/B,MAAa,kBAAmB,SAAQ,0BAA0B;IAShE;QACE,KAAK,EAAE,CAAC;QARO,cAAS,GAAG,IAAI,iBAAiB,EAAe,CAAC;QAShE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzF,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1F,IAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC5D,CAAC;IAED,UAAU;QACR,OAAO,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;IACrC,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAlBC;IADC,KAAK,EAAE,EAAE,iBAAiB,CAAC,WAAW,CAAC;;gDACtB;AALP,kBAAkB;IAd9B,SAAS,CAAC;QACT,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE;;;;;;;;GAQT;QAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,oBAAkB,CAAC,EAAE,CAAC;KAC9F,CAAC;;GACW,kBAAkB,CAuB9B;SAvBY,kBAAkB","sourcesContent":["import { Component, forwardRef, Input, OnInit } from '@angular/core';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-popup-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  styleUrls: [],\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent) }]\n})\nexport class PopupMenuComponent extends AbstractPopupMenuComponent implements OnInit {\n\n  private readonly faceModel = new MutableValueModel<CommandFace>();\n\n  @Input() @StoreInValueModel('faceModel')\n  face: CommandFace;\n\n  private faceTooltipModel: ValueModelChain<string>;\n\n  constructor() {\n    super();\n    const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n    const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));\n    this.faceTooltipModel = faceAdapterModel.pluck('tooltip');\n  }\n\n  getTooltip() {\n    return this.faceTooltipModel.value;\n  }\n\n  ngOnInit() {\n  }\n\n}\n"]}
+{"version":3,"file":"popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/popup-menu.component.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAExF,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,iBAAiB,EAAmB,MAAM,gBAAgB,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH,IAAa,kBAAkB,0BAA/B,MAAa,kBAAmB,SAAQ,0BAA0B;IAShE,YAAY,GAAsB;QAChC,KAAK,CAAC,GAAG,CAAC,CAAC;QARI,cAAS,GAAG,IAAI,iBAAiB,EAAe,CAAC;QAShE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzF,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1F,IAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC5D,CAAC;IAED,UAAU;QACR,OAAO,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;IACrC,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;;YAdkB,iBAAiB;;AAJlC;IADC,KAAK,EAAE,EAAE,iBAAiB,CAAC,WAAW,CAAC;;gDACtB;AALP,kBAAkB;IAd9B,SAAS,CAAC;QACT,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE;;;;;;;;GAQT;QAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,oBAAkB,CAAC,EAAE,CAAC;KAC9F,CAAC;qCAUiB,iBAAiB;GATvB,kBAAkB,CAuB9B;SAvBY,kBAAkB","sourcesContent":["import { ChangeDetectorRef, Component, forwardRef, Input, OnInit } from '@angular/core';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-popup-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  styleUrls: [],\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent) }]\n})\nexport class PopupMenuComponent extends AbstractPopupMenuComponent implements OnInit {\n\n  private readonly faceModel = new MutableValueModel<CommandFace>();\n\n  @Input() @StoreInValueModel('faceModel')\n  face: CommandFace;\n\n  private faceTooltipModel: ValueModelChain<string>;\n\n  constructor(cdr: ChangeDetectorRef) {\n    super(cdr);\n    const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n    const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));\n    this.faceTooltipModel = faceAdapterModel.pluck('tooltip');\n  }\n\n  getTooltip() {\n    return this.faceTooltipModel.value;\n  }\n\n  ngOnInit() {\n  }\n\n}\n"]}

package/esm2015/lib/components/commands/popup-menu/popup-menu.component.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":4,"metadata":{"PopupMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-popup-menu.component","name":"AbstractPopupMenuComponent","line":24,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"aup-popup-menu","template":"\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ","styleUrls":[],"providers":[{"provide":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":22,"character":25},"useExisting":{"__symbolic":"reference","name":"PopupMenuComponent"}}]}]}],"members":{"face":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInValueModel","line":28,"character":12},"arguments":["faceModel"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"getTooltip":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"PopupMenuComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-popup-menu.component","name":"AbstractPopupMenuComponent","line":24,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"aup-popup-menu","template":"\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ","styleUrls":[],"providers":[{"provide":{"__symbolic":"reference","module":"../command-container","name":"CommandContainer","line":22,"character":25},"useExisting":{"__symbolic":"reference","name":"PopupMenuComponent"}}]}]}],"members":{"face":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInValueModel","line":28,"character":12},"arguments":["faceModel"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":33,"character":19}]}],"getTooltip":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]

package/esm5/lib/components/commands/popup-menu/abstract-popup-menu.component.js

@@ -1,5 +1,5 @@
 import { __decorate, __extends, __metadata } from "tslib";
-import { Component, Input, ViewChild } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { CommandContainer } from '../command-container';
 import { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';
@@ -8,12 +8,16 @@ import { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-re
  */
 var AbstractPopupMenuComponent = /** @class */ (function (_super) {
     __extends(AbstractPopupMenuComponent, _super);
-    function AbstractPopupMenuComponent() {
+    function AbstractPopupMenuComponent(cdr) {
         var _this = _super.call(this) || this;
+        _this.cdr = cdr;
         _this.xPosition = 'after';
         _this.yPosition = 'below';
         return _this;
     }
+    AbstractPopupMenuComponent.prototype.ngAfterViewInit = function () {
+        this.cdr.detectChanges();
+    };
     Object.defineProperty(AbstractPopupMenuComponent.prototype, "matMenuComponent", {
         get: function () {
             var _a;
@@ -28,6 +32,9 @@ var AbstractPopupMenuComponent = /** @class */ (function (_super) {
     AbstractPopupMenuComponent.prototype.getButtonColor = function (registration) {
         return registration.faceAdapter.destructive ? 'warn' : undefined;
     };
+    AbstractPopupMenuComponent.ctorParameters = function () { return [
+        { type: ChangeDetectorRef }
+    ]; };
     __decorate([
         Input(),
         __metadata("design:type", String)
@@ -49,7 +56,7 @@ var AbstractPopupMenuComponent = /** @class */ (function (_super) {
             selector: 'aup-abstract-popup-menu',
             template: ''
         }),
-        __metadata("design:paramtypes", [])
+        __metadata("design:paramtypes", [ChangeDetectorRef])
     ], AbstractPopupMenuComponent);
     return AbstractPopupMenuComponent;
 }(CommandContainer));

package/esm5/lib/components/commands/popup-menu/abstract-popup-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/abstract-popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAc,KAAK,EAAU,SAAS,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAW,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG;;GAEG;AAKH;IAAgD,8CAAgB;IAc9D;QAAA,YACE,iBAAO,SACR;QAbD,eAAS,GAAuB,OAAO,CAAC;QAGxC,eAAS,GAAsB,OAAO,CAAC;;IAUvC,CAAC;IAED,sBAAI,wDAAgB;aAApB;;YACE,aAAO,IAAI,CAAC,SAAS,0CAAE,OAAO,CAAC;QACjC,CAAC;;;OAAA;IAED,8CAAS,GAAT;QACE,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,mDAAc,GAAd,UAAe,YAA2C;QACxD,OAAO,YAAY,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,CAAC;IAzBD;QADC,KAAK,EAAE;;iEACgC;IAGxC;QADC,KAAK,EAAE;;iEAC+B;IAGvC;QADC,SAAS,CAAC,0BAA0B,CAAC;kCACnB,0BAA0B;iEAAC;IAG9C;QADC,SAAS,CAAC,cAAc,CAAC;kCACb,cAAc;mEAAC;IAZjB,0BAA0B;QAJtC,SAAS,CAAC;YACT,QAAQ,EAAE,yBAAyB;YACnC,QAAQ,EAAE,EAAE;SACb,CAAC;;OACW,0BAA0B,CA8BtC;IAAD,iCAAC;CAAA,AA9BD,CAAgD,gBAAgB,GA8B/D;SA9BY,0BAA0B","sourcesContent":["import { Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';\nimport { MatMenu, MatMenuTrigger } from '@angular/material/menu';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-abstract-popup-menu',\n  template: '',\n})\nexport class AbstractPopupMenuComponent extends CommandContainer {\n\n  @Input()\n  xPosition: 'before' | 'after' = 'after';\n\n  @Input()\n  yPosition: 'above' | 'below' = 'below';\n\n  @ViewChild(PopupMenuRendererComponent)\n  private popupMenu: PopupMenuRendererComponent;\n\n  @ViewChild(MatMenuTrigger)\n  menuTrigger: MatMenuTrigger;\n\n  constructor() {\n    super();\n  }\n\n  get matMenuComponent(): MatMenu {\n    return this.popupMenu?.matMenu;\n  }\n\n  closeMenu() {\n    this.menuTrigger.closeMenu();\n  }\n\n  getButtonColor(registration: CommandContainer.Registration) {\n    return registration.faceAdapter.destructive ? 'warn' : undefined;\n  }\n\n}\n"]}
+{"version":3,"file":"abstract-popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/abstract-popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAClH,OAAO,EAAW,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAExD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sDAAsD,CAAC;AAElG;;GAEG;AAKH;IAAgD,8CAAgB;IAc9D,oCAA6B,GAAsB;QAAnD,YACE,iBAAO,SACR;QAF4B,SAAG,GAAH,GAAG,CAAmB;QAXnD,eAAS,GAAuB,OAAO,CAAC;QAGxC,eAAS,GAAsB,OAAO,CAAC;;IAUvC,CAAC;IAED,oDAAe,GAAf;QACE,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAA;IAC1B,CAAC;IAGD,sBAAI,wDAAgB;aAApB;;YACE,aAAO,IAAI,CAAC,SAAS,0CAAE,OAAO,CAAC;QACjC,CAAC;;;OAAA;IAED,8CAAS,GAAT;QACE,IAAI,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC;IAC/B,CAAC;IAED,mDAAc,GAAd,UAAe,YAA2C;QACxD,OAAO,YAAY,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,CAAC;;gBAnBiC,iBAAiB;;IAXnD;QADC,KAAK,EAAE;;iEACgC;IAGxC;QADC,KAAK,EAAE;;iEAC+B;IAGvC;QADC,SAAS,CAAC,0BAA0B,CAAC;kCACnB,0BAA0B;iEAAC;IAG9C;QADC,SAAS,CAAC,cAAc,CAAC;kCACb,cAAc;mEAAC;IAZjB,0BAA0B;QAJtC,SAAS,CAAC;YACT,QAAQ,EAAE,yBAAyB;YACnC,QAAQ,EAAE,EAAE;SACb,CAAC;yCAekC,iBAAiB;OAdxC,0BAA0B,CAmCtC;IAAD,iCAAC;CAAA,AAnCD,CAAgD,gBAAgB,GAmC/D;SAnCY,0BAA0B","sourcesContent":["import { AfterViewInit, ChangeDetectorRef, Component, forwardRef, Input, OnInit, ViewChild } from '@angular/core';\nimport { MatMenu, MatMenuTrigger } from '@angular/material/menu';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { PopupMenuRendererComponent } from '../popup-menu-renderer/popup-menu-renderer.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-abstract-popup-menu',\n  template: '',\n})\nexport class AbstractPopupMenuComponent extends CommandContainer implements AfterViewInit {\n\n  @Input()\n  xPosition: 'before' | 'after' = 'after';\n\n  @Input()\n  yPosition: 'above' | 'below' = 'below';\n\n  @ViewChild(PopupMenuRendererComponent)\n  private popupMenu: PopupMenuRendererComponent;\n\n  @ViewChild(MatMenuTrigger)\n  menuTrigger: MatMenuTrigger;\n\n  constructor(private readonly cdr: ChangeDetectorRef) {\n    super();\n  }\n\n  ngAfterViewInit(): void {\n    this.cdr.detectChanges()\n  }\n\n\n  get matMenuComponent(): MatMenu {\n    return this.popupMenu?.matMenu;\n  }\n\n  closeMenu() {\n    this.menuTrigger.closeMenu();\n  }\n\n  getButtonColor(registration: CommandContainer.Registration) {\n    return registration.faceAdapter.destructive ? 'warn' : undefined;\n  }\n\n}\n"]}

package/esm5/lib/components/commands/popup-menu/more-menu.component.js

@@ -1,5 +1,5 @@
 import { __decorate, __extends, __metadata } from "tslib";
-import { Component, forwardRef, Input } from '@angular/core';
+import { ChangeDetectorRef, Component, forwardRef, Input } from '@angular/core';
 import { CommandContainer } from '../command-container';
 import { AbstractPopupMenuComponent } from './abstract-popup-menu.component';
 /**
@@ -7,11 +7,16 @@ import { AbstractPopupMenuComponent } from './abstract-popup-menu.component';
  */
 var MoreMenuComponent = /** @class */ (function (_super) {
     __extends(MoreMenuComponent, _super);
-    function MoreMenuComponent() {
-        return _super.call(this) || this;
+    function MoreMenuComponent(cdr) {
+        var _this = _super.call(this, cdr) || this;
+        _this.xPosition = "before"; // this should be the default unless overriden by the user.
+        return _this;
     }
     MoreMenuComponent_1 = MoreMenuComponent;
     var MoreMenuComponent_1;
+    MoreMenuComponent.ctorParameters = function () { return [
+        { type: ChangeDetectorRef }
+    ]; };
     __decorate([
         Input(),
         __metadata("design:type", String)
@@ -19,10 +24,10 @@ var MoreMenuComponent = /** @class */ (function (_super) {
     MoreMenuComponent = MoreMenuComponent_1 = __decorate([
         Component({
             selector: 'aup-more-menu',
-            template: "\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [yPosition]=\"yPosition\" [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ",
+            template: "\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [xPosition]=\"xPosition\"\n                             [yPosition]=\"yPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ",
             providers: [{ provide: CommandContainer, useExisting: forwardRef(function () { return MoreMenuComponent_1; }) }]
         }),
-        __metadata("design:paramtypes", [])
+        __metadata("design:paramtypes", [ChangeDetectorRef])
     ], MoreMenuComponent);
     return MoreMenuComponent;
 }(AbstractPopupMenuComponent));

package/esm5/lib/components/commands/popup-menu/more-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"more-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/more-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAcH;IAAuC,qCAA0B;IAK/D;eACE,iBAAO;IACT,CAAC;0BAPU,iBAAiB;;IAG5B;QADC,KAAK,EAAE;;sDACQ;IAHL,iBAAiB;QAb7B,SAAS,CAAC;YACT,QAAQ,EAAE,eAAe;YACzB,QAAQ,EAAE,kiBAQT;YACD,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,cAAM,OAAA,mBAAiB,EAAjB,CAAiB,CAAC,EAAE,CAAC;SAC7F,CAAC;;OACW,iBAAiB,CAS7B;IAAD,wBAAC;CAAA,AATD,CAAuC,0BAA0B,GAShE;SATY,iBAAiB","sourcesContent":["import { Component, forwardRef, Input } from '@angular/core';\nimport { CommandContainer } from '../command-container';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-more-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [yPosition]=\"yPosition\" [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent) }]\n})\nexport class MoreMenuComponent extends AbstractPopupMenuComponent {\n\n  @Input()\n  tooltip: string;\n\n  constructor() {\n    super();\n  }\n\n}\n"]}
+{"version":3,"file":"more-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/more-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH;IAAuC,qCAA0B;IAK/D,2BAAY,GAAsB;QAAlC,YACE,kBAAM,GAAG,CAAC,SAEX;QADC,KAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,CAAC,2DAA2D;;IACxF,CAAC;0BARU,iBAAiB;;;gBAKX,iBAAiB;;IAFlC;QADC,KAAK,EAAE;;sDACQ;IAHL,iBAAiB;QAd7B,SAAS,CAAC;YACT,QAAQ,EAAE,eAAe;YACzB,QAAQ,EAAE,gkBAST;YACD,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,cAAM,OAAA,mBAAiB,EAAjB,CAAiB,CAAC,EAAE,CAAC;SAC7F,CAAC;yCAMiB,iBAAiB;OALvB,iBAAiB,CAU7B;IAAD,wBAAC;CAAA,AAVD,CAAuC,0BAA0B,GAUhE;SAVY,iBAAiB","sourcesContent":["import { ChangeDetectorRef, Component, forwardRef, Input } from '@angular/core';\nimport { CommandContainer } from '../command-container';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-more-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"tooltip\">\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\"\n                             [xPosition]=\"xPosition\"\n                             [yPosition]=\"yPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent) }]\n})\nexport class MoreMenuComponent extends AbstractPopupMenuComponent {\n\n  @Input()\n  tooltip: string;\n\n  constructor(cdr: ChangeDetectorRef) {\n    super(cdr);\n    this.xPosition = \"before\"; // this should be the default unless overriden by the user.\n  }\n\n}\n"]}

package/esm5/lib/components/commands/popup-menu/popup-menu.component.js

@@ -1,5 +1,5 @@
 import { __decorate, __extends, __metadata } from "tslib";
-import { Component, forwardRef, Input } from '@angular/core';
+import { ChangeDetectorRef, Component, forwardRef, Input, OnInit } from '@angular/core';
 import { Dsl, MutableValueModel, StoreInValueModel } from '@coolon/pectin';
 import { CommandContainer } from '../command-container';
 import { CommandFace } from '../command-face';
@@ -9,8 +9,8 @@ import { AbstractPopupMenuComponent } from './abstract-popup-menu.component';
  */
 var PopupMenuComponent = /** @class */ (function (_super) {
     __extends(PopupMenuComponent, _super);
-    function PopupMenuComponent() {
-        var _this = _super.call(this) || this;
+    function PopupMenuComponent(cdr) {
+        var _this = _super.call(this, cdr) || this;
         _this.faceModel = new MutableValueModel();
         var _a = Dsl.disposeWith(_this), chain = _a.chain, valueOf = _a.valueOf, before = _a.before, when = _a.when, after = _a.after, observe = _a.observe, switchOn = _a.switchOn;
         var faceAdapterModel = chain(_this.faceModel).map(function (face) { return new CommandFace.Adapter(face); });
@@ -24,6 +24,9 @@ var PopupMenuComponent = /** @class */ (function (_super) {
     PopupMenuComponent.prototype.ngOnInit = function () {
     };
     var PopupMenuComponent_1;
+    PopupMenuComponent.ctorParameters = function () { return [
+        { type: ChangeDetectorRef }
+    ]; };
     __decorate([
         Input(), StoreInValueModel('faceModel'),
         __metadata("design:type", Object)
@@ -34,7 +37,7 @@ var PopupMenuComponent = /** @class */ (function (_super) {
             template: "\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  ",
             providers: [{ provide: CommandContainer, useExisting: forwardRef(function () { return PopupMenuComponent_1; }) }]
         }),
-        __metadata("design:paramtypes", [])
+        __metadata("design:paramtypes", [ChangeDetectorRef])
     ], PopupMenuComponent);
     return PopupMenuComponent;
 }(AbstractPopupMenuComponent));

package/esm5/lib/components/commands/popup-menu/popup-menu.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAErE,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,iBAAiB,EAAmB,MAAM,gBAAgB,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH;IAAwC,sCAA0B;IAShE;QAAA,YACE,iBAAO,SAIR;QAZgB,eAAS,GAAG,IAAI,iBAAiB,EAAe,CAAC;QAS1D,IAAA,2BAAkF,EAAhF,gBAAK,EAAE,oBAAO,EAAE,kBAAM,EAAE,cAAI,EAAE,gBAAK,EAAE,oBAAO,EAAE,sBAAkC,CAAC;QACzF,IAAM,gBAAgB,GAAG,KAAK,CAAC,KAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,UAAA,IAAI,IAAI,OAAA,IAAI,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAA7B,CAA6B,CAAC,CAAC;QAC1F,KAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;;IAC5D,CAAC;2BAdU,kBAAkB;IAgB7B,uCAAU,GAAV;QACE,OAAO,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;IACrC,CAAC;IAED,qCAAQ,GAAR;IACA,CAAC;;IAhBD;QADC,KAAK,EAAE,EAAE,iBAAiB,CAAC,WAAW,CAAC;;oDACtB;IALP,kBAAkB;QAd9B,SAAS,CAAC;YACT,QAAQ,EAAE,gBAAgB;YAC1B,QAAQ,EAAE,8jBAQT;YAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,cAAM,OAAA,oBAAkB,EAAlB,CAAkB,CAAC,EAAE,CAAC;SAC9F,CAAC;;OACW,kBAAkB,CAuB9B;IAAD,yBAAC;CAAA,AAvBD,CAAwC,0BAA0B,GAuBjE;SAvBY,kBAAkB","sourcesContent":["import { Component, forwardRef, Input, OnInit } from '@angular/core';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-popup-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  styleUrls: [],\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent) }]\n})\nexport class PopupMenuComponent extends AbstractPopupMenuComponent implements OnInit {\n\n  private readonly faceModel = new MutableValueModel<CommandFace>();\n\n  @Input() @StoreInValueModel('faceModel')\n  face: CommandFace;\n\n  private faceTooltipModel: ValueModelChain<string>;\n\n  constructor() {\n    super();\n    const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n    const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));\n    this.faceTooltipModel = faceAdapterModel.pluck('tooltip');\n  }\n\n  getTooltip() {\n    return this.faceTooltipModel.value;\n  }\n\n  ngOnInit() {\n  }\n\n}\n"]}
+{"version":3,"file":"popup-menu.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/commands/popup-menu/popup-menu.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAExF,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,iBAAiB,EAAmB,MAAM,gBAAgB,CAAC;AAC5F,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAE7E;;GAEG;AAeH;IAAwC,sCAA0B;IAShE,4BAAY,GAAsB;QAAlC,YACE,kBAAM,GAAG,CAAC,SAIX;QAZgB,eAAS,GAAG,IAAI,iBAAiB,EAAe,CAAC;QAS1D,IAAA,2BAAkF,EAAhF,gBAAK,EAAE,oBAAO,EAAE,kBAAM,EAAE,cAAI,EAAE,gBAAK,EAAE,oBAAO,EAAE,sBAAkC,CAAC;QACzF,IAAM,gBAAgB,GAAG,KAAK,CAAC,KAAI,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,UAAA,IAAI,IAAI,OAAA,IAAI,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAA7B,CAA6B,CAAC,CAAC;QAC1F,KAAI,CAAC,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;;IAC5D,CAAC;2BAdU,kBAAkB;IAgB7B,uCAAU,GAAV;QACE,OAAO,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;IACrC,CAAC;IAED,qCAAQ,GAAR;IACA,CAAC;;;gBAZgB,iBAAiB;;IAJlC;QADC,KAAK,EAAE,EAAE,iBAAiB,CAAC,WAAW,CAAC;;oDACtB;IALP,kBAAkB;QAd9B,SAAS,CAAC;YACT,QAAQ,EAAE,gBAAgB;YAC1B,QAAQ,EAAE,8jBAQT;YAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,UAAU,CAAC,cAAM,OAAA,oBAAkB,EAAlB,CAAkB,CAAC,EAAE,CAAC;SAC9F,CAAC;yCAUiB,iBAAiB;OATvB,kBAAkB,CAuB9B;IAAD,yBAAC;CAAA,AAvBD,CAAwC,0BAA0B,GAuBjE;SAvBY,kBAAkB","sourcesContent":["import { ChangeDetectorRef, Component, forwardRef, Input, OnInit } from '@angular/core';\n\nimport { Dsl, MutableValueModel, StoreInValueModel, ValueModelChain } from '@coolon/pectin';\nimport { CommandContainer } from '../command-container';\nimport { CommandFace } from '../command-face';\nimport { AbstractPopupMenuComponent } from './abstract-popup-menu.component';\n\n/**\n *\n */\n@Component({\n  selector: 'aup-popup-menu',\n  template: `\n    <!-- we can only render the button after th popup menu has initialised and rendered it's menu component -->\n    <button *ngIf=\"matMenuComponent\" mat-icon-button [matMenuTriggerFor]=\"matMenuComponent\" [matTooltip]=\"getTooltip()\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <aup-popup-menu-renderer [commandRegistrations]=\"commandRegistrations\" [yPosition]=\"yPosition\"\n                             [xPosition]=\"xPosition\"\n                             (commandExecuted)=\"closeMenu()\"></aup-popup-menu-renderer>\n  `,\n  styleUrls: [],\n  providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent) }]\n})\nexport class PopupMenuComponent extends AbstractPopupMenuComponent implements OnInit {\n\n  private readonly faceModel = new MutableValueModel<CommandFace>();\n\n  @Input() @StoreInValueModel('faceModel')\n  face: CommandFace;\n\n  private faceTooltipModel: ValueModelChain<string>;\n\n  constructor(cdr: ChangeDetectorRef) {\n    super(cdr);\n    const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n    const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));\n    this.faceTooltipModel = faceAdapterModel.pluck('tooltip');\n  }\n\n  getTooltip() {\n    return this.faceTooltipModel.value;\n  }\n\n  ngOnInit() {\n  }\n\n}\n"]}

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

@@ -1,6 +1,6 @@
 import { __decorate, __metadata, __param, __awaiter } from 'tslib';
 import { DOCUMENT, CommonModule, Location } from '@angular/common';
-import { ElementRef, Inject, Input, HostListener, Directive, NgZone, ɵɵdefineInjectable, ɵɵinject, Injectable, NgModule, ContentChild, TemplateRef, Component, forwardRef, Optional, HostBinding, ViewEncapsulation, EventEmitter, Output, ViewChild, Self, ChangeDetectorRef, ContentChildren, QueryList, ViewContainerRef, InjectionToken, Injector, ComponentFactoryResolver, ViewChildren, SkipSelf } from '@angular/core';
+import { ElementRef, Inject, Input, HostListener, Directive, NgZone, ɵɵdefineInjectable, ɵɵinject, Injectable, NgModule, ContentChild, TemplateRef, Component, forwardRef, Optional, HostBinding, ViewEncapsulation, EventEmitter, Output, ViewChild, ChangeDetectorRef, Self, ContentChildren, QueryList, ViewContainerRef, InjectionToken, Injector, ComponentFactoryResolver, ViewChildren, SkipSelf } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
@@ -688,11 +688,15 @@ PopupMenuRendererComponent = __decorate([
  *
  */
 let AbstractPopupMenuComponent = class AbstractPopupMenuComponent extends CommandContainer {
-    constructor() {
+    constructor(cdr) {
         super();
+        this.cdr = cdr;
         this.xPosition = 'after';
         this.yPosition = 'below';
     }
+    ngAfterViewInit() {
+        this.cdr.detectChanges();
+    }
     get matMenuComponent() {
         var _a;
         return (_a = this.popupMenu) === null || _a === void 0 ? void 0 : _a.matMenu;
@@ -704,6 +708,9 @@ let AbstractPopupMenuComponent = class AbstractPopupMenuComponent extends Comman
         return registration.faceAdapter.destructive ? 'warn' : undefined;
     }
 };
+AbstractPopupMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(),
     __metadata("design:type", String)
@@ -725,7 +732,7 @@ AbstractPopupMenuComponent = __decorate([
         selector: 'aup-abstract-popup-menu',
         template: ''
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], AbstractPopupMenuComponent);
 
 var PopupMenuComponent_1;
@@ -733,8 +740,8 @@ var PopupMenuComponent_1;
  *
  */
 let PopupMenuComponent = PopupMenuComponent_1 = class PopupMenuComponent extends AbstractPopupMenuComponent {
-    constructor() {
-        super();
+    constructor(cdr) {
+        super(cdr);
         this.faceModel = new MutableValueModel();
         const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
         const faceAdapterModel = chain(this.faceModel).map(face => new CommandFace.Adapter(face));
@@ -746,6 +753,9 @@ let PopupMenuComponent = PopupMenuComponent_1 = class PopupMenuComponent extends
     ngOnInit() {
     }
 };
+PopupMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(), StoreInValueModel('faceModel'),
     __metadata("design:type", Object)
@@ -764,7 +774,7 @@ PopupMenuComponent = PopupMenuComponent_1 = __decorate([
   `,
         providers: [{ provide: CommandContainer, useExisting: forwardRef(() => PopupMenuComponent_1) }]
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], PopupMenuComponent);
 
 var MoreMenuComponent_1;
@@ -772,10 +782,14 @@ var MoreMenuComponent_1;
  *
  */
 let MoreMenuComponent = MoreMenuComponent_1 = class MoreMenuComponent extends AbstractPopupMenuComponent {
-    constructor() {
-        super();
+    constructor(cdr) {
+        super(cdr);
+        this.xPosition = "before"; // this should be the default unless overriden by the user.
     }
 };
+MoreMenuComponent.ctorParameters = () => [
+    { type: ChangeDetectorRef }
+];
 __decorate([
     Input(),
     __metadata("design:type", String)
@@ -789,12 +803,13 @@ MoreMenuComponent = MoreMenuComponent_1 = __decorate([
       <mat-icon>more_vert</mat-icon>
     </button>
     <aup-popup-menu-renderer [commandRegistrations]="commandRegistrations"
-                             [yPosition]="yPosition" [xPosition]="xPosition"
+                             [xPosition]="xPosition"
+                             [yPosition]="yPosition"
                              (commandExecuted)="closeMenu()"></aup-popup-menu-renderer>
   `,
         providers: [{ provide: CommandContainer, useExisting: forwardRef(() => MoreMenuComponent_1) }]
     }),
-    __metadata("design:paramtypes", [])
+    __metadata("design:paramtypes", [ChangeDetectorRef])
 ], MoreMenuComponent);
 
 let FocusContainerComponent = class FocusContainerComponent extends DisposableComponent {