fix(kit): fix CalendarRange defaultViewedMonth shows correct left a…

…nd right calendars
taiga-family · Aug 7, 2024 · faa9a07 · faa9a07
1 parent 3408038
commit faa9a07
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 0 deletions.
diff --git a/projects/demo-playwright/tests/kit/calendar-range/calendar-range.spec.ts b/projects/demo-playwright/tests/kit/calendar-range/calendar-range.spec.ts
@@ -26,5 +26,16 @@ describe('CalendarRange', () => {
             await documentationPage.prepareApiPageBeforeScreenshot();
             await expect(page).toHaveScreenshot('calendar-range-max-length-click.png');
         });
+
+        test('When set defaultViewedMonth, calendar shows defaultViewedMonth', async ({
+            page,
+        }) => {
+            await tuiGoto(page, 'components/calendar-range/API?defaultViewedMonth$=2');
+
+            await documentationPage.prepareApiPageBeforeScreenshot();
+            await expect(page).toHaveScreenshot(
+                'calendar-range-default-viewed-month.png',
+            );
+        });
     });
 });
diff --git a/projects/kit/components/calendar-range/calendar-range.component.ts b/projects/kit/components/calendar-range/calendar-range.component.ts
@@ -120,6 +120,9 @@ export class TuiCalendarRangeComponent implements TuiWithOptionalMinMax<TuiDay>
         this.value = this.previousValue;
     }
 
+    readonly monthOffset: TuiTypedMapper<[TuiMonth, number], TuiMonth> = (value, month) =>
+        value.append({month});
+
     readonly mapper: TuiTypedMapper<
         [
             readonly TuiDayRangePeriod[],

diff --git a/projects/kit/components/calendar-range/calendar-range.template.html b/projects/kit/components/calendar-range/calendar-range.template.html
@@ -3,6 +3,7 @@
     automation-id="tui-calendar-range__calendars"
     tuiPreventDefault="mousedown"
     [defaultViewedMonthFirst]="defaultViewedMonth"
+    [defaultViewedMonthSecond]="defaultViewedMonth | tuiMapper: monthOffset : 1"
     [disabledItemHandler]="calculatedDisabledItemHandler"
     [markerHandler]="markerHandler"
     [max]="computedMax | tuiMapper: maxLengthMapper : value : maxLength : false"

diff --git a/...cts/kit/internal/primitive-calendar-range/test/primitive-calendar-range.component.spec.ts b/...cts/kit/internal/primitive-calendar-range/test/primitive-calendar-range.component.spec.ts
@@ -62,6 +62,15 @@ describe('PrimitiveRangeCalendar component', () => {
             component.ngOnInit();
             expect(component.userViewedMonthFirst).toEqual(minDate);
         });
+
+        it('When initialized with setted input defaultViewedMonthFirst, shows defaultViewedMonthFirst', () => {
+            const month = new TuiMonth(2020, 5);
+
+            component.defaultViewedMonthFirst = month;
+            component.ngOnInit();
+
+            expect(component.userViewedMonthFirst).toBe(month);
+        });
     });
 
     describe('viewedMonthSecond', () => {
@@ -105,6 +114,15 @@ describe('PrimitiveRangeCalendar component', () => {
 
             expect(component.userViewedMonthSecond).toEqual(minDate.append({month: 1}));
         });
+
+        it('When initialized with setted input defaultViewedMonthSecond, shows defaultViewedMonthSecond', () => {
+            const month = new TuiMonth(2020, 5);
+
+            component.defaultViewedMonthSecond = month;
+            component.ngOnInit();
+
+            expect(component.userViewedMonthSecond).toBe(month);
+        });
     });
 
     describe('cappedUserViewedMonthSecond', () => {