/** * Core Booking Components * Provides low-level access to BookingService via render props and service setup */ import React from 'react'; import { type BookingServiceConfig, type ServiceSelection, type BookingServiceActions, type SelectedPaymentOption } from '../../../services/booking/booking.js'; import type { FormValues } from '@wix/forms/components'; import type { TimeSlot, Resource } from '@wix/auto_sdk_bookings_availability-time-slots'; import { type Service, type V2Location as ServiceLocationType } from '@wix/auto_sdk_bookings_services'; import type { PricingServiceSelection } from '../../../services/payment/payment.js'; /** * Props for Booking.Root component */ export interface RootProps { children: React.ReactNode; bookingServiceConfig?: BookingServiceConfig; } /** * Root component that provides booking context to the entire app. * * **IMPORTANT**: This should wrap the entire application at BaseLayout level, * not individual pages. This ensures selections persist across navigation. * * @component * @example * ```tsx * // In BaseLayout.astro * * {children} * * ``` */ export declare function Root(props: RootProps): React.ReactNode; /** * Data exposed by Booking.Data component * Mirrors BookingServiceConfig structure with actions */ export interface BookingData { serviceSelections: ServiceSelection[]; location: ServiceLocationType | null; timezone: string | undefined; formSubmission: FormValues | null; /** * Consumer-selected payment option. `undefined` means the service-config * heuristic applies. Set via `actions.setSelectedPaymentOption`. */ selectedPaymentOption: SelectedPaymentOption | undefined; actions: BookingServiceActions; } /** * Props for Data render prop component */ export interface DataProps { children: (data: BookingData) => React.ReactNode; } export declare function Data(props: DataProps): React.ReactNode; /** * Unified data object for a single booking item. * Contains resolved data ready for use - no raw serviceSelection duplication. */ export interface BookingItem { /** SDK Service object */ service: Service; /** Adapted SDK TimeSlot (or null if no time slot selected) */ timeSlot: TimeSlot | null; /** Resolved staff: timeSlot.resources ?? selection.resources, or null if none */ staff: Resource[] | null; /** Unique identifier for this booking instance */ instanceId: string; /** Position in the serviceSelections array */ index: number; } /** * Hook to access the current BookingItem from context. * Must be used within BookingItemProvider. * * @throws Error if used outside of BookingItemProvider context */ export declare function useBookingItemContext(): BookingItem; /** * Props for BookingItemProvider */ export interface BookingItemProviderProps { children: React.ReactNode; item: BookingItem; } /** * Provider component used by repeaters to provide BookingItem context. * Can be used by core consumers to create their own repeater. * * @component * @example * ```tsx * {items.map((item) => ( * * {children} * * ))} * ``` */ export declare function BookingItemProvider(props: BookingItemProviderProps): React.ReactNode; /** * Props for BookingItemInfo render prop component */ export interface BookingItemInfoProps { /** Label to display when no specific staff member is assigned */ anyStaffLabel?: string; children: (data: { /** SDK Service object */ service: Service; /** Adapted SDK TimeSlot (or null if no time slot selected) */ timeSlot: TimeSlot | null; /** First staff member's name, or anyStaffLabel if none */ staffName: string; /** Unique identifier for this booking instance */ instanceId: string; /** Position in the serviceSelections array */ index: number; /** The raw BookingItem object */ item: BookingItem; }) => React.ReactNode; } /** * Core component that provides access to booking item info via render props. * Must be used within BookingItemProvider. * * @component * @example * ```tsx * * {({ service, timeSlot, staffName }) => ( *
* {service.name} * {staffName} *
* )} *
* ``` */ export declare function BookingItemInfo(props: BookingItemInfoProps): React.ReactNode; /** * Data exposed by ItemsData render prop */ export interface ItemsDataRenderProps { /** Array of BookingItem objects */ items: BookingItem[]; } /** * Props for ItemsData render prop component */ export interface ItemsDataProps { children: (data: ItemsDataRenderProps) => React.ReactNode; } /** * Core component that provides access to booking items array via render props. * Transforms serviceSelections into BookingItem objects. * * @component * @example * ```tsx * * {({ items }) => ( * items.length > 0 ? ( *
{items.length} bookings
* ) : ( *
No bookings
* ) * )} *
* ``` */ export declare function ItemsData(props: ItemsDataProps): React.ReactNode; /** * Data exposed by PaymentData render prop */ export interface PaymentDataRenderProps { /** Pricing service selections array for Payment.Root */ pricingServiceSelections: PricingServiceSelection[]; } /** * Props for PaymentData render prop component */ export interface PaymentDataProps { children: (data: PaymentDataRenderProps) => React.ReactNode; } /** * Core component that provides payment data via render props. * Computes slotServices from serviceSelections. * * @component * @example * ```tsx * * {({ slotServices }) => ( * * * * )} * * ``` */ export declare function PaymentData(props: PaymentDataProps): React.ReactNode;