@openc3/vue-common 6.6.0 → 6.7.0

package/dist/Graph-DCihpnT0.js

@@ -1,1853 +0,0 @@
-import { T as B } from "./timeFilters-BKnCM4rv.js";
-import { resolveComponent as h, createBlock as b, openBlock as v, withKeys as K, withCtx as n, createVNode as s, createElementVNode as k, createTextVNode as g, createElementBlock as N, Fragment as X, renderList as j, createCommentVNode as _, toDisplayString as C, withModifiers as H, withDirectives as O, normalizeClass as F, vShow as G, normalizeProps as J, guardReactiveProps as Q } from "vue";
-import { p as $, c as A, u as V, d as ee } from "./UpgradeToEnterpriseDialog.vue_vue_type_style_index_0_scoped_2c757408_lang-NIAkCgU6.js";
-import { _ as P } from "./CustomIcon-h5X7369N.js";
-import { t as W, i as q } from "./format-CVeawcIv.js";
-import { p as Z } from "./parse-DnkEsW-3.js";
-const te = {
-  mixins: [B],
-  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
-    }
-  },
-  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(Z(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(Z(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 = W(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 = W(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);
-    }
-  }
-}, ie = { class: "edit-box" }, se = { class: "edit-box" }, le = { class: "edit-box" }, ae = { class: "edit-box" };
-function ne(t, e, i, u, l, a) {
-  const r = h("v-spacer"), d = h("v-toolbar"), m = h("v-tab"), p = h("v-tabs"), f = h("v-text-field"), w = h("v-card-text"), y = h("v-col"), T = h("v-select"), c = h("v-row"), M = h("v-tabs-window-item"), D = h("v-btn"), x = h("v-list-item"), S = h("v-list"), E = h("v-data-table"), L = h("v-tabs-window"), U = h("v-card-actions"), I = h("v-card"), z = h("v-dialog");
-  return v(), b(z, {
-    modelValue: a.show,
-    "onUpdate:modelValue": e[12] || (e[12] = (o) => a.show = o),
-    "max-width": "700",
-    onKeydown: e[13] || (e[13] = K((o) => t.$emit("cancel"), ["esc"]))
-  }, {
-    default: n(() => [
-      s(d, { height: "24" }, {
-        default: n(() => [
-          s(r),
-          e[14] || (e[14] = k("span", null, " Edit Graph ", -1)),
-          s(r)
-        ]),
-        _: 1
-      }),
-      s(I, { class: "pa-3" }, {
-        default: n(() => [
-          s(p, {
-            modelValue: t.tab,
-            "onUpdate:modelValue": e[0] || (e[0] = (o) => t.tab = o),
-            class: "ml-3"
-          }, {
-            default: n(() => [
-              s(m, { value: "0" }, {
-                default: n(() => e[15] || (e[15] = [
-                  g(" Settings ")
-                ])),
-                _: 1
-              }),
-              s(m, { value: "1" }, {
-                default: n(() => e[16] || (e[16] = [
-                  g(" Scale / Lines ")
-                ])),
-                _: 1
-              }),
-              s(m, { value: "2" }, {
-                default: n(() => e[17] || (e[17] = [
-                  g(" Items ")
-                ])),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue"]),
-          s(L, {
-            modelValue: t.tab,
-            "onUpdate:modelValue": e[10] || (e[10] = (o) => t.tab = o)
-          }, {
-            default: n(() => [
-              s(M, {
-                value: "0",
-                eager: ""
-              }, {
-                default: n(() => [
-                  k("div", ie, [
-                    s(c, null, {
-                      default: n(() => [
-                        s(y, null, {
-                          default: n(() => [
-                            s(w, { class: "pa-0" }, {
-                              default: n(() => [
-                                s(f, {
-                                  modelValue: t.graph.title,
-                                  "onUpdate:modelValue": e[1] || (e[1] = (o) => t.graph.title = o),
-                                  class: "pb-2",
-                                  label: "Title",
-                                  "hide-details": ""
-                                }, null, 8, ["modelValue"])
-                              ]),
-                              _: 1
-                            })
-                          ]),
-                          _: 1
-                        }),
-                        s(y, null, {
-                          default: n(() => [
-                            s(T, {
-                              modelValue: t.graph.legendPosition,
-                              "onUpdate:modelValue": e[2] || (e[2] = (o) => t.graph.legendPosition = o),
-                              label: "Legend Position",
-                              "hide-details": "",
-                              items: t.legendPositions,
-                              style: { "max-width": "280px" }
-                            }, null, 8, ["modelValue", "items"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  k("div", se, [
-                    s(w, { class: "pa-0" }, {
-                      default: n(() => e[18] || (e[18] = [
-                        g(" Select a start date/time for the graph. Leave blank for start now. ")
-                      ])),
-                      _: 1
-                    }),
-                    s(c, null, {
-                      default: n(() => [
-                        s(y, null, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.startDate,
-                              "onUpdate:modelValue": e[3] || (e[3] = (o) => t.startDate = o),
-                              label: "Start Date",
-                              name: `date${Date.now()}`,
-                              rules: [t.rules.date],
-                              type: "date"
-                            }, null, 8, ["modelValue", "name", "rules"])
-                          ]),
-                          _: 1
-                        }),
-                        s(y, null, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.startTime,
-                              "onUpdate:modelValue": e[4] || (e[4] = (o) => t.startTime = o),
-                              label: "Start Time",
-                              name: `time${Date.now()}`,
-                              rules: [t.rules.time],
-                              type: "time",
-                              step: "1"
-                            }, null, 8, ["modelValue", "name", "rules"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    }),
-                    s(w, { class: "pa-0" }, {
-                      default: n(() => e[19] || (e[19] = [
-                        g(" Select a end date/time for the graph. Leave blank for continuous real-time graphing. ")
-                      ])),
-                      _: 1
-                    }),
-                    s(c, null, {
-                      default: n(() => [
-                        s(y, null, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.endDate,
-                              "onUpdate:modelValue": e[5] || (e[5] = (o) => t.endDate = o),
-                              label: "End Date",
-                              name: `date${Date.now()}`,
-                              rules: [t.rules.date],
-                              type: "date"
-                            }, null, 8, ["modelValue", "name", "rules"])
-                          ]),
-                          _: 1
-                        }),
-                        s(y, null, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.endTime,
-                              "onUpdate:modelValue": e[6] || (e[6] = (o) => t.endTime = o),
-                              label: "End Time",
-                              name: `time${Date.now()}`,
-                              rules: [t.rules.time],
-                              type: "time",
-                              step: "1"
-                            }, null, 8, ["modelValue", "name", "rules"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ])
-                ]),
-                _: 1
-              }),
-              s(M, {
-                value: "1",
-                eager: ""
-              }, {
-                default: n(() => [
-                  k("div", le, [
-                    s(w, { class: "pa-0" }, {
-                      default: n(() => e[20] || (e[20] = [
-                        g(" Set a min or max Y value to override automatic scaling ")
-                      ])),
-                      _: 1
-                    }),
-                    s(c, { dense: "" }, {
-                      default: n(() => [
-                        s(y, { class: "px-2" }, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.graph.graphMinY,
-                              "onUpdate:modelValue": e[7] || (e[7] = (o) => t.graph.graphMinY = o),
-                              "hide-details": "",
-                              label: "Min Y Axis (Optional)",
-                              type: "number"
-                            }, null, 8, ["modelValue"])
-                          ]),
-                          _: 1
-                        }),
-                        s(y, { class: "px-2" }, {
-                          default: n(() => [
-                            s(f, {
-                              modelValue: t.graph.graphMaxY,
-                              "onUpdate:modelValue": e[8] || (e[8] = (o) => t.graph.graphMaxY = o),
-                              "hide-details": "",
-                              label: "Max Y Axis (Optional)",
-                              type: "number"
-                            }, null, 8, ["modelValue"])
-                          ]),
-                          _: 1
-                        })
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  k("div", ae, [
-                    s(S, {
-                      density: "compact",
-                      class: "horizontal-lines"
-                    }, {
-                      default: n(() => [
-                        s(x, null, {
-                          default: n(() => [
-                            e[22] || (e[22] = k("span", { style: { "padding-top": "5px" } }, " Add horizontal lines to the graph ", -1)),
-                            s(r),
-                            s(D, {
-                              onClick: e[9] || (e[9] = (o) => a.addLine())
-                            }, {
-                              default: n(() => e[21] || (e[21] = [
-                                g(" New Line ")
-                              ])),
-                              _: 1
-                            })
-                          ]),
-                          _: 1
-                        }),
-                        (v(!0), N(X, null, j(t.graph.lines, (o, R) => (v(), b(x, {
-                          key: R,
-                          value: o,
-                          color: "primary"
-                        }, {
-                          default: n(() => [
-                            s(c, null, {
-                              default: n(() => [
-                                s(y, null, {
-                                  default: n(() => [
-                                    s(f, {
-                                      modelValue: o.yValue,
-                                      "onUpdate:modelValue": (Y) => o.yValue = Y,
-                                      label: "Y Value"
-                                    }, null, 8, ["modelValue", "onUpdate:modelValue"])
-                                  ]),
-                                  _: 2
-                                }, 1024),
-                                s(y, null, {
-                                  default: n(() => [
-                                    s(T, {
-                                      modelValue: o.color,
-                                      "onUpdate:modelValue": (Y) => o.color = Y,
-                                      label: "Color",
-                                      "hide-details": "",
-                                      items: i.colors
-                                    }, null, 8, ["modelValue", "onUpdate:modelValue", "items"])
-                                  ]),
-                                  _: 2
-                                }, 1024),
-                                s(y, null, {
-                                  default: n(() => [
-                                    s(D, {
-                                      style: { padding: "30px" },
-                                      icon: "mdi-delete",
-                                      variant: "text",
-                                      "aria-label": "Remove Line",
-                                      onClick: (Y) => a.removeLine(o)
-                                    }, null, 8, ["onClick"])
-                                  ]),
-                                  _: 2
-                                }, 1024)
-                              ]),
-                              _: 2
-                            }, 1024)
-                          ]),
-                          _: 2
-                        }, 1032, ["value"]))), 128))
-                      ]),
-                      _: 1
-                    })
-                  ])
-                ]),
-                _: 1
-              }),
-              s(M, {
-                value: "2",
-                eager: ""
-              }, {
-                default: n(() => [
-                  s(E, {
-                    "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: o }) => [
-                      s(D, {
-                        icon: "mdi-delete",
-                        variant: "text",
-                        "aria-label": "Remove Item",
-                        onClick: (R) => t.$emit("remove", o)
-                      }, null, 8, ["onClick"])
-                    ]),
-                    "no-data": n(() => e[23] || (e[23] = [
-                      k("span", null, " Currently no items on this graph ", -1)
-                    ])),
-                    _: 1
-                  }, 8, ["headers", "items"])
-                ]),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue"]),
-          s(U, { class: "px-2" }, {
-            default: n(() => [
-              s(r),
-              s(D, {
-                variant: "outlined",
-                onClick: e[11] || (e[11] = (o) => t.$emit("cancel"))
-              }, {
-                default: n(() => e[24] || (e[24] = [
-                  g(" Cancel ")
-                ])),
-                _: 1
-              }),
-              s(D, {
-                variant: "flat",
-                onClick: a.closeOk
-              }, {
-                default: n(() => e[25] || (e[25] = [
-                  g(" Ok ")
-                ])),
-                _: 1
-              }, 8, ["onClick"])
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      })
-    ]),
-    _: 1
-  }, 8, ["modelValue"]);
-}
-const oe = /* @__PURE__ */ P(te, [["render", ne]]), re = {
-  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
-        { title: "NONE", value: "DECOM" },
-        { title: "REDUCED_MINUTE", value: "REDUCED_MINUTE" },
-        { title: "REDUCED_HOUR", value: "REDUCED_HOUR" },
-        { title: "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 }, new $().get_item(this.item.targetName, this.item.packetName, this.item.itemName).then((t) => {
-      for (const [e, i] of Object.entries(t.limits))
-        Object.keys(i).includes("red_low") && (this.limits[e] = Object.values(i));
-      this.limitsName = Object.keys(this.limits).find(
-        // Little hack to compare arrays you convert them to strings
-        (e) => this.limits[e] + "" == this.editItem.limits + ""
-      );
-    });
-  }
-}, de = { key: 0 }, ue = { class: "pa-3" };
-function he(t, e, i, u, l, a) {
-  const r = h("v-card-title"), d = h("v-select"), m = h("v-card-text"), p = h("v-spacer"), f = h("v-btn"), w = h("v-card-actions"), y = h("v-card"), T = h("v-dialog");
-  return v(), b(T, {
-    modelValue: a.show,
-    "onUpdate:modelValue": e[9] || (e[9] = (c) => a.show = c),
-    width: "400",
-    onKeydown: e[10] || (e[10] = K((c) => t.success(), ["enter"]))
-  }, {
-    default: n(() => [
-      s(y, null, {
-        default: n(() => [
-          s(r, { class: "mb-2" }, {
-            default: n(() => e[11] || (e[11] = [
-              g("Edit Item")
-            ])),
-            _: 1
-          }),
-          s(m, null, {
-            default: n(() => [
-              s(d, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Value Type",
-                items: t.valueTypes,
-                modelValue: t.editItem.valueType,
-                "onUpdate:modelValue": e[0] || (e[0] = (c) => t.editItem.valueType = c),
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              s(d, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Reduction",
-                items: t.reduction,
-                modelValue: t.editItem.reduced,
-                "onUpdate:modelValue": e[1] || (e[1] = (c) => t.editItem.reduced = c),
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              s(d, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Reduced Type",
-                items: t.reducedTypes,
-                disabled: t.editItem.reduced === "DECOM",
-                modelValue: t.editItem.reducedType,
-                "onUpdate:modelValue": e[2] || (e[2] = (c) => t.editItem.reducedType = c),
-                class: "mb-2"
-              }, null, 8, ["items", "disabled", "modelValue"]),
-              s(d, {
-                variant: "outlined",
-                "hide-details": "",
-                label: "Color",
-                items: i.colors,
-                modelValue: t.editItem.color,
-                "onUpdate:modelValue": [
-                  e[3] || (e[3] = (c) => t.editItem.color = c),
-                  e[4] || (e[4] = (c) => t.$emit("changeColor", c))
-                ],
-                class: "mb-2"
-              }, null, 8, ["items", "modelValue"]),
-              a.limitsNames.length > 1 ? (v(), N("div", de, [
-                s(d, {
-                  variant: "outlined",
-                  "hide-details": "",
-                  label: "Display Limits",
-                  items: a.limitsNames,
-                  modelValue: t.limitsName,
-                  "onUpdate:modelValue": [
-                    e[5] || (e[5] = (c) => t.limitsName = c),
-                    e[6] || (e[6] = (c) => t.$emit("changeLimits", t.limits[t.limitsName]))
-                  ]
-                }, null, 8, ["items", "modelValue"]),
-                k("div", ue, C(t.limitsName) + ": " + C(t.limits[t.limitsName]), 1)
-              ])) : _("", !0)
-            ]),
-            _: 1
-          }),
-          s(w, { class: "px-2" }, {
-            default: n(() => [
-              s(p),
-              s(f, {
-                variant: "outlined",
-                onClick: e[7] || (e[7] = (c) => t.$emit("cancel"))
-              }, {
-                default: n(() => e[12] || (e[12] = [
-                  g(" Cancel ")
-                ])),
-                _: 1
-              }),
-              s(f, {
-                variant: "flat",
-                onClick: e[8] || (e[8] = (c) => t.$emit("close", t.editItem))
-              }, {
-                default: n(() => e[13] || (e[13] = [
-                  g(" Ok ")
-                ])),
-                _: 1
-              })
-            ]),
-            _: 1
-          })
-        ]),
-        _: 1
-      })
-    ]),
-    _: 1
-  }, 8, ["modelValue"]);
-}
-const me = /* @__PURE__ */ P(re, [["render", he]]), pe = {
-  components: {
-    GraphEditDialog: oe,
-    GraphEditItemDialog: me
-  },
-  mixins: [B],
-  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"
-    }
-  },
-  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 ee(),
-      subscription: null,
-      needToUpdate: !1,
-      errorDialog: !1,
-      errors: [],
-      colorIndex: 0,
-      colors: [
-        // The first 3 are taken from the Astro css definitions for
-        // --color-data-visualization-1 through 3
-        "#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;
-    }
-  },
-  watch: {
-    state: function(t, e) {
-      switch (t) {
-        case "start":
-          e === "stop" && this.startGraph();
-          break;
-        // case 'pause': Nothing to do ... see the data function
-        case "stop":
-          this.stopGraph();
-          break;
-      }
-    },
-    data: function(t, e) {
-      this.dataChanged = !0;
-    },
-    graphMinY: function(t, e) {
-      let i = parseFloat(t);
-      isNaN(i) || (this.graphMinY = i), this.setGraphRange();
-    },
-    graphMaxY: function(t, e) {
-      let i = parseFloat(t);
-      isNaN(i) || (this.graphMaxY = i), 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);
-    }
-  },
-  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(
-      (u, l) => {
-        const a = {
-          spanGaps: !0
-        };
-        return u.chartSeries.push({
-          ...a,
-          item: l,
-          label: this.formatLabel(l),
-          stroke: (r, d) => this.items[d - 1].color,
-          width: 2,
-          value: (r, d) => typeof d == "string" || isNaN(d) ? "NaN" : d == null ? "--" : d.toFixed(3)
-        }), u.overviewSeries.push({
-          ...a
-        }), u;
-      },
-      { chartSeries: [], overviewSeries: [] }
-    );
-    let i = {};
-    if (this.sparkline)
-      this.hideToolbarData = !0, this.hideOverviewData = !0, this.showOverview = !1, i = {
-        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 V(
-        i,
-        this.data,
-        document.getElementById(`chart${this.id}`)
-      );
-    else {
-      let u = Intl.DateTimeFormat().resolvedOptions().timeZone;
-      this.timeZone && this.timeZone !== "local" && (u = this.timeZone), i = {
-        ...this.getSize("chart"),
-        ...this.getScales(),
-        ...this.getAxes("chart"),
-        // series: series, // TODO: Uncomment with the performance code
-        plugins: [this.linesPlugin()],
-        tzDate: (a) => V.tzDate(new Date(a * 1e3), u),
-        series: [
-          {
-            label: "Time",
-            value: (a, r) => (
-              // Convert the unix timestamp into a formatted date / time
-              r == null ? "--" : this.formatSeconds(r, 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, r, d) => (m) => {
-              this.state === "pause" && a.select.width === 0 && this.$emit("start"), d(m);
-            }
-          }
-        },
-        hooks: {
-          setScale: [
-            (a, r) => {
-              if (r === "x" && !this.zoomOverview && this.overview) {
-                this.zoomChart = !0;
-                let d = Math.round(
-                  this.overview.valToPos(a.scales.x.min, "x")
-                ), m = Math.round(
-                  this.overview.valToPos(a.scales.x.max, "x")
-                );
-                this.overview.setSelect({ left: d, width: m - d }), this.zoomChart = !1;
-              }
-            }
-          ],
-          setSelect: [
-            (a) => {
-              this.state === "start" && a.select.width > 0 && this.$emit("pause");
-            }
-          ],
-          ready: [
-            (a) => {
-              a.root.querySelector(".u-over").addEventListener("contextmenu", (m) => {
-                m.preventDefault(), this.itemMenu = !1, this.legendMenu = !1, this.editGraphMenuX = m.clientX, this.editGraphMenuY = m.clientY, this.editGraphMenu = !0;
-              });
-              let d = a.root.querySelector(".u-legend");
-              d.addEventListener("contextmenu", (m) => {
-                m.preventDefault(), this.editGraphMenu = !1, this.legendMenu = !1, this.itemMenuX = m.clientX, this.itemMenuY = m.clientY;
-                let p = m.target.closest(".u-series"), f = Array.prototype.slice.call(d.childNodes[0].childNodes).indexOf(p), w = a.series[f];
-                w.item ? (this.selectedItem = w.item, this.itemMenu = !0) : (this.itemMenu = !1, this.legendMenuX = m.clientX, this.legendMenuY = m.clientY, this.legendMenu = !0);
-              }), d.querySelector("tbody").appendChild(this.$refs.info);
-            }
-          ]
-        }
-      }, this.graph = new V(
-        i,
-        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) => V.tzDate(new Date(a * 1e3), u),
-        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 r = a.posToVal(a.select.left, "x"), d = a.posToVal(
-                  a.select.left + a.select.width,
-                  "x"
-                );
-                this.graph.setScale("x", { min: r, max: d }), this.zoomOverview = !1;
-              }
-            }
-          ]
-        }
-      };
-      this.hideOverview || (this.overview = new V(
-        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);
-  },
-  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], i = this.data[0][0];
-      i < t - this.secondsGraphed && (i = t - this.secondsGraphed), e > i && (i = e), this.graph.setScale("x", { min: i, 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, i, u) => {
-        let l = i;
-        (this.graphMinY || this.graphMinY === 0) && (l = this.graphMinY);
-        let a = u;
-        return (this.graphMaxY || this.graphMaxY === 0) && (a = this.graphMaxY), V.rangeNum(l, a, t, !0);
-      };
-    },
-    subscribe: function() {
-      this.cable.createSubscription("StreamingChannel", window.openc3Scope, {
-        received: (t) => this.received(t),
-        connected: () => {
-          this.addItemsToSubscription(this.items);
-        },
-        disconnected: (t) => {
-          t.allowReconnect && 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 i = document.getElementById("openc3-nav-drawer");
-      i && (e = i.classList.contains(
-        "v-navigation-drawer--active"
-      ) ? i.clientWidth : 0);
-      let u = 0;
-      (this.legendPosition === "right" || this.legendPosition === "left") && (u = document.getElementsByClassName("u-legend")[0].clientWidth);
-      const l = Math.max(document.documentElement.clientWidth, window.innerWidth || 0) - e - u, a = Math.max(
-        document.documentElement.clientHeight,
-        window.innerHeight || 0
-      ), r = document.getElementsByClassName("v-expansion-panel")[0];
-      let d = 100;
-      t === "overview" ? this.fullHeight && !this.hideOverviewData ? this.showOverview = !0 : this.showOverview = !1 : (d = a - r.clientHeight - d - 250, this.fullHeight || (d = d / 2 + 10));
-      let m = l - 70;
-      return this.fullWidth || (m = m / 2 - 12), {
-        width: this.width || m,
-        height: this.height || d
-      };
-    },
-    getScales: function() {
-      return {
-        scales: {
-          x: {
-            range(t, e, i) {
-              return e == null ? [1566453600, 1566497660] : [e, i];
-            }
-          },
-          y: {
-            range(t, e, i) {
-              return e == null ? [-100, 100] : V.rangeNum(e, i, 0.1, !0);
-            }
-          }
-        }
-      };
-    },
-    getAxes: function(t) {
-      let e = "rgba(255, 255, 255, .1)", i = "white";
-      return {
-        axes: [
-          {
-            stroke: i,
-            grid: {
-              show: !0,
-              stroke: e,
-              width: 2
-            }
-          },
-          {
-            size: 80,
-            // This size supports values up to 8 digits plus sign
-            stroke: i,
-            grid: {
-              show: t !== "overview",
-              stroke: e,
-              width: 2
-            },
-            // Forces the axis values to be formatted correctly
-            // especially with really small or large values
-            values(u, 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), i = this.indexes[e];
-      this.items[i - 1].color = t, this.selectedItem.color = t, this.graph.root.querySelectorAll(".u-marker")[i].style.borderColor = t;
-    },
-    changeLimits: function(t) {
-      let e = this.subscriptionKey(this.selectedItem), i = this.indexes[e];
-      this.items[i - 1].limits = t, this.selectedItem.limits = t, this.limitsValues = t;
-    },
-    linesPlugin: function() {
-      return {
-        hooks: {
-          draw: (t) => {
-            const { ctx: e, bbox: i } = t, u = 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), r = t.valToPos(this.limitsValues[1], "y", !0), d = t.valToPos(this.limitsValues[2], "y", !0), m = t.valToPos(this.limitsValues[3], "y", !0);
-            if (this.lines.forEach((p) => {
-              t.scales.y.min <= p.yValue && p.yValue <= t.scales.y.max && (e.save(), e.beginPath(), e.strokeStyle = p.color, e.lineWidth = 2, e.moveTo(i.left, t.valToPos(p.yValue, "y", !0)), e.lineTo(
-                i.left + i.width,
-                t.valToPos(p.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 p = a < l ? l : a;
-              e.fillRect(i.left, a, i.width, u - p);
-            }
-            if (t.scales.y.max > this.limitsValues[3]) {
-              let p = u < m ? u : m;
-              e.fillRect(i.left, l, i.width, p - 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 p = r < l ? l : r;
-              e.fillRect(i.left, p, i.width, a - p);
-            }
-            if (t.scales.y.max > this.limitsValues[2] && // yellowHigh
-            t.scales.y.min < this.limitsValues[3]) {
-              let p = u < m ? u : m, f = u < d ? u : d;
-              e.fillRect(i.left, p, i.width, f - p);
-            }
-            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 p = d < l ? l : d, f = u < r ? u : r;
-                e.fillRect(i.left, p, i.width, f - p);
-              }
-            } else {
-              const p = t.valToPos(this.limitsValues[4], "y", !0), f = t.valToPos(this.limitsValues[5], "y", !0);
-              if (t.scales.y.min < this.limitsValues[4] && // greenLow
-              t.scales.y.max > this.limitsValues[1]) {
-                let T = p < l ? l : p;
-                e.fillRect(i.left, T, i.width, r - T);
-              }
-              if (t.scales.y.max > this.limitsValues[5] && // greenHigh
-              t.scales.y.min < this.limitsValues[2]) {
-                let T = u < d ? u : d, c = u < f ? u : f;
-                e.fillRect(i.left, T, i.width, c - T);
-              }
-              e.fillStyle = "rgba(0,0,255,0.15)";
-              let w = f < l ? l : f, y = u < p ? u : p;
-              e.fillRect(i.left, w, i.width, y - w);
-            }
-            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((i) => {
-        i.valueType || (i.valueType = e), i.color || (i.color = this.colors[this.colorIndex]), i.limits || (i.limits = []), i.limits.length > 0 && (this.limitsValues = i.limits), this.colorIndex = (this.colorIndex + 1) % this.colors.length, this.items.push(i);
-        const u = this.data.length;
-        this.graph.addSeries(this.createSeriesConfig(i), u), this.overview && this.overview.addSeries(this.createOverviewSeriesConfig(), u), this.data.splice(u, 0, Array(this.data[0].length)), this.indexes[this.subscriptionKey(i)] = u;
-      }), 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, i) => this.items[i - 1].color,
-        width: 2,
-        value: (e, i) => typeof i == "string" || isNaN(i) ? "NaN" : i == null ? "--" : Math.abs(i) < 0.01 && i !== 0 || Math.abs(i) >= 1e7 ? i.toExponential(6) : i.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 i = this.colors.indexOf(e.color);
-        i !== -1 && (this.colorIndex = (i + 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(
-        (i) => {
-          i && 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 i = this.indexes[e];
-        this.data[i] = 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 && this.overview.setData(this.data));
-    },
-    removeItems: function(t) {
-      this.removeItemsFromSubscription(t);
-      for (const e of t.map(this.subscriptionKey)) {
-        const i = this.reorderIndexes(e);
-        this.items.splice(i - 1, 1), this.data.splice(i, 1), this.graph.delSeries(i), this.graph.setData(this.data), this.overview && (this.overview.delSeries(i), this.overview.setData(this.data));
-      }
-      this.data.length === 1 && (this.data[0] = [], this.graph.setData(this.data), this.overview && 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 i in this.indexes)
-        this.indexes[i] > e && (this.indexes[i] -= 1);
-      return e;
-    },
-    received: function(t) {
-      this.cable.recordPing();
-      for (let e = 0; e < t.length; e++) {
-        let i = t[e].__time / 1e9, u = this.data[0].length;
-        if (u === 0 || i > this.data[0][u - 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, i, t[e]);
-        } else {
-          let l = A(this.data[0], i, this.bs_comparator);
-          if (l >= 0) {
-            for (; l >= 0; )
-              i -= 1e-5, l = A(this.data[0], i, this.bs_comparator);
-            let a = -l - 1;
-            for (let r = 0; r < this.data.length; r++)
-              this.data[r].splice(a, 0, null);
-            this.set_data_at_index(a, i, t[e]);
-          } else {
-            let a = -l - 1;
-            for (let r = 0; r < this.data.length; r++)
-              this.data[r].splice(a, 0, null);
-            this.set_data_at_index(a, i, 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, i) {
-      this.data[0][t] = e;
-      for (const [u, l] of Object.entries(i)) {
-        if (u === "time")
-          continue;
-        let a = this.indexes[u];
-        if (a) {
-          let r = this.data[a];
-          if (l != null && l.raw)
-            r[t] = null;
-          else if (typeof l == "string") {
-            if (r[t] = null, !u.includes("__RAW")) {
-              for (let d of this.items)
-                if (this.subscriptionKey(d) === u) {
-                  this.selectedItem = d;
-                  break;
-                }
-              this.changeItem({
-                valueType: "RAW",
-                reduced: this.selectedItem.reduced,
-                reducedType: this.selectedItem.reducedType
-              });
-            }
-          } else
-            r[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;
-    }
-  }
-}, ce = {
-  id: "chart",
-  ref: "chart",
-  class: "pa-1"
-}, fe = ["id"], ge = ["id"], ve = {
-  key: 5,
-  ref: "info",
-  class: "u-series"
-};
-function ye(t, e, i, u, l, a) {
-  const r = h("v-btn"), d = h("v-spacer"), m = h("v-toolbar"), p = h("v-expand-transition"), f = h("v-card"), w = h("graph-edit-dialog"), y = h("v-text-field"), T = h("v-row"), c = h("v-textarea"), M = h("v-dialog"), D = h("v-list-item-title"), x = h("v-list-item"), S = h("v-list"), E = h("v-menu"), L = h("graph-edit-item-dialog"), U = h("v-list-subheader"), I = h("v-icon"), z = h("v-tooltip");
-  return v(), N("div", {
-    onClick: e[21] || (e[21] = H((o) => t.$emit("click"), ["prevent"]))
-  }, [
-    s(f, null, {
-      default: n(() => [
-        O(s(m, {
-          height: "24",
-          class: F(["pl-2 pr-2", i.selectedGraphId === i.id ? "active" : ""])
-        }, {
-          default: n(() => [
-            O(s(r, {
-              class: "mx-2",
-              icon: "mdi-alert",
-              density: "compact",
-              variant: "text",
-              "aria-label": "Show Errors",
-              onClick: e[0] || (e[0] = () => {
-                l.errorDialog = !0;
-              })
-            }, null, 512), [
-              [G, l.errors.length !== 0]
-            ]),
-            s(r, {
-              icon: "mdi-pencil",
-              variant: "text",
-              density: "compact",
-              "data-test": "edit-graph-icon",
-              "aria-label": "Edit Graph",
-              onClick: e[1] || (e[1] = () => {
-                l.editGraph = !0;
-              })
-            }),
-            s(d),
-            k("span", null, C(l.title), 1),
-            s(d),
-            l.expand ? (v(), N(X, { key: 0 }, [
-              a.calcFullSize ? (v(), b(r, {
-                key: 0,
-                icon: "mdi-arrow-collapse",
-                variant: "text",
-                density: "compact",
-                "data-test": "collapse-all",
-                onClick: a.collapseAll
-              }, null, 8, ["onClick"])) : (v(), b(r, {
-                key: 1,
-                icon: "mdi-arrow-expand",
-                variant: "text",
-                density: "compact",
-                "data-test": "expand-all",
-                onClick: a.expandAll
-              }, null, 8, ["onClick"])),
-              l.fullWidth ? (v(), b(r, {
-                key: 2,
-                icon: "mdi-arrow-collapse-horizontal",
-                variant: "text",
-                density: "compact",
-                "data-test": "collapse-width",
-                onClick: a.collapseWidth
-              }, null, 8, ["onClick"])) : (v(), b(r, {
-                key: 3,
-                icon: "mdi-arrow-expand-horizontal",
-                variant: "text",
-                density: "compact",
-                "data-test": "expand-width",
-                onClick: a.expandWidth
-              }, null, 8, ["onClick"])),
-              l.fullHeight ? (v(), b(r, {
-                key: 4,
-                icon: "mdi-arrow-collapse-vertical",
-                variant: "text",
-                density: "compact",
-                "data-test": "collapse-height",
-                onClick: a.collapseHeight
-              }, null, 8, ["onClick"])) : (v(), b(r, {
-                key: 5,
-                icon: "mdi-arrow-expand-vertical",
-                variant: "text",
-                density: "compact",
-                "data-test": "expand-height",
-                onClick: a.expandHeight
-              }, null, 8, ["onClick"]))
-            ], 64)) : _("", !0),
-            l.expand ? (v(), b(r, {
-              key: 1,
-              icon: "mdi-window-minimize",
-              variant: "text",
-              density: "compact",
-              "data-test": "minimize-screen-icon",
-              onClick: a.minMaxTransition
-            }, null, 8, ["onClick"])) : (v(), b(r, {
-              key: 2,
-              icon: "mdi-window-maximize",
-              variant: "text",
-              density: "compact",
-              "data-test": "maximize-screen-icon",
-              onClick: a.minMaxTransition
-            }, null, 8, ["onClick"])),
-            s(r, {
-              icon: "mdi-close-box",
-              variant: "text",
-              density: "compact",
-              "data-test": "close-graph-icon",
-              onClick: e[2] || (e[2] = H((o) => t.$emit("close-graph"), ["stop"]))
-            })
-          ]),
-          _: 1
-        }, 8, ["class"]), [
-          [G, !l.hideToolbarData]
-        ]),
-        s(p, null, {
-          default: n(() => [
-            O(k("div", ce, [
-              k("div", {
-                id: `chart${i.id}`
-              }, null, 8, fe),
-              e[22] || (e[22] = k("div", { id: "betweenCharts" }, null, -1)),
-              O(k("div", {
-                id: `overview${i.id}`
-              }, null, 8, ge), [
-                [G, l.showOverview]
-              ])
-            ], 512), [
-              [G, l.expand]
-            ])
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }),
-    l.editGraph ? (v(), b(w, {
-      key: 0,
-      modelValue: l.editGraph,
-      "onUpdate:modelValue": e[3] || (e[3] = (o) => l.editGraph = o),
-      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": i.timeZone,
-      onRemove: e[4] || (e[4] = (o) => a.removeItems([o])),
-      onOk: a.editGraphClose,
-      onCancel: e[5] || (e[5] = (o) => 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"])) : _("", !0),
-    s(M, {
-      modelValue: l.errorDialog,
-      "onUpdate:modelValue": e[7] || (e[7] = (o) => l.errorDialog = o),
-      "max-width": "600"
-    }, {
-      default: n(() => [
-        s(m, { height: "24" }, {
-          default: n(() => [
-            s(d),
-            e[23] || (e[23] = k("span", null, " Errors ", -1)),
-            s(d)
-          ]),
-          _: 1
-        }),
-        s(f, { class: "pa-3" }, {
-          default: n(() => [
-            s(T, { dense: "" }, {
-              default: n(() => [
-                s(y, {
-                  modelValue: l.title,
-                  "onUpdate:modelValue": e[6] || (e[6] = (o) => l.title = o),
-                  readonly: "",
-                  "hide-details": "",
-                  class: "pb-2",
-                  label: "Graph Title"
-                }, null, 8, ["modelValue"])
-              ]),
-              _: 1
-            }),
-            s(T, { class: "my-3" }, {
-              default: n(() => [
-                s(c, {
-                  readonly: "",
-                  rows: "8",
-                  value: a.error
-                }, null, 8, ["value"])
-              ]),
-              _: 1
-            }),
-            s(T, null, {
-              default: n(() => [
-                s(r, {
-                  block: "",
-                  onClick: a.clearErrors
-                }, {
-                  default: n(() => e[24] || (e[24] = [
-                    g(" Clear ")
-                  ])),
-                  _: 1
-                }, 8, ["onClick"])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue"]),
-    l.editGraphMenu ? (v(), b(E, {
-      key: 1,
-      modelValue: l.editGraphMenu,
-      "onUpdate:modelValue": e[9] || (e[9] = (o) => l.editGraphMenu = o),
-      target: [l.editGraphMenuX, l.editGraphMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        s(S, null, {
-          default: n(() => [
-            s(x, {
-              onClick: e[8] || (e[8] = (o) => l.editGraph = !0)
-            }, {
-              default: n(() => [
-                s(D, { style: { cursor: "pointer" } }, {
-                  default: n(() => [
-                    g(" Edit " + C(l.title), 1)
-                  ]),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : _("", !0),
-    l.editItem ? (v(), b(L, {
-      key: 2,
-      modelValue: l.editItem,
-      "onUpdate:modelValue": e[10] || (e[10] = (o) => l.editItem = o),
-      colors: l.colors,
-      item: l.selectedItem,
-      onChangeColor: a.changeColor,
-      onChangeLimits: a.changeLimits,
-      onCancel: e[11] || (e[11] = (o) => l.editItem = !1),
-      onClose: a.closeEditItem
-    }, null, 8, ["modelValue", "colors", "item", "onChangeColor", "onChangeLimits", "onClose"])) : _("", !0),
-    l.itemMenu ? (v(), b(E, {
-      key: 3,
-      modelValue: l.itemMenu,
-      "onUpdate:modelValue": e[15] || (e[15] = (o) => l.itemMenu = o),
-      target: [l.itemMenuX, l.itemMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        s(S, {
-          nav: "",
-          density: "compact"
-        }, {
-          default: n(() => [
-            s(U, null, {
-              default: n(() => [
-                g(C(l.selectedItem.targetName) + " " + C(l.selectedItem.packetName) + " " + C(l.selectedItem.itemName), 1)
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[12] || (e[12] = (o) => l.editItem = !0)
-            }, {
-              prepend: n(() => [
-                s(I, { icon: "mdi-pencil" })
-              ]),
-              default: n(() => [
-                s(D, null, {
-                  default: n(() => e[25] || (e[25] = [
-                    g(" Edit ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[13] || (e[13] = (o) => a.clearData([l.selectedItem]))
-            }, {
-              prepend: n(() => [
-                s(I, { icon: "mdi-eraser" })
-              ]),
-              default: n(() => [
-                s(D, null, {
-                  default: n(() => e[26] || (e[26] = [
-                    g(" Clear ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[14] || (e[14] = (o) => a.removeItems([l.selectedItem]))
-            }, {
-              prepend: n(() => [
-                s(I, { icon: "mdi-delete" })
-              ]),
-              default: n(() => [
-                s(D, null, {
-                  default: n(() => e[27] || (e[27] = [
-                    g(" Delete ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : _("", !0),
-    l.legendMenu ? (v(), b(E, {
-      key: 4,
-      modelValue: l.legendMenu,
-      "onUpdate:modelValue": e[20] || (e[20] = (o) => l.legendMenu = o),
-      target: [l.legendMenuX, l.legendMenuY],
-      absolute: "",
-      "offset-y": ""
-    }, {
-      default: n(() => [
-        s(S, null, {
-          default: n(() => [
-            s(x, {
-              onClick: e[16] || (e[16] = (o) => a.moveLegend("top"))
-            }, {
-              default: n(() => [
-                s(D, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[28] || (e[28] = [
-                    g(" Legend Top ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[17] || (e[17] = (o) => a.moveLegend("bottom"))
-            }, {
-              default: n(() => [
-                s(D, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[29] || (e[29] = [
-                    g(" Legend Bottom ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[18] || (e[18] = (o) => a.moveLegend("left"))
-            }, {
-              default: n(() => [
-                s(D, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[30] || (e[30] = [
-                    g(" Legend Left ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            }),
-            s(x, {
-              onClick: e[19] || (e[19] = (o) => a.moveLegend("right"))
-            }, {
-              default: n(() => [
-                s(D, { style: { cursor: "pointer" } }, {
-                  default: n(() => e[31] || (e[31] = [
-                    g(" Legend RIght ")
-                  ])),
-                  _: 1
-                })
-              ]),
-              _: 1
-            })
-          ]),
-          _: 1
-        })
-      ]),
-      _: 1
-    }, 8, ["modelValue", "target"])) : _("", !0),
-    i.sparkline ? _("", !0) : (v(), N("div", ve, [
-      s(z, {
-        text: "Click item to toggle, Right click to edit",
-        location: "top"
-      }, {
-        activator: n(({ props: o }) => [
-          s(I, J(Q(o)), {
-            default: n(() => e[32] || (e[32] = [
-              g(" mdi-information-variant-circle ")
-            ])),
-            _: 2
-          }, 1040)
-        ]),
-        _: 1
-      })
-    ], 512))
-  ]);
-}
-const _e = /* @__PURE__ */ P(pe, [["render", ye], ["__scopeId", "data-v-f455219c"]]);
-export {
-  _e as G,
-  oe as a,
-  me as b
-};
-//# sourceMappingURL=Graph-DCihpnT0.js.map