@colijnit/corecomponents_v12 260.1.15 → 260.1.16

package/fesm2015/colijnit-corecomponents_v12.js

@@ -1835,7 +1835,7 @@ CommitButtonsComponent.decorators = [
                 <svg class="checkmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 52 52" *ngIf="firstShow || commitFinished">
                     <path class="checkmark-check" [class.first-show]="firstShow" fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8"/></svg>
             </div>
-            <div class="commit-buttons-button cancel" (click)="cancelClick.emit($event)">
+            <div class="commit-buttons-button cancel" (mousedown)="$event.preventDefault()" (click)="cancelClick.emit($event)">
                 <div class="cancel-button"></div>
             </div>
         </div>
@@ -1907,8 +1907,8 @@ class BaseInputComponent {
         this.excludeUserModelChange = false;
         this.noFormGroupControl = false;
         this.keepFocus = false;
-        this.canceled = false;
         this.validationError = '';
+        this.shouldCommit = true;
         this._markedAsUserTouched = false;
         this._destroyed = false;
         this._hasOnPushCdStrategy = false;
@@ -2207,8 +2207,7 @@ class BaseInputComponent {
         this.input = undefined;
     }
     cancelClick(event) {
-        this.canceled = true;
-        this.conditionResolver(this.canceled);
+        this.shouldCommit = false;
         this.keepFocus = true;
         if (this._initialModelSet) {
             this.model = this._initialModel;
@@ -2262,20 +2261,9 @@ class BaseInputComponent {
         }
         this.focus.next();
     }
-    waitForCancelCondition() {
-        return new Promise((resolve) => {
-            this.conditionResolver = resolve; // Save the resolver to be called later
-        });
-    }
     doBlur(event, handleCommit = true) {
         return __awaiter(this, void 0, void 0, function* () {
-            const cancelTimeout = new Promise(resolve => setTimeout(resolve, 300));
-            const result = yield Promise.race([this.waitForCancelCondition(), cancelTimeout]);
-            // If canceled
-            if (result) {
-                return;
-            }
-            if (this.showSaveCancel && handleCommit && this._modelDirtyForCommit) {
+            if (this.showSaveCancel && handleCommit && this._modelDirtyForCommit && this.shouldCommit) {
                 yield this._handleCommit(event, false);
             }
             setTimeout(() => {
@@ -2411,6 +2399,7 @@ class BaseInputComponent {
                 return true;
             }
             this.keepFocus = true;
+            this.shouldCommit = true;
             if (this._commitButtonsComponentRef) {
                 this._commitButtonsComponentRef.instance.commitFinished = false;
                 this._commitButtonsComponentRef.instance.committing = true;
@@ -5909,6 +5898,8 @@ class InputTextComponent extends BaseInputComponent {
     }
     clearInput(event) {
         this.setModel(null);
+        this.keepFocus = true;
+        this.shouldCommit = false;
         this.clearIconClick.emit(event);
     }
     handleKeyDownInput(event) {
@@ -11755,58 +11746,58 @@ class ListOfValuesComponent extends BaseInputComponent {
 ListOfValuesComponent.decorators = [
     { type: Component, args: [{
                 selector: 'co-list-of-values',
-                template: `
-      <co-input-text
-              *ngIf="!largeCollection"
-              aria-haspopup="listbox"
-              [attr.aria-expanded]="isSelectOpen"
-              aria-controls="lov-popup"
-              role="combobox"
-              class="no-focus-line"
-              overlayParent
-              #parentForOverlay="overlayParent"
-              type="text"
-              [id]="label"
-              [model]="multiselect ? selectedModels : selectedModel"
-              [placeholder]="label"
-              [myFormInputInstance]="this"
-              [readonly]="readonly"
-              [disabled]="disabled"
-              [required]="required"
-              [noClickFocus]="false"
-              [leftIconData]=" model && model[optionIcon] ? iconCacheService.getIcon(model[optionIcon]) : leftIconData"
-              [rightIcon]="isSelectOpen ? icons.ChevronUpRegular : icons.ChevronDownRegular"
-              [showClearButton]="true"
-              [useContent]="multiselect"
-              [customHeight]="multiselect"
-              [keepFocussed]="keepFocussed"
-              (modelChange)="handleInputModelChange($event)"
-              (click)="openPopup()"
-              (rightIconClick)="toggleSelect()"
-              (keydown)="handleInputKeyDown($event)"
-              (clearIconClick)="clearModel($event)"
-              (blur)="checkModel()">
-          <ng-container *ngIf="multiselect && showChips">
-              <div class="multiselect-chips-wrapper">
-                  <div class="chips" *ngFor="let chip of model">
-                      <span class="chips-description" [textContent]="chip[displayField]"></span>
-                      <co-icon class="remove-chip-icon" [icon]="icons.CrossSkinny" (click)="removeOptionFromModel(chip)"></co-icon>
-                  </div>
-              </div>
-          </ng-container>
-      </co-input-text>
-
-      <co-input-text
-              *ngIf="largeCollection"
-              [model]="filterText"
-              [placeholder]="label"
-              [required]="required"
-              [disabled]="disabled"
-              [readonly]="readonly"
-              (modelChange)="onModelChange($event)">
-      </co-input-text>
-      <div *ngIf="isLoading" class="filter-loader"><span></span></div>
-      <input type="hidden" [ngModel]="model">
+                template: `
+      <co-input-text
+              *ngIf="!largeCollection"
+              aria-haspopup="listbox"
+              [attr.aria-expanded]="isSelectOpen"
+              aria-controls="lov-popup"
+              role="combobox"
+              class="no-focus-line"
+              overlayParent
+              #parentForOverlay="overlayParent"
+              type="text"
+              [id]="label"
+              [model]="multiselect ? ((!selectedModels || selectedModels.length === 0) ? null : selectedModels ) : selectedModel"
+              [placeholder]="label"
+              [myFormInputInstance]="this"
+              [readonly]="readonly"
+              [disabled]="disabled"
+              [required]="required"
+              [noClickFocus]="false"
+              [leftIconData]=" model && model[optionIcon] ? iconCacheService.getIcon(model[optionIcon]) : leftIconData"
+              [rightIcon]="isSelectOpen ? icons.ChevronUpRegular : icons.ChevronDownRegular"
+              [showClearButton]="true"
+              [useContent]="multiselect"
+              [customHeight]="multiselect"
+              [keepFocussed]="keepFocussed"
+              (modelChange)="handleInputModelChange($event)"
+              (click)="openPopup()"
+              (rightIconClick)="toggleSelect()"
+              (keydown)="handleInputKeyDown($event)"
+              (clearIconClick)="clearModel($event)"
+              (blur)="checkModel()">
+          <ng-container *ngIf="multiselect && showChips">
+              <div class="multiselect-chips-wrapper">
+                  <div class="chips" *ngFor="let chip of model">
+                      <span class="chips-description" [textContent]="chip[displayField]"></span>
+                      <co-icon class="remove-chip-icon" [icon]="icons.CrossSkinny" (click)="removeOptionFromModel(chip)"></co-icon>
+                  </div>
+              </div>
+          </ng-container>
+      </co-input-text>
+
+      <co-input-text
+              *ngIf="largeCollection"
+              [model]="filterText"
+              [placeholder]="label"
+              [required]="required"
+              [disabled]="disabled"
+              [readonly]="readonly"
+              (modelChange)="onModelChange($event)">
+      </co-input-text>
+      <div *ngIf="isLoading" class="filter-loader"><span></span></div>
+      <input type="hidden" [ngModel]="(selectedModels && selectedModels.length) || selectedModel ? model : null">
   `,
                 providers: [
                     OverlayService,
@@ -14509,7 +14500,7 @@ class ScreenConfigurationDirective {
             if (myCfgObj) {
                 this._setHostVisible(myCfgObj.immediatelyVisible());
                 if (!this.screenConfigNativeElement) {
-                    this.hostComponent.required = myCfgObj.isRequired();
+                    this.hostComponent.required = this.hostComponent.required || myCfgObj.isRequired();
                     this.hostComponent.readonly = this.hostComponent.forceReadonly || this._moduleInReadonlyMode() || myCfgObj.isReadonly();
                     this.hostComponent.decimals = myCfgObj.scale;
                     this.hostComponent.maxLength = myCfgObj.maxLength;