@decidables/decidables-elements 0.4.8 → 0.5.0

package/lib/decidablesElements.esm.js

@@ -4,20 +4,20 @@
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const t$1 = globalThis,
-  e$2 = t$1.ShadowRoot && (void 0 === t$1.ShadyCSS || t$1.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
-  s$2 = Symbol(),
+  e$2 = t$1.ShadowRoot && (undefined === t$1.ShadyCSS || t$1.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
+  s$1 = Symbol(),
   o$3 = new WeakMap();
 let n$2 = class n {
   constructor(t, e, o) {
-    if (this._$cssResult$ = !0, o !== s$2) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    if (this._$cssResult$ = true, o !== s$1) 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$2 && void 0 === t) {
-      const e = void 0 !== s && 1 === s.length;
-      e && (t = o$3.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$3.set(s, t));
+    if (e$2 && undefined === t) {
+      const e = undefined !== s && 1 === s.length;
+      e && (t = o$3.get(s)), undefined === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$3.set(s, t));
     }
     return t;
   }
@@ -25,20 +25,20 @@ let n$2 = class n {
     return this.cssText;
   }
 };
-const r$3 = t => new n$2("string" == typeof t ? t : t + "", void 0, s$2),
-  i$2 = (t, ...e) => {
+const r$3 = t => new n$2("string" == typeof t ? t : t + "", undefined, s$1),
+  i$3 = (t, ...e) => {
     const o = 1 === t.length ? t[0] : e.reduce((e, s, o) => e + (t => {
-      if (!0 === t._$cssResult$) return t.cssText;
+      if (true === 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$2(o, t, s$2);
+    return new n$2(o, t, s$1);
   },
   S$1 = (s, o) => {
     if (e$2) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
       const o = document.createElement("style"),
         n = t$1.litNonce;
-      void 0 !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
+      undefined !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
     }
   },
   c$2 = e$2 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
@@ -53,7 +53,7 @@ const r$3 = t => new n$2("string" == typeof t ? t : t + "", void 0, s$2),
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const {
-    is: i$1,
+    is: i$2,
     defineProperty: e$1,
     getOwnPropertyDescriptor: r$2,
     getOwnPropertyNames: h$1,
@@ -97,12 +97,12 @@ const {
       return i;
     }
   },
-  f$1 = (t, s) => !i$1(t, s),
+  f$1 = (t, s) => !i$2(t, s),
   y$1 = {
-    attribute: !0,
+    attribute: true,
     type: String,
     converter: u$1,
-    reflect: !1,
+    reflect: false,
     hasChanged: f$1
   };
 Symbol.metadata ??= Symbol("metadata"), a$1.litPropertyMetadata ??= new WeakMap();
@@ -114,10 +114,10 @@ let b$1 = class b extends HTMLElement {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
   static createProperty(t, s = y$1) {
-    if (s.state && (s.attribute = !1), this._$Ei(), this.elementProperties.set(t, s), !s.noAccessor) {
+    if (s.state && (s.attribute = false), this._$Ei(), this.elementProperties.set(t, s), !s.noAccessor) {
       const i = Symbol(),
         r = this.getPropertyDescriptor(t, i, s);
-      void 0 !== r && e$1(this.prototype, t, r);
+      undefined !== r && e$1(this.prototype, t, r);
     }
   }
   static getPropertyDescriptor(t, s, i) {
@@ -140,8 +140,8 @@ let b$1 = class b extends HTMLElement {
         const r = e?.call(this);
         h.call(this, s), this.requestUpdate(t, r, i);
       },
-      configurable: !0,
-      enumerable: !0
+      configurable: true,
+      enumerable: true
     };
   }
   static getPropertyOptions(t) {
@@ -150,11 +150,11 @@ let b$1 = class b extends HTMLElement {
   static _$Ei() {
     if (this.hasOwnProperty(d$1("elementProperties"))) return;
     const t = n$1(this);
-    t.finalize(), void 0 !== t.l && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
+    t.finalize(), undefined !== 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"))) {
+    if (this.finalized = true, this._$Ei(), this.hasOwnProperty(d$1("properties"))) {
       const t = this.properties,
         s = [...h$1(t), ...o$2(t)];
       for (const i of s) this.createProperty(i, t[i]);
@@ -162,12 +162,12 @@ let b$1 = class b extends HTMLElement {
     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);
+      if (undefined !== 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);
+      undefined !== i && this._$Eh.set(i, t);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
   }
@@ -176,21 +176,21 @@ let b$1 = class b extends HTMLElement {
     if (Array.isArray(s)) {
       const e = new Set(s.flat(1 / 0).reverse());
       for (const s of e) i.unshift(c$2(s));
-    } else void 0 !== s && i.push(c$2(s));
+    } else undefined !== s && i.push(c$2(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;
+    return false === i ? undefined : "string" == typeof i ? i : "string" == typeof t ? t.toLowerCase() : undefined;
   }
   constructor() {
-    super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
+    super(), this._$Ep = undefined, this.isUpdatePending = false, this.hasUpdated = false, 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?.();
+    (this._$EO ??= new Set()).add(t), undefined !== this.renderRoot && this.isConnected && t.hostConnected?.();
   }
   removeController(t) {
     this._$EO?.delete(t);
@@ -206,7 +206,7 @@ let b$1 = class b extends HTMLElement {
     return S$1(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
-    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(t => t.hostConnected?.());
+    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(true), this._$EO?.forEach(t => t.hostConnected?.());
   }
   enableUpdating(t) {}
   disconnectedCallback() {
@@ -218,34 +218,34 @@ let b$1 = class b extends HTMLElement {
   _$EC(t, s) {
     const i = this.constructor.elementProperties.get(t),
       e = this.constructor._$Eu(t, i);
-    if (void 0 !== e && !0 === i.reflect) {
-      const r = (void 0 !== i.converter?.toAttribute ? i.converter : u$1).toAttribute(s, i.type);
+    if (undefined !== e && true === i.reflect) {
+      const r = (undefined !== i.converter?.toAttribute ? i.converter : u$1).toAttribute(s, i.type);
       this._$Em = t, null == r ? this.removeAttribute(e) : this.setAttribute(e, r), this._$Em = null;
     }
   }
   _$AK(t, s) {
     const i = this.constructor,
       e = i._$Eh.get(t);
-    if (void 0 !== e && this._$Em !== e) {
+    if (undefined !== e && this._$Em !== e) {
       const t = i.getPropertyOptions(e),
         r = "function" == typeof t.converter ? {
           fromAttribute: t.converter
-        } : void 0 !== t.converter?.fromAttribute ? t.converter : u$1;
+        } : undefined !== t.converter?.fromAttribute ? t.converter : u$1;
       this._$Em = e, this[e] = r.fromAttribute(s, t.type), this._$Em = null;
     }
   }
   requestUpdate(t, s, i) {
-    if (void 0 !== t) {
+    if (undefined !== t) {
       if (i ??= this.constructor.getPropertyOptions(t), !(i.hasChanged ?? f$1)(this[t], s)) return;
       this.P(t, s, i);
     }
-    !1 === this.isUpdatePending && (this._$ES = this._$ET());
+    false === this.isUpdatePending && (this._$ES = this._$ET());
   }
   P(t, s, i) {
-    this._$AL.has(t) || this._$AL.set(t, s), !0 === i.reflect && this._$Em !== t && (this._$Ej ??= new Set()).add(t);
+    this._$AL.has(t) || this._$AL.set(t, s), true === i.reflect && this._$Em !== t && (this._$Ej ??= new Set()).add(t);
   }
   async _$ET() {
-    this.isUpdatePending = !0;
+    this.isUpdatePending = true;
     try {
       await this._$ES;
     } catch (t) {
@@ -262,26 +262,26 @@ let b$1 = class b extends HTMLElement {
     if (!this.hasUpdated) {
       if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
         for (const [t, s] of this._$Ep) this[t] = s;
-        this._$Ep = void 0;
+        this._$Ep = undefined;
       }
       const t = this.constructor.elementProperties;
-      if (t.size > 0) for (const [s, i] of t) !0 !== i.wrapped || this._$AL.has(s) || void 0 === this[s] || this.P(s, this[s], i);
+      if (t.size > 0) for (const [s, i] of t) true !== i.wrapped || this._$AL.has(s) || undefined === this[s] || this.P(s, this[s], i);
     }
-    let t = !1;
+    let t = false;
     const s = this._$AL;
     try {
       t = this.shouldUpdate(s), t ? (this.willUpdate(s), this._$EO?.forEach(t => t.hostUpdate?.()), this.update(s)) : this._$EU();
     } catch (s) {
-      throw t = !1, this._$EU(), s;
+      throw t = false, this._$EU(), 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);
+    this._$EO?.forEach(t => t.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = true, this.firstUpdated(t)), this.updated(t);
   }
   _$EU() {
-    this._$AL = new Map(), this.isUpdatePending = !1;
+    this._$AL = new Map(), this.isUpdatePending = false;
   }
   get updateComplete() {
     return this.getUpdateComplete();
@@ -290,7 +290,7 @@ let b$1 = class b extends HTMLElement {
     return this._$ES;
   }
   shouldUpdate(t) {
-    return !0;
+    return true;
   }
   update(t) {
     this._$Ej &&= this._$Ej.forEach(t => this._$EC(t, this[t])), this._$EU();
@@ -310,10 +310,10 @@ b$1.elementStyles = [], b$1.shadowRootOptions = {
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const t = globalThis,
-  i = t.trustedTypes,
-  s$1 = i ? i.createPolicy("lit-html", {
+  i$1 = t.trustedTypes,
+  s = i$1 ? i$1.createPolicy("lit-html", {
     createHTML: t => t
-  }) : void 0,
+  }) : undefined,
   e = "$lit$",
   h = `lit$${Math.random().toFixed(9).slice(2)}$`,
   o$1 = "?" + h,
@@ -338,19 +338,19 @@ const t = globalThis,
   }),
   x = y(1),
   b = y(2),
-  w = Symbol.for("lit-noChange"),
-  T = Symbol.for("lit-nothing"),
+  T = Symbol.for("lit-noChange"),
+  E = Symbol.for("lit-nothing"),
   A = new WeakMap(),
-  E = r$1.createTreeWalker(r$1, 129);
-function C(t, i) {
-  if (!Array.isArray(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return void 0 !== s$1 ? s$1.createHTML(i) : i;
+  C = r$1.createTreeWalker(r$1, 129);
+function P(t, i) {
+  if (!a(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return undefined !== s ? s.createHTML(i) : i;
 }
-const P = (t, i) => {
+const V = (t, i) => {
   const s = t.length - 1,
     o = [];
   let r,
-    l = 2 === i ? "<svg>" : "",
+    l = 2 === i ? "<svg>" : 3 === i ? "<math>" : "",
     c = f;
   for (let i = 0; i < s; i++) {
     const s = t[i];
@@ -358,13 +358,13 @@ const P = (t, i) => {
       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 : void 0 !== u[1] ? c = _ : void 0 !== u[2] ? ($.test(u[2]) && (r = RegExp("</" + u[2], "g")), c = m) : void 0 !== u[3] && (c = m) : c === m ? ">" === 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 : '"' === u[3] ? g : p) : c === g || c === p ? c = m : c === v || c === _ ? c = f : (c = m, r = void 0);
+    for (; y < s.length && (c.lastIndex = y, u = c.exec(s), null !== u);) y = c.lastIndex, c === f ? "!--" === u[1] ? c = v : undefined !== u[1] ? c = _ : undefined !== u[2] ? ($.test(u[2]) && (r = RegExp("</" + u[2], "g")), c = m) : undefined !== u[3] && (c = m) : c === m ? ">" === u[0] ? (c = r ?? f, d = -1) : undefined === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = undefined === u[3] ? m : '"' === u[3] ? g : p) : c === g || c === p ? c = m : c === v || c === _ ? c = f : (c = m, r = undefined);
     const x = c === m && t[i + 1].startsWith("/>") ? " " : "";
     l += c === f ? s + n : d >= 0 ? (o.push(a), s.slice(0, d) + e + s.slice(d) + h + x) : s + h + (-2 === d ? i : x);
   }
-  return [C(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : "")), o];
+  return [P(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : 3 === i ? "</math>" : "")), o];
 };
-class V {
+class N {
   constructor({
     strings: t,
     _$litType$: s
@@ -375,12 +375,12 @@ class V {
       a = 0;
     const u = t.length - 1,
       d = this.parts,
-      [f, v] = P(t, s);
-    if (this.el = V.createElement(f, n), E.currentNode = this.el.content, 2 === s) {
+      [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);
     }
-    for (; null !== (r = E.nextNode()) && d.length < u;) {
+    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)) {
           const i = v[a++],
@@ -391,7 +391,7 @@ class V {
             index: c,
             name: e[2],
             strings: s,
-            ctor: "." === e[1] ? k : "?" === e[1] ? H : "@" === e[1] ? I : R
+            ctor: "." === e[1] ? H : "?" === e[1] ? I : "@" === e[1] ? L : k
           }), r.removeAttribute(t);
         } else t.startsWith(h) && (d.push({
           type: 6,
@@ -401,8 +401,8 @@ class V {
           const t = r.textContent.split(h),
             s = t.length - 1;
           if (s > 0) {
-            r.textContent = i ? i.emptyScript : "";
-            for (let i = 0; i < s; i++) r.append(t[i], l()), E.nextNode(), d.push({
+            r.textContent = i$1 ? i$1.emptyScript : "";
+            for (let i = 0; i < s; i++) r.append(t[i], l()), C.nextNode(), d.push({
               type: 2,
               index: ++c
             });
@@ -427,15 +427,15 @@ class V {
     return s.innerHTML = t, s;
   }
 }
-function N(t, i, s = t, e) {
-  if (i === w) return i;
-  let h = void 0 !== e ? s._$Co?.[e] : s._$Cl;
-  const o = c(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 = N(t, h._$AS(t, i.values), h, e)), i;
+function S(t, i, s = t, e) {
+  if (i === T) return i;
+  let h = undefined !== e ? s._$Co?.[e] : s._$Cl;
+  const o = c(i) ? undefined : i._$litDirective$;
+  return h?.constructor !== o && (h?._$AO?.(false), undefined === o ? h = undefined : (h = new o(t), h._$AT(t, s, e)), undefined !== e ? (s._$Co ??= [])[e] = h : s._$Cl = h), undefined !== h && (i = S(t, h._$AS(t, i.values), h, e)), i;
 }
-class S {
+class M {
   constructor(t, i) {
-    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
+    this._$AV = [], this._$AN = undefined, this._$AD = t, this._$AM = i;
   }
   get parentNode() {
     return this._$AM.parentNode;
@@ -450,37 +450,37 @@ class S {
         },
         parts: s
       } = this._$AD,
-      e = (t?.creationScope ?? r$1).importNode(i, !0);
-    E.currentNode = e;
-    let h = E.nextNode(),
+      e = (t?.creationScope ?? r$1).importNode(i, true);
+    C.currentNode = e;
+    let h = C.nextNode(),
       o = 0,
       n = 0,
       l = s[0];
-    for (; void 0 !== l;) {
+    for (; undefined !== l;) {
       if (o === l.index) {
         let i;
-        2 === l.type ? i = new M(h, h.nextSibling, this, t) : 1 === l.type ? i = new l.ctor(h, l.name, l.strings, this, t) : 6 === l.type && (i = new L(h, this, t)), this._$AV.push(i), l = s[++n];
+        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];
       }
-      o !== l?.index && (h = E.nextNode(), o++);
+      o !== l?.index && (h = C.nextNode(), o++);
     }
-    return E.currentNode = r$1, e;
+    return C.currentNode = r$1, 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++;
+    for (const s of this._$AV) undefined !== s && (undefined !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
   }
 }
-class M {
+class R {
   get _$AU() {
     return this._$AM?._$AU ?? this._$Cv;
   }
   constructor(t, i, s, e) {
-    this.type = 2, this._$AH = T, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cv = e?.isConnected ?? !0;
+    this.type = 2, this._$AH = E, this._$AN = undefined, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this._$Cv = e?.isConnected ?? true;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
     const i = this._$AM;
-    return void 0 !== i && 11 === t?.nodeType && (t = i.parentNode), t;
+    return undefined !== i && 11 === t?.nodeType && (t = i.parentNode), t;
   }
   get startNode() {
     return this._$AA;
@@ -489,52 +489,52 @@ class M {
     return this._$AB;
   }
   _$AI(t, i = this) {
-    t = N(this, t, i), c(t) ? t === T || null == t || "" === t ? (this._$AH !== T && this._$AR(), this._$AH = T) : t !== this._$AH && t !== w && this._(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : u(t) ? this.k(t) : this._(t);
+    t = S(this, t, i), c(t) ? t === E || null == t || "" === t ? (this._$AH !== E && this._$AR(), this._$AH = E) : t !== this._$AH && t !== T && this._(t) : undefined !== t._$litType$ ? this.$(t) : undefined !== t.nodeType ? this.T(t) : u(t) ? this.k(t) : this._(t);
   }
-  S(t) {
+  O(t) {
     return this._$AA.parentNode.insertBefore(t, this._$AB);
   }
   T(t) {
-    this._$AH !== t && (this._$AR(), this._$AH = this.S(t));
+    this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
   }
   _(t) {
-    this._$AH !== T && c(this._$AH) ? this._$AA.nextSibling.data = t : this.T(r$1.createTextNode(t)), this._$AH = t;
+    this._$AH !== E && c(this._$AH) ? this._$AA.nextSibling.data = t : this.T(r$1.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 = V.createElement(C(s.h, s.h[0]), this.options)), s);
+      e = "number" == typeof s ? this._$AC(t) : (undefined === 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 S(e, this),
+      const t = new M(e, this),
         s = t.u(this.options);
       t.p(i), this.T(s), this._$AH = t;
     }
   }
   _$AC(t) {
     let i = A.get(t.strings);
-    return void 0 === i && A.set(t.strings, i = new V(t)), i;
+    return undefined === 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 M(this.S(l()), this.S(l()), this, this.options)) : s = i[e], s._$AI(h), e++;
+    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;) {
+    for (this._$AP?.(false, true, i); t && t !== this._$AB;) {
       const i = t.nextSibling;
       t.remove(), t = i;
     }
   }
   setConnected(t) {
-    void 0 === this._$AM && (this._$Cv = t, this._$AP?.(t));
+    undefined === this._$AM && (this._$Cv = t, this._$AP?.(t));
   }
 }
-class R {
+class k {
   get tagName() {
     return this.element.tagName;
   }
@@ -542,72 +542,72 @@ class R {
     return this._$AM._$AU;
   }
   constructor(t, i, s, e, h) {
-    this.type = 1, this._$AH = T, 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 = T;
+    this.type = 1, this._$AH = E, this._$AN = undefined, 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 = N(this, t, i, 0), o = !c(t) || t !== this._$AH && t !== w, o && (this._$AH = t);else {
+    let o = false;
+    if (undefined === h) t = S(this, t, i, 0), o = !c(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 = N(this, e[s + n], i, n), r === w && (r = this._$AH[n]), o ||= !c(r) || r !== this._$AH[n], r === T ? t = T : t !== T && (t += (r ?? "") + h[n + 1]), this._$AH[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(r) || r !== this._$AH[n], r === E ? t = E : t !== E && (t += (r ?? "") + h[n + 1]), this._$AH[n] = r;
     }
     o && !e && this.j(t);
   }
   j(t) {
-    t === T ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+    t === E ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
   }
 }
-class k extends R {
+class H extends k {
   constructor() {
     super(...arguments), this.type = 3;
   }
   j(t) {
-    this.element[this.name] = t === T ? void 0 : t;
+    this.element[this.name] = t === E ? undefined : t;
   }
 }
-class H extends R {
+class I extends k {
   constructor() {
     super(...arguments), this.type = 4;
   }
   j(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== T);
+    this.element.toggleAttribute(this.name, !!t && t !== E);
   }
 }
-class I extends R {
+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 = N(this, t, i, 0) ?? T) === w) return;
+    if ((t = S(this, t, i, 0) ?? E) === T) return;
     const s = this._$AH,
-      e = t === T && s !== T || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive,
-      h = t !== T && (s === T || e);
+      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 L {
+class z {
   constructor(t, i, s) {
-    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = i, this.options = s;
+    this.element = t, this.type = 6, this._$AN = undefined, this._$AM = i, this.options = s;
   }
   get _$AU() {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    N(this, t);
+    S(this, t);
   }
 }
-const Z = t.litHtmlPolyfillSupport;
-Z?.(V, M), (t.litHtmlVersions ??= []).push("3.1.3");
-const j = (t, i, s) => {
+const j = t.litHtmlPolyfillSupport;
+j?.(N, R), (t.litHtmlVersions ??= []).push("3.2.1");
+const B = (t, i, s) => {
   const e = s?.renderBefore ?? i;
   let h = e._$litPart$;
-  if (void 0 === h) {
+  if (undefined === h) {
     const t = s?.renderBefore ?? null;
-    e._$litPart$ = h = new M(i.insertBefore(l(), t), t, void 0, s ?? {});
+    e._$litPart$ = h = new R(i.insertBefore(l(), t), t, undefined, s ?? {});
   }
   return h._$AI(t), h;
 };
@@ -617,38 +617,38 @@ const j = (t, i, s) => {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-class s extends b$1 {
+class r extends b$1 {
   constructor() {
     super(...arguments), this.renderOptions = {
       host: this
-    }, this._$Do = void 0;
+    }, this._$Do = undefined;
   }
   createRenderRoot() {
     const t = super.createRenderRoot();
     return this.renderOptions.renderBefore ??= t.firstChild, t;
   }
   update(t) {
-    const i = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = j(i, this.renderRoot, this.renderOptions);
+    const s = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = B(s, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
-    super.connectedCallback(), this._$Do?.setConnected(!0);
+    super.connectedCallback(), this._$Do?.setConnected(true);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this._$Do?.setConnected(!1);
+    super.disconnectedCallback(), this._$Do?.setConnected(false);
   }
   render() {
-    return w;
+    return T;
   }
 }
-s._$litElement$ = !0, s[("finalized")] = !0, globalThis.litElementHydrateSupport?.({
-  LitElement: s
+r._$litElement$ = true, r["finalized"] = true, globalThis.litElementHydrateSupport?.({
+  LitElement: r
 });
-const r = globalThis.litElementPolyfillSupport;
-r?.({
-  LitElement: s
+const i = globalThis.litElementPolyfillSupport;
+i?.({
+  LitElement: r
 });
-(globalThis.litElementVersions ??= []).push("4.0.5");
+(globalThis.litElementVersions ??= []).push("4.1.1");
 
 var noop = {
   value: () => {}
@@ -1912,7 +1912,7 @@ function hsl2rgb(h, m1, m2) {
   return (h < 60 ? m1 + (m2 - m1) * h / 60 : h < 180 ? m2 : h < 240 ? m1 + (m2 - m1) * (240 - h) / 60 : m1) * 255;
 }
 
-var constant = (x => () => x);
+var constant = x => () => x;
 
 function linear(a, d) {
   return function (t) {
@@ -3068,7 +3068,7 @@ Transform.prototype;
   DecidablesElement Base Class - Not intended for instantiation!
   <decidables-element>
 */
-class DecidablesElement extends s {
+class DecidablesElement extends r {
   getComputedStyleValue(property) {
     return getComputedStyle(this).getPropertyValue(property).trim();
   }
@@ -3321,7 +3321,7 @@ class DecidablesElement extends s {
     `;
   }
   static get styles() {
-    return i$2`
+    return i$3`
       :host {
         ---shadow-0: var(--shadow-0, ${r$3(this.cssBoxShadow(0))});
         ---shadow-2: var(--shadow-2, ${r$3(this.cssBoxShadow(2))});
@@ -3399,8 +3399,11 @@ class DecidablesButton extends DecidablesElement {
     this.disabled = false;
   }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         :host {
+          ---decidables-button-background-color-disabled: var(--decidables-button-background-color, var(---color-element-disabled));
+          ---decidables-button-background-color-enabled: var(--decidables-button-background-color, var(---color-element-enabled));
+
           margin: 0.25rem;
         }
 
@@ -3420,7 +3423,7 @@ class DecidablesButton extends DecidablesElement {
         }
 
         button:disabled {
-          background-color: var(--decidables-button-background-color, var(---color-element-disabled));
+          background-color: var(---decidables-button-background-color-disabled);
           outline: none;
           box-shadow: none;
         }
@@ -3428,7 +3431,7 @@ class DecidablesButton extends DecidablesElement {
         button:enabled {
           cursor: pointer;
 
-          background-color: var(--decidables-button-background-color, var(---color-element-enabled));
+          background-color: var(---decidables-button-background-color-enabled);
           outline: none;
           box-shadow: var(---shadow-2);
         }
@@ -3469,7 +3472,7 @@ customElements.define('decidables-button', DecidablesButton);
  * Copyright 2018 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const o = o => o ?? T;
+const o = o => o ?? E;
 
 class DecidablesSlider extends DecidablesElement {
   static get properties() {
@@ -3479,6 +3482,11 @@ class DecidablesSlider extends DecidablesElement {
         type: Boolean,
         reflect: true
       },
+      scale: {
+        attribute: 'scale',
+        type: Boolean,
+        reflect: true
+      },
       max: {
         attribute: 'max',
         type: Number,
@@ -3498,6 +3506,11 @@ class DecidablesSlider extends DecidablesElement {
         attribute: 'value',
         type: Number,
         reflect: true
+      },
+      nonlinear: {
+        attribute: false,
+        type: Boolean,
+        reflect: false
       }
     };
   }
@@ -3506,13 +3519,30 @@ class DecidablesSlider extends DecidablesElement {
 
     // Attributes
     this.disabled = false;
+    this.scale = false;
     this.max = undefined;
     this.min = undefined;
     this.step = undefined;
     this.value = undefined;
+    this.nonlinear = false;
+
+    // Properties
+    this.rangeMax = undefined;
+    this.rangeMin = undefined;
+    this.rangeStep = undefined;
+    this.rangeValue = undefined;
+
+    // Transform
+    this.toRange = undefined;
+    this.fromRange = undefined;
   }
-  changed(event) {
-    this.value = event.target.value;
+  nonlinearRange(nonlinear, toRange, fromRange) {
+    this.nonlinear = nonlinear;
+    this.toRange = nonlinear ? toRange : undefined;
+    this.fromRange = nonlinear ? fromRange : undefined;
+  }
+  rangeChanged(event) {
+    this.value = this.nonlinear ? this.fromRange(event.target.value) : event.target.value;
     this.dispatchEvent(new CustomEvent('change', {
       detail: {
         value: this.value
@@ -3520,12 +3550,25 @@ class DecidablesSlider extends DecidablesElement {
       bubbles: true
     }));
   }
-  inputted(event) {
+  rangeInputted(event) {
+    this.value = this.nonlinear ? this.fromRange(event.target.value) : event.target.value;
+  }
+  spinnerInputted(event) {
     this.value = event.target.value;
   }
+  willUpdate() {
+    this.rangeMax = this.max === undefined ? undefined : this.nonlinear ? this.toRange(this.max) : this.max;
+    this.rangeMin = this.min === undefined ? undefined : this.nonlinear ? this.toRange(this.min) : this.min;
+    this.rangeStep = this.step === undefined ? undefined : this.nonlinear ? 'any' : this.step;
+    this.rangeValue = this.value === undefined ? undefined : this.nonlinear ? this.toRange(this.value) : this.value;
+  }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         :host {
+          ---decidables-slider-background-color: var(--decidables-slider-background-color, var(---color-element-disabled));
+          ---decidables-slider-color: var(--decidables-slider-color, var(---color-element-enabled));
+          ---decidables-spinner-background-color: var(--decidables-slider-background-color, none);
+
           ---shadow-2-rotate: var(--shadow-2-rotate, ${r$3(this.cssBoxShadow(2, true, false))});
           ---shadow-4-rotate: var(--shadow-4-rotate, ${r$3(this.cssBoxShadow(4, true, false))});
           ---shadow-8-rotate: var(--shadow-8-rotate, ${r$3(this.cssBoxShadow(8, true, false))});
@@ -3543,7 +3586,10 @@ class DecidablesSlider extends DecidablesElement {
         }
 
         .range {
-          display: inline-block;
+          position: relative;
+          display: flex;
+
+          flex-direction: row;
 
           width: 3.5rem;
           height: 4.75rem;
@@ -3554,6 +3600,8 @@ class DecidablesSlider extends DecidablesElement {
           --decidables-spinner-input-width: 3.5rem;
 
           margin: 0 0.25rem 0.25rem;
+
+          background: var(---decidables-spinner-background-color);
         }
 
         /* Adapted from http://danielstern.ca/range.css/#/ */
@@ -3592,14 +3640,14 @@ class DecidablesSlider extends DecidablesElement {
           width: 100%;
           height: 4px;
 
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
           border: 0;
           border-radius: 2px;
           box-shadow: none;
         }
 
         input[type=range]:focus::-webkit-slider-runnable-track {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
         }
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
@@ -3607,7 +3655,7 @@ class DecidablesSlider extends DecidablesElement {
           width: 100%;
           height: 4px;
 
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
           border: 0;
           border-radius: 2px;
           box-shadow: none;
@@ -3627,7 +3675,7 @@ class DecidablesSlider extends DecidablesElement {
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]::-ms-fill-lower {
           background: #cccccc;
-          /* background: var(---color-element-disabled); */
+          /* background: var(---decidables-slider-background-color); */
           border: 0;
           border-radius: 2px;
           box-shadow: none;
@@ -3636,7 +3684,7 @@ class DecidablesSlider extends DecidablesElement {
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]::-ms-fill-upper {
           background: #cccccc;
-          /* background: var(---color-element-disabled); */
+          /* background: var(---decidables-slider-background-color); */
           border: 0;
           border-radius: 2px;
           box-shadow: none;
@@ -3644,12 +3692,12 @@ class DecidablesSlider extends DecidablesElement {
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:focus::-ms-fill-lower {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
         }
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:focus::-ms-fill-upper {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
         }
 
         /* Thumb */
@@ -3667,12 +3715,12 @@ class DecidablesSlider extends DecidablesElement {
         }
 
         input[type=range]:disabled::-webkit-slider-thumb {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
           box-shadow: none;
         }
 
         input[type=range]:enabled::-webkit-slider-thumb {
-          background: var(---color-element-enabled);
+          background: var(---decidables-slider-color);
           box-shadow: var(---shadow-2-rotate);
         }
 
@@ -3703,13 +3751,13 @@ class DecidablesSlider extends DecidablesElement {
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:disabled::-moz-range-thumb {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
           box-shadow: none;
         }
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:enabled::-moz-range-thumb {
-          background: var(---color-element-enabled);
+          background: var(---decidables-slider-color);
           box-shadow: var(---shadow-2-rotate);
         }
 
@@ -3746,13 +3794,13 @@ class DecidablesSlider extends DecidablesElement {
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:disabled::-ms-thumb {
-          background: var(---color-element-disabled);
+          background: var(---decidables-slider-background-color);
           box-shadow: none;
         }
 
         /* stylelint-disable-next-line no-descending-specificity */ /* stylelint ERROR */
         input[type=range]:enabled::-ms-thumb {
-          background: var(---color-element-enabled);
+          background: var(---decidables-slider-color);
           box-shadow: var(---shadow-2-rotate);
         }
 
@@ -3774,6 +3822,33 @@ class DecidablesSlider extends DecidablesElement {
         :host(.keyboard) input[type=range]:enabled:focus:active::-ms-thumb {
           box-shadow: var(---shadow-8-rotate);
         }
+
+        datalist {
+          position: absolute;
+          left: 2rem;
+          z-index: -1;
+          display: flex;
+
+          flex-direction: column;
+
+          align-items: flex-start;
+          justify-content: space-between;
+
+          height: 4.75rem;
+
+          font-size: 0.75rem;
+        }
+
+        option {
+          padding: 0;
+
+          line-height: 0.8;
+          min-block-size: 0;
+        }
+
+        option::before {
+          content: "– ";
+        }
       `];
   }
   render() {
@@ -3782,9 +3857,15 @@ class DecidablesSlider extends DecidablesElement {
         <slot></slot>
       </label>
       <div class="range">
-        <input ?disabled=${this.disabled} type="range" id="slider" min=${o(this.min)} max=${o(this.max)} step=${o(this.step)} .value=${this.value} @change=${this.changed.bind(this)} @input=${this.inputted.bind(this)}>
+        <input ?disabled=${this.disabled} type="range" id="slider" min=${o(this.rangeMin)} max=${o(this.rangeMax)} step=${o(this.rangeStep)} .value=${this.rangeValue} @change=${this.rangeChanged.bind(this)} @input=${this.rangeInputted.bind(this)}>
+        ${this.scale ? x`
+            <datalist id="ticks">
+              <option value=${o(this.rangeMax)} label=${o(this.max)}></option>
+              <option value=${o(this.rangeMin)} label=${o(this.min)}></option>
+            </datalist>
+          ` : x``}
       </div>
-      <decidables-spinner ?disabled=${this.disabled} min=${o(this.min)} max=${o(this.max)} step=${o(this.step)} .value=${this.value} @input=${this.inputted.bind(this)}></decidables-spinner>
+      <decidables-spinner ?disabled=${this.disabled} min=${o(this.min)} max=${o(this.max)} step=${o(this.step)} .value=${this.value} @input=${this.spinnerInputted.bind(this)}></decidables-spinner>
     `;
   }
 }
@@ -3834,7 +3915,7 @@ class DecidablesSpinner extends DecidablesElement {
     this.value = event.target.value;
   }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         :host {
           ---decidables-spinner-font-size: var(--decidables-spinner-font-size, 1.125rem);
           ---decidables-spinner-input-width: var(--decidables-spinner-input-width, 4rem);
@@ -3973,7 +4054,7 @@ class DecidablesSwitch extends DecidablesElement {
     }));
   }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         :host {
           display: flex;
 
@@ -4126,7 +4207,7 @@ class DecidablesToggle extends DecidablesElement {
     this.disabled = false;
   }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         fieldset {
           display: flex;
 
@@ -4201,7 +4282,7 @@ class DecidablesToggleOption extends DecidablesElement {
     }));
   }
   static get styles() {
-    return [super.styles, i$2`
+    return [super.styles, i$3`
         :host {
           display: flex;
         }