import { __decorate, __metadata } from "tslib";
import { isEscapeKey } from "@baloise/web-app-utils";
import { Host, h, } from "@stencil/core";
import { ariaBooleanToString } from "../../utils/aria";
import { inheritAttributes } from "../../utils/attributes";
import { BEM } from "../../utils/bem";
import { balBrowser } from "../../utils/browser";
import { ListenToConfig, defaultConfig } from "../../utils/config";
import { BalDate } from "../../utils/date";
import { balFloatingUi } from "../../utils/floating-ui";
import { FOCUS_KEYS } from "../../utils/focus-visible";
import { defaultBalAriaForm } from "../../utils/form";
import { stopEventBubbling } from "../../utils/form-input";
import { addEventListener, debounceEvent, rIC, removeEventListener, waitAfterIdleCallback } from "../../utils/helpers";
import { isSpaceKey } from "../../utils/keyboard";
import { Logger } from "../../utils/log";
import { i18nBalDate } from "./bal-date.i18n";
export class Date {
    constructor() {
        this.inputId = `bal-da-${dateIds++}`;
        this.inheritedAttributes = {};
        this.isKeyboardMode = false;
        this.hasFocus = false;
        this.isExpanded = false;
        this.language = defaultConfig.language;
        this.ariaForm = defaultBalAriaForm;
        /**
         * PUBLIC PROPERTY API
         * ------------------------------------------------------
         */
        /**
         * The name of the control, which is submitted with the form data.
         */
        this.name = this.inputId;
        /**
         * If `true` the component gets a invalid style.
         */
        this.invalid = false;
        /**
         * If `true` the attribute required is added to the native input.
         */
        this.required = false;
        /**
         * If `true`, the element is not mutable, focusable, or even submitted with the form. The user can neither edit nor focus on the control, nor its form control descendants.
         */
        this.disabled = false;
        /**
         * If `true` the element can not mutated, meaning the user can not edit the control.
         */
        this.readonly = false;
        /**
         * If `true` there will be no trigger icon visible, so no UX indicator for a picker
         */
        this.freeSolo = false;
        /**
         * If `true` the datepicker only open on click of the icon
         */
        this.triggerIcon = false;
        /**
         * Closes the datepicker popover after selection
         */
        this.closeOnSelect = true;
        /**
         * Indicates whether the value of the control can be automatically completed by the browser.
         */
        this.autocomplete = 'off';
        /**
         * The value of the form field, which accepts ISO 8601 date strings (YYYY-MM-DD).
         */
        this.value = undefined;
        /**
         * Callback to determine which date in the datepicker should be selectable.
         */
        this.allowedDates = undefined;
        /**
         * If `true`, it returns the string `INVALID_VALUE` within the balChange event if the input provided is not valid.
         */
        this.allowInvalidValue = false;
        /**
         * Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
         */
        this.debounce = 0;
        /**
         * If `true`, in Angular reactive forms the control will not be set invalid
         */
        this.autoInvalidOff = false;
        /**
         * LIFECYCLE
         * ------------------------------------------------------
         */
        this.hasConnected = false;
        /**
         * PRIVATE METHOD
         * ------------------------------------------------------
         */
        this.handleKeydown = (ev) => {
            this.isKeyboardMode = FOCUS_KEYS.includes(ev.key);
        };
        this.handlePointerDown = () => {
            this.isKeyboardMode = false;
        };
        this.handleOutsideClick = (ev) => {
            if (this.isExpanded) {
                if (!this.el.contains(ev.target)) {
                    this.isExpanded = false;
                    this.hasFocus = false;
                    rIC(() => this.balBlur.emit(ev));
                }
            }
        };
        this.handleFocus = (ev) => {
            stopEventBubbling(ev);
            this.hasFocus = true;
            this.balFocus.emit(ev.detail);
        };
        this.handleBlur = (ev) => {
            stopEventBubbling(ev);
            if (!this.isExpanded) {
                this.hasFocus = false;
                rIC(() => this.balBlur.emit(ev.detail));
            }
        };
        /**
         * EVENT BINDING
         * ------------------------------------------------------
         */
        this.onIconClick = async (_ev) => {
            if (this.triggerIcon) {
                await this.toggle();
            }
            else {
                await this.open();
            }
        };
        this.onInputClick = async (_ev) => {
            if (!this.triggerIcon) {
                await this.open();
            }
        };
        this.onCalendarChange = (ev) => {
            stopEventBubbling(ev);
            this.value = ev.detail;
            this.balChange.emit(this.value);
            if (this.closeOnSelect) {
                this.close();
                this.hasFocus = false;
                rIC(() => this.balBlur.emit());
            }
        };
        this.onInputInput = (ev) => {
            stopEventBubbling(ev);
            this.balInput.emit(ev.detail);
            if (ev.detail) {
                const date = BalDate.fromAnyFormat(ev.detail);
                if (date.isValid) {
                    this.calendarValue = date.toISODate();
                }
            }
        };
        this.onInputChange = (ev) => {
            stopEventBubbling(ev);
            this.value = ev.detail;
            this.balChange.emit(this.value);
        };
        this.onKeyPress = async ({ detail }) => {
            if (detail && detail.key) {
                if (this.isExpanded) {
                    if (detail.key === 'Tab' || isEscapeKey(detail) || isSpaceKey(detail)) {
                        await this.close();
                    }
                }
                else {
                    if (isSpaceKey(detail)) {
                        await this.open();
                    }
                }
            }
        };
    }
    createLogger(log) {
        this.log = log;
    }
    valueChanged() {
        this.calendarValue = this.value;
    }
    debounceChanged() {
        this.balChange = debounceEvent(this.balChange, this.debounce);
    }
    connectedCallback() {
        if (balBrowser.hasDocument) {
            addEventListener(document, 'keydown', this.handleKeydown);
            addEventListener(document, 'touchstart', this.handlePointerDown);
            addEventListener(document, 'mousedown', this.handlePointerDown);
            addEventListener(document, 'click', this.handleOutsideClick);
        }
        this.hasConnected = true;
        this.valueChanged();
    }
    disconnectedCallback() {
        if (balBrowser.hasDocument) {
            removeEventListener(document, 'keydown', this.handleKeydown);
            removeEventListener(document, 'touchstart', this.handlePointerDown);
            removeEventListener(document, 'mousedown', this.handlePointerDown);
            removeEventListener(document, 'click', this.handleOutsideClick);
        }
    }
    componentWillLoad() {
        this.inheritedAttributes = inheritAttributes(this.el, ['aria-label', 'tabindex', 'title', 'data-hj-allow']);
    }
    /**
     * @internal define config for the component
     */
    async configChanged(state) {
        this.language = state.language;
    }
    /**
     * PUBLIC METHOD
     * ------------------------------------------------------
     */
    /**
     * Opens the accordion
     */
    async open() {
        return this.expand();
    }
    /**
     * Closes the accordion
     */
    async close() {
        return this.collapse();
    }
    /**
     * Triggers the accordion
     */
    async toggle() {
        if (this.isExpanded) {
            return this.collapse();
        }
        else {
            return this.expand();
        }
    }
    /**
     * Selects an option
     */
    async select(dateString) {
        const date = BalDate.fromISO(dateString);
        if (date.isValid) {
            this.value = date.toISODate();
            this.calendarValue = this.value;
        }
    }
    /**
     * Sets focus on the native `input` in `bal-input`. Use this method instead of the global
     * `input.focus()`.
     */
    async setFocus() {
        if (this.inputEl && !this.disabled && !this.readonly) {
            await waitAfterIdleCallback();
            this.inputEl.focus();
        }
    }
    /**
     * Sets blur on the native `input` in `bal-input`. Use this method instead of the global
     * `input.blur()`.
     * @internal
     */
    async setBlur() {
        var _a;
        if (this.inputEl && !this.disabled && !this.readonly) {
            await waitAfterIdleCallback();
            (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.setBlur();
        }
    }
    /**
     * Returns the native `<input>` element used under the hood.
     */
    async getInputElement() {
        var _a;
        return (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.getInputElement();
    }
    /**
     * @internal
     */
    async setAriaForm(ariaForm) {
        var _a;
        this.ariaForm = Object.assign({}, ariaForm);
        (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.setAriaForm(ariaForm);
    }
    async expand() {
        if (this.referenceEl && this.floatingEl) {
            const lib = await balFloatingUi.load();
            this.balWillAnimate.emit();
            this.isExpanded = true;
            this.popupCleanup = lib.autoUpdate(this.referenceEl, this.floatingEl, () => {
                this.updatePosition(this.referenceEl, this.floatingEl);
            });
        }
        return this.isExpanded;
    }
    async collapse() {
        if (this.floatingEl) {
            this.balWillAnimate.emit();
            this.isExpanded = false;
            if (this.popupCleanup) {
                this.popupCleanup();
            }
            this.balDidAnimate.emit();
        }
        return this.isExpanded;
    }
    async updatePosition(referenceEl, floatingEl) {
        const lib = await balFloatingUi.load();
        lib
            .computePosition(referenceEl, floatingEl, {
            placement: 'bottom-start',
            middleware: [lib.offset(4), lib.flip({ crossAxis: false })],
        })
            .then(({ x, y }) => {
            Object.assign(floatingEl.style, {
                left: `${x}px`,
                top: `${y}px`,
            });
            this.balDidAnimate.emit();
        });
    }
    /**
     * RENDER
     * ------------------------------------------------------
     */
    render() {
        const block = BEM.block('date');
        const blockIcon = block.element('icon');
        const blockPopup = block.element('popup');
        return (h(Host, { key: '66accfbf681e12eefdc6e61912fe5736f75c4501', id: this.inputId, class: Object.assign({}, block.class()) }, h("bal-input-group", { key: '4e816b701215387a395c6a73da929609302d0c8f', invalid: this.invalid, readonly: this.readonly, disabled: this.disabled, ref: el => (this.referenceEl = el) }, h("bal-input-date", Object.assign({ key: '188d50af76d1625bafb08b2d8ad4d13756bc4468', name: this.name, required: this.required, placeholder: this.placeholder, value: this.value, min: this.min, max: this.max, invalid: this.invalid, readonly: this.readonly, disabled: this.disabled, allowInvalidValue: this.allowInvalidValue, autocomplete: this.autocomplete, onClick: this.onInputClick, onBalInput: this.onInputInput, onBalChange: this.onInputChange, onBalFocus: ev => this.handleFocus(ev), onBalBlur: ev => this.handleBlur(ev), onBalKeyPress: this.onKeyPress, ref: el => (this.inputEl = el) }, this.inheritedAttributes)), !this.freeSolo ? (h("bal-icon", { name: "date", role: "button", tabindex: -1, class: Object.assign(Object.assign({}, blockIcon.class()), blockIcon.modifier('clickable').class(!this.disabled && !this.readonly)), "is-right": true, color: this.disabled || this.readonly ? 'grey' : this.invalid ? 'danger' : 'primary', onClick: this.onIconClick, "aria-label": i18nBalDate[this.language].toggleDatepicker, "aria-haspopup": "true", "aria-expanded": ariaBooleanToString(this.isExpanded) })) : ('')), h("div", { key: '8eaee6ea09c2099057a2ad0165d63f70154d4095', role: "dialog", class: Object.assign(Object.assign({}, blockPopup.class()), blockPopup.modifier('visible').class(this.isExpanded)), ref: el => (this.floatingEl = el), "aria-hidden": `${this.isExpanded !== true}`, "aria-presented": `${this.isExpanded === true}` }, h("bal-date-calendar", { key: '16f6680967612f55e9f8259b780a02e61c830090', value: this.calendarValue, min: this.min, max: this.max, minYearProp: this.minYearProp, maxYearProp: this.maxYearProp, defaultDate: this.defaultDate, allowedDates: this.allowedDates, onBalChange: this.onCalendarChange }))));
    }
    static get is() { return "bal-date"; }
    static get originalStyleUrls() {
        return {
            "$": ["bal-date.sass"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["bal-date.css"]
        };
    }
    static get properties() {
        return {
            "name": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The name of the control, which is submitted with the form data."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "name",
                "defaultValue": "this.inputId"
            },
            "invalid": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the component gets a invalid style."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "invalid",
                "defaultValue": "false"
            },
            "required": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the attribute required is added to the native input."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "required",
                "defaultValue": "false"
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the element is not mutable, focusable, or even submitted with the form. The user can neither edit nor focus on the control, nor its form control descendants."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "disabled",
                "defaultValue": "false"
            },
            "readonly": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the element can not mutated, meaning the user can not edit the control."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "readonly",
                "defaultValue": "false"
            },
            "freeSolo": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` there will be no trigger icon visible, so no UX indicator for a picker"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "free-solo",
                "defaultValue": "false"
            },
            "placeholder": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The text to display when the select is empty."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "placeholder"
            },
            "triggerIcon": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true` the datepicker only open on click of the icon"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "trigger-icon",
                "defaultValue": "false"
            },
            "closeOnSelect": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Closes the datepicker popover after selection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "close-on-select",
                "defaultValue": "true"
            },
            "autocomplete": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalInputAutocomplete",
                    "resolved": "\"on\" | \"off\" | \"tel\" | \"url\" | \"email\" | \"name\" | \"honorific-prefix\" | \"given-name\" | \"additional-name\" | \"family-name\" | \"honorific-suffix\" | \"nickname\" | \"username\" | \"new-password\" | \"current-password\" | \"one-time-code\" | \"organization-title\" | \"organization\" | \"street-address\" | \"address-line1\" | \"address-line2\" | \"address-line3\" | \"address-level4\" | \"address-level3\" | \"address-level2\" | \"address-level1\" | \"country\" | \"country-name\" | \"postal-code\" | \"cc-name\" | \"cc-given-name\" | \"cc-additional-name\" | \"cc-family-name\" | \"cc-number\" | \"cc-exp\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-csc\" | \"cc-type\" | \"transaction-currency\" | \"transaction-amount\" | \"language\" | \"bday\" | \"bday-day\" | \"bday-month\" | \"bday-year\" | \"sex\" | \"tel-country-code\" | \"tel-national\" | \"tel-area-code\" | \"tel-local\" | \"tel-extension\" | \"impp\" | \"photo\"",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Indicates whether the value of the control can be automatically completed by the browser."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "autocomplete",
                "defaultValue": "'off'"
            },
            "value": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string | undefined",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The value of the form field, which accepts ISO 8601 date strings (YYYY-MM-DD)."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "value",
                "defaultValue": "undefined"
            },
            "min": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The minimum datetime allowed. Value must be a date string\nfollowing the\n[ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime),\nsuch as `1996-12-19`. The format does not have to be specific to an exact\ndatetime. For example, the minimum could just be the year, such as `1994`.\nDefaults to the beginning of the year, 100 years ago from today."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "min"
            },
            "max": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The maximum datetime allowed. Value must be a date string\nfollowing the\n[ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime),\n`1996-12-19`. The format does not have to be specific to an exact\ndatetime. For example, the maximum could just be the year, such as `1994`.\nDefaults to the end of this year."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "max"
            },
            "minYearProp": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Earliest year available for selection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "min-year"
            },
            "maxYearProp": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Latest year available for selection"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "max-year"
            },
            "defaultDate": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The date to defines where the datepicker popup starts. The prop accepts ISO 8601 date strings (YYYY-MM-DD)."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "default-date"
            },
            "allowedDates": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "BalProps.BalDateCallback | undefined",
                    "resolved": "(dateString: string) => boolean",
                    "references": {
                        "BalProps": {
                            "location": "global",
                            "id": "global::BalProps"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Callback to determine which date in the datepicker should be selectable."
                },
                "getter": false,
                "setter": false,
                "defaultValue": "undefined"
            },
            "allowInvalidValue": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, it returns the string `INVALID_VALUE` within the balChange event if the input provided is not valid."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "allow-invalid-value",
                "defaultValue": "false"
            },
            "debounce": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "debounce",
                "defaultValue": "0"
            },
            "autoInvalidOff": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, in Angular reactive forms the control will not be set invalid"
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "auto-invalid-off",
                "defaultValue": "false"
            }
        };
    }
    static get states() {
        return {
            "isKeyboardMode": {},
            "hasFocus": {},
            "isExpanded": {},
            "language": {},
            "calendarValue": {},
            "ariaForm": {}
        };
    }
    static get events() {
        return [{
                "method": "balInput",
                "name": "balInput",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when a keyboard input occurred."
                },
                "complexType": {
                    "original": "BalEvents.BalDateInputDetail",
                    "resolved": "string",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balChange",
                "name": "balChange",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when a option got selected."
                },
                "complexType": {
                    "original": "BalEvents.BalDateChangeDetail",
                    "resolved": "string",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balWillAnimate",
                "name": "balWillAnimate",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted before the animation starts"
                },
                "complexType": {
                    "original": "BalEvents.BalDateWillAnimateDetail",
                    "resolved": "boolean",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balDidAnimate",
                "name": "balDidAnimate",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted after the animation has finished"
                },
                "complexType": {
                    "original": "BalEvents.BalDateDidAnimateDetail",
                    "resolved": "boolean",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balBlur",
                "name": "balBlur",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the input loses focus."
                },
                "complexType": {
                    "original": "BalEvents.BalDateBlurDetail",
                    "resolved": "FocusEvent",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balFocus",
                "name": "balFocus",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the input has focus."
                },
                "complexType": {
                    "original": "BalEvents.BalDateFocusDetail",
                    "resolved": "FocusEvent",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balInputClick",
                "name": "balInputClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the input has clicked."
                },
                "complexType": {
                    "original": "BalEvents.BalDateInputClickDetail",
                    "resolved": "MouseEvent",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }, {
                "method": "balIconClick",
                "name": "balIconClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the icon has clicked."
                },
                "complexType": {
                    "original": "BalEvents.BalDateIconClickDetail",
                    "resolved": "MouseEvent",
                    "references": {
                        "BalEvents": {
                            "location": "global",
                            "id": "global::BalEvents"
                        }
                    }
                }
            }];
    }
    static get methods() {
        return {
            "configChanged": {
                "complexType": {
                    "signature": "(state: BalConfigState) => Promise<void>",
                    "parameters": [{
                            "name": "state",
                            "type": "BalConfigState",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "BalConfigState": {
                            "location": "import",
                            "path": "../../utils/config",
                            "id": "src/utils/config/index.ts::BalConfigState"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": [{
                            "name": "internal",
                            "text": "define config for the component"
                        }]
                }
            },
            "open": {
                "complexType": {
                    "signature": "() => Promise<boolean>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<boolean>"
                },
                "docs": {
                    "text": "Opens the accordion",
                    "tags": []
                }
            },
            "close": {
                "complexType": {
                    "signature": "() => Promise<boolean>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<boolean>"
                },
                "docs": {
                    "text": "Closes the accordion",
                    "tags": []
                }
            },
            "toggle": {
                "complexType": {
                    "signature": "() => Promise<boolean>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<boolean>"
                },
                "docs": {
                    "text": "Triggers the accordion",
                    "tags": []
                }
            },
            "select": {
                "complexType": {
                    "signature": "(dateString: string) => Promise<void>",
                    "parameters": [{
                            "name": "dateString",
                            "type": "string",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Selects an option",
                    "tags": []
                }
            },
            "setFocus": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Sets focus on the native `input` in `bal-input`. Use this method instead of the global\n`input.focus()`.",
                    "tags": []
                }
            },
            "setBlur": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Sets blur on the native `input` in `bal-input`. Use this method instead of the global\n`input.blur()`.",
                    "tags": [{
                            "name": "internal",
                            "text": undefined
                        }]
                }
            },
            "getInputElement": {
                "complexType": {
                    "signature": "() => Promise<HTMLInputElement | undefined>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "HTMLInputElement": {
                            "location": "global",
                            "id": "global::HTMLInputElement"
                        }
                    },
                    "return": "Promise<HTMLInputElement>"
                },
                "docs": {
                    "text": "Returns the native `<input>` element used under the hood.",
                    "tags": []
                }
            },
            "setAriaForm": {
                "complexType": {
                    "signature": "(ariaForm: BalAriaForm) => Promise<void>",
                    "parameters": [{
                            "name": "ariaForm",
                            "type": "BalAriaForm",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "BalAriaForm": {
                            "location": "import",
                            "path": "../../utils/form",
                            "id": "src/utils/form.ts::BalAriaForm"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "",
                    "tags": [{
                            "name": "internal",
                            "text": undefined
                        }]
                }
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "value",
                "methodName": "valueChanged"
            }, {
                "propName": "debounce",
                "methodName": "debounceChanged"
            }];
    }
}
__decorate([
    Logger('bal-date'),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Function]),
    __metadata("design:returntype", void 0)
], Date.prototype, "createLogger", null);
__decorate([
    ListenToConfig(),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [Object]),
    __metadata("design:returntype", Promise)
], Date.prototype, "configChanged", null);
let dateIds = 0;
