@record-evolution/widget-gauge 1.5.35 → 1.6.3

package/dist/widget-gauge.js

@@ -13,7 +13,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
 
 function __decorate(decorators, target, key, desc) {
   var c = arguments.length,
@@ -32,21 +32,21 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const t$3 = globalThis,
-  e$3 = t$3.ShadowRoot && (void 0 === t$3.ShadyCSS || t$3.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
-  s$3 = Symbol(),
-  o$3 = new WeakMap();
+const t = globalThis,
+  e$1 = t.ShadowRoot && (void 0 === t.ShadyCSS || t.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype,
+  s = Symbol(),
+  o$2 = new WeakMap();
 let n$3 = class n {
   constructor(t, e, o) {
-    if (this._$cssResult$ = !0, o !== s$3) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    if (this._$cssResult$ = !0, o !== s) 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$3 && void 0 === t) {
+    if (e$1 && 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));
+      e && (t = o$2.get(s)), void 0 === t && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), e && o$2.set(s, t));
     }
     return t;
   }
@@ -54,26 +54,26 @@ let n$3 = class n {
     return this.cssText;
   }
 };
-const r$6 = t => new n$3("string" == typeof t ? t : t + "", void 0, s$3),
-  i$3 = (t, ...e) => {
+const r$3 = t => new n$3("string" == typeof t ? t : t + "", void 0, s),
+  i$1 = (t, ...e) => {
     const o = 1 === t.length ? t[0] : e.reduce((e, s, o) => e + (t => {
       if (!0 === t._$cssResult$) return t.cssText;
       if ("number" == typeof t) return t;
       throw Error("Value passed to 'css' function must be a 'css' function result: " + t + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
     })(s) + t[o + 1], t[0]);
-    return new n$3(o, t, s$3);
+    return new n$3(o, t, s);
   },
   S$1 = (s, o) => {
-    if (e$3) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
+    if (e$1) s.adoptedStyleSheets = o.map(t => t instanceof CSSStyleSheet ? t : t.styleSheet);else for (const e of o) {
       const o = document.createElement("style"),
-        n = t$3.litNonce;
+        n = t.litNonce;
       void 0 !== n && o.setAttribute("nonce", n), o.textContent = e.cssText, s.appendChild(o);
     }
   },
-  c$3 = e$3 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
+  c$2 = e$1 ? t => t : t => t instanceof CSSStyleSheet ? (t => {
     let e = "";
     for (const s of t.cssRules) e += s.cssText;
-    return r$6(e);
+    return r$3(e);
   })(t) : t;
 
 /**
@@ -82,23 +82,23 @@ const r$6 = t => new n$3("string" == typeof t ? t : t + "", void 0, s$3),
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const {
-    is: i$2,
-    defineProperty: e$2,
-    getOwnPropertyDescriptor: r$5,
+    is: i,
+    defineProperty: e,
+    getOwnPropertyDescriptor: r$2,
     getOwnPropertyNames: h$2,
-    getOwnPropertySymbols: o$2,
+    getOwnPropertySymbols: o$1,
     getPrototypeOf: n$2
   } = Object,
-  a$1 = globalThis,
-  c$2 = a$1.trustedTypes,
-  l$1 = c$2 ? c$2.emptyScript : "",
-  p$2 = a$1.reactiveElementPolyfillSupport,
-  d$1 = (t, s) => t,
-  u$3 = {
+  a = globalThis,
+  c$1 = a.trustedTypes,
+  l = c$1 ? c$1.emptyScript : "",
+  p = a.reactiveElementPolyfillSupport,
+  d = (t, s) => t,
+  u = {
     toAttribute(t, s) {
       switch (s) {
         case Boolean:
-          t = t ? l$1 : null;
+          t = t ? l : null;
           break;
         case Object:
         case Array:
@@ -126,15 +126,15 @@ const {
       return i;
     }
   },
-  f$1 = (t, s) => !i$2(t, s),
-  y$1 = {
+  f$2 = (t, s) => !i(t, s),
+  y = {
     attribute: !0,
     type: String,
-    converter: u$3,
+    converter: u,
     reflect: !1,
-    hasChanged: f$1
+    hasChanged: f$2
   };
-Symbol.metadata ??= Symbol("metadata"), a$1.litPropertyMetadata ??= new WeakMap();
+Symbol.metadata ??= Symbol("metadata"), a.litPropertyMetadata ??= new WeakMap();
 class b extends HTMLElement {
   static addInitializer(t) {
     this._$Ei(), (this.l ??= []).push(t);
@@ -142,18 +142,18 @@ class b extends HTMLElement {
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(t, s = y$1) {
+  static createProperty(t, s = y) {
     if (s.state && (s.attribute = !1), this._$Ei(), this.elementProperties.set(t, s), !s.noAccessor) {
       const i = Symbol(),
         r = this.getPropertyDescriptor(t, i, s);
-      void 0 !== r && e$2(this.prototype, t, r);
+      void 0 !== r && e(this.prototype, t, r);
     }
   }
   static getPropertyDescriptor(t, s, i) {
     const {
       get: e,
       set: h
-    } = r$5(this.prototype, t) ?? {
+    } = r$2(this.prototype, t) ?? {
       get() {
         return this[s];
       },
@@ -174,18 +174,18 @@ class b extends HTMLElement {
     };
   }
   static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? y$1;
+    return this.elementProperties.get(t) ?? y;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(d$1("elementProperties"))) return;
+    if (this.hasOwnProperty(d("elementProperties"))) return;
     const t = n$2(this);
     t.finalize(), void 0 !== t.l && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(d$1("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(d$1("properties"))) {
+    if (this.hasOwnProperty(d("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(d("properties"))) {
       const t = this.properties,
-        s = [...h$2(t), ...o$2(t)];
+        s = [...h$2(t), ...o$1(t)];
       for (const i of s) this.createProperty(i, t[i]);
     }
     const t = this[Symbol.metadata];
@@ -204,8 +204,8 @@ class b extends HTMLElement {
     const i = [];
     if (Array.isArray(s)) {
       const e = new Set(s.flat(1 / 0).reverse());
-      for (const s of e) i.unshift(c$3(s));
-    } else void 0 !== s && i.push(c$3(s));
+      for (const s of e) i.unshift(c$2(s));
+    } else void 0 !== s && i.push(c$2(s));
     return i;
   }
   static _$Eu(t, s) {
@@ -216,15 +216,15 @@ class b extends HTMLElement {
     super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
   }
   _$Ev() {
-    this._$Eg = new Promise(t => this.enableUpdating = t), this._$AL = new Map(), this._$ES(), this.requestUpdate(), this.constructor.l?.forEach(t => t(this));
+    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._$E_ ??= new Set()).add(t), void 0 !== this.renderRoot && this.isConnected && t.hostConnected?.();
+    (this._$EO ??= new Set()).add(t), void 0 !== this.renderRoot && this.isConnected && t.hostConnected?.();
   }
   removeController(t) {
-    this._$E_?.delete(t);
+    this._$EO?.delete(t);
   }
-  _$ES() {
+  _$E_() {
     const t = new Map(),
       s = this.constructor.elementProperties;
     for (const i of s.keys()) this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
@@ -235,20 +235,20 @@ class b extends HTMLElement {
     return S$1(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
-    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$E_?.forEach(t => t.hostConnected?.());
+    this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(t => t.hostConnected?.());
   }
   enableUpdating(t) {}
   disconnectedCallback() {
-    this._$E_?.forEach(t => t.hostDisconnected?.());
+    this._$EO?.forEach(t => t.hostDisconnected?.());
   }
   attributeChangedCallback(t, s, i) {
     this._$AK(t, i);
   }
-  _$EO(t, s) {
+  _$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$3).toAttribute(s, i.type);
+      const r = (void 0 !== i.converter?.toAttribute ? i.converter : u).toAttribute(s, i.type);
       this._$Em = t, null == r ? this.removeAttribute(e) : this.setAttribute(e, r), this._$Em = null;
     }
   }
@@ -259,24 +259,24 @@ class b extends HTMLElement {
       const t = i.getPropertyOptions(e),
         r = "function" == typeof t.converter ? {
           fromAttribute: t.converter
-        } : void 0 !== t.converter?.fromAttribute ? t.converter : u$3;
+        } : void 0 !== t.converter?.fromAttribute ? t.converter : u;
       this._$Em = e, this[e] = r.fromAttribute(s, t.type), this._$Em = null;
     }
   }
-  requestUpdate(t, s, i, e = !1, r) {
+  requestUpdate(t, s, i) {
     if (void 0 !== t) {
-      if (i ??= this.constructor.getPropertyOptions(t), !(i.hasChanged ?? f$1)(e ? r : this[t], s)) return;
-      this.C(t, s, i);
+      if (i ??= this.constructor.getPropertyOptions(t), !(i.hasChanged ?? f$2)(this[t], s)) return;
+      this.P(t, s, i);
     }
-    !1 === this.isUpdatePending && (this._$Eg = this._$EP());
+    !1 === this.isUpdatePending && (this._$ES = this._$ET());
   }
-  C(t, s, i) {
+  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);
   }
-  async _$EP() {
+  async _$ET() {
     this.isUpdatePending = !0;
     try {
-      await this._$Eg;
+      await this._$ES;
     } catch (t) {
       Promise.reject(t);
     }
@@ -294,174 +294,174 @@ class b extends HTMLElement {
         this._$Ep = void 0;
       }
       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.C(s, this[s], i);
+      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);
     }
     let t = !1;
     const s = this._$AL;
     try {
-      t = this.shouldUpdate(s), t ? (this.willUpdate(s), this._$E_?.forEach(t => t.hostUpdate?.()), this.update(s)) : this._$ET();
+      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._$ET(), s;
+      throw t = !1, this._$EU(), s;
     }
     t && this._$AE(s);
   }
   willUpdate(t) {}
   _$AE(t) {
-    this._$E_?.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 = !0, this.firstUpdated(t)), this.updated(t);
   }
-  _$ET() {
+  _$EU() {
     this._$AL = new Map(), this.isUpdatePending = !1;
   }
   get updateComplete() {
     return this.getUpdateComplete();
   }
   getUpdateComplete() {
-    return this._$Eg;
+    return this._$ES;
   }
   shouldUpdate(t) {
     return !0;
   }
   update(t) {
-    this._$Ej &&= this._$Ej.forEach(t => this._$EO(t, this[t])), this._$ET();
+    this._$Ej &&= this._$Ej.forEach(t => this._$EC(t, this[t])), this._$EU();
   }
   updated(t) {}
   firstUpdated(t) {}
 }
 b.elementStyles = [], b.shadowRootOptions = {
   mode: "open"
-}, b[d$1("elementProperties")] = new Map(), b[d$1("finalized")] = new Map(), p$2?.({
+}, b[d("elementProperties")] = new Map(), b[d("finalized")] = new Map(), p?.({
   ReactiveElement: b
-}), (a$1.reactiveElementVersions ??= []).push("2.0.2");
+}), (a.reactiveElementVersions ??= []).push("2.0.4");
 
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const t$2 = globalThis,
-  i$1 = t$2.trustedTypes,
-  s$2 = i$1 ? i$1.createPolicy("lit-html", {
+const n$1 = globalThis,
+  c = n$1.trustedTypes,
+  h$1 = c ? c.createPolicy("lit-html", {
     createHTML: t => t
   }) : void 0,
-  e$1 = "$lit$",
-  h$1 = `lit$${(Math.random() + "").slice(9)}$`,
-  o$1 = "?" + h$1,
-  n$1 = `<${o$1}>`,
-  r$4 = document,
-  l = () => r$4.createComment(""),
-  c$1 = t => null === t || "object" != typeof t && "function" != typeof t,
-  a = Array.isArray,
-  u$2 = t => a(t) || "function" == typeof t?.[Symbol.iterator],
-  d = "[ \t\n\f\r]",
-  f = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
-  v$1 = /-->/g,
-  _ = />/g,
-  m$1 = RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"),
-  p$1 = /'/g,
-  g = /"/g,
-  $ = /^(?:script|style|textarea|title)$/i,
-  y = t => (i, ...s) => ({
+  f$1 = "$lit$",
+  v = `lit$${Math.random().toFixed(9).slice(2)}$`,
+  m = "?" + v,
+  _ = `<${m}>`,
+  w = document,
+  lt = () => w.createComment(""),
+  st = t => null === t || "object" != typeof t && "function" != typeof t,
+  g = Array.isArray,
+  $ = t => g(t) || "function" == typeof t?.[Symbol.iterator],
+  x = "[ \t\n\f\r]",
+  T = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,
+  E = /-->/g,
+  k = />/g,
+  O = RegExp(`>|${x}(?:([^\\s"'>=/]+)(${x}*=${x}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`, "g"),
+  S = /'/g,
+  j = /"/g,
+  M = /^(?:script|style|textarea|title)$/i,
+  P = t => (i, ...s) => ({
     _$litType$: t,
     strings: i,
     values: s
   }),
-  x = y(1),
-  w = Symbol.for("lit-noChange"),
-  T = Symbol.for("lit-nothing"),
-  A = new WeakMap(),
-  E = r$4.createTreeWalker(r$4, 129);
-function C(t, i) {
-  if (!Array.isArray(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return void 0 !== s$2 ? s$2.createHTML(i) : i;
+  ke = P(1),
+  R = Symbol.for("lit-noChange"),
+  D = Symbol.for("lit-nothing"),
+  V = new WeakMap(),
+  I = w.createTreeWalker(w, 129);
+function N(t, i) {
+  if (!g(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return void 0 !== h$1 ? h$1.createHTML(i) : i;
 }
-const P = (t, i) => {
+const U = (t, i) => {
   const s = t.length - 1,
-    o = [];
-  let r,
-    l = 2 === i ? "<svg>" : "",
-    c = f;
+    e = [];
+  let h,
+    o = 2 === i ? "<svg>" : 3 === i ? "<math>" : "",
+    n = T;
   for (let i = 0; i < s; i++) {
     const s = t[i];
-    let a,
-      u,
-      d = -1,
-      y = 0;
-    for (; y < s.length && (c.lastIndex = y, u = c.exec(s), null !== u);) y = c.lastIndex, c === f ? "!--" === u[1] ? c = v$1 : void 0 !== u[1] ? c = _ : void 0 !== u[2] ? ($.test(u[2]) && (r = RegExp("</" + u[2], "g")), c = m$1) : void 0 !== u[3] && (c = m$1) : c === m$1 ? ">" === u[0] ? (c = r ?? f, d = -1) : void 0 === u[1] ? d = -2 : (d = c.lastIndex - u[2].length, a = u[1], c = void 0 === u[3] ? m$1 : '"' === u[3] ? g : p$1) : c === g || c === p$1 ? c = m$1 : c === v$1 || c === _ ? c = f : (c = m$1, r = void 0);
-    const x = c === m$1 && t[i + 1].startsWith("/>") ? " " : "";
-    l += c === f ? s + n$1 : d >= 0 ? (o.push(a), s.slice(0, d) + e$1 + s.slice(d) + h$1 + x) : s + h$1 + (-2 === d ? i : x);
-  }
-  return [C(t, l + (t[s] || "<?>") + (2 === i ? "</svg>" : "")), o];
+    let r,
+      l,
+      c = -1,
+      a = 0;
+    for (; a < s.length && (n.lastIndex = a, l = n.exec(s), null !== l);) a = n.lastIndex, n === T ? "!--" === l[1] ? n = E : void 0 !== l[1] ? n = k : void 0 !== l[2] ? (M.test(l[2]) && (h = RegExp("</" + l[2], "g")), n = O) : void 0 !== l[3] && (n = O) : n === O ? ">" === l[0] ? (n = h ?? T, c = -1) : void 0 === l[1] ? c = -2 : (c = n.lastIndex - l[2].length, r = l[1], n = void 0 === l[3] ? O : '"' === l[3] ? j : S) : n === j || n === S ? n = O : n === E || n === k ? n = T : (n = O, h = void 0);
+    const u = n === O && t[i + 1].startsWith("/>") ? " " : "";
+    o += n === T ? s + _ : c >= 0 ? (e.push(r), s.slice(0, c) + f$1 + s.slice(c) + v + u) : s + v + (-2 === c ? i : u);
+  }
+  return [N(t, o + (t[s] || "<?>") + (2 === i ? "</svg>" : 3 === i ? "</math>" : "")), e];
 };
-class V {
+class B {
   constructor({
     strings: t,
-    _$litType$: s
-  }, n) {
-    let r;
+    _$litType$: i
+  }, s) {
+    let e;
     this.parts = [];
-    let c = 0,
-      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) {
+    let h = 0,
+      o = 0;
+    const n = t.length - 1,
+      r = this.parts,
+      [l, a] = U(t, i);
+    if (this.el = B.createElement(l, s), I.currentNode = this.el.content, 2 === i || 3 === i) {
       const t = this.el.content.firstChild;
       t.replaceWith(...t.childNodes);
     }
-    for (; null !== (r = E.nextNode()) && d.length < u;) {
-      if (1 === r.nodeType) {
-        if (r.hasAttributes()) for (const t of r.getAttributeNames()) if (t.endsWith(e$1)) {
-          const i = v[a++],
-            s = r.getAttribute(t).split(h$1),
-            e = /([.?@])?(.*)/.exec(i);
-          d.push({
+    for (; null !== (e = I.nextNode()) && r.length < n;) {
+      if (1 === e.nodeType) {
+        if (e.hasAttributes()) for (const t of e.getAttributeNames()) if (t.endsWith(f$1)) {
+          const i = a[o++],
+            s = e.getAttribute(t).split(v),
+            n = /([.?@])?(.*)/.exec(i);
+          r.push({
             type: 1,
-            index: c,
-            name: e[2],
+            index: h,
+            name: n[2],
             strings: s,
-            ctor: "." === e[1] ? k : "?" === e[1] ? H : "@" === e[1] ? I : R
-          }), r.removeAttribute(t);
-        } else t.startsWith(h$1) && (d.push({
+            ctor: "." === n[1] ? Y : "?" === n[1] ? Z : "@" === n[1] ? q : G
+          }), e.removeAttribute(t);
+        } else t.startsWith(v) && (r.push({
           type: 6,
-          index: c
-        }), r.removeAttribute(t));
-        if ($.test(r.tagName)) {
-          const t = r.textContent.split(h$1),
-            s = t.length - 1;
-          if (s > 0) {
-            r.textContent = i$1 ? i$1.emptyScript : "";
-            for (let i = 0; i < s; i++) r.append(t[i], l()), E.nextNode(), d.push({
+          index: h
+        }), e.removeAttribute(t));
+        if (M.test(e.tagName)) {
+          const t = e.textContent.split(v),
+            i = t.length - 1;
+          if (i > 0) {
+            e.textContent = c ? c.emptyScript : "";
+            for (let s = 0; s < i; s++) e.append(t[s], lt()), I.nextNode(), r.push({
               type: 2,
-              index: ++c
+              index: ++h
             });
-            r.append(t[s], l());
+            e.append(t[i], lt());
           }
         }
-      } else if (8 === r.nodeType) if (r.data === o$1) d.push({
+      } else if (8 === e.nodeType) if (e.data === m) r.push({
         type: 2,
-        index: c
+        index: h
       });else {
         let t = -1;
-        for (; -1 !== (t = r.data.indexOf(h$1, t + 1));) d.push({
+        for (; -1 !== (t = e.data.indexOf(v, t + 1));) r.push({
           type: 7,
-          index: c
-        }), t += h$1.length - 1;
+          index: h
+        }), t += v.length - 1;
       }
-      c++;
+      h++;
     }
   }
   static createElement(t, i) {
-    const s = r$4.createElement("template");
+    const s = w.createElement("template");
     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$1(i) ? void 0 : i._$litDirective$;
-  return h?.constructor !== o && (h?._$AO?.(!1), void 0 === o ? h = void 0 : (h = new o(t), h._$AT(t, s, e)), void 0 !== e ? (s._$Co ??= [])[e] = h : s._$Cl = h), void 0 !== h && (i = N(t, h._$AS(t, i.values), h, e)), i;
+function z(t, i, s = t, e) {
+  if (i === R) return i;
+  let h = void 0 !== e ? s.o?.[e] : s.l;
+  const o = st(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.o ??= [])[e] = h : s.l = h), void 0 !== h && (i = z(t, h._$AS(t, i.values), h, e)), i;
 }
-class S {
+class F {
   constructor(t, i) {
     this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = i;
   }
@@ -478,32 +478,32 @@ class S {
         },
         parts: s
       } = this._$AD,
-      e = (t?.creationScope ?? r$4).importNode(i, !0);
-    E.currentNode = e;
-    let h = E.nextNode(),
+      e = (t?.creationScope ?? w).importNode(i, !0);
+    I.currentNode = e;
+    let h = I.nextNode(),
       o = 0,
       n = 0,
-      l = s[0];
-    for (; void 0 !== l;) {
-      if (o === l.index) {
+      r = s[0];
+    for (; void 0 !== r;) {
+      if (o === r.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 === r.type ? i = new et(h, h.nextSibling, this, t) : 1 === r.type ? i = new r.ctor(h, r.name, r.strings, this, t) : 6 === r.type && (i = new K(h, this, t)), this._$AV.push(i), r = s[++n];
       }
-      o !== l?.index && (h = E.nextNode(), o++);
+      o !== r?.index && (h = I.nextNode(), o++);
     }
-    return E.currentNode = r$4, e;
+    return I.currentNode = w, e;
   }
   p(t) {
     let i = 0;
     for (const s of this._$AV) void 0 !== s && (void 0 !== s.strings ? (s._$AI(t, s, i), i += s.strings.length - 2) : s._$AI(t[i])), i++;
   }
 }
-class M {
+class et {
   get _$AU() {
-    return this._$AM?._$AU ?? this._$Cv;
+    return this._$AM?._$AU ?? this.v;
   }
   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 = D, this._$AN = void 0, this._$AA = t, this._$AB = i, this._$AM = s, this.options = e, this.v = e?.isConnected ?? !0;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
@@ -517,39 +517,39 @@ class M {
     return this._$AB;
   }
   _$AI(t, i = this) {
-    t = N(this, t, i), c$1(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.g(t) : void 0 !== t.nodeType ? this.$(t) : u$2(t) ? this.T(t) : this._(t);
+    t = z(this, t, i), st(t) ? t === D || null == t || "" === t ? (this._$AH !== D && this._$AR(), this._$AH = D) : t !== this._$AH && t !== R && this._(t) : void 0 !== t._$litType$ ? this.$(t) : void 0 !== t.nodeType ? this.T(t) : $(t) ? this.k(t) : this._(t);
   }
-  k(t) {
+  O(t) {
     return this._$AA.parentNode.insertBefore(t, this._$AB);
   }
-  $(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 !== T && c$1(this._$AH) ? this._$AA.nextSibling.data = t : this.$(r$4.createTextNode(t)), this._$AH = t;
+    this._$AH !== D && st(this._$AH) ? this._$AA.nextSibling.data = t : this.T(w.createTextNode(t)), this._$AH = t;
   }
-  g(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) : (void 0 === s.el && (s.el = B.createElement(N(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 F(e, this),
         s = t.u(this.options);
-      t.p(i), this.$(s), this._$AH = t;
+      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;
+    let i = V.get(t.strings);
+    return void 0 === i && V.set(t.strings, i = new B(t)), i;
   }
-  T(t) {
-    a(this._$AH) || (this._$AH = [], this._$AR());
+  k(t) {
+    g(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.k(l()), this.k(l()), this, this.options)) : s = i[e], s._$AI(h), e++;
+    for (const h of t) e === i.length ? i.push(s = new et(this.O(lt()), this.O(lt()), 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) {
@@ -559,10 +559,10 @@ class M {
     }
   }
   setConnected(t) {
-    void 0 === this._$AM && (this._$Cv = t, this._$AP?.(t));
+    void 0 === this._$AM && (this.v = t, this._$AP?.(t));
   }
 }
-class R {
+class G {
   get tagName() {
     return this.element.tagName;
   }
@@ -570,54 +570,54 @@ 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 = D, 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 = D;
   }
   _$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$1(t) || t !== this._$AH && t !== w, o && (this._$AH = t);else {
+    if (void 0 === h) t = z(this, t, i, 0), o = !st(t) || t !== this._$AH && t !== R, 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$1(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 = z(this, e[s + n], i, n), r === R && (r = this._$AH[n]), o ||= !st(r) || r !== this._$AH[n], r === D ? t = D : t !== D && (t += (r ?? "") + h[n + 1]), this._$AH[n] = r;
     }
-    o && !e && this.O(t);
+    o && !e && this.j(t);
   }
-  O(t) {
-    t === T ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+  j(t) {
+    t === D ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
   }
 }
-class k extends R {
+class Y extends G {
   constructor() {
     super(...arguments), this.type = 3;
   }
-  O(t) {
-    this.element[this.name] = t === T ? void 0 : t;
+  j(t) {
+    this.element[this.name] = t === D ? void 0 : t;
   }
 }
-class H extends R {
+class Z extends G {
   constructor() {
     super(...arguments), this.type = 4;
   }
-  O(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== T);
+  j(t) {
+    this.element.toggleAttribute(this.name, !!t && t !== D);
   }
 }
-class I extends R {
+class q extends G {
   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 = z(this, t, i, 0) ?? D) === R) 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 === D && s !== D || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive,
+      h = t !== D && (s === D || 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 K {
   constructor(t, i, s) {
     this.element = t, this.type = 6, this._$AN = void 0, this._$AM = i, this.options = s;
   }
@@ -625,33 +625,17 @@ class L {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    N(this, t);
+    z(this, t);
   }
 }
-const z = {
-    j: e$1,
-    P: h$1,
-    A: o$1,
-    C: 1,
-    M: P,
-    L: S,
-    R: u$2,
-    V: N,
-    D: M,
-    I: R,
-    H,
-    N: I,
-    U: k,
-    B: L
-  },
-  Z = t$2.litHtmlPolyfillSupport;
-Z?.(V, M), (t$2.litHtmlVersions ??= []).push("3.1.0");
-const j = (t, i, s) => {
+const Re = n$1.litHtmlPolyfillSupport;
+Re?.(B, et), (n$1.litHtmlVersions ??= []).push("3.2.0");
+const Q = (t, i, s) => {
   const e = s?.renderBefore ?? i;
   let h = e._$litPart$;
   if (void 0 === h) {
     const t = s?.renderBefore ?? null;
-    e._$litPart$ = h = new M(i.insertBefore(l(), t), t, void 0, s ?? {});
+    e._$litPart$ = h = new et(i.insertBefore(lt(), t), t, void 0, s ?? {});
   }
   return h._$AI(t), h;
 };
@@ -661,186 +645,38 @@ const j = (t, i, s) => {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-let s$1 = class s extends b {
+class h extends b {
   constructor() {
     super(...arguments), this.renderOptions = {
       host: this
-    }, this._$Do = void 0;
+    }, this.o = void 0;
   }
   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 e = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this.o = Q(e, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
-    super.connectedCallback(), this._$Do?.setConnected(!0);
+    super.connectedCallback(), this.o?.setConnected(!0);
   }
   disconnectedCallback() {
-    super.disconnectedCallback(), this._$Do?.setConnected(!1);
+    super.disconnectedCallback(), this.o?.setConnected(!1);
   }
   render() {
-    return w;
+    return R;
   }
-};
-s$1._$litElement$ = !0, s$1[("finalized")] = !0, globalThis.litElementHydrateSupport?.({
-  LitElement: s$1
+}
+h._$litElement$ = !0, h["finalized"] = !0, globalThis.litElementHydrateSupport?.({
+  LitElement: h
 });
-const r$3 = globalThis.litElementPolyfillSupport;
-r$3?.({
-  LitElement: s$1
+const f = globalThis.litElementPolyfillSupport;
+f?.({
+  LitElement: h
 });
-(globalThis.litElementVersions ??= []).push("4.0.2");
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const t$1 = {
-    ATTRIBUTE: 1,
-    CHILD: 2,
-    PROPERTY: 3,
-    BOOLEAN_ATTRIBUTE: 4,
-    EVENT: 5,
-    ELEMENT: 6
-  },
-  e = t => (...e) => ({
-    _$litDirective$: t,
-    values: e
-  });
-class i {
-  constructor(t) {}
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AT(t, e, i) {
-    this._$Ct = t, this._$AM = e, this._$Ci = i;
-  }
-  _$AS(t, e) {
-    return this.update(t, e);
-  }
-  update(t, e) {
-    return this.render(...e);
-  }
-}
-
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const {
-    D: t
-  } = z,
-  s = () => document.createComment(""),
-  r$2 = (o, i, n) => {
-    const e = o._$AA.parentNode,
-      l = void 0 === i ? o._$AB : i._$AA;
-    if (void 0 === n) {
-      const i = e.insertBefore(s(), l),
-        c = e.insertBefore(s(), l);
-      n = new t(i, c, o, o.options);
-    } else {
-      const t = n._$AB.nextSibling,
-        i = n._$AM,
-        c = i !== o;
-      if (c) {
-        let t;
-        n._$AQ?.(o), n._$AM = o, void 0 !== n._$AP && (t = o._$AU) !== i._$AU && n._$AP(t);
-      }
-      if (t !== l || c) {
-        let o = n._$AA;
-        for (; o !== t;) {
-          const t = o.nextSibling;
-          e.insertBefore(o, l), o = t;
-        }
-      }
-    }
-    return n;
-  },
-  v = (o, t, i = o) => (o._$AI(t, i), o),
-  u$1 = {},
-  m = (o, t = u$1) => o._$AH = t,
-  p = o => o._$AH,
-  h = o => {
-    o._$AP?.(!1, !0);
-    let t = o._$AA;
-    const i = o._$AB.nextSibling;
-    for (; t !== i;) {
-      const o = t.nextSibling;
-      t.remove(), t = o;
-    }
-  };
-
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const u = (e, s, t) => {
-    const r = new Map();
-    for (let l = s; l <= t; l++) r.set(e[l], l);
-    return r;
-  },
-  c = e(class extends i {
-    constructor(e) {
-      if (super(e), e.type !== t$1.CHILD) throw Error("repeat() can only be used in text expressions");
-    }
-    ht(e, s, t) {
-      let r;
-      void 0 === t ? t = s : void 0 !== s && (r = s);
-      const l = [],
-        o = [];
-      let i = 0;
-      for (const s of e) l[i] = r ? r(s, i) : i, o[i] = t(s, i), i++;
-      return {
-        values: o,
-        keys: l
-      };
-    }
-    render(e, s, t) {
-      return this.ht(e, s, t).values;
-    }
-    update(s, [t, r, c]) {
-      const d = p(s),
-        {
-          values: p$1,
-          keys: a
-        } = this.ht(t, r, c);
-      if (!Array.isArray(d)) return this.dt = a, p$1;
-      const h$1 = this.dt ??= [],
-        v$1 = [];
-      let m$1,
-        y,
-        x = 0,
-        j = d.length - 1,
-        k = 0,
-        w$1 = p$1.length - 1;
-      for (; x <= j && k <= w$1;) if (null === d[x]) x++;else if (null === d[j]) j--;else if (h$1[x] === a[k]) v$1[k] = v(d[x], p$1[k]), x++, k++;else if (h$1[j] === a[w$1]) v$1[w$1] = v(d[j], p$1[w$1]), j--, w$1--;else if (h$1[x] === a[w$1]) v$1[w$1] = v(d[x], p$1[w$1]), r$2(s, v$1[w$1 + 1], d[x]), x++, w$1--;else if (h$1[j] === a[k]) v$1[k] = v(d[j], p$1[k]), r$2(s, d[x], d[j]), j--, k++;else if (void 0 === m$1 && (m$1 = u(a, k, w$1), y = u(h$1, x, j)), m$1.has(h$1[x])) {
-        if (m$1.has(h$1[j])) {
-          const e = y.get(a[k]),
-            t = void 0 !== e ? d[e] : null;
-          if (null === t) {
-            const e = r$2(s, d[x]);
-            v(e, p$1[k]), v$1[k] = e;
-          } else v$1[k] = v(t, p$1[k]), r$2(s, d[x], t), d[e] = null;
-          k++;
-        } else h(d[j]), j--;
-      } else h(d[x]), x++;
-      for (; k <= w$1;) {
-        const e = r$2(s, v$1[w$1 + 1]);
-        v(e, p$1[k]), v$1[k++] = e;
-      }
-      for (; x <= j;) {
-        const e = d[x++];
-        null !== e && h(e);
-      }
-      return this.dt = a, m(s, v$1), w;
-    }
-  });
+(globalThis.litElementVersions ??= []).push("4.1.0");
 
 /**
  * @license
@@ -850,9 +686,9 @@ const u = (e, s, t) => {
 const o = {
     attribute: !0,
     type: String,
-    converter: u$3,
+    converter: u,
     reflect: !1,
-    hasChanged: f$1
+    hasChanged: f$2
   },
   r$1 = (t = o, e, r) => {
     const {
@@ -870,7 +706,7 @@ const o = {
           e.set.call(this, r), this.requestUpdate(o, n, t);
         },
         init(e) {
-          return void 0 !== e && this.C(o, void 0, t), e;
+          return void 0 !== e && this.P(o, void 0, t), e;
         }
       };
     }
@@ -908,7 +744,7 @@ function r(r) {
   });
 }
 
-class WidgetGauge extends s$1 {
+class WidgetGauge extends h {
     constructor() {
         super();
         this.dataSets = [];
@@ -916,7 +752,7 @@ class WidgetGauge extends s$1 {
         this.origWidth = 0;
         this.origHeight = 0;
         this.modifier = 1;
-        this.version = '1.5.35';
+        this.version = '1.6.3';
         this.resizeObserver = new ResizeObserver(this.adjustSizes.bind(this));
         this.template = {
             title: {
@@ -1011,7 +847,7 @@ class WidgetGauge extends s$1 {
     }
     update(changedProperties) {
         changedProperties.forEach((oldValue, propName) => {
-            if (propName === 'inputData') {
+            if (propName === 'inputData' && this.gaugeContainer) {
                 this.transformData();
                 this.adjustSizes();
             }
@@ -1019,8 +855,10 @@ class WidgetGauge extends s$1 {
         super.update(changedProperties);
     }
     firstUpdated(_changedProperties) {
-        var _a;
+        var _a, _b;
         this.resizeObserver.observe((_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.wrapper'));
+        this.gaugeContainer = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.gauge-container');
+        console.log('First Updated', this.gaugeContainer);
         this.sizingSetup();
         this.transformData();
         this.adjustSizes();
@@ -1039,13 +877,12 @@ class WidgetGauge extends s$1 {
         console.log('OrigWidth', this.origWidth, this.origHeight);
     }
     adjustSizes() {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
         // if (!this.origHeight) return
-        const container = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.gauge-container');
-        if (!container)
+        if (!this.gaugeContainer)
             return;
-        const userWidth = container.getBoundingClientRect().width;
-        const userHeight = container.getBoundingClientRect().height;
+        const userWidth = this.gaugeContainer.getBoundingClientRect().width;
+        const userHeight = this.gaugeContainer.getBoundingClientRect().height;
         const count = this.dataSets.length;
         const width = this.origWidth;
         const height = this.origHeight;
@@ -1072,7 +909,7 @@ class WidgetGauge extends s$1 {
         }
         const maxSize = fits.reduce((p, c) => (c.size < p ? p : c.size), 0);
         const fit = fits.find((f) => f.size === maxSize);
-        const modifier = (_b = fit === null || fit === void 0 ? void 0 : fit.m) !== null && _b !== void 0 ? _b : 0;
+        const modifier = (_a = fit === null || fit === void 0 ? void 0 : fit.m) !== null && _a !== void 0 ? _a : 0;
         // console.log(
         //     'FITS count',
         //     userWidth,
@@ -1085,8 +922,8 @@ class WidgetGauge extends s$1 {
         //     (userWidth * userHeight).toFixed(0),
         //     this.boxes
         // )
-        this.boxes = Array.from((_c = this === null || this === void 0 ? void 0 : this.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelectorAll('.chart'));
-        (_d = this.boxes) === null || _d === void 0 ? void 0 : _d.forEach((box) => box.setAttribute('style', `width:${modifier * width}px; height:${modifier * height}px`));
+        this.boxes = Array.from((_b = this === null || this === void 0 ? void 0 : this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('.chart'));
+        (_c = this.boxes) === null || _c === void 0 ? void 0 : _c.forEach((box) => box.setAttribute('style', `width:${modifier * width}px; height:${modifier * height}px`));
         this.modifier = modifier;
         for (const canvas in this.canvasList) {
             this.canvasList[canvas].resize();
@@ -1108,21 +945,21 @@ class WidgetGauge extends s$1 {
                 const pds = {
                     label: prefix + `${(_a = ds.label) !== null && _a !== void 0 ? _a : ''}`,
                     unit: ds.unit,
-                    averageLatest: ds.averageLatest,
+                    advanced: ds.advanced,
                     valueColor: ds.valueColor,
                     sections: ds.sections,
-                    backgroundColors: ds.backgroundColors,
                     data: distincts.length === 1 ? ds.data : (_b = ds === null || ds === void 0 ? void 0 : ds.data) === null || _b === void 0 ? void 0 : _b.filter((d) => d.pivot === piv)
                 };
                 this.dataSets.push(pds);
             });
         });
-        // console.log('Gauge Datasets', this.dataSets)
+        this.setupCharts();
+        console.log('Gauge Datasets', this.dataSets);
     }
     applyData() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26;
+        console.log('Apply Data', this.dataSets.map((d) => d.label));
         const modifier = this.modifier;
-        this.setupCharts();
         this.dataSets.forEach((d) => {
             var _a;
             (_a = d.label) !== null && _a !== void 0 ? _a : (d.label = '');
@@ -1132,16 +969,19 @@ class WidgetGauge extends s$1 {
         for (const ds of this.dataSets) {
             // compute derivative values
             // filter latest values and calculate average
-            if (typeof ds.averageLatest !== 'number' || !isNaN(ds.averageLatest))
-                ds.averageLatest = 1;
-            const data = (_c = (_a = ds === null || ds === void 0 ? void 0 : ds.data) === null || _a === void 0 ? void 0 : _a.slice(0, (_b = ds.averageLatest) !== null && _b !== void 0 ? _b : 1)) !== null && _c !== void 0 ? _c : [];
-            const values = ((_e = (_d = data === null || data === void 0 ? void 0 : data.map((d) => d.value)) === null || _d === void 0 ? void 0 : _d.filter((p) => p !== undefined)) !== null && _e !== void 0 ? _e : []);
+            (_a = ds.advanced) !== null && _a !== void 0 ? _a : (ds.advanced = {});
+            if (typeof ((_b = ds.advanced) === null || _b === void 0 ? void 0 : _b.averageLatest) !== 'number' || isNaN((_c = ds.advanced) === null || _c === void 0 ? void 0 : _c.averageLatest))
+                ds.advanced.averageLatest = 1;
+            const data = (_f = (_d = ds === null || ds === void 0 ? void 0 : ds.data) === null || _d === void 0 ? void 0 : _d.slice(0, ((_e = ds.advanced) === null || _e === void 0 ? void 0 : _e.averageLatest) || 1)) !== null && _f !== void 0 ? _f : [];
+            const values = ((_h = (_g = data === null || data === void 0 ? void 0 : data.map((d) => d.value)) === null || _g === void 0 ? void 0 : _g.filter((p) => p !== undefined)) !== null && _h !== void 0 ? _h : []);
             const average = values.reduce((p, c) => p + c, 0) / values.length;
-            ds.needleValue = isNaN(average) ? (_f = ds.sections) === null || _f === void 0 ? void 0 : _f[0] : average;
-            ds.range = ((_j = (_g = ds.sections) === null || _g === void 0 ? void 0 : _g[((_h = ds.sections) === null || _h === void 0 ? void 0 : _h.length) - 1]) !== null && _j !== void 0 ? _j : 100) - ((_l = (_k = ds.sections) === null || _k === void 0 ? void 0 : _k[0]) !== null && _l !== void 0 ? _l : 0);
+            ds.needleValue = isNaN(average) ? (_k = (_j = ds.sections) === null || _j === void 0 ? void 0 : _j.sectionLimits) === null || _k === void 0 ? void 0 : _k[0] : average;
+            ds.range =
+                ((_q = (_m = (_l = ds.sections) === null || _l === void 0 ? void 0 : _l.sectionLimits) === null || _m === void 0 ? void 0 : _m[((_p = (_o = ds.sections) === null || _o === void 0 ? void 0 : _o.sectionLimits) === null || _p === void 0 ? void 0 : _p.length) - 1]) !== null && _q !== void 0 ? _q : 100) -
+                    ((_t = (_s = (_r = ds.sections) === null || _r === void 0 ? void 0 : _r.sectionLimits) === null || _s === void 0 ? void 0 : _s[0]) !== null && _t !== void 0 ? _t : 0);
             if (isNaN(ds.range))
                 ds.range = 100;
-            ds.ranges = (_o = (_m = ds.sections) === null || _m === void 0 ? void 0 : _m.map((v, i, a) => { var _a; return v - ((_a = a === null || a === void 0 ? void 0 : a[i - 1]) !== null && _a !== void 0 ? _a : 0); }).slice(1)) !== null && _o !== void 0 ? _o : [];
+            ds.ranges = (_w = (_v = (_u = ds.sections) === null || _u === void 0 ? void 0 : _u.sectionLimits) === null || _v === void 0 ? void 0 : _v.map((v, i, a) => { var _a; return v - ((_a = a === null || a === void 0 ? void 0 : a[i - 1]) !== null && _a !== void 0 ? _a : 0); }).slice(1)) !== null && _w !== void 0 ? _w : [];
             // const option = this.canvasList[ds.label].getOption()
             const option = structuredClone(this.template);
             const ga = option.series[0], ga2 = option.series[1];
@@ -1150,27 +990,33 @@ class WidgetGauge extends s$1 {
             option.title.textStyle.fontSize = 32 * modifier;
             // Needle
             // Check age of data Latency
-            const tsp = Date.parse((_r = (_q = (_p = ds === null || ds === void 0 ? void 0 : ds.data) === null || _p === void 0 ? void 0 : _p[0]) === null || _q === void 0 ? void 0 : _q.tsp) !== null && _r !== void 0 ? _r : '');
+            const tsp = Date.parse((_z = (_y = (_x = ds === null || ds === void 0 ? void 0 : ds.data) === null || _x === void 0 ? void 0 : _x[0]) === null || _y === void 0 ? void 0 : _y.tsp) !== null && _z !== void 0 ? _z : '');
             if (isNaN(tsp)) {
                 const now = new Date().getTime();
-                if (now - tsp > ((_s = ds.maxLatency) !== null && _s !== void 0 ? _s : Infinity) * 1000)
+                if (now - tsp > ((_1 = (_0 = ds.advanced) === null || _0 === void 0 ? void 0 : _0.maxLatency) !== null && _1 !== void 0 ? _1 : Infinity) * 1000)
                     ds.needleValue = undefined;
             }
             ga.data[0].value = ds.needleValue;
             ga.data[0].name = ds.unit;
             ga.title.fontSize = 32 * modifier;
-            ga.title.color = (_t = ds.valueColor) !== null && _t !== void 0 ? _t : 'black';
-            ga.detail.color = (_u = ds.valueColor) !== null && _u !== void 0 ? _u : 'black';
+            ga.title.color = (_2 = ds.valueColor) !== null && _2 !== void 0 ? _2 : 'black';
+            ga.detail.color = (_3 = ds.valueColor) !== null && _3 !== void 0 ? _3 : 'black';
             ga.detail.fontSize = 60 * modifier;
             ga.detail.formatter = (val) => (isNaN(val) ? '-' : val.toFixed(0));
             // ga.anchor.itemStyle.color = ds.valueColor
             // ga.pointer.itemStyle.color = ds.valueColor
             // Axis
-            ga2.min = ((_v = ds.sections) === null || _v === void 0 ? void 0 : _v.length) ? Math.min(...ds.sections) : 0;
-            ga2.max = ((_w = ds.sections) === null || _w === void 0 ? void 0 : _w.length) ? Math.max(...ds.sections) : 100;
+            ga2.min = ((_5 = (_4 = ds.sections) === null || _4 === void 0 ? void 0 : _4.sectionLimits) === null || _5 === void 0 ? void 0 : _5.length) ? Math.min(...(_6 = ds.sections) === null || _6 === void 0 ? void 0 : _6.sectionLimits) : 0;
+            ga2.max = ((_8 = (_7 = ds.sections) === null || _7 === void 0 ? void 0 : _7.sectionLimits) === null || _8 === void 0 ? void 0 : _8.length) ? Math.max(...(_9 = ds.sections) === null || _9 === void 0 ? void 0 : _9.sectionLimits) : 100;
             ga.min = ga2.min;
             ga.max = ga2.max;
-            const colorSections = (_x = ds.backgroundColors) === null || _x === void 0 ? void 0 : _x.map((b, i) => { var _a, _b; return [(((_b = (_a = ds.sections) === null || _a === void 0 ? void 0 : _a[i + 1]) !== null && _b !== void 0 ? _b : ga.min) - ga.min) / ds.range, b]; }).filter(([s]) => !isNaN(s));
+            const colorSections = (_11 = (_10 = ds.sections) === null || _10 === void 0 ? void 0 : _10.backgroundColors) === null || _11 === void 0 ? void 0 : _11.map((b, i) => {
+                var _a, _b, _c;
+                return [
+                    (((_c = (_b = (_a = ds.sections) === null || _a === void 0 ? void 0 : _a.sectionLimits) === null || _b === void 0 ? void 0 : _b[i + 1]) !== null && _c !== void 0 ? _c : ga.min) - ga.min) / ds.range,
+                    b
+                ];
+            }).filter(([s]) => !isNaN(s));
             ga2.axisLine.lineStyle.width = 8 * modifier;
             ga2.axisLine.lineStyle.color = (colorSections === null || colorSections === void 0 ? void 0 : colorSections.length)
                 ? colorSections
@@ -1181,70 +1027,63 @@ class WidgetGauge extends s$1 {
             ga2.splitLine.length = 16 * modifier;
             ga2.splitLine.distance = -16 * modifier;
             // Progress
-            let progressColor = (_z = (_y = ds.backgroundColors) === null || _y === void 0 ? void 0 : _y[ds.backgroundColors.length - 1]) !== null && _z !== void 0 ? _z : 'green';
-            for (const [i, s] of (_1 = (_0 = ds.sections) === null || _0 === void 0 ? void 0 : _0.entries()) !== null && _1 !== void 0 ? _1 : []) {
+            let progressColor = (_15 = (_13 = (_12 = ds.sections) === null || _12 === void 0 ? void 0 : _12.backgroundColors) === null || _13 === void 0 ? void 0 : _13[((_14 = ds.sections) === null || _14 === void 0 ? void 0 : _14.backgroundColors.length) - 1]) !== null && _15 !== void 0 ? _15 : 'green';
+            for (const [i, s] of (_18 = (_17 = (_16 = ds.sections) === null || _16 === void 0 ? void 0 : _16.sectionLimits) === null || _17 === void 0 ? void 0 : _17.entries()) !== null && _18 !== void 0 ? _18 : []) {
                 if (s > ds.needleValue) {
-                    progressColor = (_5 = (_3 = (_2 = ds.backgroundColors) === null || _2 === void 0 ? void 0 : _2[i - 1]) !== null && _3 !== void 0 ? _3 : (_4 = ds.backgroundColors) === null || _4 === void 0 ? void 0 : _4[0]) !== null && _5 !== void 0 ? _5 : 'green';
+                    progressColor =
+                        (_24 = (_21 = (_20 = (_19 = ds.sections) === null || _19 === void 0 ? void 0 : _19.backgroundColors) === null || _20 === void 0 ? void 0 : _20[i - 1]) !== null && _21 !== void 0 ? _21 : (_23 = (_22 = ds.sections) === null || _22 === void 0 ? void 0 : _22.backgroundColors) === null || _23 === void 0 ? void 0 : _23[0]) !== null && _24 !== void 0 ? _24 : 'green';
                     break;
                 }
             }
             ga.progress.itemStyle.color = progressColor;
             ga.progress.width = 80 * modifier;
             // Apply
-            (_7 = this.canvasList[(_6 = ds.label) !== null && _6 !== void 0 ? _6 : '']) === null || _7 === void 0 ? void 0 : _7.setOption(option);
+            console.log('Set Option', ds.label, option);
+            (_26 = this.canvasList[(_25 = ds.label) !== null && _25 !== void 0 ? _25 : '']) === null || _26 === void 0 ? void 0 : _26.setOption(option);
         }
     }
     setupCharts() {
+        var _a;
         // remove the gauge canvases of non provided data series
+        console.log('Setup Charts', this.canvasList, this.dataSets);
         for (const label in this.canvasList) {
             const ex = this.dataSets.find((ds) => ds.label === label);
-            if (!ex)
+            if (!ex) {
                 delete this.canvasList[label];
+                const containerDiv = (_a = this.gaugeContainer) === null || _a === void 0 ? void 0 : _a.querySelector(`[name="${label}"]`);
+                containerDiv === null || containerDiv === void 0 ? void 0 : containerDiv.remove();
+            }
         }
         this.dataSets.forEach((ds) => {
             var _a, _b, _c, _d;
             if (this.canvasList[(_a = ds.label) !== null && _a !== void 0 ? _a : ''])
                 return;
-            const canvas = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector(`[name="${ds.label}"]`);
-            if (!canvas)
-                return;
+            const newCanvas = document.createElement('div');
+            newCanvas.setAttribute('name', (_b = ds.label) !== null && _b !== void 0 ? _b : '');
+            newCanvas.setAttribute('class', 'chart');
+            newCanvas.setAttribute('style', `min-width: 600px; min-height: 400px; width: 600px; height: 400px;`);
+            this.gaugeContainer.appendChild(newCanvas);
+            console.log('Create Chart', ds.label);
             // @ts-ignore
-            this.canvasList[(_c = ds.label) !== null && _c !== void 0 ? _c : ''] = echarts.init(canvas);
+            this.canvasList[(_c = ds.label) !== null && _c !== void 0 ? _c : ''] = echarts.init(newCanvas);
             this.canvasList[(_d = ds.label) !== null && _d !== void 0 ? _d : ''].setOption(structuredClone(this.template));
         });
+        this.sizingSetup();
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        return x `
+        var _a, _b, _c, _d, _e, _f;
+        return ke `
             <div class="wrapper">
-                <header
-                    class="paging"
-                    ?active=${((_b = (_a = this.inputData) === null || _a === void 0 ? void 0 : _a.settings) === null || _b === void 0 ? void 0 : _b.title) || ((_d = (_c = this.inputData) === null || _c === void 0 ? void 0 : _c.settings) === null || _d === void 0 ? void 0 : _d.subTitle)}
-                >
-                    <h3 class="paging" ?active=${(_f = (_e = this.inputData) === null || _e === void 0 ? void 0 : _e.settings) === null || _f === void 0 ? void 0 : _f.title}>
-                        ${(_h = (_g = this.inputData) === null || _g === void 0 ? void 0 : _g.settings) === null || _h === void 0 ? void 0 : _h.title}
-                    </h3>
-                    <p class="paging" ?active=${(_k = (_j = this.inputData) === null || _j === void 0 ? void 0 : _j.settings) === null || _k === void 0 ? void 0 : _k.subTitle}>
-                        ${(_m = (_l = this.inputData) === null || _l === void 0 ? void 0 : _l.settings) === null || _m === void 0 ? void 0 : _m.subTitle}
-                    </p>
+                <header class="paging" ?active=${((_a = this.inputData) === null || _a === void 0 ? void 0 : _a.title) || ((_b = this.inputData) === null || _b === void 0 ? void 0 : _b.subTitle)}>
+                    <h3 class="paging" ?active=${(_c = this.inputData) === null || _c === void 0 ? void 0 : _c.title}>${(_d = this.inputData) === null || _d === void 0 ? void 0 : _d.title}</h3>
+                    <p class="paging" ?active=${(_e = this.inputData) === null || _e === void 0 ? void 0 : _e.subTitle}>${(_f = this.inputData) === null || _f === void 0 ? void 0 : _f.subTitle}</p>
                 </header>
-                <div class="gauge-container">
-                    ${c(this.dataSets, (ds) => ds.label, (ds) => {
-            var _a;
-            return x `
-                            <div
-                                name="${(_a = ds.label) !== null && _a !== void 0 ? _a : ''}"
-                                class="chart"
-                                style="min-width: 600px; min-height: 400px; width: 600px; height: 400px;"
-                            ></div>
-                        `;
-        })}
-                </div>
+                <div class="gauge-container"></div>
             </div>
         `;
     }
 }
-WidgetGauge.styles = i$3 `
+WidgetGauge.styles = i$1 `
         :host {
             display: block;
             color: var(--re-text-color, #000);
@@ -1315,7 +1154,7 @@ __decorate([
 __decorate([
     r()
 ], WidgetGauge.prototype, "canvasList", void 0);
-window.customElements.define('widget-gauge-1.5.35', WidgetGauge);
+window.customElements.define('widget-gauge-1.6.3', WidgetGauge);
 
 export { WidgetGauge };
 //# sourceMappingURL=widget-gauge.js.map