@scalar/api-client
Version:
the open source API testing client
185 lines (184 loc) • 7.7 kB
JavaScript
import { defineComponent as g, computed as i, ref as I, useId as E, createBlock as t, openBlock as n, withCtx as u, createElementVNode as m, normalizeClass as B, createElementBlock as c, createVNode as h, Fragment as y, createCommentVNode as d, createTextVNode as A, renderList as O, unref as z, withDirectives as N, resolveDynamicComponent as P, vShow as D } from "vue";
import { ScalarErrorBoundary as L } from "@scalar/components";
import { isDefined as j } from "@scalar/helpers/array/is-defined";
import w from "../../../components/SectionFilter.vue.js";
import F from "../../../components/ViewLayout/ViewLayoutSection.vue.js";
import V from "./components/Headers.vue.js";
import U from "./components/ResponseBody.vue.js";
import K from "./components/ResponseBodyStreaming.vue.js";
import M from "./components/ResponseBodyVirtual.vue.js";
/* empty css */
import Z from "./components/ResponseCookies.vue.js";
import G from "./components/ResponseEmpty.vue.js";
import J from "./components/ResponseLoadingOverlay.vue.js";
import Q from "./components/ResponseMetaInformation.vue.js";
import { textMediaTypes as W } from "./helpers/media-types.js";
import { parseSetCookie as X } from "./helpers/parse-set-cookie.js";
const Y = { class: "flex h-8 flex-1 items-center" }, x = ["id", "role"], b = 2e5, ce = /* @__PURE__ */ g({
__name: "ResponseBlock",
props: {
response: {},
request: {},
layout: {},
totalPerformedRequests: {},
appVersion: {},
plugins: {},
events: {},
eventBus: {}
},
emits: ["sendRequest"],
setup(r, { expose: C, emit: H }) {
const T = H, p = i(() => {
const e = r.response?.headers;
return e ? Object.keys(e).map((s) => ({
name: s,
value: e[s] ?? ""
})) : [];
}), k = i(
() => r.response?.cookieHeaderKeys.map((e) => X(e)).filter(j) ?? []
), $ = ["Cookies", "Headers", "Body"], o = I("All"), v = i(() => ["All", ...$]), a = i(
() => Object.fromEntries(
v.value.map((e) => [e, E()])
)
), q = i(() => {
if (!r.response || !("size" in r.response))
return !1;
const e = r.response.headers?.["content-type"] || r.response.headers?.["Content-Type"];
return !e || (r.response.size ?? 0) <= b || e.includes("text/html") ? !1 : W.some((l) => e.includes(l)) && (r.response.size ?? 0) > b;
}), R = i(
() => r.request?.headers ? [...r.request.headers].map((e) => ({
name: e[0],
value: e[1],
required: !1
})) : []
), f = (e) => o.value === "All" || o.value === e;
return C({
responseHeaders: p,
responseCookies: k,
requestHeaders: R,
shouldVirtualize: q,
activeFilter: o,
filters: v
}), (e, s) => (n(), t(F, { "aria-label": "Response" }, {
title: u(() => [
m("div", Y, [
m("div", {
"aria-live": "polite",
class: B(["flex items-center", { "animate-response-heading": e.response }])
}, [
s[4] || (s[4] = m("span", { class: "response-heading pointer-events-none absolute" }, " Response ", -1)),
e.response ? (n(), t(Q, {
key: 0,
class: "animate-response-children",
events: e.events,
response: e.response
}, null, 8, ["events", "response"])) : d("", !0)
], 2),
h(w, {
modelValue: o.value,
"onUpdate:modelValue": s[0] || (s[0] = (l) => o.value = l),
filterIds: a.value,
filters: v.value
}, null, 8, ["modelValue", "filterIds", "filters"])
])
]),
default: u(() => [
m("div", {
id: a.value.All,
class: B(["custom-scroll response-section-content relative grid h-full justify-stretch", {
"content-start": e.response
}]),
role: o.value === "All" && e.response ? "tabpanel" : "none"
}, [
e.response ? (n(), c(y, { key: 1 }, [
f("Cookies") ? (n(), t(Z, {
key: 0,
id: a.value.Cookies,
class: "response-section-content-cookies",
cookies: k.value,
role: o.value === "All" ? "none" : "tabpanel"
}, null, 8, ["id", "cookies", "role"])) : d("", !0),
f("Headers") ? (n(), t(V, {
key: 1,
id: a.value.Headers,
class: "response-section-content-headers",
headers: R.value,
role: o.value === "All" ? "none" : "tabpanel"
}, {
title: u(() => [...s[5] || (s[5] = [
A("Request Headers", -1)
])]),
_: 1
}, 8, ["id", "headers", "role"])) : d("", !0),
f("Headers") ? (n(), t(V, {
key: 2,
id: a.value.Headers,
class: "response-section-content-headers",
headers: p.value,
role: o.value === "All" ? "none" : "tabpanel"
}, {
title: u(() => [...s[6] || (s[6] = [
A("Response Headers", -1)
])]),
_: 1
}, 8, ["id", "headers", "role"])) : d("", !0),
(n(!0), c(y, null, O(e.plugins, (l, S) => (n(), t(z(L), { key: S }, {
default: u(() => [
l.components?.response && e.request && e.response ? N((n(), t(P(l.components.response), {
key: 0,
request: e.request,
response: e.response
}, null, 8, ["request", "response"])), [
[D, o.value === "All"]
]) : d("", !0)
]),
_: 2
}, 1024))), 128)),
o.value === "All" || o.value === "Body" ? (n(), c(y, { key: 3 }, [
"reader" in e.response ? (n(), t(K, {
key: 0,
id: a.value.Body,
class: "response-section-content-body",
reader: e.response.reader
}, null, 8, ["id", "reader"])) : q.value && typeof e.response?.data == "string" ? (n(), t(M, {
key: 1,
id: a.value.Body,
content: e.response.data,
data: e.response?.data,
headers: p.value,
role: o.value === "All" ? "none" : "tabpanel"
}, null, 8, ["id", "content", "data", "headers", "role"])) : (n(), t(U, {
key: 2,
id: a.value.Body,
active: !0,
class: "response-section-content-body",
data: e.response?.data,
headers: p.value,
layout: "client",
role: o.value === "All" ? "none" : "tabpanel",
title: "Body"
}, null, 8, ["id", "data", "headers", "role"]))
], 64)) : d("", !0)
], 64)) : (n(), t(G, {
key: 0,
appVersion: e.appVersion,
events: e.events,
layout: e.layout,
totalPerformedRequests: e.totalPerformedRequests,
onAddRequest: s[1] || (s[1] = (l) => e.eventBus.emit("ui:open:command-palette", {
action: "create-request",
payload: void 0
})),
onOpenCommandPalette: s[2] || (s[2] = (l) => e.eventBus.emit("ui:open:command-palette")),
onSendRequest: s[3] || (s[3] = (l) => T("sendRequest"))
}, null, 8, ["appVersion", "events", "layout", "totalPerformedRequests"])),
h(J, { events: e.events }, null, 8, ["events"])
], 10, x)
]),
_: 1
}));
}
});
export {
ce as default
};