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

package/{range-calendar-CKPYeSGt.js → range-calendar-DO_woqcF.js}

@@ -1,21 +1,21 @@
-import { LitElement as y, html as c, nothing as p } from "lit";
-import { property as s, state as v, customElement as b } from "lit/decorators.js";
+import { LitElement as b, html as p, nothing as l } from "lit";
+import { property as r, state as v, customElement as y } from "lit/decorators.js";
 import { classMap as m } from "lit/directives/class-map.js";
-import { G as D } from "./templates-Dk1jxLwS.js";
-import { G as f, a as _, r as R, b as S, c as M, d as I, e as C } from "./day-status-0-hJHrI7.js";
-import { G as O } from "./focus-leave.controller-2gV0pQd5.js";
-import { p as h, t as l, r as E, D as A, m as P, c as L } from "./date-Bj9mI3GU.js";
-import { r as x, f as k, a as w, b as G, s as N, c as T } from "./pill-ranges-DCqDmpkk.js";
-import { i as $, s as F, r as g } from "./range-selection-CU3hxLJE.js";
-import "./pills-Be1UrLgq.js";
-var Y = Object.defineProperty, B = Object.getOwnPropertyDescriptor, n = (e, t, o, a) => {
-  for (var r = a > 1 ? void 0 : a ? B(t, o) : t, d = e.length - 1, u; d >= 0; d--)
-    (u = e[d]) && (r = (a ? u(t, o, r) : u(r)) || r);
-  return a && r && Y(t, o, r), r;
+import { G as D } from "./templates-Dmr34nwp.js";
+import { G as f, a as _, r as S, b as R, c as M, d as I, e as C } from "./day-status-CsWStVQV.js";
+import { G as A } from "./focus-leave.controller-2gV0pQd5.js";
+import { p as d, g as O, t as h, r as L, D as E, m as P, c as x } from "./date-DBuYpvcO.js";
+import { r as G, f as $, a as k, b as w, s as N, c as T } from "./pill-ranges-DpvWwP-3.js";
+import { i as Y, s as F, r as g } from "./range-selection-CU3hxLJE.js";
+import "./pills-BDMO2NiR.js";
+var B = Object.defineProperty, q = Object.getOwnPropertyDescriptor, n = (e, t, o, a) => {
+  for (var s = a > 1 ? void 0 : a ? q(t, o) : t, u = e.length - 1, c; u >= 0; u--)
+    (c = e[u]) && (s = (a ? c(t, o, s) : c(s)) || s);
+  return a && s && B(t, o, s), s;
 };
-let i = class extends y {
+let i = class extends b {
   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 = [], this.focusDate = void 0, this.hidePills = !1, this.removePillAriaLabel = void 0, this.disabledDateRangeMessage = void 0, this.invalidRange = null, this._selection = $(), this._invalidRange = null, this._skipValueNavigation = !1, this._nav = new f(this, {
+    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.selectYearAriaLabel = void 0, this.yearGridAriaLabel = void 0, 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 = [], this.focusDate = void 0, this.hidePills = !1, this.removePillAriaLabel = void 0, this.disabledDateRangeMessage = void 0, this.invalidRange = null, this._selection = Y(), this._invalidRange = null, this._skipValueNavigation = !1, this._nav = new f(this, {
       getMinDate: () => this.minDate,
       getMaxDate: () => this.maxDate,
       getNumberOfMonths: () => this.numberOfMonths,
@@ -30,7 +30,8 @@ let i = class extends y {
           errors: this.errors,
           readonly: this.readOnly,
           disabled: this.disabled,
-          touched: this.touched
+          touched: this.touched,
+          required: this.required
         }
       })
     }), this._keyboard = new _(this, {
@@ -42,11 +43,11 @@ let i = class extends y {
       onSelectYear: (e) => this._nav.selectYear(e),
       onCloseYearGrid: () => this._nav.closeYearSelector(),
       isYearGridOpen: () => this._nav.yearSelectorOpen
-    }), this._focusLeave = new O(this, {
+    }), this._focusLeave = new A(this, {
       onLeave: () => this.dispatchEvent(new CustomEvent("blur", { bubbles: !0, composed: !0 }))
     }), this.onPillRemoveEvent = (e) => {
       if (this.disabled || this.readOnly) return;
-      const t = x(this.value, e.detail.key);
+      const t = G(this.value, e.detail.key);
       t && (this.value = t.next, this.dispatchEvent(
         new CustomEvent("change", {
           detail: { value: this.value },
@@ -55,7 +56,7 @@ let i = class extends y {
         })
       ));
     }, this.onPillClickEvent = (e) => {
-      const t = k(this.getSortedPills(), e.detail.key);
+      const t = $(this.getSortedPills(), e.detail.key);
       t && this.navigateToDate(t.start);
     };
   }
@@ -72,22 +73,22 @@ let i = class extends y {
    * same day still sort by time.
    */
   parseEndpoint(e) {
-    return h(e);
+    return d(e);
   }
   /**
    * Midnight-truncated calendar day of an endpoint, used to highlight the day
    * grid.
    */
   endpointDay(e) {
-    return h(e);
+    return d(e);
   }
   /** Pill text for one committed range. */
   formatPillLabel(e) {
-    return w(e, (t) => T(t, this.localeId));
+    return k(e, (t) => T(t, this.localeId));
   }
   /** Day-button inner content. */
   renderDayContent(e) {
-    return c`${e.dayLabel}`;
+    return p`${e.dayLabel}`;
   }
   createRenderRoot() {
     return this;
@@ -111,12 +112,12 @@ let i = class extends y {
       }
     }
     if (e.has("focusDate") && this.focusDate) {
-      const t = h(this.focusDate);
+      const t = d(this.focusDate);
       isNaN(t.getTime()) || (this._nav.navigateToDate(t), this.focusDate = void 0);
     }
   }
   render() {
-    return R({
+    return S({
       uid: this.uid,
       label: this.label,
       hint: this.hint,
@@ -125,6 +126,8 @@ let i = class extends y {
       required: this.required,
       disabled: this.disabled,
       numberOfMonths: this.numberOfMonths,
+      localeId: this.localeId,
+      currentDate: this._nav.currentDate,
       prevMonthIcon: this.prevMonthIcon,
       nextMonthIcon: this.nextMonthIcon,
       prevMonthAriaLabel: this.prevMonthAriaLabel,
@@ -135,12 +138,13 @@ let i = class extends y {
       onNextMonthClick: this._keyboard.onNextMonthClick,
       onFocusOut: this._focusLeave.onFocusOut,
       renderAboveCalendar: () => this.renderAboveCalendar(),
-      renderMonthPanel: (e) => S({
+      renderMonthPanel: (e) => R({
         currentDate: this._nav.currentDate,
         offset: e,
         localeId: this.localeId,
         monthFormat: this.monthFormat,
         yearSelectorOpen: this._nav.yearSelectorOpen,
+        selectYearAriaLabel: this.selectYearAriaLabel,
         onToggleYearSelector: () => this.toggleYearSelector(),
         renderBelowHeader: (t) => this.renderBelowHeader(t),
         renderPanelBody: (t) => this.renderPanelBody(t)
@@ -149,7 +153,7 @@ let i = class extends y {
   }
   /** Hook rendered between the header and the panel body. Default: nothing. */
   renderBelowHeader(e) {
-    return p;
+    return l;
   }
   /**
    * The panel content below the header: the year grid replaces the days grid
@@ -165,6 +169,8 @@ let i = class extends y {
       onSelectYear: (t) => this._keyboard.selectYear(t),
       onYearKeydown: this._keyboard.handleYearKeydown,
       localeId: this.localeId,
+      currentDate: this._nav.currentDate,
+      yearGridAriaLabel: this.yearGridAriaLabel,
       getDays: (t) => this.getDaysInMonth(t),
       renderDay: (t) => this.renderDay(t)
     });
@@ -186,10 +192,11 @@ let i = class extends y {
    * `selectDate`.
    */
   activationDay(e) {
+    const t = d(e);
     return {
-      date: h(e),
+      date: t,
       isCurrentMonth: !0,
-      isDisabled: !1,
+      isDisabled: this.isDisabled(t),
       isFocusable: !0,
       dayLabel: "",
       isToday: !1,
@@ -221,14 +228,17 @@ let i = class extends y {
       "is-selecting": e.isSelecting,
       disabled: e.isDisabled
     };
-    return c`
+    return p`
       <button
         type="button"
         role="gridcell"
         class=${m(o)}
         tabindex=${e.isFocusable ? 0 : -1}
-        ?disabled=${!e.isCurrentMonth || e.isDisabled}
-        data-date=${l(e.date)}
+        ?disabled=${!e.isCurrentMonth}
+        aria-disabled=${e.isCurrentMonth && e.isDisabled ? "true" : l}
+        aria-label=${O(this.localeId, e.date)}
+        aria-current=${e.isToday ? "date" : l}
+        data-date=${h(e.date)}
         @click=${(a) => this.selectDate(e, a)}
         @mouseover=${() => this.onMouseOver(e)}
         @focus=${() => this.onMouseOver(e)}
@@ -251,7 +261,7 @@ let i = class extends y {
       numberOfMonths: this.numberOfMonths ?? 1,
       isDisabled: (a) => this.isDisabled(a),
       toDay: (a) => {
-        const r = C(a.date, {
+        const s = C(a.date, {
           ranges: t,
           anchor: this._selection.anchor,
           selectingSpan: o,
@@ -262,17 +272,17 @@ let i = class extends y {
           dayLabel: a.dayLabel,
           isCurrentMonth: a.isCurrentMonth,
           isToday: a.isToday,
-          isRangeStart: r.isRangeStart,
-          isRangeEnd: r.isRangeEnd,
-          isInRange: r.isInRange,
-          isInvalidStart: r.isInvalidStart && a.isCurrentMonth,
-          isInvalidEnd: r.isInvalidEnd && a.isCurrentMonth,
-          isInvalidInRange: r.isInvalidInRange && a.isCurrentMonth,
+          isRangeStart: s.isRangeStart,
+          isRangeEnd: s.isRangeEnd,
+          isInRange: s.isInRange,
+          isInvalidStart: s.isInvalidStart && a.isCurrentMonth,
+          isInvalidEnd: s.isInvalidEnd && a.isCurrentMonth,
+          isInvalidInRange: s.isInvalidInRange && a.isCurrentMonth,
           isDisabled: a.isDisabled,
-          isOneDayRange: r.isOneDayRange,
-          isAnchor: r.isAnchor,
-          isFocusable: a.isToday || r.isRangeStart,
-          isSelecting: r.isSelecting && a.isCurrentMonth
+          isOneDayRange: s.isOneDayRange,
+          isAnchor: s.isAnchor,
+          isFocusable: a.isToday || s.isRangeStart,
+          isSelecting: s.isSelecting && a.isCurrentMonth
         };
       },
       focusFallbackDates: [
@@ -282,7 +292,7 @@ let i = class extends y {
     });
   }
   selectDate(e, t = null) {
-    if (!e.isCurrentMonth || this.disabled || this.readOnly) return;
+    if (!e.isCurrentMonth || e.isDisabled || this.disabled || this.readOnly) return;
     const { state: o, commit: a } = g(this._selection, {
       type: "pick",
       date: e.date
@@ -291,9 +301,9 @@ let i = class extends y {
       this._invalidRange = null;
       return;
     }
-    if (E(
-      l(a.start),
-      l(a.end),
+    if (L(
+      h(a.start),
+      h(a.end),
       this.disabledRanges,
       this.minDate,
       this.maxDate
@@ -301,8 +311,8 @@ let i = class extends y {
       this._invalidRange = { start: a.start, end: a.end }, this.dispatchEvent(
         new CustomEvent("inputError", {
           detail: {
-            message: this.disabledDateRangeMessage ?? A,
-            range: { start: l(a.start), end: l(a.end) }
+            message: this.disabledDateRangeMessage ?? E,
+            range: { start: h(a.start), end: h(a.end) }
           },
           bubbles: !0,
           composed: !0
@@ -312,7 +322,7 @@ let i = class extends y {
     }
     this._invalidRange = null, this._skipValueNavigation = !0, this.value = P([
       ...this.value || [],
-      L(a.start, a.end)
+      x(a.start, a.end)
     ]), this.dispatchEvent(
       new CustomEvent("change", {
         detail: { value: this.value },
@@ -322,24 +332,22 @@ let i = class extends y {
     );
   }
   onMouseOver(e) {
-    this._selection = g(this._selection, {
+    e.isDisabled || (this._selection = g(this._selection, {
       type: "hover",
       date: e.date
-    }).state;
+    }).state);
   }
   // --- Pills ---
   renderAboveCalendar() {
-    if (this.hidePills) return p;
+    if (this.hidePills) return l;
     const e = this.getSortedPills();
-    if (e.length === 0) return p;
-    const t = G(
-      e,
-      (o) => this.formatPillLabel(o),
-      this.removePillAriaLabel ?? "Remove date"
-    );
-    return c`
+    if (e.length === 0) return l;
+    const t = w(e, (o) => this.formatPillLabel(o));
+    return p`
       <gui-pills
         class="gui-range-calendar__pills"
+        .uid=${this.uid}
+        .toolbarAriaLabel=${"Selected date ranges"}
         .items=${t}
         .removable=${!0}
         .clickable=${!0}
@@ -363,82 +371,88 @@ let i = class extends y {
   }
 };
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "uid", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "label", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "hint", 2);
 n([
-  s({ type: String, attribute: "locale-id" })
+  r({ type: String, attribute: "locale-id" })
 ], i.prototype, "localeId", 2);
 n([
-  s({ type: Array })
+  r({ type: Array })
 ], i.prototype, "errors", 2);
 n([
-  s({ type: Boolean })
+  r({ type: Boolean })
 ], i.prototype, "touched", 2);
 n([
-  s({ type: Boolean })
+  r({ type: Boolean })
 ], i.prototype, "required", 2);
 n([
-  s({ type: Boolean })
+  r({ type: Boolean })
 ], i.prototype, "disabled", 2);
 n([
-  s({ type: Boolean, attribute: "readonly" })
+  r({ type: Boolean, attribute: "readonly" })
 ], i.prototype, "readOnly", 2);
 n([
-  s({ type: String, attribute: "prev-month-icon" })
+  r({ type: String, attribute: "prev-month-icon" })
 ], i.prototype, "prevMonthIcon", 2);
 n([
-  s({ type: String, attribute: "next-month-icon" })
+  r({ type: String, attribute: "next-month-icon" })
 ], i.prototype, "nextMonthIcon", 2);
 n([
-  s({ type: String, attribute: "prev-month-aria-label" })
+  r({ type: String, attribute: "prev-month-aria-label" })
 ], i.prototype, "prevMonthAriaLabel", 2);
 n([
-  s({ type: String, attribute: "next-month-aria-label" })
+  r({ type: String, attribute: "next-month-aria-label" })
 ], i.prototype, "nextMonthAriaLabel", 2);
 n([
-  s({ type: String })
+  r({ type: String, attribute: "select-year-aria-label" })
+], i.prototype, "selectYearAriaLabel", 2);
+n([
+  r({ type: String, attribute: "year-grid-aria-label" })
+], i.prototype, "yearGridAriaLabel", 2);
+n([
+  r({ type: String })
 ], i.prototype, "dayFormat", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "weekdayFormat", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "monthFormat", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "minDate", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "maxDate", 2);
 n([
-  s({ type: Array })
+  r({ type: Array })
 ], i.prototype, "disabledRanges", 2);
 n([
-  s({ type: Number })
+  r({ type: Number })
 ], i.prototype, "numberOfMonths", 2);
 n([
-  s({ type: Array })
+  r({ type: Array })
 ], i.prototype, "value", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "focusDate", 2);
 n([
-  s({ type: Boolean })
+  r({ type: Boolean })
 ], i.prototype, "hidePills", 2);
 n([
-  s({ type: String })
+  r({ type: String })
 ], i.prototype, "removePillAriaLabel", 2);
 n([
-  s({ type: String, attribute: "disabled-date-range-message" })
+  r({ type: String, attribute: "disabled-date-range-message" })
 ], i.prototype, "disabledDateRangeMessage", 2);
 n([
-  s({ attribute: !1 })
+  r({ attribute: !1 })
 ], i.prototype, "invalidRange", 2);
 n([
   v()
@@ -447,6 +461,6 @@ n([
   v()
 ], i.prototype, "_invalidRange", 2);
 i = n([
-  b("gui-range-calendar")
+  y("gui-range-calendar")
 ], i);
 typeof customElements < "u" && !customElements.get("gui-range-calendar") && customElements.define("gui-range-calendar", i);

package/{range-calendar.element-D6KYq18B.js → range-calendar.element-DHLZhpnj.js}

@@ -1,17 +1,17 @@
-import { InputWidgetAdapter as d, formContext as o, inputContext as h } from "@golemui/lit";
-import "./range-calendar-CKPYeSGt.js";
+import { InputWidgetAdapter as n, formContext as o, inputContext as h } from "@golemui/lit";
+import "./range-calendar-DO_woqcF.js";
 import { consume as m, provide as u } from "@lit/context";
-import { LitElement as c, html as D } from "lit";
-import { property as b, customElement as $ } from "lit/decorators.js";
+import { LitElement as c, html as b } from "lit";
+import { property as D, customElement as $ } from "lit/decorators.js";
 import "rxjs";
-var g = Object.defineProperty, f = Object.getOwnPropertyDescriptor, l = (t, e, s, r) => {
-  for (var a = r > 1 ? void 0 : r ? f(e, s) : e, p = t.length - 1, n; p >= 0; p--)
-    (n = t[p]) && (a = (r ? n(e, s, a) : n(a)) || a);
+var g = Object.defineProperty, f = Object.getOwnPropertyDescriptor, d = (t, e, s, r) => {
+  for (var a = r > 1 ? void 0 : r ? f(e, s) : e, l = t.length - 1, p; l >= 0; l--)
+    (p = t[l]) && (a = (r ? p(e, s, a) : p(a)) || a);
   return r && a && g(e, s, a), a;
 };
 let i = class extends c {
   constructor() {
-    super(...arguments), this.adapter = new d(), this.subscriptions = [];
+    super(...arguments), this.adapter = new n(), this.subscriptions = [];
   }
   createRenderRoot() {
     return this;
@@ -27,7 +27,7 @@ let i = class extends c {
     );
   }
   render() {
-    return super.render(), D`
+    return super.render(), b`
       <gui-range-calendar
         .uid=${this.widget.uid}
         .label=${this.adapter.templateData.label}
@@ -42,6 +42,8 @@ let i = class extends c {
         .nextMonthIcon=${this.adapter.templateData.nextMonthIcon}
         .prevMonthAriaLabel=${this.adapter.templateData.prevMonthAriaLabel}
         .nextMonthAriaLabel=${this.adapter.templateData.nextMonthAriaLabel}
+        .selectYearAriaLabel=${this.adapter.templateData.selectYearAriaLabel}
+        .yearGridAriaLabel=${this.adapter.templateData.yearGridAriaLabel}
         .dayFormat=${this.adapter.templateData.dayFormat}
         .weekdayFormat=${this.adapter.templateData.weekdayFormat}
         .monthFormat=${this.adapter.templateData.monthFormat}
@@ -69,14 +71,14 @@ let i = class extends c {
     super.disconnectedCallback(), this.adapter.destroy(), this.subscriptions.forEach((t) => t.unsubscribe());
   }
 };
-l([
+d([
   m({ context: o }),
-  b({ attribute: !1 })
+  D({ attribute: !1 })
 ], i.prototype, "formContext", 2);
-l([
+d([
   u({ context: h })
 ], i.prototype, "adapter", 2);
-i = l([
+i = d([
   $("gui-range-calendar-input")
 ], i);
 export {