import { nothing, PropertyValueMap } from 'lit';
import { OmniFormElement } from '../core/OmniFormElement.js';
import '../calendar/Calendar.js';
import '../icons/Calendar.icon.js';
import '../icons/ChevronLeft.icon.js';
import '../icons/ChevronRight.icon.js';
/**
 * Control to get / set a specific date using a calendar.
 *
 * @import
 * ```js
 * import '@capitec/omni-components/date-picker';
 * ```
 *
 * @example
 * ```html
 * <omni-date-picker
 *  label="Enter a value"
 *  value="2023-03-01"
 *  min-date="2023-02-01"
 *  max-date="2023-04-01"
 *  hint="Required"
 *  error="Select a valid date"
 *  locale="en-US"
 *  disabled>
 * </omni-date-picker>
 * ```
 * @element omni-date-picker
 *
 * Registry of all properties defined by the component.
 *
 * @fires {CustomEvent<{}>} change - Dispatched when a date is selected.
 *
 * @cssprop --omni-date-picker-text-align - Date picker input text align.
 * @cssprop --omni-date-picker-font-color - Date picker input font color.
 * @cssprop --omni-date-picker-font-family - Date picker input font family.
 * @cssprop --omni-date-picker-font-size - Date picker input font size.
 * @cssprop --omni-date-picker-font-weight - Date picker input font weight.
 * @cssprop --omni-date-picker-height - Date picker input height.
 * @cssprop --omni-date-picker-padding - Date picker input padding.
 * @cssprop --omni-date-picker-width - Date picker width.
 * @cssprop --omni-date-picker-min-width - Date picker min width.
 *
 * @cssprop --omni-date-picker-disabled-font-color - Date picker disabled font color.
 *
 * @cssprop --omni-date-picker-error-font-color - Date picker error font color.
 *
 * @cssprop --omni-date-picker-control-padding - Date picker control padding.
 * @cssprop --omni-date-picker-control-hover-color - Date picker control hover.
 *
 * @cssprop --omni-date-picker-control-icon-width - Date picker control icon width.
 * @cssprop --omni-date-picker-control-icon-height - Date picker control icon height.
 * @cssprop --omni-date-picker-control-icon-color - Date picker control icon color.
 *
 * @cssprop --omni-date-picker-control-icon-error-color - Date picker control icon error color.
 *
 * @cssprop --omni-date-picker-control-left-border-width - Date picker control left border width.
 * @cssprop --omni-date-picker-control-left-border-color - Date picker control left border color.
 *
 * @cssprop --omni-date-picker-control-left-focused-border-width - Date picker control left border focused width.
 * @cssprop --omni-date-picker-control-left-focused-color - Date picker control left border focused color.
 *
 * @cssprop --omni-date-picker-control-left-border-error-color - Date picker control left border error color.
 *
 * @cssprop --omni-date-picker-container-z-index - Date picker container z-index.
 *
 * @cssprop --omni-date-picker-mobile-picker-dialog-left - Date picker dialog left.
 * @cssprop --omni-date-picker-mobile-picker-dialog-right - Date picker dialog right
 * @cssprop --omni-date-picker-mobile-picker-dialog-bottom - Date picker dialog bottom
 * @cssprop --omni-date-picker-mobile-picker-dialog-background-color - Date picker dialog background color.
 *
 * @cssprop --omni-date-picker-container-width - Date picker container width.
 * @cssprop --omni-date-picker-container-top - Date picker container top.
 * @cssprop --omni-date-picker-period-container-border-bottom - Date picker container border bottom.
 *
 * @cssprop --omni-date-picker-container-render-bottom-top - Date picker container render bottom top.
 *
 */
export declare class DatePicker extends OmniFormElement {
    private _inputElement?;
    private defaultLocale;
    /**
     * The locale used for formatting the output of the Date time picker.
     * @attr
     */
    locale: string;
    /**
     * The minimum date inclusively allowed to be selected.
     * @attr [min-date]
     */
    minDate?: string;
    /**
     * The maximum date inclusively allowed to be selected.
     * @attr [max-date]
     */
    maxDate?: string;
    private date;
    private _showCalendar;
    private _bottomOfViewport;
    private _isMobile;
    private readonly _windowClickBound;
    private readonly _checkForBottomOfScreenBound;
    private readonly _checkForMobileBound;
    connectedCallback(): void;
    protected firstUpdated(): Promise<void>;
    disconnectedCallback(): void;
    protected shouldUpdate(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): boolean;
    focus(options?: FocusOptions | undefined): void;
    _checkForBottomOfScreen(): Promise<void>;
    _checkforMobile(): Promise<void>;
    _inputClick(e: Event): void;
    _windowClick(e: Event): void;
    _toggleCalendar(): void;
    _dateSelected(e: Event): void;
    static get styles(): import("lit").CSSResultGroup[];
    protected renderContent(): import("lit-html").TemplateResult<1>;
    protected renderControl(): import("lit-html").TemplateResult<1>;
    protected renderPicker(): import("lit-html").TemplateResult<1> | typeof nothing;
    protected renderLabel(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'omni-date-picker': DatePicker;
    }
}
//# sourceMappingURL=DatePicker.d.ts.map