@wkly/datetime-picker 12.1.0 → 13.1.0

package/fesm2015/wkly-datetime-picker.js

@@ -1,1720 +0,0 @@
-import * as i0 from '@angular/core';
-import { InjectionToken, EventEmitter, Directive, Input, Output, Component, forwardRef, Inject, LOCALE_ID, PLATFORM_ID, ElementRef, ChangeDetectorRef, ViewChild, Injectable, ComponentFactoryResolver, Injector, ApplicationRef, HostListener, NgModule } from '@angular/core';
-import * as i1 from '@angular/common';
-import { isPlatformBrowser, getLocaleFirstDayOfWeek, DOCUMENT, CommonModule } from '@angular/common';
-import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
-import { integer, createWeekGenerator, absoluteWeekOf, firstEpochDayOf, floorMod } from '@wkly/core';
-import { WklyGregorianCalendarAdapter, resolveWeekOffset, error, validateSelection, decodeIso, normalizeDigits } from '@wkly/adapters';
-import { DEFAULT_OVERSCAN_WEEKS, WklyPickerInputsPropertyKeys, WklyPickerOutputsPropertyKeys, coerceBoolean, resolveWklyTranslation, validateDrafts, draftDayDifference, setDraftDayDifference, calendarMonthBounds, createWeekRows, INPUT_NAMES } from '@wkly/presentation';
-export * from '@wkly/presentation';
-
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9;
-const WKLY_CLOCK = new InjectionToken("WKLY_CLOCK", {
-    providedIn: "root",
-    factory: () => ({ now: () => new Date() }),
-});
-const WKLY_CONFIG = new InjectionToken("WKLY_CONFIG", { providedIn: "root", factory: () => ({}) });
-const WKLY_LOCALIZATION = new InjectionToken("WKLY_LOCALIZATION", { providedIn: "root", factory: () => ({}) });
-const WKLY_TRANSLATIONS = new InjectionToken("WKLY_TRANSLATIONS", { providedIn: "root", factory: () => ({}) });
-/** Shared public inputs/outputs inherited by the picker and both trigger directives. */
-// Inherited inputs need literal names in published decorator metadata.
-class WklyPickerInputs {
-    constructor() {
-        this[_a] = "datetime";
-        this[_b] = null;
-        this[_d] = "";
-        this[_e] = null;
-        this[_f] = {
-            kind: "full-month",
-        };
-        this[_g] = "locale";
-        this[_h] = false;
-        this[_j] = 1;
-        this[_k] = 1;
-        this[_l] = null;
-        this[_m] = null;
-        this[_o] = null;
-        this[_p] = null;
-        this[_q] = null;
-        this[_r] = false;
-        this[_s] = false;
-        this[_t] = false;
-        this[_u] = "locale";
-        this[_v] = null;
-        this[_w] = 256;
-        this[_x] = DEFAULT_OVERSCAN_WEEKS;
-        this[_y] = null;
-        this[_z] = null;
-        this[_0] = null;
-        this[_1] = true;
-        this[_2] = [];
-        this[_3] = null;
-        this[_4] = new EventEmitter();
-        this[_5] = new EventEmitter(true);
-        this[_6] = new EventEmitter();
-        this[_7] = new EventEmitter();
-        this[_8] = new EventEmitter(true);
-        this[_9] = new EventEmitter();
-    }
-}
-_a = WklyPickerInputsPropertyKeys.Mode, _b = WklyPickerInputsPropertyKeys.Value, _c = WklyPickerInputsPropertyKeys.CalendarAdapter, _d = WklyPickerInputsPropertyKeys.Locale, _e = WklyPickerInputsPropertyKeys.WeekOffset, _f = WklyPickerInputsPropertyKeys.ViewportPreset, _g = WklyPickerInputsPropertyKeys.HourCycle, _h = WklyPickerInputsPropertyKeys.ShowSeconds, _j = WklyPickerInputsPropertyKeys.MinuteStep, _k = WklyPickerInputsPropertyKeys.SecondStep, _l = WklyPickerInputsPropertyKeys.Min, _m = WklyPickerInputsPropertyKeys.Max, _o = WklyPickerInputsPropertyKeys.IsDateDisabled, _p = WklyPickerInputsPropertyKeys.IsTimeDisabled, _q = WklyPickerInputsPropertyKeys.RangeValidator, _r = WklyPickerInputsPropertyKeys.AllowRangeAcrossDisabled, _s = WklyPickerInputsPropertyKeys.Required, _t = WklyPickerInputsPropertyKeys.Disabled, _u = WklyPickerInputsPropertyKeys.WeekLabelMode, _v = WklyPickerInputsPropertyKeys.WeekLabelFormatter, _w = WklyPickerInputsPropertyKeys.WeekCacheSize, _x = WklyPickerInputsPropertyKeys.OverscanWeeks, _y = WklyPickerInputsPropertyKeys.AriaLabel, _z = WklyPickerInputsPropertyKeys.AriaDescribedBy, _0 = WklyPickerInputsPropertyKeys.InitialEpochDay, _1 = WklyPickerInputsPropertyKeys.CloseOnBackdrop, _2 = WklyPickerInputsPropertyKeys.Validators, _3 = WklyPickerInputsPropertyKeys.Translations, _4 = WklyPickerOutputsPropertyKeys.ValueChange, _5 = WklyPickerOutputsPropertyKeys.ValidationChange, _6 = WklyPickerOutputsPropertyKeys.Opened, _7 = WklyPickerOutputsPropertyKeys.Closed, _8 = WklyPickerOutputsPropertyKeys.ViewportChange, _9 = WklyPickerOutputsPropertyKeys.ViewModeChange;
-WklyPickerInputs.decorators = [
-    { type: Directive, args: [{
-                inputs: [
-                    "mode",
-                    "value",
-                    "calendarAdapter",
-                    "locale",
-                    "weekOffset",
-                    "viewportPreset",
-                    "hourCycle",
-                    "showSeconds",
-                    "minuteStep",
-                    "secondStep",
-                    "min",
-                    "max",
-                    "isDateDisabled",
-                    "isTimeDisabled",
-                    "rangeValidator",
-                    "allowRangeAcrossDisabled",
-                    "required",
-                    "disabled",
-                    "weekLabelMode",
-                    "weekLabelFormatter",
-                    "weekCacheSize",
-                    "overscanWeeks",
-                    "ariaLabel",
-                    "ariaDescribedBy",
-                    "initialEpochDay",
-                    "closeOnBackdrop",
-                    "validators",
-                    "translations",
-                ],
-                outputs: [
-                    "valueChange",
-                    "validationChange",
-                    "opened",
-                    "closed",
-                    "viewportChange",
-                    "viewModeChange",
-                ],
-            },] }
-];
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], WklyPickerInputs.prototype, _a, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _b, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _c, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], WklyPickerInputs.prototype, _d, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _e, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _f, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], WklyPickerInputs.prototype, _g, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Boolean)
-], WklyPickerInputs.prototype, _h, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], WklyPickerInputs.prototype, _j, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Number)
-], WklyPickerInputs.prototype, _k, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _l, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _m, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _o, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _p, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _q, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _r, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _s, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _t, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", String)
-], WklyPickerInputs.prototype, _u, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _v, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _w, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _x, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _y, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _z, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _0, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _1, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Array)
-], WklyPickerInputs.prototype, _2, void 0);
-__decorate([
-    Input(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _3, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _4, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _5, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _6, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _7, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _8, void 0);
-__decorate([
-    Output(),
-    __metadata("design:type", Object)
-], WklyPickerInputs.prototype, _9, void 0);
-
-class WklyDateTimePickerComponent extends WklyPickerInputs {
-    constructor(defaultLocale, defaults, clock, strings, defaultTranslations, platform, host, changeDetector) {
-        super();
-        this.defaultLocale = defaultLocale;
-        this.defaults = defaults;
-        this.clock = clock;
-        this.strings = strings;
-        this.defaultTranslations = defaultTranslations;
-        this.host = host;
-        this.changeDetector = changeDetector;
-        this.presentation = "inline";
-        this.viewMode = "calendar";
-        this.endView = "date";
-        this.effectiveLocale = "en-US";
-        this.effectiveOffset = 0;
-        this.effectiveHourCycle = "h24";
-        this.direction = "ltr";
-        this.rows = [];
-        this.weekdays = [];
-        this.drafts = [];
-        this.errors = [];
-        this.today = 0;
-        this.focused = 0;
-        this.anchorWeek = 0;
-        this.firstWeek = 0;
-        this.visibleCount = 6;
-        this.rowHeight = 76;
-        this.scrollHeight = 152076;
-        this.paddingTop = 0;
-        this.initialized = false;
-        this.compact = false;
-        this.WklyPickerInputsPropertyKeys = WklyPickerInputsPropertyKeys;
-        this.baseWeek = 0;
-        this.firstSupportedDay = 0;
-        this.lastSupportedDay = 0;
-        this.firstSupportedWeek = 0;
-        this.lastSupportedWeek = 0;
-        this.initialMonth = "";
-        this.clipMonth = false;
-        this.browser = false;
-        this.destroyed = false;
-        this.snapPending = false;
-        this.onChange = () => { };
-        this.onTouched = () => { };
-        this.validatorChanged = () => { };
-        this.configErrors = [];
-        this.pendingValue = null;
-        this.emittedValue = null;
-        this.manualDateEndpoint = 0;
-        this.browser = isPlatformBrowser(platform);
-    }
-    ngOnInit() {
-        this.initialize();
-    }
-    ngOnChanges(changes) {
-        if (this.initialized) {
-            if (Object.keys(changes).length === 1 &&
-                changes[WklyPickerInputsPropertyKeys.Value] &&
-                this.emittedValue ===
-                    JSON.stringify(this[WklyPickerInputsPropertyKeys.Value])) {
-                this.emittedValue = null;
-                return;
-            }
-            const focus = this.focused;
-            this.configure();
-            if (changes[WklyPickerInputsPropertyKeys.Value] ||
-                changes[WklyPickerInputsPropertyKeys.Mode] ||
-                changes[WklyPickerInputsPropertyKeys.CalendarAdapter]) {
-                this.load(this[WklyPickerInputsPropertyKeys.Value]);
-                this.position(this.focused, true);
-            }
-            else {
-                this.check();
-                if (changes[WklyPickerInputsPropertyKeys.ViewportPreset])
-                    this.position(focus, true);
-                else
-                    this.scrollToEpochDay(focus);
-            }
-        }
-    }
-    initialize() {
-        if (this.initialized)
-            return;
-        this.configure();
-        const initialEpochDay = this[WklyPickerInputsPropertyKeys.InitialEpochDay];
-        this.today = this.browser
-            ? Math.floor(this.clock.now().getTime() / 86400000)
-            : initialEpochDay === null
-                ? 0
-                : initialEpochDay;
-        this.focused =
-            initialEpochDay === null
-                ? this.defaults.initialEpochDay === undefined
-                    ? this.today
-                    : this.defaults.initialEpochDay
-                : initialEpochDay;
-        this.load(this[WklyPickerInputsPropertyKeys.Value]);
-        this.initialized = true;
-        this.position(this.focused, true);
-    }
-    configure() {
-        this.configErrors = [];
-        [
-            WklyPickerInputsPropertyKeys.ShowSeconds,
-            WklyPickerInputsPropertyKeys.AllowRangeAcrossDisabled,
-            WklyPickerInputsPropertyKeys.Required,
-            WklyPickerInputsPropertyKeys.Disabled,
-            WklyPickerInputsPropertyKeys.CloseOnBackdrop,
-        ].forEach((key) => (this[key] = coerceBoolean(this[key])));
-        this.effectiveLocale =
-            this[WklyPickerInputsPropertyKeys.Locale] ||
-                this.defaults.locale ||
-                this.defaultLocale;
-        this.direction = /^(ar|he|fa|ur)(-|$)/.test(this.effectiveLocale)
-            ? "rtl"
-            : "ltr";
-        this.adapter =
-            this[WklyPickerInputsPropertyKeys.CalendarAdapter] ||
-                new WklyGregorianCalendarAdapter(this.effectiveLocale);
-        try {
-            let firstDay;
-            try {
-                firstDay = getLocaleFirstDayOfWeek(this.effectiveLocale);
-            }
-            catch (_) { }
-            this.effectiveOffset = resolveWeekOffset(this.effectiveLocale, this[WklyPickerInputsPropertyKeys.WeekOffset], this.defaults.weekOffset, firstDay);
-            integer(this[WklyPickerInputsPropertyKeys.WeekCacheSize]);
-            integer(this[WklyPickerInputsPropertyKeys.OverscanWeeks]);
-            if (this[WklyPickerInputsPropertyKeys.WeekCacheSize] < 0 ||
-                this[WklyPickerInputsPropertyKeys.OverscanWeeks] < 0 ||
-                this[WklyPickerInputsPropertyKeys.OverscanWeeks] > 50)
-                throw new RangeError();
-            if (![
-                "datetime",
-                "date",
-                "time",
-                "datetime-range",
-                "date-range",
-                "time-range",
-            ].includes(this[WklyPickerInputsPropertyKeys.Mode]))
-                throw new RangeError();
-            const preset = this[WklyPickerInputsPropertyKeys.ViewportPreset];
-            if (preset.kind === "weeks") {
-                integer(preset.visibleWeekCount);
-                if (preset.visibleWeekCount < 1 || preset.visibleWeekCount > 52)
-                    throw new RangeError();
-            }
-            if (preset.kind === "full-month-and-around")
-                for (const n of [
-                    preset.extraWeeksBefore || 0,
-                    preset.extraWeeksAfter || 0,
-                ]) {
-                    integer(n);
-                    if (n < 0 || n > 52)
-                        throw new RangeError();
-                }
-            this.generator = createWeekGenerator({
-                weekOffset: this.effectiveOffset,
-                cacheSize: this[WklyPickerInputsPropertyKeys.WeekCacheSize],
-            });
-        }
-        catch (_) {
-            this.configErrors.push(error("configuration-error", this[WklyPickerInputsPropertyKeys.WeekOffset]));
-            this.generator = createWeekGenerator();
-            this.effectiveOffset = 0;
-        }
-        this.setSupportedScrollRange();
-        const hourCycle = this[WklyPickerInputsPropertyKeys.HourCycle];
-        // Host value/configuration feedback must retain the user's switchable format.
-        if (hourCycle !== "switchable" || this.configuredHourCycle !== hourCycle) {
-            this.effectiveHourCycle =
-                hourCycle === "h12"
-                    ? "h12"
-                    : hourCycle === "locale"
-                        ? new Intl.DateTimeFormat(this.effectiveLocale, {
-                            hour: "numeric",
-                            timeZone: "UTC",
-                        }).resolvedOptions().hour12
-                            ? "h12"
-                            : "h24"
-                        : "h24";
-        }
-        this.configuredHourCycle = hourCycle;
-        this.weekdays = Array.from({ length: 7 }, (_, i) => this.adapter.formatWeekday(this.effectiveOffset + i, "short"));
-    }
-    setSupportedScrollRange() {
-        let [first, last] = this.adapter.supportedEpochDayRange;
-        const [firstYear, lastYear] = this.adapter.supportedYearRange;
-        const yearOf = (day) => this.adapter.epochDayToDate(day).year;
-        if (yearOf(first) < firstYear) {
-            let low = first, high = last;
-            while (low < high) {
-                const mid = Math.floor((low + high) / 2);
-                if (yearOf(mid) < firstYear)
-                    low = mid + 1;
-                else
-                    high = mid;
-            }
-            first = low;
-        }
-        if (yearOf(last) > lastYear) {
-            let low = first, high = last;
-            while (low < high) {
-                const mid = Math.ceil((low + high) / 2);
-                if (yearOf(mid) > lastYear)
-                    high = mid - 1;
-                else
-                    low = mid;
-            }
-            last = low;
-        }
-        if (first > last ||
-            yearOf(first) < firstYear ||
-            yearOf(first) > lastYear ||
-            yearOf(last) < firstYear ||
-            yearOf(last) > lastYear)
-            throw new RangeError("No supported days within the calendar year range");
-        this.firstSupportedDay = first;
-        this.lastSupportedDay = last;
-        this.firstSupportedWeek = absoluteWeekOf(first, this.effectiveOffset);
-        this.lastSupportedWeek = absoluteWeekOf(last, this.effectiveOffset);
-    }
-    clampFirstWeek(week) {
-        // Keep supported weeks inside the viewport; renderRows adds the buffer rows.
-        const last = Math.max(this.firstSupportedWeek, this.lastSupportedWeek - this.visibleCount + 1);
-        return Math.max(this.firstSupportedWeek, Math.min(last, week));
-    }
-    ngAfterViewInit() {
-        this.resetScroll();
-        if (this.browser && typeof ResizeObserver !== "undefined") {
-            this.observer = new ResizeObserver(() => {
-                this.compact = this.host.nativeElement.clientWidth < 338;
-                const row = this.host.nativeElement.querySelector(".week-row");
-                // CSS heights and scrollTop use layout pixels; client rectangles include zoom.
-                const height = row ? parseFloat(getComputedStyle(row).height) : 0;
-                if (height && height !== this.rowHeight) {
-                    this.rowHeight = height;
-                    this.scrollHeight = this.rowHeight * 2001;
-                    this.renderRows();
-                    this.resetScroll();
-                }
-            });
-            this.observer.observe(this.host.nativeElement);
-        }
-    }
-    ngOnDestroy() {
-        this.destroyed = true;
-        if (this.observer)
-            this.observer.disconnect();
-        if (this.scrollEndTimer)
-            clearTimeout(this.scrollEndTimer);
-        if (this.generator)
-            this.generator.clearCache();
-    }
-    t(key) {
-        return resolveWklyTranslation(key, this.effectiveLocale, this[WklyPickerInputsPropertyKeys.Translations] ||
-            this.defaultTranslations, this.strings);
-    }
-    get isRange() {
-        return this[WklyPickerInputsPropertyKeys.Mode].endsWith("-range");
-    }
-    get hasDate() {
-        return !this[WklyPickerInputsPropertyKeys.Mode].startsWith("time");
-    }
-    get hasTime() {
-        return (this[WklyPickerInputsPropertyKeys.Mode] !== "date" &&
-            this[WklyPickerInputsPropertyKeys.Mode] !== "date-range");
-    }
-    get submitVisible() {
-        return (this.presentation === "transient" &&
-            (this[WklyPickerInputsPropertyKeys.Mode] !== "date" ||
-                this.viewMode === "manual"));
-    }
-    get title() {
-        try {
-            const d = this.adapter.epochDayToDate(Math.max(this.firstSupportedDay, Math.min(this.lastSupportedDay, firstEpochDayOf(this.anchorWeek, this.effectiveOffset))));
-            return this.adapter.formatMonth(d) + " " + this.adapter.formatYear(d);
-        }
-        catch (_) {
-            return "";
-        }
-    }
-    get canSubmit() {
-        return (!this[WklyPickerInputsPropertyKeys.Disabled] &&
-            !this.errors.length &&
-            this.pendingValue !== null);
-    }
-    blank(day) {
-        const safe = Math.max(this.firstSupportedDay, Math.min(this.lastSupportedDay, day));
-        return {
-            date: this.adapter.epochDayToDate(safe),
-            hour: 0,
-            minute: 0,
-            second: 0,
-            present: false,
-        };
-    }
-    load(value) {
-        this.drafts = [this.blank(this.focused), this.blank(this.focused)];
-        const validation = validateSelection(value, this, this.adapter);
-        if (value !== null && !validation.length) {
-            const values = typeof value === "string" ? [value] : value;
-            values.forEach((v, i) => {
-                const d = decodeIso(v);
-                this.drafts[i] = {
-                    date: this.hasDate
-                        ? this.adapter.epochDayToDate(d.epochDay)
-                        : this.blank(this.today).date,
-                    hour: d.hour,
-                    minute: d.minute,
-                    second: d.second,
-                    present: true,
-                };
-                if (i === 0 && this.hasDate)
-                    this.focused = d.epochDay;
-            });
-        }
-        if (validation.length) {
-            this.pendingValue = null;
-            this.report(validation);
-        }
-        else
-            this.check();
-    }
-    writeValue(value) {
-        this[WklyPickerInputsPropertyKeys.Value] = value;
-        if (this.initialized) {
-            this.load(value);
-            this.position(this.focused, true);
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(disabled) {
-        this[WklyPickerInputsPropertyKeys.Disabled] = disabled;
-    }
-    validate(_control) {
-        return this.errors.length ? { wkly: this.errors } : null;
-    }
-    registerOnValidatorChange(fn) {
-        this.validatorChanged = fn;
-    }
-    touched() {
-        Promise.resolve().then(() => this.onTouched());
-    }
-    report(errors) {
-        const changed = JSON.stringify(this.errors) !== JSON.stringify(errors);
-        this.errors = errors;
-        if (changed) {
-            this[WklyPickerOutputsPropertyKeys.ValidationChange].emit(errors);
-            this.validatorChanged();
-        }
-    }
-    check() {
-        const result = validateDrafts({
-            drafts: this.drafts,
-            configErrors: this.configErrors,
-            adapter: this.adapter,
-            selection: this,
-            mode: this[WklyPickerInputsPropertyKeys.Mode],
-            isRange: this.isRange,
-            hasDate: this.hasDate,
-            hasTime: this.hasTime,
-            showSeconds: this[WklyPickerInputsPropertyKeys.ShowSeconds],
-            required: this[WklyPickerInputsPropertyKeys.Required],
-        });
-        this.pendingValue = result.pendingValue;
-        this.report(result.errors);
-    }
-    trackDraft(index) {
-        // Endpoint controls keep their identity and focus when draft objects swap.
-        return index;
-    }
-    orderDrafts() {
-        if (!this.isRange || !this.drafts.every((draft) => draft.present))
-            return;
-        if (this.drafts.some((draft) => draft.unsupportedEpochDay !== undefined))
-            return;
-        try {
-            const a = this.drafts[0], b = this.drafts[1];
-            const key = (d) => this.adapter.dateToEpochDay(d.date) * 86400 +
-                (d.hour || 0) * 3600 +
-                (d.minute || 0) * 60 +
-                (d.second || 0);
-            if (key(a) > key(b))
-                this.drafts = [b, a];
-        }
-        catch (_) {
-            // Impossible or incomplete dates remain editable until corrected.
-        }
-    }
-    finish() {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        this.orderDrafts();
-        if (this.viewMode === "manual" && this.hasDate)
-            this.positionOnManualDate();
-        this.check();
-        if (this.presentation === "inline" && this.canSubmit)
-            this.commit();
-    }
-    commit() {
-        if (!this.canSubmit)
-            return;
-        const next = this.pendingValue;
-        if (JSON.stringify(next) !==
-            JSON.stringify(this[WklyPickerInputsPropertyKeys.Value])) {
-            this[WklyPickerInputsPropertyKeys.Value] = next;
-            this.emittedValue = JSON.stringify(next);
-            this.onChange(next);
-            this[WklyPickerOutputsPropertyKeys.ValueChange].emit(next);
-        }
-        this.onTouched();
-    }
-    submit(reason = "submit") {
-        this.check();
-        if (!this.canSubmit)
-            return;
-        this.commit();
-        if (this.presentation === "transient")
-            this[WklyPickerOutputsPropertyKeys.Closed].emit(reason);
-    }
-    cancel(reason = "close-button") {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        this.load(this[WklyPickerInputsPropertyKeys.Value]);
-        this.onTouched();
-        this[WklyPickerOutputsPropertyKeys.Closed].emit(reason);
-    }
-    now() {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        const n = this.clock.now();
-        const day = Math.floor(n.getTime() / 86400000);
-        this.drafts = [0, 1].map((index) => (Object.assign(Object.assign({}, this.clockDraft(day, n)), { present: index === 0 || this.isRange })));
-        if (this.hasDate &&
-            (day < this.firstSupportedDay || day > this.lastSupportedDay)) {
-            this.report([error("unsupported-adapter-date", day)]);
-            return;
-        }
-        this.focused = day;
-        this.position(day, true);
-        this.check();
-        this.submit("now");
-    }
-    clockDraft(day, now) {
-        return Object.assign(Object.assign({}, this.blank(day)), { hour: now.getUTCHours(), minute: Math.floor(now.getUTCMinutes() / this[WklyPickerInputsPropertyKeys.MinuteStep]) * this[WklyPickerInputsPropertyKeys.MinuteStep], second: this[WklyPickerInputsPropertyKeys.ShowSeconds]
-                ? Math.floor(now.getUTCSeconds() / this[WklyPickerInputsPropertyKeys.SecondStep]) * this[WklyPickerInputsPropertyKeys.SecondStep]
-                : 0 });
-    }
-    initializeManualRange() {
-        if (!this.isRange ||
-            !this.hasDate ||
-            this.drafts.every((draft) => draft.present))
-            return;
-        let seed = this.drafts.find((draft) => draft.present);
-        if (!seed) {
-            if (this[WklyPickerInputsPropertyKeys.Value] !== null)
-                return;
-            const now = this.clock.now();
-            const initialEpochDay = this[WklyPickerInputsPropertyKeys.InitialEpochDay];
-            const day = initialEpochDay === null
-                ? this.defaults.initialEpochDay === undefined
-                    ? Math.floor(now.getTime() / 86400000)
-                    : this.defaults.initialEpochDay
-                : initialEpochDay;
-            seed = Object.assign(Object.assign({}, this.clockDraft(day, now)), { present: true });
-        }
-        // Complete missing endpoints without replacing selected or invalid drafts.
-        const initial = seed;
-        this.drafts = this.drafts.map((draft) => draft.present ? draft : Object.assign(Object.assign({}, initial), { date: Object.assign({}, initial.date) }));
-        this.finish();
-        // Positioning renders before validation; refresh completion controls afterward.
-        this.changeDetector.markForCheck();
-    }
-    toggleView() {
-        if (this[WklyPickerInputsPropertyKeys.Disabled] || !this.hasDate)
-            return;
-        this.viewMode = this.viewMode === "calendar" ? "manual" : "calendar";
-        if (this.viewMode === "manual")
-            this.initializeManualRange();
-        if (this.viewMode === "calendar")
-            this.positionOnManualDate();
-        this[WklyPickerOutputsPropertyKeys.ViewModeChange].emit(this.viewMode);
-        if (this.viewMode === "calendar")
-            setTimeout(() => this.resetScroll());
-    }
-    positionOnManualDate() {
-        const draft = this.drafts[this.manualDateEndpoint];
-        if (!draft || !draft.present)
-            return;
-        try {
-            // A valid day follows the selection. An impossible day keeps its draft
-            // fields but still shows the chosen month in the calendar.
-            const target = this.adapter.dateToEpochDay(draft.date);
-            this.focused = target;
-            this.position(target, true);
-        }
-        catch (_) {
-            try {
-                const first = this.adapter.dateToEpochDay(Object.assign(Object.assign({}, draft.date), { day: 1 }));
-                this.focused = first;
-                this.position(first, true);
-            }
-            catch (_) { }
-        }
-    }
-    months(draft) {
-        try {
-            return this.adapter.getMonths(draft.date.year).map((m) => m.label);
-        }
-        catch (_) {
-            return [];
-        }
-    }
-    monthCount(draft) {
-        return this.months(draft).length || 12;
-    }
-    get inDays() {
-        return draftDayDifference(this.drafts, this.adapter);
-    }
-    get inDaysLabel() {
-        const days = this.inDays;
-        return this.t("inDays").replace(/{{\s*days\s*}}/g, days === null
-            ? this.t("daysUnavailable")
-            : new Intl.NumberFormat(this.effectiveLocale, {
-                useGrouping: false,
-            }).format(days));
-    }
-    get resultingEndDate() {
-        try {
-            const draft = this.drafts[1];
-            if (draft.unsupportedEpochDay !== undefined ||
-                this.adapter.validateDate(draft.date).length)
-                return "";
-            return [
-                this.adapter.formatDay(draft.date),
-                this.adapter.formatMonth(draft.date),
-                this.adapter.formatYear(draft.date),
-            ].join(" ");
-        }
-        catch (_) {
-            return "";
-        }
-    }
-    toggleEndView(view) {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        this.endView = view;
-    }
-    days(value) {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        this.manualDateEndpoint = 1;
-        setDraftDayDifference(this.drafts, this.adapter, value);
-        this.check();
-    }
-    field(index, field, value) {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        const draft = this.drafts[index];
-        draft.present = true;
-        if (field === "day" || field === "year" || field === "month") {
-            this.manualDateEndpoint = index;
-            delete draft.unsupportedEpochDay;
-            let date = Object.assign(Object.assign({}, draft.date), { [field]: value });
-            if (field === "month") {
-                let month;
-                try {
-                    month = this.adapter
-                        .getMonths(date.year)
-                        .find((m) => m.month === value);
-                }
-                catch (_) { }
-                date = Object.assign(Object.assign({}, date), { monthCode: month ? month.monthCode : "" });
-            }
-            if (field === "year" && value !== null) {
-                try {
-                    const months = this.adapter.getMonths(value);
-                    const month = months.find((m) => m.monthCode === date.monthCode);
-                    if (month)
-                        date = Object.assign(Object.assign({}, date), { month: month.month });
-                }
-                catch (_) { }
-            }
-            draft.date = date;
-        }
-        else if (field === "hour" && this.effectiveHourCycle === "h12")
-            draft.hour =
-                value === null
-                    ? null
-                    : value >= 1 && value <= 12
-                        ? (value % 12) + ((draft.hour || 0) >= 12 ? 12 : 0)
-                        : 24 + value;
-        else
-            draft[field] = value;
-        this.check();
-    }
-    displayHour(draft) {
-        return draft.hour === null
-            ? null
-            : this.effectiveHourCycle === "h12"
-                ? draft.hour % 12 || 12
-                : draft.hour;
-    }
-    period(index, period) {
-        if (this[WklyPickerInputsPropertyKeys.Disabled])
-            return;
-        if (period === "24")
-            this.effectiveHourCycle = "h24";
-        else {
-            this.effectiveHourCycle = "h12";
-            this.drafts[index].hour =
-                ((this.drafts[index].hour || 0) % 12) + (period === "pm" ? 12 : 0);
-            this.drafts[index].present = true;
-            this.finish();
-        }
-    }
-    selected(day) {
-        return this.drafts.some((d) => {
-            try {
-                return d.present && this.adapter.dateToEpochDay(d.date) === day;
-            }
-            catch (_) {
-                return false;
-            }
-        });
-    }
-    inRange(day) {
-        if (!this.isRange || !this.drafts.every((d) => d.present))
-            return false;
-        try {
-            const a = this.adapter.dateToEpochDay(this.drafts[0].date), b = this.adapter.dateToEpochDay(this.drafts[1].date);
-            return day > Math.min(a, b) && day < Math.max(a, b);
-        }
-        catch (_) {
-            return false;
-        }
-    }
-    dayDisabled(day) {
-        var _a, _b;
-        if (day < this.firstSupportedDay || day > this.lastSupportedDay)
-            return true;
-        try {
-            const date = this.adapter.epochDayToDate(day);
-            const isDateDisabled = this[WklyPickerInputsPropertyKeys.IsDateDisabled];
-            if (isDateDisabled &&
-                isDateDisabled(day, {
-                    mode: this[WklyPickerInputsPropertyKeys.Mode],
-                    endpoint: this.isRange
-                        ? ((_a = this.drafts[0]) === null || _a === void 0 ? void 0 : _a.present) && !((_b = this.drafts[1]) === null || _b === void 0 ? void 0 : _b.present)
-                            ? "end"
-                            : "start"
-                        : "single",
-                    calendarDate: date,
-                }))
-                return true;
-            const min = this[WklyPickerInputsPropertyKeys.Min];
-            const max = this[WklyPickerInputsPropertyKeys.Max];
-            if (min && day < decodeIso(min).epochDay)
-                return true;
-            if (max && day > decodeIso(max).epochDay)
-                return true;
-            return false;
-        }
-        catch (_) {
-            return true;
-        }
-    }
-    select(day) {
-        if (this[WklyPickerInputsPropertyKeys.Disabled] || this.dayDisabled(day))
-            return;
-        this.focused = day;
-        const index = this.isRange && this.drafts[0].present && !this.drafts[1].present ? 1 : 0;
-        if (this.isRange && index === 0)
-            this.drafts[1].present = false;
-        delete this.drafts[index].unsupportedEpochDay;
-        this.drafts[index].date = this.adapter.epochDayToDate(day);
-        this.drafts[index].present = true;
-        this.orderDrafts();
-        this.renderRows();
-        this.finish();
-        if (this.presentation === "transient" &&
-            this[WklyPickerInputsPropertyKeys.Mode] === "date" &&
-            this.viewMode === "calendar")
-            this.submit("auto-submit");
-    }
-    key(event, day) {
-        let delta = 0;
-        if (event.key === "ArrowLeft")
-            delta = -1;
-        if (event.key === "ArrowRight")
-            delta = 1;
-        if (event.key === "ArrowUp")
-            delta = -7;
-        if (event.key === "ArrowDown")
-            delta = 7;
-        if (event.key === "PageUp")
-            delta = -7 * (event.shiftKey ? this.visibleCount : 1);
-        if (event.key === "PageDown")
-            delta = 7 * (event.shiftKey ? this.visibleCount : 1);
-        if (event.key === "Home") {
-            event.preventDefault();
-            this.scrollToEpochDay(this.today, { focus: true });
-        }
-        if (delta) {
-            event.preventDefault();
-            const target = day + delta;
-            if (target >= this.firstSupportedDay && target <= this.lastSupportedDay)
-                this.scrollToEpochDay(target, { focus: true });
-        }
-    }
-    position(day, preset = false, options = {}) {
-        day = Math.max(this.firstSupportedDay, Math.min(this.lastSupportedDay, day));
-        this.anchorWeek = absoluteWeekOf(day, this.effectiveOffset);
-        const viewportPreset = this[WklyPickerInputsPropertyKeys.ViewportPreset];
-        this.clipMonth = preset && viewportPreset.kind === "full-month";
-        if (preset && viewportPreset.kind !== "weeks") {
-            const d = this.adapter.epochDayToDate(day);
-            this.initialMonth = d.year + "/" + d.monthCode;
-            const [start, end] = calendarMonthBounds(this.adapter, day);
-            this.firstWeek = absoluteWeekOf(start, this.effectiveOffset);
-            this.visibleCount =
-                absoluteWeekOf(end, this.effectiveOffset) - this.firstWeek + 1;
-            if (viewportPreset.kind === "full-month-and-around" &&
-                !this.configErrors.length) {
-                const before = viewportPreset.extraWeeksBefore || 0, after = viewportPreset.extraWeeksAfter || 0;
-                this.firstWeek -= before;
-                this.visibleCount += before + after;
-            }
-        }
-        else {
-            if (viewportPreset.kind === "weeks")
-                this.visibleCount = this.configErrors.length
-                    ? 6
-                    : viewportPreset.visibleWeekCount;
-            this.firstWeek =
-                this.anchorWeek -
-                    (options.align === "start"
-                        ? 0
-                        : options.align === "end"
-                            ? this.visibleCount - 1
-                            : Math.floor(this.visibleCount / 2));
-        }
-        this.firstWeek = this.clampFirstWeek(this.firstWeek);
-        this.baseWeek = this.firstWeek - 1000;
-        this.renderRows();
-        // Apply the new runway before writing scrollTop or locating a focus target.
-        this.changeDetector.detectChanges();
-        this.resetScroll();
-    }
-    resetScroll() {
-        // Round week boundaries to avoid scrollTop truncation under CSS zoom.
-        if (this.scroller)
-            this.scroller.nativeElement.scrollTop = Math.round(1000 * this.rowHeight);
-    }
-    scroll(event) {
-        const element = event.target;
-        this.snapPending = true;
-        this.scheduleSnap();
-        // Quantize displacement around the reset point, equally in both directions.
-        const relativeRows = element.scrollTop / this.rowHeight - 1000;
-        const index = 1000 + Math.sign(relativeRows) * Math.round(Math.abs(relativeRows));
-        const requestedFirst = this.baseWeek + index;
-        const first = this.clampFirstWeek(requestedFirst);
-        if (requestedFirst !== first) {
-            element.scrollTop = Math.round((first - this.baseWeek) * this.rowHeight);
-        }
-        if (first === this.firstWeek)
-            return;
-        this.clipMonth = false;
-        this.firstWeek = first;
-        this.anchorWeek = first + Math.floor(this.visibleCount / 2);
-        if (index < 100 || index > 1900) {
-            // Preserve signed displacement from this week; modulo turns fractional
-            // rounding just below a boundary into almost a full row after rebasing.
-            const offset = element.scrollTop - (first - this.baseWeek) * this.rowHeight;
-            this.baseWeek = first - 1000;
-            element.scrollTop = Math.round(1000 * this.rowHeight + offset);
-        }
-        this.renderRows();
-    }
-    scheduleSnap() {
-        if (this.scrollEndTimer)
-            clearTimeout(this.scrollEndTimer);
-        this.scrollEndTimer = setTimeout(() => this.snapWeek(), 200);
-    }
-    snapWeek() {
-        if (this.scrollEndTimer)
-            clearTimeout(this.scrollEndTimer);
-        this.scrollEndTimer = undefined;
-        if (!this.snapPending || !this.scroller)
-            return;
-        this.snapPending = false;
-        // Align the current virtual week without rebuilding or rebasing its rows.
-        const element = this.scroller.nativeElement;
-        const target = Math.round((this.firstWeek - this.baseWeek) * this.rowHeight);
-        if (element.scrollTop !== target)
-            element.scrollTop = target;
-    }
-    showFirstWeek(week) {
-        const first = this.clampFirstWeek(week);
-        if (first === this.firstWeek)
-            return;
-        this.clipMonth = false;
-        this.firstWeek = first;
-        this.anchorWeek = first + Math.floor(this.visibleCount / 2);
-        this.baseWeek = first - 1000;
-        this.renderRows();
-        this.resetScroll();
-    }
-    canMoveWeek(delta) {
-        return this.clampFirstWeek(this.firstWeek + delta) !== this.firstWeek;
-    }
-    moveWeek(delta) {
-        if (!this[WklyPickerInputsPropertyKeys.Disabled])
-            this.showFirstWeek(this.firstWeek + delta);
-    }
-    renderRows() {
-        // Keep the virtual scroll offset here; row data is shared across Angular versions.
-        const overscan = Math.max(0, Math.min(50, this[WklyPickerInputsPropertyKeys.OverscanWeeks] || 0));
-        const start = this.firstWeek - overscan;
-        this.paddingTop = (start - this.baseWeek) * this.rowHeight;
-        this.rows = createWeekRows({
-            generator: this.generator,
-            adapter: this.adapter,
-            startWeek: start,
-            count: this.visibleCount + 2 * overscan,
-            firstVisibleWeek: this.firstWeek,
-            firstSupportedDay: this.firstSupportedDay,
-            lastSupportedDay: this.lastSupportedDay,
-            clipMonth: this.clipMonth,
-            initialMonth: this.initialMonth,
-            weekLabelMode: this[WklyPickerInputsPropertyKeys.WeekLabelMode],
-            weekLabelFormatter: this[WklyPickerInputsPropertyKeys.WeekLabelFormatter] || null,
-            isDayDisabled: (day) => this.dayDisabled(day),
-        });
-        this[WklyPickerOutputsPropertyKeys.ViewportChange].emit({
-            firstVisibleAbsoluteWeek: this.firstWeek,
-            lastVisibleAbsoluteWeek: this.firstWeek + this.visibleCount - 1,
-            anchorAbsoluteWeek: this.anchorWeek,
-        });
-    }
-    // Retain day DOM nodes and keyboard focus when row metadata is regenerated.
-    trackCell(_i, cell) {
-        return cell.epochDay;
-    }
-    trackRow(_i, row) {
-        return row.week.absoluteWeek;
-    }
-    scrollToEpochDay(day, options = {}) {
-        integer(day);
-        this.adapter.epochDayToDate(day);
-        day = Math.max(this.firstSupportedDay, Math.min(this.lastSupportedDay, day));
-        // position renders synchronously; publish the tab stop before that render.
-        if (options.focus)
-            this.focused = day;
-        this.position(day, false, options);
-        if (options.select)
-            this.select(day);
-        if (options.focus)
-            this.focusDay();
-    }
-    scrollToAbsoluteWeek(week, options = {}) {
-        // A boundary week can start before the adapter's first supported day.
-        const first = firstEpochDayOf(week, this.effectiveOffset);
-        this.scrollToEpochDay(week === this.firstSupportedWeek
-            ? Math.max(first, this.firstSupportedDay)
-            : first, options);
-    }
-    scrollToCalendarDate(date, options = {}) {
-        this.scrollToEpochDay(this.adapter.dateToEpochDay(date), options);
-    }
-    scrollToValue(value, options = {}) {
-        this.scrollToEpochDay(decodeIso(value).epochDay, options);
-    }
-    focusDay() {
-        if (!this.browser)
-            return;
-        setTimeout(() => {
-            var _a;
-            if (this.destroyed)
-                return;
-            this.changeDetector.detectChanges();
-            const day = this.host.nativeElement.querySelector('[data-day="' + this.focused + '"]');
-            const fallback = this.host.nativeElement.querySelector("button:not(:disabled),input:not(:disabled)");
-            (_a = (day || fallback)) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
-        });
-    }
-}
-WklyDateTimePickerComponent.decorators = [
-    { type: Component, args: [{
-                selector: "wkly-datetime-picker",
-                template: "<section\n  class=\"wkly\"\n  [attr.dir]=\"direction\"\n  [attr.aria-label]=\"\n    this[WklyPickerInputsPropertyKeys.AriaLabel] || 'Date and time picker'\n  \"\n  [attr.aria-describedby]=\"this[WklyPickerInputsPropertyKeys.AriaDescribedBy]\"\n  (focusout)=\"touched()\"\n>\n  <header class=\"toolbar\">\n    <button\n      *ngIf=\"hasDate\"\n      type=\"button\"\n      [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n      [attr.aria-label]=\"t(viewMode === 'calendar' ? 'manual' : 'calendar')\"\n      (click)=\"toggleView()\"\n    >\n      {{ viewMode === \"calendar\" ? \"\u2637\" : \"\u25A6\" }}\n    </button>\n    <span *ngIf=\"hasDate\" class=\"year-control\">{{ title }}</span>\n    <span class=\"spacer\"></span\n    ><button\n      type=\"button\"\n      class=\"now\"\n      [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n      (click)=\"now()\"\n    >\n      {{ t(\"now\") }}\n    </button>\n    <button\n      *ngIf=\"presentation === 'transient'\"\n      type=\"button\"\n      [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n      [attr.aria-label]=\"t('close')\"\n      (click)=\"cancel()\"\n    >\n      \u00D7\n    </button>\n  </header>\n  <ng-container *ngIf=\"hasDate && viewMode === 'calendar'\">\n    <div\n      role=\"grid\"\n      [attr.aria-label]=\"\n        this[WklyPickerInputsPropertyKeys.AriaLabel] || 'Calendar'\n      \"\n      [attr.aria-multiselectable]=\"isRange\"\n    >\n      <div\n        role=\"row\"\n        class=\"week-head\"\n        [class.no-label]=\"\n          compact ||\n          (this[WklyPickerInputsPropertyKeys.WeekLabelMode] === 'hidden' &&\n            !this[WklyPickerInputsPropertyKeys.WeekLabelFormatter])\n        \"\n      >\n        <span\n          *ngIf=\"\n            !compact &&\n            (this[WklyPickerInputsPropertyKeys.WeekLabelMode] !== 'hidden' ||\n              this[WklyPickerInputsPropertyKeys.WeekLabelFormatter])\n          \"\n          role=\"columnheader\"\n          aria-label=\"Week\"\n        ></span\n        ><span *ngFor=\"let day of weekdays\" role=\"columnheader\">{{ day }}</span>\n      </div>\n      <div\n        #scroller\n        class=\"week-scroll\"\n        [style.height.px]=\"visibleCount * rowHeight\"\n        (scroll)=\"scroll($event)\"\n        (scrollend)=\"snapWeek()\"\n      >\n        <div [style.height.px]=\"scrollHeight\" class=\"scroll-space\">\n          <div class=\"rows\" [style.top.px]=\"paddingTop\">\n            <div\n              *ngFor=\"let row of rows; trackBy: trackRow\"\n              role=\"row\"\n              class=\"week-row\"\n              [class.no-label]=\"\n                compact ||\n                (this[WklyPickerInputsPropertyKeys.WeekLabelMode] ===\n                  'hidden' &&\n                  !this[WklyPickerInputsPropertyKeys.WeekLabelFormatter])\n              \"\n            >\n              <span\n                *ngIf=\"\n                  !compact &&\n                  (this[WklyPickerInputsPropertyKeys.WeekLabelMode] !==\n                    'hidden' ||\n                    this[WklyPickerInputsPropertyKeys.WeekLabelFormatter])\n                \"\n                role=\"rowheader\"\n                class=\"week-number\"\n                >{{ row.label }}</span\n              >\n              <div\n                *ngFor=\"\n                  let cell of row.cells;\n                  let dayIndex = index;\n                  trackBy: trackCell\n                \"\n                role=\"gridcell\"\n                [attr.data-weekday-index]=\"dayIndex\"\n                [attr.aria-colindex]=\"\n                  dayIndex +\n                  (compact ||\n                  (this[WklyPickerInputsPropertyKeys.WeekLabelMode] ===\n                    'hidden' &&\n                    !this[WklyPickerInputsPropertyKeys.WeekLabelFormatter])\n                    ? 1\n                    : 2)\n                \"\n                [attr.aria-selected]=\"selected(cell.epochDay)\"\n                [attr.aria-disabled]=\"\n                  cell.disabled || this[WklyPickerInputsPropertyKeys.Disabled]\n                \"\n                [class.range]=\"inRange(cell.epochDay)\"\n                [class.hidden]=\"cell.hidden\"\n                [class.odd-month]=\"cell.date && cell.date.month % 2 === 1\"\n              >\n                <span [class]=\"'annotation annotation--' + dayIndex\">{{\n                  cell.annotation\n                }}</span>\n                <button\n                  type=\"button\"\n                  class=\"day\"\n                  [attr.data-day]=\"cell.epochDay\"\n                  [attr.aria-label]=\"cell.accessible\"\n                  [attr.aria-current]=\"cell.epochDay === today ? 'date' : null\"\n                  [attr.aria-disabled]=\"\n                    cell.disabled || this[WklyPickerInputsPropertyKeys.Disabled]\n                  \"\n                  [attr.tabindex]=\"\n                    !cell.hidden && cell.epochDay === focused ? 0 : -1\n                  \"\n                  [class.selected]=\"selected(cell.epochDay)\"\n                  [class.today]=\"cell.epochDay === today\"\n                  (focus)=\"focused = cell.epochDay\"\n                  (click)=\"select(cell.epochDay)\"\n                  (keydown)=\"key($event, cell.epochDay)\"\n                >\n                  {{ cell.label }}\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"week-navigation\">\n      <button\n        type=\"button\"\n        [disabled]=\"\n          this[WklyPickerInputsPropertyKeys.Disabled] || !canMoveWeek(-1)\n        \"\n        [attr.aria-label]=\"t('previous')\"\n        (click)=\"moveWeek(-1)\"\n      >\n        \u2191</button\n      ><span>{{ title }}</span\n      ><button\n        type=\"button\"\n        [disabled]=\"\n          this[WklyPickerInputsPropertyKeys.Disabled] || !canMoveWeek(1)\n        \"\n        [attr.aria-label]=\"t('next')\"\n        (click)=\"moveWeek(1)\"\n      >\n        \u2193\n      </button>\n    </div>\n  </ng-container>\n  <ng-container\n    *ngFor=\"let draft of drafts; let i = index; trackBy: trackDraft\"\n  >\n    <fieldset\n      *ngIf=\"(i === 0 || isRange) && (hasTime || viewMode === 'manual')\"\n      [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n      [attr.aria-label]=\"isRange ? t(i === 0 ? 'start' : 'end') : null\"\n    >\n      <legend *ngIf=\"isRange\">\n        <ng-container\n          *ngIf=\"\n            i === 1 && hasDate && viewMode === 'manual';\n            else endpointLabel\n          \"\n        >\n          <span class=\"end-view-toggle\">\n            <button\n              type=\"button\"\n              [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n              [attr.aria-pressed]=\"endView === 'date'\"\n              (click)=\"toggleEndView('date')\"\n            >\n              {{ t(\"end\") }}\n            </button>\n            <button\n              type=\"button\"\n              [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n              [attr.aria-pressed]=\"endView === 'days'\"\n              (click)=\"toggleEndView('days')\"\n            >\n              {{ inDaysLabel }}\n            </button>\n          </span>\n        </ng-container>\n        <ng-template #endpointLabel>{{\n          t(i === 0 ? \"start\" : \"end\")\n        }}</ng-template>\n      </legend>\n      <div\n        *ngIf=\"\n          i === 1 && hasDate && viewMode === 'manual' && endView === 'days'\n        \"\n        class=\"date-fields in-days-fields\"\n      >\n        <span class=\"resulting-end-date\" [attr.aria-label]=\"t('endDate')\">{{\n          resultingEndDate\n        }}</span>\n        <wkly-field\n          [label]=\"t('days')\"\n          [hideLabel]=\"true\"\n          [previousLabel]=\"t('daysPrevious')\"\n          [nextLabel]=\"t('daysNext')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"inDays\"\n          [min]=\"-9999\"\n          [max]=\"9999\"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"days($event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n      </div>\n      <div\n        *ngIf=\"\n          hasDate && viewMode === 'manual' && (i === 0 || endView === 'date')\n        \"\n        class=\"date-fields\"\n      >\n        <wkly-field\n          [label]=\"t('day')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"draft.date.day\"\n          [min]=\"1\"\n          [max]=\"31\"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'day', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n        <wkly-field\n          [label]=\"t('month')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"draft.date.month\"\n          [min]=\"1\"\n          [max]=\"monthCount(draft)\"\n          [labels]=\"months(draft)\"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'month', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n        <wkly-field\n          [label]=\"t('year')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"draft.date.year\"\n          [min]=\"adapter.supportedYearRange[0]\"\n          [max]=\"adapter.supportedYearRange[1]\"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'year', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n      </div>\n      <div\n        *ngIf=\"hasTime\"\n        class=\"time-fields\"\n        [class.seconds]=\"this[WklyPickerInputsPropertyKeys.ShowSeconds]\"\n      >\n        <wkly-field\n          [label]=\"t('hour')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"displayHour(draft)\"\n          [min]=\"effectiveHourCycle === 'h12' ? 1 : 0\"\n          [max]=\"effectiveHourCycle === 'h12' ? 12 : 23\"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'hour', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n        <wkly-field\n          [label]=\"t('minute')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"draft.minute\"\n          [max]=\"59\"\n          [step]=\"\n            this[WklyPickerInputsPropertyKeys.MinuteStep] > 0 &&\n            60 % this[WklyPickerInputsPropertyKeys.MinuteStep] === 0\n              ? this[WklyPickerInputsPropertyKeys.MinuteStep]\n              : 1\n          \"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'minute', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n        <wkly-field\n          *ngIf=\"this[WklyPickerInputsPropertyKeys.ShowSeconds]\"\n          [label]=\"t('second')\"\n          [locale]=\"effectiveLocale\"\n          [value]=\"draft.second\"\n          [max]=\"59\"\n          [step]=\"\n            this[WklyPickerInputsPropertyKeys.SecondStep] > 0 &&\n            60 % this[WklyPickerInputsPropertyKeys.SecondStep] === 0\n              ? this[WklyPickerInputsPropertyKeys.SecondStep]\n              : 1\n          \"\n          [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n          [invalid]=\"!!errors.length\"\n          (valueChange)=\"field(i, 'second', $event)\"\n          (complete)=\"finish()\"\n        ></wkly-field>\n        <div class=\"period\">\n          <button\n            *ngIf=\"\n              effectiveHourCycle === 'h12' ||\n              this[WklyPickerInputsPropertyKeys.HourCycle] === 'switchable'\n            \"\n            type=\"button\"\n            [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n            [attr.aria-pressed]=\"\n              effectiveHourCycle === 'h12' && (draft.hour || 0) < 12\n            \"\n            (click)=\"period(i, 'am')\"\n          >\n            {{ t(\"am\") }}</button\n          ><button\n            type=\"button\"\n            [disabled]=\"\n              this[WklyPickerInputsPropertyKeys.Disabled] ||\n              this[WklyPickerInputsPropertyKeys.HourCycle] !== 'switchable'\n            \"\n            [attr.aria-pressed]=\"effectiveHourCycle === 'h24'\"\n            (click)=\"period(i, '24')\"\n          >\n            24</button\n          ><button\n            *ngIf=\"\n              effectiveHourCycle === 'h12' ||\n              this[WklyPickerInputsPropertyKeys.HourCycle] === 'switchable'\n            \"\n            type=\"button\"\n            [disabled]=\"this[WklyPickerInputsPropertyKeys.Disabled]\"\n            [attr.aria-pressed]=\"\n              effectiveHourCycle === 'h12' && (draft.hour || 0) >= 12\n            \"\n            (click)=\"period(i, 'pm')\"\n          >\n            {{ t(\"pm\") }}\n          </button>\n        </div>\n      </div>\n    </fieldset>\n  </ng-container>\n  <div class=\"validation\" role=\"status\" aria-live=\"polite\">\n    <p *ngFor=\"let err of errors\">! {{ t(err.messageKey) }}</p>\n  </div>\n  <footer *ngIf=\"submitVisible\">\n    <button\n      type=\"button\"\n      class=\"confirm\"\n      [disabled]=\"!canSubmit\"\n      (click)=\"submit()\"\n    >\n      {{ t(\"confirm\") }}\n    </button>\n  </footer>\n</section>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef(() => WklyDateTimePickerComponent),
-                        multi: true,
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        useExisting: forwardRef(() => WklyDateTimePickerComponent),
-                        multi: true,
-                    },
-                ],
-                styles: [":host{display:block;width:100%;box-sizing:border-box;--wkly-background-color: #fff;--wkly-background-color-alternate: #fafafa;--wkly-text-color: #192c28;--wkly-muted-color: #52635e;--wkly-border-color: #dce5e1;--wkly-accent-color: #176c55;--wkly-accent-color-alternate: #6ea494;--wkly-accent-text-color: #fff;--wkly-range-color: #e5f1ee;--wkly-error-color: #b42318;--wkly-focus-color: #245bd6;--wkly-size-multiplier: 1;--wkly-size-unit: 3.5em;color:var(--wkly-text-color);font:14px/1.4 system-ui,sans-serif;container-type:inline-size}.wkly{background:var(--wkly-background-color);border:1px solid var(--wkly-border-color);border-radius:14px;overflow:hidden;min-width:0;font-size:calc(14px * clamp(1,var(--wkly-size-multiplier),1.5))}button{font:inherit;color:inherit;min-width:var(--wkly-size-unit);min-height:var(--wkly-size-unit);border:0;background:transparent;border-radius:8px;cursor:pointer}@media (hover: hover) and (pointer: fine){button:hover:not(:disabled):not([aria-disabled=\"true\"]):not(.selected){background:var(--wkly-accent-color-alternate)}}button:disabled,button[aria-disabled=true]{opacity:.4;cursor:default}button:focus-visible{outline:2px solid var(--wkly-focus-color);outline-offset:-2px}.toolbar{display:flex;align-items:center;padding:8px;grid-gap:3px;gap:3px;border-bottom:1px solid var(--wkly-border-color)}.spacer{flex:1}.year-control{padding:0 6px;font-weight:650;text-align:start;line-height:1.2}.now{color:var(--wkly-accent-color);font-weight:650}.week-head,.week-row{display:grid;grid-template-columns:28px repeat(7,minmax(0,1fr))}.week-head{font-size:.85em;color:var(--wkly-muted-color);height:34px;align-items:center;text-align:center}.week-row{height:calc(var(--wkly-size-unit) * clamp(1,var(--wkly-size-multiplier),1));align-items:end}.no-label{grid-template-columns:repeat(7,minmax(0,1fr))}.week-scroll{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;overflow-anchor:none;scrollbar-width:thin;max-height:65vh;touch-action:pan-y}.scroll-space{position:relative}.rows{position:absolute;left:0;right:0}.week-number{font-size:.85em;text-align:center;align-self:end;line-height:var(--wkly-size-unit);color:var(--wkly-muted-color)}[role=gridcell]{position:relative;min-width:0;height:var(--wkly-size-unit);text-align:center}[role=gridcell].odd-month:not(.range):not(.today){background:var(--wkly-background-color-alternate)}.day{width:100%;min-width:0;height:var(--wkly-size-unit);padding:0;border-radius:8px}.annotation{position:absolute;bottom:.25em;white-space:nowrap;font-size:1.25em;font-weight:650;line-height:1;pointer-events:none;z-index:1;color:var(--wkly-muted-color);color:color-mix(in srgb,var(--wkly-muted-color) 50%,transparent);text-shadow:0 0 2px --wkly-background-color,0 0 4px --wkly-background-color}.odd-month .annotation{text-shadow:0 0 2px --wkly-background-color-alternate,0 0 4px --wkly-background-color-alternate}.annotation:empty{display:none}.annotation--0{inset-inline-start:10%;bottom:1.75em}.annotation--1{inset-inline-start:-5%}.annotation--2{inset-inline-start:-20%}.annotation--3{inset-inline-start:-50%;inset-inline-end:-50%}.annotation--4{inset-inline-end:-20%}.annotation--5{inset-inline-end:-5%}.annotation--6{inset-inline-end:10%}.range{background:var(--wkly-range-color)}.day.selected{background:var(--wkly-accent-color);color:var(--wkly-accent-text-color);font-weight:700}.today:after{content:\"\";display:block;width:5px;height:5px;background:currentColor;border-radius:50%;position:absolute;bottom:2px;left:calc(50% - 2px)}.today{font-weight:750;box-shadow:inset 0 0 0 1px var(--wkly-accent-color)}.hidden{visibility:hidden}.week-navigation{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--wkly-border-color);font-size:.85em;color:var(--wkly-muted-color)}fieldset{border:0;padding:0 12px;margin:0;min-width:0}legend{padding-top:.85em;font-weight:650;color:var(--wkly-accent-color)}.date-fields{display:grid;grid-template-columns:1fr 2fr 1.4fr;grid-gap:7px;gap:7px;padding:12px 0}.end-view-toggle{display:inline-flex}.end-view-toggle button{min-height:0;min-width:0;padding:0 6px;border-radius:0;line-height:inherit}.end-view-toggle button:first-child{padding-inline-start:0}.end-view-toggle button+button{border-inline-start:1px solid var(--wkly-text-color)}.end-view-toggle button[aria-pressed=false]{color:var(--wkly-muted-color);font-weight:400}.in-days-fields{grid-template-columns:minmax(0,1fr);grid-gap:0;gap:0;text-align:center}.resulting-end-date{font-size:11px;color:var(--wkly-muted-color);height:1.4em;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.time-fields{display:grid;grid-template-columns:1fr 1fr 52px;grid-gap:8px;gap:8px;padding:14px 0;border-top:1px solid var(--wkly-border-color)}.time-fields.seconds{grid-template-columns:1fr 1fr 1fr 48px}.period{display:flex;flex-direction:column;justify-content:center;grid-gap:2px;gap:2px;padding-top:1.25em}.period button{font-size:.85em}.period [aria-pressed=true]{background:var(--wkly-range-color);box-shadow:inset 0 0 0 1px var(--wkly-accent-color);font-weight:700}.validation{color:var(--wkly-error-color);font-size:.85em}.validation p{margin:.5em .85em}footer{padding:12px;border-top:1px solid var(--wkly-border-color)}.confirm{background:var(--wkly-accent-color);color:var(--wkly-accent-text-color);width:100%;font-weight:650}@media (forced-colors: active){.day.selected{outline:2px solid Highlight}.range{border-bottom:2px solid Highlight}.today{outline:1px dashed CanvasText}}@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important;animation:none!important}}\n"]
-            },] }
-];
-WklyDateTimePickerComponent.ctorParameters = () => [
-    { type: String, decorators: [{ type: Inject, args: [LOCALE_ID,] }] },
-    { type: undefined, decorators: [{ type: Inject, args: [WKLY_CONFIG,] }] },
-    { type: undefined, decorators: [{ type: Inject, args: [WKLY_CLOCK,] }] },
-    { type: undefined, decorators: [{ type: Inject, args: [WKLY_LOCALIZATION,] }] },
-    { type: undefined, decorators: [{ type: Inject, args: [WKLY_TRANSLATIONS,] }] },
-    { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
-    { type: ElementRef },
-    { type: ChangeDetectorRef }
-];
-WklyDateTimePickerComponent.propDecorators = {
-    scroller: [{ type: ViewChild, args: ["scroller",] }]
-};
-
-/** Native-dialog factory. Browser resources are allocated only by open(). */
-class WklyDateTimePickerDialogService {
-    constructor(resolver, injector, app, document, platform) {
-        this.resolver = resolver;
-        this.injector = injector;
-        this.app = app;
-        this.document = document;
-        this.platform = platform;
-    }
-    open(trigger, onCancel, backdrop = true, injector) {
-        if (!isPlatformBrowser(this.platform))
-            throw new Error("Picker presentations can only open in a browser");
-        const dialog = this.document.createElement("dialog");
-        dialog.setAttribute("aria-label", "Date and time picker");
-        Object.assign(dialog.style, {
-            padding: "0",
-            border: "0",
-            borderRadius: "14px",
-            width: "min(390px, 100vw)",
-            maxWidth: "100vw",
-            maxHeight: "94vh",
-            background: "transparent",
-        });
-        const component = this.resolver
-            .resolveComponentFactory(WklyDateTimePickerComponent)
-            .create(injector || this.injector);
-        component.instance.presentation = "transient";
-        dialog.appendChild(component.location.nativeElement);
-        this.document.body.appendChild(dialog);
-        this.app.attachView(component.hostView);
-        const cancel = (event) => {
-            event.preventDefault();
-            onCancel("escape");
-        };
-        const click = (event) => {
-            if (backdrop && event.target === dialog) {
-                const r = dialog.getBoundingClientRect();
-                if (event.clientX < r.left ||
-                    event.clientX > r.right ||
-                    event.clientY < r.top ||
-                    event.clientY > r.bottom)
-                    onCancel("backdrop");
-            }
-        };
-        const keydown = (event) => {
-            if (event.key !== "Tab")
-                return;
-            const controls = Array.from(dialog.querySelectorAll('button:not(:disabled),input:not(:disabled),[tabindex="0"]')).filter((el) => el.tabIndex >= 0 &&
-                el.getClientRects().length &&
-                getComputedStyle(el).visibility !== "hidden");
-            const first = controls[0], last = controls[controls.length - 1];
-            if (first &&
-                (event.shiftKey
-                    ? this.document.activeElement === first
-                    : this.document.activeElement === last)) {
-                event.preventDefault();
-                (event.shiftKey ? last : first).focus();
-            }
-        };
-        dialog.addEventListener("cancel", cancel);
-        dialog.addEventListener("click", click);
-        dialog.addEventListener("keydown", keydown);
-        dialog.showModal();
-        return {
-            component,
-            destroy: () => {
-                dialog.removeEventListener("cancel", cancel);
-                dialog.removeEventListener("click", click);
-                dialog.removeEventListener("keydown", keydown);
-                dialog.close();
-                this.app.detachView(component.hostView);
-                component.destroy();
-                dialog.remove();
-                trigger.focus();
-            },
-        };
-    }
-}
-WklyDateTimePickerDialogService.ɵprov = i0.ɵɵdefineInjectable({ factory: function WklyDateTimePickerDialogService_Factory() { return new WklyDateTimePickerDialogService(i0.ɵɵinject(i0.ComponentFactoryResolver), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i1.DOCUMENT), i0.ɵɵinject(i0.PLATFORM_ID)); }, token: WklyDateTimePickerDialogService, providedIn: "root" });
-WklyDateTimePickerDialogService.decorators = [
-    { type: Injectable, args: [{ providedIn: "root" },] }
-];
-WklyDateTimePickerDialogService.ctorParameters = () => [
-    { type: ComponentFactoryResolver },
-    { type: Injector },
-    { type: ApplicationRef },
-    { type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
-    { type: Object, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] }
-];
-/** Shared trigger lifecycle; optional presentation packages extend this class. */
-class WklyTriggerBase extends WklyPickerInputs {
-    constructor(element) {
-        super();
-        this.element = element;
-        this.ref = null;
-        this.subscriptions = [];
-        this.errors = [];
-        this.change = () => { };
-        this.touched = () => { };
-        this.validation = () => { };
-    }
-    open() {
-        if (this[WklyPickerInputsPropertyKeys.Disabled] || this.ref)
-            return;
-        this.ref = this.create();
-        const picker = this.ref.component.instance;
-        this.copy();
-        this.subscriptions = [
-            picker[WklyPickerOutputsPropertyKeys.ValueChange].subscribe((value) => {
-                this[WklyPickerInputsPropertyKeys.Value] = value;
-                this.change(value);
-                this[WklyPickerOutputsPropertyKeys.ValueChange].emit(value);
-                this.display();
-            }),
-            picker[WklyPickerOutputsPropertyKeys.ValidationChange].subscribe((errors) => {
-                this.errors = errors;
-                this[WklyPickerOutputsPropertyKeys.ValidationChange].emit(errors);
-                this.validation();
-            }),
-            picker[WklyPickerOutputsPropertyKeys.Closed].subscribe((reason) => this.close(reason)),
-            picker[WklyPickerOutputsPropertyKeys.ViewportChange].subscribe((value) => this[WklyPickerOutputsPropertyKeys.ViewportChange].emit(value)),
-            picker[WklyPickerOutputsPropertyKeys.ViewModeChange].subscribe((value) => this[WklyPickerOutputsPropertyKeys.ViewModeChange].emit(value)),
-        ];
-        this.ref.component.changeDetectorRef.detectChanges();
-        picker.focusDay();
-        this[WklyPickerOutputsPropertyKeys.Opened].emit();
-    }
-    key(event) {
-        if (event.key === "Enter" ||
-            event.key === " " ||
-            event.key === "ArrowDown") {
-            event.preventDefault();
-            this.open();
-        }
-    }
-    blur() {
-        this.touched();
-    }
-    close(reason = "programmatic") {
-        if (!this.ref)
-            return;
-        const ref = this.ref;
-        this.ref = null;
-        this.subscriptions.forEach((s) => s.unsubscribe());
-        this.subscriptions = [];
-        ref.destroy();
-        this.touched();
-        this[WklyPickerOutputsPropertyKeys.Closed].emit(reason);
-    }
-    ngOnChanges() {
-        [
-            WklyPickerInputsPropertyKeys.ShowSeconds,
-            WklyPickerInputsPropertyKeys.AllowRangeAcrossDisabled,
-            WklyPickerInputsPropertyKeys.Required,
-            WklyPickerInputsPropertyKeys.Disabled,
-            WklyPickerInputsPropertyKeys.CloseOnBackdrop,
-        ].forEach((key) => (this[key] = coerceBoolean(this[key])));
-        this.checkValue();
-        this.display();
-        if (this.ref) {
-            this.copy();
-            this.ref.component.instance.ngOnChanges({
-                [WklyPickerInputsPropertyKeys.Value]: true,
-            });
-            this.ref.component.changeDetectorRef.detectChanges();
-        }
-    }
-    ngOnDestroy() {
-        this.close();
-    }
-    copy() {
-        if (this.ref)
-            for (const name of INPUT_NAMES)
-                this.ref.component.instance[name] = this[name];
-    }
-    display() {
-        const host = this.element.nativeElement;
-        if (host.tagName === "INPUT") {
-            host.readOnly = true;
-            const value = this[WklyPickerInputsPropertyKeys.Value];
-            host.value =
-                value === null
-                    ? ""
-                    : typeof value === "string"
-                        ? value
-                        : value.join(" — ");
-            host.disabled = this[WklyPickerInputsPropertyKeys.Disabled];
-            host.setAttribute("aria-haspopup", "dialog");
-        }
-    }
-    checkValue() {
-        this.errors = validateSelection(this[WklyPickerInputsPropertyKeys.Value], this, this[WklyPickerInputsPropertyKeys.CalendarAdapter] ||
-            new WklyGregorianCalendarAdapter(this[WklyPickerInputsPropertyKeys.Locale] || "en-US"));
-        this[WklyPickerOutputsPropertyKeys.ValidationChange].emit(this.errors);
-        this.validation();
-    }
-    writeValue(value) {
-        this[WklyPickerInputsPropertyKeys.Value] = value;
-        this.checkValue();
-        this.display();
-        if (this.ref)
-            this.ref.component.instance.writeValue(value);
-    }
-    registerOnChange(fn) {
-        this.change = fn;
-    }
-    registerOnTouched(fn) {
-        this.touched = fn;
-    }
-    setDisabledState(value) {
-        this[WklyPickerInputsPropertyKeys.Disabled] = value;
-        this.display();
-        if (this.ref)
-            this.ref.component.instance.setDisabledState(value);
-    }
-    validate() {
-        return this.errors.length ? { wkly: this.errors } : null;
-    }
-    registerOnValidatorChange(fn) {
-        this.validation = fn;
-    }
-    scrollToEpochDay(day, options) {
-        var _a;
-        this.open();
-        (_a = this.ref) === null || _a === void 0 ? void 0 : _a.component.instance.scrollToEpochDay(day, options);
-    }
-    scrollToAbsoluteWeek(week, options) {
-        var _a;
-        this.open();
-        (_a = this.ref) === null || _a === void 0 ? void 0 : _a.component.instance.scrollToAbsoluteWeek(week, options);
-    }
-    scrollToCalendarDate(date, options) {
-        var _a;
-        this.open();
-        (_a = this.ref) === null || _a === void 0 ? void 0 : _a.component.instance.scrollToCalendarDate(date, options);
-    }
-    scrollToValue(value, options) {
-        var _a;
-        this.open();
-        (_a = this.ref) === null || _a === void 0 ? void 0 : _a.component.instance.scrollToValue(value, options);
-    }
-}
-WklyTriggerBase.decorators = [
-    { type: Directive }
-];
-WklyTriggerBase.ctorParameters = () => [
-    { type: ElementRef }
-];
-WklyTriggerBase.propDecorators = {
-    open: [{ type: HostListener, args: ["click",] }],
-    key: [{ type: HostListener, args: ["keydown", ["$event"],] }],
-    blur: [{ type: HostListener, args: ["blur",] }]
-};
-class WklyDateTimePickerDialogDirective extends WklyTriggerBase {
-    constructor(element, service, triggerInjector) {
-        super(element);
-        this.service = service;
-        this.triggerInjector = triggerInjector;
-    }
-    create() {
-        return this.service.open(this.element.nativeElement, (reason) => this.close(reason), this[WklyPickerInputsPropertyKeys.CloseOnBackdrop], this.triggerInjector);
-    }
-}
-WklyDateTimePickerDialogDirective.decorators = [
-    { type: Directive, args: [{
-                selector: "[wklyDateTimePickerDialog]",
-                exportAs: "wklyDialog",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef(() => WklyDateTimePickerDialogDirective),
-                        multi: true,
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        useExisting: forwardRef(() => WklyDateTimePickerDialogDirective),
-                        multi: true,
-                    },
-                ],
-            },] }
-];
-WklyDateTimePickerDialogDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: WklyDateTimePickerDialogService },
-    { type: Injector }
-];
-
-class WklyFieldComponent {
-    constructor() {
-        this.value = 0;
-        this.label = "";
-        this.hideLabel = false;
-        this.previousLabel = "";
-        this.nextLabel = "";
-        this.min = 0;
-        this.max = 59;
-        this.step = 1;
-        this.locale = "en-US";
-        this.disabled = false;
-        this.invalid = false;
-        this.labels = null;
-        this.valueChange = new EventEmitter();
-        this.complete = new EventEmitter();
-        this.before = null;
-        this.touchY = 0;
-        this.touchSteps = 0;
-        this.touchChanged = false;
-        this.typed = null;
-        this.inputTimer = null;
-        this.wheelTimer = null;
-    }
-    get display() {
-        if (this.typed !== null)
-            return this.typed;
-        return this.value === null
-            ? ""
-            : this.labels
-                ? this.labels[this.value - this.min] || String(this.value)
-                : new Intl.NumberFormat(this.locale, {
-                    useGrouping: false,
-                    minimumIntegerDigits: this.max < 60 ? 2 : 1,
-                }).format(this.value);
-    }
-    ngOnChanges(changes) {
-        if (changes.value && this.min < 0 && this.typed !== null) {
-            const typedValue = this.typed === "" || this.typed === "-" ? null : Number(this.typed);
-            if (this.value !== typedValue) {
-                // External date edits replace a pending relative-day preview.
-                this.cancelInput();
-                this.typed = null;
-            }
-        }
-    }
-    ngOnDestroy() {
-        this.cancelInput();
-        if (this.wheelTimer !== null)
-            clearTimeout(this.wheelTimer);
-    }
-    next(delta) {
-        const count = Math.floor((this.max - this.min) / this.step) + 1;
-        return (this.min +
-            floorMod(Math.floor(((this.value === null ? this.min : this.value) - this.min) /
-                this.step) + delta, count) *
-                this.step);
-    }
-    neighbor(delta) {
-        const n = this.next(delta);
-        return this.labels
-            ? this.labels[n - this.min] || ""
-            : new Intl.NumberFormat(this.locale, { useGrouping: false }).format(n);
-    }
-    stepBy(delta) {
-        if (this.disabled)
-            return;
-        this.scrollBy(delta);
-        this.complete.emit();
-    }
-    begin(event) {
-        this.before = this.value;
-        event.target.select();
-    }
-    type(event) {
-        if (this.disabled)
-            return;
-        const input = event.target;
-        const raw = input.value;
-        const numeric = Array.from(raw).every((character) => normalizeDigits(character).length === 1);
-        if (this.min < 0 && !this.labels) {
-            // Preserve the sign while using the same locale digit normalization.
-            const signed = raw
-                .replace(/[\u200e\u200f\u061c]/g, "")
-                .replace(/\u2212/g, "-");
-            const digits = normalizeDigits(signed);
-            this.typed = input.value = (signed.startsWith("-") ? "-" : "") + digits;
-            this.value =
-                digits === ""
-                    ? null
-                    : Math.max(this.min, Math.min(this.max, Number(this.typed)));
-            if (this.value !== null && Number(this.typed) !== this.value)
-                this.typed = input.value = String(this.value);
-        }
-        else if (numeric) {
-            const normalized = normalizeDigits(raw);
-            this.typed = input.value =
-                this.min >= 0 && this.max < 100 ? normalized.slice(-2) : normalized;
-            this.value = this.typed === "" ? null : Number(this.typed);
-        }
-        else if (this.labels) {
-            const search = raw.trim().toLocaleLowerCase(this.locale);
-            this.typed = raw;
-            const matches = this.labels
-                .map((label, index) => ({ label, index }))
-                .filter((item) => item.label.toLocaleLowerCase(this.locale).includes(search));
-            this.value = matches.length === 1 ? this.min + matches[0].index : null;
-        }
-        else {
-            this.typed = input.value = normalizeDigits(raw);
-            this.value = this.typed === "" ? null : Number(this.typed);
-        }
-        this.valueChange.emit(this.value);
-        this.cancelInput();
-        if (!numeric && this.labels && this.value !== null)
-            this.complete.emit();
-        this.inputTimer = setTimeout(() => {
-            this.inputTimer = null;
-            this.typed = null;
-            if (!this.disabled)
-                this.complete.emit();
-        }, 1000);
-    }
-    key(event) {
-        if (event.key === "Escape") {
-            event.preventDefault();
-            event.stopPropagation();
-            this.cancelInput();
-            this.typed = null;
-            this.value = this.before;
-            this.valueChange.emit(this.before);
-            event.target.value = this.display;
-            event.target.blur();
-        }
-        if (event.key === "Enter") {
-            event.preventDefault();
-            event.stopPropagation();
-            this.finish();
-        }
-        const delta = event.key === "ArrowUp"
-            ? -1
-            : event.key === "ArrowDown"
-                ? 1
-                : event.key === "PageUp"
-                    ? -5
-                    : event.key === "PageDown"
-                        ? 5
-                        : 0;
-        if (delta) {
-            event.preventDefault();
-            this.stepBy(delta);
-        }
-    }
-    finish() {
-        this.cancelInput();
-        this.typed = null;
-        this.complete.emit();
-    }
-    wheel(event) {
-        if (this.disabled || Math.abs(event.deltaY) < 1)
-            return;
-        event.preventDefault();
-        this.scrollBy(event.deltaY > 0 ? 1 : -1);
-        if (this.wheelTimer !== null)
-            clearTimeout(this.wheelTimer);
-        this.wheelTimer = setTimeout(() => {
-            this.wheelTimer = null;
-            this.complete.emit();
-        }, 140);
-    }
-    touchStart(event) {
-        this.touchY = event.touches[0].clientY;
-        this.touchSteps = 0;
-        this.touchChanged = false;
-    }
-    touchMove(event) {
-        this.applyTouchY(event.touches[0].clientY);
-    }
-    touchEnd(event) {
-        this.applyTouchY(event.changedTouches[0].clientY);
-        if (this.touchChanged)
-            this.complete.emit();
-        this.touchChanged = false;
-    }
-    cancelInput() {
-        if (this.inputTimer !== null)
-            clearTimeout(this.inputTimer);
-        this.inputTimer = null;
-    }
-    scrollBy(delta) {
-        if (this.disabled || !delta)
-            return;
-        this.cancelInput();
-        this.typed = null;
-        this.value = this.next(delta);
-        this.valueChange.emit(this.value);
-    }
-    applyTouchY(y) {
-        // Count total gesture steps so repeated move events do not duplicate changes.
-        if (this.disabled)
-            return;
-        const delta = this.touchY - y;
-        const steps = Math.abs(delta) > 16
-            ? Math.sign(delta) * Math.max(1, Math.round(Math.abs(delta) / 40))
-            : 0;
-        const change = steps - this.touchSteps;
-        if (!change)
-            return;
-        this.scrollBy(change);
-        this.touchSteps = steps;
-        this.touchChanged = true;
-    }
-}
-WklyFieldComponent.decorators = [
-    { type: Component, args: [{
-                selector: "wkly-field",
-                template: "<div\n  class=\"field\"\n  (wheel)=\"wheel($event)\"\n  (touchstart)=\"touchStart($event)\"\n  (touchmove)=\"touchMove($event)\"\n  (touchend)=\"touchEnd($event)\"\n  (touchcancel)=\"touchEnd($event)\"\n>\n  <span *ngIf=\"!hideLabel\" class=\"label\">{{ label }}</span>\n  <button\n    type=\"button\"\n    [disabled]=\"disabled\"\n    [attr.aria-label]=\"previousLabel || label + ': previous'\"\n    (click)=\"stepBy(-1)\"\n  >\n    {{ neighbor(-1) }}\n  </button>\n  <input\n    [attr.aria-label]=\"label\"\n    [attr.aria-invalid]=\"invalid\"\n    [disabled]=\"disabled\"\n    [value]=\"display\"\n    [attr.inputmode]=\"labels ? 'text' : min < 0 ? 'text' : 'numeric'\"\n    autocomplete=\"off\"\n    (focus)=\"begin($event)\"\n    (input)=\"type($event)\"\n    (blur)=\"finish()\"\n    (keydown)=\"key($event)\"\n  />\n  <button\n    type=\"button\"\n    [disabled]=\"disabled\"\n    [attr.aria-label]=\"nextLabel || label + ': next'\"\n    (click)=\"stepBy(1)\"\n  >\n    {{ neighbor(1) }}\n  </button>\n</div>\n",
-                styles: [".field{display:flex;flex-direction:column;align-items:stretch;min-width:0;text-align:center;touch-action:pan-x}.label{font-size:11px;color:var(--wkly-muted-color, #54616e);margin-bottom:4px}button,input{font:inherit;box-sizing:border-box;min-height:44px;width:100%;border:0;text-align:center;background:transparent;color:inherit;border-radius:7px}button{color:var(--wkly-muted-color, #54616e);cursor:pointer}input{font-size:18px;font-weight:650;background:var(--wkly-range-color, #e5f1ee);border-block:2px solid var(--wkly-accent-color, #176c55)}input[aria-invalid=true]{border-color:var(--wkly-error-color, #b42318)}:focus-visible{outline:2px solid var(--wkly-focus-color, #124ee0);outline-offset:1px}button:disabled,input:disabled{opacity:.45}@media (hover: hover) and (pointer: fine){button:hover:not(:disabled){background:var(--wkly-range-color, #e5f1ee)}}\n"]
-            },] }
-];
-WklyFieldComponent.propDecorators = {
-    value: [{ type: Input }],
-    label: [{ type: Input }],
-    hideLabel: [{ type: Input }],
-    previousLabel: [{ type: Input }],
-    nextLabel: [{ type: Input }],
-    min: [{ type: Input }],
-    max: [{ type: Input }],
-    step: [{ type: Input }],
-    locale: [{ type: Input }],
-    disabled: [{ type: Input }],
-    invalid: [{ type: Input }],
-    labels: [{ type: Input }],
-    valueChange: [{ type: Output }],
-    complete: [{ type: Output }]
-};
-
-class WklyDateTimePickerModule {
-}
-WklyDateTimePickerModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [CommonModule],
-                declarations: [
-                    WklyDateTimePickerComponent,
-                    WklyDateTimePickerDialogDirective,
-                    WklyFieldComponent,
-                ],
-                entryComponents: [WklyDateTimePickerComponent],
-                exports: [WklyDateTimePickerComponent, WklyDateTimePickerDialogDirective],
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { WKLY_CLOCK, WKLY_CONFIG, WKLY_LOCALIZATION, WKLY_TRANSLATIONS, WklyDateTimePickerComponent, WklyDateTimePickerDialogDirective, WklyDateTimePickerDialogService, WklyDateTimePickerModule, WklyFieldComponent, WklyPickerInputs, WklyTriggerBase };
-//# sourceMappingURL=wkly-datetime-picker.js.map