fix: Calendar selection is applied when the component is readonly

IgniteUI · Apr 29, 2024 · 059be15 · 059be15
1 parent 6cec176
commit 059be15
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/src/components/date-picker/date-picker.ts b/src/components/date-picker/date-picker.ts
@@ -524,12 +524,13 @@ export default class IgcDatepickerComponent extends FormAssociatedRequiredMixin(
     this.emitEvent('igcChange', { detail: this.value });
   }
 
-  protected handleCalendarChangeEvent(event: CustomEvent<Date>) {
+  protected async handleCalendarChangeEvent(event: CustomEvent<Date>) {
     event.stopPropagation();
 
     if (this.readOnly) {
-      event.preventDefault();
-      this._calendar.value = this.value ?? undefined;
+      // Wait till the calendar finishes updating and then restore the current value from the date-picker.
+      await this._calendar.updateComplete;
+      this._calendar.value = this._value ?? undefined;
       return;
     }