import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
import type { Separator, ICurrency } from './types';
/**
 * The TkCurrencyInput component allows users to input phone numbers with country selection and validation.
 * @react `import { TkCurrencyInput } from '@takeoff-ui/react'`
 * @vue `import { TkCurrencyInput } from '@takeoff-ui/vue'`
 * @angular `import { TkCurrencyInput } from '@takeoff-ui/angular'`
 */
export declare class TkCurrencyInput implements ComponentInterface {
    private el;
    /**
     * Reference to the currency input element.
     */
    private inputElement?;
    /**
     * Reference to the dropdown element.
     */
    private dropdownEl?;
    private cleanup;
    private uniqueId;
    /**
     * The currently selected currency object.
     * This is initialized based on the defaultCurrency prop and can be changed by the user.
     */
    selectedCurrency: ICurrency;
    /**
     * The value displayed in the input field, formatted as a currency string.
     * This is updated based on the current numeric value and selected currency.
     */
    displayValue: string;
    /**
     * Indicates whether the dropdown for currency selection is open.
     */
    isDropdownOpen: boolean;
    /**
     * Current numeric value of the input, used for calculations and formatting.
     * This is updated based on user input and can be used in form submissions.
     */
    currentNumericValue: number | null;
    /**
     * The value of the input.
     */
    value: number | null;
    valueChanged(): void;
    /**
     * List of available currencies.
     * If not provided, it defaults to the internal currency list.
     */
    currencyList?: ICurrency[];
    /**
     * Placeholder text for the input field.
     */
    placeholder?: string;
    /**
     * Disables the input field if set to true.
     */
    disabled: boolean;
    protected disabledChanged(newValue: boolean): void;
    /**
     * Marks the input field as invalid if set to true.
     */
    invalid: boolean;
    /**
     * Makes the input field read-only if set to true.
     */
    readonly: boolean;
    /**
     * Sets size for the component.
     */
    size: 'large' | 'base' | 'small';
    /**
     * Displays a red asterisk (*) next to the label for visual emphasis.
     */
    showAsterisk: boolean;
    /**
     * Disables the currency field if set to true.
     */
    currencyDisabled: boolean;
    /**
     * The number of decimal places to display in the formatted currency value.
     * Default is 2, which is common for most currencies.
     */
    precision: number;
    /**
     * The default currency to use when the component is initialized.
     * Default is 'TRY'.
     */
    defaultCurrency: string;
    /**
     * Allows negative values to be entered if set to true.
     */
    allowNegative: boolean;
    /**
     * Custom decimal separator to use for formatting.
     * If provided, this will override the currency's default decimal separator.
     * Example: "." for USD style, "," for EUR style
     */
    decimalSeparator?: Separator;
    /**
     * Custom thousands separator to use for formatting.
     * If provided, this will override the currency's default thousands separator.
     * Example: "," for USD style, "." for EUR style, " " for some European styles
     */
    thousandsSeparator?: Separator;
    defaultCurrencyChanged(): void;
    /**
     * The label for the input field.
     * If provided, it will be displayed above the input.
     */
    label: string;
    /**
     * The name attribute for the input element.
     * Useful for form submissions.
     */
    name: string;
    /**
     * Provided a hint or additional information about the input.
     */
    hint: string;
    /**
     * This is the error message that will be displayed.
     */
    error: string;
    /**
     * Hides the currency flag icon in the dropdown button and list.
     * @default false
     */
    hideFlag: boolean;
    /**
     * Allows the value to be set to null.
     * @default false
     */
    allowEmptyValue: boolean;
    /**
     * Determines the width of the dropdown. Accepts values like 'match-parent', 'auto', or a specific width in '300px'.
     * @defaultValue match-parent
     */
    dropdownWidthMode: 'match-parent' | 'auto' | string;
    /**
     * Emitted when the value has changed.
     */
    tkChange: EventEmitter<any>;
    /**
     * Emitted when the input loses focus.
     */
    tkBlur: EventEmitter<void>;
    /**
     * Emitted when the input has focus.
     */
    tkFocus: EventEmitter<void>;
    /**
     * Initialize the component before it is rendered.
     */
    componentWillLoad(): void;
    /**
     * Update the component when properties change.
     */
    componentDidUpdate(): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    private updatePosition;
    /**
     * Get the currencies list - either from prop or use internal default
     */
    private getCurrencies;
    private setSelectedCurrency;
    private normalizeNumericValue;
    private updateDisplayValue;
    /**
     * Get the decimal separator to use - custom prop takes priority over currency default
     */
    private getDecimalSeparator;
    /**
     * Get the thousands separator to use - custom prop takes priority over currency default
     */
    private getThousandsSeparator;
    private formatCurrency;
    private parseFormattedValue;
    private closeDropdown;
    private toggleDropdown;
    private calculateNewCursorPosition;
    private handleInput;
    private handleKeyDown;
    private handleFocus;
    private handleBlur;
    private handleSelectCurrency;
    private renderLabel;
    private renderCurrencyInput;
    private renderCurrencySelector;
    /**
     * Get the flag class based on the currency's ID.
     */
    private getFlagClass;
    private renderDropdownButton;
    private renderCurrencyList;
    /**
     * Render the flag element for a currency. Shows a close icon for currencies without a matching currency ID.
     */
    private renderFlag;
    render(): any;
}
