@wix/headless-bookings 0.0.14 → 0.0.15

package/cjs/dist/react/core/service-list/ServiceList.d.ts

@@ -46,6 +46,10 @@ export interface ServicesRenderProps {
     queryOptions: QueryOptions;
     /** Pagination metadata (limit, offset, count, hasNext) */
     pagingMetadata: PagingMetadata;
+    /** Whether more services can be loaded */
+    hasMore: boolean;
+    /** Function to load more services */
+    loadMore: (count: number) => Promise<void>;
 }
 /**
  * Component that provides services list data through render props.

package/cjs/dist/react/core/service-list/ServiceList.js

@@ -48,11 +48,15 @@ export function Services(props) {
     const error = serviceListService.errorSignal.get();
     const queryOptions = serviceListService.queryOptionsSignal.get();
     const pagingMetadata = serviceListService.pagingMetadataSignal.get();
+    const hasMore = serviceListService.hasMoreServicesSignal.get();
+    const loadMore = serviceListService.actions.loadMore;
     return props.children({
         services,
         isLoading,
         error,
         queryOptions,
         pagingMetadata,
+        hasMore,
+        loadMore,
     });
 }

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

@@ -535,17 +535,7 @@ export const StaffMemberRepeater = React.forwardRef((props, ref) => {
     const staffMemberItemWrapper = ({ item: member, children: itemChildren, }) => {
         return (_jsxs(React.Fragment, { children: [_jsx("span", { "data-testid": TestIds.serviceStaffMemberRepeater, children: member.name }), itemChildren] }, member.id));
     };
-    // When asChild is true, provide custom render props
-    if (asChild && typeof children === 'function') {
-        return (_jsx(GenericList.Repeater, { ref: ref, asChild: true, itemWrapper: staffMemberItemWrapper, children: (genericProps) => {
-                const renderProps = {
-                    items: genericProps.items,
-                    itemWrapper: staffMemberItemWrapper,
-                };
-                return children(renderProps);
-            } }));
-    }
-    return (_jsx(GenericList.Repeater, { ref: ref, itemWrapper: staffMemberItemWrapper, children: children }));
+    return (_jsx(GenericList.Repeater, { ref: ref, itemWrapper: staffMemberItemWrapper, asChild: asChild, children: children }));
 });
 StaffMemberRepeater.displayName = 'Service.StaffMembers.StaffMemberRepeater';
 /**

package/cjs/dist/react/service-list/ServiceList.d.ts

@@ -15,6 +15,8 @@ export interface ServiceListRootProps {
     serviceListConfig?: ServiceListServiceConfig;
     className?: string;
     variant?: ListVariant;
+    /** Number of items to load per page. Defaults to config limit or 100 */
+    pageSize?: number;
 }
 /**
  * Root component that provides the ServiceList service context for rendering services lists.

package/cjs/dist/react/service-list/ServiceList.js

@@ -5,8 +5,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import React from 'react';
 import { GenericList, } from '@wix/headless-components/react';
-import { useService } from '@wix/services-manager-react';
-import { ServiceListServiceDefinition } from '../../services/service-list/service-list.js';
 import * as CoreServiceList from '../core/service-list/ServiceList.js';
 import * as Service from '../service/Service.js';
 /**
@@ -44,7 +42,7 @@ var TestIds;
  * ```
  */
 export const Root = React.forwardRef((props, ref) => {
-    const { children, serviceListConfig, className, variant } = props;
+    const { children, serviceListConfig, className, variant, pageSize } = props;
     const serviceConfig = serviceListConfig || {
         services: [],
         options: {
@@ -56,22 +54,29 @@ export const Root = React.forwardRef((props, ref) => {
             },
         },
     };
-    return (_jsx(CoreServiceList.Root, { serviceListConfig: serviceConfig, children: _jsx(RootContent, { className: className, ref: ref, variant: variant, children: children }) }));
+    // Calculate effective page size: prop > config limit > default
+    const effectivePageSize = pageSize ??
+        serviceListConfig?.options?.pagingMetadata?.limit ??
+        DEFAULT_PAGE_SIZE;
+    return (_jsx(CoreServiceList.Root, { serviceListConfig: serviceConfig, children: _jsx(RootContent, { className: className, ref: ref, variant: variant, pageSize: effectivePageSize, children: children }) }));
 });
 Root.displayName = 'ServiceList.Root';
+/**
+ * Default page size for load more
+ */
+const DEFAULT_PAGE_SIZE = 100;
 /**
  * Internal component to handle the Root content with service access
  */
 const RootContent = React.forwardRef((props, ref) => {
-    const { children, className, variant } = props;
-    const serviceListService = useService(ServiceListServiceDefinition);
-    const items = serviceListService.servicesSignal
-        .get()
-        .map((service) => ({
-        ...service,
-        id: service._id,
-    }));
-    return (_jsx(GenericList.Root, { items: items, loadMore: () => serviceListService.actions.loadMore(10), hasMore: serviceListService.hasMoreServicesSignal.get(), isLoading: serviceListService.isLoadingSignal.get(), className: className, ref: ref, "data-testid": TestIds.serviceListRoot, variant: variant, children: children }));
+    const { children, className, variant, pageSize = DEFAULT_PAGE_SIZE } = props;
+    return (_jsx(CoreServiceList.Services, { children: ({ services: servicesList, isLoading, hasMore, loadMore }) => {
+            const items = servicesList.map((service) => ({
+                ...service,
+                id: service._id,
+            }));
+            return (_jsx(GenericList.Root, { items: items, loadMore: () => loadMore(pageSize), hasMore: hasMore, isLoading: isLoading, className: className, ref: ref, "data-testid": TestIds.serviceListRoot, variant: variant, children: children }));
+        } }));
 });
 /**
  * Container for the services list with empty state support.
@@ -126,37 +131,20 @@ Services.displayName = 'ServiceList.Services';
  */
 export const ServiceRepeater = React.forwardRef((props, ref) => {
     const { children, asChild } = props;
-    const serviceListService = useService(ServiceListServiceDefinition);
-    const appId = serviceListService.queryOptionsSignal.get().appId;
     // Check if children is a function that matches ServiceRootChildren pattern
     // (function with single parameter that receives { selected, bookable })
     const isServiceRootFunction = typeof children === 'function' && children.length === 1 && !asChild;
     // Custom itemWrapper that matches ItemWrapperProps signature
     const serviceItemWrapper = (wrapperProps) => {
         const { item: service, children: itemChildren } = wrapperProps;
-        return (_jsx(Service.Root, { service: service, appId: appId, "data-testid": TestIds.serviceListService, "data-service-id": service._id, "data-item-id": service._id, children: isServiceRootFunction
+        return (_jsx(Service.Root, { service: service, "data-testid": TestIds.serviceListService, "data-service-id": service._id, "data-item-id": service._id, children: isServiceRootFunction
                 ? children
                 : itemChildren }, service._id));
     };
-    // Transform children for asChild pattern to provide custom render props
-    const transformedChildren = asChild && typeof children === 'function'
-        ? (genericProps) => {
-            // Create properly typed render props for the consumer
-            const renderProps = {
-                items: genericProps.items,
-                variant: genericProps.variant,
-                itemWrapper: (props) => serviceItemWrapper({
-                    item: props.item,
-                    index: props.index ?? 0,
-                    children: props.children,
-                }),
-            };
-            return children(renderProps, ref);
-        }
-        : isServiceRootFunction
-            ? undefined
-            : children;
-    return (_jsx(GenericList.Repeater, { ref: ref, asChild: asChild, itemWrapper: serviceItemWrapper, children: transformedChildren }));
+    // When isServiceRootFunction is true, children is a function for Service.Root (not repeater render props)
+    // so we pass undefined and let itemWrapper handle the children
+    const repeaterChildren = isServiceRootFunction ? undefined : children;
+    return (_jsx(GenericList.Repeater, { ref: ref, asChild: asChild, itemWrapper: serviceItemWrapper, children: repeaterChildren }));
 });
 ServiceRepeater.displayName = 'ServiceList.ServiceRepeater';
 /**

package/dist/react/core/service-list/ServiceList.d.ts

@@ -46,6 +46,10 @@ export interface ServicesRenderProps {
     queryOptions: QueryOptions;
     /** Pagination metadata (limit, offset, count, hasNext) */
     pagingMetadata: PagingMetadata;
+    /** Whether more services can be loaded */
+    hasMore: boolean;
+    /** Function to load more services */
+    loadMore: (count: number) => Promise<void>;
 }
 /**
  * Component that provides services list data through render props.

package/dist/react/core/service-list/ServiceList.js

@@ -48,11 +48,15 @@ export function Services(props) {
     const error = serviceListService.errorSignal.get();
     const queryOptions = serviceListService.queryOptionsSignal.get();
     const pagingMetadata = serviceListService.pagingMetadataSignal.get();
+    const hasMore = serviceListService.hasMoreServicesSignal.get();
+    const loadMore = serviceListService.actions.loadMore;
     return props.children({
         services,
         isLoading,
         error,
         queryOptions,
         pagingMetadata,
+        hasMore,
+        loadMore,
     });
 }

package/dist/react/service/Service.js

@@ -535,17 +535,7 @@ export const StaffMemberRepeater = React.forwardRef((props, ref) => {
     const staffMemberItemWrapper = ({ item: member, children: itemChildren, }) => {
         return (_jsxs(React.Fragment, { children: [_jsx("span", { "data-testid": TestIds.serviceStaffMemberRepeater, children: member.name }), itemChildren] }, member.id));
     };
-    // When asChild is true, provide custom render props
-    if (asChild && typeof children === 'function') {
-        return (_jsx(GenericList.Repeater, { ref: ref, asChild: true, itemWrapper: staffMemberItemWrapper, children: (genericProps) => {
-                const renderProps = {
-                    items: genericProps.items,
-                    itemWrapper: staffMemberItemWrapper,
-                };
-                return children(renderProps);
-            } }));
-    }
-    return (_jsx(GenericList.Repeater, { ref: ref, itemWrapper: staffMemberItemWrapper, children: children }));
+    return (_jsx(GenericList.Repeater, { ref: ref, itemWrapper: staffMemberItemWrapper, asChild: asChild, children: children }));
 });
 StaffMemberRepeater.displayName = 'Service.StaffMembers.StaffMemberRepeater';
 /**

package/dist/react/service-list/ServiceList.d.ts

@@ -15,6 +15,8 @@ export interface ServiceListRootProps {
     serviceListConfig?: ServiceListServiceConfig;
     className?: string;
     variant?: ListVariant;
+    /** Number of items to load per page. Defaults to config limit or 100 */
+    pageSize?: number;
 }
 /**
  * Root component that provides the ServiceList service context for rendering services lists.

package/dist/react/service-list/ServiceList.js

@@ -5,8 +5,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import React from 'react';
 import { GenericList, } from '@wix/headless-components/react';
-import { useService } from '@wix/services-manager-react';
-import { ServiceListServiceDefinition } from '../../services/service-list/service-list.js';
 import * as CoreServiceList from '../core/service-list/ServiceList.js';
 import * as Service from '../service/Service.js';
 /**
@@ -44,7 +42,7 @@ var TestIds;
  * ```
  */
 export const Root = React.forwardRef((props, ref) => {
-    const { children, serviceListConfig, className, variant } = props;
+    const { children, serviceListConfig, className, variant, pageSize } = props;
     const serviceConfig = serviceListConfig || {
         services: [],
         options: {
@@ -56,22 +54,29 @@ export const Root = React.forwardRef((props, ref) => {
             },
         },
     };
-    return (_jsx(CoreServiceList.Root, { serviceListConfig: serviceConfig, children: _jsx(RootContent, { className: className, ref: ref, variant: variant, children: children }) }));
+    // Calculate effective page size: prop > config limit > default
+    const effectivePageSize = pageSize ??
+        serviceListConfig?.options?.pagingMetadata?.limit ??
+        DEFAULT_PAGE_SIZE;
+    return (_jsx(CoreServiceList.Root, { serviceListConfig: serviceConfig, children: _jsx(RootContent, { className: className, ref: ref, variant: variant, pageSize: effectivePageSize, children: children }) }));
 });
 Root.displayName = 'ServiceList.Root';
+/**
+ * Default page size for load more
+ */
+const DEFAULT_PAGE_SIZE = 100;
 /**
  * Internal component to handle the Root content with service access
  */
 const RootContent = React.forwardRef((props, ref) => {
-    const { children, className, variant } = props;
-    const serviceListService = useService(ServiceListServiceDefinition);
-    const items = serviceListService.servicesSignal
-        .get()
-        .map((service) => ({
-        ...service,
-        id: service._id,
-    }));
-    return (_jsx(GenericList.Root, { items: items, loadMore: () => serviceListService.actions.loadMore(10), hasMore: serviceListService.hasMoreServicesSignal.get(), isLoading: serviceListService.isLoadingSignal.get(), className: className, ref: ref, "data-testid": TestIds.serviceListRoot, variant: variant, children: children }));
+    const { children, className, variant, pageSize = DEFAULT_PAGE_SIZE } = props;
+    return (_jsx(CoreServiceList.Services, { children: ({ services: servicesList, isLoading, hasMore, loadMore }) => {
+            const items = servicesList.map((service) => ({
+                ...service,
+                id: service._id,
+            }));
+            return (_jsx(GenericList.Root, { items: items, loadMore: () => loadMore(pageSize), hasMore: hasMore, isLoading: isLoading, className: className, ref: ref, "data-testid": TestIds.serviceListRoot, variant: variant, children: children }));
+        } }));
 });
 /**
  * Container for the services list with empty state support.
@@ -126,37 +131,20 @@ Services.displayName = 'ServiceList.Services';
  */
 export const ServiceRepeater = React.forwardRef((props, ref) => {
     const { children, asChild } = props;
-    const serviceListService = useService(ServiceListServiceDefinition);
-    const appId = serviceListService.queryOptionsSignal.get().appId;
     // Check if children is a function that matches ServiceRootChildren pattern
     // (function with single parameter that receives { selected, bookable })
     const isServiceRootFunction = typeof children === 'function' && children.length === 1 && !asChild;
     // Custom itemWrapper that matches ItemWrapperProps signature
     const serviceItemWrapper = (wrapperProps) => {
         const { item: service, children: itemChildren } = wrapperProps;
-        return (_jsx(Service.Root, { service: service, appId: appId, "data-testid": TestIds.serviceListService, "data-service-id": service._id, "data-item-id": service._id, children: isServiceRootFunction
+        return (_jsx(Service.Root, { service: service, "data-testid": TestIds.serviceListService, "data-service-id": service._id, "data-item-id": service._id, children: isServiceRootFunction
                 ? children
                 : itemChildren }, service._id));
     };
-    // Transform children for asChild pattern to provide custom render props
-    const transformedChildren = asChild && typeof children === 'function'
-        ? (genericProps) => {
-            // Create properly typed render props for the consumer
-            const renderProps = {
-                items: genericProps.items,
-                variant: genericProps.variant,
-                itemWrapper: (props) => serviceItemWrapper({
-                    item: props.item,
-                    index: props.index ?? 0,
-                    children: props.children,
-                }),
-            };
-            return children(renderProps, ref);
-        }
-        : isServiceRootFunction
-            ? undefined
-            : children;
-    return (_jsx(GenericList.Repeater, { ref: ref, asChild: asChild, itemWrapper: serviceItemWrapper, children: transformedChildren }));
+    // When isServiceRootFunction is true, children is a function for Service.Root (not repeater render props)
+    // so we pass undefined and let itemWrapper handle the children
+    const repeaterChildren = isServiceRootFunction ? undefined : children;
+    return (_jsx(GenericList.Repeater, { ref: ref, asChild: asChild, itemWrapper: serviceItemWrapper, children: repeaterChildren }));
 });
 ServiceRepeater.displayName = 'ServiceList.ServiceRepeater';
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-bookings",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -68,5 +68,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "e3681a6dd045861d1cb7cefbdc04f1ad9e3eb62094bb6a8970b90cd2"
+  "falconPackageHash": "d56b9bfa88501c3f0e6edec7314578de67940d2a7e425c0c34fa3c3c"
 }