@coolon/angular-ui-powerups 3.3.1 → 3.3.3

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [3.3.3](https://bitbucket.org/coolon/angular-ui-powerups/compare/v3.3.2...v3.3.3) (2020-10-15)
+
+
+### Bug Fixes
+
+* added missing import to bootstrap ([c5ad944](https://bitbucket.org/coolon/angular-ui-powerups/commit/c5ad944ff9dabfa214a39233a5c1a0454402573a))
+* material buttons and menu items not disabling correctly ([1d449a7](https://bitbucket.org/coolon/angular-ui-powerups/commit/1d449a7720671ed4d86feb9c461bd3b148679e01))
+
+### [3.3.2](https://bitbucket.org/coolon/angular-ui-powerups/compare/v3.3.1...v3.3.2) (2020-10-13)
+
+
+### Bug Fixes
+
+* table-row-menu not displaying faces correctly ([7968363](https://bitbucket.org/coolon/angular-ui-powerups/commit/79683633ef4e8bc9bc4302a834cfa66f22673ae4))
+
 ### [3.3.1](https://bitbucket.org/coolon/angular-ui-powerups/compare/v3.3.0...v3.3.1) (2020-09-22)
 
 

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

@@ -313,11 +313,14 @@
 
     var CommandDirective = /** @class */ (function (_super) {
         __extends(CommandDirective, _super);
-        function CommandDirective(elementRef) {
+        function CommandDirective(elementRef, matButton, matMenuItem) {
             var _this = _super.call(this) || this;
             _this.elementRef = elementRef;
             _this._commandEnabled = new pectin.DelegatingValueModel().withDefault(false);
             _this._commandParameterProvided = false;
+            // Material buttons and menu items don't respond to the disabled binding so we
+            // need to inject them from our host element and handle them manually.
+            _this.matControl = matButton || matMenuItem;
             return _this;
         }
         Object.defineProperty(CommandDirective.prototype, "pectinCommand", {
@@ -357,23 +360,36 @@
         };
         CommandDirective.prototype.ngAfterViewInit = function () {
             var _this = this;
-            // for some reason mat-buttons kills the disabled host binding.  It works on a regular button but for now
-            // we need to do this.
             var when = pectin.Dsl.disposeWith(this).when;
-            when.valueOf(this._commandEnabled).changes(function (enabled) {
-                if (enabled) {
-                    _this.elementRef.nativeElement.removeAttribute('disabled');
-                    if (_this.elementRef.nativeElement.tagName === 'A') {
-                        _this.elementRef.nativeElement.setAttribute('href', 'javascript:void');
-                    }
+            when(this._commandEnabled).changes(function (enabled) { return _this.updateEnabledState(enabled); }, {
+                initialValue: 'triggerChange'
+            });
+        };
+        CommandDirective.prototype.updateEnabledState = function (enabled) {
+            var _this = this;
+            // for some reason mat-buttons kills the disabled host binding.  It works on a regular button but for now
+            // we need to do this. The set timeout is required to prevent the button getting a expression changed
+            // when it's clicked.
+            if (this.matControl) {
+                setTimeout(function () {
+                    _this.matControl.disabled = !enabled;
+                }, 0);
+            }
+            if (!enabled) {
+                // Note:
+                // We can't use a host binding here for disabled as the directive can be used on arbitrary
+                // components (e.g. divs) and the compiler will barf if we use the host binding.
+                this.elementRef.nativeElement.setAttribute('disabled', 'disabled');
+                if (this.elementRef.nativeElement.tagName === 'A') {
+                    this.elementRef.nativeElement.removeAttribute('href');
                 }
-                else {
-                    _this.elementRef.nativeElement.setAttribute('disabled', 'disabled');
-                    if (_this.elementRef.nativeElement.tagName === 'A') {
-                        _this.elementRef.nativeElement.removeAttribute('href');
-                    }
+            }
+            else {
+                this.elementRef.nativeElement.removeAttribute('disabled');
+                if (this.elementRef.nativeElement.tagName === 'A') {
+                    this.elementRef.nativeElement.setAttribute('href', 'javascript:void');
                 }
-            }, { initialValue: 'triggerChange' });
+            }
         };
         CommandDirective.prototype.ngOnDestroy = function () {
             this.dispose();
@@ -402,7 +418,9 @@
                 },] }
     ];
     CommandDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef, decorators: [{ type: i0.Inject, args: [i0.ElementRef,] }] }
+        { type: i0.ElementRef, decorators: [{ type: i0.Inject, args: [i0.ElementRef,] }] },
+        { type: button.MatButton, decorators: [{ type: i0.Host }, { type: i0.Optional }] },
+        { type: menu.MatMenuItem, decorators: [{ type: i0.Host }, { type: i0.Optional }] }
     ]; };
     CommandDirective.propDecorators = {
         pectinCommand: [{ type: i0.Input }],
@@ -436,7 +454,7 @@
             _this.document = document;
             // TODO: Make this also track the current enabled/disabled state.
             var when = pectin.Dsl.disposeWith(_this).when;
-            when.valueOf(_this.focusContext.focused).changes(function (focused) {
+            when(_this.focusContext.focused).changes(function (focused) {
                 if (focused && !_this.alreadyHasFocus()) {
                     _this.tryAndFocus();
                 }
@@ -2405,7 +2423,7 @@
             var subscription = this.switchCaseOptions.changes.subscribe(function (change) { return _this.updateSelection(); });
             this.onDispose(function () { return subscription.unsubscribe(); });
             var _a = pectin.Dsl.disposeWith(this), chain = _a.chain, when = _a.when;
-            when.valueOf(this.switchModel).changes(function () { return _this.updateSelection(); }, { initialValue: 'triggerChange' });
+            when(this.switchModel).changes(function () { return _this.updateSelection(); }, { initialValue: 'triggerChange' });
             this.cdr.detectChanges();
         };
         SwitchCaseComponent.prototype.updateSelection = function () {
@@ -3256,7 +3274,7 @@
             else {
                 var editSession_1 = new EditSession(rowId, row, this._createForm(row), this.saveCommand);
                 var when = pectin.Dsl.disposeWith(editSession_1).when;
-                when.valueOf(editSession_1.liveRowValue).changes(function (editedValue) {
+                when(editSession_1.liveRowValue).changes(function (editedValue) {
                     _this._rowsBeingEdited.replaceOrPush(editedValue);
                 }, { initialValue: 'triggerChangeUnlessNil' });
                 this._editorSessions.push(editSession_1);
@@ -3551,7 +3569,7 @@
     TableRowMenuComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'aup-table-row-menu',
-                    template: "\n      <aup-tool-bar>\n          <aup-command *ngFor=\"let action of actions\" [command]=\"action.factory.create(value)\"\n                       [face]=\"action.faceModel\"></aup-command>\n      </aup-tool-bar>\n      <ng-container *ngIf=\"moreActions.length > 0\">\n          <aup-more-menu>\n              <aup-command *ngFor=\"let action of moreActions\" [command]=\"action.factory.create(value)\"\n                           [face]=\"action.faceModel\"></aup-command>\n          </aup-more-menu>\n      </ng-container>\n  ",
+                    template: "\n      <aup-tool-bar>\n          <aup-command *ngFor=\"let action of actions\" [command]=\"action.factory.create(value)\"\n                       [face]=\"action.face\"></aup-command>\n      </aup-tool-bar>\n      <ng-container *ngIf=\"moreActions.length > 0\">\n          <aup-more-menu>\n              <aup-command *ngFor=\"let action of moreActions\" [command]=\"action.factory.create(value)\"\n                           [face]=\"action.face\"></aup-command>\n          </aup-more-menu>\n      </ng-container>\n  ",
                     styles: [":host {\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n  }"]
                 },] }
     ];
@@ -4703,7 +4721,7 @@
             var componentRef = overlayRef.attach(this.outputPortal);
             this.interactionContext = componentRef.instance;
             return new Promise(function (resolve, reject) {
-                // HACK: afterViewInit won't have been called yet.  Need to add when.valueOf(interactionContext.ready).becomesTruthy(...)
+                // HACK: afterViewInit won't have been called yet.  Need to add when(interactionContext.ready).becomesTruthy(...)
                 setTimeout(function () {
                     _this.interactionContext.startActivity(activityType, data)
                         .then(resolve)
@@ -5355,7 +5373,7 @@
             this.visitModel.value = visit;
             pectin.DebugContext.getOrCreate(this.visitModel).tag(this.placeDefinition.component.name + ".visitModel");
             this.placeDefinition.getVisitParameterDefs().forEach(function (parameterDef) { return _this.installBinding(parameterDef); });
-            when.valueOf(this.visitModel).changes(function (current, previous) {
+            when(this.visitModel).changes(function (current, previous) {
                 notifyVisitChanged(current, previous);
             }, { unless: this._inVisitUpdate });
         };
@@ -7180,7 +7198,7 @@
                 this.onAnimationFinishedJob = finishPlaceLoad;
             }
             var _a = pectin.Dsl.disposeWith(activePlace), when = _a.when, chain = _a.chain, valueOf = _a.valueOf;
-            when.valueOf(this.routerVisitModel)
+            when(this.routerVisitModel)
                 .changes(function (visit) {
                 activePlace.updateVisit(visit);
             }, {
@@ -7268,7 +7286,7 @@
             _this.commandFactory = pectin.Command.createFactory(function (placeDefinition) {
                 _this.placeOutlet.navigate(new Visit(placeDefinition));
             });
-            when.valueOf(_this.placeOutletModel).changes(function (outlet) {
+            when(_this.placeOutletModel).changes(function (outlet) {
                 // NOTE: this updates during a change cycle and causes our isActiveMethod to return 2 different
                 // values in the one change detection cycle. So instead we delay the update to a different
                 // tick.