@riverbankcms/sdk 0.146.0 → 0.147.0

package/dist/client/{bookingForm-AMr-s5vw.mjs → bookingForm-BWxB46xD.mjs}

@@ -1,20 +1,20 @@
 "use client";
-import { C as unsafeAsPassId, b as unsafeAsCustomerPassId, v as unsafeAsAppointmentResourceId, x as unsafeAsFormId, y as unsafeAsAppointmentServiceId } from "./colorStyles-CuJBiS-1.mjs";
-import { i as buildBookingPaymentSelectionViewModel, n as StepIndicator, r as usePolling, t as BookingConsentAgreement } from "./BookingConsentAgreement-BQKL045f.mjs";
-import { At as resolveAppointmentCheckoutVerificationState, Ct as formatBookingSubmissionPreparationError, Dt as isBookingServiceSlidingAmountInRange, Et as getBookingSuccessMessage, Ft as projectSelectedAppointmentConsentIntoForm, Gt as okWith, Ht as clearWorkflowFeedback, It as resolveSelectedAppointmentConsent, Kt as reportWorkflowError, Lt as BOOKING_FORM_DATA_RESERVED_KEYS, Mt as resolveBookingSiteId, Nt as resolveDefaultBookingServiceId, Ot as parseBookingCurrencyInputToCents, Pt as toSelectedCollectionOptionKind, Rt as isBookingRequirementConsentFieldId, St as formatBookingCentsAsCurrencyInput, Tt as getBookingServiceSlidingScale, Ut as err, Vt as assertNever, Zt as addLocalScheduleDays, bt as logger, jt as resolveBookingPaymentStep, kt as prepareBookingSubmission, on as parseBookingLocalDate, qt as reportWorkflowSuccess, rn as formatLocalScheduleDate, sn as resolveBookingTimeZoneId, t as defineIslandPropsDecoder, tn as formatBookingInstant, wt as getBookingRedirectStateFromLocation, xt as deriveBookingFormViewState, yn as formatCurrencyAmount } from "./propsDecoder-Dcgsncxb.mjs";
-import { n as useBlockApi, t as BlockApiProvider } from "./context-Bc8T6pCe.mjs";
+import { C as unsafeAsPassId, b as unsafeAsCustomerPassId, v as unsafeAsAppointmentResourceId, x as unsafeAsFormId, y as unsafeAsAppointmentServiceId } from "./colorStyles-j5U9v5JA.mjs";
+import { a as buildBookingPaymentSelectionViewModel, i as usePolling, n as BookingConsentAgreement, r as StepIndicator, t as BookingMailingListNote } from "./BookingMailingListNote-1n4Ch_u_.mjs";
+import { At as resolveAppointmentCheckoutVerificationState, Ct as formatBookingSubmissionPreparationError, Dt as isBookingServiceSlidingAmountInRange, Et as getBookingSuccessMessage, Ft as projectSelectedAppointmentConsentIntoForm, Gt as okWith, Ht as clearWorkflowFeedback, It as resolveSelectedAppointmentConsent, Kt as reportWorkflowError, Lt as BOOKING_FORM_DATA_RESERVED_KEYS, Mt as resolveBookingSiteId, Nt as resolveDefaultBookingServiceId, Ot as parseBookingCurrencyInputToCents, Pt as toSelectedCollectionOptionKind, Qt as addLocalScheduleDays, Rt as isBookingRequirementConsentFieldId, St as formatBookingCentsAsCurrencyInput, Tt as getBookingServiceSlidingScale, Ut as err, Vt as assertNever, Zt as resolveBookingSignupOffer, bn as formatCurrencyAmount, bt as logger, cn as resolveBookingTimeZoneId, in as formatLocalScheduleDate, jt as resolveBookingPaymentStep, kt as prepareBookingSubmission, nn as formatBookingInstant, qt as reportWorkflowSuccess, sn as parseBookingLocalDate, t as defineIslandPropsDecoder, wt as getBookingRedirectStateFromLocation, xt as deriveBookingFormViewState } from "./propsDecoder-CwvvNOHx.mjs";
+import { n as useBlockApi, t as BlockApiProvider } from "./context-C8TinPJc.mjs";
 import { n as isSpamProtectionEnabled, r as AltchaWidget, t as getChallengeUrl } from "./src-B833rYRr.mjs";
-import { a as CheckIcon, i as StateIcon, n as useDiscountCodeUi, r as TerminalPanel, t as scrollToBlock } from "./scrollToBlock-BNgaEUpo.mjs";
-import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-CsOtjFY7.mjs";
-import { i as SpinnerNode, t as ThemedButton } from "./ThemedButton-CE5KYT6z.mjs";
+import { t as DiscountCodeDisclosure } from "./DiscountCodeDisclosure-CKJtz0mY.mjs";
+import { a as useDiscountCodeUi, i as CheckIcon, n as StateIcon, r as scrollToBlock, t as TerminalPanel } from "./TerminalPanel-B5ZUsYhe.mjs";
+import { i as SpinnerNode, t as ThemedButton } from "./ThemedButton-DoVIV1Ao.mjs";
 import { t as FeedbackMessage } from "./FeedbackMessage-CtLvvS_d.mjs";
-import { n as getFieldValidationControlProps, t as FieldValidationMessage } from "./FieldValidationMessage-AYanWFb-.mjs";
-import { t as buildCheckoutReturnUrls } from "./checkoutUrls-CW3-78uu.mjs";
-import { t as CheckboxChoice } from "./CheckboxChoice--W2n6yKs.mjs";
+import { i as getFieldValidationControlProps, r as FieldValidationMessage } from "./mailingListSignupCopy-DZSHZrm6.mjs";
+import { t as buildCheckoutReturnUrls } from "./checkoutUrls-BEfR7kVu.mjs";
+import { t as CheckboxChoice } from "./CheckboxChoice-B33MqoUo.mjs";
 import { t as mountReactIsland } from "./reactMount-SY8AVRof.mjs";
-import { t as buildRouteIslandApiConfig } from "./routeIslandApiConfig-CWLP7wu3.mjs";
+import { t as buildRouteIslandApiConfig } from "./routeIslandApiConfig-BwVFo0Y4.mjs";
 import React, { useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region ../core/src/appointment-service-categories.ts
 /**
 * Groups services under their categories.
@@ -55,30 +55,6 @@ function layoutServicesByCategory(categories, services, options) {
 	};
 }
 //#endregion
-//#region ../blocks/src/system/runtime/components/booking/SuccessMessage.tsx
-const SuccessMessage = ({ message, resourceName, className }) => {
-	return /* @__PURE__ */ jsx(TerminalPanel, {
-		tone: "success",
-		title: "Booking confirmed",
-		icon: /* @__PURE__ */ jsx(StateIcon, {
-			variant: "success",
-			children: /* @__PURE__ */ jsx(CheckIcon, { strokeWidth: 3 })
-		}),
-		body: /* @__PURE__ */ jsx("p", {
-			className: "ab-text",
-			children: message
-		}),
-		secondaryBody: resourceName ? /* @__PURE__ */ jsxs("p", {
-			className: "ab-text rb-on-surface--muted",
-			children: ["Practitioner: ", resourceName]
-		}) : null,
-		className: ["ab-center", className ?? ""].join(" ").trim(),
-		titleClassName: "ab-terminal-title",
-		role: "alert",
-		live: "polite"
-	});
-};
-//#endregion
 //#region ../blocks/src/system/runtime/hooks/useSelectedAppointmentConsentForm.ts
 function useSelectedAppointmentConsentForm(form, selectedService) {
 	return useMemo(() => projectSelectedAppointmentConsentIntoForm(form, resolveSelectedAppointmentConsent(selectedService)), [form, selectedService]);
@@ -643,6 +619,7 @@ function useBookingSubmission(_siteId) {
 				startAt: data.startAt,
 				endAt: data.endAt,
 				customFields: data.customFields,
+				mailingListOptIn: data.mailingListOptIn,
 				timezone: data.timezone,
 				customerPassId: data.customerPassId
 			}) : await api.submitBooking({
@@ -652,6 +629,7 @@ function useBookingSubmission(_siteId) {
 				startAt: data.startAt,
 				endAt: data.endAt,
 				customFields: data.customFields,
+				mailingListOptIn: data.mailingListOptIn,
 				timezone: data.timezone,
 				discountCode: data.discountCode,
 				selectedSlidingAmount: data.selectedSlidingAmount,
@@ -687,6 +665,40 @@ function useBookingSubmission(_siteId) {
 	};
 }
 //#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.submit-success.ts
+function completeBookingSubmission(input) {
+	const { data } = input;
+	if (data.type === "checkout_redirect") {
+		if (input.redirect === "auto" && typeof window !== "undefined") input.navigateToCheckout(data.checkoutUrl);
+		return {
+			ok: true,
+			outcome: {
+				kind: "checkout_redirect",
+				checkoutUrl: data.checkoutUrl,
+				sessionId: data.sessionId,
+				...data.mailingListSignupNote ? { mailingListSignupNote: data.mailingListSignupNote } : {}
+			}
+		};
+	}
+	input.dispatch({
+		type: "feedback-set",
+		feedback: {
+			kind: "success",
+			message: getBookingSuccessMessage(input.successMessage),
+			resourceName: data.appointment.resourceName
+		}
+	});
+	return {
+		ok: true,
+		outcome: {
+			kind: "booked",
+			appointmentId: data.appointment.id,
+			resourceName: data.appointment.resourceName,
+			...data.mailingListSignupNote ? { mailingListSignupNote: data.mailingListSignupNote } : {}
+		}
+	};
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/booking-form.validationErrors.ts
 function omitRecordKey(record, key) {
 	if (!(key in record)) return record;
@@ -728,6 +740,40 @@ function clearBookingFieldError(errors, fieldId) {
 	};
 }
 //#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.mailing-list-state.ts
+function bookingFormDataWithEligibleOptIn(data, eligible) {
+	return {
+		...data,
+		mailingListOptIn: eligible && data.mailingListOptIn === true
+	};
+}
+function isBookingContactEvent(event) {
+	return event.type === "field-updated" || event.type === "field-touched" || event.type === "mailing-list-opt-in-set";
+}
+function applyBookingContactEvent(state, event) {
+	switch (event.type) {
+		case "field-updated": return {
+			...state,
+			fieldValues: {
+				...state.fieldValues,
+				[event.fieldId]: event.value
+			},
+			validationErrors: clearBookingFieldError(clearBookingFormError(state.validationErrors), event.fieldId)
+		};
+		case "field-touched": return {
+			...state,
+			touchedFields: {
+				...state.touchedFields,
+				[event.fieldId]: true
+			}
+		};
+		case "mailing-list-opt-in-set": return {
+			...state,
+			mailingListOptIn: event.checked
+		};
+	}
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/booking-form.field-values.ts
 function collectInitialBookingFieldValues(initialData) {
 	const values = {};
@@ -753,6 +799,7 @@ function createInitialBookingFlowReducerState(input) {
 		selectedDate: toOptionalString(initialData.selectedDate),
 		selectedSlot: null,
 		fieldValues: collectInitialBookingFieldValues(initialData),
+		mailingListOptIn: initialData.mailingListOptIn === true,
 		touchedFields: {},
 		attemptedStepIds: {},
 		discountCode: toOptionalString(initialData.discountCode) ?? "",
@@ -802,6 +849,7 @@ function applyAvailabilitySelectionInvalidation(state, invalidation) {
 	};
 }
 function bookingFlowReducer(state, event) {
+	if (isBookingContactEvent(event)) return applyBookingContactEvent(state, event);
 	switch (event.type) {
 		case "service-selected": return applyBookingServiceSelection(state, event.serviceId);
 		case "resource-selected": return {
@@ -824,21 +872,6 @@ function bookingFlowReducer(state, event) {
 			feedback: clearAvailabilityFeedback(state.feedback),
 			validationErrors: clearBookingFormError(state.validationErrors)
 		};
-		case "field-updated": return {
-			...state,
-			fieldValues: {
-				...state.fieldValues,
-				[event.fieldId]: event.value
-			},
-			validationErrors: clearBookingFieldError(clearBookingFormError(state.validationErrors), event.fieldId)
-		};
-		case "field-touched": return {
-			...state,
-			touchedFields: {
-				...state.touchedFields,
-				[event.fieldId]: true
-			}
-		};
 		case "step-advance-attempted": return state.attemptedStepIds[event.stepId] ? state : {
 			...state,
 			attemptedStepIds: {
@@ -976,6 +1009,7 @@ function deriveBookingSlotDisplayOptions(input) {
 function toBookingFormData(state) {
 	return {
 		...state.fieldValues,
+		mailingListOptIn: state.mailingListOptIn,
 		serviceId: state.selectedServiceId,
 		resourceId: state.selectedResourceId ?? state.selectedSlot?.resourceId,
 		selectedDate: state.selectedDate,
@@ -1238,10 +1272,7 @@ function buildBookingSubmitPlan(input) {
 	};
 	const prepared = prepareBookingSubmission({
 		formId: input.formId,
-		data: toBookingFormData({
-			...input.state,
-			altchaSolution: input.altchaSolution ?? input.state.altchaSolution
-		}),
+		data: bookingFormDataWithEligibleOptIn(toBookingFormData(input.state), Boolean(input.mailingListEligible)),
 		services: input.services,
 		defaultServiceId: input.defaultServiceId,
 		defaultResourceId: input.defaultResourceId,
@@ -1427,6 +1458,8 @@ function useHeadlessBookingFlow(options) {
 	const canLoadAppointmentPackages = Boolean(options.enableAppointmentPackages && hasPortalBearerAuth && selectedService && !selectedServiceSlidingScale && (selectedService.priceAmount ?? 0) > 0);
 	const appointmentPackagesUnavailableReason = !options.enableAppointmentPackages ? "disabled" : !selectedService || selectedServiceSlidingScale || (selectedService.priceAmount ?? 0) <= 0 ? "missing-priced-service" : !hasPortalBearerAuth ? "missing-portal-auth" : null;
 	const data = useMemo(() => toBookingFormData(state), [state]);
+	const mailingList = resolveBookingSignupOffer(options.mailingList, options.siteName);
+	const mailingListEligible = mailingList !== null;
 	const availabilityDatesQuery = useMemo(() => buildBookingAvailabilityQuery({
 		serviceId: selectedServiceId,
 		resourceId: selectedResourceId,
@@ -1687,7 +1720,8 @@ function useHeadlessBookingFlow(options) {
 			viewerTimeZone: latest.viewerTimeZone,
 			redirect: submitOptions?.redirect ?? "manual",
 			successUrl: submitOptions?.successUrl,
-			cancelUrl: submitOptions?.cancelUrl
+			cancelUrl: submitOptions?.cancelUrl,
+			mailingListEligible
 		});
 		if (!plan.ok) {
 			dispatch({
@@ -1720,37 +1754,18 @@ function useHeadlessBookingFlow(options) {
 					message: result.error
 				};
 			}
-			if (result.data.type === "checkout_redirect") {
-				if (plan.redirect === "auto" && typeof window !== "undefined") latest.navigateToCheckout(result.data.checkoutUrl);
-				return {
-					ok: true,
-					outcome: {
-						kind: "checkout_redirect",
-						checkoutUrl: result.data.checkoutUrl
-					}
-				};
-			}
-			dispatch({
-				type: "feedback-set",
-				feedback: {
-					kind: "success",
-					message: getBookingSuccessMessage(latest.successMessage),
-					resourceName: result.data.appointment.resourceName
-				}
+			return completeBookingSubmission({
+				data: result.data,
+				redirect: plan.redirect,
+				successMessage: latest.successMessage,
+				navigateToCheckout: latest.navigateToCheckout,
+				dispatch
 			});
-			return {
-				ok: true,
-				outcome: {
-					kind: "booked",
-					appointmentId: result.data.appointment.id,
-					resourceName: result.data.appointment.resourceName
-				}
-			};
 		} finally {
 			submittingRef.current = false;
 			dispatch({ type: "submission-finished" });
 		}
-	}, [latestRef]);
+	}, [latestRef, mailingListEligible]);
 	const actions = useMemo(() => ({
 		selectService: (serviceId) => dispatch({
 			type: "service-selected",
@@ -1773,6 +1788,10 @@ function useHeadlessBookingFlow(options) {
 			fieldId: unsafeAsBookingFieldId(fieldId),
 			value
 		}),
+		setMailingListOptIn: (checked) => dispatch({
+			type: "mailing-list-opt-in-set",
+			checked
+		}),
 		markFieldTouched: (fieldId) => dispatch({
 			type: "field-touched",
 			fieldId: unsafeAsBookingFieldId(fieldId)
@@ -1931,6 +1950,8 @@ function useHeadlessBookingFlow(options) {
 		appointmentPackages: appointmentPackagesModel
 	};
 	return {
+		mailingList,
+		mailingListOptIn: state.mailingListOptIn,
 		status,
 		view,
 		steps: stepState.steps,
@@ -2228,6 +2249,25 @@ const TimeSlotSelector = ({ value, onChange, slots, isLoading, timezone, require
 	});
 };
 //#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.mailing-list-choice.tsx
+function BookingMailingListChoice({ booking }) {
+	const id = React.useId();
+	if (!booking.mailingList) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "rb-space-y-2",
+		children: [/* @__PURE__ */ jsx(CheckboxChoice, {
+			id,
+			name: "mailingListOptIn",
+			checked: booking.mailingListOptIn,
+			onChange: (event) => booking.actions.setMailingListOptIn(event.target.checked),
+			label: `Email me news and updates from ${booking.mailingList.siteName}.`
+		}), /* @__PURE__ */ jsx("p", {
+			className: "rb-caption status-muted",
+			children: "Optional. You can unsubscribe at any time."
+		})]
+	});
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/booking-form.service-choices.tsx
 function optionCardClassName(isSelected) {
 	return `rb-option-card${isSelected ? " rb-option-card--selected" : ""}`;
@@ -2707,12 +2747,17 @@ function PaymentOptionContent({ description, helperText, id, summaryRows, title
 	});
 }
 function DefaultDynamicFields({ booking, fields }) {
+	const lastContactIndex = fields.reduce((last, field, index) => [
+		"name",
+		"email",
+		"phone"
+	].includes(field.id) ? index : last, -1);
 	return /* @__PURE__ */ jsx("div", {
 		className: "rb-space-y-6",
-		children: fields.map((field) => /* @__PURE__ */ jsx(DefaultDynamicField, {
+		children: fields.map((field, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [/* @__PURE__ */ jsx(DefaultDynamicField, {
 			booking,
 			field
-		}, field.id))
+		}), index === lastContactIndex && booking.mailingList ? /* @__PURE__ */ jsx(BookingMailingListChoice, { booking }) : null] }, field.id))
 	});
 }
 function DefaultDynamicField({ booking, field }) {
@@ -2983,9 +3028,88 @@ function DefaultBookingErrorSummary({ errors, id }) {
 	});
 }
 //#endregion
+//#region ../blocks/src/system/runtime/components/booking/SuccessMessage.tsx
+const SuccessMessage = ({ message, resourceName, className }) => {
+	return /* @__PURE__ */ jsx(TerminalPanel, {
+		tone: "success",
+		title: "Booking confirmed",
+		icon: /* @__PURE__ */ jsx(StateIcon, {
+			variant: "success",
+			children: /* @__PURE__ */ jsx(CheckIcon, { strokeWidth: 3 })
+		}),
+		body: /* @__PURE__ */ jsx("p", {
+			className: "ab-text",
+			children: message
+		}),
+		secondaryBody: resourceName ? /* @__PURE__ */ jsxs("p", {
+			className: "ab-text rb-on-surface--muted",
+			children: ["Practitioner: ", resourceName]
+		}) : null,
+		className: ["ab-center", className ?? ""].join(" ").trim(),
+		titleClassName: "ab-terminal-title",
+		role: "alert",
+		live: "polite"
+	});
+};
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.mailing-list-note.ts
+function storageKey(sessionId) {
+	return `riverbank:booking:mailing-list:${sessionId}`;
+}
+function saveAppointmentMailingListNote(sessionId, note) {
+	if (!note) return;
+	try {
+		window.sessionStorage.setItem(storageKey(sessionId), note);
+	} catch {}
+}
+function readAppointmentMailingListNote(sessionId) {
+	try {
+		const stored = window.sessionStorage.getItem(storageKey(sessionId));
+		return stored === "confirmation_required" || stored === "not_confirmed" ? stored : null;
+	} catch {
+		return null;
+	}
+}
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.completion.tsx
+function BookingFormCompletion({ resourceName, successMessage, redirectState, localNote }) {
+	const note = redirectState.kind === "success" ? readAppointmentMailingListNote(redirectState.sessionId) : localNote;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(SuccessMessage, {
+		message: getBookingSuccessMessage(successMessage),
+		resourceName
+	}), note ? /* @__PURE__ */ jsx(BookingMailingListNote, {
+		note,
+		context: "booking",
+		className: "rb-mt-4"
+	}) : null] });
+}
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.submit-handler.ts
+function appendRebookFlag(url, enabled) {
+	if (!enabled) return url;
+	const nextUrl = new URL(url);
+	nextUrl.searchParams.set("rebook", "1");
+	return nextUrl.toString();
+}
+function createBookingFormSubmitHandler(input) {
+	return async () => {
+		const { successUrl, cancelUrl } = buildCheckoutReturnUrls("booking", input.bookingAnchorId);
+		const result = await input.booking.actions.submit({
+			redirect: "manual",
+			successUrl: appendRebookFlag(successUrl, input.isPortalRebook),
+			cancelUrl: appendRebookFlag(cancelUrl, input.isPortalRebook)
+		});
+		if (!result.ok) return;
+		if (result.outcome.kind === "checkout_redirect") {
+			saveAppointmentMailingListNote(result.outcome.sessionId, result.outcome.mailingListSignupNote);
+			window.location.href = result.outcome.checkoutUrl;
+			return;
+		}
+		input.setLocalMailingListNote(result.outcome.mailingListSignupNote ?? null);
+	};
+}
+//#endregion
 //#region ../blocks/src/system/runtime/nodes/booking-form.client.tsx
-const PORTAL_REBOOK_QUERY_PARAM = "rebook";
-const PORTAL_REBOOK_QUERY_VALUE = "1";
 const REBOOK_COMPLETION_MODE_VERIFIED_CHECKOUT = "verified_checkout";
 const REBOOK_COMPLETION_MODE_BYPASSED = "bypassed";
 function getBookingRedirectLocationSnapshot() {
@@ -2998,12 +3122,6 @@ function getBookingRedirectLocationSnapshot() {
 		hash: window.location.hash
 	};
 }
-function appendRebookFlag(url, enabled) {
-	if (!enabled) return url;
-	const nextUrl = new URL(url);
-	nextUrl.searchParams.set(PORTAL_REBOOK_QUERY_PARAM, PORTAL_REBOOK_QUERY_VALUE);
-	return nextUrl.toString();
-}
 /**
 * Themed surface container for every booking view state (wizard, success,
 * verifying). Styled by the shared registration-surface layer.
@@ -3026,12 +3144,16 @@ const BookingFormClient = ({ siteId: siteIdProp, render }) => {
 	const isPortalRebook = render.hydration.rebookContext?.kind === "portal_rebook";
 	const hasLoggedRebookCompletionRef = useRef(false);
 	const [redirectState] = useState(() => getBookingRedirectStateFromLocation(getBookingRedirectLocationSnapshot()));
+	const [localMailingListNote, setLocalMailingListNote] = useState(null);
 	const showSpamProtection = render.hydration.spamProtectionEnabled ?? isSpamProtectionEnabled();
 	const api = useBlockApi();
 	const hasPortalAuth = api.config.auth.type === "bearer" || api.config.authOverrides?.portal?.type === "bearer";
+	const formId = render.hydration.formId ?? form?.id ?? "booking-form";
 	const booking = useHeadlessBookingFlow({
+		mailingList: render.hydration.mailingList,
+		siteName: render.hydration.siteName,
 		siteId,
-		formId: render.hydration.formId ?? form?.id ?? "booking-form",
+		formId,
 		form,
 		services,
 		serviceCategories: render.hydration.serviceCategories,
@@ -3101,22 +3223,20 @@ const BookingFormClient = ({ siteId: siteIdProp, render }) => {
 			children: render.display.message ?? "Booking form not found. Please check your configuration."
 		})
 	});
-	const handleComplete = async () => {
-		const { successUrl, cancelUrl } = buildCheckoutReturnUrls("booking", bookingAnchorId);
-		const result = await booking.actions.submit({
-			redirect: "manual",
-			successUrl: appendRebookFlag(successUrl, isPortalRebook),
-			cancelUrl: appendRebookFlag(cancelUrl, isPortalRebook)
-		});
-		if (!result.ok) return;
-		if (result.outcome.kind === "checkout_redirect") window.location.href = result.outcome.checkoutUrl;
-	};
+	const handleComplete = createBookingFormSubmitHandler({
+		booking,
+		bookingAnchorId,
+		isPortalRebook,
+		setLocalMailingListNote
+	});
 	if (viewState.kind === "success") return /* @__PURE__ */ jsx(BookingSurface, {
 		id: bookingAnchorId,
 		className: render.display.className,
-		children: /* @__PURE__ */ jsx(SuccessMessage, {
-			message: getBookingSuccessMessage(render.display.successMessage),
-			resourceName: viewState.resourceName
+		children: /* @__PURE__ */ jsx(BookingFormCompletion, {
+			successMessage: render.display.successMessage,
+			resourceName: viewState.resourceName,
+			redirectState,
+			localNote: localMailingListNote
 		})
 	});
 	if (viewState.kind === "verifying") return /* @__PURE__ */ jsx(BookingSurface, {