@record-evolution/widget-overlay 1.0.6 → 1.0.7

package/dist/widget-overlay.js

@@ -1,1035 +1,719 @@
-/* @license Copyright (c) 2023 Record Evolution GmbH. All rights reserved.*/
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-function __decorate(decorators, target, key, desc) {
-  var c = arguments.length,
-    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
-    d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-  var e = new Error(message);
-  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-/**
- * @license
- * Copyright 2019 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t$5 = globalThis,
-  e$6 = t$5.ShadowRoot && (void 0 === t$5.ShadyCSS || t$5.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
-  s$3 = Symbol(),
-  o$6 = new WeakMap();
-let n$4 = class n {
-  constructor(t, e, o) {
-    if (this._$cssResult$ = !0, o !== s$3) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
-    this.cssText = t, this.t = e;
-  }
-  get styleSheet() {
-    let t = this.o;
-    const s = this.t;
-    if (e$6 && void 0 === t) {
-      const e = void 0 !== s && 1 === s.length;
-      e && (t = o$6.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$6.set(s, t));
-    }
-    return t;
-  }
-  toString() {
-    return this.cssText;
-  }
-};
-const r$5 = t => new n$4("string" == typeof t ? t : t + "", void 0, s$3),
-  i$5 = (t, ...e) => {
-    const o = 1 === t.length ? t[0] : e.reduce((e, s, o) => e + (t => {
-      if (!0 === t._$cssResult$) return t.cssText;
-      if ("number" == typeof t) return t;
-      throw Error("Value passed to 'css' function must be a 'css' function result: " + t + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
-    })(s) + t[o + 1], t[0]);
-    return new n$4(o, t, s$3);
-  },
-  S$1 = (s, o) => {
-    if (e$6) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
-      const o = document.createElement("style"),
-        n = t$5.litNonce;
-      void 0 !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
-    }
-  },
-  c$3 = e$6 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
-    let e = "";
-    for (const s of t.cssRules) e += s.cssText;
-    return r$5(e);
-  })(t) : t;
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const {
-    is: i$4,
-    defineProperty: e$5,
-    getOwnPropertyDescriptor: h$1,
-    getOwnPropertyNames: r$4,
-    getOwnPropertySymbols: o$5,
-    getPrototypeOf: n$3
-  } = Object,
-  a$1 = globalThis,
-  c$2 = a$1.trustedTypes,
-  l$1 = c$2 ? c$2.emptyScript : "",
-  p$2 = a$1.reactiveElementPolyfillSupport,
-  d$1 = (t, s) => t,
-  u$3 = {
-    toAttribute(t, s) {
-      switch (s) {
-        case Boolean:
-          t = t ? l$1 : null;
-          break;
-        case Object:
-        case Array:
-          t = null == t ? t : JSON.stringify(t);
-      }
-      return t;
-    },
-    fromAttribute(t, s) {
-      let i = t;
-      switch (s) {
-        case Boolean:
-          i = null !== t;
-          break;
-        case Number:
-          i = null === t ? null : Number(t);
-          break;
-        case Object:
-        case Array:
-          try {
-            i = JSON.parse(t);
-          } catch (t) {
-            i = null;
-          }
-      }
-      return i;
-    }
-  },
-  f$1 = (t, s) => !i$4(t, s),
-  b = {
-    attribute: !0,
-    type: String,
-    converter: u$3,
-    reflect: !1,
-    useDefault: !1,
-    hasChanged: f$1
-  };
-Symbol.metadata ??= Symbol("metadata"), a$1.litPropertyMetadata ??= new WeakMap();
-let y$1 = class y extends HTMLElement {
-  static addInitializer(t) {
-    this._$Ei(), (this.l ??= []).push(t);
-  }
-  static get observedAttributes() {
-    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
-  }
-  static createProperty(t, s = b) {
-    if (s.state && (s.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((s = Object.create(s)).wrapped = !0), this.elementProperties.set(t, s), !s.noAccessor) {
-      const i = Symbol(),
-        h = this.getPropertyDescriptor(t, i, s);
-      void 0 !== h && e$5(this.prototype, t, h);
-    }
-  }
-  static getPropertyDescriptor(t, s, i) {
-    const {
-      get: e,
-      set: r
-    } = h$1(this.prototype, t) ?? {
-      get() {
-        return this[s];
-      },
-      set(t) {
-        this[s] = t;
-      }
-    };
-    return {
-      get: e,
-      set(s) {
-        const h = e?.call(this);
-        r?.call(this, s), this.requestUpdate(t, h, i);
-      },
-      configurable: !0,
-      enumerable: !0
-    };
-  }
-  static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? b;
-  }
-  static _$Ei() {
-    if (this.hasOwnProperty(d$1("elementProperties"))) return;
-    const t = n$3(this);
-    t.finalize(), void 0 !== t.l && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
-  }
-  static finalize() {
-    if (this.hasOwnProperty(d$1("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(d$1("properties"))) {
-      const t = this.properties,
-        s = [...r$4(t), ...o$5(t)];
-      for (const i of s) this.createProperty(i, t[i]);
-    }
-    const t = this[Symbol.metadata];
-    if (null !== t) {
-      const s = litPropertyMetadata.get(t);
-      if (void 0 !== s) for (const [t, i] of s) this.elementProperties.set(t, i);
-    }
-    this._$Eh = new Map();
-    for (const [t, s] of this.elementProperties) {
-      const i = this._$Eu(t, s);
-      void 0 !== i && this._$Eh.set(i, t);
-    }
-    this.elementStyles = this.finalizeStyles(this.styles);
-  }
-  static finalizeStyles(s) {
-    const i = [];
-    if (Array.isArray(s)) {
-      const e = new Set(s.flat(1 / 0).reverse());
-      for (const s of e) i.unshift(c$3(s));
-    } else void 0 !== s && i.push(c$3(s));
-    return i;
-  }
-  static _$Eu(t, s) {
-    const i = s.attribute;
-    return !1 === i ? void 0 : "string" == typeof i ? i : "string" == typeof t ? t.toLowerCase() : void 0;
-  }
-  constructor() {
-    super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
-  }
-  _$Ev() {
-    this._$ES = new Promise(t => this.enableUpdating = t), this._$AL = new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach(t => t(this));
-  }
-  addController(t) {
-    (this._$EO ??= new Set()).add(t), void 0 !== this.renderRoot && this.isConnected && t.hostConnected?.();
-  }
-  removeController(t) {
-    this._$EO?.delete(t);
-  }
-  _$E_() {
-    const t = new Map(),
-      s = this.constructor.elementProperties;
-    for (const i of s.keys()) this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
-    t.size > 0 && (this._$Ep = t);
-  }
-  createRenderRoot() {
-    const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return S$1(t, this.constructor.elementStyles), t;
-  }
-  connectedCallback() {
-    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(t => t.hostConnected?.());
-  }
-  enableUpdating(t) {}
-  disconnectedCallback() {
-    this._$EO?.forEach(t => t.hostDisconnected?.());
-  }
-  attributeChangedCallback(t, s, i) {
-    this._$AK(t, i);
-  }
-  _$ET(t, s) {
-    const i = this.constructor.elementProperties.get(t),
-      e = this.constructor._$Eu(t, i);
-    if (void 0 !== e && !0 === i.reflect) {
-      const h = (void 0 !== i.converter?.toAttribute ? i.converter : u$3).toAttribute(s, i.type);
-      this._$Em = t, null == h ? this.removeAttribute(e) : this.setAttribute(e, h), this._$Em = null;
-    }
-  }
-  _$AK(t, s) {
-    const i = this.constructor,
-      e = i._$Eh.get(t);
-    if (void 0 !== e && this._$Em !== e) {
-      const t = i.getPropertyOptions(e),
-        h = "function" == typeof t.converter ? {
-          fromAttribute: t.converter
-        } : void 0 !== t.converter?.fromAttribute ? t.converter : u$3;
-      this._$Em = e, this[e] = h.fromAttribute(s, t.type) ?? this._$Ej?.get(e) ?? null, this._$Em = null;
-    }
-  }
-  requestUpdate(t, s, i) {
-    if (void 0 !== t) {
-      const e = this.constructor,
-        h = this[t];
-      if (i ??= e.getPropertyOptions(t), !((i.hasChanged ?? f$1)(h, s) || i.useDefault && i.reflect && h === this._$Ej?.get(t) && !this.hasAttribute(e._$Eu(t, i)))) return;
-      this.C(t, s, i);
-    }
-    !1 === this.isUpdatePending && (this._$ES = this._$EP());
-  }
-  C(t, s, {
-    useDefault: i,
-    reflect: e,
-    wrapped: h
-  }, r) {
-    i && !(this._$Ej ??= new Map()).has(t) && (this._$Ej.set(t, r ?? s ?? this[t]), !0 !== h || void 0 !== r) || (this._$AL.has(t) || (this.hasUpdated || i || (s = void 0), this._$AL.set(t, s)), !0 === e && this._$Em !== t && (this._$Eq ??= new Set()).add(t));
-  }
-  async _$EP() {
-    this.isUpdatePending = !0;
-    try {
-      await this._$ES;
-    } catch (t) {
-      Promise.reject(t);
-    }
-    const t = this.scheduleUpdate();
-    return null != t && (await t), !this.isUpdatePending;
-  }
-  scheduleUpdate() {
-    return this.performUpdate();
-  }
-  performUpdate() {
-    if (!this.isUpdatePending) return;
-    if (!this.hasUpdated) {
-      if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
-        for (const [t, s] of this._$Ep) this[t] = s;
-        this._$Ep = void 0;
-      }
-      const t = this.constructor.elementProperties;
-      if (t.size > 0) for (const [s, i] of t) {
-        const {
-            wrapped: t
-          } = i,
-          e = this[s];
-        !0 !== t || this._$AL.has(s) || void 0 === e || this.C(s, void 0, i, e);
-      }
-    }
-    let t = !1;
-    const s = this._$AL;
-    try {
-      t = this.shouldUpdate(s), t ? (this.willUpdate(s), this._$EO?.forEach(t => t.hostUpdate?.()), this.update(s)) : this._$EM();
-    } catch (s) {
-      throw t = !1, this._$EM(), s;
-    }
-    t && this._$AE(s);
-  }
-  willUpdate(t) {}
-  _$AE(t) {
-    this._$EO?.forEach(t => t.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
-  }
-  _$EM() {
-    this._$AL = new Map(), this.isUpdatePending = !1;
-  }
-  get updateComplete() {
-    return this.getUpdateComplete();
-  }
-  getUpdateComplete() {
-    return this._$ES;
-  }
-  shouldUpdate(t) {
-    return !0;
-  }
-  update(t) {
-    this._$Eq &&= this._$Eq.forEach(t => this._$ET(t, this[t])), this._$EM();
-  }
-  updated(t) {}
-  firstUpdated(t) {}
+import { css as ve, LitElement as Te, html as y, nothing as P } from "lit";
+import { property as te, customElement as Re, state as M, query as ke } from "lit/decorators.js";
+const $ = globalThis, u = (o) => {
+  $.emitLitDebugLogEvents && $.dispatchEvent(new CustomEvent("lit-debug", {
+    detail: o
+  }));
 };
-y$1.elementStyles = [], y$1.shadowRootOptions = {
-  mode: "open"
-}, y$1[d$1("elementProperties")] = new Map(), y$1[d$1("finalized")] = new Map(), p$2?.({
-  ReactiveElement: y$1
-}), (a$1.reactiveElementVersions ??= []).push("2.1.0");
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t$4 = globalThis,
-  i$3 = t$4.trustedTypes,
-  s$2 = i$3 ? i$3.createPolicy("lit-html", {
-    createHTML: t => t
-  }) : void 0,
-  e$4 = "$lit$",
-  h = `lit$${Math.random().toFixed(9).slice(2)}$`,
-  o$4 = "?" + h,
-  n$2 = `<${o$4}>`,
-  r$3 = document,
-  l = () => r$3.createComment(""),
-  c$1 = t => null === t || "object" != typeof t && "function" != typeof t,
-  a = Array.isArray,
-  u$2 = t => a(t) || "function" == typeof t?.[Symbol.iterator],
-  d = "[ \t\n\f\r]",
-  f = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
-  v$1 = /-->/g,
-  _ = />/g,
-  m$1 = RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"),
-  p$1 = /'/g,
-  g = /"/g,
-  $ = /^(?:script|style|textarea|title)$/i,
-  y = t => (i, ...s) => ({
-    _$litType$: t,
-    strings: i,
-    values: s
-  }),
-  x = y(1),
-  T = Symbol.for("lit-noChange"),
-  E = Symbol.for("lit-nothing"),
-  A = new WeakMap(),
-  C = r$3.createTreeWalker(r$3, 129);
-function P(t, i) {
-  if (!a(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return void 0 !== s$2 ? s$2.createHTML(i) : i;
+let I;
+$.litIssuedWarnings ??= /* @__PURE__ */ new Set(), I = (o, e) => {
+  e += o ? ` See https://lit.dev/msg/${o} for more information.` : "", !$.litIssuedWarnings.has(e) && !$.litIssuedWarnings.has(o) && (console.warn(e), $.litIssuedWarnings.add(e));
+}, queueMicrotask(() => {
+  I("dev-mode", "Lit is in dev mode. Not recommended for production!");
+});
+const x = $.ShadyDOM?.inUse && $.ShadyDOM?.noPatch === !0 ? $.ShadyDOM.wrap : (o) => o, z = $.trustedTypes, pe = z ? z.createPolicy("lit-html", {
+  createHTML: (o) => o
+}) : void 0, De = (o) => o, Ce = (o, e, t) => De, ue = (o, e, t) => j(), Ne = "$lit$", v = `lit$${Math.random().toFixed(9).slice(2)}$`, Se = "?" + v, Ue = `<${Se}>`, V = document, O = () => V.createComment(""), D = (o) => o === null || typeof o != "object" && typeof o != "function", ie = Array.isArray, Ie = (o) => ie(o) || // eslint-disable-next-line @typescript-eslint/no-explicit-any
+typeof o?.[Symbol.iterator] == "function", K = `[ 	
+\f\r]`, ze = `[^ 	
+\f\r"'\`<>=]`, Oe = `[^\\s"'>=/]`, R = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, fe = 1, G = 2, He = 3, ge = /-->/g, _e = />/g, S = new RegExp(`>|${K}(?:(${Oe}+)(${K}*=${K}*(?:${ze}|("|')|))|$)`, "g"), Be = 0, ye = 1, je = 2, $e = 3, Y = /'/g, Z = /"/g, Ee = /^(?:script|style|textarea|title)$/i, J = 2, ee = 3, se = 1, H = 2, We = 3, Fe = 4, Ke = 5, ne = 6, Ge = 7, N = /* @__PURE__ */ Symbol.for("lit-noChange"), _ = /* @__PURE__ */ Symbol.for("lit-nothing"), be = /* @__PURE__ */ new WeakMap(), A = V.createTreeWalker(
+  V,
+  129
+  /* NodeFilter.SHOW_{ELEMENT|COMMENT} */
+);
+let j = Ce;
+function Ae(o, e) {
+  if (!ie(o) || !o.hasOwnProperty("raw")) {
+    let t = "invalid template strings array";
+    throw t = `
+          Internal Error: expected template strings to be an array
+          with a 'raw' field. Faking a template strings array by
+          calling html or svg like an ordinary function is effectively
+          the same as calling unsafeHtml and can lead to major security
+          issues, e.g. opening your code up to XSS attacks.
+          If you're using the html or svg tagged template functions normally
+          and still seeing this error, please file a bug at
+          https://github.com/lit/lit/issues/new?template=bug_report.md
+          and include information about your build tooling, if any.
+        `.trim().replace(/\n */g, `
+`), new Error(t);
+  }
+  return pe !== void 0 ? pe.createHTML(e) : e;
 }
-const V = (t, i) => {
-  const s = t.length - 1,
-    o = [];
-  let r,
-    l = 2 === i ? "<svg>" : 3 === i ? "<math>" : "",
-    c = f;
-  for (let i = 0; i < s; i++) {
-    const s = t[i];
-    let a,
-      u,
-      d = -1,
-      y = 0;
-    for (; y < s.length && (c.lastIndex = y, u = c.exec(s), null !== u);) y = c.lastIndex, c === f ? "!--" === u[1] ? c = v$1 : void 0 !== u[1] ? c = _ : void 0 !== u[2] ? ($.test(u[2]) && (r = RegExp("</" + u[2], "g")), c = m$1) : void 0 !== u[3] && (c = m$1) : c === m$1 ? ">" === u[0] ? (c = r ?? f, d = -1) : void 0 === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = void 0 === u[3] ? m$1 : '"' === u[3] ? g : p$1) : c === g || c === p$1 ? c = m$1 : c === v$1 || c === _ ? c = f : (c = m$1, r = void 0);
-    const x = c === m$1 && t[i + 1].startsWith("/>") ? " " : "";
-    l += c === f ? s + n$2 : d >= 0 ? (o.push(a), s.slice(0, d) + e$4 + s.slice(d) + h + x) : s + h + (-2 === d ? i : x);
-  }
-  return [P(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : 3 === i ? "</math>" : "")), o];
+const Ye = (o, e) => {
+  const t = o.length - 1, i = [];
+  let s = e === J ? "<svg>" : e === ee ? "<math>" : "", n, r = R;
+  for (let a = 0; a < t; a++) {
+    const c = o[a];
+    let f = -1, m, d = 0, l;
+    for (; d < c.length && (r.lastIndex = d, l = r.exec(c), l !== null); )
+      if (d = r.lastIndex, r === R) {
+        if (l[fe] === "!--")
+          r = ge;
+        else if (l[fe] !== void 0)
+          r = _e;
+        else if (l[G] !== void 0)
+          Ee.test(l[G]) && (n = new RegExp(`</${l[G]}`, "g")), r = S;
+        else if (l[He] !== void 0)
+          throw new Error("Bindings in tag names are not supported. Please use static templates instead. See https://lit.dev/docs/templates/expressions/#static-expressions");
+      } else r === S ? l[Be] === ">" ? (r = n ?? R, f = -1) : l[ye] === void 0 ? f = -2 : (f = r.lastIndex - l[je].length, m = l[ye], r = l[$e] === void 0 ? S : l[$e] === '"' ? Z : Y) : r === Z || r === Y ? r = S : r === ge || r === _e ? r = R : (r = S, n = void 0);
+    console.assert(f === -1 || r === S || r === Y || r === Z, "unexpected parse state B");
+    const p = r === S && o[a + 1].startsWith("/>") ? " " : "";
+    s += r === R ? c + Ue : f >= 0 ? (i.push(m), c.slice(0, f) + Ne + c.slice(f) + v + p) : c + v + (f === -2 ? a : p);
+  }
+  const h = s + (o[t] || "<?>") + (e === J ? "</svg>" : e === ee ? "</math>" : "");
+  return [Ae(o, h), i];
 };
-class N {
-  constructor({
-    strings: t,
-    _$litType$: s
-  }, n) {
-    let r;
+class U {
+  constructor({ strings: e, ["_$litType$"]: t }, i) {
     this.parts = [];
-    let c = 0,
-      a = 0;
-    const u = t.length - 1,
-      d = this.parts,
-      [f, v] = V(t, s);
-    if (this.el = N.createElement(f, n), C.currentNode = this.el.content, 2 === s || 3 === s) {
-      const t = this.el.content.firstChild;
-      t.replaceWith(...t.childNodes);
+    let s, n = 0, r = 0;
+    const h = e.length - 1, a = this.parts, [c, f] = Ye(e, t);
+    if (this.el = U.createElement(c, i), A.currentNode = this.el.content, t === J || t === ee) {
+      const m = this.el.content.firstChild;
+      m.replaceWith(...m.childNodes);
     }
-    for (; null !== (r = C.nextNode()) && d.length < u;) {
-      if (1 === r.nodeType) {
-        if (r.hasAttributes()) for (const t of r.getAttributeNames()) if (t.endsWith(e$4)) {
-          const i = v[a++],
-            s = r.getAttribute(t).split(h),
-            e = /([.?@])?(.*)/.exec(i);
-          d.push({
-            type: 1,
-            index: c,
-            name: e[2],
-            strings: s,
-            ctor: "." === e[1] ? H : "?" === e[1] ? I : "@" === e[1] ? L : k
-          }), r.removeAttribute(t);
-        } else t.startsWith(h) && (d.push({
-          type: 6,
-          index: c
-        }), r.removeAttribute(t));
-        if ($.test(r.tagName)) {
-          const t = r.textContent.split(h),
-            s = t.length - 1;
-          if (s > 0) {
-            r.textContent = i$3 ? i$3.emptyScript : "";
-            for (let i = 0; i < s; i++) r.append(t[i], l()), C.nextNode(), d.push({
-              type: 2,
-              index: ++c
-            });
-            r.append(t[s], l());
+    for (; (s = A.nextNode()) !== null && a.length < h; ) {
+      if (s.nodeType === 1) {
+        {
+          const m = s.localName;
+          if (/^(?:textarea|template)$/i.test(m) && s.innerHTML.includes(v)) {
+            const d = `Expressions are not supported inside \`${m}\` elements. See https://lit.dev/msg/expression-in-${m} for more information.`;
+            if (m === "template")
+              throw new Error(d);
+            I("", d);
           }
         }
-      } else if (8 === r.nodeType) if (r.data === o$4) d.push({
-        type: 2,
-        index: c
-      });else {
-        let t = -1;
-        for (; -1 !== (t = r.data.indexOf(h, t + 1));) d.push({
-          type: 7,
-          index: c
-        }), t += h.length - 1;
-      }
-      c++;
+        if (s.hasAttributes())
+          for (const m of s.getAttributeNames())
+            if (m.endsWith(Ne)) {
+              const d = f[r++], p = s.getAttribute(m).split(v), g = /([.?@])?(.*)/.exec(d);
+              a.push({
+                type: se,
+                index: n,
+                name: g[2],
+                strings: p,
+                ctor: g[1] === "." ? qe : g[1] === "?" ? Qe : g[1] === "@" ? Xe : W
+              }), s.removeAttribute(m);
+            } else m.startsWith(v) && (a.push({
+              type: ne,
+              index: n
+            }), s.removeAttribute(m));
+        if (Ee.test(s.tagName)) {
+          const m = s.textContent.split(v), d = m.length - 1;
+          if (d > 0) {
+            s.textContent = z ? z.emptyScript : "";
+            for (let l = 0; l < d; l++)
+              s.append(m[l], O()), A.nextNode(), a.push({ type: H, index: ++n });
+            s.append(m[d], O());
+          }
+        }
+      } else if (s.nodeType === 8)
+        if (s.data === Se)
+          a.push({ type: H, index: n });
+        else {
+          let d = -1;
+          for (; (d = s.data.indexOf(v, d + 1)) !== -1; )
+            a.push({ type: Ge, index: n }), d += v.length - 1;
+        }
+      n++;
     }
+    if (f.length !== r)
+      throw new Error('Detected duplicate attribute bindings. This occurs if your template has duplicate attributes on an element tag. For example "<input ?disabled=${true} ?disabled=${false}>" contains a duplicate "disabled" attribute. The error was detected in the following template: \n`' + e.join("${...}") + "`");
+    u && u({
+      kind: "template prep",
+      template: this,
+      clonableTemplate: this.el,
+      parts: this.parts,
+      strings: e
+    });
   }
-  static createElement(t, i) {
-    const s = r$3.createElement("template");
-    return s.innerHTML = t, s;
+  // Overridden via `litHtmlPolyfillSupport` to provide platform support.
+  /** @nocollapse */
+  static createElement(e, t) {
+    const i = V.createElement("template");
+    return i.innerHTML = e, i;
   }
 }
-function S(t, i, s = t, e) {
-  if (i === T) return i;
-  let h = void 0 !== e ? s._$Co?.[e] : s._$Cl;
-  const o = c$1(i) ? void 0 : i._$litDirective$;
-  return h?.constructor !== o && (h?._$AO?.(!1), void 0 === o ? h = void 0 : (h = new o(t), h._$AT(t, s, e)), void 0 !== e ? (s._$Co ??= [])[e] = h : s._$Cl = h), void 0 !== h && (i = S(t, h._$AS(t, i.values), h, e)), i;
+function L(o, e, t = o, i) {
+  if (e === N)
+    return e;
+  let s = i !== void 0 ? t.__directives?.[i] : t.__directive;
+  const n = D(e) ? void 0 : (
+    // This property needs to remain unminified.
+    e._$litDirective$
+  );
+  return s?.constructor !== n && (s?._$notifyDirectiveConnectionChanged?.(!1), n === void 0 ? s = void 0 : (s = new n(o), s._$initialize(o, t, i)), i !== void 0 ? (t.__directives ??= [])[i] = s : t.__directive = s), s !== void 0 && (e = L(o, s._$resolve(o, e.values), s, i)), e;
 }
-let M$1 = class M {
-  constructor(t, i) {
-    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
+class Ze {
+  constructor(e, t) {
+    this._$parts = [], this._$disconnectableChildren = void 0, this._$template = e, this._$parent = t;
   }
+  // Called by ChildPart parentNode getter
   get parentNode() {
-    return this._$AM.parentNode;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  u(t) {
-    const {
-        el: {
-          content: i
-        },
-        parts: s
-      } = this._$AD,
-      e = (t?.creationScope ?? r$3).importNode(i, !0);
-    C.currentNode = e;
-    let h = C.nextNode(),
-      o = 0,
-      n = 0,
-      l = s[0];
-    for (; void 0 !== l;) {
-      if (o === l.index) {
-        let i;
-        2 === l.type ? i = new R(h, h.nextSibling, this, t) : 1 === l.type ? i = new l.ctor(h, l.name, l.strings, this, t) : 6 === l.type && (i = new z(h, this, t)), this._$AV.push(i), l = s[++n];
+    return this._$parent.parentNode;
+  }
+  // See comment in Disconnectable interface for why this is a getter
+  get _$isConnected() {
+    return this._$parent._$isConnected;
+  }
+  // This method is separate from the constructor because we need to return a
+  // DocumentFragment and we don't want to hold onto it with an instance field.
+  _clone(e) {
+    const { el: { content: t }, parts: i } = this._$template, s = (e?.creationScope ?? V).importNode(t, !0);
+    A.currentNode = s;
+    let n = A.nextNode(), r = 0, h = 0, a = i[0];
+    for (; a !== void 0; ) {
+      if (r === a.index) {
+        let c;
+        a.type === H ? c = new oe(n, n.nextSibling, this, e) : a.type === se ? c = new a.ctor(n, a.name, a.strings, this, e) : a.type === ne && (c = new Je(n, this, e)), this._$parts.push(c), a = i[++h];
       }
-      o !== l?.index && (h = C.nextNode(), o++);
+      r !== a?.index && (n = A.nextNode(), r++);
     }
-    return C.currentNode = r$3, e;
-  }
-  p(t) {
-    let i = 0;
-    for (const s of this._$AV) void 0 !== s && (void 0 !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
-  }
-};
-class R {
-  get _$AU() {
-    return this._$AM?._$AU ?? this._$Cv;
-  }
-  constructor(t, i, s, e) {
-    this.type = 2, this._$AH = E, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cv = e?.isConnected ?? !0;
+    return A.currentNode = V, s;
+  }
+  _update(e) {
+    let t = 0;
+    for (const i of this._$parts)
+      i !== void 0 && (u && u({
+        kind: "set part",
+        part: i,
+        value: e[t],
+        valueIndex: t,
+        values: e,
+        templateInstance: this
+      }), i.strings !== void 0 ? (i._$setValue(e, i, t), t += i.strings.length - 2) : i._$setValue(e[t])), t++;
   }
+}
+let oe = class Ve {
+  // See comment in Disconnectable interface for why this is a getter
+  get _$isConnected() {
+    return this._$parent?._$isConnected ?? this.__isConnected;
+  }
+  constructor(e, t, i, s) {
+    this.type = H, this._$committedValue = _, this._$disconnectableChildren = void 0, this._$startNode = e, this._$endNode = t, this._$parent = i, this.options = s, this.__isConnected = s?.isConnected ?? !0, this._textSanitizer = void 0;
+  }
+  /**
+   * The parent node into which the part renders its content.
+   *
+   * A ChildPart's content consists of a range of adjacent child nodes of
+   * `.parentNode`, possibly bordered by 'marker nodes' (`.startNode` and
+   * `.endNode`).
+   *
+   * - If both `.startNode` and `.endNode` are non-null, then the part's content
+   * consists of all siblings between `.startNode` and `.endNode`, exclusively.
+   *
+   * - If `.startNode` is non-null but `.endNode` is null, then the part's
+   * content consists of all siblings following `.startNode`, up to and
+   * including the last child of `.parentNode`. If `.endNode` is non-null, then
+   * `.startNode` will always be non-null.
+   *
+   * - If both `.endNode` and `.startNode` are null, then the part's content
+   * consists of all child nodes of `.parentNode`.
+   */
   get parentNode() {
-    let t = this._$AA.parentNode;
-    const i = this._$AM;
-    return void 0 !== i && 11 === t?.nodeType && (t = i.parentNode), t;
-  }
+    let e = x(this._$startNode).parentNode;
+    const t = this._$parent;
+    return t !== void 0 && e?.nodeType === 11 && (e = t.parentNode), e;
+  }
+  /**
+   * The part's leading marker node, if any. See `.parentNode` for more
+   * information.
+   */
   get startNode() {
-    return this._$AA;
+    return this._$startNode;
   }
+  /**
+   * The part's trailing marker node, if any. See `.parentNode` for more
+   * information.
+   */
   get endNode() {
-    return this._$AB;
-  }
-  _$AI(t, i = this) {
-    t = S(this, t, i), c$1(t) ? t === E || null == t || "" === t ? (this._$AH !== E && this._$AR(), this._$AH = E) : t !== this._$AH && t !== T && this._(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : u$2(t) ? this.k(t) : this._(t);
-  }
-  O(t) {
-    return this._$AA.parentNode.insertBefore(t, this._$AB);
-  }
-  T(t) {
-    this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
-  }
-  _(t) {
-    this._$AH !== E && c$1(this._$AH) ? this._$AA.nextSibling.data = t : this.T(r$3.createTextNode(t)), this._$AH = t;
-  }
-  $(t) {
-    const {
-        values: i,
-        _$litType$: s
-      } = t,
-      e = "number" == typeof s ? this._$AC(t) : (void 0 === s.el && (s.el = N.createElement(P(s.h, s.h[0]), this.options)), s);
-    if (this._$AH?._$AD === e) this._$AH.p(i);else {
-      const t = new M$1(e, this),
-        s = t.u(this.options);
-      t.p(i), this.T(s), this._$AH = t;
+    return this._$endNode;
+  }
+  _$setValue(e, t = this) {
+    if (this.parentNode === null)
+      throw new Error("This `ChildPart` has no `parentNode` and therefore cannot accept a value. This likely means the element containing the part was manipulated in an unsupported way outside of Lit's control such that the part's marker nodes were ejected from DOM. For example, setting the element's `innerHTML` or `textContent` can do this.");
+    if (e = L(this, e, t), D(e))
+      e === _ || e == null || e === "" ? (this._$committedValue !== _ && (u && u({
+        kind: "commit nothing to child",
+        start: this._$startNode,
+        end: this._$endNode,
+        parent: this._$parent,
+        options: this.options
+      }), this._$clear()), this._$committedValue = _) : e !== this._$committedValue && e !== N && this._commitText(e);
+    else if (e._$litType$ !== void 0)
+      this._commitTemplateResult(e);
+    else if (e.nodeType !== void 0) {
+      if (this.options?.host === e) {
+        this._commitText("[probable mistake: rendered a template's host in itself (commonly caused by writing ${this} in a template]"), console.warn("Attempted to render the template host", e, "inside itself. This is almost always a mistake, and in dev mode ", "we render some warning text. In production however, we'll ", "render it, which will usually result in an error, and sometimes ", "in the element disappearing from the DOM.");
+        return;
+      }
+      this._commitNode(e);
+    } else Ie(e) ? this._commitIterable(e) : this._commitText(e);
+  }
+  _insert(e) {
+    return x(x(this._$startNode).parentNode).insertBefore(e, this._$endNode);
+  }
+  _commitNode(e) {
+    if (this._$committedValue !== e) {
+      if (this._$clear(), j !== Ce) {
+        const t = this._$startNode.parentNode?.nodeName;
+        if (t === "STYLE" || t === "SCRIPT") {
+          let i = "Forbidden";
+          throw t === "STYLE" ? i = "Lit does not support binding inside style nodes. This is a security risk, as style injection attacks can exfiltrate data and spoof UIs. Consider instead using css`...` literals to compose styles, and do dynamic styling with css custom properties, ::parts, <slot>s, and by mutating the DOM rather than stylesheets." : i = "Lit does not support binding inside script nodes. This is a security risk, as it could allow arbitrary code execution.", new Error(i);
+        }
+      }
+      u && u({
+        kind: "commit node",
+        start: this._$startNode,
+        parent: this._$parent,
+        value: e,
+        options: this.options
+      }), this._$committedValue = this._insert(e);
+    }
+  }
+  _commitText(e) {
+    if (this._$committedValue !== _ && D(this._$committedValue)) {
+      const t = x(this._$startNode).nextSibling;
+      this._textSanitizer === void 0 && (this._textSanitizer = ue()), e = this._textSanitizer(e), u && u({
+        kind: "commit text",
+        node: t,
+        value: e,
+        options: this.options
+      }), t.data = e;
+    } else {
+      const t = V.createTextNode("");
+      this._commitNode(t), this._textSanitizer === void 0 && (this._textSanitizer = ue()), e = this._textSanitizer(e), u && u({
+        kind: "commit text",
+        node: t,
+        value: e,
+        options: this.options
+      }), t.data = e;
+    }
+    this._$committedValue = e;
+  }
+  _commitTemplateResult(e) {
+    const { values: t, ["_$litType$"]: i } = e, s = typeof i == "number" ? this._$getTemplate(e) : (i.el === void 0 && (i.el = U.createElement(Ae(i.h, i.h[0]), this.options)), i);
+    if (this._$committedValue?._$template === s)
+      u && u({
+        kind: "template updating",
+        template: s,
+        instance: this._$committedValue,
+        parts: this._$committedValue._$parts,
+        options: this.options,
+        values: t
+      }), this._$committedValue._update(t);
+    else {
+      const n = new Ze(s, this), r = n._clone(this.options);
+      u && u({
+        kind: "template instantiated",
+        template: s,
+        instance: n,
+        parts: n._$parts,
+        options: this.options,
+        fragment: r,
+        values: t
+      }), n._update(t), u && u({
+        kind: "template instantiated and updated",
+        template: s,
+        instance: n,
+        parts: n._$parts,
+        options: this.options,
+        fragment: r,
+        values: t
+      }), this._commitNode(r), this._$committedValue = n;
     }
   }
-  _$AC(t) {
-    let i = A.get(t.strings);
-    return void 0 === i && A.set(t.strings, i = new N(t)), i;
-  }
-  k(t) {
-    a(this._$AH) || (this._$AH = [], this._$AR());
-    const i = this._$AH;
-    let s,
-      e = 0;
-    for (const h of t) e === i.length ? i.push(s = new R(this.O(l()), this.O(l()), this, this.options)) : s = i[e], s._$AI(h), e++;
-    e < i.length && (this._$AR(s && s._$AB.nextSibling, e), i.length = e);
-  }
-  _$AR(t = this._$AA.nextSibling, i) {
-    for (this._$AP?.(!1, !0, i); t && t !== this._$AB;) {
-      const i = t.nextSibling;
-      t.remove(), t = i;
+  // Overridden via `litHtmlPolyfillSupport` to provide platform support.
+  /** @internal */
+  _$getTemplate(e) {
+    let t = be.get(e.strings);
+    return t === void 0 && be.set(e.strings, t = new U(e)), t;
+  }
+  _commitIterable(e) {
+    ie(this._$committedValue) || (this._$committedValue = [], this._$clear());
+    const t = this._$committedValue;
+    let i = 0, s;
+    for (const n of e)
+      i === t.length ? t.push(s = new Ve(this._insert(O()), this._insert(O()), this, this.options)) : s = t[i], s._$setValue(n), i++;
+    i < t.length && (this._$clear(s && x(s._$endNode).nextSibling, i), t.length = i);
+  }
+  /**
+   * Removes the nodes contained within this Part from the DOM.
+   *
+   * @param start Start node to clear from, for clearing a subset of the part's
+   *     DOM (used when truncating iterables)
+   * @param from  When `start` is specified, the index within the iterable from
+   *     which ChildParts are being removed, used for disconnecting directives in
+   *     those Parts.
+   *
+   * @internal
+   */
+  _$clear(e = x(this._$startNode).nextSibling, t) {
+    for (this._$notifyConnectionChanged?.(!1, !0, t); e && e !== this._$endNode; ) {
+      const i = x(e).nextSibling;
+      x(e).remove(), e = i;
     }
   }
-  setConnected(t) {
-    void 0 === this._$AM && (this._$Cv = t, this._$AP?.(t));
+  /**
+   * Implementation of RootPart's `isConnected`. Note that this method
+   * should only be called on `RootPart`s (the `ChildPart` returned from a
+   * top-level `render()` call). It has no effect on non-root ChildParts.
+   * @param isConnected Whether to set
+   * @internal
+   */
+  setConnected(e) {
+    if (this._$parent === void 0)
+      this.__isConnected = e, this._$notifyConnectionChanged?.(e);
+    else
+      throw new Error("part.setConnected() may only be called on a RootPart returned from render().");
   }
-}
-class k {
+};
+class W {
   get tagName() {
     return this.element.tagName;
   }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  constructor(t, i, s, e, h) {
-    this.type = 1, this._$AH = E, this._$AN = void 0, this.element = t, this.name = i, this._$AM = e, this.options = h, s.length > 2 || "" !== s[0] || "" !== s[1] ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = E;
-  }
-  _$AI(t, i = this, s, e) {
-    const h = this.strings;
-    let o = !1;
-    if (void 0 === h) t = S(this, t, i, 0), o = !c$1(t) || t !== this._$AH && t !== T, o && (this._$AH = t);else {
-      const e = t;
-      let n, r;
-      for (t = h[0], n = 0; n < h.length - 1; n++) r = S(this, e[s + n], i, n), r === T && (r = this._$AH[n]), o ||= !c$1(r) || r !== this._$AH[n], r === E ? t = E : t !== E && (t += (r ?? "") + h[n + 1]), this._$AH[n] = r;
+  // See comment in Disconnectable interface for why this is a getter
+  get _$isConnected() {
+    return this._$parent._$isConnected;
+  }
+  constructor(e, t, i, s, n) {
+    this.type = se, this._$committedValue = _, this._$disconnectableChildren = void 0, this.element = e, this.name = t, this._$parent = s, this.options = n, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$committedValue = new Array(i.length - 1).fill(new String()), this.strings = i) : this._$committedValue = _, this._sanitizer = void 0;
+  }
+  /**
+   * Sets the value of this part by resolving the value from possibly multiple
+   * values and static strings and committing it to the DOM.
+   * If this part is single-valued, `this._strings` will be undefined, and the
+   * method will be called with a single value argument. If this part is
+   * multi-value, `this._strings` will be defined, and the method is called
+   * with the value array of the part's owning TemplateInstance, and an offset
+   * into the value array from which the values should be read.
+   * This method is overloaded this way to eliminate short-lived array slices
+   * of the template instance values, and allow a fast-path for single-valued
+   * parts.
+   *
+   * @param value The part value, or an array of values for multi-valued parts
+   * @param valueIndex the index to start reading values from. `undefined` for
+   *   single-valued parts
+   * @param noCommit causes the part to not commit its value to the DOM. Used
+   *   in hydration to prime attribute parts with their first-rendered value,
+   *   but not set the attribute, and in SSR to no-op the DOM operation and
+   *   capture the value for serialization.
+   *
+   * @internal
+   */
+  _$setValue(e, t = this, i, s) {
+    const n = this.strings;
+    let r = !1;
+    if (n === void 0)
+      e = L(this, e, t, 0), r = !D(e) || e !== this._$committedValue && e !== N, r && (this._$committedValue = e);
+    else {
+      const h = e;
+      e = n[0];
+      let a, c;
+      for (a = 0; a < n.length - 1; a++)
+        c = L(this, h[i + a], t, a), c === N && (c = this._$committedValue[a]), r ||= !D(c) || c !== this._$committedValue[a], c === _ ? e = _ : e !== _ && (e += (c ?? "") + n[a + 1]), this._$committedValue[a] = c;
     }
-    o && !e && this.j(t);
-  }
-  j(t) {
-    t === E ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+    r && !s && this._commitValue(e);
+  }
+  /** @internal */
+  _commitValue(e) {
+    e === _ ? x(this.element).removeAttribute(this.name) : (this._sanitizer === void 0 && (this._sanitizer = j(this.element, this.name)), e = this._sanitizer(e ?? ""), u && u({
+      kind: "commit attribute",
+      element: this.element,
+      name: this.name,
+      value: e,
+      options: this.options
+    }), x(this.element).setAttribute(this.name, e ?? ""));
   }
 }
-class H extends k {
+class qe extends W {
   constructor() {
-    super(...arguments), this.type = 3;
-  }
-  j(t) {
-    this.element[this.name] = t === E ? void 0 : t;
+    super(...arguments), this.type = We;
+  }
+  /** @internal */
+  _commitValue(e) {
+    this._sanitizer === void 0 && (this._sanitizer = j(this.element, this.name)), e = this._sanitizer(e), u && u({
+      kind: "commit property",
+      element: this.element,
+      name: this.name,
+      value: e,
+      options: this.options
+    }), this.element[this.name] = e === _ ? void 0 : e;
   }
 }
-class I extends k {
+class Qe extends W {
   constructor() {
-    super(...arguments), this.type = 4;
-  }
-  j(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== E);
+    super(...arguments), this.type = Fe;
+  }
+  /** @internal */
+  _commitValue(e) {
+    u && u({
+      kind: "commit boolean attribute",
+      element: this.element,
+      name: this.name,
+      value: !!(e && e !== _),
+      options: this.options
+    }), x(this.element).toggleAttribute(this.name, !!e && e !== _);
   }
 }
-class L extends k {
-  constructor(t, i, s, e, h) {
-    super(t, i, s, e, h), this.type = 5;
-  }
-  _$AI(t, i = this) {
-    if ((t = S(this, t, i, 0) ?? E) === T) return;
-    const s = this._$AH,
-      e = t === E && s !== E || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive,
-      h = t !== E && (s === E || e);
-    e && this.element.removeEventListener(this.name, this, s), h && this.element.addEventListener(this.name, this, t), this._$AH = t;
-  }
-  handleEvent(t) {
-    "function" == typeof this._$AH ? this._$AH.call(this.options?.host ?? this.element, t) : this._$AH.handleEvent(t);
+class Xe extends W {
+  constructor(e, t, i, s, n) {
+    if (super(e, t, i, s, n), this.type = Ke, this.strings !== void 0)
+      throw new Error(`A \`<${e.localName}>\` has a \`@${t}=...\` listener with invalid content. Event listeners in templates must have exactly one expression and no surrounding text.`);
+  }
+  // EventPart does not use the base _$setValue/_resolveValue implementation
+  // since the dirty checking is more complex
+  /** @internal */
+  _$setValue(e, t = this) {
+    if (e = L(this, e, t, 0) ?? _, e === N)
+      return;
+    const i = this._$committedValue, s = e === _ && i !== _ || e.capture !== i.capture || e.once !== i.once || e.passive !== i.passive, n = e !== _ && (i === _ || s);
+    u && u({
+      kind: "commit event listener",
+      element: this.element,
+      name: this.name,
+      value: e,
+      options: this.options,
+      removeListener: s,
+      addListener: n,
+      oldListener: i
+    }), s && this.element.removeEventListener(this.name, this, i), n && this.element.addEventListener(this.name, this, e), this._$committedValue = e;
+  }
+  handleEvent(e) {
+    typeof this._$committedValue == "function" ? this._$committedValue.call(this.options?.host ?? this.element, e) : this._$committedValue.handleEvent(e);
   }
 }
-class z {
-  constructor(t, i, s) {
-    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = i, this.options = s;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AI(t) {
-    S(this, t);
+class Je {
+  constructor(e, t, i) {
+    this.element = e, this.type = ne, this._$disconnectableChildren = void 0, this._$parent = t, this.options = i;
+  }
+  // See comment in Disconnectable interface for why this is a getter
+  get _$isConnected() {
+    return this._$parent._$isConnected;
+  }
+  _$setValue(e) {
+    u && u({
+      kind: "commit to element binding",
+      element: this.element,
+      value: e,
+      options: this.options
+    }), L(this, e);
   }
 }
-const Z = {
-    M: e$4,
-    P: h,
-    A: o$4,
-    C: 1,
-    L: V,
-    R: M$1,
-    D: u$2,
-    V: S,
-    I: R,
-    H: k,
-    N: I,
-    U: L,
-    B: H,
-    F: z
-  },
-  j = t$4.litHtmlPolyfillSupport;
-j?.(N, R), (t$4.litHtmlVersions ??= []).push("3.3.0");
-const B = (t, i, s) => {
-  const e = s?.renderBefore ?? i;
-  let h = e._$litPart$;
-  if (void 0 === h) {
-    const t = s?.renderBefore ?? null;
-    e._$litPart$ = h = new R(i.insertBefore(l(), t), t, void 0, s ?? {});
-  }
-  return h._$AI(t), h;
-};
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const s$1 = globalThis;
-let i$2 = class i extends y$1 {
-  constructor() {
-    super(...arguments), this.renderOptions = {
-      host: this
-    }, this._$Do = void 0;
-  }
-  createRenderRoot() {
-    const t = super.createRenderRoot();
-    return this.renderOptions.renderBefore ??= t.firstChild, t;
+const et = {
+  _ChildPart: oe
+}, tt = $.litHtmlPolyfillSupportDevMode;
+tt?.(U, oe);
+($.litHtmlVersions ??= []).push("3.3.0");
+$.litHtmlVersions.length > 1 && queueMicrotask(() => {
+  I("multiple-versions", "Multiple versions of Lit loaded. Loading multiple versions is not recommended.");
+});
+const re = {
+  ATTRIBUTE: 1,
+  CHILD: 2
+}, ae = (o) => (...e) => ({
+  // This property needs to remain unminified.
+  _$litDirective$: o,
+  values: e
+});
+class le {
+  constructor(e) {
   }
-  update(t) {
-    const r = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = B(r, this.renderRoot, this.renderOptions);
+  // See comment in Disconnectable interface for why this is a getter
+  get _$isConnected() {
+    return this._$parent._$isConnected;
   }
-  connectedCallback() {
-    super.connectedCallback(), this._$Do?.setConnected(!0);
+  /** @internal */
+  _$initialize(e, t, i) {
+    this.__part = e, this._$parent = t, this.__attributeIndex = i;
   }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this._$Do?.setConnected(!1);
+  /** @internal */
+  _$resolve(e, t) {
+    return this.update(e, t);
   }
-  render() {
-    return T;
+  update(e, t) {
+    return this.render(...t);
   }
-};
-i$2._$litElement$ = !0, i$2["finalized"] = !0, s$1.litElementHydrateSupport?.({
-  LitElement: i$2
-});
-const o$3 = s$1.litElementPolyfillSupport;
-o$3?.({
-  LitElement: i$2
-});
-(s$1.litElementVersions ??= []).push("4.2.0");
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t$3 = t => (e, o) => {
-  void 0 !== o ? o.addInitializer(() => {
-    customElements.define(t, e);
-  }) : customElements.define(t, e);
-};
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const o$2 = {
-    attribute: !0,
-    type: String,
-    converter: u$3,
-    reflect: !1,
-    hasChanged: f$1
-  },
-  r$2 = (t = o$2, e, r) => {
-    const {
-      kind: n,
-      metadata: i
-    } = r;
-    let s = globalThis.litPropertyMetadata.get(i);
-    if (void 0 === s && globalThis.litPropertyMetadata.set(i, s = new Map()), "setter" === n && ((t = Object.create(t)).wrapped = !0), s.set(r.name, t), "accessor" === n) {
-      const {
-        name: o
-      } = r;
-      return {
-        set(r) {
-          const n = e.get.call(this);
-          e.set.call(this, r), this.requestUpdate(o, n, t);
-        },
-        init(e) {
-          return void 0 !== e && this.C(o, void 0, t, e), e;
-        }
-      };
-    }
-    if ("setter" === n) {
-      const {
-        name: o
-      } = r;
-      return function (r) {
-        const n = this[o];
-        e.call(this, r), this.requestUpdate(o, n, t);
-      };
-    }
-    throw Error("Unsupported decorator location: " + n);
-  };
-function n$1(t) {
-  return (e, o) => "object" == typeof o ? r$2(t, e, o) : ((t, e, o) => {
-    const r = e.hasOwnProperty(o);
-    return e.constructor.createProperty(o, t), r ? Object.getOwnPropertyDescriptor(e, o) : void 0;
-  })(t, e, o);
-}
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-function r$1(r) {
-  return n$1({
-    ...r,
-    state: !0,
-    attribute: !1
-  });
 }
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const e$3 = (e, t, c) => (c.configurable = !0, c.enumerable = !0, Reflect.decorate && "object" != typeof t && Object.defineProperty(e, t, c), c);
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-function e$2(e, r) {
-  return (n, s, i) => {
-    const o = t => t.renderRoot?.querySelector(e) ?? null;
-    return e$3(n, s, {
-      get() {
-        return o(this);
-      }
-    });
-  };
-}
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t$2 = {
-    ATTRIBUTE: 1,
-    CHILD: 2,
-    PROPERTY: 3,
-    BOOLEAN_ATTRIBUTE: 4,
-    EVENT: 5,
-    ELEMENT: 6
-  },
-  e$1 = t => (...e) => ({
-    _$litDirective$: t,
-    values: e
-  });
-let i$1 = class i {
-  constructor(t) {}
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AT(t, e, i) {
-    this._$Ct = t, this._$AM = e, this._$Ci = i;
-  }
-  _$AS(t, e) {
-    return this.update(t, e);
-  }
-  update(t, e) {
-    return this.render(...e);
-  }
-};
-
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const n = "important",
-  i = " !" + n,
-  o$1 = e$1(class extends i$1 {
-    constructor(t) {
-      if (super(t), t.type !== t$2.ATTRIBUTE || "style" !== t.name || t.strings?.length > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
-    }
-    render(t) {
-      return Object.keys(t).reduce((e, r) => {
-        const s = t[r];
-        return null == s ? e : e + `${r = r.includes("-") ? r : r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${s};`;
-      }, "");
-    }
-    update(e, [r]) {
-      const {
-        style: s
-      } = e.element;
-      if (void 0 === this.ft) return this.ft = new Set(Object.keys(r)), this.render(r);
-      for (const t of this.ft) null == r[t] && (this.ft.delete(t), t.includes("-") ? s.removeProperty(t) : s[t] = null);
-      for (const t in r) {
-        const e = r[t];
-        if (null != e) {
-          this.ft.add(t);
-          const r = "string" == typeof e && e.endsWith(i);
-          t.includes("-") || r ? s.setProperty(t, r ? e.slice(0, -11) : e, r ? n : "") : s[t] = e;
-        }
+const Le = "important", Me = " !" + Le, it = 0 - Me.length;
+class st extends le {
+  constructor(e) {
+    if (super(e), e.type !== re.ATTRIBUTE || e.name !== "style" || e.strings?.length > 2)
+      throw new Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
+  }
+  render(e) {
+    return Object.keys(e).reduce((t, i) => {
+      const s = e[i];
+      return s == null ? t : (i = i.includes("-") ? i : i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase(), t + `${i}:${s};`);
+    }, "");
+  }
+  update(e, [t]) {
+    const { style: i } = e.element;
+    if (this._previousStyleProperties === void 0)
+      return this._previousStyleProperties = new Set(Object.keys(t)), this.render(t);
+    for (const s of this._previousStyleProperties)
+      t[s] == null && (this._previousStyleProperties.delete(s), s.includes("-") ? i.removeProperty(s) : i[s] = null);
+    for (const s in t) {
+      const n = t[s];
+      if (n != null) {
+        this._previousStyleProperties.add(s);
+        const r = typeof n == "string" && n.endsWith(Me);
+        s.includes("-") || r ? i.setProperty(s, r ? n.slice(0, it) : n, r ? Le : "") : i[s] = n;
       }
-      return T;
     }
-  });
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-class e extends i$1 {
-  constructor(i) {
-    if (super(i), this.it = E, i.type !== t$2.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
-  }
-  render(r) {
-    if (r === E || null == r) return this._t = void 0, this.it = r;
-    if (r === T) return r;
-    if ("string" != typeof r) throw Error(this.constructor.directiveName + "() called with a non-string value");
-    if (r === this.it) return this._t;
-    this.it = r;
-    const s = [r];
-    return s.raw = s, this._t = {
+    return N;
+  }
+}
+const q = ae(st);
+const nt = 1;
+class de extends le {
+  constructor(e) {
+    if (super(e), this._value = _, e.type !== re.CHILD)
+      throw new Error(`${this.constructor.directiveName}() can only be used in child bindings`);
+  }
+  render(e) {
+    if (e === _ || e == null)
+      return this._templateResult = void 0, this._value = e;
+    if (e === N)
+      return e;
+    if (typeof e != "string")
+      throw new Error(`${this.constructor.directiveName}() called with a non-string value`);
+    if (e === this._value)
+      return this._templateResult;
+    this._value = e;
+    const t = [e];
+    return t.raw = t, this._templateResult = {
+      // Cast to a known set of integers that satisfy ResultType so that we
+      // don't have to export ResultType and possibly encourage this pattern.
+      // This property needs to remain unminified.
       _$litType$: this.constructor.resultType,
-      strings: s,
+      strings: t,
       values: []
     };
   }
 }
-e.directiveName = "unsafeHTML", e.resultType = 1;
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-let t$1 = class t extends e {};
-t$1.directiveName = "unsafeSVG", t$1.resultType = 2;
-const o = e$1(t$1);
-
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const {
-    I: t
-  } = Z,
-  s = () => document.createComment(""),
-  r = (o, i, n) => {
-    const e = o._$AA.parentNode,
-      l = void 0 === i ? o._$AB : i._$AA;
-    if (void 0 === n) {
-      const i = e.insertBefore(s(), l),
-        c = e.insertBefore(s(), l);
-      n = new t(i, c, o, o.options);
-    } else {
-      const t = n._$AB.nextSibling,
-        i = n._$AM,
-        c = i !== o;
-      if (c) {
-        let t;
-        n._$AQ?.(o), n._$AM = o, void 0 !== n._$AP && (t = o._$AU) !== i._$AU && n._$AP(t);
-      }
-      if (t !== l || c) {
-        let o = n._$AA;
-        for (; o !== t;) {
-          const t = o.nextSibling;
-          e.insertBefore(o, l), o = t;
-        }
-      }
-    }
-    return n;
-  },
-  v = (o, t, i = o) => (o._$AI(t, i), o),
-  u$1 = {},
-  m = (o, t = u$1) => o._$AH = t,
-  p = o => o._$AH,
-  M = o => {
-    o._$AP?.(!1, !0);
-    let t = o._$AA;
-    const i = o._$AB.nextSibling;
-    for (; t !== i;) {
-      const o = t.nextSibling;
-      t.remove(), t = o;
-    }
-  };
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const u = (e, s, t) => {
-    const r = new Map();
-    for (let l = s; l <= t; l++) r.set(e[l], l);
-    return r;
-  },
-  c = e$1(class extends i$1 {
-    constructor(e) {
-      if (super(e), e.type !== t$2.CHILD) throw Error("repeat() can only be used in text expressions");
-    }
-    dt(e, s, t) {
-      let r;
-      void 0 === t ? t = s : void 0 !== s && (r = s);
-      const l = [],
-        o = [];
-      let i = 0;
-      for (const s of e) l[i] = r ? r(s, i) : i, o[i] = t(s, i), i++;
-      return {
-        values: o,
-        keys: l
-      };
-    }
-    render(e, s, t) {
-      return this.dt(e, s, t).values;
+de.directiveName = "unsafeHTML";
+de.resultType = nt;
+const ot = 2;
+class ce extends de {
+}
+ce.directiveName = "unsafeSVG";
+ce.resultType = ot;
+const rt = ae(ce);
+const { _ChildPart: at } = et, T = window.ShadyDOM?.inUse && window.ShadyDOM?.noPatch === !0 ? window.ShadyDOM.wrap : (o) => o, xe = () => document.createComment(""), k = (o, e, t) => {
+  const i = T(o._$startNode).parentNode, s = e === void 0 ? o._$endNode : e._$startNode;
+  if (t === void 0) {
+    const n = T(i).insertBefore(xe(), s), r = T(i).insertBefore(xe(), s);
+    t = new at(n, r, o, o.options);
+  } else {
+    const n = T(t._$endNode).nextSibling, r = t._$parent, h = r !== o;
+    if (h) {
+      t._$reparentDisconnectables?.(o), t._$parent = o;
+      let a;
+      t._$notifyConnectionChanged !== void 0 && (a = o._$isConnected) !== r._$isConnected && t._$notifyConnectionChanged(a);
     }
-    update(s, [t, r$1, c]) {
-      const d = p(s),
-        {
-          values: p$1,
-          keys: a
-        } = this.dt(t, r$1, c);
-      if (!Array.isArray(d)) return this.ut = a, p$1;
-      const h = this.ut ??= [],
-        v$1 = [];
-      let m$1,
-        y,
-        x = 0,
-        j = d.length - 1,
-        k = 0,
-        w = p$1.length - 1;
-      for (; x <= j && k <= w;) if (null === d[x]) x++;else if (null === d[j]) j--;else if (h[x] === a[k]) v$1[k] = v(d[x], p$1[k]), x++, k++;else if (h[j] === a[w]) v$1[w] = v(d[j], p$1[w]), j--, w--;else if (h[x] === a[w]) v$1[w] = v(d[x], p$1[w]), r(s, v$1[w + 1], d[x]), x++, w--;else if (h[j] === a[k]) v$1[k] = v(d[j], p$1[k]), r(s, d[x], d[j]), j--, k++;else if (void 0 === m$1 && (m$1 = u(a, k, w), y = u(h, x, j)), m$1.has(h[x])) {
-        if (m$1.has(h[j])) {
-          const e = y.get(a[k]),
-            t = void 0 !== e ? d[e] : null;
-          if (null === t) {
-            const e = r(s, d[x]);
-            v(e, p$1[k]), v$1[k] = e;
-          } else v$1[k] = v(t, p$1[k]), r(s, d[x], t), d[e] = null;
-          k++;
-        } else M(d[j]), j--;
-      } else M(d[x]), x++;
-      for (; k <= w;) {
-        const e = r(s, v$1[w + 1]);
-        v(e, p$1[k]), v$1[k++] = e;
+    if (n !== s || h) {
+      let a = t._$startNode;
+      for (; a !== n; ) {
+        const c = T(a).nextSibling;
+        T(i).insertBefore(a, s), a = c;
       }
-      for (; x <= j;) {
-        const e = d[x++];
-        null !== e && M(e);
+    }
+  }
+  return t;
+}, E = (o, e, t = o) => (o._$setValue(e, t), o), lt = {}, dt = (o, e = lt) => o._$committedValue = e, ct = (o) => o._$committedValue, Q = (o) => {
+  o._$notifyConnectionChanged?.(!1, !0);
+  let e = o._$startNode;
+  const t = T(o._$endNode).nextSibling;
+  for (; e !== t; ) {
+    const i = T(e).nextSibling;
+    T(e).remove(), e = i;
+  }
+};
+const we = (o, e, t) => {
+  const i = /* @__PURE__ */ new Map();
+  for (let s = e; s <= t; s++)
+    i.set(o[s], s);
+  return i;
+};
+class ht extends le {
+  constructor(e) {
+    if (super(e), e.type !== re.CHILD)
+      throw new Error("repeat() can only be used in text expressions");
+  }
+  _getValuesAndKeys(e, t, i) {
+    let s;
+    i === void 0 ? i = t : t !== void 0 && (s = t);
+    const n = [], r = [];
+    let h = 0;
+    for (const a of e)
+      n[h] = s ? s(a, h) : h, r[h] = i(a, h), h++;
+    return {
+      values: r,
+      keys: n
+    };
+  }
+  render(e, t, i) {
+    return this._getValuesAndKeys(e, t, i).values;
+  }
+  update(e, [t, i, s]) {
+    const n = ct(e), { values: r, keys: h } = this._getValuesAndKeys(t, i, s);
+    if (!Array.isArray(n))
+      return this._itemKeys = h, r;
+    const a = this._itemKeys ??= [], c = [];
+    let f, m, d = 0, l = n.length - 1, p = 0, g = r.length - 1;
+    for (; d <= l && p <= g; )
+      if (n[d] === null)
+        d++;
+      else if (n[l] === null)
+        l--;
+      else if (a[d] === h[p])
+        c[p] = E(n[d], r[p]), d++, p++;
+      else if (a[l] === h[g])
+        c[g] = E(n[l], r[g]), l--, g--;
+      else if (a[d] === h[g])
+        c[g] = E(n[d], r[g]), k(e, c[g + 1], n[d]), d++, g--;
+      else if (a[l] === h[p])
+        c[p] = E(n[l], r[p]), k(e, n[d], n[l]), l--, p++;
+      else if (f === void 0 && (f = we(h, p, g), m = we(a, d, l)), !f.has(a[d]))
+        Q(n[d]), d++;
+      else if (!f.has(a[l]))
+        Q(n[l]), l--;
+      else {
+        const w = m.get(h[p]), F = w !== void 0 ? n[w] : null;
+        if (F === null) {
+          const me = k(e, n[d]);
+          E(me, r[p]), c[p] = me;
+        } else
+          c[p] = E(F, r[p]), k(e, n[d], F), n[w] = null;
+        p++;
       }
-      return this.ut = a, m(s, v$1), T;
+    for (; p <= g; ) {
+      const w = k(e, c[g + 1]);
+      E(w, r[p]), c[p++] = w;
     }
-  });
-
-let LinearProgress = class LinearProgress extends i$2 {
-    render() {
-        return x `
-            ${this.value !== undefined
-            ? x `<div class="bar" style="width: ${this.value * 100}%;"></div>`
-            : x `<div class="indeterminate"></div>`}
-        `;
+    for (; d <= l; ) {
+      const w = n[d++];
+      w !== null && Q(w);
     }
+    return this._itemKeys = h, dt(e, c), N;
+  }
+}
+const X = ae(ht);
+var mt = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, Pe = (o, e, t, i) => {
+  for (var s = i > 1 ? void 0 : i ? pt(e, t) : e, n = o.length - 1, r; n >= 0; n--)
+    (r = o[n]) && (s = (i ? r(e, t, s) : r(s)) || s);
+  return i && s && mt(e, t, s), s;
 };
-LinearProgress.styles = i$5 `
+let B = class extends Te {
+  render() {
+    return y`
+            ${this.value !== void 0 ? y`<div class="bar" style="width: ${this.value * 100}%;"></div>` : y`<div class="indeterminate"></div>`}
+        `;
+  }
+};
+B.styles = ve`
         :host {
             display: inline-block;
             width: var(--progress-width, 200px);
@@ -1071,301 +755,219 @@ LinearProgress.styles = i$5 `
             }
         }
     `;
-__decorate([
-    n$1({ type: Number })
-], LinearProgress.prototype, "value", void 0);
-LinearProgress = __decorate([
-    t$3('linear-progress')
-], LinearProgress);
-
-class WidgetImage extends i$2 {
-    constructor() {
-        super();
-        this.version = '1.0.6';
-        this.getModifier = this.getModifier.bind(this);
+Pe([
+  te({ type: Number })
+], B.prototype, "value", 2);
+B = Pe([
+  Re("linear-progress")
+], B);
+var ut = Object.defineProperty, C = (o, e, t, i) => {
+  for (var s = void 0, n = o.length - 1, r; n >= 0; n--)
+    (r = o[n]) && (s = r(e, t, s) || s);
+  return s && ut(e, t, s), s;
+};
+const he = class he extends Te {
+  constructor() {
+    super(), this.version = "1.0.7", this.getModifier = this.getModifier.bind(this);
+  }
+  update(e) {
+    e.has("inputData") && (this.transform(), this.modifier || this.getModifier()), e.has("theme") && this.registerTheme(this.theme), super.update(e);
+  }
+  firstUpdated(e) {
+    this.registerTheme(this.theme), new ResizeObserver(this.getModifier).observe(this);
+  }
+  registerTheme(e) {
+    const t = getComputedStyle(this).getPropertyValue("--re-text-color").trim(), i = getComputedStyle(this).getPropertyValue("--re-tile-background-color").trim();
+    this.themeBgColor = i || this.theme?.theme_object?.backgroundColor, this.themeTitleColor = t || this.theme?.theme_object?.title?.textStyle?.color, this.themeSubtitleColor = t || this.theme?.theme_object?.title?.subtextStyle?.color || this.themeTitleColor;
+  }
+  handleFileChange(e) {
+    const i = e.target.files?.[0];
+    i && (this.previewUrl && URL.revokeObjectURL(this.previewUrl), this.previewUrl = URL.createObjectURL(i), this.dispatchEvent(
+      new CustomEvent("overlay-file-selected", {
+        detail: { file: i, name: i.name, size: i.size, type: i.type, url: this.previewUrl },
+        bubbles: !0,
+        composed: !0
+      })
+    ));
+  }
+  transform() {
+    if (this.inlineSvg = void 0, !this.inputData?.image) {
+      this.previewUrl = void 0;
+      return;
     }
-    update(changedProperties) {
-        if (changedProperties.has('inputData')) {
-            this.transform();
-            if (!this.modifier)
-                this.getModifier();
-        }
-        if (changedProperties.has('theme')) {
-            this.registerTheme(this.theme);
-        }
-        super.update(changedProperties);
+    const e = this.inputData.image.trim(), i = e.replace(/^\uFEFF/, "").trimStart().match(/<svg[\s\S]*?<\/svg>/i);
+    if (i) {
+      this.inlineSvg = i[0].trim(), this.previewUrl = void 0;
+      return;
     }
-    firstUpdated(_changedProperties) {
-        this.registerTheme(this.theme);
-        const ro = new ResizeObserver(this.getModifier);
-        ro.observe(this);
+    if (/^data:image\/svg\+xml[,;]/.test(e)) {
+      this.previewUrl = e;
+      return;
     }
-    registerTheme(theme) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        const cssTextColor = getComputedStyle(this).getPropertyValue('--re-text-color').trim();
-        const cssBgColor = getComputedStyle(this).getPropertyValue('--re-tile-background-color').trim();
-        this.themeBgColor = cssBgColor || ((_b = (_a = this.theme) === null || _a === void 0 ? void 0 : _a.theme_object) === null || _b === void 0 ? void 0 : _b.backgroundColor);
-        this.themeTitleColor = cssTextColor || ((_f = (_e = (_d = (_c = this.theme) === null || _c === void 0 ? void 0 : _c.theme_object) === null || _d === void 0 ? void 0 : _d.title) === null || _e === void 0 ? void 0 : _e.textStyle) === null || _f === void 0 ? void 0 : _f.color);
-        this.themeSubtitleColor =
-            cssTextColor || ((_k = (_j = (_h = (_g = this.theme) === null || _g === void 0 ? void 0 : _g.theme_object) === null || _h === void 0 ? void 0 : _h.title) === null || _j === void 0 ? void 0 : _j.subtextStyle) === null || _k === void 0 ? void 0 : _k.color) || this.themeTitleColor;
+    if (/^data:image\/[a-zA-Z.+-]+;base64,/.test(e)) {
+      this.previewUrl = e;
+      return;
     }
-    handleFileChange(ev) {
-        var _a;
-        const input = ev.target;
-        const file = (_a = input.files) === null || _a === void 0 ? void 0 : _a[0];
-        if (!file)
-            return;
-        // Revoke previous object URL
-        if (this.previewUrl)
-            URL.revokeObjectURL(this.previewUrl);
-        this.previewUrl = URL.createObjectURL(file);
-        this.dispatchEvent(new CustomEvent('overlay-file-selected', {
-            detail: { file, name: file.name, size: file.size, type: file.type, url: this.previewUrl },
-            bubbles: true,
-            composed: true
-        }));
+    if (/^[A-Za-z0-9+/]+=*$/.test(e) && e.length > 100) {
+      this.previewUrl = `data:image/*;base64,${e}`;
+      return;
     }
-    transform() {
-        var _a;
-        this.inlineSvg = undefined;
-        if (!((_a = this.inputData) === null || _a === void 0 ? void 0 : _a.image)) {
-            this.previewUrl = undefined;
-            return;
-        }
-        const raw = this.inputData.image.trim();
-        // Dynamically load progress bar element if needed
-        // if (this.inputData?.overlays?.some((o) => o.layerType === 'progress')) {
-        //     import('./linear-progress.js')
-        // }
-        // Inline SVG markup (optionally starting with an XML declaration or other preamble)
-        const trimmed = raw.replace(/^\uFEFF/, '').trimStart();
-        // Find the actual <svg ...>...</svg> block even if preceded by <?xml ...?> or <!DOCTYPE ...>
-        const svgBlockMatch = trimmed.match(/<svg[\s\S]*?<\/svg>/i);
-        if (svgBlockMatch) {
-            this.inlineSvg = svgBlockMatch[0].trim();
-            this.previewUrl = undefined;
-            return;
-        }
-        // Full data URL (already encoded)
-        if (/^data:image\/svg\+xml[,;]/.test(raw)) {
-            // It's an SVG data URL; we could theoretically decode, but safer to keep as src
-            this.previewUrl = raw;
-            return;
-        }
-        if (/^data:image\/[a-zA-Z.+-]+;base64,/.test(raw)) {
-            this.previewUrl = raw;
-            return;
-        }
-        // Bare base64 string (heuristic)
-        if (/^[A-Za-z0-9+/]+=*$/.test(raw) && raw.length > 100) {
-            this.previewUrl = `data:image/*;base64,${raw}`;
-            return;
-        }
-        // Absolute URL
-        try {
-            new URL(raw);
-            this.previewUrl = raw;
-            return;
-        }
-        catch (_b) {
-            // Relative path
-            if (/^([./]|\/)/.test(raw)) {
-                this.previewUrl = raw;
-                return;
-            }
-        }
-        // Fallback
-        this.previewUrl = undefined;
+    try {
+      new URL(e), this.previewUrl = e;
+      return;
+    } catch {
+      if (/^([./]|\/)/.test(e)) {
+        this.previewUrl = e;
+        return;
+      }
     }
-    async getModifier() {
-        var _a;
-        if (!this.baseLayer)
-            return;
-        const rect = this.baseLayer.getBoundingClientRect();
-        if (!rect)
-            return;
-        const containerRect = (_a = this.baseLayer.parentElement) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-        if (!containerRect)
-            return;
-        let intrinsicWidth;
-        let intrinsicHeight;
-        if (this.baseLayer instanceof HTMLImageElement) {
-            // For <img>
-            intrinsicWidth = this.baseLayer.naturalWidth;
-            intrinsicHeight = this.baseLayer.naturalHeight;
-        }
+    this.previewUrl = void 0;
+  }
+  async getModifier() {
+    if (!this.baseLayer) return;
+    const e = this.baseLayer.getBoundingClientRect();
+    if (!e) return;
+    const t = this.baseLayer.parentElement?.getBoundingClientRect();
+    if (!t) return;
+    let i, s;
+    if (this.baseLayer instanceof HTMLImageElement)
+      i = this.baseLayer.naturalWidth, s = this.baseLayer.naturalHeight;
+    else {
+      const d = this.baseLayer.querySelector("svg");
+      if (d) {
+        const l = d.viewBox.baseVal;
+        if (console.log(l), l && l.width > 0 && l.height > 0)
+          i = l.width, s = l.height;
         else {
-            const innerSvg = this.baseLayer.querySelector('svg');
-            if (innerSvg) {
-                // For <svg>
-                const viewBox = innerSvg.viewBox.baseVal;
-                console.log(viewBox);
-                if (viewBox && viewBox.width > 0 && viewBox.height > 0) {
-                    intrinsicWidth = viewBox.width;
-                    intrinsicHeight = viewBox.height;
-                }
-                else {
-                    // fallback to width/height attributes if set
-                    const widthAttr = this.baseLayer.getAttribute('width');
-                    const heightAttr = this.baseLayer.getAttribute('height');
-                    if (widthAttr && heightAttr) {
-                        intrinsicWidth = parseFloat(widthAttr);
-                        intrinsicHeight = parseFloat(heightAttr);
-                    }
-                }
-            }
+          const p = this.baseLayer.getAttribute("width"), g = this.baseLayer.getAttribute("height");
+          p && g && (i = parseFloat(p), s = parseFloat(g));
         }
-        if (!intrinsicWidth || !intrinsicHeight)
-            return;
-        // Actual visible area of the image/svg
-        const scaleX = rect.width / intrinsicWidth;
-        const scaleY = rect.height / intrinsicHeight;
-        const scale = Math.min(scaleX, scaleY);
-        const visibleWidth = intrinsicWidth * scale;
-        const visibleHeight = intrinsicHeight * scale;
-        const xOffset = (containerRect.width - visibleWidth) / 2;
-        const yOffset = (containerRect.height - visibleHeight) / 2;
-        this.modifier = { scaler: scale, xOffset, yOffset, visibleWidth, visibleHeight };
+      }
     }
-    getOverlayItemPosition(relX, relY, modifier) {
-        return {
-            left: relX * modifier.visibleWidth,
-            top: relY * modifier.visibleHeight
-        };
+    if (!i || !s) return;
+    const n = e.width / i, r = e.height / s, h = Math.min(n, r), a = i * h, c = s * h, f = (t.width - a) / 2, m = (t.height - c) / 2;
+    this.modifier = { scaler: h, xOffset: f, yOffset: m, visibleWidth: a, visibleHeight: c };
+  }
+  getOverlayItemPosition(e, t, i) {
+    return {
+      left: e * i.visibleWidth,
+      top: t * i.visibleHeight
+    };
+  }
+  renderText(e, t, i) {
+    const s = e, n = this.getOverlayItemPosition(t.relXPos, t.relYPos, i);
+    if (!n) return P;
+    const r = s.textStyle?.precision ?? 1;
+    let h = t.data;
+    const a = Number(h);
+    let c = "#333";
+    if (!Number.isNaN(a) && typeof r == "number" && r >= 0) {
+      h = a.toFixed(r);
+      const m = s.sections?.sectionLimits.findIndex((d) => a <= d) ?? -2;
+      c = (m >= 1 ? s.sections?.colors[m - 1] : "#333") ?? "#333";
     }
-    renderText(_overlay, item, modifier) {
-        var _a, _b, _c, _d, _e, _f, _g;
-        const overlay = _overlay;
-        const pos = this.getOverlayItemPosition(item.relXPos, item.relYPos, modifier);
-        if (!pos)
-            return E;
-        const precision = (_b = (_a = overlay.textStyle) === null || _a === void 0 ? void 0 : _a.precision) !== null && _b !== void 0 ? _b : 1;
-        let value = item.data;
-        const numericValue = Number(value);
-        let color = '#333';
-        if (!Number.isNaN(numericValue)) {
-            if (typeof precision === 'number' && precision >= 0) {
-                value = numericValue.toFixed(precision);
-                const sectionIndex = (_d = (_c = overlay.sections) === null || _c === void 0 ? void 0 : _c.sectionLimits.findIndex((limit) => numericValue <= limit)) !== null && _d !== void 0 ? _d : -2;
-                color = (_f = (sectionIndex >= 1 ? (_e = overlay.sections) === null || _e === void 0 ? void 0 : _e.colors[sectionIndex - 1] : '#333')) !== null && _f !== void 0 ? _f : '#333';
-            }
-        }
-        const styles = {
-            'font-size': ((_g = overlay.textStyle.fontSize) !== null && _g !== void 0 ? _g : 14) * modifier.scaler + 'px',
-            color,
-            'background-color': overlay.textStyle.backgroundColor,
-            'font-weight': overlay.textStyle.fontWeight,
-            left: `${pos.left}px`,
-            top: `${pos.top}px`,
-            'border-radius': 10 * modifier.scaler + 'px',
-            'transform-origin': '50% 50%',
-            transform: `translate(-50%, -50%)`,
-            padding: `${6 * modifier.scaler}px ${12 * modifier.scaler}px`
-        };
-        return x `
-            <div class="overlay-item" style=${o$1(styles)}>${item.prefix}${value}${item.suffix}</div>
+    const f = {
+      "font-size": (s.textStyle.fontSize ?? 14) * i.scaler + "px",
+      color: c,
+      "background-color": s.textStyle.backgroundColor,
+      "font-weight": s.textStyle.fontWeight,
+      left: `${n.left}px`,
+      top: `${n.top}px`,
+      "border-radius": 10 * i.scaler + "px",
+      "transform-origin": "50% 50%",
+      transform: "translate(-50%, -50%)",
+      padding: `${6 * i.scaler}px ${12 * i.scaler}px`
+    };
+    return y`
+            <div class="overlay-item" style=${q(f)}>${t.prefix}${h}${t.suffix}</div>
         `;
-    }
-    renderProgress(_overlay, item, modifier) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        const overlay = _overlay;
-        const pos = this.getOverlayItemPosition(item.relXPos, item.relYPos, modifier);
-        if (!pos)
-            return E;
-        const sectionIndex = (_b = (_a = overlay.sections) === null || _a === void 0 ? void 0 : _a.sectionLimits.findIndex((limit) => Number(item.data) <= limit)) !== null && _b !== void 0 ? _b : -2;
-        const sectionColor = sectionIndex >= 1 ? (_c = overlay.sections) === null || _c === void 0 ? void 0 : _c.colors[sectionIndex - 1] : undefined;
-        const styles = {
-            '--progress-color': sectionColor !== null && sectionColor !== void 0 ? sectionColor : '#333',
-            '--progress-width': ((_e = (_d = overlay.progressStyle) === null || _d === void 0 ? void 0 : _d.width) !== null && _e !== void 0 ? _e : 10) * modifier.scaler + 'px',
-            '--progress-height': ((_g = (_f = overlay.progressStyle) === null || _f === void 0 ? void 0 : _f.height) !== null && _g !== void 0 ? _g : 100) * modifier.scaler + 'px',
-            '--progress-background': (_j = (_h = overlay.progressStyle) === null || _h === void 0 ? void 0 : _h.backgroundColor) !== null && _j !== void 0 ? _j : '#fff',
-            'border-radius': 10 * modifier.scaler + 'px',
-            'transform-origin': '50% 50%',
-            transform: `translate(-50%, -50%) rotate(${(_l = (_k = overlay.progressStyle) === null || _k === void 0 ? void 0 : _k.rotate) !== null && _l !== void 0 ? _l : 0}deg)`,
-            left: `${pos.left}px`,
-            top: `${pos.top}px`
-        };
-        // Derive percentage based on item.data within overlay.sections min/max.
-        // Supports several possible property names; falls back to sectionLimits array.
-        const rawValue = Number(item.data);
-        const sections = (_m = overlay.sections) !== null && _m !== void 0 ? _m : {};
-        const min = Math.min(...sections.sectionLimits.map(Number));
-        const max = Math.max(...sections.sectionLimits.map(Number));
-        let percent = max === min ? 0 : (rawValue - min) / (max - min);
-        percent = Math.min(1, Math.max(0, percent));
-        // percent now holds the normalized 0-100 percentage for rawValue
-        return x ` <linear-progress .value=${percent} style=${o$1(styles)}></linear-progress> `;
-    }
-    renderLayer(overlay) {
-        const modifier = this.modifier;
-        if (!modifier)
-            return E;
-        const containerStyles = {
-            left: modifier.xOffset + 'px',
-            top: modifier.yOffset + 'px',
-            width: modifier.visibleWidth + 'px',
-            height: modifier.visibleHeight + 'px'
-        };
-        return x `<div
+  }
+  renderProgress(e, t, i) {
+    const s = e, n = this.getOverlayItemPosition(t.relXPos, t.relYPos, i);
+    if (!n) return P;
+    const r = s.sections?.sectionLimits.findIndex((p) => Number(t.data) <= p) ?? -2, a = {
+      "--progress-color": (r >= 1 ? s.sections?.colors[r - 1] : void 0) ?? "#333",
+      "--progress-width": (s.progressStyle?.width ?? 10) * i.scaler + "px",
+      "--progress-height": (s.progressStyle?.height ?? 100) * i.scaler + "px",
+      "--progress-background": s.progressStyle?.backgroundColor ?? "#fff",
+      "border-radius": 10 * i.scaler + "px",
+      "transform-origin": "50% 50%",
+      transform: `translate(-50%, -50%) rotate(${s.progressStyle?.rotate ?? 0}deg)`,
+      left: `${n.left}px`,
+      top: `${n.top}px`
+    }, c = Number(t.data), f = s.sections ?? {}, m = Math.min(...f.sectionLimits.map(Number)), d = Math.max(...f.sectionLimits.map(Number));
+    let l = d === m ? 0 : (c - m) / (d - m);
+    return l = Math.min(1, Math.max(0, l)), y` <linear-progress .value=${l} style=${q(a)}></linear-progress> `;
+  }
+  renderLayer(e) {
+    const t = this.modifier;
+    if (!t) return P;
+    const i = {
+      left: t.xOffset + "px",
+      top: t.yOffset + "px",
+      width: t.visibleWidth + "px",
+      height: t.visibleHeight + "px"
+    };
+    return y`<div
             class="overlay"
-            style=${o$1(containerStyles)}
-            type="${overlay.layerType}"
-            name="${overlay.layerName}"
+            style=${q(i)}
+            type="${e.layerType}"
+            name="${e.layerName}"
         >
-            ${overlay.layerType === 'text'
-            ? this.renderTextLayer(overlay)
-            : this.renderProgressLayer(overlay)}
+            ${e.layerType === "text" ? this.renderTextLayer(e) : this.renderProgressLayer(e)}
         </div>`;
-    }
-    renderTextLayer(overlay) {
-        var _a;
-        const modifier = this.modifier;
-        if (!modifier)
-            return E;
-        return x `${c((_a = overlay.textPins) !== null && _a !== void 0 ? _a : [], (item, idx) => idx, (item) => x `${this.renderText(overlay, item, modifier)}`)}`;
-    }
-    renderProgressLayer(overlay) {
-        var _a;
-        const modifier = this.modifier;
-        if (!modifier)
-            return E;
-        return x `${c((_a = overlay.progressPins) !== null && _a !== void 0 ? _a : [], (item, idx) => idx, (item) => x `${this.renderProgress(overlay, item, modifier)}`)}`;
-    }
-    render() {
-        var _a, _b, _c, _d, _e, _f;
-        const hasImage = !!this.inlineSvg || !!this.previewUrl;
-        return x `
+  }
+  renderTextLayer(e) {
+    const t = this.modifier;
+    return t ? y`${X(
+      e.textPins ?? [],
+      (i, s) => s,
+      (i) => y`${this.renderText(e, i, t)}`
+    )}` : P;
+  }
+  renderProgressLayer(e) {
+    const t = this.modifier;
+    return t ? y`${X(
+      e.progressPins ?? [],
+      (i, s) => s,
+      (i) => y`${this.renderProgress(e, i, t)}`
+    )}` : P;
+  }
+  render() {
+    const e = !!this.inlineSvg || !!this.previewUrl;
+    return y`
             <div class="wrapper" style="background-color: ${this.themeBgColor}">
-                <h3 class="paging" ?active=${(_a = this.inputData) === null || _a === void 0 ? void 0 : _a.title} style="color: ${this.themeTitleColor}">
-                    ${(_b = this.inputData) === null || _b === void 0 ? void 0 : _b.title}
+                <h3 class="paging" ?active=${this.inputData?.title} style="color: ${this.themeTitleColor}">
+                    ${this.inputData?.title}
                 </h3>
                 <p
                     class="paging"
-                    ?active=${(_c = this.inputData) === null || _c === void 0 ? void 0 : _c.subTitle}
+                    ?active=${this.inputData?.subTitle}
                     style="color: ${this.themeSubtitleColor}"
                 >
-                    ${(_d = this.inputData) === null || _d === void 0 ? void 0 : _d.subTitle}
+                    ${this.inputData?.subTitle}
                 </p>
 
-                <div class="paging no-data" ?active=${!hasImage}>No Image</div>
-                <div class="img-container paging" ?active="${hasImage}">
-                    ${this.inlineSvg
-            ? x `<div id="base-layer" class="svg-wrapper">${o(this.inlineSvg)}</div>`
-            : this.previewUrl
-                ? x `<img
+                <div class="paging no-data" ?active=${!e}>No Image</div>
+                <div class="img-container paging" ?active="${e}">
+                    ${this.inlineSvg ? y`<div id="base-layer" class="svg-wrapper">${rt(this.inlineSvg)}</div>` : this.previewUrl ? y`<img
                                 id="base-layer"
                                 @load="${this.getModifier}"
                                 src="${this.previewUrl}"
                                 alt="Image Widget"
-                            />`
-                : ''}
-                    ${c((_f = (_e = this.inputData) === null || _e === void 0 ? void 0 : _e.overlays) !== null && _f !== void 0 ? _f : [], (o) => o.layerName, (o) => x ` ${this.renderLayer(o)} `)}
+                                style="object-fit: ${this.inputData?.stretchToFit ? "fill" : "contain"}"
+                            />` : ""}
+                    ${X(
+      this.inputData?.overlays ?? [],
+      (t) => t.layerName,
+      (t) => y` ${this.renderLayer(t)} `
+    )}
                 </div>
             </div>
         `;
-    }
-}
-WidgetImage.styles = i$5 `
+  }
+};
+he.styles = ve`
         :host {
             display: block;
             font-family: sans-serif;
@@ -1382,7 +984,7 @@ WidgetImage.styles = i$5 `
             flex-direction: column;
             height: 100%;
             width: 100%;
-            padding: 16px;
+            padding: 2%;
             box-sizing: border-box;
         }
 
@@ -1427,7 +1029,6 @@ WidgetImage.styles = i$5 `
         img {
             width: 100%; /* Set the width of the container */
             height: 100%;
-            object-fit: contain;
         }
         .no-data {
             font-size: 20px;
@@ -1449,34 +1050,36 @@ WidgetImage.styles = i$5 `
             pointer-events: auto;
         }
     `;
-__decorate([
-    n$1({ type: Object })
-], WidgetImage.prototype, "inputData", void 0);
-__decorate([
-    n$1({ type: Object })
-], WidgetImage.prototype, "theme", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "themeBgColor", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "themeTitleColor", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "themeSubtitleColor", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "previewUrl", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "inlineSvg", void 0);
-__decorate([
-    r$1()
-], WidgetImage.prototype, "modifier", void 0);
-__decorate([
-    e$2('#base-layer')
-], WidgetImage.prototype, "baseLayer", void 0);
-window.customElements.define('widget-overlay-1.0.6', WidgetImage);
-
-export { WidgetImage };
+let b = he;
+C([
+  te({ type: Object })
+], b.prototype, "inputData");
+C([
+  te({ type: Object })
+], b.prototype, "theme");
+C([
+  M()
+], b.prototype, "themeBgColor");
+C([
+  M()
+], b.prototype, "themeTitleColor");
+C([
+  M()
+], b.prototype, "themeSubtitleColor");
+C([
+  M()
+], b.prototype, "previewUrl");
+C([
+  M()
+], b.prototype, "inlineSvg");
+C([
+  M()
+], b.prototype, "modifier");
+C([
+  ke("#base-layer")
+], b.prototype, "baseLayer");
+window.customElements.define("widget-overlay-1.0.7", b);
+export {
+  b as WidgetImage
+};
 //# sourceMappingURL=widget-overlay.js.map