@siemens/ix-docs 4.3.0 → 4.4.0

package/build/static/demo/v2/preview/html/assets/ix-col_4.entry-DkMVsNLK.js

@@ -1,545 +0,0 @@
-import { r as registerInstance, f as forceUpdate, h, H as Host, c as createEvent, F as Fragment, g as getElement } from "./global-X2k8gwUL.js";
-import { m as matchBreakpoint } from "./breakpoints-D_Hmobxf-DBbixPq4.js";
-import { w as iconChevronRightSmall, D as iconChevronLeftSmall, O as iconSingleCheck } from "./index-8HpPmDK_-DinFJk0z.js";
-import { D as DateTime, I as Info } from "./datetime-bDicGJUN-GV0o9Ayg.js";
-import { O as OnListener } from "./listener-DAJkOQte-DGNnuSYS.js";
-import { m as makeRef } from "./make-ref-bcj7UEIC-BX_OSyqv.js";
-const colCss = ":host{position:relative;flex-basis:0;flex-grow:1;width:100%;max-width:100%;min-height:1px;padding:calc(var(--ix-layout-grid-gutter) * 0.5)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}";
-const Col = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  onResize() {
-    forceUpdate(this);
-  }
-  getSize(breakpoint) {
-    if (breakpoint === "") {
-      return this.size;
-    }
-    if (breakpoint === "sm") {
-      return this.sizeSm;
-    }
-    if (breakpoint === "md") {
-      return this.sizeMd;
-    }
-    if (breakpoint === "lg") {
-      return this.sizeLg;
-    }
-  }
-  getColumnSize() {
-    let size;
-    Col.Breakpoints.forEach((breakpoint) => {
-      const isMediaQueryActive = breakpoint !== "" ? matchBreakpoint(breakpoint) : true;
-      if (!isMediaQueryActive) {
-        return;
-      }
-      const currentSize = this.getSize(breakpoint);
-      if (currentSize) {
-        size = currentSize;
-      }
-    });
-    return size;
-  }
-  getColumnSizeStyling() {
-    const size = this.getColumnSize();
-    if (!size) {
-      return;
-    }
-    if (size === "auto") {
-      return {
-        flex: "0 0 auto",
-        width: "auto",
-        "max-width": "auto"
-      };
-    }
-    const colSize = `calc(calc(${size} / var(--ix-layout-grid-columns)) * 100%)`;
-    return {
-      flex: `0 0 ${colSize}`,
-      width: `${colSize}`,
-      "max-width": `${colSize}`
-    };
-  }
-  render() {
-    return h(Host, { key: "552bf87dd4905b2cfc67dbda7c33e1edf89a9cf8", style: Object.assign({}, this.getColumnSizeStyling()) }, h("slot", { key: "293331e4b2de069f550f0d47e1525228e49fc159" }));
-  }
-};
-Col.Breakpoints = ["", "sm", "md", "lg"];
-Col.style = colCss;
-const datePickerCss = ":host{display:block;position:relative;max-width:21rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .header{display:flex;align-items:center;justify-content:space-between}:host .disabled-item{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .selector{flex-basis:100%;display:flex;align-items:center;justify-content:center;padding:0 1rem}:host .selector .dropdown{color:var(--theme-menu-item--color);font-size:14px;line-height:20px}:host .selector .capitalize{text-transform:capitalize}:host .selector .month-dropdown-item{margin-left:4px;margin-right:4px}:host .selector .month-dropdown-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .selector .arrowYear{display:flex;position:relative;padding:0.75rem 2rem;align-items:center;cursor:pointer}:host .selector .arrowYear:hover{background-color:var(--theme-select-list-item--background--hover)}:host .selector .arrowYear.selected{background-color:var(--theme-select-list-item--background--selected)}:host .selector .arrowYear .arrowPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 6px)}:host .selector .arrowYear .checkPosition{position:absolute;left:calc(1rem - 6px);top:calc(50% - 8px)}:host .selector .arrowYear .monthMargin{margin-left:10px}:host .wrapper{display:flex}:host .wrapper .overflow{overflow-y:scroll;max-height:250px}:host .grid{display:grid;grid-template-columns:repeat(7, 40px);grid-template-rows:repeat(7, 40px);align-items:center;justify-items:center;justify-content:center;color:var(--theme-datepicker-today--color)}:host .grid--show-week-numbers{grid-template-columns:24px repeat(7, 40px)}:host .grid .calendar-item{position:relative;display:flex;justify-content:center;align-items:center;background-color:var(--theme-datepicker-day--background);border:1px solid var(--theme-datepicker-day--background);width:40px;height:40px;cursor:pointer}:host .grid .calendar-item:focus-visible{outline:1px solid var(--theme-color-focus-bdr);box-shadow:inset 0 0 0 1px var(--theme-color-inv-contrast-text);background-color:var(--theme-datepicker-day--background--selected);border:inset 1px solid var(--theme-datepicker-day--border-color--selected);color:var(--theme-datepicker-day--color--selected);font-size:14px;line-height:20px;letter-spacing:0}:host .grid .calendar-item.today{border:1px solid var(--theme-datepicker-today--border-color)}:host .grid .calendar-item.today:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item.today:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.today.selected{box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.today.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.today.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);border:1px solid var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.today.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range);border:1px solid var(--theme-datepicker-today--border-color--range);box-shadow:inset 0 0 0 1px white}:host .grid .calendar-item.today.range:hover{background-color:var(--theme-datepicker-day--background--range-hover);border:1px solid var(--theme-datepicker-today--border-color--range-hover)}:host .grid .calendar-item.today.range:active{background-color:var(--theme-datepicker-day--background--range-active);border:1px solid var(--theme-datepicker-today--border-color--range-active)}:host .grid .calendar-item.today.range.disabled{background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled);border:1px solid var(--theme-datepicker-today--border-color--range-disabled)}:host .grid .calendar-item.today.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled);cursor:default}:host .grid .calendar-item:hover{background-color:var(--theme-datepicker-day--background--hover)}:host .grid .calendar-item:active{background-color:var(--theme-datepicker-day--background--active)}:host .grid .calendar-item.selected{background-color:var(--theme-datepicker-day--background--selected);color:var(--theme-datepicker-day--color--selected);border:1px solid var(--theme-datepicker-day--background--selected);font-weight:var(--theme-font-weight-bold)}:host .grid .calendar-item.selected:hover{background-color:var(--theme-datepicker-day--background--selected-hover)}:host .grid .calendar-item.selected:active{background-color:var(--theme-datepicker-day--background--selected-active)}:host .grid .calendar-item.selected.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--selected-disabled);color:var(--theme-datepicker-day--color--selected-disabled)}:host .grid .calendar-item.range{background-color:var(--theme-datepicker-day--background--range);color:var(--theme-datepicker-day--color--range)}:host .grid .calendar-item.range:hover{background-color:var(--theme-datepicker-day--background--range-hover)}:host .grid .calendar-item.range:active{background-color:var(--theme-datepicker-day--background--range-active)}:host .grid .calendar-item.range.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--range-disabled);color:var(--theme-datepicker-day--color--range-disabled)}:host .grid .calendar-item.disabled{pointer-events:none;background-color:var(--theme-datepicker-day--background--disabled);color:var(--theme-datepicker-day--color--disabled)}:host .grid .calendar-item.week-day{color:var(--theme-datepicker-weekday--color);font-size:var(--theme-ms-0);line-height:143%;border:none;background:none;cursor:initial}:host .grid .calendar-item.week-day .overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .grid .calendar-item.empty-day{border:none;background:none;cursor:initial}:host .grid .calendar-item.week-number{font-size:10px;line-height:14px;color:var(--theme-datepicker-weekday--color);border:none;background:none;cursor:initial;width:1.5rem}:host .button{display:flex;justify-content:flex-end;margin-top:1rem}:host .hidden{display:none}";
-var __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 DatePicker = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.dateChange = createEvent(this, "dateChange", 7);
-    this.dateRangeChange = createEvent(this, "dateRangeChange", 7);
-    this.dateSelect = createEvent(this, "dateSelect", 7);
-    this.format = "yyyy/LL/dd";
-    this.singleSelection = false;
-    this.corners = "rounded";
-    this.minDate = "";
-    this.maxDate = "";
-    this.i18nDone = "Done";
-    this.weekStartIndex = 0;
-    this.showWeekNumbers = false;
-    this.embedded = false;
-    this.today = DateTime.now().toISO();
-    this.enableTopLayer = false;
-    this.selectedYear = 0;
-    this.tempYear = 0;
-    this.startYear = 0;
-    this.endYear = 0;
-    this.selectedMonth = 0;
-    this.tempMonth = 0;
-    this.dropdownButtonRef = makeRef();
-    this.yearContainerRef = makeRef();
-    this.firstMonthRef = makeRef();
-    this.focusedDay = 1;
-    this.isDayFocus = false;
-    this.monthChangedFromFocus = false;
-    this.DAYS_IN_WEEK = 7;
-    this.calendar = [];
-  }
-  watchFromPropHandler(newValue) {
-    if (!newValue) {
-      this.currFromDate = void 0;
-      return;
-    }
-    const date = this.parseDateString(newValue);
-    if (date) {
-      this.currFromDate = date;
-      this.updateSelectedYearMonth(date);
-    }
-  }
-  watchToPropHandler(newValue) {
-    if (!newValue) {
-      this.currToDate = void 0;
-      return;
-    }
-    const date = this.parseDateString(newValue);
-    if (date) {
-      this.currToDate = date;
-      this.updateSelectedYearMonth(date);
-    }
-  }
-  onLocaleChange() {
-    this.setTranslations();
-  }
-  /**
-   * Get the currently selected date or range. The object returned contains `from` and `to` properties.
-   * The property strings are formatted according to the `format` property and not affected by the `locale` property.
-   * The locale applied is always `en-US`.
-   */
-  async getCurrentDate() {
-    var _a, _b, _c, _d;
-    const _from = ((_a = this.currFromDate) === null || _a === void 0 ? void 0 : _a.isValid) ? (_b = this.currFromDate) === null || _b === void 0 ? void 0 : _b.toFormat(this.format) : void 0;
-    const _to = ((_c = this.currToDate) === null || _c === void 0 ? void 0 : _c.isValid) ? (_d = this.currToDate) === null || _d === void 0 ? void 0 : _d.toFormat(this.format) : void 0;
-    if (!this.singleSelection) {
-      return {
-        from: _from,
-        to: _to
-      };
-    }
-    return {
-      from: _from,
-      to: void 0
-    };
-  }
-  handleKeyUp(event) {
-    if (!this.isDayFocus) {
-      return;
-    }
-    let _focusedDay = this.focusedDay;
-    switch (event.key) {
-      case "ArrowLeft":
-        _focusedDay--;
-        break;
-      case "ArrowRight":
-        _focusedDay++;
-        break;
-      case "ArrowUp":
-        _focusedDay = _focusedDay - 7;
-        break;
-      case "ArrowDown":
-        _focusedDay = _focusedDay + 7;
-        break;
-      default:
-        return;
-    }
-    if (_focusedDay > this.getDaysInCurrentMonth()) {
-      _focusedDay = _focusedDay - this.getDaysInCurrentMonth();
-      this.changeToAdjacentMonth(1);
-      this.monthChangedFromFocus = true;
-    } else if (_focusedDay < 1) {
-      this.changeToAdjacentMonth(-1);
-      _focusedDay = _focusedDay + this.getDaysInCurrentMonth();
-      this.monthChangedFromFocus = true;
-    }
-    this.focusedDay = _focusedDay;
-  }
-  getDaysInCurrentMonth() {
-    return DateTime.utc(this.selectedYear, this.selectedMonth + 1).daysInMonth || 0;
-  }
-  getDateTimeNow() {
-    return DateTime.fromISO(this.today);
-  }
-  parseDateString(dateString) {
-    const date = DateTime.fromFormat(dateString, this.format);
-    if (!date.isValid) {
-      console.error(date.invalidExplanation);
-      return void 0;
-    }
-    return date;
-  }
-  updateSelectedYearMonth(date) {
-    this.selectedYear = date.year;
-    this.selectedMonth = date.month - 1;
-  }
-  onDayBlur() {
-    this.isDayFocus = false;
-  }
-  onDayFocus() {
-    this.isDayFocus = true;
-  }
-  componentWillLoad() {
-    var _a, _b, _c, _d;
-    this.setTranslations();
-    this.currFromDate = this.from ? DateTime.fromFormat(this.from, this.format) : void 0;
-    this.currToDate = this.to ? DateTime.fromFormat(this.to, this.format) : void 0;
-    const year = (_b = (_a = this.currFromDate) === null || _a === void 0 ? void 0 : _a.year) !== null && _b !== void 0 ? _b : this.getDateTimeNow().year;
-    this.startYear = year - 5;
-    this.endYear = year + 5;
-    this.selectedMonth = ((_d = (_c = this.currFromDate) === null || _c === void 0 ? void 0 : _c.month) !== null && _d !== void 0 ? _d : this.getDateTimeNow().month) - 1;
-    this.selectedYear = year;
-    this.tempMonth = this.selectedMonth;
-    this.tempYear = this.selectedYear;
-  }
-  componentWillRender() {
-    this.calculateCalendar();
-  }
-  componentDidRender() {
-    if (!this.monthChangedFromFocus && !this.isDayFocus) {
-      return;
-    }
-    const dayElem = this.hostElement.shadowRoot.querySelector(`[id=day-cell-${this.focusedDay}]`);
-    dayElem.focus();
-  }
-  setTranslations() {
-    this.dayNames = this.rotateWeekDayNames(Info.weekdays("long", {
-      locale: this.locale
-    }), this.weekStartIndex);
-    this.monthNames = Info.months("long", {
-      locale: this.locale
-    });
-  }
-  /**
-   * Rotate the WeekdayNames array.
-   * Based on the position that should be the new 0-index.
-   */
-  rotateWeekDayNames(weekdays, index) {
-    const clone = [...weekdays];
-    if (index === 0) {
-      return clone;
-    }
-    index = -index;
-    const len = weekdays.length;
-    clone.push(...clone.splice(0, (-index % len + len) % len));
-    return clone;
-  }
-  async onDone() {
-    const date = await this.getCurrentDate();
-    this.dateSelect.emit(date);
-  }
-  calculateCalendar() {
-    const calendar = [];
-    const month = DateTime.utc(this.selectedYear, this.selectedMonth + 1);
-    const monthStart = month.startOf("month");
-    const monthEnd = month.endOf("month");
-    let startWeek = monthStart.weekNumber;
-    let endWeek = monthEnd.weekNumber;
-    let monthStartWeekDayIndex = monthStart.weekday - 1;
-    let monthEndWeekDayIndex = monthEnd.weekday - 1;
-    if (this.weekStartIndex !== 0) {
-      const weekdays = Info.weekdays();
-      const monthStartWeekDayName = weekdays[monthStart.weekday];
-      monthStartWeekDayIndex = this.dayNames.findIndex((d) => d === monthStartWeekDayName);
-      const monthEndWeekDayName = weekdays[monthEnd.weekday];
-      monthEndWeekDayIndex = this.dayNames.findIndex((d) => d === monthEndWeekDayName);
-    }
-    let correctLastWeek = false;
-    if (endWeek === 1) {
-      endWeek = monthEnd.weeksInWeekYear + 1;
-      correctLastWeek = true;
-    }
-    let correctFirstWeek = false;
-    if (startWeek === monthStart.weeksInWeekYear) {
-      startWeek = 1;
-      endWeek++;
-      correctFirstWeek = true;
-    }
-    let currDayNumber = 1;
-    for (let weekIndex = startWeek; weekIndex <= endWeek && currDayNumber <= 31; weekIndex++) {
-      const daysArr = [];
-      for (let j = 0; j < this.DAYS_IN_WEEK && currDayNumber <= 31; j++) {
-        if (weekIndex === startWeek && j < monthStartWeekDayIndex || weekIndex === endWeek && j > monthEndWeekDayIndex) {
-          daysArr.push(void 0);
-        } else {
-          daysArr.push(currDayNumber++);
-        }
-      }
-      if (correctFirstWeek || correctLastWeek) {
-        if (weekIndex === 1) {
-          calendar.push({
-            weekNumber: monthStart.weeksInWeekYear,
-            dayNumbers: daysArr
-          });
-        } else if (weekIndex === monthEnd.weekNumber) {
-          calendar.push({
-            weekNumber: 1,
-            dayNumbers: daysArr
-          });
-        } else {
-          calendar.push({
-            weekNumber: weekIndex - 1,
-            dayNumbers: daysArr
-          });
-        }
-        continue;
-      }
-      calendar.push({
-        weekNumber: weekIndex,
-        dayNumbers: daysArr
-      });
-    }
-    this.calendar = calendar;
-  }
-  selectTempYear(event, year) {
-    event === null || event === void 0 ? void 0 : event.stopPropagation();
-    this.tempYear = year;
-  }
-  focusMonth() {
-    var _a;
-    (_a = this.firstMonthRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-  }
-  infiniteScrollYears() {
-    const yearContainer = this.yearContainerRef.current;
-    if (!yearContainer) {
-      return;
-    }
-    const scroll = yearContainer.scrollTop;
-    const maxScroll = yearContainer.scrollHeight;
-    const atTop = scroll === 0;
-    const atBottom = Math.round(scroll + yearContainer.offsetHeight) >= maxScroll;
-    const limit = 200;
-    if (this.endYear - this.startYear > limit)
-      return;
-    if (atTop) {
-      const first = yearContainer.firstElementChild;
-      this.startYear -= 5;
-      yearContainer.scrollTo(0, first.offsetTop);
-      return;
-    }
-    if (atBottom) {
-      const last = yearContainer.lastElementChild;
-      this.endYear += 5;
-      yearContainer.scrollTo(0, last.offsetTop);
-    }
-  }
-  selectMonth(month) {
-    this.selectedMonth = month;
-    this.selectedYear = this.tempYear;
-    this.tempMonth = month;
-    const dropdown = this.hostElement.shadowRoot.querySelector("ix-dropdown");
-    if (dropdown) {
-      dropdown.show = false;
-    }
-  }
-  changeToAdjacentMonth(number) {
-    if (this.selectedMonth + number < 0) {
-      this.selectedYear--;
-      this.selectedMonth = 11;
-    } else if (this.selectedMonth + number > 11) {
-      this.selectedYear++;
-      this.selectedMonth = 0;
-    } else {
-      this.selectedMonth += number;
-    }
-  }
-  selectDay(selectedDay, target) {
-    if (target.classList.contains("disabled")) {
-      return;
-    }
-    const date = DateTime.fromJSDate(new Date(this.selectedYear, this.selectedMonth, selectedDay));
-    if (this.singleSelection || this.currFromDate === void 0) {
-      this.currFromDate = date;
-      this.onDateChange();
-      return;
-    }
-    if (this.currToDate !== void 0) {
-      this.currFromDate = date;
-      this.currToDate = void 0;
-      this.onDateChange();
-      return;
-    }
-    if (date < this.currFromDate) {
-      this.currToDate = this.currFromDate;
-      this.currFromDate = date;
-      this.onDateChange();
-      return;
-    }
-    this.currToDate = date;
-    this.onDateChange();
-  }
-  onDateChange() {
-    this.getCurrentDate().then((date) => {
-      this.dateChange.emit(date);
-      if (!this.singleSelection) {
-        this.dateRangeChange.emit(date);
-      }
-    });
-  }
-  getDayClasses(day) {
-    var _a, _b, _c;
-    const todayObj = this.getDateTimeNow();
-    const selectedDayObj = DateTime.fromJSDate(new Date(this.selectedYear, this.selectedMonth, day));
-    return {
-      "calendar-item": true,
-      "empty-day": day === void 0,
-      today: todayObj.hasSame(selectedDayObj, "day"),
-      selected: !!(((_a = this.currFromDate) === null || _a === void 0 ? void 0 : _a.hasSame(selectedDayObj, "day")) || ((_b = this.currToDate) === null || _b === void 0 ? void 0 : _b.hasSame(selectedDayObj, "day"))),
-      range: !!(this.currFromDate && selectedDayObj.startOf("day") > this.currFromDate.startOf("day") && this.currToDate !== void 0 && selectedDayObj.startOf("day") < ((_c = this.currToDate) === null || _c === void 0 ? void 0 : _c.startOf("day"))),
-      disabled: !this.isWithinMinMaxDate(selectedDayObj)
-    };
-  }
-  isWithinMinMaxYear(year) {
-    const minDateYear = this.minDate ? DateTime.fromFormat(this.minDate, this.format).year : void 0;
-    const maxDateYear = this.maxDate ? DateTime.fromFormat(this.maxDate, this.format).year : void 0;
-    const isBefore = minDateYear ? year < minDateYear : false;
-    const isAfter = maxDateYear ? year > maxDateYear : false;
-    return !isBefore && !isAfter;
-  }
-  isWithinMinMaxMonth(month) {
-    const minDateObj = this.minDate ? DateTime.fromFormat(this.minDate, this.format) : void 0;
-    const maxDateObj = this.maxDate ? DateTime.fromFormat(this.maxDate, this.format) : void 0;
-    const minDateMonth = minDateObj === null || minDateObj === void 0 ? void 0 : minDateObj.month;
-    const maxDateMonth = maxDateObj === null || maxDateObj === void 0 ? void 0 : maxDateObj.month;
-    const isBefore = minDateMonth ? this.tempYear === minDateObj.year && month < minDateMonth : false;
-    const isAfter = maxDateMonth ? this.tempYear === maxDateObj.year && month > maxDateMonth : false;
-    return !isBefore && !isAfter;
-  }
-  isWithinMinMaxDate(date) {
-    const _minDate = this.minDate ? DateTime.fromFormat(this.minDate, this.format) : void 0;
-    const _maxDate = this.maxDate ? DateTime.fromFormat(this.maxDate, this.format) : void 0;
-    const isBefore = _minDate ? date.startOf("day") < _minDate.startOf("day") : false;
-    const isAfter = _maxDate ? date.startOf("day") > _maxDate.startOf("day") : false;
-    return !isBefore && !isAfter;
-  }
-  renderYears() {
-    const rows = [];
-    for (let year = this.startYear; year <= this.endYear; year++) {
-      rows.push(h("div", { key: year, class: {
-        arrowYear: true,
-        "month-dropdown-item": true,
-        "disabled-item": !this.isWithinMinMaxYear(year)
-      }, onClick: (event) => this.selectTempYear(event, year), onKeyUp: (event) => {
-        if (event.key === "Enter") {
-          this.tempYear = year;
-          this.focusMonth();
-        }
-      }, tabIndex: 0 }, h("ix-icon", { class: {
-        hidden: this.tempYear !== year,
-        arrowPosition: true
-      }, name: iconChevronRightSmall, size: "12" }), h("div", { style: { "min-width": "max-content" } }, `${year}`)));
-    }
-    return rows;
-  }
-  render() {
-    return h(Host, { key: "3a9fa36ed98d2dc14c9d0bf76f6fcdbc1595c8b2" }, h("ix-date-time-card", { key: "d6da48a85d0c5cb1a6044c16d064782a3beed0c8", corners: this.corners, embedded: this.embedded }, h("div", { key: "56d86df8ea65f1bcdd988451ddbf276a62a8e52a", class: "header", slot: "header" }, h("ix-icon-button", { key: "1899225180b17d1d5d7aa50599f6af7b2c92a4df", onClick: () => this.changeToAdjacentMonth(-1), icon: iconChevronLeftSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelPreviousMonthButton }), h("div", { key: "cf4f3cf8d11665cabc959aad474aad833aa703f6", class: "selector" }, h("ix-button", { key: "f1aa5c3e87ee65509298de13646a1fd1aaf62c72", variant: "tertiary", ref: this.dropdownButtonRef, "data-testid": "year-month-button" }, h("span", { key: "8a1888092a6360c64b57f71eb52ace9ee1ed03d3", class: "capitalize" }, this.monthNames[this.selectedMonth], " ", this.selectedYear)), h("ix-dropdown", { key: "0922f29fe071cea744094e9553f38b35f113149c", "data-testid": "year-month-dropdown", class: "dropdown", trigger: this.dropdownButtonRef.waitForCurrent(), ignoreRelatedSubmenu: true, placement: "bottom-start", enableTopLayer: this.enableTopLayer }, h("div", { key: "e0f0df699dbafb2dbc5f00e03c5d5dc19e73f529", class: "wrapper" }, h("div", { key: "f34845aec3de4ebf6dc07e869b57c57087ad6fb5", "data-testid": "year-container", class: "overflow", onScroll: () => this.infiniteScrollYears(), ref: this.yearContainerRef }, this.renderYears()), h("div", { key: "519b8269d8f3a429fc1f5fdb8f2661f1cafa03b5", class: "overflow", "data-testid": "month-container" }, this.monthNames.map((month, index) => h("div", { key: month, ref: (ref) => {
-      if (month === this.monthNames[0]) {
-        this.firstMonthRef(ref);
-      }
-    }, class: {
-      arrowYear: true,
-      "month-dropdown-item": true,
-      selected: this.tempYear === this.selectedYear && this.tempMonth === index,
-      "disabled-item": !this.isWithinMinMaxMonth(index)
-    }, onClick: () => this.selectMonth(index), onKeyUp: (event) => event.key === "Enter" && this.selectMonth(index), tabIndex: 0 }, h("ix-icon", { class: {
-      hidden: this.tempYear !== this.selectedYear || this.tempMonth !== index,
-      checkPosition: true
-    }, name: iconSingleCheck, size: "16" }), h("div", null, h("span", { class: "capitalize monthMargin" }, `${month} ${this.tempYear}`)))))))), h("ix-icon-button", { key: "0468474f772750fe7f96af5eb6129eeee5e52ee6", onClick: () => this.changeToAdjacentMonth(1), icon: iconChevronRightSmall, variant: "tertiary", class: "arrows", "aria-label": this.ariaLabelNextMonthButton })), h("div", { key: "3b788560f65530ebb8faeb2c7e88d24b7f29bb08", class: {
-      grid: true,
-      "grid--show-week-numbers": this.showWeekNumbers
-    } }, this.showWeekNumbers && h("div", { key: "431517e6490f2fc715dad94b9d7719836df9514a", class: "calendar-item week-day" }), this.dayNames.map((name) => h("div", { key: name, class: "calendar-item week-day" }, h("div", { class: "overflow" }, name.slice(0, 3)))), this.calendar.map((week) => {
-      return h(Fragment, null, this.showWeekNumbers && h("div", { class: "calendar-item week-number" }, week.weekNumber), week.dayNumbers.map((day) => {
-        return day ? h("div", { key: day, id: `day-cell-${day}`, "date-calender-day": true, class: this.getDayClasses(day), onClick: (e) => {
-          const target = e.currentTarget;
-          this.selectDay(day, target);
-        }, onKeyUp: (e) => {
-          const target = e.currentTarget;
-          if (e.key === "Enter") {
-            this.selectDay(day, target);
-          }
-        }, tabIndex: day === this.focusedDay ? 0 : -1, onFocus: () => this.onDayFocus(), onBlur: () => this.onDayBlur(), "aria-label": `${this.selectedMonth}: ${day}` }, day) : h("div", null);
-      }));
-    })), h("div", { key: "d27a5261af7b95549a0d8956f2c267aea0d504fa", class: {
-      button: true,
-      hidden: this.singleSelection || this.embedded
-    } }, h("ix-button", { key: "629a9d41ba40bbc277ea41d1ec35f814949fe42a", onClick: () => this.onDone() }, this.i18nDone))));
-  }
-  get hostElement() {
-    return getElement(this);
-  }
-  static get watchers() {
-    return {
-      "from": ["watchFromPropHandler"],
-      "to": ["watchToPropHandler"],
-      "locale": ["onLocaleChange"]
-    };
-  }
-};
-__decorate([
-  OnListener("keydown")
-], DatePicker.prototype, "handleKeyUp", null);
-DatePicker.style = datePickerCss;
-const layoutGridCss = ":host{--ix-layout-grid-gutter:24px;display:block;flex:1 1 0%;width:100%;padding-left:calc(var(--ix-layout-grid-gutter) * 0.5);padding-right:calc(var(--ix-layout-grid-gutter) * 0.5)}:host(.no-margin){padding-left:0;padding-right:0}";
-const LayoutGrid = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.noMargin = false;
-    this.gap = "24";
-    this.columns = 12;
-  }
-  render() {
-    return h(Host, { key: "7ca75d3fb578d30d3b8e3d5d4455123ee7344456", class: {
-      "no-margin": this.noMargin
-    }, style: {
-      "--ix-layout-grid-columns": `${this.columns}`,
-      "--ix-layout-grid-gutter": `${this.gap}px`
-    } }, h("slot", { key: "566e2bf1294f8780e4aedb8e2874bd2f216d3712" }));
-  }
-};
-LayoutGrid.style = layoutGridCss;
-const rowCss = ":host{display:flex;flex-wrap:wrap}:host(:not(:first-of-type)){margin-block-start:var(--ix-layout-grid-row-margin, 0)}";
-const Row = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  render() {
-    return h(Host, { key: "edd5d38945ebc6f0b97cc6cf3ae0a9230f7dc2f2" }, h("slot", { key: "d2556a5cc69da0d7fc5f0779e8453761d45a1de0" }));
-  }
-};
-Row.style = rowCss;
-export {
-  Col as ix_col,
-  DatePicker as ix_date_picker,
-  LayoutGrid as ix_layout_grid,
-  Row as ix_row
-};

package/build/static/demo/v2/preview/html/assets/ix-content-header.entry-wMimIy5w.js

@@ -1,25 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from "./global-X2k8gwUL.js";
-import { n as iconArrowLeft } from "./index-8HpPmDK_-DinFJk0z.js";
-const contentHeaderCss = ":host{display:flex;flex-direction:row;align-items:flex-start;padding:0}:host .titleGroup{display:flex;flex-direction:column;flex:1 1 0;min-width:0;white-space:nowrap;margin-right:0.5rem}:host .titleGroup .titleOverflow{overflow:hidden;text-overflow:ellipsis}:host .titleGroup .headerTitleRow{display:flex}:host .titleGroup .headerTitleRow .headerSlot{display:inline-flex;margin-left:0.5rem}:host .titleGroup .secondary{padding:0.25rem 0}:host .subtitle{margin-top:-0.125rem}:host .backButton{margin-right:0.5rem}:host .buttons{flex:0 0 auto}";
-const ContentHeader = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.backButtonClick = createEvent(this, "backButtonClick", 7);
-    this.variant = "primary";
-    this.headerSubtitle = void 0;
-    this.hasBackButton = false;
-  }
-  render() {
-    return h(Host, { key: "b422be3706aac399ed76b4c491d61e2da8561b24" }, this.hasBackButton ? h("ix-icon-button", { class: "backButton", variant: "tertiary", icon: iconArrowLeft, onClick: () => this.backButtonClick.emit() }) : null, h("div", { key: "7606ba97f834f591a78fc2cca74bdaf3b3a09feb", class: "titleGroup" }, h("div", { key: "df174e297a1b2075bcab0182a80f626162d1c319", class: "headerTitleRow" }, h("ix-typography", { key: "d8ab10dc801306dafe0f3e6e39ed93e0fa162ca1", format: this.variant === "secondary" ? "h4" : "h3", class: {
-      secondary: this.variant === "secondary",
-      titleOverflow: true
-    } }, this.headerTitle), h("div", { key: "e24d6b450426931aaead3732fa20161bc5aab4e2", class: "headerSlot" }, h("slot", { key: "e9a471492f2693fc6abe546d1febbc06834fef1c", name: "header" }))), !!this.headerSubtitle && h("ix-typography", { key: "5fdb5ebce68a3aae09df3299093bca156468933c", format: "h6", "text-color": "soft", class: {
-      subtitle: this.variant === "secondary",
-      titleOverflow: true
-    }, title: this.headerSubtitle }, this.headerSubtitle)), h("div", { key: "6648f93246d2e8d79cc2d3e7eae65009d578632c", class: "buttons" }, h("slot", { key: "1c3ee8084521a9a799e3b2444b1edc0c1cee5066" })));
-  }
-};
-ContentHeader.style = contentHeaderCss;
-export {
-  ContentHeader as ix_content_header
-};

package/build/static/demo/v2/preview/html/assets/ix-content.entry-tHhXOGtl.js

@@ -1,27 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from "./global-X2k8gwUL.js";
-import { h as hasSlottedElements } from "./shadow-dom-i60z1FJC-Cx4XiL3F.js";
-const contentCss = ":host{display:flex;flex-direction:column;position:relative;padding:1.5rem 2rem 0.25rem 2rem;width:100%;height:100%;overflow:hidden}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .content{flex-grow:1;overflow:auto;position:relative}:host .content-header.slotted{margin-bottom:1rem}";
-const Content = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.isContentHeaderSlotted = false;
-  }
-  get contentHeaderSlot() {
-    return this.hostElement.shadowRoot.querySelector(".content-header slot");
-  }
-  render() {
-    return h(Host, { key: "2ca4af3b088beab36b86cb3431f1d1b59fcf8756" }, h("div", { key: "04f73ba733dc7fbf57ecf6fdc0afc1fec8249b8e", class: {
-      "content-header": true,
-      slotted: this.isContentHeaderSlotted
-    } }, h("slot", { key: "962e83643e1ebcd86384cae1e7a3632b6f47554e", name: "header", onSlotchange: () => {
-      this.isContentHeaderSlotted = hasSlottedElements(this.contentHeaderSlot);
-    } })), h("div", { key: "4315ac1e71743ba30c7b8f592997c662eed392b4", class: "content" }, h("slot", { key: "c1f31f8e283bcc55011b9f2d5746d9b7c10988da" })));
-  }
-  get hostElement() {
-    return getElement(this);
-  }
-};
-Content.style = contentCss;
-export {
-  Content as ix_content
-};

package/build/static/demo/v2/preview/html/assets/ix-css-grid-item.entry-CFFDsyrd.js

@@ -1,16 +0,0 @@
-import { r as registerInstance, h, H as Host } from "./global-X2k8gwUL.js";
-const cssGridItemCss = ":host{display:block;position:relative}:host ::slotted(*){height:100%;width:100%}";
-const CssGridItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-  }
-  render() {
-    const style = {};
-    style["grid-area"] = this.itemName;
-    return h(Host, { key: "0f7a1001629ec09b7e6f44470b733f3d1d691bcb", style }, h("slot", { key: "1fce4a329cea68181bc52e60d155d6c6b7bb41bc" }));
-  }
-};
-CssGridItem.style = cssGridItemCss;
-export {
-  CssGridItem as ix_css_grid_item
-};