@golemui/gui-lit 1.0.3 → 1.1.0

package/date-picker.element-va_-LGZD.js

@@ -0,0 +1,312 @@
+import { InputWidgetAdapter as b, formContext as y, inputContext as v } from "@golemui/lit";
+import { LitElement as c, html as l, nothing as $ } from "lit";
+import { property as i, query as m, customElement as g } from "lit/decorators.js";
+import { classMap as M } from "lit/directives/class-map.js";
+import "./date-input-cJDkNnVw.js";
+import "./calendar-BuJgwvZx.js";
+import { G as f } from "./popup.controller-eUDxE6jD.js";
+import { d as D } from "./date-Bj9mI3GU.js";
+import { a as x, b as w, c as _ } from "./templates-Dk1jxLwS.js";
+import { consume as I, provide as C } from "@lit/context";
+import "rxjs";
+var E = Object.defineProperty, R = Object.getOwnPropertyDescriptor, a = (t, r, n, s) => {
+  for (var o = s > 1 ? void 0 : s ? R(r, n) : r, d = t.length - 1, p; d >= 0; d--)
+    (p = t[d]) && (o = (s ? p(r, n, o) : p(o)) || o);
+  return s && o && E(r, n, o), o;
+};
+let e = class extends c {
+  constructor() {
+    super(...arguments), this.uid = void 0, this.label = void 0, this.hint = void 0, this.icon = "", this.errors = [], this.showErrors = !0, this.touched = !1, this.required = !1, this.disabled = !1, this.readOnly = !1, this.localeId = void 0, this.value = void 0, this.prevMonthIcon = "", this.nextMonthIcon = "", this.prevMonthAriaLabel = void 0, this.nextMonthAriaLabel = void 0, this.dayFormat = void 0, this.weekdayFormat = void 0, this.monthFormat = void 0, this.minDate = void 0, this.maxDate = void 0, this.disabledRanges = void 0, this.numberOfMonths = void 0, this.invalidDateMessage = void 0, this.minDateMessage = void 0, this.maxDateMessage = void 0, this.disabledDateRangeMessage = void 0, this._popup = new f(this, {
+      getInteriorElements: () => [this._dateRef, this._calendarRef],
+      focusRestoreSelector: "gui-date input",
+      isDisabled: () => !!this.disabled,
+      clickIntent: (t) => t.closest(".gui-calendar__day-button") ? "ignore" : t.closest(".gui-date-input__part") || t.closest("gui-calendar") ? "open" : "toggle",
+      keyToggleMode: "toggle"
+    });
+  }
+  createRenderRoot() {
+    return this;
+  }
+  render() {
+    const t = x("datePicker", { icon: this.icon }), r = this._popup.open ? l`<gui-calendar
+          id="calendar-input"
+          .uid=${this.uid}
+          .hint=${this.hint}
+          ?touched=${this.touched}
+          ?required=${this.required}
+          ?disabled=${this.disabled}
+          ?readonly=${this.readOnly}
+          .value=${this.value}
+          .prevMonthIcon=${this.prevMonthIcon}
+          .nextMonthIcon=${this.nextMonthIcon}
+          .prevMonthAriaLabel=${this.prevMonthAriaLabel}
+          .nextMonthAriaLabel=${this.nextMonthAriaLabel}
+          .dayFormat=${this.dayFormat}
+          .weekdayFormat=${this.weekdayFormat}
+          .monthFormat=${this.monthFormat}
+          .minDate=${this.minDate}
+          .maxDate=${this.maxDate}
+          .disabledRanges=${this.disabledRanges}
+          .numberOfMonths=${this.numberOfMonths}
+          .localeId=${this.localeId}
+          @blur=${this.onCalendarBlur}
+          @change=${this.onCalendarChange}
+        ></gui-calendar>` : $;
+    return l`
+      ${w(this.uid ?? "", {
+      label: this.label,
+      hint: this.hint,
+      required: this.required
+    })}
+
+      <div
+        role="button"
+        tabindex="-1"
+        class="gui-widget"
+        aria-expanded=${this._popup.open}
+        @keyup=${this._popup.onAnchorKeyUp}
+        @keydown=${this._popup.onAnchorKeyDown}
+        @click=${this._popup.onAnchorClick}
+      >
+        <gui-date
+          id="date-input"
+          class=${M(t.widgetClasses)}
+          .uid=${this.uid}
+          .hint=${this.hint}
+          .showErrors=${!1}
+          .errors=${this.errors}
+          ?touched=${this.touched}
+          ?required=${this.required}
+          ?disabled=${this.disabled}
+          ?readonly=${this.readOnly}
+          .value=${this.value}
+          .icon=${this.icon}
+          .localeId=${this.localeId}
+          .invalidDateMessage=${this.invalidDateMessage}
+          @blur=${this.onDateBlur}
+          @focus=${this._popup.show}
+          @change=${this.onDateChange}
+        ></gui-date>
+        <span class="gui-date-picker__arrow"
+          ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256">
+            <path
+              d="M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z"
+            ></path></svg
+        ></span>
+
+        ${r}
+      </div>
+
+      ${this.showErrors ? _(this.uid ?? "", { errors: this.errors, touched: this.touched }) : ""}
+    `;
+  }
+  onDateChange(t) {
+    t.stopPropagation(), this.commitValue(t.detail.value);
+  }
+  onDateBlur() {
+    this.dispatchEvent(new CustomEvent("blur"));
+  }
+  onCalendarChange(t) {
+    t.stopPropagation(), this.commitValue(t.detail.value), this._popup.close();
+  }
+  commitValue(t) {
+    this.value = t ?? void 0;
+    const r = this.validateBounds(this.value);
+    this.dispatchEvent(
+      new CustomEvent("change", {
+        detail: { value: t ?? null },
+        bubbles: !0,
+        composed: !0
+      })
+    ), r && this.dispatchEvent(
+      new CustomEvent("inputError", {
+        detail: { message: r },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  validateBounds(t) {
+    return t ? D(t, this.minDate, this.maxDate, this.disabledRanges, {
+      minDateMessage: this.minDateMessage,
+      maxDateMessage: this.maxDateMessage,
+      disabledDateRangeMessage: this.disabledDateRangeMessage
+    }) : null;
+  }
+  onCalendarBlur() {
+    this._popup.close();
+  }
+};
+a([
+  i({ type: String })
+], e.prototype, "uid", 2);
+a([
+  i({ type: String })
+], e.prototype, "label", 2);
+a([
+  i({ type: String })
+], e.prototype, "hint", 2);
+a([
+  i({ type: String })
+], e.prototype, "icon", 2);
+a([
+  i({ type: Array })
+], e.prototype, "errors", 2);
+a([
+  i({ type: Boolean })
+], e.prototype, "showErrors", 2);
+a([
+  i({ type: Boolean })
+], e.prototype, "touched", 2);
+a([
+  i({ type: Boolean })
+], e.prototype, "required", 2);
+a([
+  i({ type: Boolean })
+], e.prototype, "disabled", 2);
+a([
+  i({ type: Boolean, attribute: "readonly" })
+], e.prototype, "readOnly", 2);
+a([
+  i({ type: String, attribute: "locale-id" })
+], e.prototype, "localeId", 2);
+a([
+  i({ type: String })
+], e.prototype, "value", 2);
+a([
+  i({ type: String, attribute: "prev-month-icon" })
+], e.prototype, "prevMonthIcon", 2);
+a([
+  i({ type: String, attribute: "next-month-icon" })
+], e.prototype, "nextMonthIcon", 2);
+a([
+  i({ type: String, attribute: "prev-month-aria-label" })
+], e.prototype, "prevMonthAriaLabel", 2);
+a([
+  i({ type: String, attribute: "next-month-aria-label" })
+], e.prototype, "nextMonthAriaLabel", 2);
+a([
+  i({ type: String, attribute: "day-format" })
+], e.prototype, "dayFormat", 2);
+a([
+  i({ type: String, attribute: "weekday-format" })
+], e.prototype, "weekdayFormat", 2);
+a([
+  i({ type: String, attribute: "month-format" })
+], e.prototype, "monthFormat", 2);
+a([
+  i({ type: String, attribute: "min-date" })
+], e.prototype, "minDate", 2);
+a([
+  i({ type: String, attribute: "max-date" })
+], e.prototype, "maxDate", 2);
+a([
+  i({ type: Array, attribute: "disabled-ranges" })
+], e.prototype, "disabledRanges", 2);
+a([
+  i({ type: Number, attribute: "number-of-months" })
+], e.prototype, "numberOfMonths", 2);
+a([
+  i({ type: String, attribute: "invalid-date-message" })
+], e.prototype, "invalidDateMessage", 2);
+a([
+  i({ type: String, attribute: "min-date-message" })
+], e.prototype, "minDateMessage", 2);
+a([
+  i({ type: String, attribute: "max-date-message" })
+], e.prototype, "maxDateMessage", 2);
+a([
+  i({ type: String, attribute: "disabled-date-range-message" })
+], e.prototype, "disabledDateRangeMessage", 2);
+a([
+  m("#date-input")
+], e.prototype, "_dateRef", 2);
+a([
+  m("#calendar-input")
+], e.prototype, "_calendarRef", 2);
+e = a([
+  g("gui-date-picker")
+], e);
+typeof customElements < "u" && !customElements.get("gui-date-picker") && customElements.define("gui-date-picker", e);
+var S = Object.defineProperty, k = Object.getOwnPropertyDescriptor, u = (t, r, n, s) => {
+  for (var o = s > 1 ? void 0 : s ? k(r, n) : r, d = t.length - 1, p; d >= 0; d--)
+    (p = t[d]) && (o = (s ? p(r, n, o) : p(o)) || o);
+  return s && o && S(r, n, o), o;
+};
+let h = class extends c {
+  constructor() {
+    super(...arguments), this.adapter = new b(), this.subscriptions = [];
+  }
+  createRenderRoot() {
+    return this;
+  }
+  updated(t) {
+    super.updated(t);
+    const r = this.adapter.templateData.size;
+    r ? this.style.flex = String(r) : this.style.removeProperty("flex");
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.classList.add("gui-date-picker", "gui-field"), this.adapter.context = this.formContext, this.adapter.init(this.widget), this.subscriptions.push(
+      this.adapter.templateDataChanged$.subscribe(() => this.requestUpdate())
+    );
+  }
+  render() {
+    super.render();
+    const t = this.adapter.templateData;
+    return l`
+      <gui-date-picker
+        .uid=${this.widget.uid}
+        .label=${t.label}
+        .hint=${t.hint}
+        .errors=${t.errors}
+        ?touched=${t.touched}
+        ?required=${t.validator?.required}
+        ?disabled=${t.disabled}
+        ?readonly=${t.readonly}
+        .value=${t.value}
+        .icon=${t.icon}
+        .localeId=${t.lang}
+        .prevMonthIcon=${t.prevMonthIcon}
+        .nextMonthIcon=${t.nextMonthIcon}
+        .prevMonthAriaLabel=${t.prevMonthAriaLabel}
+        .nextMonthAriaLabel=${t.nextMonthAriaLabel}
+        .dayFormat=${t.dayFormat}
+        .weekdayFormat=${t.weekdayFormat}
+        .monthFormat=${t.monthFormat}
+        .minDate=${t.minDate}
+        .maxDate=${t.maxDate}
+        .disabledRanges=${t.disabledRanges}
+        .numberOfMonths=${t.numberOfMonths}
+        .invalidDateMessage=${t.invalidDateMessage}
+        .minDateMessage=${t.minDateMessage}
+        .maxDateMessage=${t.maxDateMessage}
+        .disabledDateRangeMessage=${t.disabledDateRangeMessage}
+        @inputError=${this.onInputError}
+        @blur=${() => this.adapter.onBlur()}
+        @change=${this.valueChanged}
+      ></gui-date-picker>
+    `;
+  }
+  valueChanged(t) {
+    this.adapter.injectValidationIssues(null), this.adapter.valueChanged(t.detail.value);
+  }
+  onInputError(t) {
+    this.adapter.injectValidationIssues([t.detail.message]);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.adapter.destroy(), this.subscriptions.forEach((t) => t.unsubscribe());
+  }
+};
+u([
+  I({ context: y }),
+  i({ attribute: !1 })
+], h.prototype, "formContext", 2);
+u([
+  C({ context: v })
+], h.prototype, "adapter", 2);
+h = u([
+  g("gui-date-picker-input")
+], h);
+export {
+  h as DatePickerElement
+};

package/date-time-calendar-BzRfkLKU.js

@@ -0,0 +1,361 @@
+import { LitElement as g, nothing as c, html as d } from "lit";
+import { property as s, state as u, customElement as y } from "lit/decorators.js";
+import { classMap as b } from "lit/directives/class-map.js";
+import "./time-picker-bFJ63ky8.js";
+import { G as v } from "./templates-Dk1jxLwS.js";
+import { G as _, a as D, r as M, b as T, c as f, d as S, e as C } from "./day-status-0-hJHrI7.js";
+import { G as O } from "./focus-leave.controller-2gV0pQd5.js";
+import { p, f as I, h as x, t as m, j as $ } from "./date-Bj9mI3GU.js";
+import { y as w, p as L, z as P } from "./part-templates-Db871PS3.js";
+var G = Object.defineProperty, k = Object.getOwnPropertyDescriptor, a = (e, t, r, o) => {
+  for (var n = o > 1 ? void 0 : o ? k(t, r) : t, l = e.length - 1, h; l >= 0; l--)
+    (h = e[l]) && (n = (o ? h(t, r, n) : h(n)) || n);
+  return o && n && G(t, r, n), n;
+};
+let i = class extends g {
+  constructor() {
+    super(...arguments), this.uid = void 0, this.label = void 0, this.hint = void 0, this.localeId = void 0, this.errors = [], this.touched = void 0, this.required = !1, this.disabled = !1, this.readOnly = !1, this.prevMonthIcon = "", this.nextMonthIcon = "", this.prevMonthAriaLabel = "", this.nextMonthAriaLabel = "", this.dayFormat = "numeric", this.weekdayFormat = "narrow", this.monthFormat = "long", this.minDate = void 0, this.maxDate = void 0, this.disabledRanges = void 0, this.numberOfMonths = 1, this.value = void 0, this.hourFormat = void 0, this.minuteStep = void 0, this.minTime = void 0, this.maxTime = void 0, this.disabledTimeRanges = void 0, this.minTimeMessage = void 0, this.maxTimeMessage = void 0, this.disabledTimeRangeMessage = void 0, this.noAvailableTimesMessage = void 0, this.allowCustomTime = !1, this._selectedDate = void 0, this._selectedTime = void 0, this._timeGridOpen = !1, this._internalValueChange = !1, this._nav = new _(this, {
+      getMinDate: () => this.minDate,
+      getMaxDate: () => this.maxDate,
+      getNumberOfMonths: () => this.numberOfMonths,
+      getDisabledRanges: () => this.disabledRanges,
+      onYearSelectorToggled: () => this._keyboard.onYearGridToggled()
+    }), this.ariaController = new v(this, {
+      getTargets: () => this.querySelectorAll(".gui-calendar-input"),
+      getState: () => ({
+        uid: this.uid,
+        templateData: {
+          hint: this.hint,
+          errors: this.errors,
+          readonly: this.readOnly,
+          disabled: this.disabled,
+          touched: this.touched
+        }
+      })
+    }), this._keyboard = new D(this, {
+      canGoPrev: () => this._nav.canGoPrev(),
+      canGoNext: () => this._nav.canGoNext(),
+      goPrev: () => this._nav.prevMonth(),
+      goNext: () => this._nav.nextMonth(),
+      // Enter/Space can only fire on a focused (hence enabled, in-month) day
+      // button; the `disabled`/`readOnly` host guards stay inside `selectDate`.
+      onActivateDay: (e) => {
+        const t = p(e);
+        this.selectDate({
+          date: t,
+          dayLabel: x(this.localeId, t),
+          isCurrentMonth: !0,
+          isToday: I(t),
+          isSelected: !1,
+          isFocusable: !0,
+          isDisabled: !1
+        });
+      },
+      onSelectYear: (e) => this._nav.selectYear(e),
+      onCloseYearGrid: () => this._nav.closeYearSelector(),
+      isYearGridOpen: () => this._nav.yearSelectorOpen
+    }), this._focusLeave = new O(this, {
+      onLeave: () => {
+        this.dispatchEvent(new CustomEvent("blur", { bubbles: !0, composed: !0 }));
+      }
+    });
+  }
+  /** The disabled time ranges in effect on the selected day. */
+  get resolvedTimeRanges() {
+    return this._selectedDate ? w(this.disabledTimeRanges, this._selectedDate) : [];
+  }
+  get timePicker() {
+    return this.querySelector("gui-time-picker");
+  }
+  createRenderRoot() {
+    return this;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.classList.add("gui-field");
+  }
+  willUpdate(e) {
+    if (e.has("value")) {
+      if (this._internalValueChange) {
+        this._internalValueChange = !1;
+        return;
+      }
+      if (this.value) {
+        const t = L(this.value);
+        isNaN(t.getTime()) || (this._selectedDate = m(t), this._selectedTime = P(t), $(t, this._nav.currentDate, this.numberOfMonths ?? 1) || (this._nav.currentDate = t));
+      } else this._selectedTime && (this._selectedDate = void 0, this._selectedTime = void 0);
+    }
+  }
+  setValueInternal(e) {
+    this._internalValueChange = !0, this.value = e;
+  }
+  emitChange(e, t = !1) {
+    this.dispatchEvent(
+      new CustomEvent("change", {
+        detail: { value: e, commit: t },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  selectDate(e) {
+    if (!e.isCurrentMonth || e.isDisabled || this.disabled || this.readOnly) return;
+    const t = m(e.date);
+    t !== this._selectedDate && (this._selectedDate = t, this._selectedTime = void 0, this.value && (this.setValueInternal(void 0), this.emitChange(null)));
+  }
+  commitTime(e, t = !1) {
+    this._selectedDate && (this._selectedTime = e, this.setValueInternal(`${this._selectedDate}T${e}`), this.emitChange(this.value, t));
+  }
+  onTimePickerChange(e) {
+    e.stopPropagation();
+    const t = e.detail.value, r = e.detail.commit === !0;
+    if (!t) {
+      this._selectedTime = void 0, this.value && (this.setValueInternal(void 0), this.emitChange(null));
+      return;
+    }
+    this.commitTime(t, r);
+  }
+  onListToggle(e) {
+    e.stopPropagation();
+    const { open: t } = e.detail;
+    if (t && this.readOnly) {
+      this.timePicker?.closeList();
+      return;
+    }
+    this._timeGridOpen = t, t && (this._nav.yearSelectorOpen = !1);
+  }
+  /** Closes the embedded time picker before flipping the year grid. */
+  toggleYearSelector() {
+    this.timePicker?.closeList(), this._nav.toggleYearSelector();
+  }
+  render() {
+    return M({
+      uid: this.uid,
+      label: this.label,
+      hint: this.hint,
+      errors: this.errors,
+      touched: this.touched,
+      required: this.required,
+      disabled: this.disabled,
+      numberOfMonths: this.numberOfMonths,
+      prevMonthIcon: this.prevMonthIcon,
+      nextMonthIcon: this.nextMonthIcon,
+      prevMonthAriaLabel: this.prevMonthAriaLabel,
+      nextMonthAriaLabel: this.nextMonthAriaLabel,
+      canGoPrev: this._nav.canGoPrev(),
+      canGoNext: this._nav.canGoNext(),
+      onPrevMonthClick: this._keyboard.onPrevMonthClick,
+      onNextMonthClick: this._keyboard.onNextMonthClick,
+      onFocusOut: this._focusLeave.onFocusOut,
+      renderAboveCalendar: () => c,
+      renderMonthPanel: (e) => T({
+        currentDate: this._nav.currentDate,
+        offset: e,
+        localeId: this.localeId,
+        monthFormat: this.monthFormat,
+        yearSelectorOpen: this._nav.yearSelectorOpen,
+        onToggleYearSelector: () => this.toggleYearSelector(),
+        renderBelowHeader: (t) => this.renderBelowHeader(t),
+        renderPanelBody: (t) => this.renderPanelBody(t)
+      })
+    });
+  }
+  /** The embedded time-picker row under the first panel's header. */
+  renderBelowHeader(e) {
+    return e !== 0 ? c : d`
+      <div class="gui-calendar__time-input-row">
+        <gui-time-picker
+          class="gui-time-picker gui-field"
+          .uid=${this.uid ? `${this.uid}-time` : void 0}
+          .showErrors=${!1}
+          ?required=${this.required}
+          ?disabled=${this.disabled || !this._selectedDate}
+          ?readonly=${this.readOnly}
+          .allowCustomTime=${this.allowCustomTime}
+          .value=${this._selectedTime}
+          .localeId=${this.localeId}
+          .hourFormat=${this.hourFormat}
+          .minuteStep=${this.minuteStep}
+          .minTime=${this.minTime}
+          .maxTime=${this.maxTime}
+          .disabledRanges=${this.resolvedTimeRanges}
+          .columns=${4}
+          .minTimeMessage=${this.minTimeMessage}
+          .maxTimeMessage=${this.maxTimeMessage}
+          .disabledRangeMessage=${this.disabledTimeRangeMessage}
+          .noAvailableTimesMessage=${this.noAvailableTimesMessage}
+          @change=${this.onTimePickerChange}
+          @listtoggle=${this.onListToggle}
+        ></gui-time-picker>
+      </div>
+    `;
+  }
+  renderPanelBody(e) {
+    return this._timeGridOpen && !this._nav.yearSelectorOpen && e === 0 ? d`` : f({
+      offset: e,
+      yearSelectorOpen: this._nav.yearSelectorOpen,
+      years: this._nav.yearList,
+      currentYear: this._nav.currentDate.getFullYear(),
+      onSelectYear: (t) => this._keyboard.selectYear(t),
+      onYearKeydown: this._keyboard.handleYearKeydown,
+      localeId: this.localeId,
+      getDays: (t) => this.getDaysInMonth(t),
+      renderDay: (t) => this.renderDay(t)
+    });
+  }
+  renderDay(e) {
+    const t = {
+      "gui-calendar__day-button": !0,
+      today: e.isToday,
+      selected: e.isSelected,
+      disabled: e.isDisabled,
+      "other-month": !e.isCurrentMonth
+    };
+    return d`
+      <button
+        type="button"
+        role="gridcell"
+        class=${b(t)}
+        tabindex=${e.isFocusable ? 0 : -1}
+        ?disabled=${!e.isCurrentMonth || e.isDisabled}
+        data-date=${m(e.date)}
+        @click=${() => this.selectDate(e)}
+        @keydown=${(r) => this._keyboard.handleDayKeydown(r)}
+        aria-selected=${e.isSelected}
+      >
+        ${e.dayLabel}
+      </button>
+    `;
+  }
+  getDaysInMonth(e) {
+    const t = this._selectedDate;
+    return S({
+      currentDate: this._nav.currentDate,
+      offset: e,
+      localeId: this.localeId,
+      numberOfMonths: this.numberOfMonths ?? 1,
+      isDisabled: (r) => this.isDisabled(r),
+      toDay: (r) => {
+        const o = C(r.date, { selectedISO: t }).isSelected;
+        return {
+          date: r.date,
+          dayLabel: r.dayLabel,
+          isCurrentMonth: r.isCurrentMonth,
+          isToday: r.isToday,
+          isDisabled: r.isDisabled,
+          isSelected: o,
+          isFocusable: (o || r.isToday) && r.isCurrentMonth
+        };
+      },
+      focusFallbackDates: [t ? p(t) : /* @__PURE__ */ new Date()]
+    });
+  }
+  isDisabled(e) {
+    return this._nav.isDisabled(e);
+  }
+};
+a([
+  s({ type: String })
+], i.prototype, "uid", 2);
+a([
+  s({ type: String })
+], i.prototype, "label", 2);
+a([
+  s({ type: String })
+], i.prototype, "hint", 2);
+a([
+  s({ type: String, attribute: "locale-id" })
+], i.prototype, "localeId", 2);
+a([
+  s({ type: Array })
+], i.prototype, "errors", 2);
+a([
+  s({ type: Boolean })
+], i.prototype, "touched", 2);
+a([
+  s({ type: Boolean })
+], i.prototype, "required", 2);
+a([
+  s({ type: Boolean })
+], i.prototype, "disabled", 2);
+a([
+  s({ type: Boolean, attribute: "readonly" })
+], i.prototype, "readOnly", 2);
+a([
+  s({ type: String, attribute: "prev-month-icon" })
+], i.prototype, "prevMonthIcon", 2);
+a([
+  s({ type: String, attribute: "next-month-icon" })
+], i.prototype, "nextMonthIcon", 2);
+a([
+  s({ type: String, attribute: "prev-month-aria-label" })
+], i.prototype, "prevMonthAriaLabel", 2);
+a([
+  s({ type: String, attribute: "next-month-aria-label" })
+], i.prototype, "nextMonthAriaLabel", 2);
+a([
+  s({ type: String })
+], i.prototype, "dayFormat", 2);
+a([
+  s({ type: String })
+], i.prototype, "weekdayFormat", 2);
+a([
+  s({ type: String })
+], i.prototype, "monthFormat", 2);
+a([
+  s({ type: String })
+], i.prototype, "minDate", 2);
+a([
+  s({ type: String })
+], i.prototype, "maxDate", 2);
+a([
+  s({ type: Array })
+], i.prototype, "disabledRanges", 2);
+a([
+  s({ type: Number })
+], i.prototype, "numberOfMonths", 2);
+a([
+  s({ type: String })
+], i.prototype, "value", 2);
+a([
+  s({ type: String, attribute: "hour-format" })
+], i.prototype, "hourFormat", 2);
+a([
+  s({ type: Number, attribute: "minute-step" })
+], i.prototype, "minuteStep", 2);
+a([
+  s({ type: String, attribute: "min-time" })
+], i.prototype, "minTime", 2);
+a([
+  s({ type: String, attribute: "max-time" })
+], i.prototype, "maxTime", 2);
+a([
+  s({ type: Array, attribute: "disabled-time-ranges" })
+], i.prototype, "disabledTimeRanges", 2);
+a([
+  s({ type: String, attribute: "min-time-message" })
+], i.prototype, "minTimeMessage", 2);
+a([
+  s({ type: String, attribute: "max-time-message" })
+], i.prototype, "maxTimeMessage", 2);
+a([
+  s({ type: String, attribute: "disabled-time-range-message" })
+], i.prototype, "disabledTimeRangeMessage", 2);
+a([
+  s({ type: String, attribute: "no-available-times-message" })
+], i.prototype, "noAvailableTimesMessage", 2);
+a([
+  s({ type: Boolean, attribute: "allow-custom-time" })
+], i.prototype, "allowCustomTime", 2);
+a([
+  u()
+], i.prototype, "_selectedDate", 2);
+a([
+  u()
+], i.prototype, "_selectedTime", 2);
+a([
+  u()
+], i.prototype, "_timeGridOpen", 2);
+i = a([
+  y("gui-date-time-calendar")
+], i);
+typeof customElements < "u" && !customElements.get("gui-date-time-calendar") && customElements.define("gui-date-time-calendar", i);