@golemui/gui-lit 1.0.2 → 1.1.0

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+## 1.0.3 (2026-07-02)
+
+### 🩹 Fixes
+
+- firefox issues with date inputs, numeric inputs and dropdown ([#215](https://github.com/golemui/golemui/pull/215))
+
+### ❤️ Thank You
+
+- Mud Scientist @mudscientist
+- Raúl Jiménez @Elecash
+
+## 1.0.2 (2026-06-26)
+
+This was a version bump only for gui-lit to align it with other projects, there were no code changes.
+
 ## 1.0.1 (2026-06-15)
 
 This was a version bump only for gui-lit to align it with other projects, there were no code changes.

package/calendar-BuJgwvZx.js

@@ -0,0 +1,254 @@
+import { LitElement as u, html as p, nothing as y } from "lit";
+import { property as o, customElement as b } from "lit/decorators.js";
+import { classMap as v } from "lit/directives/class-map.js";
+import { G as m } from "./templates-Dk1jxLwS.js";
+import { G as g, a as D, r as M, c as _, d as S, b as f, e as C } from "./day-status-0-hJHrI7.js";
+import { G as O } from "./focus-leave.controller-2gV0pQd5.js";
+import { p as d, f as I, h as x, t as c } from "./date-Bj9mI3GU.js";
+var L = Object.defineProperty, G = Object.getOwnPropertyDescriptor, a = (e, t, n, i) => {
+  for (var s = i > 1 ? void 0 : i ? G(t, n) : t, l = e.length - 1, h; l >= 0; l--)
+    (h = e[l]) && (s = (i ? h(t, n, s) : h(s)) || s);
+  return i && s && L(t, n, s), s;
+};
+let r = class extends u {
+  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._nav = new g(this, {
+      getMinDate: () => this.minDate,
+      getMaxDate: () => this.maxDate,
+      getNumberOfMonths: () => this.numberOfMonths,
+      getDisabledRanges: () => this.disabledRanges,
+      onYearSelectorToggled: () => this._keyboard.onYearGridToggled()
+    }), this.ariaController = new m(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 = d(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 nav controller's month cursor, kept under its historical name. */
+  get _currentDate() {
+    return this._nav.currentDate;
+  }
+  set _currentDate(e) {
+    this._nav.currentDate = e;
+  }
+  createRenderRoot() {
+    return this;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.classList.add("gui-field");
+  }
+  willUpdate(e) {
+    e.has("value") && this.value && this._nav.navigateToDate(d(this.value));
+  }
+  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: () => y,
+      renderMonthPanel: (e) => f({
+        currentDate: this._nav.currentDate,
+        offset: e,
+        localeId: this.localeId,
+        monthFormat: this.monthFormat,
+        yearSelectorOpen: this._nav.yearSelectorOpen,
+        onToggleYearSelector: () => this._nav.toggleYearSelector(),
+        renderPanelBody: (t) => this.renderPanelBody(t)
+      })
+    });
+  }
+  /**
+   * The panel content below the header: the year grid replaces the days grid
+   * of the first panel while the year selector is open. Subclasses can swap
+   * in other bodies (e.g. the date-time calendar's time grid).
+   */
+  renderPanelBody(e) {
+    return _({
+      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 p`
+      <button
+        type="button"
+        role="gridcell"
+        class=${v(t)}
+        tabindex=${e.isFocusable ? 0 : -1}
+        ?disabled=${!e.isCurrentMonth || e.isDisabled}
+        data-date=${c(e.date)}
+        @click=${() => this.selectDate(e)}
+        @keydown=${(n) => this._keyboard.handleDayKeydown(n)}
+        aria-selected=${e.isSelected}
+      >
+        ${e.dayLabel}
+      </button>
+    `;
+  }
+  getDaysInMonth(e) {
+    const t = this.value;
+    return S({
+      currentDate: this._currentDate,
+      offset: e,
+      localeId: this.localeId,
+      numberOfMonths: this.numberOfMonths ?? 1,
+      isDisabled: (n) => this.isDisabled(n),
+      toDay: (n) => {
+        const i = C(n.date, { selectedISO: t }).isSelected;
+        return {
+          date: n.date,
+          dayLabel: n.dayLabel,
+          isCurrentMonth: n.isCurrentMonth,
+          isToday: n.isToday,
+          isDisabled: n.isDisabled,
+          isSelected: i,
+          isFocusable: (i || n.isToday) && n.isCurrentMonth
+        };
+      },
+      focusFallbackDates: [t ? d(t) : /* @__PURE__ */ new Date()]
+    });
+  }
+  selectDate(e) {
+    if (!e.isCurrentMonth || e.isDisabled || this.disabled || this.readOnly) return;
+    const t = c(e.date);
+    this.value = t, this.dispatchEvent(
+      new CustomEvent("change", {
+        detail: { value: t },
+        bubbles: !0,
+        composed: !0
+      })
+    );
+  }
+  isDisabled(e) {
+    return this._nav.isDisabled(e);
+  }
+};
+a([
+  o({ type: String })
+], r.prototype, "uid", 2);
+a([
+  o({ type: String })
+], r.prototype, "label", 2);
+a([
+  o({ type: String })
+], r.prototype, "hint", 2);
+a([
+  o({ type: String, attribute: "locale-id" })
+], r.prototype, "localeId", 2);
+a([
+  o({ type: Array })
+], r.prototype, "errors", 2);
+a([
+  o({ type: Boolean })
+], r.prototype, "touched", 2);
+a([
+  o({ type: Boolean })
+], r.prototype, "required", 2);
+a([
+  o({ type: Boolean })
+], r.prototype, "disabled", 2);
+a([
+  o({ type: Boolean, attribute: "readonly" })
+], r.prototype, "readOnly", 2);
+a([
+  o({ type: String, attribute: "prev-month-icon" })
+], r.prototype, "prevMonthIcon", 2);
+a([
+  o({ type: String, attribute: "next-month-icon" })
+], r.prototype, "nextMonthIcon", 2);
+a([
+  o({ type: String, attribute: "prev-month-aria-label" })
+], r.prototype, "prevMonthAriaLabel", 2);
+a([
+  o({ type: String, attribute: "next-month-aria-label" })
+], r.prototype, "nextMonthAriaLabel", 2);
+a([
+  o({ type: String })
+], r.prototype, "dayFormat", 2);
+a([
+  o({ type: String })
+], r.prototype, "weekdayFormat", 2);
+a([
+  o({ type: String })
+], r.prototype, "monthFormat", 2);
+a([
+  o({ type: String })
+], r.prototype, "minDate", 2);
+a([
+  o({ type: String })
+], r.prototype, "maxDate", 2);
+a([
+  o({ type: Array })
+], r.prototype, "disabledRanges", 2);
+a([
+  o({ type: Number })
+], r.prototype, "numberOfMonths", 2);
+a([
+  o({ type: String })
+], r.prototype, "value", 2);
+r = a([
+  b("gui-calendar")
+], r);
+typeof customElements < "u" && !customElements.get("gui-calendar") && customElements.define("gui-calendar", r);

package/{calendar.element-MubSE1bx.js → calendar.element-M5MPJmap.js}

@@ -1,5 +1,5 @@
 import { InputWidgetAdapter as o, formContext as l, inputContext as h } from "@golemui/lit";
-import "./calendar-DTYKVYc3.js";
+import "./calendar-BuJgwvZx.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";

package/{currency.element-BHXWcOEu.js → currency.element-CfFrAtrr.js}

@@ -2,13 +2,14 @@ import { InputWidgetAdapter as g, formContext as b, inputContext as v } from "@g
 import { LitElement as m, nothing as p, html as d } from "lit";
 import { property as a, state as f, query as $, customElement as y } from "lit/decorators.js";
 import { classMap as D } from "lit/directives/class-map.js";
-import { G as C, a as x, b as F, c as S } from "./templates-Dk1jxLwS.js";
-import { consume as _, provide as w } from "@lit/context";
+import { G as C, a as x, b as F, c as w } from "./templates-Dk1jxLwS.js";
+import { b as S, a as _ } from "./numeric-jmOOKz30.js";
+import { consume as E, provide as I } from "@lit/context";
 import "rxjs";
-var E = Object.defineProperty, I = Object.getOwnPropertyDescriptor, r = (t, e, o, l) => {
-  for (var s = l > 1 ? void 0 : l ? I(e, o) : e, n = t.length - 1, u; n >= 0; n--)
-    (u = t[n]) && (s = (l ? u(e, o, s) : u(s)) || s);
-  return l && s && E(e, o, s), s;
+var O = Object.defineProperty, N = Object.getOwnPropertyDescriptor, r = (t, e, o, n) => {
+  for (var s = n > 1 ? void 0 : n ? N(e, o) : e, l = t.length - 1, u; l >= 0; l--)
+    (u = t[l]) && (s = (n ? u(e, o, s) : u(s)) || s);
+  return n && s && O(e, o, s), s;
 };
 let i = class extends m {
   constructor() {
@@ -77,6 +78,8 @@ let i = class extends m {
           placeholder=${this.placeholder || p}
           autocomplete=${this.autocomplete || p}
           @input=${this.handleInput}
+          @beforeinput=${S}
+          @keydown=${_}
           @focus=${this.handleFocus}
           @blur=${this.handleBlur}
         />
@@ -88,7 +91,7 @@ let i = class extends m {
         ${e.html}
       </div>
 
-      ${S(this.uid, t)}
+      ${w(this.uid, t)}
     `;
   }
   handleInput(t) {
@@ -119,7 +122,10 @@ let i = class extends m {
   formatCurrency(t) {
     if (t === "" || t === void 0 || t === null || isNaN(t)) return "";
     try {
-      const e = this.maximumFractionDigits ?? Math.max(this.minimumFractionDigits ?? 2, 2), o = Math.min(this.minimumFractionDigits ?? 2, e);
+      const e = this.maximumFractionDigits ?? Math.max(this.minimumFractionDigits ?? 2, 2), o = Math.min(
+        this.minimumFractionDigits ?? 2,
+        e
+      );
       return new Intl.NumberFormat(this.localeId ?? "en", {
         style: "currency",
         currency: this.currency ?? "USD",
@@ -199,10 +205,10 @@ i = r([
   y("gui-currency")
 ], i);
 typeof customElements < "u" && !customElements.get("gui-currency") && customElements.define("gui-currency", i);
-var O = Object.defineProperty, q = Object.getOwnPropertyDescriptor, h = (t, e, o, l) => {
-  for (var s = l > 1 ? void 0 : l ? q(e, o) : e, n = t.length - 1, u; n >= 0; n--)
-    (u = t[n]) && (s = (l ? u(e, o, s) : u(s)) || s);
-  return l && s && O(e, o, s), s;
+var q = Object.defineProperty, P = Object.getOwnPropertyDescriptor, h = (t, e, o, n) => {
+  for (var s = n > 1 ? void 0 : n ? P(e, o) : e, l = t.length - 1, u; l >= 0; l--)
+    (u = t[l]) && (s = (n ? u(e, o, s) : u(s)) || s);
+  return n && s && q(e, o, s), s;
 };
 let c = class extends m {
   constructor() {
@@ -255,11 +261,11 @@ let c = class extends m {
   }
 };
 h([
-  _({ context: b }),
+  E({ context: b }),
   a({ attribute: !1 })
 ], c.prototype, "formContext", 2);
 h([
-  w({ context: v })
+  I({ context: v })
 ], c.prototype, "adapter", 2);
 c = h([
   y("gui-currency-input")

package/{date-DTYg8sog.js → date-Bj9mI3GU.js}

@@ -1,4 +1,4 @@
-const t = {
+const l = {
   aa: { firstDay: 7, weekend: [6, 7], minimalDays: 1 },
   "aa-DJ": { firstDay: 6, weekend: [6, 7], minimalDays: 1 },
   "aa-ER": { firstDay: 1, weekend: [6, 7], minimalDays: 1 },
@@ -709,77 +709,133 @@ const t = {
   "zh-Hant-HK": { firstDay: 7, weekend: [6, 7], minimalDays: 1 },
   "zh-Hant-MO": { firstDay: 7, weekend: [6, 7], minimalDays: 1 },
   zu: { firstDay: 7, weekend: [6, 7], minimalDays: 1 }
-};
-function y(e) {
-  const i = e.getFullYear(), n = String(e.getMonth() + 1).padStart(2, "0"), a = String(e.getDate()).padStart(2, "0");
-  return `${i}-${n}-${a}`;
+}, M = "Invalid date: day is greater than the maximum valid day for the month and year.", k = "Invalid date: date is before the minimum allowed date.", w = "Invalid date: date is after the maximum allowed date.", o = "Invalid date: date is within a disabled range.", I = "Invalid time: time is before the minimum allowed time.", S = "Invalid time: time is after the maximum allowed time.", E = "Invalid range: end time must be after start time.", h = "Invalid time: time is within a disabled range.", b = "Invalid date-time: date-time is before the minimum allowed date-time.", L = "Invalid date-time: date-time is after the maximum allowed date-time.";
+function r(e) {
+  const a = e.getFullYear(), n = String(e.getMonth() + 1).padStart(2, "0"), i = String(e.getDate()).padStart(2, "0");
+  return `${a}-${n}-${i}`;
+}
+function t(e) {
+  const a = /^(\d{4})-(\d{2})-(\d{2})$/.exec(e);
+  return a ? new Date(Number(a[1]), Number(a[2]) - 1, Number(a[3])) : new Date(e);
+}
+function d(e, a, n, i) {
+  const s = e.split("T")[0];
+  if (a && s < a.split("T")[0] || n && s > n.split("T")[0]) return !0;
+  if (i && i.length > 0)
+    for (const m of i) {
+      const D = m.start.split("T")[0], y = m.end ? m.end.split("T")[0] : D;
+      if (s >= D && s <= y)
+        return !0;
+    }
+  return !1;
 }
-function k(e) {
-  return r(e, /* @__PURE__ */ new Date());
+function G(e, a, n, i, s) {
+  const m = e.split("T")[0];
+  return a && m < a.split("T")[0] ? s?.minDateMessage ?? k : n && m > n.split("T")[0] ? s?.maxDateMessage ?? w : d(m, void 0, void 0, i) ? s?.disabledDateRangeMessage ?? o : null;
 }
-function r(e, i) {
-  return e.getDate() === i.getDate() && e.getMonth() === i.getMonth() && e.getFullYear() === i.getFullYear();
+function T(e, a, n, i, s) {
+  const m = t(e), D = t(a);
+  if (isNaN(m.getTime()) || isNaN(D.getTime())) return !1;
+  const y = new Date(m);
+  y.setHours(0, 0, 0, 0);
+  const f = new Date(D);
+  for (f.setHours(0, 0, 0, 0); y <= f; ) {
+    if (d(r(y), i, s, n))
+      return !0;
+    y.setDate(y.getDate() + 1);
+  }
+  return !1;
 }
-function f(e) {
-  const i = [0, 1, 2, 3, 4, 5, 6], n = e % 7;
-  return [...i.slice(n), ...i.slice(0, n)];
+function N(e) {
+  return new Intl.DateTimeFormat(e ?? "en", {
+    year: "numeric",
+    month: "numeric",
+    day: "numeric"
+  }).formatToParts(/* @__PURE__ */ new Date());
 }
-function l(e) {
-  const i = t[e ?? "en"] || { firstDay: 0 };
-  return f(i.firstDay);
+function p(e, a) {
+  return e === 2 ? new Date(a, 1, 29).getDate() === 29 || !a ? 29 : 28 : e === 4 || e === 6 || e === 9 || e === 11 ? 30 : 31;
 }
-function w(e) {
-  const i = new Intl.DateTimeFormat(e, { weekday: "narrow" }), n = new Date(2025, 10, 30);
-  return l(e).map((a) => {
+function C(e) {
+  return u(e, /* @__PURE__ */ new Date());
+}
+function u(e, a) {
+  return e.getDate() === a.getDate() && e.getMonth() === a.getMonth() && e.getFullYear() === a.getFullYear();
+}
+function c(e) {
+  const a = [0, 1, 2, 3, 4, 5, 6], n = e % 7;
+  return [...a.slice(n), ...a.slice(0, n)];
+}
+function g(e) {
+  const a = e ?? "en", n = l[a] || l[a.split("-")[0]] || { firstDay: 0 };
+  return c(n.firstDay);
+}
+function v(e) {
+  const a = new Intl.DateTimeFormat(e, { weekday: "narrow" }), n = new Date(2025, 10, 30);
+  return g(e).map((i) => {
     const s = new Date(n);
-    return s.setDate(n.getDate() + a), i.format(s);
+    return s.setDate(n.getDate() + i), a.format(s);
   });
 }
-function o(e, i, n) {
-  for (let a = 0; a < n; a++) {
-    const s = new Date(i.getFullYear(), i.getMonth() + a, 1);
+function B(e, a, n) {
+  for (let i = 0; i < n; i++) {
+    const s = new Date(a.getFullYear(), a.getMonth() + i, 1);
     if (e.getMonth() === s.getMonth() && e.getFullYear() === s.getFullYear())
       return !0;
   }
   return !1;
 }
-function g(e, i, n = "long") {
-  return new Intl.DateTimeFormat(e, { month: n, year: "numeric" }).formatToParts(i).filter((s) => s.type === "month" || s.type === "year");
+function R(e, a, n = "long") {
+  return new Intl.DateTimeFormat(e, { month: n, year: "numeric" }).formatToParts(a).filter((s) => s.type === "month" || s.type === "year");
 }
-function u(e, i) {
-  const n = e || "en-US", m = new Intl.DateTimeFormat(n, { day: "numeric" }).formatToParts(i).find((D) => D.type === "day");
-  return m ? m.value : i.getDate().toString();
+function H(e, a) {
+  const n = e || "en-US", m = new Intl.DateTimeFormat(n, { day: "numeric" }).formatToParts(a).find((D) => D.type === "day");
+  return m ? m.value : a.getDate().toString();
 }
-function d(e, i) {
-  const n = y(e), a = y(i);
-  return n === a ? { start: n } : { start: n, end: a };
+function A(e, a) {
+  const n = r(e), i = r(a);
+  return n === i ? { start: n } : { start: n, end: i };
 }
-function c(e) {
-  return e.length ? e.map((a) => ({
-    start: new Date(a.start).getTime(),
-    end: new Date(a.end ?? a.start).getTime()
-  })).sort((a, s) => a.start - s.start).reduce(
-    (a, s) => {
-      const m = a[a.length - 1];
+function _(e) {
+  return e.length ? e.map((i) => ({
+    start: t(i.start).getTime(),
+    end: t(i.end ?? i.start).getTime()
+  })).sort((i, s) => i.start - s.start).reduce(
+    (i, s) => {
+      const m = i[i.length - 1];
       if (m) {
         const D = new Date(m.end);
         if (D.setDate(D.getDate() + 1), s.start <= D.getTime())
-          return m.end = Math.max(m.end, s.end), a;
+          return m.end = Math.max(m.end, s.end), i;
       }
-      return [...a, s];
+      return [...i, s];
     },
     []
-  ).map((a) => d(new Date(a.start), new Date(a.end))) : [];
+  ).map((i) => A(new Date(i.start), new Date(i.end))) : [];
 }
 export {
-  k as a,
-  r as b,
-  d as c,
-  w as d,
-  g as e,
-  u as g,
-  o as i,
-  c as m,
-  y as t,
-  l as w
+  o as D,
+  I,
+  S as a,
+  h as b,
+  A as c,
+  G as d,
+  E as e,
+  C as f,
+  N as g,
+  H as h,
+  d as i,
+  B as j,
+  v as k,
+  R as l,
+  _ as m,
+  u as n,
+  b as o,
+  t as p,
+  L as q,
+  T as r,
+  p as s,
+  r as t,
+  M as u,
+  g as w
 };