import { LitElement, PropertyValues } from 'lit'; import '../Icon/Icon'; declare global { interface HTMLElementTagNameMap { 'ctt-iban-input': CttIbanInput; } } declare const CttIbanInput_base: (new (...args: any[]) => import("../../utils/form-associated-mixin").FormAssociatedBase) & typeof LitElement; /** * CTT IbanInput Component * * A specialized input component for IBAN (International Bank Account Number) validation with auto-formatting. * Validates IBANs for all SEPA countries and provides real-time validation feedback. * * **Features:** * - Auto-formatting input mask: displays spaces every 4 characters (e.g., PT50 0002 0123...) * - Real-time validation for 36+ SEPA countries * - Optional country-specific validation * - Mod-97 check digit verification * - Stores clean, unformatted values for database/API submission * * **Input Mask Example:** * - Display: `PT50 0002 0123 1234 5678 9015 4` (formatted for readability) * - Value: `PT50000201231234567890154` (clean for storage/validation) * * @slot - Default slot for component content * * @fires input - Emitted when the input value changes * @fires change - Emitted when the input loses focus * @fires focus - Emitted when the input receives focus * @fires blur - Emitted when the input loses focus * * @example * ```html * * * * * * ``` */ export declare class CttIbanInput extends CttIbanInput_base { static styles: import("lit").CSSResult; /** * Label for the IBAN input field */ label: string; /** * Placeholder text for the IBAN input */ placeholder: string; /** * Optional hint text displayed below the input */ hint: string; /** * Current IBAN value */ value: string; /** * Name attribute for form integration */ name: string; /** * Whether the input is disabled */ disabled: boolean; /** * Whether the input is required */ required: boolean; /** * Whether the input is readonly */ readonly: boolean; /** * Size variant of the input field */ size: 'small' | 'medium' | 'large'; /** * Country code for single-country validation (e.g., 'PT' for Portugal) * If not set, validates against all SEPA countries */ country: string | null; /** * HTML id attribute */ id: string; /** * ARIA described-by attribute */ ariaDescribedBy: string | null; /** * Custom error message for required field validation * Default: 'IBAN is required' */ errorMessageRequired: string; /** * Custom error message for invalid IBAN format * Default: 'Invalid IBAN format' */ errorMessageInvalid: string; /** * Custom error message for invalid country-specific IBAN * Use {country} placeholder for country code * Default: 'Invalid IBAN for {country}' */ errorMessageInvalidCountry: string; constructor(); firstUpdated(_changedProperties?: Map): void; updated(changedProperties: PropertyValues): void; private _syncInputValue; private get inputId(); private get labelId(); private get errorId(); private get hasError(); private get isDisabled(); private get ariaDescribedByValue(); /** * Validate IBAN format and check digit * If country is set, validates only for that country * Otherwise validates against all SEPA countries */ private validateIban; /** * Validate IBAN check digit using Mod-97 algorithm * Uses BigInt to handle large numbers correctly */ private _validateCheckDigit; protected _isValid(): boolean; protected _getValidationMessage(): string; protected _getNativeInput(): HTMLInputElement | undefined; /** * Public method to clear all errors (both auto-validation and custom) * Useful for resetting the component state programmatically */ clearError(): void; /** * Format IBAN with spaces every 4 characters for readability * Example: PT50 0002 0123 1234 5678 9015 4 */ private _formatIbanDisplay; /** * Remove spaces from formatted IBAN to get clean value */ private _unformatIban; /** * Handle input with auto-formatting */ private onInput; /** * Calculate correct cursor position after formatting * Spaces are inserted every 4 characters, so we need to count how many spaces * should be before the cursor position in the unformatted string */ private _calculateCursorPositionAfterFormat; private onChange; private onFocus; private onBlur; render(): import("lit-html").TemplateResult<1>; } export {};