@colijnit/corecomponents_v12 256.1.18 → 256.1.20

package/fesm2015/colijnit-corecomponents_v12.js

@@ -1955,6 +1955,12 @@ class BaseInputComponent {
     get maxLength() {
         return notNill(this.forcedMaxLength) ? this.forcedMaxLength : this._maxLength;
     }
+    set defaultValue(defaultValue) {
+        this._defaultValue = defaultValue;
+    }
+    get defaultValue() {
+        return this._defaultValue;
+    }
     set readonly(readonly) {
         if (this._forceReadonly !== undefined || readonly === this._readonly) {
             return;
@@ -2600,6 +2606,7 @@ BaseInputComponent.propDecorators = {
     businessObjectId: [{ type: Input }],
     disabled: [{ type: Input }],
     maxLength: [{ type: Input }],
+    defaultValue: [{ type: Input }],
     forcedMaxLength: [{ type: Input }],
     readonly: [{ type: Input }],
     forceReadonly: [{ type: Input }],
@@ -5439,6 +5446,23 @@ class InputDatePickerComponent extends BaseInputDatePickerDirective {
             this.overlayService.removeComponent(this._calendarComponentRef);
         }
     }
+    finalizeDate() {
+        if (this.isValidDateString(this.modelAsString)) {
+            const [year, month, day] = this.modelAsString.split('-').map(Number);
+            const date = new Date(year, month - 1, day);
+            this.setModel(date);
+        }
+    }
+    isValidDateString(value) {
+        const regex = /^\d{4}-\d{2}-\d{2}$/;
+        if (!regex.test(value))
+            return false;
+        const [year, month, day] = value.split('-').map(Number);
+        const date = new Date(year, month - 1, day);
+        return (date.getFullYear() === year &&
+            date.getMonth() === month - 1 &&
+            date.getDate() === day);
+    }
     handleDateChange(value) {
         if (value) {
             this.setModel(new Date(value));
@@ -5478,9 +5502,10 @@ InputDatePickerComponent.decorators = [
                      [placeholder]="placeholder"
                      (leftIconClick)="leftIconClick.emit($event)"
                      (rightIconClick)="toggleCalendar(true)"
-                     (blur)="handleDateChange(modelAsString)"
+                     (modelChange)="modelAsString = $event"
                      (clearIconClick)="handleClearIconClicked()"
                      [emptyPlace]="true"
+                     (keyup.enter)="finalizeDate()"
       ></co-input-text>
     `,
                 providers: [
@@ -6907,6 +6932,11 @@ DoubleCalendarModule.decorators = [
 ];
 
 class InputDateRangePickerComponent extends BaseInputDatePickerDirective {
+    constructor() {
+        super(...arguments);
+        this.EARLIEST_DATE = new Date(1900, 0, 1); // 1900-01-01
+        this.LATEST_DATE = new Date(2100, 11, 31); // 2100-12-31
+    }
     showClass() {
         return true;
     }
@@ -6947,43 +6977,71 @@ class InputDateRangePickerComponent extends BaseInputDatePickerDirective {
         }
     }
     handleFirstDateChanged(value) {
-        if (value) {
-            if (!this.model) {
-                this.setModel([]);
+        setTimeout(() => {
+            var _a, _b;
+            if (this.isValidDateString(value)) {
+                const [year, month, day] = value.split('-').map(Number);
+                const date = new Date(year, month - 1, day);
+                if (!this.model)
+                    this.setModel([]);
+                this.setModel([date, (_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a[1]) !== null && _b !== void 0 ? _b : null]);
             }
-            this.setModel([new Date(value), this.model[1] ? this.model[1] : null]);
-        }
+        });
     }
     handleSecondDateChanged(value) {
-        if (value) {
-            if (!this.model) {
-                this.setModel([]);
+        setTimeout(() => {
+            var _a, _b;
+            if (this.isValidDateString(value)) {
+                const [year, month, day] = value.split('-').map(Number);
+                const date = new Date(year, month - 1, day);
+                if (!this.model)
+                    this.setModel([]);
+                this.setModel([(_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : null, date]);
             }
-            this.setModel([this.model[0] ? this.model[0] : null, new Date(value)]);
+        });
+    }
+    finalizeDates() {
+        let startDate = this.EARLIEST_DATE;
+        let endDate = this.LATEST_DATE;
+        if (this.isValidDateString(this.firstDateAsString)) {
+            const [y, m, d] = this.firstDateAsString.split('-').map(Number);
+            startDate = new Date(y, m - 1, d);
+        }
+        if (this.isValidDateString(this.secondDateAsString)) {
+            const [y, m, d] = this.secondDateAsString.split('-').map(Number);
+            endDate = new Date(y, m - 1, d);
         }
+        this.setModel([startDate, endDate]);
+    }
+    isValidDateString(value) {
+        const regex = /^\d{4}-\d{2}-\d{2}$/;
+        if (!regex.test(value))
+            return false;
+        const [yearStr, monthStr, dayStr] = value.split('-');
+        const [year, month, day] = [Number(yearStr), Number(monthStr), Number(dayStr)];
+        // Prevent ancient years or too-far future
+        if (year < 1900 || year > 2100)
+            return false;
+        const date = new Date(year, month - 1, day);
+        return (date.getFullYear() === year &&
+            date.getMonth() === month - 1 &&
+            date.getDate() === day);
     }
     modelSet() {
         this.setModelAsString();
     }
     setModelAsString() {
-        if (this.model[0]) {
-            const year = this.model[0].toLocaleString("default", { year: "numeric" });
-            const month = this.model[0].toLocaleString("default", { month: "2-digit" });
-            const day = this.model[0].toLocaleString("default", { day: "2-digit" });
-            this.firstDateAsString = `${year}-${month}-${day}`;
-        }
-        else {
-            this.firstDateAsString = ``;
-        }
-        if (this.model[1]) {
-            const year = this.model[1].toLocaleString("default", { year: "numeric" });
-            const month = this.model[1].toLocaleString("default", { month: "2-digit" });
-            const day = this.model[1].toLocaleString("default", { day: "2-digit" });
-            this.secondDateAsString = `${year}-${month}-${day}`;
-        }
-        else {
-            this.secondDateAsString = ``;
-        }
+        var _a, _b;
+        const isStartDefault = ((_a = this.model[0]) === null || _a === void 0 ? void 0 : _a.getTime()) === this.EARLIEST_DATE.getTime();
+        const isEndDefault = ((_b = this.model[1]) === null || _b === void 0 ? void 0 : _b.getTime()) === this.LATEST_DATE.getTime();
+        this.firstDateAsString = (!this.model[0] || isStartDefault) ? '' : this.formatDate(this.model[0]);
+        this.secondDateAsString = (!this.model[1] || isEndDefault) ? '' : this.formatDate(this.model[1]);
+    }
+    formatDate(date) {
+        const year = date.toLocaleString("default", { year: "numeric" });
+        const month = date.toLocaleString("default", { month: "2-digit" });
+        const day = date.toLocaleString("default", { day: "2-digit" });
+        return `${year}-${month}-${day}`;
     }
 }
 InputDateRangePickerComponent.decorators = [
@@ -6999,10 +7057,11 @@ InputDateRangePickerComponent.decorators = [
                        [leftIcon]="leftIcon"
                        [leftIconData]="leftIconData"
                        [placeholder]="placeholder"
-                       (blur)="handleFirstDateChanged(firstDateAsString)"
+                       (modelChange)="handleFirstDateChanged(firstDateAsString)"
                        (clearIconClick)="clearDate(0)"
                        (click)="handleFirstInputClick($event)"
                        [emptyPlace]="true"
+                       (keyup.enter)="finalizeDates()"
         ></co-input-text>
         <co-input-text #secondInput class="no-focus-line custom-height"
                        [(model)]= "secondDateAsString"
@@ -7011,10 +7070,11 @@ InputDateRangePickerComponent.decorators = [
                        [type]="'date'"
                        [rightIcon]="rightIcon"
                        (rightIconClick)="toggleCalendar()"
-                       (blur)="handleSecondDateChanged(secondDateAsString)"
+                       (modelChange)="handleSecondDateChanged(secondDateAsString)"
                        (clearIconClick)="clearDate(1)"
                        (click)="handleSecondInputClick($event)"
                        [emptyPlace]="true"
+                       (keyup.enter)="finalizeDates()"
         ></co-input-text>
       </div>
     `,
@@ -7766,6 +7826,7 @@ class InputSearchComponent extends BaseInputComponent {
     constructor() {
         super(...arguments);
         this.searchIcon = CoreComponentsIcon.Magnifier;
+        this.handleKeydown = true;
         this.search = new EventEmitter();
         this.isFocused = new EventEmitter();
         this.leftIconClick = new EventEmitter();
@@ -7778,6 +7839,9 @@ class InputSearchComponent extends BaseInputComponent {
         return true;
     }
     handleKeyDown(event) {
+        if (!this.handleKeydown) {
+            return;
+        }
         const enterKeys = ['Enter', 'NumpadEnter', 'Go'];
         if (enterKeys.includes(event.key)) {
             event.preventDefault();
@@ -7825,6 +7889,7 @@ InputSearchComponent.decorators = [
 ];
 InputSearchComponent.propDecorators = {
     placeholder: [{ type: Input }],
+    handleKeydown: [{ type: Input }],
     search: [{ type: Output }],
     isFocused: [{ type: Output }],
     leftIconClick: [{ type: Output }],
@@ -11435,7 +11500,6 @@ ListOfValuesModule.decorators = [
                     OverlayModule,
                     ClickoutsideModule,
                     IconModule,
-                    InputTextModule,
                     InputSearchModule
                 ],
                 declarations: [
@@ -12562,7 +12626,7 @@ FilterItemComponent.decorators = [
                           <co-input-date-range [readonly]="readonly"
                                   [model]="[dateRangeStart, dateRangeEnd]"
                                   (modelChange)="handleModelChange($event)"
-                                  [placeholder]="'SELECT_DATE' | coreLocalize">
+                                  [placeholder]="'Kies datum' | coreLocalize">
                           </co-input-date-range>
                       </div>
                   </ng-template>
@@ -12794,11 +12858,17 @@ class BarCodeScanner {
     constructor() {
         this._buffer = [];
         this._keyPress = (event) => {
+            this._clearScanTimeout();
             if (event.key === "Enter") {
-                document.dispatchEvent(this._createScanEvent());
-                this._buffer.length = 0;
+                if (this._buffer.length > 0) {
+                    document.dispatchEvent(this._createScanEvent());
+                    this._clearBuffer();
+                }
             }
             else {
+                this._scanTimeout = setTimeout(() => {
+                    this._clearBuffer();
+                }, 200);
                 const str = event.key;
                 this._buffer.push(str);
             }
@@ -12808,6 +12878,13 @@ class BarCodeScanner {
     close() {
         document.removeEventListener('keypress', this._keyPress);
     }
+    _clearScanTimeout() {
+        clearTimeout(this._scanTimeout);
+        this._scanTimeout = undefined;
+    }
+    _clearBuffer() {
+        this._buffer.length = 0;
+    }
     _createScanEvent() {
         return new CustomEvent("barcodescanned", { detail: this._buffer.join("") });
     }
@@ -12851,14 +12928,37 @@ class InputScannerComponent {
         this.search = new EventEmitter();
         this.isFocused = new EventEmitter();
         this.barCodeScanned = new EventEmitter();
+        this._blockEnterKeydown = false;
         this._scannerService.registerInput(this);
     }
     showClass() {
         return true;
     }
+    ngOnDestroy() {
+        this._clearTimeout();
+    }
+    handleKeyDown(event) {
+        this._clearTimeout();
+        this._keyDownTimeout = setTimeout(() => {
+            if (this._blockEnterKeydown) {
+                return;
+            }
+            const enterKeys = ['Enter', 'NumpadEnter', 'Go'];
+            if (enterKeys.includes(event.key)) {
+                this.search.next(this.model);
+            }
+        }, 200);
+    }
     triggerCodeScanned(code) {
+        this._clearTimeout();
+        this._blockEnterKeydown = true;
         this.model = code;
         this.barCodeScanned.next(this.model);
+        this._blockEnterKeydown = false;
+    }
+    _clearTimeout() {
+        clearTimeout(this._keyDownTimeout);
+        this._keyDownTimeout = undefined;
     }
 }
 InputScannerComponent.decorators = [
@@ -12867,6 +12967,7 @@ InputScannerComponent.decorators = [
                 template: `
       <co-input-search
               [(model)]="model"
+              [handleKeydown]="false"
               [customCssClass]="customCssClass"
               [placeholder]="placeholder"
               [centerLabel]="centerLabel"
@@ -12876,7 +12977,6 @@ InputScannerComponent.decorators = [
               [rightIconData]="rightIconData"
               (leftIconClick)="leftIconClick.emit($event)"
               (rightIconClick)="rightIconClick.emit($event)"
-              (search)="search.emit($event)"
               (isFocused)="isFocused.emit($event)"
       ></co-input-search>
     `,
@@ -12905,7 +13005,8 @@ InputScannerComponent.propDecorators = {
     search: [{ type: Output }],
     isFocused: [{ type: Output }],
     barCodeScanned: [{ type: Output }],
-    showClass: [{ type: HostBinding, args: ['class.co-input-scanner',] }]
+    showClass: [{ type: HostBinding, args: ['class.co-input-scanner',] }],
+    handleKeyDown: [{ type: HostListener, args: ['keydown', ['$event'],] }]
 };
 
 class InputScannerModule {
@@ -13447,7 +13548,7 @@ class BaseModuleScreenConfigService {
     }
     getDefaultValue(configName) {
         const objectConfig = this._objectConfigsMap.get(configName);
-        return objectConfig ? objectConfig.getDefaultValue() : undefined;
+        return objectConfig ? objectConfig.defaultValue : undefined;
     }
     getDefaultStringValue(configName) {
         const objectConfig = this._objectConfigsMap.get(configName);
@@ -13664,6 +13765,7 @@ class ScreenConfigurationDirective {
                     this.hostComponent.readonly = this.hostComponent.forceReadonly || this._moduleInReadonlyMode() || myCfgObj.isReadonly();
                     this.hostComponent.decimals = myCfgObj.scale;
                     this.hostComponent.maxLength = myCfgObj.maxLength;
+                    this.hostComponent.defaultValue = myCfgObj.defaultValue;
                     if ('configObject' in this.hostComponent) {
                         this.hostComponent.configObject = myCfgObj;
                     }