@taiga-ui/addon-mobile 3.58.0 → 3.59.0-canary.10da730

package/fesm2015/taiga-ui-addon-mobile-components-mobile-calendar.mjs

@@ -0,0 +1,539 @@
+import * as i1 from '@angular/common';
+import { DOCUMENT, CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { InjectionToken, Optional, ChangeDetectorRef, EventEmitter, NgZone, Component, ChangeDetectionStrategy, Inject, Self, ViewChild, Input, Output, NgModule } from '@angular/core';
+import * as i7 from '@taiga-ui/cdk';
+import { MONTHS_IN_YEAR, tuiPure, TuiDestroyService, TuiScrollService, TUI_IS_IOS, tuiWatch, TuiDay, TUI_FIRST_DAY, TUI_LAST_DAY, ALWAYS_FALSE_HANDLER, TuiMonth, TuiDayRange, tuiTypedFromEvent, TUI_IS_E2E, TuiMapperPipeModule } from '@taiga-ui/cdk';
+import * as i5 from '@taiga-ui/core';
+import { TUI_COMMON_ICONS, TUI_CLOSE_WORD, TUI_SHORT_WEEK_DAYS, TUI_ANIMATIONS_DURATION, TuiLinkModule, TuiButtonModule, TuiMonthPipeModule, TuiOrderWeekDaysPipeModule } from '@taiga-ui/core';
+import { TUI_CALENDAR_DATE_STREAM, tuiImmutableUpdateInputDateMulti, TUI_CANCEL_WORD, TUI_DONE_WORD, TUI_CHOOSE_DAY_OR_RANGE_TEXTS } from '@taiga-ui/kit';
+import * as i8 from 'rxjs';
+import { Subject, distinctUntilChanged, takeUntil, EMPTY, identity, delay, take, windowToggle, mergeMap, map, filter, switchMap, race, timer, debounceTime } from 'rxjs';
+import * as i2 from '@angular/cdk/scrolling';
+import { VIRTUAL_SCROLL_STRATEGY, ScrollingModule } from '@angular/cdk/scrolling';
+import { __decorate } from 'tslib';
+import * as i3 from '@taiga-ui/addon-mobile/directives/touchable';
+import { TuiTouchableModule } from '@taiga-ui/addon-mobile/directives/touchable';
+import * as i4 from '@taiga-ui/addon-mobile/directives/ripple';
+import { TuiRippleModule } from '@taiga-ui/addon-mobile/directives/ripple';
+import * as i6 from '@taiga-ui/addon-mobile/internal/primitive-calendar-mobile';
+import { TuiPrimitiveCalendarMobileModule } from '@taiga-ui/addon-mobile/internal/primitive-calendar-mobile';
+
+function getCycle(options) {
+    return Array.from({ length: options.yearCycle }, (_, i) => Array.from({ length: MONTHS_IN_YEAR }, (_, month) => options.label +
+        weekCount({ year: i, month, startingYear: options.startingYear }) *
+            options.week));
+}
+function weekCount(options) {
+    const firstOfMonth = new Date(options.year + options.startingYear, options.month, 1);
+    const lastOfMonth = new Date(options.year + options.startingYear, options.month + 1, 0);
+    const days = lastOfMonth.getDate() + (firstOfMonth.getDay() || 7) - 1;
+    return Math.ceil(days / 7);
+}
+const SCROLL_DEBOUNCE_TIME = 80;
+const YEARS_IN_ROW = 5;
+const STARTING_YEAR = 1900;
+const RANGE = 196;
+const BUFFER = 500;
+const ANDROID_LABEL = 64;
+const ANDROID_WEEK = 48;
+const IOS_LABEL = 50;
+const IOS_WEEK = 50;
+const YEARLY_CYCLE = 28;
+const ANDROID_CYCLE = getCycle({
+    label: ANDROID_LABEL,
+    week: ANDROID_WEEK,
+    yearCycle: YEARLY_CYCLE,
+    startingYear: STARTING_YEAR,
+});
+const IOS_CYCLE = getCycle({
+    label: IOS_LABEL,
+    week: IOS_WEEK,
+    yearCycle: YEARLY_CYCLE,
+    startingYear: STARTING_YEAR,
+});
+
+const ANDROID_CYCLE_HEIGHT = reduceCycle(ANDROID_CYCLE);
+const IOS_CYCLE_HEIGHT = reduceCycle(IOS_CYCLE);
+function reduceCycle(cycle, lastYear = 28, lastMonth = 12) {
+    return cycle.reduce((total, year, yearIndex) => yearIndex <= lastYear
+        ? total +
+            year.reduce((sum, month, monthIndex) => yearIndex < lastYear ||
+                (yearIndex === lastYear && monthIndex < lastMonth)
+                ? sum + month
+                : sum, 0)
+        : total, 0);
+}
+/**
+ * This scroll strategy is hard wired with styles for iOS and Android.
+ * It is dependent on month height on those platforms and is designed to
+ * work for {@link TuiMobileCalendarComponent} with years 1906 to 2102
+ */
+class TuiMobileCalendarStrategy {
+    constructor(isIos, scrollService) {
+        this.isIos = isIos;
+        this.scrollService = scrollService;
+        this.index$ = new Subject();
+        this.viewport = null;
+        this.destroy$ = new Subject();
+    }
+    get scrolledIndexChange() {
+        return this.index$.pipe(distinctUntilChanged());
+    }
+    attach(viewport) {
+        const cycle = this.isIos ? IOS_CYCLE_HEIGHT : ANDROID_CYCLE_HEIGHT;
+        this.viewport = viewport;
+        this.viewport.setTotalContentSize(cycle * 7);
+        this.updateRenderedRange(this.viewport);
+    }
+    detach() {
+        this.index$.complete();
+        this.viewport = null;
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    onContentScrolled() {
+        if (this.viewport) {
+            this.updateRenderedRange(this.viewport);
+        }
+    }
+    /** These do not matter for this case */
+    onDataLengthChanged() { }
+    onContentRendered() { }
+    onRenderedOffsetChanged() { }
+    scrollToIndex(index, behavior) {
+        if (!this.viewport) {
+            return;
+        }
+        const scrollTop = this.getOffsetForIndex(index);
+        if (behavior !== `smooth`) {
+            this.viewport.scrollToOffset(scrollTop, behavior);
+            return;
+        }
+        this.scrollService
+            .scroll$(this.viewport.elementRef.nativeElement, scrollTop)
+            .pipe(takeUntil(this.destroy$))
+            .subscribe();
+    }
+    getOffsetForIndex(index) {
+        const month = index % MONTHS_IN_YEAR;
+        const year = (index - month) / MONTHS_IN_YEAR;
+        return this.computeHeight(year, month);
+    }
+    getIndexForOffset(offset) {
+        const cycle = this.isIos ? IOS_CYCLE : ANDROID_CYCLE;
+        const cycleHeight = this.isIos ? IOS_CYCLE_HEIGHT : ANDROID_CYCLE_HEIGHT;
+        const remainder = offset % cycleHeight;
+        const years = ((offset - remainder) / cycleHeight) * YEARLY_CYCLE;
+        let accumulator = 0;
+        for (let year = 0; year < cycle.length; year++) {
+            for (let month = 0; month < cycle[year].length; month++) {
+                accumulator += cycle[year][month];
+                if (accumulator - cycle[year][month] / 2 > remainder) {
+                    return Math.max((years + year) * MONTHS_IN_YEAR + month, 0);
+                }
+            }
+        }
+        return RANGE;
+    }
+    computeHeight(year, month) {
+        const cycle = this.isIos ? IOS_CYCLE : ANDROID_CYCLE;
+        const remainder = year % YEARLY_CYCLE;
+        const remainderHeight = reduceCycle(cycle, remainder, month);
+        const fullCycles = (year - remainder) / YEARLY_CYCLE;
+        const fullCyclesHeight = this.isIos
+            ? fullCycles * IOS_CYCLE_HEIGHT
+            : fullCycles * ANDROID_CYCLE_HEIGHT;
+        return fullCyclesHeight + remainderHeight;
+    }
+    updateRenderedRange(viewport) {
+        const offset = viewport.measureScrollOffset();
+        const { start, end } = viewport.getRenderedRange();
+        const viewportSize = viewport.getViewportSize();
+        const dataLength = viewport.getDataLength();
+        const newRange = { start, end };
+        const firstVisibleIndex = this.getIndexForOffset(offset);
+        const startBuffer = offset - this.getOffsetForIndex(start);
+        if (startBuffer < BUFFER && start !== 0) {
+            newRange.start = Math.max(0, this.getIndexForOffset(offset - BUFFER * 2));
+            newRange.end = Math.min(dataLength, this.getIndexForOffset(offset + viewportSize + BUFFER));
+        }
+        else {
+            const endBuffer = this.getOffsetForIndex(end) - offset - viewportSize;
+            if (endBuffer < BUFFER && end !== dataLength) {
+                newRange.start = Math.max(0, this.getIndexForOffset(offset - BUFFER));
+                newRange.end = Math.min(dataLength, this.getIndexForOffset(offset + viewportSize + BUFFER * 2));
+            }
+        }
+        viewport.setRenderedRange(newRange);
+        viewport.setRenderedContentOffset(this.getOffsetForIndex(newRange.start));
+        this.index$.next(firstVisibleIndex);
+    }
+}
+__decorate([
+    tuiPure
+], TuiMobileCalendarStrategy.prototype, "scrolledIndexChange", null);
+
+/**
+ * Stream for updating value
+ */
+const TUI_VALUE_STREAM = new InjectionToken(`[TUI_VALUE_STREAM]`);
+const TUI_MOBILE_CALENDAR_PROVIDERS = [
+    TuiDestroyService,
+    TuiScrollService,
+    {
+        provide: VIRTUAL_SCROLL_STRATEGY,
+        deps: [TUI_IS_IOS, TuiScrollService],
+        useClass: TuiMobileCalendarStrategy,
+    },
+    {
+        provide: TUI_VALUE_STREAM,
+        deps: [
+            [new Optional(), TUI_CALENDAR_DATE_STREAM],
+            TuiDestroyService,
+            ChangeDetectorRef,
+        ],
+        useFactory: (value$, destroy$, cdr) => (value$ || EMPTY).pipe(tuiWatch(cdr), takeUntil(destroy$)),
+    },
+];
+
+class TuiMobileCalendarComponent {
+    constructor(isIOS, isE2E, doc, destroy$, valueChanges, icons, closeWord$, cancelWord$, doneWord$, unorderedWeekDays$, chooseDayOrRangeTexts$, duration, ngZone) {
+        this.isIOS = isIOS;
+        this.isE2E = isE2E;
+        this.doc = doc;
+        this.destroy$ = destroy$;
+        this.icons = icons;
+        this.closeWord$ = closeWord$;
+        this.cancelWord$ = cancelWord$;
+        this.doneWord$ = doneWord$;
+        this.unorderedWeekDays$ = unorderedWeekDays$;
+        this.chooseDayOrRangeTexts$ = chooseDayOrRangeTexts$;
+        this.duration = duration;
+        this.ngZone = ngZone;
+        this.today = TuiDay.currentLocal();
+        this.activeYear = 0;
+        this.activeMonth = 0;
+        this.single = true;
+        this.multi = false;
+        this.min = TUI_FIRST_DAY;
+        this.max = TUI_LAST_DAY;
+        this.disabledItemHandler = ALWAYS_FALSE_HANDLER;
+        this.cancel = new EventEmitter();
+        this.confirm = new EventEmitter();
+        this.value = null;
+        this.years = Array.from({ length: RANGE }, (_, i) => i + STARTING_YEAR);
+        this.months = Array.from({ length: RANGE * 12 }, (_, i) => new TuiMonth(Math.floor(i / MONTHS_IN_YEAR) + STARTING_YEAR, i % MONTHS_IN_YEAR));
+        this.disabledItemHandlerMapper = (disabledItemHandler, min, max) => item => item.dayBefore(min) ||
+            (max !== null && item.dayAfter(max)) ||
+            disabledItemHandler(item);
+        valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => {
+            this.value = value;
+        });
+    }
+    get yearWidth() {
+        return this.doc.documentElement.clientWidth / YEARS_IN_ROW;
+    }
+    ngAfterViewInit() {
+        this.activeYear = this.initialYear;
+        this.activeMonth = this.initialMonth;
+        // Virtual scroll has not yet rendered items even in ngAfterViewInit
+        this.waitScrolledChange();
+    }
+    onClose() {
+        this.cancel.emit();
+    }
+    onConfirm() {
+        if (this.value) {
+            this.confirm.emit(this.value);
+        }
+        else {
+            this.cancel.emit();
+        }
+    }
+    onDayClick(day) {
+        if (this.single) {
+            this.value = day;
+        }
+        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);
+        }
+    }
+    getState(index) {
+        if (this.isYearActive(index)) {
+            return 'active';
+        }
+        if (this.isYearActive(index - 1) || this.isYearActive(index + 1)) {
+            return 'adjacent';
+        }
+        return null;
+    }
+    onMonthChange(month) {
+        // Skipping initial callback where index === 0
+        if (!month || this.activeMonth === month) {
+            return;
+        }
+        this.activeMonth = month;
+        const activeYear = this.monthToYear(month);
+        if (activeYear === this.activeYear) {
+            return;
+        }
+        this.activeYear = activeYear;
+        this.scrollToActiveYear();
+    }
+    setYear(year) {
+        if (this.activeYear === year) {
+            return;
+        }
+        this.activeMonth += this.getMonthOffset(year);
+        this.activeYear = year;
+        this.scrollToActiveYear('smooth');
+        this.ngZone.runOutsideAngular(() => {
+            // Delay is required to run months scroll in the next frame to prevent flicker
+            setTimeout(() => this.scrollToActiveMonth());
+        });
+    }
+    isMultiValue(day) {
+        return !(day instanceof TuiDay) && !(day instanceof TuiDayRange) && this.multi;
+    }
+    isSingleValue(day) {
+        return day instanceof TuiDay || (day instanceof TuiDayRange && !day.isSingleDay);
+    }
+    get initialYear() {
+        var _a, _b, _c;
+        if (!this.value) {
+            return this.today.year;
+        }
+        if (this.value instanceof TuiDay) {
+            return this.value.year;
+        }
+        if (!(this.value instanceof TuiDayRange)) {
+            return (_c = (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.year) !== null && _c !== void 0 ? _c : this.today.year;
+        }
+        return this.value.from.year;
+    }
+    get initialMonth() {
+        var _a, _b, _c, _d, _e, _f;
+        if (!this.value) {
+            return this.today.month + (this.today.year - STARTING_YEAR) * MONTHS_IN_YEAR;
+        }
+        if (this.value instanceof TuiDay) {
+            return this.value.month + (this.value.year - STARTING_YEAR) * MONTHS_IN_YEAR;
+        }
+        if (!(this.value instanceof TuiDayRange)) {
+            return (((_c = (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.month) !== null && _c !== void 0 ? _c : this.today.month) +
+                (((_f = (_e = (_d = this.value) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.year) !== null && _f !== void 0 ? _f : this.today.year) - STARTING_YEAR) *
+                    MONTHS_IN_YEAR);
+        }
+        return (this.value.from.month +
+            (this.value.from.year - STARTING_YEAR) * MONTHS_IN_YEAR);
+    }
+    getYearsViewportSize() {
+        var _a;
+        return ((_a = this.yearsScrollRef) === null || _a === void 0 ? void 0 : _a.getViewportSize()) || 0;
+    }
+    updateViewportDimension() {
+        var _a, _b;
+        (_a = this.yearsScrollRef) === null || _a === void 0 ? void 0 : _a.checkViewportSize();
+        (_b = this.monthsScrollRef) === null || _b === void 0 ? void 0 : _b.checkViewportSize();
+    }
+    lateInit() {
+        return this.getYearsViewportSize() > 0 ? identity : delay(200);
+    }
+    waitScrolledChange() {
+        var _a;
+        this.updateViewportDimension();
+        (_a = this.monthsScrollRef) === null || _a === void 0 ? void 0 : _a.scrolledIndexChange.pipe(delay(this.duration), this.lateInit(), take(1), takeUntil(this.destroy$)).subscribe(() => {
+            this.updateViewportDimension();
+            this.initYearScroll();
+            this.initMonthScroll();
+            this.scrollToActiveYear();
+            this.scrollToActiveMonth();
+        });
+    }
+    initYearScroll() {
+        const { yearsScrollRef } = this;
+        if (!yearsScrollRef) {
+            return;
+        }
+        const touchstart$ = tuiTypedFromEvent(yearsScrollRef.elementRef.nativeElement, 'touchstart', { passive: true });
+        const touchend$ = tuiTypedFromEvent(yearsScrollRef.elementRef.nativeElement, 'touchend', { passive: true });
+        const click$ = tuiTypedFromEvent(yearsScrollRef.elementRef.nativeElement, 'click');
+        // Refresh activeYear
+        yearsScrollRef
+            .elementScrolled()
+            .pipe(
+        // Ignore smooth scroll resulting from click on the exact year
+        windowToggle(touchstart$, () => click$), mergeMap(x => x), 
+        // Delay is required to run months scroll in the next frame to prevent flicker
+        delay(0), map(() => Math.round(yearsScrollRef.measureScrollOffset() / this.yearWidth) +
+            Math.floor(YEARS_IN_ROW / 2) +
+            STARTING_YEAR), filter(activeYear => activeYear !== this.activeYear), takeUntil(this.destroy$))
+            .subscribe(activeYear => {
+            this.activeMonth += this.getMonthOffset(activeYear);
+            this.activeYear = activeYear;
+            this.scrollToActiveMonth();
+        });
+        // Smooth scroll to activeYear after scrolling is done
+        touchstart$
+            .pipe(switchMap(() => touchend$), switchMap(() => race(yearsScrollRef.elementScrolled(), timer(SCROLL_DEBOUNCE_TIME)).pipe(debounceTime(SCROLL_DEBOUNCE_TIME * 2), take(1), takeUntil(touchstart$))), takeUntil(this.destroy$))
+            .subscribe(() => this.scrollToActiveYear('smooth'));
+    }
+    initMonthScroll() {
+        const { monthsScrollRef } = this;
+        if (!monthsScrollRef) {
+            return;
+        }
+        const touchstart$ = tuiTypedFromEvent(monthsScrollRef.elementRef.nativeElement, 'touchstart', { passive: true });
+        const touchend$ = tuiTypedFromEvent(monthsScrollRef.elementRef.nativeElement, 'touchend', { passive: true });
+        // Smooth scroll to the closest month after scrolling is done
+        touchstart$
+            .pipe(switchMap(() => touchend$), switchMap(() => race(monthsScrollRef.elementScrolled(), timer(SCROLL_DEBOUNCE_TIME)).pipe(debounceTime(SCROLL_DEBOUNCE_TIME * 2), take(1), takeUntil(touchstart$))), takeUntil(this.destroy$))
+            .subscribe(() => this.scrollToActiveMonth('smooth'));
+    }
+    scrollToActiveYear(behavior = 'auto') {
+        var _a;
+        (_a = this.yearsScrollRef) === null || _a === void 0 ? void 0 : _a.scrollToIndex(Math.max(this.activeYear - STARTING_YEAR - 2, 0), this.isE2E ? 'auto' : behavior);
+    }
+    scrollToActiveMonth(behavior = 'auto') {
+        var _a;
+        (_a = this.monthsScrollRef) === null || _a === void 0 ? void 0 : _a.scrollToIndex(this.activeMonth, this.isE2E ? 'auto' : behavior);
+    }
+    isYearActive(index) {
+        return index === this.activeYear;
+    }
+    monthToYear(month) {
+        return Math.ceil((month + 1) / MONTHS_IN_YEAR) + STARTING_YEAR - 1;
+    }
+    getMonthOffset(year) {
+        return (year - this.activeYear) * MONTHS_IN_YEAR;
+    }
+}
+TuiMobileCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarComponent, deps: [{ token: TUI_IS_IOS }, { token: TUI_IS_E2E }, { token: DOCUMENT }, { token: TuiDestroyService, self: true }, { token: TUI_VALUE_STREAM }, { token: TUI_COMMON_ICONS }, { token: TUI_CLOSE_WORD }, { token: TUI_CANCEL_WORD }, { token: TUI_DONE_WORD }, { token: TUI_SHORT_WEEK_DAYS }, { token: TUI_CHOOSE_DAY_OR_RANGE_TEXTS }, { token: TUI_ANIMATIONS_DURATION }, { token: NgZone }], target: i0.ɵɵFactoryTarget.Component });
+TuiMobileCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: TuiMobileCalendarComponent, selector: "tui-mobile-calendar", inputs: { single: "single", multi: "multi", min: "min", max: "max", disabledItemHandler: "disabledItemHandler" }, outputs: { cancel: "cancel", confirm: "confirm" }, host: { properties: { "class._ios": "isIOS" } }, providers: TUI_MOBILE_CALENDAR_PROVIDERS, viewQueries: [{ propertyName: "yearsScrollRef", first: true, predicate: ["yearsScrollRef"], descendants: true }, { propertyName: "monthsScrollRef", first: true, predicate: ["monthsScrollRef"], descendants: true }], ngImport: i0, template: "<header class=\"t-header\">\n    <button\n        appearance=\"\"\n        automation-id=\"tui-mobile-calendar__cancel\"\n        shape=\"rounded\"\n        tuiIconButton\n        tuiRipple\n        type=\"button\"\n        class=\"t-close\"\n        [icon]=\"icons.close\"\n        [title]=\"closeWord$ | async\"\n        (click)=\"onClose()\"\n    ></button>\n    <button\n        tuiLink\n        tuiTouchable=\"opacity\"\n        type=\"button\"\n        class=\"t-link t-link_close\"\n        (click)=\"onClose()\"\n    >\n        {{ cancelWord$ | async }}\n    </button>\n    <h2\n        *ngIf=\"chooseDayOrRangeTexts$ | async as texts\"\n        automation-id=\"tui-mobile-calendar__label\"\n        class=\"t-label\"\n    >\n        {{ single ? texts?.[0] : multi ? texts?.[2] : texts?.[1] }}\n    </h2>\n    <button\n        automation-id=\"tui-mobile-calendar__confirm\"\n        tuiLink\n        tuiTouchable=\"opacity\"\n        type=\"button\"\n        class=\"t-link\"\n        (click)=\"onConfirm()\"\n    >\n        {{ doneWord$ | async }}\n    </button>\n</header>\n<cdk-virtual-scroll-viewport\n    #yearsScrollRef\n    orientation=\"horizontal\"\n    class=\"t-years\"\n    [itemSize]=\"yearWidth\"\n>\n    <div class=\"t-years-wrapper\">\n        <button\n            *cdkVirtualFor=\"let index of years\"\n            type=\"button\"\n            class=\"t-year\"\n            [attr.data-state]=\"getState(index)\"\n            (click)=\"setYear(index)\"\n        >\n            {{ index }}\n        </button>\n    </div>\n</cdk-virtual-scroll-viewport>\n<div class=\"t-week\">\n    <div\n        *ngFor=\"let day of unorderedWeekDays$ | tuiOrderWeekDays | async\"\n        class=\"t-day\"\n    >\n        {{ day }}\n    </div>\n</div>\n<cdk-virtual-scroll-viewport\n    #monthsScrollRef\n    class=\"t-months\"\n    (scrolledIndexChange)=\"onMonthChange($event)\"\n>\n    <section\n        *cdkVirtualFor=\"let month of months; templateCacheSize: 10\"\n        class=\"t-month-wrapper\"\n    >\n        <h2 class=\"t-month\">{{ month | tuiMonth | async }}</h2>\n        <tui-primitive-calendar-mobile\n            class=\"t-calendar\"\n            [disabledItemHandler]=\"disabledItemHandler | tuiMapper: disabledItemHandlerMapper : min : max\"\n            [month]=\"month\"\n            [value]=\"value\"\n            (dayClick)=\"onDayClick($event)\"\n        ></tui-primitive-calendar-mobile>\n    </section>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%;font-family:-apple-system,BlinkMacSystemFont,Roboto,sans-serif;color:var(--tui-text-01);-webkit-tap-highlight-color:transparent}.t-header{position:relative;display:flex;align-items:center;height:3.5rem;padding:0 1rem;border-bottom:.5px solid var(--tui-base-03)}:host._ios .t-header{height:2.75rem;border-bottom:none}.t-close{width:1.5rem;height:1.5rem;margin-right:2rem}:host._ios .t-close{display:none}.t-link{margin-left:auto;flex-shrink:0;font-size:.875rem;line-height:1rem;font-weight:500;text-transform:uppercase;color:var(--tui-link)}.t-link_close{display:none}:host._ios .t-link{min-width:3.75rem;text-align:right;font-size:.9375rem;line-height:1.125rem;font-weight:400;letter-spacing:.018125rem;text-transform:none}:host._ios .t-link_close{display:block;margin:0 auto 0 0;text-align:left}.t-label{flex-grow:1;margin:0;font-size:1.25rem;line-height:3.5rem;font-weight:500;letter-spacing:-.0125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-label+.t-link{padding-left:1rem}:host._ios .t-label{font-size:1.0625rem;font-weight:600;letter-spacing:-.025625rem;text-align:center}.t-years{scrollbar-width:none;-ms-overflow-style:none;height:4.0625rem;background-color:var(--tui-base-01);box-shadow:0 .5px var(--tui-base-03)}.t-years::-webkit-scrollbar,.t-years::-webkit-scrollbar-thumb{background:transparent;width:0;height:0}:host._ios .t-years{background-color:transparent}.t-years-wrapper{display:flex;height:4.0625rem}.t-year{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;text-decoration:none;outline:none;width:20vw;flex-shrink:0;font-size:.9375rem;font-weight:700;letter-spacing:.015625rem;cursor:pointer;opacity:.1;transform:scale(.73);transition:color,opacity,transform .2s}.t-year[data-state=adjacent]{transform:scale(.86);opacity:.3}.t-year[data-state=active]{color:var(--tui-link);opacity:1;transform:scale(1)}.t-week{display:flex;align-items:center;height:1.875rem;width:20.75rem;max-width:100%;margin:0 auto;font-size:.75rem}:host._ios .t-week{width:22.625rem;font-size:.6875rem;font-weight:500;color:var(--tui-text-02)}.t-day{flex:1;text-align:center}.t-months{scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 9.5rem);box-shadow:0 -1px var(--tui-base-03);overflow-x:hidden}.t-months::-webkit-scrollbar,.t-months::-webkit-scrollbar-thumb{background:transparent;width:0;height:0}:host._ios .t-months{height:calc(100% - 8.75rem)}.t-month-wrapper{margin:.625rem 0 -.625rem}.t-month{height:2.75rem;line-height:2.75rem;padding-left:1rem;font-size:.875rem;font-weight:500;text-transform:uppercase;margin:0 0 1.25rem;box-sizing:border-box;border-bottom:.5px solid var(--tui-base-03)}:host._ios .t-month{height:3.125rem;margin:0;border-bottom:none;text-transform:none;font-size:1.375rem;line-height:3.125rem;letter-spacing:.02rem;font-weight:700}.t-calendar{margin:0 auto;font-family:inherit;font-size:1.125rem;transition:opacity .2s}:host._ios .t-calendar{font-size:1.0625rem}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i3.TuiTouchableDirective, selector: "[tuiTouchable]", inputs: ["tuiTouchable"] }, { kind: "directive", type: i4.TuiRippleDirective, selector: "[tuiRipple]", inputs: ["tuiRipple"] }, { kind: "component", type: i5.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { kind: "component", type: i6.TuiPrimitiveCalendarMobileComponent, selector: "tui-primitive-calendar-mobile" }, { kind: "component", type: i5.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TuiMapperPipe, name: "tuiMapper" }, { kind: "pipe", type: i5.TuiMonthPipe, name: "tuiMonth" }, { kind: "pipe", type: i5.TuiOrderWeekDaysPipe, name: "tuiOrderWeekDays" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tui-mobile-calendar', changeDetection: ChangeDetectionStrategy.OnPush, providers: TUI_MOBILE_CALENDAR_PROVIDERS, host: { '[class._ios]': 'isIOS' }, template: "<header class=\"t-header\">\n    <button\n        appearance=\"\"\n        automation-id=\"tui-mobile-calendar__cancel\"\n        shape=\"rounded\"\n        tuiIconButton\n        tuiRipple\n        type=\"button\"\n        class=\"t-close\"\n        [icon]=\"icons.close\"\n        [title]=\"closeWord$ | async\"\n        (click)=\"onClose()\"\n    ></button>\n    <button\n        tuiLink\n        tuiTouchable=\"opacity\"\n        type=\"button\"\n        class=\"t-link t-link_close\"\n        (click)=\"onClose()\"\n    >\n        {{ cancelWord$ | async }}\n    </button>\n    <h2\n        *ngIf=\"chooseDayOrRangeTexts$ | async as texts\"\n        automation-id=\"tui-mobile-calendar__label\"\n        class=\"t-label\"\n    >\n        {{ single ? texts?.[0] : multi ? texts?.[2] : texts?.[1] }}\n    </h2>\n    <button\n        automation-id=\"tui-mobile-calendar__confirm\"\n        tuiLink\n        tuiTouchable=\"opacity\"\n        type=\"button\"\n        class=\"t-link\"\n        (click)=\"onConfirm()\"\n    >\n        {{ doneWord$ | async }}\n    </button>\n</header>\n<cdk-virtual-scroll-viewport\n    #yearsScrollRef\n    orientation=\"horizontal\"\n    class=\"t-years\"\n    [itemSize]=\"yearWidth\"\n>\n    <div class=\"t-years-wrapper\">\n        <button\n            *cdkVirtualFor=\"let index of years\"\n            type=\"button\"\n            class=\"t-year\"\n            [attr.data-state]=\"getState(index)\"\n            (click)=\"setYear(index)\"\n        >\n            {{ index }}\n        </button>\n    </div>\n</cdk-virtual-scroll-viewport>\n<div class=\"t-week\">\n    <div\n        *ngFor=\"let day of unorderedWeekDays$ | tuiOrderWeekDays | async\"\n        class=\"t-day\"\n    >\n        {{ day }}\n    </div>\n</div>\n<cdk-virtual-scroll-viewport\n    #monthsScrollRef\n    class=\"t-months\"\n    (scrolledIndexChange)=\"onMonthChange($event)\"\n>\n    <section\n        *cdkVirtualFor=\"let month of months; templateCacheSize: 10\"\n        class=\"t-month-wrapper\"\n    >\n        <h2 class=\"t-month\">{{ month | tuiMonth | async }}</h2>\n        <tui-primitive-calendar-mobile\n            class=\"t-calendar\"\n            [disabledItemHandler]=\"disabledItemHandler | tuiMapper: disabledItemHandlerMapper : min : max\"\n            [month]=\"month\"\n            [value]=\"value\"\n            (dayClick)=\"onDayClick($event)\"\n        ></tui-primitive-calendar-mobile>\n    </section>\n</cdk-virtual-scroll-viewport>\n", styles: [":host{display:block;height:100%;font-family:-apple-system,BlinkMacSystemFont,Roboto,sans-serif;color:var(--tui-text-01);-webkit-tap-highlight-color:transparent}.t-header{position:relative;display:flex;align-items:center;height:3.5rem;padding:0 1rem;border-bottom:.5px solid var(--tui-base-03)}:host._ios .t-header{height:2.75rem;border-bottom:none}.t-close{width:1.5rem;height:1.5rem;margin-right:2rem}:host._ios .t-close{display:none}.t-link{margin-left:auto;flex-shrink:0;font-size:.875rem;line-height:1rem;font-weight:500;text-transform:uppercase;color:var(--tui-link)}.t-link_close{display:none}:host._ios .t-link{min-width:3.75rem;text-align:right;font-size:.9375rem;line-height:1.125rem;font-weight:400;letter-spacing:.018125rem;text-transform:none}:host._ios .t-link_close{display:block;margin:0 auto 0 0;text-align:left}.t-label{flex-grow:1;margin:0;font-size:1.25rem;line-height:3.5rem;font-weight:500;letter-spacing:-.0125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-label+.t-link{padding-left:1rem}:host._ios .t-label{font-size:1.0625rem;font-weight:600;letter-spacing:-.025625rem;text-align:center}.t-years{scrollbar-width:none;-ms-overflow-style:none;height:4.0625rem;background-color:var(--tui-base-01);box-shadow:0 .5px var(--tui-base-03)}.t-years::-webkit-scrollbar,.t-years::-webkit-scrollbar-thumb{background:transparent;width:0;height:0}:host._ios .t-years{background-color:transparent}.t-years-wrapper{display:flex;height:4.0625rem}.t-year{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;text-decoration:none;outline:none;width:20vw;flex-shrink:0;font-size:.9375rem;font-weight:700;letter-spacing:.015625rem;cursor:pointer;opacity:.1;transform:scale(.73);transition:color,opacity,transform .2s}.t-year[data-state=adjacent]{transform:scale(.86);opacity:.3}.t-year[data-state=active]{color:var(--tui-link);opacity:1;transform:scale(1)}.t-week{display:flex;align-items:center;height:1.875rem;width:20.75rem;max-width:100%;margin:0 auto;font-size:.75rem}:host._ios .t-week{width:22.625rem;font-size:.6875rem;font-weight:500;color:var(--tui-text-02)}.t-day{flex:1;text-align:center}.t-months{scrollbar-width:none;-ms-overflow-style:none;height:calc(100% - 9.5rem);box-shadow:0 -1px var(--tui-base-03);overflow-x:hidden}.t-months::-webkit-scrollbar,.t-months::-webkit-scrollbar-thumb{background:transparent;width:0;height:0}:host._ios .t-months{height:calc(100% - 8.75rem)}.t-month-wrapper{margin:.625rem 0 -.625rem}.t-month{height:2.75rem;line-height:2.75rem;padding-left:1rem;font-size:.875rem;font-weight:500;text-transform:uppercase;margin:0 0 1.25rem;box-sizing:border-box;border-bottom:.5px solid var(--tui-base-03)}:host._ios .t-month{height:3.125rem;margin:0;border-bottom:none;text-transform:none;font-size:1.375rem;line-height:3.125rem;letter-spacing:.02rem;font-weight:700}.t-calendar{margin:0 auto;font-family:inherit;font-size:1.125rem;transition:opacity .2s}:host._ios .t-calendar{font-size:1.0625rem}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: undefined, decorators: [{
+                        type: Inject,
+                        args: [TUI_IS_IOS]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [TUI_IS_E2E]
+                    }] }, { type: Document, decorators: [{
+                        type: Inject,
+                        args: [DOCUMENT]
+                    }] }, { type: i7.TuiDestroyService, decorators: [{
+                        type: Self
+                    }, {
+                        type: Inject,
+                        args: [TuiDestroyService]
+                    }] }, { type: i8.Observable, decorators: [{
+                        type: Inject,
+                        args: [TUI_VALUE_STREAM]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [TUI_COMMON_ICONS]
+                    }] }, { type: i8.Observable, decorators: [{
+                        type: Inject,
+                        args: [TUI_CLOSE_WORD]
+                    }] }, { type: i8.Observable, decorators: [{
+                        type: Inject,
+                        args: [TUI_CANCEL_WORD]
+                    }] }, { type: i8.Observable, decorators: [{
+                        type: Inject,
+                        args: [TUI_DONE_WORD]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [TUI_SHORT_WEEK_DAYS]
+                    }] }, { type: i8.Observable, decorators: [{
+                        type: Inject,
+                        args: [TUI_CHOOSE_DAY_OR_RANGE_TEXTS]
+                    }] }, { type: undefined, decorators: [{
+                        type: Inject,
+                        args: [TUI_ANIMATIONS_DURATION]
+                    }] }, { type: i0.NgZone, decorators: [{
+                        type: Inject,
+                        args: [NgZone]
+                    }] }];
+    }, propDecorators: { yearsScrollRef: [{
+                type: ViewChild,
+                args: ['yearsScrollRef']
+            }], monthsScrollRef: [{
+                type: ViewChild,
+                args: ['monthsScrollRef']
+            }], single: [{
+                type: Input
+            }], multi: [{
+                type: Input
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], disabledItemHandler: [{
+                type: Input
+            }], cancel: [{
+                type: Output
+            }], confirm: [{
+                type: Output
+            }] } });
+
+class TuiMobileCalendarModule {
+}
+TuiMobileCalendarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TuiMobileCalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarModule, declarations: [TuiMobileCalendarComponent], imports: [CommonModule,
+        ScrollingModule,
+        TuiTouchableModule,
+        TuiRippleModule,
+        TuiMapperPipeModule,
+        TuiLinkModule,
+        TuiPrimitiveCalendarMobileModule,
+        TuiButtonModule,
+        TuiMonthPipeModule,
+        TuiOrderWeekDaysPipeModule], exports: [TuiMobileCalendarComponent] });
+TuiMobileCalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarModule, imports: [CommonModule,
+        ScrollingModule,
+        TuiTouchableModule,
+        TuiRippleModule,
+        TuiMapperPipeModule,
+        TuiLinkModule,
+        TuiPrimitiveCalendarMobileModule,
+        TuiButtonModule,
+        TuiMonthPipeModule,
+        TuiOrderWeekDaysPipeModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TuiMobileCalendarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        ScrollingModule,
+                        TuiTouchableModule,
+                        TuiRippleModule,
+                        TuiMapperPipeModule,
+                        TuiLinkModule,
+                        TuiPrimitiveCalendarMobileModule,
+                        TuiButtonModule,
+                        TuiMonthPipeModule,
+                        TuiOrderWeekDaysPipeModule,
+                    ],
+                    declarations: [TuiMobileCalendarComponent],
+                    exports: [TuiMobileCalendarComponent],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ANDROID_CYCLE, ANDROID_LABEL, ANDROID_WEEK, BUFFER, IOS_CYCLE, IOS_LABEL, IOS_WEEK, RANGE, SCROLL_DEBOUNCE_TIME, STARTING_YEAR, TUI_MOBILE_CALENDAR_PROVIDERS, TUI_VALUE_STREAM, TuiMobileCalendarComponent, TuiMobileCalendarModule, TuiMobileCalendarStrategy, YEARLY_CYCLE, YEARS_IN_ROW };
+//# sourceMappingURL=taiga-ui-addon-mobile-components-mobile-calendar.mjs.map