diff --git a/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.component.ts b/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.component.ts index c0bd9cee8a61..c985cb00b95c 100644 --- a/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.component.ts +++ b/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.component.ts @@ -27,7 +27,11 @@ export class TuiMobileCalendarDialogComponent { ) {} get single(): boolean { - return this.context.data?.single !== false; + return this.context.data?.single === true; + } + + get multi(): boolean { + return this.context.data?.multi === true; } get min(): TuiDay { diff --git a/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.template.html b/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.template.html index a9e0134c724e..6ebce6d86db4 100644 --- a/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.template.html +++ b/projects/addon-mobile/components/mobile-calendar-dialog/mobile-calendar-dialog.template.html @@ -2,6 +2,7 @@ [disabledItemHandler]="disabledItemHandler" [max]="max" [min]="min" + [multi]="multi" [single]="single" (cancel)="context.$implicit.complete()" (confirm)="context.completeWith($event)" diff --git a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts index 8943e7127e07..ab42884763b3 100644 --- a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts +++ b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.component.ts @@ -87,6 +87,9 @@ export class TuiMobileCalendarComponent implements AfterViewInit { @Input() single = true; + @Input() + multi = false; + @Input() min = TUI_FIRST_DAY; @@ -130,7 +133,7 @@ export class TuiMobileCalendarComponent implements AfterViewInit { @Inject(TUI_SHORT_WEEK_DAYS) readonly unorderedWeekDays$: TuiInjectionTokenType, @Inject(TUI_CHOOSE_DAY_OR_RANGE_TEXTS) - readonly chooseDayOrRangeTexts$: Observable<[string, string]>, + readonly chooseDayOrRangeTexts$: Observable<[string, string, string]>, @Inject(TUI_ANIMATIONS_DURATION) private readonly duration: number, @Inject(NgZone) private readonly ngZone: NgZone, ) { @@ -166,23 +169,15 @@ export class TuiMobileCalendarComponent implements AfterViewInit { onDayClick(day: TuiDay): void { if (this.single) { this.value = day; - - return; - } - - if (!(this.value instanceof TuiDayRange) && !(this.value instanceof TuiDay)) { - this.value = tuiImmutableUpdateInputDateMulti(this.value ?? [], day); - - return; - } - - if (this.value instanceof TuiDay || !this.value?.isSingleDay) { + } else if (this.isMultiValue(this.value)) { + this.value = tuiImmutableUpdateInputDateMulti(this.value, day); + } else if (this.isSingleValue(this.value)) { + this.value = new TuiDayRange(day, day); + } else if (this.value instanceof TuiDayRange) { + this.value = TuiDayRange.sort(this.value.from, day); + } else if (!this.value) { this.value = new TuiDayRange(day, day); - - return; } - - this.value = TuiDayRange.sort(this.value.from, day); } getState(index: number): 'active' | 'adjacent' | null { @@ -238,6 +233,14 @@ export class TuiMobileCalendarComponent implements AfterViewInit { (max !== null && item.dayAfter(max)) || disabledItemHandler(item); + private isMultiValue(day: any): day is readonly TuiDay[] | undefined { + return !(day instanceof TuiDay) && !(day instanceof TuiDayRange) && this.multi; + } + + private isSingleValue(day: any): day is TuiDay { + return day instanceof TuiDay || (day instanceof TuiDayRange && !day.isSingleDay); + } + private get initialYear(): number { if (!this.value) { return this.today.year; diff --git a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html index 7311047e4c17..24e2f07041bb 100644 --- a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html +++ b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html @@ -25,7 +25,7 @@ automation-id="tui-mobile-calendar__label" class="t-label" > - {{ single ? texts[0] : texts[1] }} + {{ single ? texts?.[0] : multi ? texts?.[2] : texts?.[1] }}