From 5bd3710a9c4baf73ce4b7188d34ab5675fa88fbe Mon Sep 17 00:00:00 2001 From: Mohan MU Date: Mon, 2 Sep 2024 18:48:30 +0530 Subject: [PATCH 1/3] fix(kit): CalendarRange not switch to selected item --- .../kit/components/calendar-range/calendar-range.component.ts | 4 ++++ .../components/calendar-range/calendar-range.template.html | 4 ++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/projects/kit/components/calendar-range/calendar-range.component.ts b/projects/kit/components/calendar-range/calendar-range.component.ts index e34d580f32af..18c76943e0b5 100644 --- a/projects/kit/components/calendar-range/calendar-range.component.ts +++ b/projects/kit/components/calendar-range/calendar-range.component.ts @@ -113,6 +113,10 @@ export class TuiCalendarRange implements OnInit, OnChanges { this.selectedPeriod = period; } + public get computedMonth(): TuiMonth { + return this.value ? this.value.to : this.defaultViewedMonth; + } + public ngOnChanges(): void { this.defaultViewedMonth = this.value?.from || this.defaultViewedMonth; } diff --git a/projects/kit/components/calendar-range/calendar-range.template.html b/projects/kit/components/calendar-range/calendar-range.template.html index c82016a1535c..1d8c904cb7aa 100644 --- a/projects/kit/components/calendar-range/calendar-range.template.html +++ b/projects/kit/components/calendar-range/calendar-range.template.html @@ -6,7 +6,7 @@ [max]="max | tuiMapper: capsMapper : value : maxLength : false" [maxViewedMonth]="items.length ? null : (defaultViewedMonth | tuiMapper: monthOffset : -1)" [min]="min | tuiMapper: capsMapper : value : maxLength : true" - [month]="defaultViewedMonth" + [month]="computedMonth" [showAdjacent]="!!items.length" [value]="value" [(hoveredItem)]="hoveredItem" @@ -21,7 +21,7 @@ [max]="max | tuiMapper: capsMapper : value : maxLength : false" [min]="min | tuiMapper: capsMapper : value : maxLength : true" [minViewedMonth]="defaultViewedMonth | tuiMapper: monthOffset : 1" - [month]="defaultViewedMonth | tuiMapper: monthOffset : 1" + [month]="computedMonth | tuiMapper: monthOffset : 1" [showAdjacent]="false" [value]="value" [(hoveredItem)]="hoveredItem" From 749f3bec01fa71416e1ef21d320afcdd3c14b705 Mon Sep 17 00:00:00 2001 From: Mohan MU Date: Mon, 2 Sep 2024 18:50:45 +0530 Subject: [PATCH 2/3] chore(kit): Update calendar-range template to use defaultViewedMonth instead of computedMonth --- .../kit/components/calendar-range/calendar-range.template.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/kit/components/calendar-range/calendar-range.template.html b/projects/kit/components/calendar-range/calendar-range.template.html index 1d8c904cb7aa..5d2f1b9a8a84 100644 --- a/projects/kit/components/calendar-range/calendar-range.template.html +++ b/projects/kit/components/calendar-range/calendar-range.template.html @@ -21,7 +21,7 @@ [max]="max | tuiMapper: capsMapper : value : maxLength : false" [min]="min | tuiMapper: capsMapper : value : maxLength : true" [minViewedMonth]="defaultViewedMonth | tuiMapper: monthOffset : 1" - [month]="computedMonth | tuiMapper: monthOffset : 1" + [month]="defaultViewedMonth | tuiMapper: monthOffset : 1" [showAdjacent]="false" [value]="value" [(hoveredItem)]="hoveredItem" From 45eeb090e8851e964f23e37bc0f8bbbb6596c5a7 Mon Sep 17 00:00:00 2001 From: Mohan MU Date: Mon, 2 Sep 2024 19:15:22 +0530 Subject: [PATCH 3/3] fix(calendar-range): Fix computedMonth logic to correctly display the selected month --- .../kit/components/calendar-range/calendar-range.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/kit/components/calendar-range/calendar-range.component.ts b/projects/kit/components/calendar-range/calendar-range.component.ts index 18c76943e0b5..e071e7e59b14 100644 --- a/projects/kit/components/calendar-range/calendar-range.component.ts +++ b/projects/kit/components/calendar-range/calendar-range.component.ts @@ -114,7 +114,7 @@ export class TuiCalendarRange implements OnInit, OnChanges { } public get computedMonth(): TuiMonth { - return this.value ? this.value.to : this.defaultViewedMonth; + return this.value ? this.value.from : this.defaultViewedMonth; } public ngOnChanges(): void {