@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
154 lines (153 loc) • 5.59 kB
JavaScript
import { defineComponent as w, useId as O, computed as u, ref as y, toValue as b, createBlock as n, createCommentVNode as c, openBlock as o, unref as l, withCtx as r, createVNode as m, createElementBlock as x, Fragment as T, renderList as _, createTextVNode as C, toDisplayString as B, withDirectives as M, createElementVNode as h, vModelCheckbox as N } from "vue";
import { ExamplePicker as D } from "@scalar/api-client/v2/blocks/operation-code-sample";
import { ScalarCard as F, ScalarIcon as I, ScalarCardSection as K, ScalarCodeBlock as z, ScalarCardFooter as A, ScalarMarkdown as L } from "@scalar/components";
import { normalizeMimeTypeObject as U, getObjectKeys as P } from "@scalar/oas-utils/helpers";
import { useClipboard as q } from "@scalar/use-hooks/useClipboard";
import { getResolvedRef as G } from "@scalar/workspace-store/helpers/get-resolved-ref";
import H from "../../components/ScreenReader.vue.js";
import J from "./ExampleResponse.vue.js";
import Q from "./ExampleResponseTab.vue.js";
import W from "./ExampleResponseTabList.vue.js";
import { getResolvedRefDeep as X } from "./helpers/get-resolved-ref-deep.js";
const Y = {
key: 1,
class: "scalar-card-checkbox"
}, Z = ["aria-controls"], $ = {
key: 0,
class: "response-description"
}, me = /* @__PURE__ */ w({
__name: "ExampleResponses",
props: {
responses: {}
},
setup(E) {
const i = O(), { copyToClipboard: R } = q(), v = u(
() => Object.keys(E.responses ?? {}).sort()
), S = y(0), d = u(() => {
const e = b(v)[b(S)];
return G(E.responses?.[e]);
}), t = u(() => {
const e = U(
d.value?.content
), a = P(e ?? {});
return (
// OpenAPI 3.x
e?.["application/json"] ?? e?.["application/xml"] ?? e?.["text/plain"] ?? e?.["text/html"] ?? e?.["*/*"] ?? // Take the first key - in the future we may want to use the selected content type
e?.[a[0]] ?? void 0
);
}), f = u(
() => !!t.value?.examples && Object.keys(t.value?.examples ?? {}).length > 1
), p = y(
Object.keys(t.value?.examples ?? {})[0] ?? ""
), g = () => {
const e = b(t);
if (!e)
return;
if (Array.isArray(e.examples))
return e.examples[0];
const a = Object.keys(e.examples ?? {})[0];
return e.examples?.[a];
}, V = u(
() => f.value && p.value ? t.value?.examples?.[p.value] : g()
), j = (e) => {
S.value = e, p.value = "";
}, k = y(!1);
return (e, a) => v.value.length ? (o(), n(l(F), {
key: 0,
"aria-label": "Example Responses",
class: "response-card",
role: "region"
}, {
default: r(() => [
m(W, { onChange: j }, {
actions: r(() => [
t.value?.example ? (o(), x("button", {
key: 0,
class: "code-copy",
type: "button",
onClick: a[0] || (a[0] = () => l(R)(t.value?.example))
}, [
m(l(I), {
icon: "Clipboard",
width: "12px"
})
])) : c("", !0),
t.value?.schema ? (o(), x("label", Y, [
a[4] || (a[4] = C(" Show Schema ")),
M(h("input", {
"onUpdate:modelValue": a[1] || (a[1] = (s) => k.value = s),
"aria-controls": l(i),
class: "scalar-card-checkbox-input",
type: "checkbox"
}, null, 8, Z), [
[N, k.value]
]),
a[5] || (a[5] = h("span", { class: "scalar-card-checkbox-checkmark" }, null, -1))
])) : c("", !0)
]),
default: r(() => [
(o(!0), x(T, null, _(v.value, (s) => (o(), n(Q, {
key: s,
"aria-controls": l(i)
}, {
default: r(() => [
m(H, null, {
default: r(() => a[3] || (a[3] = [
C("Status:")
])),
_: 1,
__: [3]
}),
C(" " + B(s), 1)
]),
_: 2
}, 1032, ["aria-controls"]))), 128))
]),
_: 1
}),
m(l(K), { class: "grid flex-1" }, {
default: r(() => [
k.value && t.value?.schema ? (o(), n(l(z), {
key: 0,
id: l(i),
class: "-outline-offset-2",
content: l(X)(t.value?.schema),
lang: "json"
}, null, 8, ["id", "content"])) : (o(), n(J, {
key: 1,
id: l(i),
example: V.value,
response: t.value
}, null, 8, ["id", "example", "response"]))
]),
_: 1
}),
d.value?.description || f.value ? (o(), n(l(A), {
key: 0,
class: "response-card-footer"
}, {
default: r(() => [
d.value?.description ? (o(), x("div", $, [
m(l(L), {
class: "markdown",
value: d.value.description
}, null, 8, ["value"])
])) : c("", !0),
f.value ? (o(), n(l(D), {
key: 1,
modelValue: p.value,
"onUpdate:modelValue": a[2] || (a[2] = (s) => p.value = s),
class: "response-example-selector",
examples: t.value?.examples
}, null, 8, ["modelValue", "examples"])) : c("", !0)
]),
_: 1
})) : c("", !0)
]),
_: 1
})) : c("", !0);
}
});
export {
me as default
};