@vonage/vivid 4.31.0 → 5.1.0

package/bundled/time-selection-picker.template.js

@@ -0,0 +1,575 @@
+import { h as S, V as N, o as h, d as H, a as f, n as C, O as R, b as q, D as V, v as j } from "./vivid-element.js";
+import { i as B, P as z } from "./picker-field.template.js";
+import { S as U } from "./single-value-picker.js";
+import { s as W } from "./scrollIntoView.js";
+import { w as O } from "./when.js";
+import { r as K } from "./repeat.js";
+import { c as G } from "./class-names.js";
+import { L as J } from "./localized.js";
+import { r as Q } from "./ref.js";
+const w = (e) => {
+  const t = e.split(":");
+  if (t.length !== 3)
+    return !1;
+  const [o, r, i] = t;
+  if (o.length !== 2 || r.length !== 2 || i.length !== 2)
+    return !1;
+  const n = parseInt(o, 10), s = parseInt(r, 10), a = parseInt(i, 10);
+  return !(isNaN(n) || isNaN(s) || isNaN(a) || n < 0 || n > 23 || s < 0 || s > 59 || a < 0 || a > 59);
+}, P = (e) => Number.parseInt(e, 10), d = (e) => e.toString().padStart(2, "0"), l = (e) => {
+  const [t, o, r] = e.split(":"), i = P(t), n = P(o), s = P(r);
+  return {
+    hourStr: t,
+    hours: i,
+    minuteStr: o,
+    minutes: n,
+    secondStr: r,
+    seconds: s,
+    meridiem: i < 12 ? "AM" : "PM"
+  };
+}, xe = (e, t) => e > t ? 1 : e < t ? -1 : 0, M = (e) => e % 12 || 12, X = (e, t) => e === "AM" && t < 12 || e === "PM" && t >= 12, Y = (e, t, o) => {
+  const r = [], i = e ? l(e).hours : 0, n = t ? l(t).hours : 23;
+  for (let s = i; s <= n; s++)
+    o && !X(o, s) || r.push({
+      value: d(s),
+      label: d(o ? M(s) : s)
+    });
+  return r;
+}, Z = (e, t, o, r) => {
+  const i = [];
+  let n = 0, s = 59;
+  if (o) {
+    const { hourStr: a, minutes: c } = l(o);
+    t && l(t).hourStr === a && (n = c);
+  }
+  if (r) {
+    const { hourStr: a, minutes: c } = l(r);
+    t && l(t).hourStr === a && (s = c);
+  }
+  for (let a = n; a <= s; a += Math.max(1, e ?? 1)) {
+    const c = d(a);
+    i.push({
+      value: c,
+      label: c
+    });
+  }
+  return i;
+}, ee = (e, t, o, r) => {
+  const i = [];
+  let n = 0, s = 59;
+  if (o) {
+    const a = l(o);
+    t && (l(t).hourStr === a.hourStr && l(t).minuteStr) === a.minuteStr && (n = a.seconds);
+  }
+  if (r) {
+    const a = l(r);
+    t && (l(t).hourStr === a.hourStr && l(t).minuteStr) === a.minuteStr && (s = a.seconds);
+  }
+  for (let a = n; a <= s; a += Math.max(1, e)) {
+    const c = d(a);
+    i.push({
+      value: c,
+      label: c
+    });
+  }
+  return i;
+}, te = (e, t) => {
+  const o = [];
+  return (e ? l(e).meridiem === "PM" : !1) || o.push({
+    value: "AM",
+    label: "AM"
+  }), (t ? l(t).meridiem === "AM" : !1) || o.push({
+    value: "PM",
+    label: "PM"
+  }), o;
+}, x = {
+  id: "hours",
+  getLabel: (e) => e.locale.timePicker.hoursLabel,
+  getOptions: (e) => Y(
+    e.min,
+    e.max,
+    e.clock === "12h" ? k.getSelectedOptionValue(e) ?? k.getOptions(e)[0].value : void 0
+  ),
+  getSelectedOptionValue: (e) => e.value ? l(e.value).hourStr : void 0,
+  updatedValue: (e, t) => {
+    if (e.value) {
+      const { minuteStr: o, secondStr: r } = l(e.value);
+      return `${t}:${o}:${r}`;
+    } else
+      return `${t}:00:00`;
+  }
+}, y = {
+  id: "minutes",
+  getLabel: (e) => e.locale.timePicker.minutesLabel,
+  getOptions: (e) => Z(e.minutesStep, e.value, e.min, e.max),
+  getSelectedOptionValue: (e) => e.value ? l(e.value).minuteStr : void 0,
+  updatedValue: (e, t) => {
+    if (e.value) {
+      const { hourStr: o, secondStr: r } = l(e.value);
+      return `${o}:${t}:${r}`;
+    } else
+      return `00:${t}:00`;
+  }
+}, $ = {
+  id: "seconds",
+  getLabel: (e) => e.locale.timePicker.secondsLabel,
+  getOptions: (e) => ee(e.secondsStep, e.value, e.min, e.max),
+  getSelectedOptionValue: (e) => e.value ? l(e.value).secondStr : void 0,
+  updatedValue: (e, t) => {
+    if (e.value) {
+      const { hourStr: o, minuteStr: r } = l(e.value);
+      return `${o}:${r}:${t}`;
+    } else
+      return `00:00:${t}`;
+  }
+}, k = {
+  id: "meridies",
+  getLabel: (e) => e.locale.timePicker.meridiesLabel,
+  getOptions: (e) => te(e.min, e.max),
+  getSelectedOptionValue: (e) => e.value ? l(e.value).meridiem : void 0,
+  updatedValue: (e, t) => {
+    if (e.value) {
+      const { hours: o, minuteStr: r, secondStr: i } = l(e.value);
+      let n = o;
+      return t === "AM" && o >= 12 ? n -= 12 : t === "PM" && o < 12 && (n += 12), `${d(n)}:${r}:${i}`;
+    } else
+      return t === "AM" ? "00:00:00" : "12:00:00";
+  }
+}, E = (e) => e.secondsStep !== void 0, I = (e) => e.clock === "12h", oe = (e, t, o) => {
+  L(e, t.updatedValue(e, o)), m(e, t.id, o, "start");
+  const n = e.shadowRoot.querySelector(`#${t.id}`)?.closest(".picker-wrapper")?.nextElementSibling?.querySelector(
+    ".picker"
+  );
+  n ? n.focus() : e.$emit("last-column-selected", void 0, {
+    bubbles: !1
+  });
+}, re = (e, t, o) => {
+  const r = t.getOptions(e), i = t.getSelectedOptionValue(e), n = {
+    ArrowUp: -1,
+    ArrowDown: 1
+  }[o.key];
+  if (n) {
+    o.preventDefault();
+    const s = r.findIndex((_) => _.value === i), c = ((s === -1 ? 0 : s + n) + r.length) % r.length, u = r[c].value;
+    L(e, t.updatedValue(e, u)), m(e, t.id, u, "nearest"), e._clearFocusedClasses();
+  }
+  return !0;
+}, m = (e, t, o, r) => {
+  const i = e.shadowRoot.querySelector(
+    `#${t}-${o}`
+  );
+  i && W(i, i.parentElement, r);
+}, ie = (e, t) => {
+  if (t.key === "Tab") {
+    const o = e.shadowRoot.querySelectorAll(".picker"), r = t.shiftKey ? o[0] : o[o.length - 1];
+    e.shadowRoot.activeElement !== r && B(t), e._applyFocusedClass();
+  }
+  return !0;
+}, L = (e, t) => {
+  e.$emit("change", t, { bubbles: !1, composed: !1 });
+}, b = (e) => S`<div class="picker-wrapper">
+		<ul
+			id="${e.id}"
+			class="picker"
+			role="listbox"
+			tabindex="0"
+			aria-label="${e.getLabel}"
+			aria-activedescendant="${(t) => e.getSelectedOptionValue(t) ? `${e.id}-${e.getSelectedOptionValue(t)}` : void 0}"
+			@keydown="${(t, o) => re(t, e, o.event)}"
+		>
+			${K(
+  (t) => e.getOptions(t),
+  S`<li
+					id="${(t) => `${e.id}-${t.value}`}"
+					class="${(t, o) => G("option", [
+    "selected",
+    e.getSelectedOptionValue(o.parent) === t.value
+  ])}"
+					aria-selected="${(t, o) => e.getSelectedOptionValue(o.parent) === t.value}"
+					role="option"
+					@click="${(t, o) => oe(o.parent, e, t.value)}"
+				>
+					${(t) => t.label}
+				</li>`
+)}
+		</ul>
+	</div>`, ne = () => S`<div
+		class="time-pickers"
+		@keydown="${(e, { event: t }) => ie(e, t)}"
+		@focusout="${(e) => e._onFocusOut()}"
+		@pointerdown="${(e) => e._onPointerDown()}"
+	>
+		${b(x)} ${b(y)}
+		${O(E, b($))}
+		${O(I, b(k))}
+	</div>`;
+var se = Object.defineProperty, v = (e, t, o, r) => {
+  for (var i = void 0, n = e.length - 1, s; n >= 0; n--)
+    (s = e[n]) && (i = s(t, o, i) || i);
+  return i && se(t, o, i), i;
+};
+class p extends J(N) {
+  constructor() {
+    super(...arguments), this.minutesStep = 1, this.clock = "24h", this.focusedPickerClass = "focused", this._onFocusOut = () => {
+      this._clearFocusedClasses();
+    }, this._onPointerDown = () => {
+      this._clearFocusedClasses();
+    };
+  }
+  valueChanged(t, o) {
+    o !== void 0 && !w(o) && (this.value = void 0);
+  }
+  scrollSelectedOptionsToTop() {
+    x.getSelectedOptionValue(this) && m(
+      this,
+      "hours",
+      x.getSelectedOptionValue(this),
+      "start"
+    ), y.getSelectedOptionValue(this) && m(
+      this,
+      "minutes",
+      y.getSelectedOptionValue(this),
+      "start"
+    ), E(this) && $.getSelectedOptionValue(this) && m(
+      this,
+      "seconds",
+      $.getSelectedOptionValue(this),
+      "start"
+    ), I(this) && k.getSelectedOptionValue(this) && m(
+      this,
+      "meridies",
+      k.getSelectedOptionValue(this),
+      "start"
+    );
+  }
+  focus(t) {
+    this.shadowRoot.querySelector(
+      ".picker"
+    ).focus(t), this._applyFocusedClass();
+  }
+  /**
+   * @internal
+   * Apply 'focused' class to the wrapper element of an active picker
+   */
+  _applyFocusedClass() {
+    const t = this.shadowRoot.querySelectorAll(".picker");
+    requestAnimationFrame(() => {
+      const o = this.shadowRoot.activeElement;
+      t.forEach((r) => {
+        r === o ? r.parentElement?.classList.add(this.focusedPickerClass) : r.parentElement?.classList.remove(this.focusedPickerClass);
+      });
+    });
+  }
+  /**
+   * @internal
+   * Clear 'focused' classes from all pickers wrappers
+   */
+  _clearFocusedClasses() {
+    this.shadowRoot.querySelectorAll(".picker").forEach((o) => {
+      o.parentElement?.classList.remove(this.focusedPickerClass);
+    });
+  }
+}
+v([
+  h
+], p.prototype, "value");
+v([
+  h
+], p.prototype, "minutesStep");
+v([
+  h
+], p.prototype, "secondsStep");
+v([
+  h
+], p.prototype, "clock");
+v([
+  h
+], p.prototype, "min");
+v([
+  h
+], p.prototype, "max");
+const ae = ':host{display:inline-block}.time-pickers{display:flex;overflow:hidden;justify-content:center;padding:4px;block-size:calc(28px * var(--_inline-time-picker-num-options-visible) + 4px * (var(--_inline-time-picker-num-options-visible) - 1));gap:4px}.time-pickers .picker-wrapper{position:relative;display:flex;flex-direction:column;border-radius:4px}.time-pickers .picker-wrapper.focused:has(.picker:focus-visible){--focus-stroke-gap-color: transparent;--focus-inset: -2px;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}.time-pickers .picker{position:relative;display:flex;overflow:hidden scroll;flex-direction:column;padding:0 4px;border-radius:4px;margin:0 -4px;gap:4px;inline-size:50px;list-style:none;scrollbar-width:none}@media (hover: hover){.time-pickers .picker:hover{scrollbar-width:auto}}.time-pickers .picker:after{display:block;flex-shrink:0;block-size:calc(28px * (var(--_inline-time-picker-num-options-visible) - 1) + 4px * (var(--_inline-time-picker-num-options-visible) - 1 - 1));content:""}.time-pickers .picker:focus-visible{outline:none}.time-pickers .option{--_connotation-color-primary: var(--vvd-time-picker-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-firm: var(--vvd-time-picker-accent-firm, var(--vvd-color-canvas-text));--_connotation-color-faint: var(--vvd-time-picker-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-soft: var(--vvd-time-picker-accent-soft, var(--vvd-color-neutral-100));--_connotation-color-dim: var(--vvd-time-picker-accent-dim, var(--vvd-color-neutral-200));--_connotation-color-pale: var(--vvd-time-picker-accent-pale, var(--vvd-color-neutral-300))}.time-pickers .option{--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}@media (hover: hover){.time-pickers .option:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}}.time-pickers .option.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.time-pickers .option:active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.time-pickers .option.active:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}.time-pickers .option.selected:where(:not(.disabled,:disabled)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-soft);--_appearance-color-outline: transparent}@media (hover: hover){.time-pickers .option.selected:hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}}.time-pickers .option.selected.hover:where(:not(.disabled,:disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-firm);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.time-pickers .option.selected:disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: transparent}.time-pickers .option.selected.disabled{--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: transparent}.time-pickers .option{display:flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:4px;background-color:var(--_appearance-color-fill);block-size:28px;color:var(--_appearance-color-text);cursor:pointer;font:var(--vvd-typography-base);inline-size:50px}.time-pickers .picker-wrapper:not(.focused) .picker:focus-visible .option.selected{--focus-stroke-gap-color: transparent;box-shadow:0 0 0 4px color-mix(in srgb,var(--vvd-color-cta-500),transparent 85%),inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:1px solid var(--focus-stroke-color, var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset, 0px))}', ye = H(
+  "inline-time-picker",
+  p,
+  ne,
+  [],
+  {
+    styles: ae,
+    shadowOptions: {
+      delegatesFocus: !0
+    }
+  }
+), le = (e, t, o) => {
+  const r = l(e);
+  let n = `${d(
+    o ? M(r.hours) : r.hours
+  )}:${r.minuteStr}`;
+  return t && (n += `:${r.secondStr}`), o && (n += ` ${r.meridiem}`), n;
+}, T = (e) => e >= "0" && e <= "9", ce = (e, t) => {
+  const o = e.toLowerCase(), r = [];
+  let i;
+  for (let c = 0; c < o.length; c++) {
+    const u = o[c];
+    if (u === "a" && o[c + 1] === "m" && (c++, i = "AM"), u === "p" && o[c + 1] === "m" && (c++, i = "PM"), T(u)) {
+      let _ = u;
+      for (; T(o[c + 1]); )
+        c++, _ += o[c];
+      r.push(Number.parseInt(_, 10));
+    }
+  }
+  if (r.length === 0 || r.length > 3)
+    throw new Error("Invalid time format");
+  if (i && (r[0] < 1 || r[0] > 12))
+    throw new Error("Invalid time format");
+  (i || t) && r[0] === 12 && (r[0] = 0), i === "PM" && (r[0] = r[0] + 12);
+  const [n, s = 0, a = 0] = r;
+  if (n > 23 || s > 59 || a > 59)
+    throw new Error("Invalid value");
+  return [n, s, a].map(d).join(":");
+};
+var pe = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, g = (e, t, o, r) => {
+  for (var i = r > 1 ? void 0 : r ? ue(t, o) : t, n = e.length - 1, s; n >= 0; n--)
+    (s = e[n]) && (i = (r ? s(t, o, i) : s(i)) || i);
+  return r && i && pe(t, o, i), i;
+};
+const de = (e) => {
+  class t extends e {
+    constructor() {
+      super(...arguments), this.minutesStep = null, this.secondsStep = null, this.#t = {
+        handleChange: () => {
+          this.value && (this._presentationValue = this._toPresentationValue(this.value));
+        }
+      };
+    }
+    // --- Core ---
+    /**
+     * @internal
+     */
+    get _displaySeconds() {
+      return this.secondsStep !== null;
+    }
+    get _use12hClock() {
+      return this.clock ? this.clock === "12h" : this.locale.timePicker.defaultTo12HourClock;
+    }
+    /**
+     * @internal
+     */
+    get _timePlaceholder() {
+      let r = "hh:mm";
+      return this._displaySeconds && (r += ":ss"), this._use12hClock && (r += " aa"), r;
+    }
+    #t;
+    #e;
+    #o() {
+      this.#e = R.binding(
+        () => this._use12hClock,
+        this.#t
+      ), this.#e.observe(this, q);
+    }
+    #r() {
+      this.#e.disconnect();
+    }
+    /**
+     * @internal
+     */
+    connectedCallback() {
+      super.connectedCallback(), this.#o();
+    }
+    /**
+     * @internal
+     */
+    disconnectedCallback() {
+      super.disconnectedCallback(), this.#r();
+    }
+    // --- Picker button ---
+    /**
+     * @internal
+     */
+    _onPickerButtonClick() {
+      super._onPickerButtonClick(), this._popupOpen && (V.processUpdates(), this._inlineTimePickerEl.scrollSelectedOptionsToTop());
+    }
+    // --- Inline time picker ---
+    /**
+     * @internal
+     */
+    _onInlineTimePickerChange(r) {
+      this._updateValueDueToUserInteraction(
+        this._withUpdatedTime(r.detail),
+        !1
+      );
+    }
+    /**
+     * @internal
+     */
+    _onInlineTimePickerLastColumnSelected() {
+      this._closePopup();
+    }
+  }
+  return g([
+    f({ attribute: "minutes-step", converter: C })
+  ], t.prototype, "minutesStep", 2), g([
+    f({ attribute: "seconds-step", converter: C })
+  ], t.prototype, "secondsStep", 2), g([
+    f
+  ], t.prototype, "clock", 2), g([
+    j
+  ], t.prototype, "_use12hClock", 1), t;
+};
+var me = Object.defineProperty, A = (e, t, o, r) => {
+  for (var i = void 0, n = e.length - 1, s; n >= 0; n--)
+    (s = e[n]) && (i = s(t, o, i) || i);
+  return i && me(t, o, i), i;
+};
+const F = {
+  fromView: (e) => e && w(e) ? e : "",
+  toView(e) {
+    return e;
+  }
+};
+class D extends de(
+  U(z)
+) {
+  // --- Core ---
+  constructor() {
+    super(), this._isValidValue = w, this.min = "", this.max = "", this.proxy.type = "time", this.proxy.step = "1";
+  }
+  /**
+   * @internal
+   */
+  _toPresentationValue(t) {
+    return le(
+      t,
+      this._displaySeconds,
+      this._use12hClock
+    );
+  }
+  /**
+   * @internal
+   */
+  _parsePresentationValue(t) {
+    return ce(t, this._use12hClock);
+  }
+  /**
+   * @internal
+   */
+  get _timeValue() {
+    return this.value;
+  }
+  /**
+   * @internal
+   */
+  _withUpdatedTime(t) {
+    return t;
+  }
+  /**
+   * @internal
+   */
+  get _resolvedMinTime() {
+    return this.min || null;
+  }
+  /**
+   * @internal
+   */
+  get _resolvedMaxTime() {
+    return this.max || null;
+  }
+  /**
+   * @internal
+   */
+  minChanged(t, o) {
+    this.proxy instanceof HTMLInputElement && (this.proxy.min = o, this.validate());
+  }
+  /**
+   * @internal
+   */
+  maxChanged(t, o) {
+    this.proxy instanceof HTMLInputElement && (this.proxy.max = o, this.validate());
+  }
+  // --- Text field ---
+  /**
+   * @internal
+   */
+  get _textFieldPlaceholder() {
+    return this._timePlaceholder;
+  }
+  // --- Picker button ---
+  /**
+   * @internal
+   */
+  get _pickerButtonIcon() {
+    return "clock-line";
+  }
+  /**
+   * @internal
+   */
+  get _pickerButtonLabel() {
+    return this.value ? this.locale.timePicker.changeTimeLabel(
+      this._toPresentationValue(this.value)
+    ) : this.locale.timePicker.chooseTimeLabel;
+  }
+  /**
+   * @internal
+   */
+  _onPickerButtonClick() {
+    super._onPickerButtonClick(), this._popupOpen && (V.processUpdates(), this._focusableElsWithinDialog()[0]?.focus());
+  }
+  // --- Dialog ---
+  /**
+   * @internal
+   */
+  get _dialogLabel() {
+    return this.locale.timePicker.chooseTimeLabel;
+  }
+  /**
+   * @internal
+   */
+  _focusableElsWithinDialog() {
+    return this._dialogEl.querySelectorAll(
+      "#inline-time-picker, .vwc-button"
+    );
+  }
+  // --- Validation ---
+  /**
+   * @internal
+   */
+  _getCustomValidationError() {
+    return this._isPresentationValueInvalid() ? this.locale.timePicker.invalidTimeError : null;
+  }
+}
+A([
+  f({ converter: F })
+], D.prototype, "min");
+A([
+  f({ converter: F })
+], D.prototype, "max");
+const $e = (e, t) => {
+  const o = e.tagFor(p);
+  return S`
+		<${o}
+			id='inline-time-picker'
+			${Q("_inlineTimePickerEl")}
+			style="--_inline-time-picker-num-options-visible: ${() => t}"
+			tabindex='1'
+			:value='${(r) => r._timeValue || void 0}'
+			:clock='${(r) => r._use12hClock ? "12h" : "24h"}'
+			:min='${(r) => r._resolvedMinTime || void 0}'
+			:max='${(r) => r._resolvedMaxTime || void 0}'
+			:minutesStep='${(r) => r.minutesStep ?? 1}'
+			:secondsStep='${(r) => r.secondsStep ?? void 0}'
+			@change='${(r, i) => r._onInlineTimePickerChange(i.event)}'
+			@last-column-selected='${(r) => r._onInlineTimePickerLastColumnSelected()}'
+		>
+		</${o}>
+	`;
+};
+export {
+  de as T,
+  F as V,
+  $e as a,
+  ye as b,
+  xe as c,
+  D as d,
+  le as f,
+  w as i,
+  ce as p
+};

package/bundled/vivid-element.cjs

@@ -0,0 +1 @@
+"use strict";const v=function(){if(typeof globalThis<"u")return globalThis;if(typeof global<"u")return global;if(typeof self<"u")return self;if(typeof window<"u")return window;try{return new Function("return this")()}catch{return{}}}();v.trustedTypes===void 0&&(v.trustedTypes={createPolicy:(s,e)=>e});const ee={configurable:!1,enumerable:!1,writable:!1};v.FAST===void 0&&Reflect.defineProperty(v,"FAST",Object.assign({value:Object.create(null)},ee));const S=v.FAST;if(S.getById===void 0){const s=Object.create(null);Reflect.defineProperty(S,"getById",Object.assign({value(e,t){let i=s[e];return i===void 0&&(i=t?s[e]=t():null),i}},ee))}const ge=Object.freeze([]);function R(){const s=new WeakMap;return function(e){let t=s.get(e);if(t===void 0){let i=Reflect.getPrototypeOf(e);for(;t===void 0&&i!==null;)t=s.get(i),i=Reflect.getPrototypeOf(i);t=t===void 0?[]:t.slice(0),s.set(e,t)}return t}}const M=v.FAST.getById(1,()=>{const s=[],e=[];function t(){if(e.length)throw e.shift()}function i(o){try{o.call()}catch(a){e.push(a),setTimeout(t,0)}}function n(){let a=0;for(;a<s.length;)if(i(s[a]),a++,a>1024){for(let c=0,l=s.length-a;c<l;c++)s[c]=s[c+a];s.length-=a,a=0}s.length=0}function r(o){s.length<1&&v.requestAnimationFrame(n),s.push(o)}return Object.freeze({enqueue:r,process:n})}),te=v.trustedTypes.createPolicy("fast-html",{createHTML:s=>s});let E=te;const y=`fast-${Math.random().toString(36).substring(2,8)}`,se=`${y}{`,_=`}${y}`,u=Object.freeze({supportsAdoptedStyleSheets:Array.isArray(document.adoptedStyleSheets)&&"replace"in CSSStyleSheet.prototype,setHTMLPolicy(s){if(E!==te)throw new Error("The HTML policy can only be set once.");E=s},createHTML(s){return E.createHTML(s)},isMarker(s){return s&&s.nodeType===8&&s.data.startsWith(y)},extractDirectiveIndexFromMarker(s){return parseInt(s.data.replace(`${y}:`,""))},createInterpolationPlaceholder(s){return`${se}${s}${_}`},createCustomAttributePlaceholder(s,e){return`${s}="${this.createInterpolationPlaceholder(e)}"`},createBlockPlaceholder(s){return`<!--${y}:${s}-->`},queueUpdate:M.enqueue,processUpdates:M.process,nextUpdate(){return new Promise(M.enqueue)},setAttribute(s,e,t){t==null?s.removeAttribute(e):s.setAttribute(e,t)},setBooleanAttribute(s,e,t){t?s.setAttribute(e,""):s.removeAttribute(e)},removeChildNodes(s){for(let e=s.firstChild;e!==null;e=s.firstChild)s.removeChild(e)},createTemplateWalker(s){return document.createTreeWalker(s,133,null,!1)}});class x{constructor(e,t){this.sub1=void 0,this.sub2=void 0,this.spillover=void 0,this.source=e,this.sub1=t}has(e){return this.spillover===void 0?this.sub1===e||this.sub2===e:this.spillover.indexOf(e)!==-1}subscribe(e){const t=this.spillover;if(t===void 0){if(this.has(e))return;if(this.sub1===void 0){this.sub1=e;return}if(this.sub2===void 0){this.sub2=e;return}this.spillover=[this.sub1,this.sub2,e],this.sub1=void 0,this.sub2=void 0}else t.indexOf(e)===-1&&t.push(e)}unsubscribe(e){const t=this.spillover;if(t===void 0)this.sub1===e?this.sub1=void 0:this.sub2===e&&(this.sub2=void 0);else{const i=t.indexOf(e);i!==-1&&t.splice(i,1)}}notify(e){const t=this.spillover,i=this.source;if(t===void 0){const n=this.sub1,r=this.sub2;n!==void 0&&n.handleChange(i,e),r!==void 0&&r.handleChange(i,e)}else for(let n=0,r=t.length;n<r;++n)t[n].handleChange(i,e)}}class ie{constructor(e){this.subscribers={},this.sourceSubscribers=null,this.source=e}notify(e){var t;const i=this.subscribers[e];i!==void 0&&i.notify(e),(t=this.sourceSubscribers)===null||t===void 0||t.notify(e)}subscribe(e,t){var i;if(t){let n=this.subscribers[t];n===void 0&&(this.subscribers[t]=n=new x(this.source)),n.subscribe(e)}else this.sourceSubscribers=(i=this.sourceSubscribers)!==null&&i!==void 0?i:new x(this.source),this.sourceSubscribers.subscribe(e)}unsubscribe(e,t){var i;if(t){const n=this.subscribers[t];n!==void 0&&n.unsubscribe(e)}else(i=this.sourceSubscribers)===null||i===void 0||i.unsubscribe(e)}}const b=S.getById(2,()=>{const s=/(:|&&|\|\||if)/,e=new WeakMap,t=u.queueUpdate;let i,n=l=>{throw new Error("Must call enableArrayObservation before observing arrays.")};function r(l){let h=l.$fastController||e.get(l);return h===void 0&&(Array.isArray(l)?h=n(l):e.set(l,h=new ie(l))),h}const o=R();class a{constructor(h){this.name=h,this.field=`_${h}`,this.callback=`${h}Changed`}getValue(h){return i!==void 0&&i.watch(h,this.name),h[this.field]}setValue(h,d){const f=this.field,m=h[f];if(m!==d){h[f]=d;const g=h[this.callback];typeof g=="function"&&g.call(h,m,d),r(h).notify(this.name)}}}class c extends x{constructor(h,d,f=!1){super(h,d),this.binding=h,this.isVolatileBinding=f,this.needsRefresh=!0,this.needsQueue=!0,this.first=this,this.last=null,this.propertySource=void 0,this.propertyName=void 0,this.notifier=void 0,this.next=void 0}observe(h,d){this.needsRefresh&&this.last!==null&&this.disconnect();const f=i;i=this.needsRefresh?this:void 0,this.needsRefresh=this.isVolatileBinding;const m=this.binding(h,d);return i=f,m}disconnect(){if(this.last!==null){let h=this.first;for(;h!==void 0;)h.notifier.unsubscribe(this,h.propertyName),h=h.next;this.last=null,this.needsRefresh=this.needsQueue=!0}}watch(h,d){const f=this.last,m=r(h),g=f===null?this.first:{};if(g.propertySource=h,g.propertyName=d,g.notifier=m,m.subscribe(this,d),f!==null){if(!this.needsRefresh){let q;i=void 0,q=f.propertySource[f.propertyName],i=this,h===q&&(this.needsRefresh=!0)}f.next=g}this.last=g}handleChange(){this.needsQueue&&(this.needsQueue=!1,t(this))}call(){this.last!==null&&(this.needsQueue=!0,this.notify(this))}records(){let h=this.first;return{next:()=>{const d=h;return d===void 0?{value:void 0,done:!0}:(h=h.next,{value:d,done:!1})},[Symbol.iterator]:function(){return this}}}}return Object.freeze({setArrayObserverFactory(l){n=l},getNotifier:r,track(l,h){i!==void 0&&i.watch(l,h)},trackVolatile(){i!==void 0&&(i.needsRefresh=!0)},notify(l,h){r(l).notify(h)},defineProperty(l,h){typeof h=="string"&&(h=new a(h)),o(l).push(h),Reflect.defineProperty(l,h.name,{enumerable:!0,get:function(){return h.getValue(this)},set:function(d){h.setValue(this,d)}})},getAccessors:o,binding(l,h,d=this.isVolatileBinding(l)){return new c(l,h,d)},isVolatileBinding(l){return s.test(l.toString())}})});function ve(s,e){b.defineProperty(s,e)}function me(s,e,t){return Object.assign({},t,{get:function(){return b.trackVolatile(),t.get.apply(this)}})}const U=S.getById(3,()=>{let s=null;return{get(){return s},set(e){s=e}}});class w{constructor(){this.index=0,this.length=0,this.parent=null,this.parentContext=null}get event(){return U.get()}get isEven(){return this.index%2===0}get isOdd(){return this.index%2!==0}get isFirst(){return this.index===0}get isInMiddle(){return!this.isFirst&&!this.isLast}get isLast(){return this.index===this.length-1}static setEvent(e){U.set(e)}}b.defineProperty(w.prototype,"index");b.defineProperty(w.prototype,"length");const C=Object.seal(new w);class k{constructor(){this.targetIndex=0}}class ne extends k{constructor(){super(...arguments),this.createPlaceholder=u.createInterpolationPlaceholder}}class ye extends k{constructor(e,t,i){super(),this.name=e,this.behavior=t,this.options=i}createPlaceholder(e){return u.createCustomAttributePlaceholder(this.name,e)}createBehavior(e){return new this.behavior(e,this.options)}}function Ce(s,e){this.source=s,this.context=e,this.bindingObserver===null&&(this.bindingObserver=b.binding(this.binding,this,this.isBindingVolatile)),this.updateTarget(this.bindingObserver.observe(s,e))}function Se(s,e){this.source=s,this.context=e,this.target.addEventListener(this.targetName,this)}function we(){this.bindingObserver.disconnect(),this.source=null,this.context=null}function xe(){this.bindingObserver.disconnect(),this.source=null,this.context=null;const s=this.target.$fastView;s!==void 0&&s.isComposed&&(s.unbind(),s.needsBindOnly=!0)}function Te(){this.target.removeEventListener(this.targetName,this),this.source=null,this.context=null}function Ae(s){u.setAttribute(this.target,this.targetName,s)}function Be(s){u.setBooleanAttribute(this.target,this.targetName,s)}function Ne(s){if(s==null&&(s=""),s.create){this.target.textContent="";let e=this.target.$fastView;e===void 0?e=s.create():this.target.$fastTemplate!==s&&(e.isComposed&&(e.remove(),e.unbind()),e=s.create()),e.isComposed?e.needsBindOnly&&(e.needsBindOnly=!1,e.bind(this.source,this.context)):(e.isComposed=!0,e.bind(this.source,this.context),e.insertBefore(this.target),this.target.$fastView=e,this.target.$fastTemplate=s)}else{const e=this.target.$fastView;e!==void 0&&e.isComposed&&(e.isComposed=!1,e.remove(),e.needsBindOnly?e.needsBindOnly=!1:e.unbind()),this.target.textContent=s}}function ke(s){this.target[this.targetName]=s}function Fe(s){const e=this.classVersions||Object.create(null),t=this.target;let i=this.version||0;if(s!=null&&s.length){const n=s.split(/\s+/);for(let r=0,o=n.length;r<o;++r){const a=n[r];a!==""&&(e[a]=i,t.classList.add(a))}}if(this.classVersions=e,this.version=i+1,i!==0){i-=1;for(const n in e)e[n]===i&&t.classList.remove(n)}}class H extends ne{constructor(e){super(),this.binding=e,this.bind=Ce,this.unbind=we,this.updateTarget=Ae,this.isBindingVolatile=b.isVolatileBinding(this.binding)}get targetName(){return this.originalTargetName}set targetName(e){if(this.originalTargetName=e,e!==void 0)switch(e[0]){case":":if(this.cleanedTargetName=e.substr(1),this.updateTarget=ke,this.cleanedTargetName==="innerHTML"){const t=this.binding;this.binding=(i,n)=>u.createHTML(t(i,n))}break;case"?":this.cleanedTargetName=e.substr(1),this.updateTarget=Be;break;case"@":this.cleanedTargetName=e.substr(1),this.bind=Se,this.unbind=Te;break;default:this.cleanedTargetName=e,e==="class"&&(this.updateTarget=Fe);break}}targetAtContent(){this.updateTarget=Ne,this.unbind=xe}createBehavior(e){return new Me(e,this.binding,this.isBindingVolatile,this.bind,this.unbind,this.updateTarget,this.cleanedTargetName)}}class Me{constructor(e,t,i,n,r,o,a){this.source=null,this.context=null,this.bindingObserver=null,this.target=e,this.binding=t,this.isBindingVolatile=i,this.bind=n,this.unbind=r,this.updateTarget=o,this.targetName=a}handleChange(){this.updateTarget(this.bindingObserver.observe(this.source,this.context))}handleEvent(e){w.setEvent(e);const t=this.binding(this.source,this.context);w.setEvent(null),t!==!0&&e.preventDefault()}}let O=null;class j{addFactory(e){e.targetIndex=this.targetIndex,this.behaviorFactories.push(e)}captureContentBinding(e){e.targetAtContent(),this.addFactory(e)}reset(){this.behaviorFactories=[],this.targetIndex=-1}release(){O=this}static borrow(e){const t=O||new j;return t.directives=e,t.reset(),O=null,t}}function Ee(s){if(s.length===1)return s[0];let e;const t=s.length,i=s.map(o=>typeof o=="string"?()=>o:(e=o.targetName||e,o.binding)),n=(o,a)=>{let c="";for(let l=0;l<t;++l)c+=i[l](o,a);return c},r=new H(n);return r.targetName=e,r}const Oe=_.length;function re(s,e){const t=e.split(se);if(t.length===1)return null;const i=[];for(let n=0,r=t.length;n<r;++n){const o=t[n],a=o.indexOf(_);let c;if(a===-1)c=o;else{const l=parseInt(o.substring(0,a));i.push(s.directives[l]),c=o.substring(a+Oe)}c!==""&&i.push(c)}return i}function W(s,e,t=!1){const i=e.attributes;for(let n=0,r=i.length;n<r;++n){const o=i[n],a=o.value,c=re(s,a);let l=null;c===null?t&&(l=new H(()=>a),l.targetName=o.name):l=Ee(c),l!==null&&(e.removeAttributeNode(o),n--,r--,s.addFactory(l))}}function Ie(s,e,t){const i=re(s,e.textContent);if(i!==null){let n=e;for(let r=0,o=i.length;r<o;++r){const a=i[r],c=r===0?e:n.parentNode.insertBefore(document.createTextNode(""),n.nextSibling);typeof a=="string"?c.textContent=a:(c.textContent=" ",s.captureContentBinding(a)),n=c,s.targetIndex++,c!==e&&t.nextNode()}s.targetIndex--}}function Ve(s,e){const t=s.content;document.adoptNode(t);const i=j.borrow(e);W(i,s,!0);const n=i.behaviorFactories;i.reset();const r=u.createTemplateWalker(t);let o;for(;o=r.nextNode();)switch(i.targetIndex++,o.nodeType){case 1:W(i,o);break;case 3:Ie(i,o,r);break;case 8:u.isMarker(o)&&i.addFactory(e[u.extractDirectiveIndexFromMarker(o)])}let a=0;(u.isMarker(t.firstChild)||t.childNodes.length===1&&e.length)&&(t.insertBefore(document.createComment(""),t.firstChild),a=-1);const c=i.behaviorFactories;return i.release(),{fragment:t,viewBehaviorFactories:c,hostBehaviorFactories:n,targetOffset:a}}const I=document.createRange();class oe{constructor(e,t){this.fragment=e,this.behaviors=t,this.source=null,this.context=null,this.firstChild=e.firstChild,this.lastChild=e.lastChild}appendTo(e){e.appendChild(this.fragment)}insertBefore(e){if(this.fragment.hasChildNodes())e.parentNode.insertBefore(this.fragment,e);else{const t=this.lastChild;if(e.previousSibling===t)return;const i=e.parentNode;let n=this.firstChild,r;for(;n!==t;)r=n.nextSibling,i.insertBefore(n,e),n=r;i.insertBefore(t,e)}}remove(){const e=this.fragment,t=this.lastChild;let i=this.firstChild,n;for(;i!==t;)n=i.nextSibling,e.appendChild(i),i=n;e.appendChild(t)}dispose(){const e=this.firstChild.parentNode,t=this.lastChild;let i=this.firstChild,n;for(;i!==t;)n=i.nextSibling,e.removeChild(i),i=n;e.removeChild(t);const r=this.behaviors,o=this.source;for(let a=0,c=r.length;a<c;++a)r[a].unbind(o)}bind(e,t){const i=this.behaviors;if(this.source!==e)if(this.source!==null){const n=this.source;this.source=e,this.context=t;for(let r=0,o=i.length;r<o;++r){const a=i[r];a.unbind(n),a.bind(e,t)}}else{this.source=e,this.context=t;for(let n=0,r=i.length;n<r;++n)i[n].bind(e,t)}}unbind(){if(this.source===null)return;const e=this.behaviors,t=this.source;for(let i=0,n=e.length;i<n;++i)e[i].unbind(t);this.source=null}static disposeContiguousBatch(e){if(e.length!==0){I.setStartBefore(e[0].firstChild),I.setEndAfter(e[e.length-1].lastChild),I.deleteContents();for(let t=0,i=e.length;t<i;++t){const n=e[t],r=n.behaviors,o=n.source;for(let a=0,c=r.length;a<c;++a)r[a].unbind(o)}}}}class Q{constructor(e,t){this.behaviorCount=0,this.hasHostBehaviors=!1,this.fragment=null,this.targetOffset=0,this.viewBehaviorFactories=null,this.hostBehaviorFactories=null,this.html=e,this.directives=t}create(e){if(this.fragment===null){let l;const h=this.html;if(typeof h=="string"){l=document.createElement("template"),l.innerHTML=u.createHTML(h);const f=l.content.firstElementChild;f!==null&&f.tagName==="TEMPLATE"&&(l=f)}else l=h;const d=Ve(l,this.directives);this.fragment=d.fragment,this.viewBehaviorFactories=d.viewBehaviorFactories,this.hostBehaviorFactories=d.hostBehaviorFactories,this.targetOffset=d.targetOffset,this.behaviorCount=this.viewBehaviorFactories.length+this.hostBehaviorFactories.length,this.hasHostBehaviors=this.hostBehaviorFactories.length>0}const t=this.fragment.cloneNode(!0),i=this.viewBehaviorFactories,n=new Array(this.behaviorCount),r=u.createTemplateWalker(t);let o=0,a=this.targetOffset,c=r.nextNode();for(let l=i.length;o<l;++o){const h=i[o],d=h.targetIndex;for(;c!==null;)if(a===d){n[o]=h.createBehavior(c);break}else c=r.nextNode(),a++}if(this.hasHostBehaviors){const l=this.hostBehaviorFactories;for(let h=0,d=l.length;h<d;++h,++o)n[o]=l[h].createBehavior(e)}return new oe(t,n)}render(e,t,i){typeof t=="string"&&(t=document.getElementById(t)),i===void 0&&(i=t);const n=this.create(i);return n.bind(e,C),n.appendTo(t),n}}const $e=/([ \x09\x0a\x0c\x0d])([^\0-\x1F\x7F-\x9F "'>=/]+)([ \x09\x0a\x0c\x0d]*=[ \x09\x0a\x0c\x0d]*(?:[^ \x09\x0a\x0c\x0d"'`<>=]*|"[^"]*|'[^']*))$/;function Pe(s,...e){const t=[];let i="";for(let n=0,r=s.length-1;n<r;++n){const o=s[n];let a=e[n];if(i+=o,a instanceof Q){const c=a;a=()=>c}if(typeof a=="function"&&(a=new H(a)),a instanceof ne){const c=$e.exec(o);c!==null&&(a.targetName=c[2])}a instanceof k?(i+=a.createPlaceholder(t.length),t.push(a)):i+=a}return i+=s[s.length-1],new Q(i,t)}class p{constructor(){this.targets=new WeakSet}addStylesTo(e){this.targets.add(e)}removeStylesFrom(e){this.targets.delete(e)}isAttachedTo(e){return this.targets.has(e)}withBehaviors(...e){return this.behaviors=this.behaviors===null?e:this.behaviors.concat(e),this}}p.create=(()=>{if(u.supportsAdoptedStyleSheets){const s=new Map;return e=>new Re(e,s)}return s=>new je(s)})();function D(s){return s.map(e=>e instanceof p?D(e.styles):[e]).reduce((e,t)=>e.concat(t),[])}function ae(s){return s.map(e=>e instanceof p?e.behaviors:null).reduce((e,t)=>t===null?e:(e===null&&(e=[]),e.concat(t)),null)}const Le=Symbol("prependToAdoptedStyleSheets");function le(s){const e=[],t=[];return s.forEach(i=>(i[Le]?e:t).push(i)),{prepend:e,append:t}}let he=(s,e)=>{const{prepend:t,append:i}=le(e);s.adoptedStyleSheets=[...t,...s.adoptedStyleSheets,...i]},ce=(s,e)=>{s.adoptedStyleSheets=s.adoptedStyleSheets.filter(t=>e.indexOf(t)===-1)};if(u.supportsAdoptedStyleSheets)try{document.adoptedStyleSheets.push(),document.adoptedStyleSheets.splice(),he=(s,e)=>{const{prepend:t,append:i}=le(e);s.adoptedStyleSheets.splice(0,0,...t),s.adoptedStyleSheets.push(...i)},ce=(s,e)=>{for(const t of e){const i=s.adoptedStyleSheets.indexOf(t);i!==-1&&s.adoptedStyleSheets.splice(i,1)}}}catch{}class Re extends p{constructor(e,t){super(),this.styles=e,this.styleSheetCache=t,this._styleSheets=void 0,this.behaviors=ae(e)}get styleSheets(){if(this._styleSheets===void 0){const e=this.styles,t=this.styleSheetCache;this._styleSheets=D(e).map(i=>{if(i instanceof CSSStyleSheet)return i;let n=t.get(i);return n===void 0&&(n=new CSSStyleSheet,n.replaceSync(i),t.set(i,n)),n})}return this._styleSheets}addStylesTo(e){he(e,this.styleSheets),super.addStylesTo(e)}removeStylesFrom(e){ce(e,this.styleSheets),super.removeStylesFrom(e)}}let _e=0;function He(){return`fast-style-class-${++_e}`}class je extends p{constructor(e){super(),this.styles=e,this.behaviors=null,this.behaviors=ae(e),this.styleSheets=D(e),this.styleClass=He()}addStylesTo(e){const t=this.styleSheets,i=this.styleClass;e=this.normalizeTarget(e);for(let n=0;n<t.length;n++){const r=document.createElement("style");r.innerHTML=t[n],r.className=i,e.append(r)}super.addStylesTo(e)}removeStylesFrom(e){e=this.normalizeTarget(e);const t=e.querySelectorAll(`.${this.styleClass}`);for(let i=0,n=t.length;i<n;++i)e.removeChild(t[i]);super.removeStylesFrom(e)}isAttachedTo(e){return super.isAttachedTo(this.normalizeTarget(e))}normalizeTarget(e){return e===document?document.body:e}}const de=Object.freeze({locate:R()}),De={toView(s){return s?"true":"false"},fromView(s){return!(s==null||s==="false"||s===!1||s===0)}},ze={toView(s){if(s==null)return null;const e=s*1;return isNaN(e)?null:e.toString()},fromView(s){if(s==null)return null;const e=s*1;return isNaN(e)?null:e}};class T{constructor(e,t,i=t.toLowerCase(),n="reflect",r){this.guards=new Set,this.Owner=e,this.name=t,this.attribute=i,this.mode=n,this.converter=r,this.fieldName=`_${t}`,this.callbackName=`${t}Changed`,this.hasCallback=this.callbackName in e.prototype,n==="boolean"&&r===void 0&&(this.converter=De)}setValue(e,t){const i=e[this.fieldName],n=this.converter;n!==void 0&&(t=n.fromView(t)),i!==t&&(e[this.fieldName]=t,this.tryReflectToAttribute(e),this.hasCallback&&e[this.callbackName](i,t),e.$fastController.notify(this.name))}getValue(e){return b.track(e,this.name),e[this.fieldName]}onAttributeChangedCallback(e,t){this.guards.has(e)||(this.guards.add(e),this.setValue(e,t),this.guards.delete(e))}tryReflectToAttribute(e){const t=this.mode,i=this.guards;i.has(e)||t==="fromView"||u.queueUpdate(()=>{i.add(e);const n=e[this.fieldName];switch(t){case"reflect":const r=this.converter;u.setAttribute(e,this.attribute,r!==void 0?r.toView(n):n);break;case"boolean":u.setBooleanAttribute(e,this.attribute,n);break}i.delete(e)})}static collect(e,...t){const i=[];t.push(de.locate(e));for(let n=0,r=t.length;n<r;++n){const o=t[n];if(o!==void 0)for(let a=0,c=o.length;a<c;++a){const l=o[a];typeof l=="string"?i.push(new T(e,l)):i.push(new T(e,l.property,l.attribute,l.mode,l.converter))}}return i}}function ue(s,e){let t;function i(n,r){arguments.length>1&&(t.property=r),de.locate(n.constructor).push(t)}if(arguments.length>1){t={},i(s,e);return}return t=s===void 0?{}:s,i}const K={mode:"open"},G={},P=S.getById(4,()=>{const s=new Map;return Object.freeze({register(e){return s.has(e.type)?!1:(s.set(e.type,e),!0)},getByType(e){return s.get(e)}})});class F{constructor(e,t=e.definition){typeof t=="string"&&(t={name:t}),this.type=e,this.name=t.name,this.template=t.template;const i=T.collect(e,t.attributes),n=new Array(i.length),r={},o={};for(let a=0,c=i.length;a<c;++a){const l=i[a];n[a]=l.attribute,r[l.name]=l,o[l.attribute]=l}this.attributes=i,this.observedAttributes=n,this.propertyLookup=r,this.attributeLookup=o,this.shadowOptions=t.shadowOptions===void 0?K:t.shadowOptions===null?void 0:Object.assign(Object.assign({},K),t.shadowOptions),this.elementOptions=t.elementOptions===void 0?G:Object.assign(Object.assign({},G),t.elementOptions),this.styles=t.styles===void 0?void 0:Array.isArray(t.styles)?p.create(t.styles):t.styles instanceof p?t.styles:p.create([t.styles])}get isDefined(){return!!P.getByType(this.type)}define(e=customElements){const t=this.type;if(P.register(this)){const i=this.attributes,n=t.prototype;for(let r=0,o=i.length;r<o;++r)b.defineProperty(n,i[r]);Reflect.defineProperty(t,"observedAttributes",{value:this.observedAttributes,enumerable:!0})}return e.get(this.name)||e.define(this.name,t,this.elementOptions),this}}F.forType=P.getByType;const fe=new WeakMap,qe={bubbles:!0,composed:!0,cancelable:!0};function V(s){return s.shadowRoot||fe.get(s)||null}class z extends ie{constructor(e,t){super(e),this.boundObservables=null,this.behaviors=null,this.needsInitialization=!0,this._template=null,this._styles=null,this._isConnected=!1,this.$fastController=this,this.view=null,this.element=e,this.definition=t;const i=t.shadowOptions;if(i!==void 0){const r=e.attachShadow(i);i.mode==="closed"&&fe.set(e,r)}const n=b.getAccessors(e);if(n.length>0){const r=this.boundObservables=Object.create(null);for(let o=0,a=n.length;o<a;++o){const c=n[o].name,l=e[c];l!==void 0&&(delete e[c],r[c]=l)}}}get isConnected(){return b.track(this,"isConnected"),this._isConnected}setIsConnected(e){this._isConnected=e,b.notify(this,"isConnected")}get template(){return this._template}set template(e){this._template!==e&&(this._template=e,this.needsInitialization||this.renderTemplate(e))}get styles(){return this._styles}set styles(e){this._styles!==e&&(this._styles!==null&&this.removeStyles(this._styles),this._styles=e,!this.needsInitialization&&e!==null&&this.addStyles(e))}addStyles(e){const t=V(this.element)||this.element.getRootNode();if(e instanceof HTMLStyleElement)t.append(e);else if(!e.isAttachedTo(t)){const i=e.behaviors;e.addStylesTo(t),i!==null&&this.addBehaviors(i)}}removeStyles(e){const t=V(this.element)||this.element.getRootNode();if(e instanceof HTMLStyleElement)t.removeChild(e);else if(e.isAttachedTo(t)){const i=e.behaviors;e.removeStylesFrom(t),i!==null&&this.removeBehaviors(i)}}addBehaviors(e){const t=this.behaviors||(this.behaviors=new Map),i=e.length,n=[];for(let r=0;r<i;++r){const o=e[r];t.has(o)?t.set(o,t.get(o)+1):(t.set(o,1),n.push(o))}if(this._isConnected){const r=this.element;for(let o=0;o<n.length;++o)n[o].bind(r,C)}}removeBehaviors(e,t=!1){const i=this.behaviors;if(i===null)return;const n=e.length,r=[];for(let o=0;o<n;++o){const a=e[o];if(i.has(a)){const c=i.get(a)-1;c===0||t?i.delete(a)&&r.push(a):i.set(a,c)}}if(this._isConnected){const o=this.element;for(let a=0;a<r.length;++a)r[a].unbind(o)}}onConnectedCallback(){if(this._isConnected)return;const e=this.element;this.needsInitialization?this.finishInitialization():this.view!==null&&this.view.bind(e,C);const t=this.behaviors;if(t!==null)for(const[i]of t)i.bind(e,C);this.setIsConnected(!0)}onDisconnectedCallback(){if(!this._isConnected)return;this.setIsConnected(!1);const e=this.view;e!==null&&e.unbind();const t=this.behaviors;if(t!==null){const i=this.element;for(const[n]of t)n.unbind(i)}}onAttributeChangedCallback(e,t,i){const n=this.definition.attributeLookup[e];n!==void 0&&n.onAttributeChangedCallback(this.element,i)}emit(e,t,i){return this._isConnected?this.element.dispatchEvent(new CustomEvent(e,Object.assign(Object.assign({detail:t},qe),i))):!1}finishInitialization(){const e=this.element,t=this.boundObservables;if(t!==null){const n=Object.keys(t);for(let r=0,o=n.length;r<o;++r){const a=n[r];e[a]=t[a]}this.boundObservables=null}const i=this.definition;this._template===null&&(this.element.resolveTemplate?this._template=this.element.resolveTemplate():i.template&&(this._template=i.template||null)),this._template!==null&&this.renderTemplate(this._template),this._styles===null&&(this.element.resolveStyles?this._styles=this.element.resolveStyles():i.styles&&(this._styles=i.styles||null)),this._styles!==null&&this.addStyles(this._styles),this.needsInitialization=!1}renderTemplate(e){const t=this.element,i=V(t)||t;this.view!==null?(this.view.dispose(),this.view=null):this.needsInitialization||u.removeChildNodes(i),e&&(this.view=e.render(t,i,t))}static forCustomElement(e){const t=e.$fastController;if(t!==void 0)return t;const i=F.forType(e.constructor);if(i===void 0)throw new Error("Missing FASTElement definition.");return e.$fastController=new z(e,i)}}function J(s){return class extends s{constructor(){super(),z.forCustomElement(this)}$emit(e,t,i){return this.$fastController.emit(e,t,i)}connectedCallback(){this.$fastController.onConnectedCallback()}disconnectedCallback(){this.$fastController.onDisconnectedCallback()}attributeChangedCallback(e,t,i){this.$fastController.onAttributeChangedCallback(e,t,i)}}}const Ue=Object.assign(J(HTMLElement),{from(s){return J(s)},define(s,e){return new F(s,e).define().type}});function We(s,e){return s instanceof Function?s(e):s}const X=new Set,$=new Map,Qe=s=>(e="vwc")=>{const t=n=>`${e}-${n}`,i=n=>{const r=t(n.name);let o=n.type;if(o.componentName=n.name,X.has(r))return;$.has(o)&&$.get(o)!==r&&(o=class extends o{}),X.add(r),$.set(o,r);for(const l of n.dependencies)i(l);const a=new Map([[n.type,r],...n.dependencies.map(l=>[l.type,t(l.name)])]),c={tagFor(l){if(!a.has(l))throw new Error(`Could not get tag for ${l.name} as it is not a dependency of ${n.name}.`);return a.get(l)},tagForNonDependency(l){return t(l)}};new F(o,{...n.options,template:We(n.template,c),name:`${e}-${n.name}`}).define()};i(s)},Ke=(s,e,t,i,n)=>({name:s,type:e,template:t,dependencies:i,options:n}),Y=new WeakMap,A=s=>{let e=Y.get(s);return e||(e=[],Y.set(s,e)),e},Ge=(s,e)=>{A(s).push(e)},Je=(s,e)=>{A(s).splice(A(s).indexOf(e),1)},Xe=(s,e)=>{A(s).forEach(t=>t(s,e))},Ye=s=>s==="delegate",Z=s=>`vvd${s.charAt(0).toUpperCase()}${s.slice(1)}`,be=(s,e)=>{if(Ye(s._vividAriaBehaviour)){const t=s[e];s[`_${e}`]=null,s.removeAttribute(N(e)),s[`_${e}`]=t,s[e]!==null?s.dataset[Z(e)]=s[e]:delete s.dataset[Z(e)]}else u.setAttribute(s,N(e),s[e])},B=new WeakMap,Ze=(s,e)=>{const t=B.get(s);t?t.add(e):B.set(s,new Set([e]))},et=(s,e)=>{s.isConnected?be(s,e):Ze(s,e)},tt=s=>{const e=B.get(s);if(e){for(const t of e)be(s,t);B.delete(s)}},L=["role","ariaAtomic","ariaAutoComplete","ariaBusy","ariaChecked","ariaColCount","ariaColIndex","ariaColIndexText","ariaColSpan","ariaCurrent","ariaDescription","ariaDisabled","ariaExpanded","ariaHasPopup","ariaHidden","ariaInvalid","ariaKeyShortcuts","ariaLabel","ariaLevel","ariaLive","ariaModal","ariaMultiLine","ariaMultiSelectable","ariaOrientation","ariaPlaceholder","ariaPosInSet","ariaPressed","ariaReadOnly","ariaRequired","ariaRoleDescription","ariaRowCount","ariaRowIndex","ariaRowIndexText","ariaRowSpan","ariaSelected","ariaSetSize","ariaSort","ariaValueMax","ariaValueMin","ariaValueNow","ariaValueText","ariaRelevant"],N=s=>s.replace("aria","aria-").toLowerCase(),st=s=>{class e extends s{constructor(...i){super(...i),this._vividAriaBehaviour="default";for(const n of L)this[`_${n}`]=null}connectedCallback(){super.connectedCallback(),tt(this)}}for(const t of L)ue({attribute:N(t),mode:"fromView"})(e.prototype,t),e.prototype[`${t}Changed`]=function(){et(this,t),this._vividAriaBehaviour!=="default"&&Xe(this,t)};return e},pe=R(),it=s=>(e,t)=>{pe(e.constructor).push({newPropertyName:t,...s})},nt=s=>{class e extends s{#e(i){let n=!1,r=!1;const o=h=>r&&i.fromDeprecated(h[i.deprecatedPropertyName])===h[i.newPropertyName],a=h=>n&&i.toDeprecated&&i.toDeprecated(h[i.newPropertyName])===h[i.deprecatedPropertyName],c={handleChange(h,d){if(d===i.newPropertyName){if(n=!0,!i.toDeprecated||o(h))return;h[i.deprecatedPropertyName]=i.toDeprecated(h[i.newPropertyName])}if(d===i.deprecatedPropertyName){if(r=!0,a(h))return;h[i.newPropertyName]=i.fromDeprecated(h[i.deprecatedPropertyName])}}},l=b.getNotifier(this);l.subscribe(c,i.newPropertyName),l.subscribe(c,i.deprecatedPropertyName)}constructor(...i){super(...i);for(const n of pe(this.constructor))this.#e(n)}}return e};class rt extends st(nt(Ue)){static{this.VIVID_VERSION="5.1.0"}connectedCallback(){super.connectedCallback();const e=this.constructor.componentName;this.setAttribute("data-vvd-component",e)}}exports.AttachedBehaviorHTMLDirective=ye;exports.DOM=u;exports.ElementStyles=p;exports.HTMLDirective=k;exports.HTMLView=oe;exports.Observable=b;exports.SubscriberSet=x;exports.VividElement=rt;exports.ariaAttributeName=N;exports.ariaMixinProperties=L;exports.attr=ue;exports.createRegisterFunction=Qe;exports.defaultExecutionContext=C;exports.defineVividComponent=Ke;exports.emptyArray=ge;exports.html=Pe;exports.nullableNumberConverter=ze;exports.observable=ve;exports.replaces=it;exports.subscribeToAriaPropertyChanges=Ge;exports.unsubscribeFromAriaPropertyChanges=Je;exports.volatile=me;