'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-7446596e.js');
const index_esm = require('./index.esm-e1cd7aff.js');
const floatingUi_dom_esm = require('./floating-ui.dom.esm-02f98d79.js');
const date = require('./date-575d2aa5.js');
const bem = require('./bem-81bc6a2d.js');
const log = require('./log-71656e64.js');
const attributes = require('./attributes-e6a3e6c7.js');
const formInput = require('./form-input-52cab7f2.js');
const helpers = require('./helpers-46584747.js');
const form = require('./form-2279fb2f.js');
const config_default = require('./config.default-ab53c2d9.js');
const config_decorator = require('./config.decorator-02695c77.js');
require('./index-e6a233be.js');
require('./_commonjsHelpers-bcc1208a.js');
require('./config.utils-aef60f18.js');
require('./browser-9ac97263.js');
require('./icons.constant-f1294def.js');

const balDateCss = ":root{--bal-date-popup-z-index:var(--bal-z-index-tooltip);--bal-date-popup-shadow:var(--bal-shadow-normal);--bal-date-popup-radius:var(--bal-radius-normal)}:root{--bal-z-index-tooltip:1300}.bal-date{display:block;font-family:var(--bal-font-family-text);width:100%}.bal-date__icon--clickable{cursor:pointer}.bal-date__popup{display:none;width:-webkit-max-content;width:-moz-max-content;width:max-content;position:absolute;top:0;left:0;z-index:var(--bal-date-popup-z-index);-webkit-box-shadow:var(--bal-date-popup-shadow);box-shadow:var(--bal-date-popup-shadow);border-radius:var(--bal-date-popup-radius)}.bal-date__popup--visible{display:block}";

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
        r = Reflect.decorate(decorators, target, key, desc);
    else
        for (var i = decorators.length - 1; i >= 0; i--)
            if (d = decorators[i])
                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
const Date = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.balInput = index.createEvent(this, "balInput", 7);
        this.balChange = index.createEvent(this, "balChange", 7);
        this.balWillAnimate = index.createEvent(this, "balWillAnimate", 7);
        this.balDidAnimate = index.createEvent(this, "balDidAnimate", 7);
        this.balBlur = index.createEvent(this, "balBlur", 7);
        this.balFocus = index.createEvent(this, "balFocus", 7);
        this.balInputClick = index.createEvent(this, "balInputClick", 7);
        this.balIconClick = index.createEvent(this, "balIconClick", 7);
        this.balPopoverPrepare = index.createEvent(this, "balPopoverPrepare", 7);
        this.inputId = `bal-da-${dateIds++}`;
        this.inheritedAttributes = {};
        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) => {
            formInput.stopEventBubbling(ev);
            this.value = ev.detail;
            this.balChange.emit(this.value);
            if (this.closeOnSelect) {
                this.close();
            }
        };
        this.onInputInput = (ev) => {
            formInput.stopEventBubbling(ev);
            this.balInput.emit(ev.detail);
            if (ev.detail) {
                const date$1 = date.BalDate.fromAnyFormat(ev.detail);
                if (date$1.isValid) {
                    this.calendarValue = date$1.toISODate();
                }
            }
        };
        this.onInputChange = (ev) => {
            formInput.stopEventBubbling(ev);
            this.value = ev.detail;
            this.balChange.emit(this.value);
        };
        this.onInputFocus = (ev) => {
            formInput.stopEventBubbling(ev);
            this.balFocus.emit(ev.detail);
        };
        this.onInputBlur = (ev) => {
            formInput.stopEventBubbling(ev);
            this.balBlur.emit(ev.detail);
        };
        this.onKeyPress = async ({ detail }) => {
            if (index_esm.isSpaceKey(detail) && !this.triggerIcon) {
                if (this.isExpanded) {
                    await this.close();
                }
                else {
                    await this.open();
                }
            }
        };
        this.isExpanded = false;
        this.language = config_default.defaultConfig.language;
        this.calendarValue = undefined;
        this.ariaForm = form.defaultBalAriaForm;
        this.name = this.inputId;
        this.invalid = false;
        this.required = false;
        this.disabled = false;
        this.readonly = false;
        this.freeSolo = false;
        this.placeholder = undefined;
        this.triggerIcon = false;
        this.closeOnSelect = true;
        this.value = undefined;
        this.min = undefined;
        this.max = undefined;
        this.minYearProp = undefined;
        this.maxYearProp = undefined;
        this.defaultDate = undefined;
        this.allowedDates = undefined;
        this.debounce = 0;
    }
    createLogger(log) {
        this.log = log;
    }
    valueChanged() {
        this.calendarValue = this.value;
    }
    debounceChanged() {
        this.balChange = helpers.debounceEvent(this.balChange, this.debounce);
    }
    connectedCallback() {
        this.valueChanged();
    }
    componentWillLoad() {
        this.inheritedAttributes = attributes.inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
    }
    async listenToKeydown(ev) {
        if (this.isExpanded && (ev.key === 'Escape' || ev.key === 'Esc')) {
            ev.preventDefault();
            await this.close();
        }
    }
    async listenOnKeyup(ev) {
        if (ev.key === 'Tab' && !this.el.contains(document.activeElement) && this.isExpanded) {
            await this.close();
        }
    }
    async listenOnclick(ev) {
        if (this.isExpanded && !this.el.contains(ev.target)) {
            await this.close();
        }
    }
    async listenOnPopoverPrepare(ev) {
        if (this.inputId !== ev.detail) {
            await this.close();
        }
    }
    async configChanged(state) {
        this.language = state.language;
    }
    async open() {
        return this.expand();
    }
    async close() {
        return this.collapse();
    }
    async toggle() {
        if (this.isExpanded) {
            return this.collapse();
        }
        else {
            return this.expand();
        }
    }
    async select(dateString) {
        const date$1 = date.BalDate.fromISO(dateString);
        if (date$1.isValid) {
            this.value = date$1.toISODate();
            this.calendarValue = this.value;
        }
    }
    async setFocus() {
        var _a;
        (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.setFocus();
    }
    async setBlur() {
        var _a;
        (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.setBlur();
    }
    async getInputElement() {
        var _a;
        return (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.getInputElement();
    }
    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) {
            this.balPopoverPrepare.emit(this.inputId);
            this.balWillAnimate.emit();
            this.isExpanded = true;
            this.popupCleanup = floatingUi_dom_esm.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;
    }
    updatePosition(referenceEl, floatingEl) {
        floatingUi_dom_esm.computePosition(referenceEl, floatingEl, {
            placement: 'bottom-start',
            middleware: [floatingUi_dom_esm.offset(4), floatingUi_dom_esm.flip({ crossAxis: false })],
        }).then(({ x, y }) => {
            Object.assign(floatingEl.style, {
                left: `${x}px`,
                top: `${y}px`,
            });
            this.balDidAnimate.emit();
        });
    }
    render() {
        const block = bem.BEM.block('date');
        const blockIcon = block.element('icon');
        const blockPopup = block.element('popup');
        return (index.h(index.Host, { id: this.inputId, class: Object.assign({}, block.class()) }, index.h("bal-input-group", { invalid: this.invalid, readonly: this.readonly, disabled: this.disabled, ref: el => (this.referenceEl = el) }, index.h("bal-input-date", Object.assign({ 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, onClick: this.onInputClick, onBalInput: this.onInputInput, onBalChange: this.onInputChange, onBalFocus: this.onInputFocus, onBalBlur: this.onInputBlur, onBalKeyPress: this.onKeyPress, ref: el => (this.inputEl = el) }, this.inheritedAttributes)), !this.freeSolo ? (index.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": date.i18nBalDate[this.language].toggleDatepicker, "aria-haspopup": "true", "aria-expanded": this.isExpanded ? 'true' : 'false' })) : ('')), index.h("div", { 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}` }, index.h("bal-date-calendar", { value: this.calendarValue, min: this.min, max: this.max, minYearProp: this.minYearProp, maxYearProp: this.maxYearProp, defaultDate: this.defaultDate, allowedDates: this.allowedDates, onBalChange: this.onCalendarChange }))));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "value": ["valueChanged"],
        "debounce": ["debounceChanged"]
    }; }
};
__decorate([
    log.Logger('bal-date')
], Date.prototype, "createLogger", null);
__decorate([
    config_decorator.ListenToConfig()
], Date.prototype, "configChanged", null);
let dateIds = 0;
Date.style = balDateCss;

exports.bal_date = Date;
