@wix/headless-bookings 0.0.41 → 0.0.43

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

@@ -58,6 +58,7 @@ export interface ListDataRenderProps {
     isLoading: boolean;
     error: string | null;
     loadMore: () => Promise<void>;
+    isSelectionComplete: boolean;
 }
 /**
  * Props for ListData render prop component
@@ -73,7 +74,7 @@ export interface ListDataProps {
  * @example
  * ```tsx
  * <ListData>
- *   {({ timeSlots, hasMore, isLoading, loadMore }) => (
+ *   {({ timeSlots, hasMore, isLoading, loadMore, isSelectionComplete }) => (
  *     <GenericList.Root items={timeSlots} hasMore={hasMore} isLoading={isLoading} loadMore={loadMore}>
  *       {children}
  *     </GenericList.Root>

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

@@ -68,7 +68,7 @@ export function Timezone(props) {
  * @example
  * ```tsx
  * <ListData>
- *   {({ timeSlots, hasMore, isLoading, loadMore }) => (
+ *   {({ timeSlots, hasMore, isLoading, loadMore, isSelectionComplete }) => (
  *     <GenericList.Root items={timeSlots} hasMore={hasMore} isLoading={isLoading} loadMore={loadMore}>
  *       {children}
  *     </GenericList.Root>
@@ -78,12 +78,18 @@ export function Timezone(props) {
  */
 export function ListData(props) {
     const service = useService(TimeSlotListServiceDefinition);
+    const bookingService = useService(BookingServiceDefinition);
+    const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+    const hasTimeSlot = !!selectedTimeSlot;
+    const hasSelectedStaffMember = (selectedTimeSlot?.resources?.length ?? 0) === 1;
+    const isSelectionComplete = hasTimeSlot && hasSelectedStaffMember;
     return props.children({
         timeSlots: service.timeSlots.get(),
         hasMore: service.hasMore.get(),
         isLoading: service.isLoading.get(),
         error: service.error.get(),
         loadMore: service.actions.loadMore,
+        isSelectionComplete,
     });
 }
 /**

package/cjs/dist/react/service/Service.d.ts

@@ -8,20 +8,49 @@ import { MoneyData } from '@wix/headless-components/react';
 import { type Service, type Payment } from '@wix/auto_sdk_bookings_services';
 import * as ServiceMediaModule from './ServiceMedia.js';
 /**
- * Props for Service.Root component
+ * Base props shared by all Service.Root variants
  */
-export interface ServiceRootProps {
+interface ServiceRootBaseProps {
     children?: React.ReactNode | AsChildChildren<{
         selected: boolean;
         bookable: boolean;
     }>;
-    service: Service;
     appId?: string;
     asChild?: boolean;
     className?: string;
 }
+/**
+ * Props for Service.Root with pre-loaded service object (SSR pattern)
+ */
+type ServiceRootWithService = ServiceRootBaseProps & {
+    service: Service;
+    serviceId?: never;
+    serviceSlug?: never;
+};
+/**
+ * Props for Service.Root with dynamic loading by service ID
+ */
+type ServiceRootWithId = ServiceRootBaseProps & {
+    service?: never;
+    serviceId: string;
+    serviceSlug?: never;
+};
+/**
+ * Props for Service.Root with dynamic loading by service slug
+ */
+type ServiceRootWithSlug = ServiceRootBaseProps & {
+    service?: never;
+    serviceId?: never;
+    serviceSlug: string;
+};
+/**
+ * Props for Service.Root component.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
+ */
+export type ServiceRootProps = ServiceRootWithService | ServiceRootWithId | ServiceRootWithSlug;
 /**
  * Root component that provides service context to the entire app.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
  *
  * @order 1
  * @component
@@ -29,6 +58,7 @@ export interface ServiceRootProps {
  * ```tsx
  * import { Service } from '@wix/bookings/components';
  *
+ * // With pre-loaded service object (SSR pattern)
  * function ServicePage({ service }) {
  *   return (
  *     <Service.Root service={service}>
@@ -37,6 +67,26 @@ export interface ServiceRootProps {
  *     </Service.Root>
  *   );
  * }
+ *
+ * // With dynamic loading by serviceId
+ * function ServicePageById({ serviceId }) {
+ *   return (
+ *     <Service.Root serviceId={serviceId}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
+ *
+ * // With dynamic loading by serviceSlug
+ * function ServicePageBySlug({ slug }) {
+ *   return (
+ *     <Service.Root serviceSlug={slug}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
  * ```
  */
 export declare const Root: React.ForwardRefExoticComponent<ServiceRootProps & React.RefAttributes<HTMLElement>>;

package/cjs/dist/react/service/Service.js

@@ -47,6 +47,7 @@ var TestIds;
 })(TestIds || (TestIds = {}));
 /**
  * Root component that provides service context to the entire app.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
  *
  * @order 1
  * @component
@@ -54,6 +55,7 @@ var TestIds;
  * ```tsx
  * import { Service } from '@wix/bookings/components';
  *
+ * // With pre-loaded service object (SSR pattern)
  * function ServicePage({ service }) {
  *   return (
  *     <Service.Root service={service}>
@@ -62,11 +64,31 @@ var TestIds;
  *     </Service.Root>
  *   );
  * }
+ *
+ * // With dynamic loading by serviceId
+ * function ServicePageById({ serviceId }) {
+ *   return (
+ *     <Service.Root serviceId={serviceId}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
+ *
+ * // With dynamic loading by serviceSlug
+ * function ServicePageBySlug({ slug }) {
+ *   return (
+ *     <Service.Root serviceSlug={slug}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
  * ```
  */
 export const Root = React.forwardRef((props, ref) => {
-    const { children, service, appId, asChild, className, ...attrs } = props;
-    return (_jsx(CoreService.Root, { serviceServiceConfig: { service, appId }, children: ({ selected, bookable }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.serviceRoot, "data-selected": selected, "data-bookable": bookable, customElement: children, customElementProps: { selected, bookable }, ...attrs, children: children })) }));
+    const { children, service, serviceId, serviceSlug, appId, asChild, className, ...attrs } = props;
+    return (_jsx(CoreService.Root, { serviceServiceConfig: { service, serviceId, serviceSlug, appId }, children: ({ selected, bookable }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.serviceRoot, "data-selected": selected, "data-bookable": bookable, customElement: children, customElementProps: { selected, bookable }, ...attrs, children: children })) }));
 });
 Root.displayName = 'Service.Root';
 /**

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

@@ -86,13 +86,10 @@ Root.displayName = 'TimeSlotList.Root';
  */
 const RootContent = React.forwardRef((props, ref) => {
     const { children, className, variant } = props;
-    return (_jsx(CoreTimeSlotList.ListData, { children: ({ timeSlots, hasMore, isLoading, error, loadMore }) => (
-        // Add stable `id` for GenericList at the headless boundary only.
-        // The underlying service slots remain raw (no grouping / no extra fields).
-        _jsx(GenericList.Root, { items: timeSlots.map((slot) => ({
+    return (_jsx(CoreTimeSlotList.ListData, { children: ({ timeSlots, hasMore, isLoading, error, loadMore, isSelectionComplete, }) => (_jsx(GenericList.Root, { items: timeSlots.map((slot) => ({
                 ...slot,
                 id: generateSlotKey(slot),
-            })), loadMore: loadMore, hasMore: hasMore, isLoading: isLoading, error: error, className: className, ref: ref, "data-testid": TestIds.timeSlotListRoot, variant: variant, children: children })) }));
+            })), loadMore: loadMore, hasMore: hasMore, isLoading: isLoading, error: error, className: className, ref: ref, "data-testid": TestIds.timeSlotListRoot, "data-selection-complete": isSelectionComplete, variant: variant, children: children })) }));
 });
 RootContent.displayName = 'TimeSlotList.RootContent';
 /**

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

@@ -58,6 +58,7 @@ export interface ListDataRenderProps {
     isLoading: boolean;
     error: string | null;
     loadMore: () => Promise<void>;
+    isSelectionComplete: boolean;
 }
 /**
  * Props for ListData render prop component
@@ -73,7 +74,7 @@ export interface ListDataProps {
  * @example
  * ```tsx
  * <ListData>
- *   {({ timeSlots, hasMore, isLoading, loadMore }) => (
+ *   {({ timeSlots, hasMore, isLoading, loadMore, isSelectionComplete }) => (
  *     <GenericList.Root items={timeSlots} hasMore={hasMore} isLoading={isLoading} loadMore={loadMore}>
  *       {children}
  *     </GenericList.Root>

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

@@ -68,7 +68,7 @@ export function Timezone(props) {
  * @example
  * ```tsx
  * <ListData>
- *   {({ timeSlots, hasMore, isLoading, loadMore }) => (
+ *   {({ timeSlots, hasMore, isLoading, loadMore, isSelectionComplete }) => (
  *     <GenericList.Root items={timeSlots} hasMore={hasMore} isLoading={isLoading} loadMore={loadMore}>
  *       {children}
  *     </GenericList.Root>
@@ -78,12 +78,18 @@ export function Timezone(props) {
  */
 export function ListData(props) {
     const service = useService(TimeSlotListServiceDefinition);
+    const bookingService = useService(BookingServiceDefinition);
+    const selectedTimeSlot = bookingService.serviceSelections.get()[0]?.timeSlot;
+    const hasTimeSlot = !!selectedTimeSlot;
+    const hasSelectedStaffMember = (selectedTimeSlot?.resources?.length ?? 0) === 1;
+    const isSelectionComplete = hasTimeSlot && hasSelectedStaffMember;
     return props.children({
         timeSlots: service.timeSlots.get(),
         hasMore: service.hasMore.get(),
         isLoading: service.isLoading.get(),
         error: service.error.get(),
         loadMore: service.actions.loadMore,
+        isSelectionComplete,
     });
 }
 /**

package/dist/react/service/Service.d.ts

@@ -8,20 +8,49 @@ import { MoneyData } from '@wix/headless-components/react';
 import { type Service, type Payment } from '@wix/auto_sdk_bookings_services';
 import * as ServiceMediaModule from './ServiceMedia.js';
 /**
- * Props for Service.Root component
+ * Base props shared by all Service.Root variants
  */
-export interface ServiceRootProps {
+interface ServiceRootBaseProps {
     children?: React.ReactNode | AsChildChildren<{
         selected: boolean;
         bookable: boolean;
     }>;
-    service: Service;
     appId?: string;
     asChild?: boolean;
     className?: string;
 }
+/**
+ * Props for Service.Root with pre-loaded service object (SSR pattern)
+ */
+type ServiceRootWithService = ServiceRootBaseProps & {
+    service: Service;
+    serviceId?: never;
+    serviceSlug?: never;
+};
+/**
+ * Props for Service.Root with dynamic loading by service ID
+ */
+type ServiceRootWithId = ServiceRootBaseProps & {
+    service?: never;
+    serviceId: string;
+    serviceSlug?: never;
+};
+/**
+ * Props for Service.Root with dynamic loading by service slug
+ */
+type ServiceRootWithSlug = ServiceRootBaseProps & {
+    service?: never;
+    serviceId?: never;
+    serviceSlug: string;
+};
+/**
+ * Props for Service.Root component.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
+ */
+export type ServiceRootProps = ServiceRootWithService | ServiceRootWithId | ServiceRootWithSlug;
 /**
  * Root component that provides service context to the entire app.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
  *
  * @order 1
  * @component
@@ -29,6 +58,7 @@ export interface ServiceRootProps {
  * ```tsx
  * import { Service } from '@wix/bookings/components';
  *
+ * // With pre-loaded service object (SSR pattern)
  * function ServicePage({ service }) {
  *   return (
  *     <Service.Root service={service}>
@@ -37,6 +67,26 @@ export interface ServiceRootProps {
  *     </Service.Root>
  *   );
  * }
+ *
+ * // With dynamic loading by serviceId
+ * function ServicePageById({ serviceId }) {
+ *   return (
+ *     <Service.Root serviceId={serviceId}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
+ *
+ * // With dynamic loading by serviceSlug
+ * function ServicePageBySlug({ slug }) {
+ *   return (
+ *     <Service.Root serviceSlug={slug}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
  * ```
  */
 export declare const Root: React.ForwardRefExoticComponent<ServiceRootProps & React.RefAttributes<HTMLElement>>;

package/dist/react/service/Service.js

@@ -47,6 +47,7 @@ var TestIds;
 })(TestIds || (TestIds = {}));
 /**
  * Root component that provides service context to the entire app.
+ * Requires exactly one of: service, serviceId, or serviceSlug.
  *
  * @order 1
  * @component
@@ -54,6 +55,7 @@ var TestIds;
  * ```tsx
  * import { Service } from '@wix/bookings/components';
  *
+ * // With pre-loaded service object (SSR pattern)
  * function ServicePage({ service }) {
  *   return (
  *     <Service.Root service={service}>
@@ -62,11 +64,31 @@ var TestIds;
  *     </Service.Root>
  *   );
  * }
+ *
+ * // With dynamic loading by serviceId
+ * function ServicePageById({ serviceId }) {
+ *   return (
+ *     <Service.Root serviceId={serviceId}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
+ *
+ * // With dynamic loading by serviceSlug
+ * function ServicePageBySlug({ slug }) {
+ *   return (
+ *     <Service.Root serviceSlug={slug}>
+ *       <Service.Name />
+ *       <Service.Description />
+ *     </Service.Root>
+ *   );
+ * }
  * ```
  */
 export const Root = React.forwardRef((props, ref) => {
-    const { children, service, appId, asChild, className, ...attrs } = props;
-    return (_jsx(CoreService.Root, { serviceServiceConfig: { service, appId }, children: ({ selected, bookable }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.serviceRoot, "data-selected": selected, "data-bookable": bookable, customElement: children, customElementProps: { selected, bookable }, ...attrs, children: children })) }));
+    const { children, service, serviceId, serviceSlug, appId, asChild, className, ...attrs } = props;
+    return (_jsx(CoreService.Root, { serviceServiceConfig: { service, serviceId, serviceSlug, appId }, children: ({ selected, bookable }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.serviceRoot, "data-selected": selected, "data-bookable": bookable, customElement: children, customElementProps: { selected, bookable }, ...attrs, children: children })) }));
 });
 Root.displayName = 'Service.Root';
 /**

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

@@ -86,13 +86,10 @@ Root.displayName = 'TimeSlotList.Root';
  */
 const RootContent = React.forwardRef((props, ref) => {
     const { children, className, variant } = props;
-    return (_jsx(CoreTimeSlotList.ListData, { children: ({ timeSlots, hasMore, isLoading, error, loadMore }) => (
-        // Add stable `id` for GenericList at the headless boundary only.
-        // The underlying service slots remain raw (no grouping / no extra fields).
-        _jsx(GenericList.Root, { items: timeSlots.map((slot) => ({
+    return (_jsx(CoreTimeSlotList.ListData, { children: ({ timeSlots, hasMore, isLoading, error, loadMore, isSelectionComplete, }) => (_jsx(GenericList.Root, { items: timeSlots.map((slot) => ({
                 ...slot,
                 id: generateSlotKey(slot),
-            })), loadMore: loadMore, hasMore: hasMore, isLoading: isLoading, error: error, className: className, ref: ref, "data-testid": TestIds.timeSlotListRoot, variant: variant, children: children })) }));
+            })), loadMore: loadMore, hasMore: hasMore, isLoading: isLoading, error: error, className: className, ref: ref, "data-testid": TestIds.timeSlotListRoot, "data-selection-complete": isSelectionComplete, variant: variant, children: children })) }));
 });
 RootContent.displayName = 'TimeSlotList.RootContent';
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "0.0.41",
+  "version": "0.0.43",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -72,5 +72,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "5847d0ce3b07a2485f7d9b707eee272b9f100b3d13614c2d92018112"
+  "falconPackageHash": "7fc1fdfa9ef983dbdae64fb719cdb4674afcf085f05ecbc425214a9e"
 }