@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
120 lines (119 loc) • 4.55 kB
JavaScript
import { defineComponent as g, useId as b, computed as c, useTemplateRef as I, createElementBlock as o, createCommentVNode as f, openBlock as i, createVNode as r, unref as t, withCtx as u, createElementVNode as T, Fragment as x, normalizeClass as w, renderList as O, createBlock as L, createTextVNode as E, toDisplayString as S } from "vue";
import { TabGroup as N, TabList as P, TabPanels as B, TabPanel as F } from "@headlessui/vue";
import { DEFAULT_CLIENT as V } from "@scalar/api-client/v2/blocks/operation-code-sample";
import { ScalarMarkdown as A, ScalarCodeBlock as D } from "@scalar/components";
import { emitCustomEvent as M } from "@scalar/workspace-store/events";
import { getFeaturedClients as z, isFeaturedClient as G } from "../helpers/featured-clients.js";
import K from "./ClientDropdown.vue.js";
const R = {
key: 0,
ref: "wrapper-ref"
}, U = ["id"], _ = {
key: 1,
class: "selected-client card-footer border-t-0 p-0",
role: "tabpanel",
tabindex: "1"
}, j = ["id"], Z = /* @__PURE__ */ g({
__name: "ClientSelector",
props: {
xScalarSdkInstallation: {},
clientOptions: {},
xSelectedClient: { default: () => V }
},
setup(l, { expose: k }) {
const p = b(), m = b(), C = c(
() => l.clientOptions.flatMap(
(e) => e.options.find((a) => a.id === l.xSelectedClient) ?? []
)[0]
), s = c(() => z(l.clientOptions)), y = c(
() => s.value.findIndex(
(e) => l.xSelectedClient === e.id
)
), v = I("wrapper-ref"), h = (e) => {
const a = s.value[e];
!a || !v.value || M(v.value, "scalar-update-selected-client", a.id);
}, n = c(() => {
if (!Array.isArray(l.xScalarSdkInstallation) || !l.xScalarSdkInstallation?.length)
return;
const e = l.xScalarSdkInstallation.find((a) => {
const d = l.xSelectedClient?.split("/")[0]?.toLowerCase();
return a.lang.toLowerCase() === d;
});
if (e)
return e;
});
return k({
selectedClientOption: C
}), (e, a) => e.clientOptions.length ? (i(), o("div", R, [
r(t(N), {
manual: "",
selectedIndex: y.value,
onChange: h
}, {
default: u(() => [
T("div", {
id: t(p),
class: "client-libraries-heading"
}, " Client Libraries ", 8, U),
r(t(P), {
"aria-labelledby": t(p),
class: "client-libraries-list"
}, {
default: u(() => [
r(K, {
clientOptions: e.clientOptions,
featuredClients: s.value,
morePanel: t(m),
xSelectedClient: e.xSelectedClient
}, null, 8, ["clientOptions", "featuredClients", "morePanel", "xSelectedClient"])
]),
_: 1
}, 8, ["aria-labelledby"]),
r(t(B), null, {
default: u(() => [
n.value?.source || n.value?.description ? (i(), o(x, { key: 0 }, [
n.value.description ? (i(), o("div", {
key: 0,
class: w(["selected-client card-footer -outline-offset-2", n.value.source && "rounded-b-none"]),
role: "tabpanel",
tabindex: "0"
}, [
r(t(A), {
value: n.value.description
}, null, 8, ["value"])
], 2)) : f("", !0),
n.value.source ? (i(), o("div", _, [
r(t(D), {
class: "rounded-t-none rounded-b-lg px-3 py-2 -outline-offset-1 has-focus:outline",
content: n.value.source,
copy: !0,
lang: "shell"
}, null, 8, ["content"])
])) : f("", !0)
], 64)) : t(G)(e.xSelectedClient) ? (i(!0), o(x, { key: 1 }, O(s.value, (d) => (i(), L(t(F), {
key: d.id,
class: "selected-client card-footer -outline-offset-2"
}, {
default: u(() => [
E(S(d.title), 1)
]),
_: 2
}, 1024))), 128)) : (i(), o("div", {
key: 2,
id: t(m),
class: "selected-client card-footer -outline-offset-2",
role: "tabpanel",
tabindex: "0"
}, S(C.value?.title), 9, j))
]),
_: 1
})
]),
_: 1
}, 8, ["selectedIndex"])
], 512)) : f("", !0);
}
});
export {
Z as default
};