@super-calendar/native 2.0.0

package/dist/index.mjs

@@ -0,0 +1,1543 @@
+import { a as useWebPagerKeys, c as defaultTheme, i as MonthView, l as mergeTheme, n as DefaultMonthEvent, o as CalendarThemeProvider, r as MonthPager, s as darkTheme, t as MonthList, u as useCalendarTheme } from "./MonthList-CyrEJ_U6.mjs";
+import { addDays, differenceInCalendarDays, endOfDay, endOfMonth, endOfWeek, format, getHours, getISOWeek, getMinutes, isSameDay, startOfDay, startOfMonth, startOfWeek } from "date-fns";
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import Animated, { runOnJS, scrollTo, useAnimatedReaction, useAnimatedRef, useAnimatedScrollHandler, useAnimatedStyle, useDerivedValue, useSharedValue } from "react-native-reanimated";
+import { buildMonthGrid, buildMonthWeeks, cellRangeFromDrag, closedHourBands, daySelectionState, eventAccessibilityLabel, eventChipLayout, eventTimeLabel, eventsInTimeZone, expandRecurringEvents, formatHour, getIsToday, getIsToday as getIsToday$1, getViewDays, getViewDays as getViewDays$1, getWeekDays, isAllDayEvent, isAllDayEvent as isAllDayEvent$1, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isSameCalendarDay as isSameCalendarDay$1, isWeekend, isWeekend as isWeekend$1, isWithinDateRange, layoutDayEvents, layoutDayEvents as layoutDayEvents$1, minutesIntoDay, nextDateRange, resolveDraggedBounds, snapDeltaMinutes, titleEllipsizeMode, titleNumberOfLines, toZonedTime, useDateRange, useMonthGrid, viewDayCount } from "@super-calendar/core";
+import { LegendList } from "@legendapp/list/react-native";
+import { Platform, Pressable, StyleSheet, Text, TouchableOpacity, View, useWindowDimensions } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Gesture, GestureDetector } from "react-native-gesture-handler";
+//#region src/components/Agenda.tsx
+/**
+* A vertical, day-grouped list of events (no time grid). Events are sorted by
+* start, grouped under a date header per day. The consumer controls which
+* events (and therefore which date range) are shown.
+*/
+function Agenda({ events, locale, renderEvent, keyExtractor, onPressEvent, onLongPressEvent, onPressDay, activeDate, itemSeparatorComponent }) {
+	const theme = useCalendarTheme();
+	const RenderEventComponent = renderEvent;
+	const rows = useMemo(() => {
+		const sorted = [...events].sort((a, b) => a.start.getTime() - b.start.getTime());
+		const out = [];
+		let currentDay = null;
+		sorted.forEach((event, index) => {
+			if (!currentDay || !isSameDay(event.start, currentDay)) {
+				currentDay = startOfDay(event.start);
+				out.push({
+					kind: "header",
+					date: currentDay,
+					key: `h-${currentDay.toISOString()}`
+				});
+			}
+			out.push({
+				kind: "event",
+				event,
+				index,
+				key: `e-${keyExtractor(event, index)}`
+			});
+		});
+		return out;
+	}, [events, keyExtractor]);
+	const keyExtractorRow = useCallback((row) => row.key, []);
+	const renderItem = useCallback(({ item }) => {
+		if (item.kind === "header") {
+			const isHighlighted = activeDate ? isSameDay(item.date, activeDate) : getIsToday$1(item.date);
+			return /* @__PURE__ */ jsx(Text, {
+				style: [styles$3.header, { color: isHighlighted ? theme.colors.todayBackground : theme.colors.textMuted }],
+				onPress: onPressDay ? () => onPressDay(item.date) : void 0,
+				accessibilityRole: onPressDay ? "button" : "header",
+				children: format(item.date, "EEEE, d LLLL", { locale })
+			});
+		}
+		return /* @__PURE__ */ jsx(View, {
+			style: styles$3.eventRow,
+			children: /* @__PURE__ */ jsx(RenderEventComponent, {
+				event: item.event,
+				mode: "schedule",
+				isAllDay: isAllDayEvent$1(item.event),
+				onPress: () => onPressEvent(item.event),
+				onLongPress: onLongPressEvent ? () => onLongPressEvent(item.event) : void 0
+			})
+		});
+	}, [
+		theme,
+		locale,
+		activeDate,
+		onPressDay,
+		onPressEvent,
+		onLongPressEvent,
+		RenderEventComponent
+	]);
+	if (rows.length === 0) return /* @__PURE__ */ jsx(Text, {
+		style: [styles$3.empty, { color: theme.colors.textMuted }],
+		children: "No events"
+	});
+	return /* @__PURE__ */ jsx(LegendList, {
+		style: styles$3.list,
+		data: rows,
+		keyExtractor: keyExtractorRow,
+		renderItem,
+		ItemSeparatorComponent: itemSeparatorComponent ?? void 0,
+		recycleItems: false
+	});
+}
+const styles$3 = StyleSheet.create({
+	list: { flex: 1 },
+	header: {
+		fontSize: 13,
+		fontWeight: "600",
+		paddingTop: 12,
+		paddingBottom: 4,
+		paddingHorizontal: 12
+	},
+	eventRow: {
+		paddingHorizontal: 12,
+		paddingVertical: 2
+	},
+	empty: {
+		fontSize: 14,
+		paddingVertical: 16,
+		paddingHorizontal: 12
+	}
+});
+//#endregion
+//#region src/components/DefaultEvent.tsx
+const BOX_PADDING_V = 2;
+const TIME_LINE_HEIGHT = 30;
+const FALLBACK_TITLE_LINE_HEIGHT = 16;
+const numericStyle = (value, fallback) => typeof value === "number" ? value : fallback;
+/**
+* The built-in event renderer: a filled, rounded box showing the event title
+* and (on the day/week grid, when the box is tall enough) its time range. The
+* title fills the box in whole lines, never a half-cut last line, and clips
+* without an ellipsis unless `ellipsizeTitle` is set. The time is secondary: it
+* only shows once a full line is free beneath the title. Pass your own
+* `renderEvent` to `<Calendar>` to replace it entirely.
+*/
+function DefaultEvent({ event, mode, boxHeight, isAllDay, ampm = false, showTime = true, ellipsizeTitle = false, allDayLabel, cellStyle, onPress, onLongPress }) {
+	const theme = useCalendarTheme();
+	const isAllDayEvent = isAllDay ?? false;
+	const timeLabel = eventTimeLabel({
+		mode,
+		isAllDay: isAllDayEvent,
+		start: event.start,
+		end: event.end,
+		ampm,
+		showTime,
+		allDayLabel
+	});
+	const ellipsizeMode = titleEllipsizeMode(ellipsizeTitle);
+	const titleLineHeight = numericStyle(theme.text.eventTitle.lineHeight, FALLBACK_TITLE_LINE_HEIGHT);
+	const accessibilityLabel = eventAccessibilityLabel({
+		title: event.title,
+		isAllDay: isAllDayEvent,
+		start: event.start,
+		end: event.end,
+		ampm,
+		allDayLabel
+	});
+	const fixedTitleLines = titleNumberOfLines(mode, isAllDayEvent);
+	const isSchedule = mode === "schedule";
+	const layout = useDerivedValue(() => eventChipLayout({
+		boxHeightPx: boxHeight?.value,
+		mode,
+		hasTime: timeLabel != null,
+		titleLineHeightPx: titleLineHeight,
+		timeLineHeightPx: TIME_LINE_HEIGHT,
+		paddingYPx: BOX_PADDING_V
+	}), [
+		boxHeight,
+		mode,
+		timeLabel,
+		titleLineHeight
+	]);
+	const titleClipStyle = useAnimatedStyle(() => {
+		const lines = layout.value.titleMaxLines;
+		return { maxHeight: lines > 0 ? lines * titleLineHeight : void 0 };
+	}, [layout, titleLineHeight]);
+	const timeStyle = useAnimatedStyle(() => {
+		return { display: layout.value.showTime ? "flex" : "none" };
+	}, [layout]);
+	return /* @__PURE__ */ jsxs(TouchableOpacity, {
+		style: [
+			styles$2.box,
+			isSchedule && styles$2.scheduleBox,
+			{ backgroundColor: theme.colors.eventBackground },
+			event.disabled && styles$2.disabled,
+			cellStyle
+		],
+		onPress,
+		onLongPress,
+		activeOpacity: .7,
+		accessibilityRole: "button",
+		accessibilityLabel,
+		accessibilityState: { disabled: event.disabled ?? false },
+		children: [event.title ? fixedTitleLines == null ? /* @__PURE__ */ jsx(Animated.View, {
+			style: [styles$2.titleClip, titleClipStyle],
+			children: /* @__PURE__ */ jsx(Text, {
+				style: [
+					theme.text.eventTitle,
+					isSchedule && styles$2.scheduleTitle,
+					{ color: theme.colors.eventText }
+				],
+				ellipsizeMode,
+				allowFontScaling: false,
+				children: event.title
+			})
+		}) : /* @__PURE__ */ jsx(Text, {
+			style: [
+				theme.text.eventTitle,
+				styles$2.title,
+				isSchedule && styles$2.scheduleTitle,
+				{ color: theme.colors.eventText }
+			],
+			numberOfLines: fixedTitleLines,
+			ellipsizeMode,
+			allowFontScaling: false,
+			children: event.title
+		}) : null, timeLabel ? /* @__PURE__ */ jsx(Animated.View, {
+			style: timeStyle,
+			children: /* @__PURE__ */ jsx(Text, {
+				style: [
+					styles$2.time,
+					isSchedule && styles$2.scheduleTime,
+					{ color: theme.colors.eventText }
+				],
+				numberOfLines: 2,
+				ellipsizeMode,
+				allowFontScaling: false,
+				children: timeLabel
+			})
+		}) : null]
+	});
+}
+const styles$2 = StyleSheet.create({
+	box: {
+		flexGrow: 1,
+		flexShrink: 1,
+		flexBasis: "auto",
+		borderRadius: 6,
+		paddingVertical: BOX_PADDING_V,
+		paddingHorizontal: 4,
+		overflow: "hidden"
+	},
+	scheduleBox: {
+		borderRadius: 8,
+		paddingVertical: 6,
+		paddingHorizontal: 10
+	},
+	scheduleTitle: {
+		fontSize: 14,
+		fontWeight: "600",
+		lineHeight: 18
+	},
+	scheduleTime: {
+		fontSize: 13,
+		lineHeight: 18,
+		opacity: .75
+	},
+	titleClip: { overflow: "hidden" },
+	title: { flexShrink: 1 },
+	time: {
+		fontSize: 11,
+		lineHeight: 15
+	},
+	disabled: { opacity: .5 }
+});
+//#endregion
+//#region src/utils/useWebGridZoom.ts
+const ZOOM_SENSITIVITY = .002;
+/**
+* Web-only: zoom the time grid with Ctrl/Cmd + scroll, standing in for the pinch
+* gesture that web has no equivalent of. `target` is the grid's host node — on
+* web a React Native View ref resolves to its DOM element. No-op off web, when
+* `enabled` is false, or before the node mounts. Plain scroll is left untouched.
+*/
+function useWebGridZoom(enabled, target, cellHeight, committedCellHeight, minHeight, maxHeight) {
+	useEffect(() => {
+		if (Platform.OS !== "web" || !enabled) return;
+		const node = target.current;
+		if (!node) return;
+		const handler = (event) => {
+			if (!event.ctrlKey && !event.metaKey) return;
+			event.preventDefault();
+			const next = Math.min(maxHeight, Math.max(minHeight, cellHeight.value * Math.exp(-event.deltaY * ZOOM_SENSITIVITY)));
+			cellHeight.value = next;
+			committedCellHeight.value = next;
+		};
+		node.addEventListener("wheel", handler, { passive: false });
+		return () => node.removeEventListener("wheel", handler);
+	}, [
+		enabled,
+		target,
+		cellHeight,
+		committedCellHeight,
+		minHeight,
+		maxHeight
+	]);
+}
+//#endregion
+//#region src/components/AllDayLane.tsx
+/**
+* The all-day lane that sits above the scrolling time grid. All-day events are
+* excluded from the timed columns (see `layoutDayEvents`) and shown here,
+* stacked under their day(s). Renders nothing when no day has an all-day event,
+* so timed-only calendars are unaffected.
+*/
+function AllDayLane({ days, events, mode, hourColumnWidth, dayWidth, renderEvent, keyExtractor, onPressEvent, onLongPressEvent }) {
+	const theme = useCalendarTheme();
+	const RenderEventComponent = renderEvent;
+	const allDay = events.filter(isAllDayEvent$1);
+	const perDay = days.map((day) => {
+		const start = startOfDay(day);
+		const next = addDays(start, 1);
+		return allDay.filter((event) => event.start < next && event.end > start);
+	});
+	if (perDay.every((list) => list.length === 0)) return null;
+	return /* @__PURE__ */ jsxs(View, {
+		style: [styles$1.lane, { borderBottomColor: theme.colors.gridLine }],
+		children: [/* @__PURE__ */ jsx(View, {
+			style: [styles$1.gutter, { width: hourColumnWidth }],
+			children: /* @__PURE__ */ jsx(Text, {
+				style: [styles$1.label, { color: theme.colors.textMuted }],
+				allowFontScaling: false,
+				children: "all-day"
+			})
+		}), days.map((day, dayIndex) => /* @__PURE__ */ jsx(View, {
+			style: [styles$1.column, { width: dayWidth }],
+			children: perDay[dayIndex].map((event, index) => /* @__PURE__ */ jsx(View, {
+				style: styles$1.chip,
+				children: /* @__PURE__ */ jsx(RenderEventComponent, {
+					event,
+					mode,
+					isAllDay: true,
+					onPress: () => onPressEvent(event),
+					onLongPress: onLongPressEvent ? () => onLongPressEvent(event) : void 0
+				})
+			}, keyExtractor(event, index)))
+		}, day.toISOString()))]
+	});
+}
+const styles$1 = StyleSheet.create({
+	lane: {
+		flexDirection: "row",
+		borderBottomWidth: StyleSheet.hairlineWidth
+	},
+	gutter: { justifyContent: "center" },
+	label: {
+		fontSize: 10,
+		textAlign: "right",
+		paddingRight: 6
+	},
+	column: {
+		paddingVertical: 2,
+		paddingHorizontal: 1,
+		gap: 2
+	},
+	chip: { minHeight: 18 }
+});
+//#endregion
+//#region src/components/TimeGrid.tsx
+const isWeb = Platform.OS === "web";
+const MINUTES_PER_HOUR = 60;
+const HOURS_PER_DAY = 24;
+const MINUTES_PER_DAY = MINUTES_PER_HOUR * HOURS_PER_DAY;
+const PAGE_WINDOW = 180;
+const PAGE_VIEWABILITY = { itemVisiblePercentThreshold: 90 };
+const DEFAULT_HOUR_HEIGHT = 48;
+const DEFAULT_MIN_HOUR_HEIGHT = 32;
+const DEFAULT_MAX_HOUR_HEIGHT = 160;
+const DEFAULT_HOUR_COLUMN_WIDTH = 56;
+const MIN_EVENT_HEIGHT = 32;
+const EVENT_GAP = 2;
+const DRAG_ACTIVATE_MS = 300;
+const MOVE_ACTIVATE_MS = 500;
+const DRAG_ACTIVATE_PX = 8;
+const RESIZE_HANDLE_HEIGHT = 14;
+const DEFAULT_DRAG_STEP_MINUTES = 15;
+const HOUR_LABEL_TOP_INSET = 12;
+const NOW_TICK_MS = 6e4;
+function useNow(enabled) {
+	const [now, setNow] = useState(() => /* @__PURE__ */ new Date());
+	useEffect(() => {
+		if (!enabled) return;
+		setNow(/* @__PURE__ */ new Date());
+		const id = setInterval(() => setNow(/* @__PURE__ */ new Date()), NOW_TICK_MS);
+		return () => clearInterval(id);
+	}, [enabled]);
+	return now;
+}
+function AnimatedEventBox({ positioned, cellHeight, minHour, left, width, dayWidth, dayIndex, dayCount, mode, renderEvent, snapMinutes, onPress, onLongPress, onDragEvent, onDragStart, showDragHandle }) {
+	const RenderEventComponent = renderEvent;
+	const theme = useCalendarTheme();
+	const draggable = onDragEvent != null && !positioned.event.disabled;
+	const resizable = draggable && !positioned.continuesAfter;
+	const moveOffset = useSharedValue(0);
+	const moveOffsetX = useSharedValue(0);
+	const resizeDelta = useSharedValue(0);
+	const boxHeight = useDerivedValue(() => Math.max(positioned.durationHours * cellHeight.value + resizeDelta.value, MIN_EVENT_HEIGHT), [positioned.durationHours]);
+	const boxStyle = useAnimatedStyle(() => ({
+		top: (positioned.startHours - minHour) * cellHeight.value + moveOffset.value,
+		height: boxHeight.value,
+		transform: [{ translateX: moveOffsetX.value }]
+	}), [
+		positioned.startHours,
+		positioned.durationHours,
+		minHour
+	]);
+	useEffect(() => {
+		moveOffset.value = 0;
+		moveOffsetX.value = 0;
+		resizeDelta.value = 0;
+	}, [
+		positioned.startHours,
+		positioned.durationHours,
+		moveOffset,
+		moveOffsetX,
+		resizeDelta
+	]);
+	const latest = useRef({
+		event: positioned.event,
+		onDragEvent,
+		onDragStart
+	});
+	latest.current = {
+		event: positioned.event,
+		onDragEvent,
+		onDragStart
+	};
+	const snapBack = useCallback(() => {
+		moveOffset.value = 0;
+		moveOffsetX.value = 0;
+		resizeDelta.value = 0;
+	}, [
+		moveOffset,
+		moveOffsetX,
+		resizeDelta
+	]);
+	const commitDrag = useCallback((deltaStartMin, deltaEndMin) => {
+		const { event, onDragEvent: handler } = latest.current;
+		if (!handler) return;
+		const next = resolveDraggedBounds(event.start, event.end, deltaStartMin, deltaEndMin, snapMinutes);
+		if (!next) {
+			snapBack();
+			return;
+		}
+		if (handler(event, next.start, next.end) === false) snapBack();
+	}, [snapMinutes, snapBack]);
+	const notifyDragStart = useCallback(() => {
+		latest.current.onDragStart?.(latest.current.event);
+	}, []);
+	const moveGesture = useMemo(() => {
+		const pan = Gesture.Pan().enabled(draggable).onStart(() => {
+			runOnJS(notifyDragStart)();
+		}).onUpdate((event) => {
+			moveOffset.value = event.translationY;
+			moveOffsetX.value = event.translationX;
+		}).onEnd((event) => {
+			const minuteDelta = snapDeltaMinutes(event.translationY, cellHeight.value, snapMinutes);
+			const rawDayDelta = dayWidth > 0 ? Math.round(event.translationX / dayWidth) : 0;
+			const dayDelta = Math.min(Math.max(dayIndex + rawDayDelta, 0), dayCount - 1) - dayIndex;
+			if (minuteDelta === 0 && dayDelta === 0) {
+				moveOffset.value = 0;
+				moveOffsetX.value = 0;
+				return;
+			}
+			moveOffset.value = minuteDelta / MINUTES_PER_HOUR * cellHeight.value;
+			moveOffsetX.value = dayDelta * dayWidth;
+			const totalDelta = minuteDelta + dayDelta * MINUTES_PER_DAY;
+			runOnJS(commitDrag)(totalDelta, totalDelta);
+		});
+		return isWeb ? pan.activeOffsetX([-8, DRAG_ACTIVATE_PX]).activeOffsetY([-8, DRAG_ACTIVATE_PX]) : pan.activateAfterLongPress(MOVE_ACTIVATE_MS);
+	}, [
+		draggable,
+		snapMinutes,
+		cellHeight,
+		moveOffset,
+		moveOffsetX,
+		dayWidth,
+		dayIndex,
+		dayCount,
+		commitDrag,
+		notifyDragStart
+	]);
+	const resizeGesture = useMemo(() => Gesture.Pan().enabled(resizable).onStart(() => {
+		runOnJS(notifyDragStart)();
+	}).onUpdate((event) => {
+		resizeDelta.value = event.translationY;
+	}).onEnd((event) => {
+		const delta = snapDeltaMinutes(event.translationY, cellHeight.value, snapMinutes);
+		if (delta === 0) {
+			resizeDelta.value = 0;
+			return;
+		}
+		resizeDelta.value = delta / MINUTES_PER_HOUR * cellHeight.value;
+		runOnJS(commitDrag)(0, delta);
+	}), [
+		resizable,
+		snapMinutes,
+		cellHeight,
+		resizeDelta,
+		commitDrag,
+		notifyDragStart
+	]);
+	const handlePress = () => onPress(positioned.event);
+	const handleLongPress = !draggable && onLongPress ? () => onLongPress(positioned.event) : void 0;
+	const box = /* @__PURE__ */ jsxs(Animated.View, {
+		style: [
+			styles.eventBox,
+			{
+				left,
+				width
+			},
+			boxStyle
+		],
+		children: [/* @__PURE__ */ jsx(RenderEventComponent, {
+			event: positioned.event,
+			mode,
+			boxHeight,
+			continuesBefore: positioned.continuesBefore,
+			continuesAfter: positioned.continuesAfter,
+			onPress: handlePress,
+			onLongPress: handleLongPress
+		}), resizable ? /* @__PURE__ */ jsx(GestureDetector, {
+			gesture: resizeGesture,
+			children: /* @__PURE__ */ jsx(Animated.View, {
+				style: styles.resizeHandle,
+				children: showDragHandle ? /* @__PURE__ */ jsx(View, { style: [styles.resizeGrip, { backgroundColor: theme.colors.eventText }] }) : null
+			})
+		}) : null]
+	});
+	if (!draggable) return box;
+	return /* @__PURE__ */ jsx(GestureDetector, {
+		gesture: moveGesture,
+		children: box
+	});
+}
+const HourRow = ({ hour, minHour, cellHeight, hourColumnWidth, label, ampm, hourComponent }) => {
+	const theme = useCalendarTheme();
+	const animatedStyle = useAnimatedStyle(() => ({ top: (hour - minHour) * cellHeight.value }), [hour, minHour]);
+	return /* @__PURE__ */ jsxs(Animated.View, {
+		style: [
+			styles.hourRow,
+			styles.nonInteractive,
+			animatedStyle
+		],
+		children: [hourComponent ? /* @__PURE__ */ jsx(View, {
+			style: { width: hourColumnWidth },
+			children: hourComponent(hour, ampm)
+		}) : /* @__PURE__ */ jsx(Text, {
+			style: [
+				theme.text.hourLabel,
+				styles.hourLabel,
+				{
+					width: hourColumnWidth,
+					color: theme.colors.textMuted
+				}
+			],
+			allowFontScaling: false,
+			children: label
+		}), /* @__PURE__ */ jsx(View, { style: [styles.hourLine, { backgroundColor: theme.colors.gridLine }] })]
+	});
+};
+const TimeslotLine = ({ hour, minHour, fraction, cellHeight, hourColumnWidth }) => {
+	const theme = useCalendarTheme();
+	const animatedStyle = useAnimatedStyle(() => ({ top: (hour - minHour + fraction) * cellHeight.value }), [
+		hour,
+		minHour,
+		fraction
+	]);
+	return /* @__PURE__ */ jsx(Animated.View, { style: [
+		styles.timeslotLine,
+		styles.nonInteractive,
+		{
+			left: hourColumnWidth,
+			backgroundColor: theme.colors.gridLine
+		},
+		animatedStyle
+	] });
+};
+const NowIndicator = ({ cellHeight, nowHours, minHour, left, width, color }) => {
+	const animatedStyle = useAnimatedStyle(() => ({ top: (nowHours - minHour) * cellHeight.value }), [nowHours, minHour]);
+	return /* @__PURE__ */ jsx(Animated.View, { style: [
+		styles.nowIndicator,
+		styles.nonInteractive,
+		{
+			left,
+			width,
+			backgroundColor: color
+		},
+		animatedStyle
+	] });
+};
+const ShadeBand = ({ cellHeight, startHour, endHour, minHour, left, width, color }) => {
+	const animatedStyle = useAnimatedStyle(() => ({
+		top: (startHour - minHour) * cellHeight.value,
+		height: (endHour - startHour) * cellHeight.value
+	}), [
+		startHour,
+		endHour,
+		minHour
+	]);
+	return /* @__PURE__ */ jsx(Animated.View, {
+		testID: "business-hours-shade",
+		style: [
+			styles.shadeBand,
+			styles.nonInteractive,
+			{
+				left,
+				width,
+				backgroundColor: color
+			},
+			animatedStyle
+		]
+	});
+};
+function TimetablePageInner({ mode, numberOfDays, date, events, cellHeight, hourHeight, committedCellHeight, scrollY, isActive, initialScrollY, onSettleOffset, weekStartsOn, weekEndsOn, width, hourColumnWidth, minHour, maxHour, ampm, timeslots, isRTL, showAllDayEventCell, showVerticalScrollIndicator, verticalScrollEnabled, hourComponent, calendarCellStyle, minHourHeight, maxHourHeight, showNowIndicator, businessHours, renderEvent, keyExtractor, snapMinutes, showDragHandle, onPressEvent, onLongPressEvent, onDragEvent, onDragStart, onPressCell, onLongPressCell, onCreateEvent }) {
+	const theme = useCalendarTheme();
+	const scrollRef = useAnimatedRef();
+	const heightSource = isActive ? cellHeight : committedCellHeight;
+	const isDragging = useSharedValue(false);
+	const isActiveShared = useSharedValue(isActive);
+	useEffect(() => {
+		isActiveShared.value = isActive;
+	}, [isActive, isActiveShared]);
+	const scrollHandler = useAnimatedScrollHandler({
+		onScroll: (event) => {
+			if (isActiveShared.value && isDragging.value) scrollY.value = event.contentOffset.y;
+		},
+		onBeginDrag: () => {
+			isDragging.value = true;
+		},
+		onEndDrag: (event) => {
+			isDragging.value = false;
+			if (!isWeb && isActiveShared.value) {
+				scrollY.value = event.contentOffset.y;
+				runOnJS(onSettleOffset)(event.contentOffset.y);
+			}
+		},
+		onMomentumEnd: (event) => {
+			isDragging.value = false;
+			if (!isWeb && isActiveShared.value) {
+				scrollY.value = event.contentOffset.y;
+				runOnJS(onSettleOffset)(event.contentOffset.y);
+			}
+		}
+	});
+	useAnimatedReaction(() => scrollY.value, (current, previous) => {
+		if (!isActiveShared.value && current !== previous) scrollTo(scrollRef, 0, current, false);
+	});
+	useAnimatedReaction(() => isActiveShared.value, (active, previous) => {
+		if (isWeb || !active || active === previous) return;
+		scrollTo(scrollRef, 0, scrollY.value, false);
+	});
+	const days = useMemo(() => getViewDays$1(mode, date, weekStartsOn, numberOfDays, isRTL, weekEndsOn), [
+		mode,
+		date,
+		weekStartsOn,
+		numberOfDays,
+		isRTL,
+		weekEndsOn
+	]);
+	const dayWidth = (width - hourColumnWidth) / days.length;
+	const dayLeft = (dayIndex) => hourColumnWidth + dayIndex * dayWidth;
+	const dayLayouts = useMemo(() => days.map((day) => layoutDayEvents$1(events, day)), [days, events]);
+	const cellDateFromTouch = (event) => {
+		const { locationX, locationY } = event.nativeEvent;
+		const day = days[days.length === 1 ? 0 : Math.floor(locationX / dayWidth)];
+		if (!day) return null;
+		const minutes = Math.round((minHour + locationY / heightSource.value) * MINUTES_PER_HOUR);
+		const pressed = new Date(day);
+		pressed.setHours(0, 0, 0, 0);
+		pressed.setMinutes(minutes);
+		return pressed;
+	};
+	const handleBackgroundPress = (event) => {
+		const date = onPressCell && cellDateFromTouch(event);
+		if (date) onPressCell?.(date);
+	};
+	const handleBackgroundLongPress = (event) => {
+		const date = onLongPressCell && cellDateFromTouch(event);
+		if (date) onLongPressCell?.(date);
+	};
+	const hoursRange = useMemo(() => Array.from({ length: maxHour - minHour }, (_, index) => minHour + index), [minHour, maxHour]);
+	const now = useNow(showNowIndicator && isActive);
+	const nowDayIndex = days.findIndex((day) => getIsToday$1(day));
+	const nowHours = (getHours(now) * MINUTES_PER_HOUR + getMinutes(now)) / MINUTES_PER_HOUR;
+	const nowInWindow = nowHours >= minHour && nowHours <= maxHour;
+	const fullHeightStyle = useAnimatedStyle(() => ({ height: (maxHour - minHour) * heightSource.value }), [
+		minHour,
+		maxHour,
+		heightSource
+	]);
+	const pinchStartCellHeight = useSharedValue(hourHeight);
+	const zoomGesture = useMemo(() => {
+		const pinch = Gesture.Pinch().onStart(() => {
+			pinchStartCellHeight.value = cellHeight.value;
+		}).onUpdate((event) => {
+			cellHeight.value = Math.min(maxHourHeight, Math.max(minHourHeight, pinchStartCellHeight.value * event.scale));
+		}).onEnd(() => {
+			committedCellHeight.value = cellHeight.value;
+		});
+		return Gesture.Simultaneous(pinch, Gesture.Native());
+	}, [
+		cellHeight,
+		committedCellHeight,
+		pinchStartCellHeight,
+		minHourHeight,
+		maxHourHeight
+	]);
+	const createEnabled = onCreateEvent != null;
+	const createActive = useSharedValue(0);
+	const createTop = useSharedValue(0);
+	const createHeight = useSharedValue(0);
+	const createLeft = useSharedValue(0);
+	const createWidth = useSharedValue(0);
+	const createStartY = useSharedValue(0);
+	const createDayIndex = useSharedValue(0);
+	const createCancelled = useSharedValue(0);
+	const commitCreate = useCallback((startY, endY, dayIndex) => {
+		const day = days[dayIndex];
+		if (!day) return;
+		const range = cellRangeFromDrag(day, startY, endY, heightSource.value, minHour, snapMinutes);
+		if (range) onCreateEvent?.(range.start, range.end);
+	}, [
+		days,
+		heightSource,
+		minHour,
+		snapMinutes,
+		onCreateEvent
+	]);
+	const tapCell = useCallback((x, y) => {
+		const day = days[days.length === 1 ? 0 : Math.floor(x / dayWidth)];
+		if (!day) return;
+		const minutes = Math.round((minHour + y / heightSource.value) * MINUTES_PER_HOUR);
+		const pressed = new Date(day);
+		pressed.setHours(0, 0, 0, 0);
+		pressed.setMinutes(minutes);
+		onPressCell?.(pressed);
+	}, [
+		days,
+		dayWidth,
+		minHour,
+		heightSource,
+		onPressCell
+	]);
+	const createGesture = useMemo(() => {
+		const pan = Gesture.Pan().enabled(createEnabled).onStart((event) => {
+			const idx = days.length === 1 ? 0 : Math.floor(event.x / dayWidth);
+			createDayIndex.value = idx;
+			createStartY.value = event.y;
+			createLeft.value = hourColumnWidth + idx * dayWidth;
+			createWidth.value = dayWidth;
+			createTop.value = event.y;
+			createHeight.value = 0;
+			createActive.value = 1;
+			createCancelled.value = 0;
+		}).onUpdate((event) => {
+			if (createCancelled.value) return;
+			const stepPx = snapMinutes / MINUTES_PER_HOUR * heightSource.value;
+			const snap = (y) => stepPx > 0 ? Math.round(y / stepPx) * stepPx : y;
+			const startSnap = snap(createStartY.value);
+			const endSnap = snap(createStartY.value + event.translationY);
+			createTop.value = Math.min(startSnap, endSnap);
+			createHeight.value = Math.max(Math.abs(endSnap - startSnap), stepPx);
+		}).onEnd((event) => {
+			createActive.value = 0;
+			createHeight.value = 0;
+			if (createCancelled.value) return;
+			runOnJS(commitCreate)(createStartY.value, createStartY.value + event.translationY, createDayIndex.value);
+		});
+		return isWeb ? pan.activeOffsetY([-8, DRAG_ACTIVATE_PX]) : pan.activateAfterLongPress(DRAG_ACTIVATE_MS);
+	}, [
+		createEnabled,
+		days.length,
+		dayWidth,
+		hourColumnWidth,
+		heightSource,
+		snapMinutes,
+		commitCreate,
+		createActive,
+		createTop,
+		createHeight,
+		createLeft,
+		createWidth,
+		createStartY,
+		createDayIndex,
+		createCancelled
+	]);
+	const backgroundGesture = useMemo(() => {
+		const tap = isWeb && onPressCell != null ? Gesture.Tap().onEnd((event) => {
+			runOnJS(tapCell)(event.x, event.y);
+		}) : null;
+		if (createEnabled && tap) return Gesture.Exclusive(createGesture, tap);
+		if (createEnabled) return createGesture;
+		return tap;
+	}, [
+		createEnabled,
+		createGesture,
+		onPressCell,
+		tapCell
+	]);
+	useEffect(() => {
+		if (!isWeb || !createEnabled) return;
+		const doc = globalThis.document;
+		if (!doc) return;
+		const handler = (event) => {
+			if (event.key !== "Escape" || !createActive.value) return;
+			createCancelled.value = 1;
+			createActive.value = 0;
+			createHeight.value = 0;
+		};
+		doc.addEventListener("keydown", handler);
+		return () => doc.removeEventListener("keydown", handler);
+	}, [
+		createEnabled,
+		createActive,
+		createCancelled,
+		createHeight
+	]);
+	const createGhostStyle = useAnimatedStyle(() => ({
+		top: createTop.value,
+		height: createHeight.value,
+		left: createLeft.value,
+		width: createWidth.value,
+		opacity: createActive.value
+	}));
+	const cellLayer = onPressCell || onLongPressCell || createEnabled ? /* @__PURE__ */ jsx(Pressable, {
+		style: [styles.cellPressLayer, { left: hourColumnWidth }],
+		onPress: onPressCell ? handleBackgroundPress : void 0,
+		onLongPress: !createEnabled && onLongPressCell ? handleBackgroundLongPress : void 0,
+		tabIndex: -1,
+		importantForAccessibility: "no",
+		accessibilityElementsHidden: true
+	}) : null;
+	return /* @__PURE__ */ jsxs(View, {
+		style: styles.container,
+		children: [showAllDayEventCell ? /* @__PURE__ */ jsx(AllDayLane, {
+			days,
+			events,
+			mode,
+			hourColumnWidth,
+			dayWidth,
+			renderEvent,
+			keyExtractor,
+			onPressEvent,
+			onLongPressEvent
+		}) : null, /* @__PURE__ */ jsx(GestureDetector, {
+			gesture: zoomGesture,
+			children: /* @__PURE__ */ jsx(Animated.ScrollView, {
+				ref: scrollRef,
+				showsVerticalScrollIndicator: showVerticalScrollIndicator,
+				scrollEnabled: verticalScrollEnabled,
+				onScroll: scrollHandler,
+				scrollEventThrottle: 16,
+				contentContainerStyle: { paddingTop: HOUR_LABEL_TOP_INSET },
+				contentOffset: {
+					x: 0,
+					y: initialScrollY
+				},
+				children: /* @__PURE__ */ jsxs(Animated.View, {
+					style: [styles.content, fullHeightStyle],
+					children: [
+						cellLayer && backgroundGesture ? /* @__PURE__ */ jsx(GestureDetector, {
+							gesture: backgroundGesture,
+							children: cellLayer
+						}) : cellLayer,
+						days.map((day, dayIndex) => isWeekend$1(day) ? /* @__PURE__ */ jsx(Animated.View, { style: [
+							styles.weekendColumn,
+							styles.nonInteractive,
+							{ backgroundColor: theme.colors.weekendBackground },
+							{
+								left: dayLeft(dayIndex),
+								width: dayWidth
+							},
+							fullHeightStyle
+						] }, `weekend-${day.toISOString()}`) : null),
+						calendarCellStyle ? days.map((day, dayIndex) => {
+							const cellStyle = calendarCellStyle(day);
+							return cellStyle ? /* @__PURE__ */ jsx(Animated.View, { style: [
+								styles.weekendColumn,
+								styles.nonInteractive,
+								{
+									left: dayLeft(dayIndex),
+									width: dayWidth
+								},
+								cellStyle,
+								fullHeightStyle
+							] }, `cell-${day.toISOString()}`) : null;
+						}) : null,
+						businessHours ? days.flatMap((day, dayIndex) => closedHourBands(day, businessHours, minHour, maxHour).map((band, bandIndex) => /* @__PURE__ */ jsx(ShadeBand, {
+							cellHeight: heightSource,
+							startHour: band.start,
+							endHour: band.end,
+							minHour,
+							left: dayLeft(dayIndex),
+							width: dayWidth,
+							color: theme.colors.outsideHoursBackground
+						}, `closed-${day.toISOString()}-${bandIndex}`))) : null,
+						days.map((day, dayIndex) => /* @__PURE__ */ jsx(Animated.View, { style: [
+							styles.daySeparator,
+							styles.nonInteractive,
+							{ backgroundColor: theme.colors.gridLine },
+							{ left: dayLeft(dayIndex) },
+							fullHeightStyle
+						] }, `separator-${day.toISOString()}`)),
+						hoursRange.map((hour) => /* @__PURE__ */ jsx(HourRow, {
+							hour,
+							minHour,
+							cellHeight: heightSource,
+							hourColumnWidth,
+							label: formatHour(hour, { ampm }),
+							ampm,
+							hourComponent
+						}, hour)),
+						timeslots > 1 ? hoursRange.flatMap((hour) => Array.from({ length: timeslots - 1 }, (_, i) => /* @__PURE__ */ jsx(TimeslotLine, {
+							hour,
+							minHour,
+							fraction: (i + 1) / timeslots,
+							cellHeight: heightSource,
+							hourColumnWidth
+						}, `slot-${hour}-${i}`))) : null,
+						dayLayouts.flatMap((layout, dayIndex) => layout.filter((p) => p.startHours < maxHour && p.startHours + p.durationHours > minHour).map((positioned, eventIndex) => {
+							const columnWidth = dayWidth / positioned.columns;
+							return /* @__PURE__ */ jsx(AnimatedEventBox, {
+								positioned,
+								cellHeight: heightSource,
+								minHour,
+								left: dayLeft(dayIndex) + positioned.column * columnWidth,
+								width: columnWidth,
+								dayWidth,
+								dayIndex,
+								dayCount: days.length,
+								mode,
+								renderEvent,
+								snapMinutes,
+								showDragHandle,
+								onPress: onPressEvent,
+								onLongPress: onLongPressEvent,
+								onDragEvent,
+								onDragStart
+							}, `${dayIndex}:${keyExtractor(positioned.event, eventIndex)}`);
+						})),
+						showNowIndicator && nowDayIndex >= 0 && nowInWindow ? /* @__PURE__ */ jsx(NowIndicator, {
+							cellHeight: heightSource,
+							nowHours,
+							minHour,
+							left: dayLeft(nowDayIndex),
+							width: dayWidth,
+							color: theme.colors.nowIndicator
+						}) : null,
+						createEnabled ? /* @__PURE__ */ jsx(Animated.View, { style: [
+							styles.createGhost,
+							{ pointerEvents: "none" },
+							{
+								backgroundColor: theme.colors.eventBackground,
+								borderColor: theme.colors.todayBackground
+							},
+							createGhostStyle
+						] }) : null
+					]
+				})
+			})
+		})]
+	});
+}
+const TimetablePage = memo(TimetablePageInner);
+function TimeGridInner({ mode, numberOfDays = 1, weekEndsOn, date, events, cellHeight, hourHeight = 48, weekStartsOn, renderEvent, keyExtractor, scrollOffsetMinutes = 0, hourColumnWidth: hourColumnWidthProp = DEFAULT_HOUR_COLUMN_WIDTH, hideHours = false, timeslots = 1, showAllDayEventCell = true, calendarCellStyle, businessHours, showWeekNumber = false, headerComponent, minHour = 0, maxHour = HOURS_PER_DAY, ampm = false, isRTL = false, minHourHeight = DEFAULT_MIN_HOUR_HEIGHT, maxHourHeight = DEFAULT_MAX_HOUR_HEIGHT, showNowIndicator = true, locale, freeSwipe = false, swipeEnabled = true, showVerticalScrollIndicator = true, verticalScrollEnabled = true, weekNumberPrefix = "W", hourComponent, activeDate, resetPageOnPressCell = false, dragStepMinutes = DEFAULT_DRAG_STEP_MINUTES, showDragHandle = true, onPressEvent, onLongPressEvent, onDragEvent, onDragStart, onPressCell, onLongPressCell, onCreateEvent, onPressDateHeader, onChangeDate, renderHeader }) {
+	const clampedMinHour = Math.max(0, Math.min(minHour, HOURS_PER_DAY - 1));
+	const clampedMaxHour = Math.max(clampedMinHour + 1, Math.min(maxHour, HOURS_PER_DAY));
+	const hourColumnWidth = hideHours ? 0 : hourColumnWidthProp;
+	const { width, height } = useWindowDimensions();
+	const listRef = useRef(null);
+	const containerRef = useRef(null);
+	const suppressCaptureUntilRef = useRef(0);
+	const [pageHeight, setPageHeight] = useState(height);
+	const [containerWidth, setContainerWidth] = useState(width);
+	const [measured, setMeasured] = useState(false);
+	const weekAnchored = mode === "week" || mode === "custom" && weekEndsOn != null;
+	const step = weekAnchored ? 7 : viewDayCount(mode, numberOfDays);
+	const seedDefaultY = Math.max(0, scrollOffsetMinutes / MINUTES_PER_HOUR - clampedMinHour) * hourHeight;
+	const scrollY = useSharedValue(seedDefaultY);
+	const offsetSeedRef = useRef(null);
+	const captureOffsetSeed = useCallback((y) => {
+		offsetSeedRef.current = y;
+	}, []);
+	const committedCellHeight = useSharedValue(hourHeight);
+	useWebGridZoom(isWeb, containerRef, cellHeight, committedCellHeight, minHourHeight, maxHourHeight);
+	const [anchorDate] = useState(date);
+	const anchor = useMemo(() => weekAnchored ? startOfWeek(anchorDate, { weekStartsOn }) : startOfDay(anchorDate), [
+		weekAnchored,
+		anchorDate,
+		weekStartsOn
+	]);
+	const pageDates = useMemo(() => Array.from({ length: 361 }, (_, i) => addDays(anchor, (i - PAGE_WINDOW) * step)), [anchor, step]);
+	const activeIndex = useCallback((target) => {
+		const aligned = weekAnchored ? startOfWeek(target, { weekStartsOn }) : startOfDay(target);
+		return Math.floor(differenceInCalendarDays(aligned, anchor) / step) + PAGE_WINDOW;
+	}, [
+		anchor,
+		weekAnchored,
+		step,
+		weekStartsOn
+	])(date);
+	const viewedIndexRef = useRef(activeIndex);
+	const pendingScrollIndexRef = useRef(null);
+	const headerDays = useMemo(() => getViewDays$1(mode, pageDates[activeIndex] ?? date, weekStartsOn, numberOfDays, isRTL, weekEndsOn), [
+		mode,
+		pageDates,
+		activeIndex,
+		date,
+		weekStartsOn,
+		numberOfDays,
+		isRTL,
+		weekEndsOn
+	]);
+	const handleViewableItemsChanged = useCallback((info) => {
+		if (isWeb) return;
+		const settled = info.viewableItems.find((token) => token.isViewable);
+		if (settled?.index == null) return;
+		if (pendingScrollIndexRef.current != null) {
+			if (settled.index === pendingScrollIndexRef.current) {
+				pendingScrollIndexRef.current = null;
+				viewedIndexRef.current = settled.index;
+			}
+			return;
+		}
+		if (settled.index === viewedIndexRef.current) return;
+		viewedIndexRef.current = settled.index;
+		if (settled.item) onChangeDate(settled.item);
+	}, [onChangeDate]);
+	useEffect(() => {
+		if (activeIndex === viewedIndexRef.current) return;
+		viewedIndexRef.current = activeIndex;
+		pendingScrollIndexRef.current = activeIndex;
+		listRef.current?.scrollToIndex({
+			index: activeIndex,
+			animated: false
+		});
+	}, [activeIndex]);
+	useEffect(() => {
+		if (!isWeb) return;
+		const root = containerRef.current;
+		if (!root) return;
+		const restoreVisiblePage = () => {
+			const vw = (root.ownerDocument?.defaultView ?? globalThis).innerWidth;
+			for (const el of root.querySelectorAll("*")) {
+				const style = getComputedStyle(el);
+				if (!((style.overflowY === "scroll" || style.overflowY === "auto") && el.scrollHeight > el.clientHeight + 20 && el.clientHeight > 100)) continue;
+				const rect = el.getBoundingClientRect();
+				if (rect.left > -50 && rect.right <= vw + 50) {
+					el.scrollTop = scrollY.value;
+					break;
+				}
+			}
+		};
+		suppressCaptureUntilRef.current = Date.now() + 400;
+		let raf2 = 0;
+		const raf1 = requestAnimationFrame(() => {
+			restoreVisiblePage();
+			raf2 = requestAnimationFrame(restoreVisiblePage);
+		});
+		return () => {
+			cancelAnimationFrame(raf1);
+			cancelAnimationFrame(raf2);
+		};
+	}, [activeIndex, pageHeight]);
+	useEffect(() => {
+		if (!isWeb) return;
+		const root = containerRef.current;
+		if (!root) return;
+		const onScrollCapture = (event) => {
+			if (Date.now() < suppressCaptureUntilRef.current) return;
+			const el = event.target;
+			if (!el || typeof el.scrollTop !== "number" || el.clientHeight <= 100) return;
+			const rect = el.getBoundingClientRect();
+			const vw = (root.ownerDocument?.defaultView ?? globalThis).innerWidth;
+			if (rect.left <= -50 || rect.right > vw + 50) return;
+			scrollY.value = el.scrollTop;
+			offsetSeedRef.current = el.scrollTop;
+		};
+		root.addEventListener("scroll", onScrollCapture, true);
+		return () => root.removeEventListener("scroll", onScrollCapture, true);
+	}, []);
+	useEffect(() => {
+		if (!isWeb) return;
+		const root = containerRef.current;
+		if (!root) return;
+		const lockHorizontal = () => {
+			for (const el of root.querySelectorAll("*")) {
+				if (el.scrollWidth <= el.clientWidth + 20 || el.clientWidth <= 100) continue;
+				const overflowX = getComputedStyle(el).overflowX;
+				if (overflowX === "auto" || overflowX === "scroll") {
+					el.style.overflowX = "hidden";
+					el.style.touchAction = "pan-y";
+				}
+			}
+		};
+		const raf = requestAnimationFrame(lockHorizontal);
+		return () => cancelAnimationFrame(raf);
+	}, [pageHeight]);
+	useWebPagerKeys(swipeEnabled, useCallback((delta) => {
+		const target = pageDates[activeIndex + delta];
+		if (target) onChangeDate(target);
+	}, [
+		pageDates,
+		activeIndex,
+		onChangeDate
+	]));
+	const handlePressCell = useMemo(() => {
+		if (!onPressCell) return void 0;
+		if (!resetPageOnPressCell) return onPressCell;
+		return (cellDate) => {
+			onPressCell(cellDate);
+			listRef.current?.scrollToIndex({
+				index: activeIndex,
+				animated: true
+			});
+		};
+	}, [
+		onPressCell,
+		resetPageOnPressCell,
+		activeIndex
+	]);
+	const snapToIndices = useMemo(() => pageDates.map((_, index) => index), [pageDates]);
+	const keyExtractorList = useCallback((item) => item.toISOString(), []);
+	const getFixedItemSize = useCallback(() => containerWidth, [containerWidth]);
+	const renderItem = useCallback(({ item, index }) => /* @__PURE__ */ jsx(View, {
+		style: {
+			width: containerWidth,
+			height: pageHeight
+		},
+		children: /* @__PURE__ */ jsx(TimetablePage, {
+			mode,
+			numberOfDays,
+			date: item,
+			width: containerWidth,
+			events,
+			cellHeight,
+			hourHeight,
+			committedCellHeight,
+			scrollY,
+			isActive: index === activeIndex,
+			initialScrollY: offsetSeedRef.current ?? seedDefaultY,
+			onSettleOffset: captureOffsetSeed,
+			weekStartsOn,
+			weekEndsOn,
+			hourColumnWidth,
+			minHour: clampedMinHour,
+			maxHour: clampedMaxHour,
+			ampm,
+			timeslots,
+			isRTL,
+			showAllDayEventCell,
+			showVerticalScrollIndicator,
+			verticalScrollEnabled,
+			hourComponent,
+			calendarCellStyle,
+			businessHours,
+			minHourHeight,
+			maxHourHeight,
+			showNowIndicator,
+			renderEvent,
+			keyExtractor,
+			snapMinutes: Math.max(1, dragStepMinutes),
+			showDragHandle,
+			onPressEvent,
+			onLongPressEvent,
+			onDragEvent,
+			onDragStart,
+			onPressCell: handlePressCell,
+			onLongPressCell,
+			onCreateEvent
+		})
+	}), [
+		containerWidth,
+		pageHeight,
+		mode,
+		numberOfDays,
+		events,
+		cellHeight,
+		hourHeight,
+		committedCellHeight,
+		scrollY,
+		activeIndex,
+		seedDefaultY,
+		captureOffsetSeed,
+		weekStartsOn,
+		weekEndsOn,
+		hourColumnWidth,
+		clampedMinHour,
+		clampedMaxHour,
+		ampm,
+		timeslots,
+		isRTL,
+		showAllDayEventCell,
+		showVerticalScrollIndicator,
+		verticalScrollEnabled,
+		hourComponent,
+		calendarCellStyle,
+		businessHours,
+		minHourHeight,
+		maxHourHeight,
+		showNowIndicator,
+		renderEvent,
+		keyExtractor,
+		dragStepMinutes,
+		showDragHandle,
+		onPressEvent,
+		onLongPressEvent,
+		onDragEvent,
+		onDragStart,
+		handlePressCell,
+		onLongPressCell,
+		onCreateEvent
+	]);
+	const listExtraData = useMemo(() => ({
+		events,
+		activeIndex
+	}), [events, activeIndex]);
+	return /* @__PURE__ */ jsxs(View, {
+		ref: containerRef,
+		style: styles.container,
+		children: [
+			renderHeader ? renderHeader(headerDays) : /* @__PURE__ */ jsx(DefaultHeader, {
+				days: headerDays,
+				mode,
+				width: containerWidth,
+				hourColumnWidth,
+				showWeekNumber,
+				weekNumberPrefix,
+				locale,
+				activeDate,
+				onPressDateHeader
+			}),
+			headerComponent,
+			/* @__PURE__ */ jsx(View, {
+				style: styles.pager,
+				onLayout: (event) => {
+					setPageHeight(event.nativeEvent.layout.height);
+					setContainerWidth(event.nativeEvent.layout.width);
+					setMeasured(true);
+				},
+				children: /* @__PURE__ */ jsx(LegendList, {
+					ref: listRef,
+					style: isWeb ? [styles.pagerList, styles.webNoScroll] : styles.pagerList,
+					data: pageDates,
+					extraData: listExtraData,
+					horizontal: true,
+					recycleItems: false,
+					keyExtractor: keyExtractorList,
+					getFixedItemSize,
+					...isWeb ? null : {
+						scrollEnabled: swipeEnabled,
+						pagingEnabled: !freeSwipe,
+						snapToIndices: freeSwipe ? snapToIndices : void 0
+					},
+					initialScrollIndex: activeIndex,
+					showsHorizontalScrollIndicator: false,
+					viewabilityConfig: PAGE_VIEWABILITY,
+					onViewableItemsChanged: handleViewableItemsChanged,
+					renderItem
+				}, measured ? "grid" : "grid-seed")
+			})
+		]
+	});
+}
+const TimeGrid = memo(TimeGridInner);
+const DefaultHeader = ({ days, mode, width, hourColumnWidth, showWeekNumber, weekNumberPrefix = "W", locale, activeDate, onPressDateHeader }) => {
+	const theme = useCalendarTheme();
+	const dayWidth = (width - hourColumnWidth) / days.length;
+	return /* @__PURE__ */ jsxs(View, {
+		style: [styles.headerRow, { borderBottomColor: theme.colors.gridLine }],
+		children: [/* @__PURE__ */ jsx(View, {
+			style: [styles.weekNumberGutter, { width: hourColumnWidth }],
+			children: showWeekNumber && hourColumnWidth > 0 && days[0] ? /* @__PURE__ */ jsx(Text, {
+				style: [theme.text.hourLabel, { color: theme.colors.textMuted }],
+				allowFontScaling: false,
+				children: `${weekNumberPrefix}${getISOWeek(days[0])}`
+			}) : null
+		}), days.map((day) => /* @__PURE__ */ jsx(DayHeader, {
+			day,
+			mode,
+			width: dayWidth,
+			locale,
+			activeDate,
+			onPressDateHeader
+		}, day.toISOString()))]
+	});
+};
+const DayHeader = ({ day, width, locale, activeDate, onPressDateHeader }) => {
+	const theme = useCalendarTheme();
+	const isToday = getIsToday$1(day);
+	const isHighlighted = activeDate ? isSameCalendarDay$1(day, activeDate) : isToday;
+	return /* @__PURE__ */ jsxs(Pressable, {
+		style: [styles.dayHeader, { width }],
+		onPress: onPressDateHeader ? () => onPressDateHeader(day) : void 0,
+		disabled: !onPressDateHeader,
+		accessibilityRole: onPressDateHeader ? "button" : void 0,
+		children: [/* @__PURE__ */ jsx(Text, {
+			style: [styles.dayHeaderWeekday, { color: theme.colors.textMuted }],
+			allowFontScaling: false,
+			children: format(day, "EEE", { locale })
+		}), /* @__PURE__ */ jsx(View, {
+			style: [styles.dayHeaderBadge, isHighlighted && { backgroundColor: theme.colors.todayBackground }],
+			children: /* @__PURE__ */ jsx(Text, {
+				style: [styles.dayHeaderNumber, { color: isHighlighted ? theme.colors.todayText : theme.colors.text }],
+				allowFontScaling: false,
+				...isToday && { accessibilityLabel: `Today, ${day.getDate()}` },
+				children: day.getDate()
+			})
+		})]
+	});
+};
+const styles = StyleSheet.create({
+	pager: { flex: 1 },
+	pagerList: { flex: 1 },
+	container: { flex: 1 },
+	headerRow: {
+		flexDirection: "row",
+		alignItems: "center",
+		borderBottomWidth: StyleSheet.hairlineWidth
+	},
+	weekNumberGutter: {
+		alignItems: "center",
+		justifyContent: "flex-end"
+	},
+	dayHeader: {
+		alignItems: "center",
+		gap: 2,
+		paddingVertical: 6
+	},
+	dayHeaderWeekday: {
+		fontSize: 11,
+		fontWeight: "600"
+	},
+	dayHeaderBadge: {
+		width: 28,
+		height: 28,
+		borderRadius: 999,
+		justifyContent: "center",
+		alignItems: "center"
+	},
+	dayHeaderNumber: {
+		fontSize: 15,
+		fontWeight: "600"
+	},
+	content: {
+		width: "100%",
+		position: "relative"
+	},
+	cellPressLayer: {
+		position: "absolute",
+		top: 0,
+		bottom: 0,
+		right: 0
+	},
+	createGhost: {
+		position: "absolute",
+		borderRadius: 6,
+		borderWidth: StyleSheet.hairlineWidth,
+		marginHorizontal: EVENT_GAP
+	},
+	weekendColumn: {
+		position: "absolute",
+		top: 0
+	},
+	shadeBand: { position: "absolute" },
+	daySeparator: {
+		position: "absolute",
+		top: 0,
+		width: StyleSheet.hairlineWidth
+	},
+	hourRow: {
+		position: "absolute",
+		left: 0,
+		right: 0,
+		flexDirection: "row",
+		alignItems: "flex-start"
+	},
+	hourLabel: {
+		marginTop: -6,
+		textAlign: "right",
+		paddingRight: 6
+	},
+	hourLine: {
+		flex: 1,
+		height: StyleSheet.hairlineWidth
+	},
+	timeslotLine: {
+		position: "absolute",
+		right: 0,
+		height: StyleSheet.hairlineWidth,
+		opacity: .5
+	},
+	resizeHandle: {
+		position: "absolute",
+		left: 0,
+		right: 0,
+		bottom: 0,
+		height: RESIZE_HANDLE_HEIGHT,
+		alignItems: "center",
+		justifyContent: "center"
+	},
+	resizeGrip: {
+		width: 24,
+		height: 3,
+		borderRadius: 2,
+		opacity: .4
+	},
+	eventBox: {
+		position: "absolute",
+		overflow: "hidden",
+		padding: EVENT_GAP
+	},
+	nowIndicator: {
+		position: "absolute",
+		height: 2
+	},
+	nonInteractive: { pointerEvents: "none" },
+	webNoScroll: { overflow: "hidden" }
+});
+//#endregion
+//#region src/components/Calendar.tsx
+const defaultKeyExtractor = (event) => `${event.start.toISOString()}|${event.end.toISOString()}|${event.title ?? ""}`;
+function visibleRange(mode, date, weekStartsOn, numberOfDays, weekEndsOn) {
+	if (mode === "month") return [startOfWeek(startOfMonth(date), { weekStartsOn }), endOfWeek(endOfMonth(date), { weekStartsOn })];
+	const days = getViewDays$1(mode, date, weekStartsOn, numberOfDays, false, weekEndsOn);
+	return [startOfDay(days[0]), endOfDay(days[days.length - 1])];
+}
+function Calendar({ events, mode, date, onChangeDate, onChangeDateRange, onPressEvent, onLongPressEvent, onDragEvent, onDragStart, dragStepMinutes, showDragHandle, onPressDay, onLongPressDay, onPressMore, onPressCell, resetPageOnPressCell, onLongPressCell, onCreateEvent, onPressDateHeader, maxVisibleEventCount, sortedMonthView, moreLabel, showAdjacentMonths, disableMonthEventCellPress, weekStartsOn = 0, numberOfDays, weekEndsOn, renderEvent = DefaultEvent, eventCellStyle, calendarCellStyle, businessHours, keyExtractor = defaultKeyExtractor, theme, cellHeight: cellHeightProp, hourHeight = 48, minHourHeight, maxHourHeight, hourColumnWidth, hideHours, timeslots, showAllDayEventCell, showWeekNumber, weekNumberPrefix, hourComponent, showSixWeeks, swipeEnabled, showVerticalScrollIndicator, verticalScrollEnabled, headerComponent, minHour, maxHour, ampm, showTime, ellipsizeTitle, allDayLabel, scrollOffsetMinutes, showNowIndicator, locale, activeDate, isRTL, freeSwipe, renderTimeGridHeader, renderHeaderForMonthView, renderCustomDateForMonth, itemSeparatorComponent }) {
+	const mergedTheme = useMemo(() => mergeTheme(theme), [theme]);
+	const internalCellHeight = useSharedValue(hourHeight);
+	const cellHeight = cellHeightProp ?? internalCellHeight;
+	const handlePressEvent = useCallback((event) => {
+		if (!event.disabled) onPressEvent(event);
+	}, [onPressEvent]);
+	const handleLongPressEvent = useMemo(() => onLongPressEvent ? (event) => {
+		if (!event.disabled) onLongPressEvent(event);
+	} : void 0, [onLongPressEvent]);
+	const handleChangeDate = useCallback((next) => {
+		onChangeDate(next);
+		onChangeDateRange?.(visibleRange(mode, next, weekStartsOn, numberOfDays ?? 1, weekEndsOn));
+	}, [
+		onChangeDate,
+		onChangeDateRange,
+		mode,
+		weekStartsOn,
+		numberOfDays,
+		weekEndsOn
+	]);
+	const resolvedRenderEvent = useMemo(() => {
+		if (eventCellStyle == null && ampm == null && showTime == null && ellipsizeTitle == null && allDayLabel == null) return renderEvent;
+		const Base = renderEvent;
+		return function StyledEvent(props) {
+			const cellStyle = typeof eventCellStyle === "function" ? eventCellStyle(props.event) : eventCellStyle;
+			return /* @__PURE__ */ jsx(Base, {
+				...props,
+				cellStyle,
+				ampm,
+				showTime,
+				ellipsizeTitle,
+				allDayLabel
+			});
+		};
+	}, [
+		renderEvent,
+		eventCellStyle,
+		ampm,
+		showTime,
+		ellipsizeTitle,
+		allDayLabel
+	]);
+	return /* @__PURE__ */ jsx(CalendarThemeProvider, {
+		value: mergedTheme,
+		children: mode === "month" ? /* @__PURE__ */ jsx(MonthPager, {
+			date,
+			events,
+			maxVisibleEventCount,
+			weekStartsOn,
+			locale,
+			sortedMonthView,
+			moreLabel,
+			showAdjacentMonths,
+			disableMonthEventCellPress,
+			isRTL,
+			showSixWeeks,
+			activeDate,
+			renderHeaderForMonthView,
+			renderCustomDateForMonth,
+			calendarCellStyle,
+			renderEvent: resolvedRenderEvent,
+			keyExtractor,
+			onPressDay,
+			onLongPressDay,
+			onPressEvent: handlePressEvent,
+			onLongPressEvent: handleLongPressEvent,
+			onPressMore,
+			onChangeDate: handleChangeDate,
+			freeSwipe,
+			swipeEnabled
+		}) : mode === "schedule" ? /* @__PURE__ */ jsx(Agenda, {
+			events,
+			locale,
+			renderEvent: resolvedRenderEvent,
+			keyExtractor,
+			onPressEvent: handlePressEvent,
+			onLongPressEvent: handleLongPressEvent,
+			onPressDay,
+			activeDate,
+			itemSeparatorComponent
+		}) : /* @__PURE__ */ jsx(TimeGrid, {
+			mode,
+			numberOfDays,
+			weekEndsOn,
+			date,
+			events,
+			cellHeight,
+			hourHeight,
+			weekStartsOn,
+			renderEvent: resolvedRenderEvent,
+			keyExtractor,
+			scrollOffsetMinutes,
+			hourColumnWidth,
+			hideHours,
+			timeslots,
+			showAllDayEventCell,
+			calendarCellStyle,
+			businessHours,
+			showWeekNumber,
+			weekNumberPrefix,
+			hourComponent,
+			showVerticalScrollIndicator,
+			verticalScrollEnabled,
+			headerComponent,
+			minHour,
+			maxHour,
+			ampm,
+			minHourHeight,
+			maxHourHeight,
+			showNowIndicator,
+			locale,
+			activeDate,
+			isRTL,
+			freeSwipe,
+			swipeEnabled,
+			onPressEvent: handlePressEvent,
+			onLongPressEvent: handleLongPressEvent,
+			onDragEvent,
+			showDragHandle,
+			onDragStart,
+			dragStepMinutes,
+			onPressCell,
+			resetPageOnPressCell,
+			onLongPressCell,
+			onCreateEvent,
+			onPressDateHeader,
+			onChangeDate: handleChangeDate,
+			renderHeader: renderTimeGridHeader
+		})
+	});
+}
+//#endregion
+export { Agenda, Calendar, CalendarThemeProvider, DEFAULT_HOUR_HEIGHT, DefaultEvent, DefaultMonthEvent, MonthList, MonthPager, MonthView, TimeGrid, buildMonthGrid, buildMonthWeeks, darkTheme, daySelectionState, defaultTheme, eventsInTimeZone, expandRecurringEvents, getIsToday, getViewDays, getWeekDays, isAllDayEvent, isDateSelectable, isRangeEndpoint, isSameCalendarDay, isWeekend, isWithinDateRange, layoutDayEvents, mergeTheme, minutesIntoDay, nextDateRange, toZonedTime, useCalendarTheme, useDateRange, useMonthGrid };