@colijnit/corecomponents_v12 256.1.14 → 256.1.16

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -2267,6 +2267,7 @@
             this.modelChange = new i0.EventEmitter();
             this.userModelChange = new i0.EventEmitter();
             this.hiddenChange = new i0.EventEmitter();
+            this.cancelClicked = new i0.EventEmitter();
             this.focused = false;
             this.formInput = true;
             this.customWidth = false;
@@ -2693,6 +2694,7 @@
                 this.model = this._initialModel;
             }
             this.keepFocus = false;
+            this.cancelClicked.emit();
         };
         BaseInputComponent.prototype.showValidationError = function (error) {
             this.validationError = error;
@@ -3166,6 +3168,7 @@
         modelChange: [{ type: i0.Output }],
         userModelChange: [{ type: i0.Output }],
         hiddenChange: [{ type: i0.Output }],
+        cancelClicked: [{ type: i0.Output }],
         focused: [{ type: i0.HostBinding, args: ['class.cc-input-focused',] }],
         formInput: [{ type: i0.HostBinding, args: ['class.form-input',] }],
         customWidth: [{ type: i0.Input }, { type: i0.HostBinding, args: ['class.custom-width',] }],
@@ -6213,9 +6216,10 @@
 
     var InputTextComponent = /** @class */ (function (_super) {
         __extends(InputTextComponent, _super);
-        function InputTextComponent(formComponent, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
+        function InputTextComponent(formComponent, injector, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
             var _this = _super.call(this, changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) || this;
             _this.formComponent = formComponent;
+            _this.injector = injector;
             _this.changeDetector = changeDetector;
             _this.overlayService = overlayService;
             _this.componentFactoryResolver = componentFactoryResolver;
@@ -6302,6 +6306,21 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(InputTextComponent.prototype, "pipedModel", {
+            get: function () {
+                if (this.formatPipe) {
+                    try {
+                        var pipe = new this.formatPipe(this);
+                        return pipe.transform(this.model);
+                    }
+                    catch (e) {
+                    }
+                }
+                return this.model;
+            },
+            enumerable: false,
+            configurable: true
+        });
         // exclude some non-digit characters, since input type 'number' still allows the characters -, + and e
         InputTextComponent.prototype.excludeNonDigitChars = function (event) {
             var excludedKeys = this.excludePlusMinus ? ['e', '-', '+'] : ['e'];
@@ -6369,7 +6388,7 @@
     InputTextComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-text',
-                    template: "\n    <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n      <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n               (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n               (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n      <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n      <div class=\"input-wrapper\">\n        <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n               [textContent]=\"placeholder\"></label>\n        <input #input\n               [class.input-input-hidden]=\"useContent\"\n               [ngClass]=\"align\"\n               [type]=\"(isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))\"\n               [placeholder]=\"type === 'date' && !isFocusedOnDate ? '' : ''\"\n               [pattern]=\"type === 'date' ? pattern : undefined\"\n               [ngModel]=\"model\"\n               [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n               [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n               [readonly]=\"readonly\"\n               [required]=\"required\"\n               (ngModelChange)=\"modelChange.emit($event)\"\n               (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n               (keyup)=\"keyUp.emit($event)\"\n               (focusin)=\"handleInputFocus($event)\"\n               (focusout)=\"handleBlur($event)\"\n        >\n        <ng-container *ngIf=\"useContent\">\n          <div class=\"input-content-wrapper\">\n            <ng-content></ng-content>\n          </div>\n        </ng-container>\n        <co-icon [class.show]=\"showClearButton && hasValue && !readonly\" class=\"input-text-clear-button\"\n                 [icon]=\"icons.CrossSkinny\" (click)=\"clearInput($event)\"></co-icon>\n        <div class=\"required-indicator\"></div>\n      </div>\n      <div *ngIf=\"rightIcon || rightIconData\" class=\"spacer right-icon\"></div>\n      <co-icon *ngIf=\"rightIcon || rightIconData\" class=\"input-text-right-icon\" [icon]=\"rightIcon\"\n               [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\"\n               (mouseup)=\"handleRightIconMouseUp($event)\"></co-icon>\n    </div>\n    <!--\n            <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n                               [committing]=\"committing\"\n                               [commitFinished]=\"commitFinished\"\n                               (commitClick)=\"commitClick($event)\"\n                               (cancelClick)=\"cancelClick($event)\"\n            >\n            </co-commit-buttons>\n    -->\n  ",
+                    template: "\n    <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n      <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n               (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n               (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n      <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n      <div class=\"input-wrapper\">\n        <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n               [textContent]=\"placeholder\"></label>\n        <span class=\"input-text-formatted\" *ngIf=\"!focused && !useContent && formatPipe\"\n              [class.show]=\"!focused && !useContent && formatPipe\"\n              [ngClass]=\"align\"\n              [textContent]=\"pipedModel\"\n              (click)=\"doFocus($event)\"\n        ></span>\n        <input [class.show]=\"focused || !formatPipe\" #input\n               [class.input-input-hidden]=\"useContent\"\n               [ngClass]=\"align\"\n               [type]=\"(isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))\"\n               [placeholder]=\"type === 'date' && !isFocusedOnDate ? '' : ''\"\n               [pattern]=\"type === 'date' ? pattern : undefined\"\n               [ngModel]=\"model\"\n               [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n               [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n               [readonly]=\"readonly\"\n               [required]=\"required\"\n               (ngModelChange)=\"modelChange.emit($event)\"\n               (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n               (keyup)=\"keyUp.emit($event)\"\n               (focusin)=\"handleInputFocus($event)\"\n               (focusout)=\"handleBlur($event)\"\n        >\n        <ng-container *ngIf=\"useContent\">\n          <div class=\"input-content-wrapper\">\n            <ng-content></ng-content>\n          </div>\n        </ng-container>\n        <co-icon [class.show]=\"showClearButton && hasValue && !readonly\" class=\"input-text-clear-button\"\n                 [icon]=\"icons.CrossSkinny\" (click)=\"clearInput($event)\"></co-icon>\n        <div class=\"required-indicator\"></div>\n      </div>\n      <div *ngIf=\"rightIcon || rightIconData\" class=\"spacer right-icon\"></div>\n      <co-icon *ngIf=\"rightIcon || rightIconData\" class=\"input-text-right-icon\" [icon]=\"rightIcon\"\n               [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\"\n               (mouseup)=\"handleRightIconMouseUp($event)\"></co-icon>\n    </div>\n    <!--\n            <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n                               [committing]=\"committing\"\n                               [commitFinished]=\"commitFinished\"\n                               (commitClick)=\"commitClick($event)\"\n                               (cancelClick)=\"cancelClick($event)\"\n            >\n            </co-commit-buttons>\n    -->\n  ",
                     providers: [
                         OverlayService, {
                             provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
@@ -6384,6 +6403,7 @@
     ];
     InputTextComponent.ctorParameters = function () { return [
         { type: FormComponent, decorators: [{ type: i0.Optional }] },
+        { type: i0.Injector },
         { type: i0.ChangeDetectorRef },
         { type: OverlayService },
         { type: i0.ComponentFactoryResolver },
@@ -6396,6 +6416,7 @@
         placeholder: [{ type: i0.Input }],
         align: [{ type: i0.Input }],
         type: [{ type: i0.Input }],
+        formatPipe: [{ type: i0.Input }],
         min: [{ type: i0.Input }],
         max: [{ type: i0.Input }],
         pattern: [{ type: i0.Input }],