import { type MoneyProps } from '@wix/headless-components/react';
import { type AsChildChildren } from '@wix/headless-utils/react';
import React from 'react';
import { type InvoiceItem } from '../services/invoice-item-service.js';
/**
 * Props for the InvoiceItem Root component.
 */
export interface RootProps {
    /** Invoice item */
    invoiceItem: InvoiceItem;
    /** Whether to render as a child component */
    asChild?: boolean;
    /** Child components */
    children: React.ReactNode;
    /** CSS classes to apply to the default element */
    className?: string;
}
/**
 * Root container that provides invoice item service context to all child components.
 * Must be used as the top-level InvoiceItem component.
 *
 * @order 1
 * @component
 * @example
 * ```tsx
 * import { InvoiceItem } from '@wix/events/components';
 *
 * function InvoiceItemComponent({ invoiceItem }) {
 *   return (
 *     <InvoiceItem.Root invoiceItem={invoiceItem}>
 *       <InvoiceItem.Name />
 *       <InvoiceItem.Price />
 *       <InvoiceItem.Quantity />
 *       <InvoiceItem.Total />
 *     </InvoiceItem.Root>
 *   );
 * }
 * ```
 */
export declare const Root: React.ForwardRefExoticComponent<RootProps & React.RefAttributes<HTMLElement>>;
/**
 * Props for the InvoiceItem Name component.
 */
export interface NameProps {
    /** Whether to render as a child component */
    asChild?: boolean;
    /** Custom render function when using asChild */
    children?: AsChildChildren<{
        /** Invoice item name */
        name: string;
    }>;
    /** CSS classes to apply to the default element */
    className?: string;
}
/**
 * Displays the invoice item name.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <InvoiceItem.Name className="font-medium" />
 *
 * // asChild with primitive
 * <InvoiceItem.Name asChild>
 *   <h3 className="text-lg font-bold" />
 * </InvoiceItem.Name>
 *
 * // asChild with React component
 * <InvoiceItem.Name asChild>
 *   {React.forwardRef(({ name, ...props }, ref) => (
 *     <h3 ref={ref} {...props} className="text-lg font-bold">
 *       {name}
 *     </h3>
 *   ))}
 * </InvoiceItem.Name>
 * ```
 */
export declare const Name: React.ForwardRefExoticComponent<NameProps & React.RefAttributes<HTMLElement>>;
/**
 * Props for the InvoiceItem Price component.
 */
export interface PriceProps extends Omit<MoneyProps, 'money'> {
}
/**
 * Displays the invoice item price.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <InvoiceItem.Price className="text-green-600 font-semibold" />
 *
 * // asChild with primitive
 * <InvoiceItem.Price asChild>
 *   <p className="text-lg text-green-600" />
 * </InvoiceItem.Price>
 *
 * // asChild with React component
 * <InvoiceItem.Price asChild>
 *   {React.forwardRef(({ formattedMoney, formattedMoneyParts, ...props }, ref) => (
 *     <p ref={ref} {...props} className="text-lg text-green-600">
 *       Price: {formattedMoney}
 *     </p>
 *   ))}
 * </InvoiceItem.Price>
 * ```
 */
export declare const Price: React.ForwardRefExoticComponent<PriceProps & React.RefAttributes<HTMLElement>>;
/**
 * Props for the InvoiceItem Quantity component.
 */
export interface QuantityProps {
    /** Whether to render as a child component */
    asChild?: boolean;
    /** Custom render function when using asChild */
    children?: AsChildChildren<{
        /** Invoice item quantity */
        quantity: number;
    }>;
    /** CSS classes to apply to the default element */
    className?: string;
}
/**
 * Displays the invoice item quantity.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <InvoiceItem.Quantity className="text-gray-600" />
 *
 * // asChild with primitive
 * <InvoiceItem.Quantity asChild>
 *   <span className="badge" />
 * </InvoiceItem.Quantity>
 *
 * // asChild with React component
 * <InvoiceItem.Quantity asChild>
 *   {React.forwardRef(({ quantity, ...props }, ref) => (
 *     <span ref={ref} {...props} className="badge">
 *       Qty: {quantity}
 *     </span>
 *   ))}
 * </InvoiceItem.Quantity>
 * ```
 */
export declare const Quantity: React.ForwardRefExoticComponent<QuantityProps & React.RefAttributes<HTMLElement>>;
/**
 * Props for the InvoiceItem Total component.
 */
export interface TotalProps extends Omit<MoneyProps, 'money'> {
}
/**
 * Displays the invoice item total amount.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <InvoiceItem.Total className="font-bold text-xl" />
 *
 * // asChild with primitive
 * <InvoiceItem.Total asChild>
 *   <p className="font-bold text-xl text-green-600" />
 * </InvoiceItem.Total>
 *
 * // asChild with React component
 * <InvoiceItem.Total asChild>
 *   {React.forwardRef(({ formattedMoney, formattedMoneyParts, ...props }, ref) => (
 *     <p ref={ref} {...props} className="font-bold text-xl text-green-600">
 *       Total: {formattedMoney}
 *     </p>
 *   ))}
 * </InvoiceItem.Total>
 * ```
 */
export declare const Total: React.ForwardRefExoticComponent<TotalProps & React.RefAttributes<HTMLElement>>;