@spectric/ui 0.0.4 → 0.0.6

package/dist/index.es.js

@@ -0,0 +1,4139 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const lt = globalThis, Xt = lt.ShadowRoot && (lt.ShadyCSS === void 0 || lt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Gt = Symbol(), fs = /* @__PURE__ */ new WeakMap();
+let Es = class {
+  constructor(r, o, i) {
+    if (this._$cssResult$ = !0, i !== Gt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = r, this.t = o;
+  }
+  get styleSheet() {
+    let r = this.o;
+    const o = this.t;
+    if (Xt && r === void 0) {
+      const i = o !== void 0 && o.length === 1;
+      i && (r = fs.get(o)), r === void 0 && ((this.o = r = new CSSStyleSheet()).replaceSync(this.cssText), i && fs.set(o, r));
+    }
+    return r;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+const Lo = (s) => new Es(typeof s == "string" ? s : s + "", void 0, Gt), K = (s, ...r) => {
+  const o = s.length === 1 ? s[0] : r.reduce((i, c, t) => i + ((p) => {
+    if (p._$cssResult$ === !0) return p.cssText;
+    if (typeof p == "number") return p;
+    throw Error("Value passed to 'css' function must be a 'css' function result: " + p + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
+  })(c) + s[t + 1], s[0]);
+  return new Es(o, s, Gt);
+}, No = (s, r) => {
+  if (Xt) s.adoptedStyleSheets = r.map((o) => o instanceof CSSStyleSheet ? o : o.styleSheet);
+  else for (const o of r) {
+    const i = document.createElement("style"), c = lt.litNonce;
+    c !== void 0 && i.setAttribute("nonce", c), i.textContent = o.cssText, s.appendChild(i);
+  }
+}, hs = Xt ? (s) => s : (s) => s instanceof CSSStyleSheet ? ((r) => {
+  let o = "";
+  for (const i of r.cssRules) o += i.cssText;
+  return Lo(o);
+})(s) : s;
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const { is: Do, defineProperty: jo, getOwnPropertyDescriptor: Ro, getOwnPropertyNames: Bo, getOwnPropertySymbols: Uo, getPrototypeOf: Mo } = Object, oe = globalThis, bs = oe.trustedTypes, zo = bs ? bs.emptyScript : "", zt = oe.reactiveElementPolyfillSupport, Ue = (s, r) => s, dt = { toAttribute(s, r) {
+  switch (r) {
+    case Boolean:
+      s = s ? zo : null;
+      break;
+    case Object:
+    case Array:
+      s = s == null ? s : JSON.stringify(s);
+  }
+  return s;
+}, fromAttribute(s, r) {
+  let o = s;
+  switch (r) {
+    case Boolean:
+      o = s !== null;
+      break;
+    case Number:
+      o = s === null ? null : Number(s);
+      break;
+    case Object:
+    case Array:
+      try {
+        o = JSON.parse(s);
+      } catch {
+        o = null;
+      }
+  }
+  return o;
+} }, Jt = (s, r) => !Do(s, r), gs = { attribute: !0, type: String, converter: dt, reflect: !1, hasChanged: Jt };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), oe.litPropertyMetadata ?? (oe.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+class ke extends HTMLElement {
+  static addInitializer(r) {
+    this._$Ei(), (this.l ?? (this.l = [])).push(r);
+  }
+  static get observedAttributes() {
+    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
+  }
+  static createProperty(r, o = gs) {
+    if (o.state && (o.attribute = !1), this._$Ei(), this.elementProperties.set(r, o), !o.noAccessor) {
+      const i = Symbol(), c = this.getPropertyDescriptor(r, i, o);
+      c !== void 0 && jo(this.prototype, r, c);
+    }
+  }
+  static getPropertyDescriptor(r, o, i) {
+    const { get: c, set: t } = Ro(this.prototype, r) ?? { get() {
+      return this[o];
+    }, set(p) {
+      this[o] = p;
+    } };
+    return { get() {
+      return c == null ? void 0 : c.call(this);
+    }, set(p) {
+      const b = c == null ? void 0 : c.call(this);
+      t.call(this, p), this.requestUpdate(r, b, i);
+    }, configurable: !0, enumerable: !0 };
+  }
+  static getPropertyOptions(r) {
+    return this.elementProperties.get(r) ?? gs;
+  }
+  static _$Ei() {
+    if (this.hasOwnProperty(Ue("elementProperties"))) return;
+    const r = Mo(this);
+    r.finalize(), r.l !== void 0 && (this.l = [...r.l]), this.elementProperties = new Map(r.elementProperties);
+  }
+  static finalize() {
+    if (this.hasOwnProperty(Ue("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(Ue("properties"))) {
+      const o = this.properties, i = [...Bo(o), ...Uo(o)];
+      for (const c of i) this.createProperty(c, o[c]);
+    }
+    const r = this[Symbol.metadata];
+    if (r !== null) {
+      const o = litPropertyMetadata.get(r);
+      if (o !== void 0) for (const [i, c] of o) this.elementProperties.set(i, c);
+    }
+    this._$Eh = /* @__PURE__ */ new Map();
+    for (const [o, i] of this.elementProperties) {
+      const c = this._$Eu(o, i);
+      c !== void 0 && this._$Eh.set(c, o);
+    }
+    this.elementStyles = this.finalizeStyles(this.styles);
+  }
+  static finalizeStyles(r) {
+    const o = [];
+    if (Array.isArray(r)) {
+      const i = new Set(r.flat(1 / 0).reverse());
+      for (const c of i) o.unshift(hs(c));
+    } else r !== void 0 && o.push(hs(r));
+    return o;
+  }
+  static _$Eu(r, o) {
+    const i = o.attribute;
+    return i === !1 ? void 0 : typeof i == "string" ? i : typeof r == "string" ? r.toLowerCase() : void 0;
+  }
+  constructor() {
+    super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
+  }
+  _$Ev() {
+    var r;
+    this._$ES = new Promise((o) => this.enableUpdating = o), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), (r = this.constructor.l) == null || r.forEach((o) => o(this));
+  }
+  addController(r) {
+    var o;
+    (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(r), this.renderRoot !== void 0 && this.isConnected && ((o = r.hostConnected) == null || o.call(r));
+  }
+  removeController(r) {
+    var o;
+    (o = this._$EO) == null || o.delete(r);
+  }
+  _$E_() {
+    const r = /* @__PURE__ */ new Map(), o = this.constructor.elementProperties;
+    for (const i of o.keys()) this.hasOwnProperty(i) && (r.set(i, this[i]), delete this[i]);
+    r.size > 0 && (this._$Ep = r);
+  }
+  createRenderRoot() {
+    const r = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+    return No(r, this.constructor.elementStyles), r;
+  }
+  connectedCallback() {
+    var r;
+    this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (r = this._$EO) == null || r.forEach((o) => {
+      var i;
+      return (i = o.hostConnected) == null ? void 0 : i.call(o);
+    });
+  }
+  enableUpdating(r) {
+  }
+  disconnectedCallback() {
+    var r;
+    (r = this._$EO) == null || r.forEach((o) => {
+      var i;
+      return (i = o.hostDisconnected) == null ? void 0 : i.call(o);
+    });
+  }
+  attributeChangedCallback(r, o, i) {
+    this._$AK(r, i);
+  }
+  _$EC(r, o) {
+    var t;
+    const i = this.constructor.elementProperties.get(r), c = this.constructor._$Eu(r, i);
+    if (c !== void 0 && i.reflect === !0) {
+      const p = (((t = i.converter) == null ? void 0 : t.toAttribute) !== void 0 ? i.converter : dt).toAttribute(o, i.type);
+      this._$Em = r, p == null ? this.removeAttribute(c) : this.setAttribute(c, p), this._$Em = null;
+    }
+  }
+  _$AK(r, o) {
+    var t;
+    const i = this.constructor, c = i._$Eh.get(r);
+    if (c !== void 0 && this._$Em !== c) {
+      const p = i.getPropertyOptions(c), b = typeof p.converter == "function" ? { fromAttribute: p.converter } : ((t = p.converter) == null ? void 0 : t.fromAttribute) !== void 0 ? p.converter : dt;
+      this._$Em = c, this[c] = b.fromAttribute(o, p.type), this._$Em = null;
+    }
+  }
+  requestUpdate(r, o, i) {
+    if (r !== void 0) {
+      if (i ?? (i = this.constructor.getPropertyOptions(r)), !(i.hasChanged ?? Jt)(this[r], o)) return;
+      this.P(r, o, i);
+    }
+    this.isUpdatePending === !1 && (this._$ES = this._$ET());
+  }
+  P(r, o, i) {
+    this._$AL.has(r) || this._$AL.set(r, o), i.reflect === !0 && this._$Em !== r && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(r);
+  }
+  async _$ET() {
+    this.isUpdatePending = !0;
+    try {
+      await this._$ES;
+    } catch (o) {
+      Promise.reject(o);
+    }
+    const r = this.scheduleUpdate();
+    return r != null && await r, !this.isUpdatePending;
+  }
+  scheduleUpdate() {
+    return this.performUpdate();
+  }
+  performUpdate() {
+    var i;
+    if (!this.isUpdatePending) return;
+    if (!this.hasUpdated) {
+      if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
+        for (const [t, p] of this._$Ep) this[t] = p;
+        this._$Ep = void 0;
+      }
+      const c = this.constructor.elementProperties;
+      if (c.size > 0) for (const [t, p] of c) p.wrapped !== !0 || this._$AL.has(t) || this[t] === void 0 || this.P(t, this[t], p);
+    }
+    let r = !1;
+    const o = this._$AL;
+    try {
+      r = this.shouldUpdate(o), r ? (this.willUpdate(o), (i = this._$EO) == null || i.forEach((c) => {
+        var t;
+        return (t = c.hostUpdate) == null ? void 0 : t.call(c);
+      }), this.update(o)) : this._$EU();
+    } catch (c) {
+      throw r = !1, this._$EU(), c;
+    }
+    r && this._$AE(o);
+  }
+  willUpdate(r) {
+  }
+  _$AE(r) {
+    var o;
+    (o = this._$EO) == null || o.forEach((i) => {
+      var c;
+      return (c = i.hostUpdated) == null ? void 0 : c.call(i);
+    }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(r)), this.updated(r);
+  }
+  _$EU() {
+    this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
+  }
+  get updateComplete() {
+    return this.getUpdateComplete();
+  }
+  getUpdateComplete() {
+    return this._$ES;
+  }
+  shouldUpdate(r) {
+    return !0;
+  }
+  update(r) {
+    this._$Ej && (this._$Ej = this._$Ej.forEach((o) => this._$EC(o, this[o]))), this._$EU();
+  }
+  updated(r) {
+  }
+  firstUpdated(r) {
+  }
+}
+ke.elementStyles = [], ke.shadowRootOptions = { mode: "open" }, ke[Ue("elementProperties")] = /* @__PURE__ */ new Map(), ke[Ue("finalized")] = /* @__PURE__ */ new Map(), zt == null || zt({ ReactiveElement: ke }), (oe.reactiveElementVersions ?? (oe.reactiveElementVersions = [])).push("2.0.4");
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Me = globalThis, ft = Me.trustedTypes, vs = ft ? ft.createPolicy("lit-html", { createHTML: (s) => s }) : void 0, Os = "$lit$", ie = `lit$${Math.random().toFixed(9).slice(2)}$`, Ts = "?" + ie, Fo = `<${Ts}>`, de = document, Fe = () => de.createComment(""), Qe = (s) => s === null || typeof s != "object" && typeof s != "function", Vt = Array.isArray, Qo = (s) => Vt(s) || typeof (s == null ? void 0 : s[Symbol.iterator]) == "function", Ft = `[ 	
+\f\r]`, Be = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, ys = /-->/g, ms = />/g, ue = RegExp(`>|${Ft}(?:([^\\s"'>=/]+)(${Ft}*=${Ft}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), $s = /'/g, _s = /"/g, Ps = /^(?:script|style|textarea|title)$/i, Io = (s) => (r, ...o) => ({ _$litType$: s, strings: r, values: o }), A = Io(1), fe = Symbol.for("lit-noChange"), C = Symbol.for("lit-nothing"), ws = /* @__PURE__ */ new WeakMap(), pe = de.createTreeWalker(de, 129);
+function Ls(s, r) {
+  if (!Vt(s) || !s.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return vs !== void 0 ? vs.createHTML(r) : r;
+}
+const Ho = (s, r) => {
+  const o = s.length - 1, i = [];
+  let c, t = r === 2 ? "<svg>" : r === 3 ? "<math>" : "", p = Be;
+  for (let b = 0; b < o; b++) {
+    const g = s[b];
+    let w, x, _ = -1, k = 0;
+    for (; k < g.length && (p.lastIndex = k, x = p.exec(g), x !== null); ) k = p.lastIndex, p === Be ? x[1] === "!--" ? p = ys : x[1] !== void 0 ? p = ms : x[2] !== void 0 ? (Ps.test(x[2]) && (c = RegExp("</" + x[2], "g")), p = ue) : x[3] !== void 0 && (p = ue) : p === ue ? x[0] === ">" ? (p = c ?? Be, _ = -1) : x[1] === void 0 ? _ = -2 : (_ = p.lastIndex - x[2].length, w = x[1], p = x[3] === void 0 ? ue : x[3] === '"' ? _s : $s) : p === _s || p === $s ? p = ue : p === ys || p === ms ? p = Be : (p = ue, c = void 0);
+    const S = p === ue && s[b + 1].startsWith("/>") ? " " : "";
+    t += p === Be ? g + Fo : _ >= 0 ? (i.push(w), g.slice(0, _) + Os + g.slice(_) + ie + S) : g + ie + (_ === -2 ? b : S);
+  }
+  return [Ls(s, t + (s[o] || "<?>") + (r === 2 ? "</svg>" : r === 3 ? "</math>" : "")), i];
+};
+class Ie {
+  constructor({ strings: r, _$litType$: o }, i) {
+    let c;
+    this.parts = [];
+    let t = 0, p = 0;
+    const b = r.length - 1, g = this.parts, [w, x] = Ho(r, o);
+    if (this.el = Ie.createElement(w, i), pe.currentNode = this.el.content, o === 2 || o === 3) {
+      const _ = this.el.content.firstChild;
+      _.replaceWith(..._.childNodes);
+    }
+    for (; (c = pe.nextNode()) !== null && g.length < b; ) {
+      if (c.nodeType === 1) {
+        if (c.hasAttributes()) for (const _ of c.getAttributeNames()) if (_.endsWith(Os)) {
+          const k = x[p++], S = c.getAttribute(_).split(ie), j = /([.?@])?(.*)/.exec(k);
+          g.push({ type: 1, index: t, name: j[2], strings: S, ctor: j[1] === "." ? Wo : j[1] === "?" ? Yo : j[1] === "@" ? Ko : yt }), c.removeAttribute(_);
+        } else _.startsWith(ie) && (g.push({ type: 6, index: t }), c.removeAttribute(_));
+        if (Ps.test(c.tagName)) {
+          const _ = c.textContent.split(ie), k = _.length - 1;
+          if (k > 0) {
+            c.textContent = ft ? ft.emptyScript : "";
+            for (let S = 0; S < k; S++) c.append(_[S], Fe()), pe.nextNode(), g.push({ type: 2, index: ++t });
+            c.append(_[k], Fe());
+          }
+        }
+      } else if (c.nodeType === 8) if (c.data === Ts) g.push({ type: 2, index: t });
+      else {
+        let _ = -1;
+        for (; (_ = c.data.indexOf(ie, _ + 1)) !== -1; ) g.push({ type: 7, index: t }), _ += ie.length - 1;
+      }
+      t++;
+    }
+  }
+  static createElement(r, o) {
+    const i = de.createElement("template");
+    return i.innerHTML = r, i;
+  }
+}
+function Ce(s, r, o = s, i) {
+  var p, b;
+  if (r === fe) return r;
+  let c = i !== void 0 ? (p = o._$Co) == null ? void 0 : p[i] : o._$Cl;
+  const t = Qe(r) ? void 0 : r._$litDirective$;
+  return (c == null ? void 0 : c.constructor) !== t && ((b = c == null ? void 0 : c._$AO) == null || b.call(c, !1), t === void 0 ? c = void 0 : (c = new t(s), c._$AT(s, o, i)), i !== void 0 ? (o._$Co ?? (o._$Co = []))[i] = c : o._$Cl = c), c !== void 0 && (r = Ce(s, c._$AS(s, r.values), c, i)), r;
+}
+class qo {
+  constructor(r, o) {
+    this._$AV = [], this._$AN = void 0, this._$AD = r, this._$AM = o;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(r) {
+    const { el: { content: o }, parts: i } = this._$AD, c = ((r == null ? void 0 : r.creationScope) ?? de).importNode(o, !0);
+    pe.currentNode = c;
+    let t = pe.nextNode(), p = 0, b = 0, g = i[0];
+    for (; g !== void 0; ) {
+      if (p === g.index) {
+        let w;
+        g.type === 2 ? w = new qe(t, t.nextSibling, this, r) : g.type === 1 ? w = new g.ctor(t, g.name, g.strings, this, r) : g.type === 6 && (w = new Zo(t, this, r)), this._$AV.push(w), g = i[++b];
+      }
+      p !== (g == null ? void 0 : g.index) && (t = pe.nextNode(), p++);
+    }
+    return pe.currentNode = de, c;
+  }
+  p(r) {
+    let o = 0;
+    for (const i of this._$AV) i !== void 0 && (i.strings !== void 0 ? (i._$AI(r, i, o), o += i.strings.length - 2) : i._$AI(r[o])), o++;
+  }
+}
+class qe {
+  get _$AU() {
+    var r;
+    return ((r = this._$AM) == null ? void 0 : r._$AU) ?? this._$Cv;
+  }
+  constructor(r, o, i, c) {
+    this.type = 2, this._$AH = C, this._$AN = void 0, this._$AA = r, this._$AB = o, this._$AM = i, this.options = c, this._$Cv = (c == null ? void 0 : c.isConnected) ?? !0;
+  }
+  get parentNode() {
+    let r = this._$AA.parentNode;
+    const o = this._$AM;
+    return o !== void 0 && (r == null ? void 0 : r.nodeType) === 11 && (r = o.parentNode), r;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(r, o = this) {
+    r = Ce(this, r, o), Qe(r) ? r === C || r == null || r === "" ? (this._$AH !== C && this._$AR(), this._$AH = C) : r !== this._$AH && r !== fe && this._(r) : r._$litType$ !== void 0 ? this.$(r) : r.nodeType !== void 0 ? this.T(r) : Qo(r) ? this.k(r) : this._(r);
+  }
+  O(r) {
+    return this._$AA.parentNode.insertBefore(r, this._$AB);
+  }
+  T(r) {
+    this._$AH !== r && (this._$AR(), this._$AH = this.O(r));
+  }
+  _(r) {
+    this._$AH !== C && Qe(this._$AH) ? this._$AA.nextSibling.data = r : this.T(de.createTextNode(r)), this._$AH = r;
+  }
+  $(r) {
+    var t;
+    const { values: o, _$litType$: i } = r, c = typeof i == "number" ? this._$AC(r) : (i.el === void 0 && (i.el = Ie.createElement(Ls(i.h, i.h[0]), this.options)), i);
+    if (((t = this._$AH) == null ? void 0 : t._$AD) === c) this._$AH.p(o);
+    else {
+      const p = new qo(c, this), b = p.u(this.options);
+      p.p(o), this.T(b), this._$AH = p;
+    }
+  }
+  _$AC(r) {
+    let o = ws.get(r.strings);
+    return o === void 0 && ws.set(r.strings, o = new Ie(r)), o;
+  }
+  k(r) {
+    Vt(this._$AH) || (this._$AH = [], this._$AR());
+    const o = this._$AH;
+    let i, c = 0;
+    for (const t of r) c === o.length ? o.push(i = new qe(this.O(Fe()), this.O(Fe()), this, this.options)) : i = o[c], i._$AI(t), c++;
+    c < o.length && (this._$AR(i && i._$AB.nextSibling, c), o.length = c);
+  }
+  _$AR(r = this._$AA.nextSibling, o) {
+    var i;
+    for ((i = this._$AP) == null ? void 0 : i.call(this, !1, !0, o); r && r !== this._$AB; ) {
+      const c = r.nextSibling;
+      r.remove(), r = c;
+    }
+  }
+  setConnected(r) {
+    var o;
+    this._$AM === void 0 && (this._$Cv = r, (o = this._$AP) == null || o.call(this, r));
+  }
+}
+class yt {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(r, o, i, c, t) {
+    this.type = 1, this._$AH = C, this._$AN = void 0, this.element = r, this.name = o, this._$AM = c, this.options = t, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = C;
+  }
+  _$AI(r, o = this, i, c) {
+    const t = this.strings;
+    let p = !1;
+    if (t === void 0) r = Ce(this, r, o, 0), p = !Qe(r) || r !== this._$AH && r !== fe, p && (this._$AH = r);
+    else {
+      const b = r;
+      let g, w;
+      for (r = t[0], g = 0; g < t.length - 1; g++) w = Ce(this, b[i + g], o, g), w === fe && (w = this._$AH[g]), p || (p = !Qe(w) || w !== this._$AH[g]), w === C ? r = C : r !== C && (r += (w ?? "") + t[g + 1]), this._$AH[g] = w;
+    }
+    p && !c && this.j(r);
+  }
+  j(r) {
+    r === C ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, r ?? "");
+  }
+}
+class Wo extends yt {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(r) {
+    this.element[this.name] = r === C ? void 0 : r;
+  }
+}
+class Yo extends yt {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(r) {
+    this.element.toggleAttribute(this.name, !!r && r !== C);
+  }
+}
+class Ko extends yt {
+  constructor(r, o, i, c, t) {
+    super(r, o, i, c, t), this.type = 5;
+  }
+  _$AI(r, o = this) {
+    if ((r = Ce(this, r, o, 0) ?? C) === fe) return;
+    const i = this._$AH, c = r === C && i !== C || r.capture !== i.capture || r.once !== i.once || r.passive !== i.passive, t = r !== C && (i === C || c);
+    c && this.element.removeEventListener(this.name, this, i), t && this.element.addEventListener(this.name, this, r), this._$AH = r;
+  }
+  handleEvent(r) {
+    var o;
+    typeof this._$AH == "function" ? this._$AH.call(((o = this.options) == null ? void 0 : o.host) ?? this.element, r) : this._$AH.handleEvent(r);
+  }
+}
+class Zo {
+  constructor(r, o, i) {
+    this.element = r, this.type = 6, this._$AN = void 0, this._$AM = o, this.options = i;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(r) {
+    Ce(this, r);
+  }
+}
+const Qt = Me.litHtmlPolyfillSupport;
+Qt == null || Qt(Ie, qe), (Me.litHtmlVersions ?? (Me.litHtmlVersions = [])).push("3.2.1");
+const Ns = (s, r, o) => {
+  const i = (o == null ? void 0 : o.renderBefore) ?? r;
+  let c = i._$litPart$;
+  if (c === void 0) {
+    const t = (o == null ? void 0 : o.renderBefore) ?? null;
+    i._$litPart$ = c = new qe(r.insertBefore(Fe(), t), t, void 0, o ?? {});
+  }
+  return c._$AI(s), c;
+};
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+let L = class extends ke {
+  constructor() {
+    super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
+  }
+  createRenderRoot() {
+    var o;
+    const r = super.createRenderRoot();
+    return (o = this.renderOptions).renderBefore ?? (o.renderBefore = r.firstChild), r;
+  }
+  update(r) {
+    const o = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(r), this._$Do = Ns(o, this.renderRoot, this.renderOptions);
+  }
+  connectedCallback() {
+    var r;
+    super.connectedCallback(), (r = this._$Do) == null || r.setConnected(!0);
+  }
+  disconnectedCallback() {
+    var r;
+    super.disconnectedCallback(), (r = this._$Do) == null || r.setConnected(!1);
+  }
+  render() {
+    return fe;
+  }
+};
+var Cs;
+L._$litElement$ = !0, L.finalized = !0, (Cs = globalThis.litElementHydrateSupport) == null || Cs.call(globalThis, { LitElement: L });
+const It = globalThis.litElementPolyfillSupport;
+It == null || It({ LitElement: L });
+(globalThis.litElementVersions ?? (globalThis.litElementVersions = [])).push("4.1.1");
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Ds = { ATTRIBUTE: 1, CHILD: 2, PROPERTY: 3, BOOLEAN_ATTRIBUTE: 4, EVENT: 5, ELEMENT: 6 }, er = (s) => (...r) => ({ _$litDirective$: s, values: r });
+let js = class {
+  constructor(r) {
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AT(r, o, i) {
+    this._$Ct = r, this._$AM = o, this._$Ci = i;
+  }
+  _$AS(r, o) {
+    return this.update(r, o);
+  }
+  update(r, o) {
+    return this.render(...o);
+  }
+};
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Rs = "important", Xo = " !" + Rs, Bs = er(class extends js {
+  constructor(s) {
+    var r;
+    if (super(s), s.type !== Ds.ATTRIBUTE || s.name !== "style" || ((r = s.strings) == null ? void 0 : r.length) > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
+  }
+  render(s) {
+    return Object.keys(s).reduce((r, o) => {
+      const i = s[o];
+      return i == null ? r : r + `${o = o.includes("-") ? o : o.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${i};`;
+    }, "");
+  }
+  update(s, [r]) {
+    const { style: o } = s.element;
+    if (this.ft === void 0) return this.ft = new Set(Object.keys(r)), this.render(r);
+    for (const i of this.ft) r[i] == null && (this.ft.delete(i), i.includes("-") ? o.removeProperty(i) : o[i] = null);
+    for (const i in r) {
+      const c = r[i];
+      if (c != null) {
+        this.ft.add(i);
+        const t = typeof c == "string" && c.endsWith(Xo);
+        i.includes("-") || t ? o.setProperty(i, t ? c.slice(0, -11) : c, t ? Rs : "") : o[i] = c;
+      }
+    }
+    return fe;
+  }
+}), Go = K`
+:host{
+    display: inline-block;
+    --text-on-color: var(--spectric-text-on-color, #ffffff);
+    --text-on-color-disabled: var(--spectric-text-on-color-disabled, #8d8d8d);
+    --text-placeholder: var(--spectric-text-placeholder, rgba(22, 22, 22, 0.4));
+    --text-primary: var(--spectric-text-primary, #161616);
+    --text-secondary: var(--spectric-text-secondary, #525252);
+    --button-border-radius: var(--spectric-border-radius,.4em);
+    --button-separator: var(--spectric-button-separator, #e0e0e0);
+    --button-primary:  var(--spectric-button-primary,#1ea7fd);
+    --button-secondary: var(--spectric-button-secondary, #77878b);
+    --button-tertiary: var(--spectric-button-tertiary, #0f62fe);
+    --button-danger-primary: var(--spectric-button-danger-primary, #da1e28);
+    --button-danger-secondary: var(--spectric-button-danger-secondary, #da1e28);
+    --button-danger-active: var(--spectric-button-danger-active, #750e13);
+    --button-primary-active: var(--spectric-button-primary-active, #002d9c);
+    --button-secondary-active: var(--spectric-button-secondary-active, #6f6f6f);
+    --button-tertiary-active: var(--spectric-button-tertiary-active, #002d9c);
+    --button-danger-hover: var(--spectric-button-danger-hover, #b81921);
+    --button-primary-hover: var(--spectric-button-primary-hover, #0050e6);
+    --button-secondary-hover: var(--spectric-button-secondary-hover, #474747);
+    --button-tertiary-hover: var(--spectric-button-tertiary-hover, #0050e6);
+    --button-disabled: var(--spectric-button-disabled, #c6c6c6);
+}
+:host([disabled]) { pointer-events: none }
+
+.spectric-button {
+  pointer-events:none;
+  position: relative;
+  display: inline-block;
+  cursor: pointer;
+  border: 0;
+  border-radius: var(--button-border-radius);
+  font-weight: 700;
+  line-height: 2em;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  overflow:hidden;
+}
+.animation{
+  pointer-events: none;
+  transition: background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1);
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+.animation::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0 /* rtl:ignore */;
+    width: 100%;
+    height: 100%;
+}
+:host(:active) .animation::after {
+  box-shadow: 0 0 0 0 black;
+  position: absolute;
+  opacity: 1;
+  transition: 0s;
+}
+.animation::after{
+  content: "";
+  display: block;
+  position: absolute;
+  border-radius: var(--border-radius);
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+  transition: all .5s;
+  box-shadow: 0 0 30px black inset;
+}
+.spectric-button.spectric-button--secondary .animation::after , .spectric-button.spectric-button--text .animation::after {
+    box-shadow: 0 0 30px white inset;
+}
+
+.spectric-button:disabled{
+  cursor: not-allowed;
+  pointer-events: none;
+  filter: contrast(0.5);
+  /* background-color:var(--button-disabled); */
+  color:var(--text-on-color-disabled);
+}
+.spectric-button:disabled .animation , :host(:disabled:hover) .animation{
+background-color: rgba(0, 0, 0, 0);
+opacity:1
+}
+.spectric-button-danger--true:hover{
+  background-color:var(--button-danger-hover);
+}
+.spectric-button--primary.spectric-button-danger--true {
+  background-color:var(--button-danger-primary);
+  box-shadow:none;
+}
+.spectric-button--secondary.spectric-button-danger--true {
+  color: var(--text-on-color);
+  background-color:color-mix(in srgb, var(--button-danger-primary) 70%, transparent);
+  box-shadow:none;
+}
+.spectric-button--text.spectric-button-danger--true {
+  color:var(--button-danger-primary);
+
+}
+:host(:hover) .spectric-button--text.spectric-button-danger--true {
+  background-color:var(--button-danger-primary);
+  color:var(--text-on-color)
+}
+:host(:hover) .animation{
+  background: currentColor;
+  opacity: 0.15;
+}
+.spectric-button--primary {
+  box-shadow: color-mix(in srgb, var(--button-primary) 50%, transparent) 0px 0px 0px 1px inset;
+  background-color: var(--button-primary);
+  color: var(--text-on-color);
+}
+:host > .spectric-button--primary:focus {
+  outline-color: var(--button-secondary);
+  outline-width: thin;
+  outline-style: solid;
+}
+:host > .spectric-button--secondary:focus {
+  outline-color: var(--button-primary);
+  outline-width: thin;
+  outline-style: solid;
+}
+:host > .spectric-button--text:focus {
+  outline-color: var(--button-primary);
+  outline-width: thin;
+  outline-style: solid;
+}
+/* :host([variant="text"]):focus-within:focus,button:focus, button:focus-within, button:focus-visible{
+  outline-color: red;
+} */
+.spectric-button--secondary {
+  background-color:transparent;
+  box-shadow: var(--button-secondary) 0px 0px 0px 1px inset;
+  color: var(--button-secondary);
+}
+.spectric-button--text {
+  background-color: transparent;
+  color: var(--text-secondary);
+}
+.spectric-button--small {
+  padding: 5px 10px;
+  font-size: 12px;
+}
+.spectric-button--medium {
+  padding: 6px 17px;
+  font-size: 14px;
+}
+.spectric-button--large {
+  padding: 7px 24px;
+  font-size: 16px;
+}
+`;
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const I = (s) => (r, o) => {
+  o !== void 0 ? o.addInitializer(() => {
+    customElements.define(s, r);
+  }) : customElements.define(s, r);
+};
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Jo = { attribute: !0, type: String, converter: dt, reflect: !1, hasChanged: Jt }, Vo = (s = Jo, r, o) => {
+  const { kind: i, metadata: c } = o;
+  let t = globalThis.litPropertyMetadata.get(c);
+  if (t === void 0 && globalThis.litPropertyMetadata.set(c, t = /* @__PURE__ */ new Map()), t.set(o.name, s), i === "accessor") {
+    const { name: p } = o;
+    return { set(b) {
+      const g = r.get.call(this);
+      r.set.call(this, b), this.requestUpdate(p, g, s);
+    }, init(b) {
+      return b !== void 0 && this.P(p, void 0, s), b;
+    } };
+  }
+  if (i === "setter") {
+    const { name: p } = o;
+    return function(b) {
+      const g = this[p];
+      r.call(this, b), this.requestUpdate(p, g, s);
+    };
+  }
+  throw Error("Unsupported decorator location: " + i);
+};
+function v(s) {
+  return (r, o) => typeof o == "object" ? Vo(s, r, o) : ((i, c, t) => {
+    const p = c.hasOwnProperty(t);
+    return c.constructor.createProperty(t, p ? { ...i, wrapped: !0 } : i), p ? Object.getOwnPropertyDescriptor(c, t) : void 0;
+  })(s, r, o);
+}
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function mt(s) {
+  return v({ ...s, state: !0, attribute: !1 });
+}
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Us = (s, r, o) => (o.configurable = !0, o.enumerable = !0, Reflect.decorate && typeof r != "object" && Object.defineProperty(s, r, o), o);
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function We(s, r) {
+  return (o, i, c) => {
+    const t = (p) => {
+      var b;
+      return ((b = p.renderRoot) == null ? void 0 : b.querySelector(s)) ?? null;
+    };
+    return Us(o, i, { get() {
+      return t(this);
+    } });
+  };
+}
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function $t(s) {
+  return (r, o) => Us(r, o, { async get() {
+    var i;
+    return await this.updateComplete, ((i = this.renderRoot) == null ? void 0 : i.querySelector(s)) ?? null;
+  } });
+}
+var en = Object.defineProperty, tn = Object.getOwnPropertyDescriptor, ge = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? tn(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && en(r, o, c), c;
+}, rn = /* @__PURE__ */ ((s) => (s.large = "large", s.medium = "medium", s.small = "small", s))(rn || {}), sn = /* @__PURE__ */ ((s) => (s.primary = "primary", s.secondary = "secondary", s.text = "text", s))(sn || {});
+const on = {
+  primary: "spectric-button--primary",
+  secondary: "spectric-button--secondary",
+  text: "spectric-button--text"
+};
+let J = class extends L {
+  constructor() {
+    super(...arguments), this.variant = "primary", this.disabled = !1, this.size = "large", this.label = "", this.danger = !1, this._onClick = (s) => {
+      if (s instanceof CustomEvent)
+        return;
+      s.preventDefault(), s.stopImmediatePropagation(), s.stopPropagation();
+      const r = {
+        bubbles: !0,
+        composed: !0,
+        detail: s
+      };
+      this.dispatchEvent(new CustomEvent("click", r));
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.addEventListener("click", this._onClick);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.removeEventListener("click", this._onClick);
+  }
+  render() {
+    const s = on[this.variant] || "spectric-button--primary";
+    return A`
+      <button
+        type="button"
+        ?disabled=${this.disabled}
+        class=${["spectric-button", `spectric-button-danger--${this.danger || !1}`, `spectric-button--${this.size || "medium"}`, s].join(" ")}
+        style=${Bs({ backgroundColor: this.backgroundColor })}
+      >
+      <span class="animation"></span>
+      <slot>${this.label}</slot>
+      </button>
+    `;
+  }
+};
+J.styles = Go;
+ge([
+  v({ type: String, reflect: !0 })
+], J.prototype, "variant", 2);
+ge([
+  v({ type: Boolean, reflect: !0 })
+], J.prototype, "disabled", 2);
+ge([
+  v({ type: String, reflect: !0 })
+], J.prototype, "backgroundColor", 2);
+ge([
+  v({ type: String, reflect: !0 })
+], J.prototype, "size", 2);
+ge([
+  v({ type: String, reflect: !0 })
+], J.prototype, "label", 2);
+ge([
+  v({ type: Boolean, reflect: !0 })
+], J.prototype, "danger", 2);
+J = ge([
+  I("spectric-button")
+], J);
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const nn = (s) => s.strings === void 0;
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const ze = (s, r) => {
+  var i;
+  const o = s._$AN;
+  if (o === void 0) return !1;
+  for (const c of o) (i = c._$AO) == null || i.call(c, r, !1), ze(c, r);
+  return !0;
+}, ht = (s) => {
+  let r, o;
+  do {
+    if ((r = s._$AM) === void 0) break;
+    o = r._$AN, o.delete(s), s = r;
+  } while ((o == null ? void 0 : o.size) === 0);
+}, Ms = (s) => {
+  for (let r; r = s._$AM; s = r) {
+    let o = r._$AN;
+    if (o === void 0) r._$AN = o = /* @__PURE__ */ new Set();
+    else if (o.has(s)) break;
+    o.add(s), ln(r);
+  }
+};
+function an(s) {
+  this._$AN !== void 0 ? (ht(this), this._$AM = s, Ms(this)) : this._$AM = s;
+}
+function cn(s, r = !1, o = 0) {
+  const i = this._$AH, c = this._$AN;
+  if (c !== void 0 && c.size !== 0) if (r) if (Array.isArray(i)) for (let t = o; t < i.length; t++) ze(i[t], !1), ht(i[t]);
+  else i != null && (ze(i, !1), ht(i));
+  else ze(this, s);
+}
+const ln = (s) => {
+  s.type == Ds.CHILD && (s._$AP ?? (s._$AP = cn), s._$AQ ?? (s._$AQ = an));
+};
+class zs extends js {
+  constructor() {
+    super(...arguments), this._$AN = void 0;
+  }
+  _$AT(r, o, i) {
+    super._$AT(r, o, i), Ms(this), this.isConnected = r._$AU;
+  }
+  _$AO(r, o = !0) {
+    var i, c;
+    r !== this.isConnected && (this.isConnected = r, r ? (i = this.reconnected) == null || i.call(this) : (c = this.disconnected) == null || c.call(this)), o && (ze(this, r), ht(this));
+  }
+  setValue(r) {
+    if (nn(this._$Ct)) this._$Ct._$AI(r, this);
+    else {
+      const o = [...this._$Ct._$AH];
+      o[this._$Ci] = r, this._$Ct._$AI(o, this, 0);
+    }
+  }
+  disconnected() {
+  }
+  reconnected() {
+  }
+}
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const ut = () => new un();
+class un {
+}
+const Ht = /* @__PURE__ */ new WeakMap(), pt = er(class extends zs {
+  render(s) {
+    return C;
+  }
+  update(s, [r]) {
+    var i;
+    const o = r !== this.Y;
+    return o && this.Y !== void 0 && this.rt(void 0), (o || this.lt !== this.ct) && (this.Y = r, this.ht = (i = s.options) == null ? void 0 : i.host, this.rt(this.ct = s.element)), C;
+  }
+  rt(s) {
+    if (this.isConnected || (s = void 0), typeof this.Y == "function") {
+      const r = this.ht ?? globalThis;
+      let o = Ht.get(r);
+      o === void 0 && (o = /* @__PURE__ */ new WeakMap(), Ht.set(r, o)), o.get(this.Y) !== void 0 && this.Y.call(this.ht, void 0), o.set(this.Y, s), s !== void 0 && this.Y.call(this.ht, s);
+    } else this.Y.value = s;
+  }
+  get lt() {
+    var s, r;
+    return typeof this.Y == "function" ? (s = Ht.get(this.ht ?? globalThis)) == null ? void 0 : s.get(this.Y) : (r = this.Y) == null ? void 0 : r.value;
+  }
+  disconnected() {
+    this.lt === this.ct && this.rt(void 0);
+  }
+  reconnected() {
+    this.rt(this.ct);
+  }
+}), pn = class {
+  constructor(r) {
+    return this.buffer = r, this.u8 = new Uint8Array(r), new Proxy(this, {
+      get(o, i) {
+        return o[i] ? o[i] : o.getBit(i);
+      }
+    });
+  }
+  getBit(r) {
+    var o = this.u8[r >> 3], i = r & 7;
+    return o >> 7 - i & 1;
+  }
+  setBit(r, o) {
+    var i = r & 7;
+    o ? this.u8[r >> 3] |= 128 >> i : this.u8[r >> 3] &= ~(128 >> i);
+  }
+  get length() {
+    return this.u8.byteLength * 8;
+  }
+  set(r, o) {
+    for (let i = o || 0, c = 0, t = r.length; c < t; i++, c++)
+      this.setBit(i, r[c]);
+  }
+  subarray(r, o) {
+    let i = [];
+    r = r || 0, o = o || this.length, o = o > this.length ? this.length : o;
+    for (let c = r; c < o; c++)
+      i.push(this.getBit(c));
+    return i;
+  }
+};
+class xs {
+  constructor(r, o, i, c) {
+    this.__target = r, this._handler = i, this._type = o, this._handler = i, this._options = c || !1, r instanceof Promise ? r.then((t) => {
+      this._handler && (this._node = t, this._node.addEventListener(this._type, this._handler, this._options));
+    }) : (this._node = r, this._node.addEventListener(this._type, this._handler, this._options));
+  }
+  dispose() {
+    this._handler && (this._node && (console.log(`removing event ${this._type} from `, this._node, this.__target instanceof Promise), this._node.removeEventListener(this._type, this._handler, this._options)), this.__target = void 0, this._node = void 0, this._handler = void 0);
+  }
+}
+class Fs extends L {
+  constructor() {
+    super(...arguments), this._disposables = /* @__PURE__ */ new Set(), this._isDisposed = !1, this._disposableListeners = [], this._connected = !1;
+  }
+  addDisposableListener(r, o, i) {
+    if (this._disposableListeners.find((t) => t.event === o && t.target === r && t.handler === i)) {
+      console.warn("Event handler already exists best practice is to add the this in the constructor");
+      return;
+    }
+    this._disposableListeners.push({ target: r, event: o, handler: i }), this._connected && this.registerDisposable(new xs(r, o, i));
+  }
+  registerDisposable(r) {
+    if (!r)
+      return r;
+    if (r === this)
+      throw new Error("Cannot register a disposable on itself!");
+    return this._isDisposed ? console.warn(new Error("Trying to add a disposable to something that has already been disposed of. The added object will be leaked!").stack) : this._disposables.add(r), r;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._connected = !0, this._isDisposed = !1, this._disposableListeners.forEach(({ target: r, event: o, handler: i }) => {
+      this.registerDisposable(new xs(r, o, i));
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._connected = !1, this._disposables.forEach((r) => {
+      r.dispose();
+    }), this._isDisposed = !0;
+  }
+}
+const Qs = (s) => {
+  var r;
+  return (...o) => {
+    r && cancelAnimationFrame(r), r = requestAnimationFrame(() => {
+      s.apply(void 0, o);
+    });
+  };
+};
+var dn = Object.defineProperty, fn = Object.getOwnPropertyDescriptor, ve = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? fn(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && dn(r, o, c), c;
+};
+const hn = ["mousemove", "click", "dblclick", "mousedown", "mouseup", "contextmenu"], at = { width: 200, height: 200 }, bt = { width: 10, height: 10 };
+let V = class extends Fs {
+  constructor() {
+    super(), this.arrayBuffer = new ArrayBuffer(0), this.frameWidth = 100, this.scale = 1, this.width = 200, this.height = 200, this.state = {}, this.yStart = 0, this.xStart = 0, this.refs = {
+      viewport: ut(),
+      canvas: ut(),
+      scrollDiv: ut()
+    }, this.color = "#000000", this.onThemeChange = () => {
+      let o = getComputedStyle(this);
+      this.color != o.color && (this.color = o.color, this.paint());
+    }, this.onResize = () => {
+      this.calculateViewport();
+    }, this.handleScroll = () => {
+      if (!this.refs.viewport.value)
+        return;
+      const o = this.getPxPerBit();
+      this.yStart = this.refs.viewport.value.scrollTop ? Math.floor(this.refs.viewport.value.scrollTop / o) + 1 : 0, this.xStart = this.refs.viewport.value.scrollLeft ? Math.floor(this.refs.viewport.value.scrollLeft / o) + 1 : 0, this.paint();
+    };
+    let s = new ResizeObserver(this.onResize);
+    s.dispose = () => {
+      this.resizeObserver.disconnect();
+    }, this.resizeObserver = s, this.addDisposableListener(document.body, "theme-change", this.onThemeChange);
+    var r = {};
+    hn.forEach((o) => {
+      this.addDisposableListener(this._canvas, o, Qs(async (i) => {
+        i.stopImmediatePropagation(), i.stopPropagation(), i.preventDefault();
+        var c = await this._canvas;
+        let t = c.getBoundingClientRect(), p = {
+          x: Math.floor(Math.abs(i.clientX - t.left)),
+          y: Math.floor(Math.abs(i.clientY - t.top))
+        }, b = this.canvasPositionToBit(p);
+        if (o === "mousemove" && r[o] == b)
+          return;
+        r[o] = b;
+        let g = "bit" + String(o).charAt(0).toUpperCase() + String(o).slice(1);
+        if (b != -1) {
+          let w = new CustomEvent(g, {
+            detail: { bitIndex: b, position: p, nativeEvent: i }
+          });
+          this.dispatchEvent(w);
+        }
+      }));
+    });
+  }
+  connectedCallback() {
+    this.onResize(), super.connectedCallback(), this.registerDisposable(this.resizeObserver), this.resizeObserver.observe(this);
+  }
+  updated(s) {
+    s.has("arrayBuffer") && this.arrayBuffer && (this._bitArray = new pn(this.arrayBuffer));
+    const r = ["arrayBuffer", "scale", "frameWidth", "width", "height"];
+    for (const o of r)
+      if (s.has(o)) {
+        this.paint();
+        return;
+      }
+  }
+  canvasPositionToBit(s) {
+    let r = Math.floor(s.x / this.scale), o = Math.floor(s.y / this.scale);
+    return r > this.frameWidth - 1 ? -1 : this.yStart * this.frameWidth + this.xStart + (o * this.frameWidth + r);
+  }
+  paint() {
+    if (!this.refs.canvas.value || !this._bitArray)
+      return;
+    const { frameWidth: s, _bitArray: r } = this;
+    if (s <= 0)
+      return;
+    this.calculateViewport();
+    const { width: o = at.width, height: i = at.height } = this, c = this.getPxPerBit(), t = this.refs.canvas.value.getContext("2d");
+    if (!t)
+      return;
+    this.state.scale != c && (t.reset(), t.scale(c, c));
+    let p = getComputedStyle(this);
+    t.fillStyle = p.color, t.clearRect(0, 0, o, i);
+    let b = 0;
+    for (let g = this.yStart * s + this.xStart, w = r.length; g < w; g++) {
+      let x = g % s - this.xStart;
+      if (!(x < 0)) {
+        if (Math.floor(x * c) > o) {
+          b++, g = b * s + this.yStart * s + this.xStart - 1;
+          continue;
+        }
+        if (Math.floor(b * c) > i)
+          break;
+        r.getBit(g) === 1 && t.fillRect(x, b, 1, 1), (g + 1) % s === 0 && g >= s - 1 && b++;
+      }
+    }
+  }
+  getPxPerBit() {
+    return this.scale > 0 ? this.scale : 1;
+  }
+  calculateViewport() {
+    const { frameWidth: s, _bitArray: r } = this;
+    if (this.refs.scrollDiv.value) {
+      var o = this.getPxPerBit();
+      const i = r.length / s * o, c = s * o, t = this.refs.scrollDiv.value;
+      t.style.width = c + "px", t.style.height = i + "px";
+    }
+  }
+  render() {
+    const { height: s = at.height, width: r = at.width } = this;
+    return A`
+          <div
+            id="viewport"
+            ${pt(this.refs.viewport)}
+            @scroll=${this.handleScroll}
+            style=${`width:${r}px;height:${s}px;overflow:auto;position:relative`}
+          >
+            <div
+              id="fakescrolldiv"
+              ${pt(this.refs.scrollDiv)}
+            >
+          </div>
+            </div>
+            <canvas
+            ${pt(this.refs.canvas)}
+            width=${r - bt.width}
+            height=${s - bt.height}
+          ></canvas>
+`;
+  }
+};
+V.styles = K`
+    :host{
+        position: relative;
+        --border-radius: var(--spectric-border-radius,4em);
+        --scroll-color: var(--spectric-background-inverse,#393939);
+        --background-color: var(--spectric-background, #ffffff);
+    }
+    #viewport{
+        overflow: scroll;
+        position: absolute;
+    }
+    #fakescrolldiv {
+        position: relative;
+        overflow-x: hidden;
+        overflow-y: hidden;
+        z-index:-1;
+    }
+    canvas{
+        position: absolute;
+        left:0;
+        top:0;
+        background-color:var(--background-color);
+    }
+    ::-webkit-scrollbar {
+    height: ${bt.height}px;
+    width: ${bt.width}px;
+
+}
+
+/* Webkit psudo elements don't pick up variables defined by the host */
+::-webkit-scrollbar-thumb {
+    background: var(--spectric-background-inverse,#393939);
+    border-radius: var(--spectric-border-radius,4em);
+    -webkit-border-radius: var(--spectric-border-radius,4em);
+    padding-top: 1px;
+    padding-bottom: 1px;
+    box-shadow: 0 0 1px  var(--spectric-primary,#242424) inset;
+}
+::-webkit-scrollbar-thumb:hover {
+    background: var(--spectric-primary,#009eb3); 
+}
+::-webkit-scrollbar-corner {
+    background: var(--spectric-background, #ffffff);
+}
+/* Buttons */
+
+::-webkit-scrollbar-button:single-button {
+  background-color: transparent;
+  display: block;
+  border-style: solid;
+}/* Up */
+::-webkit-scrollbar-button:single-button:vertical:decrement {
+  border-width: 0 5px 5px 5px;
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff);
+}
+::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff);
+}
+/* Down */
+::-webkit-scrollbar-button:single-button:vertical:increment {
+  border-width: 5px 5px 0 5px;
+  border-color: var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+::-webkit-scrollbar-button:vertical:single-button:increment:hover {
+  border-color: var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+/* Left */
+::-webkit-scrollbar-button:single-button:horizontal:decrement {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+
+
+/* Right */
+::-webkit-scrollbar-button:single-button:horizontal:increment {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:increment:hover {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3);
+
+}
+
+    `;
+ve([
+  v({ type: Object, attribute: !1 })
+], V.prototype, "arrayBuffer", 2);
+ve([
+  v({ type: Number })
+], V.prototype, "frameWidth", 2);
+ve([
+  v({ type: Number })
+], V.prototype, "scale", 2);
+ve([
+  v({ type: Number })
+], V.prototype, "width", 2);
+ve([
+  v({ type: Number })
+], V.prototype, "height", 2);
+ve([
+  $t("canvas")
+], V.prototype, "_canvas", 2);
+V = ve([
+  I("spectric-bit-display")
+], V);
+const bn = K`.spectric-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  padding: 15px 20px;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+.spectric-header svg {
+  display: inline-block;
+  vertical-align: top;
+}
+.spectric-header slot {
+  display: inline-block;
+  vertical-align: middle;
+}
+.spectric-header h1 {
+  display: inline-block;
+  vertical-align: middle;
+  margin: 6px 0 6px 10px;
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1;
+}
+
+.spectric-header button + button {
+  margin-left: 10px;
+}
+
+.spectric-header .welcome {
+  margin-right: 10px;
+  color: #333;
+  font-size: 14px;
+}
+`;
+var gn = Object.defineProperty, vn = Object.getOwnPropertyDescriptor, _t = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? vn(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && gn(r, o, c), c;
+};
+let Ee = class extends L {
+  constructor() {
+    super(...arguments), this.showCreateAccount = !1, this.showLoginButton = !1, this.username = "", this.onLogout = () => {
+      const s = {
+        bubbles: !0,
+        composed: !0
+      };
+      this.dispatchEvent(new CustomEvent("logout", s));
+    }, this.onLogin = () => {
+      const s = {
+        bubbles: !0,
+        composed: !0
+      };
+      this.dispatchEvent(new CustomEvent("login", s));
+    }, this.onCreateAccount = () => {
+      const s = {
+        bubbles: !0,
+        composed: !0
+      };
+      this.dispatchEvent(new CustomEvent("createAccount", s));
+    };
+  }
+  render() {
+    return A`
+    <header>
+      <div class="spectric-header">
+        <div style="flex-grow:1;">
+          <slot name="branding"></slot>
+          <h1><slot name="name"></slot></h1>
+          <slot name="center"></slot>
+        </div>
+        ${this.showLoginButton !== !1 ? A`
+        <div>
+          ${this.username && this.username !== "" ? A`<spectric-button variant="secondary" size="small" @click=${this.onLogout}>Log out</spectric-button>` : A`
+        ${this.showCreateAccount !== !1 ? A`<spectric-button variant="text" size="small" @click=${this.onCreateAccount}>Sign up</spectric-button>` : null}
+        <spectric-button variant="primary" size="small" @click=${this.onLogin}>Log in</spectric-button>`}
+           
+  
+        </div>` : null}
+        <slot name="end"></slot>
+      </div>
+    </header>
+  `;
+  }
+};
+Ee.styles = bn;
+_t([
+  v({ type: Boolean, reflect: !0 })
+], Ee.prototype, "showCreateAccount", 2);
+_t([
+  v({ type: Boolean, reflect: !0 })
+], Ee.prototype, "showLoginButton", 2);
+_t([
+  v({ type: String, reflect: !0 })
+], Ee.prototype, "username", 2);
+Ee = _t([
+  I("spectric-header")
+], Ee);
+var yn = Object.defineProperty, mn = Object.getOwnPropertyDescriptor, Te = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? mn(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && yn(r, o, c), c;
+};
+const $n = {
+  display: "flex",
+  alignItems: "center",
+  backgroundColor: "black",
+  color: "white",
+  textAlign: "center"
+};
+let he = class extends L {
+  constructor() {
+    super(...arguments), this.dismissable = !1, this.text = "", this.bannerId = "", this.headerStyle = {}, this._dismissed = !1, this.onDismiss = (s) => {
+      s.preventDefault(), s.stopPropagation();
+      const r = {
+        bubbles: !0,
+        composed: !0
+      };
+      this._dismissed = !0;
+      let { bannerId: o, text: i, headerStyle: c, dismissable: t } = this;
+      this.dispatchEvent(new CustomEvent("bannerDismissed", {
+        detail: { bannerId: o, text: i, headerStyle: c, dismissable: t },
+        ...r
+      }));
+    };
+  }
+  render() {
+    if (!this._dismissed)
+      return A`
+        <header style=${Bs({ ...$n, ...this.headerStyle })}>
+        <div style="flex-grow:1"><slot name="text">${this.text}</slot><slot></slot></div>
+        ${this.dismissable ? A`<spectric-button size="small" @click=${this.onDismiss}>X</spectric-button>` : null}
+        </header>
+    `;
+  }
+};
+Te([
+  v({ type: Boolean, reflect: !0 })
+], he.prototype, "dismissable", 2);
+Te([
+  v({ type: String, reflect: !0 })
+], he.prototype, "text", 2);
+Te([
+  v({ type: String, reflect: !0 })
+], he.prototype, "bannerId", 2);
+Te([
+  v({ type: Object })
+], he.prototype, "headerStyle", 2);
+Te([
+  v({ state: !0, type: Boolean, attribute: !1 })
+], he.prototype, "_dismissed", 2);
+he = Te([
+  I("spectric-banner")
+], he);
+const _n = K`
+
+:host {
+  height:100vh;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  font-size: 14px;
+  line-height: 24px;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    --spectric-background: var(--background,#ffffff);
+    --spectric-background-hover:var(--background-hover,rgba(141, 141, 141, 0.12));
+    --spectric-background-inverse: var(--background-inverse,#f4f4f4);
+    --spectric-background-inverse-hover: var(--background-inverse-hover,#474747);
+    --spectric-border-radius: var(--border-radius,.4em);
+    --spectric-primary:var(--primary,#1ea7fd);
+    --spectric-secondary: var(--secondary,#77878b);
+    --spectric-tertiary: var(--tertiary,#0f62fe);
+    --spectric-disabled: var(--disabled,#c6c6c6);
+
+    /* panel */
+    --panel-color:var(--spectric-background-inverse);
+    --panel-color-inverse:var(--spectric-background);
+    --spectric-border-disabled: var(--disabled);
+
+    /*inputs*/
+    --spectric-input-color: var(--panel-color-inverse);
+    --spectric-input-bottom: var(--panel-color);
+
+    --spectric-text-on-color: var(--text-on-color,#ffffff);
+    --spectric-text-on-color-disabled: var(--text-on-color-disabled,#8d8d8d);
+    --spectric-text-placeholder: var(--text-placeholder,rgba(22, 22, 22, 0.4));
+    --spectric-text-primary: var(--text-primary,#161616);
+    --spectric-text-secondary: var(--text-secondary,#525252);
+    /* Buttons */
+    --spectric-button-separator: #e0e0e0;
+    --spectric-button-primary: var(--primary,#1ea7fd);
+    --spectric-button-secondary: var(--secondary,#77878b);
+    --spectric-button-tertiary: var(--tertiary);
+    --spectric-button-danger-primary: #da1e28;
+    --spectric-button-danger-secondary: #da1e28;
+    --spectric-button-danger-active: #750e13;
+    --spectric-button-primary-active: #002d9c;
+    --spectric-button-secondary-active: #6f6f6f;
+    --spectric-button-tertiary-active: #002d9c;
+    --spectric-button-danger-hover: #b81921;
+    --spectric-button-primary-hover: #0050e6;
+    --spectric-button-secondary-hover: #474747;
+    --spectric-button-tertiary-hover: #0050e6;
+    --spectric-text-on-color-disabled: var(--disabled,#c6c6c6)
+    --spectric-button-disabled: #c6c6c6;
+}
+*{
+  color: var(--spectric-text-primary);
+  background-color: var(--spectric-background,rgb(255 255 255 / 60%));
+}
+article{
+  flex-grow:1;
+  overflow-y:auto;
+  padding-left: calc(var(--spectric-border-radius, 0.4em) + 2px);
+  padding-right: calc(var(--spectric-border-radius, 0.4em) + 2px);
+}
+ h2 {
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 0 4px;
+  font-weight: 700;
+  font-size: 32px;
+  line-height: 1;
+}
+
+ p {
+  margin: 1em 0;
+}
+
+ a {
+  color: var(--primary);
+  text-decoration: var(--primary);
+}
+
+ ul {
+  margin: 1em 0;
+  padding-left: 30px;
+}
+
+ li {
+  margin-bottom: 8px;
+}
+::-webkit-scrollbar {
+        width: 10px;
+    }
+
+    ::-webkit-scrollbar-thumb {
+    background: var(--spectric-background-inverse,#393939);
+    border-radius: var(--spectric-border-radius,4em);
+    -webkit-border-radius: var(--spectric-border-radius,4em);
+    padding-top: 1px;
+    padding-bottom: 1px;
+    box-shadow: 0 0 1px  var(--spectric-primary,#242424) inset;
+}
+::-webkit-scrollbar-thumb:hover {
+    background: var(--spectric-primary,#009eb3); 
+}
+
+
+    ::-webkit-scrollbar-button:single-button {
+  background-color: transparent;
+  display: block;
+  border-style: solid;
+}
+/* Up */
+::-webkit-scrollbar-button:single-button:vertical:decrement {
+  border-width: 0 5px 5px 5px;
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff);
+}
+::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff);
+}
+/* Down */
+::-webkit-scrollbar-button:single-button:vertical:increment {
+  border-width: 5px 5px 0 5px;
+  border-color: var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+::-webkit-scrollbar-button:vertical:single-button:increment:hover {
+  border-color: var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+/* Left */
+::-webkit-scrollbar-button:single-button:horizontal:decrement {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+
+
+/* Right */
+::-webkit-scrollbar-button:single-button:horizontal:increment {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-primary,#009eb3);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:increment:hover {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse-hover,#474747);
+
+}
+
+`;
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+const Wt = (s) => s ?? C;
+class wn extends zs {
+  constructor() {
+    super(...arguments), this.prevData = {};
+  }
+  render(r) {
+    return C;
+  }
+  update(r, [o]) {
+    var i;
+    this.element !== r.element && (this.element = r.element), this.host = ((i = r.options) == null ? void 0 : i.host) || this.element, this.apply(o), this.groom(o), this.prevData = { ...o };
+  }
+  apply(r) {
+    if (!r) return;
+    const { prevData: o, element: i } = this;
+    for (const c in r) {
+      const t = r[c];
+      t !== o[c] && (i[c] = t);
+    }
+  }
+  groom(r) {
+    const { prevData: o, element: i } = this;
+    if (o)
+      for (const c in o)
+        (!r || !(c in r) && i[c] === o[c]) && (i[c] = void 0);
+  }
+}
+const qt = er(wn);
+var Yt = /* @__PURE__ */ ((s) => (s.None = "none", s.Uscui = "us.cui", s.Usclassified = "us.classified", s.Usunclassified = "us.unclassified", s.Usconfidential = "us.confidential", s.Ussecret = "us.secret", s.Ustopsecret = "us.topsecret", s.UstopsecretSi = "us.topsecret.si", s.Uknotset = "uk.notset", s.Ukofficial = "uk.official", s.Uksecret = "uk.secret", s.Uktopsecret = "uk.topsecret", s.Caprotected_a = "ca.protected_a", s.Caprotected_b = "ca.protected_b", s.Caprotected_c = "ca.protected_c", s.Caconfidential = "ca.confidential", s.Casecret = "ca.secret", s.Catopsecret = "ca.topsecret", s.Auunofficial = "au.unofficial", s.Auofficial = "au.official", s.Auofficialsensitive = "au.officialsensitive", s.Auconfidential = "au.confidential", s.Ausecret = "au.secret", s.Autopsecret = "au.topsecret", s))(Yt || {});
+const ct = {
+  none: {},
+  //US Department of Defense spec CFR-2002-title31-vol1-sec2-7
+  "us.cui": {
+    //controlled unclassified information
+    color: "white",
+    backgroundColor: "#3D1E5A",
+    content: "Controlled Unclassified Information"
+  },
+  "us.classified": {
+    color: "white",
+    backgroundColor: "#723D9A",
+    content: "Classified"
+  },
+  "us.unclassified": {
+    color: "white",
+    backgroundColor: "#007A33",
+    content: "Unclassified"
+  },
+  "us.confidential": {
+    color: "white",
+    backgroundColor: "#0033A0",
+    content: "Confidential"
+  },
+  "us.secret": {
+    color: "white",
+    backgroundColor: "#C8102E",
+    content: "Secret"
+  },
+  "us.topsecret": {
+    color: "white",
+    backgroundColor: "#FF671F",
+    content: "Top Secret"
+  },
+  "us.topsecret.si": {
+    color: "black",
+    backgroundColor: "#F7EA48",
+    content: "Top Secret//SI"
+  },
+  "uk.notset": {
+    color: "white",
+    backgroundColor: " #616161",
+    content: "Not Set"
+  },
+  "uk.official": {
+    color: "white",
+    backgroundColor: "#2B71C7",
+    content: "For Offical Use"
+  },
+  "uk.secret": {
+    color: "white",
+    backgroundColor: "#F39C2C",
+    content: "Secret"
+  },
+  "uk.topsecret": {
+    color: "white",
+    backgroundColor: "#AA0000",
+    content: "Top Secret"
+  },
+  "ca.protected_a": {
+    color: "white",
+    backgroundColor: "#227ABC",
+    content: "PROTECTED A"
+  },
+  "ca.protected_b": {
+    color: "white",
+    backgroundColor: "#900FB5",
+    content: "PROTECTED B"
+  },
+  "ca.protected_c": {
+    color: "white",
+    backgroundColor: "#460FB5",
+    content: "PROTECTED C"
+  },
+  "ca.confidential": {
+    color: "white",
+    backgroundColor: "#0033a0",
+    content: "Confidential"
+  },
+  "ca.secret": {
+    color: "white",
+    backgroundColor: "#c8102e",
+    content: "Secret"
+  },
+  "ca.topsecret": {
+    color: "white",
+    backgroundColor: "#ff671f",
+    content: "Top Secret"
+  },
+  "au.unofficial": {
+    color: "#666",
+    backgroundColor: "#ffffffff",
+    content: "Unofficial"
+  },
+  "au.official": {
+    color: "#666",
+    backgroundColor: "#ffffffff",
+    content: "Official"
+  },
+  "au.officialsensitive": {
+    color: "#666",
+    backgroundColor: "#ffffffff",
+    content: "Official Sentitive"
+  },
+  "au.confidential": {
+    color: "white",
+    backgroundColor: "#4F81BD",
+    content: "Confidential"
+  },
+  "au.secret": {
+    color: "black",
+    backgroundColor: " #E5B8B7",
+    content: "Secret"
+  },
+  "au.topsecret": {
+    color: "black",
+    backgroundColor: "#AA0000",
+    content: "Top Secret"
+  }
+};
+var xn = Object.defineProperty, An = Object.getOwnPropertyDescriptor, Z = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? An(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && xn(r, o, c), c;
+};
+let B = class extends L {
+  constructor() {
+    super(...arguments), this.showHeader = !0, this.headerSticky = !0, this.classificationLevel = Yt.None, this.classificationText = "", this.notifications = [], this.showCreateAccount = !1, this.showLoginButton = !0, this.username = "";
+  }
+  // protected createRenderRoot(): HTMLElement | DocumentFragment {
+  //   return this
+  // }
+  render() {
+    this.classificationLevel && !ct[this.classificationLevel] && (console.warn("Unknown classification", this.classificationLevel), this.classificationLevel = Yt.None);
+    const s = this.classificationLevel ? this.classificationText || ct[this.classificationLevel].content : "", r = this.showHeader ? A`<spectric-header ?showCreateAccount=${this.showCreateAccount} .showLoginButton=${this.showLoginButton} username=${Wt(this.username)}>
+    <slot name="branding" slot="branding"></slot>
+    <slot name="name" slot="name"></slot>
+    <slot name="center" slot="center"></slot>
+    <slot name="end" slot="end"></slot>
+  </spectric-header>` : null;
+    return A`
+    ${this.classificationLevel && s ? A`
+    <!-- Classification Banner -->
+    <spectric-banner ${qt({ text: s, headerStyle: ct[this.classificationLevel] })}></spectric-banner>
+      ` : null}
+      <spectric-theme theme=${Wt(this.theme)}>
+      ${this.notifications ? this.notifications.map((o) => A`<spectric-banner ${qt(o)} ></spectric-banner>`) : null}
+      ${this.headerSticky ? r : null}
+      <article>
+      ${this.headerSticky ? null : r}
+      <section class="spectric-page">
+        <slot name="content"></slot>
+        <slot></slot>
+      </section>
+    </article>
+  </spectric-theme>
+  ${this.classificationLevel && s ? A`<spectric-banner ${qt({ text: s, headerStyle: ct[this.classificationLevel] })}></spectric-banner>` : null}
+
+  `;
+  }
+};
+B.styles = _n;
+Z([
+  v({ type: Boolean, reflect: !0 })
+], B.prototype, "showHeader", 2);
+Z([
+  v({ type: Boolean, reflect: !0 })
+], B.prototype, "headerSticky", 2);
+Z([
+  v({ type: String, reflect: !0 })
+], B.prototype, "classificationLevel", 2);
+Z([
+  v({ type: String, reflect: !0 })
+], B.prototype, "classificationText", 2);
+Z([
+  v({ type: Array, reflect: !0 })
+], B.prototype, "notifications", 2);
+Z([
+  v({ type: Boolean, reflect: !0 })
+], B.prototype, "showCreateAccount", 2);
+Z([
+  v({ type: Boolean, reflect: !0 })
+], B.prototype, "showLoginButton", 2);
+Z([
+  v({ type: String, reflect: !0 })
+], B.prototype, "username", 2);
+Z([
+  v({ type: String, reflect: !0 })
+], B.prototype, "theme", 2);
+B = Z([
+  I("spectric-page")
+], B);
+var kn = Object.defineProperty, Sn = Object.getOwnPropertyDescriptor, O = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? Sn(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && kn(r, o, c), c;
+}, Cn = /* @__PURE__ */ ((s) => (s.Text = "text", s.TextArea = "text-area", s.number = "number", s.color = "color", s.date = "date", s.datetime = "datetime-local", s.email = "email", s.file = "file", s.hidden = "hidden", s.password = "password", s))(Cn || {});
+let E = class extends L {
+  constructor() {
+    super(...arguments), this.placeholder = "", this.readonly = !1, this.variant = "text", this.disabled = !1, this.label = "", this.hidePasswordLabel = "Hide", this.showPasswordLabel = "Show", this.showPasswordVisibilityToggle = !0, this.helperText = "", this.invalid = !1, this.required = !1, this.invalidText = "", this.name = "", this.pattern = "", this.maxCount = 0, this._value = "", this._showPassword = !1, this.autocomplete = "", this._handleInput = ({ target: s }) => {
+      const r = s;
+      this.value = r.value, this.invalid = !r.validity.valid;
+    }, this.handleTogglePasswordVisibility = () => {
+      this._showPassword = !this._showPassword, this.requestUpdate();
+    };
+  }
+  //static styles?: CSSResultGroup | undefined = style;
+  createRenderRoot() {
+    return this;
+  }
+  get selectionStart() {
+    return this._input.selectionStart;
+  }
+  get value() {
+    return this._input ? this.variant == "number" ? parseFloat(this._input.value) : this._input.value : this._value;
+  }
+  set value(s) {
+    const r = this._value;
+    this._value = s, this.requestUpdate("value", r), this._input && (this._input.value = String(s));
+  }
+  setSelectionRange(s, r, o = "none") {
+    this._input.setSelectionRange(s, r, o);
+  }
+  render() {
+    switch (this.variant) {
+      case "text":
+      case "password":
+      case "number":
+      case "email":
+      case "date":
+      case "datetime-local":
+      case "file":
+      case "color":
+        return A`
+            <div class="inputWrapper">
+                <div class="text-input__label-helper-wrapper">
+                    <div class="--text-input__label-wrapper">
+                        ${this.label} ${this.maxCount > 0 && this._value ? `${this._value.length}/${this.maxCount}` : null}
+                    </div> 
+                </div>
+              <div class="fieldwrapper">
+                <div ?data-invalid="${this.invalid}" class="inputContainer">
+                  <input
+                    ?data-invalid="${this.invalid}"
+                    ?disabled="${this.disabled}"
+                    aria-describedby="helper-text"
+                    id="input"
+                    name="${Ae(this.name)}"
+                    pattern="${Ae(this.pattern)}"
+                    placeholder="${Ae(this.placeholder)}"
+                    autocomplete="${Ae(this.autocomplete)}"
+                    ?readonly="${this.readonly}"
+                    ?required="${this.required}"
+                    type="${Ae(
+          this.variant !== "password" ? this.variant : this._showPassword ? "text" : "password"
+          /* password */
+        )}"
+                    .value="${this._value}"
+                    maxlength="${Ae(this.maxCount > 0 ? this.maxCount : void 0)}"
+                    @input="${this._handleInput}" 
+                    @change=${() => {
+          this.dispatchEvent(new Event("change", { bubbles: !0 }));
+        }}
+                    />
+                    
+                  ${this.variant === "password" && this.showPasswordVisibilityToggle ? A`
+                        <spectric-button
+                        size="small"
+                          type="button"
+                          ?disabled="${this.disabled}"
+                          @click=${this.handleTogglePasswordVisibility}>
+                          ${this._showPassword ? this.hidePasswordLabel : this.showPasswordLabel}
+                        </spectric-button>
+                      ` : null}
+                </div>
+                <div
+                    id="helper-text"
+                    >
+                    <slot name="helper-text"> ${this.invalid ? this.invalidText : this.helperText} </slot>
+                    </div>
+
+              </div>
+            </div>
+          `;
+      case "hidden":
+        return A`<input type="hidden"></input>`;
+    }
+    return `Not yet implemented ${this.variant}`;
+  }
+};
+O([
+  v({ type: String, reflect: !0 })
+], E.prototype, "placeholder", 2);
+O([
+  v({ type: Boolean, reflect: !0 })
+], E.prototype, "readonly", 2);
+O([
+  v({ type: String, reflect: !0 })
+], E.prototype, "variant", 2);
+O([
+  v({ type: Boolean, reflect: !0 })
+], E.prototype, "disabled", 2);
+O([
+  v({ type: String, reflect: !0 })
+], E.prototype, "label", 2);
+O([
+  v()
+], E.prototype, "hidePasswordLabel", 2);
+O([
+  v()
+], E.prototype, "showPasswordLabel", 2);
+O([
+  v({
+    type: Boolean,
+    reflect: !0
+  })
+], E.prototype, "showPasswordVisibilityToggle", 2);
+O([
+  v({ type: String, reflect: !0 })
+], E.prototype, "helperText", 2);
+O([
+  v({ type: Boolean, reflect: !0 })
+], E.prototype, "invalid", 2);
+O([
+  v({ type: Boolean, reflect: !0 })
+], E.prototype, "required", 2);
+O([
+  v({ type: String, reflect: !0 })
+], E.prototype, "invalidText", 2);
+O([
+  v()
+], E.prototype, "name", 2);
+O([
+  v()
+], E.prototype, "pattern", 2);
+O([
+  v({ type: Number, reflect: !0 })
+], E.prototype, "maxCount", 2);
+O([
+  v({ reflect: !0 })
+], E.prototype, "autocomplete", 2);
+O([
+  v({ reflect: !0 })
+], E.prototype, "value", 1);
+O([
+  We("input")
+], E.prototype, "_input", 2);
+E = O([
+  I("spectric-input")
+], E);
+const Ae = (s) => Wt(s === "" ? void 0 : s ?? void 0), En = "end of input", On = {
+  fieldName: "field name",
+  value: "value",
+  literal: "literal",
+  whitespace: "whitespace"
+};
+class Is extends Error {
+  constructor(r, o) {
+    let i = r.message;
+    if (r.expected) {
+      const p = r.expected.map((g) => On[g.description] || g.description).join(", ");
+      let b = r.found ? `"${r.found}"` : En;
+      i = `Expected ${p} but ${b} found.`;
+    }
+    const c = [i, o, "-".repeat(r.location.start.offset) + "^"].join(
+      `
+`
+    );
+    super(c), this.name = "DQLSyntaxError", this.shortMessage = i;
+  }
+}
+function Se(s) {
+  return {
+    type: "literal",
+    value: s
+  };
+}
+function tr(s) {
+  return s.value;
+}
+const Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNode: Se,
+  toOpenSearchQuery: tr
+}, Symbol.toStringTag, { value: "Module" })), {
+  SyntaxError: nc,
+  parse: wt
+} = function() {
+  function s(i, c) {
+    function t() {
+      this.constructor = i;
+    }
+    t.prototype = c.prototype, i.prototype = new t();
+  }
+  function r(i, c, t, p) {
+    this.message = i, this.expected = c, this.found = t, this.location = p, this.name = "SyntaxError", typeof Error.captureStackTrace == "function" && Error.captureStackTrace(this, r);
+  }
+  s(r, Error);
+  function o(i) {
+    var c = arguments.length > 1 ? arguments[1] : {}, t = {}, p = { start: Kr, Literal: Bt }, b = Kr, g = function(e, n) {
+      return n.type === "cursor" ? {
+        ...n,
+        suggestionTypes: ["conjunction"]
+      } : e !== null ? e : le.function.buildNode("is", "*", "*");
+    }, w = function() {
+      return ko;
+    }, x = function(e, n) {
+      const l = [e, n].find((u) => u.type === "cursor");
+      return l || Y("or", [e, n]);
+    }, _ = function(e, n) {
+      const l = [e, n].find((u) => u.type === "cursor");
+      return l || Y("and", [e, n]);
+    }, k = function(e) {
+      return e.type === "cursor" ? e : Y("not", [e]);
+    }, S = "(", j = { type: "literal", value: "(", description: '"("' }, Ye = ")", te = { type: "literal", value: ")", description: '")"' }, H = function(e, n) {
+      return n.type === "cursor" ? {
+        ...n,
+        suggestionTypes: ["conjunction"]
+      } : e;
+    }, q = ":", R = { type: "literal", value: ":", description: '":"' }, ye = "{", xt = { type: "literal", value: "{", description: '"{"' }, At = "}", kt = { type: "literal", value: "}", description: '"}"' }, Gs = function(e, n, l) {
+      return n.type === "cursor" ? {
+        ...n,
+        nestedPath: n.nestedPath ? `${e.value}.${n.nestedPath}` : e.value
+      } : l.type === "cursor" ? {
+        ...l,
+        suggestionTypes: ["conjunction"]
+      } : Y("nested", [e, n]);
+    }, Js = { type: "other", description: "fieldName" }, Vs = function(e, n, l) {
+      if (l.type === "cursor")
+        return {
+          ...l,
+          suggestionTypes: ["conjunction"]
+        };
+      const u = To(n, l);
+      return Y("range", [e, u]);
+    }, ei = function(e, n) {
+      return n.type === "cursor" ? {
+        ...n,
+        fieldName: e.value,
+        suggestionTypes: ["value", "conjunction"]
+      } : n(e);
+    }, ti = function(e) {
+      if (e.type === "cursor") {
+        const l = `${e.prefix}${e.suffix}`.trim();
+        return {
+          ...e,
+          fieldName: l,
+          suggestionTypes: ["field", "operator", "conjunction"]
+        };
+      }
+      const n = re(null);
+      return e(n);
+    }, ri = function(e, n) {
+      return n.type === "cursor" ? {
+        ...n,
+        suggestionTypes: ["conjunction"]
+      } : e;
+    }, si = function(e, n) {
+      const l = [e, n].find((u) => u.type === "cursor");
+      return l ? {
+        ...l,
+        suggestionTypes: ["value"]
+      } : (u) => Y("or", [e(u), n(u)]);
+    }, ii = function(e, n) {
+      const l = [e, n].find((u) => u.type === "cursor");
+      return l ? {
+        ...l,
+        suggestionTypes: ["value"]
+      } : (u) => Y("and", [e(u), n(u)]);
+    }, oi = function(e) {
+      return e.type === "cursor" ? {
+        ...list,
+        suggestionTypes: ["value"]
+      } : (n) => Y("not", [e(n)]);
+    }, ni = { type: "other", description: "value" }, ai = function(e) {
+      if (e.type === "cursor") return e;
+      const n = re(!0);
+      return (l) => Y("is", [l, e, n]);
+    }, ci = function(e) {
+      if (e.type === "cursor") return e;
+      !Eo && e.type === "wildcard" && le.wildcard.hasLeadingWildcard(e) && M("Leading wildcards are disabled. See query:allowLeadingWildcards in Advanced Settings.");
+      const n = re(!1);
+      return (l) => Y("is", [l, e, n]);
+    }, li = { type: "other", description: "OR" }, nr = "or", ar = { type: "literal", value: "or", description: '"or"' }, ui = { type: "other", description: "AND" }, cr = "and", lr = { type: "literal", value: "and", description: '"and"' }, pi = { type: "other", description: "NOT" }, ur = "not", pr = { type: "literal", value: "not", description: '"not"' }, di = { type: "other", description: "literal" }, Pe = '"', Le = { type: "literal", value: '"', description: '"\\""' }, St = function(e, n, l) {
+      const { start: u, end: f } = ro();
+      return {
+        type: "cursor",
+        start: u.offset,
+        end: f.offset - n.length,
+        prefix: e.join(""),
+        suffix: l.join(""),
+        text: to().replace(n, "")
+      };
+    }, fi = function(e) {
+      return re(e.join(""));
+    }, Ne = "\\", De = { type: "literal", value: "\\", description: '"\\\\"' }, hi = /^[\\"]/, bi = { type: "class", value: '[\\\\"]', description: '[\\\\"]' }, Ke = function(e) {
+      return e;
+    }, gi = /^[^"]/, vi = { type: "class", value: '[^"]', description: '[^"]' }, yi = function(e) {
+      const n = e.join("").trim();
+      return n === "null" ? re(null) : n === "true" ? re(!0) : n === "false" ? re(!1) : e.includes(us) ? Oo(n) : re(
+        /^(-?[1-9]+\d*([.]\d+)?)$|^(-?0[.]\d*[1-9]+)$|^0$|^0.0$|^[.]\d{1,}$/.test(n) ? isFinite(n) && (n > Number.MAX_SAFE_INTEGER || n < Number.MIN_SAFE_INTEGER) ? BigInt(n) : Number(n) : n
+      );
+    }, dr = { type: "any", description: "any character" }, Ze = "*", Xe = { type: "literal", value: "*", description: '"*"' }, mi = function() {
+      return us;
+    }, fr = "\\t", $i = { type: "literal", value: "\\t", description: '"\\\\t"' }, _i = function() {
+      return "	";
+    }, hr = "\\r", wi = { type: "literal", value: "\\r", description: '"\\\\r"' }, xi = function() {
+      return "\r";
+    }, br = "\\n", Ai = { type: "literal", value: "\\n", description: '"\\\\n"' }, ki = function() {
+      return `
+`;
+    }, Si = function(e) {
+      return e;
+    }, Ci = /^[\\():<>"*{}]/, Ei = { type: "class", value: '[\\\\():<>"*{}]', description: '[\\\\():<>"*{}]' }, gr = "<=", Oi = { type: "literal", value: "<=", description: '"<="' }, Ti = function() {
+      return "lte";
+    }, vr = ">=", Pi = { type: "literal", value: ">=", description: '">="' }, Li = function() {
+      return "gte";
+    }, yr = "<", mr = { type: "literal", value: "<", description: '"<"' }, Ni = function() {
+      return "lt";
+    }, $r = ">", _r = { type: "literal", value: ">", description: '">"' }, Di = function() {
+      return "gt";
+    }, ji = { type: "other", description: "whitespace" }, Ri = /^[ \t\r\n]/, Bi = { type: "class", value: "[\\ \\t\\r\\n]", description: "[\\ \\t\\r\\n]" }, Ui = function() {
+      return So;
+    }, wr = "@kuery-cursor@", Mi = { type: "literal", value: "@kuery-cursor@", description: '"@kuery-cursor@"' }, zi = function() {
+      return Co;
+    }, xr = "||", Fi = { type: "literal", value: "||", description: '"||"' }, Qi = function() {
+      M("LuceneOr");
+    }, Ar = "&&", Ii = { type: "literal", value: "&&", description: '"&&"' }, kr = function() {
+      M("LuceneAnd");
+    }, Sr = "+", Cr = { type: "literal", value: "+", description: '"+"' }, Er = "-", Or = { type: "literal", value: "-", description: '"-"' }, Tr = function() {
+      M("LuceneNot");
+    }, Pr = "!", Lr = { type: "literal", value: "!", description: '"!"' }, Nr = "_exists_", Hi = { type: "literal", value: "_exists_", description: '"_exists_"' }, qi = function() {
+      M("LuceneExists");
+    }, Dr = function() {
+      M("LuceneRange");
+    }, jr = "?", Rr = { type: "literal", value: "?", description: '"?"' }, Wi = function() {
+      M("LuceneWildcard");
+    }, Ct = "/", Et = { type: "literal", value: "/", description: '"/"' }, Br = /^[^\/]/, Ur = { type: "class", value: "[^/]", description: "[^/]" }, Yi = function() {
+      M("LuceneRegex");
+    }, Ot = "~", Tt = { type: "literal", value: "~", description: '"~"' }, me = /^[0-9]/, $e = { type: "class", value: "[0-9]", description: "[0-9]" }, Ki = function() {
+      M("LuceneFuzzy");
+    }, Zi = function() {
+      M("LuceneProximity");
+    }, Mr = "^", zr = { type: "literal", value: "^", description: '"^"' }, Xi = function() {
+      M("LuceneBoost");
+    }, Gi = function() {
+      return char;
+    }, Ji = "=", Vi = { type: "literal", value: "=", description: '"="' }, Fr = "[", Qr = { type: "literal", value: "[", description: '"["' }, Ir = "]", Hr = { type: "literal", value: "]", description: '"]"' }, qr = "TO", eo = { type: "literal", value: "TO", description: '"TO"' }, a = 0, $ = 0, Ge = [{ line: 1, column: 1, seenCR: !1 }], W = 0, Pt = [], d = 0, Je;
+    if ("startRule" in c) {
+      if (!(c.startRule in p))
+        throw new Error(`Can't start parsing from rule "` + c.startRule + '".');
+      b = p[c.startRule];
+    }
+    function to() {
+      return i.substring($, a);
+    }
+    function ro() {
+      return Ve($, a);
+    }
+    function M(e) {
+      throw Yr(
+        e,
+        null,
+        i.substring($, a),
+        Ve($, a)
+      );
+    }
+    function Wr(e) {
+      var n = Ge[e], l, u;
+      if (n)
+        return n;
+      for (l = e - 1; !Ge[l]; )
+        l--;
+      for (n = Ge[l], n = {
+        line: n.line,
+        column: n.column,
+        seenCR: n.seenCR
+      }; l < e; )
+        u = i.charAt(l), u === `
+` ? (n.seenCR || n.line++, n.column = 1, n.seenCR = !1) : u === "\r" || u === "\u2028" || u === "\u2029" ? (n.line++, n.column = 1, n.seenCR = !0) : (n.column++, n.seenCR = !1), l++;
+      return Ge[e] = n, n;
+    }
+    function Ve(e, n) {
+      var l = Wr(e), u = Wr(n);
+      return {
+        start: {
+          offset: e,
+          line: l.line,
+          column: l.column
+        },
+        end: {
+          offset: n,
+          line: u.line,
+          column: u.column
+        }
+      };
+    }
+    function h(e) {
+      a < W || (a > W && (W = a, Pt = []), Pt.push(e));
+    }
+    function Yr(e, n, l, u) {
+      function f(T) {
+        var P = 1;
+        for (T.sort(function(se, z) {
+          return se.description < z.description ? -1 : se.description > z.description ? 1 : 0;
+        }); P < T.length; )
+          T[P - 1] === T[P] ? T.splice(P, 1) : P++;
+      }
+      function m(T, P) {
+        function se(Po) {
+          function nt(G) {
+            return G.charCodeAt(0).toString(16).toUpperCase();
+          }
+          return Po.replace(/\\/g, "\\\\").replace(/"/g, '\\"').replace(/\x08/g, "\\b").replace(/\t/g, "\\t").replace(/\n/g, "\\n").replace(/\f/g, "\\f").replace(/\r/g, "\\r").replace(/[\x00-\x07\x0B\x0E\x0F]/g, function(G) {
+            return "\\x0" + nt(G);
+          }).replace(/[\x10-\x1F\x80-\xFF]/g, function(G) {
+            return "\\x" + nt(G);
+          }).replace(/[\u0100-\u0FFF]/g, function(G) {
+            return "\\u0" + nt(G);
+          }).replace(/[\u1000-\uFFFF]/g, function(G) {
+            return "\\u" + nt(G);
+          });
+        }
+        var z = new Array(T.length), ps, ds, Re;
+        for (Re = 0; Re < T.length; Re++)
+          z[Re] = T[Re].description;
+        return ps = T.length > 1 ? z.slice(0, -1).join(", ") + " or " + z[T.length - 1] : z[0], ds = P ? '"' + se(P) + '"' : "end of input", "Expected " + ps + " but " + ds + " found.";
+      }
+      return n !== null && f(n), new r(
+        e !== null ? e : m(n, l),
+        n,
+        l,
+        u
+      );
+    }
+    function Kr() {
+      var e, n, l, u;
+      for (e = a, n = [], l = y(); l !== t; )
+        n.push(l), l = y();
+      return n !== t ? (l = et(), l === t && (l = null), l !== t ? (u = it(), u !== t ? ($ = e, n = g(l, u), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t), e;
+    }
+    function et() {
+      var e, n, l, u;
+      return e = a, $ = a, n = w(), n ? n = void 0 : n = t, n !== t ? (l = fo(), l !== t ? (n = [n, l], e = n) : (a = e, e = t)) : (a = e, e = t), e === t && (e = a, n = Lt(), n !== t ? (l = tt(), l !== t ? (u = et(), u !== t ? ($ = e, n = x(n, u), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t), e === t && (e = Lt())), e;
+    }
+    function Lt() {
+      var e, n, l, u;
+      return e = a, n = Zr(), n !== t ? (l = rt(), l !== t ? (u = Lt(), u !== t ? ($ = e, n = _(n, u), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t), e === t && (e = Zr()), e;
+    }
+    function Zr() {
+      var e, n, l;
+      return e = a, n = Rt(), n !== t ? (l = Xr(), l !== t ? ($ = e, n = k(l), e = n) : (a = e, e = t)) : (a = e, e = t), e === t && (e = Xr()), e;
+    }
+    function Xr() {
+      var e, n, l, u, f, m;
+      if (e = a, i.charCodeAt(a) === 40 ? (n = S, a++) : (n = t, d === 0 && h(j)), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        l !== t ? (u = et(), u !== t ? (f = it(), f !== t ? (i.charCodeAt(a) === 41 ? (m = Ye, a++) : (m = t, d === 0 && h(te)), m !== t ? ($ = e, n = H(u, f), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t);
+      } else
+        a = e, e = t;
+      return e === t && (e = so()), e;
+    }
+    function so() {
+      var e, n, l, u, f, m, T, P, se, z;
+      if (e = a, n = Nt(), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        if (l !== t)
+          if (i.charCodeAt(a) === 58 ? (u = q, a++) : (u = t, d === 0 && h(R)), u !== t) {
+            for (f = [], m = y(); m !== t; )
+              f.push(m), m = y();
+            if (f !== t)
+              if (i.charCodeAt(a) === 123 ? (m = ye, a++) : (m = t, d === 0 && h(xt)), m !== t) {
+                for (T = [], P = y(); P !== t; )
+                  T.push(P), P = y();
+                T !== t ? (P = et(), P !== t ? (se = it(), se !== t ? (i.charCodeAt(a) === 125 ? (z = At, a++) : (z = t, d === 0 && h(kt)), z !== t ? ($ = e, n = Gs(n, P, se), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t);
+              } else
+                a = e, e = t;
+            else
+              a = e, e = t;
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      return e === t && (e = io()), e;
+    }
+    function io() {
+      var e;
+      return e = oo(), e === t && (e = no(), e === t && (e = ao())), e;
+    }
+    function Nt() {
+      var e;
+      return d++, e = Bt(), d--, e === t && d === 0 && h(Js), e;
+    }
+    function oo() {
+      var e, n, l, u, f, m;
+      if (e = a, n = Nt(), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        if (l !== t)
+          if (u = rs(), u !== t) {
+            for (f = [], m = y(); m !== t; )
+              f.push(m), m = y();
+            f !== t ? (m = Bt(), m !== t ? ($ = e, n = Vs(n, u, m), e = n) : (a = e, e = t)) : (a = e, e = t);
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      return e;
+    }
+    function no() {
+      var e, n, l, u, f, m;
+      if (e = a, n = Nt(), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        if (l !== t)
+          if (i.charCodeAt(a) === 58 ? (u = q, a++) : (u = t, d === 0 && h(R)), u !== t) {
+            for (f = [], m = y(); m !== t; )
+              f.push(m), m = y();
+            f !== t ? (m = Dt(), m !== t ? ($ = e, n = ei(n, m), e = n) : (a = e, e = t)) : (a = e, e = t);
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      return e;
+    }
+    function ao() {
+      var e, n;
+      return e = a, n = Vr(), n !== t && ($ = e, n = ti(n)), e = n, e;
+    }
+    function Dt() {
+      var e, n, l, u, f, m;
+      if (e = a, i.charCodeAt(a) === 40 ? (n = S, a++) : (n = t, d === 0 && h(j)), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        l !== t ? (u = Gr(), u !== t ? (f = it(), f !== t ? (i.charCodeAt(a) === 41 ? (m = Ye, a++) : (m = t, d === 0 && h(te)), m !== t ? ($ = e, n = ri(u, f), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t);
+      } else
+        a = e, e = t;
+      return e === t && (e = Vr()), e;
+    }
+    function Gr() {
+      var e, n, l, u;
+      return e = a, n = jt(), n !== t ? (l = tt(), l !== t ? (u = Gr(), u !== t ? ($ = e, n = si(n, u), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t), e === t && (e = jt()), e;
+    }
+    function jt() {
+      var e, n, l, u;
+      return e = a, n = Jr(), n !== t ? (l = rt(), l !== t ? (u = jt(), u !== t ? ($ = e, n = ii(n, u), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t), e === t && (e = Jr()), e;
+    }
+    function Jr() {
+      var e, n, l;
+      return e = a, n = Rt(), n !== t ? (l = Dt(), l !== t ? ($ = e, n = oi(l), e = n) : (a = e, e = t)) : (a = e, e = t), e === t && (e = Dt()), e;
+    }
+    function Vr() {
+      var e, n;
+      return d++, e = a, n = st(), n !== t && ($ = e, n = ai(n)), e = n, e === t && (e = a, n = es(), n !== t && ($ = e, n = ci(n)), e = n), d--, e === t && (n = t, d === 0 && h(ni)), e;
+    }
+    function tt() {
+      var e, n, l, u, f;
+      if (d++, e = a, n = [], l = y(), l !== t)
+        for (; l !== t; )
+          n.push(l), l = y();
+      else
+        n = t;
+      if (n !== t)
+        if (i.substr(a, 2).toLowerCase() === nr ? (l = i.substr(a, 2), a += 2) : (l = t, d === 0 && h(ar)), l !== t) {
+          if (u = [], f = y(), f !== t)
+            for (; f !== t; )
+              u.push(f), f = y();
+          else
+            u = t;
+          u !== t ? (n = [n, l, u], e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e === t && (e = a, $ = a, n = w(), n ? n = void 0 : n = t, n !== t ? (l = ss(), l !== t ? (n = [n, l], e = n) : (a = e, e = t)) : (a = e, e = t)), d--, e === t && (n = t, d === 0 && h(li)), e;
+    }
+    function rt() {
+      var e, n, l, u, f;
+      if (d++, e = a, n = [], l = y(), l !== t)
+        for (; l !== t; )
+          n.push(l), l = y();
+      else
+        n = t;
+      if (n !== t)
+        if (i.substr(a, 3).toLowerCase() === cr ? (l = i.substr(a, 3), a += 3) : (l = t, d === 0 && h(lr)), l !== t) {
+          if (u = [], f = y(), f !== t)
+            for (; f !== t; )
+              u.push(f), f = y();
+          else
+            u = t;
+          u !== t ? (n = [n, l, u], e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e === t && (e = a, $ = a, n = w(), n ? n = void 0 : n = t, n !== t ? (l = is(), l !== t ? (n = [n, l], e = n) : (a = e, e = t)) : (a = e, e = t)), d--, e === t && (n = t, d === 0 && h(ui)), e;
+    }
+    function Rt() {
+      var e, n, l, u;
+      if (d++, e = a, i.substr(a, 3).toLowerCase() === ur ? (n = i.substr(a, 3), a += 3) : (n = t, d === 0 && h(pr)), n !== t) {
+        if (l = [], u = y(), u !== t)
+          for (; u !== t; )
+            l.push(u), u = y();
+        else
+          l = t;
+        l !== t ? (n = [n, l], e = n) : (a = e, e = t);
+      } else
+        a = e, e = t;
+      return e === t && (e = a, $ = a, n = w(), n ? n = void 0 : n = t, n !== t ? (l = os(), l !== t ? (n = [n, l], e = n) : (a = e, e = t)) : (a = e, e = t)), d--, e === t && (n = t, d === 0 && h(pi)), e;
+    }
+    function Bt() {
+      var e;
+      return d++, e = st(), e === t && (e = es()), d--, e === t && d === 0 && h(di), e;
+    }
+    function st() {
+      var e, n, l, u, f, m;
+      if (e = a, i.charCodeAt(a) === 34 ? (n = Pe, a++) : (n = t, d === 0 && h(Le)), n !== t) {
+        for (l = [], u = _e(); u !== t; )
+          l.push(u), u = _e();
+        if (l !== t)
+          if (u = je(), u !== t) {
+            for (f = [], m = _e(); m !== t; )
+              f.push(m), m = _e();
+            f !== t ? (i.charCodeAt(a) === 34 ? (m = Pe, a++) : (m = t, d === 0 && h(Le)), m !== t ? ($ = e, n = St(l, u, f), e = n) : (a = e, e = t)) : (a = e, e = t);
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      if (e === t)
+        if (e = a, i.charCodeAt(a) === 34 ? (n = Pe, a++) : (n = t, d === 0 && h(Le)), n !== t) {
+          for (l = [], u = _e(); u !== t; )
+            l.push(u), u = _e();
+          l !== t ? (i.charCodeAt(a) === 34 ? (u = Pe, a++) : (u = t, d === 0 && h(Le)), u !== t ? ($ = e, n = fi(l), e = n) : (a = e, e = t)) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      return e;
+    }
+    function _e() {
+      var e, n, l;
+      return e = Ut(), e === t && (e = a, i.charCodeAt(a) === 92 ? (n = Ne, a++) : (n = t, d === 0 && h(De)), n !== t ? (hi.test(i.charAt(a)) ? (l = i.charAt(a), a++) : (l = t, d === 0 && h(bi)), l !== t ? ($ = e, n = Ke(l), e = n) : (a = e, e = t)) : (a = e, e = t), e === t && (e = a, n = a, d++, l = je(), d--, l === t ? n = void 0 : (a = n, n = t), n !== t ? (gi.test(i.charAt(a)) ? (l = i.charAt(a), a++) : (l = t, d === 0 && h(vi)), l !== t ? ($ = e, n = Ke(l), e = n) : (a = e, e = t)) : (a = e, e = t))), e;
+    }
+    function es() {
+      var e, n, l, u, f;
+      for (e = a, n = [], l = we(); l !== t; )
+        n.push(l), l = we();
+      if (n !== t)
+        if (l = je(), l !== t) {
+          for (u = [], f = we(); f !== t; )
+            u.push(f), f = we();
+          u !== t ? ($ = e, n = St(n, l, u), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      if (e === t) {
+        if (e = a, n = [], l = we(), l !== t)
+          for (; l !== t; )
+            n.push(l), l = we();
+        else
+          n = t;
+        n !== t && ($ = e, n = yi(n)), e = n;
+      }
+      return e;
+    }
+    function we() {
+      var e, n, l, u, f;
+      return e = Ut(), e === t && (e = lo(), e === t && (e = uo(), e === t && (e = co(), e === t && (e = a, n = a, d++, l = ts(), d--, l === t ? n = void 0 : (a = n, n = t), n !== t ? (l = a, d++, u = po(), d--, u === t ? l = void 0 : (a = l, l = t), l !== t ? (u = a, d++, f = je(), d--, f === t ? u = void 0 : (a = u, u = t), u !== t ? (i.length > a ? (f = i.charAt(a), a++) : (f = t, d === 0 && h(dr)), f !== t ? ($ = e, n = Ke(f), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t))))), e;
+    }
+    function co() {
+      var e, n;
+      return e = a, i.charCodeAt(a) === 42 ? (n = Ze, a++) : (n = t, d === 0 && h(Xe)), n !== t && ($ = e, n = mi()), e = n, e;
+    }
+    function it() {
+      var e, n, l, u, f;
+      for (e = a, n = [], l = y(); l !== t; )
+        n.push(l), l = y();
+      if (n !== t)
+        if (l = je(), l !== t) {
+          for (u = [], f = y(); f !== t; )
+            u.push(f), f = y();
+          u !== t ? ($ = e, n = St(n, l, u), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      if (e === t)
+        for (e = [], n = y(); n !== t; )
+          e.push(n), n = y();
+      return e;
+    }
+    function Ut() {
+      var e, n;
+      return e = a, i.substr(a, 2) === fr ? (n = fr, a += 2) : (n = t, d === 0 && h($i)), n !== t && ($ = e, n = _i()), e = n, e === t && (e = a, i.substr(a, 2) === hr ? (n = hr, a += 2) : (n = t, d === 0 && h(wi)), n !== t && ($ = e, n = xi()), e = n, e === t && (e = a, i.substr(a, 2) === br ? (n = br, a += 2) : (n = t, d === 0 && h(Ai)), n !== t && ($ = e, n = ki()), e = n)), e;
+    }
+    function lo() {
+      var e, n, l;
+      return e = a, i.charCodeAt(a) === 92 ? (n = Ne, a++) : (n = t, d === 0 && h(De)), n !== t ? (l = ts(), l !== t ? ($ = e, n = Ke(l), e = n) : (a = e, e = t)) : (a = e, e = t), e;
+    }
+    function uo() {
+      var e, n, l;
+      return e = a, i.charCodeAt(a) === 92 ? (n = Ne, a++) : (n = t, d === 0 && h(De)), n !== t ? (i.substr(a, 2).toLowerCase() === nr ? (l = i.substr(a, 2), a += 2) : (l = t, d === 0 && h(ar)), l === t && (i.substr(a, 3).toLowerCase() === cr ? (l = i.substr(a, 3), a += 3) : (l = t, d === 0 && h(lr)), l === t && (i.substr(a, 3).toLowerCase() === ur ? (l = i.substr(a, 3), a += 3) : (l = t, d === 0 && h(pr)))), l !== t ? ($ = e, n = Si(l), e = n) : (a = e, e = t)) : (a = e, e = t), e;
+    }
+    function po() {
+      var e;
+      return e = tt(), e === t && (e = rt(), e === t && (e = Rt())), e;
+    }
+    function ts() {
+      var e;
+      return Ci.test(i.charAt(a)) ? (e = i.charAt(a), a++) : (e = t, d === 0 && h(Ei)), e;
+    }
+    function rs() {
+      var e, n;
+      return e = a, i.substr(a, 2) === gr ? (n = gr, a += 2) : (n = t, d === 0 && h(Oi)), n !== t && ($ = e, n = Ti()), e = n, e === t && (e = a, i.substr(a, 2) === vr ? (n = vr, a += 2) : (n = t, d === 0 && h(Pi)), n !== t && ($ = e, n = Li()), e = n, e === t && (e = a, i.charCodeAt(a) === 60 ? (n = yr, a++) : (n = t, d === 0 && h(mr)), n !== t && ($ = e, n = Ni()), e = n, e === t && (e = a, i.charCodeAt(a) === 62 ? (n = $r, a++) : (n = t, d === 0 && h(_r)), n !== t && ($ = e, n = Di()), e = n))), e;
+    }
+    function y() {
+      var e;
+      return d++, Ri.test(i.charAt(a)) ? (e = i.charAt(a), a++) : (e = t, d === 0 && h(Bi)), d--, e === t && d === 0 && h(ji), e;
+    }
+    function je() {
+      var e, n, l;
+      return e = a, $ = a, n = Ui(), n ? n = void 0 : n = t, n !== t ? (i.substr(a, 14) === wr ? (l = wr, a += 14) : (l = t, d === 0 && h(Mi)), l !== t ? ($ = e, n = zi(), e = n) : (a = e, e = t)) : (a = e, e = t), e;
+    }
+    function ss() {
+      var e, n, l, u, f;
+      for (e = a, n = [], l = y(); l !== t; )
+        n.push(l), l = y();
+      if (n !== t)
+        if (i.substr(a, 2) === xr ? (l = xr, a += 2) : (l = t, d === 0 && h(Fi)), l !== t) {
+          for (u = [], f = y(); f !== t; )
+            u.push(f), f = y();
+          u !== t ? ($ = e, n = Qi(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function is() {
+      var e, n, l, u, f;
+      for (e = a, n = [], l = y(); l !== t; )
+        n.push(l), l = y();
+      if (n !== t)
+        if (i.substr(a, 2) === Ar ? (l = Ar, a += 2) : (l = t, d === 0 && h(Ii)), l !== t) {
+          for (u = [], f = y(); f !== t; )
+            u.push(f), f = y();
+          u !== t ? ($ = e, n = kr(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e === t && (e = a, i.charCodeAt(a) === 43 ? (n = Sr, a++) : (n = t, d === 0 && h(Cr)), n !== t && ($ = e, n = kr()), e = n), e;
+    }
+    function os() {
+      var e, n;
+      return e = a, i.charCodeAt(a) === 45 ? (n = Er, a++) : (n = t, d === 0 && h(Or)), n !== t && ($ = e, n = Tr()), e = n, e === t && (e = a, i.charCodeAt(a) === 33 ? (n = Pr, a++) : (n = t, d === 0 && h(Lr)), n !== t && ($ = e, n = Tr()), e = n), e;
+    }
+    function fo() {
+      var e;
+      return e = ho(), e === t && (e = ns(), e === t && (e = bo())), e;
+    }
+    function ho() {
+      var e, n, l, u, f, m;
+      if (e = a, n = xe(), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        if (l !== t)
+          if (i.charCodeAt(a) === 58 ? (u = q, a++) : (u = t, d === 0 && h(R)), u !== t) {
+            for (f = [], m = y(); m !== t; )
+              f.push(m), m = y();
+            f !== t ? (m = ns(), m !== t ? (n = [n, l, u, f, m], e = n) : (a = e, e = t)) : (a = e, e = t);
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      return e;
+    }
+    function ns() {
+      var e;
+      return e = go(), e === t && (e = Mt(), e === t && (e = vo(), e === t && (e = yo(), e === t && (e = mo(), e === t && (e = $o()))))), e;
+    }
+    function bo() {
+      var e, n, l, u, f, m;
+      if (e = a, i.substr(a, 8) === Nr ? (n = Nr, a += 8) : (n = t, d === 0 && h(Hi)), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        if (l !== t)
+          if (i.charCodeAt(a) === 58 ? (u = q, a++) : (u = t, d === 0 && h(R)), u !== t) {
+            for (f = [], m = y(); m !== t; )
+              f.push(m), m = y();
+            f !== t ? (m = xe(), m !== t ? ($ = e, n = qi(), e = n) : (a = e, e = t)) : (a = e, e = t);
+          } else
+            a = e, e = t;
+        else
+          a = e, e = t;
+      } else
+        a = e, e = t;
+      return e;
+    }
+    function go() {
+      var e, n, l, u, f, m, T;
+      if (e = a, n = rs(), n !== t) {
+        for (l = [], u = y(); u !== t; )
+          l.push(u), u = y();
+        l !== t ? (u = xe(), u !== t ? ($ = e, n = Dr(), e = n) : (a = e, e = t)) : (a = e, e = t);
+      } else
+        a = e, e = t;
+      if (e === t)
+        if (e = a, n = xo(), n !== t) {
+          for (l = [], u = y(); u !== t; )
+            l.push(u), u = y();
+          l !== t ? (u = xe(), u !== t ? (f = ls(), f !== t ? (m = xe(), m !== t ? (T = Ao(), T !== t ? ($ = e, n = Dr(), e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      return e;
+    }
+    function Mt() {
+      var e, n, l, u, f;
+      for (e = a, n = [], l = ot(), l === t && (i.charCodeAt(a) === 42 ? (l = Ze, a++) : (l = t, d === 0 && h(Xe))); l !== t; )
+        n.push(l), l = ot(), l === t && (i.charCodeAt(a) === 42 ? (l = Ze, a++) : (l = t, d === 0 && h(Xe)));
+      if (n !== t)
+        if (i.charCodeAt(a) === 63 ? (l = jr, a++) : (l = t, d === 0 && h(Rr)), l !== t) {
+          for (u = [], f = Mt(); f !== t; )
+            u.push(f), f = Mt();
+          u !== t ? ($ = e, n = Wi(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function vo() {
+      var e, n, l, u;
+      if (e = a, i.charCodeAt(a) === 47 ? (n = Ct, a++) : (n = t, d === 0 && h(Et)), n !== t) {
+        for (l = [], Br.test(i.charAt(a)) ? (u = i.charAt(a), a++) : (u = t, d === 0 && h(Ur)); u !== t; )
+          l.push(u), Br.test(i.charAt(a)) ? (u = i.charAt(a), a++) : (u = t, d === 0 && h(Ur));
+        l !== t ? (i.charCodeAt(a) === 47 ? (u = Ct, a++) : (u = t, d === 0 && h(Et)), u !== t ? ($ = e, n = Yi(), e = n) : (a = e, e = t)) : (a = e, e = t);
+      } else
+        a = e, e = t;
+      return e;
+    }
+    function yo() {
+      var e, n, l, u, f;
+      if (e = a, n = as(), n !== t)
+        if (i.charCodeAt(a) === 126 ? (l = Ot, a++) : (l = t, d === 0 && h(Tt)), l !== t) {
+          for (u = [], me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e)); f !== t; )
+            u.push(f), me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e));
+          u !== t ? ($ = e, n = Ki(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function mo() {
+      var e, n, l, u, f;
+      if (e = a, n = st(), n !== t)
+        if (i.charCodeAt(a) === 126 ? (l = Ot, a++) : (l = t, d === 0 && h(Tt)), l !== t) {
+          for (u = [], me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e)); f !== t; )
+            u.push(f), me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e));
+          u !== t ? ($ = e, n = Zi(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function $o() {
+      var e, n, l, u, f;
+      if (e = a, n = xe(), n !== t)
+        if (i.charCodeAt(a) === 94 ? (l = Mr, a++) : (l = t, d === 0 && h(zr)), l !== t) {
+          for (u = [], me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e)); f !== t; )
+            u.push(f), me.test(i.charAt(a)) ? (f = i.charAt(a), a++) : (f = t, d === 0 && h($e));
+          u !== t ? ($ = e, n = Xi(), e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function xe() {
+      var e;
+      return e = st(), e === t && (e = as()), e;
+    }
+    function as() {
+      var e, n;
+      if (e = [], n = ot(), n !== t)
+        for (; n !== t; )
+          e.push(n), n = ot();
+      else
+        e = t;
+      return e;
+    }
+    function ot() {
+      var e, n, l, u;
+      return e = Ut(), e === t && (e = wo(), e === t && (e = a, n = a, d++, l = cs(), d--, l === t ? n = void 0 : (a = n, n = t), n !== t ? (l = a, d++, u = _o(), d--, u === t ? l = void 0 : (a = l, l = t), l !== t ? (i.length > a ? (u = i.charAt(a), a++) : (u = t, d === 0 && h(dr)), u !== t ? (n = [n, l, u], e = n) : (a = e, e = t)) : (a = e, e = t)) : (a = e, e = t))), e;
+    }
+    function _o() {
+      var e;
+      return e = tt(), e === t && (e = rt(), e === t && (e = ss(), e === t && (e = is(), e === t && (e = os(), e === t && (e = ls()))))), e;
+    }
+    function wo() {
+      var e, n, l;
+      return e = a, i.charCodeAt(a) === 92 ? (n = Ne, a++) : (n = t, d === 0 && h(De)), n !== t ? (l = cs(), l !== t ? ($ = e, n = Gi(), e = n) : (a = e, e = t)) : (a = e, e = t), e;
+    }
+    function cs() {
+      var e;
+      return i.charCodeAt(a) === 43 ? (e = Sr, a++) : (e = t, d === 0 && h(Cr)), e === t && (i.charCodeAt(a) === 45 ? (e = Er, a++) : (e = t, d === 0 && h(Or)), e === t && (i.charCodeAt(a) === 61 ? (e = Ji, a++) : (e = t, d === 0 && h(Vi)), e === t && (i.charCodeAt(a) === 62 ? (e = $r, a++) : (e = t, d === 0 && h(_r)), e === t && (i.charCodeAt(a) === 60 ? (e = yr, a++) : (e = t, d === 0 && h(mr)), e === t && (i.charCodeAt(a) === 33 ? (e = Pr, a++) : (e = t, d === 0 && h(Lr)), e === t && (i.charCodeAt(a) === 40 ? (e = S, a++) : (e = t, d === 0 && h(j)), e === t && (i.charCodeAt(a) === 41 ? (e = Ye, a++) : (e = t, d === 0 && h(te)), e === t && (i.charCodeAt(a) === 123 ? (e = ye, a++) : (e = t, d === 0 && h(xt)), e === t && (i.charCodeAt(a) === 125 ? (e = At, a++) : (e = t, d === 0 && h(kt)), e === t && (i.charCodeAt(a) === 91 ? (e = Fr, a++) : (e = t, d === 0 && h(Qr)), e === t && (i.charCodeAt(a) === 93 ? (e = Ir, a++) : (e = t, d === 0 && h(Hr)), e === t && (i.charCodeAt(a) === 94 ? (e = Mr, a++) : (e = t, d === 0 && h(zr)), e === t && (i.charCodeAt(a) === 34 ? (e = Pe, a++) : (e = t, d === 0 && h(Le)), e === t && (i.charCodeAt(a) === 126 ? (e = Ot, a++) : (e = t, d === 0 && h(Tt)), e === t && (i.charCodeAt(a) === 42 ? (e = Ze, a++) : (e = t, d === 0 && h(Xe)), e === t && (i.charCodeAt(a) === 63 ? (e = jr, a++) : (e = t, d === 0 && h(Rr)), e === t && (i.charCodeAt(a) === 58 ? (e = q, a++) : (e = t, d === 0 && h(R)), e === t && (i.charCodeAt(a) === 92 ? (e = Ne, a++) : (e = t, d === 0 && h(De)), e === t && (i.charCodeAt(a) === 47 ? (e = Ct, a++) : (e = t, d === 0 && h(Et))))))))))))))))))))), e;
+    }
+    function ls() {
+      var e, n, l, u, f;
+      if (e = a, n = [], l = y(), l !== t)
+        for (; l !== t; )
+          n.push(l), l = y();
+      else
+        n = t;
+      if (n !== t)
+        if (i.substr(a, 2) === qr ? (l = qr, a += 2) : (l = t, d === 0 && h(eo)), l !== t) {
+          if (u = [], f = y(), f !== t)
+            for (; f !== t; )
+              u.push(f), f = y();
+          else
+            u = t;
+          u !== t ? (n = [n, l, u], e = n) : (a = e, e = t);
+        } else
+          a = e, e = t;
+      else
+        a = e, e = t;
+      return e;
+    }
+    function xo() {
+      var e;
+      return i.charCodeAt(a) === 91 ? (e = Fr, a++) : (e = t, d === 0 && h(Qr)), e === t && (i.charCodeAt(a) === 123 ? (e = ye, a++) : (e = t, d === 0 && h(xt))), e;
+    }
+    function Ao() {
+      var e;
+      return i.charCodeAt(a) === 93 ? (e = Ir, a++) : (e = t, d === 0 && h(Hr)), e === t && (i.charCodeAt(a) === 125 ? (e = At, a++) : (e = t, d === 0 && h(kt))), e;
+    }
+    const { errorOnLuceneSyntax: ko, parseCursor: So, cursorSymbol: Co, allowLeadingWildcards: Eo = !0, helpers: { nodeTypes: le } } = c, Y = le.function.buildNodeWithArgumentNodes, re = le.literal.buildNode, Oo = le.wildcard.buildNode, To = le.namedArg.buildNode, { wildcardSymbol: us } = le.wildcard;
+    if (Je = b(), Je !== t && a === i.length)
+      return Je;
+    throw Je !== t && a < i.length && h({ type: "end", description: "end of input" }), Yr(
+      null,
+      Pt,
+      W < i.length ? i.charAt(W) : null,
+      W < i.length ? Ve(W, W + 1) : Ve(W, W)
+    );
+  }
+  return {
+    SyntaxError: r,
+    parse: o
+  };
+}(), rr = (s, r = {}, o = wt) => {
+  if (typeof s > "u")
+    throw new Error("expression must be a string, got undefined instead");
+  return o(s, { ...r, helpers: { nodeTypes: ne } });
+}, Oe = (s, r = {}) => rr(
+  s,
+  {
+    ...r,
+    startRule: "Literal"
+  },
+  wt
+), gt = (s, r = {}) => {
+  try {
+    return rr(s, r, wt);
+  } catch (o) {
+    throw o.name === "SyntaxError" ? new Is(o, s) : o;
+  }
+}, Pn = (s) => {
+  try {
+    return rr(s, { errorOnLuceneSyntax: !0 }, wt), !1;
+  } catch (r) {
+    return r.message.startsWith("Lucene");
+  }
+}, N = (s, r, o, i) => (r = void 0, !s || !s.type || !ne[s.type] ? N(ne.function.buildNode("and", []), r) : ne[s.type].toOpenSearchQuery(s, r, o, i)), ee = "@kuery-wildcard@";
+function Ln(s) {
+  return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function Nn(s) {
+  return s.replace(/[+-=&|><!(){}[\]^"~*?:\\/]/g, "\\$&");
+}
+function Dn(s) {
+  return s.includes(ee) ? {
+    type: "wildcard",
+    value: s
+  } : Oe(s);
+}
+function Hs(s, r) {
+  const { value: o } = s, i = o.split(ee).map(Ln).join("[\\s\\S]*");
+  return new RegExp(`^${i}$`).test(r);
+}
+function jn(s) {
+  const { value: r } = s;
+  return r.split(ee).join("*");
+}
+function Kt(s) {
+  const { value: r } = s;
+  return r.split(ee).map(Nn).join("*");
+}
+function Rn(s) {
+  const { value: r } = s;
+  return r.startsWith(ee) && r.replace(ee, "").length > 0;
+}
+const Bn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNode: Dn,
+  hasLeadingWildcard: Rn,
+  test: Hs,
+  toOpenSearchQuery: jn,
+  toQueryStringQuery: Kt,
+  wildcardSymbol: ee
+}, Symbol.toStringTag, { value: "Module" }));
+function sr(s, r) {
+  if (!r) return [];
+  if (s.type === "literal") {
+    const o = tr(s), i = r.fields.find((c) => c.name === o);
+    return i ? [i] : [];
+  } else if (s.type === "wildcard")
+    return r.fields.filter((i) => Hs(s, i.name));
+}
+function qs(s, r, o) {
+  const i = {
+    ...s,
+    value: o ? `${o}.${s.value}` : s.value
+  };
+  if (!r || i.type === "wildcard" && !o)
+    return i;
+  const t = sr(i, r).reduce((p, b) => {
+    const g = b.subType && b.subType.nested ? b.subType.nested.path : void 0;
+    return o && !g ? [
+      ...p,
+      `${b.name} is not a nested field but is in nested group "${o}" in the DQL expression.`
+    ] : g && !o ? [
+      ...p,
+      `${b.name} is a nested field, but is not in a nested group in the DQL expression.`
+    ] : g !== o ? [
+      ...p,
+      `Nested field ${b.name} is being queried with the incorrect nested path. The correct path is ${b.subType.nested.path}.`
+    ] : p;
+  }, []);
+  if (t.length > 0)
+    throw new Error(t.join(`
+`));
+  return i;
+}
+function Un(s, r, o = !1) {
+  if (s === void 0)
+    throw new Error("fieldName is a required argument");
+  if (r === void 0)
+    throw new Error("value is a required argument");
+  const i = typeof s == "string" ? Oe(s) : Se(s), c = typeof r == "string" ? Oe(r) : Se(r), t = Se(o);
+  return {
+    arguments: [i, c, t]
+  };
+}
+function Mn(s, r, o = {}, i = {}) {
+  const {
+    arguments: [c, t, p]
+  } = s, b = qs(
+    c,
+    r,
+    i != null && i.nested ? i.nested.path : void 0
+  ), g = N(b), w = t !== void 0 ? N(t) : t, x = p.value ? "phrase" : "best_fields";
+  if (b.value === null)
+    return t.type === "wildcard" ? {
+      query_string: {
+        query: Kt(t)
+      }
+    } : {
+      multi_match: {
+        type: x,
+        query: w,
+        lenient: !0
+      }
+    };
+  const _ = r ? sr(b, r) : [];
+  _ && _.length === 0 && _.push({
+    name: N(b),
+    scripted: !1,
+    type: ""
+  });
+  const k = t.type === "wildcard" && w === "*", S = b.type === "wildcard" && g === "*" || _ && r && _.length === r.fields.length;
+  return k && S ? { match_all: {} } : {
+    bool: {
+      should: _.reduce((te, H) => {
+        const q = (R) => {
+          var ye;
+          return b.type !== "wildcard" || !((ye = H.subType) != null && ye.nested) || i != null && i.nested ? R : {
+            nested: {
+              path: H.subType.nested.path,
+              query: R,
+              score_mode: "none"
+            }
+          };
+        };
+        if (H.scripted)
+          return [];
+        if (k)
+          return [
+            ...te,
+            q({
+              exists: {
+                field: H.name
+              }
+            })
+          ];
+        if (t.type === "wildcard")
+          return [
+            ...te,
+            q({
+              query_string: {
+                fields: [H.name],
+                query: Kt(t)
+              }
+            })
+          ];
+        if (H.type === "date") {
+          const R = o.dateFormatTZ ? { time_zone: o.dateFormatTZ } : {};
+          return [
+            ...te,
+            q({
+              range: {
+                [H.name]: {
+                  gte: w,
+                  lte: w,
+                  ...R
+                }
+              }
+            })
+          ];
+        } else {
+          const R = x === "phrase" ? "match_phrase" : "match";
+          return [
+            ...te,
+            q({
+              [R]: {
+                [H.name]: w
+              }
+            })
+          ];
+        }
+      }, []) || [],
+      minimum_should_match: 1
+    }
+  };
+}
+const zn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: Un,
+  toOpenSearchQuery: Mn
+}, Symbol.toStringTag, { value: "Module" }));
+function Fn(s) {
+  return {
+    arguments: s
+  };
+}
+function Qn(s, r, o = {}, i = {}) {
+  return {
+    bool: {
+      filter: (s.arguments || []).map((t) => N(t, r, o, i))
+    }
+  };
+}
+const In = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: Fn,
+  toOpenSearchQuery: Qn
+}, Symbol.toStringTag, { value: "Module" }));
+function Hn(s) {
+  return {
+    arguments: s
+  };
+}
+function qn(s, r, o = {}, i = {}) {
+  return {
+    bool: {
+      should: (s.arguments || []).map((t) => N(t, r, o, i)),
+      minimum_should_match: 1
+    }
+  };
+}
+const Wn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: Hn,
+  toOpenSearchQuery: qn
+}, Symbol.toStringTag, { value: "Module" }));
+function Yn(s) {
+  return {
+    arguments: [s]
+  };
+}
+function Kn(s, r, o = {}, i = {}) {
+  const [c] = s.arguments;
+  return {
+    bool: {
+      must_not: N(c, r, o, i)
+    }
+  };
+}
+const Zn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: Yn,
+  toOpenSearchQuery: Kn
+}, Symbol.toStringTag, { value: "Module" }));
+function Xn(s, ...r) {
+  let o = {};
+  for (let i of r)
+    o[i] = s[i];
+  return o;
+}
+function Gn(s, r) {
+  const o = Xn(r, "gt", "lt", "gte", "lte", "format"), i = typeof s == "string" ? Oe(s) : ne.literal.buildNode(s), c = Object.entries(o).map((t) => {
+    let [p, b] = t;
+    return ne.namedArg.buildNode(p, b);
+  });
+  return {
+    arguments: [i, ...c]
+  };
+}
+function Jn(s, r, o = {}, i = {}) {
+  const [c, ...t] = s.arguments, p = qs(
+    c,
+    r,
+    i != null && i.nested ? i.nested.path : void 0
+  ), b = r ? sr(p, r) : [], g = Vn(t), w = Object.fromEntries(Object.entries(g).map(([_, k]) => [_, N(k)]));
+  return b && b.length === 0 && b.push({
+    name: N(p),
+    scripted: !1,
+    type: ""
+  }), {
+    bool: {
+      should: b.map((_) => {
+        const k = (S) => {
+          var j;
+          return p.type !== "wildcard" || !((j = _.subType) != null && j.nested) || i.nested ? S : {
+            nested: {
+              path: _.subType.nested.path,
+              query: S,
+              score_mode: "none"
+            }
+          };
+        };
+        if (_.scripted)
+          return {};
+        if (_.type === "date") {
+          const S = o.dateFormatTZ ? { time_zone: o.dateFormatTZ } : {};
+          return k({
+            range: {
+              [_.name]: {
+                ...w,
+                ...S
+              }
+            }
+          });
+        }
+        return k({
+          range: {
+            [_.name]: w
+          }
+        });
+      }),
+      minimum_should_match: 1
+    }
+  };
+}
+function Vn(s) {
+  if (s.gt && s.gte || s.lt && s.lte)
+    throw new Error("range ends cannot be both inclusive and exclusive");
+  const r = ["gte", "lte", "format"];
+  return s.reduce((o, i, c) => (i.type === "namedArg" ? o[i.name] = i.value : o[r[c]] = i, o), {});
+}
+const ea = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: Gn,
+  toOpenSearchQuery: Jn
+}, Symbol.toStringTag, { value: "Module" }));
+function ta(s) {
+  return {
+    arguments: [Se(s)]
+  };
+}
+function ra(s, r, o = {}, i = {}) {
+  const {
+    arguments: [c]
+  } = s, t = {
+    ...c,
+    value: i != null && i.nested ? `${i.nested.path}.${c.value}` : c.value
+  }, p = tr(t), b = ((r == null ? void 0 : r.fields) || []).find((g) => g.name === p);
+  if (b && b.scripted)
+    throw new Error("Exists query does not support scripted fields");
+  return {
+    exists: { field: p }
+  };
+}
+const sa = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: ta,
+  toOpenSearchQuery: ra
+}, Symbol.toStringTag, { value: "Module" }));
+function ia(s, r) {
+  return {
+    arguments: [typeof s == "string" ? Oe(s) : Se(s), r]
+  };
+}
+function oa(s, r, o = {}, i = {}) {
+  var g;
+  const [c, t] = s.arguments, p = N(c), b = (g = i == null ? void 0 : i.nested) != null && g.path ? `${i.nested.path}.${p}` : p;
+  return {
+    nested: {
+      path: b,
+      query: N(t, r, o, {
+        ...i,
+        nested: { path: b }
+      }),
+      score_mode: "none"
+    }
+  };
+}
+const na = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNodeParams: ia,
+  toOpenSearchQuery: oa
+}, Symbol.toStringTag, { value: "Module" })), ir = {
+  is: zn,
+  and: In,
+  or: Wn,
+  not: Zn,
+  range: ea,
+  exists: sa,
+  nested: na
+};
+function aa(s, ...r) {
+  const o = ir[s];
+  if (o === void 0)
+    throw new Error(`Unknown function "${s}"`);
+  return {
+    type: "function",
+    function: s,
+    // This requires better typing of the different typings and their return types.
+    // @ts-ignore
+    ...o.buildNodeParams(...r)
+  };
+}
+function ca(s, r) {
+  if (ir[s] === void 0)
+    throw new Error(`Unknown function "${s}"`);
+  return {
+    type: "function",
+    function: s,
+    arguments: r
+  };
+}
+function la(s, r, o, i) {
+  return ir[s.function].toOpenSearchQuery(s, r, o, i);
+}
+const ua = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNode: aa,
+  buildNodeWithArgumentNodes: ca,
+  toOpenSearchQuery: la
+}, Symbol.toStringTag, { value: "Module" }));
+function pa(s, r) {
+  const o = r.type === "literal" ? r : ne.literal.buildNode(r);
+  return {
+    type: "namedArg",
+    name: s,
+    value: o
+  };
+}
+function da(s) {
+  return N(s.value);
+}
+const fa = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  buildNode: pa,
+  toOpenSearchQuery: da
+}, Symbol.toStringTag, { value: "Module" })), ne = {
+  // This requires better typing of the different typings and their return types.
+  // @ts-ignore
+  function: ua,
+  literal: Tn,
+  namedArg: fa,
+  wildcard: Bn
+}, ha = ee, ba = (s, r) => "(" + (s.arguments || []).map((i) => be(i, r)).join(" AND ") + ")", ga = (s, r) => {
+  var {
+    arguments: [o, i, c]
+  } = s;
+  let t = "=";
+  i.type === "wildcard" && (t = "");
+  let p = be(i);
+  c = c.value || typeof p == "string", i.type === "literal" && c && (p = `'${p}'`), i.type === "literal" && !c && (p = `${p}`);
+  let b = be(o);
+  return b == null ? r && c ? `(${r.filter((g) => g.type === "string").map((g) => `${g.name} ILIKE '%${i.value}%'`).join(" OR ")})` : r && !c && (i.value === !0 || i.value === !1) ? `(${r.filter((g) => g.type === "boolean").map((g) => `${g.name}=${i.value}`).join(" OR ")})` : "" : b + t + p;
+}, va = (s, r) => "(" + (s.arguments || []).map((i) => be(i, r)).join(" OR ") + ")", ya = (s, r) => {
+  const [o] = s.arguments;
+  return "NOT (" + be(o, r) + ")";
+}, ma = {
+  gt: ">",
+  lt: "<",
+  gte: ">=",
+  lte: "<="
+}, $a = (s) => {
+  const [r, o] = s.arguments;
+  let i = o.value;
+  const c = ma[o.name];
+  let t = be(i);
+  return i.type === "literal" && (t = `${t}`), `${r.value} ${c} ${t}`;
+}, _a = (s) => {
+  const [r] = s.arguments;
+  return `${r.value} IS NOT NULL`;
+}, wa = (s) => (console.warn("Nested types dont exist in CQL", s), ""), xa = {
+  is: ga,
+  and: ba,
+  or: va,
+  not: ya,
+  range: $a,
+  exists: _a,
+  nested: wa
+}, Aa = {
+  function: (s, r) => xa[s.function](s, r),
+  literal: (s) => s.value,
+  wildcard: (s) => {
+    const { value: r } = s;
+    return ` LIKE '${r.split(ha).join("%")}'`;
+  }
+}, be = (s, r) => {
+  const o = Aa[s.type];
+  return o(s, r);
+}, ka = ee, Sa = (s) => ({ $and: (s.arguments || []).map((i) => ae(i)) }), Ca = (s) => {
+  const {
+    arguments: [r, o]
+  } = s;
+  let i = ae(o);
+  if (o.type === "wildcard" && o.value === "@kuery-wildcard@")
+    return Ws(s);
+  let t = {};
+  return t[ae(r)] = { $eq: i }, t;
+}, Ea = (s) => ({
+  $or: (s.arguments || []).map((o) => ae(o))
+}), Oa = (s) => {
+  const [r] = s.arguments;
+  let o = {};
+  return o = { $ne: ae(r) }, o;
+}, Ta = {
+  gt: "$gt",
+  lt: "$lt",
+  gte: "$gte",
+  lte: "$lte"
+}, Pa = (s) => {
+  const [r, o] = s.arguments;
+  let i = o.value;
+  const c = Ta[o.name];
+  let t = ae(i), p = {};
+  return p[r.value] = {}, p[r.value][c] = t, p;
+}, Ws = (s) => {
+  const [r] = s.arguments;
+  return { [ae(r)]: { $ne: null } };
+}, La = (s) => (console.warn("TODO Implement nested search", s), ""), Na = {
+  is: Ca,
+  and: Sa,
+  or: Ea,
+  not: Oa,
+  range: Pa,
+  exists: Ws,
+  nested: La
+}, Da = {
+  function: (s) => Na[s.function](s),
+  literal: (s) => s.value,
+  wildcard: (s) => {
+    const { value: r } = s;
+    return `/${r.split(ka).join(".*")}/`;
+  }
+}, ae = (s, r) => {
+  const o = Da[s.type];
+  return o(s, r);
+}, ja = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  DQLSyntaxError: Is,
+  doesKueryExpressionHaveLuceneSyntaxError: Pn,
+  fromKueryExpression: gt,
+  fromLiteralExpression: Oe,
+  nodeTypes: ne,
+  parse: gt,
+  toCql: be,
+  toDSL: N,
+  toMongo: ae,
+  toOpenSearchQuery: N
+}, Symbol.toStringTag, { value: "Module" })), Ra = K`
+:host {
+    --dialog-padding: var(--spectric-dialog-padding, 5px);
+    --dialog-background:var(--spectric-background,rgb(246, 249, 252));
+}
+dialog {
+    border: 0px solid var(--background-inverse);
+    --spectric-background: var(--dialog-background);
+    --panel-color:var(--dialog-background);
+    padding: 0;
+    border-radius: var(--spectric-border-radius);
+    overflow:hidden;
+
+}
+dialog[open]{
+    display:flex;
+}
+spectric-panel{
+    margin:0px
+}
+dialog::backdrop {
+    background-color: transparent;
+}
+dialog.backdrop::backdrop {
+    background-color: rgba(0, 0, 0, 0.5);
+}
+.modal{
+    display: flex;
+    overflow: hidden;
+    flex-direction: column;
+    height: 100%;
+}
+.content{
+    flex-shrink: 1;
+    overflow: auto;
+}
+
+h3 {
+    padding: 1em var(--dialog-padding);
+    margin: 0;
+}
+
+spectric-button{
+    position: absolute;
+    right: 0;
+    top: 0;
+}
+`;
+var Ba = Object.defineProperty, Ua = Object.getOwnPropertyDescriptor, ce = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? Ua(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && Ba(r, o, c), c;
+};
+const Ys = "spectric-dialog";
+let F = class extends L {
+  constructor() {
+    super(...arguments), this.open = !1, this.dismissable = !0, this.hideBackdrop = !1, this.title = "", this.closeOnEscape = !0, this.closeOnOutsideClick = !0, this.clickHandler = async (s) => {
+      const r = await this.dialogElement;
+      !this.dismissable || !this.closeOnOutsideClick || r === s.target && (this.open = !1);
+    }, this._handleKeyDown = (s) => {
+      this.closeOnEscape || s.preventDefault(), this.open && this.closeOnEscape && s.key === "Escape" && (this.open = !1);
+    }, this._onClose = (s) => {
+      s.preventDefault(), s.stopPropagation(), this.open = !1, this.dispatchEvent(new CustomEvent("close", {
+        bubbles: !0,
+        composed: !0
+      }));
+    };
+  }
+  static display(s, r) {
+    let o = document.createElement(Ys);
+    o.addEventListener("close", () => {
+      o.remove();
+    });
+    for (let c in s)
+      o[c] = s[c];
+    let i = document.createDocumentFragment();
+    return Ns(r, i), o.appendChild(i), o.open = !0, document.body.appendChild(o), o;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.dialogElement.then((s) => s.addEventListener("keydown", this._handleKeyDown));
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.dialogElement.then((s) => s.removeEventListener("keydown", this._handleKeyDown));
+  }
+  updated(s) {
+    s.has("open") && this.dialogElement.then((r) => {
+      this.open ? r.showModal() : r.close();
+    });
+  }
+  render() {
+    return A`
+            <dialog class=${this.hideBackdrop ? "" : "backdrop"} @close=${this._onClose} @click=${this.clickHandler}>
+                <spectric-panel>
+                    <div class="modal">
+                    ${this.dismissable ? A`<spectric-button variant="text" size="small" @click=${() => {
+      this.open = !1;
+    }}>X</spectric-button>` : null}
+                        <h3 >
+                            <slot name="title">
+                                ${this.title.length ? this.title : null}
+                            </slot>
+                        </h3>
+
+                        <div class="content"><slot></slot></div>
+                        <div class="footer"><slot name="footer"></slot></div>
+                    </div>
+                </spectric-panel>
+            </dialog>
+        `;
+  }
+};
+F.styles = Ra;
+ce([
+  v({ type: Boolean, reflect: !0 })
+], F.prototype, "open", 2);
+ce([
+  v({ type: Boolean, reflect: !0 })
+], F.prototype, "dismissable", 2);
+ce([
+  v({ type: Boolean, reflect: !0 })
+], F.prototype, "hideBackdrop", 2);
+ce([
+  v({ type: String, reflect: !0 })
+], F.prototype, "title", 2);
+ce([
+  v({ type: Boolean, reflect: !0 })
+], F.prototype, "closeOnEscape", 2);
+ce([
+  v({ type: Boolean, reflect: !0 })
+], F.prototype, "closeOnOutsideClick", 2);
+ce([
+  $t("dialog")
+], F.prototype, "dialogElement", 2);
+F = ce([
+  I(Ys)
+], F);
+var Ma = Object.defineProperty, za = Object.getOwnPropertyDescriptor, X = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? za(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && Ma(r, o, c), c;
+}, Fa = /* @__PURE__ */ ((s) => (s.MONGO = "toMongo", s.CQL = "toCql", s.DSL = "toDSL", s.AST = "AST", s))(Fa || {});
+const Ks = {
+  eq: { value: " : ", label: " equals some value" },
+  gt: { value: " > ", label: " is greater than some value" },
+  lt: { value: " < ", label: " is less than some value" },
+  gte: { value: " >= ", label: " is greater than or equal to some value" },
+  lte: { value: " <= ", label: " is less than or equal to some value" }
+}, Qa = {
+  eq: { value: ": ", label: " equals some value" },
+  exists: { value: ": *", label: " exists in any form" }
+}, Ia = [
+  { value: ": true", label: " value is true" },
+  { value: ": false", label: "value is false" }
+], Ha = Object.fromEntries(Object.entries(Ks).map(([s, r]) => [s, { value: r.value, label: (r.label || "").replace("value", "date-time") }]));
+let Q = class extends L {
+  constructor() {
+    super(), this.placeholder = "", this._value = "", this.outputLanguage = "AST", this.completions = [], this.completionIndex = 0, this.fields = [], this._parseQuery = (s = void 0) => {
+      let r;
+      if (this.value == "")
+        return;
+      try {
+        s && s.data == "(" && (this.value = this.value + " )", this._input.setSelectionRange(this.value.length - 2, this.value.length - 2));
+        let c = this.value;
+        this._input.selectionStart !== null && (c = c.substring(0, this._input.selectionStart) + "@kuery-cursor@" + c.substring(this._input.selectionStart));
+        let t = gt(c, { parseCursor: !0, cursorSymbol: "@kuery-cursor@", allowLeadingWildcards: !1 });
+        this.autoComplete(t), r = gt(this.value, { allowLeadingWildcards: !1 });
+      } catch {
+        return;
+      }
+      let o;
+      this.outputLanguage == "AST" ? o = r : o = ja[this.outputLanguage](r, this.fields);
+      let i = new CustomEvent("change", { detail: o });
+      this.dispatchEvent(i);
+    }, this.getValuesForField = async (s, r) => (console.log("getValuesForField isn't set no values returned", s, r), []), this._selectCompletion = async () => {
+      if (!this.suggestion)
+        return;
+      let s = this.completions[this.completionIndex], r = this.value.substring(0, s.start) + s.value, o = r.length, i = this.value.substring(s.end);
+      if (s.value.includes(i) ? this.value = r : this.value = r + this.value.substring(s.end), this._input.setSelectionRange(o, o), s.onSelect) {
+        let c = await s.onSelect();
+        c !== void 0 && (this.value += c);
+      }
+      this.completionIndex = 0, this.completions = [], this._parseQuery();
+    }, this._handleArrows = (s) => {
+      var r;
+      s.key === "Escape" && (this.completions = []), (s.key == "ArrowLeft" || s.key === "ArrowRight") && setTimeout(this._parseQuery, 100), this.completions.length && ["ArrowUp", "ArrowDown", "Enter", "Tab"].includes(s.key) && this.suggestion && (s.preventDefault(), (s.key === "ArrowDown" || s.key === "Tab") && (this.completionIndex += 1, this.completionIndex > this.completions.length - 1 && (this.completionIndex = 0)), s.key === "ArrowUp" && (this.completionIndex -= 1, this.completionIndex < 0 && (this.completionIndex = this.completions.length - 1)), (r = this._asyncAutocomplete) == null || r.then((o) => {
+        let i = o.querySelector(".option.active");
+        i && i.scrollIntoView({ block: "nearest" });
+      }), s.key === "Enter" && this._selectCompletion());
+    }, this.uuid = crypto.randomUUID();
+  }
+  createRenderRoot() {
+    return this;
+  }
+  get value() {
+    return this._input ? String(this._input.value) : this._value;
+  }
+  set value(s) {
+    const r = this._value;
+    this._value = s, this.requestUpdate("value", r), this._input && (this._input.value = String(s));
+  }
+  async autoComplete(s) {
+    if (this.completions = [], s.type !== "cursor")
+      return;
+    let r = [];
+    this.suggestion = s;
+    let { start: o, end: i } = s;
+    for (let c of s.suggestionTypes) {
+      if (c == "conjunction" && s.text.endsWith(" ") && r.push(...["and ", "or "].map((t) => ({ type: c, value: t, start: i, end: i }))), c === "field") {
+        let t = this.fields.filter((p) => p.name.includes(s.fieldName) || p.name.includes(s.prefix)).map((p) => [{ type: c, value: p.name, start: o, end: i }]).flat();
+        r.push(...t);
+      }
+      if (c === "operator") {
+        let t = this.fields.find((p) => p.name === s.fieldName);
+        t && (t.type === "number" ? r.push(...Object.values(Ks).map((p) => ({ type: c, ...p, start: i, end: i }))) : t.type === "string" ? t.format === "date-time" ? r.push(...Object.values(Ha).map((p) => ({
+          type: c,
+          ...p,
+          start: i,
+          end: i,
+          onSelect: async () => {
+            let b = await this.getValuesForField(s.fieldName, s.prefix);
+            b.length === 0 && (b = ["now-1m", "now-1d", "now-1M"]);
+            let g, w = ut();
+            return await new Promise((x) => {
+              let _ = F.display({}, A`
+                    <div class="query-bar-date-quick-select">
+                    ${b.map((k) => A`<a href="#" @click=${(S) => {
+                S.preventDefault(), g = `"${k}"`, x(g), _.open = !1;
+              }}>${k}</a>`)}
+                    </div>
+                  <spectric-input variant="datetime-local" @change=${(k) => {
+                if (!k.target)
+                  return;
+                g = `"${(/* @__PURE__ */ new Date(k.target.value + ":00.000Z")).toISOString()}"`, w.value.disabled = g === void 0;
+              }}></spectric-input>
+              <spectric-button ${pt(w)} .disabled=${!0} @click=${() => {
+                x(g), _.open = !1;
+              }}>Submit</spectric-button>
+              `);
+            }), g;
+          }
+        }))) : r.push(...Object.values(Qa).map((p) => ({ type: c, ...p, start: i, end: i }))) : t.type === "boolean" && r.push(...Ia.map((p) => ({ type: c, ...p, start: i, end: i }))));
+      }
+      if (c === "value") {
+        let t = this.fields.find((p) => p.name === s.fieldName);
+        if (t && t.type == "boolean")
+          r.push({ type: c, value: "true", start: o, end: i }, { type: c, value: "false", start: o, end: i });
+        else {
+          console.log(`invoke callback to get values for ${s.fieldName}`);
+          let p = await this.getValuesForField(s.fieldName, s.prefix);
+          (t == null ? void 0 : t.type) === "string" && (p = p.map((b) => `"${b}"`)), r.push(...p.map((b) => ({ type: c, value: b, start: o, end: i })));
+        }
+      }
+    }
+    if (this.completions = r, this.completions.length && this._autocomplete) {
+      let { width: c, left: t, bottom: p } = this._input.getBoundingClientRect();
+      this._autocomplete.showPopover(), "anchorName" in document.documentElement.style || (this._autocomplete.style.left = `${t + 3.75}px`, this._autocomplete.style.top = `${p}px`), this._autocomplete.style.width = `${c - 15}px`;
+    }
+  }
+  updated(s) {
+    s.has("outputLanguage") && this._parseQuery();
+  }
+  render() {
+    return A`
+      <spectric-input .placeholder=${this.placeholder} style=${`anchor-name:--${this.uuid};`} autocomplete="off" @input=${this._parseQuery} @keydown=${this._handleArrows} @change=${(s) => s.stopPropagation()}></spectric-input>
+      <div class="autocomplete" popover style=${`position-anchor: --${this.uuid};`}>
+      ${this.completions.map(
+      (s, r) => A`<div @click=${() => {
+        this.completionIndex = r, this._selectCompletion();
+      }} class=${this.completionIndex == r ? "option active" : "option"}><span class="optiontype ${s.type}">${s.type}</span> <span class="value">${s.value}</span> <span class="label">${s.label}</span></span> </div></div>`
+    )}
+      </div>`;
+  }
+};
+X([
+  v({ type: String, reflect: !0 })
+], Q.prototype, "placeholder", 2);
+X([
+  v({ type: String, reflect: !0 })
+], Q.prototype, "value", 1);
+X([
+  v({ type: String, reflect: !0 })
+], Q.prototype, "outputLanguage", 2);
+X([
+  mt()
+], Q.prototype, "completions", 2);
+X([
+  mt()
+], Q.prototype, "completionIndex", 2);
+X([
+  v({ type: Array, reflect: !0 })
+], Q.prototype, "fields", 2);
+X([
+  We(".autocomplete")
+], Q.prototype, "_autocomplete", 2);
+X([
+  $t(".autocomplete")
+], Q.prototype, "_asyncAutocomplete", 2);
+X([
+  We("spectric-input")
+], Q.prototype, "_input", 2);
+Q = X([
+  I("spectric-query")
+], Q);
+const As = K`
+    border-color: color-mix(in hsl, var(--panel-color, #0b0b0b), var(--spectric-input-color, #000000) 3%);
+    background-color: var(--panel-color,#0b0b0b);
+    --spectric-input-color: var(--spectric-background);
+    color:var(--text-secondary,#3c4c5b);
+    --spectric-text-primary:var(--text-primary);
+    --spectric-text-secondary:var(--text-secondary);
+    filter: drop-shadow(0px 1px 3px color-mix(in srgb, var(--text-secondary, #3c4c5b), transparent 50%));
+`, ks = K`
+    border-color: color-mix(in hsl, var(--panel-color-inverse,#f4f4f4), var(--spectric-input-color, #000000) 3%);
+    background-color: var(--panel-color-inverse,#0b0b0b);
+    color:var(--text-primary,#3c4c5b);
+    --spectric-input-color: var(--panel-color);
+    --spectric-text-primary:var(--text-secondary);
+    --spectric-text-secondary:var(--text-primary);
+    filter: drop-shadow(0px 1px 3px color-mix(in srgb, var(--text-primary, #3c4c5b), transparent 70%));
+    `, qa = K`
+:host{
+    display:block;
+    border:2px solid black;
+    margin: 5px;
+    border-radius:var(--spectric-border-radius,0.4em);
+    padding: calc(var(--spectric-border-radius,0.4em) + 2px);
+
+}
+:host(spectric-panel[level='0']) {
+    ${As};
+}
+
+:host(spectric-panel[level='1']) {
+   ${ks};
+}
+
+:host(spectric-panel[level='2']) {
+    ${As};
+}
+:host(spectric-panel[level='3']) {
+    ${ks};
+}
+`;
+var Wa = Object.defineProperty, Ya = Object.getOwnPropertyDescriptor, or = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? Ya(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && Wa(r, o, c), c;
+};
+let He = class extends L {
+  constructor() {
+    super(...arguments), this.level = 0;
+  }
+  updated() {
+    this.layers || (this.layers = this.querySelectorAll(
+      "spectric-panel"
+    )), this.layers.forEach((s) => {
+      s.setAttribute(
+        "level",
+        ((this.level + 1) % 4).toString()
+      );
+    }), this.dispatchEvent(
+      new CustomEvent("use-layer", {
+        bubbles: !0,
+        cancelable: !0,
+        composed: !0,
+        detail: {
+          layer: this,
+          level: this.level
+        }
+      })
+    );
+  }
+  render() {
+    return A` <slot></slot> `;
+  }
+};
+He.styles = qa;
+or([
+  v({ type: Number, reflect: !0 })
+], He.prototype, "level", 2);
+or([
+  v({ attribute: !1 })
+], He.prototype, "layers", 2);
+He = or([
+  I("spectric-panel")
+], He);
+var Ka = Object.defineProperty, Za = Object.getOwnPropertyDescriptor, Zs = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? Za(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && Ka(r, o, c), c;
+};
+const ac = {
+  "--primary": { control: "color" },
+  "--secondary": { control: "color" },
+  "--tertiary": { control: "color" },
+  "--disabled": { control: "color" },
+  "--background": { control: "color" },
+  "--background-inverse": { control: "color" },
+  "--text-primary": { control: "color" },
+  "--text-secondary": { control: "color" },
+  "--text-on-color": { control: "color" },
+  "--border-radius": { control: "text" }
+}, Xs = {
+  "--secondary": "#77878b",
+  "--tertiary": "#c7c7c7",
+  "--disabled": "#000000",
+  "--text-primary": "#cccccc",
+  "--text-secondary": "#cccccc",
+  "--text-on-color": "#ededed",
+  "--background": "#181818",
+  "--background-inverse": "#37373d"
+}, Ss = {
+  ...Xs,
+  "--primary": "#ffd45a",
+  "--text-on-color": "#4f4f4f"
+}, Zt = {
+  undefined: {},
+  light: {},
+  dark: Xs,
+  spectric: Ss,
+  spectricFlat: {
+    ...Ss,
+    "--border-radius": "1px"
+  }
+}, cc = Object.fromEntries(Object.keys(Zt).map((s) => [s, s])), Xa = `
+    --spectric-background: var(--background,#ffffff);
+    --spectric-background-hover:var(--background-hover,rgba(141, 141, 141, 0.12));
+    --spectric-background-inverse: var(--background-inverse,#f4f4f4);
+    --spectric-background-inverse-hover: var(--background-inverse-hover,#474747);
+    --spectric-border-radius: var(--border-radius,.4em);
+    --spectric-primary:var(--primary,#1ea7fd);
+    --spectric-secondary: var(--secondary,#77878b);
+    --spectric-tertiary: var(--tertiary,#0f62fe);
+    --spectric-disabled: var(--disabled,#c6c6c6);
+
+        /* panel */
+    --panel-color:var(--spectric-background-inverse);
+    --panel-color-inverse:var(--spectric-background);
+    --spectric-border-disabled: var(--disabled);
+
+    /*inputs*/
+    --spectric-input-color: var(--panel-color-inverse);
+    --spectric-input-bottom: var(--panel-color);
+
+    --spectric-text-on-color: var(--text-on-color,#ffffff);
+    --spectric-text-on-color-disabled: var(--text-on-color-disabled,#8d8d8d);
+    --spectric-text-placeholder: var(--text-placeholder,rgba(22, 22, 22, 0.4));
+    --spectric-text-primary: var(--text-primary,#161616);
+    --spectric-text-secondary: var(--text-secondary,#525252);
+    /* Buttons */
+    --spectric-button-separator: #e0e0e0;
+    --spectric-button-primary: var(--primary,#1ea7fd);
+    --spectric-button-secondary: var(--secondary,#77878b);
+    --spectric-button-tertiary: var(--tertiary);
+    --spectric-button-danger-primary: #da1e28;
+    --spectric-button-danger-secondary: #da1e28;
+    --spectric-button-danger-active: #750e13;
+    --spectric-button-primary-active: #002d9c;
+    --spectric-button-secondary-active: #6f6f6f;
+    --spectric-button-tertiary-active: #002d9c;
+    --spectric-button-danger-hover: #b81921;
+    --spectric-button-primary-hover: #0050e6;
+    --spectric-button-secondary-hover: #474747;
+    --spectric-button-tertiary-hover: #0050e6;
+    --spectric-text-on-color-disabled: var(--disabled,#c6c6c6)
+    --spectric-button-disabled: #c6c6c6;
+    color: var(--spectric-text-primary);
+    `;
+let vt = class extends L {
+  constructor() {
+    super(...arguments), this.theme = "undefined";
+  }
+  updated(s) {
+    if (s.has("theme") && this.theme != s.get("theme")) {
+      const r = {
+        old: s.get("theme"),
+        new: this.theme
+      };
+      this.dispatchEvent(new CustomEvent("theme-change", { detail: r, bubbles: !0, composed: !0 }));
+    }
+  }
+  render() {
+    let s = Object.keys(Zt).includes(this.theme) ? this.theme : "undefined", r = Object.entries(
+      Zt[s]
+    ).map((o) => `${o[0]}:${o[1]};`).join(`
+`);
+    return A`
+    ${this.theme && this.theme !== "light" ? A`
+    <style>:host{
+        ${r};
+        ${Xa}
+        }
+        /* Webkit psudo elements don't pick up variables defined by the host */
+::-webkit-scrollbar-thumb {
+    background: var(--spectric-background-inverse,#393939);
+    border-radius: var(--spectric-border-radius,4em);
+    -webkit-border-radius: var(--spectric-border-radius,4em);
+    padding-top: 1px;
+    padding-bottom: 1px;
+}
+::-webkit-scrollbar-thumb:hover {
+    background: var(--spectric-background-inverse-hover,#474747);
+
+}
+::-webkit-scrollbar-corner {
+    background: var(--spectric-background, #ffffff);
+}
+/* Buttons */
+
+::-webkit-scrollbar-button:single-button {
+  background-color: transparent;
+  display: block;
+  border-style: solid;
+}
+/* Up */
+::-webkit-scrollbar-button:single-button:vertical:decrement {
+  border-width: 0 5px 5px 5px;
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff);
+}
+::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
+  border-color: var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse-hover,#474747) var(--spectric-background, #ffffff);
+}
+/* Down */
+::-webkit-scrollbar-button:single-button:vertical:increment {
+  border-width: 5px 5px 0 5px;
+  border-color: var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+::-webkit-scrollbar-button:vertical:single-button:increment:hover {
+  border-color: var(--spectric-background-inverse-hover,#474747) var(--spectric-background, #ffffff) transparent var(--spectric-background, #ffffff);
+}
+
+/* Left */
+::-webkit-scrollbar-button:single-button:horizontal:decrement {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
+    border-width: 5px 5px 5px 0;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background-inverse-hover,#474747) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff);
+
+}
+
+
+
+/* Right */
+::-webkit-scrollbar-button:single-button:horizontal:increment {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse,#393939);
+
+}
+
+::-webkit-scrollbar-button:single-button:horizontal:increment:hover {
+    border-width: 5px 0 5px 5px;
+    border-color:var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background, #ffffff) var(--spectric-background-inverse-hover,#474747);
+
+}
+</style>` : null}
+    <slot></slot>
+  `;
+  }
+};
+vt.styles = K`:host{
+    display:contents;
+}`;
+Zs([
+  v({ reflect: !0 })
+], vt.prototype, "theme", 2);
+vt = Zs([
+  I("spectric-theme")
+], vt);
+const Ga = K`
+    :host {
+      display: block;
+      height: 100%;
+      width: 100%;
+
+    }
+    .split-view {
+      display: flex;
+      height: 100%;
+      width: 100%;
+      position:relative;
+    }
+    .split-view.active{
+      cursor:ew-resize;
+    }
+    .split-view.active.vertical{
+      cursor:ns-resize;
+    }
+    .split-view.vertical {
+      flex-direction: column;
+    }
+    .panel {
+      flex: 1;
+      overflow: auto;
+    }
+    .splitter {
+      border-radius: var(--spectric-border-radius, .4em);
+      background-color:  var(--spectric-input-color,#ccc);
+      user-select: none;
+      transition: background-color 100ms linear;
+    }
+    
+    .splitter.invisible {
+      background-color: #00000000;
+    }
+    .splitter:hover {
+      background-color: var(--spectric-button-primary, #1ea7fd);
+      transition: background-color 500ms linear;
+    }
+    .splitter.active {
+      background-color: var(--spectric-button-primary, #1ea7fd);
+      transition: background-color 500ms linear;
+    }
+    .split-view > .error-display{
+        display:none;
+        position:absolute;
+        top:0;
+        right:0
+    }
+    .split-view.error > .error-display{
+        display:inline-block;
+
+    }
+    .split-view.vertical .splitter {
+      cursor: ns-resize;
+      height: 5px;
+      width: 100%;
+    }
+    .split-view:not(.vertical) .splitter {
+      width: 5px;
+      cursor: ew-resize;
+    }
+  `;
+var Ja = Object.defineProperty, Va = Object.getOwnPropertyDescriptor, U = (s, r, o, i) => {
+  for (var c = i > 1 ? void 0 : i ? Va(r, o) : r, t = s.length - 1, p; t >= 0; t--)
+    (p = s[t]) && (c = (i ? p(r, o, c) : p(c)) || c);
+  return i && c && Ja(r, o, c), c;
+}, ec = /* @__PURE__ */ ((s) => (s.horizontal = "horizontal", s.vertical = "vertical", s))(ec || {});
+const tc = "spectric-splitview";
+let D = class extends Fs {
+  constructor() {
+    super(), this.orientation = "horizontal", this.percentage = 50, this.invisible = !1, this.min = 10, this.max = 90, this.useSavedState = !0, this.isDragging = !1, this._error = !1, this._emitChange = () => {
+      let { percentage: r, orientation: o, invisible: i, min: c, max: t, useSavedState: p } = this, b = this.getAttribute("id");
+      b && this.useSavedState && localStorage.setItem(`splitview-${b}`, String(r)), this.dispatchEvent(new CustomEvent("change", { detail: { orientation: o, percentage: r, invisible: i, min: c, max: t, useSavedState: p } }));
+    }, this._onMouseMove = Qs((r) => {
+      if (this.isDragging) {
+        const o = this.getBoundingClientRect();
+        let i, c;
+        this.orientation === "horizontal" ? (i = r.clientX - o.left, c = i / o.width * 100) : (i = r.clientY - o.top, c = i / o.height * 100), c = Math.min(Math.max(c, this.min), this.max), this.percentage = c, this._emitChange();
+      }
+    }), this._assignSlot = (r) => {
+      if (!r.target)
+        return;
+      let i = r.target.assignedNodes().filter((c) => c instanceof HTMLElement);
+      i.length > 2 && console.log("cannot assign more than 2 elements to a split view"), i.forEach(
+        (c) => {
+          if (this._panel1.assignedNodes().length === 0) {
+            c.slot = "panel1";
+            return;
+          }
+          if (this._panel2.assignedNodes().length === 0) {
+            c.slot = "panel2";
+            return;
+          }
+          this._error = "Too many element assigned to split view splitter can only have a maximum of 2 children", console.warn("Too many element assigned to split view splitter can only have a maximum of 2 children");
+        }
+      );
+    };
+    let s = this.getAttribute("id");
+    if (s && this.useSavedState) {
+      let r = localStorage.getItem(`splitview-${s}`);
+      r && (this.percentage = parseFloat(r));
+    }
+    this.addDisposableListener(this._splitter, "mousedown", () => {
+      this.isDragging = !0;
+    }), this.addDisposableListener(this._splitter, "dblclick", () => {
+      this.percentage = 50, this._emitChange();
+    }), this.addDisposableListener(document.body, "mousemove", this._onMouseMove), this.addDisposableListener(document.body, "mouseup", () => {
+      this.isDragging = !1;
+    });
+  }
+  updated(s) {
+    s.has("percentage") && (this.percentage = Math.min(Math.max(Number(this.percentage), this.min), this.max));
+  }
+  render() {
+    return A`
+        <div class="split-view ${this.orientation} ${this._error ? "error" : ""} ${this.isDragging ? "active" : ""}" style="--split-percentage: ${this.percentage}%;">
+            <span class="error-display">${this._error}</span>
+            <div class="panel" style="${this.orientation === "horizontal" ? "flex: var(--split-percentage, 50%)" : "max-height: var(--split-percentage, 50%)"}">
+                <slot name="panel1"></slot>
+            </div>
+            <div class="splitter ${this.invisible ? "invisible" : ""} ${this.isDragging ? "active" : ""}"></div>
+            <div class="panel" style="${this.orientation === "horizontal" ? "flex: calc(100% - var(--split-percentage, 50%))" : "max-height: calc(100% - var(--split-percentage, 50%))"}">
+                <slot name="panel2"></slot>
+            </div>
+        </div>
+        <slot @slotchange=${this._assignSlot} style="display:none"></slot>
+    `;
+  }
+};
+D.styles = Ga;
+U([
+  v({ type: String })
+], D.prototype, "orientation", 2);
+U([
+  v({ type: Number, reflect: !0 })
+], D.prototype, "percentage", 2);
+U([
+  v({ type: Boolean })
+], D.prototype, "invisible", 2);
+U([
+  v({ type: Number, reflect: !0 })
+], D.prototype, "min", 2);
+U([
+  v({ type: Number, reflect: !0 })
+], D.prototype, "max", 2);
+U([
+  v({ type: Boolean, reflect: !0 })
+], D.prototype, "useSavedState", 2);
+U([
+  mt()
+], D.prototype, "isDragging", 2);
+U([
+  mt()
+], D.prototype, "_error", 2);
+U([
+  $t(".splitter")
+], D.prototype, "_splitter", 2);
+U([
+  We("slot[name='panel1']")
+], D.prototype, "_panel1", 2);
+U([
+  We("slot[name='panel2']")
+], D.prototype, "_panel2", 2);
+D = U([
+  I(tc)
+], D);
+export {
+  V as BitDisplayCanvas,
+  rn as ButtonSizes,
+  sn as ButtonVariants,
+  ac as CSSPropsControls,
+  F as DialogElement,
+  Ys as DialogElementTag,
+  tc as ElementTag,
+  Ee as Header,
+  Cn as InputVariants,
+  ec as Orientations,
+  J as SpectricButton,
+  E as SpectricInput,
+  B as SpectricPage,
+  He as SpectricPanel,
+  Q as SpectricQuery,
+  vt as SpectricThemeProvider,
+  D as SplitView,
+  Fa as SupportedLanguages,
+  cc as ThemeSelections,
+  ne as nodeTypes
+};
+//# sourceMappingURL=index.es.js.map