import { CurrentCartServiceConfig } from '../../services/current-cart-service.js';
import { type LineItem } from '../../services/common-types.js';
import * as currentCart from '@wix/auto_sdk_ecom_current-cart';
export interface RootProps {
    children: React.ReactNode;
    currentCartServiceConfig: CurrentCartServiceConfig;
}
/**
 * Root component that provides the CurrentCart service context to its children.
 * This component sets up the necessary services for managing current cart functionality.
 *
 * @order 1
 * @component
 * @example
 * ```tsx
 * import { CurrentCart } from '@wix/ecom/components';
 *
 * function CartProvider() {
 *   return (
 *     <CurrentCart.Root>
 *       <div>
 *         <CurrentCart.OpenTrigger>
 *           {({ totalItems, open }) => (
 *             <button onClick={open}>
 *               Cart ({totalItems})
 *             </button>
 *           )}
 *         </CurrentCart.OpenTrigger>
 *
 *         <CurrentCart.Content>
 *           {({ cart, isLoading }) => (
 *             <div>
 *               {isLoading ? 'Loading...' : 'Cart loaded'}
 *             </div>
 *           )}
 *         </CurrentCart.Content>
 *       </div>
 *     </CurrentCart.Root>
 *   );
 * }
 * ```
 */
export declare function Root(props: RootProps): React.ReactNode;
/**
 * Props for EmptyState headless component
 */
export interface EmptyStateProps {
    /** Content to display when cart is empty (can be a render function or ReactNode) */
    children: ((props: EmptyStateRenderProps) => React.ReactNode) | React.ReactNode;
}
/**
 * Render props for EmptyState component
 */
export interface EmptyStateRenderProps {
}
/**
 * Component that renders content when the cart is empty.
 * Only displays its children when there are no items in cart, no loading state, and no errors.
 *
 * @component
 * @example
 * ```tsx
 * import { CurrentCart } from '@wix/ecom/components';
 *
 * function EmptyCartMessage() {
 *   return (
 *     <CurrentCart.EmptyState>
 *       {() => (
 *         <div className="empty-state">
 *           <h3>No items in cart</h3>
 *           <p>Items will appear here once they are added</p>
 *         </div>
 *       )}
 *     </CurrentCart.EmptyState>
 *   );
 * }
 * ```
 */
export declare function EmptyState(props: EmptyStateProps): import("react").ReactNode;
/**
 * Props for Content headless component
 */
export interface ContentProps {
    /** Render prop function that receives content data */
    children: (props: ContentRenderProps) => React.ReactNode;
}
/**
 * Render props for Content component
 */
export interface ContentRenderProps {
    /** Cart data */
    cart: currentCart.Cart | null;
    /** Whether cart is loading */
    isLoading: boolean;
    /** Error message if any */
    error: string | null;
}
/**
 * Headless component for cart content/modal
 *
 * @example
 * // Complete cart implementation with essential headless features
 * <CurrentCart.Content>
 *   {({ cart, isLoading }) => (
 *     <div>
 *       <CurrentCart.OpenTrigger>
 *         {({ totalItems }) => <h1>Cart ({totalItems} items)</h1>}
 *       </CurrentCart.OpenTrigger>
 *
 *       {isLoading && <p>Loading cart...</p>}
 *
 *       <CurrentCart.LineItemsList>
 *         {({ items, totalItems }) => (
 *           <>
 *             {items.length === 0 ? (
 *               <p>Your cart is empty</p>
 *             ) : (
 *               <>
 *                 <CurrentCart.Clear>
 *                   {({ clear, totalItems, isLoading }) => (
 *                     totalItems > 0 && (
 *                       <button onClick={clear} disabled={isLoading}>
 *                         {isLoading ? 'Clearing...' : 'Clear Cart'}
 *                       </button>
 *                     )
 *                   )}
 *                 </CurrentCart.Clear>
 *
 *                 {items.map((item) => (
 *                   <CurrentCart.Item key={item._id} item={item}>
 *                     {({
 *                       title,
 *                       image,
 *                       price,
 *                       quantity,
 *                       selectedOptions,
 *                       increaseQuantity,
 *                       decreaseQuantity,
 *                       remove,
 *                       isLoading: itemLoading
 *                     }) => (
 *                       <div>
 *                         <h3>{title}</h3>
 *                         <p>{price}</p>
 *
 *                         {selectedOptions.map((option, index) => (
 *                           <span key={index}>
 *                             {option.name}: {typeof option.value === 'object' ? option.value.name : option.value}
 *                           </span>
 *                         ))}
 *
 *                         <button onClick={decreaseQuantity} disabled={itemLoading || quantity <= 1}>-</button>
 *                         <span>{quantity}</span>
 *                         <button onClick={increaseQuantity} disabled={itemLoading}>+</button>
 *
 *                         <button onClick={remove} disabled={itemLoading}>
 *                           {itemLoading ? 'Removing...' : 'Remove'}
 *                         </button>
 *                       </div>
 *                     )}
 *                   </CurrentCart.Item>
 *                 ))}
 *
 *                 <CurrentCart.Notes>
 *                   {({ notes, updateNotes }) => (
 *                     <textarea
 *                       value={notes}
 *                       onChange={e => updateNotes(e.target.value)}
 *                       placeholder="Special instructions for your order"
 *                     />
 *                   )}
 *                 </CurrentCart.Notes>
 *
 *                 <CurrentCart.Coupon>
 *                   {({ appliedCoupon, apply, remove, isLoading }) => (
 *                     <div>
 *                       {appliedCoupon ? (
 *                         <div>
 *                           <span>Coupon: {appliedCoupon}</span>
 *                           <button onClick={remove} disabled={isLoading}>
 *                             {isLoading ? 'Removing...' : 'Remove'}
 *                           </button>
 *                         </div>
 *                       ) : (
 *                         <form onSubmit={e => {
 *                           e.preventDefault();
 *                           const code = new FormData(e.currentTarget).get('couponCode');
 *                           if (code?.trim()) apply(code.trim());
 *                         }}>
 *                           <input name="couponCode" placeholder="Enter promo code" disabled={isLoading} />
 *                           <button type="submit" disabled={isLoading}>
 *                             {isLoading ? 'Applying...' : 'Apply'}
 *                           </button>
 *                         </form>
 *                       )}
 *                     </div>
 *                   )}
 *                 </CurrentCart.Coupon>
 *
 *                 <CurrentCart.Summary>
 *                   {({ subtotal, discount, appliedCoupon, shipping, tax, total, currency, totalItems, isTotalsLoading }) => (
 *                     <div>
 *                       <div>Subtotal ({totalItems} items): {isTotalsLoading ? 'Calculating...' : subtotal}</div>
 *                       {discount && <div>Discount: -{discount}</div>}
 *                       {appliedCoupon && <div>Applied Coupon: {appliedCoupon}</div>}
 *                       <div>Shipping: {isTotalsLoading ? 'Calculating...' : shipping}</div>
 *                       <div>Tax: {isTotalsLoading ? 'Calculating...' : tax}</div>
 *                       <div>Total: {isTotalsLoading ? 'Calculating...' : total}</div>
 *                       <div>Currency: {currency}</div>
 *                     </div>
 *                   )}
 *                 </CurrentCart.Summary>
 *
 *                 <CurrentCart.Checkout>
 *                   {({ proceedToCheckout, canCheckout, isLoading: checkoutLoading, error }) => (
 *                     <div>
 *                       {error && <p>Error: {error}</p>}
 *                       <button onClick={proceedToCheckout} disabled={!canCheckout || checkoutLoading}>
 *                         {checkoutLoading ? 'Processing...' : 'Proceed to Checkout'}
 *                       </button>
 *                     </div>
 *                   )}
 *                 </CurrentCart.Checkout>
 *               </>
 *             )}
 *           </>
 *         )}
 *       </CurrentCart.LineItemsList>
 *     </div>
 *   )}
 * </CurrentCart.Content>
 */
export declare const Content: (props: ContentProps) => import("react").ReactNode;
/**
 * Props for Items headless component
 */
export interface LineItemsListProps {
    /** Render prop function that receives items data */
    children: (props: LineItemsListRenderProps) => React.ReactNode;
}
/**
 * Render props for Items component
 */
export interface LineItemsListRenderProps {
    /** Array of line items in cart */
    items: LineItem[];
    /** Total number of items */
    totalItems: number;
}
/**
 * Headless component for cart items collection
 *
 * @example
 * ```tsx
 * <CurrentCart.LineItemsList>
 *   {({ items, totalItems }) => (
 *     <div>
 *       <h1>Cart ({totalItems} items)</h1>
 *       <p>Items: {items.length}</p>
 *       <p>Has items: {items.length > 0 ? 'Yes' : 'No'}</p>
 *     </div>
 *   )}
 * </CurrentCart.LineItemsList>
 * ```
 */
export declare const LineItemsList: (props: LineItemsListProps) => import("react").ReactNode;
/**
 * Props for Item headless component
 */
export interface ItemProps {
    /** Line item data */
    item: LineItem;
    /** Render prop function that receives item data */
    children: (props: ItemRenderProps) => React.ReactNode;
}
export interface SelectedOption {
    name: string;
    value: string | {
        name: string;
        code: string;
    };
}
/**
 * Render props for Item component
 */
export interface ItemRenderProps {
    /** Current quantity */
    quantity: number;
    /** Product title */
    title: string;
    /** Product image URL */
    image: string | null;
    /** Line item price */
    price: string;
    /** Selected product options */
    selectedOptions: Array<SelectedOption>;
    /** Function to update quantity */
    onValueChange: (value: number) => Promise<void>;
    /** Function to remove item */
    remove: () => Promise<void>;
    /** Whether item is loading */
    isLoading: boolean;
}
/**
 * Headless component for individual cart item
 *
 * @example
 * ```tsx
 * <CurrentCart.Item item={item}>
 *   {({ quantity, title, image, price, selectedOptions, increaseQuantity, decreaseQuantity, remove, isLoading }) => (
 *     <div>
 *       <h3>{title}</h3>
 *       <p>{price}</p>
 *       <p>{quantity}</p>
 *       <p>{image}</p>
 *       <p>{selectedOptions}</p>
 *       <button onClick={increaseQuantity}>Increase</button>
 *       <button onClick={decreaseQuantity}>Decrease</button>
 *      <button onClick={remove}>Remove</button>
 *     </div>
 *   )}
 * </CurrentCart.Item>
 * ```
 */
export declare const Item: (props: ItemProps) => import("react").ReactNode;
/**
 * Props for Summary headless component
 */
export interface SummaryProps {
    /** Render prop function that receives summary data */
    children: (props: SummaryRenderProps) => React.ReactNode;
}
/**
 * Render props for Summary component
 */
export interface SummaryRenderProps {
    /** Cart subtotal */
    subtotal: string;
    /** Discount amount if coupon applied */
    discount: string | null;
    /** Applied coupon code if any */
    appliedCoupon: string | null;
    /** Shipping cost */
    shipping: string;
    /** Tax amount */
    tax: string;
    /** Cart total */
    total: string;
    /** Currency code */
    currency: string;
    /** Total number of items */
    totalItems: number;
    /** Whether totals are being calculated */
    isTotalsLoading: boolean;
    /** Amount values */
    amountValues: {
        subtotal: number;
        discount: number;
        shipping: number;
        tax: number;
        total: number;
    };
}
/**
 * Headless component for cart summary/totals
 *
 * @example
 * ```tsx
 * <CurrentCart.Summary>
 *   {({ subtotal, discount, appliedCoupon, shipping, tax, total, currency, totalItems, isTotalsLoading }) => (
 *     <div>
 *       <h1>Cart Summary</h1>
 *       <p>Subtotal: {subtotal}</p>
 *       <p>Discount: {discount}</p>
 *       <p>Applied Coupon: {appliedCoupon}</p>
 *       <p>Shipping: {shipping}</p>
 *       <p>Tax: {tax}</p>
 *       <p>Total: {total}</p>
 *       <p>Currency: {currency}</p>
 *       <p>Item Count: {totalItems}</p>
 *       <p>Is Totals Loading: {isTotalsLoading ? 'Yes' : 'No'}</p>
 *     </div>
 *   )}
 * </CurrentCart.Summary>
 * ```
 */
export declare const Summary: (props: SummaryProps) => import("react").ReactNode;
/**
 * Props for Clear headless component
 */
export interface ClearProps {
    /** Render prop function that receives clear action */
    children: (props: ClearRenderProps) => React.ReactNode;
}
/**
 * Render props for Clear component
 */
export interface ClearRenderProps {
    /** Function to clear all items from cart */
    clear: () => Promise<void>;
    /** Total number of items in cart */
    totalItems: number;
    /** Whether clear action is loading */
    isLoading: boolean;
}
/**
 * Headless component for clearing the cart
 *
 * @example
 * ```tsx
 * <CurrentCart.Clear>
 *   {({ clear, totalItems, isLoading }) => (
 *     <div>
 *       <h1>Cart Clear</h1>
 *       <p>Total items: {totalItems}</p>
 *       <p>Is loading: {isLoading ? 'Yes' : 'No'}</p>
 *       <button onClick={clear} disabled={isLoading}>Clear Cart</button>
 *     </div>
 *   )}
 * </CurrentCart.Clear>
 * ```
 */
export declare const Clear: (props: ClearProps) => import("react").ReactNode;
/**
 * Props for Checkout headless component
 */
export interface CheckoutProps {
    /** Render prop function that receives checkout data */
    children: (props: CheckoutRenderProps) => React.ReactNode;
}
/**
 * Render props for Checkout component
 */
export interface CheckoutRenderProps {
    /** Function to proceed to checkout */
    proceedToCheckout: () => Promise<void>;
    /** Whether checkout is available */
    canCheckout: boolean;
    /** Whether checkout action is loading */
    isLoading: boolean;
    /** Error message if checkout fails */
    error: string | null;
    /** Function to add items to cart */
    addToCart: (lineItems: LineItem[]) => Promise<void>;
}
/**
 * Headless component for checkout action
 *
 * @example
 * ```tsx
 * <CurrentCart.Checkout>
 *   {({ proceedToCheckout, canCheckout, isLoading, error }) => (
 *     <div>
 *       <h1>Checkout</h1>
 *       <p>Can checkout: {canCheckout ? 'Yes' : 'No'}</p>
 *       <p>Is loading: {isLoading ? 'Yes' : 'No'}</p>
 *       <p>Error: {error}</p>
 *       <button onClick={proceedToCheckout} disabled={!canCheckout || isLoading}>Proceed to Checkout</button>
 *     </div>
 *   )}
 * </CurrentCart.Checkout>
 * ```
 */
export declare const Checkout: (props: CheckoutProps) => import("react").ReactNode;
/**
 * Props for Notes headless component
 */
export interface NotesProps {
    /** Render prop function that receives notes data */
    children: (props: NotesRenderProps) => React.ReactNode;
}
/**
 * Render props for Notes component
 */
export interface NotesRenderProps {
    /** Current notes value */
    notes: string;
    /** Function to update notes */
    updateNotes: (notes: string) => Promise<void>;
}
/**
 * Headless component for notes
 *
 * @example
 * ```tsx
 * <CurrentCart.Notes>
 *   {({ notes, updateNotes }) => (
 *     <textarea
 *       value={notes}
 *       onChange={e => updateNotes(e.target.value)}
 *       placeholder="Special instructions for your order"
 *     />
 *   )}
 * </CurrentCart.Notes>
 * ```
 */
export declare const Notes: (props: NotesProps) => import("react").ReactNode;
/**
 * Props for Coupon headless component
 */
export interface CouponProps {
    /** Render prop function that receives coupon data */
    children: (props: CouponRenderProps) => React.ReactNode;
}
/**
 * Render props for Coupon component
 */
export interface CouponRenderProps {
    /** Applied coupon code if any */
    appliedCoupon: string | null;
    /** Function to apply coupon */
    apply: (code: string) => Promise<void>;
    /** Function to remove coupon */
    remove: () => Promise<void>;
    /** Whether coupon action is loading */
    isLoading: boolean;
    /** Error message if coupon operation fails */
    error: string | null;
}
/**
 * Headless component for coupon functionality
 *
 * @example
 * ```tsx
 * <CurrentCart.Coupon>
 *   {({ appliedCoupon, apply, remove, isLoading, error }) => (
 *     <div>
 *       {error && <p>Error: {error}</p>}
 *       {appliedCoupon ? (
 *         <div>
 *           <span>Coupon: {appliedCoupon}</span>
 *           <button onClick={remove} disabled={isLoading}>
 *             {isLoading ? 'Removing...' : 'Remove'}
 *           </button>
 *         </div>
 *       ) : (
 *         <form onSubmit={e => {
 *           e.preventDefault();
 *           const code = new FormData(e.currentTarget).get('couponCode');
 *           if (code?.trim()) apply(code.trim());
 *         }}>
 *           <input name="couponCode" placeholder="Enter promo code" disabled={isLoading} />
 *           <button type="submit" disabled={isLoading}>
 *             {isLoading ? 'Applying...' : 'Apply'}
 *           </button>
 *         </form>
 *       )}
 *     </div>
 *   )}
 * </CurrentCart.Coupon>
 * ```
 */
export declare const Coupon: (props: CouponProps) => import("react").ReactNode;
/**
 * Props for LineItemAdded headless component
 */
export interface LineItemAddedProps {
    /** Render prop function that receives line item added subscription data */
    children: (props: LineItemAddedRenderProps) => React.ReactNode;
}
/**
 * Render props for LineItemAdded component
 */
export interface LineItemAddedRenderProps {
    /**
     * Subscribe to line item added events
     *
     * Call this function with a callback to receive notifications when items
     * are added to the cart. The callback receives the updated line items array.
     *
     * @param callback - Function called when items are added to cart. Receives array of line items or undefined
     * @returns Unsubscribe function to clean up the subscription
     *
     * @example
     * ```tsx
     * useEffect(() => {
     *   return onAddedToCart((lineItems) => {
     *     console.log('Items added:', lineItems);
     *   });
     * }, [onAddedToCart]);
     * ```
     */
    onAddedToCart: (callback: LineItemAddedCallback) => void;
}
/**
 * Callback function type for line item added events
 *
 * @param lineItems - Array of line items currently in the cart, or undefined if cart is empty
 */
export type LineItemAddedCallback = (lineItems: LineItem[] | undefined) => void;
/**
 * Headless component for line item added event subscription
 *
 * Provides a way to subscribe to cart addition events and receive notifications
 * when items are added to the current cart. The callback receives the updated
 * line items array, allowing you to show notifications, trigger animations,
 * or perform other actions when products are added.
 *
 * @example
 * ```tsx
 * // Basic usage - show global notification
 * <CurrentCart.LineItemAdded>
 *   {({ onAddedToCart }) => {
 *     useEffect(() => {
 *       return onAddedToCart((lineItems) => {
 *         setShowSuccessMessage(true);
 *         setTimeout(() => setShowSuccessMessage(false), 3000);
 *       });
 *     }, [onAddedToCart]);
 *     return null;
 *   }}
 * </CurrentCart.LineItemAdded>
 * ```
 *
 * @example
 * ```tsx
 * // Product-specific usage - show notification only for specific product
 * <CurrentCart.LineItemAdded>
 *   {({ onAddedToCart }) => {
 *     useEffect(() => {
 *       return onAddedToCart((lineItems) => {
 *         if (!lineItems) return;
 *         const myLineItemIsThere = lineItems.some(
 *           lineItem => lineItem.catalogReference?.catalogItemId === product._id
 *         );
 *         if (!myLineItemIsThere) return;
 *
 *         setShowSuccessMessage(true);
 *         setTimeout(() => setShowSuccessMessage(false), 3000);
 *       });
 *     }, [onAddedToCart, product._id]);
 *     return null;
 *   }}
 * </CurrentCart.LineItemAdded>
 * ```
 *
 * @example
 * ```tsx
 * // Combined with cart opening - show notification then open cart
 * <CurrentCart.OpenTrigger>
 *   {({ open }) => (
 *     <CurrentCart.LineItemAdded>
 *       {({ onAddedToCart }) => {
 *         useEffect(() => {
 *           return onAddedToCart((lineItems) => {
 *             setShowSuccessMessage(true);
 *             setTimeout(() => {
 *               setShowSuccessMessage(false);
 *               open(); // Open cart after notification
 *             }, 3000);
 *           });
 *         }, [onAddedToCart]);
 *         return null;
 *       }}
 *     </CurrentCart.LineItemAdded>
 *   )}
 * </CurrentCart.OpenTrigger>
 * ```
 */
export declare const LineItemAdded: (props: LineItemAddedProps) => import("react").ReactNode;