@golemui/gui-lit 1.1.0 → 1.1.1-rc.0

package/{range-date-time-picker.element-Cbps6s_G.js → range-date-time-picker.element-CDN2RL1y.js}

@@ -1,23 +1,23 @@
-import { InputWidgetAdapter as g, formContext as y, inputContext as $ } from "@golemui/lit";
-import { LitElement as m, html as h, nothing as v } from "lit";
-import { property as i, query as b, state as D, customElement as c } from "lit/decorators.js";
-import { classMap as T } from "lit/directives/class-map.js";
-import "./range-date-time-input-B37TUoM3.js";
-import "./range-date-time-calendar-yksWrR7b.js";
-import { G as f } from "./popup.controller-eUDxE6jD.js";
-import { a as M, b as L, c as A } from "./templates-Dk1jxLwS.js";
-import { consume as C, provide as w } from "@lit/context";
+import { InputWidgetAdapter as g, formContext as c, inputContext as y } from "@golemui/lit";
+import { LitElement as m, html as h, nothing as $ } from "lit";
+import { property as i, state as v, customElement as b } from "lit/decorators.js";
+import { classMap as L } from "lit/directives/class-map.js";
+import "./range-date-time-input-Cu-T_nuC.js";
+import "./range-date-time-calendar-B3EMgN1E.js";
+import { G as A } from "./popup.controller-B33OvX_y.js";
+import { a as D, b as T, c as f } from "./templates-Dmr34nwp.js";
+import { consume as M, provide as C } from "@lit/context";
 import "rxjs";
-var x = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, a = (e, r, n, s) => {
-  for (var o = s > 1 ? void 0 : s ? _(r, n) : r, l = e.length - 1, d; l >= 0; l--)
+var w = Object.defineProperty, S = Object.getOwnPropertyDescriptor, a = (e, r, n, s) => {
+  for (var o = s > 1 ? void 0 : s ? S(r, n) : r, l = e.length - 1, d; l >= 0; l--)
     (d = e[l]) && (o = (s ? d(r, n, o) : d(o)) || o);
-  return s && o && x(r, n, o), o;
+  return s && o && w(r, n, o), o;
 };
 let t = class extends m {
   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 = [], this.separator = void 0, this.removePillAriaLabel = void 0, this.startDateTimeAriaLabel = void 0, this.endDateTimeAriaLabel = void 0, this.invalidDateMessage = 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.numberOfMonths = void 0, this.hourFormat = void 0, this.minuteStep = void 0, this.allowCustomTime = !1, this.startTimeLabel = void 0, this.endTimeLabel = void 0, this.minDateTime = void 0, this.maxDateTime = void 0, this.minDateTimeMessage = void 0, this.maxDateTimeMessage = void 0, this.disabledRanges = void 0, this.disabledRangeMessage = void 0, this.noAvailableTimesMessage = void 0, this.dayCountAriaLabel = void 0, this.disabledDayCountAriaLabel = void 0, this._focusDate = void 0, this._popup = new f(this, {
-      getInteriorElements: () => [this._dateRef, this._calendarRef],
+    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 = [], this.toggleAriaLabel = void 0, this.dayAriaLabel = void 0, this.monthAriaLabel = void 0, this.yearAriaLabel = void 0, this.hourAriaLabel = void 0, this.minuteAriaLabel = void 0, this.dayPeriodAriaLabel = void 0, this.separator = void 0, this.removePillAriaLabel = void 0, this.startDateTimeAriaLabel = void 0, this.endDateTimeAriaLabel = void 0, this.invalidDateMessage = void 0, this.prevMonthIcon = "", this.nextMonthIcon = "", this.prevMonthAriaLabel = void 0, this.nextMonthAriaLabel = void 0, this.selectYearAriaLabel = void 0, this.yearGridAriaLabel = void 0, this.dayFormat = void 0, this.weekdayFormat = void 0, this.monthFormat = void 0, this.numberOfMonths = void 0, this.hourFormat = void 0, this.minuteStep = void 0, this.allowCustomTime = !1, this.startTimeLabel = void 0, this.endTimeLabel = void 0, this.minDateTime = void 0, this.maxDateTime = void 0, this.minDateTimeMessage = void 0, this.maxDateTimeMessage = void 0, this.disabledRanges = void 0, this.disabledRangeMessage = void 0, this.noAvailableTimesMessage = void 0, this.dayCountAriaLabel = void 0, this.disabledDayCountAriaLabel = void 0, this._focusDate = void 0, this._popup = new A(this, {
       focusRestoreSelector: "gui-range-date-time input",
+      focusPopupSelector: '.gui-calendar__day-button[tabindex="0"]',
       isDisabled: () => !!this.disabled,
       clickIntent: (e) => e.closest(".gui-calendar__day-button") || e.closest(".gui-time-list__option") || e.closest("gui-time-picker") ? "ignore" : e.closest(".gui-range-date-time-input__field") || e.closest("gui-range-date-time-calendar") ? "open" : "toggle",
       keyToggleMode: "openClose",
@@ -29,6 +29,8 @@ let t = class extends m {
       }
     }), this.onDropdownToggle = (e) => {
       e.detail?.open && this._popup.open && this._popup.close();
+    }, this.onToggleClick = (e) => {
+      e.stopPropagation(), this._popup.open ? this._popup.close() : this._popup.openAndFocus();
     };
   }
   createRenderRoot() {
@@ -41,8 +43,10 @@ let t = class extends m {
     super.disconnectedCallback(), this.removeEventListener("dropdowntoggle", this.onDropdownToggle);
   }
   render() {
-    const e = M("datePicker", { icon: this.icon }), r = this._popup.open ? h`<gui-range-date-time-calendar
-          id="calendar-input"
+    const e = D("datePicker", { icon: this.icon }), r = this._popup.open ? h`<gui-range-date-time-calendar
+          id=${`${this.uid}_popup`}
+          role="dialog"
+          aria-label=${this.label ?? "Calendar"}
           .uid=${this.uid}
           .hint=${this.hint}
           ?touched=${this.touched}
@@ -57,6 +61,8 @@ let t = class extends m {
           .nextMonthIcon=${this.nextMonthIcon}
           .prevMonthAriaLabel=${this.prevMonthAriaLabel}
           .nextMonthAriaLabel=${this.nextMonthAriaLabel}
+          .selectYearAriaLabel=${this.selectYearAriaLabel}
+          .yearGridAriaLabel=${this.yearGridAriaLabel}
           .dayFormat=${this.dayFormat}
           .weekdayFormat=${this.weekdayFormat}
           .monthFormat=${this.monthFormat}
@@ -78,26 +84,28 @@ let t = class extends m {
           @blur=${this.onCalendarBlur}
           @change=${this.onCalendarChange}
           @inputError=${this.onCalendarInputError}
-        ></gui-range-date-time-calendar>` : v;
+        ></gui-range-date-time-calendar>` : $;
     return h`
-      ${L(this.uid ?? "", {
-      label: this.label,
-      hint: this.hint,
-      required: this.required
-    })}
+      ${T(
+      this.uid ?? "",
+      {
+        label: this.label,
+        hint: this.hint,
+        required: this.required
+      },
+      !1,
+      void 0,
+      !1
+    )}
 
       <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-range-date-time
           id="date-input"
-          class=${T(e.widgetClasses)}
+          class=${L(e.widgetClasses)}
           .uid=${this.uid}
           .hint=${this.hint}
           .showErrors=${!1}
@@ -115,6 +123,12 @@ let t = class extends m {
           .removePillAriaLabel=${this.removePillAriaLabel}
           .startDateTimeAriaLabel=${this.startDateTimeAriaLabel}
           .endDateTimeAriaLabel=${this.endDateTimeAriaLabel}
+          .dayAriaLabel=${this.dayAriaLabel}
+          .monthAriaLabel=${this.monthAriaLabel}
+          .yearAriaLabel=${this.yearAriaLabel}
+          .hourAriaLabel=${this.hourAriaLabel}
+          .minuteAriaLabel=${this.minuteAriaLabel}
+          .dayPeriodAriaLabel=${this.dayPeriodAriaLabel}
           .invalidDateMessage=${this.invalidDateMessage}
           .minDateTime=${this.minDateTime}
           .maxDateTime=${this.maxDateTime}
@@ -127,17 +141,33 @@ let t = class extends m {
           @change=${this.onDateChange}
           @pillClick=${this.onPillClick}
         ></gui-range-date-time>
-        <span class="gui-range-date-time-picker__arrow"
-          ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256">
+        <button
+          type="button"
+          class="gui-range-date-time-picker__arrow"
+          aria-label=${this.toggleAriaLabel ?? "Show calendar"}
+          aria-haspopup="dialog"
+          aria-expanded=${this._popup.open ? "true" : "false"}
+          aria-controls=${`${this.uid}_popup`}
+          ?disabled=${this.disabled}
+          @click=${this.onToggleClick}
+        >
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="16"
+            height="16"
+            viewBox="0 0 256 256"
+            aria-hidden="true"
+          >
             <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>
+            ></path>
+          </svg>
+        </button>
 
         ${r}
       </div>
 
-      ${this.showErrors ? A(this.uid ?? "", { errors: this.errors, touched: this.touched }) : ""}
+      ${this.showErrors ? f(this.uid ?? "", { errors: this.errors, touched: this.touched }) : ""}
     `;
   }
   onDateChange(e) {
@@ -177,7 +207,7 @@ let t = class extends m {
     );
   }
   onCalendarBlur() {
-    this._popup.close();
+    this._popup.closeOnFocusLeave();
   }
   onPillClick(e) {
     this._focusDate = e.detail.range.start, this._popup.show();
@@ -222,6 +252,27 @@ a([
 a([
   i({ type: Array })
 ], t.prototype, "value", 2);
+a([
+  i({ type: String, attribute: "toggle-aria-label" })
+], t.prototype, "toggleAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "dayAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "monthAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "yearAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "hourAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "minuteAriaLabel", 2);
+a([
+  i({ type: String })
+], t.prototype, "dayPeriodAriaLabel", 2);
 a([
   i({ type: String })
 ], t.prototype, "separator", 2);
@@ -249,6 +300,12 @@ a([
 a([
   i({ type: String, attribute: "next-month-aria-label" })
 ], t.prototype, "nextMonthAriaLabel", 2);
+a([
+  i({ type: String, attribute: "select-year-aria-label" })
+], t.prototype, "selectYearAriaLabel", 2);
+a([
+  i({ type: String, attribute: "year-grid-aria-label" })
+], t.prototype, "yearGridAriaLabel", 2);
 a([
   i({ type: String, attribute: "day-format" })
 ], t.prototype, "dayFormat", 2);
@@ -304,22 +361,16 @@ a([
   i({ type: String, attribute: "disabled-day-count-aria-label" })
 ], t.prototype, "disabledDayCountAriaLabel", 2);
 a([
-  b("#date-input")
-], t.prototype, "_dateRef", 2);
-a([
-  b("#calendar-input")
-], t.prototype, "_calendarRef", 2);
-a([
-  D()
+  v()
 ], t.prototype, "_focusDate", 2);
 t = a([
-  c("gui-range-date-time-picker")
+  b("gui-range-date-time-picker")
 ], t);
 typeof customElements < "u" && !customElements.get("gui-range-date-time-picker") && customElements.define("gui-range-date-time-picker", t);
-var S = Object.defineProperty, I = Object.getOwnPropertyDescriptor, u = (e, r, n, s) => {
-  for (var o = s > 1 ? void 0 : s ? I(r, n) : r, l = e.length - 1, d; l >= 0; l--)
+var x = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, u = (e, r, n, s) => {
+  for (var o = s > 1 ? void 0 : s ? _(r, n) : r, l = e.length - 1, d; l >= 0; l--)
     (d = e[l]) && (o = (s ? d(r, n, o) : d(o)) || o);
-  return s && o && S(r, n, o), o;
+  return s && o && x(r, n, o), o;
 };
 let p = class extends m {
   constructor() {
@@ -362,11 +413,20 @@ let p = class extends m {
         .nextMonthIcon=${e.nextMonthIcon}
         .prevMonthAriaLabel=${e.prevMonthAriaLabel}
         .nextMonthAriaLabel=${e.nextMonthAriaLabel}
+        .selectYearAriaLabel=${e.selectYearAriaLabel}
+        .yearGridAriaLabel=${e.yearGridAriaLabel}
         .dayFormat=${e.dayFormat}
         .weekdayFormat=${e.weekdayFormat}
         .monthFormat=${e.monthFormat}
         .numberOfMonths=${e.numberOfMonths}
         .localeId=${e.lang}
+        .toggleAriaLabel=${e.toggleAriaLabel}
+        .dayAriaLabel=${e.dayAriaLabel}
+        .monthAriaLabel=${e.monthAriaLabel}
+        .yearAriaLabel=${e.yearAriaLabel}
+        .hourAriaLabel=${e.hourAriaLabel}
+        .minuteAriaLabel=${e.minuteAriaLabel}
+        .dayPeriodAriaLabel=${e.dayPeriodAriaLabel}
         .hourFormat=${e.hourFormat}
         .minuteStep=${e.minuteStep}
         ?allow-custom-time=${e.allowCustomTime}
@@ -398,14 +458,14 @@ let p = class extends m {
   }
 };
 u([
-  C({ context: y }),
+  M({ context: c }),
   i({ attribute: !1 })
 ], p.prototype, "formContext", 2);
 u([
-  w({ context: $ })
+  C({ context: y })
 ], p.prototype, "adapter", 2);
 p = u([
-  c("gui-range-date-time-picker-input")
+  b("gui-range-date-time-picker-input")
 ], p);
 export {
   p as RangeDateTimePickerElement

package/{range-time-input-3lhqR1Ku.js → range-time-input-BP9ZL9O8.js}

@@ -1,21 +1,21 @@
 import { LitElement as c, nothing as d, html as p } from "lit";
-import { property as s, customElement as g } from "lit/decorators.js";
+import { property as a, customElement as g } from "lit/decorators.js";
 import { classMap as v } from "lit/directives/class-map.js";
 import { styleMap as y } from "lit-html/directives/style-map.js";
-import { G as b, b as f, c as T } from "./templates-Dk1jxLwS.js";
-import { G as E, g as _, u as P, r as m, l as S, s as h, v as C, w as D, x as L, t as R } from "./part-templates-Db871PS3.js";
-import { c as w } from "./range-commit-8-MmYUyo.js";
-import { r as A, f as I, b as $, a as k, s as M } from "./pill-ranges-DCqDmpkk.js";
-import "./pills-Be1UrLgq.js";
-import { e as F, b as O } from "./date-Bj9mI3GU.js";
-var B = Object.defineProperty, G = Object.getOwnPropertyDescriptor, i = (t, a, o, r) => {
-  for (var l = r > 1 ? void 0 : r ? G(a, o) : a, n = t.length - 1, u; n >= 0; n--)
-    (u = t[n]) && (l = (r ? u(a, o, l) : u(l)) || l);
-  return r && l && B(a, o, l), l;
+import { G as b, b as f, c as T } from "./templates-Dmr34nwp.js";
+import { G as _, g as E, u as P, r as h, l as L, s as m, v as S, w as A, x as C, t as D, P as R } from "./part-templates-VORbpgs2.js";
+import { c as $ } from "./range-commit-8-MmYUyo.js";
+import { r as I, f as w, b as k, a as M, s as F } from "./pill-ranges-DpvWwP-3.js";
+import "./pills-BDMO2NiR.js";
+import { f as B, e as O } from "./date-DBuYpvcO.js";
+var G = Object.defineProperty, x = Object.getOwnPropertyDescriptor, i = (t, s, o, r) => {
+  for (var l = r > 1 ? void 0 : r ? x(s, o) : s, n = t.length - 1, u; n >= 0; n--)
+    (u = t[n]) && (l = (r ? u(s, o, l) : u(l)) || l);
+  return r && l && G(s, o, l), l;
 };
 let e = class extends c {
   constructor() {
-    super(...arguments), this.uid = void 0, this.label = void 0, this.localeId = void 0, this.errors = [], this.showErrors = !0, this.touched = !1, this.required = !1, this.disabled = !1, this.readOnly = !1, this.icon = "", this.hint = void 0, this.hourFormat = void 0, this.minuteStep = 1, this.minTime = void 0, this.maxTime = void 0, this.minTimeMessage = void 0, this.maxTimeMessage = void 0, this.value = [], this.rangeOrderMessage = void 0, this.removePillAriaLabel = void 0, this.startTimeAriaLabel = void 0, this.endTimeAriaLabel = void 0, this.separator = void 0, this.allowCustomTime = void 0, this.disabledRanges = void 0, this.disabledRangeMessage = void 0, this.inputBlockClass = "gui-range-time-input", this.groups = ["start", "end"], this._validationTriggered = !1, this._parts = new E(this, {
+    super(...arguments), this.uid = void 0, this.label = void 0, this.localeId = void 0, this.errors = [], this.showErrors = !0, this.touched = !1, this.required = !1, this.disabled = !1, this.readOnly = !1, this.icon = "", this.hint = void 0, this.hourAriaLabel = void 0, this.minuteAriaLabel = void 0, this.dayPeriodAriaLabel = void 0, this.hourFormat = void 0, this.minuteStep = 1, this.minTime = void 0, this.maxTime = void 0, this.minTimeMessage = void 0, this.maxTimeMessage = void 0, this.value = [], this.rangeOrderMessage = void 0, this.removePillAriaLabel = void 0, this.startTimeAriaLabel = void 0, this.endTimeAriaLabel = void 0, this.separator = void 0, this.allowCustomTime = void 0, this.disabledRanges = void 0, this.disabledRangeMessage = void 0, this.inputBlockClass = "gui-range-time-input", this.groups = ["start", "end"], this._validationTriggered = !1, this._parts = new _(this, {
       blockClass: this.inputBlockClass,
       groups: this.groups,
       getDescriptor: (t) => this.getPartDescriptor(t),
@@ -44,20 +44,21 @@ let e = class extends c {
           errors: this.errors,
           readonly: this.readOnly,
           disabled: this.disabled,
-          touched: this.touched
+          touched: this.touched,
+          required: this.required
         }
       })
     }), this.onPillRemoveEvent = (t) => {
       if (this.disabled || this.readOnly) return;
-      const a = A(this.value, t.detail.key);
-      a && (this.value = a.next, this.dispatchEvent(
+      const s = I(this.value, t.detail.key);
+      s && (this.value = s.next, this.dispatchEvent(
         new CustomEvent("change", { detail: { value: this.value }, bubbles: !0, composed: !0 })
-      ), a.next.length === 0 && requestAnimationFrame(() => {
+      ), s.next.length === 0 && requestAnimationFrame(() => {
         this.querySelector(".gui-range-time-input__field input")?.focus();
       }));
     }, this.onPillClickEvent = (t) => {
-      const a = I(this.getSortedPills(), t.detail.key);
-      a && this.onPillClick(a);
+      const s = w(this.getSortedPills(), t.detail.key);
+      s && this.onPillClick(s);
     };
   }
   createRenderRoot() {
@@ -67,7 +68,7 @@ let e = class extends c {
     super.connectedCallback(), this.classList.add("gui-field");
   }
   get timeLocaleData() {
-    return _(this.localeId, this.hourFormat, this.minuteStep);
+    return E(this.localeId, this.hourFormat, this.minuteStep);
   }
   getPartDescriptor(t) {
     return this.timeLocaleData.descriptors[t];
@@ -86,19 +87,22 @@ let e = class extends c {
       readonly: this.readOnly,
       value: this.value,
       hint: this.hint
-    }, a = {
+    }, s = {
       blockClass: this.inputBlockClass,
       groups: this.groups,
       formatParts: P(this.localeId, this.timeLocaleData.effectiveHourFormat),
       getDescriptor: (l) => this.getPartDescriptor(l),
       getDisplayValue: this._parts.getPartDisplay,
-      required: this.required,
+      getPartAriaLabel: (l, n) => ({
+        hour: this.hourAriaLabel,
+        minute: this.minuteAriaLabel
+      })[n] ?? R[n],
+      dayPeriodAriaLabel: this.dayPeriodAriaLabel,
       disabled: this.disabled,
       partsReadonly: !!this.readOnly || this.allowCustomTime === !1
-    }, o = $(
+    }, o = k(
       this.getSortedPills(),
-      (l) => k(l, (n) => this.formatTimeForDisplay(n)),
-      this.removePillAriaLabel ?? "Remove time"
+      (l) => M(l, (n) => this.formatTimeForDisplay(n))
     ), r = {
       "gui-widget-icon": !0,
       [this.icon]: !!this.icon
@@ -112,11 +116,17 @@ let e = class extends c {
           role="group"
           aria-label=${this.label ?? "Time range input"}
         >
-          ${this.icon ? p`<span class=${v(r)} data-icon=${this.icon}></span>` : d}
+          ${this.icon ? p`<span
+                class=${v(r)}
+                data-icon=${this.icon}
+                aria-hidden="true"
+              ></span>` : d}
 
           <gui-pills
             class="gui-range-time-input__pills"
             style=${y(o.length ? {} : { "min-width": 0 })}
+            .uid=${this.uid}
+            .toolbarAriaLabel=${"Selected time ranges"}
             .items=${o}
             .removable=${!0}
             .clickable=${!0}
@@ -135,7 +145,7 @@ let e = class extends c {
               role="group"
               aria-label=${this.startTimeAriaLabel ?? "Start time"}
             >
-              ${m("start", a, this._parts)}
+              ${h("start", s, this._parts)}
             </div>
 
             <span class="gui-range-time-input__separator">${this.separator ?? "-"}</span>
@@ -145,7 +155,7 @@ let e = class extends c {
               role="group"
               aria-label=${this.endTimeAriaLabel ?? "End time"}
             >
-              ${m("end", a, this._parts)}
+              ${h("end", s, this._parts)}
             </div>
           </div>
         </div>
@@ -160,10 +170,10 @@ let e = class extends c {
     );
   }
   formatTimeForDisplay(t) {
-    return S(t, this.localeId, this.timeLocaleData.effectiveHourFormat);
+    return L(t, this.localeId, this.timeLocaleData.effectiveHourFormat);
   }
   getSortedPills() {
-    return M(this.value, h);
+    return F(this.value, m);
   }
   /**
    * Parses a group's parts into an ISO time via the shared clamp/bounds
@@ -171,12 +181,12 @@ let e = class extends c {
    * the group is incomplete or out of bounds.
    */
   validateTimeParts(t) {
-    const { effectiveHourFormat: a, descriptors: o } = this.timeLocaleData, { result: r, writeBacks: l } = C(this._parts.values[t] ?? {}, {
-      hourFormat: a,
+    const { effectiveHourFormat: s, descriptors: o } = this.timeLocaleData, { result: r, writeBacks: l } = S(this._parts.values[t] ?? {}, {
+      hourFormat: s,
       descriptors: o
     });
     if (this._parts.applyWriteBacks(t, l), r.kind !== "valid") return { kind: "incomplete" };
-    const n = D(r.iso, {
+    const n = A(r.iso, {
       minTime: this.minTime,
       maxTime: this.maxTime,
       minTimeMessage: this.minTimeMessage,
@@ -189,8 +199,8 @@ let e = class extends c {
    * calls this so a list pick lands in the visible input (start/end field)
    * before it attempts to commit — see {@link commitFromParts}.
    */
-  fillGroup(t, a) {
-    this._parts.setGroupFromISO(t, a, "time", this.timeLocaleData.effectiveHourFormat), this.requestUpdate();
+  fillGroup(t, s) {
+    this._parts.setGroupFromISO(t, s, "time", this.timeLocaleData.effectiveHourFormat), this.requestUpdate();
   }
   /**
    * Attempts to commit the currently-entered parts as a pill, returning whether
@@ -207,24 +217,24 @@ let e = class extends c {
    * follow the typed values. Runs on every part change.
    */
   syncParts() {
-    const t = this.validateTimeParts("start"), a = this.validateTimeParts("end"), o = (r) => r.kind === "valid" ? r.value : null;
+    const t = this.validateTimeParts("start"), s = this.validateTimeParts("end"), o = (r) => r.kind === "valid" ? r.value : null;
     return this.dispatchEvent(
       new CustomEvent("partsChange", {
-        detail: { start: o(t), end: o(a) },
+        detail: { start: o(t), end: o(s) },
         bubbles: !0,
         composed: !0
       })
-    ), { start: t, end: a };
+    ), { start: t, end: s };
   }
   /**
    * Parses the range and updates the error state, without ever committing.
    * Shared by the Enter commit and by {@link revalidate}.
    */
   evaluateRange() {
-    const { start: t, end: a } = this.syncParts(), o = w(t, a, this.value, {
-      validate: (r) => h(r.end, r.start) <= 0 ? this.rangeOrderMessage ?? F : R(r.start, r.end, this.disabledRanges) ? this.disabledRangeMessage ?? O : null,
+    const { start: t, end: s } = this.syncParts(), o = $(t, s, this.value, {
+      validate: (r) => m(r.end, r.start) <= 0 ? this.rangeOrderMessage ?? B : D(r.start, r.end, this.disabledRanges) ? this.disabledRangeMessage ?? O : null,
       toRange: (r) => ({ start: r.start, end: r.end }),
-      merge: L
+      merge: C
     });
     return o.kind === "incomplete" && this._parts.clearSurfacedInputError(this.value ?? []), o.kind === "invalid" && this._parts.surfaceInputError(o.message), o;
   }
@@ -246,82 +256,91 @@ let e = class extends c {
   }
 };
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "uid", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "label", 2);
 i([
-  s({ type: String, attribute: "locale-id" })
+  a({ type: String, attribute: "locale-id" })
 ], e.prototype, "localeId", 2);
 i([
-  s({ type: Array })
+  a({ type: Array })
 ], e.prototype, "errors", 2);
 i([
-  s({ type: Boolean })
+  a({ type: Boolean })
 ], e.prototype, "showErrors", 2);
 i([
-  s({ type: Boolean })
+  a({ type: Boolean })
 ], e.prototype, "touched", 2);
 i([
-  s({ type: Boolean })
+  a({ type: Boolean })
 ], e.prototype, "required", 2);
 i([
-  s({ type: Boolean })
+  a({ type: Boolean })
 ], e.prototype, "disabled", 2);
 i([
-  s({ type: Boolean, attribute: "readonly" })
+  a({ type: Boolean, attribute: "readonly" })
 ], e.prototype, "readOnly", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "icon", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "hint", 2);
 i([
-  s({ type: String, attribute: "hour-format" })
+  a({ type: String })
+], e.prototype, "hourAriaLabel", 2);
+i([
+  a({ type: String })
+], e.prototype, "minuteAriaLabel", 2);
+i([
+  a({ type: String })
+], e.prototype, "dayPeriodAriaLabel", 2);
+i([
+  a({ type: String, attribute: "hour-format" })
 ], e.prototype, "hourFormat", 2);
 i([
-  s({ type: Number, attribute: "minute-step" })
+  a({ type: Number, attribute: "minute-step" })
 ], e.prototype, "minuteStep", 2);
 i([
-  s({ type: String, attribute: "min-time" })
+  a({ type: String, attribute: "min-time" })
 ], e.prototype, "minTime", 2);
 i([
-  s({ type: String, attribute: "max-time" })
+  a({ type: String, attribute: "max-time" })
 ], e.prototype, "maxTime", 2);
 i([
-  s({ type: String, attribute: "min-time-message" })
+  a({ type: String, attribute: "min-time-message" })
 ], e.prototype, "minTimeMessage", 2);
 i([
-  s({ type: String, attribute: "max-time-message" })
+  a({ type: String, attribute: "max-time-message" })
 ], e.prototype, "maxTimeMessage", 2);
 i([
-  s({ type: Array })
+  a({ type: Array })
 ], e.prototype, "value", 2);
 i([
-  s({ type: String, attribute: "range-order-message" })
+  a({ type: String, attribute: "range-order-message" })
 ], e.prototype, "rangeOrderMessage", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "removePillAriaLabel", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "startTimeAriaLabel", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "endTimeAriaLabel", 2);
 i([
-  s({ type: String })
+  a({ type: String })
 ], e.prototype, "separator", 2);
 i([
-  s({ type: Boolean, attribute: "allow-custom-time" })
+  a({ type: Boolean, attribute: "allow-custom-time" })
 ], e.prototype, "allowCustomTime", 2);
 i([
-  s({ type: Array, attribute: "disabled-ranges" })
+  a({ type: Array, attribute: "disabled-ranges" })
 ], e.prototype, "disabledRanges", 2);
 i([
-  s({ type: String, attribute: "disabled-range-message" })
+  a({ type: String, attribute: "disabled-range-message" })
 ], e.prototype, "disabledRangeMessage", 2);
 e = i([
   g("gui-range-time")

package/{range-time-input.element-dU2iBdmJ.js → range-time-input.element-B7wtHJoQ.js}

@@ -1,17 +1,17 @@
-import { InputWidgetAdapter as n, formContext as m, inputContext as o } from "@golemui/lit";
-import "./range-time-input-3lhqR1Ku.js";
+import { InputWidgetAdapter as m, formContext as n, inputContext as o } from "@golemui/lit";
+import "./range-time-input-BP9ZL9O8.js";
 import { consume as h, provide as u } from "@lit/context";
-import { LitElement as c, html as g } from "lit";
-import { property as D, customElement as $ } from "lit/decorators.js";
+import { LitElement as c, html as b } from "lit";
+import { property as g, customElement as D } from "lit/decorators.js";
 import "rxjs";
-var b = Object.defineProperty, f = Object.getOwnPropertyDescriptor, d = (e, t, s, r) => {
+var $ = Object.defineProperty, f = Object.getOwnPropertyDescriptor, d = (e, t, s, r) => {
   for (var a = r > 1 ? void 0 : r ? f(t, s) : t, p = e.length - 1, l; p >= 0; p--)
     (l = e[p]) && (a = (r ? l(t, s, a) : l(a)) || a);
-  return r && a && b(t, s, a), a;
+  return r && a && $(t, s, a), a;
 };
 let i = class extends c {
   constructor() {
-    super(...arguments), this.adapter = new n(), this.subscriptions = [];
+    super(...arguments), this.adapter = new m(), this.subscriptions = [];
   }
   createRenderRoot() {
     return this;
@@ -27,7 +27,7 @@ let i = class extends c {
     );
   }
   render() {
-    return super.render(), g`
+    return super.render(), b`
       <gui-range-time
         .uid=${this.widget.uid}
         .label=${this.adapter.templateData.label}
@@ -40,6 +40,9 @@ let i = class extends c {
         ?readonly=${this.adapter.templateData.readonly}
         .value=${this.adapter.templateData.value}
         .localeId=${this.adapter.templateData.lang}
+        .hourAriaLabel=${this.adapter.templateData.hourAriaLabel}
+        .minuteAriaLabel=${this.adapter.templateData.minuteAriaLabel}
+        .dayPeriodAriaLabel=${this.adapter.templateData.dayPeriodAriaLabel}
         .separator=${this.adapter.templateData.separator}
         .removePillAriaLabel=${this.adapter.templateData.removePillAriaLabel}
         .startTimeAriaLabel=${this.adapter.templateData.startTimeAriaLabel}
@@ -67,14 +70,14 @@ let i = class extends c {
   }
 };
 d([
-  h({ context: m }),
-  D({ attribute: !1 })
+  h({ context: n }),
+  g({ attribute: !1 })
 ], i.prototype, "formContext", 2);
 d([
   u({ context: o })
 ], i.prototype, "adapter", 2);
 i = d([
-  $("gui-range-time-input")
+  D("gui-range-time-input")
 ], i);
 export {
   i as RangeTimeInputElement