@scalar/api-client
Version:
the open source API testing client
83 lines (82 loc) • 3.27 kB
JavaScript
import { defineComponent as y, computed as v, createBlock as m, openBlock as t, unref as s, withCtx as n, createVNode as d, createElementBlock as i, Fragment as p, createElementVNode as a, createTextVNode as h, toDisplayString as U, createCommentVNode as w, renderList as C } from "vue";
import { ScalarPopover as B, ScalarButton as z, ScalarFloatingBackdrop as N } from "@scalar/components";
import { ScalarIconPlus as V, ScalarIconPencilSimple as D } from "@scalar/icons";
import I from "./ServerDropdownItem.vue.js";
const P = ["onClick"], $ = { class: "flex items-center justify-center" }, W = /* @__PURE__ */ y({
__name: "ServerDropdown",
props: {
servers: {},
server: {},
target: {},
layout: {}
},
emits: ["update:selectedServer", "update:variable", "update:servers"],
setup(o, { emit: f }) {
const u = f, b = v(
() => o.servers.map((e) => ({
id: e.url,
label: e.url ?? "Unknown server"
}))
), S = v(() => o.server?.url?.endsWith("/") ? o.server.url.slice(0, -1) : o.server?.url || "");
return (e, r) => (t(), m(s(B), {
class: "max-h-[inherit] p-0 text-base",
focus: "",
offset: 0,
placement: "bottom-start",
resize: "",
target: e.target,
teleport: `#${e.target}`
}, {
popover: n(({ close: g }) => [
a("div", {
class: "custom-scroll flex max-h-[inherit] flex-col gap-1 border-t p-1",
onClick: g
}, [
(t(!0), i(p, null, C(b.value, (l, k) => (t(), m(I, {
key: l.id,
server: e.server,
serverOption: l,
type: "request",
"onUpdate:selectedServer": (c) => u("update:selectedServer", { url: l.id }),
"onUpdate:variable": (c, x) => u("update:variable", { index: k, key: c, value: x })
}, null, 8, ["server", "serverOption", "onUpdate:selectedServer", "onUpdate:variable"]))), 128)),
e.layout !== "modal" ? (t(), i("button", {
key: 0,
class: "text-xxs hover:bg-b-2 flex cursor-pointer items-center gap-1.5 rounded p-1.75",
type: "button",
onClick: r[0] || (r[0] = (l) => u("update:servers"))
}, [
a("div", $, [
d(s(D), { class: "size-4" })
]),
r[3] || (r[3] = a("span", null, "Update Servers", -1))
])) : w("", !0)
], 8, P)
]),
backdrop: n(() => [
d(s(N), { class: "-top-(--scalar-address-bar-height) rounded-lg" })
]),
default: n(() => [
d(s(z), {
class: "z-context-plus hover:bg-b-2 font-code text-c-2 ml-0.75 h-auto gap-0.75 rounded border px-1.5 text-base whitespace-nowrap",
variant: "ghost"
}, {
default: n(() => [
e.server ? (t(), i(p, { key: 0 }, [
r[1] || (r[1] = a("span", { class: "sr-only" }, "Server:", -1)),
h(" " + U(S.value), 1)
], 64)) : (t(), i(p, { key: 1 }, [
r[2] || (r[2] = a("span", { class: "sr-only" }, "Add Server", -1)),
d(s(V), { class: "size-3" })
], 64))
]),
_: 1
})
]),
_: 1
}, 8, ["target", "teleport"]));
}
});
export {
W as default
};