@wix/headless-bookings 0.0.38 → 0.0.40

package/cjs/dist/react/payment/PaymentLineItem.d.ts

@@ -1,144 +0,0 @@
-/**
- * PaymentLineItem - Component for displaying individual line item information
- * Used within Payment.LineItemRepeater to display price, discount, deposit, etc.
- */
-import React from 'react';
-import { AsChildChildren } from '@wix/headless-utils/react';
-import { MoneyData } from '@wix/headless-components/react';
-import type { CombinedLineItem } from '../core/payment/Payment.js';
-/**
- * Props for PaymentLineItem.Root component
- */
-export interface RootProps {
-    lineItem: CombinedLineItem;
-    currency: string;
-    children?: React.ReactNode | AsChildChildren<{
-        lineItem: CombinedLineItem;
-        currency: string;
-    }>;
-    asChild?: boolean;
-    className?: string;
-    'data-testid'?: string;
-}
-/**
- * Root component for a single line item.
- * Provides context for child components.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Root lineItem={item} currency="USD">
- *   <PaymentLineItem.Price />
- *   <PaymentLineItem.Discount />
- * </PaymentLineItem.Root>
- * ```
- */
-export declare const Root: React.ForwardRefExoticComponent<RootProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Price component
- */
-export interface PriceProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        totalPrice: MoneyData | null;
-        subtotal: MoneyData | null;
-        tax: MoneyData | null;
-        discount: MoneyData | null;
-        deposit: MoneyData | null;
-        priceText: string | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the line item price with support for different price types.
- * Uses data-attributes for conditional visibility.
- *
- * For CUSTOM rate type services, displays priceText instead of monetary value.
- *
- * @component
- * @example
- * ```tsx
- * // Default usage - renders total price or price text
- * <PaymentLineItem.Price className="text-lg font-bold" />
- *
- * // Custom rendering with full price data
- * <PaymentLineItem.Price asChild>
- *   {({ totalPrice, subtotal, tax, discount, priceText }) => (
- *     <div>
- *       {priceText ? (
- *         <span>{priceText}</span>
- *       ) : (
- *         <>
- *           <span><Money money={totalPrice} /></span>
- *           <span data-has-discount={!!discount?.amount}><Money money={discount} /></span>
- *         </>
- *       )}
- *     </div>
- *   )}
- * </PaymentLineItem.Price>
- * ```
- */
-export declare const Price: React.ForwardRefExoticComponent<PriceProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Discount component
- */
-export interface DiscountProps {
-    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
- * <PaymentLineItem.Discount className="text-green-500" />
- * ```
- */
-export declare const Discount: React.ForwardRefExoticComponent<DiscountProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Deposit component
- */
-export interface DepositProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        deposit: MoneyData | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the line item deposit amount.
- * Uses data-has-deposit attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Deposit className="font-semibold" />
- * ```
- */
-export declare const Deposit: React.ForwardRefExoticComponent<DepositProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.PriceText component
- */
-export interface PriceTextProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        priceText: string | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the custom price text (for CUSTOM rate type services).
- * Uses data-has-price-text attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.PriceText className="text-foreground" />
- * ```
- */
-export declare const PriceText: React.ForwardRefExoticComponent<PriceTextProps & React.RefAttributes<HTMLElement>>;

package/cjs/dist/react/payment/PaymentLineItem.js

@@ -1,141 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * PaymentLineItem - Component for displaying individual line item information
- * Used within Payment.LineItemRepeater to display price, discount, deposit, etc.
- */
-import React from 'react';
-import * as CorePayment from '../core/payment/Payment.js';
-import { AsChildSlot } from '@wix/headless-utils/react';
-import { Money } from '@wix/headless-components/react';
-var TestIds;
-(function (TestIds) {
-    TestIds["paymentLineItemRoot"] = "payment-line-item-root";
-    TestIds["paymentLineItemPrice"] = "payment-line-item-price";
-    TestIds["paymentLineItemDiscount"] = "payment-line-item-discount";
-    TestIds["paymentLineItemDeposit"] = "payment-line-item-deposit";
-    TestIds["paymentLineItemPriceText"] = "payment-line-item-price-text";
-})(TestIds || (TestIds = {}));
-const PaymentLineItemContext = React.createContext(null);
-/**
- * Hook to access PaymentLineItem context
- */
-function usePaymentLineItemContext() {
-    const context = React.useContext(PaymentLineItemContext);
-    if (!context) {
-        throw new Error('usePaymentLineItemContext must be used within a PaymentLineItem.Root component');
-    }
-    return context;
-}
-/**
- * Root component for a single line item.
- * Provides context for child components.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Root lineItem={item} currency="USD">
- *   <PaymentLineItem.Price />
- *   <PaymentLineItem.Discount />
- * </PaymentLineItem.Root>
- * ```
- */
-export const Root = React.forwardRef((props, ref) => {
-    const { lineItem, currency, children, asChild, className, ...attrs } = props;
-    return (_jsx(PaymentLineItemContext.Provider, { value: { lineItem, currency }, children: _jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": attrs['data-testid'] || TestIds.paymentLineItemRoot, customElement: children, customElementProps: { lineItem, currency }, ...attrs, children: _jsx("div", { children: React.isValidElement(children) ? children : null }) }) }));
-});
-Root.displayName = 'PaymentLineItem.Root';
-/**
- * Displays the line item price with support for different price types.
- * Uses data-attributes for conditional visibility.
- *
- * For CUSTOM rate type services, displays priceText instead of monetary value.
- *
- * @component
- * @example
- * ```tsx
- * // Default usage - renders total price or price text
- * <PaymentLineItem.Price className="text-lg font-bold" />
- *
- * // Custom rendering with full price data
- * <PaymentLineItem.Price asChild>
- *   {({ totalPrice, subtotal, tax, discount, priceText }) => (
- *     <div>
- *       {priceText ? (
- *         <span>{priceText}</span>
- *       ) : (
- *         <>
- *           <span><Money money={totalPrice} /></span>
- *           <span data-has-discount={!!discount?.amount}><Money money={discount} /></span>
- *         </>
- *       )}
- *     </div>
- *   )}
- * </PaymentLineItem.Price>
- * ```
- */
-export const Price = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: (priceData) => {
-            const { totalPrice, discount, deposit, priceText } = priceData;
-            // Default rendering based on price type
-            const renderDefaultPrice = () => {
-                // If custom price text (CUSTOM rate type), show text
-                if (priceText) {
-                    return (_jsx("span", { className: className, "data-testid": TestIds.paymentLineItemPrice, children: priceText }));
-                }
-                // Otherwise show monetary price
-                return totalPrice ? (_jsx(Money, { money: totalPrice, className: className })) : null;
-            };
-            return (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemPrice, "data-has-discount": discount !== null && discount.amount > 0, "data-has-deposit": deposit !== null && deposit.amount > 0, "data-has-price-text": !!priceText, customElement: children, customElementProps: priceData, children: renderDefaultPrice() }));
-        } }));
-});
-Price.displayName = 'PaymentLineItem.Price';
-/**
- * Displays the line item discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Discount className="text-green-500" />
- * ```
- */
-export const Discount = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ discount }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemDiscount, "data-has-discount": discount !== null && discount.amount > 0, customElement: children, customElementProps: { discount }, children: discount ? _jsx(Money, { money: discount }) : null })) }));
-});
-Discount.displayName = 'PaymentLineItem.Discount';
-/**
- * Displays the line item deposit amount.
- * Uses data-has-deposit attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Deposit className="font-semibold" />
- * ```
- */
-export const Deposit = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ deposit }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemDeposit, "data-has-deposit": deposit !== null && deposit.amount > 0, customElement: children, customElementProps: { deposit }, children: deposit ? _jsx(Money, { money: deposit }) : null })) }));
-});
-Deposit.displayName = 'PaymentLineItem.Deposit';
-/**
- * Displays the custom price text (for CUSTOM rate type services).
- * Uses data-has-price-text attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.PriceText className="text-foreground" />
- * ```
- */
-export const PriceText = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ priceText }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemPriceText, "data-has-price-text": !!priceText, customElement: children, customElementProps: { priceText }, children: priceText ? _jsx("span", { children: priceText }) : null })) }));
-});
-PriceText.displayName = 'PaymentLineItem.PriceText';

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

@@ -1,144 +0,0 @@
-/**
- * PaymentLineItem - Component for displaying individual line item information
- * Used within Payment.LineItemRepeater to display price, discount, deposit, etc.
- */
-import React from 'react';
-import { AsChildChildren } from '@wix/headless-utils/react';
-import { MoneyData } from '@wix/headless-components/react';
-import type { CombinedLineItem } from '../core/payment/Payment.js';
-/**
- * Props for PaymentLineItem.Root component
- */
-export interface RootProps {
-    lineItem: CombinedLineItem;
-    currency: string;
-    children?: React.ReactNode | AsChildChildren<{
-        lineItem: CombinedLineItem;
-        currency: string;
-    }>;
-    asChild?: boolean;
-    className?: string;
-    'data-testid'?: string;
-}
-/**
- * Root component for a single line item.
- * Provides context for child components.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Root lineItem={item} currency="USD">
- *   <PaymentLineItem.Price />
- *   <PaymentLineItem.Discount />
- * </PaymentLineItem.Root>
- * ```
- */
-export declare const Root: React.ForwardRefExoticComponent<RootProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Price component
- */
-export interface PriceProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        totalPrice: MoneyData | null;
-        subtotal: MoneyData | null;
-        tax: MoneyData | null;
-        discount: MoneyData | null;
-        deposit: MoneyData | null;
-        priceText: string | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the line item price with support for different price types.
- * Uses data-attributes for conditional visibility.
- *
- * For CUSTOM rate type services, displays priceText instead of monetary value.
- *
- * @component
- * @example
- * ```tsx
- * // Default usage - renders total price or price text
- * <PaymentLineItem.Price className="text-lg font-bold" />
- *
- * // Custom rendering with full price data
- * <PaymentLineItem.Price asChild>
- *   {({ totalPrice, subtotal, tax, discount, priceText }) => (
- *     <div>
- *       {priceText ? (
- *         <span>{priceText}</span>
- *       ) : (
- *         <>
- *           <span><Money money={totalPrice} /></span>
- *           <span data-has-discount={!!discount?.amount}><Money money={discount} /></span>
- *         </>
- *       )}
- *     </div>
- *   )}
- * </PaymentLineItem.Price>
- * ```
- */
-export declare const Price: React.ForwardRefExoticComponent<PriceProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Discount component
- */
-export interface DiscountProps {
-    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
- * <PaymentLineItem.Discount className="text-green-500" />
- * ```
- */
-export declare const Discount: React.ForwardRefExoticComponent<DiscountProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.Deposit component
- */
-export interface DepositProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        deposit: MoneyData | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the line item deposit amount.
- * Uses data-has-deposit attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Deposit className="font-semibold" />
- * ```
- */
-export declare const Deposit: React.ForwardRefExoticComponent<DepositProps & React.RefAttributes<HTMLElement>>;
-/**
- * Props for PaymentLineItem.PriceText component
- */
-export interface PriceTextProps {
-    asChild?: boolean;
-    children?: AsChildChildren<{
-        priceText: string | null;
-    }>;
-    className?: string;
-}
-/**
- * Displays the custom price text (for CUSTOM rate type services).
- * Uses data-has-price-text attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.PriceText className="text-foreground" />
- * ```
- */
-export declare const PriceText: React.ForwardRefExoticComponent<PriceTextProps & React.RefAttributes<HTMLElement>>;

package/dist/react/payment/PaymentLineItem.js

@@ -1,141 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * PaymentLineItem - Component for displaying individual line item information
- * Used within Payment.LineItemRepeater to display price, discount, deposit, etc.
- */
-import React from 'react';
-import * as CorePayment from '../core/payment/Payment.js';
-import { AsChildSlot } from '@wix/headless-utils/react';
-import { Money } from '@wix/headless-components/react';
-var TestIds;
-(function (TestIds) {
-    TestIds["paymentLineItemRoot"] = "payment-line-item-root";
-    TestIds["paymentLineItemPrice"] = "payment-line-item-price";
-    TestIds["paymentLineItemDiscount"] = "payment-line-item-discount";
-    TestIds["paymentLineItemDeposit"] = "payment-line-item-deposit";
-    TestIds["paymentLineItemPriceText"] = "payment-line-item-price-text";
-})(TestIds || (TestIds = {}));
-const PaymentLineItemContext = React.createContext(null);
-/**
- * Hook to access PaymentLineItem context
- */
-function usePaymentLineItemContext() {
-    const context = React.useContext(PaymentLineItemContext);
-    if (!context) {
-        throw new Error('usePaymentLineItemContext must be used within a PaymentLineItem.Root component');
-    }
-    return context;
-}
-/**
- * Root component for a single line item.
- * Provides context for child components.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Root lineItem={item} currency="USD">
- *   <PaymentLineItem.Price />
- *   <PaymentLineItem.Discount />
- * </PaymentLineItem.Root>
- * ```
- */
-export const Root = React.forwardRef((props, ref) => {
-    const { lineItem, currency, children, asChild, className, ...attrs } = props;
-    return (_jsx(PaymentLineItemContext.Provider, { value: { lineItem, currency }, children: _jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": attrs['data-testid'] || TestIds.paymentLineItemRoot, customElement: children, customElementProps: { lineItem, currency }, ...attrs, children: _jsx("div", { children: React.isValidElement(children) ? children : null }) }) }));
-});
-Root.displayName = 'PaymentLineItem.Root';
-/**
- * Displays the line item price with support for different price types.
- * Uses data-attributes for conditional visibility.
- *
- * For CUSTOM rate type services, displays priceText instead of monetary value.
- *
- * @component
- * @example
- * ```tsx
- * // Default usage - renders total price or price text
- * <PaymentLineItem.Price className="text-lg font-bold" />
- *
- * // Custom rendering with full price data
- * <PaymentLineItem.Price asChild>
- *   {({ totalPrice, subtotal, tax, discount, priceText }) => (
- *     <div>
- *       {priceText ? (
- *         <span>{priceText}</span>
- *       ) : (
- *         <>
- *           <span><Money money={totalPrice} /></span>
- *           <span data-has-discount={!!discount?.amount}><Money money={discount} /></span>
- *         </>
- *       )}
- *     </div>
- *   )}
- * </PaymentLineItem.Price>
- * ```
- */
-export const Price = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: (priceData) => {
-            const { totalPrice, discount, deposit, priceText } = priceData;
-            // Default rendering based on price type
-            const renderDefaultPrice = () => {
-                // If custom price text (CUSTOM rate type), show text
-                if (priceText) {
-                    return (_jsx("span", { className: className, "data-testid": TestIds.paymentLineItemPrice, children: priceText }));
-                }
-                // Otherwise show monetary price
-                return totalPrice ? (_jsx(Money, { money: totalPrice, className: className })) : null;
-            };
-            return (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemPrice, "data-has-discount": discount !== null && discount.amount > 0, "data-has-deposit": deposit !== null && deposit.amount > 0, "data-has-price-text": !!priceText, customElement: children, customElementProps: priceData, children: renderDefaultPrice() }));
-        } }));
-});
-Price.displayName = 'PaymentLineItem.Price';
-/**
- * Displays the line item discount.
- * Uses data-has-discount attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Discount className="text-green-500" />
- * ```
- */
-export const Discount = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ discount }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemDiscount, "data-has-discount": discount !== null && discount.amount > 0, customElement: children, customElementProps: { discount }, children: discount ? _jsx(Money, { money: discount }) : null })) }));
-});
-Discount.displayName = 'PaymentLineItem.Discount';
-/**
- * Displays the line item deposit amount.
- * Uses data-has-deposit attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.Deposit className="font-semibold" />
- * ```
- */
-export const Deposit = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ deposit }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemDeposit, "data-has-deposit": deposit !== null && deposit.amount > 0, customElement: children, customElementProps: { deposit }, children: deposit ? _jsx(Money, { money: deposit }) : null })) }));
-});
-Deposit.displayName = 'PaymentLineItem.Deposit';
-/**
- * Displays the custom price text (for CUSTOM rate type services).
- * Uses data-has-price-text attribute for conditional visibility.
- *
- * @component
- * @example
- * ```tsx
- * <PaymentLineItem.PriceText className="text-foreground" />
- * ```
- */
-export const PriceText = React.forwardRef((props, ref) => {
-    const { asChild, children, className } = props;
-    const { lineItem, currency } = usePaymentLineItemContext();
-    return (_jsx(CorePayment.LineItem, { lineItem: lineItem, currency: currency, children: ({ priceText }) => (_jsx(AsChildSlot, { ref: ref, asChild: asChild, className: className, "data-testid": TestIds.paymentLineItemPriceText, "data-has-price-text": !!priceText, customElement: children, customElementProps: { priceText }, children: priceText ? _jsx("span", { children: priceText }) : null })) }));
-});
-PriceText.displayName = 'PaymentLineItem.PriceText';