'use client';

/**
 * @frank-auth/react - Verification Code Component
 *
 * OTP/verification code input with auto-focus, paste support, and
 * customizable length. Supports MFA, email verification, and SMS codes.
 */
export interface VerificationCodeProps {
    /**
     * Field name for form handling
     */
    name?: string;
    /**
     * Field label
     */
    label?: string;
    /**
     * Number of code digits
     */
    length?: number;
    /**
     * Code value
     */
    value?: string;
    /**
     * Change handler
     */
    onChange?: (value: string) => void;
    /**
     * Complete handler (called when all digits entered)
     */
    onComplete?: (value: string) => void;
    /**
     * Blur handler
     */
    onBlur?: () => void;
    /**
     * Focus handler
     */
    onFocus?: () => void;
    /**
     * Whether field is required
     */
    required?: boolean;
    /**
     * Whether field is disabled
     */
    disabled?: boolean;
    /**
     * Whether to auto-focus first input
     */
    autoFocus?: boolean;
    /**
     * Field size
     */
    size?: 'sm' | 'md' | 'lg';
    /**
     * Field variant
     */
    variant?: 'flat' | 'bordered' | 'underlined' | 'faded';
    /**
     * Custom className
     */
    className?: string;
    /**
     * Custom validation error
     */
    error?: string | string[];
    /**
     * Help text
     */
    description?: string;
    /**
     * Placeholder character
     */
    placeholder?: string;
    /**
     * Input type (numeric vs alphanumeric)
     */
    type?: 'numeric' | 'alphanumeric';
    /**
     * Whether to allow paste
     */
    allowPaste?: boolean;
    /**
     * Whether to show separator between groups
     */
    separator?: boolean;
    /**
     * Group size for separator (e.g., 3 for 123-456)
     */
    groupSize?: number;
    /**
     * Separator character
     */
    separatorChar?: string;
    /**
     * Resend functionality
     */
    canResend?: boolean;
    /**
     * Resend handler
     */
    onResend?: () => void;
    /**
     * Resend countdown (seconds)
     */
    resendCountdown?: number;
    /**
     * Loading state
     */
    isLoading?: boolean;
    /**
     * Success state
     */
    isSuccess?: boolean;
    /**
     * Input mode for mobile keyboards
     */
    inputMode?: 'numeric' | 'text';
    /**
     * Auto complete
     */
    autoComplete?: string;
}
export declare function VerificationCode({ name, label, length, value, onChange, onComplete, onBlur, onFocus, required, disabled, autoFocus, size, variant, className, error: externalError, description, placeholder, type, allowPaste, separator, groupSize, separatorChar, canResend, onResend, resendCountdown, isLoading, isSuccess, inputMode, autoComplete, }: VerificationCodeProps): import("react/jsx-runtime").JSX.Element;
export default VerificationCode;
//# sourceMappingURL=verification-code.d.ts.map