import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-853c3f3f.js';
import { s as lodash_padstart, d as dateSeparator } from './index.esm-586fc0cd.js';
import { l as lodash_isnil } from './index-82aff103.js';
import { B as BalDate, i as i18nBalDate } from './date-daa101cf.js';
import { L as Logger } from './log-01623e2c.js';
import { d as defaultConfig } from './initialize-ac68e3e3.js';
import { L as ListenToConfig } from './config.decorator-54721e29.js';
import { b as waitAfterFramePaint, n as hasParent } from './helpers-697ce790.js';
import { B as BEM } from './bem-1b28532d.js';
import { L as ListenToSwipe } from './swipe.decorator-94b04795.js';
import { i as inheritAttributes } from './attributes-56afda45.js';
import { N as NUMBER_KEYS } from './keys.constant-a195c4b1.js';
import { l as lodash_isfunction } from './index-cc65892d.js';
import { c as inputSetFocus, d as inputSetBlur } from './form-input-8e4d0215.js';
import { d as defaultBalAriaForm } from './form-479fd066.js';
import './_commonjsHelpers-ba3f0406.js';
import './index-8b8ed6bd.js';
import './browser-9199b5e2.js';
import './icons.constant-0d61e703.js';
import './swipe.subject-c6fe3082.js';
import './device-c28cde6d.js';
import './listener-ea90dc02.js';

function getDaysInMonth(year, month) {
  if (month < 1 || year < 0) {
    return undefined;
  }
  return new Date(year, month, 0).getDate();
}
function isoDateOfDay(day, month, year) {
  return `${year}-${lodash_padstart(`${month}`, 2, '0')}-${lodash_padstart(`${day}`, 2, '0')}`;
}
function isoDateOfToday() {
  const today = new Date();
  return `${today.getFullYear()}-${lodash_padstart(`${today.getMonth() + 1}`, 2, '0')}-${lodash_padstart(`${today.getDate()}`, 2, '0')}`;
}
function generateCalendarGrid(year, month, min, max, allowedDates) {
  const grid = [];
  const numDays = getDaysInMonth(year, month);
  const firstDay = getFirstDayOfMonth(year, month);
  if (numDays !== undefined && firstDay) {
    const isoToday = isoDateOfToday();
    const dateMin = BalDate.fromISO(min);
    const dateMax = BalDate.fromISO(max);
    const allowedDate = (isoDate) => {
      if (lodash_isnil(allowedDates)) {
        return false;
      }
      return !allowedDates(isoDate);
    };
    for (let day = 1; day <= numDays; day++) {
      const isoDate = isoDateOfDay(day, month, year);
      grid.push({
        day,
        month,
        year,
        isoDate,
        fullDate: BalDate.fromISO(isoDate).toFormat(),
        today: isoToday === isoDate,
        disabled: dateMin.isAfter(isoDate) || dateMax.isBefore(isoDate) || allowedDate(isoDate),
      });
    }
  }
  return grid;
}
function getFirstWeekdayOfMonth(year, month) {
  if (month < 1 || year < 0) {
    return 1;
  }
  const date = new Date(year, month - 1, 1);
  const weekday = date.getDay();
  return weekday === 0 ? 7 : weekday;
}
function validateLanguage(language) {
  if (['en', 'de', 'fr', 'it', 'nl', 'es', 'pl', 'pt', 'sv', 'fi'].includes(language)) {
    return language;
  }
  return 'de';
}
function generateYears(currentYear, minYear, maxYear) {
  const list = [];
  const today = new Date();
  const todayYear = today.getFullYear();
  for (let year = minYear; year <= maxYear; year++) {
    list.push({
      value: year,
      label: `${year}`,
      disabled: false,
      today: todayYear === year,
      selected: currentYear === year,
    });
  }
  return list;
}
function generateMonths(language, currentYear, selectedDate, min, max) {
  const locale = validateLanguage(language);
  const months = BalDate.infoMonths({ format: 'long', locale });
  const selected = BalDate.fromISO(selectedDate);
  const today = new Date();
  const todayYear = today.getFullYear();
  const todayMonth = today.getMonth() + 1;
  let minMonth = 0;
  if (min && currentYear !== undefined) {
    const minDate = BalDate.fromISO(min);
    if (minDate.isValid) {
      if (currentYear > minDate.year) {
        minMonth = 0;
      }
      else {
        minMonth = minDate.month || minMonth;
      }
    }
  }
  let maxMonth = 12;
  if (max && currentYear !== undefined) {
    const maxDate = BalDate.fromISO(max);
    if (maxDate.isValid) {
      if (currentYear < maxDate.year) {
        maxMonth = 12;
      }
      else {
        maxMonth = maxDate.month || maxMonth;
      }
    }
  }
  return months.map((label, index) => {
    const value = index + 1;
    return {
      label,
      value,
      today: value === todayMonth && currentYear === todayYear,
      selected: value === selected.month && currentYear === selected.year,
      disabled: value < minMonth || value > maxMonth,
    };
  });
}
function generateWeekDays(language) {
  const locale = validateLanguage(language);
  const weekdaysMin = BalDate.infoWeekdays({ format: 'short', locale });
  const weekdays = BalDate.infoWeekdays({ format: 'long', locale });
  return weekdaysMin.map((weekdayMin, index) => ({
    ariaLabel: weekdays[index],
    textContent: weekdayMin,
  }));
}
function getFirstDayOfMonth(year, month) {
  if (month < 1 || month > 12 || year < 0) {
    return undefined;
  }
  return new Date(year, month - 1, 1);
}

const CalendarList = ({ name, isVisible, girdHeight, list, onSelect, ref, }) => {
  const block = BEM.block('date-calendar');
  const blockBody = block.element('body');
  const blockBodyList = blockBody.element('list');
  return (h("ul", { class: Object.assign(Object.assign(Object.assign({}, blockBodyList.class()), blockBodyList.modifier(name).class()), blockBodyList.modifier('visible').class(isVisible)), "aria-hidden": isVisible ? 'false' : 'true', style: {
      height: `${girdHeight - 2 - 8 - 8}px`,
    }, ref: el => (ref ? ref(el) : undefined) }, list.map(item => (h("li", { id: `${name}-${item.value}` },
    h("button", { class: Object.assign(Object.assign(Object.assign(Object.assign({}, blockBodyList.element('item').class()), blockBodyList.element('item').modifier('today').class(item.today)), blockBodyList.element('item').modifier('selected').class(item.selected)), blockBodyList.element('item').modifier('disabled').class(item.disabled)), tabIndex: -1, onClick: () => onSelect(item) }, item.label))))));
};

const CalendarGrid = ({ isVisible, ref, grid, weekdays, selectedDate, firstDayOfWeek, onSelectDay, }) => {
  const block = BEM.block('date-calendar');
  const blockBody = block.element('body');
  const blockBodyGrid = blockBody.element('grid');
  return (h("div", { role: "grid", class: Object.assign(Object.assign({}, blockBodyGrid.class()), blockBodyGrid.modifier('visible').class(isVisible)), "aria-hidden": isVisible ? 'false' : 'true', ref: el => ref(el) },
    h("div", { role: "row", class: Object.assign({}, blockBodyGrid.element('head').class()) }, weekdays.map(weekday => (h("span", { role: "columnheader", "aria-label": weekday.ariaLabel, title: weekday.ariaLabel }, weekday.textContent)))),
    h("div", { role: "row", class: Object.assign({}, blockBodyGrid.element('body').class()), style: { '--bal-date-first-week-day': `${firstDayOfWeek}` } }, grid.map(cell => (h("bal-date-calendar-cell", Object.assign({}, cell, { selected: cell.isoDate === selectedDate, onBalSelectDay: ({ detail }) => onSelectDay(detail) })))))));
};

const CalendarNav = ({ language, onClickSelectMonthAndYear, monthFullNames, month, year, isCalendarVisible, isListVisible, onClickPreviousMonth, onClickNextMonth, }) => {
  const block = BEM.block('date-calendar');
  const blockNav = block.element('nav');
  const nextMonthLabel = i18nBalDate[language].nextMonth;
  const previousMonthLabel = i18nBalDate[language].previousMonth;
  const selectMonthLabel = i18nBalDate[language].selectMonth;
  return (h("div", { class: Object.assign({}, blockNav.class()) },
    h("div", { class: Object.assign({}, blockNav.modifier('start').class()) },
      h("button", { title: selectMonthLabel, "aria-label": selectMonthLabel, tabIndex: -1, "data-test": "change-year-month", onClick: onClickSelectMonthAndYear },
        h("span", null,
          monthFullNames[month - 1],
          " ",
          year),
        h("bal-icon", { name: "caret-up", color: "primary", size: "small", turn: isCalendarVisible }))),
    h("div", { class: Object.assign({}, blockNav.modifier('end').class()), style: {
        display: isListVisible ? 'none' : 'flex',
      } },
      h("button", { title: previousMonthLabel, "aria-label": previousMonthLabel, onClick: onClickPreviousMonth, tabIndex: -1, "data-test": "previous-month" },
        h("bal-icon", { name: "caret-left", color: "primary", size: "small" })),
      h("button", { title: nextMonthLabel, "aria-label": nextMonthLabel, onClick: onClickNextMonth, tabIndex: -1, "data-test": "next-month" },
        h("bal-icon", { name: "caret-right", color: "primary", size: "small" })))));
};

const balDateCalendarCss = ":host{--bal-date-first-week-day:0;--bal-date-calendar-background:var(--bal-color-red-3)}:host{--bal-date-first-week-day:0;--bal-date-calendar-background:var(--bal-color-red-3)}:host{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:inline-block;background:var(--bal-color-white);border-radius:var(--bal-radius-normal)}.bal-date-calendar__nav{display:-ms-flexbox;display:flex;width:calc(100% - 1rem);-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:.5rem;gap:.5rem}.bal-date-calendar__nav--start>button{display:-ms-flexbox;display:flex;gap:.5rem}.bal-date-calendar__nav--end{display:-ms-flexbox;display:flex;gap:.5rem}.bal-date-calendar__nav button{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;cursor:pointer;border-radius:var(--bal-radius-normal);font-family:var(--bal-font-family-text);font-weight:var(--bal-weight-regular);color:var(--bal-color-text-primary);border:none;background:rgba(0,0,0,0);text-align:center;font-size:var(--bal-size-normal);line-height:var(--bal-line-height-normal);-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;outline:none;min-height:2rem;min-width:2rem;padding:.25rem;border-radius:var(--bal-button-radius);font-family:var(--bal-font-family-title);font-weight:var(--bal-weight-bold)}@media (hover: hover)and (pointer: fine){.bal-date-calendar__nav button:not(.bal-date-calendar__nav button--selected):not(.bal-date-calendar__nav button--disabled):hover{background:var(--bal-color-light-blue-1)}}.bal-date-calendar__nav button:not(.bal-date-calendar__nav button--selected):not(.bal-date-calendar__nav button--disabled):active{background:var(--bal-color-light-blue-2)}.bal-date-calendar__nav button--today:not(.bal-date-calendar__nav button--selected):not(.bal-date-calendar__nav button--disabled){color:var(--bal-color-light-blue-3);font-weight:var(--bal-weight-bold)}@media (hover: hover)and (pointer: fine){.bal-date-calendar__nav button--today:not(.bal-date-calendar__nav button--selected):not(.bal-date-calendar__nav button--disabled):hover{color:var(--bal-color-text-primary)}}.bal-date-calendar__nav button--today:not(.bal-date-calendar__nav button--selected):not(.bal-date-calendar__nav button--disabled):active{color:var(--bal-color-text-primary)}.bal-date-calendar__nav button--selected{background:var(--bal-color-primary);color:var(--bal-color-text-white);font-weight:var(--bal-weight-bold)}.bal-date-calendar__nav button--disabled{cursor:default;background:rgba(0,0,0,0);color:var(--bal-color-text-grey-light)}.bal-date-calendar__body{display:block}.bal-date-calendar__body__grid{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:.5rem;height:0;padding-top:0;padding-bottom:0;visibility:hidden}.bal-date-calendar__body__grid--visible{height:auto;padding-top:.5rem;padding-bottom:.5rem;visibility:visible}.bal-date-calendar__body__grid__head{position:relative;display:grid;grid-template-columns:repeat(7, 1fr);-webkit-column-gap:.5rem;-moz-column-gap:.5rem;column-gap:.5rem;row-gap:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.bal-date-calendar__body__grid__head::after{position:absolute;content:\"\";height:2px;width:calc(100% + 1rem);bottom:0;left:-0.5rem;right:-0.5rem;background:var(--bal-color-border-grey)}.bal-date-calendar__body__grid__head span{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;height:2rem;width:2rem;font-family:var(--bal-font-family-title);font-weight:var(--bal-weight-bold);font-size:var(--bal-size-normal);line-height:var(--bal-line-height-normal);-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.bal-date-calendar__body__grid__body{display:grid;grid-template-columns:repeat(7, 1fr);-webkit-column-gap:.5rem;-moz-column-gap:.5rem;column-gap:.5rem;row-gap:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding-top:.5rem}.bal-date-calendar__body__grid__body>.bal-date-calendar-cell{width:2rem;height:2rem;text-align:center;font-size:var(--bal-size-normal);line-height:var(--bal-line-height-normal);-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.bal-date-calendar__body__grid__body>.bal-date-calendar-cell:first-child{grid-column:var(--bal-date-first-week-day)}.bal-date-calendar__body__list{display:none;list-style:none;margin:0;padding:0;-webkit-column-gap:.5rem;-moz-column-gap:.5rem;column-gap:.5rem;row-gap:.5rem;width:calc(100% - 1rem);overflow-y:auto;max-height:18rem;position:relative;padding:.5rem;border-top:2px solid var(--bal-color-border-grey)}.bal-date-calendar__body__list .bal-date-calendar__body__list__item{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;cursor:pointer;border-radius:var(--bal-radius-normal);font-family:var(--bal-font-family-text);font-weight:var(--bal-weight-regular);color:var(--bal-color-text-primary);border:none;background:rgba(0,0,0,0);text-align:center;font-size:var(--bal-size-normal);line-height:var(--bal-line-height-normal);-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;outline:none;width:100%}@media (hover: hover)and (pointer: fine){.bal-date-calendar__body__list .bal-date-calendar__body__list__item:not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected):not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled):hover{background:var(--bal-color-light-blue-1)}}.bal-date-calendar__body__list .bal-date-calendar__body__list__item:not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected):not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled):active{background:var(--bal-color-light-blue-2)}.bal-date-calendar__body__list .bal-date-calendar__body__list__item--today:not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected):not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled){color:var(--bal-color-light-blue-3);font-weight:var(--bal-weight-bold)}@media (hover: hover)and (pointer: fine){.bal-date-calendar__body__list .bal-date-calendar__body__list__item--today:not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected):not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled):hover{color:var(--bal-color-text-primary)}}.bal-date-calendar__body__list .bal-date-calendar__body__list__item--today:not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected):not(.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled):active{color:var(--bal-color-text-primary)}.bal-date-calendar__body__list .bal-date-calendar__body__list__item--selected{background:var(--bal-color-primary);color:var(--bal-color-text-white);font-weight:var(--bal-weight-bold)}.bal-date-calendar__body__list .bal-date-calendar__body__list__item--disabled{cursor:default;background:rgba(0,0,0,0);color:var(--bal-color-text-grey-light)}.bal-date-calendar__body__list--visible{display:grid}.bal-date-calendar__body__list--year{grid-template-columns:repeat(4, 1fr)}.bal-date-calendar__body__list--month{grid-template-columns:repeat(2, 1fr)}.bal-date-calendar-cell{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;cursor:pointer;border-radius:var(--bal-radius-normal);font-family:var(--bal-font-family-text);font-weight:var(--bal-weight-regular);color:var(--bal-color-text-primary);border:none;background:rgba(0,0,0,0);text-align:center;font-size:var(--bal-size-normal);line-height:var(--bal-line-height-normal);-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto;outline:none;width:2rem;height:2rem}@media (hover: hover)and (pointer: fine){.bal-date-calendar-cell:not(.bal-date-calendar-cell--selected):not(.bal-date-calendar-cell--disabled):hover{background:var(--bal-color-light-blue-1)}}.bal-date-calendar-cell:not(.bal-date-calendar-cell--selected):not(.bal-date-calendar-cell--disabled):active{background:var(--bal-color-light-blue-2)}.bal-date-calendar-cell--today:not(.bal-date-calendar-cell--selected):not(.bal-date-calendar-cell--disabled){color:var(--bal-color-light-blue-3);font-weight:var(--bal-weight-bold)}@media (hover: hover)and (pointer: fine){.bal-date-calendar-cell--today:not(.bal-date-calendar-cell--selected):not(.bal-date-calendar-cell--disabled):hover{color:var(--bal-color-text-primary)}}.bal-date-calendar-cell--today:not(.bal-date-calendar-cell--selected):not(.bal-date-calendar-cell--disabled):active{color:var(--bal-color-text-primary)}.bal-date-calendar-cell--selected{background:var(--bal-color-primary);color:var(--bal-color-text-white);font-weight:var(--bal-weight-bold)}.bal-date-calendar-cell--disabled{cursor:default;background:rgba(0,0,0,0);color:var(--bal-color-text-grey-light)}";

var __decorate$1 = (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 DateCalendar = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.balChange = createEvent(this, "balChange", 7);
    this.onSelectDay = (isoDate) => {
      this.valueChanged(isoDate, this.selectedDate);
      this.balChange.emit(this.selectedDate);
    };
    this.onClickNextMonth = () => {
      let nextYear = this.year;
      let nextMonth = this.month + 1;
      if (nextMonth > 12) {
        nextMonth = 1;
        nextYear = nextYear + 1;
      }
      this.generateGridByMonthAndYear(nextMonth, nextYear);
    };
    this.onClickPreviousMonth = () => {
      let nextYear = this.year;
      let nextMonth = this.month - 1;
      if (nextMonth < 1) {
        nextMonth = 12;
        nextYear = nextYear - 1;
      }
      this.generateGridByMonthAndYear(nextMonth, nextYear);
    };
    this.onClickSelectMonthAndYear = async () => {
      this.months = generateMonths(this.language, this.year, this.selectedDate, this.min, this.max);
      if (this.isCalendarVisible === true) {
        this.isCalendarVisible = false;
        this.isYearListVisible = true;
        this.isMonthListVisible = false;
        await waitAfterFramePaint();
        if (this.yearListEl) {
          const selectedYearEl = this.yearListEl.querySelector(`#year-${this.year}`);
          if (selectedYearEl) {
            const rowHeight = 26 + 8 + 4;
            this.yearListEl.scrollTop = selectedYearEl.offsetTop - rowHeight * 2;
          }
          else {
            this.yearListEl.scrollTop = 0;
          }
        }
      }
      else {
        this.isCalendarVisible = true;
        this.isYearListVisible = false;
        this.isMonthListVisible = false;
      }
    };
    this.onClickYear = (newYear) => {
      this.isYearListVisible = false;
      this.isMonthListVisible = true;
      this.generateGridByMonthAndYear(this.month, newYear);
      this.months = generateMonths(this.language, newYear, this.selectedDate, this.min, this.max);
    };
    this.onClickMonth = (newMonth) => {
      this.isYearListVisible = false;
      this.isMonthListVisible = false;
      this.isCalendarVisible = true;
      this.generateGridByMonthAndYear(newMonth, this.year);
    };
    this.selectedDate = '';
    this.monthFullNames = [];
    this.weekdays = [];
    this.months = [];
    this.years = [];
    this.calendarGrid = [];
    this.firstDayOfWeek = 0;
    this.month = 0;
    this.year = 0;
    this.language = defaultConfig.language;
    this.isCalendarVisible = true;
    this.isYearListVisible = false;
    this.isMonthListVisible = false;
    this.value = undefined;
    this.defaultDate = undefined;
    this.allowedDates = undefined;
    this.min = undefined;
    this.max = undefined;
    this.minYearProp = undefined;
    this.maxYearProp = undefined;
  }
  createLogger(log) {
    this.log = log;
  }
  valueChanged(newValue, oldValue) {
    if (newValue !== oldValue) {
      const date = BalDate.fromISO(newValue);
      if (!date.isValid) {
        this.generateGridByDefaultDate();
        this.selectedDate = '';
      }
      else {
        this.generateGridByDate(date);
        this.selectedDate = date.toISODate();
      }
    }
  }
  rangePropChanged() {
    this.months = generateMonths(this.language, this.year, this.selectedDate, this.min, this.max);
    this.years = generateYears(this.year, this.minYear, this.maxYear);
  }
  yearRangePropChanged() {
    this.years = generateYears(this.year, this.minYear, this.maxYear);
  }
  connectedCallback() {
    this.generateGridByDefaultDate();
    this.valueChanged(this.value, undefined);
  }
  async configChanged(state) {
    this.years = generateYears(this.year, this.minYear, this.maxYear);
    this.months = generateMonths(state.language, this.year, this.selectedDate, this.min, this.max);
    this.weekdays = generateWeekDays(state.language);
    this.monthFullNames = BalDate.infoMonths({ format: 'long', locale: this.language });
    this.language = state.language;
  }
  swipeListener({ left, right }) {
    if (left) {
      this.onClickNextMonth();
    }
    else if (right) {
      this.onClickPreviousMonth();
    }
  }
  get minYear() {
    if (this.minYearProp === undefined) {
      const today = new Date();
      const year = today.getFullYear();
      const defaultMinYear = year - 100;
      if (this.min) {
        const date = BalDate.fromISO(this.min);
        return date.year || defaultMinYear;
      }
      else {
        return defaultMinYear;
      }
    }
    return this.minYearProp;
  }
  get maxYear() {
    if (this.maxYearProp === undefined) {
      const today = new Date();
      const year = today.getFullYear();
      const defaultMaxYear = year + 50;
      if (this.max) {
        const date = BalDate.fromISO(this.max);
        return date.year || defaultMaxYear;
      }
      else {
        return defaultMaxYear;
      }
    }
    return this.maxYearProp;
  }
  generateGridByDate(date) {
    if (date.year !== undefined && date.month !== undefined) {
      this.generateGridByMonthAndYear(date.month, date.year);
    }
  }
  generateGridByDefaultDate() {
    const date = BalDate.fromISO(this.defaultDate);
    if (date.isValid) {
      this.generateGridByDate(date);
    }
    else {
      const today = new Date();
      this.month = today.getMonth() + 1;
      this.year = today.getFullYear();
      this.calendarGrid = generateCalendarGrid(this.year, this.month, this.min, this.max, this.allowedDates);
      this.firstDayOfWeek = getFirstWeekdayOfMonth(this.year, this.month);
    }
  }
  generateGridByMonthAndYear(month, year) {
    if (this.month !== month || this.year !== year) {
      this.calendarGrid = generateCalendarGrid(year, month, this.min, this.max, this.allowedDates);
      this.firstDayOfWeek = getFirstWeekdayOfMonth(year, month);
    }
    this.month = month;
    this.year = year;
  }
  render() {
    var _a;
    const girdHeight = ((_a = this.gridEl) === null || _a === void 0 ? void 0 : _a.clientHeight) || 0;
    const block = BEM.block('date-calendar');
    const blockBody = block.element('body');
    const blockFoot = block.element('foot');
    return (h(Host, { class: Object.assign({}, block.class()) }, h(CalendarNav, { language: this.language, monthFullNames: this.monthFullNames, month: this.month, year: this.year, isCalendarVisible: this.isCalendarVisible, isListVisible: this.isMonthListVisible || this.isYearListVisible, onClickSelectMonthAndYear: this.onClickSelectMonthAndYear, onClickPreviousMonth: this.onClickPreviousMonth, onClickNextMonth: this.onClickNextMonth }), h("div", { class: Object.assign({}, blockBody.class()) }, h(CalendarGrid, { isVisible: this.isCalendarVisible, grid: this.calendarGrid, weekdays: this.weekdays, firstDayOfWeek: this.firstDayOfWeek, selectedDate: this.selectedDate, ref: el => (this.gridEl = el), onSelectDay: isoDate => this.onSelectDay(isoDate) }), h(CalendarList, { name: "year", isVisible: this.isYearListVisible, girdHeight: girdHeight, list: this.years, ref: el => (this.yearListEl = el), onSelect: item => this.onClickYear(item.value) }), h(CalendarList, { name: "month", isVisible: this.isMonthListVisible, girdHeight: girdHeight, list: this.months, onSelect: item => this.onClickMonth(item.value) })), h("div", { class: Object.assign({}, blockFoot.class()) }, h("slot", null))));
  }
  get el() { return getElement(this); }
  static get watchers() { return {
    "value": ["valueChanged"],
    "min": ["rangePropChanged"],
    "max": ["rangePropChanged"],
    "minYearProp": ["yearRangePropChanged"],
    "maxYearProp": ["yearRangePropChanged"]
  }; }
};
__decorate$1([
  Logger('bal-date-calendar')
], DateCalendar.prototype, "createLogger", null);
__decorate$1([
  ListenToConfig()
], DateCalendar.prototype, "configChanged", null);
__decorate$1([
  ListenToSwipe({ mobileOnly: true })
], DateCalendar.prototype, "swipeListener", null);
DateCalendar.style = balDateCalendarCss;

class MaskPosition {
  constructor(_options) {
    this._options = _options;
    this._position = 0;
    this._positionEnd = 0;
    this._isRangeSelection = false;
    if (_options.component && _options.component.nativeInput) {
      this._position = _options.component.nativeInput.selectionStart || 0;
      this._positionEnd = _options.component.nativeInput.selectionEnd || 0;
      this._isRangeSelection = this._position !== this._positionEnd;
    }
  }
  get isRangeSelection() {
    return this._isRangeSelection;
  }
  get value() {
    if (this._options.isBackspace && this._position > 0) {
      return this._position - 1;
    }
    return this._position;
  }
  set value(index) {
    const validatedIndex = index < 0 ? 0 : index > this._options.mask.maxLength ? this._options.mask.maxLength : index;
    this._position = validatedIndex;
  }
  toStart() {
    this.value = 0;
  }
  toEnd() {
    const target = this.getTarget();
    if (target) {
      this.value = target.value.length;
    }
  }
  next(next = 1) {
    const newPosition = this._position + next;
    if (newPosition <= this._options.mask.maxLength) {
      this._position = newPosition;
    }
    return this._position;
  }
  previous(previous = 1) {
    const newPosition = this._position - previous;
    if (newPosition >= 0) {
      this._position = newPosition;
    }
    else {
      this._position = 0;
    }
    return this._position;
  }
  submit() {
    const target = this.getTarget();
    if (target && target.selectionStart !== this._position && target.selectionEnd !== this._position) {
      target.selectionStart = this._position;
      target.selectionEnd = this._position;
    }
  }
  getTarget() {
    if (this._options.component && this._options.component.nativeInput) {
      return this._options.component.nativeInput;
    }
    return undefined;
  }
}

class MaskContext {
  constructor(_options) {
    this._options = _options;
    this._value = '';
    if (this._options.component && this._options.component.nativeInput) {
      this._value = this._options.component.nativeInput.value;
    }
    this.position = new MaskPosition(this._options);
  }
  get target() {
    if (this._options.component && this._options.component.nativeInput) {
      return this._options.component.nativeInput;
    }
    return undefined;
  }
  get value() {
    return this._value;
  }
  set value(newValue) {
    this._value = newValue;
  }
  get focused() {
    return this._options.component.focused;
  }
  isValueEmpty() {
    return this.value === '' || this.value === undefined || this.value === null;
  }
  preventDefault() {
    if (this._options.event.preventDefault) {
      this._options.event.preventDefault();
    }
  }
  stopPropagation() {
    this.preventDefault();
    if (this._options.event.stopPropagation) {
      this._options.event.stopPropagation();
    }
  }
  async submit(eventType = 'input', parsedValue) {
    if (this.target) {
      this.target.value = this.value;
      if (eventType !== 'blur' && eventType !== 'tab') {
        this.position.submit();
      }
      if (this._options.component) {
        if (eventType === 'input' || eventType === 'tab') {
          this._options.component.balInput.emit(this.value);
        }
        if ((eventType === 'change' || eventType === 'blur') && parsedValue !== undefined) {
          const valueChanged = this._options.component.value !== parsedValue;
          if (valueChanged) {
            this._options.component.value = parsedValue;
            this._options.component.balChange.emit(parsedValue);
          }
        }
      }
    }
  }
}

class MaskClipboardContext extends MaskContext {
  get clipboardData() {
    var _a;
    return (_a = this._options.event.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text');
  }
}

class MaskFocusContext extends MaskContext {
}

class MaskKeyboardContext extends MaskContext {
  get key() {
    return this._options.event.key;
  }
  get isCtrlOrCommandKey() {
    return this._options.event.metaKey || this._options.event.ctrlKey;
  }
  get isBackspaceKey() {
    return this._options.event.key === 'Backspace';
  }
  get isWhiteSpaceKey() {
    return this._options.event.key === ' ';
  }
  get isDeleteKey() {
    return this._options.event.key === 'Delete' || this._options.event.key === 'Del';
  }
  get isNumberKey() {
    return MaskKeyboardContext.NUMBER_KEYS.includes(this._options.event.key);
  }
  get isNavigationKey() {
    return MaskKeyboardContext.NAVIGATION_KEYS.includes(this._options.event.key);
  }
  get isSelectAllCommand() {
    return (this._options.event.ctrlKey || this._options.event.metaKey) && this.key === 'a';
  }
  get isCopyCommand() {
    return (this._options.event.ctrlKey || this._options.event.metaKey) && this.key === 'c';
  }
  get isPasteCommand() {
    return (this._options.event.ctrlKey || this._options.event.metaKey) && this.key === 'v';
  }
  getCharAt(position = this.position.value) {
    return this.value.charAt(position);
  }
  getCharAtBackspacePosition() {
    return this.getCharAt(this.position.value - 1);
  }
  setChar(char = this._options.event.key, position = this.position.value) {
    this.value = this.value.substring(0, position) + char + this.value.substring(position + 1);
  }
}
MaskKeyboardContext.NUMBER_KEYS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
MaskKeyboardContext.NAVIGATION_KEYS = [
  'Home',
  'End',
  'ArrowLeft',
  'Left',
  'ArrowRight',
  'Right',
  'Tab',
  'Enter',
  'Esc',
  'Escape',
];

class MaskLocaleContext extends MaskContext {
  get locale() {
    return this._options.event.locale;
  }
}

class MaskMouseContext extends MaskContext {
}

class MaskValueChangedContext extends MaskContext {
  get newValue() {
    return this._options.event.newValue;
  }
  get oldValue() {
    return this._options.event.oldValue;
  }
  get didValueChange() {
    return this.newValue !== this.oldValue;
  }
}

class MaskBlock {
  constructor(option) {
    this._isSeparator = false;
    this._allowedKeys = [];
    this._locale = 'de-CH';
    this._from = option.from || 0;
    this._to = option.to || 0;
    this._isSeparator = option.isSeparator === undefined ? false : option.isSeparator;
    this._mask = option.mask || '_';
    this._allowedKeys = option.allowedKeys ? option.allowedKeys : this.allowedKeys;
    this._format = option.format;
  }
  format(value) {
    if (this._format) {
      return this._format(value.replace(this.mask, ''), this._locale, this.mask);
    }
    return value;
  }
  get isSeparator() {
    return this._isSeparator;
  }
  get to() {
    return this._to;
  }
  get from() {
    return this._from;
  }
  get mask() {
    if (lodash_isfunction(this._mask)) {
      return this._mask(this._locale);
    }
    return this._mask;
  }
  get allowedKeys() {
    return this._allowedKeys;
  }
  onI18nChange(locale) {
    this._locale = locale;
  }
  getValueOfTheBlock(value) {
    return value.slice(this._from, this._to);
  }
  isTouched(value) {
    const blockValue = this.getValueOfTheBlock(value);
    return !blockValue.split('').every(char => char === this.mask);
  }
  verifyAllowedKeyHits(key) {
    if (this.isSeparator && key === this.mask) {
      return true;
    }
    else if (this.allowedKeys.indexOf(key) >= 0) {
      return true;
    }
    else {
      return false;
    }
  }
}

class MaskBlockList {
  constructor(_list = []) {
    this._list = _list;
  }
  get lastPosition() {
    return this._list[this._list.length - 1].to;
  }
  get list() {
    return this._list;
  }
  set list(list) {
    this._list = list;
  }
  clone() {
    return new MaskBlockList([...this._list]);
  }
  findByIndex(index, blocks = this.list) {
    return blocks.find(block => block.from <= index && index < block.to);
  }
  getPlaceholderMask() {
    const placeholder = [];
    this.list.forEach(block => {
      const length = block.to - block.from;
      for (let index = 0; index < length; index++) {
        placeholder.push(block.mask);
      }
    });
    return placeholder.join('');
  }
  getRawValueWithoutMaskByContext(context) {
    return this.getRawValueWithoutMask(context.value);
  }
  getRawValueWithoutMask(value) {
    if (value) {
      let rawValue = [];
      const chars = value.split('');
      for (let index = 0; index < chars.length; index++) {
        const char = chars[index];
        const block = this.findByIndex(index);
        if (block && !block.isSeparator) {
          rawValue.push(char.replace(block.mask, ''));
        }
        else {
          rawValue.push(char);
        }
      }
      rawValue = rawValue.filter(v => v);
      const amountSeparators = this.list.filter(block => block.isSeparator).length;
      if (amountSeparators === rawValue.length) {
        return '';
      }
      return rawValue.join('');
    }
    return '';
  }
  formatBlocks(value, activeBlockIndex) {
    let newValue = `${value}`;
    for (let index = 0; index < this.list.length; index++) {
      const block = this.list[index];
      if (activeBlockIndex !== index && !block.isSeparator && block.isTouched(newValue)) {
        const blockValue = block.getValueOfTheBlock(newValue);
        const newBlockValue = block.format(blockValue);
        newValue = newValue.substring(0, block.from) + newBlockValue + newValue.substring(block.to);
      }
    }
    return newValue;
  }
  getBlockIndexFromPosition(position) {
    const length = this.list.reduce((acc, block) => acc + block.to - block.from, 0);
    if (position === length) {
      return this.list.length - 1;
    }
    const index = this.list.findIndex(block => block.from <= position && position < block.to);
    return index < 0 ? undefined : Math.min(length, index);
  }
  verifyCallOfNextSeparator(key, index) {
    if (this.list.length - 1 > index) {
      const nextBlock = this.list[index + 1];
      if (nextBlock.isSeparator && nextBlock.mask === key) {
        return true;
      }
    }
    return false;
  }
}

class AbstractMask {
  constructor(blocks = []) {
    this.inputMode = 'text';
    this.locale = 'de-CH';
    this.blocks = new MaskBlockList(blocks);
  }
  onLocaleChange(context, _oldLocale, oldBlocks) {
    if (context.target) {
      const value = context.value;
      const chars = value.split('');
      for (let index = 0; index < chars.length; index++) {
        const char = chars[index];
        const newBlock = this.blocks.findByIndex(index);
        const oldBlock = oldBlocks.findByIndex(index);
        if (newBlock && oldBlock) {
          if (newBlock.isSeparator) {
            chars[index] = newBlock.mask;
          }
          else if (char === oldBlock.mask) {
            chars[index] = newBlock.mask;
          }
        }
      }
      context.value = chars.join('');
    }
  }
  onFocus(_context) {
  }
  onBlur(_context) {
  }
  onChange(context) {
    context.submit('change', this.onParseValue(context.value));
  }
  onNavigationDown(_context, _block, _index) {
  }
  onSelectAll(_context, _block, _index) {
  }
  onPaste(context, _block, _index) {
    const value = context.clipboardData || '';
    context.value = value;
    context.position.toEnd();
  }
  onBlockChange(context, block, index) {
    context.setChar();
    context.position.next();
    const nextBlock = this.blocks.list[index + 1];
    if (context.position.value === block.to && nextBlock && nextBlock.isSeparator) {
      context.position.next();
    }
  }
  onBackspaceDown(context, block, index) {
    context.position.previous();
    if (!block.isSeparator) {
      context.setChar(block.mask);
      const previousBlock = this.blocks.list[index - 1];
      if (context.position.value === block.from && previousBlock && previousBlock.isSeparator) {
        context.position.previous();
      }
    }
  }
  onDeleteDown(context, block, index) {
    context.setChar(block.mask);
    context.position.next();
    const nextBlock = this.blocks.list[index + 1];
    if (context.position.value === block.to && nextBlock && nextBlock.isSeparator) {
      context.position.next();
    }
  }
  onValueChanged(context) {
    const formattedValue = this.onFormatValue(context.newValue);
    const inputValue = context.focused && formattedValue === '' ? this.blocks.getPlaceholderMask() : formattedValue;
    context.value = inputValue;
    context.position.toEnd();
  }
  onParseValue(inputValue) {
    if (inputValue) {
      return inputValue.trim();
    }
    return inputValue || '';
  }
  onFormatValue(rawValue) {
    if (rawValue) {
      return rawValue.trim();
    }
    return rawValue || '';
  }
  fireI18nChange(context) {
    const oldBlocks = this.blocks.clone();
    const oldLocale = `${context.locale}`;
    this.locale = context.locale;
    this.blocks.list.forEach(block => block.onI18nChange(context.locale));
    this.onLocaleChange(context, oldLocale, oldBlocks);
  }
  fireValueChanged(context) {
    if (context.didValueChange) {
      this.onValueChanged(context);
    }
  }
  firePaste(context) {
    const index = this.blocks.getBlockIndexFromPosition(context.position.value);
    if (index !== undefined) {
      const currentBlock = this.blocks.list[index];
      this.onPaste(context, currentBlock, index);
      this.onChange(context);
    }
  }
  fireClick(context) {
    const maskPlaceholder = this.blocks.getPlaceholderMask();
    if (maskPlaceholder === context.value) {
      context.position.toStart();
    }
  }
  fireFocus(context) {
    if (context.target && context.isValueEmpty()) {
      this.resetInputValueWithMask(context);
    }
    this.onFocus(context);
  }
  fireBlur(context) {
    if (context.target) {
      if (this.isValueEmptyMask(context)) {
        this.emptyInputValue(context);
      }
      else {
        this.onBlur(context);
        context.submit('blur', this.onParseValue(context.value));
      }
    }
  }
  fireKeyDown(context) {
    const position = context.isBackspaceKey ? Math.max(0, context.position.value - 1) : context.position.value;
    const index = this.blocks.getBlockIndexFromPosition(position);
    if (position >= this.blocks.lastPosition && !context.isNavigationKey && !context.isSelectAllCommand) {
      context.preventDefault();
      context.stopPropagation();
      return;
    }
    if (index !== undefined && !context.position.isRangeSelection) {
      const currentBlock = this.blocks.list[index];
      if (context.isNavigationKey) {
        this.onNavigationDown(context, currentBlock, index);
      }
      else if (context.isSelectAllCommand) {
        this.onSelectAll(context, currentBlock, index);
      }
      else if (context.isCopyCommand) ;
      else if (context.isPasteCommand) ;
      else if (context.isBackspaceKey) {
        context.preventDefault();
        this.onBackspaceDown(context, currentBlock, index);
      }
      else if (context.isDeleteKey) {
        context.preventDefault();
        this.onDeleteDown(context, currentBlock, index);
      }
      else if (context.isWhiteSpaceKey) {
        context.preventDefault();
        const lastWrittenChar = context.value[context.position.value];
        if (lastWrittenChar === '.') {
          context.stopPropagation();
          const value = context.value;
          context.value = value.substring(0, context.position.value) + '_' + value.substring(context.position.value + 1);
        }
      }
      else if (currentBlock.verifyAllowedKeyHits(context.key)) {
        context.preventDefault();
        this.onBlockChange(context, currentBlock, index);
      }
      else if (this.blocks.verifyCallOfNextSeparator(context.key, index)) {
        context.preventDefault();
        const activeBlock = this.blocks.list[index];
        if (context.position.value > activeBlock.from) {
          const nextBlock = this.blocks.list[index + 1];
          const value = context.value;
          const blockValue = currentBlock.getValueOfTheBlock(value);
          const newBlockValue = currentBlock.format(blockValue);
          context.value = value.substring(0, currentBlock.from) + newBlockValue + value.substring(currentBlock.to);
          context.position.value = nextBlock.to;
        }
      }
      const newIndex = this.blocks.getBlockIndexFromPosition(context.position.value);
      if (newIndex && !context.isBackspaceKey) {
        const newFormattedValue = this.blocks.formatBlocks(context.value, newIndex);
        const position = context.position.value;
        context.value = newFormattedValue;
        context.position.value = position;
      }
    }
    else {
      context.preventDefault();
      if (context.isBackspaceKey || context.isDeleteKey) {
        this.resetInputValueWithMask(context);
      }
      else if (this.blocks.list[0].verifyAllowedKeyHits(context.key)) {
        this.onBlockChange(context, this.blocks.list[0], 0);
      }
    }
  }
  resetInputValueWithMask(context) {
    context.value = this.blocks.getPlaceholderMask();
    context.position.toStart();
  }
  isValueEmptyMask(context) {
    const placeholder = this.blocks.getPlaceholderMask();
    return placeholder === context.value;
  }
  emptyInputValue(context) {
    context.value = '';
    context.submit('blur', context.value);
  }
}

class DateMask extends AbstractMask {
  constructor() {
    super([
      new MaskBlock({
        from: 0,
        to: 2,
        allowedKeys: [...NUMBER_KEYS],
        format: (value, _locale, mask) => {
          if (Number.isNaN(parseInt(value, 10))) {
            return `${mask}${mask}`;
          }
          return value.padStart(2, '0');
        },
        mask: locale => {
          return this.dayMask[locale.split('-')[0]] || this.dayMask['de'];
        },
      }),
      new MaskBlock({ from: 2, to: 3, mask: locale => dateSeparator(locale), isSeparator: true }),
      new MaskBlock({
        from: 3,
        to: 5,
        allowedKeys: [...NUMBER_KEYS],
        format: (value, _locale, mask) => {
          if (Number.isNaN(parseInt(value, 10))) {
            return `${mask}${mask}`;
          }
          return value.padStart(2, '0');
        },
        mask: locale => this.monthMask[locale.split('-')[0]] || this.monthMask['de'],
      }),
      new MaskBlock({ from: 5, to: 6, mask: locale => dateSeparator(locale), isSeparator: true }),
      new MaskBlock({
        from: 6,
        to: 10,
        allowedKeys: [...NUMBER_KEYS],
        mask: locale => this.yearMask[locale.split('-')[0]] || this.yearMask['de'],
      }),
    ]);
    this.maxLength = 10;
    this.minLength = 10;
    this.dayMask = {
      de: 'T',
      en: 'D',
      fr: 'J',
      it: 'G',
      nl: 'D',
      es: 'D',
      pl: 'D',
      pt: 'D',
      sv: 'D',
      fi: 'M',
    };
    this.monthMask = {
      de: 'M',
      en: 'M',
      fr: 'M',
      it: 'M',
      nl: 'M',
      es: 'M',
      pl: 'M',
      pt: 'M',
      sv: 'M',
      fi: 'K',
    };
    this.yearMask = {
      de: 'J',
      en: 'Y',
      fr: 'A',
      it: 'A',
      nl: 'J',
      es: 'A',
      pl: 'R',
      pt: 'A',
      sv: 'Å',
      fi: 'V',
    };
  }
  onParseValue(inputValue) {
    if (inputValue) {
      const date = BalDate.fromAnyFormat(this.blocks.getRawValueWithoutMask(inputValue));
      if (date.isValid) {
        return date.toISODate();
      }
    }
    return '';
  }
  onFormatValue(isoDate) {
    if (isoDate) {
      const date = BalDate.fromISO(isoDate);
      if (date.isValid) {
        return date.toFormat();
      }
    }
    return '';
  }
  onPaste(context, _block, _index) {
    const value = context.clipboardData || '';
    const date = BalDate.fromAnyFormat(value);
    if (date.isValid) {
      context.value = date.toFormat();
      context.position.toEnd();
    }
  }
  onBlur(context) {
    const rawValue = this.blocks.getRawValueWithoutMaskByContext(context);
    const date = BalDate.fromAnyFormat(rawValue);
    if (date.isValid) {
      const formattedDate = date.toFormat();
      if (formattedDate !== context.value) {
        context.value = formattedDate;
      }
    }
  }
}

class MaskComponentAdapter {
  constructor(mask) {
    this.mask = mask;
  }
  get attributes() {
    return {
      inputMode: this.mask.inputMode,
      maxLength: this.mask.maxLength,
      minLength: this.mask.minLength,
      type: 'text',
      autoCapitalize: 'off',
      autoCorrect: 'off',
      spellcheck: false,
    };
  }
  bindComponent(component) {
    this.component = component;
  }
  bindComponentDidLoad() {
    if (this.component && this.component.nativeInput) {
      this.component.nativeInput.value = this.component.value || '';
    }
    this.bindValueChanged(this.component.value, undefined);
  }
  bindConfigChanged(config) {
    const { component, mask } = this;
    const context = new MaskLocaleContext({
      component,
      mask,
      event: {
        locale: `${config.language}-${config.region}`,
      },
    });
    this.mask.fireI18nChange(context);
    context.submit();
  }
  bindValueChanged(newValue, oldValue) {
    const { component, mask } = this;
    const context = new MaskValueChangedContext({
      component,
      mask,
      event: { newValue, oldValue },
    });
    this.mask.fireValueChanged(context);
    context.submit('blur');
  }
  bindKeyDown(event) {
    if (this.isComponentAccessible) {
      const { component, mask } = this;
      const context = new MaskKeyboardContext({ event, component, mask });
      this.mask.fireKeyDown(context);
      const isTabKey = event.key === 'Tab';
      context.submit(isTabKey ? 'tab' : 'input');
      component.balKeyPress.emit(event);
    }
  }
  bindFocus(event) {
    if (this.isComponentAccessible) {
      const { component, mask } = this;
      component.focused = true;
      const context = new MaskFocusContext({ event, component, mask });
      this.mask.fireFocus(context);
      context.submit();
      component.balFocus.emit(event);
    }
  }
  bindBlur(event) {
    if (this.isComponentAccessible) {
      const { component, mask } = this;
      component.focused = false;
      const context = new MaskFocusContext({ event, component, mask });
      this.mask.fireBlur(context);
      context.submit('blur');
      component.balBlur.emit(event);
    }
  }
  bindPaste(event) {
    if (this.isComponentAccessible) {
      const { component, mask } = this;
      const context = new MaskClipboardContext({ event, component, mask });
      this.mask.firePaste(context);
      context.submit();
    }
  }
  bindFormReset(event) {
    const formElement = event.target;
    if (formElement && formElement.contains(this.component.el)) {
      this.component.value = this.component.initialValue;
      this.component.inputValue = this.component.initialValue;
      clearTimeout(this.resetHandlerTimer);
      this.resetHandlerTimer = setTimeout(() => {
        if (this.component.nativeInput) {
          this.component.nativeInput.value = this.component.value || '';
        }
      });
    }
  }
  bindClick(event) {
    if (this.isComponentAccessible) {
      const { component, mask } = this;
      const context = new MaskMouseContext({ event, component, mask });
      this.mask.fireClick(context);
      context.submit();
    }
  }
  bindHostClick(event) {
    if (!this.isComponentAccessible) {
      event.preventDefault();
      event.stopPropagation();
    }
  }
  bindGlobalClick(event) {
    if (!this.isComponentAccessible) {
      if (event.target && event.target === this.component.el) {
        event.preventDefault();
        event.stopPropagation();
      }
    }
  }
  get isComponentAccessible() {
    return !this.component.disabled && !this.component.readonly;
  }
}

const balInputDateCss = ".bal-input-date{display:block;width:100%;-ms-flex:1;flex:1}.bal-input-date input:not(:-moz-placeholder-shown){letter-spacing:.4px}.bal-input-date input:not(:-ms-input-placeholder){letter-spacing:.4px}.bal-input-date input:not(:placeholder-shown){letter-spacing:.4px}";

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 InputDate = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.balKeyPress = createEvent(this, "balKeyPress", 7);
    this.balChange = createEvent(this, "balChange", 7);
    this.balInput = createEvent(this, "balInput", 7);
    this.balBlur = createEvent(this, "balBlur", 7);
    this.balFocus = createEvent(this, "balFocus", 7);
    this.inputId = `bal-i-date-${inputDateIds++}`;
    this.inheritedAttributes = {};
    this.maskAdapter = new MaskComponentAdapter(new DateMask());
    this.inputValue = this.value;
    this.initialValue = this.value || '';
    this.focused = false;
    this.isGrouped = false;
    this.ariaForm = defaultBalAriaForm;
    this.name = this.inputId;
    this.invalid = false;
    this.required = false;
    this.disabled = false;
    this.readonly = false;
    this.placeholder = undefined;
    this.clickable = false;
    this.autocomplete = 'off';
    this.hasIconRight = false;
    this.value = undefined;
  }
  createLogger(log) {
    this.log = log;
  }
  valueChanged(newValue, oldValue) {
    this.maskAdapter.bindValueChanged(newValue, oldValue);
  }
  connectedCallback() {
    this.maskAdapter.bindComponent(this);
    this.isGrouped = hasParent('bal-input-group', this.el);
  }
  componentDidLoad() {
    this.maskAdapter.bindComponentDidLoad();
  }
  componentWillRender() {
    this.inheritedAttributes = inheritAttributes(this.el, ['aria-label', 'tabindex', 'title']);
  }
  async configChanged(config) {
    this.maskAdapter.bindConfigChanged(config);
  }
  resetHandler(event) {
    this.maskAdapter.bindFormReset(event);
  }
  listenOnClick(event) {
    this.maskAdapter.bindGlobalClick(event);
  }
  async setFocus() {
    inputSetFocus(this);
  }
  async setBlur() {
    inputSetBlur(this);
  }
  getInputElement() {
    return Promise.resolve(this.nativeInput);
  }
  async setAriaForm(ariaForm) {
    this.ariaForm = Object.assign({}, ariaForm);
  }
  render() {
    const block = BEM.block('input-date');
    return (h(Host, { onClick: (event) => this.maskAdapter.bindHostClick(event), class: Object.assign({}, block.class()) }, h("input", Object.assign({ class: {
        'input': true,
        'is-disabled': this.disabled || this.readonly,
        'is-danger': this.invalid,
        'is-clickable': this.clickable && !(this.disabled || this.readonly),
        'bal-focusable': !this.disabled,
        'has-icon-right': this.hasIconRight,
      }, "data-testid": "bal-date-input", ref: el => (this.nativeInput = el), id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, required: this.required, disabled: this.disabled, readonly: this.readonly, autoComplete: this.autocomplete }, this.maskAdapter.attributes, this.inheritedAttributes, { placeholder: this.placeholder, value: this.inputValue, onKeyDown: event => this.maskAdapter.bindKeyDown(event), onClick: event => this.maskAdapter.bindClick(event), onFocus: event => this.maskAdapter.bindFocus(event), onBlur: event => this.maskAdapter.bindBlur(event), onPaste: event => this.maskAdapter.bindPaste(event) }))));
  }
  get el() { return getElement(this); }
  static get watchers() { return {
    "value": ["valueChanged"]
  }; }
};
__decorate([
  Logger('bal-input-date')
], InputDate.prototype, "createLogger", null);
__decorate([
  ListenToConfig()
], InputDate.prototype, "configChanged", null);
let inputDateIds = 0;
InputDate.style = balInputDateCss;

export { DateCalendar as bal_date_calendar, InputDate as bal_input_date };
