@wix/headless-bookings 0.0.87 → 0.0.89

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

@@ -0,0 +1,64 @@
+/**
+ * BookingItem - Components for displaying booking item details
+ * Must be used within Booking.BookingItemRepeater context
+ */
+import React from 'react';
+import { type AsChildChildren } from '@wix/headless-utils/react';
+export interface ServiceProps {
+    children: React.ReactNode;
+}
+/**
+ * Wraps Service.Root with the service from the current booking item context.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.Service>
+ *   <Service.Name className="text-xl font-bold" />
+ *   <Service.Price />
+ * </BookingItem.Service>
+ * ```
+ */
+export declare function Service(props: ServiceProps): React.ReactNode;
+export declare namespace Service {
+    var displayName: string;
+}
+export interface TimeSlotProps {
+    children: React.ReactNode;
+}
+/**
+ * Wraps TimeSlot.Root with the timeSlot from the current booking item context.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.TimeSlot>
+ *   <TimeSlot.StartDate />
+ *   <TimeSlot.EndDate />
+ * </BookingItem.TimeSlot>
+ * ```
+ */
+export declare function TimeSlot(props: TimeSlotProps): React.ReactNode;
+export declare namespace TimeSlot {
+    var displayName: string;
+}
+export interface StaffNameProps {
+    asChild?: boolean;
+    children?: AsChildChildren<{
+        name: string;
+    }>;
+    className?: string;
+}
+/**
+ * Displays the staff member's name from the current booking item.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.StaffName className="text-foreground" />
+ * ```
+ */
+export declare const StaffName: React.ForwardRefExoticComponent<StaffNameProps & React.RefAttributes<HTMLElement>>;

package/dist/react/booking/BookingItem.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * BookingItem - Components for displaying booking item details
+ * Must be used within Booking.BookingItemRepeater context
+ */
+import React from 'react';
+import * as CoreBooking from '../core/booking/Booking.js';
+import { AsChildSlot } from '@wix/headless-utils/react';
+import * as ServiceComponent from '../service/Service.js';
+import * as TimeSlotComponent from '../time-slot-list/TimeSlot.js';
+var TestIds;
+(function (TestIds) {
+    TestIds["bookingItemService"] = "booking-item-service";
+    TestIds["bookingItemTimeSlot"] = "booking-item-time-slot";
+    TestIds["bookingItemStaffName"] = "booking-item-staff-name";
+})(TestIds || (TestIds = {}));
+/**
+ * Wraps Service.Root with the service from the current booking item context.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.Service>
+ *   <Service.Name className="text-xl font-bold" />
+ *   <Service.Price />
+ * </BookingItem.Service>
+ * ```
+ */
+export function Service(props) {
+    const { children } = props;
+    return (_jsx(CoreBooking.BookingItemInfo, { children: ({ service }) => (_jsx(ServiceComponent.Root, { service: service, children: children })) }));
+}
+Service.displayName = 'BookingItem.Service';
+/**
+ * Wraps TimeSlot.Root with the timeSlot from the current booking item context.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.TimeSlot>
+ *   <TimeSlot.StartDate />
+ *   <TimeSlot.EndDate />
+ * </BookingItem.TimeSlot>
+ * ```
+ */
+export function TimeSlot(props) {
+    const { children } = props;
+    return (_jsx(CoreBooking.BookingItemInfo, { children: ({ timeSlot }) => timeSlot ? (_jsx(TimeSlotComponent.Root, { timeSlot: timeSlot, children: children })) : null }));
+}
+TimeSlot.displayName = 'BookingItem.TimeSlot';
+/**
+ * Displays the staff member's name from the current booking item.
+ * Must be used within Booking.BookingItemRepeater.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * <BookingItem.StaffName className="text-foreground" />
+ * ```
+ */
+export const StaffName = React.forwardRef((props, ref) => {
+    const { asChild, children, className } = props;
+    return (_jsx(CoreBooking.BookingItemInfo, { children: ({ staffName }) => {
+            if (!staffName)
+                return null;
+            return (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.bookingItemStaffName, customElement: children, customElementProps: { name: staffName }, children: _jsx("span", { children: staffName }) }));
+        } }));
+});
+StaffName.displayName = 'BookingItem.StaffName';

package/dist/react/core/payment/Payment.d.ts

@@ -19,13 +19,13 @@ export interface RootProps {
     /** Pricing service selections for lazy loading (triggers API call) */
     pricingServiceSelections?: PricingServiceSelection[];
     /** Number of participants for lazy loading */
-    numberOfParticipants?: number;
+    totalParticipants?: number;
 }
 /**
  * Root component that provides payment context.
  * Supports 3 modes:
  * 1. SSR: paymentServiceConfig.paymentDetails - pre-fetched data
- * 2. Lazy loading: pricingServiceSelections + numberOfParticipants props - calls API on init
+ * 2. Lazy loading: pricingServiceSelections + totalParticipants props - calls API on init
  * 3. Reactive: no config/props - reads from BookingService signals
  *
  * @component
@@ -37,7 +37,7 @@ export interface RootProps {
  * </Payment.Root>
  *
  * // Lazy loading mode
- * <Payment.Root pricingServiceSelections={[...]} numberOfParticipants={2}>
+ * <Payment.Root pricingServiceSelections={[...]} totalParticipants={2}>
  *   {({ isLoading }) => isLoading ? <div>Loading...</div> : <Payment.Total />}
  * </Payment.Root>
  *

package/dist/react/core/payment/Payment.js

@@ -26,7 +26,7 @@ function RootContent({ children, }) {
  * Root component that provides payment context.
  * Supports 3 modes:
  * 1. SSR: paymentServiceConfig.paymentDetails - pre-fetched data
- * 2. Lazy loading: pricingServiceSelections + numberOfParticipants props - calls API on init
+ * 2. Lazy loading: pricingServiceSelections + totalParticipants props - calls API on init
  * 3. Reactive: no config/props - reads from BookingService signals
  *
  * @component
@@ -38,7 +38,7 @@ function RootContent({ children, }) {
  * </Payment.Root>
  *
  * // Lazy loading mode
- * <Payment.Root pricingServiceSelections={[...]} numberOfParticipants={2}>
+ * <Payment.Root pricingServiceSelections={[...]} totalParticipants={2}>
  *   {({ isLoading }) => isLoading ? <div>Loading...</div> : <Payment.Total />}
  * </Payment.Root>
  *
@@ -49,12 +49,12 @@ function RootContent({ children, }) {
  * ```
  */
 export function Root(props) {
-    const { children, paymentServiceConfig = {}, pricingServiceSelections, numberOfParticipants, } = props;
+    const { children, paymentServiceConfig = {}, pricingServiceSelections, totalParticipants, } = props;
     // Merge public config with lazy loading props into internal config
     const internalConfig = {
         ...paymentServiceConfig,
         pricingServiceSelections,
-        numberOfParticipants,
+        totalParticipants,
     };
     return (_jsx(WixServices, { servicesMap: createServicesMap().addService(PaymentServiceDefinition, PaymentService, internalConfig), disposeOnUnmount: true, children: _jsx(RootContent, { children: children }) }));
 }

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

@@ -90,6 +90,8 @@ export interface DateRangeRenderProps {
     startDate: Date;
     endDate: Date;
     setDateRange: (start: Date, end: Date) => void;
+    /** IANA timezone string for the time slots (e.g., "America/New_York") */
+    timezone: string | undefined;
 }
 /**
  * Props for DateRange render prop component

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

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

package/dist/react/index.d.ts

@@ -1,4 +1,5 @@
 export * as Booking from './booking/Booking.js';
+export * as BookingItem from './booking/BookingItem.js';
 export * as BookingForm from './booking-form/BookingForm.js';
 export * as Service from './service/Service.js';
 export * as ServiceMedia from './service/ServiceMedia.js';

package/dist/react/index.js

@@ -1,4 +1,5 @@
 export * as Booking from './booking/Booking.js';
+export * as BookingItem from './booking/BookingItem.js';
 export * as BookingForm from './booking-form/BookingForm.js';
 export * as Service from './service/Service.js';
 export * as ServiceMedia from './service/ServiceMedia.js';

package/dist/react/payment/Payment.d.ts

@@ -19,7 +19,7 @@ export interface RootProps {
     /** Pricing service selections for lazy loading (triggers API call) */
     pricingServiceSelections?: PricingServiceSelection[];
     /** Number of participants for lazy loading */
-    numberOfParticipants?: number;
+    totalParticipants?: number;
     asChild?: boolean;
     className?: string;
 }
@@ -27,7 +27,7 @@ export interface RootProps {
  * Root component that provides payment context to the entire app.
  * Supports 3 modes:
  * 1. SSR: paymentServiceConfig.paymentDetails - pre-fetched data
- * 2. Lazy loading: pricingServiceSelections + numberOfParticipants props - calls API via useEffect
+ * 2. Lazy loading: pricingServiceSelections + totalParticipants props - calls API via useEffect
  * 3. Reactive: no config/props - reads from BookingService signals
  *
  * @order 1
@@ -48,7 +48,7 @@ export interface RootProps {
  * // Lazy loading mode
  * function LazyPayment({ slotServices }) {
  *   return (
- *     <Payment.Root slotServices={slotServices} numberOfParticipants={2}>
+ *     <Payment.Root slotServices={slotServices} totalParticipants={2}>
  *       {({ isLoading }) => isLoading ? <div>Loading...</div> : <Payment.Total />}
  *     </Payment.Root>
  *   );
@@ -109,27 +109,6 @@ export interface TaxProps {
  * ```
  */
 export declare const Tax: React.ForwardRefExoticComponent<TaxProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for Payment.Discount component
- */
-export interface DiscountProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        discount: MoneyData | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the payment discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <Payment.Discount className="text-green-500" />
- * ```
- */
-export declare const Discount: React.ForwardRefExoticComponent<DiscountProps & React.RefAttributes<HTMLElement>>;
 /**
  * Props for Payment.Total component
  */
@@ -280,7 +259,6 @@ export interface LineItemRepeaterProps {
  * ```tsx
  * <Payment.LineItemRepeater>
  *   <Payment.LineItemTotal />
- *   <Payment.LineItemDiscount />
  * </Payment.LineItemRepeater>
  * ```
  */
@@ -329,27 +307,6 @@ export interface LineItemSubtotalProps {
  * ```
  */
 export declare const LineItemSubtotal: React.ForwardRefExoticComponent<LineItemSubtotalProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for Payment.LineItemDiscount component
- */
-export interface LineItemDiscountProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        discount: MoneyData | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the line item discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <Payment.LineItemDiscount className="text-green-500" />
- * ```
- */
-export declare const LineItemDiscount: React.ForwardRefExoticComponent<LineItemDiscountProps & React.RefAttributes<HTMLElement>>;
 /**
  * Props for Payment.LineItemDeposit component
  */

package/dist/react/payment/Payment.js

@@ -12,7 +12,6 @@ var TestIds;
     TestIds["paymentRoot"] = "payment-root";
     TestIds["paymentSubtotal"] = "payment-subtotal";
     TestIds["paymentTax"] = "payment-tax";
-    TestIds["paymentDiscount"] = "payment-discount";
     TestIds["paymentTotal"] = "payment-total";
     TestIds["paymentPayNow"] = "payment-pay-now";
     TestIds["paymentPayLater"] = "payment-pay-later";
@@ -21,14 +20,13 @@ var TestIds;
     TestIds["paymentLineItemRepeater"] = "payment-line-item-repeater";
     TestIds["paymentLineItemTotal"] = "payment-line-item-total";
     TestIds["paymentLineItemSubtotal"] = "payment-line-item-subtotal";
-    TestIds["paymentLineItemDiscount"] = "payment-line-item-discount";
     TestIds["paymentLineItemDeposit"] = "payment-line-item-deposit";
 })(TestIds || (TestIds = {}));
 /**
  * Root component that provides payment context to the entire app.
  * Supports 3 modes:
  * 1. SSR: paymentServiceConfig.paymentDetails - pre-fetched data
- * 2. Lazy loading: pricingServiceSelections + numberOfParticipants props - calls API via useEffect
+ * 2. Lazy loading: pricingServiceSelections + totalParticipants props - calls API via useEffect
  * 3. Reactive: no config/props - reads from BookingService signals
  *
  * @order 1
@@ -49,7 +47,7 @@ var TestIds;
  * // Lazy loading mode
  * function LazyPayment({ slotServices }) {
  *   return (
- *     <Payment.Root slotServices={slotServices} numberOfParticipants={2}>
+ *     <Payment.Root slotServices={slotServices} totalParticipants={2}>
  *       {({ isLoading }) => isLoading ? <div>Loading...</div> : <Payment.Total />}
  *     </Payment.Root>
  *   );
@@ -57,8 +55,8 @@ var TestIds;
  * ```
  */
 export const Root = React.forwardRef((props, ref) => {
-    const { children, paymentServiceConfig, pricingServiceSelections, numberOfParticipants, asChild, className, ...attrs } = props;
-    return (_jsx(CorePayment.Root, { paymentServiceConfig: paymentServiceConfig, pricingServiceSelections: pricingServiceSelections, numberOfParticipants: numberOfParticipants, children: ({ isLoading, hasError }) => {
+    const { children, paymentServiceConfig, pricingServiceSelections, totalParticipants, asChild, className, ...attrs } = props;
+    return (_jsx(CorePayment.Root, { paymentServiceConfig: paymentServiceConfig, pricingServiceSelections: pricingServiceSelections, totalParticipants: totalParticipants, children: ({ isLoading, hasError }) => {
             return (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentRoot, "data-loading": isLoading, "data-has-error": hasError, customElement: children, customElementProps: { isLoading, hasError }, ...attrs, children: children }));
         } }));
 });
@@ -106,21 +104,6 @@ export const Tax = React.forwardRef((props, ref) => {
     return (_jsx(CorePayment.Data, { children: ({ tax, hasTax }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentTax, "data-has-tax": hasTax, customElement: children, customElementProps: { tax }, children: hasTax && _jsx(Money, { money: tax }) })) }));
 });
 Tax.displayName = 'Payment.Tax';
-/**
- * Displays the payment discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <Payment.Discount className="text-green-500" />
- * ```
- */
-export const Discount = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    return (_jsx(CorePayment.Data, { children: ({ discount, hasDiscount }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentDiscount, "data-has-discount": hasDiscount, customElement: children, customElementProps: { discount }, children: hasDiscount && _jsx(Money, { money: discount }) })) }));
-});
-Discount.displayName = 'Payment.Discount';
 /**
  * Displays the payment total.
  * Always displays the monetary value. Exposes customPrice for custom rendering.
@@ -249,7 +232,6 @@ const LineItemWrapper = ({ item, currency, children, }) => {
  * ```tsx
  * <Payment.LineItemRepeater>
  *   <Payment.LineItemTotal />
- *   <Payment.LineItemDiscount />
  * </Payment.LineItemRepeater>
  * ```
  */
@@ -289,21 +271,6 @@ export const LineItemSubtotal = React.forwardRef((props, ref) => {
     return (_jsx(CorePayment.LineItemInfo, { children: ({ subtotal, customPrice }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemSubtotal, "data-has-custom-price": !!customPrice, customElement: children, customElementProps: { subtotal, customPrice }, children: customPrice ? (_jsx("span", { children: customPrice })) : (subtotal && _jsx(Money, { money: subtotal })) })) }));
 });
 LineItemSubtotal.displayName = 'Payment.LineItemSubtotal';
-/**
- * Displays the line item discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <Payment.LineItemDiscount className="text-green-500" />
- * ```
- */
-export const LineItemDiscount = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    return (_jsx(CorePayment.LineItemInfo, { children: ({ discount, hasDiscount }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemDiscount, "data-has-discount": hasDiscount, customElement: children, customElementProps: { discount }, children: hasDiscount && _jsx(Money, { money: discount }) })) }));
-});
-LineItemDiscount.displayName = 'Payment.LineItemDiscount';
 /**
  * Displays the line item deposit amount.
  * Uses data-has-deposit attribute for conditional visibility.

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

@@ -1178,7 +1178,5 @@ export declare const StaffMembers: typeof StaffMembersBase & {
 };
 export declare const MainMedia: React.ForwardRefExoticComponent<ServiceMediaModule.MainProps & React.RefAttributes<HTMLImageElement>>;
 export declare const CoverMedia: React.ForwardRefExoticComponent<ServiceMediaModule.CoverProps & React.RefAttributes<HTMLImageElement>>;
-export declare const MediaGallery: React.FC<ServiceMediaModule.GalleryProps>;
 export type { MainProps as MainMediaProps } from './ServiceMedia.js';
 export type { CoverProps as CoverMediaProps } from './ServiceMedia.js';
-export type { GalleryProps as MediaGalleryProps } from './ServiceMedia.js';

package/dist/react/service/Service.js

@@ -5,8 +5,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import React from 'react';
 import * as CoreService from '../core/service/Service.js';
+import * as CoreServiceMediaGallery from '../core/service/ServiceMediaGallery.js';
 import { AsChildSlot } from '@wix/headless-utils/react';
 import { Money } from '@wix/headless-components/react';
+import { MediaGallery } from '@wix/headless-media/react';
 import { RateType, } from '@wix/auto_sdk_bookings_services';
 import * as LocationList from '../location/LocationList.js';
 // Note: Location components are used inside LocationList.LocationRepeater
@@ -118,7 +120,7 @@ export const Root = React.forwardRef((props, ref) => {
         serviceSlug,
         appId,
     };
-    return (_jsx(CoreService.Root, { serviceServiceConfig: serviceServiceConfig, 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 })) }));
+    return (_jsx(CoreService.Root, { serviceServiceConfig: serviceServiceConfig, children: ({ selected, bookable }) => (_jsx(CoreServiceMediaGallery.MediaGallery, { children: ({ mediaItems }) => (_jsx(MediaGallery.Root, { mediaGalleryServiceConfig: { media: mediaItems }, children: _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';
 /**
@@ -1131,5 +1133,3 @@ export const MainMedia = ServiceMediaModule.Main;
 MainMedia.displayName = 'Service.MainMedia';
 export const CoverMedia = ServiceMediaModule.Cover;
 CoverMedia.displayName = 'Service.CoverMedia';
-export const MediaGallery = ServiceMediaModule.Gallery;
-MediaGallery.displayName = 'Service.MediaGallery';

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

@@ -1,6 +1,6 @@
 /**
  * ServiceMedia - Compound component for displaying service media
- * Provides components for displaying main media, cover media, and media galleries
+ * Provides components for displaying main media and cover media images
  */
 import React from 'react';
 import { AsChildChildren } from '@wix/headless-utils/react';
@@ -105,67 +105,6 @@ export interface CoverProps {
  * ```
  */
 export declare const Cover: React.ForwardRefExoticComponent<CoverProps & React.RefAttributes<HTMLImageElement>>;
-/**
- * Props for ServiceMedia.Gallery component
- */
-export interface GalleryProps {
-    /** Child components to render within the gallery (MediaGallery components) */
-    children: React.ReactNode;
-    /** Whether the gallery should loop infinitely */
-    infinite?: boolean;
-    /** Auto-play configuration for the gallery */
-    autoPlay?: {
-        /** Direction of auto-play */
-        direction?: 'forward' | 'backward';
-        /** Interval between slides in milliseconds */
-        intervalMs?: number;
-    };
-}
-/**
- * Container for service media items gallery.
- * Renders a MediaGallery.Root with the service media items.
- * Supports autoPlay and infinite scroll options for carousel behavior.
- *
- * @component
- * @example
- * ```tsx
- * // Basic usage with MediaGallery components
- * <ServiceMedia.Gallery>
- *   <MediaGallery.Thumbnails>
- *     <MediaGallery.ThumbnailRepeater>
- *       <MediaGallery.ThumbnailItem />
- *     </MediaGallery.ThumbnailRepeater>
- *   </MediaGallery.Thumbnails>
- * </ServiceMedia.Gallery>
- *
- * // With autoPlay carousel
- * <ServiceMedia.Gallery
- *   autoPlay={{ direction: 'forward', intervalMs: 3000 }}
- *   infinite
- * >
- *   <MediaGallery.Viewport />
- *   <MediaGallery.Previous />
- *   <MediaGallery.Next />
- * </ServiceMedia.Gallery>
- *
- * // Full gallery with thumbnails and navigation
- * <ServiceMedia.Gallery infinite>
- *   <div className="gallery-container">
- *     <MediaGallery.Viewport className="main-image" />
- *     <div className="controls">
- *       <MediaGallery.Previous>Prev</MediaGallery.Previous>
- *       <MediaGallery.Next>Next</MediaGallery.Next>
- *     </div>
- *     <MediaGallery.Thumbnails>
- *       <MediaGallery.ThumbnailRepeater>
- *         <MediaGallery.ThumbnailItem />
- *       </MediaGallery.ThumbnailRepeater>
- *     </MediaGallery.Thumbnails>
- *   </div>
- * </ServiceMedia.Gallery>
- * ```
- */
-export declare const Gallery: React.FC<GalleryProps>;
 /**
  * ServiceMedia compound component for displaying service media
  *
@@ -186,6 +125,5 @@ export declare const Gallery: React.FC<GalleryProps>;
 export declare const ServiceMedia: {
     Main: React.ForwardRefExoticComponent<MainProps & React.RefAttributes<HTMLImageElement>>;
     Cover: React.ForwardRefExoticComponent<CoverProps & React.RefAttributes<HTMLImageElement>>;
-    Gallery: React.FC<GalleryProps>;
 };
 export default ServiceMedia;

package/dist/react/service/ServiceMedia.js

@@ -1,15 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * ServiceMedia - Compound component for displaying service media
- * Provides components for displaying main media, cover media, and media galleries
+ * Provides components for displaying main media and cover media images
  */
 import React from 'react';
 import { AsChildSlot } from '@wix/headless-utils/react';
 import { WixMediaImage } from '@wix/headless-media/react';
-import { MediaGallery } from '@wix/headless-media/react';
 import * as CoreServiceMediaMain from '../core/service/ServiceMediaMain.js';
 import * as CoreServiceMediaCover from '../core/service/ServiceMediaCover.js';
-import * as CoreServiceMediaGallery from '../core/service/ServiceMediaGallery.js';
 var TestIds;
 (function (TestIds) {
     TestIds["serviceMediaMain"] = "service-media-main";
@@ -94,62 +92,6 @@ export const Cover = React.forwardRef((props, ref) => {
     return (_jsx(CoreServiceMediaCover.CoverMedia, { children: ({ coverMedia }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.serviceMediaCover, customElement: children, customElementProps: { media: coverMedia }, children: coverMedia?.image ? _jsx(WixMediaImage, { media: coverMedia }) : null })) }));
 });
 Cover.displayName = 'ServiceMedia.Cover';
-/**
- * Container for service media items gallery.
- * Renders a MediaGallery.Root with the service media items.
- * Supports autoPlay and infinite scroll options for carousel behavior.
- *
- * @component
- * @example
- * ```tsx
- * // Basic usage with MediaGallery components
- * <ServiceMedia.Gallery>
- *   <MediaGallery.Thumbnails>
- *     <MediaGallery.ThumbnailRepeater>
- *       <MediaGallery.ThumbnailItem />
- *     </MediaGallery.ThumbnailRepeater>
- *   </MediaGallery.Thumbnails>
- * </ServiceMedia.Gallery>
- *
- * // With autoPlay carousel
- * <ServiceMedia.Gallery
- *   autoPlay={{ direction: 'forward', intervalMs: 3000 }}
- *   infinite
- * >
- *   <MediaGallery.Viewport />
- *   <MediaGallery.Previous />
- *   <MediaGallery.Next />
- * </ServiceMedia.Gallery>
- *
- * // Full gallery with thumbnails and navigation
- * <ServiceMedia.Gallery infinite>
- *   <div className="gallery-container">
- *     <MediaGallery.Viewport className="main-image" />
- *     <div className="controls">
- *       <MediaGallery.Previous>Prev</MediaGallery.Previous>
- *       <MediaGallery.Next>Next</MediaGallery.Next>
- *     </div>
- *     <MediaGallery.Thumbnails>
- *       <MediaGallery.ThumbnailRepeater>
- *         <MediaGallery.ThumbnailItem />
- *       </MediaGallery.ThumbnailRepeater>
- *     </MediaGallery.Thumbnails>
- *   </div>
- * </ServiceMedia.Gallery>
- * ```
- */
-export const Gallery = (props) => {
-    const { children, infinite, autoPlay } = props;
-    return (_jsx(CoreServiceMediaGallery.MediaGallery, { children: ({ mediaItems }) => {
-            const mediaGalleryServiceConfig = {
-                media: mediaItems,
-                infinite,
-                autoPlay,
-            };
-            return (_jsx(MediaGallery.Root, { mediaGalleryServiceConfig: mediaGalleryServiceConfig, children: children }));
-        } }));
-};
-Gallery.displayName = 'ServiceMedia.Gallery';
 /**
  * ServiceMedia compound component for displaying service media
  *
@@ -170,6 +112,5 @@ Gallery.displayName = 'ServiceMedia.Gallery';
 export const ServiceMedia = {
     Main,
     Cover,
-    Gallery,
 };
 export default ServiceMedia;