@siemens/element-ng 51.2.0 → 51.3.0

package/README.md

@@ -10,8 +10,8 @@
   <a href="https://www.npmjs.com/@siemens/element-ng">
     <img src="https://img.shields.io/npm/v/@siemens/element-ng.svg?logo=npm&logoColor=fff&label=NPM+package&color=limegreen" alt="Element on npm" />
   </a>
-  <a href="https://element.siemens.io/coverage/element-ng/index.html">
-    <img src="https://img.shields.io/endpoint?url=https://element.siemens.io/coverage-summary.json" alt="Code Coverage">
+  <a href="https://element.siemens.io/development/coverage/element-ng/index.html">
+    <img src="https://img.shields.io/endpoint?url=https://element.siemens.io/development/coverage-summary.json" alt="Code Coverage">
   </a>
 </p>
 

package/fesm2022/siemens-element-ng-datepicker.mjs

@@ -858,6 +858,7 @@ class SiDateInputDirective {
         this.stateChange.emit();
     }
     writeValue(value) {
+        value ??= undefined;
         // remove date when user input is empty
         let emptyString = false;
         // Flag to define invalid string
@@ -900,7 +901,8 @@ class SiDateInputDirective {
         const hasChanged = !(parsedDate === this.date);
         if (hasChanged) {
             this.date = parsedDate;
-            this.onModelChange(this.date);
+            // Emit `null` for an empty input, as `undefined` is not supported by Angular signal forms.
+            this.onModelChange(this.date ?? null);
             this.dateChange.emit(this.date);
         }
     }
@@ -921,7 +923,7 @@ class SiDateInputDirective {
         // update input element
         this.writeValue(date);
         // update the Forms ngModel
-        this.onModelChange(this.date);
+        this.onModelChange(this.date ?? null);
     }
     /**
      * Datepicker consider time / ignore time changed.
@@ -2333,6 +2335,11 @@ class SiTimepickerComponent {
      * Holds the time as date object that is presented by this control.
      */
     time;
+    /**
+     * Whether `null` was emitted due to an incomplete or invalid input.
+     * The next valid time must be emitted, even if it equals the previous `time`.
+     */
+    invalidTimeEmitted = false;
     periodDefaults;
     constructor() {
         this.periodDefaults = getLocaleDayPeriods(this.locale, FormStyle.Format, TranslationWidth.Short).slice();
@@ -2358,6 +2365,7 @@ class SiTimepickerComponent {
         const time = this.parseTime(obj);
         if (!time || this.isValidDate(time)) {
             this.time = time;
+            this.invalidTimeEmitted = false;
             this.updateUI(this.time);
         }
     }
@@ -2432,6 +2440,7 @@ class SiTimepickerComponent {
     updateTime() {
         if (this.hasInvalidUnit()) {
             this.isValid.emit(false);
+            this.invalidTimeEmitted = true;
             this.onChange(null);
             return;
         }
@@ -2443,7 +2452,8 @@ class SiTimepickerComponent {
      * @param time - The new time to be set.
      */
     setTime(time) {
-        if (this.time?.getTime() !== time?.getTime()) {
+        if (this.invalidTimeEmitted || this.time?.getTime() !== time?.getTime()) {
+            this.invalidTimeEmitted = false;
             this.time = time;
             this.updateUI(this.time);
             this.onChange(this.time);