@wix/headless-bookings 0.0.32 → 0.0.34

package/cjs/dist/__mocks__/booking.d.ts

@@ -3,15 +3,7 @@
  */
 import type { Resource } from '@wix/auto_sdk_bookings_availability-time-slots';
 import type { FormValues } from '@wix/form-public';
-import type { ServiceSelection, ServiceSelectionTimeSlot, Location, BookingServiceConfig } from '../services/booking/booking.js';
-/**
- * Mock time slot data
- */
-export declare const mockTimeSlot: ServiceSelectionTimeSlot;
-/**
- * Mock time slot for afternoon
- */
-export declare const mockTimeSlotAfternoon: ServiceSelectionTimeSlot;
+import type { ServiceSelection, ServiceSelectionTimeSlot, BookingServiceConfig } from '../services/booking/booking.js';
 /**
  * Mock resource (staff member)
  */
@@ -24,6 +16,28 @@ export declare const mockResourceTwo: Resource;
  * Mock resource (room)
  */
 export declare const mockResourceRoom: Resource;
+/**
+ * Mock location
+ */
+export declare const mockLocation: {
+    _id: string;
+    name: string;
+};
+/**
+ * Mock location (second)
+ */
+export declare const mockLocationTwo: {
+    _id: string;
+    name: string;
+};
+/**
+ * Mock time slot data
+ */
+export declare const mockTimeSlot: ServiceSelectionTimeSlot;
+/**
+ * Mock time slot for afternoon
+ */
+export declare const mockTimeSlotAfternoon: ServiceSelectionTimeSlot;
 /**
  * Mock service selection with all data
  */
@@ -36,14 +50,6 @@ export declare const mockServiceSelectionWithoutTimeSlot: ServiceSelection;
  * Mock service selection for class
  */
 export declare const mockServiceSelectionClass: ServiceSelection;
-/**
- * Mock location
- */
-export declare const mockLocation: Location;
-/**
- * Mock location (second)
- */
-export declare const mockLocationTwo: Location;
 /**
  * Mock form submission (contact info)
  */

package/cjs/dist/__mocks__/booking.js

@@ -2,26 +2,6 @@
  * Shared mock data for booking service tests
  */
 import { mockService, mockServiceClass } from './services.js';
-/**
- * Mock time slot data
- */
-export const mockTimeSlot = {
-    startDate: '2024-03-15T10:00:00Z',
-    endDate: '2024-03-15T11:00:00Z',
-    totalCapacity: 10,
-    remainingCapacity: 5,
-    scheduleId: 'schedule-123',
-};
-/**
- * Mock time slot for afternoon
- */
-export const mockTimeSlotAfternoon = {
-    startDate: '2024-03-15T14:00:00Z',
-    endDate: '2024-03-15T15:00:00Z',
-    totalCapacity: 10,
-    remainingCapacity: 8,
-    scheduleId: 'schedule-456',
-};
 /**
  * Mock resource (staff member)
  */
@@ -48,6 +28,44 @@ export const mockResourceRoom = {
     name: 'Conference Room A',
     tag: 'RESOURCE',
 };
+/**
+ * Mock location
+ */
+export const mockLocation = {
+    _id: 'location-1',
+    name: 'Main Office',
+};
+/**
+ * Mock location (second)
+ */
+export const mockLocationTwo = {
+    _id: 'location-2',
+    name: 'Downtown Branch',
+};
+/**
+ * Mock time slot data
+ */
+export const mockTimeSlot = {
+    startDate: '2024-03-15T10:00:00Z',
+    endDate: '2024-03-15T11:00:00Z',
+    totalCapacity: 10,
+    remainingCapacity: 5,
+    scheduleId: 'schedule-123',
+    resources: [mockResource],
+    location: mockLocation,
+};
+/**
+ * Mock time slot for afternoon
+ */
+export const mockTimeSlotAfternoon = {
+    startDate: '2024-03-15T14:00:00Z',
+    endDate: '2024-03-15T15:00:00Z',
+    totalCapacity: 10,
+    remainingCapacity: 8,
+    scheduleId: 'schedule-456',
+    resources: [mockResourceTwo],
+    location: mockLocationTwo,
+};
 /**
  * Mock service selection with all data
  */
@@ -77,20 +95,6 @@ export const mockServiceSelectionClass = {
     timeSlot: mockTimeSlotAfternoon,
     totalParticipants: 3,
 };
-/**
- * Mock location
- */
-export const mockLocation = {
-    id: 'location-1',
-    name: 'Main Office',
-};
-/**
- * Mock location (second)
- */
-export const mockLocationTwo = {
-    id: 'location-2',
-    name: 'Downtown Branch',
-};
 /**
  * Mock form submission (contact info)
  */

package/cjs/dist/react/core/booking/Booking.d.ts

@@ -3,8 +3,9 @@
  * Provides low-level access to BookingService via render props and service setup
  */
 import React from 'react';
-import { type BookingServiceConfig, type ServiceSelection, type Location, type BookingServiceActions } from '../../../services/booking/booking.js';
+import { type BookingServiceConfig, type ServiceSelection, type BookingServiceActions } from '../../../services/booking/booking.js';
 import type { FormValues } from '@wix/form-public';
+import type { Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 /**
  * Props for Booking.Root component
  */
@@ -34,7 +35,7 @@ export declare function Root(props: RootProps): React.ReactNode;
  */
 export interface BookingData {
     serviceSelections: ServiceSelection[];
-    location: Location | null;
+    location: TimeSlotLocationType | null;
     timezone: string | undefined;
     formSubmission: FormValues | null;
     actions: BookingServiceActions;

package/cjs/dist/react/core/time-slot-list/TimeSlot.js

@@ -31,9 +31,8 @@ export function TimeSlotProvider(props) {
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
     const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-    const selectedLocationId = bookingService.location.get()?.id;
     const isSelected = selectedTimeSlot?.startDate === timeSlot.localStartDate &&
-        selectedLocationId === timeSlot.location?._id;
+        selectedTimeSlot?.location?._id === timeSlot.location?._id;
     const selectTimeSlot = () => {
         service.actions.selectSlot(timeSlot);
     };
@@ -132,7 +131,7 @@ export function Actions(props) {
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
     const bookable = timeSlot.bookable ?? false;
-    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.resources?.[0]?._id;
+    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.timeSlot?.resources?.[0]?._id;
     const staffFromSlot = timeSlot.availableResources[0].resources.map((r) => r._id);
     const shouldShowClearStaffSelection = !!selectedStaffMemberId && staffFromSlot.length > 1;
     const clearStaffSelection = shouldShowClearStaffSelection
@@ -169,7 +168,7 @@ export function StaffMembers(props) {
     const { timeSlot } = useTimeSlotContext();
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
-    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.resources?.[0]?._id;
+    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.timeSlot?.resources?.[0]?._id;
     const staffMembers = timeSlot.availableResources[0].resources;
     // Return null if only 1 staff member - nothing to choose from
     if (staffMembers.length <= 1) {

package/cjs/dist/services/booking/book-action/bookAction.js

@@ -43,8 +43,9 @@ export async function executeBookAction(params) {
         throw new Error('Failed to create booking');
     }
     // Step 2: Create checkout
-    // businessLocationId comes from location.id for multi-location support
-    const businessLocationId = params.location?.id ?? undefined;
+    // businessLocationId: prefer timeSlot.location, fallback to global location
+    const firstSelection = params.serviceSelections[0];
+    const businessLocationId = firstSelection?.timeSlot?.location?._id ?? undefined;
     const checkoutRequest = buildCheckoutRequest({
         bookingId,
         contactDetails,

package/cjs/dist/services/booking/book-action/buildBookingRequest.js

@@ -46,8 +46,10 @@ export function buildBookingRequest(params) {
     if (!item.timeSlot) {
         throw new Error('No time slot selected for service selection');
     }
-    // Get resource from service selection
-    const resource = item.resources?.[0];
+    // Get resource: prefer timeSlot.resources, fallback to item.resources
+    const resource = item.timeSlot.resources?.[0] ?? item.resources?.[0];
+    // Get location: prefer timeSlot.location, fallback to params.location
+    const slotLocation = item.timeSlot.location ?? location;
     return {
         booking: {
             // Payment option derived from service payment settings
@@ -66,8 +68,8 @@ export function buildBookingRequest(params) {
                     resource: resource
                         ? { _id: resource._id, name: resource.name }
                         : undefined,
-                    location: location
-                        ? { _id: location.id, name: location.name }
+                    location: slotLocation
+                        ? { _id: slotLocation._id, name: slotLocation.name }
                         : undefined,
                 },
             },

package/cjs/dist/services/booking/book-action/types.d.ts

@@ -1,8 +1,9 @@
 /**
  * Types for the Book action
  */
-import type { ServiceSelection, Location } from '../booking.js';
+import type { ServiceSelection } from '../booking.js';
 import type { FormValues } from '@wix/form-public';
+import type { Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 /**
  * Result returned from the book action
  */
@@ -21,7 +22,7 @@ export interface BookingError {
  */
 export interface BookActionParams {
     serviceSelections: ServiceSelection[];
-    location: Location | null;
+    location: TimeSlotLocationType | null;
     formSubmission: FormValues | null;
     timezone?: string;
 }

package/cjs/dist/services/booking/booking.d.ts

@@ -4,8 +4,8 @@
  * Persists across page navigation in SPA until page refresh
  */
 import { type Signal } from '@wix/services-definitions/core-services/signals';
-import type { Service } from '@wix/auto_sdk_bookings_services';
-import type { Resource, EventInfo } from '@wix/auto_sdk_bookings_availability-time-slots';
+import type { Service, Location as ServiceLocationType } from '@wix/auto_sdk_bookings_services';
+import type { Resource, EventInfo, Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 import type { FormValues } from '@wix/form-public';
 import type { BookResult } from './book-action/types.js';
 export declare const ANY_STAFF_MEMBER_ID = "__any_staff_member__";
@@ -19,6 +19,10 @@ export interface ServiceSelectionTimeSlot {
     remainingCapacity?: number;
     scheduleId?: string;
     eventInfo?: EventInfo;
+    /** Resources available in this time slot (populated when slot is selected) */
+    resources?: Resource[];
+    /** Location of this time slot (populated when slot is selected) */
+    location?: TimeSlotLocationType;
 }
 /**
  * ServiceSelection contains the service AND its related selections
@@ -35,10 +39,6 @@ export interface ServiceSelection {
     /** Number of participants for this service selection */
     totalParticipants?: number;
 }
-export interface Location {
-    id: string;
-    name?: string;
-}
 /**
  * BookingService actions - setters only, no API calls
  */
@@ -57,7 +57,7 @@ export interface BookingServiceActions {
     setResourceById(resourceId: string, resource: Resource, instanceId?: string): void;
     /** Gets a resource by ID from a service selection. If no instanceId provided, uses the first item. */
     getResourceById(resourceId: string, instanceId?: string): Resource | undefined;
-    setLocation(location: Location | null): void;
+    setLocation(location: ServiceLocationType | null): void;
     clearLocation(): void;
     setTimezone(timezone: string): void;
     setFormSubmission(values: FormValues | null): void;
@@ -73,7 +73,7 @@ export interface BookingService {
     /** Signal containing the service selections (services with their related data) */
     serviceSelections: Signal<ServiceSelection[]>;
     /** Signal containing the selected location */
-    location: Signal<Location | null>;
+    location: Signal<ServiceLocationType | null>;
     /** Signal containing the selected timezone */
     timezone: Signal<string | undefined>;
     /** Signal containing the form submission */
@@ -97,7 +97,7 @@ export interface BookingServiceConfig {
     /** Optional initial service selections to pre-populate */
     serviceSelections?: ServiceSelection[];
     /** Optional initial location */
-    location?: Location | null;
+    location?: ServiceLocationType | null;
     /** Optional initial timezone */
     timezone?: string;
     /** Optional initial form submission */

package/cjs/dist/services/index.d.ts

@@ -3,7 +3,7 @@
  * Main export file for all service definitions and implementations
  */
 export { ServiceService, ServiceServiceDefinition, type ServiceServiceAPI, type ServiceServiceConfig, type ServiceActions, type ServicePaymentData, loadServiceServiceInitialData, type SuccessServiceServiceConfigResult, type NotFoundServiceServiceConfigResult, } from './service/service.js';
-export { BookingService, BookingServiceDefinition, type BookingServiceConfig, type Location, type BookingServiceActions, type ServiceSelection, type ServiceSelectionTimeSlot, } from './booking/booking.js';
+export { BookingService, BookingServiceDefinition, type BookingServiceConfig, type BookingServiceActions, type ServiceSelection, type ServiceSelectionTimeSlot, } from './booking/booking.js';
 export { TimeSlotListService, TimeSlotListServiceDefinition, ViewMode, loadTimeSlotListConfig, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type LoadTimeSlotListConfigOptions, type LoadTimeSlotListConfigResult, } from './time-slot-list/index.js';
 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';

package/cjs/dist/services/time-slot-list/time-slot-list.js

@@ -3,7 +3,7 @@
  * Manages time slot fetching, selection, and state
  */
 import { implementService } from '@wix/services-definitions';
-import { SignalsServiceDefinition } from '@wix/services-definitions/core-services/signals';
+import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
 import { TimeSlotListServiceDefinition, ViewMode, } from './time-slot-list.def.js';
 import { fetchAvailability } from '../../api/fetch-availability/index.js';
 import { BookingServiceDefinition, ANY_STAFF_MEMBER_ID, } from '../booking/booking.js';
@@ -44,27 +44,58 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         }
         return config.services ?? [];
     };
+    /**
+     * Helper: Get filters combining config with booking overrides
+     * Uses location and resources from booking if they exist (not from the slot)
+     */
+    const getFilters = () => {
+        const baseFilters = config.filters ?? {};
+        const selectedStaffMembersIds = bookingService.serviceSelections
+            .get()[0]
+            ?.resources?.map((resource) => resource._id);
+        const staffMemberIds = selectedStaffMembersIds?.length
+            ? selectedStaffMembersIds
+            : baseFilters.staffMemberIds;
+        const selectedLocation = bookingService.location.get();
+        const location = selectedLocation
+            ? {
+                id: selectedLocation._id,
+                locationType: selectedLocation.type,
+            }
+            : baseFilters.location;
+        return {
+            ...baseFilters,
+            location,
+            staffMemberIds,
+        };
+    };
     /**
      * Fetch time slots from API
-     * Called on initialization or when filters change
+     * If cursor is provided, appends to existing slots (pagination)
+     * If no cursor, resets state and fetches fresh slots
      */
-    const fetchTimeSlots = async () => {
-        const selectedServices = getServices();
+    const fetchTimeSlots = async ({ isLoadMore } = { isLoadMore: false }) => {
+        if (isLoadingSignal.get() || (isLoadMore && !cursorSignal.get())) {
+            return;
+        }
+        const cursor = isLoadMore ? cursorSignal.get() : undefined;
         isLoadingSignal.set(true);
         errorSignal.set(null);
-        cursorSignal.set(undefined);
-        timeSlotsSignal.set([]);
+        if (!isLoadMore) {
+            timeSlotsSignal.set([]);
+        }
         try {
             const response = await fetchAvailability({
-                services: selectedServices,
+                services: getServices(),
                 fromLocalDate: startDateSignal.get(),
                 toLocalDate: endDateSignal.get(),
                 timeZone: bookingService.timezone.get(),
                 viewMode: viewModeSignal.get(),
-                cursor: cursorSignal.get(),
-                ...config.filters,
+                cursor,
+                ...getFilters(),
             });
-            timeSlotsSignal.set(response.timeSlots);
+            const newSlots = response.timeSlots;
+            timeSlotsSignal.set(isLoadMore ? [...timeSlotsSignal.get(), ...newSlots] : newSlots);
             const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
             cursorSignal.set(nextCursor);
             hasMoreSignal.set(!!nextCursor);
@@ -72,7 +103,9 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         catch (error) {
             const message = error instanceof Error
                 ? error.message
-                : 'Failed to load time slots';
+                : isLoadMore
+                    ? 'Failed to load more time slots'
+                    : 'Failed to load time slots';
             errorSignal.set(message);
         }
         finally {
@@ -86,26 +119,23 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * - Auto-selects staff only when there is exactly one staff option in this slot
      */
     const selectSlot = (slot) => {
+        const staffMembersFromSlot = slot.availableResources[0].resources.map((r) => ({
+            _id: r._id,
+            name: r.name,
+        }));
+        const resources = staffMembersFromSlot.length === 1 ? staffMembersFromSlot : [];
         const timeSlot = {
             startDate: slot.localStartDate,
             endDate: slot.localEndDate,
             totalCapacity: slot.totalCapacity ?? undefined,
             remainingCapacity: slot.remainingCapacity ?? undefined,
             scheduleId: slot.scheduleId ?? undefined,
-            eventInfo: slot.eventInfo ?? undefined,
+            eventInfo: slot.eventInfo,
+            location: slot.location,
+            resources,
         };
-        bookingService.actions.setLocation({
-            id: slot.location?._id,
-            name: slot.location?.name ?? undefined,
-        });
-        const staffMembersFromSlot = slot.availableResources[0].resources.map((r) => ({
-            id: r._id,
-            name: r.name,
-        }));
-        const resources = staffMembersFromSlot.length === 1 ? staffMembersFromSlot : [];
         bookingService.actions.updateItem({
             timeSlot,
-            resources,
         });
     };
     /**
@@ -113,82 +143,46 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Updates the booking service with the selected resource
      */
     const selectStaffMember = (staffMemberId) => {
-        const selectedBookingTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-        if (!selectedBookingTimeSlot)
+        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        if (!selectedTimeSlot)
             return;
-        const findStaffName = (id) => {
+        const getStaffName = (id) => {
+            if (id === ANY_STAFF_MEMBER_ID)
+                return 'Any staff member';
             const slots = timeSlotsSignal.get();
             return (slots
                 .flatMap((slot) => slot.availableResources[0].resources)
                 .find((r) => r._id === id)?.name ?? undefined);
         };
-        if (staffMemberId === ANY_STAFF_MEMBER_ID) {
-            bookingService.actions.updateItem({
-                resources: [
-                    {
-                        _id: ANY_STAFF_MEMBER_ID,
-                        name: 'Any staff member',
-                    },
-                ],
-            });
-            return;
-        }
+        const resources = [
+            {
+                _id: staffMemberId,
+                name: getStaffName(staffMemberId),
+            },
+        ];
         bookingService.actions.updateItem({
-            resources: [
-                {
-                    _id: staffMemberId,
-                    name: findStaffName(staffMemberId),
-                },
-            ],
+            timeSlot: {
+                ...selectedTimeSlot,
+                resources,
+            },
         });
     };
     /**
      * Action: Clear staff selection while keeping the selected time slot
      */
     const clearStaffSelection = () => {
-        const selectedBookingTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-        if (!selectedBookingTimeSlot)
+        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        if (!selectedTimeSlot)
             return;
         bookingService.actions.updateItem({
-            resources: [],
+            timeSlot: { ...selectedTimeSlot, resources: [] },
         });
     };
     /**
      * Action: Load more slots (pagination)
      */
     const loadMore = async () => {
-        const cursor = cursorSignal.get();
-        if (!cursor || isLoadingSignal.get())
-            return;
-        const selectedServices = getServices();
-        isLoadingSignal.set(true);
-        try {
-            const response = await fetchAvailability({
-                services: selectedServices,
-                fromLocalDate: startDateSignal.get(),
-                toLocalDate: endDateSignal.get(),
-                timeZone: bookingService.timezone.get(),
-                cursor,
-                viewMode: viewModeSignal.get(),
-                ...config.filters,
-            });
-            timeSlotsSignal.set([
-                ...timeSlotsSignal.get(),
-                ...response.timeSlots,
-            ]);
-            const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
-            cursorSignal.set(nextCursor);
-            hasMoreSignal.set(!!nextCursor);
-        }
-        catch (error) {
-            const message = error instanceof Error
-                ? error.message
-                : 'Failed to load more time slots';
-            errorSignal.set(message);
-        }
-        finally {
-            isLoadingSignal.set(false);
-        }
+        return fetchTimeSlots({ isLoadMore: true });
     };
     /**
      * Action: Update date range and refetch slots
@@ -202,22 +196,19 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         }
         startDateSignal.set(newStartDate);
         endDateSignal.set(newEndDate);
-        fetchTimeSlots();
     };
-    // Auto-fetch on initialization if no pre-loaded data provided
-    if (!config.timeSlots) {
-        fetchTimeSlots();
-    }
-    // Subscribe to timezone changes from BookingService to auto-refetch
-    // NOTE: This should depend ONLY on bookingService.timezone.
-    let firstTimezoneEffectRun = true;
+    const resourcesSignal = signalsService.computed(() => {
+        return bookingService.serviceSelections.get()[0]?.resources;
+    });
+    let isFirstRun = true;
     signalsService.effect(() => {
         bookingService.timezone.get();
-        if (firstTimezoneEffectRun) {
-            firstTimezoneEffectRun = false;
-            return;
+        bookingService.location.get();
+        resourcesSignal.get();
+        if (!isFirstRun || !config.timeSlots) {
+            fetchTimeSlots();
         }
-        fetchTimeSlots();
+        isFirstRun = false;
     });
     // Return service API
     return {

package/dist/__mocks__/booking.d.ts

@@ -3,15 +3,7 @@
  */
 import type { Resource } from '@wix/auto_sdk_bookings_availability-time-slots';
 import type { FormValues } from '@wix/form-public';
-import type { ServiceSelection, ServiceSelectionTimeSlot, Location, BookingServiceConfig } from '../services/booking/booking.js';
-/**
- * Mock time slot data
- */
-export declare const mockTimeSlot: ServiceSelectionTimeSlot;
-/**
- * Mock time slot for afternoon
- */
-export declare const mockTimeSlotAfternoon: ServiceSelectionTimeSlot;
+import type { ServiceSelection, ServiceSelectionTimeSlot, BookingServiceConfig } from '../services/booking/booking.js';
 /**
  * Mock resource (staff member)
  */
@@ -24,6 +16,28 @@ export declare const mockResourceTwo: Resource;
  * Mock resource (room)
  */
 export declare const mockResourceRoom: Resource;
+/**
+ * Mock location
+ */
+export declare const mockLocation: {
+    _id: string;
+    name: string;
+};
+/**
+ * Mock location (second)
+ */
+export declare const mockLocationTwo: {
+    _id: string;
+    name: string;
+};
+/**
+ * Mock time slot data
+ */
+export declare const mockTimeSlot: ServiceSelectionTimeSlot;
+/**
+ * Mock time slot for afternoon
+ */
+export declare const mockTimeSlotAfternoon: ServiceSelectionTimeSlot;
 /**
  * Mock service selection with all data
  */
@@ -36,14 +50,6 @@ export declare const mockServiceSelectionWithoutTimeSlot: ServiceSelection;
  * Mock service selection for class
  */
 export declare const mockServiceSelectionClass: ServiceSelection;
-/**
- * Mock location
- */
-export declare const mockLocation: Location;
-/**
- * Mock location (second)
- */
-export declare const mockLocationTwo: Location;
 /**
  * Mock form submission (contact info)
  */

package/dist/__mocks__/booking.js

@@ -2,26 +2,6 @@
  * Shared mock data for booking service tests
  */
 import { mockService, mockServiceClass } from './services.js';
-/**
- * Mock time slot data
- */
-export const mockTimeSlot = {
-    startDate: '2024-03-15T10:00:00Z',
-    endDate: '2024-03-15T11:00:00Z',
-    totalCapacity: 10,
-    remainingCapacity: 5,
-    scheduleId: 'schedule-123',
-};
-/**
- * Mock time slot for afternoon
- */
-export const mockTimeSlotAfternoon = {
-    startDate: '2024-03-15T14:00:00Z',
-    endDate: '2024-03-15T15:00:00Z',
-    totalCapacity: 10,
-    remainingCapacity: 8,
-    scheduleId: 'schedule-456',
-};
 /**
  * Mock resource (staff member)
  */
@@ -48,6 +28,44 @@ export const mockResourceRoom = {
     name: 'Conference Room A',
     tag: 'RESOURCE',
 };
+/**
+ * Mock location
+ */
+export const mockLocation = {
+    _id: 'location-1',
+    name: 'Main Office',
+};
+/**
+ * Mock location (second)
+ */
+export const mockLocationTwo = {
+    _id: 'location-2',
+    name: 'Downtown Branch',
+};
+/**
+ * Mock time slot data
+ */
+export const mockTimeSlot = {
+    startDate: '2024-03-15T10:00:00Z',
+    endDate: '2024-03-15T11:00:00Z',
+    totalCapacity: 10,
+    remainingCapacity: 5,
+    scheduleId: 'schedule-123',
+    resources: [mockResource],
+    location: mockLocation,
+};
+/**
+ * Mock time slot for afternoon
+ */
+export const mockTimeSlotAfternoon = {
+    startDate: '2024-03-15T14:00:00Z',
+    endDate: '2024-03-15T15:00:00Z',
+    totalCapacity: 10,
+    remainingCapacity: 8,
+    scheduleId: 'schedule-456',
+    resources: [mockResourceTwo],
+    location: mockLocationTwo,
+};
 /**
  * Mock service selection with all data
  */
@@ -77,20 +95,6 @@ export const mockServiceSelectionClass = {
     timeSlot: mockTimeSlotAfternoon,
     totalParticipants: 3,
 };
-/**
- * Mock location
- */
-export const mockLocation = {
-    id: 'location-1',
-    name: 'Main Office',
-};
-/**
- * Mock location (second)
- */
-export const mockLocationTwo = {
-    id: 'location-2',
-    name: 'Downtown Branch',
-};
 /**
  * Mock form submission (contact info)
  */

package/dist/react/core/booking/Booking.d.ts

@@ -3,8 +3,9 @@
  * Provides low-level access to BookingService via render props and service setup
  */
 import React from 'react';
-import { type BookingServiceConfig, type ServiceSelection, type Location, type BookingServiceActions } from '../../../services/booking/booking.js';
+import { type BookingServiceConfig, type ServiceSelection, type BookingServiceActions } from '../../../services/booking/booking.js';
 import type { FormValues } from '@wix/form-public';
+import type { Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 /**
  * Props for Booking.Root component
  */
@@ -34,7 +35,7 @@ export declare function Root(props: RootProps): React.ReactNode;
  */
 export interface BookingData {
     serviceSelections: ServiceSelection[];
-    location: Location | null;
+    location: TimeSlotLocationType | null;
     timezone: string | undefined;
     formSubmission: FormValues | null;
     actions: BookingServiceActions;

package/dist/react/core/time-slot-list/TimeSlot.js

@@ -31,9 +31,8 @@ export function TimeSlotProvider(props) {
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
     const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-    const selectedLocationId = bookingService.location.get()?.id;
     const isSelected = selectedTimeSlot?.startDate === timeSlot.localStartDate &&
-        selectedLocationId === timeSlot.location?._id;
+        selectedTimeSlot?.location?._id === timeSlot.location?._id;
     const selectTimeSlot = () => {
         service.actions.selectSlot(timeSlot);
     };
@@ -132,7 +131,7 @@ export function Actions(props) {
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
     const bookable = timeSlot.bookable ?? false;
-    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.resources?.[0]?._id;
+    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.timeSlot?.resources?.[0]?._id;
     const staffFromSlot = timeSlot.availableResources[0].resources.map((r) => r._id);
     const shouldShowClearStaffSelection = !!selectedStaffMemberId && staffFromSlot.length > 1;
     const clearStaffSelection = shouldShowClearStaffSelection
@@ -169,7 +168,7 @@ export function StaffMembers(props) {
     const { timeSlot } = useTimeSlotContext();
     const service = useService(TimeSlotListServiceDefinition);
     const bookingService = useService(BookingServiceDefinition);
-    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.resources?.[0]?._id;
+    const selectedStaffMemberId = bookingService.serviceSelections.get()[0]?.timeSlot?.resources?.[0]?._id;
     const staffMembers = timeSlot.availableResources[0].resources;
     // Return null if only 1 staff member - nothing to choose from
     if (staffMembers.length <= 1) {

package/dist/services/booking/book-action/bookAction.js

@@ -43,8 +43,9 @@ export async function executeBookAction(params) {
         throw new Error('Failed to create booking');
     }
     // Step 2: Create checkout
-    // businessLocationId comes from location.id for multi-location support
-    const businessLocationId = params.location?.id ?? undefined;
+    // businessLocationId: prefer timeSlot.location, fallback to global location
+    const firstSelection = params.serviceSelections[0];
+    const businessLocationId = firstSelection?.timeSlot?.location?._id ?? undefined;
     const checkoutRequest = buildCheckoutRequest({
         bookingId,
         contactDetails,

package/dist/services/booking/book-action/buildBookingRequest.js

@@ -46,8 +46,10 @@ export function buildBookingRequest(params) {
     if (!item.timeSlot) {
         throw new Error('No time slot selected for service selection');
     }
-    // Get resource from service selection
-    const resource = item.resources?.[0];
+    // Get resource: prefer timeSlot.resources, fallback to item.resources
+    const resource = item.timeSlot.resources?.[0] ?? item.resources?.[0];
+    // Get location: prefer timeSlot.location, fallback to params.location
+    const slotLocation = item.timeSlot.location ?? location;
     return {
         booking: {
             // Payment option derived from service payment settings
@@ -66,8 +68,8 @@ export function buildBookingRequest(params) {
                     resource: resource
                         ? { _id: resource._id, name: resource.name }
                         : undefined,
-                    location: location
-                        ? { _id: location.id, name: location.name }
+                    location: slotLocation
+                        ? { _id: slotLocation._id, name: slotLocation.name }
                         : undefined,
                 },
             },

package/dist/services/booking/book-action/types.d.ts

@@ -1,8 +1,9 @@
 /**
  * Types for the Book action
  */
-import type { ServiceSelection, Location } from '../booking.js';
+import type { ServiceSelection } from '../booking.js';
 import type { FormValues } from '@wix/form-public';
+import type { Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 /**
  * Result returned from the book action
  */
@@ -21,7 +22,7 @@ export interface BookingError {
  */
 export interface BookActionParams {
     serviceSelections: ServiceSelection[];
-    location: Location | null;
+    location: TimeSlotLocationType | null;
     formSubmission: FormValues | null;
     timezone?: string;
 }

package/dist/services/booking/booking.d.ts

@@ -4,8 +4,8 @@
  * Persists across page navigation in SPA until page refresh
  */
 import { type Signal } from '@wix/services-definitions/core-services/signals';
-import type { Service } from '@wix/auto_sdk_bookings_services';
-import type { Resource, EventInfo } from '@wix/auto_sdk_bookings_availability-time-slots';
+import type { Service, Location as ServiceLocationType } from '@wix/auto_sdk_bookings_services';
+import type { Resource, EventInfo, Location as TimeSlotLocationType } from '@wix/auto_sdk_bookings_availability-time-slots';
 import type { FormValues } from '@wix/form-public';
 import type { BookResult } from './book-action/types.js';
 export declare const ANY_STAFF_MEMBER_ID = "__any_staff_member__";
@@ -19,6 +19,10 @@ export interface ServiceSelectionTimeSlot {
     remainingCapacity?: number;
     scheduleId?: string;
     eventInfo?: EventInfo;
+    /** Resources available in this time slot (populated when slot is selected) */
+    resources?: Resource[];
+    /** Location of this time slot (populated when slot is selected) */
+    location?: TimeSlotLocationType;
 }
 /**
  * ServiceSelection contains the service AND its related selections
@@ -35,10 +39,6 @@ export interface ServiceSelection {
     /** Number of participants for this service selection */
     totalParticipants?: number;
 }
-export interface Location {
-    id: string;
-    name?: string;
-}
 /**
  * BookingService actions - setters only, no API calls
  */
@@ -57,7 +57,7 @@ export interface BookingServiceActions {
     setResourceById(resourceId: string, resource: Resource, instanceId?: string): void;
     /** Gets a resource by ID from a service selection. If no instanceId provided, uses the first item. */
     getResourceById(resourceId: string, instanceId?: string): Resource | undefined;
-    setLocation(location: Location | null): void;
+    setLocation(location: ServiceLocationType | null): void;
     clearLocation(): void;
     setTimezone(timezone: string): void;
     setFormSubmission(values: FormValues | null): void;
@@ -73,7 +73,7 @@ export interface BookingService {
     /** Signal containing the service selections (services with their related data) */
     serviceSelections: Signal<ServiceSelection[]>;
     /** Signal containing the selected location */
-    location: Signal<Location | null>;
+    location: Signal<ServiceLocationType | null>;
     /** Signal containing the selected timezone */
     timezone: Signal<string | undefined>;
     /** Signal containing the form submission */
@@ -97,7 +97,7 @@ export interface BookingServiceConfig {
     /** Optional initial service selections to pre-populate */
     serviceSelections?: ServiceSelection[];
     /** Optional initial location */
-    location?: Location | null;
+    location?: ServiceLocationType | null;
     /** Optional initial timezone */
     timezone?: string;
     /** Optional initial form submission */

package/dist/services/index.d.ts

@@ -3,7 +3,7 @@
  * Main export file for all service definitions and implementations
  */
 export { ServiceService, ServiceServiceDefinition, type ServiceServiceAPI, type ServiceServiceConfig, type ServiceActions, type ServicePaymentData, loadServiceServiceInitialData, type SuccessServiceServiceConfigResult, type NotFoundServiceServiceConfigResult, } from './service/service.js';
-export { BookingService, BookingServiceDefinition, type BookingServiceConfig, type Location, type BookingServiceActions, type ServiceSelection, type ServiceSelectionTimeSlot, } from './booking/booking.js';
+export { BookingService, BookingServiceDefinition, type BookingServiceConfig, type BookingServiceActions, type ServiceSelection, type ServiceSelectionTimeSlot, } from './booking/booking.js';
 export { TimeSlotListService, TimeSlotListServiceDefinition, ViewMode, loadTimeSlotListConfig, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type LoadTimeSlotListConfigOptions, type LoadTimeSlotListConfigResult, } from './time-slot-list/index.js';
 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';

package/dist/services/time-slot-list/time-slot-list.js

@@ -3,7 +3,7 @@
  * Manages time slot fetching, selection, and state
  */
 import { implementService } from '@wix/services-definitions';
-import { SignalsServiceDefinition } from '@wix/services-definitions/core-services/signals';
+import { SignalsServiceDefinition, } from '@wix/services-definitions/core-services/signals';
 import { TimeSlotListServiceDefinition, ViewMode, } from './time-slot-list.def.js';
 import { fetchAvailability } from '../../api/fetch-availability/index.js';
 import { BookingServiceDefinition, ANY_STAFF_MEMBER_ID, } from '../booking/booking.js';
@@ -44,27 +44,58 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         }
         return config.services ?? [];
     };
+    /**
+     * Helper: Get filters combining config with booking overrides
+     * Uses location and resources from booking if they exist (not from the slot)
+     */
+    const getFilters = () => {
+        const baseFilters = config.filters ?? {};
+        const selectedStaffMembersIds = bookingService.serviceSelections
+            .get()[0]
+            ?.resources?.map((resource) => resource._id);
+        const staffMemberIds = selectedStaffMembersIds?.length
+            ? selectedStaffMembersIds
+            : baseFilters.staffMemberIds;
+        const selectedLocation = bookingService.location.get();
+        const location = selectedLocation
+            ? {
+                id: selectedLocation._id,
+                locationType: selectedLocation.type,
+            }
+            : baseFilters.location;
+        return {
+            ...baseFilters,
+            location,
+            staffMemberIds,
+        };
+    };
     /**
      * Fetch time slots from API
-     * Called on initialization or when filters change
+     * If cursor is provided, appends to existing slots (pagination)
+     * If no cursor, resets state and fetches fresh slots
      */
-    const fetchTimeSlots = async () => {
-        const selectedServices = getServices();
+    const fetchTimeSlots = async ({ isLoadMore } = { isLoadMore: false }) => {
+        if (isLoadingSignal.get() || (isLoadMore && !cursorSignal.get())) {
+            return;
+        }
+        const cursor = isLoadMore ? cursorSignal.get() : undefined;
         isLoadingSignal.set(true);
         errorSignal.set(null);
-        cursorSignal.set(undefined);
-        timeSlotsSignal.set([]);
+        if (!isLoadMore) {
+            timeSlotsSignal.set([]);
+        }
         try {
             const response = await fetchAvailability({
-                services: selectedServices,
+                services: getServices(),
                 fromLocalDate: startDateSignal.get(),
                 toLocalDate: endDateSignal.get(),
                 timeZone: bookingService.timezone.get(),
                 viewMode: viewModeSignal.get(),
-                cursor: cursorSignal.get(),
-                ...config.filters,
+                cursor,
+                ...getFilters(),
             });
-            timeSlotsSignal.set(response.timeSlots);
+            const newSlots = response.timeSlots;
+            timeSlotsSignal.set(isLoadMore ? [...timeSlotsSignal.get(), ...newSlots] : newSlots);
             const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
             cursorSignal.set(nextCursor);
             hasMoreSignal.set(!!nextCursor);
@@ -72,7 +103,9 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         catch (error) {
             const message = error instanceof Error
                 ? error.message
-                : 'Failed to load time slots';
+                : isLoadMore
+                    ? 'Failed to load more time slots'
+                    : 'Failed to load time slots';
             errorSignal.set(message);
         }
         finally {
@@ -86,26 +119,23 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * - Auto-selects staff only when there is exactly one staff option in this slot
      */
     const selectSlot = (slot) => {
+        const staffMembersFromSlot = slot.availableResources[0].resources.map((r) => ({
+            _id: r._id,
+            name: r.name,
+        }));
+        const resources = staffMembersFromSlot.length === 1 ? staffMembersFromSlot : [];
         const timeSlot = {
             startDate: slot.localStartDate,
             endDate: slot.localEndDate,
             totalCapacity: slot.totalCapacity ?? undefined,
             remainingCapacity: slot.remainingCapacity ?? undefined,
             scheduleId: slot.scheduleId ?? undefined,
-            eventInfo: slot.eventInfo ?? undefined,
+            eventInfo: slot.eventInfo,
+            location: slot.location,
+            resources,
         };
-        bookingService.actions.setLocation({
-            id: slot.location?._id,
-            name: slot.location?.name ?? undefined,
-        });
-        const staffMembersFromSlot = slot.availableResources[0].resources.map((r) => ({
-            id: r._id,
-            name: r.name,
-        }));
-        const resources = staffMembersFromSlot.length === 1 ? staffMembersFromSlot : [];
         bookingService.actions.updateItem({
             timeSlot,
-            resources,
         });
     };
     /**
@@ -113,82 +143,46 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Updates the booking service with the selected resource
      */
     const selectStaffMember = (staffMemberId) => {
-        const selectedBookingTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-        if (!selectedBookingTimeSlot)
+        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        if (!selectedTimeSlot)
             return;
-        const findStaffName = (id) => {
+        const getStaffName = (id) => {
+            if (id === ANY_STAFF_MEMBER_ID)
+                return 'Any staff member';
             const slots = timeSlotsSignal.get();
             return (slots
                 .flatMap((slot) => slot.availableResources[0].resources)
                 .find((r) => r._id === id)?.name ?? undefined);
         };
-        if (staffMemberId === ANY_STAFF_MEMBER_ID) {
-            bookingService.actions.updateItem({
-                resources: [
-                    {
-                        _id: ANY_STAFF_MEMBER_ID,
-                        name: 'Any staff member',
-                    },
-                ],
-            });
-            return;
-        }
+        const resources = [
+            {
+                _id: staffMemberId,
+                name: getStaffName(staffMemberId),
+            },
+        ];
         bookingService.actions.updateItem({
-            resources: [
-                {
-                    _id: staffMemberId,
-                    name: findStaffName(staffMemberId),
-                },
-            ],
+            timeSlot: {
+                ...selectedTimeSlot,
+                resources,
+            },
         });
     };
     /**
      * Action: Clear staff selection while keeping the selected time slot
      */
     const clearStaffSelection = () => {
-        const selectedBookingTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
-        if (!selectedBookingTimeSlot)
+        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        if (!selectedTimeSlot)
             return;
         bookingService.actions.updateItem({
-            resources: [],
+            timeSlot: { ...selectedTimeSlot, resources: [] },
         });
     };
     /**
      * Action: Load more slots (pagination)
      */
     const loadMore = async () => {
-        const cursor = cursorSignal.get();
-        if (!cursor || isLoadingSignal.get())
-            return;
-        const selectedServices = getServices();
-        isLoadingSignal.set(true);
-        try {
-            const response = await fetchAvailability({
-                services: selectedServices,
-                fromLocalDate: startDateSignal.get(),
-                toLocalDate: endDateSignal.get(),
-                timeZone: bookingService.timezone.get(),
-                cursor,
-                viewMode: viewModeSignal.get(),
-                ...config.filters,
-            });
-            timeSlotsSignal.set([
-                ...timeSlotsSignal.get(),
-                ...response.timeSlots,
-            ]);
-            const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
-            cursorSignal.set(nextCursor);
-            hasMoreSignal.set(!!nextCursor);
-        }
-        catch (error) {
-            const message = error instanceof Error
-                ? error.message
-                : 'Failed to load more time slots';
-            errorSignal.set(message);
-        }
-        finally {
-            isLoadingSignal.set(false);
-        }
+        return fetchTimeSlots({ isLoadMore: true });
     };
     /**
      * Action: Update date range and refetch slots
@@ -202,22 +196,19 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         }
         startDateSignal.set(newStartDate);
         endDateSignal.set(newEndDate);
-        fetchTimeSlots();
     };
-    // Auto-fetch on initialization if no pre-loaded data provided
-    if (!config.timeSlots) {
-        fetchTimeSlots();
-    }
-    // Subscribe to timezone changes from BookingService to auto-refetch
-    // NOTE: This should depend ONLY on bookingService.timezone.
-    let firstTimezoneEffectRun = true;
+    const resourcesSignal = signalsService.computed(() => {
+        return bookingService.serviceSelections.get()[0]?.resources;
+    });
+    let isFirstRun = true;
     signalsService.effect(() => {
         bookingService.timezone.get();
-        if (firstTimezoneEffectRun) {
-            firstTimezoneEffectRun = false;
-            return;
+        bookingService.location.get();
+        resourcesSignal.get();
+        if (!isFirstRun || !config.timeSlots) {
+            fetchTimeSlots();
         }
-        fetchTimeSlots();
+        isFirstRun = false;
     });
     // Return service API
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "0.0.32",
+  "version": "0.0.34",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -72,5 +72,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "b165685e9ccb4d9fe0e8d310393e59018c8d44c874e2c7cd0fc9906a"
+  "falconPackageHash": "b195003cbc18c0477da02f42dd5e5409c483f2de627832cbdb859424"
 }