@colijnit/corecomponents_v12 257.1.11 → 257.1.13

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -6213,9 +6213,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 +6303,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'];
@@ -6360,6 +6376,11 @@
             }
             this.isFocused.emit(false);
         };
+        InputTextComponent.prototype.handleDoFocus = function (event) {
+            if (!this.readonly) {
+                this.doFocus(event);
+            }
+        };
         InputTextComponent.prototype.clearInput = function (event) {
             this.setModel(null);
             this.clearIconClick.emit(event);
@@ -6369,7 +6390,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)=\"handleDoFocus($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 +6405,7 @@
     ];
     InputTextComponent.ctorParameters = function () { return [
         { type: FormComponent, decorators: [{ type: i0.Optional }] },
+        { type: i0.Injector },
         { type: i0.ChangeDetectorRef },
         { type: OverlayService },
         { type: i0.ComponentFactoryResolver },
@@ -6396,6 +6418,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 }],
@@ -8273,6 +8296,9 @@
             var enterKeys = ['Enter', 'NumpadEnter', 'Go'];
             if (enterKeys.includes(event.key)) {
                 event.preventDefault();
+                if (this.isMobileDevice()) {
+                    event.target.blur();
+                }
                 this.search.next(this.model);
             }
         };
@@ -8280,6 +8306,9 @@
             this.model = model;
             this.modelChange.next(this.model);
         };
+        InputSearchComponent.prototype.isMobileDevice = function () {
+            return /Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
+        };
         return InputSearchComponent;
     }(BaseInputComponent));
     InputSearchComponent.decorators = [