@colijnit/corecomponents_v12 12.2.24 → 12.2.26

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -6217,6 +6217,7 @@
             _this.rightIconMouseDown = new i0.EventEmitter();
             _this.rightIconMouseUp = new i0.EventEmitter();
             _this.clearIconClick = new i0.EventEmitter();
+            _this.isFocused = new i0.EventEmitter();
             _this.hasOwnLabel = true;
             _this._isLeftIconMouseDown = false;
             _this._isRightIconMouseDown = false;
@@ -6314,6 +6315,17 @@
             this._isRightIconMouseDown = false;
             this.rightIconMouseUp.emit(event);
         };
+        InputTextComponent.prototype.handleInputFocus = function (event) {
+            event.preventDefault();
+            event.stopPropagation();
+            this.isFocused.emit(this.focused);
+        };
+        InputTextComponent.prototype.handleBlur = function (event) {
+            event.preventDefault();
+            event.stopPropagation();
+            this.focused = false;
+            this.isFocused.emit(false);
+        };
         InputTextComponent.prototype.clearInput = function (event) {
             this.setModel(null);
             this.clearIconClick.emit(event);
@@ -6323,7 +6335,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]=\"digitsOnly ? 'number' : type\"\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        >\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 && focused && !readonly\" class=\"input-text-clear-button\" [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\" [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\" (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        <input #input\n               [class.input-input-hidden]=\"useContent\"\n               [ngClass]=\"align\"\n               [type]=\"digitsOnly ? 'number' : type\"\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 && focused && !readonly\" class=\"input-text-clear-button\" [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\" [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\" (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,
@@ -6372,6 +6384,7 @@
         rightIconMouseDown: [{ type: i0.Output }],
         rightIconMouseUp: [{ type: i0.Output }],
         clearIconClick: [{ type: i0.Output }],
+        isFocused: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ['class.co-input-text',] }],
         hasLeftIcon: [{ type: i0.HostBinding, args: ['class.has-left-icon',] }],
         hasRightIcon: [{ type: i0.HostBinding, args: ['class.has-right-icon',] }],
@@ -8151,6 +8164,7 @@
             var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
             _this.searchIcon = exports.CoreComponentsIcon.Magnifier;
             _this.search = new i0.EventEmitter();
+            _this.isFocused = new i0.EventEmitter();
             _this.leftIconClick = new i0.EventEmitter();
             _this.rightIconClick = new i0.EventEmitter();
             _this.useLeftIcon = false;
@@ -8175,7 +8189,7 @@
     InputSearchComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-search',
-                    template: "\n    <co-input-text\n      [ngClass]=\"customCssClass\"\n      [model]=\"model\"\n      [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n      [rightIcon]=\"useRightIcon ? searchIcon : null\"\n      [leftIconData]=\"useLeftIcon && leftIconData ? leftIconData : undefined\"\n      [rightIconData]=\"useRightIcon && rightIconData ? rightIconData : undefined\"\n      [placeholder]=\"placeholder\"\n      [customHeight]=\"true\"\n      [showPlaceholderOnFocus]=\"false\"\n      (modelChange)=\"modelChange.emit($event)\"\n      (leftIconClick)=\"leftIconClick.emit($event)\"\n      (rightIconClick)=\"rightIconClick.emit($event)\"\n      (keyup)=\"keyUp.emit($event)\"\n    ></co-input-text>\n  ",
+                    template: "\n    <co-input-text\n      [ngClass]=\"customCssClass\"\n      [model]=\"model\"\n      [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n      [rightIcon]=\"useRightIcon ? searchIcon : null\"\n      [leftIconData]=\"useLeftIcon && leftIconData ? leftIconData : undefined\"\n      [rightIconData]=\"useRightIcon && rightIconData ? rightIconData : undefined\"\n      [placeholder]=\"placeholder\"\n      [customHeight]=\"true\"\n      [showPlaceholderOnFocus]=\"false\"\n      (modelChange)=\"modelChange.emit($event)\"\n      (leftIconClick)=\"leftIconClick.emit($event)\"\n      (rightIconClick)=\"rightIconClick.emit($event)\"\n      (keyup)=\"keyUp.emit($event)\"\n      (isFocused)=\"isFocused.emit($event)\"\n    ></co-input-text>\n  ",
                     providers: [
                         OverlayService
                     ],
@@ -8186,6 +8200,7 @@
     InputSearchComponent.propDecorators = {
         placeholder: [{ type: i0.Input }],
         search: [{ type: i0.Output }],
+        isFocused: [{ type: i0.Output }],
         leftIconClick: [{ type: i0.Output }],
         rightIconClick: [{ type: i0.Output }],
         useLeftIcon: [{ type: i0.Input }],
@@ -12847,6 +12862,7 @@
             this.leftIconClick = new i0.EventEmitter();
             this.rightIconClick = new i0.EventEmitter();
             this.search = new i0.EventEmitter();
+            this.isFocused = new i0.EventEmitter();
             this.barCodeScanned = new i0.EventEmitter();
             this._scannerService.registerInput(this);
         }
@@ -12862,7 +12878,7 @@
     InputScannerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-scanner',
-                    template: "\n      <co-input-search\n              [(model)]=\"model\"\n              [customCssClass]=\"customCssClass\"\n              [placeholder]=\"placeholder\"\n              [centerLabel]=\"centerLabel\"\n              [useLeftIcon]=\"useLeftIcon\"\n              [leftIconData]=\"leftIconData\"\n              [useRightIcon]=\"useRightIcon\"\n              [rightIconData]=\"rightIconData\"\n              (leftIconClick)=\"leftIconClick.emit($event)\"\n              (rightIconClick)=\"rightIconClick.emit($event)\"\n              (search)=\"search.emit($event)\"\n      ></co-input-search>\n    ",
+                    template: "\n      <co-input-search\n              [(model)]=\"model\"\n              [customCssClass]=\"customCssClass\"\n              [placeholder]=\"placeholder\"\n              [centerLabel]=\"centerLabel\"\n              [useLeftIcon]=\"useLeftIcon\"\n              [leftIconData]=\"leftIconData\"\n              [useRightIcon]=\"useRightIcon\"\n              [rightIconData]=\"rightIconData\"\n              (leftIconClick)=\"leftIconClick.emit($event)\"\n              (rightIconClick)=\"rightIconClick.emit($event)\"\n              (search)=\"search.emit($event)\"\n              (isFocused)=\"isFocused.emit($event)\"\n      ></co-input-search>\n    ",
                     providers: [
                         ScannerService,
                         OverlayService
@@ -12886,6 +12902,7 @@
         leftIconClick: [{ type: i0.Output }],
         rightIconClick: [{ type: i0.Output }],
         search: [{ type: i0.Output }],
+        isFocused: [{ type: i0.Output }],
         barCodeScanned: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ['class.co-input-scanner',] }]
     };