@openc3/vue-common 6.3.0 → 6.4.1

package/dist/Openc3Screen-DFYYhHt7.js

@@ -0,0 +1,1704 @@
+import { l as I, p as P, b as A, W as G, f as X, g as Y } from "./UpgradeToEnterpriseDialog.vue_vue_type_style_index_0_scoped_2c757408_lang-BOiUmW4q.js";
+import { resolveComponent as a, createBlock as b, openBlock as m, withCtx as r, createVNode as s, createElementVNode as _, toDisplayString as k, createTextVNode as C, withModifiers as D, createElementBlock as T, Fragment as z, renderList as U, ref as H, computed as j, watch as B, createCommentVNode as V, withKeys as q, withDirectives as O, vShow as M, normalizeStyle as $, normalizeProps as N, guardReactiveProps as R } from "vue";
+import { _ as F } from "./CustomIcon-h5X7369N.js";
+import { f as J } from "./fileIcon-DqRHb1_Z.js";
+import { A as W } from "./TopBar-AjYGyx8W.js";
+class Q {
+  constructor() {
+    I.get("/openc3-api/autocomplete/data/screen").then((t) => {
+      this.autocompleteData = t.data;
+    }), this.api = new P();
+  }
+  async getCompletions(t, n, o, i, l) {
+    let p = n.getLine(o.row).slice(0, o.column).trimStart().split(/ (?![^<]*>)/), h = this.autocompleteData;
+    p.length > 1 && (h = h.find((g) => g.caption === p[0]));
+    let d = {}, c = !0;
+    if (h && h.params) {
+      h.params.length == p.length - 1 && (c = !1);
+      let g = h.params[p.length - 2];
+      if (g["Target name"])
+        h = (await this.api.get_target_names()).reduce(
+          (S, w) => (S[w] = 1, S),
+          {}
+        );
+      else if (g["Packet name"]) {
+        let x = p[p.length - 2];
+        h = (await this.api.get_all_tlm(x)).reduce(
+          (w, y) => (w[y.packet_name] = y.description, w),
+          {}
+        );
+      } else if (g["Item name"]) {
+        let x = p[p.length - 3], S = p[p.length - 2];
+        h = (await this.api.get_tlm(x, S)).items.reduce(
+          (y, u) => (y[u.name] = u.description, y),
+          {}
+        );
+      } else
+        h = g;
+      d = Object.keys(h || {}).map((x) => {
+        let S = {
+          value: x + (c ? " " : ""),
+          // We want the autoComplete to continue right up
+          // to the last parameter
+          command: c && "startAutocomplete"
+        };
+        return typeof h[x] == "string" && (S.meta = h[x]), S;
+      });
+    } else
+      d = h;
+    l(null, d);
+  }
+}
+const ee = {
+  props: {
+    modelValue: Boolean,
+    target: {
+      type: String,
+      default: ""
+    },
+    screen: {
+      type: String,
+      default: ""
+    },
+    definition: {
+      type: String,
+      default: ""
+    },
+    keywords: {
+      type: Array,
+      default: () => []
+    },
+    errors: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      file: null,
+      docsKeyword: "",
+      contextMenu: !1,
+      menuX: 0,
+      menuY: 0
+    };
+  },
+  computed: {
+    editErrors: function() {
+      if (this.definition === "" && !this.file)
+        return ["Input can not be blank."];
+      if (this.errors.length !== 0) {
+        let e = /* @__PURE__ */ new Set(), t = [];
+        const n = this.errors.toSorted(
+          (o, i) => o.lineNumber - i.lineNumber
+        );
+        for (const o of n) {
+          let i = `At ${o.lineNumber}: (${o.line}) ${o.message}.`;
+          o.usage && (i += ` Usage: ${o.usage}`), t.push(i), e.add(o.message);
+        }
+        return t;
+      }
+      return [];
+    },
+    show: {
+      get() {
+        return this.modelValue;
+      },
+      set(e) {
+        this.$emit("update:modelValue", e);
+      }
+    }
+  },
+  mounted: function() {
+    this.editor = A.edit(this.$refs.editor), this.editor.setTheme("ace/theme/twilight");
+    const e = this.buildScreenMode();
+    this.editor.session.setMode(new e()), this.editor.session.setTabSize(2), this.editor.session.setUseWrapMode(!0), this.editor.$blockScrolling = 1 / 0, this.editor.setOption("enableBasicAutocompletion", !0), this.editor.setOption("enableLiveAutocompletion", !0), this.editor.completers = [new Q()], this.editor.setHighlightActiveLine(!1), this.editor.setValue(this.definition), this.editor.clearSelection(), W.applyVimModeIfEnabled(this.editor), this.editor.focus();
+  },
+  beforeUnmount() {
+    this.editor.destroy(), this.editor.container.remove();
+  },
+  methods: {
+    toggleVimMode: function() {
+      W.toggleVimMode(this.editor);
+    },
+    showContextMenu: function(e) {
+      this.menuX = e.pageX, this.menuY = e.pageY;
+      let t = this.editor.getCursorPosition(), n = this.editor.session.getTokenAt(t.row, t.column);
+      if (n) {
+        let o = n.value.trim();
+        o.includes(" ") ? this.docsKeyword = o.split(" ")[0] : this.docsKeyword = o, this.contextMenu = !0;
+      }
+    },
+    openDocumentation() {
+      window.open(
+        `${window.location.origin}/tools/staticdocs/docs/configuration/telemetry-screens#${this.docsKeyword.toLowerCase()}`,
+        "_blank"
+      );
+    },
+    buildScreenMode() {
+      let e = A.require("ace/lib/oop"), t = A.require(
+        "ace/mode/text_highlight_rules"
+      ).TextHighlightRules, n = this.keywords.join("|"), o = function() {
+        this.$rules = {
+          start: [
+            {
+              token: "comment",
+              regex: "#.*$"
+            },
+            {
+              token: "string",
+              regex: '".*?"'
+            },
+            {
+              token: "string",
+              regex: "'.*?'"
+            },
+            {
+              token: "constant.numeric",
+              regex: "\\b\\d+(?:\\.\\d+)?\\b"
+            },
+            {
+              token: "keyword",
+              regex: new RegExp(`^\\s*(${n})\\b`)
+            }
+          ]
+        }, this.normalizeRules();
+      };
+      e.inherits(o, t);
+      let i = function() {
+        this.HighlightRules = o;
+      }, l = A.require("ace/mode/text").Mode;
+      return e.inherits(i, l), (function() {
+        this.$id = "ace/mode/openc3";
+      }).call(i.prototype), i;
+    },
+    downloadScreen: function() {
+      const e = new Blob([this.editor.getValue()], {
+        type: "text/plain"
+      }), t = document.createElement("a");
+      t.href = URL.createObjectURL(e), t.setAttribute("download", `${this.screen.toLowerCase()}.txt`), t.click();
+    },
+    loadFile: function() {
+      const e = new FileReader();
+      e.readAsText(this.file);
+      const t = this;
+      e.onload = function() {
+        t.editor.setValue(e.result), t.file = null;
+      };
+    },
+    deleteScreen: function() {
+      this.$dialog.confirm("Are you sure you want to delete this screen?!", {
+        okText: "Delete",
+        cancelText: "Cancel"
+      }).then((e) => {
+        this.$emit("delete");
+      });
+    }
+  }
+}, te = ["textContent"];
+function ne(e, t, n, o, i, l) {
+  const f = a("v-btn"), v = a("v-spacer"), p = a("v-toolbar"), h = a("v-row"), d = a("v-file-input"), c = a("v-list-item-title"), g = a("v-list-item"), x = a("v-divider"), S = a("v-list"), w = a("v-menu"), y = a("v-card-text"), u = a("v-card"), Z = a("v-dialog");
+  return m(), b(Z, {
+    modelValue: l.show,
+    "onUpdate:modelValue": t[5] || (t[5] = (E) => l.show = E),
+    persistent: "",
+    width: "75vw"
+  }, {
+    default: r(() => [
+      s(u, null, {
+        default: r(() => [
+          s(p, { height: "24" }, {
+            default: r(() => [
+              s(f, {
+                class: "mx-2",
+                icon: "mdi-delete",
+                variant: "text",
+                density: "compact",
+                "data-test": "delete-screen-icon",
+                onClick: l.deleteScreen
+              }, null, 8, ["onClick"]),
+              s(v),
+              _("span", null, " Edit Screen: " + k(n.target) + " " + k(n.screen), 1),
+              s(v),
+              s(f, {
+                class: "mx-2",
+                icon: "mdi-download",
+                variant: "text",
+                density: "compact",
+                "data-test": "download-screen-icon",
+                onClick: l.downloadScreen
+              }, null, 8, ["onClick"])
+            ]),
+            _: 1
+          }),
+          s(y, { style: { "max-height": "90vh" } }, {
+            default: r(() => [
+              s(h, { class: "mt-3" }, {
+                default: r(() => t[6] || (t[6] = [
+                  C(" Upload a screen file. ")
+                ])),
+                _: 1
+              }),
+              s(h, {
+                "no-gutters": "",
+                align: "center"
+              }, {
+                default: r(() => [
+                  s(f, {
+                    disabled: !i.file,
+                    color: "primary",
+                    class: "mr-3",
+                    "data-test": "edit-screen-load",
+                    onClick: l.loadFile
+                  }, {
+                    default: r(() => t[7] || (t[7] = [
+                      C(" Load ")
+                    ])),
+                    _: 1
+                  }, 8, ["disabled", "onClick"]),
+                  s(d, {
+                    modelValue: i.file,
+                    "onUpdate:modelValue": t[0] || (t[0] = (E) => i.file = E),
+                    "truncate-length": "15",
+                    accept: ".txt",
+                    label: "Click to select .txt screen file."
+                  }, null, 8, ["modelValue"])
+                ]),
+                _: 1
+              }),
+              s(h, { class: "mb-2" }, {
+                default: r(() => t[8] || (t[8] = [
+                  C(" Edit the screen definition. ")
+                ])),
+                _: 1
+              }),
+              s(h, { class: "mb-2" }, {
+                default: r(() => [
+                  _("pre", {
+                    ref: "editor",
+                    class: "editor",
+                    onContextmenu: t[1] || (t[1] = D((...E) => l.showContextMenu && l.showContextMenu(...E), ["prevent"]))
+                  }, null, 544),
+                  s(w, {
+                    modelValue: i.contextMenu,
+                    "onUpdate:modelValue": t[2] || (t[2] = (E) => i.contextMenu = E),
+                    target: [i.menuX, i.menuY]
+                  }, {
+                    default: r(() => [
+                      s(S, null, {
+                        default: r(() => [
+                          s(g, { link: "" }, {
+                            default: r(() => [
+                              s(c, { onClick: l.openDocumentation }, {
+                                default: r(() => [
+                                  C(k(i.docsKeyword) + " documentation ", 1)
+                                ]),
+                                _: 1
+                              }, 8, ["onClick"])
+                            ]),
+                            _: 1
+                          }),
+                          s(x),
+                          s(g, {
+                            title: "Toggle Vim mode",
+                            "prepend-icon": "extras:vim",
+                            onClick: l.toggleVimMode
+                          }, null, 8, ["onClick"])
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }, 8, ["modelValue", "target"])
+                ]),
+                _: 1
+              }),
+              s(h, { style: { "max-height": "120px", "overflow-y": "auto" } }, {
+                default: r(() => [
+                  (m(!0), T(z, null, U(l.editErrors, (E, K) => (m(), T("div", { key: K }, [
+                    _("span", {
+                      class: "text-red",
+                      textContent: k(E)
+                    }, null, 8, te)
+                  ]))), 128))
+                ]),
+                _: 1
+              }),
+              s(h, { class: "mt-5" }, {
+                default: r(() => [
+                  t[11] || (t[11] = _("span", null, "Ctrl-space brings up autocomplete. Right click keywords for documentation.", -1)),
+                  s(v),
+                  s(f, {
+                    class: "mx-2",
+                    variant: "outlined",
+                    "data-test": "edit-screen-cancel",
+                    onClick: t[3] || (t[3] = (E) => e.$emit("cancel"))
+                  }, {
+                    default: r(() => t[9] || (t[9] = [
+                      C(" Cancel ")
+                    ])),
+                    _: 1
+                  }),
+                  s(f, {
+                    class: "mx-2",
+                    color: "primary",
+                    "data-test": "edit-screen-save",
+                    onClick: t[4] || (t[4] = (E) => e.$emit("save", e.editor.getValue()))
+                  }, {
+                    default: r(() => t[10] || (t[10] = [
+                      C(" Save ")
+                    ])),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      })
+    ]),
+    _: 1
+  }, 8, ["modelValue"]);
+}
+const ie = /* @__PURE__ */ F(ee, [["render", ne], ["__scopeId", "data-v-0caab967"]]), se = {
+  props: {
+    modelValue: Boolean
+  },
+  data() {
+    return {
+      alert: "",
+      alertType: "success",
+      showAlert: !1,
+      search: "",
+      key: "",
+      keyValue: "",
+      environment: [],
+      headers: [
+        {
+          text: "Key",
+          value: "key"
+        },
+        {
+          text: "Value",
+          value: "value"
+        },
+        {
+          text: "Actions",
+          value: "actions",
+          align: "end",
+          sortable: !1
+        }
+      ]
+    };
+  },
+  computed: {
+    show: {
+      get() {
+        return this.modelValue;
+      },
+      set(e) {
+        this.$emit("update:modelValue", e);
+      }
+    }
+  },
+  mounted() {
+    this.update();
+  },
+  methods: {
+    alertHandler: function(e) {
+      this.alert = e.text, this.alertType = e.type, this.showAlert = !0;
+    },
+    update: function() {
+      I.get("/openc3-api/environment").then((e) => {
+        this.environment = e.data;
+      }).catch((e) => {
+      });
+    },
+    addEnvironment: function() {
+      I.post("/openc3-api/environment", {
+        data: {
+          key: this.key.toUpperCase(),
+          value: this.keyValue
+        }
+      }).then((e) => {
+        `${e.data.name}`, this.update();
+      }).catch((e) => {
+        const t = {
+          text: `Failed to add environment variable: ${e}`,
+          type: "error"
+        };
+        this.alertHandler(t);
+      }), this.key = "", this.keyValue = "";
+    },
+    deleteEnvironment: function(e) {
+      this.$dialog.confirm(`Are you sure you want to delete: ${e.key}=${e.value}`, {
+        okText: "Delete",
+        cancelText: "Cancel"
+      }).then((t) => I.delete(`/openc3-api/environment/${e.name}`)).then((t) => {
+        const n = {
+          text: `Removed environment variable: ${e.name}`,
+          type: "success"
+        };
+        this.alertHandler(n), this.update();
+      }).catch((t) => {
+        const n = {
+          text: `Failed to delete environment: ${t}`,
+          type: "error"
+        };
+        this.alertHandler(n);
+      });
+    }
+  }
+}, le = { class: "pa-3" };
+function oe(e, t, n, o, i, l) {
+  const f = a("v-spacer"), v = a("v-toolbar"), p = a("v-text-field"), h = a("v-row"), d = a("v-btn"), c = a("v-data-table"), g = a("v-col"), x = a("v-card-text"), S = a("v-card"), w = a("v-dialog");
+  return m(), b(w, {
+    modelValue: l.show,
+    "onUpdate:modelValue": t[4] || (t[4] = (y) => l.show = y),
+    width: "600"
+  }, {
+    default: r(() => [
+      s(S, null, {
+        default: r(() => [
+          _("form", {
+            onSubmit: t[3] || (t[3] = D((...y) => l.addEnvironment && l.addEnvironment(...y), ["prevent"]))
+          }, [
+            s(v, { height: "24" }, {
+              default: r(() => [
+                s(f),
+                t[5] || (t[5] = _("span", null, "Global Environment Variables", -1)),
+                s(f)
+              ]),
+              _: 1
+            }),
+            s(x, null, {
+              default: r(() => [
+                _("div", le, [
+                  s(h, {
+                    dense: "",
+                    class: "mb-2"
+                  }, {
+                    default: r(() => [
+                      s(p, {
+                        modelValue: i.search,
+                        "onUpdate:modelValue": t[0] || (t[0] = (y) => i.search = y),
+                        label: "search",
+                        type: "text",
+                        "data-test": "search",
+                        "prepend-inner-icon": "mdi-magnify",
+                        clearable: "",
+                        variant: "outlined",
+                        density: "compact",
+                        "clear-icon": "mdi-close-circle-outline",
+                        autofocus: "",
+                        "single-line": "",
+                        "hide-details": ""
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    _: 1
+                  }),
+                  s(c, {
+                    "item-key": "name",
+                    "hide-default-header": "",
+                    "data-test": "env-table",
+                    search: i.search,
+                    headers: i.headers,
+                    items: i.environment,
+                    "items-per-page": 5,
+                    "items-per-page-options": [5]
+                  }, {
+                    "item.actions": r(({ item: y }) => [
+                      s(d, {
+                        icon: "mdi-delete",
+                        variant: "text",
+                        class: "mt-1",
+                        "data-test": "item-delete",
+                        "aria-label": "Delete Environment Variable",
+                        onClick: (u) => l.deleteEnvironment(y)
+                      }, null, 8, ["onClick"])
+                    ]),
+                    _: 1
+                  }, 8, ["search", "headers", "items"]),
+                  s(h, { dense: "" }, {
+                    default: r(() => [
+                      s(g, null, {
+                        default: r(() => [
+                          s(p, {
+                            modelValue: i.key,
+                            "onUpdate:modelValue": t[1] || (t[1] = (y) => i.key = y),
+                            label: "Key",
+                            "data-test": "env-key"
+                          }, null, 8, ["modelValue"])
+                        ]),
+                        _: 1
+                      }),
+                      s(g, null, {
+                        default: r(() => [
+                          s(p, {
+                            modelValue: i.keyValue,
+                            "onUpdate:modelValue": t[2] || (t[2] = (y) => i.keyValue = y),
+                            label: "Value",
+                            "data-test": "env-value"
+                          }, null, 8, ["modelValue"])
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }),
+                  s(h, { dense: "" }, {
+                    default: r(() => [
+                      s(d, {
+                        block: "",
+                        type: "submit",
+                        color: "primary",
+                        "data-test": "add-env",
+                        disabled: !i.key || !i.keyValue,
+                        onClick: D(l.addEnvironment, ["prevent"])
+                      }, {
+                        default: r(() => t[6] || (t[6] = [
+                          C(" Add ")
+                        ])),
+                        _: 1
+                      }, 8, ["disabled", "onClick"])
+                    ]),
+                    _: 1
+                  })
+                ])
+              ]),
+              _: 1
+            })
+          ], 32)
+        ]),
+        _: 1
+      })
+    ]),
+    _: 1
+  }, 8, ["modelValue"]);
+}
+const Ve = /* @__PURE__ */ F(se, [["render", oe]]), re = { class: "tree-node" }, ae = { class: "content-wrapper" }, de = ["tabindex"], ce = { key: 1 }, ue = {
+  key: 2,
+  class: "children"
+}, he = {
+  __name: "TreeNode",
+  props: {
+    node: {
+      type: Object,
+      required: !0
+    },
+    search: {
+      type: String,
+      default: ""
+    },
+    type: {
+      type: String,
+      default: "open"
+    }
+  },
+  emits: ["nodeToggled", "request"],
+  setup(e, { emit: t }) {
+    const n = e, o = H(n.node.isOpen || !1), i = j(() => {
+      const d = (c) => {
+        var g;
+        return !n.search || c.path.toLowerCase().includes(n.search.toLowerCase()) ? !0 : !!((g = c.children) != null && g.some(d));
+      };
+      return d(n.node);
+    });
+    B(
+      () => n.node.isOpen,
+      (d) => {
+        o.value = d;
+      }
+    ), B(
+      () => n.search,
+      (d) => {
+        d ? n.node.isOpen || v() : n.node.isOpen && v();
+      }
+    );
+    const l = t, f = (d) => {
+      d.children ? (v(), n.type === "save" && l("request", d)) : l("request", d);
+    }, v = () => {
+      n.node.children && (o.value = !o.value, n.node.isOpen = o.value, l("nodeToggled", n.node.id, o.value));
+    }, p = (d, c) => {
+      l("nodeToggled", d, c);
+    }, h = (d) => {
+      l("request", d);
+    };
+    return (d, c) => {
+      const g = a("v-icon"), x = a("v-btn"), S = a("tree-node", !0);
+      return m(), T("div", re, [
+        i.value ? (m(), T("div", {
+          key: 0,
+          class: "node-content",
+          onClick: c[2] || (c[2] = (w) => f(e.node))
+        }, [
+          _("div", ae, [
+            e.node.children ? (m(), b(g, {
+              key: 0,
+              class: "toggle-icon",
+              style: { "padding-right": "10px" }
+            }, {
+              default: r(() => [
+                C(k(e.node.isOpen ? "mdi-menu-down" : "mdi-menu-right"), 1)
+              ]),
+              _: 1
+            })) : V("", !0),
+            e.node.children ? (m(), b(g, {
+              key: 1,
+              size: "small",
+              style: { "padding-right": "10px" }
+            }, {
+              default: r(() => c[3] || (c[3] = [
+                C(k("mdi-folder"))
+              ])),
+              _: 1
+            })) : e.node.title.includes(".rb") ? (m(), b(g, {
+              key: 2,
+              size: "small",
+              style: { "padding-right": "10px" }
+            }, {
+              default: r(() => c[4] || (c[4] = [
+                C(k("mdi-language-ruby"))
+              ])),
+              _: 1
+            })) : e.node.title.includes(".py") ? (m(), b(g, {
+              key: 3,
+              size: "small",
+              style: { "padding-right": "10px" }
+            }, {
+              default: r(() => c[5] || (c[5] = [
+                C(k("mdi-language-python"))
+              ])),
+              _: 1
+            })) : (m(), b(g, {
+              key: 4,
+              size: "small",
+              style: { "padding-right": "10px" }
+            }, {
+              default: r(() => c[6] || (c[6] = [
+                C(k("mdi-file-document"))
+              ])),
+              _: 1
+            })),
+            _("span", {
+              class: "title",
+              tabindex: e.node.children ? -1 : 0,
+              onKeyup: c[0] || (c[0] = q((w) => f(e.node), ["enter"]))
+            }, k(e.node.title), 41, de),
+            e.node.title === "__TEMP__" ? (m(), b(x, {
+              key: 5,
+              icon: "mdi-delete",
+              variant: "text",
+              style: { "margin-left": "auto" },
+              "aria-label": "Delete",
+              onClick: c[1] || (c[1] = (w) => l("delete"))
+            })) : V("", !0)
+          ])
+        ])) : (m(), T("div", ce)),
+        e.node.children && e.node.isOpen ? (m(), T("div", ue, [
+          (m(!0), T(z, null, U(e.node.children, (w) => (m(), b(S, {
+            key: w.id,
+            node: w,
+            search: e.search,
+            type: e.type,
+            onNodeToggled: p,
+            onRequest: h
+          }, null, 8, ["node", "search", "type"]))), 128))
+        ])) : V("", !0)
+      ]);
+    };
+  }
+}, me = /* @__PURE__ */ F(he, [["__scopeId", "data-v-74233c4c"]]), fe = {
+  components: {
+    TreeNode: me
+  },
+  props: {
+    type: {
+      type: String,
+      required: !0,
+      validator: function(e) {
+        return ["open", "save"].indexOf(e) !== -1;
+      }
+    },
+    apiUrl: String,
+    // Base API URL for use with scripts or cmd-tlm
+    requireTargetParentDir: Boolean,
+    // Require that the save filename be nested in a directory with the name of a target
+    inputFilename: String,
+    // passed if this is a 'save' dialog
+    modelValue: Boolean
+  },
+  data() {
+    return {
+      tree: [],
+      items: [],
+      search: null,
+      selectedFile: null,
+      disableButtons: !1,
+      targets: [],
+      targetsRetrieved: [],
+      loading: !0
+    };
+  },
+  computed: {
+    show: {
+      get() {
+        return this.modelValue;
+      },
+      set(e) {
+        this.$emit("update:modelValue", e);
+      }
+    },
+    title: function() {
+      return this.type === "open" ? "File Open" : "File Save As...";
+    },
+    submit: function() {
+      return this.type === "open" ? "OPEN" : "SAVE";
+    },
+    helpText: function() {
+      return this.type === "open" ? "Click on folders to open them and then click a file to select it before clicking Open. Use the search box to filter the results. You can also Tab to the files and Enter to select." : "Click on the folder to save into. Then complete the filename path with the desired name. Use the search box to filter the results.";
+    },
+    error: function() {
+      if (this.selectedFile === "" || this.selectedFile === null)
+        return "No file selected must select a file";
+      if (!this.selectedFile.match(this.validFilenameRegex) || this.selectedFile.match(/\.\.|\/\/|\.\/|\/\./)) {
+        let e = `${this.selectedFile} is not a valid filename. Must `;
+        return this.requireTargetParentDir && (e += "be in a target directory and "), e += `only contain alphanumeric characters (including !-_.*) and a valid extension.
+
+For example: TGT1/procedures/test.py or TGT2/lib/inst.rb`, e;
+      }
+      return this.type === "save" && this.selectedFile.match(/\*$/) ? `${this.selectedFile} is not a valid filename. Must not end in '*'.` : null;
+    },
+    validFilenameRegex: function() {
+      const e = "0-9a-zA-Z";
+      let n = `[${`${e}\\/\\!\\-\\_\\.\\*\\'\\(\\)`}]+\\.[${e}]+`;
+      return this.requireTargetParentDir && (n = `\\/?${`(${this.targets.join("|")})`}\\/${n}`), new RegExp(n);
+    }
+  },
+  created() {
+    I.get("/openc3-api/targets").then((e) => {
+      this.targets = e.data, this.targets.push("__TEMP__"), this.targets.forEach((t) => {
+        this.items.push({
+          id: t,
+          disabled: !0,
+          title: t,
+          children: [],
+          path: t
+        }), this.loadFiles(t);
+      }), this.loading = !1;
+    });
+  },
+  methods: {
+    calcIcon: function(e) {
+      return J(e);
+    },
+    loadFiles: function(e) {
+      I.get(this.apiUrl, { params: { target: e } }).then((t) => {
+        if (t.data.length === 0) {
+          this.items = this.items.filter((o) => o.id !== e);
+          return;
+        }
+        for (let o of t.data.sort())
+          this.filepath = o, this.insertFile(this.items, 2, o);
+        this.inputFilename && (this.selectedFile = this.inputFilename);
+        const n = this.items.findIndex((o) => o.id === e);
+        n !== -1 && (this.items[n].disabled = !1);
+      }).catch((t) => {
+        this.$emit("error", `Failed to connect to OpenC3. ${t}`);
+      });
+    },
+    clear: function() {
+      this.show = !1, this.overwrite = !1, this.disableButtons = !1;
+    },
+    activeFile: function(e) {
+      e.length === 0 ? this.selectedFile = null : (this.selectedFile = this.findItem(this.items, e.id), setTimeout(() => {
+        this.$refs.submitBtn.$el.focus();
+      }, 100));
+    },
+    findItem: function(e, t) {
+      for (let n of e) {
+        if (n.id === t)
+          return n.path;
+        if (n.children) {
+          const o = this.findItem(n.children, t);
+          if (o)
+            return o;
+        }
+      }
+      return null;
+    },
+    exists: function(e, t) {
+      let n = !1;
+      for (let o of e) {
+        if (o.path === t || o.path.length > 1 && o.path[o.path.length - 1] === "*" && o.path.slice(0, o.path.length - 1) === t)
+          return !0;
+        o.children && (n = n || this.exists(o.children, t));
+      }
+      return n;
+    },
+    success: function() {
+      this.selectedFile !== null && this.error === null && (this.type === "open" ? this.openSuccess() : this.saveSuccess());
+    },
+    deleteTemp: function() {
+      this.$dialog.confirm("Are you sure you want to delete all the temporary files?", {
+        okText: "Delete",
+        cancelText: "Cancel"
+      }).then((e) => I.delete("/script-api/scripts/temp_files")).then((e) => {
+        this.$emit("clear-temp"), this.loadFiles("__TEMP__");
+      }).catch((e) => {
+        this.$notify.serious({
+          title: "Error",
+          body: `Failed to remove script temporary files due to ${e}`
+        });
+      });
+    },
+    openSuccess: function() {
+      this.disableButtons = !0, I.get(`${this.apiUrl}/${this.selectedFile}`).then((e) => {
+        const t = {
+          name: this.selectedFile,
+          contents: e.data.contents
+        };
+        e.data.suites && (t.suites = JSON.parse(e.data.suites)), e.data.error && (t.error = e.data.error), e.data.success && (t.success = e.data.success);
+        const n = e.data.locked, o = e.data.breakpoints;
+        this.$emit("file", { file: t, locked: n, breakpoints: o }), this.clear();
+      }).catch((e) => {
+        this.$emit("error", `Failed to open ${this.selectedFile}. ${e}`), this.clear();
+      });
+    },
+    saveSuccess: function() {
+      this.exists(this.items, this.selectedFile) ? this.$dialog.confirm(`Are you sure you want to overwrite: ${this.selectedFile}`, {
+        okText: "Overwrite",
+        cancelText: "Cancel"
+      }).then((t) => {
+        this.$emit("filename", this.selectedFile), this.clear();
+      }).catch((t) => {
+      }) : (this.$emit("filename", this.selectedFile), this.clear());
+    },
+    insertFile: function(e, t, n) {
+      let o = n.split("/");
+      if (o.length === 1) {
+        e.push({
+          id: this.filepath,
+          title: o[0],
+          file: "ruby",
+          path: this.filepath
+        });
+        return;
+      }
+      const i = e.findIndex((l) => l.title === o[0]);
+      i === -1 ? (e.push({
+        id: this.filepath.split("/").slice(0, t - 1).join("/"),
+        title: o[0],
+        children: [],
+        path: this.filepath.split("/").slice(0, t - 1).join("/")
+      }), this.insertFile(
+        e[e.length - 1].children,
+        // Start from the node we just added
+        t + 1,
+        o.slice(1).join("/")
+        // Strip the first part of the path
+      )) : this.insertFile(
+        e[i].children,
+        t + 1,
+        o.slice(1).join("/")
+      );
+    }
+  }
+}, pe = { class: "pa-3" }, ge = { class: "overflow-y-auto tree-container" };
+function ve(e, t, n, o, i, l) {
+  const f = a("v-progress-circular"), v = a("v-overlay"), p = a("v-spacer"), h = a("v-toolbar"), d = a("v-row"), c = a("v-text-field"), g = a("tree-node"), x = a("v-btn"), S = a("v-card-text"), w = a("v-card"), y = a("v-dialog");
+  return m(), b(y, {
+    modelValue: l.show,
+    "onUpdate:modelValue": t[4] || (t[4] = (u) => l.show = u),
+    width: "600",
+    onKeydown: t[5] || (t[5] = q((u) => l.success(), ["enter"]))
+  }, {
+    default: r(() => [
+      s(w, null, {
+        default: r(() => [
+          s(v, { "model-value": i.loading }, {
+            default: r(() => [
+              s(f, {
+                indeterminate: "",
+                absolute: "",
+                size: "64"
+              })
+            ]),
+            _: 1
+          }, 8, ["model-value"]),
+          _("form", {
+            onSubmit: t[3] || (t[3] = D((...u) => l.success && l.success(...u), ["prevent"]))
+          }, [
+            s(h, { height: "24" }, {
+              default: r(() => [
+                s(p),
+                _("span", null, k(l.title), 1),
+                s(p)
+              ]),
+              _: 1
+            }),
+            s(S, null, {
+              default: r(() => [
+                _("div", pe, [
+                  s(d, null, {
+                    default: r(() => [
+                      C(k(l.helpText), 1)
+                    ]),
+                    _: 1
+                  }),
+                  s(d, {
+                    dense: "",
+                    class: "mt-5"
+                  }, {
+                    default: r(() => [
+                      s(c, {
+                        modelValue: i.search,
+                        "onUpdate:modelValue": t[0] || (t[0] = (u) => i.search = u),
+                        flat: "",
+                        autofocus: "",
+                        "hide-details": "",
+                        clearable: "",
+                        label: "Search",
+                        "prepend-inner-icon": "mdi-magnify",
+                        density: "compact",
+                        "data-test": "file-open-save-search"
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    _: 1
+                  }),
+                  _("div", ge, [
+                    (m(!0), T(z, null, U(i.items, (u) => (m(), b(g, {
+                      key: `${u.id}`,
+                      node: u,
+                      search: i.search,
+                      type: n.type,
+                      onRequest: l.activeFile,
+                      onDelete: l.deleteTemp
+                    }, null, 8, ["node", "search", "type", "onRequest", "onDelete"]))), 128))
+                  ]),
+                  s(d, { class: "my-2" }, {
+                    default: r(() => [
+                      s(c, {
+                        modelValue: i.selectedFile,
+                        "onUpdate:modelValue": t[1] || (t[1] = (u) => i.selectedFile = u),
+                        "hide-details": "",
+                        label: "Filename",
+                        "data-test": "file-open-save-filename",
+                        disabled: n.type === "open"
+                      }, null, 8, ["modelValue", "disabled"])
+                    ]),
+                    _: 1
+                  }),
+                  s(d, { dense: "" }, {
+                    default: r(() => [
+                      O(_("div", {
+                        class: "my-2 text-red",
+                        style: { "white-space": "pre-line" }
+                      }, k(l.error), 513), [
+                        [M, l.error]
+                      ])
+                    ]),
+                    _: 1
+                  }),
+                  s(d, { class: "mt-2" }, {
+                    default: r(() => [
+                      s(p),
+                      s(x, {
+                        variant: "outlined",
+                        class: "mx-2",
+                        "data-test": "file-open-save-cancel-btn",
+                        disabled: i.disableButtons,
+                        onClick: t[2] || (t[2] = (u) => l.show = !1)
+                      }, {
+                        default: r(() => t[6] || (t[6] = [
+                          C(" Cancel ")
+                        ])),
+                        _: 1
+                      }, 8, ["disabled"]),
+                      s(x, {
+                        ref: "submitBtn",
+                        type: "submit",
+                        color: "primary",
+                        class: "mx-2",
+                        "data-test": "file-open-save-submit-btn",
+                        disabled: i.disableButtons || !!l.error,
+                        onClick: D(l.success, ["prevent"])
+                      }, {
+                        default: r(() => [
+                          C(k(l.submit), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["disabled", "onClick"])
+                    ]),
+                    _: 1
+                  })
+                ])
+              ]),
+              _: 1
+            })
+          ], 32)
+        ]),
+        _: 1
+      })
+    ]),
+    _: 1
+  }, 8, ["modelValue"]);
+}
+const Te = /* @__PURE__ */ F(fe, [["render", ve]]), L = 20, ye = {
+  components: {
+    EditScreenDialog: ie
+  },
+  mixins: [G],
+  props: {
+    target: {
+      type: String,
+      default: ""
+    },
+    screen: {
+      type: String,
+      default: ""
+    },
+    definition: {
+      type: String,
+      default: ""
+    },
+    keywords: {
+      type: Array,
+      default: () => []
+    },
+    initialFloated: {
+      type: Boolean,
+      default: !1
+    },
+    initialTop: {
+      type: Number,
+      default: 0
+    },
+    initialLeft: {
+      type: Number,
+      default: 0
+    },
+    initialZ: {
+      type: Number,
+      default: 0
+    },
+    minZ: {
+      type: Number,
+      default: 0
+    },
+    fixFloated: {
+      type: Boolean,
+      default: !1
+    },
+    count: {
+      type: Number,
+      default: 0
+    },
+    showClose: {
+      type: Boolean,
+      default: !0
+    },
+    timeZone: {
+      type: String,
+      default: "local"
+    },
+    inline: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  data() {
+    return {
+      api: null,
+      backup: "",
+      currentDefinition: this.definition,
+      editDialog: !1,
+      expand: !0,
+      configParser: null,
+      configError: !1,
+      currentLayout: null,
+      layoutStack: [],
+      namedWidgets: {},
+      dynamicWidgets: [],
+      width: null,
+      height: null,
+      staleTime: 30,
+      cacheTimeout: 0.1,
+      globalSettings: [],
+      substitute: !1,
+      original_target_name: null,
+      force_substitute: !1,
+      pollingPeriod: 1,
+      errors: [],
+      errorDialog: !1,
+      screenKey: null,
+      dragX: 0,
+      dragY: 0,
+      floated: this.initialFloated,
+      top: this.initialTop,
+      left: this.initialLeft,
+      zIndex: this.initialZ,
+      changeCounter: 0,
+      screenItems: [],
+      screenValues: {},
+      updateCounter: 0,
+      screenId: Y.uniqueId("openc3-screen_")
+    };
+  },
+  computed: {
+    error: function() {
+      if (this.errorDialog && this.errors.length > 0) {
+        let e = /* @__PURE__ */ new Set(), t = "";
+        for (const n of this.errors) {
+          if (e.has(n.message))
+            continue;
+          let o = `${n.time}: (${n.type}) ${n.message}
+`;
+          t += o, e.add(n.message);
+        }
+        return t;
+      }
+      return null;
+    },
+    computedStyle() {
+      var n;
+      let e = {};
+      const t = this.width || ((n = this.$refs.bar) == null ? void 0 : n.clientWidth);
+      return this.floated && (e.position = "absolute", e.top = this.top + "px", e.left = this.left + "px", e.width = t + "px"), e;
+    }
+  },
+  watch: {
+    count: {
+      handler(e, t) {
+        this.currentDefinition = this.definition, this.rerender();
+      }
+    }
+  },
+  // Called when an error from any descendent component is captured
+  // We need this because an error can occur from any of the children
+  // in the widget stack and are typically thrown on create()
+  errorCaptured(e, t, n) {
+    return this.errors.length < L && (e.usage ? this.errors.push({
+      type: "usage",
+      message: e.message,
+      usage: e.usage,
+      line: e.line,
+      lineNumber: e.lineNumber,
+      time: (/* @__PURE__ */ new Date()).getTime()
+    }) : this.errors.push({
+      type: "error",
+      message: e,
+      time: (/* @__PURE__ */ new Date()).getTime()
+    }), console.log(this.errors), this.configError = !0), !1;
+  },
+  created() {
+    this.api = new P(), this.configParser = new X(), this.parseDefinition(), this.screenKey = Math.floor(Math.random() * 1e6);
+  },
+  mounted() {
+    this.updateRefreshInterval(), this.floated && (this.$refs.bar.onmousedown = this.dragMouseDown, this.$refs.bar.parentElement.parentElement.style = "z-index: " + this.zIndex);
+  },
+  unmounted() {
+    this.updater != null && (clearInterval(this.updater), this.updater = null);
+  },
+  methods: {
+    // These are API methods that ButtonWidget uses to open and close screens
+    open(e, t) {
+      this.$parent.showScreen(e, t);
+    },
+    close(e, t) {
+      this.$parent.closeScreenByName(e, t);
+    },
+    closeAll() {
+      this.$parent.closeAll();
+    },
+    clearErrors: function() {
+      this.errors = [], this.configError = !1;
+    },
+    updateRefreshInterval: function() {
+      let e = this.pollingPeriod * 1e3;
+      this.updater && clearInterval(this.updater), this.updater = setInterval(() => {
+        this.update();
+      }, e);
+    },
+    parseDefinition: function() {
+      if (this.clearErrors(), this.namedWidgets = {}, this.layoutStack = [], this.dynamicWidgets = [], this.layoutStack.push({
+        type: "VerticalWidget",
+        parameters: [],
+        widgets: []
+      }), this.currentLayout = this.layoutStack[this.layoutStack.length - 1], this.configParser.parse_string(
+        this.currentDefinition,
+        "",
+        !1,
+        !0,
+        (e, t, n, o) => {
+          if (e)
+            switch (e) {
+              case "SCREEN":
+                this.configParser.verify_num_parameters(
+                  3,
+                  4,
+                  `${e} <Width or AUTO> <Height or AUTO> <Polling Period>`
+                ), this.width = parseInt(t[0]), this.height = parseInt(t[1]), this.pollingPeriod = parseFloat(t[2]);
+                break;
+              case "END":
+                this.configParser.verify_num_parameters(0, 0, `${e}`), this.layoutStack.pop(), this.currentLayout = this.layoutStack[this.layoutStack.length - 1];
+                break;
+              case "STALE_TIME":
+                this.configParser.verify_num_parameters(
+                  1,
+                  1,
+                  `${e} <Time (s)>`
+                ), this.staleTime = parseInt(t[0]);
+                break;
+              case "SETTING":
+              case "SUBSETTING":
+                (this.currentLayout.widgets[this.currentLayout.widgets.length - 1] ?? this.currentLayout).settings.push(t);
+                break;
+              case "GLOBAL_SETTING":
+              case "GLOBAL_SUBSETTING":
+                this.globalSettings.push(t);
+                break;
+              default:
+                this.processWidget(e, t, n, o);
+                break;
+            }
+        }
+      ), typeof this.layoutStack[0] > "u") {
+        let e = [], t = [];
+        for (const n of this.dynamicWidgets)
+          e.push(n.name), t.push(n.lineNumber);
+        this.errors.length < L && (this.errors.push({
+          type: "usage",
+          message: `Unknown widget! Are these widgets: ${e.join(",")}?`,
+          lineNumber: t.join(","),
+          time: (/* @__PURE__ */ new Date()).getTime()
+        }), this.configError = !0), this.layoutStack[0] = {
+          type: "VerticalWidget",
+          parameters: [],
+          widgets: []
+        };
+      } else
+        this.applyGlobalSettings(this.layoutStack[0].widgets);
+    },
+    openEdit: function() {
+      this.backup = this.currentDefinition.repeat(1), this.editDialog = !0;
+    },
+    upScreen: function() {
+      this.zIndex += 1, this.$refs.bar.parentElement.parentElement.style = "z-index: " + this.zIndex, this.$emit("drag-screen", [
+        this.floated,
+        this.top,
+        this.left,
+        this.zIndex
+      ]);
+    },
+    downScreen: function() {
+      this.zIndex > this.minZ && (this.zIndex -= 1, this.$refs.bar.parentElement.parentElement.style = "z-index: " + this.zIndex, this.$emit("drag-screen", [
+        this.floated,
+        this.top,
+        this.left,
+        this.zIndex
+      ]));
+    },
+    floatScreen: function() {
+      if (this.floated)
+        this.$refs.bar.onmousedown = null, this.$refs.bar.parentElement.parentElement.style = "z-index: 0", this.floated = !1, this.$emit("unfloat-screen", [
+          this.floated,
+          this.top,
+          this.left,
+          this.zIndex
+        ]);
+      else {
+        let e = this.$refs.bar.parentElement.parentElement.parentElement.getBoundingClientRect(), t = this.$refs.bar.getBoundingClientRect();
+        this.top = t.top - e.top - 5, this.left = t.left - e.left - 5, this.$refs.bar.onmousedown = this.dragMouseDown, this.$refs.bar.parentElement.parentElement.style = "z-index: " + this.zIndex, this.floated = !0, this.$emit("float-screen", [
+          this.floated,
+          this.top,
+          this.left,
+          this.zIndex
+        ]);
+      }
+    },
+    dragMouseDown: function(e) {
+      e = e || window.event, e.preventDefault(), this.dragX = e.clientX, this.dragY = e.clientY, document.onmouseup = this.closeDragElement, document.onmousemove = this.elementDrag;
+    },
+    elementDrag: function(e) {
+      e = e || window.event, e.preventDefault();
+      let t = this.dragX - e.clientX, n = this.dragY - e.clientY;
+      this.dragX = e.clientX, this.dragY = e.clientY, this.top = this.$refs.bar.offsetTop - n, this.left = this.$refs.bar.offsetLeft - t, this.$emit("drag-screen", [
+        this.floated,
+        this.top,
+        this.left,
+        this.zIndex
+      ]);
+    },
+    closeDragElement: function() {
+      document.onmouseup = null, document.onmousemove = null;
+    },
+    rerender: function() {
+      this.parseDefinition(), this.updateRefreshInterval(), this.screenKey = Math.floor(Math.random() * 1e6), this.$nextTick(function() {
+        this.clearErrors(), this.$emit("edit-screen");
+      });
+    },
+    cancelEdit: function() {
+      this.file = null, this.editDialog = !1, this.currentDefinition = this.backup, this.rerender();
+    },
+    saveEdit: function(e) {
+      this.editDialog = !1, this.currentDefinition = e, this.rerender(), this.$nextTick(function() {
+        I.post(
+          "/openc3-api/screen/",
+          {
+            data: {
+              scope: window.openc3Scope,
+              target: this.target,
+              screen: this.screen,
+              text: this.currentDefinition
+            }
+          },
+          0
+        );
+      });
+    },
+    deleteScreen: function() {
+      this.editDialog = !1, I.delete(`/openc3-api/screen/${this.target}/${this.screen}`).then(
+        (e) => {
+          this.$emit("delete-screen");
+        }
+      );
+    },
+    minMaxTransition: function() {
+      this.expand = !this.expand, this.$emit("min-max-screen");
+    },
+    processWidget: function(e, t, n, o) {
+      let i = null;
+      e === "NAMED_WIDGET" && (this.configParser.verify_num_parameters(
+        2,
+        null,
+        `${e} <Widget Name> <Widget Type> <Widget Settings... (optional)>`
+      ), i = t[0].toUpperCase(), e = t[1].toUpperCase(), t = t.slice(2, t.length));
+      const l = e.charAt(0).toUpperCase() + e.slice(1).toLowerCase() + "Widget";
+      let f = [];
+      if (f.push(["__SCREEN_ID__", this.screenId]), i !== null && f.push(["NAMED_WIDGET", i]), e === "VERTICAL" || e === "VERTICALBOX" || e === "HORIZONTAL" || e === "HORIZONTALBOX" || e === "MATRIXBYCOLUMNS" || e === "TABBOOK" || e === "TABITEM" || e === "CANVAS" || e === "RADIOGROUP" || e === "SCROLLWINDOW") {
+        const v = {
+          type: l,
+          parameters: t,
+          settings: f,
+          screenValues: this.screenValues,
+          screenTimeZone: this.timeZone,
+          widgets: []
+        };
+        this.layoutStack.push(v), this.currentLayout.widgets.push(v), this.currentLayout = v;
+      } else if (this.$options.components[l])
+        this.currentLayout.widgets.push({
+          type: l,
+          target: this.target,
+          parameters: t,
+          settings: f,
+          screenValues: this.screenValues,
+          screenTimeZone: this.timeZone,
+          line: n,
+          lineNumber: o
+        });
+      else {
+        let v = {
+          type: "DynamicWidget",
+          target: this.target,
+          parameters: t,
+          settings: f,
+          screenValues: this.screenValues,
+          screenTimeZone: this.timeZone,
+          name: l,
+          line: n,
+          lineNumber: o
+        };
+        this.currentLayout.widgets.push(v), this.dynamicWidgets.push(v);
+      }
+    },
+    applyGlobalSettings: function(e) {
+      e.forEach((t) => {
+        this.globalSettings.forEach((n) => {
+          t.type.toLowerCase() === n[0].toLowerCase() + "widget" && (t.settings.find(
+            (i) => i[0] === n[1]
+          ) || t.settings.push(n.slice(1)));
+        }), t.widgets && this.applyGlobalSettings(t.widgets);
+      });
+    },
+    update: function() {
+      this.screenItems.length !== 0 && this.configError === !1 && this.api.get_tlm_values(this.screenItems, this.staleTime, this.cacheTimeout).then((e) => {
+        this.clearErrors(), this.updateValues(e);
+      }).catch((e) => {
+        let t = JSON.stringify(e, null, 2);
+        t.includes("no response received") || (this.configError = !0), this.errors.find((n) => n.message === t) || this.errors.length < L && this.errors.push({
+          type: "error",
+          message: t,
+          time: (/* @__PURE__ */ new Date()).getTime()
+        });
+      });
+    },
+    updateValues: function(e) {
+      this.updateCounter += 1;
+      for (let t = 0; t < e.length; t++)
+        e[t].push(this.updateCounter), this.screenValues[this.screenItems[t]] = e[t];
+    },
+    addItem: function(e) {
+      this.screenItems.push(e), this.screenValues[e] = [null, null, 0];
+    },
+    deleteItem: function(e) {
+      let t = this.screenItems.indexOf(e);
+      this.screenItems.splice(t, 1);
+    }
+  }
+}, _e = {
+  ref: "screen",
+  class: "pa-1",
+  style: { position: "relative" }
+}, be = {
+  key: 1,
+  class: "pa-1",
+  style: { position: "relative" }
+};
+function xe(e, t, n, o, i, l) {
+  const f = a("v-btn"), v = a("v-tooltip"), p = a("v-spacer"), h = a("v-toolbar"), d = a("v-overlay"), c = a("vertical-widget"), g = a("v-expand-transition"), x = a("v-card"), S = a("edit-screen-dialog"), w = a("v-textarea"), y = a("v-dialog");
+  return m(), T("div", {
+    ref: "bar",
+    style: $(l.computedStyle)
+  }, [
+    n.inline ? V("", !0) : (m(), b(x, {
+      key: 0,
+      "min-height": i.height,
+      "min-width": i.width,
+      style: { cursor: "default" }
+    }, {
+      default: r(() => [
+        s(h, { height: "24" }, {
+          default: r(() => [
+            O(s(f, {
+              icon: "mdi-alert",
+              variant: "text",
+              density: "compact",
+              "data-test": "error-graph-icon",
+              "aria-label": "Show Errors",
+              onClick: t[0] || (t[0] = () => {
+                i.errorDialog = !0;
+              })
+            }, null, 512), [
+              [M, i.errors.length !== 0]
+            ]),
+            s(f, {
+              icon: "mdi-pencil",
+              variant: "text",
+              density: "compact",
+              "data-test": "edit-screen-icon",
+              "aria-label": "Edit Screen",
+              onClick: l.openEdit
+            }, null, 8, ["onClick"]),
+            n.fixFloated ? V("", !0) : (m(), b(v, {
+              key: 0,
+              "open-delay": 600,
+              location: "top"
+            }, {
+              activator: r(({ props: u }) => [
+                _("div", N(R(u)), [
+                  s(f, {
+                    icon: i.floated ? "mdi-balloon" : "mdi-view-grid-outline",
+                    variant: "text",
+                    "data-test": "float-screen-icon",
+                    "aria-label": i.floated ? "Unfloat Screen" : "Float Screen",
+                    onClick: l.floatScreen
+                  }, null, 8, ["icon", "aria-label", "onClick"])
+                ], 16)
+              ]),
+              default: r(() => [
+                _("span", null, k(i.floated ? "Unfloat Screen" : "Float Screen"), 1)
+              ]),
+              _: 1
+            })),
+            i.floated ? (m(), b(v, {
+              key: 1,
+              "open-delay": 600,
+              location: "top"
+            }, {
+              activator: r(({ props: u }) => [
+                _("div", N(R(u)), [
+                  s(f, {
+                    icon: "mdi-arrow-up",
+                    variant: "text",
+                    "data-test": "up-screen-icon",
+                    "aria-label": "Move Screen Up",
+                    onClick: l.upScreen
+                  }, null, 8, ["onClick"])
+                ], 16)
+              ]),
+              default: r(() => [
+                t[8] || (t[8] = _("span", null, " Move Screen Up ", -1))
+              ]),
+              _: 1
+            })) : V("", !0),
+            i.floated && i.zIndex > n.minZ ? (m(), b(v, {
+              key: 2,
+              "open-delay": 600,
+              location: "top"
+            }, {
+              activator: r(({ props: u }) => [
+                _("div", N(R(u)), [
+                  s(f, {
+                    icon: "mdi-arrow-down",
+                    variant: "text",
+                    "data-test": "down-screen-icon",
+                    "aria-label": "Move Screen Down",
+                    onClick: l.downScreen
+                  }, null, 8, ["onClick"])
+                ], 16)
+              ]),
+              default: r(() => [
+                t[9] || (t[9] = _("span", null, " Move Screen Down ", -1))
+              ]),
+              _: 1
+            })) : V("", !0),
+            s(p),
+            _("span", null, k(n.target) + " " + k(n.screen), 1),
+            s(p),
+            i.expand ? (m(), b(f, {
+              key: 3,
+              icon: "mdi-window-minimize",
+              variant: "text",
+              density: "compact",
+              "data-test": "minimize-screen-icon",
+              "aria-label": "Minimize Screen",
+              onClick: l.minMaxTransition
+            }, null, 8, ["onClick"])) : (m(), b(f, {
+              key: 4,
+              icon: "mdi-window-maximize",
+              variant: "text",
+              "data-test": "maximize-screen-icon",
+              "aria-label": "Maximize Screen",
+              onClick: l.minMaxTransition
+            }, null, 8, ["onClick"])),
+            n.showClose ? (m(), b(f, {
+              key: 5,
+              icon: "mdi-close-box",
+              variant: "text",
+              density: "compact",
+              "data-test": "close-screen-icon",
+              "aria-label": "Close Screen",
+              onClick: t[1] || (t[1] = (u) => e.$emit("close-screen"))
+            })) : V("", !0)
+          ]),
+          _: 1
+        }),
+        i.editDialog ? V("", !0) : (m(), b(g, { key: 0 }, {
+          default: r(() => [
+            O(_("div", _e, [
+              s(d, {
+                style: { "pointer-events": "none" },
+                "model-value": i.errors.length !== 0,
+                opacity: "0.8",
+                absolute: "",
+                attach: "",
+                "scroll-strategy": "none"
+              }, null, 8, ["model-value"]),
+              (m(), b(c, {
+                key: i.screenKey,
+                widgets: i.layoutStack[0].widgets,
+                "screen-values": i.screenValues,
+                "screen-time-zone": n.timeZone,
+                onAddItem: l.addItem,
+                onDeleteItem: l.deleteItem,
+                onOpen: l.open,
+                onClose: l.close,
+                onCloseAll: l.closeAll
+              }, null, 8, ["widgets", "screen-values", "screen-time-zone", "onAddItem", "onDeleteItem", "onOpen", "onClose", "onCloseAll"]))
+            ], 512), [
+              [M, i.expand]
+            ])
+          ]),
+          _: 1
+        }))
+      ]),
+      _: 1
+    }, 8, ["min-height", "min-width"])),
+    n.inline ? (m(), T("div", be, [
+      s(d, {
+        style: { "pointer-events": "none" },
+        "model-value": i.errors.length !== 0,
+        opacity: "0.8",
+        absolute: "",
+        attach: "",
+        "scroll-strategy": "none"
+      }, null, 8, ["model-value"]),
+      O(s(f, {
+        icon: "mdi-alert",
+        variant: "text",
+        density: "compact",
+        "data-test": "error-graph-icon",
+        "aria-label": "Show Errors",
+        onClick: t[2] || (t[2] = () => {
+          i.errorDialog = !0;
+        })
+      }, null, 512), [
+        [M, i.errors.length !== 0]
+      ]),
+      (m(), b(c, {
+        key: i.screenKey,
+        widgets: i.layoutStack[0].widgets,
+        "screen-values": i.screenValues,
+        "screen-time-zone": n.timeZone,
+        onAddItem: l.addItem,
+        onDeleteItem: l.deleteItem,
+        onOpen: l.open,
+        onClose: l.close,
+        onCloseAll: l.closeAll
+      }, null, 8, ["widgets", "screen-values", "screen-time-zone", "onAddItem", "onDeleteItem", "onOpen", "onClose", "onCloseAll"]))
+    ])) : V("", !0),
+    i.editDialog ? (m(), b(S, {
+      key: 2,
+      modelValue: i.editDialog,
+      "onUpdate:modelValue": t[3] || (t[3] = (u) => i.editDialog = u),
+      target: n.target,
+      screen: n.screen,
+      definition: i.currentDefinition,
+      keywords: n.keywords,
+      errors: i.errors,
+      onSave: t[4] || (t[4] = (u) => l.saveEdit(u)),
+      onCancel: t[5] || (t[5] = (u) => l.cancelEdit()),
+      onDelete: t[6] || (t[6] = (u) => l.deleteScreen())
+    }, null, 8, ["modelValue", "target", "screen", "definition", "keywords", "errors"])) : V("", !0),
+    s(y, {
+      modelValue: i.errorDialog,
+      "onUpdate:modelValue": t[7] || (t[7] = (u) => i.errorDialog = u),
+      width: "60vw"
+    }, {
+      default: r(() => [
+        s(h, { height: "24" }, {
+          default: r(() => [
+            s(p),
+            _("span", null, " Screen: " + k(n.target) + " " + k(n.screen) + " Errors ", 1),
+            s(p)
+          ]),
+          _: 1
+        }),
+        s(x, null, {
+          default: r(() => [
+            s(w, {
+              class: "errors",
+              readonly: "",
+              rows: "13",
+              "model-value": l.error
+            }, null, 8, ["model-value"])
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["modelValue"])
+  ], 4);
+}
+const Ie = /* @__PURE__ */ F(ye, [["render", xe], ["__scopeId", "data-v-b9a096c9"]]);
+export {
+  ie as E,
+  Te as F,
+  Ie as O,
+  Q as S,
+  Ve as a
+};
+//# sourceMappingURL=Openc3Screen-DFYYhHt7.js.map