@riverbankcms/sdk 0.143.0 → 0.145.0

package/dist/client/bookings.mjs

@@ -2382,6 +2382,27 @@ function AltchaWidget({ challengeUrl, onSolutionChange, auto = true, hidelogo =
 function isSpamProtectionEnabled() {
 	return process.env.NEXT_PUBLIC_SPAM_PROTECTION_ENABLED === "true";
 }
+z.discriminatedUnion("kind", [z.object({ kind: z.literal("published") }).strict(), z.object({
+	kind: z.literal("preview"),
+	token: z.string().min(1)
+}).strict()]);
+function createHostedBlockApiConfig(input) {
+	const { baseUrl, siteId, readAuthority, portalToken } = input;
+	return {
+		baseUrl,
+		siteId,
+		readAuthority,
+		auth: readAuthority.kind === "preview" ? {
+			type: "bearer",
+			token: readAuthority.token
+		} : { type: "none" },
+		isPreview: readAuthority.kind === "preview",
+		authOverrides: { portal: portalToken ? {
+			type: "bearer",
+			token: portalToken
+		} : { type: "none" } }
+	};
+}
 //#endregion
 //#region ../blocks/src/system/runtime/api/deduplication.ts
 /**
@@ -2765,7 +2786,7 @@ function parseEventPageSurfaceDestinationMode(value) {
 	return value === "cms-managed" || value === "system-managed" ? value : void 0;
 }
 function parseEventPageSurfaceSubject(value) {
-	if (!isRecord$6(value)) return err$1({ kind: "notObject" });
+	if (!isRecord$7(value)) return err$1({ kind: "notObject" });
 	switch (value.kind) {
 		case "eventSeries": {
 			const eventSeriesId = parseEventSeriesId(value.eventSeriesId);
@@ -2820,7 +2841,7 @@ function parseEventSeriesIdList(values) {
 	}
 	return ok$1(parsed);
 }
-function isRecord$6(value) {
+function isRecord$7(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 //#endregion
@@ -3101,6 +3122,46 @@ function addLocalScheduleDays(date, days) {
 		day: utcDate.getUTCDate()
 	};
 }
+//#endregion
+//#region ../core/src/appointment-service-categories.ts
+/**
+* Groups services under their categories.
+*
+* A service whose `categoryId` names no category in `categories` lands in
+* Other. The composite foreign key keeps that from happening with stored data,
+* so this is only the total, safe answer for a caller holding a stale list.
+*/
+function layoutServicesByCategory(categories, services, options) {
+	if (categories.length === 0) return {
+		kind: "uncategorized-site",
+		services: [...services]
+	};
+	const buckets = new Map(categories.map((category) => [category.id, []]));
+	const other = [];
+	for (const service of services) {
+		const bucket = service.categoryId === null ? void 0 : buckets.get(service.categoryId);
+		if (bucket !== void 0) bucket.push(service);
+		else other.push(service);
+	}
+	const groups = [];
+	for (const category of categories) {
+		const groupServices = buckets.get(category.id) ?? [];
+		if (groupServices.length === 0 && !options.keepEmptyGroups) continue;
+		groups.push({
+			category,
+			services: groupServices
+		});
+	}
+	if (groups.length === 0 && !options.keepEmptyGroups) return {
+		kind: "uncategorized-site",
+		services: other
+	};
+	return {
+		kind: "categorized-site",
+		groups,
+		other
+	};
+}
 function sessionStartMs(session) {
 	return Date.parse(session.startsAt);
 }
@@ -3923,13 +3984,6 @@ function themeButtonVariantClassNames(variant) {
 function themeButtonSizeClassName(size) {
 	return `btn-${size}`;
 }
-function themeButtonClassName(spec) {
-	return [
-		...themeButtonVariantClassNames(spec.variant),
-		themeButtonSizeClassName(spec.size),
-		spec.extraClassName
-	].filter(Boolean).join(" ");
-}
 shadeBackgroundEffect({
 	id: "darken-background",
 	name: "Darken on Hover",
@@ -6763,16 +6817,18 @@ const themeV2RuntimeStyleFieldNames = [
 	"_frameStyles",
 	"_sectionStyles",
 	"_containerStyles",
-	"_cardStyles",
-	"_transitionStyles",
-	"styleGroup"
+	"_cardStyles"
 ];
 const themeV2BlockSpecificRawStyleFieldNames = [
 	"_contentCardStyles",
 	"_heroLayoutStyles",
 	"_textCardStyles"
 ];
-const themeV2NormalEditorRawStyleFieldNames = [...themeV2RuntimeStyleFieldNames, ...themeV2BlockSpecificRawStyleFieldNames];
+const themeV2NormalEditorRawStyleFieldNames = [
+	...themeV2RuntimeStyleFieldNames,
+	...themeV2BlockSpecificRawStyleFieldNames,
+	"styleGroup"
+];
 new Set(themeV2NormalEditorRawStyleFieldNames);
 [...themeV2RuntimeStyleFieldNames, ...themeV2BlockSpecificRawStyleFieldNames];
 const pageDesignEditorBackgroundOverrideOwner = "page-design-editor";
@@ -6961,7 +7017,7 @@ const boxBackgroundSchema = z.discriminatedUnion("type", [
 	})
 ]);
 function normalizeAuthoringOpacity(value) {
-	if (!isRecord$5(value)) return value;
+	if (!isRecord$6(value)) return value;
 	return {
 		...value,
 		opacity: normalizeOpacity(value.opacity)
@@ -6970,7 +7026,7 @@ function normalizeAuthoringOpacity(value) {
 function normalizeOpacity(value) {
 	return typeof value === "number" && value > 1 && value <= 100 ? value / 100 : value;
 }
-function isRecord$5(value) {
+function isRecord$6(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 //#endregion
@@ -8335,15 +8391,18 @@ const BOOKINGS = {
 const EVENTS = {
 	calendarWindow: {
 		path: "/public/sites/{siteId}/events/calendar-window",
-		method: "GET"
+		method: "GET",
+		previewRead: true
 	},
 	list: {
 		path: "/public/sites/{siteId}/events",
-		method: "GET"
+		method: "GET",
+		previewRead: true
 	},
 	filters: {
 		path: "/public/sites/{siteId}/events/filters",
-		method: "GET"
+		method: "GET",
+		previewRead: true
 	},
 	register: {
 		path: "/public/sites/{siteId}/events/register",
@@ -8381,7 +8440,8 @@ const WHOLE_SERIES = { waitlistClaimResolve: {
 const SHOP = {
 	listProducts: {
 		path: "/public/sites/{siteId}/products",
-		method: "GET"
+		method: "GET",
+		previewRead: true
 	},
 	checkout: {
 		path: "/public/sites/{siteId}/bookings/checkout",
@@ -8648,7 +8708,7 @@ var BlockApiError = class extends Error {
 		this.name = "BlockApiError";
 	}
 };
-function isRecord$4(value) {
+function isRecord$5(value) {
 	return typeof value === "object" && value !== null;
 }
 function isJsonResponseContentType(contentType) {
@@ -8672,15 +8732,15 @@ async function parseJsonBody(response) {
 	}
 }
 function isFieldError(value) {
-	return isRecord$4(value) && !Array.isArray(value) && typeof value.field === "string" && typeof value.code === "string" && typeof value.message === "string";
+	return isRecord$5(value) && !Array.isArray(value) && typeof value.field === "string" && typeof value.code === "string" && typeof value.message === "string";
 }
 function fieldErrorsFromUnknown(value) {
 	if (!Array.isArray(value)) return void 0;
 	return value.every(isFieldError) ? value : void 0;
 }
 function getBlockApiErrorDetails(data) {
-	if (!isRecord$4(data)) return {};
-	const nestedError = isRecord$4(data.error) ? data.error : void 0;
+	if (!isRecord$5(data)) return {};
+	const nestedError = isRecord$5(data.error) ? data.error : void 0;
 	const message = typeof nestedError?.message === "string" ? nestedError.message : typeof data.message === "string" ? data.message : void 0;
 	const code = typeof nestedError?.code === "string" ? nestedError.code : typeof data.code === "string" ? data.code : void 0;
 	const fieldErrors = fieldErrorsFromUnknown(nestedError?.fieldErrors) ?? fieldErrorsFromUnknown(data.fieldErrors);
@@ -8775,7 +8835,11 @@ function publicEventsQuery(params) {
 	return { ...params ?? {} };
 }
 function createBlockApi(config) {
-	const { baseUrl, auth, authOverrides, siteId, isPreview } = config;
+	const { baseUrl, authOverrides, siteId, isPreview, readAuthority } = config;
+	const auth = readAuthority ? readAuthority.kind === "preview" ? {
+		type: "bearer",
+		token: readAuthority.token
+	} : { type: "none" } : config.auth;
 	const dedup = createDeduplicationCache({ ttl: 100 });
 	const shouldUsePreviewStageForNonPortalRequests = isPreview && auth.type !== "none";
 	function isPortalEndpoint(endpoint) {
@@ -8783,17 +8847,25 @@ function createBlockApi(config) {
 	}
 	function selectAuth(endpoint) {
 		if (endpoint.authScope === "portal" && authOverrides?.portal) return authOverrides.portal;
+		if (readAuthority && !endpoint.previewRead) return { type: "none" };
 		return auth;
 	}
 	/**
 	* Make an API request
 	*/
+	function bindReadQuery(endpoint, query) {
+		const queryParams = { ...query };
+		if (readAuthority) {
+			if (!endpoint.previewRead) delete queryParams.stage;
+			else if (readAuthority.kind === "preview" || queryParams.stage != null) queryParams.stage = readAuthority.kind;
+		} else if (shouldUsePreviewStageForNonPortalRequests && !isPortalEndpoint(endpoint) && queryParams.stage == null) queryParams.stage = "preview";
+		return queryParams;
+	}
 	async function request(endpoint, options) {
 		const { path, body, query, skipDedup = false } = options ?? {};
 		let url = `${baseUrl}${path ?? endpoint.path}`;
 		const selectedAuth = selectAuth(endpoint);
-		const queryParams = { ...query };
-		if (shouldUsePreviewStageForNonPortalRequests && !isPortalEndpoint(endpoint) && (queryParams.stage === void 0 || queryParams.stage === null)) queryParams.stage = "preview";
+		const queryParams = bindReadQuery(endpoint, query);
 		if (Object.keys(queryParams).length > 0) url = appendQuery(url, queryParams);
 		const headers = {
 			Accept: "application/json",
@@ -9639,12 +9711,12 @@ function resolveBookingSiteId(siteId, form) {
 	return siteId || form?.siteId || "";
 }
 function normalizeBookingFormConfig(form) {
-	if (!isRecord$3(form)) return null;
+	if (!isRecord$4(form)) return null;
 	const id = readNonEmptyString(form.id);
 	const name = readNonEmptyString(form.name);
 	if (!id || !name) return null;
-	const schemaSource = isRecord$3(form.schema) ? form.schema : isRecord$3(form.schemaJson) ? form.schemaJson : null;
-	const settingsSource = isRecord$3(form.settings) ? form.settings : isRecord$3(form.settingsJson) ? form.settingsJson : null;
+	const schemaSource = isRecord$4(form.schema) ? form.schema : isRecord$4(form.schemaJson) ? form.schemaJson : null;
+	const settingsSource = isRecord$4(form.settings) ? form.settings : isRecord$4(form.settingsJson) ? form.settingsJson : null;
 	return {
 		id,
 		name,
@@ -9664,8 +9736,8 @@ function normalizeBookingServices(services) {
 	};
 	if (!services) return [];
 	if (Array.isArray(services)) return services.filter(isBookingFormService).map(normalizeService);
-	if (isRecord$3(services) && "services" in services) return Array.isArray(services.services) ? services.services.filter(isBookingFormService).map(normalizeService) : [];
-	return isRecord$3(services) ? Object.values(services).filter(isBookingFormService).map(normalizeService) : [];
+	if (isRecord$4(services) && "services" in services) return Array.isArray(services.services) ? services.services.filter(isBookingFormService).map(normalizeService) : [];
+	return isRecord$4(services) ? Object.values(services).filter(isBookingFormService).map(normalizeService) : [];
 }
 function normalizeBookingSchema(value) {
 	if (!value) return void 0;
@@ -9676,7 +9748,7 @@ function normalizeBookingSchema(value) {
 	};
 }
 function readBookingFormField(value) {
-	if (!isRecord$3(value)) return null;
+	if (!isRecord$4(value)) return null;
 	const id = readNonEmptyString(value.id);
 	const label = readNonEmptyString(value.label);
 	const type = readBookingFieldType(value.type);
@@ -9719,7 +9791,7 @@ function readBookingFieldOptions(value) {
 	return options.length > 0 ? options : void 0;
 }
 function readBookingFieldOption(value) {
-	if (!isRecord$3(value)) return null;
+	if (!isRecord$4(value)) return null;
 	const optionValue = readNonEmptyString(value.value);
 	const label = readNonEmptyString(value.label);
 	return optionValue && label ? {
@@ -9739,7 +9811,7 @@ function normalizeBookingSettings(value) {
 	};
 }
 function isBookingFormService(value) {
-	return isRecord$3(value) && typeof value.id === "string" && typeof value.siteId === "string" && typeof value.title === "string" && (value.consent === void 0 || blockBookingConsentSchema.safeParse(value.consent).success);
+	return isRecord$4(value) && typeof value.id === "string" && typeof value.siteId === "string" && typeof value.title === "string" && (value.consent === void 0 || blockBookingConsentSchema.safeParse(value.consent).success);
 }
 function collectBookingCustomFields(data) {
 	const customFields = {};
@@ -9789,7 +9861,7 @@ function readStringArray(value) {
 	const strings = value.filter((item) => typeof item === "string");
 	return strings.length > 0 ? strings : void 0;
 }
-function isRecord$3(value) {
+function isRecord$4(value) {
 	return typeof value === "object" && value !== null;
 }
 function getBookingServicePaymentSelectionMode(service) {
@@ -11048,6 +11120,38 @@ function formatScheduleDate(isoString, locale) {
 	return new Intl.DateTimeFormat(locale, { dateStyle: "medium" }).format(date);
 }
 //#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.service-categories.ts
+function isRecord$3(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function readCategory(value) {
+	if (!isRecord$3(value)) return [];
+	const { id, name, description } = value;
+	if (typeof id !== "string" || id.trim() === "" || typeof name !== "string") return [];
+	return [{
+		id,
+		name,
+		description: typeof description === "string" ? description : null
+	}];
+}
+/**
+* The ordered service categories carried by a catalogue-shaped services
+* source (`{ services, categories }`). Every other shape has none, which
+* reads as a site without categories. Order is preserved: the database owns
+* it.
+*/
+function normalizeBookingServiceCategories(services) {
+	if (!isRecord$3(services) || !Array.isArray(services.categories)) return [];
+	return services.categories.flatMap(readCategory);
+}
+/**
+* The ordered service categories a headless booking override was given in
+* its loader data (`data.services`).
+*/
+function readOverrideServiceCategories(data) {
+	return isRecord$3(data) ? normalizeBookingServiceCategories(data.services) : [];
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/booking-form.validationErrors.ts
 function omitRecordKey(record, key) {
 	if (!(key in record)) return record;
@@ -11657,6 +11761,7 @@ function getAppointmentBookingOverrideInput(props) {
 			formId,
 			form,
 			services,
+			serviceCategories: readOverrideServiceCategories(props.data),
 			initialServiceId: defaultServiceId,
 			initialResourceId: toOptionalAppointmentResourceId(content.resourceId ?? form.settings?.resourceId),
 			requiresServiceSelection: Boolean(content.requiresServiceSelection),
@@ -12370,6 +12475,7 @@ function useHeadlessBookingFlow(options) {
 		data,
 		services: {
 			items: options.services,
+			categories: readServiceCategories(options),
 			selected: selectedService,
 			defaultServiceId,
 			requiresSelection: Boolean(options.requiresServiceSelection)
@@ -12434,6 +12540,10 @@ function useHeadlessBookingFlow(options) {
 		actions
 	};
 }
+const EMPTY_SERVICE_CATEGORIES = [];
+function readServiceCategories(options) {
+	return options.serviceCategories ?? EMPTY_SERVICE_CATEGORIES;
+}
 function navigateToCheckout(checkoutUrl) {
 	window.location.href = checkoutUrl;
 }
@@ -12713,6 +12823,114 @@ function useAppointmentCheckoutVerificationWithDeps(config, deps) {
 	};
 }
 //#endregion
+//#region ../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
+function r(e) {
+	var t, f, n = "";
+	if ("string" == typeof e || "number" == typeof e) n += e;
+	else if ("object" == typeof e) if (Array.isArray(e)) {
+		var o = e.length;
+		for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+	} else for (f in e) e[f] && (n && (n += " "), n += f);
+	return n;
+}
+function clsx() {
+	for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+	return n;
+}
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/spinner.tsx
+function resolveColorStyle(color) {
+	switch (color) {
+		case void 0: return;
+		case "inherit": return { color: "inherit" };
+		case "foreground": return { color: "rgb(var(--tb-foreground))" };
+		case "text": return { color: "rgb(var(--tb-text))" };
+		default: return;
+	}
+}
+function SpinnerNode({ className, size = "md", color, strokeWidth = 3, srLabel, style, ...rest }) {
+	const hasExplicitAriaLabel = typeof rest["aria-label"] === "string" && rest["aria-label"].trim().length > 0;
+	const accessibilityProps = srLabel ? {
+		role: "status",
+		"aria-live": "polite"
+	} : hasExplicitAriaLabel ? {} : { "aria-hidden": true };
+	const trackStroke = color === "inherit" ? "currentColor" : "var(--rb-spinner-track-color)";
+	const trackOpacity = color === "inherit" ? .25 : 1;
+	return /* @__PURE__ */ jsxs("span", {
+		...accessibilityProps,
+		className: clsx("rb-spinner", size ? `rb-spinner--${size}` : null, color === "inherit" ? "rb-spinner--inherit" : null, className),
+		style: {
+			...resolveColorStyle(color),
+			...style ?? {}
+		},
+		...rest,
+		children: [/* @__PURE__ */ jsxs("svg", {
+			viewBox: "0 0 24 24",
+			fill: "none",
+			"aria-hidden": "true",
+			children: [/* @__PURE__ */ jsx("circle", {
+				cx: "12",
+				cy: "12",
+				r: "10",
+				stroke: trackStroke,
+				strokeWidth,
+				opacity: trackOpacity
+			}), /* @__PURE__ */ jsx("path", {
+				d: "M12 2a10 10 0 0 1 10 10",
+				stroke: "currentColor",
+				strokeWidth,
+				strokeLinecap: "round"
+			})]
+		}), srLabel ? /* @__PURE__ */ jsx("span", {
+			className: "rb-sr-only",
+			children: srLabel
+		}) : null]
+	});
+}
+//#endregion
+//#region ../blocks/src/system/runtime/shared/components/ThemedButton.tsx
+function themedButtonClasses(variant, size, extraClassName) {
+	return [
+		...themeButtonVariantClassNames(variant),
+		themeButtonSizeClassName(size),
+		extraClassName
+	].filter(Boolean).join(" ");
+}
+function ThemedButtonLabel(props) {
+	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+		props.pending ? /* @__PURE__ */ jsx(SpinnerNode, {
+			size: props.pending.spinnerSize ?? "sm",
+			color: "inherit",
+			className: props.pending.spinnerClassName ?? "rb-mr-2",
+			srLabel: props.pending.srLabel
+		}) : null,
+		props.labelClassName ? /* @__PURE__ */ jsx("span", {
+			className: props.labelClassName,
+			children: props.pending?.label ?? props.label
+		}) : props.pending?.label ?? props.label,
+		props.screenReaderSuffix ? /* @__PURE__ */ jsx("span", {
+			className: "rb-sr-only",
+			children: props.screenReaderSuffix
+		}) : null
+	] });
+	return props.pending?.contentClassName ? /* @__PURE__ */ jsx("span", {
+		className: props.pending.contentClassName,
+		children: content
+	}) : content;
+}
+function ThemedButton({ variant, size, extraClassName, screenReaderSuffix, labelClassName, pending, label, ...buttonProps }) {
+	return /* @__PURE__ */ jsx("button", {
+		...buttonProps,
+		className: themedButtonClasses(variant, size, extraClassName),
+		children: /* @__PURE__ */ jsx(ThemedButtonLabel, {
+			label,
+			pending,
+			screenReaderSuffix,
+			labelClassName
+		})
+	});
+}
+//#endregion
 //#region ../blocks/src/system/runtime/shared/components/FeedbackMessage.tsx
 function joinClasses(...parts) {
 	return parts.filter((part) => typeof part === "string" && part.length > 0).join(" ");
@@ -12925,71 +13143,6 @@ const TimeSlotSelector = ({ value, onChange, slots, isLoading, timezone, require
 	});
 };
 //#endregion
-//#region ../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
-function r(e) {
-	var t, f, n = "";
-	if ("string" == typeof e || "number" == typeof e) n += e;
-	else if ("object" == typeof e) if (Array.isArray(e)) {
-		var o = e.length;
-		for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
-	} else for (f in e) e[f] && (n && (n += " "), n += f);
-	return n;
-}
-function clsx() {
-	for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
-	return n;
-}
-//#endregion
-//#region ../blocks/src/system/runtime/nodes/spinner.tsx
-function resolveColorStyle(color) {
-	switch (color) {
-		case void 0: return;
-		case "inherit": return { color: "inherit" };
-		case "foreground": return { color: "rgb(var(--tb-foreground))" };
-		case "text": return { color: "rgb(var(--tb-text))" };
-		default: return;
-	}
-}
-function SpinnerNode({ className, size = "md", color, strokeWidth = 3, srLabel, style, ...rest }) {
-	const hasExplicitAriaLabel = typeof rest["aria-label"] === "string" && rest["aria-label"].trim().length > 0;
-	const accessibilityProps = srLabel ? {
-		role: "status",
-		"aria-live": "polite"
-	} : hasExplicitAriaLabel ? {} : { "aria-hidden": true };
-	const trackStroke = color === "inherit" ? "currentColor" : "var(--rb-spinner-track-color)";
-	const trackOpacity = color === "inherit" ? .25 : 1;
-	return /* @__PURE__ */ jsxs("span", {
-		...accessibilityProps,
-		className: clsx("rb-spinner", size ? `rb-spinner--${size}` : null, color === "inherit" ? "rb-spinner--inherit" : null, className),
-		style: {
-			...resolveColorStyle(color),
-			...style ?? {}
-		},
-		...rest,
-		children: [/* @__PURE__ */ jsxs("svg", {
-			viewBox: "0 0 24 24",
-			fill: "none",
-			"aria-hidden": "true",
-			children: [/* @__PURE__ */ jsx("circle", {
-				cx: "12",
-				cy: "12",
-				r: "10",
-				stroke: trackStroke,
-				strokeWidth,
-				opacity: trackOpacity
-			}), /* @__PURE__ */ jsx("path", {
-				d: "M12 2a10 10 0 0 1 10 10",
-				stroke: "currentColor",
-				strokeWidth,
-				strokeLinecap: "round"
-			})]
-		}), srLabel ? /* @__PURE__ */ jsx("span", {
-			className: "rb-sr-only",
-			children: srLabel
-		}) : null]
-	});
-}
-//#endregion
 //#region ../blocks/src/system/runtime/shared/components/StepIndicator.tsx
 /**
 * Shared step indicator component for registration wizards.
@@ -13074,14 +13227,8 @@ const themeFormClasses = {
 	label: "form-label",
 	row: "rb-flex rb-flex-col rb-gap-2 rb-sm-flex-row",
 	input: "form-input",
-	apply: themeButtonClassName({
-		variant: "secondary",
-		size: "sm"
-	}),
-	remove: themeButtonClassName({
-		variant: "secondary",
-		size: "sm"
-	}),
+	apply: "",
+	remove: "",
 	hint: "rb-caption status-muted",
 	feedback: "rb-caption"
 };
@@ -13089,6 +13236,22 @@ function getDiscountCodeDisclosureClasses(surface) {
 	if (surface === "theme-form") return themeFormClasses;
 	return BLOCK_DISCOUNT_CODE_DISCLOSURE_CLASSES[surface];
 }
+function DiscountActionButton(props) {
+	return props.surface === "theme-form" ? /* @__PURE__ */ jsx(ThemedButton, {
+		type: "button",
+		variant: "secondary",
+		size: "sm",
+		label: props.label,
+		onClick: props.onClick,
+		disabled: props.disabled
+	}) : /* @__PURE__ */ jsx("button", {
+		type: "button",
+		className: props.className,
+		onClick: props.onClick,
+		disabled: props.disabled,
+		children: props.label
+	});
+}
 function DiscountCodeDisclosure({ surface, isOpen, code, onOpen, onChange, onRemove, onApply, id, toggleLabel = "Have a discount code?", label = "Discount code", placeholder = "Enter code", applyLabel = "Apply", removeLabel = "Remove", hint = "Applied at checkout.", feedback = null, isApplying = false, applyDisabled = false, disabled = false }) {
 	const generatedId = useId();
 	const inputId = id ?? `discount-code-${generatedId}`;
@@ -13130,19 +13293,19 @@ function DiscountCodeDisclosure({ surface, isOpen, code, onOpen, onChange, onRem
 							autoComplete: "off",
 							disabled: disabled || isApplying
 						}),
-						onApply ? /* @__PURE__ */ jsx("button", {
-							type: "button",
+						onApply ? /* @__PURE__ */ jsx(DiscountActionButton, {
+							surface,
 							className: classes.apply,
+							label: isApplying ? "Applying..." : applyLabel,
 							onClick: onApply,
-							disabled: disabled || isApplying || applyDisabled,
-							children: isApplying ? "Applying..." : applyLabel
+							disabled: disabled || isApplying || applyDisabled
 						}) : null,
-						/* @__PURE__ */ jsx("button", {
-							type: "button",
+						/* @__PURE__ */ jsx(DiscountActionButton, {
+							surface,
 							className: classes.remove,
+							label: removeLabel,
 							onClick: onRemove,
-							disabled: disabled || isApplying,
-							children: removeLabel
+							disabled: disabled || isApplying
 						})
 					]
 				}),
@@ -13943,10 +14106,97 @@ function BookingConsentAgreement({ agreement, showTitle = true, title, titleId }
 	})] });
 }
 //#endregion
-//#region ../blocks/src/system/runtime/nodes/booking-form.default-ui.tsx
+//#region ../blocks/src/system/runtime/nodes/booking-form.service-choices.tsx
 function optionCardClassName(isSelected) {
 	return `rb-option-card${isSelected ? " rb-option-card--selected" : ""}`;
 }
+function SelectedCheck() {
+	return /* @__PURE__ */ jsx("div", {
+		className: "rb-option-check",
+		children: /* @__PURE__ */ jsx(CheckIcon, {})
+	});
+}
+/**
+* The service buttons. A site with no categories keeps its single grid; a
+* categorised site gets a heading per category, then "Other", above the same
+* grid (issue 1403). Empty categories are skipped, and there are no intros
+* here, to keep the step compact.
+*/
+function DefaultServiceChoices({ booking }) {
+	const layout = layoutServicesByCategory(booking.services.categories, booking.services.items.map((service) => ({
+		service,
+		categoryId: service.categoryId ?? null
+	})), { keepEmptyGroups: false });
+	switch (layout.kind) {
+		case "uncategorized-site": return /* @__PURE__ */ jsxs("div", {
+			className: "rb-reg-stack rb-reg-stack--sm",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "ab-subtitle",
+				children: "Service"
+			}), /* @__PURE__ */ jsx(ServiceChoiceGrid, {
+				booking,
+				choices: layout.services
+			})]
+		});
+		case "categorized-site": return /* @__PURE__ */ jsx("div", {
+			className: "rb-reg-stack",
+			children: [...layout.groups.map((group) => ({
+				key: group.category.id,
+				heading: group.category.name,
+				choices: group.services
+			})), ...layout.other.length > 0 ? [{
+				key: "other",
+				heading: "Other",
+				choices: layout.other
+			}] : []].map((group) => /* @__PURE__ */ jsxs("div", {
+				className: "rb-reg-stack rb-reg-stack--sm",
+				"data-booking-service-group": group.key,
+				children: [/* @__PURE__ */ jsx("h3", {
+					className: "ab-subtitle",
+					children: group.heading
+				}), /* @__PURE__ */ jsx(ServiceChoiceGrid, {
+					booking,
+					choices: group.choices
+				})]
+			}, group.key))
+		});
+		default: return assertNever(layout);
+	}
+}
+function ServiceChoiceGrid({ booking, choices }) {
+	const selectedServiceId = booking.services.selected?.id;
+	return /* @__PURE__ */ jsx("div", {
+		className: "rb-reg-grid",
+		children: choices.map(({ service }) => {
+			const isSelected = selectedServiceId === service.id;
+			return /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				onClick: () => booking.actions.selectService(service.id),
+				className: optionCardClassName(isSelected),
+				"aria-pressed": isSelected,
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "rb-flex-1",
+					children: [
+						/* @__PURE__ */ jsx("div", {
+							className: "ab-subtitle",
+							children: service.title
+						}),
+						service.description ? /* @__PURE__ */ jsx("div", {
+							className: "ab-text rb-on-surface--muted",
+							children: service.description
+						}) : null,
+						service.durationMinutes ? /* @__PURE__ */ jsxs("div", {
+							className: "ab-text rb-on-surface--muted",
+							children: [service.durationMinutes, " minutes"]
+						}) : null
+					]
+				}), isSelected ? /* @__PURE__ */ jsx(SelectedCheck, {}) : null]
+			}, service.id);
+		})
+	});
+}
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.default-ui.tsx
 function formatBookingAmount(amount, currency) {
 	return formatCurrencyAmount(amount, currency, { decimals: "auto" });
 }
@@ -13990,30 +14240,25 @@ function HeadlessBookingDefaultForm({ booking, onSubmit }) {
 			}),
 			/* @__PURE__ */ jsxs("div", {
 				className: "rb-wizard-actions",
-				children: [!isFirstStep ? /* @__PURE__ */ jsx("button", {
+				children: [!isFirstStep ? /* @__PURE__ */ jsx(ThemedButton, {
 					type: "button",
 					onClick: booking.actions.back,
-					className: themeButtonClassName({
-						variant: "outline",
-						size: "md"
-					}),
-					children: "Back"
-				}) : null, /* @__PURE__ */ jsx("button", {
+					variant: "outline",
+					size: "md",
+					label: "Back"
+				}) : null, /* @__PURE__ */ jsx(ThemedButton, {
 					type: "button",
 					onClick: () => {
 						handlePrimaryAction();
 					},
 					disabled: isSubmitting,
-					className: themeButtonClassName({
-						variant: "primary",
-						size: "md"
-					}),
-					children: isSubmitting ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SpinnerNode, {
-						size: "sm",
-						color: "inherit",
-						className: "rb-mr-2",
+					variant: "primary",
+					size: "md",
+					label: isLastStep ? "Complete" : "Continue",
+					pending: isSubmitting ? {
+						label: "Submitting...",
 						srLabel: "Submitting"
-					}), "Submitting..."] }) : isLastStep ? "Complete" : "Continue"
+					} : void 0
 				})]
 			}),
 			/* @__PURE__ */ jsx(DefaultBookingDiscount, { booking }),
@@ -14042,7 +14287,6 @@ function DefaultBookingStepContent({ booking, errorSummaryId }) {
 function DefaultServiceSelectionStep({ booking }) {
 	const services = booking.services.items;
 	const resources = booking.resources.items;
-	const selectedServiceId = booking.services.selected?.id;
 	const selectedResourceId = booking.resources.selectedResourceId;
 	const showServiceSelect = booking.services.requiresSelection || services.length > 1;
 	const showResourceSelect = booking.resources.requiresSelection || resources.length > 1;
@@ -14057,41 +14301,7 @@ function DefaultServiceSelectionStep({ booking }) {
 				className: "ab-text rb-on-surface--muted",
 				children: "Choose the service you'd like to book"
 			})] }),
-			showServiceSelect ? /* @__PURE__ */ jsxs("div", {
-				className: "rb-reg-stack rb-reg-stack--sm",
-				children: [/* @__PURE__ */ jsx("span", {
-					className: "ab-subtitle",
-					children: "Service"
-				}), /* @__PURE__ */ jsx("div", {
-					className: "rb-reg-grid",
-					children: services.map((service) => {
-						const isSelected = selectedServiceId === service.id;
-						return /* @__PURE__ */ jsxs("button", {
-							type: "button",
-							onClick: () => booking.actions.selectService(service.id),
-							className: optionCardClassName(isSelected),
-							"aria-pressed": isSelected,
-							children: [/* @__PURE__ */ jsxs("div", {
-								className: "rb-flex-1",
-								children: [
-									/* @__PURE__ */ jsx("div", {
-										className: "ab-subtitle",
-										children: service.title
-									}),
-									service.description ? /* @__PURE__ */ jsx("div", {
-										className: "ab-text rb-on-surface--muted",
-										children: service.description
-									}) : null,
-									service.durationMinutes ? /* @__PURE__ */ jsxs("div", {
-										className: "ab-text rb-on-surface--muted",
-										children: [service.durationMinutes, " minutes"]
-									}) : null
-								]
-							}), isSelected ? /* @__PURE__ */ jsx(SelectedCheck, {}) : null]
-						}, service.id);
-					})
-				})]
-			}) : null,
+			showServiceSelect ? /* @__PURE__ */ jsx(DefaultServiceChoices, { booking }) : null,
 			booking.resources.state.tag === "loading" ? /* @__PURE__ */ jsxs("div", {
 				className: "ab-center",
 				children: [/* @__PURE__ */ jsx(SpinnerNode, {
@@ -14641,14 +14851,12 @@ function DefaultBookingFeedback({ booking }) {
 		children: [/* @__PURE__ */ jsx("p", {
 			className: "ab-text",
 			children: booking.feedback.message
-		}), /* @__PURE__ */ jsx("button", {
+		}), /* @__PURE__ */ jsx(ThemedButton, {
 			type: "button",
-			className: themeButtonClassName({
-				variant: "secondary",
-				size: "sm"
-			}),
-			onClick: booking.actions.clearFeedback,
-			children: "Dismiss"
+			variant: "secondary",
+			size: "sm",
+			label: "Dismiss",
+			onClick: booking.actions.clearFeedback
 		})]
 	});
 }
@@ -14672,12 +14880,6 @@ function DefaultBookingErrorSummary({ errors, id }) {
 		children: [errors.formError ? /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx("strong", { children: errors.formError }) }) : null, Object.entries(errors.fieldErrors).map(([key, message]) => /* @__PURE__ */ jsx("p", { children: message }, key))]
 	});
 }
-function SelectedCheck() {
-	return /* @__PURE__ */ jsx("div", {
-		className: "rb-option-check",
-		children: /* @__PURE__ */ jsx(CheckIcon, {})
-	});
-}
 //#endregion
 //#region ../blocks/src/system/runtime/shared/utils/checkoutUrls.ts
 /**
@@ -14795,6 +14997,7 @@ const BookingFormClient$1 = ({ siteId: siteIdProp, render }) => {
 		formId: render.hydration.formId ?? form?.id ?? "booking-form",
 		form,
 		services,
+		serviceCategories: render.hydration.serviceCategories,
 		initialServiceId,
 		initialResourceId,
 		initialData: render.hydration.initialData ?? void 0,
@@ -16872,6 +17075,12 @@ function resolveEventRegistrationScopedEvents(events, context) {
 //#endregion
 //#region ../blocks/src/system/runtime/nodes/event-registration/event-registration.headless.override.ts
 function createEventRegistrationBlockApiConfig(input) {
+	if (input.readAuthority) return createHostedBlockApiConfig({
+		baseUrl: input.apiBaseUrl,
+		siteId: input.siteId,
+		readAuthority: input.readAuthority,
+		portalToken: input.portalToken
+	});
 	return {
 		baseUrl: input.apiBaseUrl,
 		auth: input.previewToken ? {
@@ -16908,6 +17117,7 @@ function getEventRegistrationOverrideInput(props) {
 			apiBaseUrl: props.apiBaseUrl,
 			portalToken: props.portalToken ?? null,
 			previewToken: props.previewToken ?? null,
+			readAuthority: props.readAuthority,
 			events,
 			...props.stage ? { stage: props.stage } : {},
 			...props.occurrenceContext ? { occurrenceContext: props.occurrenceContext } : {},