@riverbankcms/sdk 0.91.0 → 0.92.0

package/dist/client/{accordion-AFX37652.mjs → accordion-BUDH2G3S.mjs}

@@ -1,5 +1,5 @@
-import { defineIslandPropsDecoder } from './chunk-MLBNVN4H.mjs';
-import './chunk-RWYFG625.mjs';
+import { defineIslandPropsDecoder } from './chunk-R3CZQLXF.mjs';
+import './chunk-GH6IIOOE.mjs';
 
 // src/rendering/islands/enhancers/accordion.ts
 var decode = defineIslandPropsDecoder("accordion");

package/dist/client/{bookingForm-32V5QCOW.mjs → bookingForm-NQMCELVB.mjs}

@@ -1,15 +1,15 @@
 "use client";
-import { buildBookingPaymentSelectionViewModel, usePolling } from './chunk-E6VIWZUG.mjs';
-import { SpinnerNode } from './chunk-ISAUXU5R.mjs';
+import { buildBookingPaymentSelectionViewModel, usePolling } from './chunk-N2WJPTF7.mjs';
+import { SpinnerNode } from './chunk-QQNVQ62W.mjs';
 import { buildRouteIslandApiConfig } from './chunk-L4J5Y62O.mjs';
-import { scrollToBlock, useDiscountCodeUi, buildCheckoutReturnUrls, DiscountCodeDisclosure } from './chunk-CKXEUWWA.mjs';
+import { scrollToBlock, useDiscountCodeUi, buildCheckoutReturnUrls, DiscountCodeDisclosure } from './chunk-ZJDBOLX7.mjs';
 import { FieldValidationMessage, getFieldValidationControlProps } from './chunk-3DCJ45Z2.mjs';
 import './chunk-WBQG7VJA.mjs';
 import { isSpamProtectionEnabled, getChallengeUrl, AltchaWidget } from './chunk-LJCX6V7Q.mjs';
-import { BlockApiProvider, useBlockApi, FeedbackMessage } from './chunk-WHZQDPBZ.mjs';
+import { BlockApiProvider, useBlockApi, FeedbackMessage } from './chunk-TNGL2WJF.mjs';
 import { mountReactIsland } from './chunk-N7PBWBWQ.mjs';
-import { defineIslandPropsDecoder, resolveBookingSiteId, resolveDefaultBookingServiceId, getBookingRedirectStateFromLocation, deriveBookingFormViewState, logger, getBookingSuccessMessage, resolveAppointmentCheckoutVerificationState, themeButtonClassName, toSelectedCollectionOptionKind, assertNever, prepareBookingSubmission, formatBookingSubmissionPreparationError, resolveBookingPaymentStep, BOOKING_FORM_DATA_RESERVED_KEYS, clearWorkflowFeedback, reportWorkflowError, reportWorkflowSuccess, okWith, err } from './chunk-MLBNVN4H.mjs';
-import { resolveBookingTimeZoneId, DEFAULT_BOOKING_TIME_ZONE, unsafeAsFormId, unsafeAsAppointmentResourceId, unsafeAsCustomerPassId, unsafeAsAppointmentServiceId, formatLocalScheduleDate, addLocalScheduleDays, parseBookingLocalDate, unsafeAsPassId, formatBookingInstant } from './chunk-RWYFG625.mjs';
+import { defineIslandPropsDecoder, resolveBookingSiteId, resolveDefaultBookingServiceId, getBookingRedirectStateFromLocation, deriveBookingFormViewState, logger, getBookingSuccessMessage, getBookingServiceSlidingScale, formatBookingCentsAsCurrencyInput, parseBookingCurrencyInputToCents, resolveAppointmentCheckoutVerificationState, themeButtonClassName, toSelectedCollectionOptionKind, assertNever, prepareBookingSubmission, formatBookingSubmissionPreparationError, resolveBookingPaymentStep, BOOKING_FORM_DATA_RESERVED_KEYS, isBookingServiceSlidingAmountInRange, clearWorkflowFeedback, reportWorkflowError, reportWorkflowSuccess, okWith, err } from './chunk-R3CZQLXF.mjs';
+import { resolveBookingTimeZoneId, DEFAULT_BOOKING_TIME_ZONE, unsafeAsFormId, unsafeAsAppointmentResourceId, unsafeAsCustomerPassId, unsafeAsAppointmentServiceId, formatLocalScheduleDate, addLocalScheduleDays, parseBookingLocalDate, unsafeAsPassId, formatCurrencyAmount, formatBookingInstant } from './chunk-GH6IIOOE.mjs';
 import React2, { useRef, useState, useMemo, useReducer, useEffect, useCallback, useLayoutEffect } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -514,6 +514,7 @@ function useBookingSubmission(_siteId) {
         customFields: data.customFields,
         timezone: data.timezone,
         discountCode: data.discountCode,
+        selectedSlidingAmount: data.selectedSlidingAmount,
         selectedCollectionOptionKind: data.selectedCollectionOptionKind,
         altchaSolution: data.altchaSolution ?? null,
         successUrl: data.successUrl,
@@ -583,6 +584,9 @@ function createInitialBookingFlowReducerState(input) {
     fieldValues: collectInitialFieldValues(initialData),
     touchedFields: {},
     discountCode: toOptionalString(initialData.discountCode) ?? "",
+    selectedSlidingAmountInput: toOptionalString(
+      initialData.selectedSlidingAmountInput
+    ) ?? "",
     selectedCollectionOptionKind: toSelectedCollectionOptionKind(
       initialData.selectedCollectionOptionKind
     ),
@@ -635,6 +639,7 @@ function bookingFlowReducer(state, event) {
         selectedDate: void 0,
         selectedSlot: null,
         selectedAppointmentPackageId: void 0,
+        selectedSlidingAmountInput: "",
         selectedCollectionOptionKind: void 0,
         validationErrors: clearBookingFormError(state.validationErrors)
       };
@@ -688,6 +693,13 @@ function bookingFlowReducer(state, event) {
         selectedAppointmentPackageId: void 0,
         validationErrors: clearBookingFormError(state.validationErrors)
       };
+    case "sliding-amount-changed":
+      return {
+        ...state,
+        selectedSlidingAmountInput: event.value,
+        selectedAppointmentPackageId: void 0,
+        validationErrors: clearBookingFormError(state.validationErrors)
+      };
     case "appointment-package-selected":
       return {
         ...state,
@@ -790,6 +802,7 @@ function toBookingFormData(state) {
     selectedDate: state.selectedDate,
     selectedSlot: state.selectedSlot?.startAt,
     discountCode: state.discountCode || void 0,
+    selectedSlidingAmountInput: state.selectedSlidingAmountInput || void 0,
     selectedCollectionOptionKind: state.selectedCollectionOptionKind,
     selectedAppointmentPackageId: state.selectedAppointmentPackageId
   };
@@ -807,7 +820,8 @@ function buildBookingStepResolution(input) {
     input.form.settings?.serviceIds && input.form.settings.serviceIds.length > 1
   );
   const selectedService = paymentResolution.service;
-  const needsPayment = paymentResolution.mode !== "hidden" || Boolean(
+  const selectedServiceSlidingScale = getBookingServiceSlidingScale(selectedService);
+  const needsPayment = Boolean(selectedServiceSlidingScale) || paymentResolution.mode !== "hidden" || Boolean(
     input.enableAppointmentPackages && selectedService && (selectedService.priceAmount ?? 0) > 0
   );
   const hasFields = Boolean(input.form.schema?.fields.length);
@@ -851,6 +865,18 @@ function validateBookingStep(input) {
         services: input.services,
         defaultServiceId: input.defaultServiceId
       });
+      const slidingScale = getBookingServiceSlidingScale(resolution.service);
+      if (slidingScale && !isBookingServiceSlidingAmountInRange(
+        slidingScale,
+        parseBookingCurrencyInputToCents(input.data.selectedSlidingAmountInput)
+      )) {
+        return {
+          ok: false,
+          errors: createFormBookingValidationError(
+            "Please choose an amount within the sliding scale"
+          )
+        };
+      }
       if (resolution.mode === "hidden" || resolution.mode === "disclosure_only") {
         return { ok: true };
       }
@@ -1260,11 +1286,27 @@ function useHeadlessBookingFlow(options) {
   const selectedServiceId = state.selectedServiceId ?? defaultServiceId;
   const selectedResourceId = state.selectedResourceId ?? defaultResourceId;
   const selectedService = options.services.find((service) => service.id === selectedServiceId) ?? null;
+  const lastSlidingServiceIdRef = useRef(null);
+  useEffect(() => {
+    const selectedId = selectedService?.id ?? null;
+    if (lastSlidingServiceIdRef.current === selectedId) return;
+    lastSlidingServiceIdRef.current = selectedId;
+    const slidingScale = getBookingServiceSlidingScale(selectedService);
+    dispatch({
+      type: "sliding-amount-changed",
+      value: slidingScale?.suggestedAmount !== null && slidingScale?.suggestedAmount !== void 0 ? formatBookingCentsAsCurrencyInput(slidingScale.suggestedAmount) : ""
+    });
+  }, [selectedService]);
   const hasPortalBearerAuth = (api.config.authOverrides?.portal ?? api.config.auth).type === "bearer";
+  const selectedServiceSlidingScale = getBookingServiceSlidingScale(selectedService);
+  const selectedSlidingAmount = parseBookingCurrencyInputToCents(
+    state.selectedSlidingAmountInput
+  );
+  const selectedAppointmentPriceAmount = selectedServiceSlidingScale && selectedSlidingAmount !== null ? selectedSlidingAmount : selectedService?.priceAmount ?? 0;
   const canLoadAppointmentPackages = Boolean(
-    options.enableAppointmentPackages && hasPortalBearerAuth && selectedService && (selectedService.priceAmount ?? 0) > 0
+    options.enableAppointmentPackages && hasPortalBearerAuth && selectedService && !selectedServiceSlidingScale && (selectedService.priceAmount ?? 0) > 0
   );
-  const appointmentPackagesUnavailableReason = !options.enableAppointmentPackages ? "disabled" : !selectedService || (selectedService.priceAmount ?? 0) <= 0 ? "missing-priced-service" : !hasPortalBearerAuth ? "missing-portal-auth" : null;
+  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 availabilityDatesQuery = useMemo(
     () => buildBookingAvailabilityQuery({
@@ -1494,13 +1536,13 @@ function useHeadlessBookingFlow(options) {
     state.selectedSlot
   ]);
   const appointmentDiscountContext = useMemo(
-    () => selectedService && (selectedService.priceAmount ?? 0) > 0 ? { type: "appointment", serviceId: selectedService.id } : null,
-    [selectedService?.id, selectedService?.priceAmount]
+    () => selectedService && selectedAppointmentPriceAmount > 0 ? { type: "appointment", serviceId: selectedService.id } : null,
+    [selectedAppointmentPriceAmount, selectedService?.id]
   );
   const discountUi = useDiscountCodeUi({
     api,
     discountContext: appointmentDiscountContext,
-    subtotalCents: selectedService?.priceAmount ?? 0
+    subtotalCents: selectedAppointmentPriceAmount
   });
   const { submit, clearFeedback } = useBookingSubmission(options.siteId);
   const submittingRef = useRef(false);
@@ -1643,6 +1685,7 @@ function useHeadlessBookingFlow(options) {
         type: "appointment-package-selected",
         packageId: packageId ? unsafeAsCustomerPassId(packageId) : null
       }),
+      setSlidingAmountInput: (value) => dispatch({ type: "sliding-amount-changed", value }),
       setDiscountCode: (code) => {
         dispatch({ type: "discount-code-changed", code });
         latestRef.current.setDiscountCode(code);
@@ -1713,11 +1756,11 @@ function useHeadlessBookingFlow(options) {
     () => selectedService && paymentResolution.mode !== "unsupported" ? buildBookingPaymentSelectionViewModel({
       serviceTitle: selectedService.title,
       paymentTerms: selectedService.paymentTerms,
-      priceAmount: selectedService.priceAmount,
+      priceAmount: selectedAppointmentPriceAmount,
       priceCurrency: selectedService.priceCurrency,
       bookingStartAt: state.selectedSlot?.startAt
     }) : null,
-    [paymentResolution.mode, selectedService, state.selectedSlot?.startAt]
+    [paymentResolution.mode, selectedAppointmentPriceAmount, selectedService, state.selectedSlot?.startAt]
   );
   const appointmentPackageItems = appointmentPackages.tag === "loaded" ? appointmentPackages.value : [];
   const selectedAppointmentPackage = appointmentPackageItems.find(
@@ -1746,6 +1789,9 @@ function useHeadlessBookingFlow(options) {
     selection: null,
     selectedCollectionOptionKind: state.selectedCollectionOptionKind,
     selectedAppointmentPackageId: state.selectedAppointmentPackageId,
+    selectedSlidingAmountInput: state.selectedSlidingAmountInput,
+    selectedSlidingAmount,
+    slidingScale: selectedServiceSlidingScale,
     appointmentPackages: appointmentPackagesModel,
     errorMessage: paymentResolution.errorMessage ?? "This service cannot be booked right now."
   } : {
@@ -1754,6 +1800,9 @@ function useHeadlessBookingFlow(options) {
     selection: paymentSelection,
     selectedCollectionOptionKind: state.selectedCollectionOptionKind,
     selectedAppointmentPackageId: state.selectedAppointmentPackageId,
+    selectedSlidingAmountInput: state.selectedSlidingAmountInput,
+    selectedSlidingAmount,
+    slidingScale: selectedServiceSlidingScale,
     appointmentPackages: appointmentPackagesModel
   };
   return {
@@ -1959,6 +2008,9 @@ var paymentOptionLayoutStyle = {
 var summaryStackStyle = {
   gap: "0.125rem"
 };
+function formatBookingAmount(amount, currency) {
+  return formatCurrencyAmount(amount, currency, { decimals: "auto" });
+}
 function HeadlessBookingDefaultForm({
   booking,
   onSubmit
@@ -2235,6 +2287,7 @@ function HeadlessBookingPaymentSelectionStep({
   }
   const packageOptions = booking.payment.appointmentPackages.items;
   const hasPackageOptions = packageOptions.length > 0;
+  const slidingScale = booking.payment.slidingScale;
   return /* @__PURE__ */ jsxs("div", { className: "ab-stack", children: [
     /* @__PURE__ */ jsxs("div", { className: "ab-info-box", children: [
       /* @__PURE__ */ jsx("h3", { className: "ab-subtitle", children: viewModel.sectionTitle }),
@@ -2245,6 +2298,28 @@ function HeadlessBookingPaymentSelectionStep({
       booking.payment.appointmentPackages.state.message,
       " You can continue with the normal payment option."
     ] }) : null,
+    slidingScale ? /* @__PURE__ */ jsxs("div", { className: "rb-space-y-2", children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: "appointment-sliding-amount", className: "form-label", children: "Choose your price" }),
+      /* @__PURE__ */ jsxs("p", { className: "rb-caption status-muted", children: [
+        formatBookingAmount(slidingScale.minAmount, slidingScale.currency),
+        " to ",
+        formatBookingAmount(slidingScale.maxAmount, slidingScale.currency),
+        slidingScale.suggestedAmount !== null ? `, suggested ${formatBookingAmount(slidingScale.suggestedAmount, slidingScale.currency)}` : ""
+      ] }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id: "appointment-sliding-amount",
+          type: "number",
+          className: "form-input",
+          min: slidingScale.minAmount / 100,
+          max: slidingScale.maxAmount / 100,
+          step: "0.01",
+          value: booking.payment.selectedSlidingAmountInput,
+          onChange: (event) => booking.actions.setSlidingAmountInput(event.target.value)
+        }
+      )
+    ] }) : null,
     /* @__PURE__ */ jsxs("div", { className: "ab-stack", role: "list", "aria-label": "Payment options", children: [
       packageOptions.map((appointmentPackage) => {
         const isSelected = booking.payment.selectedAppointmentPackageId === appointmentPackage.customerPassId;