import { default as React } from 'react';
import { AddPaymentMethodElementProps } from '../../types/elements';
import { PaymentElementAppearance, PaymentElementFonts, PaymentElementLocale, PaymentElementOptions } from '../../types/stripe-element.types';
import type * as setupIntents from '@stripe/stripe-js/dist/stripe-js/setup-intents';
export type { ConfirmSetupParams } from '../../types/elements/add-payment-method.types';
export type { CssFontSource, CustomFontSource, PaymentElementAppearance, PaymentElementFonts, PaymentElementLocale, PaymentElementOptions, } from '../../types/stripe-element.types';
/**
 * AddPaymentMethodElement - element for collecting payment method details
 *
 * This component provides a form interface for collecting payment method information with
 * built-in payment type selection and automatically registers itself with the ZenskarProvider
 * for programmatic control via useZenskar() hook.
 *
 * Simplified for usage:
 * - Direct Stripe integration without generic provider abstraction
 * - Built-in payment type selection (radio buttons)
 * - Enhanced error handling and state management
 * - Better integration with organization settings
 *
 * @example
 * ```tsx
 * const zenskar = useZenskar()
 * const elements = useZenskarElements()
 * const addPaymentElement = elements.getElement('add-payment-method')
 * const [loading, setLoading] = useState(false)
 *
 * const handleAddPayment = async () => {
 *   setLoading(true)
 *   const { data, error } = await zenskar.addPaymentMethod()
 *   if (!error) {
 *     toast.success('Payment method added successfully')
 *   } else {
 *     toast.error(error.message)
 *   }
 *   setLoading(false)
 * }
 *
 * <AddPaymentMethodElement
 *   onReady={() => console.log('Payment form ready')}
 *   elementAppearance={{}}
 *   elementOptions={{}}
 * />
 * <button
 *   onClick={handleAddPayment}
 *   disabled={!addPaymentElement?.isValid || !addPaymentElement?.isReady || loading}
 * >
 *   {loading ? 'Adding...' : 'Add Payment Method'}
 * </button>
 * ```
 */
declare const AddPaymentMethodElement: ({ id, onReady, className, elementAppearance, elementOptions, elementLocale, elementFonts, paymentMethodTypes, confirmParams, }: AddPaymentMethodElementProps & {
    elementAppearance?: PaymentElementAppearance;
    elementOptions?: PaymentElementOptions;
    elementLocale?: PaymentElementLocale;
    elementFonts?: PaymentElementFonts;
    paymentMethodTypes?: ("card" | "us_bank_account")[] | null;
    /**
     * Optional parameters for Stripe's `confirmSetup` method.
     *
     * **Important**: When using Stripe's Payment Element, billing country is mandatory.
     * If it is not collected in the UI (e.g., hidden via `elementOptions.fields.billingDetails.address.country: 'never'`),
     * it must be supplied programmatically via `confirmParams` or via an existing Customer.
     * Stripe does not support omitting country entirely.
     *
     * Use this prop when you've hidden billing fields from the Payment Element UI but need to
     * provide them programmatically to satisfy Stripe's requirements.
     *
     * @example
     * ```tsx
     * // When hiding country field from UI via elementOptions
     * <AddPaymentMethodElement
     *   elementOptions={{
     *     fields: {
     *       billingDetails: {
     *         address: {
     *           country: 'never',
     *         },
     *       },
     *     },
     *   }}
     *   confirmParams={{
     *     payment_method_data: {
     *       billing_details: {
     *         address: {
     *           country: 'IN',
     *         },
     *       },
     *     },
     *   }}
     * />
     * ```
     */
    confirmParams?: Partial<setupIntents.ConfirmSetupData>;
}) => React.JSX.Element | null;
export default AddPaymentMethodElement;