UNPKG

@scalar/api-client

Version:

the open source API testing client

137 lines (136 loc) 4.9 kB
import { defineComponent as h, computed as y, createBlock as s, openBlock as u, unref as a, withCtx as r, createVNode as i, createElementBlock as T, createTextVNode as v, Fragment as C, renderList as k, createCommentVNode as B } from "vue"; import { ScalarButton as w } from "@scalar/components"; import { ScalarIconTrash as I } from "@scalar/icons"; import R from "../../../components/data-table/DataTable.vue.js"; import b from "../../../components/data-table/DataTableRow.vue.js"; import c from "../../../components/data-table/DataTableHeader.vue.js"; import d from "../../../components/data-table/DataTableCell.vue.js"; import p from "../../../components/code-input/CodeInput.vue.js"; const W = /* @__PURE__ */ h({ __name: "EnvironmentVariablesTable", props: { environment: {}, environmentName: {}, eventBus: {}, collectionType: {} }, setup(n) { const V = ["1fr", "1fr", "36px"], N = y(() => { const t = n.environment.variables.map((l) => ({ name: l.name, value: typeof l.value == "string" ? l.value : l.value.default })), e = n.environment.variables.at(-1), o = e && (e.name !== "" || e.value !== ""); return !e || o ? [...t, { name: "", value: "" }] : t; }), f = (t, e, o) => { const l = o >= n.environment.variables.length; if (!(!t && l)) { if (o >= n.environment.variables.length) { n.eventBus.emit("environment:upsert:environment-variable", { environmentName: n.environmentName, variable: { name: t, value: e }, collectionType: n.collectionType }); return; } n.eventBus.emit("environment:upsert:environment-variable", { environmentName: n.environmentName, variable: { name: t, value: e }, index: o, collectionType: n.collectionType }); } }, g = (t) => n.eventBus.emit("environment:delete:environment-variable", { environmentName: n.environmentName, index: t, collectionType: n.collectionType }); return (t, e) => (u(), s(a(R), { class: "group/table data-table h-min flex-1 rounded", columns: V }, { default: r(() => [ i(a(b), { class: "sr-only !block" }, { default: r(() => [ i(a(c), null, { default: r(() => [...e[0] || (e[0] = [ v("Name", -1) ])]), _: 1 }), i(a(c), null, { default: r(() => [...e[1] || (e[1] = [ v("Value", -1) ])]), _: 1 }), i(a(c), null, { default: r(() => [...e[2] || (e[2] = [ v("Actions", -1) ])]), _: 1 }) ]), _: 1 }), (u(!0), T(C, null, k(N.value, (o, l) => (u(), s(a(b), { key: l, class: "group/row" }, { default: r(() => [ i(a(d), null, { default: r(() => [ i(a(p), { "aria-label": "Environment Variable Name", disableCloseBrackets: "", disableTabIndent: "", environment: void 0, lineWrapping: "", modelValue: o.name, placeholder: "Name", "onUpdate:modelValue": (m) => f(m, o.value, l) }, null, 8, ["modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024), i(a(d), null, { default: r(() => [ i(a(p), { "aria-label": "Environment Variable Value", disableTabIndent: "", environment: void 0, lineWrapping: "", modelValue: o.value, placeholder: "Value", "onUpdate:modelValue": (m) => f(o.name, m, l) }, null, 8, ["modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024), i(a(d), { class: "flex items-center justify-center" }, { default: r(() => [ l < t.environment.variables.length ? (u(), s(a(w), { key: 0, class: "text-c-2 hover:text-c-1 hover:bg-b-2 hidden h-fit rounded p-1 group-focus-within:flex group-hover/row:flex", size: "sm", variant: "ghost", onClick: (m) => g(l) }, { default: r(() => [ i(a(I), { class: "size-3.5" }) ]), _: 1 }, 8, ["onClick"])) : B("", !0) ]), _: 2 }, 1024) ]), _: 2 }, 1024))), 128)) ]), _: 1 })); } }); export { W as default };