@decidables/detectable-elements 0.2.3 → 0.2.5

package/lib/detectableElements.esm.js

@@ -274,7 +274,7 @@ d$2.finalized = !0, d$2.elementProperties = new Map(), d$2.elementStyles = [], d
   mode: "open"
 }, null == o$5 || o$5({
   ReactiveElement: d$2
-}), (null !== (s$5 = e$4.reactiveElementVersions) && void 0 !== s$5 ? s$5 : e$4.reactiveElementVersions = []).push("1.5.0");
+}), (null !== (s$5 = e$4.reactiveElementVersions) && void 0 !== s$5 ? s$5 : e$4.reactiveElementVersions = []).push("1.6.1");
 
 /**
  * @license
@@ -287,125 +287,129 @@ const i$2 = window,
   e$3 = s$4 ? s$4.createPolicy("lit-html", {
     createHTML: t => t
   }) : void 0,
-  o$4 = `lit$${(Math.random() + "").slice(9)}$`,
-  n$4 = "?" + o$4,
-  l$4 = `<${n$4}>`,
-  h$2 = document,
-  r$3 = (t = "") => h$2.createComment(t),
+  o$4 = "$lit$",
+  n$4 = `lit$${(Math.random() + "").slice(9)}$`,
+  l$4 = "?" + n$4,
+  h$2 = `<${l$4}>`,
+  r$3 = document,
+  u$1 = () => r$3.createComment(""),
   d$1 = t => null === t || "object" != typeof t && "function" != typeof t,
-  u$1 = Array.isArray,
-  c$1 = t => u$1(t) || "function" == typeof (null == t ? void 0 : t[Symbol.iterator]),
-  v$1 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
-  a$2 = /-->/g,
-  f$1 = />/g,
-  _$1 = RegExp(">|[ \t\n\f\r](?:([^\\s\"'>=/]+)([ \t\n\f\r]*=[ \t\n\f\r]*(?:[^ \t\n\f\r\"'`<>=]|(\"|')|))|$)", "g"),
-  m$1 = /'/g,
-  p$1 = /"/g,
-  $$1 = /^(?:script|style|textarea|title)$/i,
-  x$2 = Symbol.for("lit-noChange"),
-  b$1 = Symbol.for("lit-nothing"),
-  T$1 = new WeakMap(),
-  A$1 = h$2.createTreeWalker(h$2, 129, null, !1),
-  E$1 = (t, i) => {
-    const s = t.length - 1,
-      n = [];
-    let h,
-      r = 2 === i ? "<svg>" : "",
-      d = v$1;
-    for (let i = 0; i < s; i++) {
-      const s = t[i];
-      let e,
-        u,
-        c = -1,
-        g = 0;
-      for (; g < s.length && (d.lastIndex = g, u = d.exec(s), null !== u);) g = d.lastIndex, d === v$1 ? "!--" === u[1] ? d = a$2 : void 0 !== u[1] ? d = f$1 : void 0 !== u[2] ? ($$1.test(u[2]) && (h = RegExp("</" + u[2], "g")), d = _$1) : void 0 !== u[3] && (d = _$1) : d === _$1 ? ">" === u[0] ? (d = null != h ? h : v$1, c = -1) : void 0 === u[1] ? c = -2 : (c = d.lastIndex - u[2].length, e = u[1], d = void 0 === u[3] ? _$1 : '"' === u[3] ? p$1 : m$1) : d === p$1 || d === m$1 ? d = _$1 : d === a$2 || d === f$1 ? d = v$1 : (d = _$1, h = void 0);
-      const y = d === _$1 && t[i + 1].startsWith("/>") ? " " : "";
-      r += d === v$1 ? s + l$4 : c >= 0 ? (n.push(e), s.slice(0, c) + "$lit$" + s.slice(c) + o$4 + y) : s + o$4 + (-2 === c ? (n.push(void 0), i) : y);
-    }
-    const u = r + (t[s] || "<?>") + (2 === i ? "</svg>" : "");
-    if (!Array.isArray(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-    return [void 0 !== e$3 ? e$3.createHTML(u) : u, n];
-  };
-let C$1 = class C {
+  c$1 = Array.isArray,
+  v$1 = t => c$1(t) || "function" == typeof (null == t ? void 0 : t[Symbol.iterator]),
+  a$2 = "[ \t\n\f\r]",
+  f$1 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
+  _$1 = /-->/g,
+  m$1 = />/g,
+  p$1 = RegExp(`>|${a$2}(?:([^\\s"'>=/]+)(${a$2}*=${a$2}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"),
+  g$1 = /'/g,
+  $$1 = /"/g,
+  y$2 = /^(?:script|style|textarea|title)$/i,
+  T$1 = Symbol.for("lit-noChange"),
+  A$1 = Symbol.for("lit-nothing"),
+  E$1 = new WeakMap(),
+  C$1 = r$3.createTreeWalker(r$3, 129, null, !1);
+function P$1(t, i) {
+  if (!Array.isArray(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return void 0 !== e$3 ? e$3.createHTML(i) : i;
+}
+const V$1 = (t, i) => {
+  const s = t.length - 1,
+    e = [];
+  let l,
+    r = 2 === i ? "<svg>" : "",
+    u = f$1;
+  for (let i = 0; i < s; i++) {
+    const s = t[i];
+    let d,
+      c,
+      v = -1,
+      a = 0;
+    for (; a < s.length && (u.lastIndex = a, c = u.exec(s), null !== c);) a = u.lastIndex, u === f$1 ? "!--" === c[1] ? u = _$1 : void 0 !== c[1] ? u = m$1 : void 0 !== c[2] ? (y$2.test(c[2]) && (l = RegExp("</" + c[2], "g")), u = p$1) : void 0 !== c[3] && (u = p$1) : u === p$1 ? ">" === c[0] ? (u = null != l ? l : f$1, v = -1) : void 0 === c[1] ? v = -2 : (v = u.lastIndex - c[2].length, d = c[1], u = void 0 === c[3] ? p$1 : '"' === c[3] ? $$1 : g$1) : u === $$1 || u === g$1 ? u = p$1 : u === _$1 || u === m$1 ? u = f$1 : (u = p$1, l = void 0);
+    const w = u === p$1 && t[i + 1].startsWith("/>") ? " " : "";
+    r += u === f$1 ? s + h$2 : v >= 0 ? (e.push(d), s.slice(0, v) + o$4 + s.slice(v) + n$4 + w) : s + n$4 + (-2 === v ? (e.push(void 0), i) : w);
+  }
+  return [P$1(t, r + (t[s] || "<?>") + (2 === i ? "</svg>" : "")), e];
+};
+let N$1 = class N {
   constructor({
     strings: t,
     _$litType$: i
   }, e) {
-    let l;
+    let h;
     this.parts = [];
-    let h = 0,
+    let r = 0,
       d = 0;
-    const u = t.length - 1,
-      c = this.parts,
-      [v, a] = E$1(t, i);
-    if (this.el = C$1.createElement(v, e), A$1.currentNode = this.el.content, 2 === i) {
+    const c = t.length - 1,
+      v = this.parts,
+      [a, f] = V$1(t, i);
+    if (this.el = N.createElement(a, e), C$1.currentNode = this.el.content, 2 === i) {
       const t = this.el.content,
         i = t.firstChild;
       i.remove(), t.append(...i.childNodes);
     }
-    for (; null !== (l = A$1.nextNode()) && c.length < u;) {
-      if (1 === l.nodeType) {
-        if (l.hasAttributes()) {
+    for (; null !== (h = C$1.nextNode()) && v.length < c;) {
+      if (1 === h.nodeType) {
+        if (h.hasAttributes()) {
           const t = [];
-          for (const i of l.getAttributeNames()) if (i.endsWith("$lit$") || i.startsWith(o$4)) {
-            const s = a[d++];
+          for (const i of h.getAttributeNames()) if (i.endsWith(o$4) || i.startsWith(n$4)) {
+            const s = f[d++];
             if (t.push(i), void 0 !== s) {
-              const t = l.getAttribute(s.toLowerCase() + "$lit$").split(o$4),
+              const t = h.getAttribute(s.toLowerCase() + o$4).split(n$4),
                 i = /([.?@])?(.*)/.exec(s);
-              c.push({
+              v.push({
                 type: 1,
-                index: h,
+                index: r,
                 name: i[2],
                 strings: t,
-                ctor: "." === i[1] ? M$1 : "?" === i[1] ? k$1 : "@" === i[1] ? H$1 : S$2
+                ctor: "." === i[1] ? H$1 : "?" === i[1] ? L$1 : "@" === i[1] ? z$1 : k$1
               });
-            } else c.push({
+            } else v.push({
               type: 6,
-              index: h
+              index: r
             });
           }
-          for (const i of t) l.removeAttribute(i);
+          for (const i of t) h.removeAttribute(i);
         }
-        if ($$1.test(l.tagName)) {
-          const t = l.textContent.split(o$4),
+        if (y$2.test(h.tagName)) {
+          const t = h.textContent.split(n$4),
             i = t.length - 1;
           if (i > 0) {
-            l.textContent = s$4 ? s$4.emptyScript : "";
-            for (let s = 0; s < i; s++) l.append(t[s], r$3()), A$1.nextNode(), c.push({
+            h.textContent = s$4 ? s$4.emptyScript : "";
+            for (let s = 0; s < i; s++) h.append(t[s], u$1()), C$1.nextNode(), v.push({
               type: 2,
-              index: ++h
+              index: ++r
             });
-            l.append(t[i], r$3());
+            h.append(t[i], u$1());
           }
         }
-      } else if (8 === l.nodeType) if (l.data === n$4) c.push({
+      } else if (8 === h.nodeType) if (h.data === l$4) v.push({
         type: 2,
-        index: h
+        index: r
       });else {
         let t = -1;
-        for (; -1 !== (t = l.data.indexOf(o$4, t + 1));) c.push({
+        for (; -1 !== (t = h.data.indexOf(n$4, t + 1));) v.push({
           type: 7,
-          index: h
-        }), t += o$4.length - 1;
+          index: r
+        }), t += n$4.length - 1;
       }
-      h++;
+      r++;
     }
   }
   static createElement(t, i) {
-    const s = h$2.createElement("template");
+    const s = r$3.createElement("template");
     return s.innerHTML = t, s;
   }
 };
-function P$1(t, i, s = t, e) {
+function S$2(t, i, s = t, e) {
   var o, n, l, h;
-  if (i === x$2) return i;
+  if (i === T$1) return i;
   let r = void 0 !== e ? null === (o = s._$Co) || void 0 === o ? void 0 : o[e] : s._$Cl;
   const u = d$1(i) ? void 0 : i._$litDirective$;
-  return (null == r ? void 0 : r.constructor) !== u && (null === (n = null == r ? void 0 : r._$AO) || void 0 === n || n.call(r, !1), void 0 === u ? r = void 0 : (r = new u(t), r._$AT(t, s, e)), void 0 !== e ? (null !== (l = (h = s)._$Co) && void 0 !== l ? l : h._$Co = [])[e] = r : s._$Cl = r), void 0 !== r && (i = P$1(t, r._$AS(t, i.values), r, e)), i;
+  return (null == r ? void 0 : r.constructor) !== u && (null === (n = null == r ? void 0 : r._$AO) || void 0 === n || n.call(r, !1), void 0 === u ? r = void 0 : (r = new u(t), r._$AT(t, s, e)), void 0 !== e ? (null !== (l = (h = s)._$Co) && void 0 !== l ? l : h._$Co = [])[e] = r : s._$Cl = r), void 0 !== r && (i = S$2(t, r._$AS(t, i.values), r, e)), i;
 }
-let V$1 = class V {
+let M$1 = class M {
   constructor(t, i) {
-    this.u = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
+    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
   }
   get parentNode() {
     return this._$AM.parentNode;
@@ -413,7 +417,7 @@ let V$1 = class V {
   get _$AU() {
     return this._$AM._$AU;
   }
-  v(t) {
+  u(t) {
     var i;
     const {
         el: {
@@ -421,39 +425,39 @@ let V$1 = class V {
         },
         parts: e
       } = this._$AD,
-      o = (null !== (i = null == t ? void 0 : t.creationScope) && void 0 !== i ? i : h$2).importNode(s, !0);
-    A$1.currentNode = o;
-    let n = A$1.nextNode(),
+      o = (null !== (i = null == t ? void 0 : t.creationScope) && void 0 !== i ? i : r$3).importNode(s, !0);
+    C$1.currentNode = o;
+    let n = C$1.nextNode(),
       l = 0,
-      r = 0,
-      d = e[0];
-    for (; void 0 !== d;) {
-      if (l === d.index) {
+      h = 0,
+      u = e[0];
+    for (; void 0 !== u;) {
+      if (l === u.index) {
         let i;
-        2 === d.type ? i = new N$1(n, n.nextSibling, this, t) : 1 === d.type ? i = new d.ctor(n, d.name, d.strings, this, t) : 6 === d.type && (i = new I$1(n, this, t)), this.u.push(i), d = e[++r];
+        2 === u.type ? i = new R$1(n, n.nextSibling, this, t) : 1 === u.type ? i = new u.ctor(n, u.name, u.strings, this, t) : 6 === u.type && (i = new Z(n, this, t)), this._$AV.push(i), u = e[++h];
       }
-      l !== (null == d ? void 0 : d.index) && (n = A$1.nextNode(), l++);
+      l !== (null == u ? void 0 : u.index) && (n = C$1.nextNode(), l++);
     }
-    return o;
+    return C$1.currentNode = r$3, o;
   }
-  p(t) {
+  v(t) {
     let i = 0;
-    for (const s of this.u) void 0 !== s && (void 0 !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
+    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++;
   }
 };
-let N$1 = class N {
+let R$1 = class R {
   constructor(t, i, s, e) {
     var o;
-    this.type = 2, this._$AH = b$1, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cm = null === (o = null == e ? void 0 : e.isConnected) || void 0 === o || o;
+    this.type = 2, this._$AH = A$1, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cp = null === (o = null == e ? void 0 : e.isConnected) || void 0 === o || o;
   }
   get _$AU() {
     var t, i;
-    return null !== (i = null === (t = this._$AM) || void 0 === t ? void 0 : t._$AU) && void 0 !== i ? i : this._$Cm;
+    return null !== (i = null === (t = this._$AM) || void 0 === t ? void 0 : t._$AU) && void 0 !== i ? i : this._$Cp;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
     const i = this._$AM;
-    return void 0 !== i && 11 === t.nodeType && (t = i.parentNode), t;
+    return void 0 !== i && 11 === (null == t ? void 0 : t.nodeType) && (t = i.parentNode), t;
   }
   get startNode() {
     return this._$AA;
@@ -462,40 +466,40 @@ let N$1 = class N {
     return this._$AB;
   }
   _$AI(t, i = this) {
-    t = P$1(this, t, i), d$1(t) ? t === b$1 || null == t || "" === t ? (this._$AH !== b$1 && this._$AR(), this._$AH = b$1) : t !== this._$AH && t !== x$2 && this.g(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : c$1(t) ? this.k(t) : this.g(t);
+    t = S$2(this, t, i), d$1(t) ? t === A$1 || null == t || "" === t ? (this._$AH !== A$1 && this._$AR(), this._$AH = A$1) : t !== this._$AH && t !== T$1 && this._(t) : void 0 !== t._$litType$ ? this.g(t) : void 0 !== t.nodeType ? this.$(t) : v$1(t) ? this.T(t) : this._(t);
+  }
+  k(t) {
+    return this._$AA.parentNode.insertBefore(t, this._$AB);
   }
-  O(t, i = this._$AB) {
-    return this._$AA.parentNode.insertBefore(t, i);
+  $(t) {
+    this._$AH !== t && (this._$AR(), this._$AH = this.k(t));
   }
-  T(t) {
-    this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
+  _(t) {
+    this._$AH !== A$1 && d$1(this._$AH) ? this._$AA.nextSibling.data = t : this.$(r$3.createTextNode(t)), this._$AH = t;
   }
   g(t) {
-    this._$AH !== b$1 && d$1(this._$AH) ? this._$AA.nextSibling.data = t : this.T(h$2.createTextNode(t)), this._$AH = t;
-  }
-  $(t) {
     var i;
     const {
         values: s,
         _$litType$: e
       } = t,
-      o = "number" == typeof e ? this._$AC(t) : (void 0 === e.el && (e.el = C$1.createElement(e.h, this.options)), e);
-    if ((null === (i = this._$AH) || void 0 === i ? void 0 : i._$AD) === o) this._$AH.p(s);else {
-      const t = new V$1(o, this),
-        i = t.v(this.options);
-      t.p(s), this.T(i), this._$AH = t;
+      o = "number" == typeof e ? this._$AC(t) : (void 0 === e.el && (e.el = N$1.createElement(P$1(e.h, e.h[0]), this.options)), e);
+    if ((null === (i = this._$AH) || void 0 === i ? void 0 : i._$AD) === o) this._$AH.v(s);else {
+      const t = new M$1(o, this),
+        i = t.u(this.options);
+      t.v(s), this.$(i), this._$AH = t;
     }
   }
   _$AC(t) {
-    let i = T$1.get(t.strings);
-    return void 0 === i && T$1.set(t.strings, i = new C$1(t)), i;
+    let i = E$1.get(t.strings);
+    return void 0 === i && E$1.set(t.strings, i = new N$1(t)), i;
   }
-  k(t) {
-    u$1(this._$AH) || (this._$AH = [], this._$AR());
+  T(t) {
+    c$1(this._$AH) || (this._$AH = [], this._$AR());
     const i = this._$AH;
     let s,
       e = 0;
-    for (const o of t) e === i.length ? i.push(s = new N$1(this.O(r$3()), this.O(r$3()), this, this.options)) : s = i[e], s._$AI(o), e++;
+    for (const o of t) e === i.length ? i.push(s = new R(this.k(u$1()), this.k(u$1()), this, this.options)) : s = i[e], s._$AI(o), e++;
     e < i.length && (this._$AR(s && s._$AB.nextSibling, e), i.length = e);
   }
   _$AR(t = this._$AA.nextSibling, i) {
@@ -507,12 +511,12 @@ let N$1 = class N {
   }
   setConnected(t) {
     var i;
-    void 0 === this._$AM && (this._$Cm = t, null === (i = this._$AP) || void 0 === i || i.call(this, t));
+    void 0 === this._$AM && (this._$Cp = t, null === (i = this._$AP) || void 0 === i || i.call(this, t));
   }
 };
-let S$2 = class S {
+let k$1 = class k {
   constructor(t, i, s, e, o) {
-    this.type = 1, this._$AH = b$1, this._$AN = void 0, this.element = t, this.name = i, this._$AM = e, this.options = o, s.length > 2 || "" !== s[0] || "" !== s[1] ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = b$1;
+    this.type = 1, this._$AH = A$1, this._$AN = void 0, this.element = t, this.name = i, this._$AM = e, this.options = o, s.length > 2 || "" !== s[0] || "" !== s[1] ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = A$1;
   }
   get tagName() {
     return this.element.tagName;
@@ -523,44 +527,44 @@ let S$2 = class S {
   _$AI(t, i = this, s, e) {
     const o = this.strings;
     let n = !1;
-    if (void 0 === o) t = P$1(this, t, i, 0), n = !d$1(t) || t !== this._$AH && t !== x$2, n && (this._$AH = t);else {
+    if (void 0 === o) t = S$2(this, t, i, 0), n = !d$1(t) || t !== this._$AH && t !== T$1, n && (this._$AH = t);else {
       const e = t;
       let l, h;
-      for (t = o[0], l = 0; l < o.length - 1; l++) h = P$1(this, e[s + l], i, l), h === x$2 && (h = this._$AH[l]), n || (n = !d$1(h) || h !== this._$AH[l]), h === b$1 ? t = b$1 : t !== b$1 && (t += (null != h ? h : "") + o[l + 1]), this._$AH[l] = h;
+      for (t = o[0], l = 0; l < o.length - 1; l++) h = S$2(this, e[s + l], i, l), h === T$1 && (h = this._$AH[l]), n || (n = !d$1(h) || h !== this._$AH[l]), h === A$1 ? t = A$1 : t !== A$1 && (t += (null != h ? h : "") + o[l + 1]), this._$AH[l] = h;
     }
     n && !e && this.j(t);
   }
   j(t) {
-    t === b$1 ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, null != t ? t : "");
+    t === A$1 ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, null != t ? t : "");
   }
 };
-let M$1 = class M extends S$2 {
+let H$1 = class H extends k$1 {
   constructor() {
     super(...arguments), this.type = 3;
   }
   j(t) {
-    this.element[this.name] = t === b$1 ? void 0 : t;
+    this.element[this.name] = t === A$1 ? void 0 : t;
   }
 };
-const R = s$4 ? s$4.emptyScript : "";
-let k$1 = class k extends S$2 {
+const I$1 = s$4 ? s$4.emptyScript : "";
+let L$1 = class L extends k$1 {
   constructor() {
     super(...arguments), this.type = 4;
   }
   j(t) {
-    t && t !== b$1 ? this.element.setAttribute(this.name, R) : this.element.removeAttribute(this.name);
+    t && t !== A$1 ? this.element.setAttribute(this.name, I$1) : this.element.removeAttribute(this.name);
   }
 };
-let H$1 = class H extends S$2 {
+let z$1 = class z extends k$1 {
   constructor(t, i, s, e, o) {
     super(t, i, s, e, o), this.type = 5;
   }
   _$AI(t, i = this) {
     var s;
-    if ((t = null !== (s = P$1(this, t, i, 0)) && void 0 !== s ? s : b$1) === x$2) return;
+    if ((t = null !== (s = S$2(this, t, i, 0)) && void 0 !== s ? s : A$1) === T$1) return;
     const e = this._$AH,
-      o = t === b$1 && e !== b$1 || t.capture !== e.capture || t.once !== e.once || t.passive !== e.passive,
-      n = t !== b$1 && (e === b$1 || o);
+      o = t === A$1 && e !== A$1 || t.capture !== e.capture || t.once !== e.once || t.passive !== e.passive,
+      n = t !== A$1 && (e === A$1 || o);
     o && this.element.removeEventListener(this.name, this, e), n && this.element.addEventListener(this.name, this, t), this._$AH = t;
   }
   handleEvent(t) {
@@ -568,7 +572,7 @@ let H$1 = class H extends S$2 {
     "function" == typeof this._$AH ? this._$AH.call(null !== (s = null === (i = this.options) || void 0 === i ? void 0 : i.host) && void 0 !== s ? s : this.element, t) : this._$AH.handleEvent(t);
   }
 };
-let I$1 = class I {
+class Z {
   constructor(t, i, s) {
     this.element = t, this.type = 6, this._$AN = void 0, this._$AM = i, this.options = s;
   }
@@ -576,11 +580,11 @@ let I$1 = class I {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    P$1(this, t);
+    S$2(this, t);
   }
-};
-const z$1 = i$2.litHtmlPolyfillSupport;
-null == z$1 || z$1(C$1, N$1), (null !== (t$2 = i$2.litHtmlVersions) && void 0 !== t$2 ? t$2 : i$2.litHtmlVersions = []).push("2.5.0");
+}
+const B$1 = i$2.litHtmlPolyfillSupport;
+null == B$1 || B$1(N$1, R$1), (null !== (t$2 = i$2.litHtmlVersions) && void 0 !== t$2 ? t$2 : i$2.litHtmlVersions = []).push("2.8.0");
 
 /**
  * @license
@@ -866,149 +870,139 @@ a$1.finalized = !0, a$1.elementProperties = new Map(), a$1.elementStyles = [], a
  * SPDX-License-Identifier: BSD-3-Clause
  */
 var t;
-const i = globalThis.trustedTypes,
-  s$1 = i ? i.createPolicy("lit-html", {
+const i = window,
+  s$1 = i.trustedTypes,
+  e = s$1 ? s$1.createPolicy("lit-html", {
     createHTML: t => t
   }) : void 0,
-  e = `lit$${(Math.random() + "").slice(9)}$`,
-  o$1 = "?" + e,
-  n$1 = `<${o$1}>`,
-  l$2 = document,
-  h = (t = "") => l$2.createComment(t),
-  r = t => null === t || "object" != typeof t && "function" != typeof t,
-  d = Array.isArray,
-  u = t => {
-    var i;
-    return d(t) || "function" == typeof (null === (i = t) || void 0 === i ? void 0 : i[Symbol.iterator]);
-  },
-  c = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
-  v = /-->/g,
-  a = />/g,
-  f = />|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,
-  _ = /'/g,
-  m = /"/g,
-  g = /^(?:script|style|textarea|title)$/i,
-  p = t => (i, ...s) => ({
+  o$1 = "$lit$",
+  n$1 = `lit$${(Math.random() + "").slice(9)}$`,
+  l$2 = "?" + n$1,
+  h = `<${l$2}>`,
+  r = document,
+  d = () => r.createComment(""),
+  u = t => null === t || "object" != typeof t && "function" != typeof t,
+  c = Array.isArray,
+  v = t => c(t) || "function" == typeof (null == t ? void 0 : t[Symbol.iterator]),
+  a = "[ \t\n\f\r]",
+  f = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
+  _ = /-->/g,
+  m = />/g,
+  p = RegExp(`>|${a}(?:([^\\s"'>=/]+)(${a}*=${a}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"),
+  g = /'/g,
+  $ = /"/g,
+  y$1 = /^(?:script|style|textarea|title)$/i,
+  w = t => (i, ...s) => ({
     _$litType$: t,
     strings: i,
     values: s
   }),
-  $ = p(1),
-  y$1 = p(2),
-  b = Symbol.for("lit-noChange"),
-  w = Symbol.for("lit-nothing"),
-  T = new WeakMap(),
-  x$1 = (t, i, s) => {
-    var e, o;
-    const n = null !== (e = null == s ? void 0 : s.renderBefore) && void 0 !== e ? e : i;
-    let l = n._$litPart$;
-    if (void 0 === l) {
-      const t = null !== (o = null == s ? void 0 : s.renderBefore) && void 0 !== o ? o : null;
-      n._$litPart$ = l = new N(i.insertBefore(h(), t), t, void 0, null != s ? s : {});
-    }
-    return l._$AI(t), l;
-  },
-  A = l$2.createTreeWalker(l$2, 129, null, !1),
-  C = (t, i) => {
-    const o = t.length - 1,
+  x$1 = w(1),
+  b = w(2),
+  T = Symbol.for("lit-noChange"),
+  A = Symbol.for("lit-nothing"),
+  E = new WeakMap(),
+  C = r.createTreeWalker(r, 129, null, !1),
+  P = (t, i) => {
+    const s = t.length - 1,
       l = [];
-    let h,
-      r = 2 === i ? "<svg>" : "",
-      d = c;
-    for (let i = 0; i < o; i++) {
+    let r,
+      d = 2 === i ? "<svg>" : "",
+      u = f;
+    for (let i = 0; i < s; i++) {
       const s = t[i];
-      let o,
-        u,
-        p = -1,
-        $ = 0;
-      for (; $ < s.length && (d.lastIndex = $, u = d.exec(s), null !== u);) $ = d.lastIndex, d === c ? "!--" === u[1] ? d = v : void 0 !== u[1] ? d = a : void 0 !== u[2] ? (g.test(u[2]) && (h = RegExp("</" + u[2], "g")), d = f) : void 0 !== u[3] && (d = f) : d === f ? ">" === u[0] ? (d = null != h ? h : c, p = -1) : void 0 === u[1] ? p = -2 : (p = d.lastIndex - u[2].length, o = u[1], d = void 0 === u[3] ? f : '"' === u[3] ? m : _) : d === m || d === _ ? d = f : d === v || d === a ? d = c : (d = f, h = void 0);
-      const y = d === f && t[i + 1].startsWith("/>") ? " " : "";
-      r += d === c ? s + n$1 : p >= 0 ? (l.push(o), s.slice(0, p) + "$lit$" + s.slice(p) + e + y) : s + e + (-2 === p ? (l.push(void 0), i) : y);
+      let e,
+        c,
+        v = -1,
+        a = 0;
+      for (; a < s.length && (u.lastIndex = a, c = u.exec(s), null !== c);) a = u.lastIndex, u === f ? "!--" === c[1] ? u = _ : void 0 !== c[1] ? u = m : void 0 !== c[2] ? (y$1.test(c[2]) && (r = RegExp("</" + c[2], "g")), u = p) : void 0 !== c[3] && (u = p) : u === p ? ">" === c[0] ? (u = null != r ? r : f, v = -1) : void 0 === c[1] ? v = -2 : (v = u.lastIndex - c[2].length, e = c[1], u = void 0 === c[3] ? p : '"' === c[3] ? $ : g) : u === $ || u === g ? u = p : u === _ || u === m ? u = f : (u = p, r = void 0);
+      const w = u === p && t[i + 1].startsWith("/>") ? " " : "";
+      d += u === f ? s + h : v >= 0 ? (l.push(e), s.slice(0, v) + o$1 + s.slice(v) + n$1 + w) : s + n$1 + (-2 === v ? (l.push(void 0), i) : w);
     }
-    const u = r + (t[o] || "<?>") + (2 === i ? "</svg>" : "");
+    const c = d + (t[s] || "<?>") + (2 === i ? "</svg>" : "");
     if (!Array.isArray(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-    return [void 0 !== s$1 ? s$1.createHTML(u) : u, l];
+    return [void 0 !== e ? e.createHTML(c) : c, l];
   };
-class E {
+class V {
   constructor({
     strings: t,
-    _$litType$: s
-  }, n) {
-    let l;
+    _$litType$: i
+  }, e) {
+    let h;
     this.parts = [];
     let r = 0,
-      d = 0;
-    const u = t.length - 1,
-      c = this.parts,
-      [v, a] = C(t, s);
-    if (this.el = E.createElement(v, n), A.currentNode = this.el.content, 2 === s) {
+      u = 0;
+    const c = t.length - 1,
+      v = this.parts,
+      [a, f] = P(t, i);
+    if (this.el = V.createElement(a, e), C.currentNode = this.el.content, 2 === i) {
       const t = this.el.content,
         i = t.firstChild;
       i.remove(), t.append(...i.childNodes);
     }
-    for (; null !== (l = A.nextNode()) && c.length < u;) {
-      if (1 === l.nodeType) {
-        if (l.hasAttributes()) {
+    for (; null !== (h = C.nextNode()) && v.length < c;) {
+      if (1 === h.nodeType) {
+        if (h.hasAttributes()) {
           const t = [];
-          for (const i of l.getAttributeNames()) if (i.endsWith("$lit$") || i.startsWith(e)) {
-            const s = a[d++];
+          for (const i of h.getAttributeNames()) if (i.endsWith(o$1) || i.startsWith(n$1)) {
+            const s = f[u++];
             if (t.push(i), void 0 !== s) {
-              const t = l.getAttribute(s.toLowerCase() + "$lit$").split(e),
+              const t = h.getAttribute(s.toLowerCase() + o$1).split(n$1),
                 i = /([.?@])?(.*)/.exec(s);
-              c.push({
+              v.push({
                 type: 1,
                 index: r,
                 name: i[2],
                 strings: t,
-                ctor: "." === i[1] ? M : "?" === i[1] ? H : "@" === i[1] ? I : S
+                ctor: "." === i[1] ? k : "?" === i[1] ? I : "@" === i[1] ? L : R
               });
-            } else c.push({
+            } else v.push({
               type: 6,
               index: r
             });
           }
-          for (const i of t) l.removeAttribute(i);
-        }
-        if (g.test(l.tagName)) {
-          const t = l.textContent.split(e),
-            s = t.length - 1;
-          if (s > 0) {
-            l.textContent = i ? i.emptyScript : "";
-            for (let i = 0; i < s; i++) l.append(t[i], h()), A.nextNode(), c.push({
+          for (const i of t) h.removeAttribute(i);
+        }
+        if (y$1.test(h.tagName)) {
+          const t = h.textContent.split(n$1),
+            i = t.length - 1;
+          if (i > 0) {
+            h.textContent = s$1 ? s$1.emptyScript : "";
+            for (let s = 0; s < i; s++) h.append(t[s], d()), C.nextNode(), v.push({
               type: 2,
               index: ++r
             });
-            l.append(t[s], h());
+            h.append(t[i], d());
           }
         }
-      } else if (8 === l.nodeType) if (l.data === o$1) c.push({
+      } else if (8 === h.nodeType) if (h.data === l$2) v.push({
         type: 2,
         index: r
       });else {
         let t = -1;
-        for (; -1 !== (t = l.data.indexOf(e, t + 1));) c.push({
+        for (; -1 !== (t = h.data.indexOf(n$1, t + 1));) v.push({
           type: 7,
           index: r
-        }), t += e.length - 1;
+        }), t += n$1.length - 1;
       }
       r++;
     }
   }
   static createElement(t, i) {
-    const s = l$2.createElement("template");
+    const s = r.createElement("template");
     return s.innerHTML = t, s;
   }
 }
-function P(t, i, s = t, e) {
+function N(t, i, s = t, e) {
   var o, n, l, h;
-  if (i === b) return i;
-  let d = void 0 !== e ? null === (o = s._$Cl) || void 0 === o ? void 0 : o[e] : s._$Cu;
-  const u = r(i) ? void 0 : i._$litDirective$;
-  return (null == d ? void 0 : d.constructor) !== u && (null === (n = null == d ? void 0 : d._$AO) || void 0 === n || n.call(d, !1), void 0 === u ? d = void 0 : (d = new u(t), d._$AT(t, s, e)), void 0 !== e ? (null !== (l = (h = s)._$Cl) && void 0 !== l ? l : h._$Cl = [])[e] = d : s._$Cu = d), void 0 !== d && (i = P(t, d._$AS(t, i.values), d, e)), i;
+  if (i === T) return i;
+  let r = void 0 !== e ? null === (o = s._$Co) || void 0 === o ? void 0 : o[e] : s._$Cl;
+  const d = u(i) ? void 0 : i._$litDirective$;
+  return (null == r ? void 0 : r.constructor) !== d && (null === (n = null == r ? void 0 : r._$AO) || void 0 === n || n.call(r, !1), void 0 === d ? r = void 0 : (r = new d(t), r._$AT(t, s, e)), void 0 !== e ? (null !== (l = (h = s)._$Co) && void 0 !== l ? l : h._$Co = [])[e] = r : s._$Cl = r), void 0 !== r && (i = N(t, r._$AS(t, i.values), r, e)), i;
 }
-class V {
+class S {
   constructor(t, i) {
-    this.v = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
+    this.u = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
   }
   get parentNode() {
     return this._$AM.parentNode;
@@ -1016,7 +1010,7 @@ class V {
   get _$AU() {
     return this._$AM._$AU;
   }
-  p(t) {
+  v(t) {
     var i;
     const {
         el: {
@@ -1024,39 +1018,39 @@ class V {
         },
         parts: e
       } = this._$AD,
-      o = (null !== (i = null == t ? void 0 : t.creationScope) && void 0 !== i ? i : l$2).importNode(s, !0);
-    A.currentNode = o;
-    let n = A.nextNode(),
+      o = (null !== (i = null == t ? void 0 : t.creationScope) && void 0 !== i ? i : r).importNode(s, !0);
+    C.currentNode = o;
+    let n = C.nextNode(),
+      l = 0,
       h = 0,
-      r = 0,
       d = e[0];
     for (; void 0 !== d;) {
-      if (h === d.index) {
+      if (l === d.index) {
         let i;
-        2 === d.type ? i = new N(n, n.nextSibling, this, t) : 1 === d.type ? i = new d.ctor(n, d.name, d.strings, this, t) : 6 === d.type && (i = new L(n, this, t)), this.v.push(i), d = e[++r];
+        2 === d.type ? i = new M(n, n.nextSibling, this, t) : 1 === d.type ? i = new d.ctor(n, d.name, d.strings, this, t) : 6 === d.type && (i = new z(n, this, t)), this.u.push(i), d = e[++h];
       }
-      h !== (null == d ? void 0 : d.index) && (n = A.nextNode(), h++);
+      l !== (null == d ? void 0 : d.index) && (n = C.nextNode(), l++);
     }
     return o;
   }
-  m(t) {
+  p(t) {
     let i = 0;
-    for (const s of this.v) void 0 !== s && (void 0 !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
+    for (const s of this.u) void 0 !== s && (void 0 !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
   }
 }
-class N {
+class M {
   constructor(t, i, s, e) {
     var o;
-    this.type = 2, this._$AH = w, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cg = null === (o = null == e ? void 0 : e.isConnected) || void 0 === o || o;
+    this.type = 2, this._$AH = A, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cm = null === (o = null == e ? void 0 : e.isConnected) || void 0 === o || o;
   }
   get _$AU() {
     var t, i;
-    return null !== (i = null === (t = this._$AM) || void 0 === t ? void 0 : t._$AU) && void 0 !== i ? i : this._$Cg;
+    return null !== (i = null === (t = this._$AM) || void 0 === t ? void 0 : t._$AU) && void 0 !== i ? i : this._$Cm;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
     const i = this._$AM;
-    return void 0 !== i && 11 === t.nodeType && (t = i.parentNode), t;
+    return void 0 !== i && 11 === (null == t ? void 0 : t.nodeType) && (t = i.parentNode), t;
   }
   get startNode() {
     return this._$AA;
@@ -1065,40 +1059,40 @@ class N {
     return this._$AB;
   }
   _$AI(t, i = this) {
-    t = P(this, t, i), r(t) ? t === w || null == t || "" === t ? (this._$AH !== w && this._$AR(), this._$AH = w) : t !== this._$AH && t !== b && this.$(t) : void 0 !== t._$litType$ ? this.T(t) : void 0 !== t.nodeType ? this.k(t) : u(t) ? this.S(t) : this.$(t);
+    t = N(this, t, i), u(t) ? t === A || null == t || "" === t ? (this._$AH !== A && this._$AR(), this._$AH = A) : t !== this._$AH && t !== T && this.g(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : v(t) ? this.k(t) : this.g(t);
   }
-  A(t, i = this._$AB) {
-    return this._$AA.parentNode.insertBefore(t, i);
+  S(t) {
+    return this._$AA.parentNode.insertBefore(t, this._$AB);
   }
-  k(t) {
-    this._$AH !== t && (this._$AR(), this._$AH = this.A(t));
+  T(t) {
+    this._$AH !== t && (this._$AR(), this._$AH = this.S(t));
   }
-  $(t) {
-    this._$AH !== w && r(this._$AH) ? this._$AA.nextSibling.data = t : this.k(l$2.createTextNode(t)), this._$AH = t;
+  g(t) {
+    this._$AH !== A && u(this._$AH) ? this._$AA.nextSibling.data = t : this.T(r.createTextNode(t)), this._$AH = t;
   }
-  T(t) {
+  $(t) {
     var i;
     const {
         values: s,
         _$litType$: e
       } = t,
-      o = "number" == typeof e ? this._$AC(t) : (void 0 === e.el && (e.el = E.createElement(e.h, this.options)), e);
-    if ((null === (i = this._$AH) || void 0 === i ? void 0 : i._$AD) === o) this._$AH.m(s);else {
-      const t = new V(o, this),
-        i = t.p(this.options);
-      t.m(s), this.k(i), this._$AH = t;
+      o = "number" == typeof e ? this._$AC(t) : (void 0 === e.el && (e.el = V.createElement(e.h, this.options)), e);
+    if ((null === (i = this._$AH) || void 0 === i ? void 0 : i._$AD) === o) this._$AH.p(s);else {
+      const t = new S(o, this),
+        i = t.v(this.options);
+      t.p(s), this.T(i), this._$AH = t;
     }
   }
   _$AC(t) {
-    let i = T.get(t.strings);
-    return void 0 === i && T.set(t.strings, i = new E(t)), i;
+    let i = E.get(t.strings);
+    return void 0 === i && E.set(t.strings, i = new V(t)), i;
   }
-  S(t) {
-    d(this._$AH) || (this._$AH = [], this._$AR());
+  k(t) {
+    c(this._$AH) || (this._$AH = [], this._$AR());
     const i = this._$AH;
     let s,
       e = 0;
-    for (const o of t) e === i.length ? i.push(s = new N(this.A(h()), this.A(h()), this, this.options)) : s = i[e], s._$AI(o), e++;
+    for (const o of t) e === i.length ? i.push(s = new M(this.S(d()), this.S(d()), this, this.options)) : s = i[e], s._$AI(o), e++;
     e < i.length && (this._$AR(s && s._$AB.nextSibling, e), i.length = e);
   }
   _$AR(t = this._$AA.nextSibling, i) {
@@ -1110,12 +1104,12 @@ class N {
   }
   setConnected(t) {
     var i;
-    void 0 === this._$AM && (this._$Cg = t, null === (i = this._$AP) || void 0 === i || i.call(this, t));
+    void 0 === this._$AM && (this._$Cm = t, null === (i = this._$AP) || void 0 === i || i.call(this, t));
   }
 }
-class S {
+class R {
   constructor(t, i, s, e, o) {
-    this.type = 1, this._$AH = w, this._$AN = void 0, this.element = t, this.name = i, this._$AM = e, this.options = o, s.length > 2 || "" !== s[0] || "" !== s[1] ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = w;
+    this.type = 1, this._$AH = A, this._$AN = void 0, this.element = t, this.name = i, this._$AM = e, this.options = o, s.length > 2 || "" !== s[0] || "" !== s[1] ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = A;
   }
   get tagName() {
     return this.element.tagName;
@@ -1126,44 +1120,44 @@ class S {
   _$AI(t, i = this, s, e) {
     const o = this.strings;
     let n = !1;
-    if (void 0 === o) t = P(this, t, i, 0), n = !r(t) || t !== this._$AH && t !== b, n && (this._$AH = t);else {
+    if (void 0 === o) t = N(this, t, i, 0), n = !u(t) || t !== this._$AH && t !== T, n && (this._$AH = t);else {
       const e = t;
       let l, h;
-      for (t = o[0], l = 0; l < o.length - 1; l++) h = P(this, e[s + l], i, l), h === b && (h = this._$AH[l]), n || (n = !r(h) || h !== this._$AH[l]), h === w ? t = w : t !== w && (t += (null != h ? h : "") + o[l + 1]), this._$AH[l] = h;
+      for (t = o[0], l = 0; l < o.length - 1; l++) h = N(this, e[s + l], i, l), h === T && (h = this._$AH[l]), n || (n = !u(h) || h !== this._$AH[l]), h === A ? t = A : t !== A && (t += (null != h ? h : "") + o[l + 1]), this._$AH[l] = h;
     }
-    n && !e && this.C(t);
+    n && !e && this.j(t);
   }
-  C(t) {
-    t === w ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, null != t ? t : "");
+  j(t) {
+    t === A ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, null != t ? t : "");
   }
 }
-class M extends S {
+class k extends R {
   constructor() {
     super(...arguments), this.type = 3;
   }
-  C(t) {
-    this.element[this.name] = t === w ? void 0 : t;
+  j(t) {
+    this.element[this.name] = t === A ? void 0 : t;
   }
 }
-const k = i ? i.emptyScript : "";
-class H extends S {
+const H = s$1 ? s$1.emptyScript : "";
+class I extends R {
   constructor() {
     super(...arguments), this.type = 4;
   }
-  C(t) {
-    t && t !== w ? this.element.setAttribute(this.name, k) : this.element.removeAttribute(this.name);
+  j(t) {
+    t && t !== A ? this.element.setAttribute(this.name, H) : this.element.removeAttribute(this.name);
   }
 }
-class I extends S {
+class L extends R {
   constructor(t, i, s, e, o) {
     super(t, i, s, e, o), this.type = 5;
   }
   _$AI(t, i = this) {
     var s;
-    if ((t = null !== (s = P(this, t, i, 0)) && void 0 !== s ? s : w) === b) return;
+    if ((t = null !== (s = N(this, t, i, 0)) && void 0 !== s ? s : A) === T) return;
     const e = this._$AH,
-      o = t === w && e !== w || t.capture !== e.capture || t.once !== e.once || t.passive !== e.passive,
-      n = t !== w && (e === w || o);
+      o = t === A && e !== A || t.capture !== e.capture || t.once !== e.once || t.passive !== e.passive,
+      n = t !== A && (e === A || o);
     o && this.element.removeEventListener(this.name, this, e), n && this.element.addEventListener(this.name, this, t), this._$AH = t;
   }
   handleEvent(t) {
@@ -1171,7 +1165,7 @@ class I extends S {
     "function" == typeof this._$AH ? this._$AH.call(null !== (s = null === (i = this.options) || void 0 === i ? void 0 : i.host) && void 0 !== s ? s : this.element, t) : this._$AH.handleEvent(t);
   }
 }
-class L {
+class z {
   constructor(t, i, s) {
     this.element = t, this.type = 6, this._$AN = void 0, this._$AM = i, this.options = s;
   }
@@ -1179,11 +1173,21 @@ class L {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    P(this, t);
+    N(this, t);
   }
 }
-const z = window.litHtmlPolyfillSupport;
-null == z || z(E, N), (null !== (t = globalThis.litHtmlVersions) && void 0 !== t ? t : globalThis.litHtmlVersions = []).push("2.2.1");
+const j = i.litHtmlPolyfillSupport;
+null == j || j(V, M), (null !== (t = i.litHtmlVersions) && void 0 !== t ? t : i.litHtmlVersions = []).push("2.7.0");
+const B = (t, i, s) => {
+  var e, o;
+  const n = null !== (e = null == s ? void 0 : s.renderBefore) && void 0 !== e ? e : i;
+  let l = n._$litPart$;
+  if (void 0 === l) {
+    const t = null !== (o = null == s ? void 0 : s.renderBefore) && void 0 !== o ? o : null;
+    n._$litPart$ = l = new M(i.insertBefore(d(), t), t, void 0, null != s ? s : {});
+  }
+  return l._$AI(t), l;
+};
 
 /**
  * @license
@@ -1195,7 +1199,7 @@ class s extends a$1 {
   constructor() {
     super(...arguments), this.renderOptions = {
       host: this
-    }, this._$Dt = void 0;
+    }, this._$Do = void 0;
   }
   createRenderRoot() {
     var t, e;
@@ -1204,18 +1208,18 @@ class s extends a$1 {
   }
   update(t) {
     const i = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Dt = x$1(i, this.renderRoot, this.renderOptions);
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = B(i, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
     var t;
-    super.connectedCallback(), null === (t = this._$Dt) || void 0 === t || t.setConnected(!0);
+    super.connectedCallback(), null === (t = this._$Do) || void 0 === t || t.setConnected(!0);
   }
   disconnectedCallback() {
     var t;
-    super.disconnectedCallback(), null === (t = this._$Dt) || void 0 === t || t.setConnected(!1);
+    super.disconnectedCallback(), null === (t = this._$Do) || void 0 === t || t.setConnected(!1);
   }
   render() {
-    return b;
+    return T;
   }
 }
 s.finalized = !0, s._$litElement$ = !0, null === (l$1 = globalThis.litElementHydrateSupport) || void 0 === l$1 || l$1.call(globalThis, {
@@ -1225,7 +1229,7 @@ const n = globalThis.litElementPolyfillSupport;
 null == n || n({
   LitElement: s
 });
-(null !== (o = globalThis.litElementVersions) && void 0 !== o ? o : globalThis.litElementVersions = []).push("3.2.0");
+(null !== (o = globalThis.litElementVersions) && void 0 !== o ? o : globalThis.litElementVersions = []).push("3.3.0");
 
 function ascending$2(a, b) {
   return a == null || b == null ? NaN : a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
@@ -6469,7 +6473,6 @@ Transform.prototype = {
     return "translate(" + this.x + "," + this.y + ") scale(" + this.k + ")";
   }
 };
-new Transform(1, 0, 0);
 Transform.prototype;
 
 /*
@@ -6647,7 +6650,7 @@ class DecidablesElement extends s {
     const shadows = DecidablesElement.shadows; /* eslint-disable-line prefer-destructuring */
 
     const filters = shadows.elevations.map(z => {
-      return y$1`
+      return b`
         <filter id=${`shadow-${z}`} x="-250%" y="-250%" width="600%" height="600%">
           <feComponentTransfer in="SourceAlpha" result="solid">
             <feFuncA  type="table" tableValues="0 1 1"/>
@@ -6655,9 +6658,9 @@ class DecidablesElement extends s {
           <feOffset in="solid" result="offU" dx=${shadows.mapUmbra[z].y / 2} dy=${shadows.mapUmbra[z].y} />
           <feOffset in="solid" result="offP" dx=${shadows.mapPenumbra[z].y / 2} dy=${shadows.mapPenumbra[z].y} />
           <feOffset in="solid" result="offA" dx=${shadows.mapAmbient[z].y / 2} dy=${shadows.mapAmbient[z].y} />
-          ${shadows.mapUmbra[z].s === 0 ? y$1`` : y$1`<feMorphology in="offU" result="spreadU" operator=${shadows.mapUmbra[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapUmbra[z].s)} />`}
-          ${shadows.mapPenumbra[z].s === 0 ? y$1`` : y$1`<feMorphology in="offP" result="spreadP" operator=${shadows.mapPenumbra[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapPenumbra[z].s)} />`}
-          ${shadows.mapAmbient[z].s === 0 ? y$1`` : y$1`<feMorphology in="offA" result="spreadA" operator=${shadows.mapAmbient[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapAmbient[z].s)} />`}
+          ${shadows.mapUmbra[z].s === 0 ? b`` : b`<feMorphology in="offU" result="spreadU" operator=${shadows.mapUmbra[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapUmbra[z].s)} />`}
+          ${shadows.mapPenumbra[z].s === 0 ? b`` : b`<feMorphology in="offP" result="spreadP" operator=${shadows.mapPenumbra[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapPenumbra[z].s)} />`}
+          ${shadows.mapAmbient[z].s === 0 ? b`` : b`<feMorphology in="offA" result="spreadA" operator=${shadows.mapAmbient[z].s > 0 ? 'dilate' : 'erode'} radius=${Math.abs(shadows.mapAmbient[z].s)} />`}
           <feGaussianBlur in=${shadows.mapUmbra[z].s === 0 ? 'offU' : 'spreadU'} result="blurU" stdDeviation=${shadows.mapUmbra[z].b / 2} />
           <feGaussianBlur in=${shadows.mapPenumbra[z].s === 0 ? 'offP' : 'spreadP'} result="blurP" stdDeviation=${shadows.mapPenumbra[z].b / 2} />
           <feGaussianBlur in=${shadows.mapAmbient[z].s === 0 ? 'offA' : 'spreadA'} result="blurA" stdDeviation=${shadows.mapAmbient[z].b / 2} />
@@ -6679,7 +6682,7 @@ class DecidablesElement extends s {
           </feMerge>
         </filter>`;
     });
-    return y$1`
+    return b`
       <svg class="defs">
         <defs>
           ${filters}
@@ -6822,7 +6825,7 @@ class DecidablesButton extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <button ?disabled=${this.disabled}>
         <slot></slot>
       </button>
@@ -6836,7 +6839,7 @@ customElements.define('decidables-button', DecidablesButton);
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const l = l => null != l ? l : b$1;
+const l = l => null != l ? l : A$1;
 
 class DecidablesSlider extends DecidablesElement {
   static get properties() {
@@ -7144,7 +7147,7 @@ class DecidablesSlider extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <label for="slider">
         <slot></slot>
       </label>
@@ -7283,7 +7286,7 @@ class DecidablesSpinner extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <label>
         <slot></slot>
         <input ?disabled=${this.disabled} type="number" min=${l(this.min)} max=${l(this.max)} step=${l(this.step)} .value=${this.value} @input=${this.inputted.bind(this)}>
@@ -7447,7 +7450,7 @@ class DecidablesSwitch extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <input type="checkbox" id="switch" ?checked=${this.checked} ?disabled=${this.disabled} @change=${this.changed.bind(this)}>
       <label for="switch">
         <slot name="off-label"></slot>
@@ -7497,7 +7500,7 @@ class DecidablesToggle extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <fieldset ?disabled=${this.disabled}>
         <legend><slot name="label"></slot></legend>
         <slot></slot>
@@ -7648,7 +7651,7 @@ class DecidablesToggleOption extends DecidablesElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <input type="radio" id="toggle-option" name=${this.name} value=${this.value} .checked=${this.checked} @change=${this.changed.bind(this)}>
       <label for="toggle-option">
         <slot></slot>
@@ -7971,7 +7974,7 @@ class RDKTask extends DetectableElement {
   }
   render() {
     /* eslint-disable-line class-methods-use-this */
-    return $``;
+    return x$1``;
   }
   getDimensions() {
     this.width = parseFloat(this.getComputedStyleValue('width'), 10);
@@ -8304,11 +8307,11 @@ customElements.define('rdk-task', RDKTask);
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
-var jstatExports = {};
-var jstat = {
-  get exports(){ return jstatExports; },
-  set exports(v){ jstatExports = v; },
-};
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+var jstat = {exports: {}};
 
 (function (module, exports) {
   (function (window, factory) {
@@ -12582,6 +12585,8 @@ var jstat = {
     return jStat;
   });
 })(jstat);
+var jstatExports = jstat.exports;
+var jStat = /*@__PURE__*/getDefaultExportFromCjs(jstatExports);
 
 /*
   SDTMath Static Class - Not intended for instantiation!
@@ -12701,28 +12706,28 @@ class SDTMath {
     return m / (m + cr);
   }
   static hrFar2D(hr, far, s = 1) {
-    if (s === 1) return jstatExports.normal.inv(hr, 0, 1) - jstatExports.normal.inv(far, 0, 1);
-    return Math.sqrt(2 / (s * s + 1)) * (s * jstatExports.normal.inv(hr, 0, 1) - jstatExports.normal.inv(far, 0, 1));
+    if (s === 1) return jStat.normal.inv(hr, 0, 1) - jStat.normal.inv(far, 0, 1);
+    return Math.sqrt(2 / (s * s + 1)) * (s * jStat.normal.inv(hr, 0, 1) - jStat.normal.inv(far, 0, 1));
   }
   static hrFar2C(hr, far, s = 1) {
-    if (s === 1) return -(jstatExports.normal.inv(hr, 0, 1) + jstatExports.normal.inv(far, 0, 1)) / 2;
-    return Math.sqrt(2 / (s * s + 1)) * (s / (s + 1)) * -(jstatExports.normal.inv(hr, 0, 1) + jstatExports.normal.inv(far, 0, 1));
+    if (s === 1) return -(jStat.normal.inv(hr, 0, 1) + jStat.normal.inv(far, 0, 1)) / 2;
+    return Math.sqrt(2 / (s * s + 1)) * (s / (s + 1)) * -(jStat.normal.inv(hr, 0, 1) + jStat.normal.inv(far, 0, 1));
   }
   static dC2Hr(d, c, s = 1) {
-    if (s === 1) return jstatExports.normal.cdf(d / 2 - c, 0, 1);
-    return jstatExports.normal.cdf(Math.sqrt((s * s + 1) / 2) * (d / (1 + s) - c / s), 0, 1);
+    if (s === 1) return jStat.normal.cdf(d / 2 - c, 0, 1);
+    return jStat.normal.cdf(Math.sqrt((s * s + 1) / 2) * (d / (1 + s) - c / s), 0, 1);
   }
   static dC2Far(d, c, s = 1) {
-    if (s === 1) return jstatExports.normal.cdf(-(d / 2 + c), 0, 1);
-    return jstatExports.normal.cdf(Math.sqrt((s * s + 1) / 2) * -(d / (1 + s) + c), 0, 1);
+    if (s === 1) return jStat.normal.cdf(-(d / 2 + c), 0, 1);
+    return jStat.normal.cdf(Math.sqrt((s * s + 1) / 2) * -(d / (1 + s) + c), 0, 1);
   }
   static dFar2Hr(d, far, s = 1) {
-    if (s === 1) return jstatExports.normal.cdf(d + jstatExports.normal.inv(far, 0, 1), 0, 1);
-    return jstatExports.normal.cdf((Math.sqrt((s * s + 1) / 2) * d + jstatExports.normal.inv(far, 0, 1)) / s, 0, 1);
+    if (s === 1) return jStat.normal.cdf(d + jStat.normal.inv(far, 0, 1), 0, 1);
+    return jStat.normal.cdf((Math.sqrt((s * s + 1) / 2) * d + jStat.normal.inv(far, 0, 1)) / s, 0, 1);
   }
   static cFar2Hr(c, far, s = 1) {
-    if (s === 1) return jstatExports.normal.cdf(-(2 * c) - jstatExports.normal.inv(far, 0, 1), 0, 1);
-    return jstatExports.normal.cdf(-Math.sqrt((s * s + 1) / 2) * ((s + 1) / s) * c - jstatExports.normal.inv(far, 0, 1), 0, 1);
+    if (s === 1) return jStat.normal.cdf(-(2 * c) - jStat.normal.inv(far, 0, 1), 0, 1);
+    return jStat.normal.cdf(-Math.sqrt((s * s + 1) / 2) * ((s + 1) / s) * c - jStat.normal.inv(far, 0, 1), 0, 1);
   }
   static d2MuN(d, s = 1) {
     if (s === 1) return -d / 2;
@@ -12755,16 +12760,16 @@ class SDTMath {
     return 1 / (h * Math.sqrt(2 * Math.PI));
   }
   static hr2Zhr(hr) {
-    return jstatExports.normal.inv(hr, 0, 1);
+    return jStat.normal.inv(hr, 0, 1);
   }
   static far2Zfar(far) {
-    return jstatExports.normal.inv(far, 0, 1);
+    return jStat.normal.inv(far, 0, 1);
   }
   static zhr2Hr(zhr) {
-    return jstatExports.normal.cdf(zhr, 0, 1);
+    return jStat.normal.cdf(zhr, 0, 1);
   }
   static zfar2Far(zfar) {
-    return jstatExports.normal.cdf(zfar, 0, 1);
+    return jStat.normal.cdf(zfar, 0, 1);
   }
 }
 
@@ -13108,7 +13113,7 @@ class ROCSpace extends DetectableElement {
   }
   render() {
     /* eslint-disable-line class-methods-use-this */
-    return $`
+    return x$1`
       ${DetectableElement.svgFilters}
     `;
   }
@@ -13705,7 +13710,7 @@ class DetectableControl extends DetectableElement {
         reflect: true
       },
       state: {
-        atribute: false,
+        attribute: false,
         type: String,
         reflect: false
       }
@@ -13839,13 +13844,13 @@ class DetectableControl extends DetectableElement {
       `];
   }
   render() {
-    return $`
+    return x$1`
       <div class="holder">
-        ${this.trials ? $`<decidables-slider min="1" max="100" step="1" .value=${this.trials} @change=${this.setTrials.bind(this)} @input=${this.setTrials.bind(this)}>Trials</decidables-slider>` : $``}
-        ${this.duration ? $`<decidables-slider min="10" max="2000" step="10" .value=${this.duration} @change=${this.setDuration.bind(this)} @input=${this.setDuration.bind(this)}>Duration</decidables-slider>` : $``}
-        ${this.coherence ? $`<decidables-slider min="0" max="1" step=".01" .value=${this.coherence} @change=${this.setCoherence.bind(this)} @input=${this.setCoherence.bind(this)}>Coherence</decidables-slider>` : $``}
-        ${this.payoff ? $`<decidables-slider class="payoff" min="0" max="100" step="1" .value=${this.payoff} @change=${this.setPayoff.bind(this)} @input=${this.setPayoff.bind(this)}>Payoff</decidables-slider>` : $``}
-        ${this.color !== undefined ? $`
+        ${this.trials ? x$1`<decidables-slider min="1" max="100" step="1" .value=${this.trials} @change=${this.setTrials.bind(this)} @input=${this.setTrials.bind(this)}>Trials</decidables-slider>` : x$1``}
+        ${this.duration ? x$1`<decidables-slider min="10" max="2000" step="10" .value=${this.duration} @change=${this.setDuration.bind(this)} @input=${this.setDuration.bind(this)}>Duration</decidables-slider>` : x$1``}
+        ${this.coherence ? x$1`<decidables-slider min="0" max="1" step=".01" .value=${this.coherence} @change=${this.setCoherence.bind(this)} @input=${this.setCoherence.bind(this)}>Coherence</decidables-slider>` : x$1``}
+        ${this.payoff ? x$1`<decidables-slider class="payoff" min="0" max="100" step="1" .value=${this.payoff} @change=${this.setPayoff.bind(this)} @input=${this.setPayoff.bind(this)}>Payoff</decidables-slider>` : x$1``}
+        ${this.color !== undefined ? x$1`
             <decidables-toggle @change=${this.chooseColor.bind(this)}>
               <span slot="label">Emphasis</span>
               <decidables-toggle-option name="toggle" value="none" ?checked=${this.color === 'none'}>None</decidables-toggle-option>
@@ -13855,20 +13860,20 @@ class DetectableControl extends DetectableElement {
               <decidables-toggle-option name="toggle" value="outcome" ?checked=${this.color === 'outcome'}>Outcome</decidables-toggle-option>
               <decidables-toggle-option name="toggle" value="all" ?checked=${this.color === 'all'}>All</decidables-toggle-option>
             </decidables-toggle>
-          ` : $``}
-        ${this.zRoc !== undefined ? $`
+          ` : x$1``}
+        ${this.zRoc !== undefined ? x$1`
             <decidables-switch ?checked=${this.zRoc} @change=${this.flipZRoc.bind(this)}>
               <span class="math-var">z</span>ROC
               <span slot="off-label">ROC</span>
             </decidables-switch>
-          ` : $``}
-        ${this.run || this.pause || this.reset ? $`
+          ` : x$1``}
+        ${this.run || this.pause || this.reset ? x$1`
             <div class="buttons">
-              ${this.run ? $`<decidables-button name="run" ?disabled=${this.state === 'running' || this.state === 'ended'} @click=${this.doRun.bind(this)}>Run</decidables-button>` : $``}
-              ${this.pause ? $`<decidables-button name="pause" ?disabled=${this.state !== 'running'} @click=${this.doPause.bind(this)}>Pause</decidables-button>` : $``}
-              ${this.reset ? $`<decidables-button name="reset" ?disabled=${this.state === 'resetted'} @click=${this.doReset.bind(this)}>Reset</decidables-button>` : $``}
+              ${this.run ? x$1`<decidables-button name="run" ?disabled=${this.state === 'running' || this.state === 'ended'} @click=${this.doRun.bind(this)}>Run</decidables-button>` : x$1``}
+              ${this.pause ? x$1`<decidables-button name="pause" ?disabled=${this.state !== 'running'} @click=${this.doPause.bind(this)}>Pause</decidables-button>` : x$1``}
+              ${this.reset ? x$1`<decidables-button name="reset" ?disabled=${this.state === 'resetted'} @click=${this.doReset.bind(this)}>Reset</decidables-button>` : x$1``}
             </div>
-          ` : $``}
+          ` : x$1``}
       </div>`;
   }
 }
@@ -14044,7 +14049,7 @@ class SDTModel extends DetectableElement {
     trial.duration = duration;
     trial.wait = wait;
     trial.iti = iti;
-    trial.evidence = jstatExports.normal.sample(0, 1);
+    trial.evidence = jStat.normal.sample(0, 1);
     this.alignTrial(trial);
     this.trials.push(trial);
     this.requestUpdate();
@@ -14325,7 +14330,7 @@ class SDTModel extends DetectableElement {
   }
   render() {
     /* eslint-disable-line class-methods-use-this */
-    return $`
+    return x$1`
       ${DetectableElement.svgFilters}
     `;
   }
@@ -14660,12 +14665,12 @@ class SDTModel extends DetectableElement {
         const correctRejections = range(xScale.domain()[0], SDTMath.c2L(element.c, element.s), 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
+            p: jStat.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
           };
         });
         correctRejections.push({
           e: SDTMath.c2L(element.c, element.s),
-          p: jstatExports.normal.pdf(SDTMath.c2L(element.c, element.s), SDTMath.d2MuN(element.d, element.s), 1)
+          p: jStat.normal.pdf(SDTMath.c2L(element.c, element.s), SDTMath.d2MuN(element.d, element.s), 1)
         });
         correctRejections.push({
           e: SDTMath.c2L(element.c, element.s),
@@ -14695,12 +14700,12 @@ class SDTModel extends DetectableElement {
         const falseAlarms = range(SDTMath.c2L(element.c, element.s), xScale.domain()[1], 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
+            p: jStat.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
           };
         });
         falseAlarms.push({
           e: xScale.domain()[1],
-          p: jstatExports.normal.pdf(xScale.domain()[1], SDTMath.d2MuN(element.d, element.s), 1)
+          p: jStat.normal.pdf(xScale.domain()[1], SDTMath.d2MuN(element.d, element.s), 1)
         });
         falseAlarms.push({
           e: xScale.domain()[1],
@@ -14728,12 +14733,12 @@ class SDTModel extends DetectableElement {
         const noise = range(xScale.domain()[0], xScale.domain()[1], 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
+            p: jStat.normal.pdf(e, SDTMath.d2MuN(element.d, element.s), 1)
           };
         });
         noise.push({
           e: xScale.domain()[1],
-          p: jstatExports.normal.pdf(xScale.domain()[1], SDTMath.d2MuN(element.d, element.s), 1)
+          p: jStat.normal.pdf(xScale.domain()[1], SDTMath.d2MuN(element.d, element.s), 1)
         });
         return line$1(noise);
       };
@@ -14810,12 +14815,12 @@ class SDTModel extends DetectableElement {
         const misses = range(xScale.domain()[0], SDTMath.c2L(element.c, element.s), 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
+            p: jStat.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
           };
         });
         misses.push({
           e: SDTMath.c2L(element.c, element.s),
-          p: jstatExports.normal.pdf(SDTMath.c2L(element.c, element.s), SDTMath.d2MuS(element.d, element.s), element.s)
+          p: jStat.normal.pdf(SDTMath.c2L(element.c, element.s), SDTMath.d2MuS(element.d, element.s), element.s)
         });
         misses.push({
           e: SDTMath.c2L(element.c, element.s),
@@ -14845,12 +14850,12 @@ class SDTModel extends DetectableElement {
         const hits = range(SDTMath.c2L(element.c, element.s), xScale.domain()[1], 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
+            p: jStat.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
           };
         });
         hits.push({
           e: xScale.domain()[1],
-          p: jstatExports.normal.pdf(xScale.domain()[1], SDTMath.d2MuS(element.d, element.s), element.s)
+          p: jStat.normal.pdf(xScale.domain()[1], SDTMath.d2MuS(element.d, element.s), element.s)
         });
         hits.push({
           e: xScale.domain()[1],
@@ -14878,12 +14883,12 @@ class SDTModel extends DetectableElement {
         const signal = range(xScale.domain()[0], xScale.domain()[1], 0.05).map(e => {
           return {
             e: e,
-            p: jstatExports.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
+            p: jStat.normal.pdf(e, SDTMath.d2MuS(element.d, element.s), element.s)
           };
         });
         signal.push({
           e: xScale.domain()[1],
-          p: jstatExports.normal.pdf(xScale.domain()[1], SDTMath.d2MuS(element.d, element.s), element.s)
+          p: jStat.normal.pdf(xScale.domain()[1], SDTMath.d2MuS(element.d, element.s), element.s)
         });
         return line$1(signal);
       };
@@ -14965,13 +14970,13 @@ class SDTModel extends DetectableElement {
     sLabel.append('tspan').classed('value', true);
     //  MERGE
     const sMerge = sEnter.merge(sUpdate);
-    sMerge.select('.line').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS - this.s)).attr('y1', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s) // FIX - no hardcoding
-    .attr('x2', xScale(this.muS + this.s)).attr('y2', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s); // FIX - no hardcoding
-    sMerge.select('.cap-left').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS - this.s)).attr('y1', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s + 5) // FIX - no hardcoding
-    .attr('x2', xScale(this.muS - this.s)).attr('y2', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 5); // FIX - no hardcoding
-    sMerge.select('.cap-right').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS + this.s)).attr('y1', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s + 5) // FIX - no hardcoding
-    .attr('x2', xScale(this.muS + this.s)).attr('y2', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 5); // FIX - no hardcoding
-    const sLabelTransition = sMerge.select('.label').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x', xScale(this.muS)).attr('y', yScale(jstatExports.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 3); // FIX - no hardcoding
+    sMerge.select('.line').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS - this.s)).attr('y1', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s) // FIX - no hardcoding
+    .attr('x2', xScale(this.muS + this.s)).attr('y2', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s); // FIX - no hardcoding
+    sMerge.select('.cap-left').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS - this.s)).attr('y1', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s + 5) // FIX - no hardcoding
+    .attr('x2', xScale(this.muS - this.s)).attr('y2', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 5); // FIX - no hardcoding
+    sMerge.select('.cap-right').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x1', xScale(this.muS + this.s)).attr('y1', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s + 5) // FIX - no hardcoding
+    .attr('x2', xScale(this.muS + this.s)).attr('y2', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 5); // FIX - no hardcoding
+    const sLabelTransition = sMerge.select('.label').transition().duration(this.drag ? 0 : transitionDuration).ease(cubicOut).attr('x', xScale(this.muS)).attr('y', yScale(jStat.normal.pdf(this.s, 0, this.s)) + 10 / this.s - 3); // FIX - no hardcoding
     sLabelTransition.select('.value').tween('text', (datum, index, elements) => {
       const element = elements[index];
       const interpolateS = interpolate$1(element.s !== undefined ? element.s : this.s, this.s);
@@ -15581,28 +15586,28 @@ class DetectableResponse extends DetectableElement {
         return string + part;
       });
     };
-    return $`
+    return x$1`
       <div class="holder">
         <div class="responses">
           <decidables-button name="present" class=${this.state === 'feedback' && this.response === 'present' ? 'selected' : this.state === 'waiting' ? 'waiting' : ''} ?disabled=${this.state !== 'waiting' || this.interactive !== true} @click=${this.present.bind(this)}>Present</decidables-button>
           <decidables-button name="absent" class=${this.state === 'feedback' && this.response === 'absent' ? 'selected' : this.state === 'waiting' ? 'waiting' : ''} ?disabled=${this.state !== 'waiting' || this.interactive !== true} @click=${this.absent.bind(this)}>Absent</decidables-button>
         </div>
-        ${this.trial || this.feedback !== 'none' || this.payoff === 'total' ? $`
+        ${this.trial || this.feedback !== 'none' || this.payoff === 'total' ? x$1`
             <div class="feedbacks">
-              ${this.trial ? $`
+              ${this.trial ? x$1`
                   <div class="trial">
                     <span class="label">Trial: </span><span class="count">${this.trialCount}</span><span class="of"> of </span><span class="total">${this.trialTotal}</span>
-                  </div>` : $``}
-              ${this.feedback !== 'none' ? $`
+                  </div>` : x$1``}
+              ${this.feedback !== 'none' ? x$1`
                   <div class=${`feedback ${this.state === 'feedback' ? this.feedback === 'outcome' ? this.outcome : this.accuracy : ''}`}>
-                    ${this.state === 'feedback' ? this.feedback === 'outcome' ? this.outcome === 'h' ? $`<span class="outcome">Hit</span>` : this.outcome === 'm' ? $`<span class="outcome">Miss</span>` : this.outcome === 'fa' ? $`<span class="outcome">False<br>Alarm</span>` : this.outcome === 'cr' ? $`<span class="outcome">Correct<br>Rejection</span>` : $`<span class="outcome">No<br>Response</span>` : this.accuracy === 'c' ? $`<span class="outcome">Correct</span>` : this.accuracy === 'e' ? $`<span class="outcome">Error</span>` : $`<span class="outcome">No<br>Response</span>` : ''}
-                    ${this.state === 'feedback' && (this.payoff === 'trial' || this.payoff === 'total') ? $`<span class="payoff">${payoffFormat(this.trialPayoff)}</span>` : $``}
-                  </div>` : $``}
-              ${this.payoff === 'total' ? $`
+                    ${this.state === 'feedback' ? this.feedback === 'outcome' ? this.outcome === 'h' ? x$1`<span class="outcome">Hit</span>` : this.outcome === 'm' ? x$1`<span class="outcome">Miss</span>` : this.outcome === 'fa' ? x$1`<span class="outcome">False<br>Alarm</span>` : this.outcome === 'cr' ? x$1`<span class="outcome">Correct<br>Rejection</span>` : x$1`<span class="outcome">No<br>Response</span>` : this.accuracy === 'c' ? x$1`<span class="outcome">Correct</span>` : this.accuracy === 'e' ? x$1`<span class="outcome">Error</span>` : x$1`<span class="outcome">No<br>Response</span>` : ''}
+                    ${this.state === 'feedback' && (this.payoff === 'trial' || this.payoff === 'total') ? x$1`<span class="payoff">${payoffFormat(this.trialPayoff)}</span>` : x$1``}
+                  </div>` : x$1``}
+              ${this.payoff === 'total' ? x$1`
                   <div class="total">
                     <span class="label">Total: </span><span class="value">${payoffFormat(this.totalPayoff)}</span>
-                  </div>` : $``}
-            </div>` : $``}
+                  </div>` : x$1``}
+            </div>` : x$1``}
       </div>`;
   }
 }
@@ -16049,71 +16054,71 @@ class DetectableTable extends DetectableElement {
     let ppv;
     let fomr;
     if (this.numeric) {
-      h = $`
+      h = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
           <span>Hits</span>
-          ${this.payoff ? $`<span class="payoff">${payoffFormat(this.hPayoff)}</span>` : $``}
+          ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.hPayoff)}</span>` : x$1``}
         </decidables-spinner>
       `;
-      m = $`
+      m = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
           <span>Misses</span>
-          ${this.payoff ? $`<span class="payoff">${payoffFormat(this.mPayoff)}</span>` : $``}
+          ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.mPayoff)}</span>` : x$1``}
         </decidables-spinner>
       `;
-      fa = $`
+      fa = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
           <span>False Alarms</span>
-          ${this.payoff ? $`<span class="payoff">${payoffFormat(this.faPayoff)}</span>` : $``}
+          ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.faPayoff)}</span>` : x$1``}
         </decidables-spinner>
       `;
-      cr = $`
+      cr = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
           <span>Correct Rejections</span>
-          ${this.payoff ? $`<span class="payoff">${payoffFormat(this.crPayoff)}</span>` : $``}
+          ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.crPayoff)}</span>` : x$1``}
         </decidables-spinner>
       `;
-      hr = $`
+      hr = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${+this.hr.toFixed(3)}" @input=${this.hrInput.bind(this)}>
           <span>Hit Rate</span>
         </decidables-spinner>
       `;
-      far = $`
+      far = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${+this.far.toFixed(3)}" @input=${this.farInput.bind(this)}>
           <span>False Alarm Rate</span>
         </decidables-spinner>
       `;
-      acc = $`
+      acc = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${+this.acc.toFixed(3)}" @input=${this.accInput.bind(this)}>
           <span>Accuracy</span>
         </decidables-spinner>
       `;
-      ppv = $`
+      ppv = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${+this.ppv.toFixed(3)}" @input=${this.ppvInput.bind(this)}>
           <span>Positive Predictive Value</span>
         </decidables-spinner>
       `;
-      fomr = $`
+      fomr = x$1`
         <decidables-spinner ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${+this.fomr.toFixed(3)}" @input=${this.fomrInput.bind(this)}>
           <span>False Omission Rate</span>
         </decidables-spinner>
       `;
     } else {
-      h = $`<span>Hits</span>
-        ${this.payoff ? $`<span class="payoff">${payoffFormat(this.hPayoff)}</span>` : $``}`;
-      m = $`<span>Misses</span>
-        ${this.payoff ? $`<span class="payoff">${payoffFormat(this.mPayoff)}</span>` : $``}`;
-      fa = $`<span>False Alarms</span>
-        ${this.payoff ? $`<span class="payoff">${payoffFormat(this.faPayoff)}</span>` : $``}`;
-      cr = $`<span>Correct Rejections</span>
-        ${this.payoff ? $`<span class="payoff">${payoffFormat(this.crPayoff)}</span>` : $``}`;
-      hr = $`<span>Hit Rate</span>`;
-      far = $`<span>False Alarm Rate</span>`;
-      acc = $`<span>Accuracy</span>`;
-      ppv = $`<span>Positive Predictive Value</span>`;
-      fomr = $`<span>False Omission Rate</span>`;
+      h = x$1`<span>Hits</span>
+        ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.hPayoff)}</span>` : x$1``}`;
+      m = x$1`<span>Misses</span>
+        ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.mPayoff)}</span>` : x$1``}`;
+      fa = x$1`<span>False Alarms</span>
+        ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.faPayoff)}</span>` : x$1``}`;
+      cr = x$1`<span>Correct Rejections</span>
+        ${this.payoff ? x$1`<span class="payoff">${payoffFormat(this.crPayoff)}</span>` : x$1``}`;
+      hr = x$1`<span>Hit Rate</span>`;
+      far = x$1`<span>False Alarm Rate</span>`;
+      acc = x$1`<span>Accuracy</span>`;
+      ppv = x$1`<span>Positive Predictive Value</span>`;
+      fomr = x$1`<span>False Omission Rate</span>`;
     }
-    return $`
+    return x$1`
       <table class=${this.numeric ? 'numeric' : ''}>
         <thead>
           <tr>
@@ -16145,10 +16150,10 @@ class DetectableTable extends DetectableElement {
             <td class="td td-data m">
               ${m}
             </td>
-            ${this.summary.has('stimulusRates') ? $`
+            ${this.summary.has('stimulusRates') ? x$1`
                 <td class="td td-summary hr">
                   ${hr}
-                </td>` : $``}
+                </td>` : x$1``}
           </tr>
           <tr>
             <th class="th th-sub th-left" scope="row">
@@ -16160,27 +16165,27 @@ class DetectableTable extends DetectableElement {
             <td class="td td-data cr">
               ${cr}
             </td>
-            ${this.summary.has('stimulusRates') ? $`
+            ${this.summary.has('stimulusRates') ? x$1`
                 <td class="td td-summary far">
                   ${far}
-                </td>` : $``}
+                </td>` : x$1``}
           </tr>
-          ${this.summary.has('responseRates') || this.summary.has('accuracy') ? $`
+          ${this.summary.has('responseRates') || this.summary.has('accuracy') ? x$1`
               <tr>
                 <td colspan="2"></td>
-                ${this.summary.has('responseRates') ? $`
+                ${this.summary.has('responseRates') ? x$1`
                     <td class="td td-summary ppv">
                       ${ppv}
                     </td>
                     <td class="td td-summary fomr">
                       ${fomr}
-                    </td>` : $`
+                    </td>` : x$1`
                     <td colspan="2"></td>`}
-                ${this.summary.has('accuracy') ? $`
+                ${this.summary.has('accuracy') ? x$1`
                     <td class="td td-summary acc" rowspan="2">
                       ${acc}
-                    </td>` : $``}
-              </tr>` : $``}
+                    </td>` : x$1``}
+              </tr>` : x$1``}
         </tbody>
       </table>`;
   }
@@ -16415,35 +16420,35 @@ class SDTEquationDC2Far extends SDTEquation {
     let s;
     let far;
     if (this.numeric) {
-      d = $`
+      d = x$1`
         <decidables-spinner class="d bottom" ?disabled=${!this.interactive} step=".001" .value="${this.d}" @input=${this.dInput.bind(this)}>
           <var class="math-var">d′</var>
         </decidables-spinner>
       `;
-      c = $`
+      c = x$1`
         <decidables-spinner class="c bottom" ?disabled=${!this.interactive} step=".001" .value="${this.c}" @input=${this.cInput.bind(this)}>
           <var class="math-var">c</var>
         </decidables-spinner>
       `;
-      s = $`
+      s = x$1`
         <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
           <var class="math-var">σ</var>
         </decidables-spinner>
       `;
-      far = $`
+      far = x$1`
         <decidables-spinner class="far bottom" disabled min="0" max="1" step=".001" .value="${+this.far.toFixed(3)}">
           <var>False Alarm Rate</var>
         </decidables-spinner>
       `;
     } else {
-      d = $`<var class="math-var d">d′</var>`;
-      c = $`<var class="math-var c">c</var>`;
-      s = $`<var class="math-var s">σ</var>`;
-      far = $`<var class="far">False Alarm Rate</var>`;
+      d = x$1`<var class="math-var d">d′</var>`;
+      c = x$1`<var class="math-var c">c</var>`;
+      s = x$1`<var class="math-var s">σ</var>`;
+      far = x$1`<var class="far">False Alarm Rate</var>`;
     }
     let equation;
     if (this.unequal) {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${far}<span class="equals">=</span><var class="math-greek phi tight">Φ</var><span class="paren tight">(</span><span class="bracket tight">[</span>
@@ -16470,7 +16475,7 @@ class SDTEquationDC2Far extends SDTEquation {
           </td>
         </tr>`;
     } else {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${far}<span class="equals">=</span><var class="math-greek phi tight">Φ</var><span class="paren tight">(</span><span class="minus tight">−</span>
@@ -16488,7 +16493,7 @@ class SDTEquationDC2Far extends SDTEquation {
           </td>
         </tr>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -16581,35 +16586,35 @@ class SDTEquationDC2Hr extends SDTEquation {
     let s;
     let hr;
     if (this.numeric) {
-      d = $`
+      d = x$1`
         <decidables-spinner class="d bottom" ?disabled=${!this.interactive} step=".001" .value="${this.d}" @input=${this.dInput.bind(this)}>
           <var class="math-var">d′</var>
         </decidables-spinner>
       `;
-      c = $`
+      c = x$1`
         <decidables-spinner class="c bottom" ?disabled=${!this.interactive} step=".001" .value="${this.c}" @input=${this.cInput.bind(this)}>
           <var class="math-var">c</var>
         </decidables-spinner>
       `;
-      s = $`
+      s = x$1`
         <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
           <var class="math-var">σ</var>
         </decidables-spinner>
       `;
-      hr = $`
+      hr = x$1`
         <decidables-spinner class="hr bottom" disabled min="0" max="1" step=".001" .value="${+this.hr.toFixed(3)}">
           <var>Hit Rate</var>
         </decidables-spinner>
       `;
     } else {
-      d = $`<var class="math-var d">d′</var>`;
-      c = $`<var class="math-var c">c</var>`;
-      s = $`<var class="math-var s">σ</var>`;
-      hr = $`<var class="hr">Hit Rate</var>`;
+      d = x$1`<var class="math-var d">d′</var>`;
+      c = x$1`<var class="math-var c">c</var>`;
+      s = x$1`<var class="math-var s">σ</var>`;
+      hr = x$1`<var class="hr">Hit Rate</var>`;
     }
     let equation;
     if (this.unequal) {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${hr}<span class="equals">=</span><var class="math-greek phi tight">Φ</var><span class="paren tight">(</span><span class="bracket tight">[</span>
@@ -16645,7 +16650,7 @@ class SDTEquationDC2Hr extends SDTEquation {
           </td>
         </tr>`;
     } else {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${hr}<span class="equals">=</span><var class="math-greek phi tight">Φ</var><span class="paren tight">(</span>
@@ -16663,7 +16668,7 @@ class SDTEquationDC2Hr extends SDTEquation {
           </td>
         </tr>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -16737,27 +16742,27 @@ class SDTEquationFaCr2Far extends SDTEquation {
     let cr;
     let far;
     if (this.numeric) {
-      fa = $`
+      fa = x$1`
         <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
           <var>False Alarms</var>
         </decidables-spinner>
       `;
-      cr = $`
+      cr = x$1`
         <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
           <var>Correct Rejections</var>
         </decidables-spinner>
       `;
-      far = $`
+      far = x$1`
         <decidables-spinner class="far" disabled min="0" max="1" step=".001" .value="${+this.far.toFixed(3)}">
           <var>False Alarm Rate</var>
         </decidables-spinner>
       `;
     } else {
-      fa = $`<var class="fa">False Alarms</var>`;
-      cr = $`<var class="cr">Correct Rejections</var>`;
-      far = $`<var class="far">False Alarm Rate</var>`;
+      fa = x$1`<var class="fa">False Alarms</var>`;
+      cr = x$1`<var class="cr">Correct Rejections</var>`;
+      far = x$1`<var class="far">False Alarm Rate</var>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -16843,27 +16848,27 @@ class SDTEquationHFa2Ppv extends SDTEquation {
     let fa;
     let ppv;
     if (this.numeric) {
-      h = $`
+      h = x$1`
         <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
           <var>Hits</var>
         </decidables-spinner>
       `;
-      fa = $`
+      fa = x$1`
         <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
           <var>False Alarms</var>
         </decidables-spinner>
       `;
-      ppv = $`
+      ppv = x$1`
         <decidables-spinner class="ppv" disabled min="0" max="1" step=".001" .value="${+this.ppv.toFixed(3)}">
           <var>Positive Predictive Value</var>
         </decidables-spinner>
       `;
     } else {
-      h = $`<var class="h">Hits</var>`;
-      fa = $`<var class="fa">False Alarms</var>`;
-      ppv = $`<var class="ppv">Positive Predictive Value</var>`;
+      h = x$1`<var class="h">Hits</var>`;
+      fa = x$1`<var class="fa">False Alarms</var>`;
+      ppv = x$1`<var class="ppv">Positive Predictive Value</var>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -16950,27 +16955,27 @@ class SDTEquationHM2Hr extends SDTEquation {
     let m;
     let hr;
     if (this.numeric) {
-      h = $`
+      h = x$1`
         <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
           <var>Hits</var>
         </decidables-spinner>
       `;
-      m = $`
+      m = x$1`
         <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
           <var>Misses</var>
         </decidables-spinner>
       `;
-      hr = $`
+      hr = x$1`
         <decidables-spinner class="hr" disabled min="0" max="1" step=".001" .value="${+this.hr.toFixed(3)}">
           <var>Hit Rate</var>
         </decidables-spinner>
       `;
     } else {
-      h = $`<var class="h">Hits</var>`;
-      m = $`<var class="m">Misses</var>`;
-      hr = $`<var class="hr">Hit Rate</var>`;
+      h = x$1`<var class="h">Hits</var>`;
+      m = x$1`<var class="m">Misses</var>`;
+      hr = x$1`<var class="hr">Hit Rate</var>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -17083,39 +17088,39 @@ class SDTEquationHMFaCr2Acc extends SDTEquation {
     let cr;
     let acc;
     if (this.numeric) {
-      h = $`
+      h = x$1`
         <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
           <var>Hits</var>
         </decidables-spinner>
       `;
-      m = $`
+      m = x$1`
         <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
           <var>Misses</var>
         </decidables-spinner>
       `;
-      fa = $`
+      fa = x$1`
         <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
           <var>False Alarms</var>
         </decidables-spinner>
       `;
-      cr = $`
+      cr = x$1`
         <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
           <var>Correct Rejections</var>
         </decidables-spinner>
       `;
-      acc = $`
+      acc = x$1`
         <decidables-spinner class="acc" disabled min="0" max="1" step=".001" .value="${+this.acc.toFixed(3)}">
           <var>Accuracy</var>
         </decidables-spinner>
       `;
     } else {
-      h = $`<var class="h">Hits</var>`;
-      m = $`<var class="m">Misses</var>`;
-      fa = $`<var class="fa">False Alarms</var>`;
-      cr = $`<var class="cr">Correct Rejections</var>`;
-      acc = $`<var class="acc">Accuracy</var>`;
+      h = x$1`<var class="h">Hits</var>`;
+      m = x$1`<var class="m">Misses</var>`;
+      fa = x$1`<var class="fa">False Alarms</var>`;
+      cr = x$1`<var class="cr">Correct Rejections</var>`;
+      acc = x$1`<var class="acc">Accuracy</var>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -17220,35 +17225,35 @@ class SDTEquationHrFar2C extends SDTEquation {
     let s;
     let c;
     if (this.numeric) {
-      hr = $`
+      hr = x$1`
         <decidables-spinner class="hr bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.hr}" @input=${this.hrInput.bind(this)}>
           <var>Hit Rate</var>
         </decidables-spinner>
       `;
-      far = $`
+      far = x$1`
         <decidables-spinner class="far bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.far}" @input=${this.farInput.bind(this)}>
           <var>False Alarm Rate</var>
         </decidables-spinner>
       `;
-      s = $`
+      s = x$1`
         <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
           <var class="math-var">σ</var>
         </decidables-spinner>
       `;
-      c = $`
+      c = x$1`
         <decidables-spinner class="c bottom" disabled step=".001" .value="${+this.c.toFixed(3)}">
           <var class="math-var">c</var>
         </decidables-spinner>
       `;
     } else {
-      hr = $`<var class="hr">Hit Rate</var>`;
-      far = $`<var class="far">False Alarm Rate</var>`;
-      s = $`<var class="math-var s">σ</var>`;
-      c = $`<var class="math-var c">c</var>`;
+      hr = x$1`<var class="hr">Hit Rate</var>`;
+      far = x$1`<var class="far">False Alarm Rate</var>`;
+      s = x$1`<var class="math-var s">σ</var>`;
+      c = x$1`<var class="math-var c">c</var>`;
     }
     let equation;
     if (this.unequal) {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${c}<span class="equals">=</span><span class="bracket tight">(</span>
@@ -17275,7 +17280,7 @@ class SDTEquationHrFar2C extends SDTEquation {
           </td>
         </tr>`;
     } else {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${c}<span class="equals">=</span>
@@ -17290,7 +17295,7 @@ class SDTEquationHrFar2C extends SDTEquation {
           </td>
         </tr>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -17383,35 +17388,35 @@ class SDTEquationHrFar2D extends SDTEquation {
     let s;
     let d;
     if (this.numeric) {
-      hr = $`
+      hr = x$1`
         <decidables-spinner class="hr bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.hr}" @input=${this.hrInput.bind(this)}>
           <var>Hit Rate</var>
         </decidables-spinner>
       `;
-      far = $`
+      far = x$1`
         <decidables-spinner class="far bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.far}" @input=${this.farInput.bind(this)}>
           <var>False Alarm Rate</var>
         </decidables-spinner>
       `;
-      s = $`
+      s = x$1`
         <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
           <var class="math-var">σ</var>
         </decidables-spinner>
       `;
-      d = $`
+      d = x$1`
         <decidables-spinner class="d bottom" disabled step=".001" .value="${+this.d.toFixed(3)}">
           <var class="math-var">d′</var>
         </decidables-spinner>
       `;
     } else {
-      hr = $`<var class="hr">Hit Rate</var>`;
-      far = $`<var class="far">False Alarm Rate</var>`;
-      s = $`<var class="math-var s">σ</var>`;
-      d = $`<var class="math-var d">d′</var>`;
+      hr = x$1`<var class="hr">Hit Rate</var>`;
+      far = x$1`<var class="far">False Alarm Rate</var>`;
+      s = x$1`<var class="math-var s">σ</var>`;
+      d = x$1`<var class="math-var d">d′</var>`;
     }
     let equation;
     if (this.unequal) {
-      equation = $`
+      equation = x$1`
         <tr>
           <td rowspan="2">
             ${d}<span class="equals">=</span><span class="bracket tight">(</span>
@@ -17429,14 +17434,14 @@ class SDTEquationHrFar2D extends SDTEquation {
           </td>
         </tr>`;
     } else {
-      equation = $`
+      equation = x$1`
         <tr>
           <td>
               ${d}<span class="equals">=</span><span class="tight"><var class="math-greek phi tight">Φ</var><sup class="exp">−1</sup></span><span class="paren tight">(</span>${hr}<span class="paren tight">)</span><span class="minus">−</span><span class="tight"><var class="math-greek phi tight">Φ</var><sup class="exp">−1</sup></span><span class="paren tight">(</span>${far}<span class="paren tight">)</span>
           </td>
         </tr>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -17510,27 +17515,27 @@ class SDTEquationMCr2Fomr extends SDTEquation {
     let cr;
     let fomr;
     if (this.numeric) {
-      m = $`
+      m = x$1`
         <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
           <var>Misses</var>
         </decidables-spinner>
       `;
-      cr = $`
+      cr = x$1`
         <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
           <var>Correct Rejections</var>
         </decidables-spinner>
       `;
-      fomr = $`
+      fomr = x$1`
         <decidables-spinner class="fomr" disabled min="0" max="1" step=".001" .value="${+this.fomr.toFixed(3)}">
           <var>False Omission Rate</var>
         </decidables-spinner>
       `;
     } else {
-      m = $`<var class="m">Misses</var>`;
-      cr = $`<var class="cr">Correct Rejections</var>`;
-      fomr = $`<var class="fomr">False Omission Rate</var>`;
+      m = x$1`<var class="m">Misses</var>`;
+      cr = x$1`<var class="cr">Correct Rejections</var>`;
+      fomr = x$1`<var class="fomr">False Omission Rate</var>`;
     }
-    return $`
+    return x$1`
       <div class="holder">
         <table class="equation">
           <tbody>
@@ -17609,7 +17614,7 @@ class SDTExample extends DetectableElement {
   }
   render() {
     /* eslint-disable-line class-methods-use-this */
-    return $`
+    return x$1`
       <div class="holder">
         <div class="body">
           <slot>Empty!</slot>