@golemui/gui-lit 1.2.0 → 1.2.1-rc.0

package/calendar-DleRbmvP.js

@@ -1,267 +0,0 @@
-import { LitElement as p, nothing as d, html as y } from "lit";
-import { property as i, customElement as b } from "lit/decorators.js";
-import { classMap as v } from "lit/directives/class-map.js";
-import { G as m } from "./templates-Df7abEkB.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-ljexnwEO.js";
-import { G as I } from "./focus-leave.controller-2gV0pQd5.js";
-import { p as c, h as L, j as O, g as x, t as u } from "./date-DBuYpvcO.js";
-var G = Object.defineProperty, A = Object.getOwnPropertyDescriptor, a = (e, t, o, n) => {
-  for (var s = n > 1 ? void 0 : n ? A(t, o) : t, l = e.length - 1, h; l >= 0; l--)
-    (h = e[l]) && (s = (n ? h(t, o, s) : h(s)) || s);
-  return n && s && G(t, o, s), s;
-};
-let r = class extends p {
-  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.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 = 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,
-          required: this.required
-        }
-      })
-    }), this._keyboard = new D(this, {
-      canGoPrev: () => this._nav.canGoPrev(),
-      canGoNext: () => this._nav.canGoNext(),
-      goPrev: () => this._nav.prevMonth(),
-      goNext: () => this._nav.nextMonth(),
-      onActivateDay: (e) => {
-        const t = c(e);
-        this.selectDate({
-          date: t,
-          dayLabel: O(this.localeId, t),
-          isCurrentMonth: !0,
-          isToday: L(t),
-          isSelected: !1,
-          isFocusable: !0,
-          isDisabled: this.isDisabled(t)
-        });
-      },
-      onSelectYear: (e) => this._nav.selectYear(e),
-      onCloseYearGrid: () => this._nav.closeYearSelector(),
-      isYearGridOpen: () => this._nav.yearSelectorOpen
-    }), this._focusLeave = new I(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(c(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,
-      localeId: this.localeId,
-      currentDate: this._nav.currentDate,
-      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: () => d,
-      renderMonthPanel: (e) => f({
-        currentDate: this._nav.currentDate,
-        offset: e,
-        localeId: this.localeId,
-        monthFormat: this.monthFormat,
-        yearSelectorOpen: this._nav.yearSelectorOpen,
-        selectYearAriaLabel: this.selectYearAriaLabel,
-        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,
-      currentDate: this._nav.currentDate,
-      yearGridAriaLabel: this.yearGridAriaLabel,
-      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 y`
-      <button
-        type="button"
-        role="gridcell"
-        class=${v(t)}
-        tabindex=${e.isFocusable ? 0 : -1}
-        ?disabled=${!e.isCurrentMonth}
-        aria-disabled=${e.isCurrentMonth && e.isDisabled ? "true" : d}
-        aria-label=${x(this.localeId, e.date)}
-        aria-current=${e.isToday ? "date" : d}
-        data-date=${u(e.date)}
-        @click=${() => this.selectDate(e)}
-        @keydown=${(o) => this._keyboard.handleDayKeydown(o)}
-        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: (o) => this.isDisabled(o),
-      toDay: (o) => {
-        const n = C(o.date, { selectedISO: t }).isSelected;
-        return {
-          date: o.date,
-          dayLabel: o.dayLabel,
-          isCurrentMonth: o.isCurrentMonth,
-          isToday: o.isToday,
-          isDisabled: o.isDisabled,
-          isSelected: n,
-          isFocusable: (n || o.isToday) && o.isCurrentMonth
-        };
-      },
-      focusFallbackDates: [t ? c(t) : /* @__PURE__ */ new Date()]
-    });
-  }
-  selectDate(e) {
-    if (!e.isCurrentMonth || e.isDisabled || this.disabled || this.readOnly) return;
-    const t = u(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([
-  i({ type: String })
-], r.prototype, "uid", 2);
-a([
-  i({ type: String })
-], r.prototype, "label", 2);
-a([
-  i({ type: String })
-], r.prototype, "hint", 2);
-a([
-  i({ type: String, attribute: "locale-id" })
-], r.prototype, "localeId", 2);
-a([
-  i({ type: Array })
-], r.prototype, "errors", 2);
-a([
-  i({ type: Boolean })
-], r.prototype, "touched", 2);
-a([
-  i({ type: Boolean })
-], r.prototype, "required", 2);
-a([
-  i({ type: Boolean })
-], r.prototype, "disabled", 2);
-a([
-  i({ type: Boolean, attribute: "readonly" })
-], r.prototype, "readOnly", 2);
-a([
-  i({ type: String, attribute: "prev-month-icon" })
-], r.prototype, "prevMonthIcon", 2);
-a([
-  i({ type: String, attribute: "next-month-icon" })
-], r.prototype, "nextMonthIcon", 2);
-a([
-  i({ type: String, attribute: "prev-month-aria-label" })
-], r.prototype, "prevMonthAriaLabel", 2);
-a([
-  i({ type: String, attribute: "next-month-aria-label" })
-], r.prototype, "nextMonthAriaLabel", 2);
-a([
-  i({ type: String, attribute: "select-year-aria-label" })
-], r.prototype, "selectYearAriaLabel", 2);
-a([
-  i({ type: String, attribute: "year-grid-aria-label" })
-], r.prototype, "yearGridAriaLabel", 2);
-a([
-  i({ type: String })
-], r.prototype, "dayFormat", 2);
-a([
-  i({ type: String })
-], r.prototype, "weekdayFormat", 2);
-a([
-  i({ type: String })
-], r.prototype, "monthFormat", 2);
-a([
-  i({ type: String })
-], r.prototype, "minDate", 2);
-a([
-  i({ type: String })
-], r.prototype, "maxDate", 2);
-a([
-  i({ type: Array })
-], r.prototype, "disabledRanges", 2);
-a([
-  i({ type: Number })
-], r.prototype, "numberOfMonths", 2);
-a([
-  i({ 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/checkbox.element-CpmrzdH0.js

@@ -1,200 +0,0 @@
-import { InputWidgetAdapter as g, formContext as m, inputContext as y } from "@golemui/lit";
-import { G as v, r as f, c as $ } from "./templates-Df7abEkB.js";
-import { LitElement as c, nothing as x, html as p } from "lit";
-import { property as a, customElement as b } from "lit/decorators.js";
-import { consume as C, provide as k } from "@lit/context";
-import "rxjs";
-var _ = Object.defineProperty, D = Object.getOwnPropertyDescriptor, s = (e, t, l, o) => {
-  for (var i = o > 1 ? void 0 : o ? D(t, l) : t, d = e.length - 1, h; d >= 0; d--)
-    (h = e[d]) && (i = (o ? h(t, l, i) : h(i)) || i);
-  return o && i && _(t, l, i), i;
-};
-let r = class extends c {
-  constructor() {
-    super(...arguments), this.uid = void 0, this.label = void 0, this.localeId = "en", this.errors = [], this.touched = void 0, this.required = void 0, this.disabled = !1, this.readOnly = !1, this.value = void 0, this.hint = void 0, this.checkboxPosition = "left", this.ariaController = new v(this, {
-      getTargets: () => this.querySelectorAll(`input[id="${this.uid}"]`),
-      getState: () => ({
-        uid: this.uid,
-        templateData: {
-          hint: this.hint,
-          errors: this.errors,
-          touched: this.touched,
-          // Checkboxes can't have aria-readonly
-          readonly: !1,
-          disabled: !1,
-          required: this.required
-        }
-      })
-    });
-  }
-  createRenderRoot() {
-    return this;
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.classList.add("gui-field");
-  }
-  render() {
-    super.render();
-    const e = {
-      uid: this.uid,
-      label: this.label,
-      hint: this.hint,
-      errors: this.errors,
-      touched: this.touched,
-      required: this.required,
-      disabled: this.disabled,
-      readonly: this.readOnly,
-      value: this.value,
-      checkboxPosition: this.checkboxPosition
-    };
-    return e.checkboxPosition === "right" ? this.classList.add("gui-checkbox--right") : this.classList.contains("gui-checkbox--right") && this.classList.remove("gui-checkbox--right"), p`
-      <label
-        class="gui-label"
-        for=${this.uid}
-        data-cy=${`${this.uid}_label`}
-        id=${`${this.uid}_label`}
-      >
-        <div class="gui-widget gui-widget--horizontal">
-          <input
-            type="checkbox"
-            id=${this.uid}
-            data-cy=${`${this.uid}_checkbox`}
-            ?checked=${this.value}
-            ?required=${this.required}
-            ?disabled=${this.disabled || this.readOnly}
-            @change=${this.valueChanged}
-            @blur=${this.onBlur}
-          />
-        </div>
-
-        <span class="gui-label__container">
-          <span class="gui-label__text"
-            >${e.label}${f(e.required)}</span
-          >
-        </span>
-      </label>
-
-      <div class="gui-widget-hint" id=${`${e.uid}_hint`}>
-        ${e.hint ?? x} ${$(this.uid, e)}
-      </div>
-    `;
-  }
-  valueChanged(e) {
-    if (e.stopPropagation(), !this.readOnly) {
-      const t = e.target;
-      this.dispatchEvent(
-        new CustomEvent("change", {
-          detail: { value: t.checked },
-          bubbles: !0,
-          composed: !0
-        })
-      );
-    }
-  }
-  onBlur() {
-    this.dispatchEvent(
-      new CustomEvent("blur", {
-        bubbles: !0,
-        composed: !0
-      })
-    );
-  }
-};
-s([
-  a({ type: String })
-], r.prototype, "uid", 2);
-s([
-  a({ type: String })
-], r.prototype, "label", 2);
-s([
-  a({ type: String, attribute: "locale-id" })
-], r.prototype, "localeId", 2);
-s([
-  a({ type: Array })
-], r.prototype, "errors", 2);
-s([
-  a({ type: Boolean })
-], r.prototype, "touched", 2);
-s([
-  a({ type: Boolean })
-], r.prototype, "required", 2);
-s([
-  a({ type: Boolean })
-], r.prototype, "disabled", 2);
-s([
-  a({ type: Boolean, attribute: "readonly" })
-], r.prototype, "readOnly", 2);
-s([
-  a({ type: String })
-], r.prototype, "value", 2);
-s([
-  a({ type: String })
-], r.prototype, "hint", 2);
-s([
-  a({ type: String })
-], r.prototype, "checkboxPosition", 2);
-r = s([
-  b("gui-checkbox")
-], r);
-typeof customElements < "u" && !customElements.get("gui-checkbox") && customElements.define("gui-checkbox", r);
-var P = Object.defineProperty, q = Object.getOwnPropertyDescriptor, u = (e, t, l, o) => {
-  for (var i = o > 1 ? void 0 : o ? q(t, l) : t, d = e.length - 1, h; d >= 0; d--)
-    (h = e[d]) && (i = (o ? h(t, l, i) : h(i)) || i);
-  return o && i && P(t, l, i), i;
-};
-let n = class extends c {
-  constructor() {
-    super(...arguments), this.adapter = new g(), 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-checkbox", "gui-field"), this.adapter.context = this.formContext, this.adapter.init(this.widget), this.subscriptions.push(
-      this.adapter.templateDataChanged$.subscribe(() => this.requestUpdate())
-    );
-  }
-  render() {
-    return super.render(), p`
-      <gui-checkbox
-        .uid=${this.widget.uid}
-        .label=${this.adapter.templateData.label}
-        .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}
-        .hint=${this.adapter.templateData.hint}
-        .checkboxPosition=${this.adapter.templateData.checkboxPosition}
-        @change=${this.valueChanged}
-        @blur=${() => this.adapter.onBlur()}
-      ></gui-checkbox>
-    `;
-  }
-  valueChanged(e) {
-    const t = e.detail.value;
-    this.adapter.valueChanged(t);
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.adapter.destroy(), this.subscriptions.forEach((e) => e.unsubscribe());
-  }
-};
-u([
-  C({ context: m }),
-  a({ attribute: !1 })
-], n.prototype, "formContext", 2);
-u([
-  k({ context: y })
-], n.prototype, "adapter", 2);
-n = u([
-  b("gui-checkbox-input")
-], n);
-export {
-  n as CheckboxElement
-};