@wix/headless-bookings 0.0.35 → 0.0.37

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

@@ -106,9 +106,10 @@ export function ListData(props) {
  */
 export function DateRange(props) {
     const service = useService(TimeSlotListServiceDefinition);
+    const dateRange = service.dateRange.get();
     return props.children({
-        startDate: service.startDate.get(),
-        endDate: service.endDate.get(),
+        startDate: dateRange.start,
+        endDate: dateRange.end,
         setDateRange: service.actions.setDateRange,
     });
 }

package/cjs/dist/services/time-slot-list/index.d.ts

@@ -2,5 +2,5 @@
  * TimeSlotList Service
  * Main export file for time slot list service
  */
-export { TimeSlotListServiceDefinition, ViewMode, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type TimeSlotsFilters, } from './time-slot-list.def.js';
+export { TimeSlotListServiceDefinition, ViewMode, type DateRange, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type TimeSlotsFilters, } from './time-slot-list.def.js';
 export { TimeSlotListService, loadTimeSlotListConfig, type LoadTimeSlotListConfigOptions, type LoadTimeSlotListConfigResult, } from './time-slot-list.js';

package/cjs/dist/services/time-slot-list/time-slot-list.def.d.ts

@@ -77,13 +77,16 @@ export interface TimeSlotListServiceActions {
     loadMore: () => Promise<void>;
     setDateRange: (start: Date, end: Date) => void;
 }
+export interface DateRange {
+    start: Date;
+    end: Date;
+}
 export interface TimeSlotListServiceAPI {
     timeSlots: Signal<TimeSlot[]>;
     isLoading: Signal<boolean>;
     error: Signal<string | null>;
     hasMore: Signal<boolean>;
-    startDate: Signal<Date>;
-    endDate: Signal<Date>;
+    dateRange: Signal<DateRange>;
     actions: TimeSlotListServiceActions;
 }
 export declare const TimeSlotListServiceDefinition: string & {

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';
@@ -29,73 +29,45 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
     const hasMoreSignal = signalsService.signal(false);
     // Internal only - viewMode is auto-detected based on service types
     const viewModeSignal = signalsService.signal(ViewMode.CLASSIC);
-    const startDateSignal = signalsService.signal(config.startDate);
-    const endDateSignal = signalsService.signal(config.endDate);
+    const dateRangeSignal = signalsService.signal({
+        start: config.startDate,
+        end: config.endDate,
+    });
     const cursorSignal = signalsService.signal(undefined);
-    /**
-     * Helper: Get services from config or BookingService
-     */
+    // Helper functions using peek() - no subscriptions created
     const getServices = () => {
-        const selectedServices = bookingService.serviceSelections
-            .get()
-            .map((s) => s.service);
-        if (selectedServices.length) {
-            return selectedServices;
-        }
-        return config.services ?? [];
+        const serviceSelections = bookingService.serviceSelections.peek();
+        return serviceSelections.length
+            ? serviceSelections.map((s) => s.service)
+            : (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 selectedLocation = bookingService.location.peek();
         const location = selectedLocation
-            ? {
-                id: selectedLocation._id,
-                locationType: selectedLocation.type,
-            }
+            ? { id: selectedLocation._id, locationType: selectedLocation.type }
             : baseFilters.location;
-        return {
-            ...baseFilters,
-            location,
-            staffMemberIds,
-        };
+        const selectedResources = bookingService.serviceSelections.peek()[0]?.resources ?? [];
+        const staffMemberIds = selectedResources.length
+            ? selectedResources.map((r) => r._id)
+            : baseFilters.staffMemberIds;
+        return { ...baseFilters, location, staffMemberIds };
     };
-    /**
-     * Fetch time slots from API
-     * If cursor is provided, appends to existing slots (pagination)
-     * If no cursor, resets state and fetches fresh slots
-     */
-    const fetchTimeSlots = async ({ isLoadMore } = { isLoadMore: false }) => {
-        if (isLoadingSignal.get() || (isLoadMore && !cursorSignal.get())) {
-            return;
-        }
-        const cursor = isLoadMore ? cursorSignal.get() : undefined;
+    const fetchTimeSlots = async () => {
         isLoadingSignal.set(true);
         errorSignal.set(null);
-        if (!isLoadMore) {
-            timeSlotsSignal.set([]);
-        }
+        cursorSignal.set(undefined);
+        timeSlotsSignal.set([]);
         try {
             const response = await fetchAvailability({
                 services: getServices(),
-                fromLocalDate: startDateSignal.get(),
-                toLocalDate: endDateSignal.get(),
-                timeZone: bookingService.timezone.get(),
-                viewMode: viewModeSignal.get(),
-                cursor,
+                timeZone: bookingService.timezone.peek(),
+                viewMode: viewModeSignal.peek(),
+                fromLocalDate: dateRangeSignal.peek().start,
+                toLocalDate: dateRangeSignal.peek().end,
                 ...getFilters(),
             });
-            const newSlots = response.timeSlots;
-            timeSlotsSignal.set(isLoadMore ? [...timeSlotsSignal.get(), ...newSlots] : newSlots);
+            timeSlotsSignal.set(response.timeSlots);
             const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
             cursorSignal.set(nextCursor);
             hasMoreSignal.set(!!nextCursor);
@@ -103,9 +75,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         catch (error) {
             const message = error instanceof Error
                 ? error.message
-                : isLoadMore
-                    ? 'Failed to load more time slots'
-                    : 'Failed to load time slots';
+                : 'Failed to load time slots';
             errorSignal.set(message);
         }
         finally {
@@ -143,13 +113,13 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Updates the booking service with the selected resource
      */
     const selectStaffMember = (staffMemberId) => {
-        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        const selectedTimeSlot = bookingService.serviceSelections.peek()[0]?.timeSlot;
         if (!selectedTimeSlot)
             return;
         const getStaffName = (id) => {
             if (id === ANY_STAFF_MEMBER_ID)
                 return 'Any staff member';
-            const slots = timeSlotsSignal.get();
+            const slots = timeSlotsSignal.peek();
             return (slots
                 .flatMap((slot) => slot.availableResources[0].resources)
                 .find((r) => r._id === id)?.name ?? undefined);
@@ -171,7 +141,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Action: Clear staff selection while keeping the selected time slot
      */
     const clearStaffSelection = () => {
-        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        const selectedTimeSlot = bookingService.serviceSelections.peek()[0]?.timeSlot;
         if (!selectedTimeSlot)
             return;
         bookingService.actions.updateItem({
@@ -182,33 +152,62 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Action: Load more slots (pagination)
      */
     const loadMore = async () => {
-        return fetchTimeSlots({ isLoadMore: true });
+        const cursor = cursorSignal.peek();
+        if (!cursor) {
+            return;
+        }
+        isLoadingSignal.set(true);
+        errorSignal.set(null);
+        try {
+            const response = await fetchAvailability({
+                services: getServices(),
+                fromLocalDate: dateRangeSignal.peek().start,
+                toLocalDate: dateRangeSignal.peek().end,
+                timeZone: bookingService.timezone.peek(),
+                viewMode: viewModeSignal.peek(),
+                cursor,
+                ...getFilters(),
+            });
+            const newSlots = response.timeSlots;
+            timeSlotsSignal.set([...timeSlotsSignal.peek(), ...newSlots]);
+            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);
+        }
     };
     /**
-     * Action: Update date range and refetch slots
+     * Action: Update date range (effect will handle refetch)
      */
     const setDateRange = (newStartDate, newEndDate) => {
-        const currentStartDate = startDateSignal.get();
-        const currentEndDate = endDateSignal.get();
+        const { start: currentStartDate, end: currentEndDate } = dateRangeSignal.peek();
         if (currentStartDate.getTime() === newStartDate.getTime() &&
             currentEndDate.getTime() === newEndDate.getTime()) {
             return;
         }
-        startDateSignal.set(newStartDate);
-        endDateSignal.set(newEndDate);
+        dateRangeSignal.set({ start: newStartDate, end: newEndDate });
     };
-    const resourcesSignal = signalsService.computed(() => {
-        return bookingService.serviceSelections.get()[0]?.resources;
-    });
     let isFirstRun = true;
     signalsService.effect(() => {
+        // Dependencies - trigger refetch when these change
+        dateRangeSignal.get();
         bookingService.timezone.get();
         bookingService.location.get();
-        resourcesSignal.get();
-        if (!isFirstRun || !config.timeSlots) {
-            fetchTimeSlots();
+        if (isFirstRun) {
+            isFirstRun = false;
+            if (config.timeSlots) {
+                return;
+            }
         }
-        isFirstRun = false;
+        fetchTimeSlots();
     });
     // Return service API
     return {
@@ -218,8 +217,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         error: errorSignal,
         hasMore: hasMoreSignal,
         // Configuration Signals (viewMode is internal only)
-        startDate: startDateSignal,
-        endDate: endDateSignal,
+        dateRange: dateRangeSignal,
         // Actions
         actions: {
             selectSlot,

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

@@ -106,9 +106,10 @@ export function ListData(props) {
  */
 export function DateRange(props) {
     const service = useService(TimeSlotListServiceDefinition);
+    const dateRange = service.dateRange.get();
     return props.children({
-        startDate: service.startDate.get(),
-        endDate: service.endDate.get(),
+        startDate: dateRange.start,
+        endDate: dateRange.end,
         setDateRange: service.actions.setDateRange,
     });
 }

package/dist/services/time-slot-list/index.d.ts

@@ -2,5 +2,5 @@
  * TimeSlotList Service
  * Main export file for time slot list service
  */
-export { TimeSlotListServiceDefinition, ViewMode, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type TimeSlotsFilters, } from './time-slot-list.def.js';
+export { TimeSlotListServiceDefinition, ViewMode, type DateRange, type TimeSlotListServiceAPI, type TimeSlotListServiceActions, type TimeSlotListServiceConfig, type TimeSlotsFilters, } from './time-slot-list.def.js';
 export { TimeSlotListService, loadTimeSlotListConfig, type LoadTimeSlotListConfigOptions, type LoadTimeSlotListConfigResult, } from './time-slot-list.js';

package/dist/services/time-slot-list/time-slot-list.def.d.ts

@@ -77,13 +77,16 @@ export interface TimeSlotListServiceActions {
     loadMore: () => Promise<void>;
     setDateRange: (start: Date, end: Date) => void;
 }
+export interface DateRange {
+    start: Date;
+    end: Date;
+}
 export interface TimeSlotListServiceAPI {
     timeSlots: Signal<TimeSlot[]>;
     isLoading: Signal<boolean>;
     error: Signal<string | null>;
     hasMore: Signal<boolean>;
-    startDate: Signal<Date>;
-    endDate: Signal<Date>;
+    dateRange: Signal<DateRange>;
     actions: TimeSlotListServiceActions;
 }
 export declare const TimeSlotListServiceDefinition: string & {

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';
@@ -29,73 +29,45 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
     const hasMoreSignal = signalsService.signal(false);
     // Internal only - viewMode is auto-detected based on service types
     const viewModeSignal = signalsService.signal(ViewMode.CLASSIC);
-    const startDateSignal = signalsService.signal(config.startDate);
-    const endDateSignal = signalsService.signal(config.endDate);
+    const dateRangeSignal = signalsService.signal({
+        start: config.startDate,
+        end: config.endDate,
+    });
     const cursorSignal = signalsService.signal(undefined);
-    /**
-     * Helper: Get services from config or BookingService
-     */
+    // Helper functions using peek() - no subscriptions created
     const getServices = () => {
-        const selectedServices = bookingService.serviceSelections
-            .get()
-            .map((s) => s.service);
-        if (selectedServices.length) {
-            return selectedServices;
-        }
-        return config.services ?? [];
+        const serviceSelections = bookingService.serviceSelections.peek();
+        return serviceSelections.length
+            ? serviceSelections.map((s) => s.service)
+            : (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 selectedLocation = bookingService.location.peek();
         const location = selectedLocation
-            ? {
-                id: selectedLocation._id,
-                locationType: selectedLocation.type,
-            }
+            ? { id: selectedLocation._id, locationType: selectedLocation.type }
             : baseFilters.location;
-        return {
-            ...baseFilters,
-            location,
-            staffMemberIds,
-        };
+        const selectedResources = bookingService.serviceSelections.peek()[0]?.resources ?? [];
+        const staffMemberIds = selectedResources.length
+            ? selectedResources.map((r) => r._id)
+            : baseFilters.staffMemberIds;
+        return { ...baseFilters, location, staffMemberIds };
     };
-    /**
-     * Fetch time slots from API
-     * If cursor is provided, appends to existing slots (pagination)
-     * If no cursor, resets state and fetches fresh slots
-     */
-    const fetchTimeSlots = async ({ isLoadMore } = { isLoadMore: false }) => {
-        if (isLoadingSignal.get() || (isLoadMore && !cursorSignal.get())) {
-            return;
-        }
-        const cursor = isLoadMore ? cursorSignal.get() : undefined;
+    const fetchTimeSlots = async () => {
         isLoadingSignal.set(true);
         errorSignal.set(null);
-        if (!isLoadMore) {
-            timeSlotsSignal.set([]);
-        }
+        cursorSignal.set(undefined);
+        timeSlotsSignal.set([]);
         try {
             const response = await fetchAvailability({
                 services: getServices(),
-                fromLocalDate: startDateSignal.get(),
-                toLocalDate: endDateSignal.get(),
-                timeZone: bookingService.timezone.get(),
-                viewMode: viewModeSignal.get(),
-                cursor,
+                timeZone: bookingService.timezone.peek(),
+                viewMode: viewModeSignal.peek(),
+                fromLocalDate: dateRangeSignal.peek().start,
+                toLocalDate: dateRangeSignal.peek().end,
                 ...getFilters(),
             });
-            const newSlots = response.timeSlots;
-            timeSlotsSignal.set(isLoadMore ? [...timeSlotsSignal.get(), ...newSlots] : newSlots);
+            timeSlotsSignal.set(response.timeSlots);
             const nextCursor = response.cursorPagingMetadata?.cursors?.next ?? undefined;
             cursorSignal.set(nextCursor);
             hasMoreSignal.set(!!nextCursor);
@@ -103,9 +75,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         catch (error) {
             const message = error instanceof Error
                 ? error.message
-                : isLoadMore
-                    ? 'Failed to load more time slots'
-                    : 'Failed to load time slots';
+                : 'Failed to load time slots';
             errorSignal.set(message);
         }
         finally {
@@ -143,13 +113,13 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Updates the booking service with the selected resource
      */
     const selectStaffMember = (staffMemberId) => {
-        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        const selectedTimeSlot = bookingService.serviceSelections.peek()[0]?.timeSlot;
         if (!selectedTimeSlot)
             return;
         const getStaffName = (id) => {
             if (id === ANY_STAFF_MEMBER_ID)
                 return 'Any staff member';
-            const slots = timeSlotsSignal.get();
+            const slots = timeSlotsSignal.peek();
             return (slots
                 .flatMap((slot) => slot.availableResources[0].resources)
                 .find((r) => r._id === id)?.name ?? undefined);
@@ -171,7 +141,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Action: Clear staff selection while keeping the selected time slot
      */
     const clearStaffSelection = () => {
-        const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+        const selectedTimeSlot = bookingService.serviceSelections.peek()[0]?.timeSlot;
         if (!selectedTimeSlot)
             return;
         bookingService.actions.updateItem({
@@ -182,33 +152,62 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
      * Action: Load more slots (pagination)
      */
     const loadMore = async () => {
-        return fetchTimeSlots({ isLoadMore: true });
+        const cursor = cursorSignal.peek();
+        if (!cursor) {
+            return;
+        }
+        isLoadingSignal.set(true);
+        errorSignal.set(null);
+        try {
+            const response = await fetchAvailability({
+                services: getServices(),
+                fromLocalDate: dateRangeSignal.peek().start,
+                toLocalDate: dateRangeSignal.peek().end,
+                timeZone: bookingService.timezone.peek(),
+                viewMode: viewModeSignal.peek(),
+                cursor,
+                ...getFilters(),
+            });
+            const newSlots = response.timeSlots;
+            timeSlotsSignal.set([...timeSlotsSignal.peek(), ...newSlots]);
+            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);
+        }
     };
     /**
-     * Action: Update date range and refetch slots
+     * Action: Update date range (effect will handle refetch)
      */
     const setDateRange = (newStartDate, newEndDate) => {
-        const currentStartDate = startDateSignal.get();
-        const currentEndDate = endDateSignal.get();
+        const { start: currentStartDate, end: currentEndDate } = dateRangeSignal.peek();
         if (currentStartDate.getTime() === newStartDate.getTime() &&
             currentEndDate.getTime() === newEndDate.getTime()) {
             return;
         }
-        startDateSignal.set(newStartDate);
-        endDateSignal.set(newEndDate);
+        dateRangeSignal.set({ start: newStartDate, end: newEndDate });
     };
-    const resourcesSignal = signalsService.computed(() => {
-        return bookingService.serviceSelections.get()[0]?.resources;
-    });
     let isFirstRun = true;
     signalsService.effect(() => {
+        // Dependencies - trigger refetch when these change
+        dateRangeSignal.get();
         bookingService.timezone.get();
         bookingService.location.get();
-        resourcesSignal.get();
-        if (!isFirstRun || !config.timeSlots) {
-            fetchTimeSlots();
+        if (isFirstRun) {
+            isFirstRun = false;
+            if (config.timeSlots) {
+                return;
+            }
         }
-        isFirstRun = false;
+        fetchTimeSlots();
     });
     // Return service API
     return {
@@ -218,8 +217,7 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         error: errorSignal,
         hasMore: hasMoreSignal,
         // Configuration Signals (viewMode is internal only)
-        startDate: startDateSignal,
-        endDate: endDateSignal,
+        dateRange: dateRangeSignal,
         // Actions
         actions: {
             selectSlot,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "0.0.35",
+  "version": "0.0.37",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -72,5 +72,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "ad087858a42d4f0c4cf86b870ec3b6b93fac74806bacb2f95cf753a2"
+  "falconPackageHash": "20f4812ace043e766a30c4a89597f6ca06981a999aff716744e5b9fc"
 }