import { VGSCollectService, VGSFormState } from '../../../core/vgs/VGSCollectService';
import { CheckoutProfile } from '../../../types/checkout/CheckoutProfile.type';
import { CardTypes } from '../../../types/payment/CardType.type';
import { Focusable } from '../../../utils/focus';
import { Component } from '../../Component';
import { VgsFieldErrors } from './FormStateCoordinator';
interface CardSectionOptions {
    checkoutProfile: CheckoutProfile;
    translationFunc: (key: string) => string;
    /**
     * Card capture is tokenization-only: the section renders the hosted fields
     * and never an input the merchant page can read. A caller without a service
     * has no card block to render at all.
     */
    vgsService: VGSCollectService;
}
export declare class CardSection extends Component<HTMLDivElement> implements Focusable {
    private currentCardBrand;
    private cardNumberHelperText;
    private cardExpiryHelperText;
    private cardCvvHelperText;
    private errorMessagesContainer;
    private vgsCardNumberContainer;
    private vgsExpiryContainer;
    private vgsCvvContainer;
    private vgsCardIconsContainer;
    private vgsCardGroup;
    private vgsCardNumberRow;
    private vgsCardBottomRow;
    private vgsExpiryCell;
    private vgsCvvCell;
    private borderRadius;
    private _vgsFieldsReady;
    private _borderColor;
    private _fieldHeight;
    private _previousVgsValidState;
    private _vgsAutoAdvanced;
    private _lastFocusedVgsField;
    private _vgsService;
    private _onVgsAutoFocus?;
    constructor(options: CardSectionOptions);
    private buildVgsLayout;
    /**
     * The three cells render as one merged control: no gaps, borders overlapped
     * by a pixel and only the outer corners rounded. This runs while the skeleton
     * is still up so the block never changes shape when VGS takes over — and
     * again whenever the theme moves the metrics it derives from.
     */
    private _applyMergedGeometry;
    /**
     * Elements builds the section against the default profile but mounts the
     * fields against the merchant theme, so the skeleton has to be re-measured
     * before the iframes arrive.
     */
    setVgsFieldMetrics(padding: string, fontSize: number): void;
    buildVgsFieldCss(checkoutProfile: CheckoutProfile, fontFaceUrl?: string | null, overrides?: {
        borderColor?: string;
        backgroundColor?: string;
        placeholderColor?: string;
        placeholderOpacity?: string;
        padding?: string;
    }): {
        cardNumber: {
            'border-radius': string;
        };
        cardExpiry: {
            'border-radius': string;
            'border-top': string;
            '&:focus': {
                'border-top': string;
            };
        };
        cardCvv: {
            'border-radius': string;
            'border-left': string;
            'border-top': string;
            '&:focus': {
                'border-left': string;
                'border-top': string;
            };
        };
        cardholderName: {
            'border-radius': string;
        };
    };
    private updateVgsCardIcons;
    private createCardIcon;
    handleVgsStateChange(state: VGSFormState, fieldErrors?: VgsFieldErrors): void;
    private showVgsError;
    private clearAllVgsErrors;
    private _checkVgsAutoFocus;
    updateVgsCardBrand(cardBrand: CardTypes): void;
    updateVgsWrapperStyles(borderColor: string, borderRadius: number): void;
    getVgsContainerIds(): {
        cardNumber: string | undefined;
        cardExpiry: string | undefined;
        cardCvv: string | undefined;
    };
    hideFakePlaceholders(): void;
    private clearOtherErrors;
    focusField(field: 'cardNumber' | 'cardExpiry' | 'cardCvv'): void;
    setVgsService(service: VGSCollectService): void;
    setOnVgsAutoFocus(callback: (field: 'cardNumber' | 'cardExpiry' | 'cardCvv') => void): void;
    focus(): void;
}
export {};
//# sourceMappingURL=CardSection.d.ts.map