fix(month-view/year-view): create onMouseDown events (#15290)

IgniteUI · Jan 27, 2025 · 867aac4 · 867aac4
1 parent 8d91cdb
commit 867aac4
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 0 deletions.
diff --git a/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.html b/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.html
@@ -12,6 +12,7 @@
         [date]="date"
         [showActive]="showActive"
         (itemSelection)="selectDate($event)"
+        (mousedown)="onMouseDown()"
     >
         <span class="igx-calendar-view__item-inner" aria-hidden="true">
             {{ formattedMonth(month).formatted | titlecase }}

diff --git a/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts b/projects/igniteui-angular/src/lib/calendar/months-view/months-view.component.ts
@@ -135,6 +135,15 @@ export class IgxMonthsViewComponent extends IgxCalendarViewDirective implements
         super(dayInterval);
     }
 
+    /**
+     * @hidden
+     */
+    protected onMouseDown() {
+        if (this.tabIndex !== -1) {
+            this.el.nativeElement.focus();
+        }
+    }
+
     /**
      * Returns the locale representation of the month in the months view.
      *

diff --git a/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.html b/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.html
@@ -13,6 +13,7 @@
         [date]="date"
         [showActive]="showActive"
         (itemSelection)="selectDate($event)"
+        (mousedown)="onMouseDown()"
     >
         <span class="igx-calendar-view__item-inner" aria-hidden="true">
             {{ formattedYear(year).formatted }}

diff --git a/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts b/projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts
@@ -154,4 +154,13 @@ export class IgxYearsViewComponent extends IgxCalendarViewDirective implements C
             year: this.yearFormat,
         });
     }
+
+    /**
+     * @hidden
+     */
+    protected onMouseDown() {
+        if (this.tabIndex !== -1) {
+            this.el.nativeElement.focus();
+        }
+    }
 }