@scalar/api-client
Version:
the open source API testing client
63 lines (62 loc) • 2.26 kB
JavaScript
import { defineComponent as g, computed as a, createBlock as y, createElementBlock as C, openBlock as p, unref as t, withCtx as q, createElementVNode as s, normalizeClass as l, toDisplayString as c } from "vue";
import { cva as k, ScalarListbox as w, cx as m } from "@scalar/components";
import { getHttpMethodInfo as f, REQUEST_METHODS as x } from "@scalar/helpers/http/http-info";
const H = /* @__PURE__ */ g({
__name: "HttpMethod",
props: {
isSquare: { type: Boolean, default: !1 },
method: {},
isEditable: { type: Boolean, default: !1 }
},
emits: ["change"],
setup(b, { emit: h }) {
const r = b, v = h, o = a(() => f(r.method)), n = Object.entries(x).map(([e]) => ({
id: e,
label: e.toUpperCase(),
color: f(e).colorClass
})), i = a({
get: () => n.find(({ id: e }) => e === r.method),
set: (e) => e?.id && v("change", e.id)
}), d = k({
base: "text-center font-code text-3xs justify-center items-center flex",
variants: {
isSquare: {
true: "px-2.5 whitespace-nowrap font-bold border-r h-fit m-auto",
false: "rounded-full"
},
isEditable: {
true: "http-bg-gradient rounded-md border border-r",
false: "cursor-auto"
}
}
}), E = a(() => o.value.short);
return (e, u) => e.isEditable ? (p(), y(t(w), {
key: 0,
modelValue: i.value,
"onUpdate:modelValue": u[0] || (u[0] = (S) => i.value = S),
class: "font-code scalar-client mt-1 text-sm",
options: t(n)
}, {
default: q(() => [
s("div", {
class: l(["h-full", { "pointer-events-none": !e.isEditable }])
}, [
s("button", {
class: l(["relative h-full", t(m)(t(d)({ isSquare: e.isSquare, isEditable: e.isEditable }), o.value.colorClass)]),
type: "button"
}, [
s("span", null, c(E.value), 1)
], 2)
], 2)
]),
_: 1
}, 8, ["modelValue", "options"])) : (p(), C("div", {
key: 1,
class: l(["relative gap-1 whitespace-nowrap", t(m)(t(d)({ isSquare: e.isSquare, isEditable: e.isEditable }), o.value.colorClass)]),
type: "button"
}, c(o.value.short), 3));
}
});
export {
H as default
};