@golemui/gui-lit 1.0.2 → 1.1.0

package/time-list-Czo48bZm.js

@@ -0,0 +1,217 @@
+import { LitElement as v, html as p, nothing as b } from "lit";
+import { property as l, customElement as _ } from "lit/decorators.js";
+import { classMap as S } from "lit/directives/class-map.js";
+import { g as O, l as x, n as f, c as T } from "./focus-leave.controller-2gV0pQd5.js";
+import { e as $, A as w, l as I, s as E, N as R } from "./part-templates-Db871PS3.js";
+var A = Object.defineProperty, C = Object.getOwnPropertyDescriptor, r = (t, e, i, o) => {
+  for (var n = o > 1 ? void 0 : o ? C(e, i) : e, a = t.length - 1, u; a >= 0; a--)
+    (u = t[a]) && (n = (o ? u(e, i, n) : u(n)) || n);
+  return o && n && A(e, i, n), n;
+};
+let s = class extends v {
+  constructor() {
+    super(...arguments), this.uid = void 0, this.value = void 0, this.label = void 0, this.minTime = void 0, this.maxTime = void 0, this.minuteStep = void 0, this.disabledRanges = void 0, this.localeId = void 0, this.hourFormat = void 0, this.disabled = !1, this.readOnly = !1, this.height = void 0, this.itemHeight = void 0, this.columns = void 0, this.noAvailableTimesMessage = void 0;
+  }
+  createRenderRoot() {
+    return this;
+  }
+  get effectiveColumns() {
+    return this.columns || 1;
+  }
+  get timeOptions() {
+    const t = $(this.localeId, this.hourFormat), e = [
+      this.localeId,
+      t,
+      this.minTime,
+      this.maxTime,
+      this.minuteStep,
+      JSON.stringify(this.disabledRanges ?? null)
+    ].join("|");
+    return this._optionsCache?.key !== e && (this._optionsCache = {
+      key: e,
+      options: w({
+        minTime: this.minTime,
+        maxTime: this.maxTime,
+        minuteStep: this.minuteStep,
+        disabledRanges: this.disabledRanges
+      }).map((i) => ({
+        ...i,
+        template: I(i.value, this.localeId, t)
+      }))
+    }), this._optionsCache.options;
+  }
+  isSelected(t) {
+    return this.value != null && E(t.value, this.value) === 0;
+  }
+  get rovingIndex() {
+    const t = this.timeOptions, e = t.findIndex((i) => this.isSelected(i) && !i.disabled);
+    return e !== -1 ? e : t.findIndex((i) => !i.disabled);
+  }
+  scrollToSelectedValue() {
+    const t = this.querySelector(".gui-time-list__viewport"), e = this.querySelector(".gui-time-list__option--selected") ?? this.querySelector(".gui-time-list__option");
+    if (t && e) {
+      const i = t.getBoundingClientRect(), o = e.getBoundingClientRect(), n = t.scrollTop + (o.top - i.top) - i.height / 2 + o.height / 2;
+      t.scrollTop = Math.max(0, n);
+    }
+  }
+  focusSelectedOption() {
+    this.querySelector('.gui-time-list__option[tabindex="0"]')?.focus();
+  }
+  selectOption(t, e) {
+    e.stopPropagation(), !(this.disabled || this.readOnly || t.disabled) && (this.value = t.value, this.dispatchEvent(
+      new CustomEvent("change", {
+        detail: { value: t.value },
+        bubbles: !0,
+        composed: !0
+      })
+    ));
+  }
+  onKeyDown(t) {
+    const e = t.target;
+    if (!e.classList.contains("gui-time-list__option")) return;
+    const i = Array.from(this.querySelectorAll(".gui-time-list__option")), o = i.indexOf(e), n = this.effectiveColumns, a = window.getComputedStyle(this).direction === "rtl", u = (m) => this.timeOptions[m].disabled;
+    if (t.key === "Enter" || t.key === " ") {
+      t.preventDefault();
+      const m = this.timeOptions[o];
+      m && this.selectOption(m, t);
+      return;
+    }
+    const d = O(t.key, {
+      columns: n,
+      isRTL: a,
+      pageSize: x(this.height, this.itemHeight, n)
+    });
+    if (d.kind === "none") return;
+    if (t.preventDefault(), d.kind === "edge") {
+      const m = d.edge === "first" ? 0 : i.length - 1, y = f(
+        m,
+        d.edge === "first" ? 1 : -1,
+        this.timeOptions.length,
+        u,
+        { includeStart: !0, outOfBounds: "none" }
+      );
+      y !== -1 && i[y].focus();
+      return;
+    }
+    const c = d.delta, g = Math.min(Math.max(o + c, 0), i.length - 1);
+    if (g === o) return;
+    const h = f(
+      g,
+      c > 0 ? 1 : -1,
+      this.timeOptions.length,
+      u,
+      { includeStart: !0, outOfBounds: "none" }
+    );
+    h !== -1 && h !== o && i[h].focus();
+  }
+  renderOption(t, e, i) {
+    const o = this.isSelected(t);
+    return p`
+      <button
+        type="button"
+        role=${i}
+        class=${S({
+      "gui-time-list__option": !0,
+      "gui-time-list__option--selected": o
+    })}
+        tabindex=${e === this.rovingIndex ? 0 : -1}
+        ?disabled=${t.disabled || this.disabled}
+        data-value=${t.value}
+        aria-selected=${o}
+        aria-disabled=${t.disabled || this.disabled ? "true" : "false"}
+        @click=${(a) => this.selectOption(t, a)}
+      >
+        ${t.template}
+      </button>
+    `;
+  }
+  render() {
+    const t = this.timeOptions;
+    if (t.length === 0)
+      return p`<div class="gui-time-list__empty">
+        ${this.noAvailableTimesMessage ?? R}
+      </div>`;
+    const e = this.effectiveColumns, i = `--gui-time-list-height: ${this.height ?? 300}px; --gui-time-list-item-height: ${this.itemHeight || 40}px; --gui-time-list-columns: ${e};`;
+    if (e === 1)
+      return p`
+        <div
+          class="gui-time-list__viewport"
+          role="listbox"
+          style=${i}
+          aria-label=${this.label ?? b}
+          @keydown=${this.onKeyDown}
+        >
+          ${t.map((n, a) => this.renderOption(n, a, "option"))}
+        </div>
+      `;
+    const o = T(t, e);
+    return p`
+      <div
+        class="gui-time-list__viewport gui-time-list__viewport--grid"
+        role="grid"
+        style=${i}
+        aria-label=${this.label ?? b}
+        @keydown=${this.onKeyDown}
+      >
+        ${o.map(
+      (n, a) => p`
+            <div role="row" class="gui-time-list__row">
+              ${n.map(
+        (u, d) => this.renderOption(u, a * e + d, "gridcell")
+      )}
+            </div>
+          `
+    )}
+      </div>
+    `;
+  }
+};
+r([
+  l({ type: String })
+], s.prototype, "uid", 2);
+r([
+  l({ type: String })
+], s.prototype, "value", 2);
+r([
+  l({ type: String })
+], s.prototype, "label", 2);
+r([
+  l({ type: String, attribute: "min-time" })
+], s.prototype, "minTime", 2);
+r([
+  l({ type: String, attribute: "max-time" })
+], s.prototype, "maxTime", 2);
+r([
+  l({ type: Number, attribute: "minute-step" })
+], s.prototype, "minuteStep", 2);
+r([
+  l({ type: Array, attribute: "disabled-ranges" })
+], s.prototype, "disabledRanges", 2);
+r([
+  l({ type: String, attribute: "locale-id" })
+], s.prototype, "localeId", 2);
+r([
+  l({ type: String, attribute: "hour-format" })
+], s.prototype, "hourFormat", 2);
+r([
+  l({ type: Boolean })
+], s.prototype, "disabled", 2);
+r([
+  l({ type: Boolean, attribute: "readonly" })
+], s.prototype, "readOnly", 2);
+r([
+  l({ type: Number })
+], s.prototype, "height", 2);
+r([
+  l({ type: Number, attribute: "item-height" })
+], s.prototype, "itemHeight", 2);
+r([
+  l({ type: Number })
+], s.prototype, "columns", 2);
+r([
+  l({ type: String, attribute: "no-available-times-message" })
+], s.prototype, "noAvailableTimesMessage", 2);
+s = r([
+  _("gui-time-list")
+], s);
+typeof customElements < "u" && !customElements.get("gui-time-list") && customElements.define("gui-time-list", s);

package/time-picker-bFJ63ky8.js

@@ -0,0 +1,261 @@
+import { LitElement as u, html as m } from "lit";
+import { property as s, query as p, customElement as d } from "lit/decorators.js";
+import { classMap as g } from "lit/directives/class-map.js";
+import "./time-input-BOhlBGJZ.js";
+import "./time-list-Czo48bZm.js";
+import { G as c } from "./popup.controller-eUDxE6jD.js";
+import { h as y, A as b } from "./part-templates-Db871PS3.js";
+import { a as v, b as f, c as T } from "./templates-Dk1jxLwS.js";
+import { b as $ } from "./date-Bj9mI3GU.js";
+var w = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, i = (e, o, a, r) => {
+  for (var l = r > 1 ? void 0 : r ? _(o, a) : o, n = e.length - 1, h; n >= 0; n--)
+    (h = e[n]) && (l = (r ? h(o, a, l) : h(l)) || l);
+  return r && l && w(o, a, l), l;
+};
+let t = class extends u {
+  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.hourFormat = void 0, this.minuteStep = void 0, this.minTime = void 0, this.maxTime = void 0, this.disabledRanges = void 0, this.allowCustomTime = !1, this.height = void 0, this.itemHeight = void 0, this.columns = void 0, this.minTimeMessage = void 0, this.maxTimeMessage = void 0, this.disabledRangeMessage = void 0, this.noAvailableTimesMessage = void 0, this._popup = new c(this, {
+      getInteriorElements: () => [this._timeRef, this._listRef],
+      focusRestoreSelector: "gui-time input, gui-time button",
+      isDisabled: () => !!this.disabled,
+      clickIntent: (e) => e.closest(".gui-time-list__option") ? "ignore" : e.closest("gui-time") || e.closest("gui-time-list") ? "open" : "toggle",
+      keyToggleMode: "openClose",
+      onOpenChanged: (e) => {
+        this.dispatchListToggle(e), e && this.updateComplete.then(() => this._listRef?.scrollToSelectedValue());
+      }
+    }), this.onKeyDown = (e) => {
+      if (this._popup.onAnchorKeyDown(e)) return;
+      if (e.key === "Enter" && e.target.closest("gui-time")) {
+        this._popup.open && this._popup.close(), this.commitValue(this.value, !0);
+        return;
+      }
+      this.allowCustomTime || this.readOnly || this.disabled || e.key !== "ArrowDown" && e.key !== "ArrowUp" || !e.target.closest("gui-time") || (e.preventDefault(), this.selectAdjacentOption(e.key === "ArrowDown" ? 1 : -1));
+    };
+  }
+  createRenderRoot() {
+    return this;
+  }
+  updated(e) {
+    e.has("value") && this._listRef && this._listRef.value !== this.value && (this._listRef.value = this.value);
+  }
+  render() {
+    const e = v("timePicker", { icon: this.icon });
+    return m`
+      ${f(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.onKeyDown}
+        @click=${this._popup.onAnchorClick}
+      >
+        <gui-time
+          id="time-input"
+          class=${g(e.widgetClasses)}
+          .uid=${this.uid}
+          .hint=${this.hint}
+          .showErrors=${!1}
+          .errors=${this.errors}
+          ?touched=${this.touched}
+          ?required=${this.required}
+          ?disabled=${this.disabled}
+          ?readonly=${this.readOnly || !this.allowCustomTime}
+          .value=${this.value}
+          .icon=${this.icon}
+          .localeId=${this.localeId}
+          .hourFormat=${this.hourFormat}
+          .minuteStep=${this.minuteStep}
+          .minTime=${this.minTime}
+          .maxTime=${this.maxTime}
+          .minTimeMessage=${this.minTimeMessage}
+          .maxTimeMessage=${this.maxTimeMessage}
+          @blur=${this.onTimeBlur}
+          @focus=${this._popup.show}
+          @change=${this.onTimeChange}
+        ></gui-time>
+        <span class="gui-time-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>
+
+        <gui-time-list
+          .uid=${this.uid}
+          .value=${this.value}
+          .label=${this.label}
+          .localeId=${this.localeId}
+          .hourFormat=${this.hourFormat}
+          .minuteStep=${this.minuteStep}
+          .minTime=${this.minTime}
+          .maxTime=${this.maxTime}
+          .disabledRanges=${this.disabledRanges}
+          .height=${this.height}
+          .itemHeight=${this.itemHeight}
+          .columns=${this.columns}
+          .noAvailableTimesMessage=${this.noAvailableTimesMessage}
+          ?readonly=${this.readOnly}
+          ?hidden=${!this._popup.open}
+          @change=${this.onListChange}
+        ></gui-time-list>
+      </div>
+
+      ${this.showErrors ? T(this.uid ?? "", { errors: this.errors, touched: this.touched }) : ""}
+    `;
+  }
+  onTimeChange(e) {
+    e.stopPropagation(), this.commitValue(e.detail.value);
+  }
+  onTimeBlur() {
+    this.dispatchEvent(new CustomEvent("blur"));
+  }
+  onListChange(e) {
+    e.stopPropagation(), this.commitValue(e.detail.value, !0), this._popup.restoreFocusToInput(), this._popup.close();
+  }
+  /**
+   * @param commit Marks the change as a deliberate final selection (list pick
+   *   or Enter) as opposed to continuous field editing (typing/arrows). A host
+   *   popover (the date-time calendar) closes only on a committed change, so
+   *   editing the time in place doesn't dismiss it mid-entry.
+   */
+  commitValue(e, o = !1) {
+    this.value = e ?? void 0;
+    const a = this.validateBounds(this.value);
+    this.dispatchEvent(
+      new CustomEvent("change", {
+        detail: { value: e ?? null, commit: o },
+        bubbles: !0,
+        composed: !0
+      })
+    ), a && this.dispatchEvent(
+      new CustomEvent("inputError", {
+        detail: { message: a },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  validateBounds(e) {
+    return e && y(e, this.disabledRanges) ? this.disabledRangeMessage ?? $ : null;
+  }
+  selectAdjacentOption(e) {
+    const o = b({
+      minTime: this.minTime,
+      maxTime: this.maxTime,
+      minuteStep: this.minuteStep,
+      disabledRanges: this.disabledRanges
+    });
+    if (!o.length) return;
+    const a = o.findIndex((l) => l.value === this.value);
+    let r = a === -1 ? e === 1 ? 0 : o.length - 1 : a + e;
+    for (; r >= 0 && r < o.length && o[r].disabled; )
+      r += e;
+    r < 0 || r >= o.length || (this.commitValue(o[r].value), this._popup.show(), this.updateComplete.then(() => this._listRef?.scrollToSelectedValue()));
+  }
+  /** Public close hook kept for the date-time calendars, which close the
+   * embedded time-picker's list imperatively. */
+  closeList() {
+    this._popup.close();
+  }
+  dispatchListToggle(e) {
+    this.dispatchEvent(
+      new CustomEvent("listtoggle", {
+        detail: { open: e },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+};
+i([
+  s({ type: String })
+], t.prototype, "uid", 2);
+i([
+  s({ type: String })
+], t.prototype, "label", 2);
+i([
+  s({ type: String })
+], t.prototype, "hint", 2);
+i([
+  s({ type: String })
+], t.prototype, "icon", 2);
+i([
+  s({ type: Array })
+], t.prototype, "errors", 2);
+i([
+  s({ type: Boolean })
+], t.prototype, "showErrors", 2);
+i([
+  s({ type: Boolean })
+], t.prototype, "touched", 2);
+i([
+  s({ type: Boolean })
+], t.prototype, "required", 2);
+i([
+  s({ type: Boolean })
+], t.prototype, "disabled", 2);
+i([
+  s({ type: Boolean, attribute: "readonly" })
+], t.prototype, "readOnly", 2);
+i([
+  s({ type: String, attribute: "locale-id" })
+], t.prototype, "localeId", 2);
+i([
+  s({ type: String })
+], t.prototype, "value", 2);
+i([
+  s({ type: String, attribute: "hour-format" })
+], t.prototype, "hourFormat", 2);
+i([
+  s({ type: Number, attribute: "minute-step" })
+], t.prototype, "minuteStep", 2);
+i([
+  s({ type: String, attribute: "min-time" })
+], t.prototype, "minTime", 2);
+i([
+  s({ type: String, attribute: "max-time" })
+], t.prototype, "maxTime", 2);
+i([
+  s({ type: Array, attribute: "disabled-ranges" })
+], t.prototype, "disabledRanges", 2);
+i([
+  s({ type: Boolean, attribute: "allow-custom-time" })
+], t.prototype, "allowCustomTime", 2);
+i([
+  s({ type: Number })
+], t.prototype, "height", 2);
+i([
+  s({ type: Number, attribute: "item-height" })
+], t.prototype, "itemHeight", 2);
+i([
+  s({ type: Number })
+], t.prototype, "columns", 2);
+i([
+  s({ type: String, attribute: "min-time-message" })
+], t.prototype, "minTimeMessage", 2);
+i([
+  s({ type: String, attribute: "max-time-message" })
+], t.prototype, "maxTimeMessage", 2);
+i([
+  s({ type: String, attribute: "disabled-range-message" })
+], t.prototype, "disabledRangeMessage", 2);
+i([
+  s({ type: String, attribute: "no-available-times-message" })
+], t.prototype, "noAvailableTimesMessage", 2);
+i([
+  p("gui-time")
+], t.prototype, "_timeRef", 2);
+i([
+  p("gui-time-list")
+], t.prototype, "_listRef", 2);
+t = i([
+  d("gui-time-picker")
+], t);
+typeof customElements < "u" && !customElements.get("gui-time-picker") && customElements.define("gui-time-picker", t);

package/time-picker.element-CYZVXgRS.js

@@ -0,0 +1,85 @@
+import { InputWidgetAdapter as d, formContext as p, inputContext as m } from "@golemui/lit";
+import "./time-picker-bFJ63ky8.js";
+import { consume as u, provide as c } from "@lit/context";
+import { LitElement as h, html as g } from "lit";
+import { property as $, customElement as b } from "lit/decorators.js";
+import "rxjs";
+var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, l = (e, t, r, a) => {
+  for (var i = a > 1 ? void 0 : a ? v(t, r) : t, n = e.length - 1, o; n >= 0; n--)
+    (o = e[n]) && (i = (a ? o(t, r, i) : o(i)) || i);
+  return a && i && f(t, r, i), i;
+};
+let s = class extends h {
+  constructor() {
+    super(...arguments), this.adapter = new d(), this.subscriptions = [];
+  }
+  createRenderRoot() {
+    return this;
+  }
+  updated(e) {
+    super.updated(e);
+    const t = this.adapter.templateData.size;
+    t ? this.style.flex = String(t) : this.style.removeProperty("flex");
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.classList.add("gui-time-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 e = this.adapter.templateData;
+    return g`
+      <gui-time-picker
+        .uid=${this.widget.uid}
+        .label=${e.label}
+        .hint=${e.hint}
+        .errors=${e.errors}
+        ?touched=${e.touched}
+        ?required=${e.validator?.required}
+        ?disabled=${e.disabled}
+        ?readonly=${e.readonly}
+        .value=${e.value}
+        .icon=${e.icon}
+        .localeId=${e.lang}
+        .hourFormat=${e.hourFormat}
+        .minuteStep=${e.minuteStep}
+        .minTime=${e.minTime}
+        .maxTime=${e.maxTime}
+        .disabledRanges=${e.disabledRanges}
+        ?allow-custom-time=${e.allowCustomTime}
+        .height=${e.height}
+        .itemHeight=${e.itemHeight}
+        .minTimeMessage=${e.minTimeMessage}
+        .maxTimeMessage=${e.maxTimeMessage}
+        .disabledRangeMessage=${e.disabledRangeMessage}
+        .noAvailableTimesMessage=${e.noAvailableTimesMessage}
+        @inputError=${this.onInputError}
+        @blur=${() => this.adapter.onBlur()}
+        @change=${this.valueChanged}
+      ></gui-time-picker>
+    `;
+  }
+  valueChanged(e) {
+    this.adapter.injectValidationIssues(null), this.adapter.valueChanged(e.detail.value);
+  }
+  onInputError(e) {
+    this.adapter.injectValidationIssues([e.detail.message]);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.adapter.destroy(), this.subscriptions.forEach((e) => e.unsubscribe());
+  }
+};
+l([
+  u({ context: p }),
+  $({ attribute: !1 })
+], s.prototype, "formContext", 2);
+l([
+  c({ context: m })
+], s.prototype, "adapter", 2);
+s = l([
+  b("gui-time-picker-input")
+], s);
+export {
+  s as TimePickerElement
+};

package/time.element-fK3oLi49.js

@@ -0,0 +1,82 @@
+import { InputWidgetAdapter as l, formContext as m, inputContext as n } from "@golemui/lit";
+import { a as u } from "./templates-Dk1jxLwS.js";
+import "./time-input-BOhlBGJZ.js";
+import { consume as h, provide as c } from "@lit/context";
+import { LitElement as g, html as $ } from "lit";
+import { property as D, customElement as f } from "lit/decorators.js";
+import "rxjs";
+import { classMap as b } from "lit/directives/class-map.js";
+var v = Object.defineProperty, x = Object.getOwnPropertyDescriptor, d = (t, e, s, i) => {
+  for (var a = i > 1 ? void 0 : i ? x(e, s) : e, p = t.length - 1, o; p >= 0; p--)
+    (o = t[p]) && (a = (i ? o(e, s, a) : o(a)) || a);
+  return i && a && v(e, s, a), a;
+};
+let r = class extends g {
+  constructor() {
+    super(...arguments), this.adapter = new l(), this.subscriptions = [];
+  }
+  createRenderRoot() {
+    return this;
+  }
+  updated(t) {
+    super.updated(t);
+    const e = this.adapter.templateData.size;
+    e ? this.style.flex = String(e) : this.style.removeProperty("flex");
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.classList.add("gui-time", "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 = u("time", this.adapter.templateData);
+    return $`
+      <gui-time
+        class=${b(t.widgetClasses)}
+        .uid=${this.widget.uid}
+        .label=${this.adapter.templateData.label}
+        .hint=${this.adapter.templateData.hint}
+        .errors=${this.adapter.templateData.errors}
+        ?touched=${this.adapter.templateData.touched}
+        ?required=${this.adapter.templateData.validator?.required}
+        ?disabled=${this.adapter.templateData.disabled}
+        ?readonly=${this.adapter.templateData.readonly}
+        .value=${this.adapter.templateData.value}
+        .icon=${this.adapter.templateData.icon}
+        .localeId=${this.adapter.templateData.lang}
+        .hourFormat=${this.adapter.templateData.hourFormat}
+        .minuteStep=${this.adapter.templateData.minuteStep}
+        .minTime=${this.adapter.templateData.minTime}
+        .maxTime=${this.adapter.templateData.maxTime}
+        .minTimeMessage=${this.adapter.templateData.minTimeMessage}
+        .maxTimeMessage=${this.adapter.templateData.maxTimeMessage}
+        @inputError=${this.onInputError}
+        @blur=${() => this.adapter.onBlur()}
+        @change=${this.valueChanged}
+      ></gui-time>
+    `;
+  }
+  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());
+  }
+};
+d([
+  h({ context: m }),
+  D({ attribute: !1 })
+], r.prototype, "formContext", 2);
+d([
+  c({ context: n })
+], r.prototype, "adapter", 2);
+r = d([
+  f("gui-time-input")
+], r);
+export {
+  r as TimeElement
+};