@rt-tools/ui-kit-v2 0.23.3 → 0.24.0

package/fesm2022/rt-tools-ui-kit-v2-date-range.mjs

@@ -1,573 +1,858 @@
-import * as i0 from '@angular/core';
-import { inject, computed, linkedSignal, signal, input, booleanAttribute, output, ViewEncapsulation, ChangeDetectionStrategy, Component, viewChild, forwardRef } from '@angular/core';
-import { BlockDirective, ElemDirective, ModDirective } from '@rt-tools/core';
-import { RT_KIT_LOCALE, RT_KIT_LABELS, rtKitLabel, BreakpointsService } from '@rt-tools/ui-kit-v2/core';
-import { RtBottomSheetComponent } from '@rt-tools/ui-kit-v2/bottom-sheet';
-import { rtDateAddMonths, rtDateRead, rtDateInBounds, rtDateMonth, rtDateText, rtDateShape, rtDateParse, rtDateFirstDay, rtDateWeekdays, rtDateNow, rtDateCanPage, rtDateGridKey, rtDateLayout } from '@rt-tools/ui-kit-v2/date-picker';
-import { RtFormControlBase } from '@rt-tools/ui-kit-v2/form-control';
-import { RtIconButtonComponent } from '@rt-tools/ui-kit-v2/icon-button';
-import { RtPopoverDirective } from '@rt-tools/ui-kit-v2/popover';
-import * as i1 from '@rt-tools/ui-kit-v2/radius';
-import { RtRadiusDirective } from '@rt-tools/ui-kit-v2/radius';
-import { RtButtonDirective } from '@rt-tools/ui-kit-v2/button';
-import { ERtCalendarDayState, RtCalendarComponent } from '@rt-tools/ui-kit-v2/calendar';
-
-/** Быстрый вариант диапазона в панели поля. */
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, ViewEncapsulation, booleanAttribute, computed, forwardRef, inject, input, linkedSignal, output, signal, viewChild } from "@angular/core";
+import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
+import { BreakpointsService, RT_KIT_LABELS, RT_KIT_LOCALE, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
+import { RtBottomSheetComponent } from "@rt-tools/ui-kit-v2/bottom-sheet";
+import { rtDateAddMonths, rtDateCanPage, rtDateFirstDay, rtDateGridKey, rtDateInBounds, rtDateLayout, rtDateMonth, rtDateNow, rtDateParse, rtDateRead, rtDateShape, rtDateText, rtDateWeekdays } from "@rt-tools/ui-kit-v2/date-picker";
+import { RtFormControlBase } from "@rt-tools/ui-kit-v2/form-control";
+import { RtIconButtonComponent } from "@rt-tools/ui-kit-v2/icon-button";
+import { RtPopoverDirective } from "@rt-tools/ui-kit-v2/popover";
+import * as i1 from "@rt-tools/ui-kit-v2/radius";
+import { RtRadiusDirective } from "@rt-tools/ui-kit-v2/radius";
+import { RtButtonDirective } from "@rt-tools/ui-kit-v2/button";
+import { ERtCalendarDayState, RtCalendarComponent } from "@rt-tools/ui-kit-v2/calendar";
 var ERtDateRangePreset;
-(function (ERtDateRangePreset) {
-    ERtDateRangePreset["Today"] = "today";
-    ERtDateRangePreset["Yesterday"] = "yesterday";
-    ERtDateRangePreset["Last7"] = "last-7";
-    ERtDateRangePreset["Last30"] = "last-30";
-    ERtDateRangePreset["ThisMonth"] = "this-month";
-    ERtDateRangePreset["LastMonth"] = "last-month";
+(function(ERtDateRangePreset) {
+	ERtDateRangePreset["Today"] = "today";
+	ERtDateRangePreset["Yesterday"] = "yesterday";
+	ERtDateRangePreset["Last7"] = "last-7";
+	ERtDateRangePreset["Last30"] = "last-30";
+	ERtDateRangePreset["ThisMonth"] = "this-month";
+	ERtDateRangePreset["LastMonth"] = "last-month";
 })(ERtDateRangePreset || (ERtDateRangePreset = {}));
-
-/**
- * Чистая логика поля диапазона дат: порядок двух дней, состояния дней месяца, быстрые варианты,
- * итог и текст поля. Сегодняшний день приходит параметром — компонент читает часы сам.
- *
- * Дни — строки `YYYY-MM-DD`: строки одной формы сравниваются как текст в порядке дат.
- */
-const DAY_LENGTH_MS = 86_400_000;
+const DAY_LENGTH_MS = 864e5;
 const DAY_LEN = 10;
 const MONTH_LEN$1 = 7;
 const YEAR_LEN = 4;
-const LAST_WEEK_DAYS = 7;
-const LAST_MONTH_DAYS = 30;
-/** Знак между датами в тексте поля. */
-const DASH = ' — ';
-/** Тире между датами набранного текста: длинное или короткое, дефис — только между пробелами. */
+const DASH = " — ";
 const DASH_RE = /[—–]|\s-\s/;
 function dayToMs(day) {
-    const [y, m, d] = day.split('-').map(Number);
-    return Date.UTC(y, m - 1, d);
+	const [y, m, d] = day.split("-").map(Number);
+	return Date.UTC(y, m - 1, d);
 }
 function msToDay(ms) {
-    return new Date(ms).toISOString().slice(0, DAY_LEN);
+	return new Date(ms).toISOString().slice(0, DAY_LEN);
 }
 function addDays(day, delta) {
-    return msToDay(dayToMs(day) + delta * DAY_LENGTH_MS);
+	return msToDay(dayToMs(day) + delta * DAY_LENGTH_MS);
 }
 function lastDayOf(month) {
-    return addDays(`${rtDateAddMonths(month, 1)}-01`, -1);
+	return addDays(`${rtDateAddMonths(month, 1)}-01`, -1);
 }
 function dayState(day, low, high) {
-    if (high === null || low === high) {
-        return day === low ? ERtCalendarDayState.Chosen : ERtCalendarDayState.Free;
-    }
-    if (day === low) {
-        return ERtCalendarDayState.Start;
-    }
-    if (day === high) {
-        return ERtCalendarDayState.End;
-    }
-    const ms = dayToMs(day);
-    return low !== null && ms > dayToMs(low) && ms < dayToMs(high) ? ERtCalendarDayState.InRange : ERtCalendarDayState.Free;
+	if (high === null || low === high) return day === low ? ERtCalendarDayState.Chosen : ERtCalendarDayState.Free;
+	if (day === low) return ERtCalendarDayState.Start;
+	if (day === high) return ERtCalendarDayState.End;
+	const ms = dayToMs(day);
+	return low !== null && ms > dayToMs(low) && ms < dayToMs(high) ? ERtCalendarDayState.InRange : ERtCalendarDayState.Free;
 }
-/** Два дня по порядку: второй раньше первого — они меняются местами. */
 function rtRangeOrder(a, b) {
-    return dayToMs(a) <= dayToMs(b) ? { start: a, end: b } : { start: b, end: a };
+	return dayToMs(a) <= dayToMs(b) ? {
+		start: a,
+		end: b
+	} : {
+		start: b,
+		end: a
+	};
 }
-/** Значение поля из того, что пришло из формы; не пара дней по порядку — `null`. */
 function rtRangeRead(value) {
-    if (typeof value !== 'object' || value === null) {
-        return null;
-    }
-    const start = Reflect.get(value, 'start');
-    const end = Reflect.get(value, 'end');
-    if (typeof start !== 'string' || typeof end !== 'string') {
-        return null;
-    }
-    const ok = rtDateRead(start, 'date') !== null && rtDateRead(end, 'date') !== null && dayToMs(start) <= dayToMs(end);
-    return ok ? { start, end } : null;
+	if (typeof value !== "object" || value === null) return null;
+	const start = Reflect.get(value, "start");
+	const end = Reflect.get(value, "end");
+	if (typeof start !== "string" || typeof end !== "string") return null;
+	return rtDateRead(start, "date") !== null && rtDateRead(end, "date") !== null && dayToMs(start) <= dayToMs(end) ? {
+		start,
+		end
+	} : null;
 }
-/** Диапазон лежит в границах целиком. */
 function rtRangeInBounds(range, min, max) {
-    return rtDateInBounds(range.start, min, max) && rtDateInBounds(range.end, min, max);
+	return rtDateInBounds(range.start, min, max) && rtDateInBounds(range.end, min, max);
 }
-/**
- * Месяц `YYYY-MM` для календаря: дни черновика — начало, конец и дни между ними. Пока выбрано только
- * начало, будущий диапазон тянется до дня под указателем, и этот день светлый, как дни между краями:
- * залит только выбранный край.
- */
 function rtRangeMonth(month, ctx) {
-    const base = rtDateMonth(month, { locale: ctx.locale, today: ctx.today, chosen: null, min: ctx.min, max: ctx.max });
-    const other = ctx.end ?? ctx.hover;
-    const range = ctx.start === null || other === null ? null : rtRangeOrder(ctx.start, other);
-    const low = range?.start ?? ctx.start;
-    const high = range?.end ?? null;
-    const preview = ctx.end === null && ctx.hover !== ctx.start ? ctx.hover : null;
-    return {
-        ...base,
-        days: base.days.map((day) => {
-            const state = dayState(day.key, low, high);
-            return { ...day, state: day.key === preview ? ERtCalendarDayState.InRange : state };
-        }),
-    };
+	const base = rtDateMonth(month, {
+		locale: ctx.locale,
+		today: ctx.today,
+		chosen: null,
+		min: ctx.min,
+		max: ctx.max
+	});
+	const other = ctx.end ?? ctx.hover;
+	const range = ctx.start === null || other === null ? null : rtRangeOrder(ctx.start, other);
+	const low = range?.start ?? ctx.start;
+	const high = range?.end ?? null;
+	const preview = ctx.end === null && ctx.hover !== ctx.start ? ctx.hover : null;
+	return {
+		...base,
+		days: base.days.map((day) => {
+			const state = dayState(day.key, low, high);
+			return {
+				...day,
+				state: day.key === preview ? ERtCalendarDayState.InRange : state
+			};
+		})
+	};
 }
-/** Диапазоны быстрых вариантов от сегодняшнего дня. */
 function rtRangePresets(today) {
-    const month = today.slice(0, MONTH_LEN$1);
-    const lastMonth = rtDateAddMonths(month, -1);
-    const yesterday = addDays(today, -1);
-    return {
-        [ERtDateRangePreset.Today]: { start: today, end: today },
-        [ERtDateRangePreset.Yesterday]: { start: yesterday, end: yesterday },
-        [ERtDateRangePreset.Last7]: { start: addDays(today, 1 - LAST_WEEK_DAYS), end: today },
-        [ERtDateRangePreset.Last30]: { start: addDays(today, 1 - LAST_MONTH_DAYS), end: today },
-        [ERtDateRangePreset.ThisMonth]: { start: `${month}-01`, end: today },
-        [ERtDateRangePreset.LastMonth]: { start: `${lastMonth}-01`, end: lastDayOf(lastMonth) },
-    };
+	const month = today.slice(0, MONTH_LEN$1);
+	const lastMonth = rtDateAddMonths(month, -1);
+	const yesterday = addDays(today, -1);
+	return {
+		[ERtDateRangePreset.Today]: {
+			start: today,
+			end: today
+		},
+		[ERtDateRangePreset.Yesterday]: {
+			start: yesterday,
+			end: yesterday
+		},
+		[ERtDateRangePreset.Last7]: {
+			start: addDays(today, -6),
+			end: today
+		},
+		[ERtDateRangePreset.Last30]: {
+			start: addDays(today, -29),
+			end: today
+		},
+		[ERtDateRangePreset.ThisMonth]: {
+			start: `${month}-01`,
+			end: today
+		},
+		[ERtDateRangePreset.LastMonth]: {
+			start: `${lastMonth}-01`,
+			end: lastDayOf(lastMonth)
+		}
+	};
 }
-/** Быстрые варианты в порядке панели; вариант, не лежащий в границах целиком, выключен. */
 function rtRangePresetCells(today, min, max) {
-    const ranges = rtRangePresets(today);
-    return Object.values(ERtDateRangePreset).map((preset) => ({
-        preset,
-        range: ranges[preset],
-        disabled: !rtRangeInBounds(ranges[preset], min, max),
-    }));
+	const ranges = rtRangePresets(today);
+	return Object.values(ERtDateRangePreset).map((preset) => ({
+		preset,
+		range: ranges[preset],
+		disabled: !rtRangeInBounds(ranges[preset], min, max)
+	}));
 }
-/** Вариант, чей диапазон совпадает с черновиком; иначе `null`. */
 function rtRangePresetOf(range, today) {
-    if (range === null) {
-        return null;
-    }
-    const ranges = rtRangePresets(today);
-    const found = Object.values(ERtDateRangePreset).find((preset) => ranges[preset].start === range.start && ranges[preset].end === range.end);
-    return found ?? null;
+	if (range === null) return null;
+	const ranges = rtRangePresets(today);
+	return Object.values(ERtDateRangePreset).find((preset) => ranges[preset].start === range.start && ranges[preset].end === range.end) ?? null;
 }
-/** Число дней диапазона, оба края включены. */
 function rtRangeDays(range) {
-    return Math.round((dayToMs(range.end) - dayToMs(range.start)) / DAY_LENGTH_MS) + 1;
+	return Math.round((dayToMs(range.end) - dayToMs(range.start)) / DAY_LENGTH_MS) + 1;
 }
-/** Форма числа по правилам локали; `zero` и `two` идут подписью `other`. */
 function rtRangePlural(count, locale) {
-    const form = new Intl.PluralRules(locale).select(count);
-    return form === 'one' || form === 'few' || form === 'many' ? form : 'other';
+	const form = new Intl.PluralRules(locale).select(count);
+	return form === "one" || form === "few" || form === "many" ? form : "other";
 }
-/** Даты итога по локали: `12–15 октября`; год пишется, когда края в разных годах. */
 function rtRangeDates(range, locale) {
-    const sameYear = range.start.slice(0, YEAR_LEN) === range.end.slice(0, YEAR_LEN);
-    const options = sameYear
-        ? { day: 'numeric', month: 'long', timeZone: 'UTC' }
-        : { day: 'numeric', month: 'long', year: 'numeric', timeZone: 'UTC' };
-    return new Intl.DateTimeFormat(locale, options).formatRange(dayToMs(range.start), dayToMs(range.end));
+	const options = range.start.slice(0, YEAR_LEN) === range.end.slice(0, YEAR_LEN) ? {
+		day: "numeric",
+		month: "long",
+		timeZone: "UTC"
+	} : {
+		day: "numeric",
+		month: "long",
+		year: "numeric",
+		timeZone: "UTC"
+	};
+	return new Intl.DateTimeFormat(locale, options).formatRange(dayToMs(range.start), dayToMs(range.end));
 }
-/** Текст поля: две даты в порядке локали через тире; пусто — пустой текст. */
 function rtRangeText(value, layout) {
-    return value === null ? '' : `${rtDateText(value.start, 'date', layout)}${DASH}${rtDateText(value.end, 'date', layout)}`;
+	return value === null ? "" : `${rtDateText(value.start, "date", layout)}${DASH}${rtDateText(value.end, "date", layout)}`;
 }
-/** Подсказка формы текста буквами кита: `дд.мм.гггг — дд.мм.гггг`. */
 function rtRangeShape(layout, letters) {
-    const day = rtDateShape('date', layout, letters);
-    return `${day}${DASH}${day}`;
+	const day = rtDateShape("date", layout, letters);
+	return `${day}${DASH}${day}`;
 }
-/**
- * Читает набранный текст в диапазон; `null` — текст не две даты. Даты читаются в порядке локали,
- * форма значения тоже; даты в обратном порядке ставятся по порядку.
- */
 function rtRangeParse(text, layout) {
-    const parts = text.trim().split(DASH_RE);
-    if (parts.length !== 2) {
-        return null;
-    }
-    const start = rtDateParse(parts[0].trim(), 'date', layout);
-    const end = rtDateParse(parts[1].trim(), 'date', layout);
-    return start === null || end === null ? null : rtRangeOrder(start, end);
+	const parts = text.trim().split(DASH_RE);
+	if (parts.length !== 2) return null;
+	const start = rtDateParse(parts[0].trim(), "date", layout);
+	const end = rtDateParse(parts[1].trim(), "date", layout);
+	return start === null || end === null ? null : rtRangeOrder(start, end);
 }
-
-const BEM_BLOCK$1 = 'rt-date-range-panel';
+const BEM_BLOCK$1 = "rt-date-range-panel";
 const MONTH_LEN = 7;
-/** Подпись каждого быстрого варианта в наборе кита. */
 const PRESET_LABELS = {
-    [ERtDateRangePreset.Today]: 'uiToday',
-    [ERtDateRangePreset.Yesterday]: 'uiYesterday',
-    [ERtDateRangePreset.Last7]: 'uiLast7Days',
-    [ERtDateRangePreset.Last30]: 'uiLast30Days',
-    [ERtDateRangePreset.ThisMonth]: 'uiThisMonth',
-    [ERtDateRangePreset.LastMonth]: 'uiLastMonth',
+	[ERtDateRangePreset.Today]: "uiToday",
+	[ERtDateRangePreset.Yesterday]: "uiYesterday",
+	[ERtDateRangePreset.Last7]: "uiLast7Days",
+	[ERtDateRangePreset.Last30]: "uiLast30Days",
+	[ERtDateRangePreset.ThisMonth]: "uiThisMonth",
+	[ERtDateRangePreset.LastMonth]: "uiLastMonth"
 };
-/** Подпись числа дней для каждой формы множественного числа. */
 const DAY_LABELS = {
-    one: 'uiDaysOne',
-    few: 'uiDaysFew',
-    many: 'uiDaysMany',
-    other: 'uiDaysOther',
+	one: "uiDaysOne",
+	few: "uiDaysFew",
+	many: "uiDaysMany",
+	other: "uiDaysOther"
 };
-/**
- * Панель rt-date-range: быстрые варианты, два месяца рядом (в шторке — один) и подвал с итогом,
- * «Сбросить» и «Применить».
- *
- * Панель не пишет в форму: готовый диапазон уходит событием `picked`, просьба закрыться — `closed`.
- * Черновик живёт, пока панель открыта; поле создаёт её заново на каждое открытие. Вся арифметика
- * диапазона — в `rt-date-range.logic`.
- */
-class RtDateRangePanelComponent {
-    constructor() {
-        /** Локаль кита: названия месяцев, дней недели, даты итога и форма числа дней идут по ней. */
-        this.#locale = inject(RT_KIT_LOCALE);
-        /** Минута открытия панели: от неё считается «сегодня», когда вход `now` не задан. */
-        this.#openedAt = new Date();
-        this.#firstDay = computed(() => rtDateFirstDay(this.#locale()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "#firstDay" }] : /* istanbul ignore next */ []));
-        this.t = inject(RT_KIT_LABELS);
-        this.weekdays = computed(() => rtDateWeekdays(this.#locale()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "weekdays" }] : /* istanbul ignore next */ []));
-        this.today = computed(() => rtDateNow(this.now() ?? this.#openedAt, 1).day, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "today" }] : /* istanbul ignore next */ []));
-        this.start = linkedSignal(() => this.value()?.start ?? null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "start" }] : /* istanbul ignore next */ []));
-        this.end = linkedSignal(() => this.value()?.end ?? null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "end" }] : /* istanbul ignore next */ []));
-        /** День под указателем: пока выбрано только начало, до него рисуется будущий диапазон. */
-        this.hover = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "hover" }] : /* istanbul ignore next */ []));
-        this.activeKey = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "activeKey" }] : /* istanbul ignore next */ []));
-        this.shownMonth = linkedSignal(() => (this.value()?.start ?? this.today()).slice(0, MONTH_LEN), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "shownMonth" }] : /* istanbul ignore next */ []));
-        /** Готовый черновик: оба края выбраны. */
-        this.draft = computed(() => {
-            const start = this.start();
-            const end = this.end();
-            return start === null || end === null ? null : { start, end };
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []));
-        this.months = computed(() => {
-            const ctx = {
-                locale: this.#locale(),
-                today: this.today(),
-                start: this.start(),
-                end: this.end(),
-                hover: this.hover(),
-                min: this.min(),
-                max: this.max(),
-            };
-            return this.#shown().map((month) => rtRangeMonth(month, ctx));
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []));
-        this.canPrev = computed(() => rtDateCanPage(this.shownMonth(), -1, this.min(), this.max()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "canPrev" }] : /* istanbul ignore next */ []));
-        /** Вперёд листается, пока последний показанный месяц не упёрся в границу. */
-        this.canNext = computed(() => rtDateCanPage(this.#lastShown(), 1, this.min(), this.max()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "canNext" }] : /* istanbul ignore next */ []));
-        this.presets = computed(() => {
-            const labels = this.t();
-            const chosen = rtRangePresetOf(this.draft(), this.today());
-            return rtRangePresetCells(this.today(), this.min(), this.max()).map((cell) => ({
-                cell,
-                label: labels[PRESET_LABELS[cell.preset]],
-                chosen: cell.preset === chosen,
-            }));
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "presets" }] : /* istanbul ignore next */ []));
-        /** Число дней черновика подписью кита по форме множественного числа локали. */
-        this.daysText = rtKitLabel(computed(() => {
-            const draft = this.draft();
-            return draft === null ? '' : DAY_LABELS[rtRangePlural(rtRangeDays(draft), this.#locale())];
-        }), computed(() => {
-            const draft = this.draft();
-            return { count: draft === null ? 0 : rtRangeDays(draft) };
-        }));
-        /** Итог подвала: даты и число дней, в шторке — только число; с одним началом — просьба о конце. */
-        this.summary = computed(() => {
-            const draft = this.draft();
-            if (draft === null) {
-                return this.start() === null ? this.t().uiPickStartDate : this.t().uiPickEndDate;
-            }
-            return this.sheet() ? this.daysText() : `${rtRangeDates(draft, this.#locale())} · ${this.daysText()}`;
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "summary" }] : /* istanbul ignore next */ []));
-        /** Значение поля: с него начинается черновик. */
-        this.value = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-        this.min = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-        this.max = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-        /** Раскладка нижней шторки: один месяц, варианты строкой сверху, дни под палец. */
-        this.sheet = input(false, { ...(ngDevMode ? { debugName: "sheet" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-        /**
-         * Момент, от которого считаются «сегодня» и быстрые варианты. Поле его не задаёт — панель
-         * читает часы сама; задаёт витрина, чтобы кадр не менялся день ото дня.
-         */
-        this.now = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "now" }] : /* istanbul ignore next */ []));
-        /** Готовый диапазон: панель просит поле его записать. */
-        this.picked = output();
-        /** Панель просит закрыть себя. */
-        this.closed = output();
-    }
-    /** Локаль кита: названия месяцев, дней недели, даты итога и форма числа дней идут по ней. */
-    #locale;
-    /** Минута открытия панели: от неё считается «сегодня», когда вход `now` не задан. */
-    #openedAt;
-    #firstDay;
-    /** Первый выбор — начало, второй — конец; выбор после готового диапазона начинает новый. */
-    pickDay(day) {
-        this.activeKey.set(day.key);
-        const start = this.start();
-        if (start === null || this.end() !== null) {
-            this.start.set(day.key);
-            this.end.set(null);
-            return;
-        }
-        const range = rtRangeOrder(start, day.key);
-        this.start.set(range.start);
-        this.end.set(range.end);
-        this.hover.set(null);
-    }
-    onHover(day) {
-        this.hover.set(day?.key ?? null);
-    }
-    pickPreset(cell) {
-        if (cell.disabled) {
-            return;
-        }
-        this.start.set(cell.range.start);
-        this.end.set(cell.range.end);
-        this.hover.set(null);
-        this.shownMonth.set(cell.range.start.slice(0, MONTH_LEN));
-    }
-    /** Клавиша сетки: фокус переходит на день, и месяцы листаются, если он ушёл за показанные. */
-    onGridKey(event) {
-        const next = rtDateGridKey(event.key, event.day.key, this.#firstDay(), this.min(), this.max());
-        if (next === null) {
-            return;
-        }
-        const month = next.slice(0, MONTH_LEN);
-        if (!this.#shown().includes(month)) {
-            const before = Number(month.replace('-', '')) < Number(this.shownMonth().replace('-', ''));
-            this.shownMonth.set(before ? month : rtDateAddMonths(month, 1 - this.#shown().length));
-        }
-        this.activeKey.set(next);
-        this.hover.set(next);
-    }
-    page(delta) {
-        this.shownMonth.set(rtDateAddMonths(this.shownMonth(), delta));
-    }
-    reset() {
-        this.start.set(null);
-        this.end.set(null);
-        this.hover.set(null);
-    }
-    /** «Применить»: готовый черновик уходит значением, панель закрывается. */
-    apply() {
-        const draft = this.draft();
-        if (draft !== null) {
-            this.picked.emit(draft);
-            this.closed.emit();
-        }
-    }
-    /** Показанные месяцы `YYYY-MM`: два рядом, в шторке — один. */
-    #shown() {
-        const first = this.shownMonth();
-        return this.sheet() ? [first] : [first, rtDateAddMonths(first, 1)];
-    }
-    #lastShown() {
-        const shown = this.#shown();
-        return shown[shown.length - 1];
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtDateRangePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtDateRangePanelComponent, isStandalone: true, selector: "rt-date-range-panel", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, sheet: { classPropertyName: "sheet", publicName: "sheet", isSignal: true, isRequired: false, transformFunction: null }, now: { classPropertyName: "now", publicName: "now", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { picked: "picked", closed: "closed" }, host: { listeners: { "keydown.escape": "closed.emit()" }, properties: { "class.rt-date-range-panel--sheet": "sheet()" }, classAttribute: "rt-date-range-panel" }, ngImport: i0, template: "<ng-container rtBlock=\"rt-date-range-panel\">\n    @if (sheet()) {\n        <p rtElem=\"title\" qa-dataid=\"date-range-title\">{{ t().uiPeriod }}</p>\n    }\n\n    <div rtElem=\"body\">\n        <div rtElem=\"presets\" qa-dataid=\"date-range-presets\" role=\"group\" [attr.aria-label]=\"t().uiQuickRanges\">\n            @for (item of presets(); track item.cell.preset) {\n                <button\n                    rtButton\n                    rtElem=\"preset\"\n                    qa-dataid=\"date-range-preset\"\n                    type=\"button\"\n                    size=\"sm\"\n                    [theme]=\"item.chosen ? 'primary' : 'secondary'\"\n                    [appearance]=\"sheet() ? 'outlined' : 'text'\"\n                    [attr.data-preset]=\"item.cell.preset\"\n                    [label]=\"item.label\"\n                    [attr.aria-label]=\"item.label\"\n                    [pressed]=\"item.chosen\"\n                    [disabled]=\"item.cell.disabled\"\n                    (click)=\"pickPreset(item.cell)\"></button>\n            }\n        </div>\n\n        <rt-calendar\n            rtElem=\"calendar\"\n            qa-dataid=\"date-range-calendar\"\n            grid\n            [months]=\"months()\"\n            [weekdayLabels]=\"weekdays()\"\n            [canPrev]=\"canPrev()\"\n            [canNext]=\"canNext()\"\n            [activeKey]=\"activeKey()\"\n            [prevAriaLabel]=\"t().uiPrevMonth\"\n            [nextAriaLabel]=\"t().uiNextMonth\"\n            (prevMonth)=\"page(-1)\"\n            (nextMonth)=\"page(1)\"\n            (dayClick)=\"pickDay($event)\"\n            (dayHover)=\"onHover($event)\"\n            (gridKey)=\"onGridKey($event)\" />\n    </div>\n\n    <div rtElem=\"footer\">\n        <span rtElem=\"summary\" qa-dataid=\"date-range-summary\" aria-live=\"polite\">{{ summary() }}</span>\n        <button\n            rtButton\n            qa-dataid=\"date-range-reset\"\n            theme=\"primary\"\n            appearance=\"text\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiReset\"\n            [attr.aria-label]=\"t().uiReset\"\n            (click)=\"reset()\"></button>\n        <button\n            rtButton\n            qa-dataid=\"date-range-apply\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiApply\"\n            [attr.aria-label]=\"t().uiApply\"\n            [disabled]=\"draft() === null\"\n            (click)=\"apply()\"></button>\n    </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range-panel{--rt-date-range-panel-sheet-day-size: calc(var(--rt-size-10) + var(--rt-size-1));--rt-date-range-panel-divider-width: var(--rt-border-width-thin);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-range-panel__title{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-lg);font-weight:var(--rt-font-weight-semibold);text-align:center}.rt-date-range-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-range-panel__presets{display:flex;flex:0 0 auto;flex-direction:column;align-self:stretch;padding-right:var(--rt-space-4);border-right:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-1)}.rt-date-range-panel__preset{justify-content:flex-start;white-space:nowrap}.rt-date-range-panel .rt-date-range-panel__calendar{--rt-calendar-day-justify: center;--rt-calendar-column-gap: 0;--rt-calendar-range-inner-radius: 0;flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 14 + var(--rt-space-6))}.rt-date-range-panel__footer{display:flex;align-items:center;padding-top:var(--rt-space-2);border-top:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-range-panel__summary{flex:1 1 auto;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-date-range-panel--sheet{padding-inline:0}.rt-date-range-panel--sheet .rt-date-range-panel__body{flex-direction:column;align-items:stretch}.rt-date-range-panel--sheet .rt-date-range-panel__presets{flex-direction:row;padding-right:0;padding-bottom:var(--rt-space-1);border-right:none;gap:var(--rt-space-2);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.rt-date-range-panel--sheet .rt-date-range-panel__preset{flex:0 0 auto}.rt-date-range-panel--sheet .rt-date-range-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-size: var(--rt-date-range-panel-sheet-day-size);min-inline-size:0}}\n"], dependencies: [{ kind: "directive", type: 
-                // rt-tools
-                BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: 
-                // components
-                RtButtonDirective, selector: "button[rtButton], a[rtButton]", inputs: ["label", "icon", "iconPos", "theme", "appearance", "size", "loading", "loadingIcon", "loadingLabel", "pressed"] }, { kind: "component", type: RtCalendarComponent, selector: "rt-calendar", inputs: ["months", "weekdayLabels", "canPrev", "canNext", "prevAriaLabel", "nextAriaLabel", "sublabelsLoading", "grid", "activeKey", "titleAction", "headerTitle"], outputs: ["prevMonth", "nextMonth", "dayClick", "gridKey", "titleClick", "dayHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtDateRangePanelComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'rt-date-range-panel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
-                        // rt-tools
-                        BlockDirective,
-                        ElemDirective,
-                        // components
-                        RtButtonDirective,
-                        RtCalendarComponent,
-                    ], host: {
-                        class: BEM_BLOCK$1,
-                        '[class.rt-date-range-panel--sheet]': 'sheet()',
-                        '(keydown.escape)': 'closed.emit()',
-                    }, template: "<ng-container rtBlock=\"rt-date-range-panel\">\n    @if (sheet()) {\n        <p rtElem=\"title\" qa-dataid=\"date-range-title\">{{ t().uiPeriod }}</p>\n    }\n\n    <div rtElem=\"body\">\n        <div rtElem=\"presets\" qa-dataid=\"date-range-presets\" role=\"group\" [attr.aria-label]=\"t().uiQuickRanges\">\n            @for (item of presets(); track item.cell.preset) {\n                <button\n                    rtButton\n                    rtElem=\"preset\"\n                    qa-dataid=\"date-range-preset\"\n                    type=\"button\"\n                    size=\"sm\"\n                    [theme]=\"item.chosen ? 'primary' : 'secondary'\"\n                    [appearance]=\"sheet() ? 'outlined' : 'text'\"\n                    [attr.data-preset]=\"item.cell.preset\"\n                    [label]=\"item.label\"\n                    [attr.aria-label]=\"item.label\"\n                    [pressed]=\"item.chosen\"\n                    [disabled]=\"item.cell.disabled\"\n                    (click)=\"pickPreset(item.cell)\"></button>\n            }\n        </div>\n\n        <rt-calendar\n            rtElem=\"calendar\"\n            qa-dataid=\"date-range-calendar\"\n            grid\n            [months]=\"months()\"\n            [weekdayLabels]=\"weekdays()\"\n            [canPrev]=\"canPrev()\"\n            [canNext]=\"canNext()\"\n            [activeKey]=\"activeKey()\"\n            [prevAriaLabel]=\"t().uiPrevMonth\"\n            [nextAriaLabel]=\"t().uiNextMonth\"\n            (prevMonth)=\"page(-1)\"\n            (nextMonth)=\"page(1)\"\n            (dayClick)=\"pickDay($event)\"\n            (dayHover)=\"onHover($event)\"\n            (gridKey)=\"onGridKey($event)\" />\n    </div>\n\n    <div rtElem=\"footer\">\n        <span rtElem=\"summary\" qa-dataid=\"date-range-summary\" aria-live=\"polite\">{{ summary() }}</span>\n        <button\n            rtButton\n            qa-dataid=\"date-range-reset\"\n            theme=\"primary\"\n            appearance=\"text\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiReset\"\n            [attr.aria-label]=\"t().uiReset\"\n            (click)=\"reset()\"></button>\n        <button\n            rtButton\n            qa-dataid=\"date-range-apply\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiApply\"\n            [attr.aria-label]=\"t().uiApply\"\n            [disabled]=\"draft() === null\"\n            (click)=\"apply()\"></button>\n    </div>\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range-panel{--rt-date-range-panel-sheet-day-size: calc(var(--rt-size-10) + var(--rt-size-1));--rt-date-range-panel-divider-width: var(--rt-border-width-thin);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-range-panel__title{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-lg);font-weight:var(--rt-font-weight-semibold);text-align:center}.rt-date-range-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-range-panel__presets{display:flex;flex:0 0 auto;flex-direction:column;align-self:stretch;padding-right:var(--rt-space-4);border-right:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-1)}.rt-date-range-panel__preset{justify-content:flex-start;white-space:nowrap}.rt-date-range-panel .rt-date-range-panel__calendar{--rt-calendar-day-justify: center;--rt-calendar-column-gap: 0;--rt-calendar-range-inner-radius: 0;flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 14 + var(--rt-space-6))}.rt-date-range-panel__footer{display:flex;align-items:center;padding-top:var(--rt-space-2);border-top:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-range-panel__summary{flex:1 1 auto;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-date-range-panel--sheet{padding-inline:0}.rt-date-range-panel--sheet .rt-date-range-panel__body{flex-direction:column;align-items:stretch}.rt-date-range-panel--sheet .rt-date-range-panel__presets{flex-direction:row;padding-right:0;padding-bottom:var(--rt-space-1);border-right:none;gap:var(--rt-space-2);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.rt-date-range-panel--sheet .rt-date-range-panel__preset{flex:0 0 auto}.rt-date-range-panel--sheet .rt-date-range-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-size: var(--rt-date-range-panel-sheet-day-size);min-inline-size:0}}\n"] }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], sheet: [{ type: i0.Input, args: [{ isSignal: true, alias: "sheet", required: false }] }], now: [{ type: i0.Input, args: [{ isSignal: true, alias: "now", required: false }] }], picked: [{ type: i0.Output, args: ["picked"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
-
-const BEM_BLOCK = 'rt-date-range';
-/**
- * Поле диапазона дат со своей панелью кита, визуально и по токенам идентичное rt-input (host — box
- * `--rt-input-*`, input — прозрачный `__field`). Кнопка в конце поля открывает
- * `rt-date-range-panel`: на широком экране в поповере, на узком — в нижней шторке. CVA через общий
- * `RtFormControlBase`: clearable, авто-подсветка invalid, read-only представление.
- *
- * `value` — пара дней `{ start, end }` в форме `YYYY-MM-DD` или `null`. Текст в поле — две даты в
- * порядке языка интерфейса через тире (`12.10.2026 — 15.10.2026` под `ru`); набирается так же.
- * Нечитаемый или лежащий за границами текст оставляет значение прежним и помечает поле ошибкой.
- */
-class RtDateRangeComponent extends RtFormControlBase {
-    constructor() {
-        super(...arguments);
-        /** Локаль кита: приложение, меняющее язык на ходу, меняет её, и текст поля пересчитывается. */
-        this.#locale = inject(RT_KIT_LOCALE);
-        /** Порядок дня, месяца и года в тексте поля — по локали кита. */
-        this.#layout = computed(() => rtDateLayout(this.#locale()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "#layout" }] : /* istanbul ignore next */ []));
-        this.t = inject(RT_KIT_LABELS);
-        /** Узкий экран: панель открывается в нижней шторке, а не в поповере. */
-        this.narrow = inject(BreakpointsService).narrow;
-        this.fieldEl = viewChild('fieldEl', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "fieldEl" }] : /* istanbul ignore next */ []));
-        this.popover = viewChild(RtPopoverDirective, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "popover" }] : /* istanbul ignore next */ []));
-        /** Набранный текст не читается как диапазон в границах: поле помечено ошибкой. */
-        this.textInvalid = signal(false, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "textInvalid" }] : /* istanbul ignore next */ []));
-        this.sheetOpen = signal(false, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "sheetOpen" }] : /* istanbul ignore next */ []));
-        /** Подсказка формы текста буквами кита: `дд.мм.гггг — дд.мм.гггг` под русскими метками. */
-        this.shape = computed(() => {
-            const labels = this.t();
-            return rtRangeShape(this.#layout(), {
-                day: labels.uiShapeDay,
-                month: labels.uiShapeMonth,
-                year: labels.uiShapeYear,
-                hour: labels.uiShapeHour,
-                minute: labels.uiShapeMinute,
-            });
-        }, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
-        /** Значение, прочитанное из формы: не пара дней по порядку поле показывает пустой. */
-        this.range = computed(() => rtRangeRead(this.value()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
-        this.text = computed(() => rtRangeText(this.range(), this.#layout()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
-        this.hasValue = computed(() => this.range() !== null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
-        /** Ширина поля в знаках — по длине формы значения, как у поля даты. */
-        this.fieldSize = computed(() => this.shape().length, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "fieldSize" }] : /* istanbul ignore next */ []));
-        /** Подсказка обрезается многоточием в узком поле, поэтому шаблон целиком виден при наведении. */
-        this.shapeTitle = computed(() => (this.hasValue() ? null : this.shape()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "shapeTitle" }] : /* istanbul ignore next */ []));
-        /** Вид рамки: `outline` — рамка со всех сторон, `fill` — залитое поле с чертой снизу. */
-        this.appearance = input('outline', /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
-        this.displayText = computed(() => this.#format(this.range()), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "displayText" }] : /* istanbul ignore next */ []));
-        /** Первый допустимый день `YYYY-MM-DD`. */
-        this.min = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-        /** Последний допустимый день `YYYY-MM-DD`. */
-        this.max = input(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    }
-    /** Локаль кита: приложение, меняющее язык на ходу, меняет её, и текст поля пересчитывается. */
-    #locale;
-    /** Порядок дня, месяца и года в тексте поля — по локали кита. */
-    #layout;
-    /** Значение из формы снимает ошибку набора: в поле теперь стоит оно. */
-    writeValue(value) {
-        super.writeValue(value);
-        this.textInvalid.set(false);
-    }
-    getEmptyValue() {
-        return null;
-    }
-    focusAfterClear() {
-        this.fieldEl()?.nativeElement.focus();
-    }
-    clearValue() {
-        super.clearValue();
-        this.#accept(null);
-    }
-    /** Набор текста: значение меняется, только когда текст читается как диапазон в границах. */
-    onTyped(event) {
-        const text = event.target.value;
-        if (text.trim() === '') {
-            this.#commit(null);
-            return;
-        }
-        const read = rtRangeParse(text, this.#layout());
-        if (read === null || !rtRangeInBounds(read, this.min(), this.max())) {
-            this.textInvalid.set(true);
-            return;
-        }
-        this.#commit(read);
-    }
-    /** Кнопка в конце поля: на узком экране открывает шторку, на широком поповер открывает сам. */
-    openPanel() {
-        if (this.narrow() && !this.isDisabled()) {
-            this.sheetOpen.set(true);
-        }
-    }
-    closePanel() {
-        this.sheetOpen.set(false);
-        this.popover()?.close();
-    }
-    onPicked(value) {
-        this.#commit(value);
-        this.markTouched();
-    }
-    onBlur() {
-        this.markTouched();
-    }
-    #commit(value) {
-        this.value.set(value);
-        this.emitChange(value);
-        this.#accept(value);
-    }
-    /** Текст в поле — принятое значение, ошибки набора нет. */
-    #accept(value) {
-        this.textInvalid.set(false);
-        const node = this.fieldEl()?.nativeElement;
-        if (node !== undefined) {
-            node.value = rtRangeText(value, this.#layout());
-        }
-    }
-    /** Плоский текст для режима чтения: диапазон по локали, `15 – 20 мар. 2026 г.` под `ru`. */
-    #format(range) {
-        if (range === null) {
-            return '';
-        }
-        return new Intl.DateTimeFormat(this.#locale(), { dateStyle: 'medium', timeZone: 'UTC' }).formatRange(Date.parse(range.start), Date.parse(range.end));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtDateRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: RtDateRangeComponent, isStandalone: true, selector: "rt-date-range", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.rt-date-range--disabled": "isDisabled()", "class.rt-date-range--invalid": "isInvalid() || textInvalid()", "class.rt-date-range--readonly": "isReadonly()", "class.rt-date-range--borderless": "!bordered()", "class.rt-date-range--appearance--fill": "appearance() === 'fill'", "class.rt-date-range--size--sm": "size() === 'sm'", "class.rt-date-range--size--lg": "size() === 'lg'" }, classAttribute: "rt-date-range" }, providers: [
-            // Алиас базового токена — для contentChild(RtFormControlBase) в rt-field.
-            { provide: RtFormControlBase, useExisting: forwardRef(() => RtDateRangeComponent) },
-        ], viewQueries: [{ propertyName: "fieldEl", first: true, predicate: ["fieldEl"], descendants: true, isSignal: true }, { propertyName: "popover", first: true, predicate: RtPopoverDirective, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.RtRadiusDirective, inputs: ["radius", "radius"] }], ngImport: i0, template: "<ng-container rtBlock=\"rt-date-range\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"date-range-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '\u2014' }}</span>\n    } @else {\n        <input\n            #fieldEl\n            rtElem=\"field\"\n            qa-dataid=\"date-range-control\"\n            type=\"text\"\n            autocomplete=\"off\"\n            spellcheck=\"false\"\n            [value]=\"text()\"\n            [disabled]=\"isDisabled()\"\n            [attr.placeholder]=\"shape()\"\n            [attr.title]=\"shapeTitle()\"\n            [attr.size]=\"fieldSize()\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-invalid]=\"isInvalid() || textInvalid() || null\"\n            (input)=\"onTyped($event)\"\n            (blur)=\"onBlur()\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"date-range-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"-1\"\n                (clicked)=\"clear($event)\" />\n        }\n        <rt-icon-button\n            rtElem=\"open\"\n            qa-dataid=\"date-range-open\"\n            icon=\"ico-calendar\"\n            size=\"sm\"\n            variant=\"ghost\"\n            iconColor=\"muted\"\n            rtPopoverAlign=\"end\"\n            [ariaLabel]=\"t().uiOpenCalendar\"\n            [disabled]=\"isDisabled()\"\n            [rtPopover]=\"panelTpl\"\n            [rtPopoverDisabled]=\"narrow() || isDisabled()\"\n            (clicked)=\"openPanel()\" />\n\n        <ng-template #panelTpl>\n            <div rtElem=\"popup\" qa-dataid=\"date-range-popup\">\n                <rt-date-range-panel [value]=\"range()\" [min]=\"min()\" [max]=\"max()\" (picked)=\"onPicked($event)\" (closed)=\"closePanel()\" />\n            </div>\n        </ng-template>\n\n        @if (narrow()) {\n            <rt-bottom-sheet qa-dataid=\"date-range-sheet\" [open]=\"sheetOpen()\" (openChange)=\"sheetOpen.set($event)\">\n                @if (sheetOpen()) {\n                    <rt-date-range-panel\n                        sheet\n                        [value]=\"range()\"\n                        [min]=\"min()\"\n                        [max]=\"max()\"\n                        (picked)=\"onPicked($event)\"\n                        (closed)=\"closePanel()\" />\n                }\n            </rt-bottom-sheet>\n        }\n    }\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range{--rt-date-range-radius: var(--rt-input-radius);--rt-date-range-fill-radius: var(--rt-radius-sm);position:relative;display:inline-flex;width:100%;min-height:var(--rt-input-height);box-sizing:border-box;align-items:center;padding:var(--rt-input-padding-y) var(--rt-input-padding-x);border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-date-range-radius);background-color:var(--rt-input-color-bg);color:var(--rt-input-color-text);cursor:text;font-size:var(--rt-input-font-size);gap:var(--rt-space-sm);line-height:var(--rt-input-line-height);transition:var(--rt-input-transition)}.rt-date-range:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow);outline:2px solid transparent;outline-offset:var(--rt-input-focus-outline-offset)}.rt-date-range--borderless{border-color:transparent}.rt-date-range--appearance--fill{border-color:transparent;border-radius:var(--rt-date-range-fill-radius) var(--rt-date-range-fill-radius) 0 0;border-bottom-color:var(--rt-color-field-fill-underline);background-color:var(--rt-color-bg-surface-subtle-2)}.rt-date-range--invalid{border-color:var(--rt-input-color-border-error)}.rt-date-range--invalid:focus-within{box-shadow:var(--rt-input-focus-shadow-error)}.rt-date-range--disabled{cursor:not-allowed;opacity:var(--rt-input-disabled-opacity)}.rt-date-range--size--sm{min-height:var(--rt-input-height-sm)}.rt-date-range--size--lg{min-height:var(--rt-input-height-lg)}.rt-date-range--readonly{padding-right:0;padding-left:0;border-color:transparent;background-color:transparent;cursor:default}.rt-date-range__readonly{color:var(--rt-field-value-color);font-size:var(--rt-field-value-font-size)}.rt-date-range__readonly--empty{color:var(--rt-field-value-empty-color)}.rt-date-range__field{min-width:0;flex:1 1 auto;padding:0;border:none;background:transparent;color:inherit;font:inherit;outline:none;text-overflow:ellipsis}.rt-date-range__field:disabled{cursor:not-allowed}.rt-date-range__clear,.rt-date-range__open{flex-shrink:0}.rt-date-range__popup{border:var(--rt-overlay-select-panel-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-overlay-select-radius);background-color:var(--rt-color-bg-surface);box-shadow:var(--rt-overlay-select-shadow)}.rt-date-range[data-rt-radius=none]{--rt-date-range-radius: var(--rt-radius-none)}.rt-date-range[data-rt-radius=xs]{--rt-date-range-radius: var(--rt-radius-xs)}.rt-date-range[data-rt-radius=sm]{--rt-date-range-radius: var(--rt-radius-sm)}.rt-date-range[data-rt-radius=ms]{--rt-date-range-radius: var(--rt-radius-ms)}.rt-date-range[data-rt-radius=md]{--rt-date-range-radius: var(--rt-radius-md)}.rt-date-range[data-rt-radius=lg]{--rt-date-range-radius: var(--rt-radius-lg)}.rt-date-range[data-rt-radius=xl]{--rt-date-range-radius: var(--rt-radius-xl)}.rt-date-range[data-rt-radius=\"2xl\"]{--rt-date-range-radius: var(--rt-radius-2xl)}.rt-date-range[data-rt-radius=full]{--rt-date-range-radius: var(--rt-radius-full)}}\n"], dependencies: [{ kind: "component", type: 
-                // standalone components / directives
-                RtBottomSheetComponent, selector: "rt-bottom-sheet", inputs: ["open"], outputs: ["openChange"] }, { kind: "component", type: RtDateRangePanelComponent, selector: "rt-date-range-panel", inputs: ["value", "min", "max", "sheet", "now"], outputs: ["picked", "closed"] }, { kind: "component", type: RtIconButtonComponent, selector: "rt-icon-button", inputs: ["icon", "glyph", "ariaLabel", "variant", "iconColor", "iconFill", "size", "iconSize", "type", "tooltip", "tabIndex", "loading", "disabled", "active", "indicator"], outputs: ["clicked"] }, { kind: "directive", type: RtPopoverDirective, selector: "[rtPopover]", inputs: ["rtPopover", "rtPopoverTrigger", "rtPopoverWidth", "rtPopoverAlign", "rtPopoverFitViewport", "rtPopoverContext", "rtPopoverPanelClass", "rtPopoverDisabled", "rtPopoverOffsetY", "rtPopoverOffsetX"], outputs: ["rtPopoverOpened", "rtPopoverClosed"], exportAs: ["rtPopover"] }, { kind: "directive", type: BlockDirective, selector: "[rtBlock]", inputs: ["rtMod"] }, { kind: "directive", type: ElemDirective, selector: "[rtElem]", inputs: ["rtMod"] }, { kind: "directive", type: ModDirective, selector: "[rtMod]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: RtDateRangeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'rt-date-range', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
-                        // standalone components / directives
-                        RtBottomSheetComponent,
-                        RtDateRangePanelComponent,
-                        RtIconButtonComponent,
-                        RtPopoverDirective,
-                        BlockDirective,
-                        ElemDirective,
-                        ModDirective,
-                    ], providers: [
-                        // Алиас базового токена — для contentChild(RtFormControlBase) в rt-field.
-                        { provide: RtFormControlBase, useExisting: forwardRef(() => RtDateRangeComponent) },
-                    ], hostDirectives: [{ directive: RtRadiusDirective, inputs: ['radius'] }], host: {
-                        class: BEM_BLOCK,
-                        '[class.rt-date-range--disabled]': 'isDisabled()',
-                        '[class.rt-date-range--invalid]': 'isInvalid() || textInvalid()',
-                        '[class.rt-date-range--readonly]': 'isReadonly()',
-                        '[class.rt-date-range--borderless]': '!bordered()',
-                        '[class.rt-date-range--appearance--fill]': "appearance() === 'fill'",
-                        '[class.rt-date-range--size--sm]': "size() === 'sm'",
-                        '[class.rt-date-range--size--lg]': "size() === 'lg'",
-                    }, template: "<ng-container rtBlock=\"rt-date-range\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"date-range-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '\u2014' }}</span>\n    } @else {\n        <input\n            #fieldEl\n            rtElem=\"field\"\n            qa-dataid=\"date-range-control\"\n            type=\"text\"\n            autocomplete=\"off\"\n            spellcheck=\"false\"\n            [value]=\"text()\"\n            [disabled]=\"isDisabled()\"\n            [attr.placeholder]=\"shape()\"\n            [attr.title]=\"shapeTitle()\"\n            [attr.size]=\"fieldSize()\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-invalid]=\"isInvalid() || textInvalid() || null\"\n            (input)=\"onTyped($event)\"\n            (blur)=\"onBlur()\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"date-range-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"-1\"\n                (clicked)=\"clear($event)\" />\n        }\n        <rt-icon-button\n            rtElem=\"open\"\n            qa-dataid=\"date-range-open\"\n            icon=\"ico-calendar\"\n            size=\"sm\"\n            variant=\"ghost\"\n            iconColor=\"muted\"\n            rtPopoverAlign=\"end\"\n            [ariaLabel]=\"t().uiOpenCalendar\"\n            [disabled]=\"isDisabled()\"\n            [rtPopover]=\"panelTpl\"\n            [rtPopoverDisabled]=\"narrow() || isDisabled()\"\n            (clicked)=\"openPanel()\" />\n\n        <ng-template #panelTpl>\n            <div rtElem=\"popup\" qa-dataid=\"date-range-popup\">\n                <rt-date-range-panel [value]=\"range()\" [min]=\"min()\" [max]=\"max()\" (picked)=\"onPicked($event)\" (closed)=\"closePanel()\" />\n            </div>\n        </ng-template>\n\n        @if (narrow()) {\n            <rt-bottom-sheet qa-dataid=\"date-range-sheet\" [open]=\"sheetOpen()\" (openChange)=\"sheetOpen.set($event)\">\n                @if (sheetOpen()) {\n                    <rt-date-range-panel\n                        sheet\n                        [value]=\"range()\"\n                        [min]=\"min()\"\n                        [max]=\"max()\"\n                        (picked)=\"onPicked($event)\"\n                        (closed)=\"closePanel()\" />\n                }\n            </rt-bottom-sheet>\n        }\n    }\n</ng-container>\n", styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range{--rt-date-range-radius: var(--rt-input-radius);--rt-date-range-fill-radius: var(--rt-radius-sm);position:relative;display:inline-flex;width:100%;min-height:var(--rt-input-height);box-sizing:border-box;align-items:center;padding:var(--rt-input-padding-y) var(--rt-input-padding-x);border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-date-range-radius);background-color:var(--rt-input-color-bg);color:var(--rt-input-color-text);cursor:text;font-size:var(--rt-input-font-size);gap:var(--rt-space-sm);line-height:var(--rt-input-line-height);transition:var(--rt-input-transition)}.rt-date-range:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow);outline:2px solid transparent;outline-offset:var(--rt-input-focus-outline-offset)}.rt-date-range--borderless{border-color:transparent}.rt-date-range--appearance--fill{border-color:transparent;border-radius:var(--rt-date-range-fill-radius) var(--rt-date-range-fill-radius) 0 0;border-bottom-color:var(--rt-color-field-fill-underline);background-color:var(--rt-color-bg-surface-subtle-2)}.rt-date-range--invalid{border-color:var(--rt-input-color-border-error)}.rt-date-range--invalid:focus-within{box-shadow:var(--rt-input-focus-shadow-error)}.rt-date-range--disabled{cursor:not-allowed;opacity:var(--rt-input-disabled-opacity)}.rt-date-range--size--sm{min-height:var(--rt-input-height-sm)}.rt-date-range--size--lg{min-height:var(--rt-input-height-lg)}.rt-date-range--readonly{padding-right:0;padding-left:0;border-color:transparent;background-color:transparent;cursor:default}.rt-date-range__readonly{color:var(--rt-field-value-color);font-size:var(--rt-field-value-font-size)}.rt-date-range__readonly--empty{color:var(--rt-field-value-empty-color)}.rt-date-range__field{min-width:0;flex:1 1 auto;padding:0;border:none;background:transparent;color:inherit;font:inherit;outline:none;text-overflow:ellipsis}.rt-date-range__field:disabled{cursor:not-allowed}.rt-date-range__clear,.rt-date-range__open{flex-shrink:0}.rt-date-range__popup{border:var(--rt-overlay-select-panel-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-overlay-select-radius);background-color:var(--rt-color-bg-surface);box-shadow:var(--rt-overlay-select-shadow)}.rt-date-range[data-rt-radius=none]{--rt-date-range-radius: var(--rt-radius-none)}.rt-date-range[data-rt-radius=xs]{--rt-date-range-radius: var(--rt-radius-xs)}.rt-date-range[data-rt-radius=sm]{--rt-date-range-radius: var(--rt-radius-sm)}.rt-date-range[data-rt-radius=ms]{--rt-date-range-radius: var(--rt-radius-ms)}.rt-date-range[data-rt-radius=md]{--rt-date-range-radius: var(--rt-radius-md)}.rt-date-range[data-rt-radius=lg]{--rt-date-range-radius: var(--rt-radius-lg)}.rt-date-range[data-rt-radius=xl]{--rt-date-range-radius: var(--rt-radius-xl)}.rt-date-range[data-rt-radius=\"2xl\"]{--rt-date-range-radius: var(--rt-radius-2xl)}.rt-date-range[data-rt-radius=full]{--rt-date-range-radius: var(--rt-radius-full)}}\n"] }]
-        }], propDecorators: { fieldEl: [{ type: i0.ViewChild, args: ['fieldEl', { isSignal: true }] }], popover: [{ type: i0.ViewChild, args: [i0.forwardRef(() => RtPopoverDirective), { isSignal: true }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+var RtDateRangePanelComponent = class RtDateRangePanelComponent {
+	constructor() {
+		this.#locale = inject(RT_KIT_LOCALE);
+		this.#openedAt = /* @__PURE__ */ new Date();
+		this.#firstDay = computed(() => rtDateFirstDay(this.#locale()), ...ngDevMode ? [{ debugName: "#firstDay" }] : /* istanbul ignore next */ []);
+		this.t = inject(RT_KIT_LABELS);
+		this.weekdays = computed(() => rtDateWeekdays(this.#locale()), ...ngDevMode ? [{ debugName: "weekdays" }] : /* istanbul ignore next */ []);
+		this.today = computed(() => rtDateNow(this.now() ?? this.#openedAt, 1).day, ...ngDevMode ? [{ debugName: "today" }] : /* istanbul ignore next */ []);
+		this.start = linkedSignal(() => this.value()?.start ?? null, ...ngDevMode ? [{ debugName: "start" }] : /* istanbul ignore next */ []);
+		this.end = linkedSignal(() => this.value()?.end ?? null, ...ngDevMode ? [{ debugName: "end" }] : /* istanbul ignore next */ []);
+		this.hover = signal(null, ...ngDevMode ? [{ debugName: "hover" }] : /* istanbul ignore next */ []);
+		this.activeKey = signal(null, ...ngDevMode ? [{ debugName: "activeKey" }] : /* istanbul ignore next */ []);
+		this.shownMonth = linkedSignal(() => (this.value()?.start ?? this.today()).slice(0, MONTH_LEN), ...ngDevMode ? [{ debugName: "shownMonth" }] : /* istanbul ignore next */ []);
+		this.draft = computed(() => {
+			const start = this.start();
+			const end = this.end();
+			return start === null || end === null ? null : {
+				start,
+				end
+			};
+		}, ...ngDevMode ? [{ debugName: "draft" }] : /* istanbul ignore next */ []);
+		this.months = computed(() => {
+			const ctx = {
+				locale: this.#locale(),
+				today: this.today(),
+				start: this.start(),
+				end: this.end(),
+				hover: this.hover(),
+				min: this.min(),
+				max: this.max()
+			};
+			return this.#shown().map((month) => rtRangeMonth(month, ctx));
+		}, ...ngDevMode ? [{ debugName: "months" }] : /* istanbul ignore next */ []);
+		this.canPrev = computed(() => rtDateCanPage(this.shownMonth(), -1, this.min(), this.max()), ...ngDevMode ? [{ debugName: "canPrev" }] : /* istanbul ignore next */ []);
+		this.canNext = computed(() => rtDateCanPage(this.#lastShown(), 1, this.min(), this.max()), ...ngDevMode ? [{ debugName: "canNext" }] : /* istanbul ignore next */ []);
+		this.presets = computed(() => {
+			const labels = this.t();
+			const chosen = rtRangePresetOf(this.draft(), this.today());
+			return rtRangePresetCells(this.today(), this.min(), this.max()).map((cell) => ({
+				cell,
+				label: labels[PRESET_LABELS[cell.preset]],
+				chosen: cell.preset === chosen
+			}));
+		}, ...ngDevMode ? [{ debugName: "presets" }] : /* istanbul ignore next */ []);
+		this.daysText = rtKitLabel(computed(() => {
+			const draft = this.draft();
+			return draft === null ? "" : DAY_LABELS[rtRangePlural(rtRangeDays(draft), this.#locale())];
+		}), computed(() => {
+			const draft = this.draft();
+			return { count: draft === null ? 0 : rtRangeDays(draft) };
+		}));
+		this.summary = computed(() => {
+			const draft = this.draft();
+			if (draft === null) return this.start() === null ? this.t().uiPickStartDate : this.t().uiPickEndDate;
+			return this.sheet() ? this.daysText() : `${rtRangeDates(draft, this.#locale())} · ${this.daysText()}`;
+		}, ...ngDevMode ? [{ debugName: "summary" }] : /* istanbul ignore next */ []);
+		this.value = input(null, ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+		this.min = input(null, ...ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []);
+		this.max = input(null, ...ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []);
+		this.sheet = input(false, {
+			...ngDevMode ? { debugName: "sheet" } : /* istanbul ignore next */ {},
+			transform: booleanAttribute
+		});
+		this.now = input(null, ...ngDevMode ? [{ debugName: "now" }] : /* istanbul ignore next */ []);
+		this.picked = output();
+		this.closed = output();
+	}
+	#locale;
+	#openedAt;
+	#firstDay;
+	pickDay(day) {
+		this.activeKey.set(day.key);
+		const start = this.start();
+		if (start === null || this.end() !== null) {
+			this.start.set(day.key);
+			this.end.set(null);
+			return;
+		}
+		const range = rtRangeOrder(start, day.key);
+		this.start.set(range.start);
+		this.end.set(range.end);
+		this.hover.set(null);
+	}
+	onHover(day) {
+		this.hover.set(day?.key ?? null);
+	}
+	pickPreset(cell) {
+		if (cell.disabled) return;
+		this.start.set(cell.range.start);
+		this.end.set(cell.range.end);
+		this.hover.set(null);
+		this.shownMonth.set(cell.range.start.slice(0, MONTH_LEN));
+	}
+	onGridKey(event) {
+		const next = rtDateGridKey(event.key, event.day.key, this.#firstDay(), this.min(), this.max());
+		if (next === null) return;
+		const month = next.slice(0, MONTH_LEN);
+		if (!this.#shown().includes(month)) {
+			const before = Number(month.replace("-", "")) < Number(this.shownMonth().replace("-", ""));
+			this.shownMonth.set(before ? month : rtDateAddMonths(month, 1 - this.#shown().length));
+		}
+		this.activeKey.set(next);
+		this.hover.set(next);
+	}
+	page(delta) {
+		this.shownMonth.set(rtDateAddMonths(this.shownMonth(), delta));
+	}
+	reset() {
+		this.start.set(null);
+		this.end.set(null);
+		this.hover.set(null);
+	}
+	apply() {
+		const draft = this.draft();
+		if (draft !== null) {
+			this.picked.emit(draft);
+			this.closed.emit();
+		}
+	}
+	#shown() {
+		const first = this.shownMonth();
+		return this.sheet() ? [first] : [first, rtDateAddMonths(first, 1)];
+	}
+	#lastShown() {
+		const shown = this.#shown();
+		return shown[shown.length - 1];
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtDateRangePanelComponent,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: RtDateRangePanelComponent,
+			isStandalone: true,
+			selector: "rt-date-range-panel",
+			inputs: {
+				value: {
+					classPropertyName: "value",
+					publicName: "value",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				min: {
+					classPropertyName: "min",
+					publicName: "min",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				max: {
+					classPropertyName: "max",
+					publicName: "max",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				sheet: {
+					classPropertyName: "sheet",
+					publicName: "sheet",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				now: {
+					classPropertyName: "now",
+					publicName: "now",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: {
+				picked: "picked",
+				closed: "closed"
+			},
+			host: {
+				listeners: { "keydown.escape": "closed.emit()" },
+				properties: { "class.rt-date-range-panel--sheet": "sheet()" },
+				classAttribute: "rt-date-range-panel"
+			},
+			ngImport: i0,
+			template: "<ng-container rtBlock=\"rt-date-range-panel\">\n    @if (sheet()) {\n        <p rtElem=\"title\" qa-dataid=\"date-range-title\">{{ t().uiPeriod }}</p>\n    }\n\n    <div rtElem=\"body\">\n        <div rtElem=\"presets\" qa-dataid=\"date-range-presets\" role=\"group\" [attr.aria-label]=\"t().uiQuickRanges\">\n            @for (item of presets(); track item.cell.preset) {\n                <button\n                    rtButton\n                    rtElem=\"preset\"\n                    qa-dataid=\"date-range-preset\"\n                    type=\"button\"\n                    size=\"sm\"\n                    [theme]=\"item.chosen ? 'primary' : 'secondary'\"\n                    [appearance]=\"sheet() ? 'outlined' : 'text'\"\n                    [attr.data-preset]=\"item.cell.preset\"\n                    [label]=\"item.label\"\n                    [attr.aria-label]=\"item.label\"\n                    [pressed]=\"item.chosen\"\n                    [disabled]=\"item.cell.disabled\"\n                    (click)=\"pickPreset(item.cell)\"></button>\n            }\n        </div>\n\n        <rt-calendar\n            rtElem=\"calendar\"\n            qa-dataid=\"date-range-calendar\"\n            grid\n            [months]=\"months()\"\n            [weekdayLabels]=\"weekdays()\"\n            [canPrev]=\"canPrev()\"\n            [canNext]=\"canNext()\"\n            [activeKey]=\"activeKey()\"\n            [prevAriaLabel]=\"t().uiPrevMonth\"\n            [nextAriaLabel]=\"t().uiNextMonth\"\n            (prevMonth)=\"page(-1)\"\n            (nextMonth)=\"page(1)\"\n            (dayClick)=\"pickDay($event)\"\n            (dayHover)=\"onHover($event)\"\n            (gridKey)=\"onGridKey($event)\" />\n    </div>\n\n    <div rtElem=\"footer\">\n        <span rtElem=\"summary\" qa-dataid=\"date-range-summary\" aria-live=\"polite\">{{ summary() }}</span>\n        <button\n            rtButton\n            qa-dataid=\"date-range-reset\"\n            theme=\"primary\"\n            appearance=\"text\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiReset\"\n            [attr.aria-label]=\"t().uiReset\"\n            (click)=\"reset()\"></button>\n        <button\n            rtButton\n            qa-dataid=\"date-range-apply\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiApply\"\n            [attr.aria-label]=\"t().uiApply\"\n            [disabled]=\"draft() === null\"\n            (click)=\"apply()\"></button>\n    </div>\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range-panel{--rt-date-range-panel-sheet-day-size: calc(var(--rt-size-10) + var(--rt-size-1));--rt-date-range-panel-divider-width: var(--rt-border-width-thin);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-range-panel__title{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-lg);font-weight:var(--rt-font-weight-semibold);text-align:center}.rt-date-range-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-range-panel__presets{display:flex;flex:0 0 auto;flex-direction:column;align-self:stretch;padding-right:var(--rt-space-4);border-right:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-1)}.rt-date-range-panel__preset{justify-content:flex-start;white-space:nowrap}.rt-date-range-panel .rt-date-range-panel__calendar{--rt-calendar-day-justify: center;--rt-calendar-column-gap: 0;--rt-calendar-range-inner-radius: 0;flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 14 + var(--rt-space-6))}.rt-date-range-panel__footer{display:flex;align-items:center;padding-top:var(--rt-space-2);border-top:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-range-panel__summary{flex:1 1 auto;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-date-range-panel--sheet{padding-inline:0}.rt-date-range-panel--sheet .rt-date-range-panel__body{flex-direction:column;align-items:stretch}.rt-date-range-panel--sheet .rt-date-range-panel__presets{flex-direction:row;padding-right:0;padding-bottom:var(--rt-space-1);border-right:none;gap:var(--rt-space-2);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.rt-date-range-panel--sheet .rt-date-range-panel__preset{flex:0 0 auto}.rt-date-range-panel--sheet .rt-date-range-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-size: var(--rt-date-range-panel-sheet-day-size);min-inline-size:0}}\n"],
+			dependencies: [
+				{
+					kind: "directive",
+					type: BlockDirective,
+					selector: "[rtBlock]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: ElemDirective,
+					selector: "[rtElem]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: RtButtonDirective,
+					selector: "button[rtButton], a[rtButton]",
+					inputs: [
+						"label",
+						"icon",
+						"iconPos",
+						"theme",
+						"appearance",
+						"size",
+						"loading",
+						"loadingIcon",
+						"loadingLabel",
+						"pressed"
+					]
+				},
+				{
+					kind: "component",
+					type: RtCalendarComponent,
+					selector: "rt-calendar",
+					inputs: [
+						"months",
+						"weekdayLabels",
+						"canPrev",
+						"canNext",
+						"prevAriaLabel",
+						"nextAriaLabel",
+						"sublabelsLoading",
+						"grid",
+						"activeKey",
+						"titleAction",
+						"headerTitle"
+					],
+					outputs: [
+						"prevMonth",
+						"nextMonth",
+						"dayClick",
+						"gridKey",
+						"titleClick",
+						"dayHover"
+					]
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtDateRangePanelComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "rt-date-range-panel",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [
+				BlockDirective,
+				ElemDirective,
+				RtButtonDirective,
+				RtCalendarComponent
+			],
+			host: {
+				class: BEM_BLOCK$1,
+				"[class.rt-date-range-panel--sheet]": "sheet()",
+				"(keydown.escape)": "closed.emit()"
+			},
+			template: "<ng-container rtBlock=\"rt-date-range-panel\">\n    @if (sheet()) {\n        <p rtElem=\"title\" qa-dataid=\"date-range-title\">{{ t().uiPeriod }}</p>\n    }\n\n    <div rtElem=\"body\">\n        <div rtElem=\"presets\" qa-dataid=\"date-range-presets\" role=\"group\" [attr.aria-label]=\"t().uiQuickRanges\">\n            @for (item of presets(); track item.cell.preset) {\n                <button\n                    rtButton\n                    rtElem=\"preset\"\n                    qa-dataid=\"date-range-preset\"\n                    type=\"button\"\n                    size=\"sm\"\n                    [theme]=\"item.chosen ? 'primary' : 'secondary'\"\n                    [appearance]=\"sheet() ? 'outlined' : 'text'\"\n                    [attr.data-preset]=\"item.cell.preset\"\n                    [label]=\"item.label\"\n                    [attr.aria-label]=\"item.label\"\n                    [pressed]=\"item.chosen\"\n                    [disabled]=\"item.cell.disabled\"\n                    (click)=\"pickPreset(item.cell)\"></button>\n            }\n        </div>\n\n        <rt-calendar\n            rtElem=\"calendar\"\n            qa-dataid=\"date-range-calendar\"\n            grid\n            [months]=\"months()\"\n            [weekdayLabels]=\"weekdays()\"\n            [canPrev]=\"canPrev()\"\n            [canNext]=\"canNext()\"\n            [activeKey]=\"activeKey()\"\n            [prevAriaLabel]=\"t().uiPrevMonth\"\n            [nextAriaLabel]=\"t().uiNextMonth\"\n            (prevMonth)=\"page(-1)\"\n            (nextMonth)=\"page(1)\"\n            (dayClick)=\"pickDay($event)\"\n            (dayHover)=\"onHover($event)\"\n            (gridKey)=\"onGridKey($event)\" />\n    </div>\n\n    <div rtElem=\"footer\">\n        <span rtElem=\"summary\" qa-dataid=\"date-range-summary\" aria-live=\"polite\">{{ summary() }}</span>\n        <button\n            rtButton\n            qa-dataid=\"date-range-reset\"\n            theme=\"primary\"\n            appearance=\"text\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiReset\"\n            [attr.aria-label]=\"t().uiReset\"\n            (click)=\"reset()\"></button>\n        <button\n            rtButton\n            qa-dataid=\"date-range-apply\"\n            size=\"sm\"\n            type=\"button\"\n            [label]=\"t().uiApply\"\n            [attr.aria-label]=\"t().uiApply\"\n            [disabled]=\"draft() === null\"\n            (click)=\"apply()\"></button>\n    </div>\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range-panel{--rt-date-range-panel-sheet-day-size: calc(var(--rt-size-10) + var(--rt-size-1));--rt-date-range-panel-divider-width: var(--rt-border-width-thin);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-range-panel__title{margin:0;color:var(--rt-color-text-primary);font-size:var(--rt-text-lg);font-weight:var(--rt-font-weight-semibold);text-align:center}.rt-date-range-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-range-panel__presets{display:flex;flex:0 0 auto;flex-direction:column;align-self:stretch;padding-right:var(--rt-space-4);border-right:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-1)}.rt-date-range-panel__preset{justify-content:flex-start;white-space:nowrap}.rt-date-range-panel .rt-date-range-panel__calendar{--rt-calendar-day-justify: center;--rt-calendar-column-gap: 0;--rt-calendar-range-inner-radius: 0;flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 14 + var(--rt-space-6))}.rt-date-range-panel__footer{display:flex;align-items:center;padding-top:var(--rt-space-2);border-top:var(--rt-date-range-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-range-panel__summary{flex:1 1 auto;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm)}.rt-date-range-panel--sheet{padding-inline:0}.rt-date-range-panel--sheet .rt-date-range-panel__body{flex-direction:column;align-items:stretch}.rt-date-range-panel--sheet .rt-date-range-panel__presets{flex-direction:row;padding-right:0;padding-bottom:var(--rt-space-1);border-right:none;gap:var(--rt-space-2);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.rt-date-range-panel--sheet .rt-date-range-panel__preset{flex:0 0 auto}.rt-date-range-panel--sheet .rt-date-range-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-size: var(--rt-date-range-panel-sheet-day-size);min-inline-size:0}}\n"]
+		}]
+	}],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}],
+		min: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "min",
+				required: false
+			}]
+		}],
+		max: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "max",
+				required: false
+			}]
+		}],
+		sheet: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "sheet",
+				required: false
+			}]
+		}],
+		now: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "now",
+				required: false
+			}]
+		}],
+		picked: [{
+			type: i0.Output,
+			args: ["picked"]
+		}],
+		closed: [{
+			type: i0.Output,
+			args: ["closed"]
+		}]
+	}
+});
+const BEM_BLOCK = "rt-date-range";
+var RtDateRangeComponent = class RtDateRangeComponent extends RtFormControlBase {
+	constructor() {
+		super(...arguments);
+		this.#locale = inject(RT_KIT_LOCALE);
+		this.#layout = computed(() => rtDateLayout(this.#locale()), ...ngDevMode ? [{ debugName: "#layout" }] : /* istanbul ignore next */ []);
+		this.t = inject(RT_KIT_LABELS);
+		this.narrow = inject(BreakpointsService).narrow;
+		this.fieldEl = viewChild("fieldEl", ...ngDevMode ? [{ debugName: "fieldEl" }] : /* istanbul ignore next */ []);
+		this.popover = viewChild(RtPopoverDirective, ...ngDevMode ? [{ debugName: "popover" }] : /* istanbul ignore next */ []);
+		this.textInvalid = signal(false, ...ngDevMode ? [{ debugName: "textInvalid" }] : /* istanbul ignore next */ []);
+		this.sheetOpen = signal(false, ...ngDevMode ? [{ debugName: "sheetOpen" }] : /* istanbul ignore next */ []);
+		this.shape = computed(() => {
+			const labels = this.t();
+			return rtRangeShape(this.#layout(), {
+				day: labels.uiShapeDay,
+				month: labels.uiShapeMonth,
+				year: labels.uiShapeYear,
+				hour: labels.uiShapeHour,
+				minute: labels.uiShapeMinute
+			});
+		}, ...ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []);
+		this.range = computed(() => rtRangeRead(this.value()), ...ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []);
+		this.text = computed(() => rtRangeText(this.range(), this.#layout()), ...ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []);
+		this.hasValue = computed(() => this.range() !== null, ...ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []);
+		this.fieldSize = computed(() => this.shape().length, ...ngDevMode ? [{ debugName: "fieldSize" }] : /* istanbul ignore next */ []);
+		this.shapeTitle = computed(() => this.hasValue() ? null : this.shape(), ...ngDevMode ? [{ debugName: "shapeTitle" }] : /* istanbul ignore next */ []);
+		this.appearance = input("outline", ...ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []);
+		this.displayText = computed(() => this.#format(this.range()), ...ngDevMode ? [{ debugName: "displayText" }] : /* istanbul ignore next */ []);
+		this.min = input(null, ...ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []);
+		this.max = input(null, ...ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []);
+	}
+	#locale;
+	#layout;
+	writeValue(value) {
+		super.writeValue(value);
+		this.textInvalid.set(false);
+	}
+	getEmptyValue() {
+		return null;
+	}
+	focusAfterClear() {
+		this.fieldEl()?.nativeElement.focus();
+	}
+	clearValue() {
+		super.clearValue();
+		this.#accept(null);
+	}
+	onTyped(event) {
+		const text = event.target.value;
+		if (text.trim() === "") {
+			this.#commit(null);
+			return;
+		}
+		const read = rtRangeParse(text, this.#layout());
+		if (read === null || !rtRangeInBounds(read, this.min(), this.max())) {
+			this.textInvalid.set(true);
+			return;
+		}
+		this.#commit(read);
+	}
+	openPanel() {
+		if (this.narrow() && !this.isDisabled()) this.sheetOpen.set(true);
+	}
+	closePanel() {
+		this.sheetOpen.set(false);
+		this.popover()?.close();
+	}
+	onPicked(value) {
+		this.#commit(value);
+		this.markTouched();
+	}
+	onBlur() {
+		this.markTouched();
+	}
+	#commit(value) {
+		this.value.set(value);
+		this.emitChange(value);
+		this.#accept(value);
+	}
+	#accept(value) {
+		this.textInvalid.set(false);
+		const node = this.fieldEl()?.nativeElement;
+		if (node !== void 0) node.value = rtRangeText(value, this.#layout());
+	}
+	#format(range) {
+		if (range === null) return "";
+		return new Intl.DateTimeFormat(this.#locale(), {
+			dateStyle: "medium",
+			timeZone: "UTC"
+		}).formatRange(Date.parse(range.start), Date.parse(range.end));
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.2",
+			ngImport: i0,
+			type: RtDateRangeComponent,
+			deps: null,
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.2",
+			type: RtDateRangeComponent,
+			isStandalone: true,
+			selector: "rt-date-range",
+			inputs: {
+				appearance: {
+					classPropertyName: "appearance",
+					publicName: "appearance",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				min: {
+					classPropertyName: "min",
+					publicName: "min",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				max: {
+					classPropertyName: "max",
+					publicName: "max",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			host: {
+				properties: {
+					"class.rt-date-range--disabled": "isDisabled()",
+					"class.rt-date-range--invalid": "isInvalid() || textInvalid()",
+					"class.rt-date-range--readonly": "isReadonly()",
+					"class.rt-date-range--borderless": "!bordered()",
+					"class.rt-date-range--appearance--fill": "appearance() === 'fill'",
+					"class.rt-date-range--size--sm": "size() === 'sm'",
+					"class.rt-date-range--size--lg": "size() === 'lg'"
+				},
+				classAttribute: "rt-date-range"
+			},
+			providers: [{
+				provide: RtFormControlBase,
+				useExisting: forwardRef(() => RtDateRangeComponent)
+			}],
+			viewQueries: [{
+				propertyName: "fieldEl",
+				first: true,
+				predicate: ["fieldEl"],
+				descendants: true,
+				isSignal: true
+			}, {
+				propertyName: "popover",
+				first: true,
+				predicate: RtPopoverDirective,
+				descendants: true,
+				isSignal: true
+			}],
+			usesInheritance: true,
+			hostDirectives: [{
+				directive: i1.RtRadiusDirective,
+				inputs: ["radius", "radius"]
+			}],
+			ngImport: i0,
+			template: "<ng-container rtBlock=\"rt-date-range\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"date-range-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '—' }}</span>\n    } @else {\n        <input\n            #fieldEl\n            rtElem=\"field\"\n            qa-dataid=\"date-range-control\"\n            type=\"text\"\n            autocomplete=\"off\"\n            spellcheck=\"false\"\n            [value]=\"text()\"\n            [disabled]=\"isDisabled()\"\n            [attr.placeholder]=\"shape()\"\n            [attr.title]=\"shapeTitle()\"\n            [attr.size]=\"fieldSize()\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-invalid]=\"isInvalid() || textInvalid() || null\"\n            (input)=\"onTyped($event)\"\n            (blur)=\"onBlur()\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"date-range-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"-1\"\n                (clicked)=\"clear($event)\" />\n        }\n        <rt-icon-button\n            rtElem=\"open\"\n            qa-dataid=\"date-range-open\"\n            icon=\"ico-calendar\"\n            size=\"sm\"\n            variant=\"ghost\"\n            iconColor=\"muted\"\n            rtPopoverAlign=\"end\"\n            [ariaLabel]=\"t().uiOpenCalendar\"\n            [disabled]=\"isDisabled()\"\n            [rtPopover]=\"panelTpl\"\n            [rtPopoverDisabled]=\"narrow() || isDisabled()\"\n            (clicked)=\"openPanel()\" />\n\n        <ng-template #panelTpl>\n            <div rtElem=\"popup\" qa-dataid=\"date-range-popup\">\n                <rt-date-range-panel [value]=\"range()\" [min]=\"min()\" [max]=\"max()\" (picked)=\"onPicked($event)\" (closed)=\"closePanel()\" />\n            </div>\n        </ng-template>\n\n        @if (narrow()) {\n            <rt-bottom-sheet qa-dataid=\"date-range-sheet\" [open]=\"sheetOpen()\" (openChange)=\"sheetOpen.set($event)\">\n                @if (sheetOpen()) {\n                    <rt-date-range-panel\n                        sheet\n                        [value]=\"range()\"\n                        [min]=\"min()\"\n                        [max]=\"max()\"\n                        (picked)=\"onPicked($event)\"\n                        (closed)=\"closePanel()\" />\n                }\n            </rt-bottom-sheet>\n        }\n    }\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range{--rt-date-range-radius: var(--rt-input-radius);--rt-date-range-fill-radius: var(--rt-radius-sm);position:relative;display:inline-flex;width:100%;min-height:var(--rt-input-height);box-sizing:border-box;align-items:center;padding:var(--rt-input-padding-y) var(--rt-input-padding-x);border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-date-range-radius);background-color:var(--rt-input-color-bg);color:var(--rt-input-color-text);cursor:text;font-size:var(--rt-input-font-size);gap:var(--rt-space-sm);line-height:var(--rt-input-line-height);transition:var(--rt-input-transition)}.rt-date-range:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow);outline:2px solid transparent;outline-offset:var(--rt-input-focus-outline-offset)}.rt-date-range--borderless{border-color:transparent}.rt-date-range--appearance--fill{border-color:transparent;border-radius:var(--rt-date-range-fill-radius) var(--rt-date-range-fill-radius) 0 0;border-bottom-color:var(--rt-color-field-fill-underline);background-color:var(--rt-color-bg-surface-subtle-2)}.rt-date-range--invalid{border-color:var(--rt-input-color-border-error)}.rt-date-range--invalid:focus-within{box-shadow:var(--rt-input-focus-shadow-error)}.rt-date-range--disabled{cursor:not-allowed;opacity:var(--rt-input-disabled-opacity)}.rt-date-range--size--sm{min-height:var(--rt-input-height-sm)}.rt-date-range--size--lg{min-height:var(--rt-input-height-lg)}.rt-date-range--readonly{padding-right:0;padding-left:0;border-color:transparent;background-color:transparent;cursor:default}.rt-date-range__readonly{color:var(--rt-field-value-color);font-size:var(--rt-field-value-font-size)}.rt-date-range__readonly--empty{color:var(--rt-field-value-empty-color)}.rt-date-range__field{min-width:0;flex:1 1 auto;padding:0;border:none;background:transparent;color:inherit;font:inherit;outline:none;text-overflow:ellipsis}.rt-date-range__field:disabled{cursor:not-allowed}.rt-date-range__clear,.rt-date-range__open{flex-shrink:0}.rt-date-range__popup{border:var(--rt-overlay-select-panel-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-overlay-select-radius);background-color:var(--rt-color-bg-surface);box-shadow:var(--rt-overlay-select-shadow)}.rt-date-range[data-rt-radius=none]{--rt-date-range-radius: var(--rt-radius-none)}.rt-date-range[data-rt-radius=xs]{--rt-date-range-radius: var(--rt-radius-xs)}.rt-date-range[data-rt-radius=sm]{--rt-date-range-radius: var(--rt-radius-sm)}.rt-date-range[data-rt-radius=ms]{--rt-date-range-radius: var(--rt-radius-ms)}.rt-date-range[data-rt-radius=md]{--rt-date-range-radius: var(--rt-radius-md)}.rt-date-range[data-rt-radius=lg]{--rt-date-range-radius: var(--rt-radius-lg)}.rt-date-range[data-rt-radius=xl]{--rt-date-range-radius: var(--rt-radius-xl)}.rt-date-range[data-rt-radius=\"2xl\"]{--rt-date-range-radius: var(--rt-radius-2xl)}.rt-date-range[data-rt-radius=full]{--rt-date-range-radius: var(--rt-radius-full)}}\n"],
+			dependencies: [
+				{
+					kind: "component",
+					type: RtBottomSheetComponent,
+					selector: "rt-bottom-sheet",
+					inputs: ["open"],
+					outputs: ["openChange"]
+				},
+				{
+					kind: "component",
+					type: RtDateRangePanelComponent,
+					selector: "rt-date-range-panel",
+					inputs: [
+						"value",
+						"min",
+						"max",
+						"sheet",
+						"now"
+					],
+					outputs: ["picked", "closed"]
+				},
+				{
+					kind: "component",
+					type: RtIconButtonComponent,
+					selector: "rt-icon-button",
+					inputs: [
+						"icon",
+						"glyph",
+						"ariaLabel",
+						"variant",
+						"iconColor",
+						"iconFill",
+						"size",
+						"iconSize",
+						"type",
+						"tooltip",
+						"tooltipHideOnClick",
+						"tabIndex",
+						"loading",
+						"disabled",
+						"active",
+						"expanded",
+						"indicator"
+					],
+					outputs: ["clicked"]
+				},
+				{
+					kind: "directive",
+					type: RtPopoverDirective,
+					selector: "[rtPopover]",
+					inputs: [
+						"rtPopover",
+						"rtPopoverTrigger",
+						"rtPopoverWidth",
+						"rtPopoverAlign",
+						"rtPopoverFitViewport",
+						"rtPopoverContext",
+						"rtPopoverPanelClass",
+						"rtPopoverDisabled",
+						"rtPopoverOffsetY",
+						"rtPopoverOffsetX",
+						"rtPopoverPositions"
+					],
+					outputs: ["rtPopoverOpened", "rtPopoverClosed"],
+					exportAs: ["rtPopover"]
+				},
+				{
+					kind: "directive",
+					type: BlockDirective,
+					selector: "[rtBlock]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: ElemDirective,
+					selector: "[rtElem]",
+					inputs: ["rtMod"]
+				},
+				{
+					kind: "directive",
+					type: ModDirective,
+					selector: "[rtMod]"
+				}
+			],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RtDateRangeComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "rt-date-range",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [
+				RtBottomSheetComponent,
+				RtDateRangePanelComponent,
+				RtIconButtonComponent,
+				RtPopoverDirective,
+				BlockDirective,
+				ElemDirective,
+				ModDirective
+			],
+			providers: [{
+				provide: RtFormControlBase,
+				useExisting: forwardRef(() => RtDateRangeComponent)
+			}],
+			hostDirectives: [{
+				directive: RtRadiusDirective,
+				inputs: ["radius"]
+			}],
+			host: {
+				class: BEM_BLOCK,
+				"[class.rt-date-range--disabled]": "isDisabled()",
+				"[class.rt-date-range--invalid]": "isInvalid() || textInvalid()",
+				"[class.rt-date-range--readonly]": "isReadonly()",
+				"[class.rt-date-range--borderless]": "!bordered()",
+				"[class.rt-date-range--appearance--fill]": "appearance() === 'fill'",
+				"[class.rt-date-range--size--sm]": "size() === 'sm'",
+				"[class.rt-date-range--size--lg]": "size() === 'lg'"
+			},
+			template: "<ng-container rtBlock=\"rt-date-range\">\n    @if (isReadonly()) {\n        <span rtElem=\"readonly\" qa-dataid=\"date-range-readonly\" [rtMod]=\"{ empty: !displayText() }\">{{ displayText() || '—' }}</span>\n    } @else {\n        <input\n            #fieldEl\n            rtElem=\"field\"\n            qa-dataid=\"date-range-control\"\n            type=\"text\"\n            autocomplete=\"off\"\n            spellcheck=\"false\"\n            [value]=\"text()\"\n            [disabled]=\"isDisabled()\"\n            [attr.placeholder]=\"shape()\"\n            [attr.title]=\"shapeTitle()\"\n            [attr.size]=\"fieldSize()\"\n            [attr.id]=\"effectiveControlId()\"\n            [attr.aria-label]=\"ariaLabel()\"\n            [attr.aria-invalid]=\"isInvalid() || textInvalid() || null\"\n            (input)=\"onTyped($event)\"\n            (blur)=\"onBlur()\" />\n        @if (showClearButton()) {\n            <rt-icon-button\n                rtElem=\"clear\"\n                qa-dataid=\"date-range-clear\"\n                icon=\"ico-close\"\n                size=\"sm\"\n                variant=\"ghost\"\n                iconColor=\"muted\"\n                [ariaLabel]=\"t().uiClear\"\n                [tabIndex]=\"-1\"\n                (clicked)=\"clear($event)\" />\n        }\n        <rt-icon-button\n            rtElem=\"open\"\n            qa-dataid=\"date-range-open\"\n            icon=\"ico-calendar\"\n            size=\"sm\"\n            variant=\"ghost\"\n            iconColor=\"muted\"\n            rtPopoverAlign=\"end\"\n            [ariaLabel]=\"t().uiOpenCalendar\"\n            [disabled]=\"isDisabled()\"\n            [rtPopover]=\"panelTpl\"\n            [rtPopoverDisabled]=\"narrow() || isDisabled()\"\n            (clicked)=\"openPanel()\" />\n\n        <ng-template #panelTpl>\n            <div rtElem=\"popup\" qa-dataid=\"date-range-popup\">\n                <rt-date-range-panel [value]=\"range()\" [min]=\"min()\" [max]=\"max()\" (picked)=\"onPicked($event)\" (closed)=\"closePanel()\" />\n            </div>\n        </ng-template>\n\n        @if (narrow()) {\n            <rt-bottom-sheet qa-dataid=\"date-range-sheet\" [open]=\"sheetOpen()\" (openChange)=\"sheetOpen.set($event)\">\n                @if (sheetOpen()) {\n                    <rt-date-range-panel\n                        sheet\n                        [value]=\"range()\"\n                        [min]=\"min()\"\n                        [max]=\"max()\"\n                        (picked)=\"onPicked($event)\"\n                        (closed)=\"closePanel()\" />\n                }\n            </rt-bottom-sheet>\n        }\n    }\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-range{--rt-date-range-radius: var(--rt-input-radius);--rt-date-range-fill-radius: var(--rt-radius-sm);position:relative;display:inline-flex;width:100%;min-height:var(--rt-input-height);box-sizing:border-box;align-items:center;padding:var(--rt-input-padding-y) var(--rt-input-padding-x);border:var(--rt-input-border-width) solid var(--rt-input-color-border);border-radius:var(--rt-date-range-radius);background-color:var(--rt-input-color-bg);color:var(--rt-input-color-text);cursor:text;font-size:var(--rt-input-font-size);gap:var(--rt-space-sm);line-height:var(--rt-input-line-height);transition:var(--rt-input-transition)}.rt-date-range:focus-within{border-color:var(--rt-input-color-border-focus);box-shadow:var(--rt-input-focus-shadow);outline:2px solid transparent;outline-offset:var(--rt-input-focus-outline-offset)}.rt-date-range--borderless{border-color:transparent}.rt-date-range--appearance--fill{border-color:transparent;border-radius:var(--rt-date-range-fill-radius) var(--rt-date-range-fill-radius) 0 0;border-bottom-color:var(--rt-color-field-fill-underline);background-color:var(--rt-color-bg-surface-subtle-2)}.rt-date-range--invalid{border-color:var(--rt-input-color-border-error)}.rt-date-range--invalid:focus-within{box-shadow:var(--rt-input-focus-shadow-error)}.rt-date-range--disabled{cursor:not-allowed;opacity:var(--rt-input-disabled-opacity)}.rt-date-range--size--sm{min-height:var(--rt-input-height-sm)}.rt-date-range--size--lg{min-height:var(--rt-input-height-lg)}.rt-date-range--readonly{padding-right:0;padding-left:0;border-color:transparent;background-color:transparent;cursor:default}.rt-date-range__readonly{color:var(--rt-field-value-color);font-size:var(--rt-field-value-font-size)}.rt-date-range__readonly--empty{color:var(--rt-field-value-empty-color)}.rt-date-range__field{min-width:0;flex:1 1 auto;padding:0;border:none;background:transparent;color:inherit;font:inherit;outline:none;text-overflow:ellipsis}.rt-date-range__field:disabled{cursor:not-allowed}.rt-date-range__clear,.rt-date-range__open{flex-shrink:0}.rt-date-range__popup{border:var(--rt-overlay-select-panel-border-width) solid var(--rt-color-border-subtle);border-radius:var(--rt-overlay-select-radius);background-color:var(--rt-color-bg-surface);box-shadow:var(--rt-overlay-select-shadow)}.rt-date-range[data-rt-radius=none]{--rt-date-range-radius: var(--rt-radius-none)}.rt-date-range[data-rt-radius=xs]{--rt-date-range-radius: var(--rt-radius-xs)}.rt-date-range[data-rt-radius=sm]{--rt-date-range-radius: var(--rt-radius-sm)}.rt-date-range[data-rt-radius=ms]{--rt-date-range-radius: var(--rt-radius-ms)}.rt-date-range[data-rt-radius=md]{--rt-date-range-radius: var(--rt-radius-md)}.rt-date-range[data-rt-radius=lg]{--rt-date-range-radius: var(--rt-radius-lg)}.rt-date-range[data-rt-radius=xl]{--rt-date-range-radius: var(--rt-radius-xl)}.rt-date-range[data-rt-radius=\"2xl\"]{--rt-date-range-radius: var(--rt-radius-2xl)}.rt-date-range[data-rt-radius=full]{--rt-date-range-radius: var(--rt-radius-full)}}\n"]
+		}]
+	}],
+	propDecorators: {
+		fieldEl: [{
+			type: i0.ViewChild,
+			args: ["fieldEl", { isSignal: true }]
+		}],
+		popover: [{
+			type: i0.ViewChild,
+			args: [i0.forwardRef(() => RtPopoverDirective), { isSignal: true }]
+		}],
+		appearance: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appearance",
+				required: false
+			}]
+		}],
+		min: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "min",
+				required: false
+			}]
+		}],
+		max: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "max",
+				required: false
+			}]
+		}]
+	}
+});
 export { ERtDateRangePreset, RtDateRangeComponent };
-//# sourceMappingURL=rt-tools-ui-kit-v2-date-range.mjs.map
+
+//# sourceMappingURL=rt-tools-ui-kit-v2-date-range.mjs.map