@wix/headless-bookings 0.0.20 → 0.0.22

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

@@ -4,10 +4,9 @@
  */
 import { implementService } from '@wix/services-definitions';
 import { SignalsServiceDefinition } from '@wix/services-definitions/core-services/signals';
-import { format } from 'date-fns';
 import { TimeSlotListServiceDefinition, ViewMode, } from './time-slot-list.def.js';
-import { fetchAvailability } from '../../api/time-slot-list/index.js';
-import { BookingServiceDefinition, } from '../booking/booking.js';
+import { fetchAvailability } from '../../api/fetch-availability/index.js';
+import { BookingServiceDefinition, ANY_STAFF_MEMBER_ID, } from '../booking/booking.js';
 // ============================================================================
 // Helpers
 // ============================================================================
@@ -19,13 +18,6 @@ function getClientTimezone() {
         ? Intl.DateTimeFormat().resolvedOptions().timeZone
         : undefined;
 }
-/**
- * Formats a Date to local ISO string (YYYY-MM-DDThh:mm:ss)
- */
-function toLocalDateString(date) {
-    const pattern = "yyyy-MM-dd'T'HH:mm:ss";
-    return format(date, pattern);
-}
 /**
  * Merges new grouped slots with existing ones
  * Slots with the same start time are merged
@@ -68,7 +60,6 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
     const viewModeSignal = signalsService.signal(ViewMode.CLASSIC);
     const startDateSignal = signalsService.signal(config.startDate || currentDate);
     const endDateSignal = signalsService.signal(config.endDate || getDefaultEndDate());
-    const timezoneSignal = signalsService.signal(config.timezone ?? getClientTimezone());
     const cursorSignal = signalsService.signal(undefined);
     /**
      * Helper: Get services from config or BookingService
@@ -84,9 +75,9 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
     const getFilters = () => {
         // Get BookingService selections (these take priority)
         const location = bookingService.location.get();
-        const selections = bookingService.serviceSelections.get();
-        const selectedStaffMemberIds = selections
-            .map(({ resources }) => resources.map((r) => r._id))
+        const serviceSelections = bookingService.serviceSelections.get();
+        const selectedStaffMemberIds = serviceSelections
+            .map((serviceSelection) => serviceSelection.resources.map((r) => r._id))
             .flat();
         const selectedLocation = location ? { _id: location.id } : null;
         // Merge config filters with BookingService selections (selections win)
@@ -114,9 +105,9 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         try {
             const response = await fetchAvailability({
                 services: selectedServices,
-                fromLocalDate: toLocalDateString(startDateSignal.get()),
-                toLocalDate: toLocalDateString(endDateSignal.get()),
-                timeZone: timezoneSignal.get(),
+                fromLocalDate: startDateSignal.get(),
+                toLocalDate: endDateSignal.get(),
+                timeZone: bookingService.timezone.get(),
                 viewMode: viewModeSignal.get(),
                 cursor: cursorSignal.get(),
                 ...filters,
@@ -243,6 +234,18 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         const currentSelections = selectionSignal.get();
         if (!currentSelections?.slot)
             return;
+        if (staffMemberId === ANY_STAFF_MEMBER_ID) {
+            bookingService.actions.updateItem({
+                resources: [
+                    {
+                        _id: ANY_STAFF_MEMBER_ID,
+                        name: 'Any staff member',
+                    },
+                ],
+            });
+            selectionSignal.set({ ...currentSelections, staffMemberId });
+            return;
+        }
         const slot = currentSelections.slot;
         // Find all locations that have this staff member
         const locationsWithThisStaff = slot.staffByLocation.filter((loc) => loc.staffMembers.some((s) => s.id === staffMemberId));
@@ -300,16 +303,14 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         if (!cursor || isLoadingSignal.get())
             return;
         const selectedServices = getServices();
-        if (selectedServices.length === 0)
-            return;
         const filters = getFilters();
         isLoadingSignal.set(true);
         try {
             const response = await fetchAvailability({
                 services: selectedServices,
-                fromLocalDate: toLocalDateString(startDateSignal.get()),
-                toLocalDate: toLocalDateString(endDateSignal.get()),
-                timeZone: timezoneSignal.get(),
+                fromLocalDate: startDateSignal.get(),
+                toLocalDate: endDateSignal.get(),
+                timeZone: bookingService.timezone.get(),
                 cursor,
                 viewMode: viewModeSignal.get(),
                 ...filters,
@@ -345,17 +346,21 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         endDateSignal.set(newEndDate);
         fetchTimeSlots();
     };
-    /**
-     * Action: Update timezone and refetch slots
-     */
-    const setTimezone = (newTimezone) => {
-        timezoneSignal.set(newTimezone);
-        fetchTimeSlots();
-    };
     // Auto-fetch on initialization if no pre-loaded data provided
-    if (!config.timeSlots && config.services && config.services.length > 0) {
+    if (!config.timeSlots) {
         fetchTimeSlots();
     }
+    // Subscribe to timezone changes from BookingService to auto-refetch
+    // NOTE: This should depend ONLY on bookingService.timezone.
+    let firstTimezoneEffectRun = true;
+    signalsService.effect(() => {
+        bookingService.timezone.get();
+        if (firstTimezoneEffectRun) {
+            firstTimezoneEffectRun = false;
+            return;
+        }
+        fetchTimeSlots();
+    });
     // Return service API
     return {
         // State Signals
@@ -367,7 +372,6 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
         // Configuration Signals (viewMode is internal only)
         startDate: startDateSignal,
         endDate: endDateSignal,
-        timezone: timezoneSignal,
         // Actions
         actions: {
             selectSlot,
@@ -376,7 +380,6 @@ export const TimeSlotListService = implementService.withConfig()(TimeSlotListSer
             clearPreferences,
             loadMore,
             setDateRange,
-            setTimezone,
         },
     };
 });
@@ -408,8 +411,8 @@ export async function loadTimeSlotListConfig(options) {
     try {
         const response = await fetchAvailability({
             services: options.services || [],
-            fromLocalDate: toLocalDateString(startDate),
-            toLocalDate: toLocalDateString(endDate),
+            fromLocalDate: startDate,
+            toLocalDate: endDate,
             timeZone: options.timezone ?? getClientTimezone(),
             ...options.filters,
         });

package/dist/api/{time-slot-list → fetch-availability}/index.d.ts

@@ -52,10 +52,10 @@ export interface FetchAvailabilityResponse {
  * // response.timeSlots are grouped by time
  * ```
  */
-export declare function fetchAvailability({ services: selectedServices, viewMode, fromLocalDate, toLocalDate, timeZone, locations, staffMemberIds, cursor, slotsPerPage, bookable, bookingPolicyViolations, }: {
+export declare function fetchAvailability({ services: selectedServices, viewMode, fromLocalDate, toLocalDate, timeZone, locations, staffMemberIds, cursor, slotsPerPage, bookable, bookingPolicyViolations, timeSlotsPerDay, }: {
     services: Service[];
-    fromLocalDate: string;
-    toLocalDate: string;
+    fromLocalDate: Date;
+    toLocalDate: Date;
     timeZone?: string;
     locations?: Location[];
     staffMemberIds?: string[];
@@ -68,4 +68,5 @@ export declare function fetchAvailability({ services: selectedServices, viewMode
         bookOnlineDisabled?: boolean;
     };
     slotsPerPage?: number;
+    timeSlotsPerDay?: number;
 }): Promise<FetchAvailabilityResponse>;

package/dist/api/{time-slot-list → fetch-availability}/index.js

@@ -5,6 +5,8 @@
 import { listAvailabilityTimeSlots, } from '@wix/auto_sdk_bookings_availability-time-slots';
 import { listEventTimeSlots } from '@wix/auto_sdk_bookings_event-time-slots';
 import { ServiceType } from '@wix/auto_sdk_bookings_services';
+import { format } from 'date-fns';
+import { ANY_STAFF_MEMBER_ID } from '../../services/booking/booking.js';
 import { ViewMode, } from '../../services/time-slot-list/time-slot-list.def.js';
 // ============================================================================
 // Internal Types
@@ -17,6 +19,16 @@ var FlowType;
 })(FlowType || (FlowType = {}));
 const STAFF_RESOURCE_TYPE_ID = '1cd44cf8-756f-41c3-bd90-3e2ffcaf1155';
 // ============================================================================
+// Helpers
+// ============================================================================
+/**
+ * Formats a Date to local ISO string (YYYY-MM-DDThh:mm:ss)
+ */
+function toLocalDateString(date) {
+    const pattern = "yyyy-MM-dd'T'HH:mm:ss";
+    return format(date, pattern);
+}
+// ============================================================================
 // Grouping Functions
 // ============================================================================
 /**
@@ -103,11 +115,22 @@ function detectFlow(bookingServices, viewMode) {
  * // response.timeSlots are grouped by time
  * ```
  */
-export async function fetchAvailability({ services: selectedServices, viewMode = ViewMode.CLASSIC, fromLocalDate, toLocalDate, timeZone, locations, staffMemberIds, cursor, slotsPerPage, bookable, bookingPolicyViolations, }) {
+export async function fetchAvailability({ services: selectedServices, viewMode = ViewMode.CLASSIC, fromLocalDate, toLocalDate, timeZone, locations, staffMemberIds, cursor, slotsPerPage, bookable, bookingPolicyViolations, timeSlotsPerDay, }) {
     const flow = detectFlow(selectedServices, viewMode);
     const serviceIds = selectedServices.map((s) => s._id);
+    // Convert Date objects to local ISO strings
+    const fromLocalDateStr = toLocalDateString(fromLocalDate);
+    const toLocalDateStr = toLocalDateString(toLocalDate);
+    const isFetchAvailabileDays = timeSlotsPerDay === 1;
+    const cursorPaging = isFetchAvailabileDays
+        ? undefined
+        : {
+            cursor,
+            limit: slotsPerPage,
+        };
     if (flow === FlowType.SINGLE_SERVICE) {
-        const resourceTypes = staffMemberIds?.length
+        const isAnyStaffMemberSelected = staffMemberIds?.length === 1 && staffMemberIds[0] === ANY_STAFF_MEMBER_ID;
+        const resourceTypes = staffMemberIds?.length && !isAnyStaffMemberSelected
             ? [
                 {
                     resourceTypeId: STAFF_RESOURCE_TYPE_ID,
@@ -117,18 +140,18 @@ export async function fetchAvailability({ services: selectedServices, viewMode =
             : undefined;
         const response = await listAvailabilityTimeSlots({
             serviceId: serviceIds[0],
-            fromLocalDate,
-            toLocalDate,
+            fromLocalDate: fromLocalDateStr,
+            toLocalDate: toLocalDateStr,
             timeZone,
             locations,
-            cursorPaging: {
-                cursor,
-                limit: slotsPerPage,
-            },
+            cursorPaging,
             resourceTypes,
             bookable,
             bookingPolicyViolations,
-            includeResourceTypeIds: [STAFF_RESOURCE_TYPE_ID],
+            includeResourceTypeIds: isAnyStaffMemberSelected || isFetchAvailabileDays
+                ? undefined
+                : [STAFF_RESOURCE_TYPE_ID],
+            timeSlotsPerDay,
         });
         return {
             timeSlots: groupTimeSlotsByTime(response.timeSlots || []),
@@ -150,17 +173,15 @@ export async function fetchAvailability({ services: selectedServices, viewMode =
             eventFilter['resources.id'] = { $hasSome: staffMemberIds };
         }
         const response = await listEventTimeSlots({
-            fromLocalDate,
-            toLocalDate,
+            fromLocalDate: fromLocalDateStr,
+            toLocalDate: toLocalDateStr,
             timeZone,
             serviceIds: serviceIds.length ? serviceIds : undefined,
-            cursorPaging: {
-                cursor,
-                limit: slotsPerPage,
-            },
+            cursorPaging,
             eventFilter: Object.keys(eventFilter).length ? eventFilter : undefined,
             includeNonBookable: bookable ? !bookable : undefined,
             bookingPolicyViolations,
+            maxSlotsPerDay: timeSlotsPerDay,
         });
         return {
             timeSlots: groupTimeSlotsByTime(response.timeSlots || []),

package/dist/api/index.d.ts

@@ -5,7 +5,7 @@
  * @module API
  */
 export { getServiceById, getServiceBySlug, queryServices, type PagingMetadata, type ServiceListFilters, type QueryServicesRequest, } from './query-services/index.js';
-export { fetchAvailability } from './time-slot-list/index.js';
+export { fetchAvailability } from './fetch-availability/index.js';
 /**
  * PagingMetadata includes:
  * - limit: Number of items per page

package/dist/api/index.js

@@ -5,7 +5,7 @@
  * @module API
  */
 export { getServiceById, getServiceBySlug, queryServices, } from './query-services/index.js';
-export { fetchAvailability } from './time-slot-list/index.js';
+export { fetchAvailability } from './fetch-availability/index.js';
 /**
  * PagingMetadata includes:
  * - limit: Number of items per page

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

@@ -4,12 +4,13 @@
  */
 import React from 'react';
 import type { BookingServiceConfig } from '../../services/booking/booking.js';
+export type { BookingData, DataProps } from '../core/booking/Booking.js';
 /**
  * Props for Booking.Root component
  */
 export interface BookingRootProps {
     children: React.ReactNode;
-    bookingServiceConfig: BookingServiceConfig;
+    bookingServiceConfig?: BookingServiceConfig;
 }
 /**
  * Root component that provides booking context to the entire app.

package/dist/react/booking/Booking.js

@@ -19,7 +19,7 @@ import * as CoreBooking from '../core/booking/Booking.js';
  * ```
  */
 export const Root = (props) => {
-    const { children, bookingServiceConfig } = props;
+    const { children, bookingServiceConfig = {} } = props;
     return (_jsx(CoreBooking.Root, { bookingServiceConfig: bookingServiceConfig, children: children }));
 };
 Root.displayName = 'Booking.Root';

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

@@ -10,7 +10,7 @@ import type { FormValues } from '@wix/form-public';
  */
 export interface RootProps {
     children: React.ReactNode;
-    bookingServiceConfig: BookingServiceConfig;
+    bookingServiceConfig?: BookingServiceConfig;
 }
 /**
  * Root component that provides booking context to the entire app.
@@ -35,6 +35,7 @@ export declare function Root(props: RootProps): React.ReactNode;
 export interface BookingData {
     serviceSelections: ServiceSelection[];
     location: Location | null;
+    timezone: string | undefined;
     formSubmission: FormValues | null;
     actions: BookingServiceActions;
 }
@@ -52,7 +53,7 @@ export interface DataProps {
  * @example
  * ```tsx
  * <Booking.Data>
- *   {({ serviceSelections, location, formSubmission, actions }) => (
+ *   {({ serviceSelections, location, timezone, formSubmission, actions }) => (
  *     serviceSelections.length > 0 ? (
  *       <div>{serviceSelections.map(item => item.service.name).join(', ')}</div>
  *     ) : (

package/dist/react/core/booking/Booking.js

@@ -18,7 +18,8 @@ import { BookingServiceDefinition, BookingService, } from '../../../services/boo
  * ```
  */
 export function Root(props) {
-    return (_jsx(WixServices, { servicesMap: createServicesMap().addService(BookingServiceDefinition, BookingService, props.bookingServiceConfig), children: props.children }));
+    const { bookingServiceConfig = {}, children } = props;
+    return (_jsx(WixServices, { servicesMap: createServicesMap().addService(BookingServiceDefinition, BookingService, bookingServiceConfig), children: children }));
 }
 /**
  * Core component that provides access to booking data via render props.
@@ -28,7 +29,7 @@ export function Root(props) {
  * @example
  * ```tsx
  * <Booking.Data>
- *   {({ serviceSelections, location, formSubmission, actions }) => (
+ *   {({ serviceSelections, location, timezone, formSubmission, actions }) => (
  *     serviceSelections.length > 0 ? (
  *       <div>{serviceSelections.map(item => item.service.name).join(', ')}</div>
  *     ) : (
@@ -43,11 +44,13 @@ export function Data(props) {
     const bookingService = useService(BookingServiceDefinition);
     const serviceSelections = bookingService.serviceSelections.get();
     const location = bookingService.location.get();
+    const timezone = bookingService.timezone.get();
     const formSubmission = bookingService.formSubmission.get();
     const { actions } = bookingService;
     return children({
         serviceSelections,
         location,
+        timezone,
         formSubmission,
         actions,
     });

package/dist/react/core/time-slot-list/TimeSlot.d.ts

@@ -88,10 +88,10 @@ export declare function StaffMemberProvider(props: StaffMemberProviderProps): Re
  */
 export interface InfoProps {
     children: (data: {
-        /** Raw localStartDate string from timeSlot */
-        startDate: string | undefined;
-        /** Raw localEndDate string from timeSlot */
-        endDate: string | undefined;
+        /** Parsed localStartDate as Date (constructed from the raw localStartDate string) */
+        startDate: Date | undefined;
+        /** Parsed localEndDate as Date (constructed from the raw localEndDate string) */
+        endDate: Date | undefined;
         /** Calculated duration in minutes (null if dates unavailable) */
         durationInMinutes: number | null;
         /** Whether the timeSlot is bookable */

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

@@ -9,6 +9,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { useService } from '@wix/services-manager-react';
 import { TimeSlotListServiceDefinition, } from '../../../services/time-slot-list/time-slot-list.def.js';
+import { ANY_STAFF_MEMBER_ID } from '../../../services/booking/booking.js';
 const TimeSlotContext = React.createContext(null);
 /**
  * Hook to access TimeSlot context
@@ -115,15 +116,17 @@ export function StaffMemberProvider(props) {
  */
 export function Info(props) {
     const { timeSlot, isSelected } = useTimeSlotContext();
-    const startDate = timeSlot.localStartDate ?? undefined;
-    const endDate = timeSlot.localEndDate ?? undefined;
+    const startDate = timeSlot.localStartDate
+        ? new Date(timeSlot.localStartDate)
+        : undefined;
+    const endDate = timeSlot.localEndDate
+        ? new Date(timeSlot.localEndDate)
+        : undefined;
     const bookable = timeSlot.bookable ?? false;
     // Calculate duration from start and end dates
     let durationInMinutes = null;
     if (startDate && endDate) {
-        const startTime = new Date(startDate).getTime();
-        const endTime = new Date(endDate).getTime();
-        durationInMinutes = Math.round((endTime - startTime) / (1000 * 60));
+        durationInMinutes = Math.round((endDate.getTime() - startDate.getTime()) / (1000 * 60));
     }
     return props.children({
         startDate,
@@ -202,12 +205,13 @@ export function Locations(props) {
     const selection = service.selection.get();
     const selectedLocationId = selection?.locationId ?? null;
     const selectedStaffMemberId = selection?.staffMemberId ?? null;
+    const isAnyStaffMemberSelected = selectedStaffMemberId === ANY_STAFF_MEMBER_ID;
     // Build locations array from staffByLocation (names already included)
     const locations = timeSlot.staffByLocation.map(({ location, staffMembers }) => {
         // Check if this location is selectable based on selected staff
         // If no staff selected, all locations are selectable
         // If staff selected, only locations where that staff works are selectable
-        const isSelectable = selectedStaffMemberId
+        const isSelectable = !isAnyStaffMemberSelected && selectedStaffMemberId
             ? staffMembers.some((s) => s.id === selectedStaffMemberId)
             : true;
         return {
@@ -311,12 +315,18 @@ export function StaffMembers(props) {
         isSelectable: !selectedLocationId ||
             entries.some((e) => e.locationId === selectedLocationId),
     }));
+    const anyStaffOption = {
+        id: ANY_STAFF_MEMBER_ID,
+        name: 'Any staff member',
+        isSelected: selectedStaffMemberId === ANY_STAFF_MEMBER_ID,
+        isSelectable: true,
+    };
     // Return null if only 1 staff member - nothing to choose from
     if (staffMembers.length <= 1) {
         return null;
     }
     return props.children({
-        staffMembers,
+        staffMembers: [anyStaffOption, ...staffMembers],
         selectStaffMember: service.actions.selectStaffMember,
     });
 }

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

@@ -2,6 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useService, WixServices } from '@wix/services-manager-react';
 import { createServicesMap } from '@wix/services-manager';
 import { TimeSlotListServiceDefinition, TimeSlotListService, } from '../../../services/time-slot-list/index.js';
+import { BookingServiceDefinition } from '../../../services/booking/booking.js';
 /**
  * Root component that provides TimeSlotListService context to its children.
  *
@@ -54,8 +55,8 @@ function getTimezoneDisplayName(timezone) {
  * ```
  */
 export function Timezone(props) {
-    const service = useService(TimeSlotListServiceDefinition);
-    const timezone = service.timezone.get();
+    const bookingService = useService(BookingServiceDefinition);
+    const timezone = bookingService.timezone.get();
     const displayName = getTimezoneDisplayName(timezone);
     return props.children({ timezone, displayName });
 }

package/dist/react/time-slot-list/TimeSlot.d.ts

@@ -16,18 +16,18 @@ export type { LocationData, StaffMemberData, } from '../core/time-slot-list/Time
 export interface StartDateProps {
     asChild?: boolean;
     children?: AsChildChildren<{
-        startDate: string | undefined;
+        startDate: Date | undefined;
     }>;
     className?: string;
 }
 /**
- * Displays the time slot start date/time as a raw string.
+ * Displays the time slot start date/time as a Date.
  * Consumer is responsible for formatting.
  *
  * @component
  * @example
  * ```tsx
- * // Default usage - displays raw localStartDate string
+ * // Default usage - displays Date.toString()
  * <TimeSlot.StartDate className="text-foreground" />
  *
  * // With custom formatting
@@ -45,18 +45,18 @@ export declare const StartDate: React.ForwardRefExoticComponent<StartDateProps &
 export interface EndDateProps {
     asChild?: boolean;
     children?: AsChildChildren<{
-        endDate: string | undefined;
+        endDate: Date | undefined;
     }>;
     className?: string;
 }
 /**
- * Displays the time slot end date/time as a raw string.
+ * Displays the time slot end date/time as a Date.
  * Consumer is responsible for formatting.
  *
  * @component
  * @example
  * ```tsx
- * // Default usage - displays raw localEndDate string
+ * // Default usage - displays Date.toString()
  * <TimeSlot.EndDate className="text-foreground" />
  *
  * // With custom formatting

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

@@ -34,13 +34,13 @@ var TestIds;
     TestIds["timeSlotStaffMemberActionSelect"] = "time-slot-staff-member-action-select";
 })(TestIds || (TestIds = {}));
 /**
- * Displays the time slot start date/time as a raw string.
+ * Displays the time slot start date/time as a Date.
  * Consumer is responsible for formatting.
  *
  * @component
  * @example
  * ```tsx
- * // Default usage - displays raw localStartDate string
+ * // Default usage - displays Date.toString()
  * <TimeSlot.StartDate className="text-foreground" />
  *
  * // With custom formatting
@@ -53,17 +53,17 @@ var TestIds;
  */
 export const StartDate = React.forwardRef((props, ref) => {
     const { asChild, children, className } = props;
-    return (_jsx(CoreTimeSlot.Info, { children: ({ startDate }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.timeSlotStartDate, customElement: children, customElementProps: { startDate }, children: _jsx("span", { children: startDate }) })) }));
+    return (_jsx(CoreTimeSlot.Info, { children: ({ startDate }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.timeSlotStartDate, customElement: children, customElementProps: { startDate }, children: _jsx("span", { children: startDate?.toString() }) })) }));
 });
 StartDate.displayName = 'TimeSlot.StartDate';
 /**
- * Displays the time slot end date/time as a raw string.
+ * Displays the time slot end date/time as a Date.
  * Consumer is responsible for formatting.
  *
  * @component
  * @example
  * ```tsx
- * // Default usage - displays raw localEndDate string
+ * // Default usage - displays Date.toString()
  * <TimeSlot.EndDate className="text-foreground" />
  *
  * // With custom formatting
@@ -76,7 +76,7 @@ StartDate.displayName = 'TimeSlot.StartDate';
  */
 export const EndDate = React.forwardRef((props, ref) => {
     const { asChild, children, className } = props;
-    return (_jsx(CoreTimeSlot.Info, { children: ({ endDate }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.timeSlotEndDate, customElement: children, customElementProps: { endDate }, children: _jsx("span", { children: endDate }) })) }));
+    return (_jsx(CoreTimeSlot.Info, { children: ({ endDate }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.timeSlotEndDate, customElement: children, customElementProps: { endDate }, children: _jsx("span", { children: endDate?.toString() }) })) }));
 });
 EndDate.displayName = 'TimeSlot.EndDate';
 /**

package/dist/react/time-slot-list/TimeSlotList.d.ts

@@ -113,10 +113,10 @@ export interface TimeSlotRepeaterChildProps {
     isSelected: boolean;
     /** Whether the slot can be booked */
     bookable: boolean;
-    /** Start date/time as ISO string */
-    startDate: string | undefined;
-    /** End date/time as ISO string */
-    endDate: string | undefined;
+    /** Start date/time as Date (constructed from the raw localStartDate string) */
+    startDate: Date | undefined;
+    /** End date/time as Date (constructed from the raw localEndDate string) */
+    endDate: Date | undefined;
     /** Duration in minutes */
     durationInMinutes: number | null;
     /** The raw time slot data */

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

@@ -7,6 +7,7 @@ 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 { FormValues } from '@wix/form-public';
+export declare const ANY_STAFF_MEMBER_ID = "__any_staff_member__";
 /**
  * Minimal time slot data for service selections
  */
@@ -57,6 +58,7 @@ export interface BookingServiceActions {
     getResourceById(resourceId: string, instanceId?: string): Resource | undefined;
     setLocation(location: Location | null): void;
     clearLocation(): void;
+    setTimezone(timezone: string): void;
     setFormSubmission(values: FormValues | null): void;
     clearFormSubmission(): void;
     clearAll(): void;
@@ -70,6 +72,8 @@ export interface BookingService {
     serviceSelections: Signal<ServiceSelection[]>;
     /** Signal containing the selected location */
     location: Signal<Location | null>;
+    /** Signal containing the selected timezone */
+    timezone: Signal<string | undefined>;
     /** Signal containing the form submission */
     formSubmission: Signal<FormValues | null>;
     /** Actions for modifying booking state */
@@ -92,6 +96,8 @@ export interface BookingServiceConfig {
     serviceSelections?: ServiceSelection[];
     /** Optional initial location */
     location?: Location | null;
+    /** Optional initial timezone */
+    timezone?: string;
     /** Optional initial form submission */
     formSubmission?: FormValues | null;
 }