import React, { FC } from 'react';
import { PaymentDetails } from './AccountPayment.model';
export interface PaymentMethodProps {
    id: string;
    activeTab?: number;
    externalId?: string | number;
    paymentAccounts?: any[];
    paymentDetails: PaymentDetails;
    bankAccountTypes?: any[];
    loading: boolean;
    onTabChange: (event: React.ChangeEvent<{}>, paymentMethodTab: any) => void;
    onFormStatusChange?: (paymentFormResult: any) => void;
    onSubmitCompleted?: (event: React.FormEvent<HTMLFormElement>, result: any) => void;
    submit?: (event: React.FormEvent<HTMLFormElement>) => void;
    presetDataRequest: (formData: any, paymentMethod: any, isHostedPayment: boolean) => any;
    children?: any;
    childrenPosition?: "before" | "after" | "outside";
    actionLabel?: string;
    render?: any;
}
/**
 * PaymentForm Component
 *
 * This component provides a user interface for selecting and handling different payment methods.
 * It allows users to switch between available payment methods using tabs and handles the form submission process.
 * Each payment method has its own form component that is displayed based on the selected tab.
 *
 * Props:
 *   @param {PaymentMethodProps} props - Object containing the following properties:
 *     @param {string} id - Unique identifier for the payment form.
 *     @param {number} [activeTab=0] - The index of the currently active tab. Defaults to 0.  [OPTIONAL]
 *     @param {any[]} [paymentAccounts] - Array of payment accounts associated with the user. [OPTIONAL]
 *     @param {PaymentDetails} paymentDetails - Object containing details about the customer's payment information.
 *     @param {any[]} [bankAccountTypes=DEFAULT_ACCOUNT_TYPES] - Array of available bank account types, with a default value.
 *     @param {boolean} loading - Boolean flag indicating if asynchronous operations like data fetching are in progress.
 *     @param {Function} onTabChange - Function to be called when the active tab changes.
 *     @param {Function} [onFormStatusChange] - Optional function to handle status changes during form interactions.
 *     @param {Function} [onSubmitCompleted] - Optional function to be called upon successful form submission.
 *     @param {Function} presetDataRequest - Function to prepare the data request for payment processing.
 *     @param {Function} [submit] - Optional function to be called on form submission.
 *     @param {any} [children] - Optional elements to be rendered inside the form.
 *     @param {"before" | "after" | "outside"} [childrenPosition="before"] - Position of the children elements relative to the form.
 *     @param {string} [actionLabel] - Optional label for the form action button.
 *     @param {any} [render] - Optional render function for custom rendering inside the component.
 *
 * Usage:
 * The component renders tabs to switch between different payment methods and handles form interactions
 * for submitting payments. It integrates with Material-UI components to render the form and uses React hooks
 * for managing state, such as the currently active tab and form interaction data.
 *
 * The component uses the `useMemo` hook to optimize rendering performance and to handle the memoization of
 * computed payment fields. It ensures that the form submission process is smooth, even for hosted payments.
 *
 * Each payment method form (e.g., CreditCardForm, eCheckForm, etc.) is conditionally rendered based on the
 * currently selected payment method, ensuring a consistent user experience.
 *
 * Example:
 * <PaymentForm
 *   id="paymentForm"
 *   activeTab={0}
 *   paymentAccounts={accounts}
 *   paymentDetails={paymentDetails}
 *   bankAccountTypes={accountTypes}
 *   loading={isLoading}
 *   onTabChange={handleTabChange}
 *   onFormStatusChange={handleStatusChange}
 *   presetDataRequest={createDataRequest}
 *   onSubmitCompleted={handleSubmitCompleted}
 *   actionLabel="Enter Card Details"
 *   submit={handleSubmit}
 * />
 *
 * Note:
 * This component should be used within a React environment that supports hooks and functional components.
 * It relies on Material-UI for UI components and theming.
 */
export declare const PaymentForm: FC<PaymentMethodProps>;
//# sourceMappingURL=PaymentForm.d.ts.map