@openc3/vue-common 5.21.0-beta0 → 6.0.0

package/dist/Graph-D2frd7mZ.js

@@ -1,1999 +0,0 @@
-import { T as K } from "./timeFilters-CN3Tdo2Z.js";
-import { resolveComponent as m, openBlock as y, createBlock as T, withKeys as X, withCtx as n, createVNode as i, createElementVNode as b, createTextVNode as h, createElementBlock as R, Fragment as F, renderList as j, mergeProps as x, toDisplayString as E, createCommentVNode as S, withDirectives as C, normalizeClass as J, vShow as M, normalizeProps as Q, guardReactiveProps as $ } from "vue";
-import { i as ee, g as te, r as ie, u as I } from "./UpgradeToEnterpriseDialog.vue_vue_type_style_index_0_scoped_6fa47877_lang-BrapmXxi.js";
-import { _ as W } from "./CosmosRuxIcon.vue_vue_type_style_index_0_scoped_9af48e85_lang-CHgC5LLL.js";
-import { i as q, t as Z } from "./format-Da42caYw.js";
-import { p as B } from "./parse-dDr1Btat.js";
-const se = {
-  props: {
-    modelValue: Boolean,
-    // modelValue is the default prop when using v-model
-    title: {
-      type: String,
-      required: !0
-    },
-    legendPosition: {
-      type: String,
-      required: !0
-    },
-    items: {
-      type: Array,
-      required: !0
-    },
-    graphMinY: {
-      type: Number
-    },
-    graphMaxY: {
-      type: Number
-    },
-    lines: {
-      type: Array,
-      required: !0
-    },
-    colors: {
-      type: Array,
-      required: !0
-    },
-    startDateTime: {
-      type: Number
-    },
-    endDateTime: {
-      type: Number
-    },
-    timeZone: {
-      type: String,
-      required: !0
-    }
-  },
-  mixins: [K],
-  data: function() {
-    return {
-      tab: 0,
-      graph: {},
-      legendPositions: ["top", "bottom", "left", "right"],
-      startDate: null,
-      startTime: null,
-      endDate: null,
-      endTime: null,
-      lineHeaders: [
-        { title: "Y Value", value: "yValue" },
-        { title: "Color", value: "color" },
-        { title: "Actions", value: "actions", sortable: !1 }
-      ],
-      itemHeaders: [
-        { title: "Target Name", value: "targetName" },
-        { title: "Packet Name", value: "packetName" },
-        { title: "Item Name", value: "itemName" },
-        { title: "Actions", value: "actions", sortable: !1 }
-      ],
-      rules: {
-        date: (t) => {
-          if (!t) return !0;
-          try {
-            return q(B(t, "yyyy-MM-dd", /* @__PURE__ */ new Date())) || "Invalid date (YYYY-MM-DD)";
-          } catch {
-            return "Invalid date (YYYY-MM-DD)";
-          }
-        },
-        time: (t) => {
-          if (!t) return !0;
-          try {
-            return q(B(t, "HH:mm:ss", /* @__PURE__ */ new Date())) || "Invalid time (HH:MM:SS)";
-          } catch {
-            return "Invalid time (HH:MM:SS)";
-          }
-        }
-      }
-    };
-  },
-  computed: {
-    show: {
-      get() {
-        return this.modelValue;
-      },
-      set(t) {
-        this.$emit("update:modelValue", t);
-      }
-    },
-    editItems: function() {
-      if (!this.items) return [];
-      let t = 0;
-      return this.items.map((e) => (t += 1, { ...e, itemId: t }));
-    }
-  },
-  created() {
-    if (this.graph = {
-      title: this.title,
-      legendPosition: this.legendPosition,
-      items: this.items,
-      graphMinY: this.graphMinY,
-      graphMaxY: this.graphMaxY,
-      lines: [...this.lines]
-    }, this.startDateTime) {
-      let t = Z(this.startDateTime / 1e6);
-      this.startDate = this.formatDate(t, this.timeZone), this.startTime = this.formatTimeHMS(t, this.timeZone);
-    } else {
-      let t = /* @__PURE__ */ new Date() - 36e5;
-      this.startDate = this.formatDate(t, this.timeZone), this.startTime = this.formatTimeHMS(t, this.timeZone);
-    }
-    if (this.endDateTime) {
-      let t = Z(this.endDateTime / 1e6);
-      this.endDate = this.formatDate(t, this.timeZone), this.endTime = this.formatTimeHMS(t, this.timeZone);
-    }
-  },
-  methods: {
-    closeOk() {
-      this.startDate && this.startTime ? this.graph.startDateTime = this.startDate + " " + this.startTime : this.graph.startDateTime = null, this.endDate && this.endTime ? this.graph.endDateTime = this.endDate + " " + this.endTime : this.graph.endDateTime = null, this.$emit("ok", this.graph);
-    },
-    addLine() {
-      this.graph.lines.push({ yValue: 0, color: "white" });
-    },
-    removeLine(t) {
-      let e = this.graph.lines.indexOf(t);
-      this.graph.lines.splice(e, 1);
-    }
-  }
-}, le = { class: "edit-box" }, ne = { class: "edit-box" }, ae = { class: "edit-box" }, oe = { class: "edit-box" };
-function re(t, e, s, o, l, a) {
-  const d = m("v-spacer"), r = m("v-toolbar"), p = m("v-tab"), f = m("v-tabs"), v = m("v-text-field"), D = m("v-card-text"), w = m("v-col"), _ = m("v-select"), g = m("v-row"), Y = m("v-tabs-window-item"), O = m("v-btn"), U = m("v-list-item"), k = m("v-icon"), V = m("v-tooltip"), G = m("v-list"), L = m("v-data-table"), P = m("v-tabs-window"), H = m("v-card-actions"), u = m("v-card"), z = m("v-dialog");
-  return y(), T(z, {
-    modelValue: a.show,
-    "onUpdate:modelValue": e[12] || (e[12] = (c) => a.show = c),
-    onKeydown: e[13] || (e[13] = X((c) => t.$emit("cancel"), ["esc"])),
-    "max-width": "700"
-  }, {
-    default: n(() => [
-      i(r, { height: "24" }, {
-        default: n(() => [
-          i(d),
-          e[14] || (e[14] = b("span", null, " Edit Graph ", -1)),
-          i(d)
-        ]),
-        _: 1
-      }),
-      i(u, { class: "pa-3" }, {
-        default: n(() => [
-          i(f, {
-            modelValue: t.tab,
-            "onUpdate:modelValue": e[0] || (e[0] = (c) => t.tab = c),
-            class: "ml-3"
-          }, {
-            default: n(() => [
-              i(p, { value: "0" }, {
-                default: n(() => e[15] || (e[15] = [
-                  h(" Settings ")
-                ])),
-                _: 1
-              }),
-              i(p, { value: "1" }, {
-                default: n(() => e[16] || (e[16] = [
-                  h(" Scale / Lines ")
-                ])),
-                _: 1
-              }),
-              i(p, { value: "2" }, {
-                default: n(() => e[17] || (e[17] = [
-                  h(" Items ")
-                ])),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue"]),
-          i(P, {
-            modelValue: t.tab,
-            "onUpdate:modelValue": e[10] || (e[10] = (c) => t.tab = c)
-          }, {
-            default: n(() => [
-              i(Y, {
-                value: "0",
-                eager: ""
-              }, {
-                default: n(() => [
-                  b("div", le, [
-                    i(g, null, {
-                      default: n(() => [
-                        i(w, null, {
-                          default: n(() => [
-                            i(D, { class: "pa-0" }, {
-                              default: n(() => [
-                                i(v, {
-                                  class: "pb-2",
-                                  label: "Title",
-                                  modelValue: t.graph.title,
-                                  "onUpdate:modelValue": e[1] || (e[1] = (c) => t.graph.title = c),
-                                  "hide-details": ""
-                                }, null, 8, ["modelValue"])
-                              ]),
-                              _: 1
-                            })
-                          ]),
-                          _: 1
-                        }),
-                        i(w, null, {
-                          default: n(() => [
-                            i(_, {
-                              label: "Legend Position",
-                              "hide-details": "",
-                              items: t.legendPositions,
-                              modelValue: t.graph.legendPosition,
-                              "onUpdate:modelValue": e[2] || (e[2] = (c) => t.graph.legendPosition = c),
-                              style: { "max-width": "280px" }
-                            }, null, 8, ["items", "modelValue"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  b("div", ne, [
-                    i(D, { class: "pa-0" }, {
-                      default: n(() => e[18] || (e[18] = [
-                        h(" Select a start date/time for the graph. Leave blank for start now. ")
-                      ])),
-                      _: 1
-                    }),
-                    i(g, null, {
-                      default: n(() => [
-                        i(w, null, {
-                          default: n(() => [
-                            i(v, {
-                              label: "Start Date",
-                              name: `date${Date.now()}`,
-                              rules: [t.rules.date],
-                              modelValue: t.startDate,
-                              "onUpdate:modelValue": e[3] || (e[3] = (c) => t.startDate = c),
-                              type: "date"
-                            }, null, 8, ["name", "rules", "modelValue"])
-                          ]),
-                          _: 1
-                        }),
-                        i(w, null, {
-                          default: n(() => [
-                            i(v, {
-                              label: "Start Time",
-                              name: `time${Date.now()}`,
-                              rules: [t.rules.time],
-                              modelValue: t.startTime,
-                              "onUpdate:modelValue": e[4] || (e[4] = (c) => t.startTime = c),
-                              type: "time",
-                              step: "1"
-                            }, null, 8, ["name", "rules", "modelValue"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    }),
-                    i(D, { class: "pa-0" }, {
-                      default: n(() => e[19] || (e[19] = [
-                        h(" Select a end date/time for the graph. Leave blank for continuous real-time graphing. ")
-                      ])),
-                      _: 1
-                    }),
-                    i(g, null, {
-                      default: n(() => [
-                        i(w, null, {
-                          default: n(() => [
-                            i(v, {
-                              label: "End Date",
-                              name: `date${Date.now()}`,
-                              rules: [t.rules.date],
-                              modelValue: t.endDate,
-                              "onUpdate:modelValue": e[5] || (e[5] = (c) => t.endDate = c),
-                              type: "date"
-                            }, null, 8, ["name", "rules", "modelValue"])
-                          ]),
-                          _: 1
-                        }),
-                        i(w, null, {
-                          default: n(() => [
-                            i(v, {
-                              label: "End Time",
-                              name: `time${Date.now()}`,
-                              rules: [t.rules.time],
-                              modelValue: t.endTime,
-                              "onUpdate:modelValue": e[6] || (e[6] = (c) => t.endTime = c),
-                              type: "time",
-                              step: "1"
-                            }, null, 8, ["name", "rules", "modelValue"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ])
-                ]),
-                _: 1
-              }),
-              i(Y, {
-                value: "1",
-                eager: ""
-              }, {
-                default: n(() => [
-                  b("div", ae, [
-                    i(D, { class: "pa-0" }, {
-                      default: n(() => e[20] || (e[20] = [
-                        h(" Set a min or max Y value to override automatic scaling ")
-                      ])),
-                      _: 1
-                    }),
-                    i(g, { dense: "" }, {
-                      default: n(() => [
-                        i(w, { class: "px-2" }, {
-                          default: n(() => [
-                            i(v, {
-                              "hide-details": "",
-                              label: "Min Y Axis (Optional)",
-                              modelValue: t.graph.graphMinY,
-                              "onUpdate:modelValue": e[7] || (e[7] = (c) => t.graph.graphMinY = c),
-                              type: "number"
-                            }, null, 8, ["modelValue"])
-                          ]),
-                          _: 1
-                        }),
-                        i(w, { class: "px-2" }, {
-                          default: n(() => [
-                            i(v, {
-                              "hide-details": "",
-                              label: "Max Y Axis (Optional)",
-                              modelValue: t.graph.graphMaxY,
-                              "onUpdate:modelValue": e[8] || (e[8] = (c) => t.graph.graphMaxY = c),
-                              type: "number"
-                            }, null, 8, ["modelValue"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  b("div", oe, [
-                    i(G, { density: "compact" }, {
-                      default: n(() => [
-                        i(U, null, {
-                          default: n(() => [
-                            e[22] || (e[22] = b("span", { style: { "padding-top": "5px" } }, " Add horizontal lines to the graph ", -1)),
-                            i(d),
-                            i(O, {
-                              onClick: e[9] || (e[9] = (c) => a.addLine())
-                            }, {
-                              default: n(() => e[21] || (e[21] = [
-                                h(" New Line ")
-                              ])),
-                              _: 1
-                            })
-                          ]),
-                          _: 1
-                        }),
-                        (y(!0), R(F, null, j(t.graph.lines, (c, A) => (y(), T(U, {
-                          key: A,
-                          value: c,
-                          color: "primary"
-                        }, {
-                          default: n(() => [
-                            i(g, null, {
-                              default: n(() => [
-                                i(w, null, {
-                                  default: n(() => [
-                                    i(v, {
-                                      label: "Y Value",
-                                      modelValue: c.yValue,
-                                      "onUpdate:modelValue": (N) => c.yValue = N
-                                    }, null, 8, ["modelValue", "onUpdate:modelValue"])
-                                  ]),
-                                  _: 2
-                                }, 1024),
-                                i(w, null, {
-                                  default: n(() => [
-                                    i(_, {
-                                      label: "Color",
-                                      "hide-details": "",
-                                      items: s.colors,
-                                      modelValue: c.color,
-                                      "onUpdate:modelValue": (N) => c.color = N
-                                    }, null, 8, ["items", "modelValue", "onUpdate:modelValue"])
-                                  ]),
-                                  _: 2
-                                }, 1024),
-                                i(w, null, {
-                                  default: n(() => [
-                                    i(V, {
-                                      text: "Remove",
-                                      location: "bottom"
-                                    }, {
-                                      activator: n(({ props: N }) => [
-                                        i(k, x({ ref_for: !0 }, N, {
-                                          style: { padding: "30px" },
-                                          onClick: (_e) => a.removeLine(c)
-                                        }), {
-                                          default: n(() => e[23] || (e[23] = [
-                                            h("mdi-delete")
-                                          ])),
-                                          _: 2
-                                        }, 1040, ["onClick"])
-                                      ]),
-                                      _: 2
-                                    }, 1024)
-                                  ]),
-                                  _: 2
-                                }, 1024)
-                              ]),
-                              _: 2
-                            }, 1024)
-                          ]),
-                          _: 2
-                        }, 1032, ["value"]))), 128))
-                      ]),
-                      _: 1
-                    })
-                  ])
-                ]),
-                _: 1
-              }),
-              i(Y, {
-                value: "2",
-                eager: ""
-              }, {
-                default: n(() => [
-                  i(L, {
-                    "item-key": "itemId",
-                    class: "elevation-1 my-2",
-                    "data-test": "edit-graph-items",
-                    headers: t.itemHeaders,
-                    items: a.editItems,
-                    "items-per-page": 5,
-                    "footer-props": {
-                      "items-per-page-options": [5]
-                    }
-                  }, {
-                    "item.actions": n(({ item: c }) => [
-                      i(V, {
-                        text: "Remove",
-                        location: "bottom"
-                      }, {
-                        activator: n(({ props: A }) => [
-                          i(k, x(A, {
-                            onClick: (N) => t.$emit("remove", c)
-                          }), {
-                            default: n(() => e[24] || (e[24] = [
-                              h(" mdi-delete ")
-                            ])),
-                            _: 2
-                          }, 1040, ["onClick"])
-                        ]),
-                        _: 2
-                      }, 1024)
-                    ]),
-                    "no-data": n(() => e[25] || (e[25] = [
-                      b("span", null, " Currently no items on this graph ", -1)
-                    ])),
-                    _: 1
-                  }, 8, ["headers", "items"])
-                ]),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue"]),
-          i(H, { class: "px-2" }, {
-            default: n(() => [
-              i(d),
-              i(O, {
-                variant: "outlined",
-                onClick: e[11] || (e[11] = (c) => t.$emit("cancel"))
-              }, {
-                default: n(() => e[26] || (e[26] = [
-                  h(" Cancel ")
-                ])),
-                _: 1
-              }),
-              i(O, {
-                variant: "flat",
-                onClick: a.closeOk
-              }, {
-                default: n(() => e[27] || (e[27] = [
-                  h(" Ok ")
-                ])),
-                _: 1
-              }, 8, ["onClick"])
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      })
-    ]),
-    _: 1
-  }, 8, ["modelValue"]);
-}
-const de = /* @__PURE__ */ W(se, [["render", re]]), ue = {
-  props: {
-    modelValue: Boolean,
-    item: {
-      type: Object,
-      required: !0
-    },
-    colors: {
-      type: Array,
-      required: !0
-    }
-  },
-  data: function() {
-    return {
-      editItem: null,
-      limitsName: "NONE",
-      // NONE: [] matches the default limits assigned in Graph addItems
-      limits: { NONE: [] },
-      valueTypes: ["CONVERTED", "RAW"],
-      reduction: [
-        // Map NONE to DECOM for clarity
-        { text: "NONE", value: "DECOM" },
-        { text: "REDUCED_MINUTE", value: "REDUCED_MINUTE" },
-        { text: "REDUCED_HOUR", value: "REDUCED_HOUR" },
-        { text: "REDUCED_DAY", value: "REDUCED_DAY" }
-      ],
-      reducedTypes: ["MIN", "MAX", "AVG", "STDDEV"]
-    };
-  },
-  computed: {
-    show: {
-      get() {
-        return this.modelValue;
-      },
-      set(t) {
-        this.$emit("update:modelValue", t);
-      }
-    },
-    limitsNames() {
-      return Object.keys(this.limits);
-    }
-  },
-  async created() {
-    this.editItem = { ...this.item }, await this.api, this.api = new ee().get_item(this.item.targetName, this.item.packetName, this.item.itemName).then((t) => {
-      for (const [e, s] of Object.entries(t.limits))
-        Object.keys(s).includes("red_low") && this.$set(this.limits, e, Object.values(s));
-      this.limitsName = Object.keys(this.limits).find(
-        // Little hack to compare arrays you convert them to strings
-        (e) => this.limits[e] + "" == this.editItem.limits + ""
-      );
-    });
-  }
-}, me = { key: 0 }, he = { class: "pa-3" };
-function pe(t, e, s, o, l, a) {
-  const d = m("v-card-title"), r = m("v-select"), p = m("v-card-text"), f = m("v-spacer"), v = m("v-btn"), D = m("v-card-actions"), w = m("v-card"), _ = m("v-dialog");
-  return y(), T(_, {
-    modelValue: a.show,
-    "onUpdate:modelValue": e[9] || (e[9] = (g) => a.show = g),
-    width: "400",
-    onKeydown: e[10] || (e[10] = X((g) => t.success(), ["enter"]))
-  }, {
-    default: n(() => [
-      i(w, null, {
-        default: n(() => [
-          i(d, { class: "mb-2" }, {
-            default: n(() => e[11] || (e[11] = [
-              h("Edit Item")
-            ])),
-            _: 1
-          }),
-          i(p, null, {
-            default: n(() => [
-              i(r, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Value Type",
-                items: t.valueTypes,
-                modelValue: t.editItem.valueType,
-                "onUpdate:modelValue": e[0] || (e[0] = (g) => t.editItem.valueType = g),
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              i(r, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Reduction",
-                items: t.reduction,
-                modelValue: t.editItem.reduced,
-                "onUpdate:modelValue": e[1] || (e[1] = (g) => t.editItem.reduced = g),
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              i(r, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Reduced Type",
-                items: t.reducedTypes,
-                disabled: t.currentReduced === "DECOM",
-                modelValue: t.editItem.reducedType,
-                "onUpdate:modelValue": e[2] || (e[2] = (g) => t.editItem.reducedType = g),
-                class: "mb-2"
-              }, null, 8, ["items", "disabled", "modelValue"]),
-              i(r, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Color",
-                items: s.colors,
-                modelValue: t.editItem.color,
-                "onUpdate:modelValue": [
-                  e[3] || (e[3] = (g) => t.editItem.color = g),
-                  e[4] || (e[4] = (g) => t.$emit("changeColor", g))
-                ],
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              a.limitsNames.length > 1 ? (y(), R("div", me, [
-                i(r, {
-                  variant: "outlined",
-                  "hide-details": "",
-                  label: "Display Limits",
-                  items: a.limitsNames,
-                  modelValue: t.limitsName,
-                  "onUpdate:modelValue": [
-                    e[5] || (e[5] = (g) => t.limitsName = g),
-                    e[6] || (e[6] = (g) => t.$emit("changeLimits", t.limits[t.limitsName]))
-                  ]
-                }, null, 8, ["items", "modelValue"]),
-                b("div", he, E(t.limitsName) + ": " + E(t.limits[t.limitsName]), 1)
-              ])) : S("", !0)
-            ]),
-            _: 1
-          }),
-          i(D, { class: "px-2" }, {
-            default: n(() => [
-              i(f),
-              i(v, {
-                variant: "outlined",
-                onClick: e[7] || (e[7] = (g) => t.$emit("cancel"))
-              }, {
-                default: n(() => e[12] || (e[12] = [
-                  h(" Cancel ")
-                ])),
-                _: 1
-              }),
-              i(v, {
-                variant: "flat",
-                onClick: e[8] || (e[8] = (g) => t.$emit("close", t.editItem))
-              }, {
-                default: n(() => e[13] || (e[13] = [
-                  h(" Ok ")
-                ])),
-                _: 1
-              })
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      })
-    ]),
-    _: 1
-  }, 8, ["modelValue"]);
-}
-const fe = /* @__PURE__ */ W(ue, [["render", pe]]);
-var ce = function(t, e, s, o, l) {
-  var a, d;
-  if (o === void 0)
-    o = 0;
-  else if (o = o | 0, o < 0 || o >= t.length)
-    throw new RangeError("invalid lower bound");
-  if (l === void 0)
-    l = t.length - 1;
-  else if (l = l | 0, l < o || l >= t.length)
-    throw new RangeError("invalid upper bound");
-  for (; o <= l; )
-    if (a = o + (l - o >>> 1), d = +s(t[a], e, a, t), d < 0)
-      o = a + 1;
-    else if (d > 0)
-      l = a - 1;
-    else
-      return a;
-  return ~o;
-};
-const ge = /* @__PURE__ */ te(ce), ve = {
-  components: {
-    GraphEditDialog: de,
-    GraphEditItemDialog: fe
-  },
-  props: {
-    id: {
-      type: Number,
-      required: !0
-    },
-    selectedGraphId: {
-      type: Number
-      // Not required because we pass null
-    },
-    state: {
-      type: String,
-      required: !0
-    },
-    // start time in nanoseconds to start the graph
-    // this allows multiple graphs to be synchronized
-    startTime: {
-      type: Number
-    },
-    secondsGraphed: {
-      type: Number,
-      required: !0
-    },
-    pointsSaved: {
-      type: Number,
-      required: !0
-    },
-    pointsGraphed: {
-      type: Number,
-      required: !0
-    },
-    refreshIntervalMs: {
-      type: Number,
-      default: 200
-    },
-    hideToolbar: {
-      type: Boolean,
-      default: !1
-    },
-    hideOverview: {
-      type: Boolean,
-      default: !1
-    },
-    sparkline: {
-      type: Boolean,
-      default: !1
-    },
-    initialItems: {
-      type: Array
-    },
-    // These allow the parent to force a specific height and/or width
-    height: {
-      type: Number
-    },
-    width: {
-      type: Number
-    },
-    timeZone: {
-      type: String,
-      default: "local"
-    }
-  },
-  mixins: [K],
-  data() {
-    return {
-      lines: [],
-      active: !0,
-      expand: !0,
-      fullWidth: !0,
-      fullHeight: !0,
-      graph: null,
-      editGraph: !1,
-      editGraphMenu: !1,
-      editGraphMenuX: 0,
-      editGraphMenuY: 0,
-      editItem: !1,
-      itemMenu: !1,
-      itemMenuX: 0,
-      itemMenuY: 0,
-      legendMenu: !1,
-      legendMenuX: 0,
-      legendMenuY: 0,
-      legendPosition: "bottom",
-      selectedItem: null,
-      hideToolbarData: this.hideToolbar,
-      showOverview: !this.hideOverview,
-      hideOverviewData: this.hideOverview,
-      title: "",
-      overview: null,
-      data: [[]],
-      dataChanged: !1,
-      timeout: null,
-      graphMinY: null,
-      graphMaxY: null,
-      graphStartDateTime: null,
-      graphEndDateTime: null,
-      indexes: {},
-      items: this.initialItems || [],
-      limitsValues: [],
-      drawInterval: null,
-      zoomChart: !1,
-      zoomOverview: !1,
-      cable: new ie(),
-      subscription: null,
-      needToUpdate: !1,
-      errorDialog: !1,
-      errors: [],
-      colorIndex: 0,
-      colors: [
-        // These are taken right from the Astro css definitions for
-        // --color-data-visualization-1 through 8
-        "#00c7cb",
-        "#938bdb",
-        "#4dacff",
-        "lime",
-        "darkorange",
-        "red",
-        "gold",
-        "hotpink",
-        "tan",
-        "cyan",
-        "maroon",
-        "blue",
-        "teal",
-        "purple",
-        "green",
-        "brown",
-        "lightblue",
-        "white",
-        "black"
-      ]
-    };
-  },
-  computed: {
-    calcFullSize: function() {
-      return this.fullWidth || this.fullHeight;
-    },
-    error: function() {
-      return this.errorDialog && this.errors.length > 0 ? JSON.stringify(this.errors, null, 4) : null;
-    }
-  },
-  created() {
-    this.title = `Graph ${this.id}`;
-    for (const [t, e] of this.items.entries())
-      this.data.push([]), this.indexes[this.subscriptionKey(e)] = t + 1, e.color === void 0 && (e.color = this.colors[this.colorIndex]), this.colorIndex++, this.colorIndex === this.colors.length && (this.colorIndex = 0);
-  },
-  mounted() {
-    const { chartSeries: t, overviewSeries: e } = this.items.reduce(
-      (o, l) => {
-        const a = {
-          spanGaps: !0
-        };
-        return o.chartSeries.push({
-          ...a,
-          item: l,
-          label: this.formatLabel(l),
-          stroke: (d, r) => this.items[r - 1].color,
-          width: 2,
-          value: (d, r) => typeof r == "string" || isNaN(r) ? "NaN" : r == null ? "--" : r.toFixed(3)
-        }), o.overviewSeries.push({
-          ...a
-        }), o;
-      },
-      { chartSeries: [], overviewSeries: [] }
-    );
-    let s = {};
-    if (this.sparkline)
-      this.hideToolbarData = !0, this.hideOverviewData = !0, this.showOverview = !1, s = {
-        width: this.width,
-        height: this.height,
-        pxAlign: !1,
-        cursor: {
-          show: !1
-        },
-        select: {
-          show: !1
-        },
-        legend: {
-          show: !1
-        },
-        scales: {
-          x: {
-            time: !1
-          }
-        },
-        axes: [
-          {
-            show: !1
-          },
-          {
-            show: !1
-          }
-        ],
-        series: [
-          {},
-          {
-            stroke: "white"
-            // TODO: Light / dark theme
-          }
-        ]
-      }, this.graph = new I(
-        s,
-        this.data,
-        document.getElementById(`chart${this.id}`)
-      );
-    else {
-      let o = Intl.DateTimeFormat().resolvedOptions().timeZone;
-      this.timeZone && this.timeZone !== "local" && (o = this.timeZone), s = {
-        ...this.getSize("chart"),
-        ...this.getScales(),
-        ...this.getAxes("chart"),
-        // series: series, // TODO: Uncomment with the performance code
-        plugins: [this.linesPlugin()],
-        tzDate: (a) => I.tzDate(new Date(a * 1e3), o),
-        series: [
-          {
-            label: "Time",
-            value: (a, d) => (
-              // Convert the unix timestamp into a formatted date / time
-              d == null ? "--" : this.formatSeconds(d, this.timeZone)
-            )
-          },
-          ...t
-        ],
-        cursor: {
-          drag: {
-            x: !0,
-            y: !1
-          },
-          // Sync the cursor across graphs so mouseovers are synced
-          sync: {
-            key: "openc3"
-            // setSeries links graphs so clicking an item to hide it also hides the other graph item
-            // setSeries: true,
-          },
-          bind: {
-            mouseup: (a, d, r) => (p) => {
-              this.state === "pause" && a.select.width === 0 && this.$emit("start"), r(p);
-            }
-          }
-        },
-        hooks: {
-          setScale: [
-            (a, d) => {
-              if (d === "x" && !this.zoomOverview && this.overview) {
-                this.zoomChart = !0;
-                let r = Math.round(
-                  this.overview.valToPos(a.scales.x.min, "x")
-                ), p = Math.round(
-                  this.overview.valToPos(a.scales.x.max, "x")
-                );
-                this.overview.setSelect({ left: r, width: p - r }), this.zoomChart = !1;
-              }
-            }
-          ],
-          setSelect: [
-            (a) => {
-              this.state === "start" && a.select.width > 0 && this.$emit("pause");
-            }
-          ],
-          ready: [
-            (a) => {
-              a.root.querySelector(".u-over").addEventListener("contextmenu", (p) => {
-                p.preventDefault(), this.itemMenu = !1, this.legendMenu = !1, this.editGraphMenuX = p.clientX, this.editGraphMenuY = p.clientY, this.editGraphMenu = !0;
-              });
-              let r = a.root.querySelector(".u-legend");
-              r.addEventListener("contextmenu", (p) => {
-                p.preventDefault(), this.editGraphMenu = !1, this.legendMenu = !1, this.itemMenuX = p.clientX, this.itemMenuY = p.clientY;
-                let f = p.target.closest(".u-series"), v = Array.prototype.slice.call(r.childNodes[0].childNodes).indexOf(f), D = a.series[v];
-                D.item ? (this.selectedItem = D.item, this.itemMenu = !0) : (this.itemMenu = !1, this.legendMenuX = p.clientX, this.legendMenuY = p.clientY, this.legendMenu = !0);
-              }), r.querySelector("tbody").appendChild(this.$refs.info);
-            }
-          ]
-        }
-      }, this.graph = new I(
-        s,
-        this.data,
-        document.getElementById(`chart${this.id}`)
-      );
-      const l = {
-        ...this.getSize("overview"),
-        ...this.getScales(),
-        ...this.getAxes("overview"),
-        // series: series, // TODO: Uncomment with the performance code
-        tzDate: (a) => I.tzDate(new Date(a * 1e3), o),
-        series: [...e],
-        cursor: {
-          y: !1,
-          drag: {
-            setScale: !1,
-            x: !0,
-            y: !1
-          }
-        },
-        legend: {
-          show: !1
-        },
-        hooks: {
-          setSelect: [
-            (a) => {
-              if (!this.zoomChart) {
-                this.state === "start" && a.select.width > 0 && this.$emit("pause"), this.zoomOverview = !0;
-                let d = a.posToVal(a.select.left, "x"), r = a.posToVal(
-                  a.select.left + a.select.width,
-                  "x"
-                );
-                this.graph.setScale("x", { min: d, max: r }), this.zoomOverview = !1;
-              }
-            }
-          ]
-        }
-      };
-      this.overview = new I(
-        l,
-        this.data,
-        document.getElementById(`overview${this.id}`)
-      ), this.moveLegend(this.legendPosition), window.addEventListener("resize", this.resize);
-    }
-    this.state !== "stop" && this.startGraph();
-  },
-  beforeUnmount: function() {
-    this.stopGraph(), this.cable.disconnect(), window.removeEventListener("resize", this.resize);
-  },
-  watch: {
-    state: function(t, e) {
-      switch (t) {
-        case "start":
-          e === "stop" && this.startGraph();
-          break;
-        case "stop":
-          this.stopGraph();
-          break;
-      }
-    },
-    data: function(t, e) {
-      this.dataChanged = !0;
-    },
-    graphMinY: function(t, e) {
-      let s = parseFloat(t);
-      isNaN(s) || (this.graphMinY = s), this.setGraphRange();
-    },
-    graphMaxY: function(t, e) {
-      let s = parseFloat(t);
-      isNaN(s) || (this.graphMaxY = s), this.setGraphRange();
-    },
-    graphStartDateTime: function(t, e) {
-      t && typeof t == "string" ? (this.graphStartDateTime = this.parseDateTime(this.graphStartDateTime, this.timeZone) * 1e6, this.graphStartDateTime !== e && (this.needToUpdate = !0)) : t === null && e && (this.graphStartDateTime = null, this.needToUpdate = !0);
-    },
-    graphEndDateTime: function(t, e) {
-      t && typeof t == "string" ? (this.graphEndDateTime = this.parseDateTime(this.graphEndDateTime, this.timeZone) * 1e6, this.graphEndDateTime !== e && (this.needToUpdate = !0)) : t === null && e && (this.graphEndDateTime = null, this.needToUpdate = !0);
-    }
-  },
-  methods: {
-    startGraph: function() {
-      this.subscribe(), this.timeout = setTimeout(() => {
-        this.updateTimeout();
-      }, this.refreshIntervalMs);
-    },
-    stopGraph: function() {
-      this.subscription && (this.subscription.unsubscribe(), this.subscription = null), this.timeout && (clearTimeout(this.timeout), this.timeout = null);
-    },
-    updateTimeout: function() {
-      this.updateGraphData(), this.timeout = setTimeout(() => {
-        this.updateTimeout();
-      }, this.refreshIntervalMs);
-    },
-    updateGraphData: function() {
-      if (this.state === "pause" || !this.dataChanged)
-        return;
-      this.graph.setData(this.data), this.overview && this.overview.setData(this.data);
-      let t = this.data[0][this.data[0].length - 1], e = this.data[0][this.data[0].length - this.pointsGraphed], s = this.data[0][0];
-      s < t - this.secondsGraphed && (s = t - this.secondsGraphed), e > s && (s = e), this.graph.setScale("x", { min: s, max: t }), this.dataChanged = !1;
-    },
-    formatLabel(t) {
-      if (t.valueType === "CONVERTED" && t.reduced === "DECOM")
-        return t.itemName;
-      {
-        let e = "";
-        return t.valueType !== "CONVERTED" && (e += t.valueType), t.reduced !== "DECOM" && (e !== "" && (e += " "), e += `${t.reduced.split("_")[1]} ${t.reducedType}`), `${t.itemName} (${e})`;
-      }
-    },
-    moveLegend: function(t) {
-      switch (t) {
-        case "bottom":
-          this.graph.root.classList.remove("side-legend"), this.graph.root.classList.remove("left-legend"), this.graph.root.classList.remove("top-legend");
-          break;
-        case "top":
-          this.graph.root.classList.remove("side-legend"), this.graph.root.classList.remove("left-legend"), this.graph.root.classList.add("top-legend");
-          break;
-        case "left":
-          this.graph.root.classList.remove("top-legend"), this.graph.root.classList.add("side-legend"), this.graph.root.classList.add("left-legend");
-          break;
-        case "right":
-          this.graph.root.classList.remove("top-legend"), this.graph.root.classList.remove("left-legend"), this.graph.root.classList.add("side-legend");
-          break;
-      }
-      this.legendPosition = t, this.resize();
-    },
-    clearErrors: function() {
-      this.errors = [];
-    },
-    editGraphClose: function(t) {
-      this.editGraph = !1, this.title = t.title, this.legendPosition = t.legendPosition, this.graphMinY = t.graphMinY, this.graphMaxY = t.graphMaxY, this.lines = [...t.lines], this.graphStartDateTime = t.startDateTime, this.graphEndDateTime = t.endDateTime, this.$nextTick(() => {
-        if (this.needToUpdate) {
-          if (this.subscription == null)
-            this.startGraph();
-          else {
-            let e = JSON.parse(JSON.stringify(this.items));
-            this.removeItems(e), setTimeout(() => {
-              this.addItems(e);
-            }, 0);
-          }
-          this.needToUpdate = !1;
-        }
-      }), this.moveLegend(this.legendPosition), this.$emit("edit");
-    },
-    resize: function() {
-      this.graph.setSize(this.getSize("chart")), this.overview && this.overview.setSize(this.getSize("overview")), this.$emit("resize", this.id);
-    },
-    expandAll: function() {
-      this.fullWidth = !0, this.fullHeight = !0, this.resize();
-    },
-    collapseAll: function() {
-      this.fullWidth = !1, this.fullHeight = !1, this.resize();
-    },
-    expandWidth: function() {
-      this.fullWidth = !0, this.resize();
-    },
-    collapseWidth: function() {
-      this.fullWidth = !1, this.resize();
-    },
-    expandHeight: function() {
-      this.fullHeight = !0, this.resize();
-    },
-    collapseHeight: function() {
-      this.fullHeight = !1, this.resize();
-    },
-    minMaxTransition: function() {
-      this.expand = !this.expand, this.$emit("min-max-graph", this.id);
-    },
-    setGraphRange: function() {
-      let t = 0.1;
-      (this.graphMinY || this.graphMinY === 0 || this.graphMaxY || this.graphMaxY === 0) && (t = 0), this.graph.scales.y.range = (e, s, o) => {
-        let l = s;
-        (this.graphMinY || this.graphMinY === 0) && (l = this.graphMinY);
-        let a = o;
-        return (this.graphMaxY || this.graphMaxY === 0) && (a = this.graphMaxY), I.rangeNum(l, a, t, !0);
-      };
-    },
-    subscribe: function() {
-      this.cable.createSubscription("StreamingChannel", window.openc3Scope, {
-        received: (t) => this.received(t),
-        connected: () => {
-          this.addItemsToSubscription(this.items);
-        },
-        disconnected: () => {
-          this.errors.push({
-            type: "disconnected",
-            message: "OpenC3 backend connection disconnected",
-            time: (/* @__PURE__ */ new Date()).getTime()
-          });
-        },
-        rejected: () => {
-          this.errors.push({
-            type: "rejected",
-            message: "OpenC3 backend connection rejected",
-            time: (/* @__PURE__ */ new Date()).getTime()
-          });
-        }
-      }).then((t) => {
-        this.subscription = t;
-      });
-    },
-    // throttle(cb, limit) {
-    //   let wait = false
-    //   return () => {
-    //     if (!wait) {
-    //       requestAnimationFrame(cb)
-    //       wait = true
-    //       setTimeout(() => {
-    //         wait = false
-    //       }, limit)
-    //     }
-    //   }
-    // },
-    getSize: function(t) {
-      let e = 0;
-      const s = document.getElementById("openc3-nav-drawer");
-      s && (e = s.classList.contains(
-        "v-navigation-drawer--active"
-      ) ? s.clientWidth : 0);
-      let o = 0;
-      (this.legendPosition === "right" || this.legendPosition === "left") && (o = document.getElementsByClassName("u-legend")[0].clientWidth);
-      const l = Math.max(document.documentElement.clientWidth, window.innerWidth || 0) - e - o, a = Math.max(
-        document.documentElement.clientHeight,
-        window.innerHeight || 0
-      ), d = document.getElementsByClassName("v-expansion-panel")[0];
-      let r = 100;
-      t === "overview" ? this.fullHeight && !this.hideOverviewData ? this.showOverview = !0 : this.showOverview = !1 : (r = a - d.clientHeight - r - 250, this.fullHeight || (r = r / 2 + 10));
-      let p = l - 50;
-      return this.fullWidth || (p = p / 2 - 10), {
-        width: this.width || p,
-        height: this.height || r
-      };
-    },
-    getScales: function() {
-      return {
-        scales: {
-          x: {
-            range(t, e, s) {
-              return e == null ? [1566453600, 1566497660] : [e, s];
-            }
-          },
-          y: {
-            range(t, e, s) {
-              return e == null ? [-100, 100] : I.rangeNum(e, s, 0.1, !0);
-            }
-          }
-        }
-      };
-    },
-    getAxes: function(t) {
-      let e = "rgba(255, 255, 255, .1)", s = "white";
-      return {
-        axes: [
-          {
-            stroke: s,
-            grid: {
-              show: !0,
-              stroke: e,
-              width: 2
-            }
-          },
-          {
-            size: 80,
-            // This size supports values up to 8 digits plus sign
-            stroke: s,
-            grid: {
-              show: t !== "overview",
-              stroke: e,
-              width: 2
-            },
-            // Forces the axis values to be formatted correctly
-            // especially with really small or large values
-            values(o, l) {
-              return (l.some((a) => a >= 1e7) || l.every((a) => a < 0.01)) && (l = l.map((a) => a.toExponential(3))), l;
-            }
-          }
-        ]
-      };
-    },
-    closeEditItem: function(t) {
-      this.editItem = !1, // If we have an end time and anything was changed we basically regraph
-      (this.graphEndDateTime !== null && this.selectedItem !== t || // If we're live graphing we just regraph if the types change
-      this.selectedItem.valueType !== t.valueType || this.selectedItem.reduced !== t.reduced || this.selectedItem.reducedType !== t.reducedType) && this.changeItem(t);
-    },
-    changeColor: function(t) {
-      let e = this.subscriptionKey(this.selectedItem), s = this.indexes[e];
-      this.items[s - 1].color = t, this.selectedItem.color = t, this.graph.root.querySelectorAll(".u-marker")[s].style.borderColor = t;
-    },
-    changeLimits: function(t) {
-      let e = this.subscriptionKey(this.selectedItem), s = this.indexes[e];
-      this.items[s - 1].limits = t, this.selectedItem.limits = t, this.limitsValues = t;
-    },
-    linesPlugin: function() {
-      return {
-        hooks: {
-          draw: (t) => {
-            const { ctx: e, bbox: s } = t, o = t.valToPos(t.scales.y.min, "y", !0), l = t.valToPos(t.scales.y.max, "y", !0), a = t.valToPos(this.limitsValues[0], "y", !0), d = t.valToPos(this.limitsValues[1], "y", !0), r = t.valToPos(this.limitsValues[2], "y", !0), p = t.valToPos(this.limitsValues[3], "y", !0);
-            if (this.lines.forEach((f) => {
-              t.scales.y.min <= f.yValue && f.yValue <= t.scales.y.max && (e.save(), e.beginPath(), e.strokeStyle = f.color, e.lineWidth = 2, e.moveTo(s.left, t.valToPos(f.yValue, "y", !0)), e.lineTo(
-                s.left + s.width,
-                t.valToPos(f.yValue, "y", !0)
-              ), e.stroke(), e.restore());
-            }), e.save(), e.beginPath(), e.fillStyle = "rgba(255,0,0,0.15)", t.scales.y.min < this.limitsValues[0]) {
-              let f = a < l ? l : a;
-              e.fillRect(s.left, a, s.width, o - f);
-            }
-            if (t.scales.y.max > this.limitsValues[3]) {
-              let f = o < p ? o : p;
-              e.fillRect(s.left, l, s.width, f - l);
-            }
-            if (e.fillStyle = "rgba(255,255,0,0.15)", t.scales.y.min < this.limitsValues[1] && // yellowLow
-            t.scales.y.max > this.limitsValues[0]) {
-              let f = d < l ? l : d;
-              e.fillRect(s.left, f, s.width, a - f);
-            }
-            if (t.scales.y.max > this.limitsValues[2] && // yellowHigh
-            t.scales.y.min < this.limitsValues[3]) {
-              let f = o < p ? o : p, v = o < r ? o : r;
-              e.fillRect(s.left, f, s.width, v - f);
-            }
-            if (e.fillStyle = "rgba(0,255,0,0.15)", this.limitsValues.length === 4) {
-              if (t.scales.y.min < this.limitsValues[2] && // yellowHigh
-              t.scales.y.max > this.limitsValues[1]) {
-                let f = r < l ? l : r, v = o < d ? o : d;
-                e.fillRect(s.left, f, s.width, v - f);
-              }
-            } else {
-              const f = t.valToPos(this.limitsValues[4], "y", !0), v = t.valToPos(this.limitsValues[5], "y", !0);
-              if (t.scales.y.min < this.limitsValues[4] && // greenLow
-              t.scales.y.max > this.limitsValues[1]) {
-                let _ = f < l ? l : f;
-                e.fillRect(s.left, _, s.width, d - _);
-              }
-              if (t.scales.y.max > this.limitsValues[5] && // greenHigh
-              t.scales.y.min < this.limitsValues[2]) {
-                let _ = o < r ? o : r, g = o < v ? o : v;
-                e.fillRect(s.left, _, s.width, g - _);
-              }
-              e.fillStyle = "rgba(0,0,255,0.15)";
-              let D = v < l ? l : v, w = o < f ? o : f;
-              e.fillRect(s.left, D, s.width, w - D);
-            }
-            e.stroke(), e.restore();
-          }
-        }
-      };
-    },
-    changeItem: function(t) {
-      this.removeItems([this.selectedItem]), this.selectedItem.valueType = t.valueType, this.selectedItem.reduced = t.reduced, this.selectedItem.reducedType = t.reducedType, setTimeout(() => {
-        this.addItems([this.selectedItem]);
-      }, 0);
-    },
-    addItems: function(t, e = "CONVERTED") {
-      t.forEach((s) => {
-        s.valueType || (s.valueType = e), s.color || (s.color = this.colors[this.colorIndex]), s.limits || (s.limits = []), s.limits.length > 0 && (this.limitsValues = s.limits), this.colorIndex = (this.colorIndex + 1) % this.colors.length, this.items.push(s);
-        const o = this.data.length;
-        this.graph.addSeries(this.createSeriesConfig(s), o), this.overview && this.overview.addSeries(this.createOverviewSeriesConfig(), o), this.data.splice(o, 0, Array(this.data[0].length)), this.indexes[this.subscriptionKey(s)] = o;
-      }), this.updateColorIndex(t), this.addItemsToSubscription(t), this.$emit("resize"), this.$emit("edit");
-    },
-    createSeriesConfig: function(t) {
-      return {
-        spanGaps: !0,
-        item: t,
-        label: this.formatLabel(t),
-        stroke: (e, s) => this.items[s - 1].color,
-        width: 2,
-        value: (e, s) => typeof s == "string" || isNaN(s) ? "NaN" : s == null ? "--" : Math.abs(s) < 0.01 && s !== 0 || Math.abs(s) >= 1e7 ? s.toExponential(6) : s.toFixed(6)
-      };
-    },
-    createOverviewSeriesConfig: function() {
-      return {
-        spanGaps: !0,
-        stroke: (t, e) => this.items[e - 1].color
-      };
-    },
-    updateColorIndex: function(t) {
-      const e = t[t.length - 1];
-      if (e) {
-        const s = this.colors.indexOf(e.color);
-        s !== -1 && (this.colorIndex = (s + 1) % this.colors.length);
-      }
-    },
-    addItemsToSubscription: function(t = this.items) {
-      let e = this.startTime;
-      this.graphStartDateTime && (e = this.graphStartDateTime), this.subscription && OpenC3Auth.updateToken(OpenC3Auth.defaultMinValidity).then(
-        (s) => {
-          s && OpenC3Auth.setTokens(), this.subscription.perform("add", {
-            scope: window.openc3Scope,
-            token: localStorage.openc3Token,
-            items: t.map(this.subscriptionKey),
-            start_time: e,
-            end_time: this.graphEndDateTime
-          });
-        }
-      );
-    },
-    clearAllData: function() {
-      this.data[0] = [], this.clearData(this.items);
-    },
-    clearData: function(t) {
-      for (const e of t.map(this.subscriptionKey)) {
-        let s = this.indexes[e];
-        this.data[s] = Array(this.data[0].length).fill(null), this.graph.setData(this.data), this.overview && this.overview.setData(this.data);
-      }
-      this.data.length === 2 && (this.data[0] = [], this.graph.setData(this.data), this.overview.setData(this.data));
-    },
-    removeItems: function(t) {
-      this.removeItemsFromSubscription(t);
-      for (const e of t.map(this.subscriptionKey)) {
-        const s = this.reorderIndexes(e);
-        this.items.splice(s - 1, 1), this.data.splice(s, 1), this.graph.delSeries(s), this.graph.setData(this.data), this.overview && (this.overview.delSeries(s), this.overview.setData(this.data));
-      }
-      this.data.length === 1 && (this.data[0] = [], this.graph.setData(this.data), this.overview.setData(this.data)), this.$emit("resize"), this.$emit("edit");
-    },
-    removeItemsFromSubscription: function(t = this.items) {
-      this.subscription && this.subscription.perform("remove", {
-        scope: window.openc3Scope,
-        token: localStorage.openc3Token,
-        items: t.map(this.subscriptionKey)
-      });
-    },
-    reorderIndexes: function(t) {
-      let e = this.indexes[t];
-      delete this.indexes[t];
-      for (let s in this.indexes)
-        this.indexes[s] > e && (this.indexes[s] -= 1);
-      return e;
-    },
-    received: function(t) {
-      this.cable.recordPing();
-      for (let e = 0; e < t.length; e++) {
-        let s = t[e].__time / 1e9, o = t[0].length;
-        if (o === 0 || s > t[0][o - 1]) {
-          for (let l = 0; l < this.data.length; l++)
-            this.data[l].push(null);
-          this.set_data_at_index(this.data[0].length - 1, s, t[e]);
-        } else {
-          let l = ge(this.data[0], s, this.bs_comparator);
-          if (l >= 0)
-            this.set_data_at_index(l, s, t[e]);
-          else {
-            let a = -l - 1;
-            for (let d = 0; d < this.data.length; d++)
-              this.data[d].splice(a, 0, null);
-            this.set_data_at_index(a, s, t[e]);
-          }
-        }
-      }
-      if (this.startTime == null && this.data[0][0]) {
-        let e = this.data[0][0] * 1e9;
-        this.$emit("started", e);
-      }
-      this.dataChanged = !0;
-    },
-    bs_comparator: function(t, e) {
-      return t - e;
-    },
-    set_data_at_index: function(t, e, s) {
-      this.data[0][t] = e;
-      for (const [o, l] of Object.entries(s)) {
-        if (o === "time")
-          continue;
-        let a = this.indexes[o];
-        if (a) {
-          let d = this.data[a];
-          if (l != null && l.raw)
-            d[t] = null;
-          else if (typeof l == "string") {
-            if (d[t] = null, !o.includes("__RAW")) {
-              for (let r of this.items)
-                if (this.subscriptionKey(r) === o) {
-                  this.selectedItem = r;
-                  break;
-                }
-              this.changeItem({
-                valueType: "RAW",
-                reduced: this.selectedItem.reduced,
-                reducedType: this.selectedItem.reducedType
-              });
-            }
-          } else
-            d[t] = l;
-        }
-      }
-    },
-    subscriptionKey: function(t) {
-      let e = `${t.reduced}__TLM__${t.targetName}__${t.packetName}__${t.itemName}__${t.valueType}`;
-      return (t.reduced === "REDUCED_MINUTE" || t.reduced === "REDUCED_HOUR" || t.reduced === "REDUCED_DAY") && (e += `__${t.reducedType}`), e;
-    }
-  }
-}, ye = { class: "mx-2" }, be = {
-  class: "pa-1",
-  id: "chart",
-  ref: "chart"
-}, we = ["id"], Te = ["id"], De = {
-  key: 5,
-  class: "u-series",
-  ref: "info"
-};
-function xe(t, e, s, o, l, a) {
-  const d = m("v-icon"), r = m("v-tooltip"), p = m("v-spacer"), f = m("v-toolbar"), v = m("v-expand-transition"), D = m("v-card"), w = m("graph-edit-dialog"), _ = m("v-text-field"), g = m("v-row"), Y = m("v-textarea"), O = m("v-btn"), U = m("v-dialog"), k = m("v-list-item-title"), V = m("v-list-item"), G = m("v-list"), L = m("v-menu"), P = m("graph-edit-item-dialog"), H = m("v-list-subheader");
-  return y(), R("div", null, [
-    i(D, {
-      onClick: e[3] || (e[3] = (u) => t.$emit("click"))
-    }, {
-      default: n(() => [
-        C(i(f, {
-          height: "24",
-          class: J(["pl-2 pr-2", s.selectedGraphId === s.id ? "active" : ""])
-        }, {
-          default: n(() => [
-            C(b("div", ye, [
-              i(r, {
-                text: "Errors",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: e[0] || (e[0] = (z) => l.errorDialog = !0)
-                  }), {
-                    default: n(() => e[22] || (e[22] = [
-                      h("mdi-alert")
-                    ])),
-                    _: 2
-                  }, 1040)
-                ]),
-                _: 1
-              })
-            ], 512), [
-              [M, l.errors.length !== 0]
-            ]),
-            i(r, {
-              text: "Edit",
-              location: "bottom"
-            }, {
-              activator: n(({ props: u }) => [
-                i(d, x(u, {
-                  onClick: e[1] || (e[1] = (z) => l.editGraph = !0),
-                  "data-test": "edit-graph-icon"
-                }), {
-                  default: n(() => e[23] || (e[23] = [
-                    h("mdi-pencil")
-                  ])),
-                  _: 2
-                }, 1040)
-              ]),
-              _: 1
-            }),
-            i(p),
-            b("span", null, E(l.title), 1),
-            i(p),
-            C(b("div", null, [
-              a.calcFullSize ? (y(), T(r, {
-                key: 0,
-                text: "Collapse",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.collapseAll,
-                    "data-test": "collapse-all"
-                  }), {
-                    default: n(() => e[24] || (e[24] = [
-                      h("mdi-arrow-collapse")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              })) : (y(), T(r, {
-                key: 1,
-                text: "Expand",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.expandAll,
-                    "data-test": "expand-all"
-                  }), {
-                    default: n(() => e[25] || (e[25] = [
-                      h("mdi-arrow-expand")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              }))
-            ], 512), [
-              [M, l.expand]
-            ]),
-            C(b("div", null, [
-              l.fullWidth ? (y(), T(r, {
-                key: 0,
-                text: "Collapse Width",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.collapseWidth,
-                    "data-test": "collapse-width"
-                  }), {
-                    default: n(() => e[26] || (e[26] = [
-                      h("mdi-arrow-collapse-horizontal")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              })) : (y(), T(r, {
-                key: 1,
-                text: "Expand Width",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.expandWidth,
-                    "data-test": "expand-width"
-                  }), {
-                    default: n(() => e[27] || (e[27] = [
-                      h("mdi-arrow-expand-horizontal")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              }))
-            ], 512), [
-              [M, l.expand]
-            ]),
-            C(b("div", null, [
-              l.fullHeight ? (y(), T(r, {
-                key: 0,
-                text: "Collapse Height",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.collapseHeight,
-                    "data-test": "collapse-height"
-                  }), {
-                    default: n(() => e[28] || (e[28] = [
-                      h("mdi-arrow-collapse-vertical")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              })) : (y(), T(r, {
-                key: 1,
-                text: "Expand Height",
-                location: "bottom"
-              }, {
-                activator: n(({ props: u }) => [
-                  i(d, x(u, {
-                    onClick: a.expandHeight,
-                    "data-test": "expand-height"
-                  }), {
-                    default: n(() => e[29] || (e[29] = [
-                      h("mdi-arrow-expand-vertical")
-                    ])),
-                    _: 2
-                  }, 1040, ["onClick"])
-                ]),
-                _: 1
-              }))
-            ], 512), [
-              [M, l.expand]
-            ]),
-            l.expand ? (y(), T(r, {
-              key: 0,
-              text: "Minimize",
-              location: "bottom"
-            }, {
-              activator: n(({ props: u }) => [
-                i(d, x(u, {
-                  onClick: a.minMaxTransition,
-                  "data-test": "minimize-screen-icon"
-                }), {
-                  default: n(() => e[30] || (e[30] = [
-                    h("mdi-window-minimize")
-                  ])),
-                  _: 2
-                }, 1040, ["onClick"])
-              ]),
-              _: 1
-            })) : (y(), T(r, {
-              key: 1,
-              text: "Maximize",
-              location: "bottom"
-            }, {
-              activator: n(({ props: u }) => [
-                i(d, x(u, {
-                  onClick: a.minMaxTransition,
-                  "data-test": "maximize-screen-icon"
-                }), {
-                  default: n(() => e[31] || (e[31] = [
-                    h("mdi-window-maximize")
-                  ])),
-                  _: 2
-                }, 1040, ["onClick"])
-              ]),
-              _: 1
-            })),
-            i(r, {
-              text: "Close",
-              location: "bottom"
-            }, {
-              activator: n(({ props: u }) => [
-                i(d, x(u, {
-                  onClick: e[2] || (e[2] = (z) => t.$emit("close-graph")),
-                  "data-test": "close-graph-icon"
-                }), {
-                  default: n(() => e[32] || (e[32] = [
-                    h("mdi-close-box")
-                  ])),
-                  _: 2
-                }, 1040)
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        }, 8, ["class"]), [
-          [M, !l.hideToolbarData]
-        ]),
-        i(v, null, {
-          default: n(() => [
-            C(b("div", be, [
-              b("div", {
-                id: `chart${s.id}`
-              }, null, 8, we),
-              e[33] || (e[33] = b("div", { id: "betweenCharts" }, null, -1)),
-              C(b("div", {
-                id: `overview${s.id}`
-              }, null, 8, Te), [
-                [M, l.showOverview]
-              ])
-            ], 512), [
-              [M, l.expand]
-            ])
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }),
-    l.editGraph ? (y(), T(w, {
-      key: 0,
-      modelValue: l.editGraph,
-      "onUpdate:modelValue": e[4] || (e[4] = (u) => l.editGraph = u),
-      title: l.title,
-      "legend-position": l.legendPosition,
-      items: l.items,
-      "graph-min-y": l.graphMinY,
-      "graph-max-y": l.graphMaxY,
-      lines: l.lines,
-      colors: l.colors,
-      "start-date-time": l.graphStartDateTime,
-      "end-date-time": l.graphEndDateTime,
-      "time-zone": s.timeZone,
-      onRemove: e[5] || (e[5] = (u) => a.removeItems([u])),
-      onOk: a.editGraphClose,
-      onCancel: e[6] || (e[6] = (u) => l.editGraph = !1)
-    }, null, 8, ["modelValue", "title", "legend-position", "items", "graph-min-y", "graph-max-y", "lines", "colors", "start-date-time", "end-date-time", "time-zone", "onOk"])) : S("", !0),
-    i(U, {
-      modelValue: l.errorDialog,
-      "onUpdate:modelValue": e[8] || (e[8] = (u) => l.errorDialog = u),
-      "max-width": "600"
-    }, {
-      default: n(() => [
-        i(f, { height: "24" }, {
-          default: n(() => [
-            i(p),
-            e[34] || (e[34] = b("span", null, "Errors", -1)),
-            i(p)
-          ]),
-          _: 1
-        }),
-        i(D, { class: "pa-3" }, {
-          default: n(() => [
-            i(g, { dense: "" }, {
-              default: n(() => [
-                i(_, {
-                  readonly: "",
-                  "hide-details": "",
-                  modelValue: l.title,
-                  "onUpdate:modelValue": e[7] || (e[7] = (u) => l.title = u),
-                  class: "pb-2",
-                  label: "Graph Title"
-                }, null, 8, ["modelValue"])
-              ]),
-              _: 1
-            }),
-            i(g, { class: "my-3" }, {
-              default: n(() => [
-                i(Y, {
-                  readonly: "",
-                  rows: "8",
-                  value: a.error
-                }, null, 8, ["value"])
-              ]),
-              _: 1
-            }),
-            i(g, null, {
-              default: n(() => [
-                i(O, {
-                  block: "",
-                  onClick: a.clearErrors
-                }, {
-                  default: n(() => e[35] || (e[35] = [
-                    h(" Clear ")
-                  ])),
-                  _: 1
-                }, 8, ["onClick"])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue"]),
-    l.editGraphMenu ? (y(), T(L, {
-      key: 1,
-      modelValue: l.editGraphMenu,
-      "onUpdate:modelValue": e[10] || (e[10] = (u) => l.editGraphMenu = u),
-      target: [l.editGraphMenuX, l.editGraphMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        i(G, null, {
-          default: n(() => [
-            i(V, {
-              onClick: e[9] || (e[9] = (u) => l.editGraph = !0)
-            }, {
-              default: n(() => [
-                i(k, { style: { cursor: "pointer" } }, {
-                  default: n(() => [
-                    h(" Edit " + E(l.title), 1)
-                  ]),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : S("", !0),
-    l.editItem ? (y(), T(P, {
-      key: 2,
-      modelValue: l.editItem,
-      "onUpdate:modelValue": e[11] || (e[11] = (u) => l.editItem = u),
-      colors: l.colors,
-      item: l.selectedItem,
-      onChangeColor: a.changeColor,
-      onChangeLimits: a.changeLimits,
-      onCancel: e[12] || (e[12] = (u) => l.editItem = !1),
-      onClose: a.closeEditItem
-    }, null, 8, ["modelValue", "colors", "item", "onChangeColor", "onChangeLimits", "onClose"])) : S("", !0),
-    l.itemMenu ? (y(), T(L, {
-      key: 3,
-      modelValue: l.itemMenu,
-      "onUpdate:modelValue": e[16] || (e[16] = (u) => l.itemMenu = u),
-      target: [l.itemMenuX, l.itemMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        i(G, {
-          nav: "",
-          density: "compact"
-        }, {
-          default: n(() => [
-            i(H, null, {
-              default: n(() => [
-                h(E(l.selectedItem.targetName) + " " + E(l.selectedItem.packetName) + " " + E(l.selectedItem.itemName), 1)
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[13] || (e[13] = (u) => l.editItem = !0)
-            }, {
-              prepend: n(() => [
-                i(d, { icon: "mdi-pencil" })
-              ]),
-              default: n(() => [
-                i(k, null, {
-                  default: n(() => e[36] || (e[36] = [
-                    h(" Edit ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[14] || (e[14] = (u) => a.clearData([l.selectedItem]))
-            }, {
-              prepend: n(() => [
-                i(d, { icon: "mdi-eraser" })
-              ]),
-              default: n(() => [
-                i(k, null, {
-                  default: n(() => e[37] || (e[37] = [
-                    h(" Clear ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[15] || (e[15] = (u) => a.removeItems([l.selectedItem]))
-            }, {
-              prepend: n(() => [
-                i(d, { icon: "mdi-delete" })
-              ]),
-              default: n(() => [
-                i(k, null, {
-                  default: n(() => e[38] || (e[38] = [
-                    h(" Delete ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : S("", !0),
-    l.legendMenu ? (y(), T(L, {
-      key: 4,
-      modelValue: l.legendMenu,
-      "onUpdate:modelValue": e[21] || (e[21] = (u) => l.legendMenu = u),
-      target: [l.legendMenuX, l.legendMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        i(G, null, {
-          default: n(() => [
-            i(V, {
-              onClick: e[17] || (e[17] = (u) => a.moveLegend("top"))
-            }, {
-              default: n(() => [
-                i(k, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[39] || (e[39] = [
-                    h("Legend Top")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[18] || (e[18] = (u) => a.moveLegend("bottom"))
-            }, {
-              default: n(() => [
-                i(k, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[40] || (e[40] = [
-                    h("Legend Bottom")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[19] || (e[19] = (u) => a.moveLegend("left"))
-            }, {
-              default: n(() => [
-                i(k, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[41] || (e[41] = [
-                    h("Legend Left")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            i(V, {
-              onClick: e[20] || (e[20] = (u) => a.moveLegend("right"))
-            }, {
-              default: n(() => [
-                i(k, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[42] || (e[42] = [
-                    h("Legend RIght")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : S("", !0),
-    s.sparkline ? S("", !0) : (y(), R("div", De, [
-      i(r, {
-        text: "Click item to toggle, Right click to edit",
-        location: "bottom"
-      }, {
-        activator: n(({ props: u }) => [
-          i(d, Q($(u)), {
-            default: n(() => e[43] || (e[43] = [
-              h("mdi-information-variant-circle")
-            ])),
-            _: 2
-          }, 1040)
-        ]),
-        _: 1
-      })
-    ], 512))
-  ]);
-}
-const Ee = /* @__PURE__ */ W(ve, [["render", xe], ["__scopeId", "data-v-404a4684"]]);
-export {
-  Ee as G,
-  de as a,
-  fe as b
-};
-//# sourceMappingURL=Graph-D2frd7mZ.js.map