@wix/headless-bookings 0.0.56 → 0.0.58

package/dist/services/booking-form/booking-form.js

@@ -10,6 +10,8 @@
 import { defineService, implementService } from '@wix/services-definitions';
 import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
 import { FormServiceDefinition } from '@wix/headless-forms/services';
+import { BookingServiceDefinition, } from '../booking/booking.js';
+import { hasForm, extractFormIdFromConfig } from './utils.js';
 // ============================================================================
 // Constants
 // ============================================================================
@@ -18,22 +20,25 @@ import { FormServiceDefinition } from '@wix/headless-forms/services';
  * All booking forms must belong to this namespace.
  */
 export const BOOKING_FORM_NAMESPACE = 'wix.bookings.v2.bookings';
-// ============================================================================
-// Helper Types
-// ============================================================================
-/**
- * Type guard to check if config has formId
- */
-export function hasFormId(config) {
-    return 'formId' in config;
-}
 /**
- * Type guard to check if config has pre-loaded form
+ * Error thrown when BookingFormService cannot be initialized due to missing configuration.
+ * This occurs when:
+ * - No config (formId or form) was provided
+ * - AND the component is not wrapped with Booking.Root (no BookingService available)
  */
-export function hasForm(config) {
-    return 'form' in config;
+export class BookingFormConfigurationError extends Error {
+    constructor(message) {
+        super(message ||
+            'BookingFormService: Cannot initialize - no formId or form provided in config and no BookingService available. ' +
+                'Either provide a formId/form in the config, or wrap with Booking.Root.');
+        this.name = 'BookingFormConfigurationError';
+    }
 }
 // ============================================================================
+// Re-export utilities
+// ============================================================================
+export { hasFormId, hasForm, extractFormIdFromForm, extractFormIdFromConfig, } from './utils.js';
+// ============================================================================
 // Service Definition
 // ============================================================================
 /**
@@ -64,20 +69,21 @@ function validateBookingFormNamespace(form) {
     }
 }
 /**
- * Extracts the form ID from either config type.
- * @param config The service config
+ * Extracts the form ID from either config type or from services.
+ * @param config The service config (optional)
+ * @param services The list of services to extract formId from if config is not provided
  * @returns The form ID
  */
-function extractFormId(config) {
-    if ('formId' in config) {
-        return config.formId;
+function extractFormId(config, services) {
+    // Try to extract from config first
+    let formId = extractFormIdFromConfig(config);
+    // Fallback to extracting from services
+    if (!formId) {
+        formId = services.find((s) => s.form?._id)?.form?._id;
     }
-    // Extract from form object - forms typically have an 'id' or '_id' property
-    const form = config.form;
-    const formId = form.id ||
-        form._id;
     if (!formId) {
-        throw new Error('BookingFormService: Could not extract form ID from provided form object.');
+        throw new BookingFormConfigurationError('BookingFormService: no formId found in config or services. ' +
+            'Either provide a formId in the config, or ensure Booking.Root has selected services with a form.');
     }
     return formId;
 }
@@ -120,14 +126,38 @@ function extractFormId(config) {
 export const BookingFormService = implementService.withConfig()(BookingFormServiceDefinition, ({ getService, config }) => {
     const signalsService = getService(SignalsServiceDefinition);
     const formService = getService(FormServiceDefinition);
+    // BookingService is optional - may not be available if not wrapped with Booking.Root
+    let bookingService = null;
+    try {
+        bookingService = getService(BookingServiceDefinition);
+    }
+    catch {
+        // BookingService not available - that's ok if formId was provided explicitly
+        bookingService = null;
+    }
+    const getServices = () => {
+        if (!bookingService) {
+            return [];
+        }
+        const serviceSelections = bookingService.serviceSelections.peek();
+        return serviceSelections.length
+            ? serviceSelections.map((s) => s.service)
+            : [];
+    };
+    // Validate that we have either config or bookingService with serviceSelections
+    // If neither is available, we can't extract formId and can't initialize the service
+    const hasServiceSelections = getServices().length > 0;
+    if (!config && (!bookingService || !hasServiceSelections)) {
+        throw new BookingFormConfigurationError();
+    }
     // Determine if we have a pre-loaded form
-    const hasPreloadedForm = 'form' in config;
+    const hasPreloadedForm = hasForm(config);
     // If form is provided, validate namespace
     if (hasPreloadedForm) {
         validateBookingFormNamespace(config.form);
     }
     // Extract formId from config (either directly or from form object)
-    const formIdValue = extractFormId(config);
+    const formIdValue = extractFormId(config, getServices());
     // Initialize formSubmission signal (stores form data to be submitted)
     const formSubmission = signalsService.signal(null);
     // Initialize submissionId signal (for future use)
@@ -135,7 +165,7 @@ export const BookingFormService = implementService.withConfig()(BookingFormServi
     // formId signal - readonly
     const formId = signalsService.signal(formIdValue);
     // form signal - contains pre-loaded form if provided
-    const form = signalsService.signal(hasPreloadedForm ? config.form : null);
+    const form = signalsService.signal(hasForm(config) ? config.form : null);
     // Internal: Store validate callback (set by core component, not exposed publicly)
     let _validateCallback = null;
     // Internal: Register validate callback (called by core component via closure)
@@ -155,6 +185,18 @@ export const BookingFormService = implementService.withConfig()(BookingFormServi
         }
         return _validateCallback();
     };
+    // Auto-sync formValues to BookingService.formSubmission (client-side only)
+    // This keeps Booking.Data.formSubmission updated as the user types
+    // and ensures the book action gets the latest form values
+    // Only set up sync if BookingService is available
+    if (bookingService) {
+        signalsService.effect(() => {
+            const formValues = formService.formValuesSignal.get();
+            if (formValues && Object.keys(formValues).length > 0) {
+                bookingService.actions.setFormSubmission(formValues);
+            }
+        });
+    }
     // Public API (what's exposed in BookingFormServiceAPI interface)
     const publicApi = {
         formValues: formService.formValuesSignal,

package/dist/services/booking-form/utils.d.ts

@@ -0,0 +1,52 @@
+/**
+ * Utility functions for BookingForm
+ *
+ * Note: This file should not import from booking-form.ts to avoid circular dependencies.
+ * Type guards use generic types that will be compatible with BookingFormServiceConfig.
+ */
+import { forms } from '@wix/forms';
+/**
+ * Type guard to check if config has formId
+ */
+export declare function hasFormId<T extends {
+    formId: string;
+    serviceIds?: string[];
+} | {
+    form: forms.Form;
+}>(config: T | undefined): config is T & {
+    formId: string;
+    serviceIds?: string[];
+};
+/**
+ * Type guard to check if config has pre-loaded form
+ */
+export declare function hasForm<T extends {
+    formId: string;
+    serviceIds?: string[];
+} | {
+    form: forms.Form;
+}>(config: T | undefined): config is T & {
+    form: forms.Form;
+};
+/**
+ * Extracts the form ID from a form object.
+ * @param form The form object to extract ID from
+ * @returns The form ID or undefined if not found
+ */
+export declare function extractFormIdFromForm(form: forms.Form): string | undefined;
+/**
+ * Configuration object that may contain formId or form.
+ * Used by extractFormIdFromConfig.
+ */
+export type FormIdConfig = {
+    formId: string;
+    serviceIds?: string[];
+} | {
+    form: forms.Form;
+} | undefined;
+/**
+ * Extracts the form ID from a config object (either formId directly or from form object).
+ * @param config The config object containing either formId or form
+ * @returns The form ID or undefined if not found/extractable
+ */
+export declare function extractFormIdFromConfig(config: FormIdConfig): string | undefined;

package/dist/services/booking-form/utils.js

@@ -0,0 +1,47 @@
+/**
+ * Utility functions for BookingForm
+ *
+ * Note: This file should not import from booking-form.ts to avoid circular dependencies.
+ * Type guards use generic types that will be compatible with BookingFormServiceConfig.
+ */
+// ============================================================================
+// Type Guards
+// ============================================================================
+/**
+ * Type guard to check if config has formId
+ */
+export function hasFormId(config) {
+    return config != null && 'formId' in config;
+}
+/**
+ * Type guard to check if config has pre-loaded form
+ */
+export function hasForm(config) {
+    return config != null && 'form' in config;
+}
+// ============================================================================
+// Form ID Extraction
+// ============================================================================
+/**
+ * Extracts the form ID from a form object.
+ * @param form The form object to extract ID from
+ * @returns The form ID or undefined if not found
+ */
+export function extractFormIdFromForm(form) {
+    return (form.id ||
+        form._id);
+}
+/**
+ * Extracts the form ID from a config object (either formId directly or from form object).
+ * @param config The config object containing either formId or form
+ * @returns The form ID or undefined if not found/extractable
+ */
+export function extractFormIdFromConfig(config) {
+    if (hasFormId(config)) {
+        return config.formId;
+    }
+    if (hasForm(config)) {
+        return extractFormIdFromForm(config.form);
+    }
+    return undefined;
+}

package/dist/services/index.d.ts

@@ -8,6 +8,6 @@ export { TimeSlotListService, TimeSlotListServiceDefinition, TimeSlotService, Ti
 export { ServiceListService, ServiceListServiceDefinition, type ServiceListServiceAPI, type ServiceListServiceConfig, type ServiceListFilters, type ServiceListActions, type QueryOptions, loadServiceListServiceInitialData, type SuccessServiceListServiceConfigResult, type ErrorServiceListServiceConfigResult, } from './service-list/service-list.js';
 export { executeBookAction, canBook, buildBookingRequest, buildCheckoutRequest, type CanBookParams, type BookResult, type BookingError, type BookActionParams, type BookChildProps, type BookProps, type BuildCheckoutParams, } from './booking/book-action/index.js';
 export { BookingFormService, BookingFormServiceDefinition, type BookingFormServiceAPI, type BookingFormServiceConfig, type BookingFormServiceInternalAPI, type ValidationResult, } from './booking-form/booking-form.js';
-export { PaymentService, PaymentServiceDefinition, type PaymentServiceAPI, type PaymentServiceConfig, type PaymentDetails, type SlotService, type LineItemAdditionalInfo, loadPaymentConfig, type SuccessPaymentConfigResult, type ErrorPaymentConfigResult, } from './payment/payment.js';
+export { PaymentService, PaymentServiceDefinition, type PaymentServiceAPI, type PaymentServiceConfig, type PaymentDetails, type PricingServiceSelection, type LineItemAdditionalInfo, loadPaymentConfig, type SuccessPaymentConfigResult, type ErrorPaymentConfigResult, } from './payment/payment.js';
 export { LocationListService, LocationListServiceDefinition, LocationType, loadLocationListServiceInitialData, locationListServiceBinding, type LocationListServiceAPI, type LocationListServiceConfig, type LocationListActions, type LocationData, type DisplayLocation, type LoadLocationListServiceResult, } from './location-list/location-list.js';
 export { StaffMemberListService, StaffMemberListServiceDefinition, loadStaffMemberListServiceInitialData, staffMemberListServiceBinding, type StaffMemberListServiceAPI, type StaffMemberListServiceConfig, type StaffMemberListActions, type StaffMemberData, type LoadStaffMemberListServiceResult, } from './staff-member-list/staff-member-list.js';

package/dist/services/payment/payment.d.ts

@@ -3,8 +3,8 @@
  * Handles calculating total prices, taxes, discounts, and deposit information
  * Supports two modes: SSR (config with pre-fetched data) and lazy loading (reactive)
  */
-import { type PaymentServiceConfig, type PaymentServiceInternalConfig, type SlotService } from './payment.def.js';
-export { PaymentServiceDefinition, type PaymentServiceConfig, type PaymentDetails, type LineItemAdditionalInfo, type SlotService, } from './payment.def.js';
+import { type PaymentServiceConfig, type PaymentServiceInternalConfig, type PricingServiceSelection } from './payment.def.js';
+export { PaymentServiceDefinition, type PaymentServiceConfig, type PaymentDetails, type LineItemAdditionalInfo, type PricingServiceSelection, } from './payment.def.js';
 export type { PaymentServiceAPI, PaymentServiceInternalConfig, } from './payment.def.js';
 export declare const PaymentService: import("@wix/services-definitions").ServiceFactory<string & {
     __api: import("./payment.def.js").PaymentServiceAPI;
@@ -23,10 +23,10 @@ export type ErrorPaymentConfigResult = {
  * Load payment configuration for Server-Side Rendering (SSR).
  * Calls the pricing APIs and returns pre-calculated payment details.
  *
- * @param params.slotServices - Slot/service inputs for calculation
+ * @param params.pricingServiceSelections - Pricing service selections for calculation
  * @param params.numberOfParticipants - Number of participants (default: 1)
  */
 export declare function loadPaymentConfig(params: {
-    slotServices: SlotService[];
+    pricingServiceSelections: PricingServiceSelection[];
     numberOfParticipants?: number;
 }): Promise<SuccessPaymentConfigResult | ErrorPaymentConfigResult>;

package/dist/services/payment/payment.def.d.ts

@@ -30,9 +30,9 @@ export interface PaymentDetails {
     };
 }
 /**
- * Input for calculating payment for a slot/service
+ * Input for calculating payment for a booking service
  */
-export interface SlotService {
+export interface PricingServiceSelection {
     service: Service;
     /** Optional line item ID. If not provided, one will be generated. */
     lineItemId?: string;
@@ -50,8 +50,8 @@ export interface PaymentServiceConfig {
  * Not exposed publicly - Core merges this with PaymentServiceConfig
  */
 export interface PaymentServiceInternalConfig extends PaymentServiceConfig {
-    /** Slot services for lazy loading (internal use) */
-    slotServices?: SlotService[];
+    /** Booking services for lazy loading (internal use) */
+    pricingServiceSelections?: PricingServiceSelection[];
     /** Number of participants for lazy loading (internal use) */
     numberOfParticipants?: number;
 }

package/dist/services/payment/payment.js

@@ -60,11 +60,11 @@ function buildLineItem(service, numberOfParticipants, lineItemId) {
         paymentOption,
     };
 }
-async function calculatePaymentDetails(slotServices, numberOfParticipants) {
-    // Ensure all slot services have a lineItemId
-    const data = slotServices.map((slot) => ({
-        ...slot,
-        lineItemId: slot.lineItemId || generateLineItemId(),
+async function calculatePaymentDetails(pricingServiceSelections, numberOfParticipants) {
+    // Ensure all booking services have a lineItemId
+    const data = pricingServiceSelections.map((selection) => ({
+        ...selection,
+        lineItemId: selection.lineItemId || generateLineItemId(),
     }));
     const lineItems = data.map((item) => buildLineItem(item.service, numberOfParticipants, item.lineItemId));
     const response = await calculateTotals({
@@ -96,15 +96,15 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
     const isLoadingSignal = signalsService.signal(false);
     const errorSignal = signalsService.signal(null);
     // Internal calculate function
-    const calculate = async (slotServices, numberOfParticipants) => {
-        if (!slotServices.length) {
+    const calculate = async (pricingServiceSelections, numberOfParticipants) => {
+        if (!pricingServiceSelections.length) {
             paymentDetailsSignal.set(null);
             return;
         }
         isLoadingSignal.set(true);
         errorSignal.set(null);
         try {
-            const paymentDetails = await calculatePaymentDetails(slotServices, numberOfParticipants);
+            const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, numberOfParticipants);
             paymentDetailsSignal.set(paymentDetails);
         }
         catch (error) {
@@ -122,22 +122,30 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
     if (config.paymentDetails) {
         // No-op - data is pre-fetched
     }
-    // Mode 2: Lazy loading - slotServices provided via internal config
-    else if (config.slotServices?.length) {
-        void calculate(config.slotServices, config.numberOfParticipants ?? 1);
+    // Mode 2: Lazy loading - pricingServiceSelections provided via internal config
+    else if (config.pricingServiceSelections?.length) {
+        void calculate(config.pricingServiceSelections, config.numberOfParticipants ?? 1);
     }
     // Mode 3: Reactive - observe BookingService signals (client-side only)
     else if (typeof window !== 'undefined' && bookingService) {
-        signalsService.effect(() => {
+        // Computed signal that only changes when services change (not participants)
+        const servicesKey = signalsService.computed(() => {
             const selections = bookingService?.serviceSelections.get() || [];
+            return selections.map((s) => s.service._id).join(',');
+        });
+        signalsService.effect(() => {
+            // Subscribe to servicesKey to trigger effect only when services change
+            servicesKey.get();
+            // Read current selections without subscribing (peek)
+            const selections = bookingService?.serviceSelections.peek() || [];
             // For single service mode, take the first selection
             const firstSelection = selections[0];
             const numParticipants = firstSelection?.totalParticipants || 1;
-            const services = selections.map((selection) => ({
+            const pricingServiceSelections = selections.map((selection) => ({
                 service: selection.service,
                 lineItemId: selection.instanceId,
             }));
-            void calculate(services, numParticipants);
+            void calculate(pricingServiceSelections, numParticipants);
         });
     }
     return {
@@ -150,19 +158,19 @@ export const PaymentService = implementService.withConfig()(PaymentServiceDefini
  * Load payment configuration for Server-Side Rendering (SSR).
  * Calls the pricing APIs and returns pre-calculated payment details.
  *
- * @param params.slotServices - Slot/service inputs for calculation
+ * @param params.pricingServiceSelections - Pricing service selections for calculation
  * @param params.numberOfParticipants - Number of participants (default: 1)
  */
 export async function loadPaymentConfig(params) {
     try {
-        const { slotServices, numberOfParticipants = 1 } = params;
-        if (!slotServices.length) {
+        const { pricingServiceSelections, numberOfParticipants = 1 } = params;
+        if (!pricingServiceSelections.length) {
             return {
                 type: 'success',
                 config: { paymentDetails: undefined },
             };
         }
-        const paymentDetails = await calculatePaymentDetails(slotServices, numberOfParticipants);
+        const paymentDetails = await calculatePaymentDetails(pricingServiceSelections, numberOfParticipants);
         return {
             type: 'success',
             config: { paymentDetails },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "0.0.56",
+  "version": "0.0.58",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -36,7 +36,7 @@
     "@wix/auto_sdk_bookings_bookings": "^1.0.103",
     "@wix/auto_sdk_bookings_event-time-slots": "^1.0.64",
     "@wix/auto_sdk_ecom_checkout": "^1.0.104",
-    "@wix/form-public": "^0.64.0",
+    "@wix/form-public": "https://cdn.dev.wixpress.com/@wix/form-public/5e033ab77775b2277d596c4663a1446228270e3fc9afa7b2b85c4a94.tar.gz",
     "@wix/headless-forms": "0.0.20",
     "@wix/headless-media": "0.0.18",
     "@wix/headless-utils": "0.0.8",
@@ -72,5 +72,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "8792da90af7c78ece12ac4244e507751fbe186381decf6b266bee92a"
+  "falconPackageHash": "ccd30f51c7b5e50deedb808077fe5dfaebe97ef4f66da71d4f246455"
 }