@riverbankcms/sdk 0.135.1 → 0.137.0

package/dist/client/{EventCombined.client-BKB0ZxRR.mjs → EventCombined.client-CwJOxn7A.mjs}

@@ -1,11 +1,13 @@
 "use client";
 import { D as clsx } from "./colorStyles-CrxJrPjJ.mjs";
-import { At as assertNever, B as formatEventPrice, G as getContainerClass, H as formatEventTeacherLine, J as resolveEventLinkProps, K as groupEventsByDate, L as formatDate, M as buildEventRuntimeFilters, N as getEventRuntimeFiltersKey, U as formatTime, W as getCardOrientation, X as getEventAvailability, st as themeButtonClassName } from "./propsDecoder-mB0aC_Fi.mjs";
-import { a as EventCardClient, i as EventPaginatedListView, n as useEventPagination, o as EventFilters, r as toError, t as useEventFilters } from "./useEventFilters-Bphkda8m.mjs";
-import { n as useBlockApi } from "./context-DljQn8L5.mjs";
+import { Dt as buildBookingUtcDateWindow, Ft as getLocalScheduleDate, L as getCardOrientation, M as buildEventRuntimeFilters, N as getEventRuntimeFiltersKey, Nt as formatLocalScheduleDate, R as getContainerClass, X as themeButtonClassName, z as formatEventPrice } from "./propsDecoder-pYvx_Srl.mjs";
+import { a as EventCardClient, i as EventPaginatedListView, n as useEventPagination, o as EventFilters, r as toError, s as formatEventTeacherLine, t as useEventFilters } from "./useEventFilters-ByuU6HLA.mjs";
+import { r as formatEventRemainingPlaces, u as isEventFull } from "./capacity-BW00PO7s.mjs";
+import { a as groupEventsByDate, i as formatTime, l as resolveEventLinkProps, t as formatDate } from "./dates-2RPXHQy4.mjs";
+import { n as useBlockApi } from "./context-DCkiHVdD.mjs";
 import { t as createBodyThemePortalRoot } from "./themePortalRoot-AGs4cE7t.mjs";
 import { t as ModalShell } from "./ModalShell-CqkBvBIC.mjs";
-import React, { createContext, useCallback, useContext, useEffect, useId, useMemo, useReducer, useRef, useState } from "react";
+import React, { createContext, useCallback, useContext, useEffect, useId, useMemo, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region ../calendar/src/grid.ts
 const DAY_NAMES = [
@@ -31,111 +33,73 @@ const MONTH_NAMES = [
 	"November",
 	"December"
 ];
-/** Format a date as YYYY-MM-DD using the runtime's local timezone. */
 function formatDateKey(date) {
-	return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
+	return `${String(date.year).padStart(4, "0")}-${String(date.month).padStart(2, "0")}-${String(date.day).padStart(2, "0")}`;
 }
-/**
-* True when `date` and `now` are the same local calendar day.
-* `now` defaults to `new Date()` so casual callers don't need to thread it,
-* but tests and snapshot-rendering should pass an explicit value.
-*/
-function isToday(date, now = /* @__PURE__ */ new Date()) {
-	return isSameLocalDay(date, now);
+function isToday(date, today) {
+	return isSameCalendarDay(date, today);
 }
-/** True when two dates fall on the same local calendar day. */
-function isSameLocalDay(left, right) {
-	return left.getFullYear() === right.getFullYear() && left.getMonth() === right.getMonth() && left.getDate() === right.getDate();
+function isSameCalendarDay(left, right) {
+	return left.year === right.year && left.month === right.month && left.day === right.day;
 }
-/**
-* Add (or subtract) months to a date, clamping the day-of-month to the
-* target month's last day. Avoids JS Date overflow (Jan 29 + 1 month → Mar 1
-* in non-leap years).
-*/
-function addMonths(date, months) {
-	const year = date.getFullYear();
-	const month = date.getMonth();
-	const day = date.getDate();
-	const hours = date.getHours();
-	const minutes = date.getMinutes();
-	const seconds = date.getSeconds();
-	const ms = date.getMilliseconds();
-	const base = new Date(year, month + months, 1, hours, minutes, seconds, ms);
-	const lastDayOfTargetMonth = new Date(base.getFullYear(), base.getMonth() + 1, 0).getDate();
-	base.setDate(Math.min(day, lastDayOfTargetMonth));
-	return base;
+function getStartOfMonth(date) {
+	return {
+		year: date.year,
+		month: date.month,
+		day: 1
+	};
 }
-/** Add (or subtract) days while preserving local time-of-day fields. */
-function addDays(date, days) {
-	const result = new Date(date);
-	result.setDate(result.getDate() + days);
-	return result;
+function getEndOfMonth(date) {
+	return addDays(addMonths(getStartOfMonth(date), 1), -1);
 }
-/** Shift a calendar anchor by the natural unit for a viewport kind. */
-function shiftCalendarAnchorDate(date, view, steps) {
-	if (view === "week") return addDays(date, steps * 7);
-	return addMonths(date, steps);
+function addMonths(date, months) {
+	const target = new Date(Date.UTC(date.year, date.month - 1 + months, 1, 12));
+	const year = target.getUTCFullYear();
+	const month = target.getUTCMonth() + 1;
+	const lastDay = new Date(Date.UTC(year, month, 0, 12)).getUTCDate();
+	return {
+		year,
+		month,
+		day: Math.min(date.day, lastDay)
+	};
 }
-/**
-* Get an inclusive 3-month window around `date`, returned as ISO strings
-* with UTC midnight bounds. Suitable for prefetching event windows when
-* the consumer handles timezone conversion downstream.
-*/
-function getThreeMonthRange(date) {
-	const year = date.getFullYear();
-	const month = date.getMonth();
-	const prevStart = new Date(year, month - 1, 1);
-	const nextEnd = new Date(year, month + 2, 0);
+function addDays(date, days) {
+	const result = new Date(Date.UTC(date.year, date.month - 1, date.day + days, 12));
 	return {
-		from: `${formatDateKey(prevStart)}T00:00:00Z`,
-		to: `${formatDateKey(nextEnd)}T23:59:59Z`
+		year: result.getUTCFullYear(),
+		month: result.getUTCMonth() + 1,
+		day: result.getUTCDate()
 	};
 }
-/**
-* Build the calendar days for a month view. Returns 42 dates (6 rows × 7
-* days) including padding from prior/next months for a stable grid.
-*/
+function shiftCalendarAnchorDate(date, view, steps) {
+	return view === "week" ? addDays(date, steps * 7) : addMonths(date, steps);
+}
 function getMonthCalendarDays(year, month, startOfWeek) {
-	const firstDayOfMonth = new Date(year, month, 1);
-	const lastDayOfMonth = new Date(year, month + 1, 0);
-	let startOffset = firstDayOfMonth.getDay();
-	if (startOfWeek === "monday") startOffset = startOffset === 0 ? 6 : startOffset - 1;
-	const days = [];
-	for (let i = startOffset - 1; i >= 0; i--) days.push(new Date(year, month, -i));
-	for (let day = 1; day <= lastDayOfMonth.getDate(); day++) days.push(new Date(year, month, day));
-	while (days.length < 42) {
-		const nextDay = days.length - startOffset - lastDayOfMonth.getDate() + 1;
-		days.push(new Date(year, month + 1, nextDay));
-	}
-	return days;
+	const firstDay = {
+		year,
+		month,
+		day: 1
+	};
+	const dayOfWeek = getDayOfWeek(firstDay);
+	const gridStart = addDays(firstDay, -(startOfWeek === "monday" ? dayOfWeek === 0 ? 6 : dayOfWeek - 1 : dayOfWeek));
+	return Array.from({ length: 42 }, (_, index) => addDays(gridStart, index));
 }
-/** Build the 7 dates of the week containing `baseDate`. */
 function getWeekCalendarDays(baseDate, startOfWeek) {
-	const days = [];
-	const dayOfWeek = baseDate.getDay();
-	const daysToStart = startOfWeek === "monday" ? dayOfWeek === 0 ? 6 : dayOfWeek - 1 : dayOfWeek;
-	const weekStart = new Date(baseDate);
-	weekStart.setDate(baseDate.getDate() - daysToStart);
-	for (let i = 0; i < 7; i++) {
-		const date = new Date(weekStart);
-		date.setDate(weekStart.getDate() + i);
-		days.push(date);
-	}
-	return days;
+	const dayOfWeek = getDayOfWeek(baseDate);
+	const weekStart = addDays(baseDate, -(startOfWeek === "monday" ? dayOfWeek === 0 ? 6 : dayOfWeek - 1 : dayOfWeek));
+	return Array.from({ length: 7 }, (_, index) => addDays(weekStart, index));
+}
+function getDayOfWeek(date) {
+	return new Date(Date.UTC(date.year, date.month - 1, date.day, 12)).getUTCDay();
 }
-/** Build the 7 dates of the week containing `baseDate` as a fixed-width tuple. */
 function getWeekCalendarDayTuple(baseDate, startOfWeek) {
 	const days = getWeekCalendarDays(baseDate, startOfWeek);
 	assertWeekCalendarDays(days);
 	return days;
 }
 function assertWeekCalendarDays(days) {
-	if (days.length !== 7) throw new Error("Expected week calendar helper to return exactly 7 days");
+	if (days.length !== 7) throw new Error("Expected exactly 7 calendar days");
 }
-/**
-* Day-name labels reordered for the chosen week start. Pass a custom
-* `dayNames` array (length 7, Sunday-first) to localize.
-*/
 function getOrderedDayNames(startOfWeek, dayNames = DAY_NAMES) {
 	if (startOfWeek === "monday") {
 		const sunday = dayNames[0] ?? "Sun";
@@ -143,22 +107,17 @@ function getOrderedDayNames(startOfWeek, dayNames = DAY_NAMES) {
 	}
 	return [...dayNames];
 }
-/**
-* Header title for a calendar view.
-*   - month: "January 2025"
-*   - week:  "January 5 - 11, 2025" or "December 30 - January 5, 2025"
-*/
 function formatCalendarTitle(viewDate, view, days, monthNames = MONTH_NAMES) {
 	if (view === "week") {
 		const weekStart = days[0];
 		const weekEnd = days[6];
-		if (weekStart === void 0 || weekEnd === void 0) return `${monthNames[viewDate.getMonth()] ?? ""} ${viewDate.getFullYear()}`;
-		const startMonth = monthNames[weekStart.getMonth()] ?? "";
-		const endMonth = monthNames[weekEnd.getMonth()] ?? "";
-		if (weekStart.getMonth() === weekEnd.getMonth()) return `${startMonth} ${weekStart.getDate()} - ${weekEnd.getDate()}, ${weekEnd.getFullYear()}`;
-		return `${startMonth} ${weekStart.getDate()} - ${endMonth} ${weekEnd.getDate()}, ${weekEnd.getFullYear()}`;
+		if (weekStart === void 0 || weekEnd === void 0) return `${monthNames[viewDate.month - 1] ?? ""} ${viewDate.year}`;
+		const startMonth = monthNames[weekStart.month - 1] ?? "";
+		const endMonth = monthNames[weekEnd.month - 1] ?? "";
+		if (weekStart.month === weekEnd.month) return `${startMonth} ${weekStart.day} - ${weekEnd.day}, ${weekEnd.year}`;
+		return `${startMonth} ${weekStart.day} - ${endMonth} ${weekEnd.day}, ${weekEnd.year}`;
 	}
-	return `${monthNames[viewDate.getMonth()] ?? ""} ${viewDate.getFullYear()}`;
+	return `${monthNames[viewDate.month - 1] ?? ""} ${viewDate.year}`;
 }
 function buildCalendarViewport(input) {
 	const monthNames = input.monthNames ?? MONTH_NAMES;
@@ -168,10 +127,10 @@ function buildCalendarViewport(input) {
 			kind: "week",
 			anchorDate: input.anchorDate,
 			days,
-			title: formatCalendarTitle(input.anchorDate, "week", [...days], monthNames)
+			title: formatCalendarTitle(input.anchorDate, "week", days, monthNames)
 		};
 	}
-	const days = getMonthCalendarDays(input.anchorDate.getFullYear(), input.anchorDate.getMonth(), input.startOfWeek);
+	const days = getMonthCalendarDays(input.anchorDate.year, input.anchorDate.month, input.startOfWeek);
 	return {
 		kind: "month",
 		anchorDate: input.anchorDate,
@@ -250,25 +209,80 @@ const TabBar = ({ tabs, activeTab, onTabChange, className }) => {
 };
 //#endregion
 //#region ../blocks/src/system/runtime/hooks/useCalendarEvents.state.ts
-function calendarEventCacheLoadReducer(_state, action) {
-	switch (action.type) {
-		case "started": return { kind: "loading" };
-		case "succeeded": return { kind: "idle" };
-		case "failed": return {
-			kind: "error",
-			error: action.error
-		};
-		default: return assertNever(action);
+function calendarMonthKey(date) {
+	return `${date.year}-${String(date.month).padStart(2, "0")}`;
+}
+function calendarWindowMonths(date, radius) {
+	const months = [];
+	for (let offset = -radius; offset <= radius; offset++) months.push(calendarMonthKey(addMonths(date, offset)));
+	return months;
+}
+function groupEvents(events, timeZone) {
+	const grouped = /* @__PURE__ */ new Map();
+	for (const event of events) {
+		const key = calendarMonthKey(getLocalScheduleDate(new Date(event.startsAt), timeZone));
+		const month = grouped.get(key) ?? [];
+		if (!month.some((existing) => existing.id === event.id)) month.push(event);
+		grouped.set(key, month);
+	}
+	return grouped;
+}
+function seedCalendarCache(events, timeZone) {
+	return new Map([...groupEvents(events, timeZone)].map(([key, values]) => [key, {
+		kind: "seeded",
+		events: values
+	}]));
+}
+function planCalendarRequest(state, months, retry) {
+	const missing = months.filter((key) => {
+		const month = state.get(key);
+		return !month || month.kind === "seeded" || retry && month.kind === "failed";
+	});
+	return missing.length > 0 ? { months: missing } : null;
+}
+function startCalendarRequest(state, request) {
+	const next = new Map(state);
+	for (const key of request.months) {
+		const month = state.get(key);
+		if (month?.kind === "loading" || month?.kind === "ready") continue;
+		next.set(key, {
+			kind: "loading",
+			request,
+			events: month?.events ?? []
+		});
 	}
+	return next;
 }
-function toCalendarEventCacheLoadError(error) {
-	return toError(error, "Unknown error");
+function calendarCacheReducer(state, action) {
+	if (action.kind === "started") return startCalendarRequest(state, action.request);
+	const next = new Map(state);
+	const grouped = action.kind === "succeeded" ? groupEvents(action.events, action.timeZone) : null;
+	for (const key of action.request.months) {
+		const month = state.get(key);
+		if (month?.kind === "loading" && month.request === action.request) next.set(key, action.kind === "succeeded" ? {
+			kind: "ready",
+			events: grouped?.get(key) ?? []
+		} : {
+			kind: "failed",
+			error: action.error,
+			events: month.events
+		});
+	}
+	return next;
 }
-function isCalendarEventCacheLoading(state) {
-	return state.kind === "loading";
+function selectCalendarEvents(state, months) {
+	const events = /* @__PURE__ */ new Map();
+	for (const key of months) for (const event of state.get(key)?.events ?? []) events.set(event.id, event);
+	return [...events.values()].sort((a, b) => new Date(a.startsAt).getTime() - new Date(b.startsAt).getTime());
 }
-function getCalendarEventCacheError(state) {
-	return state.kind === "error" ? state.error : null;
+function projectCalendarLoadState(state, months) {
+	const entries = months.map((key) => state.get(key));
+	const failed = entries.find((entry) => entry?.kind === "failed");
+	if (failed?.kind === "failed") return {
+		kind: "error",
+		error: failed.error
+	};
+	return entries.some((entry) => !entry || entry.kind === "seeded" || entry.kind === "loading") ? { kind: "loading" } : { kind: "idle" };
 }
 //#endregion
 //#region ../blocks/src/system/runtime/hooks/useCalendarEvents.ts
@@ -280,18 +294,28 @@ function getCalendarEventCacheError(state) {
 */
 /** Maximum events to fetch per calendar request (covers 3 months of events) */
 const CALENDAR_FETCH_LIMIT = 200;
-/**
-* Generate a cache key for a month
-*/
-function getMonthKey(date) {
-	return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}`;
+async function loadCalendarEventPages(loadPage, request) {
+	const events = [];
+	let afterStartsAt;
+	let afterId;
+	for (;;) {
+		const page = await loadPage({
+			...request,
+			afterStartsAt,
+			afterId,
+			limit: CALENDAR_FETCH_LIMIT
+		});
+		events.push(...page);
+		if (page.length < CALENDAR_FETCH_LIMIT) return events;
+		const last = page[page.length - 1];
+		if (!last) return events;
+		if (last.startsAt === afterStartsAt && last.occurrenceId === afterId) throw new Error("Calendar event pagination cursor did not advance");
+		afterStartsAt = last.startsAt;
+		afterId = last.occurrenceId;
+	}
 }
-/**
-* Owns calendar viewport state only: selected anchor date, derived visible
-* period, and navigation by the natural unit for the active view.
-*/
-function useCalendarViewport({ view = "month", startOfWeek = "monday", initialDate } = {}) {
-	const [viewDate, setViewDate] = useState(() => initialDate ?? /* @__PURE__ */ new Date());
+function useCalendarViewport({ view = "month", startOfWeek = "monday", initialDate }) {
+	const [viewDate, setViewDate] = useState(initialDate);
 	const viewport = useMemo(() => buildCalendarViewport({
 		view,
 		anchorDate: viewDate,
@@ -316,168 +340,135 @@ function useCalendarViewport({ view = "month", startOfWeek = "monday", initialDa
 		goToPrevious,
 		goToNext,
 		goToToday: useCallback(() => {
-			setViewDate(/* @__PURE__ */ new Date());
-		}, [])
+			setViewDate(initialDate);
+		}, [initialDate])
 	};
 }
 /**
-* Owns event loading and month-window caching for a supplied viewport anchor.
-* It does not decide navigation semantics or visible calendar days.
+* The reducer owns month data and request ownership. The hook only performs I/O.
+* Requests for other months remain useful until the query context changes.
 */
-function useCalendarEventCache({ viewDate, initialEvents = [], preloadMonths = 1, filters, stage }) {
+function useCalendarEventCache({ viewDate, initialEvents = [], preloadMonths = 1, filters, stage, timeZone }) {
 	const { getPublicEvents } = useBlockApi();
-	const [loadState, dispatchLoadState] = useReducer(calendarEventCacheLoadReducer, { kind: "idle" });
-	const [cacheVersion, setCacheVersion] = useState(0);
-	const filtersKey = useMemo(() => getEventRuntimeFiltersKey(filters), [
-		filters?.categoryIds,
-		filters?.eventPresets,
-		filters?.eventSurface,
-		filters?.scheduleScope,
-		filters?.staffMemberId,
-		filters?.venueId
+	const context = useMemo(() => ({
+		getPublicEvents,
+		filters,
+		stage,
+		timeZone
+	}), [
+		getPublicEvents,
+		getEventRuntimeFiltersKey(filters),
+		stage,
+		timeZone
 	]);
-	const cacheRef = useRef(/* @__PURE__ */ new Map());
-	const loadedMonthsRef = useRef(/* @__PURE__ */ new Set());
-	const fetchingRef = useRef(/* @__PURE__ */ new Set());
-	const requestIdRef = useRef(0);
-	const initializedFiltersKeyRef = useRef(null);
-	useEffect(() => {
-		if (initializedFiltersKeyRef.current === filtersKey) return;
-		initializedFiltersKeyRef.current = filtersKey;
-		cacheRef.current = /* @__PURE__ */ new Map();
-		loadedMonthsRef.current = /* @__PURE__ */ new Set();
-		fetchingRef.current = /* @__PURE__ */ new Set();
-		requestIdRef.current += 1;
-		if (initialEvents.length > 0) for (const event of initialEvents) {
-			const monthKey = getMonthKey(new Date(event.startsAt));
-			const existing = cacheRef.current.get(monthKey) || [];
-			if (!existing.some((e) => e.id === event.id)) cacheRef.current.set(monthKey, [...existing, event]);
-		}
-		setCacheVersion((v) => v + 1);
-	}, [filtersKey, initialEvents]);
-	const fetchEventsForRange = useCallback(async (from, to, targetMonths) => {
-		const monthsToFetch = targetMonths.filter((m) => !loadedMonthsRef.current.has(m) && !fetchingRef.current.has(m));
-		if (monthsToFetch.length === 0) return;
-		monthsToFetch.forEach((m) => fetchingRef.current.add(m));
-		const currentRequestId = ++requestIdRef.current;
-		dispatchLoadState({ type: "started" });
+	const [snapshot, setSnapshot] = useState(() => ({
+		context,
+		cache: seedCalendarCache(initialEvents, timeZone)
+	}));
+	if (snapshot.context !== context) setSnapshot({
+		context,
+		cache: seedCalendarCache(initialEvents, timeZone)
+	});
+	const months = useMemo(() => calendarWindowMonths(viewDate, preloadMonths), [
+		viewDate.year,
+		viewDate.month,
+		preloadMonths
+	]);
+	const displayMonths = useMemo(() => calendarWindowMonths(viewDate, 1), [viewDate.year, viewDate.month]);
+	const request = useMemo(() => snapshot.context === context ? planCalendarRequest(snapshot.cache, months, false) : null, [
+		snapshot,
+		context,
+		months
+	]);
+	const launched = useRef(/* @__PURE__ */ new WeakSet());
+	const runRequest = useCallback(async (planned) => {
+		if (launched.current.has(planned)) return;
+		launched.current.add(planned);
+		const apply = (action) => setSnapshot((current) => current.context === context ? {
+			context,
+			cache: calendarCacheReducer(current.cache, action)
+		} : current);
+		apply({
+			kind: "started",
+			request: planned
+		});
 		try {
-			const result = await getPublicEvents({
-				from,
-				to,
-				limit: CALENDAR_FETCH_LIMIT,
-				stage,
-				detailLevel: "listing",
-				eventSurface: filters?.eventSurface,
-				eventPresets: filters?.eventPresets,
-				scheduleScope: filters?.scheduleScope,
-				categoryIds: filters?.categoryIds,
-				staffMemberId: filters?.staffMemberId,
-				venueId: filters?.venueId
+			const range = buildBookingUtcDateWindow({
+				startDate: formatLocalScheduleDate(getStartOfMonth(addMonths(viewDate, -preloadMonths))),
+				endDate: formatLocalScheduleDate(getEndOfMonth(addMonths(viewDate, preloadMonths))),
+				timeZone
+			});
+			apply({
+				kind: "succeeded",
+				request: planned,
+				events: await loadCalendarEventPages(context.getPublicEvents, {
+					...context.filters,
+					stage: context.stage,
+					from: range.startAt.toISOString(),
+					to: (/* @__PURE__ */ new Date(range.endExclusive.getTime() - 1)).toISOString(),
+					detailLevel: "listing"
+				}),
+				timeZone
 			});
-			if (currentRequestId === requestIdRef.current) {
-				for (const event of result) {
-					const monthKey = getMonthKey(new Date(event.startsAt));
-					const existing = cacheRef.current.get(monthKey) || [];
-					if (!existing.some((e) => e.id === event.id)) cacheRef.current.set(monthKey, [...existing, event]);
-				}
-				for (const month of monthsToFetch) {
-					loadedMonthsRef.current.add(month);
-					if (!cacheRef.current.has(month)) cacheRef.current.set(month, []);
-				}
-				setCacheVersion((v) => v + 1);
-				dispatchLoadState({ type: "succeeded" });
-			}
-		} catch (err) {
-			if (currentRequestId === requestIdRef.current) dispatchLoadState({
-				type: "failed",
-				error: toCalendarEventCacheLoadError(err)
+		} catch (error) {
+			apply({
+				kind: "failed",
+				request: planned,
+				error: toError(error, "Failed to load events")
 			});
-		} finally {
-			monthsToFetch.forEach((m) => fetchingRef.current.delete(m));
 		}
 	}, [
-		getPublicEvents,
-		filters?.categoryIds,
-		filters?.eventPresets,
-		filters?.eventSurface,
-		filters?.scheduleScope,
-		filters?.staffMemberId,
-		filters?.venueId,
-		stage
+		context,
+		viewDate.year,
+		viewDate.month,
+		preloadMonths,
+		timeZone
 	]);
-	const ensureEventsLoaded = useCallback((date) => {
-		const targetMonths = [];
-		for (let i = -preloadMonths; i <= preloadMonths; i++) {
-			const targetDate = addMonths(date, i);
-			targetMonths.push(getMonthKey(targetDate));
-		}
-		const unloadedMonths = targetMonths.filter((m) => !loadedMonthsRef.current.has(m) && !fetchingRef.current.has(m));
-		if (unloadedMonths.length > 0) {
-			const range = getThreeMonthRange(date);
-			fetchEventsForRange(range.from, range.to, unloadedMonths);
-		}
-	}, [preloadMonths, fetchEventsForRange]);
 	useEffect(() => {
-		ensureEventsLoaded(viewDate);
-	}, [viewDate, ensureEventsLoaded]);
+		if (request) runRequest(request);
+	}, [request, runRequest]);
+	const retryCurrentView = useCallback(() => {
+		if (snapshot.context !== context) return;
+		const retry = planCalendarRequest(snapshot.cache, months, true);
+		if (retry) runRequest(retry);
+	}, [
+		snapshot,
+		context,
+		months,
+		runRequest
+	]);
 	return {
-		events: useMemo(() => {
-			const allEvents = [];
-			for (let i = -1; i <= 1; i++) {
-				const monthKey = getMonthKey(addMonths(viewDate, i));
-				const monthEvents = cacheRef.current.get(monthKey) || [];
-				allEvents.push(...monthEvents);
-			}
-			const seen = /* @__PURE__ */ new Set();
-			return allEvents.filter((e) => {
-				if (seen.has(e.id)) return false;
-				seen.add(e.id);
-				return true;
-			}).sort((a, b) => new Date(a.startsAt).getTime() - new Date(b.startsAt).getTime());
-		}, [viewDate, cacheVersion]),
-		loading: isCalendarEventCacheLoading(loadState),
-		error: getCalendarEventCacheError(loadState)
+		events: selectCalendarEvents(snapshot.cache, displayMonths),
+		loadState: projectCalendarLoadState(snapshot.cache, months),
+		retryCurrentView
 	};
 }
-/**
-* Hook for calendar event management with month-based caching.
-*
-* Pre-fetches 3 months (previous, current, next) and caches by month.
-* Navigation within cached range is instant; fetches at boundaries.
-*
-* @example
-* ```tsx
-* const { events, viewDate, loading, goToPrevious, goToNext } = useCalendarEvents({
-*   siteId: 'site-123',
-*   initialEvents: serverEvents,
-* });
-* ```
-*/
-function useCalendarEvents({ siteId: _siteId, initialEvents = [], view = "month", startOfWeek = "monday", preloadMonths = 1, filters, stage }) {
+function useCalendarEvents({ siteId: _siteId, initialEvents = [], view = "month", startOfWeek = "monday", preloadMonths = 1, filters, stage, calendarContext }) {
 	const { viewDate, viewport, goToDate, goToPrevious, goToNext, goToToday } = useCalendarViewport({
 		view,
-		startOfWeek
+		startOfWeek,
+		initialDate: calendarContext.initialToday
 	});
-	const { events, loading, error } = useCalendarEventCache({
+	const { events, loadState, retryCurrentView } = useCalendarEventCache({
 		viewDate,
 		initialEvents,
 		preloadMonths,
 		filters,
-		stage
+		stage,
+		timeZone: calendarContext.timeZone
 	});
 	return {
 		events,
 		viewDate,
 		viewport,
-		loading,
-		error,
+		loadState,
 		setViewDate: useCallback((date) => {
 			goToDate(date);
 		}, [goToDate]),
 		goToPrevious,
 		goToNext,
-		goToToday
+		goToToday,
+		retryCurrentView
 	};
 }
 //#endregion
@@ -544,9 +535,9 @@ function useEventModal() {
 * Clicking an event opens the EventDetailModal.
 * Clicking "+N more" opens the DayEventsModal.
 */
-const CalendarDayCell = ({ date, events, isCurrentMonth }) => {
+const CalendarDayCell = ({ date, events, isCurrentMonth, today: currentDate }) => {
 	const { openEventModal, openDayModal } = useEventModal();
-	const today = isToday(date);
+	const today = isToday(date, currentDate);
 	const dayClasses = [
 		"event-calendar-day",
 		!isCurrentMonth && "event-calendar-day--other-month",
@@ -562,7 +553,7 @@ const CalendarDayCell = ({ date, events, isCurrentMonth }) => {
 		className: dayClasses,
 		children: [/* @__PURE__ */ jsx("div", {
 			className: "event-calendar-day-number",
-			children: date.getDate()
+			children: date.day
 		}), /* @__PURE__ */ jsxs("div", {
 			className: "event-calendar-events",
 			children: [events.slice(0, 3).map((event) => {
@@ -608,8 +599,8 @@ const AgendaEventCard = ({ event, showCapacity, onClick }) => {
 	const eventLinkProps = resolveEventLinkProps(event);
 	const categoryColor = event.eventCategory?.color || "rgb(var(--tb-accent))";
 	const price = formatEventPrice(event);
-	const { available, isFull } = getEventAvailability(event);
-	const capacity = showCapacity && available != null ? isFull ? "Full" : `${available} spots left` : null;
+	const capacity = showCapacity ? formatEventRemainingPlaces(event) : null;
+	const isFull = isEventFull(event);
 	const title = event.title;
 	const timeZone = event.timeZone ?? null;
 	const teacherLine = formatEventTeacherLine(event);
@@ -694,9 +685,9 @@ const FULL_DAY_NAMES = [
 * @returns "Monday, January 13"
 */
 function formatAgendaDayHeader(date) {
-	const dayName = FULL_DAY_NAMES[date.getDay()];
-	const monthName = MONTH_NAMES[date.getMonth()];
-	return `${dayName ?? "Day"}, ${monthName ?? "Month"} ${date.getDate()}`;
+	const dayName = FULL_DAY_NAMES[getDayOfWeek(date)];
+	const monthName = MONTH_NAMES[date.month - 1];
+	return `${dayName ?? "Day"}, ${monthName ?? "Month"} ${date.day}`;
 }
 /**
 * WeekAgendaView Component
@@ -704,14 +695,14 @@ function formatAgendaDayHeader(date) {
 * Displays a week of events in an agenda/list style with rich event details.
 * Shows all 7 days with date headers, empty days show "No events scheduled".
 */
-const WeekAgendaView = ({ days, events, showCapacity, emptyMessage = "No events scheduled" }) => {
-	const eventsByDate = groupEventsByDate(events);
+const WeekAgendaView = ({ days, events, showCapacity, emptyMessage = "No events scheduled", calendarTimeZone, today: currentDate }) => {
+	const eventsByDate = groupEventsByDate(events, calendarTimeZone);
 	return /* @__PURE__ */ jsx("div", {
 		className: "event-agenda-week",
 		children: days.map((date) => {
 			const dateKey = formatDateKey(date);
 			const dayEvents = eventsByDate.get(dateKey) || [];
-			const today = isToday(date);
+			const today = isToday(date, currentDate);
 			return /* @__PURE__ */ jsxs("div", {
 				className: `event-agenda-day ${today ? "event-agenda-day--today" : ""}`,
 				children: [/* @__PURE__ */ jsx("div", {
@@ -810,7 +801,7 @@ function EventDetailModal({ event, showCapacity, onClose, portalRoot, cardRole =
 * Clicking an event triggers onSelectEvent (typically opens EventDetailModal).
 */
 function DayEventsModal({ date, events, showCapacity, onClose, onSelectEvent, portalRoot }) {
-	const formattedDate = formatDate(date.toISOString());
+	const formattedDate = formatDate(`${formatLocalScheduleDate(date)}T12:00:00Z`);
 	return /* @__PURE__ */ jsxs(ModalShell, {
 		title: formattedDate,
 		titleId: "ec-day-modal-title",
@@ -950,7 +941,8 @@ function toEventCombinedControllerProps(props) {
 		buttonVariant: props.render.display.buttonVariant,
 		buttonText: props.render.display.buttonText,
 		emptyMessage: props.render.display.emptyMessage,
-		className: props.render.display.className ?? void 0
+		className: props.render.display.className ?? void 0,
+		calendarContext: props.render.hydration.calendarContext
 	};
 }
 /**
@@ -962,7 +954,7 @@ function toEventCombinedControllerProps(props) {
 const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout = "stack", listColumns = "3", eventsPerPage = 12, paginationAction = {
 	kind: "loadMore",
 	label: "Load more events"
-}, startOfWeek = "monday", calendarTabViews = "both", defaultCalendarView, showFilters, showCategoryFilter = "auto", showVenueFilter, showStaffFilter, eventSurface, filterEventPresets, scheduleScope, filterCategoryIds, filterStaffMemberId, filterVenueId, showVenue, showMap, showCapacity, cardRole, buttonVariant = "primary", buttonText = "Book", emptyMessage = "No upcoming events scheduled.", className }) => {
+}, startOfWeek = "monday", calendarTabViews = "both", defaultCalendarView, showFilters, showCategoryFilter = "auto", showVenueFilter, showStaffFilter, eventSurface, filterEventPresets, scheduleScope, filterCategoryIds, filterStaffMemberId, filterVenueId, showVenue, showMap, showCapacity, cardRole, buttonVariant = "primary", buttonText = "Book", emptyMessage = "No upcoming events scheduled.", className, calendarContext }) => {
 	const fetchInitialEventsOnMount = initialEvents == null;
 	const resolvedShowFilters = showFilters ?? true;
 	const resolvedShowVenueFilter = showVenueFilter ?? false;
@@ -1020,7 +1012,7 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 		pageSize,
 		stage
 	});
-	const { events: calendarEventsRaw, viewDate, viewport, loading: calendarLoading, goToPrevious, goToNext, goToToday } = useCalendarEvents({
+	const { events: calendarEventsRaw, viewDate, viewport, loadState: calendarLoadState, goToPrevious, goToNext, goToToday } = useCalendarEvents({
 		siteId,
 		initialEvents: useMemo(() => {
 			return getEventRuntimeFiltersKey(initialListFilters) === getEventRuntimeFiltersKey(listFilters) ? initialEvents ?? [] : [];
@@ -1033,9 +1025,10 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 		startOfWeek,
 		preloadMonths: 1,
 		filters: listFilters,
-		stage
+		stage,
+		calendarContext
 	});
-	const eventsByDate = useMemo(() => groupEventsByDate(calendarEventsRaw), [calendarEventsRaw]);
+	const eventsByDate = useMemo(() => groupEventsByDate(calendarEventsRaw, calendarContext.timeZone), [calendarContext.timeZone, calendarEventsRaw]);
 	const dayNames = useMemo(() => getOrderedDayNames(startOfWeek), [startOfWeek]);
 	const tabs = [{
 		id: "list",
@@ -1137,7 +1130,7 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 								}),
 								/* @__PURE__ */ jsxs("h3", {
 									className: "event-calendar-title",
-									children: [viewport.title, calendarLoading && /* @__PURE__ */ jsx("span", {
+									children: [viewport.title, calendarLoadState.kind === "loading" && /* @__PURE__ */ jsx("span", {
 										className: "rb-ml-2 rb-caption status-muted",
 										children: "(loading...)"
 									})]
@@ -1176,7 +1169,9 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 						days: viewport.days,
 						events: calendarEventsRaw,
 						emptyMessage: "No events scheduled",
-						showCapacity: resolvedShowCapacity
+						showCapacity: resolvedShowCapacity,
+						calendarTimeZone: calendarContext.timeZone,
+						today: calendarContext.initialToday
 					}) : /* @__PURE__ */ jsxs("div", {
 						className: "event-calendar-container",
 						children: [/* @__PURE__ */ jsx("div", {
@@ -1192,12 +1187,13 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 								return /* @__PURE__ */ jsx(CalendarDayCell, {
 									date,
 									events: eventsByDate.get(dateKey) || [],
-									isCurrentMonth: date.getMonth() === viewDate.getMonth()
+									isCurrentMonth: date.month === viewDate.month,
+									today: calendarContext.initialToday
 								}, dateKey);
 							})
 						})]
 					}),
-					calendarEventsRaw.length === 0 && !calendarLoading && /* @__PURE__ */ jsx("p", {
+					calendarEventsRaw.length === 0 && calendarLoadState.kind === "idle" && /* @__PURE__ */ jsx("p", {
 						className: "event-calendar-empty",
 						children: emptyMessage
 					})
@@ -1213,4 +1209,4 @@ const EventCombinedClient = ({ events: initialEvents, siteId, stage, listLayout
 };
 const EventCombinedIslandClient = (props) => /* @__PURE__ */ jsx(EventCombinedClient, { ...toEventCombinedControllerProps(props) });
 //#endregion
-export { CalendarDayCell as a, useCalendarEvents as c, getOrderedDayNames as d, getWeekCalendarDayTuple as f, isToday as h, WeekAgendaView as i, MONTH_NAMES as l, isSameLocalDay as m, EventCombinedIslandClient as n, EventModalProvider as o, getWeekCalendarDays as p, EventModals as r, useEventModal as s, EventCombinedClient as t, formatDateKey as u };
+export { CalendarDayCell as a, useCalendarEvents as c, formatDateKey as d, getDayOfWeek as f, isToday as g, isSameCalendarDay as h, WeekAgendaView as i, MONTH_NAMES as l, getWeekCalendarDays as m, EventCombinedIslandClient as n, EventModalProvider as o, getOrderedDayNames as p, EventModals as r, useEventModal as s, EventCombinedClient as t, addDays as u };