@riverbankcms/sdk 0.130.0 → 0.132.0

package/dist/client/{scrollToBlock-DSSqVQr1.mjs → scrollToBlock-B3CcKdtG.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { i as getAutoAppliedDiscountPreview, n as discountAvailabilityAllowsManualEntry, r as discountAvailabilityHasDiscounts } from "./DiscountCodeDisclosure-Ur-Xx1U_.mjs";
+import { i as getAutoAppliedDiscountPreview, n as discountAvailabilityAllowsManualEntry, r as discountAvailabilityHasDiscounts } from "./DiscountCodeDisclosure-DO7llLxm.mjs";
 import { useEffect, useReducer, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region ../blocks/src/system/runtime/shared/components/CheckIcon.tsx

package/dist/client/{shop-BMToKLK7.mjs → shop-DNWJPut5.mjs}

@@ -1,14 +1,14 @@
 "use client";
-import { Kt as assertNever$1, Z as themeButtonClassName, bt as assertNever, o as formatCommercePrice, s as formatInterval, t as defineIslandPropsDecoder } from "./propsDecoder-CAZdhwjs.mjs";
-import { n as useBlockApi } from "./context-CJz1Vlsz.mjs";
-import { a as CheckIcon, i as StateIcon, n as useDiscountCodeUi, r as TerminalPanel, t as scrollToBlock } from "./scrollToBlock-DSSqVQr1.mjs";
-import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-Ur-Xx1U_.mjs";
-import { t as FeedbackMessage } from "./FeedbackMessage-ByMrs3cr.mjs";
+import { Jt as assertNever$1, St as assertNever, et as themeButtonClassName, o as formatCommercePrice, s as formatInterval, t as defineIslandPropsDecoder } from "./propsDecoder-BxmqPKdP.mjs";
+import { n as useBlockApi } from "./context-B83PiNzm.mjs";
+import { a as CheckIcon, i as StateIcon, n as useDiscountCodeUi, r as TerminalPanel, t as scrollToBlock } from "./scrollToBlock-B3CcKdtG.mjs";
+import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-DO7llLxm.mjs";
+import { t as FeedbackMessage } from "./FeedbackMessage-CtLvvS_d.mjs";
 import { t as createBodyThemePortalRoot } from "./themePortalRoot-AGs4cE7t.mjs";
 import { n as consumeSearchParams } from "./urlParams-D71VXFGx.mjs";
 import { t as CrossIcon } from "./CrossIcon-Dn1KRKW5.mjs";
-import { _ as MembershipCardView, a as getDiscountApplyFeedback, b as PassesMembershipsSectionView, d as planDirectShopCheckoutRequest, i as getAppliedDiscountCode, m as useTransientShopAddFeedback, n as useDiscountApply, o as initialDiscountApplyState, p as ShopAddFeedback, r as discountApplyReducer, s as isDiscountApplyInFlight, t as mountShopBlockIsland, v as PassCardView, y as PassPurchaseUnavailable } from "./shopShared-B6SK9DZv.mjs";
-import { t as addPassToCommerceCart } from "./shop-commerce-store-BOqSIOuc.mjs";
+import { _ as MembershipCardView, a as getDiscountApplyFeedback, b as PassesMembershipsSectionView, d as planDirectShopCheckoutRequest, i as getAppliedDiscountCode, m as useTransientShopAddFeedback, n as useDiscountApply, o as initialDiscountApplyState, p as ShopAddFeedback, r as discountApplyReducer, s as isDiscountApplyInFlight, t as mountShopBlockIsland, v as PassCardView, y as PassPurchaseUnavailable } from "./shopShared-DNNgZlmW.mjs";
+import { t as addPassToCommerceCart } from "./shop-commerce-store-B04sCNnW.mjs";
 import { t as ModalShell } from "./ModalShell-CqkBvBIC.mjs";
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/client/{shop-commerce-DB4JRKmp.mjs → shop-commerce-BhvQCosS.mjs}

@@ -1,15 +1,15 @@
 "use client";
-import { J as RichTextDocSchema, Tt as reportWorkflowError, Z as themeButtonClassName, a as buildProductDetailDisplay, bt as assertNever, d as deriveCommerceCheckoutState, i as buildProductCardDisplay, it as logger, n as getShopDisplayForItems, o as formatCommercePrice, p as productItemKey, u as buildProductCartItem, xt as clearWorkflowFeedback } from "./propsDecoder-CAZdhwjs.mjs";
-import { a as getCurrentResolveImageUrlContext, c as resolveImageUrlWithContext, t as ImagePresets } from "./media-CNE1Z-wb.mjs";
-import { n as useBlockApi } from "./context-CJz1Vlsz.mjs";
-import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-Ur-Xx1U_.mjs";
-import { t as FeedbackMessage } from "./FeedbackMessage-ByMrs3cr.mjs";
+import { Ct as clearWorkflowFeedback, Dt as reportWorkflowError, St as assertNever, Z as RichTextDocSchema, a as buildProductDetailDisplay, d as deriveCommerceCheckoutState, et as themeButtonClassName, i as buildProductCardDisplay, n as getShopDisplayForItems, o as formatCommercePrice, ot as logger, p as productItemKey, u as buildProductCartItem } from "./propsDecoder-BxmqPKdP.mjs";
+import { a as getCurrentResolveImageUrlContext, c as resolveImageUrlWithContext, t as ImagePresets } from "./media-BOHuueS5.mjs";
+import { n as useBlockApi } from "./context-B83PiNzm.mjs";
+import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-DO7llLxm.mjs";
+import { t as FeedbackMessage } from "./FeedbackMessage-CtLvvS_d.mjs";
 import { t as buildCheckoutReturnUrls } from "./checkoutUrls-Ct8Mxna3.mjs";
 import { t as consumeSearchParam } from "./urlParams-D71VXFGx.mjs";
-import { t as CarouselNodeClient } from "./carousel.client-CpwTUhIo.mjs";
+import { t as CarouselNodeClient } from "./carousel.client-59G_WMr4.mjs";
 import { t as resolveDedicatedCheckoutPath } from "./checkoutRoute-ClwHwYVA.mjs";
-import { C as ProductGalleryFrameView, S as ProductDetailView, T as VariantSelectView, a as getDiscountApplyFeedback, c as aggregateCartDiscountUiState, f as planUnifiedCheckoutRequest, g as CheckoutShellView, h as CartShellView, i as getAppliedDiscountCode, l as checkoutFormForDiscountUiState, m as useTransientShopAddFeedback, n as useDiscountApply, o as initialDiscountApplyState, p as ShopAddFeedback, r as discountApplyReducer, s as isDiscountApplyInFlight, u as planCartDiscountAvailabilityRequests, w as ProductListSectionView, x as ProductCardView } from "./shopShared-B6SK9DZv.mjs";
-import { n as useCommerceCart } from "./shop-commerce-store-BOqSIOuc.mjs";
+import { C as ProductGalleryFrameView, S as ProductDetailView, T as VariantSelectView, a as getDiscountApplyFeedback, c as aggregateCartDiscountUiState, f as planUnifiedCheckoutRequest, g as CheckoutShellView, h as CartShellView, i as getAppliedDiscountCode, l as checkoutFormForDiscountUiState, m as useTransientShopAddFeedback, n as useDiscountApply, o as initialDiscountApplyState, p as ShopAddFeedback, r as discountApplyReducer, s as isDiscountApplyInFlight, u as planCartDiscountAvailabilityRequests, w as ProductListSectionView, x as ProductCardView } from "./shopShared-DNNgZlmW.mjs";
+import { n as useCommerceCart } from "./shop-commerce-store-B04sCNnW.mjs";
 import * as React$1 from "react";
 import React, { useEffect, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/client/{shop-commerce-store-BOqSIOuc.mjs → shop-commerce-store-B04sCNnW.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { c as EMPTY_COMMERCE_CART_STATE, f as parseStoredCommerceCartState, l as buildPassCartItem, m as reduceCommerceCart } from "./propsDecoder-CAZdhwjs.mjs";
+import { c as EMPTY_COMMERCE_CART_STATE, f as parseStoredCommerceCartState, l as buildPassCartItem, m as reduceCommerceCart } from "./propsDecoder-BxmqPKdP.mjs";
 import * as React$1 from "react";
 //#region ../blocks/src/system/runtime/nodes/shop-commerce-store.ts
 const EMPTY_STATE = EMPTY_COMMERCE_CART_STATE;

package/dist/client/{shopShared-B6SK9DZv.mjs → shopShared-DNNgZlmW.mjs}

@@ -1,9 +1,9 @@
 "use client";
-import { b as ok, y as err } from "./colorStyles-BWpj_h4C.mjs";
-import { bt as assertNever } from "./propsDecoder-CAZdhwjs.mjs";
-import { t as BlockApiProvider } from "./context-CJz1Vlsz.mjs";
-import { i as getAutoAppliedDiscountPreview, n as discountAvailabilityAllowsManualEntry, r as discountAvailabilityHasDiscounts } from "./DiscountCodeDisclosure-Ur-Xx1U_.mjs";
-import { t as FeedbackMessage } from "./FeedbackMessage-ByMrs3cr.mjs";
+import { E as ok, T as err } from "./colorStyles-CrxJrPjJ.mjs";
+import { St as assertNever } from "./propsDecoder-BxmqPKdP.mjs";
+import { t as BlockApiProvider } from "./context-B83PiNzm.mjs";
+import { i as getAutoAppliedDiscountPreview, n as discountAvailabilityAllowsManualEntry, r as discountAvailabilityHasDiscounts } from "./DiscountCodeDisclosure-DO7llLxm.mjs";
+import { t as FeedbackMessage } from "./FeedbackMessage-CtLvvS_d.mjs";
 import { t as mountReactIsland } from "./reactMount-SY8AVRof.mjs";
 import { t as buildRouteIslandApiConfig } from "./routeIslandApiConfig-UNsfPcYq.mjs";
 import * as React$1 from "react";

package/dist/client/{useEventFilters-CULOa4nB.mjs → useEventFilters-CUmhE24_.mjs}

@@ -1,8 +1,9 @@
 "use client";
-import { $ as hexToRgb, A as normalizeOptionalId, D as getEventRuntimeFiltersKey, I as formatEventTeacherLine, L as formatTime, M as formatEventCompactDateRail, O as normalizeCsvIds, P as formatEventPrice, Q as relativeLuminance, V as resolveEventCta, W as getEventAvailability, Z as themeButtonClassName, bt as assertNever, et as isCssColorLiteral, j as formatDate, k as normalizeCsvString, nt as resolveTokenOrCssColorValue, rt as normalizeCardVariantRole, tt as resolveOnColorForThemeToken } from "./propsDecoder-CAZdhwjs.mjs";
-import { a as getCurrentResolveImageUrlContext, i as computeMediaTransformStyle, l as resolveMediaNodeResponsiveImage, n as MediaPlaceholder, o as renderAudio, s as renderVideo, t as ImagePresets } from "./media-CNE1Z-wb.mjs";
-import { n as useBlockApi } from "./context-CJz1Vlsz.mjs";
-import { t as LeafletStaticMap } from "./LeafletStaticMap-BUw9Ntzr.mjs";
+import { d as hexToRgb, u as relativeLuminance } from "./colorStyles-CrxJrPjJ.mjs";
+import { A as getEventRuntimeFiltersKey, B as formatTime, D as isSemanticSpacing, E as SEMANTIC_SPACING_VALUES, F as formatEventCompactDateRail, L as formatEventPrice, M as normalizeCsvString, N as normalizeOptionalId, O as resolveSpacing, P as formatDate, St as assertNever, W as resolveEventCta, at as normalizeCardRole, et as themeButtonClassName, it as resolveTokenOrCssColorValue, j as normalizeCsvIds, nt as isCssColorLiteral, q as getEventAvailability, rt as resolveOnColorForThemeToken, tt as boxBackgroundSchema, z as formatEventTeacherLine } from "./propsDecoder-BxmqPKdP.mjs";
+import { a as getCurrentResolveImageUrlContext, i as computeMediaTransformStyle, l as resolveMediaNodeResponsiveImage, n as MediaPlaceholder, o as renderAudio, s as renderVideo, t as ImagePresets } from "./media-BOHuueS5.mjs";
+import { n as useBlockApi } from "./context-B83PiNzm.mjs";
+import { t as LeafletStaticMap } from "./LeafletStaticMap-DYmHnM8g.mjs";
 import { useCallback, useEffect, useId, useMemo, useReducer, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region ../theme-core/src/palette/utils/textColor.ts
@@ -163,6 +164,195 @@ const EventFilters = ({ categories, venues, staffMembers, selectedCategoryId, se
 	});
 };
 //#endregion
+//#region ../blocks/src/system/transforms/registry/core.ts
+/**
+* Safely narrows unknown values to partial object shapes used by transforms.
+* Arrays are intentionally excluded.
+*/
+function asPartialObject(value) {
+	if (typeof value !== "object" || value === null || Array.isArray(value)) return;
+	return value;
+}
+//#endregion
+//#region ../blocks/src/system/fields/backgroundContent.ts
+function parseBackgroundContent(value) {
+	const result = boxBackgroundSchema.safeParse(value);
+	return result.success ? result.data : null;
+}
+//#endregion
+//#region ../blocks/src/system/transforms/registry/_utils/boxStyleClassNames.ts
+/**
+* @file The one place box-style content becomes CSS classes.
+*
+* `boxStyles.all` runs this for the binding pipeline, and the React nodes that
+* render a card outside that pipeline (offerings-preview) call it directly, so
+* there is a single card-class emission path rather than copies that drift.
+*/
+/** The elevation class an elevated box gets when the theme defines a shadow. */
+const RAISED_SHADOW_CLASS = "rb-shadow-md";
+/** Radius values to their `rb-*` classes (defined in `rb-utilities.css`). */
+const ROUNDED_CLASSES = {
+	sm: "rb-rounded-sm",
+	md: "rb-rounded-md",
+	lg: "rb-rounded-lg",
+	xl: "rb-rounded-xl",
+	"2xl": "rb-rounded-2xl",
+	full: "rb-rounded-full"
+};
+function hasFixedFrameBackgroundMotion(value) {
+	const background = parseBackgroundContent(asPartialObject(value)?.background);
+	return (background?.type === "image" || background?.type === "video") && background.motion === "fixed-frame";
+}
+/**
+* The stable per-theme class for a card role. Generated card CSS emits these
+* aliases alongside each `.card-{id}` rule, so content addresses "this site
+* style's open card" without knowing which variant implements it.
+*/
+function cardRoleClass(role) {
+	return `card-role-${role}`;
+}
+/**
+* The role class for a card slot the *block* owns structurally, where a Look
+* may still name the surface.
+*
+* Some layouts have more than one card slot and decide themselves which one is
+* the statement — the featured-editorial testimonials field is a lead voice
+* beside its supporting voices, and that is structure, not composition. Those
+* slots still have to honour a Look that picks a surface, or a role-picking
+* Look would silently no-op under the layout. So the slot carries a default
+* role and the Look's compiled role wins over it when there is one.
+*
+* An explicit `none` is honoured as boxlessness and emits no class, matching
+* how the composite emitter reads it.
+*/
+/**
+* The role a card renders with, and the one place a set of card styles becomes
+* a role.
+*
+* Precedence: a per-item override, then the `role` a Look or semantic field
+* compiled onto the block's card styles. Persisted inputs are normalized at
+* this boundary because raw block records do not pass through the theme schema.
+*/
+function resolveCardRoleForBoxStyles(input, override) {
+	return override ?? normalizeCardRole(input.role);
+}
+/**
+* The card surface for a set of box styles: one role, one class vocabulary, so
+* a site-style swap re-skins the card whichever field named it.
+*/
+function cardSurface(input, override, fallback) {
+	const role = resolveCardRoleForBoxStyles(input, override) ?? fallback ?? null;
+	if (!role) return {
+		role: null,
+		classes: []
+	};
+	return {
+		role,
+		classes: role === "none" ? [] : [cardRoleClass(role)]
+	};
+}
+const BOX_BORDER_WIDTHS = [
+	"none",
+	"1",
+	"2",
+	"3"
+];
+function parseBoxBorderWidth(value) {
+	return BOX_BORDER_WIDTHS.find((width) => width === value);
+}
+/**
+* A box's border record with `{ width: 'none' }`-without-`enabled` resolved.
+*
+* That shape used to mean two different things to two different readers: the
+* old private offerings emitter read it as border-off, while the shared
+* emitter read it as "no opinion" and left the caller's base `rb-border` in
+* place. Same persisted bytes, opposite answers. A width of `none` says there
+* is no border, so it is read as `enabled: false` here — once, at the one
+* place box-style content is interpreted — and every reader downstream now
+* agrees.
+*
+* Nothing persisted carries the shape (the #1297 usage audit found zero rows;
+* the authoring UI cannot produce it, since the width control is gated on
+* `enabled === true`), so this is boundary hygiene rather than a migration.
+*/
+function normalizeBoxStylesBorder(value) {
+	const border = asPartialObject(value);
+	if (!border) return null;
+	const width = parseBoxBorderWidth(border.width);
+	return {
+		enabled: border.enabled === true ? true : border.enabled === false || width === "none" ? false : null,
+		width,
+		colorToken: typeof border.colorToken === "string" && border.colorToken.trim() ? border.colorToken.trim() : void 0
+	};
+}
+/** The border class a box's own border override asks for, if it has one. */
+function borderOverrideClass(input) {
+	const border = normalizeBoxStylesBorder(input.border);
+	if (!border) return null;
+	if (border.enabled === false) return "rb-border-0";
+	if (border.enabled !== true) return null;
+	switch (border.width) {
+		case "2": return "rb-border-2";
+		case "3": return "rb-border-3";
+		case "none": return "rb-border-0";
+		case "1":
+		case void 0: return "rb-border";
+	}
+}
+/** The base class with any border utilities stripped, so an override can win. */
+function withoutBorderClasses(baseClass) {
+	return baseClass.split(/\s+/).filter((token) => token && !/^rb-border(?:-(?:0|2|3))?$/.test(token)).join(" ");
+}
+/**
+* The padding class a box's spacing asks for, if it names a known value.
+*
+* An unknown value is dropped rather than guessed, and says so in development —
+* persisted content is the untrusted input here, and a silently missing padding
+* is much harder to trace back than a warning.
+*/
+function boxSpacingClass(input, axis) {
+	const spacing = typeof input.spacing === "string" ? input.spacing.trim() : "";
+	if (!spacing) return null;
+	if (!isSemanticSpacing(spacing)) {
+		console.warn(`[boxStyles] Invalid spacing value: "${spacing}". Expected one of: ${SEMANTIC_SPACING_VALUES.join(", ")}.`);
+		return null;
+	}
+	return resolveSpacing(spacing, axis);
+}
+/** The radius class a box's corners ask for, if it names a known value. */
+function boxRoundedClass(input) {
+	const rounded = typeof input.rounded === "string" ? input.rounded.trim() : "";
+	if (!rounded || rounded === "none") return null;
+	return ROUNDED_CLASSES[rounded] ?? null;
+}
+/** The elevation class to use, honouring an explicit `null` opt-out. */
+function raisedClassFor(options) {
+	return options.raisedClass === void 0 ? RAISED_SHADOW_CLASS : options.raisedClass;
+}
+/**
+* The class list for a set of box styles: the caller's base class, the border /
+* spacing / elevation / radius overrides the box carries, and its card surface.
+*
+* Pure, so the React nodes that render a card outside the binding pipeline
+* (offerings-preview) share this one emission path with `boxStyles.all` instead
+* of keeping a copy that drifts.
+*/
+function boxStyleClassNames(value, options) {
+	const input = value && typeof value === "object" ? value : {};
+	const borderOverride = borderOverrideClass(input);
+	const surface = cardSurface(input, options.cardRoleOverride, options.cardRoleFallback);
+	const cardOwnsBorder = surface.role !== null && surface.role !== "none";
+	return [
+		borderOverride || cardOwnsBorder ? withoutBorderClasses(options.baseClass ?? "") : options.baseClass ?? "",
+		borderOverride,
+		options.includeSpacing === false ? null : boxSpacingClass(input, options.axis ?? "all"),
+		input.raised === true ? raisedClassFor(options) : null,
+		boxRoundedClass(input),
+		...surface.classes,
+		hasFixedFrameBackgroundMotion(input) ? "rb-bg-motion-fixed-frame-scope" : null
+	].filter((token) => Boolean(token)).join(" ").trim() || "";
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/media.server.tsx
 const MediaNodeServer = ({ value, className, style, videoPlayback = "inline", loading = "lazy", fetchPriority, size = ImagePresets.full, fieldPath, blockKind, blockContent, imageResolveContext: explicitImageResolveContext }) => {
 	const imageResolveContext = explicitImageResolveContext ?? getCurrentResolveImageUrlContext();
@@ -253,14 +443,13 @@ function CalendarIcon$1({ className, size = 16, strokeWidth = 2 }) {
 *
 * This component is server-safe (uses no client APIs like Intl).
 */
-const EventCard = ({ event, cardVariant = "default", buttonVariant = "primary", buttonText, showVenue = true, showMap = true, mapSlot, allowMap = true, showCapacity = true, showImage = true, showCategory = true, showSummary = true, orientation = "vertical" }) => {
+const EventCard = ({ event, cardRole = "default", buttonVariant = "primary", buttonText, showVenue = true, showMap = true, mapSlot, allowMap = true, showCapacity = true, showImage = true, showCategory = true, showSummary = true, orientation = "vertical" }) => {
 	const timeZone = event.timeZone ?? null;
 	const formattedDate = formatDate(event.startsAt, { timeZone });
 	const formattedTime = `${formatTime(event.startsAt, { timeZone })} - ${formatTime(event.endsAt, { timeZone })}`;
 	const cta = resolveEventCta(event, buttonText);
-	const isSoldOut = cta.hidden;
-	const { available: spotsLeft } = getEventAvailability(event);
-	const cardClass = `card-${normalizeCardVariantRole(cardVariant) ?? "default"}`;
+	const { available: spotsLeft, isFull: isSoldOut } = getEventAvailability(event);
+	const cardClass = boxStyleClassNames({ role: cardRole }, { baseClass: "event-card" });
 	const buttonClass = themeButtonClassName({
 		variant: buttonVariant,
 		size: "md"
@@ -280,85 +469,141 @@ const EventCard = ({ event, cardVariant = "default", buttonVariant = "primary",
 		spotsLeft
 	}) : null;
 	return /* @__PURE__ */ jsxs("article", {
-		className: `${cardClass} group rb-flex rb-flex-col rb-h-full event-card ${eventCardOrientationClass(orientation)}`,
+		className: `${cardClass} group rb-flex rb-flex-col rb-h-full ${eventCardOrientationClass(orientation)}`,
 		"data-orientation": orientation,
-		children: [hasImage && /* @__PURE__ */ jsxs("div", {
-			className: "card-media event-card-media",
-			children: [
-				/* @__PURE__ */ jsx("div", {
-					className: "event-card-overlay",
-					"aria-hidden": "true"
-				}),
-				/* @__PURE__ */ jsx(MediaNodeServer, {
-					value: image,
-					className: "event-card-image",
-					size: ImagePresets.card
-				}),
-				categoryBadge && /* @__PURE__ */ jsx("span", {
-					className: "event-category-badge event-category-badge--overlay",
-					"data-category-id": category?.id,
-					style: categoryBadge.style,
-					children: categoryBadge.label
-				})
-			]
-		}), /* @__PURE__ */ jsxs("div", {
-			className: "card-content rb-flex rb-flex-1 rb-flex-col",
-			children: [
-				!hasImage && categoryBadge && /* @__PURE__ */ jsx("span", {
-					className: "event-category-badge",
-					"data-category-id": category?.id,
-					style: categoryBadge.style,
-					children: categoryBadge.label
-				}),
-				/* @__PURE__ */ jsx("h3", {
-					className: "card-title rb-mb-3",
-					children: title
-				}),
-				/* @__PURE__ */ jsx("div", {
-					className: "rb-mb-2 rb-caption",
-					children: /* @__PURE__ */ jsxs("div", {
-						className: "rb-flex rb-items-center rb-gap-2",
-						children: [/* @__PURE__ */ jsx(CalendarIcon$1, { className: "rb-shrink-0" }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("time", { children: formattedDate }), /* @__PURE__ */ jsx("p", {
-							className: "rb-pl-6",
-							children: formattedTime
-						})] })]
-					})
-				}),
-				showVenue && event.venue && /* @__PURE__ */ jsxs("div", {
-					className: "rb-mb-3",
-					children: [/* @__PURE__ */ jsxs("div", {
-						className: "rb-flex rb-items-center rb-gap-2 rb-caption",
-						children: [/* @__PURE__ */ jsx(MapPinIcon$1, { className: "rb-shrink-0" }), /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("strong", { children: event.venue.name }), event.venue.address ? ` · ${event.venue.address}` : null] })]
-					}), showMap && allowMap && event.venue.location && mapSlot && /* @__PURE__ */ jsx("div", {
-						className: "rb-mt-2",
-						children: mapSlot
-					})]
-				}),
-				teacherLine && /* @__PURE__ */ jsx("p", {
-					className: "rb-mb-3 rb-caption status-muted",
-					children: teacherLine
-				}),
-				showSummary && summary && /* @__PURE__ */ jsx("p", {
-					className: "card-body rb-mb-3 rb-line-clamp-2 rb-caption",
-					children: summary
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "event-card-footer rb-mt-auto rb-pt-4 rb-flex rb-flex-col rb-gap-3",
-					children: [capacityText && /* @__PURE__ */ jsx("p", {
-						className: "event-card-capacity rb-caption status-muted rb-text-center",
-						children: capacityText
-					}), !isSoldOut && /* @__PURE__ */ jsx("a", {
-						href: cta.href,
-						target: cta.external ? "_blank" : void 0,
-						rel: cta.external ? "noopener noreferrer" : void 0,
-						className: `${buttonClass} event-card-cta`,
-						children: cta.label
-					})]
-				})
-			]
+		children: [/* @__PURE__ */ jsx(EventCardMedia, {
+			categoryBadge,
+			categoryId: category?.id,
+			hasImage,
+			image
+		}), /* @__PURE__ */ jsx(EventCardContent, {
+			allowMap,
+			buttonClass,
+			capacityText,
+			categoryBadge,
+			categoryId: category?.id,
+			cta,
+			event,
+			formattedDate,
+			formattedTime,
+			hasImage,
+			mapSlot,
+			showMap,
+			showSummary,
+			showVenue,
+			summary,
+			teacherLine,
+			title
 		})]
 	});
 };
+function EventCardMedia(props) {
+	if (!props.hasImage || !props.image) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "card-media event-card-media",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "event-card-overlay",
+				"aria-hidden": "true"
+			}),
+			/* @__PURE__ */ jsx(MediaNodeServer, {
+				value: props.image,
+				className: "event-card-image",
+				size: ImagePresets.card
+			}),
+			props.categoryBadge && /* @__PURE__ */ jsx("span", {
+				className: "event-category-badge event-category-badge--overlay",
+				"data-category-id": props.categoryId,
+				style: props.categoryBadge.style,
+				children: props.categoryBadge.label
+			})
+		]
+	});
+}
+function EventCardContent(props) {
+	const { event } = props;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "card-content rb-flex rb-flex-1 rb-flex-col",
+		children: [
+			!props.hasImage && props.categoryBadge && /* @__PURE__ */ jsx("span", {
+				className: "event-category-badge",
+				"data-category-id": props.categoryId,
+				style: props.categoryBadge.style,
+				children: props.categoryBadge.label
+			}),
+			/* @__PURE__ */ jsx("h3", {
+				className: "card-title rb-mb-3",
+				children: props.title
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "rb-mb-2 rb-caption",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "rb-flex rb-items-center rb-gap-2",
+					children: [/* @__PURE__ */ jsx(CalendarIcon$1, { className: "rb-shrink-0" }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("time", { children: props.formattedDate }), /* @__PURE__ */ jsx("p", {
+						className: "rb-pl-6",
+						children: props.formattedTime
+					})] })]
+				})
+			}),
+			/* @__PURE__ */ jsx(EventCardVenue, {
+				event,
+				showVenue: props.showVenue,
+				showMap: props.showMap,
+				allowMap: props.allowMap,
+				mapSlot: props.mapSlot
+			}),
+			props.teacherLine && /* @__PURE__ */ jsx("p", {
+				className: "rb-mb-3 rb-caption status-muted",
+				children: props.teacherLine
+			}),
+			props.showSummary && props.summary && /* @__PURE__ */ jsx("p", {
+				className: "card-body rb-mb-3 rb-line-clamp-2 rb-caption",
+				children: props.summary
+			}),
+			/* @__PURE__ */ jsx(EventCardFooter, {
+				buttonClass: props.buttonClass,
+				capacityText: props.capacityText,
+				cta: props.cta
+			})
+		]
+	});
+}
+function EventCardVenue(props) {
+	const venue = props.showVenue ? props.event.venue : null;
+	if (!venue) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "rb-mb-3",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "rb-flex rb-items-center rb-gap-2 rb-caption",
+			children: [/* @__PURE__ */ jsx(MapPinIcon$1, { className: "rb-shrink-0" }), /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("strong", { children: venue.name }), venue.address ? ` · ${venue.address}` : null] })]
+		}), props.showMap && props.allowMap && venue.location && props.mapSlot && /* @__PURE__ */ jsx("div", {
+			className: "rb-mt-2",
+			children: props.mapSlot
+		})]
+	});
+}
+function EventCardFooter(props) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "event-card-footer rb-mt-auto rb-pt-4 rb-flex rb-flex-col rb-gap-3",
+		children: [
+			props.capacityText && /* @__PURE__ */ jsx("p", {
+				className: "event-card-capacity rb-caption status-muted rb-text-center",
+				children: props.capacityText
+			}),
+			props.cta.hidden && props.capacityText !== props.cta.label && /* @__PURE__ */ jsx("p", {
+				className: "event-card-status rb-caption status-muted rb-text-center",
+				children: props.cta.label
+			}),
+			!props.cta.hidden && /* @__PURE__ */ jsx("a", {
+				href: props.cta.href,
+				target: props.cta.external ? "_blank" : void 0,
+				rel: props.cta.external ? "noopener noreferrer" : void 0,
+				className: `${props.buttonClass} event-card-cta`,
+				children: props.cta.label
+			})
+		]
+	});
+}
 function eventCardOrientationClass(orientation) {
 	switch (orientation) {
 		case "horizontal": return "event-card--horizontal";
@@ -885,7 +1130,7 @@ const EventPaginatedListView = ({ filters, display, events, loading, error, hasM
 			buttonText: display.buttonText
 		}, event.occurrenceId || event.id) : /* @__PURE__ */ jsx(EventCardClient, {
 			event,
-			cardVariant: display.cardVariant,
+			cardRole: display.cardRole,
 			buttonVariant: display.buttonVariant,
 			buttonText: display.buttonText,
 			showVenue: display.showVenue,

package/dist/client/{usePolling-BGG_8-jl.mjs → usePolling-M5jG675x.mjs}

@@ -1,6 +1,6 @@
 "use client";
-import { bt as assertNever$2 } from "./propsDecoder-CAZdhwjs.mjs";
-import { r as formatPrice } from "./StepIndicator-BfbdiVQI.mjs";
+import { St as assertNever$2 } from "./propsDecoder-BxmqPKdP.mjs";
+import { r as formatPrice } from "./StepIndicator-CGixP_LW.mjs";
 import { useCallback, useEffect, useReducer, useRef } from "react";
 //#region ../core/src/date-math.ts
 function addDaysToDate(date, dayCount) {
@@ -572,4 +572,4 @@ function usePolling(config) {
 	};
 }
 //#endregion
-export { buildBookingPaymentSelectionViewModel as n, usePolling as t };
+export { buildBookingPaymentSelectionViewModel as n, resolveFlexibleBalanceInitialPaymentCents as r, usePolling as t };