@wix/headless-bookings 1.0.4 → 1.0.6

package/dist/services/payment/payment.js

@@ -52,7 +52,21 @@ function getAdditionalInfo(service, lineItemId) {
         : undefined;
     return { lineItemId, customPrice };
 }
-function getPaymentOption(service, hasDeposit) {
+/**
+ * Resolves the line item's `paymentOption`.
+ *
+ * Precedence: explicit consumer choice (`selectedPaymentOption`) wins over the
+ * service-config heuristic so the preview always agrees with what `book()`
+ * will send. When unset, the existing heuristic is preserved for backward
+ * compat.
+ */
+function getPaymentOption(service, hasDeposit, selectedPaymentOption) {
+    if (selectedPaymentOption === 'OFFLINE') {
+        return 'FULL_PAYMENT_OFFLINE';
+    }
+    if (selectedPaymentOption === 'ONLINE') {
+        return hasDeposit ? 'DEPOSIT_ONLINE' : 'FULL_PAYMENT_ONLINE';
+    }
     const options = service.payment?.options;
     if (options?.inPerson) {
         return 'FULL_PAYMENT_OFFLINE';
@@ -63,7 +77,7 @@ function getPaymentOption(service, hasDeposit) {
     }
     return 'FULL_PAYMENT_ONLINE';
 }
-function buildLineItem(service, totalParticipants, lineItemId) {
+function buildLineItem(service, totalParticipants, lineItemId, selectedPaymentOption) {
     // Get fixed price from service
     const servicePrice = service.payment?.fixed?.price?.value;
     const price = Number(servicePrice || 0) * totalParticipants;
@@ -74,7 +88,7 @@ function buildLineItem(service, totalParticipants, lineItemId) {
         ? Number(depositValue) * totalParticipants
         : undefined;
     // Get payment option from service configuration (pass hasDeposit for correct API behavior)
-    const paymentOption = getPaymentOption(service, hasDeposit);
+    const paymentOption = getPaymentOption(service, hasDeposit, selectedPaymentOption);
     return {
         _id: lineItemId,
         catalogReference: {
@@ -112,7 +126,7 @@ async function getPreviewedPrice(service, localStartDate, localEndDate, timeZone
         deposit: result.priceInfo?.deposit ?? null,
     };
 }
-async function buildLineItemWithPreview(item, totalParticipants) {
+async function buildLineItemWithPreview(item, totalParticipants, selectedPaymentOption) {
     if (item.localStartDate &&
         item.localEndDate &&
         getDurationRange(item.service)) {
@@ -137,18 +151,18 @@ async function buildLineItemWithPreview(item, totalParticipants) {
                 price: String(previewedPrice.price),
                 ...(deposit ? { depositAmount: String(deposit) } : {}),
                 quantity: 1,
-                paymentOption: getPaymentOption(item.service, hasDeposit),
+                paymentOption: getPaymentOption(item.service, hasDeposit, selectedPaymentOption),
             };
         }
     }
-    return buildLineItem(item.service, totalParticipants, item.lineItemId);
+    return buildLineItem(item.service, totalParticipants, item.lineItemId, selectedPaymentOption);
 }
-async function calculatePaymentDetails(pricingServiceSelections, totalParticipants) {
+async function calculatePaymentDetails(pricingServiceSelections, totalParticipants, selectedPaymentOption) {
     const data = pricingServiceSelections.map((selection) => ({
         ...selection,
         lineItemId: selection.lineItemId || generateLineItemId(),
     }));
-    const lineItems = await Promise.all(data.map((item) => buildLineItemWithPreview(item, totalParticipants)));
+    const lineItems = await Promise.all(data.map((item) => buildLineItemWithPreview(item, totalParticipants, selectedPaymentOption)));
     const response = await calculateTotals({
         lineItems,
     });
@@ -179,7 +193,7 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
     const errorSignal = signalsService.signal(null);
     const serviceOptionsSignal = signalsService.signal(config.serviceOptions || DEFAULT_SERVICE_OPTIONS);
     // Internal calculate function
-    const calculate = async (pricingServiceSelections, totalParticipants) => {
+    const calculate = async (pricingServiceSelections, totalParticipants, selectedPaymentOption) => {
         if (!pricingServiceSelections.length) {
             paymentDetailsSignal.set(null);
             return;
@@ -187,7 +201,7 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
         isLoadingSignal.set(true);
         errorSignal.set(null);
         try {
-            const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, totalParticipants);
+            const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, totalParticipants, selectedPaymentOption);
             paymentDetailsSignal.set(paymentDetails);
         }
         catch (error) {
@@ -215,24 +229,30 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
     // Mode 2: Lazy loading - pricingServiceSelections provided via internal config
     else if (config.pricingServiceSelections?.length) {
         serviceOptionsSignal.set(deriveServiceOptions(config.pricingServiceSelections));
-        void calculate(config.pricingServiceSelections, config.totalParticipants ?? 1);
+        void calculate(config.pricingServiceSelections, config.totalParticipants ?? 1, config.selectedPaymentOption);
     }
     // Mode 3: Reactive - observe BookingService signals (client-side only)
     else if (typeof window !== 'undefined' && bookingService) {
-        // Computed signal that changes when services or selected time slots change (not participants)
+        // Computed signal that changes when services, selected time slots, or
+        // the consumer-selected payment option change (not participants).
         const servicesKey = signalsService.computed(() => {
             const selections = bookingService?.serviceSelections.get() || [];
             const timezone = bookingService?.timezone.get();
+            const selectedPaymentOption = bookingService?.selectedPaymentOption.get();
             return (selections
                 .map((s) => `${s.service._id}:${s.timeSlot?.startDate ?? ''}:${s.timeSlot?.endDate ?? ''}`)
-                .join(',') + `:${timezone ?? ''}`);
+                .join(',') +
+                `:${timezone ?? ''}` +
+                `:${selectedPaymentOption ?? ''}`);
         });
         signalsService.effect(() => {
-            // Subscribe to servicesKey to trigger effect when service or time slot changes
+            // Subscribe to servicesKey to trigger effect when service, time
+            // slot, or selected payment option changes.
             servicesKey.get();
             // Read current selections without subscribing (peek)
             const selections = bookingService?.serviceSelections.peek() || [];
             const timezone = bookingService?.timezone.peek();
+            const selectedPaymentOption = bookingService?.selectedPaymentOption.peek();
             // For single service mode, take the first selection
             const firstSelection = selections[0];
             const numParticipants = firstSelection?.totalParticipants || 1;
@@ -246,7 +266,7 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
             if (pricingServiceSelections.length) {
                 serviceOptionsSignal.set(deriveServiceOptions(pricingServiceSelections));
             }
-            void calculate(pricingServiceSelections, numParticipants);
+            void calculate(pricingServiceSelections, numParticipants, selectedPaymentOption);
         });
     }
     return {
@@ -262,10 +282,12 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
  *
  * @param params.pricingServiceSelections - Pricing service selections for calculation
  * @param params.totalParticipants - Number of participants (default: 1)
+ * @param params.selectedPaymentOption - Optional consumer-selected payment option;
+ *   overrides the service-config heuristic on each line item's `paymentOption`.
  */
 export async function loadPaymentConfig(params) {
     try {
-        const { pricingServiceSelections, totalParticipants = 1 } = params;
+        const { pricingServiceSelections, totalParticipants = 1, selectedPaymentOption, } = params;
         if (!pricingServiceSelections.length) {
             return {
                 type: 'success',
@@ -275,7 +297,7 @@ export async function loadPaymentConfig(params) {
                 },
             };
         }
-        const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, totalParticipants);
+        const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, totalParticipants, selectedPaymentOption);
         return {
             type: 'success',
             config: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "type": "module",
   "license": "MIT",
   "scripts": {
@@ -75,5 +75,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "dec47e7070b4b0988f6a3174a24135c58fd38c13c4a9d098bd0e9d99"
+  "falconPackageHash": "de3338c8d4e43446a69ef7116ba391beea6642f2f39551d997fe0ca1"
 }