@cube-dev/ui-kit 0.181.0 → 0.183.0

package/dist/components/other/Calendar/CalendarPanel.js

@@ -1,11 +1,12 @@
-/** @license MIT | @cube-dev/ui-kit v0.181.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.183.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { CalendarElement } from "./styled.js";
 import { CalendarGrid } from "./CalendarGrid.js";
 import { CalendarHeader } from "./CalendarHeader.js";
 import { PeriodGrid } from "./PeriodGrid.js";
-import { useMemo, useState } from "react";
+import { c } from "react-compiler-runtime";
+import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useDateFormatter } from "react-aria";
 import { endOfMonth, endOfYear, isSameMonth, startOfMonth, startOfYear, toCalendar, today } from "@internationalized/date";
@@ -27,144 +28,522 @@ const PERIOD_GRID_STYLES = { width: "(7 * (3x + 2bw))" };
 * jump to another month.
 */
 function CalendarPanel(props) {
+	const $ = c(194);
 	const { t } = useI18n();
-	let { state, title, calendarProps, prevButtonProps, nextButtonProps, hasMonthYearNavigation = true, selectedRange, pickerMode, elementRef } = props;
-	let [view, setView] = useState("day");
-	let [anchor, setAnchor] = useState(state.focusedDate);
-	let visibleStart = state.visibleRange.start;
-	let calendar = visibleStart.calendar;
-	let timeZone = state.timeZone;
-	let calendarId = calendar.identifier;
-	let monthFormatter = useDateFormatter({
-		month: "long",
-		timeZone,
-		calendar: calendarId
-	});
-	let shortMonthFormatter = useDateFormatter({
-		month: "short",
-		timeZone,
-		calendar: calendarId
-	});
-	let yearFormatter = useDateFormatter({
-		year: "numeric",
-		timeZone,
-		calendar: calendarId
-	});
-	let todayDate = useMemo(() => toCalendar(today(timeZone), calendar), [timeZone, calendar]);
-	let format = (formatter, date) => formatter.format(date.toDate(timeZone));
-	/** Whether a whole period lies outside the calendar's allowed range. */
-	let isPeriodDisabled = (start, end) => state.isDisabled || state.minValue != null && end.compare(state.minValue) < 0 || state.maxValue != null && start.compare(state.maxValue) > 0;
-	let hasNavigation = hasMonthYearNavigation && isSameMonth(visibleStart, state.visibleRange.end);
-	let openView = (next) => {
-		setAnchor(state.focusedDate);
-		setView(next);
-	};
-	let onKeyDown = (e) => {
-		if (view !== "day" && e.key === "Escape") {
-			e.preventDefault();
-			e.stopPropagation();
-			setView("day");
-			state.setFocused(true);
-		}
-	};
+	const { state, title, calendarProps, prevButtonProps, nextButtonProps, hasMonthYearNavigation: t0, selectedRange, pickerMode, elementRef } = props;
+	const hasMonthYearNavigation = t0 === void 0 ? true : t0;
+	const [view, setView] = useState("day");
+	const [anchor, setAnchor] = useState(state.focusedDate);
+	const visibleStart = state.visibleRange.start;
+	const calendar = visibleStart.calendar;
+	const timeZone = state.timeZone;
+	const calendarId = calendar.identifier;
+	let t1;
+	if ($[0] !== calendarId || $[1] !== timeZone) {
+		t1 = {
+			month: "long",
+			timeZone,
+			calendar: calendarId
+		};
+		$[0] = calendarId;
+		$[1] = timeZone;
+		$[2] = t1;
+	} else t1 = $[2];
+	const monthFormatter = useDateFormatter(t1);
+	let t2;
+	if ($[3] !== calendarId || $[4] !== timeZone) {
+		t2 = {
+			month: "short",
+			timeZone,
+			calendar: calendarId
+		};
+		$[3] = calendarId;
+		$[4] = timeZone;
+		$[5] = t2;
+	} else t2 = $[5];
+	const shortMonthFormatter = useDateFormatter(t2);
+	let t3;
+	if ($[6] !== calendarId || $[7] !== timeZone) {
+		t3 = {
+			year: "numeric",
+			timeZone,
+			calendar: calendarId
+		};
+		$[6] = calendarId;
+		$[7] = timeZone;
+		$[8] = t3;
+	} else t3 = $[8];
+	const yearFormatter = useDateFormatter(t3);
+	let t4;
+	if ($[9] !== calendar || $[10] !== timeZone) {
+		t4 = toCalendar(today(timeZone), calendar);
+		$[9] = calendar;
+		$[10] = timeZone;
+		$[11] = t4;
+	} else t4 = $[11];
+	const todayDate = t4;
+	let t5;
+	if ($[12] !== timeZone) {
+		t5 = (formatter, date) => formatter.format(date.toDate(timeZone));
+		$[12] = timeZone;
+		$[13] = t5;
+	} else t5 = $[13];
+	const format = t5;
+	let t6;
+	if ($[14] !== state.isDisabled || $[15] !== state.maxValue || $[16] !== state.minValue) {
+		t6 = (start, end) => state.isDisabled || state.minValue != null && end.compare(state.minValue) < 0 || state.maxValue != null && start.compare(state.maxValue) > 0;
+		$[14] = state.isDisabled;
+		$[15] = state.maxValue;
+		$[16] = state.minValue;
+		$[17] = t6;
+	} else t6 = $[17];
+	const isPeriodDisabled = t6;
+	let t7;
+	if ($[18] !== hasMonthYearNavigation || $[19] !== state.visibleRange.end || $[20] !== visibleStart) {
+		t7 = hasMonthYearNavigation && isSameMonth(visibleStart, state.visibleRange.end);
+		$[18] = hasMonthYearNavigation;
+		$[19] = state.visibleRange.end;
+		$[20] = visibleStart;
+		$[21] = t7;
+	} else t7 = $[21];
+	const hasNavigation = t7;
+	let t8;
+	if ($[22] !== state.focusedDate) {
+		t8 = (next) => {
+			setAnchor(state.focusedDate);
+			setView(next);
+		};
+		$[22] = state.focusedDate;
+		$[23] = t8;
+	} else t8 = $[23];
+	const openView = t8;
+	let t9;
+	if ($[24] !== state || $[25] !== view) {
+		t9 = (e) => {
+			if (view !== "day" && e.key === "Escape") {
+				e.preventDefault();
+				e.stopPropagation();
+				setView("day");
+				state.setFocused(true);
+			}
+		};
+		$[24] = state;
+		$[25] = view;
+		$[26] = t9;
+	} else t9 = $[26];
+	const onKeyDown = t9;
 	let header;
 	let body;
 	if (view === "month") {
-		let monthDate = (month) => startOfMonth(anchor.set({ month }));
-		let monthCount = calendar.getMonthsInYear(anchor);
-		let cells = Array.from({ length: monthCount }, (_, index) => {
-			let date = monthDate(index + 1);
-			return {
-				key: `month-${index + 1}`,
-				label: format(shortMonthFormatter, date),
-				isSelected: isSameMonth(date, visibleStart),
-				isCurrent: isSameMonth(date, todayDate),
-				isDisabled: isPeriodDisabled(date, endOfMonth(date))
+		let t10;
+		if ($[27] !== anchor) {
+			t10 = (month) => startOfMonth(anchor.set({ month }));
+			$[27] = anchor;
+			$[28] = t10;
+		} else t10 = $[28];
+		const monthDate = t10;
+		let t11;
+		if ($[29] !== anchor || $[30] !== calendar || $[31] !== format || $[32] !== isPeriodDisabled || $[33] !== monthDate || $[34] !== shortMonthFormatter || $[35] !== todayDate || $[36] !== visibleStart) {
+			const monthCount = calendar.getMonthsInYear(anchor);
+			let t12;
+			if ($[38] !== format || $[39] !== isPeriodDisabled || $[40] !== monthDate || $[41] !== shortMonthFormatter || $[42] !== todayDate || $[43] !== visibleStart) {
+				t12 = (_, index) => {
+					const date_0 = monthDate(index + 1);
+					return {
+						key: `month-${index + 1}`,
+						label: format(shortMonthFormatter, date_0),
+						isSelected: isSameMonth(date_0, visibleStart),
+						isCurrent: isSameMonth(date_0, todayDate),
+						isDisabled: isPeriodDisabled(date_0, endOfMonth(date_0))
+					};
+				};
+				$[38] = format;
+				$[39] = isPeriodDisabled;
+				$[40] = monthDate;
+				$[41] = shortMonthFormatter;
+				$[42] = todayDate;
+				$[43] = visibleStart;
+				$[44] = t12;
+			} else t12 = $[44];
+			t11 = Array.from({ length: monthCount }, t12);
+			$[29] = anchor;
+			$[30] = calendar;
+			$[31] = format;
+			$[32] = isPeriodDisabled;
+			$[33] = monthDate;
+			$[34] = shortMonthFormatter;
+			$[35] = todayDate;
+			$[36] = visibleStart;
+			$[37] = t11;
+		} else t11 = $[37];
+		const cells = t11;
+		let T0;
+		let nextYear;
+		let t12;
+		let t13;
+		let t14;
+		let t15;
+		if ($[45] !== anchor || $[46] !== format || $[47] !== isPeriodDisabled || $[48] !== state.isDisabled || $[49] !== t || $[50] !== yearFormatter) {
+			const prevYear = anchor.subtract({ years: 1 });
+			nextYear = anchor.add({ years: 1 });
+			T0 = CalendarHeader;
+			let t16;
+			if ($[57] !== anchor || $[58] !== format || $[59] !== yearFormatter) {
+				t16 = format(yearFormatter, anchor);
+				$[57] = anchor;
+				$[58] = format;
+				$[59] = yearFormatter;
+				$[60] = t16;
+			} else t16 = $[60];
+			let t17;
+			if ($[61] === Symbol.for("react.memo_cache_sentinel")) {
+				t17 = () => setView("year");
+				$[61] = t17;
+			} else t17 = $[61];
+			if ($[62] !== state.isDisabled || $[63] !== t16) {
+				t14 = [{
+					key: "year",
+					label: t16,
+					isDisabled: state.isDisabled,
+					onPress: t17
+				}];
+				$[62] = state.isDisabled;
+				$[63] = t16;
+				$[64] = t14;
+			} else t14 = $[64];
+			let t18;
+			if ($[65] !== t) {
+				t18 = t("calendar.previousYear", "Previous year");
+				$[65] = t;
+				$[66] = t18;
+			} else t18 = $[66];
+			const t19 = isPeriodDisabled(startOfYear(prevYear), endOfYear(prevYear));
+			let t20;
+			if ($[67] !== prevYear) {
+				t20 = () => setAnchor(prevYear);
+				$[67] = prevYear;
+				$[68] = t20;
+			} else t20 = $[68];
+			if ($[69] !== t18 || $[70] !== t19 || $[71] !== t20) {
+				t15 = {
+					"aria-label": t18,
+					isDisabled: t19,
+					onPress: t20
+				};
+				$[69] = t18;
+				$[70] = t19;
+				$[71] = t20;
+				$[72] = t15;
+			} else t15 = $[72];
+			if ($[73] !== t) {
+				t12 = t("calendar.nextYear", "Next year");
+				$[73] = t;
+				$[74] = t12;
+			} else t12 = $[74];
+			t13 = isPeriodDisabled(startOfYear(nextYear), endOfYear(nextYear));
+			$[45] = anchor;
+			$[46] = format;
+			$[47] = isPeriodDisabled;
+			$[48] = state.isDisabled;
+			$[49] = t;
+			$[50] = yearFormatter;
+			$[51] = T0;
+			$[52] = nextYear;
+			$[53] = t12;
+			$[54] = t13;
+			$[55] = t14;
+			$[56] = t15;
+		} else {
+			T0 = $[51];
+			nextYear = $[52];
+			t12 = $[53];
+			t13 = $[54];
+			t14 = $[55];
+			t15 = $[56];
+		}
+		let t16;
+		if ($[75] !== nextYear) {
+			t16 = () => setAnchor(nextYear);
+			$[75] = nextYear;
+			$[76] = t16;
+		} else t16 = $[76];
+		let t17;
+		if ($[77] !== t12 || $[78] !== t13 || $[79] !== t16) {
+			t17 = {
+				"aria-label": t12,
+				isDisabled: t13,
+				onPress: t16
 			};
-		});
-		let prevYear = anchor.subtract({ years: 1 });
-		let nextYear = anchor.add({ years: 1 });
-		header = /* @__PURE__ */ jsx(CalendarHeader, {
-			segments: [{
-				key: "year",
-				label: format(yearFormatter, anchor),
-				isDisabled: state.isDisabled,
-				onPress: () => setView("year")
-			}],
-			prevButtonProps: {
-				"aria-label": t("calendar.previousYear", "Previous year"),
-				isDisabled: isPeriodDisabled(startOfYear(prevYear), endOfYear(prevYear)),
-				onPress: () => setAnchor(prevYear)
-			},
-			nextButtonProps: {
-				"aria-label": t("calendar.nextYear", "Next year"),
-				isDisabled: isPeriodDisabled(startOfYear(nextYear), endOfYear(nextYear)),
-				onPress: () => setAnchor(nextYear)
-			}
-		});
-		body = /* @__PURE__ */ jsx(PeriodGrid, {
-			autoFocus: true,
-			"aria-label": t("calendar.months", "Months"),
-			cells,
-			styles: PERIOD_GRID_STYLES,
-			columns: MONTH_COLUMNS,
-			focusedIndex: anchor.month - 1,
-			onCellPress: (index) => {
-				state.setFocusedDate(anchor.set({ month: index + 1 }));
+			$[77] = t12;
+			$[78] = t13;
+			$[79] = t16;
+			$[80] = t17;
+		} else t17 = $[80];
+		let t18;
+		if ($[81] !== T0 || $[82] !== t14 || $[83] !== t15 || $[84] !== t17) {
+			t18 = /* @__PURE__ */ jsx(T0, {
+				segments: t14,
+				prevButtonProps: t15,
+				nextButtonProps: t17
+			});
+			$[81] = T0;
+			$[82] = t14;
+			$[83] = t15;
+			$[84] = t17;
+			$[85] = t18;
+		} else t18 = $[85];
+		header = t18;
+		let t19;
+		if ($[86] !== t) {
+			t19 = t("calendar.months", "Months");
+			$[86] = t;
+			$[87] = t19;
+		} else t19 = $[87];
+		const t20 = anchor.month - 1;
+		let t21;
+		if ($[88] !== anchor || $[89] !== state) {
+			t21 = (index_0) => {
+				state.setFocusedDate(anchor.set({ month: index_0 + 1 }));
 				setView("day");
-			},
-			onCellFocus: (index) => setAnchor(anchor.set({ month: index + 1 })),
-			onMoveFocus: (delta) => setAnchor(anchor.add({ months: delta })),
-			onMovePage: (delta) => setAnchor(anchor.add({ years: delta }))
-		}, "month");
+			};
+			$[88] = anchor;
+			$[89] = state;
+			$[90] = t21;
+		} else t21 = $[90];
+		let t22;
+		let t23;
+		let t24;
+		if ($[91] !== anchor) {
+			t22 = (index_1) => setAnchor(anchor.set({ month: index_1 + 1 }));
+			t23 = (delta) => setAnchor(anchor.add({ months: delta }));
+			t24 = (delta_0) => setAnchor(anchor.add({ years: delta_0 }));
+			$[91] = anchor;
+			$[92] = t22;
+			$[93] = t23;
+			$[94] = t24;
+		} else {
+			t22 = $[92];
+			t23 = $[93];
+			t24 = $[94];
+		}
+		let t25;
+		if ($[95] !== cells || $[96] !== t19 || $[97] !== t20 || $[98] !== t21 || $[99] !== t22 || $[100] !== t23 || $[101] !== t24) {
+			t25 = /* @__PURE__ */ jsx(PeriodGrid, {
+				autoFocus: true,
+				"aria-label": t19,
+				cells,
+				styles: PERIOD_GRID_STYLES,
+				columns: MONTH_COLUMNS,
+				focusedIndex: t20,
+				onCellPress: t21,
+				onCellFocus: t22,
+				onMoveFocus: t23,
+				onMovePage: t24
+			}, "month");
+			$[95] = cells;
+			$[96] = t19;
+			$[97] = t20;
+			$[98] = t21;
+			$[99] = t22;
+			$[100] = t23;
+			$[101] = t24;
+			$[102] = t25;
+		} else t25 = $[102];
+		body = t25;
 	} else if (view === "year") {
-		let yearDate = (year) => startOfYear(anchor.set({ year }));
-		let decadeStart = Math.floor(anchor.year / 10) * 10;
-		let firstYear = decadeStart - 1;
-		let cells = Array.from({ length: YEAR_CELLS }, (_, index) => {
-			let year = firstYear + index;
-			let date = yearDate(year);
-			return {
-				key: `year-${year}`,
-				label: format(yearFormatter, date),
-				isSelected: year === visibleStart.year,
-				isCurrent: year === todayDate.year,
-				isOutside: year < decadeStart || year > decadeStart + 9,
-				isDisabled: isPeriodDisabled(date, endOfYear(date))
+		let t10;
+		if ($[103] !== anchor) {
+			t10 = (year) => startOfYear(anchor.set({ year }));
+			$[103] = anchor;
+			$[104] = t10;
+		} else t10 = $[104];
+		const yearDate = t10;
+		const decadeStart = Math.floor(anchor.year / 10) * 10;
+		const firstYear = decadeStart - 1;
+		let t11;
+		if ($[105] !== decadeStart || $[106] !== firstYear || $[107] !== format || $[108] !== isPeriodDisabled || $[109] !== todayDate || $[110] !== visibleStart.year || $[111] !== yearDate || $[112] !== yearFormatter) {
+			t11 = Array.from({ length: YEAR_CELLS }, (__0, index_2) => {
+				const year_0 = firstYear + index_2;
+				const date_1 = yearDate(year_0);
+				return {
+					key: `year-${year_0}`,
+					label: format(yearFormatter, date_1),
+					isSelected: year_0 === visibleStart.year,
+					isCurrent: year_0 === todayDate.year,
+					isOutside: year_0 < decadeStart || year_0 > decadeStart + 9,
+					isDisabled: isPeriodDisabled(date_1, endOfYear(date_1))
+				};
+			});
+			$[105] = decadeStart;
+			$[106] = firstYear;
+			$[107] = format;
+			$[108] = isPeriodDisabled;
+			$[109] = todayDate;
+			$[110] = visibleStart.year;
+			$[111] = yearDate;
+			$[112] = yearFormatter;
+			$[113] = t11;
+		} else t11 = $[113];
+		const cells_0 = t11;
+		let t12;
+		if ($[114] !== decadeStart || $[115] !== format || $[116] !== yearDate || $[117] !== yearFormatter) {
+			t12 = format(yearFormatter, yearDate(decadeStart));
+			$[114] = decadeStart;
+			$[115] = format;
+			$[116] = yearDate;
+			$[117] = yearFormatter;
+			$[118] = t12;
+		} else t12 = $[118];
+		let t13;
+		if ($[119] !== decadeStart || $[120] !== format || $[121] !== yearDate || $[122] !== yearFormatter) {
+			t13 = format(yearFormatter, yearDate(decadeStart + 9));
+			$[119] = decadeStart;
+			$[120] = format;
+			$[121] = yearDate;
+			$[122] = yearFormatter;
+			$[123] = t13;
+		} else t13 = $[123];
+		const t14 = `${t12} – ${t13}`;
+		let t15;
+		if ($[124] !== t) {
+			t15 = t("calendar.previousYears", "Previous years");
+			$[124] = t;
+			$[125] = t15;
+		} else t15 = $[125];
+		let t16;
+		if ($[126] !== decadeStart || $[127] !== isPeriodDisabled || $[128] !== yearDate) {
+			t16 = isPeriodDisabled(yearDate(decadeStart - 10), endOfYear(yearDate(decadeStart - 1)));
+			$[126] = decadeStart;
+			$[127] = isPeriodDisabled;
+			$[128] = yearDate;
+			$[129] = t16;
+		} else t16 = $[129];
+		let t17;
+		if ($[130] !== anchor) {
+			t17 = () => setAnchor(anchor.subtract({ years: 10 }));
+			$[130] = anchor;
+			$[131] = t17;
+		} else t17 = $[131];
+		let t18;
+		if ($[132] !== t15 || $[133] !== t16 || $[134] !== t17) {
+			t18 = {
+				"aria-label": t15,
+				isDisabled: t16,
+				onPress: t17
 			};
-		});
-		header = /* @__PURE__ */ jsx(CalendarHeader, {
-			title: `${format(yearFormatter, yearDate(decadeStart))} – ${format(yearFormatter, yearDate(decadeStart + 9))}`,
-			prevButtonProps: {
-				"aria-label": t("calendar.previousYears", "Previous years"),
-				isDisabled: isPeriodDisabled(yearDate(decadeStart - 10), endOfYear(yearDate(decadeStart - 1))),
-				onPress: () => setAnchor(anchor.subtract({ years: 10 }))
-			},
-			nextButtonProps: {
-				"aria-label": t("calendar.nextYears", "Next years"),
-				isDisabled: isPeriodDisabled(yearDate(decadeStart + 10), endOfYear(yearDate(decadeStart + 19))),
-				onPress: () => setAnchor(anchor.add({ years: 10 }))
-			}
-		});
-		body = /* @__PURE__ */ jsx(PeriodGrid, {
-			autoFocus: true,
-			"aria-label": t("calendar.years", "Years"),
-			cells,
-			styles: PERIOD_GRID_STYLES,
-			columns: YEAR_COLUMNS,
-			focusedIndex: anchor.year - firstYear,
-			onCellPress: (index) => {
-				setAnchor(anchor.set({ year: firstYear + index }));
+			$[132] = t15;
+			$[133] = t16;
+			$[134] = t17;
+			$[135] = t18;
+		} else t18 = $[135];
+		let t19;
+		if ($[136] !== t) {
+			t19 = t("calendar.nextYears", "Next years");
+			$[136] = t;
+			$[137] = t19;
+		} else t19 = $[137];
+		let t20;
+		if ($[138] !== decadeStart || $[139] !== isPeriodDisabled || $[140] !== yearDate) {
+			t20 = isPeriodDisabled(yearDate(decadeStart + 10), endOfYear(yearDate(decadeStart + 19)));
+			$[138] = decadeStart;
+			$[139] = isPeriodDisabled;
+			$[140] = yearDate;
+			$[141] = t20;
+		} else t20 = $[141];
+		let t21;
+		if ($[142] !== anchor) {
+			t21 = () => setAnchor(anchor.add({ years: 10 }));
+			$[142] = anchor;
+			$[143] = t21;
+		} else t21 = $[143];
+		let t22;
+		if ($[144] !== t19 || $[145] !== t20 || $[146] !== t21) {
+			t22 = {
+				"aria-label": t19,
+				isDisabled: t20,
+				onPress: t21
+			};
+			$[144] = t19;
+			$[145] = t20;
+			$[146] = t21;
+			$[147] = t22;
+		} else t22 = $[147];
+		let t23;
+		if ($[148] !== t14 || $[149] !== t18 || $[150] !== t22) {
+			t23 = /* @__PURE__ */ jsx(CalendarHeader, {
+				title: t14,
+				prevButtonProps: t18,
+				nextButtonProps: t22
+			});
+			$[148] = t14;
+			$[149] = t18;
+			$[150] = t22;
+			$[151] = t23;
+		} else t23 = $[151];
+		header = t23;
+		let t24;
+		if ($[152] !== t) {
+			t24 = t("calendar.years", "Years");
+			$[152] = t;
+			$[153] = t24;
+		} else t24 = $[153];
+		const t25 = anchor.year - firstYear;
+		let t26;
+		let t27;
+		if ($[154] !== anchor || $[155] !== firstYear) {
+			t26 = (index_3) => {
+				setAnchor(anchor.set({ year: firstYear + index_3 }));
 				setView("month");
-			},
-			onCellFocus: (index) => setAnchor(anchor.set({ year: firstYear + index })),
-			onMoveFocus: (delta) => setAnchor(anchor.add({ years: delta })),
-			onMovePage: (delta) => setAnchor(anchor.add({ years: delta * 10 }))
-		}, "year");
+			};
+			t27 = (index_4) => setAnchor(anchor.set({ year: firstYear + index_4 }));
+			$[154] = anchor;
+			$[155] = firstYear;
+			$[156] = t26;
+			$[157] = t27;
+		} else {
+			t26 = $[156];
+			t27 = $[157];
+		}
+		let t28;
+		let t29;
+		if ($[158] !== anchor) {
+			t28 = (delta_1) => setAnchor(anchor.add({ years: delta_1 }));
+			t29 = (delta_2) => setAnchor(anchor.add({ years: delta_2 * 10 }));
+			$[158] = anchor;
+			$[159] = t28;
+			$[160] = t29;
+		} else {
+			t28 = $[159];
+			t29 = $[160];
+		}
+		let t30;
+		if ($[161] !== cells_0 || $[162] !== t24 || $[163] !== t25 || $[164] !== t26 || $[165] !== t27 || $[166] !== t28 || $[167] !== t29) {
+			t30 = /* @__PURE__ */ jsx(PeriodGrid, {
+				autoFocus: true,
+				"aria-label": t24,
+				cells: cells_0,
+				styles: PERIOD_GRID_STYLES,
+				columns: YEAR_COLUMNS,
+				focusedIndex: t25,
+				onCellPress: t26,
+				onCellFocus: t27,
+				onMoveFocus: t28,
+				onMovePage: t29
+			}, "year");
+			$[161] = cells_0;
+			$[162] = t24;
+			$[163] = t25;
+			$[164] = t26;
+			$[165] = t27;
+			$[166] = t28;
+			$[167] = t29;
+			$[168] = t30;
+		} else t30 = $[168];
+		body = t30;
 	} else {
-		header = /* @__PURE__ */ jsx(CalendarHeader, {
-			title,
-			segments: hasNavigation ? [{
+		let t10;
+		if ($[169] !== format || $[170] !== hasNavigation || $[171] !== monthFormatter || $[172] !== openView || $[173] !== state.isDisabled || $[174] !== visibleStart || $[175] !== yearFormatter) {
+			t10 = hasNavigation ? [{
 				key: "month",
 				label: format(monthFormatter, visibleStart),
 				isDisabled: state.isDisabled,
@@ -174,21 +553,66 @@ function CalendarPanel(props) {
 				label: format(yearFormatter, visibleStart),
 				isDisabled: state.isDisabled,
 				onPress: () => openView("year")
-			}] : void 0,
-			prevButtonProps,
-			nextButtonProps
-		});
-		body = /* @__PURE__ */ jsx(CalendarGrid, {
-			state,
-			selectedRange,
-			pickerMode
-		});
+			}] : void 0;
+			$[169] = format;
+			$[170] = hasNavigation;
+			$[171] = monthFormatter;
+			$[172] = openView;
+			$[173] = state.isDisabled;
+			$[174] = visibleStart;
+			$[175] = yearFormatter;
+			$[176] = t10;
+		} else t10 = $[176];
+		let t11;
+		if ($[177] !== nextButtonProps || $[178] !== prevButtonProps || $[179] !== t10 || $[180] !== title) {
+			t11 = /* @__PURE__ */ jsx(CalendarHeader, {
+				title,
+				segments: t10,
+				prevButtonProps,
+				nextButtonProps
+			});
+			$[177] = nextButtonProps;
+			$[178] = prevButtonProps;
+			$[179] = t10;
+			$[180] = title;
+			$[181] = t11;
+		} else t11 = $[181];
+		header = t11;
+		let t12;
+		if ($[182] !== pickerMode || $[183] !== selectedRange || $[184] !== state) {
+			t12 = /* @__PURE__ */ jsx(CalendarGrid, {
+				state,
+				selectedRange,
+				pickerMode
+			});
+			$[182] = pickerMode;
+			$[183] = selectedRange;
+			$[184] = state;
+			$[185] = t12;
+		} else t12 = $[185];
+		body = t12;
 	}
-	return /* @__PURE__ */ jsxs(CalendarElement, {
-		ref: elementRef,
-		...mergeProps$1(calendarProps, { onKeyDown }),
-		children: [header, body]
-	});
+	let t10;
+	if ($[186] !== calendarProps || $[187] !== onKeyDown) {
+		t10 = mergeProps$1(calendarProps, { onKeyDown });
+		$[186] = calendarProps;
+		$[187] = onKeyDown;
+		$[188] = t10;
+	} else t10 = $[188];
+	let t11;
+	if ($[189] !== body || $[190] !== elementRef || $[191] !== header || $[192] !== t10) {
+		t11 = /* @__PURE__ */ jsxs(CalendarElement, {
+			ref: elementRef,
+			...t10,
+			children: [header, body]
+		});
+		$[189] = body;
+		$[190] = elementRef;
+		$[191] = header;
+		$[192] = t10;
+		$[193] = t11;
+	} else t11 = $[193];
+	return t11;
 }
 
 //#endregion