@rt-tools/ui-kit-v2 0.40.0 → 0.42.0

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

@@ -2,15 +2,15 @@ import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, Component, ViewEncapsulation, afterRenderEffect, booleanAttribute, computed, forwardRef, inject, input, linkedSignal, numberAttribute, output, signal, viewChild, viewChildren } from "@angular/core";
 import { BlockDirective, ElemDirective, ModDirective } from "@rt-tools/core";
 import { BreakpointsService, RT_KIT_LABELS, RT_KIT_LOCALE } from "@rt-tools/ui-kit-v2/core";
+import { RtButtonDirective } from "@rt-tools/ui-kit-v2/button";
+import { ERtCalendarDayState, RtCalendarComponent } from "@rt-tools/ui-kit-v2/calendar";
+import { RtIconButtonComponent } from "@rt-tools/ui-kit-v2/icon-button";
+import { RtToggleButtonGroupComponent } from "@rt-tools/ui-kit-v2/toggle-button-group";
 import { RtBottomSheetComponent } from "@rt-tools/ui-kit-v2/bottom-sheet";
 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 { RtToggleButtonGroupComponent } from "@rt-tools/ui-kit-v2/toggle-button-group";
 const DAY_RE = /^(\d{4})-(\d{2})-(\d{2})$/;
 const TIME_RE = /^(\d{2}):(\d{2})$/;
 const DAY_LENGTH_MS = 864e5;
@@ -133,6 +133,30 @@ function rtDateMonth(month, ctx) {
 		days
 	};
 }
+function outsideDay(ms, min, max) {
+	const key = msToDay(ms);
+	return {
+		key,
+		dayOfMonth: Number(key.slice(8)),
+		crossed: !rtDateInBounds(key, min, max)
+	};
+}
+function rtDatePanelMonth(month, ctx) {
+	const base = rtDateMonth(month, ctx);
+	const first = dayToMs(base.days[0].key);
+	const last = dayToMs(base.days[base.days.length - 1].key);
+	const lead = base.leadingBlanks.length;
+	const tail = (WEEK - (lead + base.days.length) % WEEK) % WEEK;
+	return {
+		...base,
+		days: base.days.map((day) => day.disabled ? {
+			...day,
+			state: ERtCalendarDayState.Busy
+		} : day),
+		leadingDays: Array.from({ length: lead }, (_, i) => outsideDay(first - (lead - i) * DAY_LENGTH_MS, ctx.min, ctx.max)),
+		trailingDays: Array.from({ length: tail }, (_, i) => outsideDay(last + (i + 1) * DAY_LENGTH_MS, ctx.min, ctx.max))
+	};
+}
 function rtDateWeekdays(locale) {
 	const format = new Intl.DateTimeFormat(locale, {
 		weekday: "short",
@@ -140,7 +164,10 @@ function rtDateWeekdays(locale) {
 	});
 	const monday = Date.UTC(2024, 0, 1);
 	const shift = rtDateFirstDay(locale) - 1;
-	return Array.from({ length: WEEK }, (_, i) => format.format(monday + (i + shift) % WEEK * DAY_LENGTH_MS));
+	return Array.from({ length: WEEK }, (_, i) => {
+		const name = format.format(monday + (i + shift) % WEEK * DAY_LENGTH_MS);
+		return name.charAt(0).toLocaleUpperCase(locale) + name.slice(1);
+	});
 }
 function rtDateMonths(year, locale, min, max) {
 	const format = new Intl.DateTimeFormat(locale, {
@@ -231,9 +258,93 @@ function rtDateGridKey(key, day, firstDay, min, max) {
 	if (low !== null && rank(target) < rank(low)) return low;
 	return high !== null && rank(target) > rank(high) ? high : target;
 }
+const SAMPLE_DAY = new Date(2026, 0, 31);
+const DEFAULT_LAYOUT = {
+	order: [
+		"day",
+		"month",
+		"year"
+	],
+	separator: "."
+};
+const YEAR_LEN$1 = 4;
+const PART_MAX_LEN = 2;
+const DAY_GROUPS = 3;
+const TIME_GROUPS = 2;
+const TEXT_RE = /^[\d\s.,/:\-T]+$/;
+function isDatePart(type) {
+	return type === "day" || type === "month" || type === "year";
+}
+function dayText(day, layout) {
+	const [year, month, date] = day.split("-");
+	const parts = {
+		day: date,
+		month,
+		year
+	};
+	return layout.order.map((part) => parts[part]).join(layout.separator);
+}
+function readDay(groups, layout) {
+	const parts = {};
+	layout.order.forEach((part, index) => {
+		parts[part] = groups[index];
+	});
+	const { day, month, year } = parts;
+	if (day === void 0 || month === void 0 || year?.length !== YEAR_LEN$1) return null;
+	if (day.length > PART_MAX_LEN || month.length > PART_MAX_LEN) return null;
+	return `${year}-${month.padStart(PART_MAX_LEN, "0")}-${day.padStart(PART_MAX_LEN, "0")}`;
+}
+function readTime(groups) {
+	if (groups.length !== TIME_GROUPS) return null;
+	const [hour, minute] = groups;
+	if (minute.length !== PART_MAX_LEN || hour.length > PART_MAX_LEN) return null;
+	return `${hour.padStart(PART_MAX_LEN, "0")}:${minute}`;
+}
+function readGroups(groups, type, layout) {
+	if (type === "time") return readTime(groups);
+	if (type === "date") return groups.length === DAY_GROUPS ? readDay(groups, layout) : null;
+	if (groups.length !== 5) return null;
+	const day = readDay(groups.slice(0, DAY_GROUPS), layout);
+	const time = readTime(groups.slice(DAY_GROUPS));
+	return day === null || time === null ? null : `${day}T${time}`;
+}
+function rtDateLayout(locale) {
+	const parts = new Intl.DateTimeFormat(locale, {
+		day: "2-digit",
+		month: "2-digit",
+		year: "numeric"
+	}).formatToParts(SAMPLE_DAY);
+	const order = parts.map((part) => part.type).filter((type) => isDatePart(type));
+	const separator = parts.find((part) => part.type === "literal")?.value.trim() ?? "";
+	if (order.length !== DAY_GROUPS || separator === "") return DEFAULT_LAYOUT;
+	return {
+		order,
+		separator
+	};
+}
+function rtDateText(value, type, layout) {
+	if (type === "time" || rtDateRead(value, type) === null) return value;
+	if (type === "date") return dayText(value, layout);
+	const [day, time] = value.split("T");
+	return `${dayText(day, layout)} ${time}`;
+}
+function rtDateShape(type, layout, letters) {
+	const time = `${letters.hour}:${letters.minute}`;
+	if (type === "time") return time;
+	const day = layout.order.map((part) => letters[part]).join(layout.separator);
+	return type === "date" ? day : `${day} ${time}`;
+}
+function rtDateParse(text, type, layout) {
+	const iso = rtDateRead(text, type);
+	if (iso !== null) return iso;
+	const value = text.trim();
+	if (!TEXT_RE.test(value)) return null;
+	const candidate = readGroups(value.match(/\d+/g) ?? [], type, layout);
+	return candidate === null ? null : rtDateRead(candidate, type);
+}
 const BEM_BLOCK$1 = "rt-date-panel";
 const MONTH_LEN = 7;
-const YEAR_LEN$1 = 4;
+const YEAR_LEN = 4;
 const ESCAPE_BACK = {
 	days: null,
 	months: "days",
@@ -257,11 +368,11 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 		this.draftDay = linkedSignal(() => rtDateSplit(this.value(), this.type()).day, ...ngDevMode ? [{ debugName: "draftDay" }] : /* istanbul ignore next */ []);
 		this.draftTime = linkedSignal(() => rtDateSplit(this.value(), this.type()).time, ...ngDevMode ? [{ debugName: "draftTime" }] : /* istanbul ignore next */ []);
 		this.shownMonth = linkedSignal(() => (this.draftDay() ?? this.today()).slice(0, MONTH_LEN), ...ngDevMode ? [{ debugName: "shownMonth" }] : /* istanbul ignore next */ []);
-		this.year = linkedSignal(() => Number(this.shownMonth().slice(0, YEAR_LEN$1)), ...ngDevMode ? [{ debugName: "year" }] : /* istanbul ignore next */ []);
+		this.year = linkedSignal(() => Number(this.shownMonth().slice(0, YEAR_LEN)), ...ngDevMode ? [{ debugName: "year" }] : /* istanbul ignore next */ []);
 		this.split = computed(() => this.sheet() && this.type() === "datetime-local", ...ngDevMode ? [{ debugName: "split" }] : /* istanbul ignore next */ []);
 		this.showDate = computed(() => this.type() !== "time" && !(this.split() && this.tab() === "time"), ...ngDevMode ? [{ debugName: "showDate" }] : /* istanbul ignore next */ []);
 		this.showTime = computed(() => this.type() !== "date" && !(this.split() && this.tab() === "date"), ...ngDevMode ? [{ debugName: "showTime" }] : /* istanbul ignore next */ []);
-		this.months = computed(() => [rtDateMonth(this.shownMonth(), {
+		this.months = computed(() => [rtDatePanelMonth(this.shownMonth(), {
 			locale: this.#locale(),
 			today: this.today(),
 			chosen: this.draftDay(),
@@ -279,8 +390,8 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 			const cells = this.yearCells();
 			return `${cells[0].label} – ${cells[cells.length - 1].label}`;
 		}, ...ngDevMode ? [{ debugName: "yearSpan" }] : /* istanbul ignore next */ []);
-		this.chosenYear = computed(() => this.draftDay()?.slice(0, YEAR_LEN$1) ?? null, ...ngDevMode ? [{ debugName: "chosenYear" }] : /* istanbul ignore next */ []);
-		this.currentYear = computed(() => this.today().slice(0, YEAR_LEN$1), ...ngDevMode ? [{ debugName: "currentYear" }] : /* istanbul ignore next */ []);
+		this.chosenYear = computed(() => this.draftDay()?.slice(0, YEAR_LEN) ?? null, ...ngDevMode ? [{ debugName: "chosenYear" }] : /* istanbul ignore next */ []);
+		this.currentYear = computed(() => this.today().slice(0, YEAR_LEN), ...ngDevMode ? [{ debugName: "currentYear" }] : /* istanbul ignore next */ []);
 		this.currentMonth = computed(() => this.today().slice(0, MONTH_LEN), ...ngDevMode ? [{ debugName: "currentMonth" }] : /* istanbul ignore next */ []);
 		this.canPrevYears = computed(() => rtDateCanPageYears(this.yearStart(), -1, this.min(), this.max()), ...ngDevMode ? [{ debugName: "canPrevYears" }] : /* istanbul ignore next */ []);
 		this.canNextYears = computed(() => rtDateCanPageYears(this.yearStart(), 1, this.min(), this.max()), ...ngDevMode ? [{ debugName: "canNextYears" }] : /* istanbul ignore next */ []);
@@ -294,7 +405,12 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 			max: this.max()
 		}), ...ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []);
 		this.todayOff = computed(() => !rtDateInBounds(this.today(), this.min(), this.max()), ...ngDevMode ? [{ debugName: "todayOff" }] : /* istanbul ignore next */ []);
+		this.hasFooter = computed(() => this.type() !== "date" || this.isTodayButtonShown(), ...ngDevMode ? [{ debugName: "hasFooter" }] : /* istanbul ignore next */ []);
 		this.canApply = computed(() => this.#draftValue() !== "", ...ngDevMode ? [{ debugName: "canApply" }] : /* istanbul ignore next */ []);
+		this.draftText = computed(() => {
+			const parts = this.#draftValue().split("T");
+			return parts.length < 2 ? "" : `${rtDateText(parts[0], "date", rtDateLayout(this.#locale()))}, ${parts[1]}`;
+		}, ...ngDevMode ? [{ debugName: "draftText" }] : /* istanbul ignore next */ []);
 		this.tabs = computed(() => [{
 			value: "date",
 			label: this.t().uiDate
@@ -314,6 +430,10 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 			...ngDevMode ? { debugName: "sheet" } : /* istanbul ignore next */ {},
 			transform: booleanAttribute
 		});
+		this.isTodayButtonShown = input(true, {
+			...ngDevMode ? { debugName: "isTodayButtonShown" } : /* istanbul ignore next */ {},
+			transform: booleanAttribute
+		});
 		this.now = input(null, ...ngDevMode ? [{ debugName: "now" }] : /* istanbul ignore next */ []);
 		this.picked = output();
 		this.closed = output();
@@ -358,7 +478,7 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 		this.shownMonth.set(rtDateAddMonths(this.shownMonth(), delta));
 	}
 	openMonths() {
-		this.year.set(Number(this.shownMonth().slice(0, YEAR_LEN$1)));
+		this.year.set(Number(this.shownMonth().slice(0, YEAR_LEN)));
 		this.view.set("months");
 	}
 	pageYear(delta) {
@@ -391,6 +511,9 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 		const value = this.#draftValue();
 		if (value !== "") this.#emit(value);
 	}
+	reset() {
+		this.#emit("");
+	}
 	#emit(value) {
 		this.picked.emit(value);
 		this.closed.emit();
@@ -463,6 +586,13 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				isTodayButtonShown: {
+					classPropertyName: "isTodayButtonShown",
+					publicName: "isTodayButtonShown",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				now: {
 					classPropertyName: "now",
 					publicName: "now",
@@ -490,8 +620,8 @@ var RtDatePanelComponent = class RtDatePanelComponent {
 				isSignal: true
 			}],
 			ngImport: i0,
-			template: "<ng-container rtBlock=\"rt-date-panel\">\n    @if (split()) {\n        <rt-toggle-button-group\n            rtElem=\"tabs\"\n            qa-dataid=\"date-panel-tabs\"\n            fullWidth\n            [ariaLabel]=\"t().uiDate + ' | ' + t().uiTime\"\n            [options]=\"tabs()\"\n            [value]=\"tab()\"\n            (valueChange)=\"tab.set($event)\" />\n    }\n\n    <div rtElem=\"body\">\n        @if (showDate()) {\n            @if (view() === 'days') {\n                <rt-calendar\n                    rtElem=\"calendar\"\n                    qa-dataid=\"date-panel-calendar\"\n                    grid\n                    titleAction\n                    headerTitle\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                    (gridKey)=\"onGridKey($event)\"\n                    (titleClick)=\"openMonths()\" />\n            } @else if (view() === 'months') {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-months\" role=\"group\" [attr.aria-label]=\"t().uiChooseMonth\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-year\"\n                            icon=\"chevron-left\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYear\"\n                            [disabled]=\"!canPrevYear()\"\n                            (clicked)=\"pageYear(-1)\" />\n                        <button\n                            rtElem=\"year\"\n                            qa-dataid=\"date-panel-year\"\n                            type=\"button\"\n                            [attr.aria-label]=\"t().uiChooseYear\"\n                            (click)=\"openYears()\">\n                            {{ year() }}\n                        </button>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-year\"\n                            icon=\"chevron-right\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYear\"\n                            [disabled]=\"!canNextYear()\"\n                            (clicked)=\"pageYear(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of monthCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-month\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentMonth() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === shownMonth()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMonth(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            } @else {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-years\" role=\"group\" [attr.aria-label]=\"t().uiChooseYear\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-years\"\n                            icon=\"chevron-left\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYears\"\n                            [disabled]=\"!canPrevYears()\"\n                            (clicked)=\"pageYears(-1)\" />\n                        <span rtElem=\"span\" qa-dataid=\"date-panel-span\">{{ yearSpan() }}</span>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-years\"\n                            icon=\"chevron-right\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYears\"\n                            [disabled]=\"!canNextYears()\"\n                            (clicked)=\"pageYears(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of yearCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-year-cell\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentYear() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === chosenYear()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickYear(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            }\n        }\n\n        @if (showTime()) {\n            <div rtElem=\"time\" qa-dataid=\"date-panel-time\">\n                <div rtElem=\"column\" qa-dataid=\"date-panel-hours\" role=\"group\" [attr.aria-label]=\"t().uiHours\">\n                    @for (cell of columns().hours; track cell.value) {\n                        <button\n                            #timeCell\n                            rtElem=\"cell\"\n                            qa-dataid=\"date-panel-hour\"\n                            type=\"button\"\n                            [attr.aria-pressed]=\"cell.value === draftHour()\"\n                            [disabled]=\"cell.disabled\"\n                            (click)=\"pickHour(cell.value)\">\n                            {{ cell.label }}\n                        </button>\n                    }\n                </div>\n                <div rtElem=\"column\" qa-dataid=\"date-panel-minutes\" role=\"group\" [attr.aria-label]=\"t().uiMinutes\">\n                    @for (cell of columns().minutes; track cell.value) {\n                        <button\n                            #timeCell\n                            rtElem=\"cell\"\n                            qa-dataid=\"date-panel-minute\"\n                            type=\"button\"\n                            [attr.aria-pressed]=\"cell.value === draftMinute()\"\n                            [disabled]=\"cell.disabled\"\n                            (click)=\"pickMinute(cell.value)\">\n                            {{ cell.label }}\n                        </button>\n                    }\n                </div>\n            </div>\n        }\n    </div>\n\n    <div rtElem=\"footer\">\n        @switch (type()) {\n            @case ('date') {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-today\"\n                    theme=\"secondary\"\n                    appearance=\"text\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiToday\"\n                    [attr.aria-label]=\"t().uiToday\"\n                    [disabled]=\"todayOff()\"\n                    (click)=\"pickToday()\"></button>\n            }\n            @case ('time') {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-now\"\n                    theme=\"secondary\"\n                    appearance=\"text\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiNow\"\n                    [attr.aria-label]=\"t().uiNow\"\n                    (click)=\"pickNow()\"></button>\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-done\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiDone\"\n                    [attr.aria-label]=\"t().uiDone\"\n                    [disabled]=\"!canApply()\"\n                    (click)=\"apply()\"></button>\n            }\n            @default {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-apply\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiApply\"\n                    [attr.aria-label]=\"t().uiApply\"\n                    [disabled]=\"!canApply()\"\n                    (click)=\"apply()\"></button>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-panel{--rt-date-panel-cell-size: var(--rt-control-height-sm);--rt-date-panel-cell-radius: var(--rt-radius-md);--rt-date-panel-divider-width: var(--rt-border-width-thin);--rt-date-panel-current-ring: inset 0 0 0 var(--rt-border-width-thin) var(--rt-color-action-primary);--rt-date-panel-column-height: calc(var(--rt-date-panel-cell-size) * 7 + var(--rt-space-0-5) * 6);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-panel .rt-date-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-justify: center}.rt-date-panel__calendar,.rt-date-panel__months{flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 7)}.rt-date-panel__months-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--rt-space-4)}.rt-date-panel__year{padding:var(--rt-space-1) var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__year:hover{background:var(--rt-color-bg-subtle)}.rt-date-panel__year:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__span{color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__month-grid{display:grid;gap:var(--rt-space-1);grid-template-columns:repeat(3,1fr)}.rt-date-panel__month-grid .rt-date-panel__cell{font-weight:var(--rt-font-weight-medium)}.rt-date-panel__month-grid .rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-hover)}.rt-date-panel__month-grid .rt-date-panel__cell[data-current]:not([aria-pressed=true]){color:var(--rt-color-action-primary)}.rt-date-panel__month-grid .rt-date-panel__cell:disabled{color:var(--rt-color-text-disabled);opacity:1}.rt-date-panel__time{display:flex;gap:var(--rt-space-1)}.rt-date-panel__column{position:relative;display:flex;flex-direction:column;gap:var(--rt-space-0-5);max-block-size:var(--rt-date-panel-column-height);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.rt-date-panel__cell{flex:0 0 auto;padding:0 var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums;min-block-size:var(--rt-date-panel-cell-size);min-inline-size:var(--rt-control-height-md)}.rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-subtle)}.rt-date-panel__cell:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__cell[data-current]:not([aria-pressed=true]){box-shadow:var(--rt-date-panel-current-ring)}.rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary);color:var(--rt-color-action-on-primary)}.rt-date-panel__cell:disabled{color:var(--rt-color-text-muted);cursor:not-allowed;opacity:.45}.rt-date-panel__footer{display:flex;justify-content:flex-end;padding-top:var(--rt-space-2);border-top:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-panel:not(.rt-date-panel--with-time) .rt-date-panel__footer{justify-content:center}.rt-date-panel--sheet{--rt-date-panel-cell-size: calc(var(--rt-size-10) + var(--rt-size-1));padding-inline:var(--rt-space-5)}.rt-date-panel--sheet .rt-date-panel__calendar{--rt-calendar-day-size: var(--rt-date-panel-cell-size)}.rt-date-panel--sheet .rt-date-panel__body{flex-direction:column;align-items:stretch}.rt-date-panel--sheet .rt-date-panel__calendar,.rt-date-panel--sheet .rt-date-panel__months{min-inline-size:0}.rt-date-panel--sheet .rt-date-panel__time{justify-content:center}.rt-date-panel--sheet .rt-date-panel__column{flex:1 1 0}}\n"],
+			template: "<ng-container rtBlock=\"rt-date-panel\">\n    @if (split()) {\n        <rt-toggle-button-group\n            rtElem=\"tabs\"\n            qa-dataid=\"date-panel-tabs\"\n            size=\"md\"\n            [ariaLabel]=\"t().uiDate + ' | ' + t().uiTime\"\n            [options]=\"tabs()\"\n            [value]=\"tab()\"\n            (valueChange)=\"tab.set($event)\" />\n    }\n\n    <div rtElem=\"body\">\n        @if (showDate()) {\n            @if (view() === 'days') {\n                <rt-calendar\n                    rtElem=\"calendar\"\n                    qa-dataid=\"date-panel-calendar\"\n                    grid\n                    titleAction\n                    headerTitle\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                    (gridKey)=\"onGridKey($event)\"\n                    (titleClick)=\"openMonths()\" />\n            } @else if (view() === 'months') {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-months\" role=\"group\" [attr.aria-label]=\"t().uiChooseMonth\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-year\"\n                            icon=\"chevron-left\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYear\"\n                            [disabled]=\"!canPrevYear()\"\n                            (clicked)=\"pageYear(-1)\" />\n                        <button\n                            rtElem=\"year\"\n                            qa-dataid=\"date-panel-year\"\n                            type=\"button\"\n                            [attr.aria-label]=\"t().uiChooseYear\"\n                            (click)=\"openYears()\">\n                            {{ year() }}\n                        </button>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-year\"\n                            icon=\"chevron-right\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYear\"\n                            [disabled]=\"!canNextYear()\"\n                            (clicked)=\"pageYear(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of monthCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-month\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentMonth() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === shownMonth()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMonth(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            } @else {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-years\" role=\"group\" [attr.aria-label]=\"t().uiChooseYear\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-years\"\n                            icon=\"chevron-left\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYears\"\n                            [disabled]=\"!canPrevYears()\"\n                            (clicked)=\"pageYears(-1)\" />\n                        <span rtElem=\"span\" qa-dataid=\"date-panel-span\">{{ yearSpan() }}</span>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-years\"\n                            icon=\"chevron-right\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYears\"\n                            [disabled]=\"!canNextYears()\"\n                            (clicked)=\"pageYears(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of yearCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-year-cell\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentYear() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === chosenYear()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickYear(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            }\n        }\n\n        @if (showTime()) {\n            <div rtElem=\"time\" qa-dataid=\"date-panel-time\">\n                <div rtElem=\"time-group\">\n                    <span rtElem=\"time-title\" qa-dataid=\"date-panel-hours-title\" aria-hidden=\"true\">{{ t().uiHours }}</span>\n                    <div rtElem=\"column\" qa-dataid=\"date-panel-hours\" role=\"group\" [attr.aria-label]=\"t().uiHours\">\n                        @for (cell of columns().hours; track cell.value) {\n                            <button\n                                #timeCell\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-hour\"\n                                type=\"button\"\n                                [attr.aria-pressed]=\"cell.value === draftHour()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickHour(cell.value)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n                <div rtElem=\"time-group\">\n                    <span rtElem=\"time-title\" qa-dataid=\"date-panel-minutes-title\" aria-hidden=\"true\">{{ t().uiMinutes }}</span>\n                    <div rtElem=\"column\" qa-dataid=\"date-panel-minutes\" role=\"group\" [attr.aria-label]=\"t().uiMinutes\">\n                        @for (cell of columns().minutes; track cell.value) {\n                            <button\n                                #timeCell\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-minute\"\n                                type=\"button\"\n                                [attr.aria-pressed]=\"cell.value === draftMinute()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMinute(cell.value)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            </div>\n        }\n    </div>\n\n    @if (hasFooter()) {\n        <div rtElem=\"footer\">\n            @switch (type()) {\n                @case ('date') {\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-today\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiToday\"\n                        [attr.aria-label]=\"t().uiToday\"\n                        [disabled]=\"todayOff()\"\n                        (click)=\"pickToday()\"></button>\n                }\n                @case ('time') {\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-now\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiNow\"\n                        [attr.aria-label]=\"t().uiNow\"\n                        (click)=\"pickNow()\"></button>\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-done\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiDone\"\n                        [attr.aria-label]=\"t().uiDone\"\n                        [disabled]=\"!canApply()\"\n                        (click)=\"apply()\"></button>\n                }\n                @default {\n                    @if (sheet()) {\n                        <span rtElem=\"value\" qa-dataid=\"date-panel-value\">{{ draftText() }}</span>\n                    } @else {\n                        <button\n                            rtButton\n                            rtElem=\"lead\"\n                            qa-dataid=\"date-panel-now\"\n                            theme=\"primary\"\n                            appearance=\"text\"\n                            size=\"sm\"\n                            type=\"button\"\n                            [label]=\"t().uiNow\"\n                            [attr.aria-label]=\"t().uiNow\"\n                            (click)=\"pickNow()\"></button>\n                        <button\n                            rtButton\n                            qa-dataid=\"date-panel-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                    }\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-apply\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiApply\"\n                        [attr.aria-label]=\"t().uiApply\"\n                        [disabled]=\"!canApply()\"\n                        (click)=\"apply()\"></button>\n                }\n            }\n        </div>\n    }\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-panel{--rt-date-panel-cell-size: var(--rt-control-height-sm);--rt-date-panel-cell-radius: var(--rt-radius-md);--rt-date-panel-divider-width: var(--rt-border-width-thin);--rt-date-panel-current-ring: inset 0 0 0 var(--rt-border-width-thin) var(--rt-color-action-primary);--rt-date-panel-column-height: calc(var(--rt-date-panel-cell-size) * 7 + var(--rt-space-0-5) * 6);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-panel .rt-date-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-justify: center}.rt-date-panel__calendar,.rt-date-panel__months{flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 7)}.rt-date-panel__months-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--rt-space-4)}.rt-date-panel__year{padding:var(--rt-space-1) var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__year:hover{background:var(--rt-color-bg-subtle)}.rt-date-panel__year:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__span{color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__month-grid{display:grid;gap:var(--rt-space-1);grid-template-columns:repeat(3,1fr)}.rt-date-panel__month-grid .rt-date-panel__cell{font-weight:var(--rt-font-weight-medium)}.rt-date-panel__month-grid .rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-hover)}.rt-date-panel__month-grid .rt-date-panel__cell[data-current]:not([aria-pressed=true]){color:var(--rt-color-action-primary)}.rt-date-panel__month-grid .rt-date-panel__cell:disabled{color:var(--rt-color-text-disabled);opacity:1}.rt-date-panel__time{display:flex;gap:var(--rt-space-2)}.rt-date-panel__time:not(:first-child){align-self:stretch;border-inline-start:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);padding-inline-start:var(--rt-space-4)}.rt-date-panel__tabs{align-self:center}.rt-date-panel__time-group{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-date-panel__time-title{padding:var(--rt-space-1) 0;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);text-align:center}.rt-date-panel__lead{margin-inline-end:auto}.rt-date-panel__value{align-self:center;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm);margin-inline-end:auto}.rt-date-panel__column{position:relative;display:flex;flex-direction:column;gap:var(--rt-space-0-5);max-block-size:var(--rt-date-panel-column-height);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.rt-date-panel__cell{flex:0 0 auto;padding:0 var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums;min-block-size:var(--rt-date-panel-cell-size);min-inline-size:var(--rt-control-height-md)}.rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-subtle)}.rt-date-panel__cell:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__cell[data-current]:not([aria-pressed=true]){box-shadow:var(--rt-date-panel-current-ring)}.rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary);color:var(--rt-color-action-on-primary)}.rt-date-panel__cell:disabled{color:var(--rt-color-text-muted);cursor:not-allowed;opacity:.45}.rt-date-panel__column .rt-date-panel__cell{min-inline-size:calc(var(--rt-size-10) * 1.5);padding-inline:var(--rt-space-4) 0;text-align:start}.rt-date-panel__column .rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary-subtle);color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__footer{display:flex;justify-content:flex-end;padding-top:var(--rt-space-2);border-top:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-panel:not(.rt-date-panel--with-time) .rt-date-panel__footer{justify-content:center}.rt-date-panel--sheet{--rt-date-panel-cell-size: calc(var(--rt-size-10) + var(--rt-size-1));padding-inline:var(--rt-space-5)}.rt-date-panel--sheet .rt-date-panel__calendar{--rt-calendar-day-size: var(--rt-date-panel-cell-size)}.rt-date-panel--sheet .rt-date-panel__body{flex-direction:column;align-items:stretch}.rt-date-panel--sheet .rt-date-panel__calendar,.rt-date-panel--sheet .rt-date-panel__months{min-inline-size:0}.rt-date-panel--sheet .rt-date-panel__time{justify-content:center}.rt-date-panel--sheet .rt-date-panel__time-group{flex:1 1 0}}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -625,8 +755,8 @@ i0.ɵɵngDeclareClassMetadata({
 				"[class.rt-date-panel--with-time]": "type() !== 'date'",
 				"(keydown.escape)": "onEscape()"
 			},
-			template: "<ng-container rtBlock=\"rt-date-panel\">\n    @if (split()) {\n        <rt-toggle-button-group\n            rtElem=\"tabs\"\n            qa-dataid=\"date-panel-tabs\"\n            fullWidth\n            [ariaLabel]=\"t().uiDate + ' | ' + t().uiTime\"\n            [options]=\"tabs()\"\n            [value]=\"tab()\"\n            (valueChange)=\"tab.set($event)\" />\n    }\n\n    <div rtElem=\"body\">\n        @if (showDate()) {\n            @if (view() === 'days') {\n                <rt-calendar\n                    rtElem=\"calendar\"\n                    qa-dataid=\"date-panel-calendar\"\n                    grid\n                    titleAction\n                    headerTitle\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                    (gridKey)=\"onGridKey($event)\"\n                    (titleClick)=\"openMonths()\" />\n            } @else if (view() === 'months') {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-months\" role=\"group\" [attr.aria-label]=\"t().uiChooseMonth\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-year\"\n                            icon=\"chevron-left\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYear\"\n                            [disabled]=\"!canPrevYear()\"\n                            (clicked)=\"pageYear(-1)\" />\n                        <button\n                            rtElem=\"year\"\n                            qa-dataid=\"date-panel-year\"\n                            type=\"button\"\n                            [attr.aria-label]=\"t().uiChooseYear\"\n                            (click)=\"openYears()\">\n                            {{ year() }}\n                        </button>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-year\"\n                            icon=\"chevron-right\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYear\"\n                            [disabled]=\"!canNextYear()\"\n                            (clicked)=\"pageYear(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of monthCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-month\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentMonth() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === shownMonth()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMonth(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            } @else {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-years\" role=\"group\" [attr.aria-label]=\"t().uiChooseYear\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-years\"\n                            icon=\"chevron-left\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYears\"\n                            [disabled]=\"!canPrevYears()\"\n                            (clicked)=\"pageYears(-1)\" />\n                        <span rtElem=\"span\" qa-dataid=\"date-panel-span\">{{ yearSpan() }}</span>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-years\"\n                            icon=\"chevron-right\"\n                            variant=\"secondary\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYears\"\n                            [disabled]=\"!canNextYears()\"\n                            (clicked)=\"pageYears(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of yearCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-year-cell\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentYear() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === chosenYear()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickYear(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            }\n        }\n\n        @if (showTime()) {\n            <div rtElem=\"time\" qa-dataid=\"date-panel-time\">\n                <div rtElem=\"column\" qa-dataid=\"date-panel-hours\" role=\"group\" [attr.aria-label]=\"t().uiHours\">\n                    @for (cell of columns().hours; track cell.value) {\n                        <button\n                            #timeCell\n                            rtElem=\"cell\"\n                            qa-dataid=\"date-panel-hour\"\n                            type=\"button\"\n                            [attr.aria-pressed]=\"cell.value === draftHour()\"\n                            [disabled]=\"cell.disabled\"\n                            (click)=\"pickHour(cell.value)\">\n                            {{ cell.label }}\n                        </button>\n                    }\n                </div>\n                <div rtElem=\"column\" qa-dataid=\"date-panel-minutes\" role=\"group\" [attr.aria-label]=\"t().uiMinutes\">\n                    @for (cell of columns().minutes; track cell.value) {\n                        <button\n                            #timeCell\n                            rtElem=\"cell\"\n                            qa-dataid=\"date-panel-minute\"\n                            type=\"button\"\n                            [attr.aria-pressed]=\"cell.value === draftMinute()\"\n                            [disabled]=\"cell.disabled\"\n                            (click)=\"pickMinute(cell.value)\">\n                            {{ cell.label }}\n                        </button>\n                    }\n                </div>\n            </div>\n        }\n    </div>\n\n    <div rtElem=\"footer\">\n        @switch (type()) {\n            @case ('date') {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-today\"\n                    theme=\"secondary\"\n                    appearance=\"text\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiToday\"\n                    [attr.aria-label]=\"t().uiToday\"\n                    [disabled]=\"todayOff()\"\n                    (click)=\"pickToday()\"></button>\n            }\n            @case ('time') {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-now\"\n                    theme=\"secondary\"\n                    appearance=\"text\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiNow\"\n                    [attr.aria-label]=\"t().uiNow\"\n                    (click)=\"pickNow()\"></button>\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-done\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiDone\"\n                    [attr.aria-label]=\"t().uiDone\"\n                    [disabled]=\"!canApply()\"\n                    (click)=\"apply()\"></button>\n            }\n            @default {\n                <button\n                    rtButton\n                    qa-dataid=\"date-panel-apply\"\n                    size=\"sm\"\n                    type=\"button\"\n                    [label]=\"t().uiApply\"\n                    [attr.aria-label]=\"t().uiApply\"\n                    [disabled]=\"!canApply()\"\n                    (click)=\"apply()\"></button>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-panel{--rt-date-panel-cell-size: var(--rt-control-height-sm);--rt-date-panel-cell-radius: var(--rt-radius-md);--rt-date-panel-divider-width: var(--rt-border-width-thin);--rt-date-panel-current-ring: inset 0 0 0 var(--rt-border-width-thin) var(--rt-color-action-primary);--rt-date-panel-column-height: calc(var(--rt-date-panel-cell-size) * 7 + var(--rt-space-0-5) * 6);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-panel .rt-date-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-justify: center}.rt-date-panel__calendar,.rt-date-panel__months{flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 7)}.rt-date-panel__months-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--rt-space-4)}.rt-date-panel__year{padding:var(--rt-space-1) var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__year:hover{background:var(--rt-color-bg-subtle)}.rt-date-panel__year:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__span{color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__month-grid{display:grid;gap:var(--rt-space-1);grid-template-columns:repeat(3,1fr)}.rt-date-panel__month-grid .rt-date-panel__cell{font-weight:var(--rt-font-weight-medium)}.rt-date-panel__month-grid .rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-hover)}.rt-date-panel__month-grid .rt-date-panel__cell[data-current]:not([aria-pressed=true]){color:var(--rt-color-action-primary)}.rt-date-panel__month-grid .rt-date-panel__cell:disabled{color:var(--rt-color-text-disabled);opacity:1}.rt-date-panel__time{display:flex;gap:var(--rt-space-1)}.rt-date-panel__column{position:relative;display:flex;flex-direction:column;gap:var(--rt-space-0-5);max-block-size:var(--rt-date-panel-column-height);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.rt-date-panel__cell{flex:0 0 auto;padding:0 var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums;min-block-size:var(--rt-date-panel-cell-size);min-inline-size:var(--rt-control-height-md)}.rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-subtle)}.rt-date-panel__cell:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__cell[data-current]:not([aria-pressed=true]){box-shadow:var(--rt-date-panel-current-ring)}.rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary);color:var(--rt-color-action-on-primary)}.rt-date-panel__cell:disabled{color:var(--rt-color-text-muted);cursor:not-allowed;opacity:.45}.rt-date-panel__footer{display:flex;justify-content:flex-end;padding-top:var(--rt-space-2);border-top:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-panel:not(.rt-date-panel--with-time) .rt-date-panel__footer{justify-content:center}.rt-date-panel--sheet{--rt-date-panel-cell-size: calc(var(--rt-size-10) + var(--rt-size-1));padding-inline:var(--rt-space-5)}.rt-date-panel--sheet .rt-date-panel__calendar{--rt-calendar-day-size: var(--rt-date-panel-cell-size)}.rt-date-panel--sheet .rt-date-panel__body{flex-direction:column;align-items:stretch}.rt-date-panel--sheet .rt-date-panel__calendar,.rt-date-panel--sheet .rt-date-panel__months{min-inline-size:0}.rt-date-panel--sheet .rt-date-panel__time{justify-content:center}.rt-date-panel--sheet .rt-date-panel__column{flex:1 1 0}}\n"]
+			template: "<ng-container rtBlock=\"rt-date-panel\">\n    @if (split()) {\n        <rt-toggle-button-group\n            rtElem=\"tabs\"\n            qa-dataid=\"date-panel-tabs\"\n            size=\"md\"\n            [ariaLabel]=\"t().uiDate + ' | ' + t().uiTime\"\n            [options]=\"tabs()\"\n            [value]=\"tab()\"\n            (valueChange)=\"tab.set($event)\" />\n    }\n\n    <div rtElem=\"body\">\n        @if (showDate()) {\n            @if (view() === 'days') {\n                <rt-calendar\n                    rtElem=\"calendar\"\n                    qa-dataid=\"date-panel-calendar\"\n                    grid\n                    titleAction\n                    headerTitle\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                    (gridKey)=\"onGridKey($event)\"\n                    (titleClick)=\"openMonths()\" />\n            } @else if (view() === 'months') {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-months\" role=\"group\" [attr.aria-label]=\"t().uiChooseMonth\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-year\"\n                            icon=\"chevron-left\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYear\"\n                            [disabled]=\"!canPrevYear()\"\n                            (clicked)=\"pageYear(-1)\" />\n                        <button\n                            rtElem=\"year\"\n                            qa-dataid=\"date-panel-year\"\n                            type=\"button\"\n                            [attr.aria-label]=\"t().uiChooseYear\"\n                            (click)=\"openYears()\">\n                            {{ year() }}\n                        </button>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-year\"\n                            icon=\"chevron-right\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYear\"\n                            [disabled]=\"!canNextYear()\"\n                            (clicked)=\"pageYear(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of monthCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-month\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentMonth() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === shownMonth()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMonth(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            } @else {\n                <div rtElem=\"months\" qa-dataid=\"date-panel-years\" role=\"group\" [attr.aria-label]=\"t().uiChooseYear\">\n                    <div rtElem=\"months-header\">\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-prev-years\"\n                            icon=\"chevron-left\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiPrevYears\"\n                            [disabled]=\"!canPrevYears()\"\n                            (clicked)=\"pageYears(-1)\" />\n                        <span rtElem=\"span\" qa-dataid=\"date-panel-span\">{{ yearSpan() }}</span>\n                        <rt-icon-button\n                            qa-dataid=\"date-panel-next-years\"\n                            icon=\"chevron-right\"\n                            variant=\"ghost\"\n                            iconColor=\"muted\"\n                            radius=\"full\"\n                            [ariaLabel]=\"t().uiNextYears\"\n                            [disabled]=\"!canNextYears()\"\n                            (clicked)=\"pageYears(1)\" />\n                    </div>\n                    <div rtElem=\"month-grid\">\n                        @for (cell of yearCells(); track cell.key) {\n                            <button\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-year-cell\"\n                                type=\"button\"\n                                [attr.data-key]=\"cell.key\"\n                                [attr.data-current]=\"cell.key === currentYear() ? '' : null\"\n                                [attr.aria-pressed]=\"cell.key === chosenYear()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickYear(cell)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            }\n        }\n\n        @if (showTime()) {\n            <div rtElem=\"time\" qa-dataid=\"date-panel-time\">\n                <div rtElem=\"time-group\">\n                    <span rtElem=\"time-title\" qa-dataid=\"date-panel-hours-title\" aria-hidden=\"true\">{{ t().uiHours }}</span>\n                    <div rtElem=\"column\" qa-dataid=\"date-panel-hours\" role=\"group\" [attr.aria-label]=\"t().uiHours\">\n                        @for (cell of columns().hours; track cell.value) {\n                            <button\n                                #timeCell\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-hour\"\n                                type=\"button\"\n                                [attr.aria-pressed]=\"cell.value === draftHour()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickHour(cell.value)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n                <div rtElem=\"time-group\">\n                    <span rtElem=\"time-title\" qa-dataid=\"date-panel-minutes-title\" aria-hidden=\"true\">{{ t().uiMinutes }}</span>\n                    <div rtElem=\"column\" qa-dataid=\"date-panel-minutes\" role=\"group\" [attr.aria-label]=\"t().uiMinutes\">\n                        @for (cell of columns().minutes; track cell.value) {\n                            <button\n                                #timeCell\n                                rtElem=\"cell\"\n                                qa-dataid=\"date-panel-minute\"\n                                type=\"button\"\n                                [attr.aria-pressed]=\"cell.value === draftMinute()\"\n                                [disabled]=\"cell.disabled\"\n                                (click)=\"pickMinute(cell.value)\">\n                                {{ cell.label }}\n                            </button>\n                        }\n                    </div>\n                </div>\n            </div>\n        }\n    </div>\n\n    @if (hasFooter()) {\n        <div rtElem=\"footer\">\n            @switch (type()) {\n                @case ('date') {\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-today\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiToday\"\n                        [attr.aria-label]=\"t().uiToday\"\n                        [disabled]=\"todayOff()\"\n                        (click)=\"pickToday()\"></button>\n                }\n                @case ('time') {\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-now\"\n                        theme=\"secondary\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiNow\"\n                        [attr.aria-label]=\"t().uiNow\"\n                        (click)=\"pickNow()\"></button>\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-done\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiDone\"\n                        [attr.aria-label]=\"t().uiDone\"\n                        [disabled]=\"!canApply()\"\n                        (click)=\"apply()\"></button>\n                }\n                @default {\n                    @if (sheet()) {\n                        <span rtElem=\"value\" qa-dataid=\"date-panel-value\">{{ draftText() }}</span>\n                    } @else {\n                        <button\n                            rtButton\n                            rtElem=\"lead\"\n                            qa-dataid=\"date-panel-now\"\n                            theme=\"primary\"\n                            appearance=\"text\"\n                            size=\"sm\"\n                            type=\"button\"\n                            [label]=\"t().uiNow\"\n                            [attr.aria-label]=\"t().uiNow\"\n                            (click)=\"pickNow()\"></button>\n                        <button\n                            rtButton\n                            qa-dataid=\"date-panel-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                    }\n                    <button\n                        rtButton\n                        qa-dataid=\"date-panel-apply\"\n                        size=\"sm\"\n                        type=\"button\"\n                        [label]=\"t().uiApply\"\n                        [attr.aria-label]=\"t().uiApply\"\n                        [disabled]=\"!canApply()\"\n                        (click)=\"apply()\"></button>\n                }\n            }\n        </div>\n    }\n</ng-container>\n",
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-date-panel{--rt-date-panel-cell-size: var(--rt-control-height-sm);--rt-date-panel-cell-radius: var(--rt-radius-md);--rt-date-panel-divider-width: var(--rt-border-width-thin);--rt-date-panel-current-ring: inset 0 0 0 var(--rt-border-width-thin) var(--rt-color-action-primary);--rt-date-panel-column-height: calc(var(--rt-date-panel-cell-size) * 7 + var(--rt-space-0-5) * 6);display:flex;flex-direction:column;padding:var(--rt-space-4);gap:var(--rt-space-4)}.rt-date-panel__body{display:flex;align-items:flex-start;gap:var(--rt-space-4)}.rt-date-panel .rt-date-panel__calendar{--rt-calendar-month-count: 1;--rt-calendar-day-justify: center}.rt-date-panel__calendar,.rt-date-panel__months{flex:1 1 auto;min-inline-size:calc(var(--rt-size-10) * 7)}.rt-date-panel__months-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--rt-space-4)}.rt-date-panel__year{padding:var(--rt-space-1) var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__year:hover{background:var(--rt-color-bg-subtle)}.rt-date-panel__year:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__span{color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__month-grid{display:grid;gap:var(--rt-space-1);grid-template-columns:repeat(3,1fr)}.rt-date-panel__month-grid .rt-date-panel__cell{font-weight:var(--rt-font-weight-medium)}.rt-date-panel__month-grid .rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-hover)}.rt-date-panel__month-grid .rt-date-panel__cell[data-current]:not([aria-pressed=true]){color:var(--rt-color-action-primary)}.rt-date-panel__month-grid .rt-date-panel__cell:disabled{color:var(--rt-color-text-disabled);opacity:1}.rt-date-panel__time{display:flex;gap:var(--rt-space-2)}.rt-date-panel__time:not(:first-child){align-self:stretch;border-inline-start:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);padding-inline-start:var(--rt-space-4)}.rt-date-panel__tabs{align-self:center}.rt-date-panel__time-group{display:flex;flex-direction:column;gap:var(--rt-space-2)}.rt-date-panel__time-title{padding:var(--rt-space-1) 0;color:var(--rt-color-text-muted);font-size:var(--rt-text-xs);text-align:center}.rt-date-panel__lead{margin-inline-end:auto}.rt-date-panel__value{align-self:center;color:var(--rt-color-text-muted);font-size:var(--rt-text-sm);margin-inline-end:auto}.rt-date-panel__column{position:relative;display:flex;flex-direction:column;gap:var(--rt-space-0-5);max-block-size:var(--rt-date-panel-column-height);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.rt-date-panel__cell{flex:0 0 auto;padding:0 var(--rt-space-2);border:none;border-radius:var(--rt-date-panel-cell-radius);background:none;color:var(--rt-color-text-primary);cursor:pointer;font:inherit;font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums;min-block-size:var(--rt-date-panel-cell-size);min-inline-size:var(--rt-control-height-md)}.rt-date-panel__cell:hover:not(:disabled,[aria-pressed=true]){background:var(--rt-color-bg-subtle)}.rt-date-panel__cell:focus-visible{outline:var(--rt-focus-ring-width) solid var(--rt-focus-ring-color);outline-offset:var(--rt-focus-ring-offset)}.rt-date-panel__cell[data-current]:not([aria-pressed=true]){box-shadow:var(--rt-date-panel-current-ring)}.rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary);color:var(--rt-color-action-on-primary)}.rt-date-panel__cell:disabled{color:var(--rt-color-text-muted);cursor:not-allowed;opacity:.45}.rt-date-panel__column .rt-date-panel__cell{min-inline-size:calc(var(--rt-size-10) * 1.5);padding-inline:var(--rt-space-4) 0;text-align:start}.rt-date-panel__column .rt-date-panel__cell[aria-pressed=true]{background:var(--rt-color-action-primary-subtle);color:var(--rt-color-text-primary);font-weight:var(--rt-font-weight-semibold)}.rt-date-panel__footer{display:flex;justify-content:flex-end;padding-top:var(--rt-space-2);border-top:var(--rt-date-panel-divider-width) solid var(--rt-color-border-subtle);gap:var(--rt-space-2)}.rt-date-panel:not(.rt-date-panel--with-time) .rt-date-panel__footer{justify-content:center}.rt-date-panel--sheet{--rt-date-panel-cell-size: calc(var(--rt-size-10) + var(--rt-size-1));padding-inline:var(--rt-space-5)}.rt-date-panel--sheet .rt-date-panel__calendar{--rt-calendar-day-size: var(--rt-date-panel-cell-size)}.rt-date-panel--sheet .rt-date-panel__body{flex-direction:column;align-items:stretch}.rt-date-panel--sheet .rt-date-panel__calendar,.rt-date-panel--sheet .rt-date-panel__months{min-inline-size:0}.rt-date-panel--sheet .rt-date-panel__time{justify-content:center}.rt-date-panel--sheet .rt-date-panel__time-group{flex:1 1 0}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -683,6 +813,14 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		isTodayButtonShown: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "isTodayButtonShown",
+				required: false
+			}]
+		}],
 		now: [{
 			type: i0.Input,
 			args: [{
@@ -701,90 +839,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-const SAMPLE_DAY = new Date(2026, 0, 31);
-const DEFAULT_LAYOUT = {
-	order: [
-		"day",
-		"month",
-		"year"
-	],
-	separator: "."
-};
-const YEAR_LEN = 4;
-const PART_MAX_LEN = 2;
-const DAY_GROUPS = 3;
-const TIME_GROUPS = 2;
-const TEXT_RE = /^[\d\s.,/:\-T]+$/;
-function isDatePart(type) {
-	return type === "day" || type === "month" || type === "year";
-}
-function dayText(day, layout) {
-	const [year, month, date] = day.split("-");
-	const parts = {
-		day: date,
-		month,
-		year
-	};
-	return layout.order.map((part) => parts[part]).join(layout.separator);
-}
-function readDay(groups, layout) {
-	const parts = {};
-	layout.order.forEach((part, index) => {
-		parts[part] = groups[index];
-	});
-	const { day, month, year } = parts;
-	if (day === void 0 || month === void 0 || year?.length !== YEAR_LEN) return null;
-	if (day.length > PART_MAX_LEN || month.length > PART_MAX_LEN) return null;
-	return `${year}-${month.padStart(PART_MAX_LEN, "0")}-${day.padStart(PART_MAX_LEN, "0")}`;
-}
-function readTime(groups) {
-	if (groups.length !== TIME_GROUPS) return null;
-	const [hour, minute] = groups;
-	if (minute.length !== PART_MAX_LEN || hour.length > PART_MAX_LEN) return null;
-	return `${hour.padStart(PART_MAX_LEN, "0")}:${minute}`;
-}
-function readGroups(groups, type, layout) {
-	if (type === "time") return readTime(groups);
-	if (type === "date") return groups.length === DAY_GROUPS ? readDay(groups, layout) : null;
-	if (groups.length !== 5) return null;
-	const day = readDay(groups.slice(0, DAY_GROUPS), layout);
-	const time = readTime(groups.slice(DAY_GROUPS));
-	return day === null || time === null ? null : `${day}T${time}`;
-}
-function rtDateLayout(locale) {
-	const parts = new Intl.DateTimeFormat(locale, {
-		day: "2-digit",
-		month: "2-digit",
-		year: "numeric"
-	}).formatToParts(SAMPLE_DAY);
-	const order = parts.map((part) => part.type).filter((type) => isDatePart(type));
-	const separator = parts.find((part) => part.type === "literal")?.value.trim() ?? "";
-	if (order.length !== DAY_GROUPS || separator === "") return DEFAULT_LAYOUT;
-	return {
-		order,
-		separator
-	};
-}
-function rtDateText(value, type, layout) {
-	if (type === "time" || rtDateRead(value, type) === null) return value;
-	if (type === "date") return dayText(value, layout);
-	const [day, time] = value.split("T");
-	return `${dayText(day, layout)} ${time}`;
-}
-function rtDateShape(type, layout, letters) {
-	const time = `${letters.hour}:${letters.minute}`;
-	if (type === "time") return time;
-	const day = layout.order.map((part) => letters[part]).join(layout.separator);
-	return type === "date" ? day : `${day} ${time}`;
-}
-function rtDateParse(text, type, layout) {
-	const iso = rtDateRead(text, type);
-	if (iso !== null) return iso;
-	const value = text.trim();
-	if (!TEXT_RE.test(value)) return null;
-	const candidate = readGroups(value.match(/\d+/g) ?? [], type, layout);
-	return candidate === null ? null : rtDateRead(candidate, type);
-}
 const BEM_BLOCK = "rt-date-picker";
 var RtDatePickerComponent = class RtDatePickerComponent extends RtFormControlBase {
 	constructor() {
@@ -1005,6 +1059,7 @@ var RtDatePickerComponent = class RtDatePickerComponent extends RtFormControlBas
 						"max",
 						"minuteStep",
 						"sheet",
+						"isTodayButtonShown",
 						"now"
 					],
 					outputs: ["picked", "closed"]
@@ -1173,6 +1228,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { RT_DATE_YEAR_SPAN, RtDatePickerComponent, rtDateAddMonths, rtDateCanPage, rtDateCanPageYears, rtDateFirstDay, rtDateGridKey, rtDateInBounds, rtDateLayout, rtDateMonth, rtDateMonths, rtDateNow, rtDateParse, rtDateRead, rtDateShape, rtDateSplit, rtDateText, rtDateTime, rtDateTimeColumns, rtDateWeekdays, rtDateWrite, rtDateYearSpanStart, rtDateYears };
+export { RT_DATE_YEAR_SPAN, RtDatePanelComponent, RtDatePickerComponent, rtDateAddMonths, rtDateCanPage, rtDateCanPageYears, rtDateFirstDay, rtDateGridKey, rtDateInBounds, rtDateLayout, rtDateMonth, rtDateMonths, rtDateNow, rtDatePanelMonth, rtDateParse, rtDateRead, rtDateShape, rtDateSplit, rtDateText, rtDateTime, rtDateTimeColumns, rtDateWeekdays, rtDateWrite, rtDateYearSpanStart, rtDateYears };
 
 //# sourceMappingURL=rt-tools-ui-kit-v2-date-picker.mjs.map