import { LitElement } from 'lit';
import { UgInput } from '../input';
/**
 * Supported Maskito DateModes.
 */
export type DateMode = 'dd/mm/yyyy' | 'mm/dd/yyyy' | 'yyyy/mm/dd';
/**
 * used parts in ours supported DateModes
 */
export type DatePart = 'dd' | 'mm' | 'yyyy';
/**
 * Represents a set of date components mapped to their respective string values.
 */
export type DateComponents = {
    [key in DatePart]: string;
};
export declare class UgDateinput extends LitElement {
    static dependencies: {
        'ug-input': typeof UgInput;
    };
    /**
     * Tells whether this component should show a clear icon or not
     */
    clearable: boolean;
    /**
     * Tells whether this component is disabled or not
     */
    disabled: boolean;
    /**
     * Tells whether this component should behave as if the data is still loading
     */
    size: 'small' | 'medium' | 'large';
    dateSeparator: string;
    /**
     * This is a subset of Maskito's DateMode. This Dateinput component only supports
     * fully defined dates. This with a specific dayOfMonth, month and year.
     * Following options are possible:
     * <ul>
     *   <li>dd/mm/yyyy</li>
     *   <li>mm/dd/yyyy</li>
     *   <li>yyyy/mm/dd</li>
     *   </ul>
     *
     * Note that the '/' in those options do NOT have any meaning. It is used to differentiate
     * the different parts in the input mask.
     *
     * The separator that will be used in the input mask is defined by 'dateSeparator'
     *
     */
    dateMode: DateMode;
    format: string;
    label: string | null;
    value: string;
    /**
     * Tells whether this component should render a 'picker' or not. (defaults to true)
     */
    showPicker: boolean;
    private inputComponent;
    private dateInput;
    private valueAsIso8601;
    private maskitoInstance?;
    private internalValue;
    updated(changedProperties: Map<string | number | symbol, unknown>): void;
    private transformMaskedInputToDate;
    firstUpdated(): void;
    private initializeMask;
    private handleInputChange;
    private handleInputBlur;
    private handleInputFocus;
    private handleInputInput;
    private handleCalendarClick;
    private handleCalendarDatePicked;
    private handleInputClear;
    get placeholder(): string;
    render(): import('lit-html').TemplateResult<1>;
    /**
     * This method checks if the entered date is a valid Date.
     * If so, the value will be updated accordingly. If not, the value becomes null.
     * if the value did change, a ug-change event will be fired
     * @private
     */
    private tryToUpdateValue;
}
declare global {
    interface HTMLElementTagNameMap {
        'ug-dateinput': UgDateinput;
    }
}