@coolon/angular-ui-powerups 2.0.0-alpha.36 → 2.0.0-alpha.37

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

@@ -728,16 +728,7 @@ class CommandGroup extends GarbageCollector {
         this.parent = parent;
         this._rootTemplate = new MutableValueModel();
         this._registrations = new MutableListModel();
-        this._childFaceModels = new MutableListModel();
-        this._faceChangeCount = new MutableValueModel(0);
         const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        const childFaces = chain(this._childFaceModels)
-            .map(m => m.value, { dependsOn: this._faceChangeCount })
-            .rejectNil();
-        const iconCount = childFaces
-            .select(face => !!CommandFace.getIconOf(face))
-            .count();
-        this.hasMixedIcons = valueOf.all(iconCount.isGreaterThan(0), iconCount.doesNotEqual(childFaces.length)).areTruthy();
         this.childTemplates = chain(this._rootTemplate).pluckList('children');
         this.initialised = chain(this._rootTemplate).isNotNil();
     }
@@ -785,12 +776,10 @@ class CommandGroup extends GarbageCollector {
     register(registration) {
         this._registrations.push(registration);
         if (registration instanceof Registration.FaceRegistration) {
-            this._childFaceModels.push(registration.faceModel);
             const { when } = Dsl.disposeWith(registration);
             when(registration.faceModel).changes((is, was) => {
-                this.notifyChildFaceChanged(new CommandFace.Adapter(is), new CommandFace.Adapter(was));
+                this.notifyChildFaceChanged(is, was);
             }, { asLongAs: this.initialised });
-            registration.onDispose(() => this._childFaceModels.remove(registration.faceModel));
         }
         registration.onDispose(() => this._registrations.remove(registration));
         return registration;
@@ -964,10 +953,15 @@ let CommandComponent = class CommandComponent extends DisposableComponent {
         super();
         this.parent = parent;
         this.CommandFace = CommandFace;
-        const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
-        this.buttonStyle = chain(this.faceModel).map(f => CommandFace.getStyleOf(f));
+        const { chain, switchOn } = Dsl.disposeWith(this);
+        this.activeFaceModel = switchOn(this.command.busy).toValue(when => {
+            when.equalTo(true, this.busyFaceModel);
+            when.otherwise(this.faceModel);
+        }).otherwise(this.faceModel);
+        this.buttonStyle = chain(this.activeFaceModel).map(f => CommandFace.getStyleOf(f));
+        this.colorModel = chain(this.activeFaceModel).map(f => CommandFace.getColorOf(f));
         if (parent) {
-            this.registerDisposable(this.parent.registerCommand(this.command, this.faceModel));
+            this.registerDisposable(this.parent.registerCommand(this.command, this.activeFaceModel));
         }
     }
     ngOnInit() {
@@ -988,10 +982,18 @@ __decorate([
     Input(), StoreInValueModel('faceModel'),
     __metadata("design:type", Object)
 ], CommandComponent.prototype, "face", void 0);
+__decorate([
+    Input(), TrackExternal(),
+    __metadata("design:type", ValueModel)
+], CommandComponent.prototype, "busyFaceModel", void 0);
+__decorate([
+    Input(), StoreInValueModel('busyFaceModel'),
+    __metadata("design:type", Object)
+], CommandComponent.prototype, "busyFace", void 0);
 CommandComponent = __decorate([
     Component({
         selector: 'aup-command',
-        template: "<ng-container *ngIf=\"!parent\">\n  <ng-container [ngSwitch]=\"buttonStyle.value\">\n    <button *ngSwitchCase=\"CommandFace.Style.STROKED\" mat-stroked-button [pectinCommand]=\"command\" [color]=\"CommandFace.getColorOf(face)\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <button *ngSwitchCase=\"CommandFace.Style.RAISED\" mat-raised-button [pectinCommand]=\"command\" [color]=\"CommandFace.getColorOf(face)\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n    <button *ngSwitchDefault mat-button [pectinCommand]=\"command\" [color]=\"CommandFace.getColorOf(face)\">\n      <aup-command-face [face]=\"face\"></aup-command-face>\n    </button>\n  </ng-container>\n</ng-container>\n"
+        template: "<ng-container *ngIf=\"!parent\">\n  <ng-container [ngSwitch]=\"buttonStyle.value\">\n    <button *ngSwitchCase=\"CommandFace.Style.STROKED\" mat-stroked-button [pectinCommand]=\"command\" [color]=\"colorModel.value\">\n      <aup-command-face [face]=\"activeFaceModel.value\"></aup-command-face>\n    </button>\n    <button *ngSwitchCase=\"CommandFace.Style.RAISED\" mat-raised-button [pectinCommand]=\"command\" [color]=\"colorModel.value\">\n      <aup-command-face [face]=\"activeFaceModel.value\"></aup-command-face>\n    </button>\n    <button *ngSwitchDefault mat-button [pectinCommand]=\"command\" [color]=\"colorModel.value\">\n      <aup-command-face [face]=\"activeFaceModel.value\"></aup-command-face>\n    </button>\n  </ng-container>\n</ng-container>\n"
     }),
     __param(0, Optional()),
     __metadata("design:paramtypes", [CommandGroup])