@coolon/angular-ui-powerups 12.4.0-alpha.33 → 12.4.0-alpha.34

package/assets/interaction/editor/inline-string-editor.scss

@@ -25,7 +25,10 @@ aup-inline-string-editor {
       flex: 1;
       padding: 1px 0 0 0;
       margin: 0;
-      cursor: pointer;
+
+      &.editing-enabled {
+        cursor: pointer;
+      }
 
       &.place-holder {
         color: rgba(0,0,0,0.5); // TODO: get the angular theme value for disabled form elements...

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

@@ -6741,13 +6741,35 @@
         _interactionContext: [{ type: i0.ViewChild, args: [PopupInteractionContextComponent, { static: true },] }]
     };
 
-    exports.InlineEditorModel = /** @class */ (function () {
+    exports.InlineEditorModel = /** @class */ (function (_super) {
+        __extends(InlineEditorModel, _super);
         function InlineEditorModel(valueModel, saveCallback) {
-            this.valueModel = valueModel;
-            this.saveCallback = saveCallback;
-            this.editing = new pectin.MutableValueModel(false);
-            this._validators = new pectin.MutableListModel();
+            var _this = _super.call(this) || this;
+            _this.valueModel = valueModel;
+            _this.saveCallback = saveCallback;
+            _this.editing = new pectin.MutableValueModel(false);
+            _this._validators = new pectin.MutableListModel();
+            _this._editingEnabled = _this.registerDisposable(new pectin.DelegatingValueModel().withDefault(true));
+            var when = pectin.Dsl.disposeWith(_this).when;
+            when(_this.editingEnabled).becomesFalsey(function () { return _this.cancelEdit(); });
+            return _this;
         }
+        Object.defineProperty(InlineEditorModel.prototype, "editingEnabled", {
+            get: function () {
+                return this._editingEnabled.readonly;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        InlineEditorModel.prototype.disableWhile = function (condition) {
+            var chain = pectin.Dsl.disposeWith(this).chain;
+            this.enableWhile(chain(condition).isFalsey());
+            return this;
+        };
+        InlineEditorModel.prototype.enableWhile = function (condition) {
+            this._editingEnabled.setDelegate(condition);
+            return this;
+        };
         Object.defineProperty(InlineEditorModel.prototype, "validators", {
             get: function () {
                 return this._validators.readonly;
@@ -6770,7 +6792,7 @@
             this.editing.value = true;
         };
         return InlineEditorModel;
-    }());
+    }(pectin.GarbageCollector));
     (function (InlineEditorModel) {
         function create(valueModel, options) {
             return new InlineEditorModel(valueModel, options.save);
@@ -6801,6 +6823,7 @@
         __extends(InlineStringEditorComponent, _super);
         function InlineStringEditorComponent(interactionService) {
             var _this = _super.call(this) || this;
+            _this.editingEnabled = _this.registerDisposable(new pectin.DelegatingValueModel());
             var _a = pectin.Dsl.disposeWith(_this), chain = _a.chain, when = _a.when, valueOf = _a.valueOf;
             var modalIC = interactionService.createModalInteractionContextDisposedWith(_this);
             var resolvedFacesModel = chain(_this.facesModel).map(function (userFaces) {
@@ -6832,7 +6855,7 @@
                         case 5: return [2 /*return*/];
                     }
                 });
-            }); });
+            }); }).enableWhile(_this.editingEnabled);
             _this.onDispose(function () { return _this.cancelEdit(); });
             return _this;
         }
@@ -6844,6 +6867,7 @@
             if (!this.editorModel) {
                 typescriptUtilities.lang.illegalState('editorModel is required');
             }
+            this.editingEnabled.setDelegate(this.editorModel.editingEnabled);
             when(this.editorModel.editing).becomesTruthy(function () {
                 _this.editCommand.execute();
             }, { asLongAs: this.editCommand.enabled });
@@ -6899,7 +6923,7 @@
     exports.InlineStringEditorComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'aup-inline-string-editor',
-                    template: "<ng-container *ngIf=\"!editorModel.isEditing()\">\n  <div class=\"content\" [class.editable]=\"editCommand.enabled.value\">\n    <label>{{label}}</label>\n    <p [class.place-holder]=\"empty.value\" (click)=\"editCommand.execute()\">{{displayValue.value}}</p>\n    <aup-command *ngIf=\"editCommand.enabled.value\" [command]=\"editCommand\" [faceModel]=\"editFaceModel\"></aup-command>\n  </div>\n</ng-container>\n<aup-in-place-interaction-context #interactionContext [animateFirstActivity]=\"false\"></aup-in-place-interaction-context>\n\n"
+                    template: "<ng-container *ngIf=\"!editorModel.isEditing()\">\n  <div class=\"content\" [class.editable]=\"editCommand.enabled.value\">\n    <label>{{label}}</label>\n    <p [class.place-holder]=\"empty.value\" [class.editing-enabled]=\"editingEnabled.value\" (click)=\"editCommand.execute()\">{{displayValue.value}}</p>\n    <aup-command *ngIf=\"editCommand.enabled.value\" [command]=\"editCommand\" [faceModel]=\"editFaceModel\"></aup-command>\n  </div>\n</ng-container>\n<aup-in-place-interaction-context #interactionContext [animateFirstActivity]=\"false\"></aup-in-place-interaction-context>\n\n"
                 },] }
     ];
     exports.InlineStringEditorComponent.ctorParameters = function () { return [