q2-tecton-elements 1.72.0 → 1.73.1

package/dist/q2-tecton-elements/q2-date-calendar.entry.js

@@ -0,0 +1,438 @@
+import { r as a, c as t, h as e, g as r } from "./index-Cqkz7Bnm.js";
+
+import { d as i } from "./index-O1A-ZSZs.js";
+
+import { l as n } from "./index-CP8pXJ-l.js";
+
+import { g as d, a as s, p as o, f as c, n as l, l as h, b as p, i as v, c as g, s as f, d as b } from "./date-picker-helpers-D8QnN_AS.js";
+
+const u = class {
+  constructor(e) {
+    a(this, e), this.tctCalendarCancel = t(this, "tctCalendarCancel", 1), this.tctCalendarCommit = t(this, "tctCalendarCommit", 1), 
+    this.tctCalendarDismiss = t(this, "tctCalendarDismiss", 1), this.tctCalendarError = t(this, "tctCalendarError", 1), 
+    this.tctChange = t(this, "tctChange", 1), 
+    // #region Own Properties
+    this.dayAbbrStrings = d(), this.dayStrings = s(), this.rangeError = "", 
+    /** Uses the action-sheet calendar presentation. */
+    this.actionSheet = !1, 
+    /** Controls whether navigation appears above or below the date grid. */
+    this.direction = "down", 
+    /** Disables calendar interaction. */
+    this.disabled = !1, 
+    /** Formats calendar and range labels using the provided locale. */
+    this.locale = document.documentElement.lang || "en-US", 
+    /** Selects single-date or range calendar behavior. */
+    this.mode = "single", 
+    /** Indicates that a new calendar session has opened. */
+    this.open = !1, 
+    /** Prevents calendar selection while retaining calendar visibility. */
+    this.readonly = !1, this.onDateHover = a => {
+      const t = a.currentTarget;
+      if (t.disabled || !this.isRangeMode || !this.rangeDraftStart || this.rangeDraftEnd) return;
+      const e = o(t.dataset.date);
+      this.rangeHoverDate = i.isValid(e) && this.isDateValid(e) ? e : void 0;
+    }, this.onDateHoverEnd = () => {
+      this.rangeHoverDate = void 0;
+    }, this.onDateKeydown = a => {
+      const t = a.target.closest("button[data-date]");
+      if (!t) return;
+      const e = o(t.dataset.date);
+      let r, n;
+      switch (a.key) {
+       case "Escape":
+        return a.preventDefault(), this.resetRangeDraft(), void this.tctCalendarDismiss.emit();
+
+       case "ArrowUp":
+        r = i.addDays(e, -7), n = -1;
+        break;
+
+       case "ArrowDown":
+        r = i.addDays(e, 7), n = 1;
+        break;
+
+       case "ArrowLeft":
+        r = i.addDays(e, -1), n = -1;
+        break;
+
+       case "ArrowRight":
+        r = i.addDays(e, 1), n = 1;
+        break;
+
+       case "Home":
+        r = i.addDays(e, -e.getDay()), n = 1;
+        break;
+
+       case "End":
+        r = i.addDays(e, 6 - e.getDay()), n = -1;
+        break;
+
+       case "PageUp":
+        r = new Date(e.getFullYear() - (a.shiftKey ? 1 : 0), e.getMonth() - (a.shiftKey ? 0 : 1), e.getDate()), 
+        n = -1;
+        break;
+
+       case "PageDown":
+        r = new Date(e.getFullYear() + (a.shiftKey ? 1 : 0), e.getMonth() + (a.shiftKey ? 0 : 1), e.getDate()), 
+        n = 1;
+        break;
+
+       default:
+        return;
+      }
+      a.preventDefault();
+      const d = this.findValidNavigationDate(r, n);
+      d && this.activateDate(d);
+    }, this.onDateSelection = a => {
+      const t = a.target.closest("button[data-date]");
+      !t || t.disabled || this.disabled || this.readonly || this.selectDate(o(t.dataset.date));
+    }, this.onRangeCancel = () => {
+      this.resetRangeDraft(), this.tctCalendarCancel.emit();
+    }, this.onRangeCommit = () => {
+      !this.disabled && !this.readonly && this.rangeDraftStart && this.rangeDraftEnd && (this.isRangeValid(this.rangeDraftStart, this.rangeDraftEnd) ? (this.setRangeError(""), 
+      this.emitCommit({
+        rangeStart: c(this.rangeDraftStart),
+        rangeEnd: c(this.rangeDraftEnd)
+      })) : this.setRangeError(this.rangeValidationError));
+    };
+  }
+  // #endregion
+  // #region Component Lifecycle Events
+  connectedCallback() {
+    this.resetCalendarSession();
+  }
+  // #endregion
+  // #region Listeners
+  focusHandler(a) {
+    var t;
+    a.target === a.currentTarget && this.focusDate((null === (t = a.detail) || void 0 === t ? void 0 : t.value) || this.rovingDate);
+  }
+  // #endregion
+  // #region Public Methods API
+  /** Moves the visible month to the provided date and focuses that day. */
+  async focusDate(a) {
+    const t = "string" == typeof a ? o(a) : a;
+    i.isValid(t) && (this.activeDate = t, this.goToMonthYear(t.getMonth(), t.getFullYear()), 
+    requestAnimationFrame((() => this.focusRenderedDate(t))));
+  }
+  /** Selects the provided date when it satisfies the calendar constraints. */  async setValue(a) {
+    const t = "string" == typeof a ? o(a) : a;
+    i.isValid(t) && this.isDateValid(t) && this.selectDate(t);
+  }
+  // #endregion
+  // #region Watchers
+  constraintsChanged() {
+    this.setRangeError("");
+  }
+  modeChanged() {
+    this.resetCalendarSession();
+  }
+  openChanged(a) {
+    a && this.resetCalendarSession();
+  }
+  rangeChanged() {
+    this.isRangeMode && this.resetCalendarSession();
+  }
+  valueChanged() {
+    this.isRangeMode || this.resetCalendarSession();
+  }
+  // #endregion
+  // #region Local Methods
+  get constraints() {
+    return {
+      cutoffTime: this.cutoffTime,
+      daysOfWeekChecksum: this.daysOfWeekChecksum,
+      endDate: this.endDate,
+      invalidDates: this.invalidDates,
+      startDate: this.startDate,
+      validDates: this.validDates
+    };
+  }
+  get currentWeeks() {
+    return this.dateList.reduce(((a, t, e) => {
+      const r = Math.floor(e / 7);
+      return a[r] || (a[r] = []), a[r].push(t), a;
+    }), []);
+  }
+  get dateList() {
+    const {monthIndex: a, selectedYear: t} = this.selectedMonthYear, e = new Date(t, a, 1), r = new Date(t, a + 1, 0).getDate(), n = 7 * Math.ceil((e.getDay() + r) / 7), d = this.actionSheet ? 42 : n, s = new Date(t, a, 1 - e.getDay());
+    return Array.from({
+      length: d
+    }, ((t, e) => {
+      const r = i.addDays(s, e), n = r.getMonth() !== a, d = this.rangeDraftStart, o = this.rangeDraftEnd || this.rangeHoverDate, c = d && o && d.getTime() > o.getTime() ? o : d, l = d && o && d.getTime() > o.getTime() ? d : o, h = this.isRangeMode && !!c && i.isSameDay(r, c), p = this.isRangeMode && !!l && i.isSameDay(r, l), v = this.isRangeMode ? h || p : !!this.selectedDate && i.isSameDay(r, this.selectedDate), g = this.isRangeMode && !!c && !!l && r.getTime() > c.getTime() && r.getTime() < l.getTime(), f = i.isSameDay(r, new Date), b = this.isDateValid(r), u = [ "cal-day" ];
+      return n && u.push("is-outside"), g && u.push("in-range"), v && u.push("is-selected"), 
+      h && u.push("range-start"), (p || h && !l) && u.push("range-end"), f && u.push("is-today"), 
+      b || u.push("is-disabled"), {
+        classList: u.join(" "),
+        date: r,
+        isOutside: n,
+        isSelected: v,
+        isToday: f,
+        isValid: b
+      };
+    }));
+  }
+  get isRangeMode() {
+    return "range" === this.mode || "range-typeable" === this.mode;
+  }
+  get normalizedDisplayFormat() {
+    return l(this.displayFormat);
+  }
+  get rangeConfirmDisabled() {
+    return !this.rangeDraftStart || !this.rangeDraftEnd;
+  }
+  get rangeEndDate() {
+    const a = o(this.rangeEnd);
+    return i.isValid(a) ? a : void 0;
+  }
+  get rangeSummary() {
+    return this.rangeDraftStart && this.rangeDraftEnd ? `${this.formatRangeDate(this.rangeDraftStart)} – ${this.formatRangeDate(this.rangeDraftEnd)}` : this.rangeDraftStart ? `${this.formatRangeDate(this.rangeDraftStart)} – ${h("tecton.element.datePicker.range.selectEnd")}` : h("tecton.element.datePicker.range.selectStart");
+  }
+  get rangeValidationError() {
+    return h("tecton.element.datePicker.validation.rangeUnavailable");
+  }
+  get rovingDate() {
+    const {monthIndex: a, selectedYear: t} = this.selectedMonthYear, e = [ this.activeDate, this.isRangeMode ? this.rangeDraftStart : this.selectedDate ];
+    for (const r of e) if ((null == r ? void 0 : r.getMonth()) === a && (null == r ? void 0 : r.getFullYear()) === t) return r;
+    const r = new Date;
+    return r.getMonth() === a && r.getFullYear() === t ? r : new Date(t, a, 1);
+  }
+  get selectedDate() {
+    const a = o(this.isRangeMode ? this.rangeStart : this.value);
+    return i.isValid(a) ? a : void 0;
+  }
+  get title() {
+    const {monthIndex: a, selectedYear: t} = this.selectedMonthYear;
+    return new Intl.DateTimeFormat(this.locale, {
+      month: "long",
+      year: "numeric"
+    }).format(new Date(t, a, 1));
+  }
+  activateDate(a) {
+    this.activeDate = a, this.goToMonthYear(a.getMonth(), a.getFullYear()), requestAnimationFrame((() => this.focusRenderedDate(a)));
+  }
+  emitCommit(a) {
+    this.tctCalendarCommit.emit(a), this.tctChange.emit(a);
+  }
+  findValidNavigationDate(a, t) {
+    let e = a;
+    for (let a = 0; a < 366; a++) {
+      if (this.isDateValid(e)) return e;
+      e = i.addDays(e, t);
+    }
+  }
+  focusRenderedDate(a) {
+    var t, e, r;
+    null === (r = null === (e = null === (t = this.hostElement) || void 0 === t ? void 0 : t.shadowRoot) || void 0 === e ? void 0 : e.querySelector(`button[data-date="${c(a)}"]`)) || void 0 === r || r.focus();
+  }
+  formatRangeDate(a) {
+    return this.displayFormat ? p(a, this.normalizedDisplayFormat) : new Intl.DateTimeFormat(this.locale, {
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit"
+    }).format(a);
+  }
+  goToMonthYear(a, t) {
+    const e = new Date(t, a, 1);
+    this.selectedMonthYear = {
+      monthIndex: e.getMonth(),
+      selectedYear: e.getFullYear()
+    };
+  }
+  isDateValid(a) {
+    return v(a, this.constraints);
+  }
+  isRangeValid(a, t) {
+    return g(a, t, this.constraints);
+  }
+  onNavigate(a) {
+    const {monthIndex: t, selectedYear: e} = this.selectedMonthYear, r = {
+      previousYear: [ t, e - 1 ],
+      previousMonth: [ t - 1, e ],
+      nextMonth: [ t + 1, e ],
+      nextYear: [ t, e + 1 ]
+    };
+    this.goToMonthYear(...r[a]);
+  }
+  resetCalendarSession() {
+    const a = this.selectedDate;
+    this.activeDate = a, this.selectedMonthYear = f(a), this.resetRangeDraft();
+  }
+  resetRangeDraft() {
+    if (this.setRangeError(""), this.rangeHoverDate = void 0, !this.selectedDate || !this.rangeEndDate) return this.rangeDraftStart = void 0, 
+    void (this.rangeDraftEnd = void 0);
+    [this.rangeDraftStart, this.rangeDraftEnd] = [ this.selectedDate, this.rangeEndDate ].sort(((a, t) => a.getTime() - t.getTime()));
+  }
+  selectDate(a) {
+    if (this.isDateValid(a)) {
+      if (this.activeDate = a, this.isRangeMode) return this.setRangeError(""), !this.rangeDraftStart || this.rangeDraftEnd ? (this.rangeDraftStart = a, 
+      this.rangeDraftEnd = void 0) : a.getTime() < this.rangeDraftStart.getTime() ? (this.rangeDraftEnd = this.rangeDraftStart, 
+      this.rangeDraftStart = a) : this.rangeDraftEnd = a, this.rangeHoverDate = void 0, 
+      this.goToMonthYear(a.getMonth(), a.getFullYear()), void requestAnimationFrame((() => this.focusRenderedDate(a)));
+      this.goToMonthYear(a.getMonth(), a.getFullYear()), this.emitCommit({
+        value: c(a)
+      });
+    }
+  }
+  setRangeError(a) {
+    this.rangeError !== a && (this.rangeError = a, this.tctCalendarError.emit(a));
+  }
+  // #endregion
+  // #region Render Methods
+  renderNavigation() {
+    return [ e("div", {
+      class: "cal-nav-controls cal-nav-controls-left"
+    }, this.renderNavigationButton("previousYear"), this.renderNavigationButton("previousMonth")), e("div", {
+      class: "cal-nav-title",
+      id: "date-picker-label",
+      "aria-live": "polite"
+    }, this.title), e("div", {
+      class: "cal-nav-controls cal-nav-controls-right"
+    }, this.renderNavigationButton("nextMonth"), this.renderNavigationButton("nextYear")) ];
+  }
+  renderNavigationButton(a) {
+    const t = "previousYear" === a || "nextYear" === a, r = "previousYear" === a || "previousMonth" === a;
+    return e("q2-btn", {
+      class: `cal-nav-btn ${a}`,
+      "hide-label": !0,
+      label: n(`tecton.element.calendar.${a}`),
+      onTctClick: () => this.onNavigate(a),
+      "test-id": `${a}Button`
+    }, e("q2-icon", {
+      type: `chevron-${t ? "double-" : ""}${r ? "left" : "right"}`
+    }));
+  }
+  render() {
+    const a = !this.actionSheet && "up" === this.direction, t = this.rovingDate, r = this.rangeValidationError;
+    return e("div", {
+      key: "84c278bd6817625fcf5f70528000edcc84d116a6",
+      class: `cal-panel direction-${a ? "up" : "down"}${this.actionSheet ? " is-action-sheet" : ""}`,
+      role: this.actionSheet ? void 0 : "dialog",
+      "aria-label": this.actionSheet ? void 0 : h(this.accessibleLabel || this.calendarLabel || "Choose a date")
+    }, this.calendarLabel && !this.actionSheet && e("p", {
+      key: "9a466d3509ed7ce45949039cfa11ce8485c4e278",
+      class: "calendar-label"
+    }, h(this.calendarLabel)), !a && e("div", {
+      key: "a8c6ef4c4098c81bb79cd2ca450f38c56c99c51d",
+      class: "cal-nav"
+    }, this.renderNavigation()), e("div", {
+      key: "45e7f43ee502ea2c19049112860b3690313f53d5",
+      class: "cal-grid",
+      role: "grid",
+      "aria-labelledby": "date-picker-label"
+    }, e("div", {
+      key: "2a1a4caebfb72b601b9dd282550b519a3f610329",
+      role: "rowgroup"
+    }, e("div", {
+      key: "6187b5b5b7391e389a4af9403a2b8c63f9606e35",
+      class: "cal-row cal-weekdays",
+      role: "row"
+    }, this.dayAbbrStrings.map(((a, t) => e("div", {
+      class: "cal-dow",
+      role: "columnheader",
+      "aria-label": this.dayStrings[t]
+    }, a))))), e("div", {
+      key: "f2c274adc93798dd8c20762a09fcc95bcb77992f",
+      class: "cal-days",
+      role: "rowgroup",
+      onClick: this.onDateSelection,
+      onKeyDown: this.onDateKeydown,
+      onMouseLeave: this.onDateHoverEnd
+    }, this.currentWeeks.map((a => e("div", {
+      class: "cal-row",
+      role: "row"
+    }, a.map((a => e("div", {
+      role: "gridcell",
+      "aria-selected": `${a.isSelected}`
+    }, e("button", {
+      type: "button",
+      class: a.classList,
+      "data-date": c(a.date),
+      disabled: !a.isValid,
+      tabindex: i.isSameDay(a.date, t) ? 0 : -1,
+      "aria-disabled": a.isValid ? void 0 : "true",
+      "aria-current": a.isToday ? "date" : void 0,
+      "aria-label": b(a.date),
+      onMouseEnter: this.onDateHover
+    }, a.date.getDate()))))))))), a && e("div", {
+      key: "14a8abe8669e403c4745eaf256783f37caf7fc43",
+      class: "cal-nav"
+    }, this.renderNavigation()), this.disclaimer && e("div", {
+      key: "f3ab74f66fca52d2499f52d20fdfd8a86cc154bc",
+      class: "calendar-disclaimer"
+    }, h(this.disclaimer)), this.isRangeMode && e("div", {
+      key: "276c870f99275bb582b250ed1a3632f5e95c17c3",
+      class: "cal-footer"
+    }, e("div", {
+      key: "1d753811c31360780fae551cb49c190561e292ed",
+      class: "cal-footer-summary"
+    }, e("q2-message", {
+      key: "9db690009d1efa45b4e852e16a5b47ab0262c751",
+      class: "is-placeholder",
+      appearance: "minimal",
+      type: "error",
+      "aria-hidden": "true"
+    }, r), e("span", {
+      key: "c1b41f3faf70207aa8dc65c8812dc91737cfe590"
+    }, this.rangeSummary)), e("div", {
+      key: "6af2f2741335e07737e61936cd480e90eb38918b",
+      class: "cal-footer-actions"
+    }, e("q2-btn", {
+      key: "62e02cab1e110559304475a1d0c29d1fc65f1d93",
+      intent: "workflow-escape",
+      size: "small",
+      label: h("tecton.element.datePicker.action.cancel"),
+      onTctClick: this.onRangeCancel
+    }), e("q2-btn", {
+      key: "14f1286e80e92b42168e3e6abe9718d40b4ded59",
+      intent: "workflow-primary",
+      size: "small",
+      label: h("tecton.element.datePicker.action.confirm"),
+      disabled: this.rangeConfirmDisabled,
+      onTctClick: this.onRangeCommit
+    }))));
+  }
+  get hostElement() {
+    return r(this);
+  }
+  static get watchers() {
+    return {
+      cutoffTime: [ {
+        constraintsChanged: 0
+      } ],
+      daysOfWeekChecksum: [ {
+        constraintsChanged: 0
+      } ],
+      endDate: [ {
+        constraintsChanged: 0
+      } ],
+      invalidDates: [ {
+        constraintsChanged: 0
+      } ],
+      startDate: [ {
+        constraintsChanged: 0
+      } ],
+      validDates: [ {
+        constraintsChanged: 0
+      } ],
+      mode: [ {
+        modeChanged: 0
+      } ],
+      open: [ {
+        openChanged: 0
+      } ],
+      rangeEnd: [ {
+        rangeChanged: 0
+      } ],
+      rangeStart: [ {
+        rangeChanged: 0
+      } ],
+      value: [ {
+        valueChanged: 0
+      } ]
+    };
+  }
+};
+
+u.style = '*{box-sizing:border-box}*:active{outline:none}*:focus-visible{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}@container style(--t-prefers-motion: "reduced"){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}@container (not style(--t-prefers-motion: "normal")) and (not style(--t-prefers-motion: "reduced")){@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}}:host{box-sizing:border-box;display:block}:host[hidden]{display:none}.cal-panel{box-sizing:border-box;width:var(--comp-date-calendar-width, var(--tct-date-calendar-width, 360px));min-width:0;padding:var(--tct-date-calendar-padding, var(--app-scale-4x, 20px));border-radius:var(--tct-date-calendar-border-radius, var(--app-border-radius-1, 4px));background:var(--tct-date-calendar-background, var(--t-base, #ffffff));box-shadow:var(--tct-date-calendar-box-shadow, var(--app-shadow-3))}.cal-panel.is-action-sheet{width:100%;padding:0;border-radius:0;background:transparent;box-shadow:none}.calendar-label{margin:0 0 var(--tct-date-calendar-label-margin-bottom, var(--tct-scale-2, var(--app-scale-2x, 10px)));color:var(--tct-date-calendar-label-font-color, var(--tct-text, var(--t-text, #4d4d4d)));font-size:var(--tct-date-calendar-label-font-size, var(--tct-font-size, var(--app-font-size, var(--const-px-14, 14px))));font-weight:var(--tct-date-calendar-label-font-weight, var(--tct-font-weight-semibold, 600))}.cal-nav{display:grid;grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);align-items:center;margin-bottom:var(--tct-date-calendar-navigation-margin-bottom, var(--app-scale-3x, 15px))}.cal-nav-controls{display:flex;gap:var(--tct-date-calendar-navigation-gap, 2px)}.cal-nav-controls-left{justify-self:start}.cal-nav-controls-right{justify-self:end}.cal-panel.direction-up .cal-nav{margin-top:var(--tct-date-calendar-navigation-margin-top, var(--app-scale-3x, 15px));margin-bottom:0}.cal-nav-btn{width:var(--tct-date-calendar-navigation-button-width, 40px);height:var(--tct-date-calendar-navigation-button-height, 40px);margin:0;--tct-btn-icon-width:var(--tct-date-calendar-navigation-button-width, 40px);--tct-btn-icon-height:var(--tct-date-calendar-navigation-button-height, 40px);--tct-btn-icon-size:var(--tct-date-calendar-navigation-icon-size, 22px);--tct-btn-icon-border-radius:var(--tct-date-calendar-navigation-button-border-radius, var(--app-border-radius-1, 4px))}.cal-nav-btn q2-icon{width:var(--tct-date-calendar-navigation-icon-size, 22px);min-width:var(--tct-date-calendar-navigation-icon-size, 22px);height:var(--tct-date-calendar-navigation-icon-size, 22px)}.cal-nav-title{overflow:hidden;color:var(--tct-date-calendar-month-font-color, var(--tct-text, var(--t-text, #4d4d4d)));font-size:var(--tct-date-calendar-month-font-size, var(--const-px-15, 15px));font-weight:var(--tct-date-calendar-month-font-weight, 700);text-align:center;text-overflow:ellipsis;white-space:nowrap}.cal-row{display:grid;grid-template-columns:repeat(7, 44px);gap:var(--tct-date-calendar-grid-gap, 2px);justify-content:center}.cal-days{display:flex;flex-direction:column;gap:var(--tct-date-calendar-grid-gap, 2px)}.cal-dow{padding:var(--tct-date-calendar-weekday-padding, 6px 0 10px);color:var(--tct-date-calendar-day-heading-font-color, var(--tct-gray-8, var(--t-gray-8, #747474)));font-size:var(--tct-date-calendar-day-heading-font-size, var(--app-font-size-small, var(--const-px-12, 12px)));font-weight:var(--tct-date-calendar-day-heading-font-weight, 600);text-align:center}[role=gridcell]{min-width:0}.cal-day{box-sizing:border-box;display:flex;width:100%;height:var(--tct-date-calendar-day-height, 44px);padding:0;align-items:center;justify-content:center;border:0;border-radius:var(--tct-date-calendar-day-border-radius, var(--app-border-radius-2, 8px));background:transparent;color:var(--tct-date-calendar-day-font-color, var(--t-gray-1, #0d0d0d));cursor:pointer;font:inherit;font-size:var(--tct-date-calendar-day-font-size, var(--app-font-size, var(--const-px-14, 14px)))}.cal-day:hover:not(:disabled):not(.is-selected){background:var(--tct-date-calendar-day-hover-background, var(--t-gray-14, #f2f2f2))}.cal-day:focus-visible{background:var(--tct-date-calendar-background, var(--t-base, #ffffff));outline:0;box-shadow:var(--tct-date-calendar-day-focus-ring, var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc))}.cal-day.is-outside{color:var(--tct-date-calendar-day-outside-font-color, var(--t-gray-8, #747474))}.cal-day:disabled{color:var(--tct-date-calendar-day-disabled-font-color, var(--t-gray-11, #cccccc));cursor:not-allowed}.cal-day.is-today{color:var(--tct-date-calendar-today-color, var(--t-primary, #6a4a9e));font-weight:var(--tct-date-calendar-today-font-weight, 600);box-shadow:inset 0 0 0 2px var(--tct-date-calendar-today-color, var(--t-primary, #6a4a9e))}.cal-day.is-selected{border-radius:var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px));background:var(--tct-date-calendar-day-selected-background, var(--t-primary, #6a4a9e));color:var(--tct-date-calendar-day-selected-font-color, var(--t-primary-text, #ffffff));font-weight:var(--tct-date-calendar-day-selected-font-weight, 700);box-shadow:none}.cal-day.in-range{border-radius:0;background:var(--tct-date-calendar-range-background, var(--t-primary-t4, #eee8f5));color:var(--tct-date-calendar-range-font-color, var(--t-primary, #6a4a9e))}.cal-day.in-range.is-disabled{background:var(--tct-date-calendar-range-disabled-background, var(--const-stoplight-alert, #d20a0a));color:var(--t-base, #ffffff)}.cal-day.range-start{border-radius:var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px)) 0 0 var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px))}.cal-day.range-end{border-radius:0 var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px)) var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px)) 0}.cal-day.range-start.range-end{border-radius:var(--tct-date-calendar-day-selected-border-radius, var(--app-border-radius-1, 4px))}.calendar-disclaimer{margin-top:var(--tct-date-calendar-disclaimer-margin-top, var(--app-scale-3x, 15px));padding-top:var(--tct-date-calendar-disclaimer-padding-top, var(--app-scale-2x, 10px));border-top:1px solid var(--tct-date-calendar-disclaimer-border-color, var(--t-gray-13, #e6e6e6));color:var(--tct-date-calendar-disclaimer-font-color, var(--t-text, #4d4d4d));font-size:var(--tct-date-calendar-disclaimer-font-size, var(--app-font-size-small, var(--const-px-12, 12px)))}.cal-footer{display:grid;gap:var(--tct-date-calendar-footer-gap, var(--app-scale-2x, 10px));margin-top:var(--tct-date-calendar-footer-margin-top, var(--app-scale-3x, 15px));padding-top:var(--tct-date-calendar-footer-padding-top, var(--app-scale-3x, 15px));border-top:1px solid var(--tct-date-calendar-footer-border-color, var(--t-gray-13, #e6e6e6))}.cal-footer-summary{display:grid;color:var(--tct-date-calendar-footer-font-color, var(--t-primary, #6a4a9e));font-size:var(--tct-date-calendar-footer-font-size, var(--app-font-size-small, var(--const-px-12, 12px)));font-weight:var(--tct-date-calendar-footer-font-weight, 600)}.cal-footer-summary>*{grid-area:1/1}.cal-footer-summary q2-message{color:var(--t-text, #4d4d4d)}.cal-footer-summary>span{display:flex;align-items:center}.cal-footer-summary q2-message.is-placeholder{visibility:hidden;pointer-events:none}.cal-footer-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:var(--tct-date-calendar-footer-action-gap, var(--app-scale-1x, 5px));padding:var(--tct-date-calendar-footer-action-padding, var(--app-scale-1x, 5px))}.cal-footer-actions q2-btn{flex:0 0 auto;width:auto}@media (max-width: 768px){:host{max-width:none}.cal-panel{width:var(--comp-date-calendar-width, min(100%, 100vw - var(--tct-date-calendar-mobile-gutter, 24px) - var(--tct-date-calendar-mobile-gutter, 24px), var(--tct-date-calendar-mobile-max-width, 420px)));min-width:0}.cal-row{grid-template-columns:repeat(7, minmax(44px, 1fr))}.cal-day{height:auto;aspect-ratio:1}}@media (max-width: 360px){.cal-nav-btn{height:var(--tct-date-calendar-mobile-navigation-button-height, 32px);--tct-btn-icon-height:var(--tct-date-calendar-mobile-navigation-button-height, 32px)}}';
+
+export { u as q2_date_calendar }