import React from 'react';
import type { Variant } from '../services/types.js';
import { type AsChildChildren } from '@wix/headless-utils/react';
import { type MoneyProps } from '@wix/headless-components/react';
export interface VariantRootProps {
    children: React.ReactNode;
    variant: Variant & {
        priceInfo?: {
            price?: string;
            formattedPrice?: string;
        };
    };
}
export interface VariantNameProps {
    /** Whether to render as a child component */
    asChild?: boolean;
    /** Custom render function when using asChild */
    children?: AsChildChildren<{
        name: string;
    }>;
    /** CSS classes to apply to the default element */
    className?: string;
}
export interface VariantPriceProps {
    /** Whether to render as a child component */
    asChild?: boolean;
    /** Custom render function when using asChild */
    children?: MoneyProps['children'];
    /** CSS classes to apply to the default element */
    className?: string;
}
/**
 * Root component that provides variant context to its children.
 *
 * @warning Do not use this component directly if it's inside a repeater.
 * Use the repeater component (e.g., Item.VariantsRepeater) instead, which will
 * automatically render this Root component for each variant.
 */
export declare function Root(props: VariantRootProps): import("react/jsx-runtime").JSX.Element | null;
/**
 * Displays the variant name with customizable rendering following the documented API.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <Variant.Name className="text-lg font-semibold" />
 *
 * // asChild with primitive
 * <Variant.Name asChild>
 *   <h3 className="text-lg font-semibold" />
 * </Variant.Name>
 *
 * // asChild with react component
 * <Variant.Name asChild>
 *   {React.forwardRef(({name, ...props}, ref) => (
 *     <h3 ref={ref} {...props} className="text-lg font-semibold">
 *       {name}
 *     </h3>
 *   ))}
 * </Variant.Name>
 * ```
 */
export declare const Name: React.ForwardRefExoticComponent<VariantNameProps & React.RefAttributes<HTMLElement>>;
/**
 * Displays the variant price with customizable rendering following the documented API.
 *
 * @component
 * @example
 * ```tsx
 * // Default usage
 * <Variant.Price className="text-lg font-bold text-primary" />
 *
 * // asChild with primitive
 * <Variant.Price asChild>
 *   <span className="text-lg font-bold text-primary" />
 * </Variant.Price>
 *
 * // asChild with react component
 * <Variant.Price asChild>
 *   {React.forwardRef(({amount, currency, formattedMoney, formattedMoneyParts, ...props}, ref) => (
 *     <span ref={ref} {...props} className="text-lg font-bold text-primary">
 *       {formattedMoney}
 *     </span>
 *   ))}
 * </Variant.Price>
 * ```
 */
export declare const Price: React.ForwardRefExoticComponent<VariantPriceProps & React.RefAttributes<HTMLElement>>;
/**
 * Variant namespace containing all variant components
 * following the compound component pattern: VariantComponent.Root, VariantComponent.Name, VariantComponent.Price
 */
export declare const VariantComponent: {
    /** Variant root component */
    readonly Root: typeof Root;
    /** Variant name component */
    readonly Name: React.ForwardRefExoticComponent<VariantNameProps & React.RefAttributes<HTMLElement>>;
    /** Variant price component */
    readonly Price: React.ForwardRefExoticComponent<VariantPriceProps & React.RefAttributes<HTMLElement>>;
};