UNPKG

@scalar/api-client

Version:

the open source API testing client

186 lines (185 loc) 7.59 kB
import { defineComponent as I, computed as i, ref as O, useId as S, createBlock as r, 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 E, unref as z, withDirectives as N, resolveDynamicComponent as P, vShow as L } from "vue"; import { ScalarErrorBoundary as j } from "@scalar/components"; import w from "../../../components/SectionFilter.vue.js"; import D from "../../../components/ViewLayout/ViewLayoutSection.vue.js"; import V from "./components/Headers.vue.js"; import F from "./components/ResponseBody.vue.js"; import M from "./components/ResponseBodyStreaming.vue.js"; import U from "./components/ResponseBodyVirtual.vue.js"; /* empty css */ import K from "./components/ResponseCookies.vue.js"; import Z from "./components/ResponseEmpty.vue.js"; import G from "./components/ResponseLoadingOverlay.vue.js"; import J from "./components/ResponseMetaInformation.vue.js"; import { textMediaTypes as Q } from "./helpers/media-types.js"; const W = { class: "flex h-8 flex-1 items-center" }, X = ["id", "role"], b = 2e5, pe = /* @__PURE__ */ I({ __name: "ResponseBlock", props: { response: {}, request: {}, layout: {}, totalPerformedRequests: {}, appVersion: {}, plugins: {}, events: {}, eventBus: {} }, emits: ["sendRequest"], setup(t, { expose: H, emit: C }) { const T = C, p = i(() => { const e = t.response?.headers; return e ? Object.keys(e).map((s) => ({ name: s, value: e[s] ?? "" })) : []; }), k = i( () => t.response?.cookieHeaderKeys.flatMap((e) => { const s = t.response?.headers?.[e]; return s ? { name: e, value: s } : []; }) ?? [] ), $ = ["Cookies", "Headers", "Body"], o = O("All"), v = i(() => ["All", ...$]), a = i( () => Object.fromEntries( v.value.map((e) => [e, S()]) ) ), R = i(() => { if (!t.response || !("size" in t.response)) return !1; const e = t.response.headers?.["content-type"] || t.response.headers?.["Content-Type"]; return !e || (t.response.size ?? 0) <= b || e.includes("text/html") ? !1 : Q.some((l) => e.includes(l)) && (t.response.size ?? 0) > b; }), q = i( () => t.request?.headers ? [...t.request.headers].map((e) => ({ name: e[0], value: e[1], required: !1 })) : [] ), f = (e) => e === "All" || o.value === e; return H({ responseHeaders: p, responseCookies: k, requestHeaders: q, shouldVirtualize: R, activeFilter: o, filters: v }), (e, s) => (n(), r(D, { "aria-label": "Response" }, { title: u(() => [ m("div", W, [ 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(), r(J, { 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(), r(K, { 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(), r(V, { key: 1, id: a.value.Headers, class: "response-section-content-headers", headers: q.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(), r(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, E(e.plugins, (l, g) => (n(), r(z(j), { key: g }, { default: u(() => [ l.components?.response ? N((n(), r(P(l.components.response), { key: 0, request: e.request, response: e.response }, null, 8, ["request", "response"])), [ [L, o.value === "All"] ]) : d("", !0) ]), _: 2 }, 1024))), 128)), o.value === "All" || o.value === "Body" ? (n(), c(y, { key: 3 }, [ "reader" in e.response ? (n(), r(M, { key: 0, id: a.value.Body, class: "response-section-content-body", reader: e.response.reader }, null, 8, ["id", "reader"])) : R.value && typeof e.response?.data == "string" ? (n(), r(U, { 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(), r(F, { 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(), r(Z, { 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: "addOperation" })), 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(G, { events: e.events }, null, 8, ["events"]) ], 10, X) ]), _: 1 })); } }); export { pe as default };