@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
254 lines (253 loc) • 10.1 kB
JavaScript
import { defineComponent as O, computed as K, ref as D, onMounted as M, useTemplateRef as P, createElementBlock as u, openBlock as l, Fragment as d, createElementVNode as x, renderList as $, createBlock as g, createCommentVNode as y, unref as s, withCtx as n, createVNode as i, toDisplayString as A, mergeProps as v, createTextVNode as V, normalizeClass as I, capitalize as S } from "vue";
import { DataTableRow as f, DataTableCell as R } from "@scalar/api-client/components/DataTable";
import { useWorkspace as z } from "@scalar/api-client/store";
import { ScalarMarkdownSummary as H } from "@scalar/components";
import { safeLocalStorage as N, CLIENT_LS_KEYS as j } from "@scalar/helpers/object/local-storage";
import { isDefined as B } from "@scalar/oas-utils/helpers";
import { emitCustomEvent as F } from "@scalar/workspace-store/events";
import { updateScheme as Q } from "../helpers/update-scheme.js";
import q from "./OAuth2.vue.js";
import k from "./RequestAuthDataTableInput.vue.js";
const J = { class: "bg-b-1 text-c-2 outline-b-3 top-0 z-1 h-full w-full overflow-hidden px-3 py-1.25 text-ellipsis group-hover/auth:absolute group-hover/auth:h-auto group-hover/auth:border-b *:first:line-clamp-1 *:first:text-ellipsis group-hover/auth:*:first:line-clamp-none" }, Y = {
key: 0,
class: "flex min-h-8 border-t text-base"
}, W = { class: "flex h-8 max-w-full gap-2.5 overflow-x-auto px-3" }, G = ["onClick"], X = { class: "relative z-10" }, se = /* @__PURE__ */ O({
__name: "RequestAuthTab",
props: {
collection: {},
environment: {},
envVariables: {},
layout: {},
persistAuth: { type: Boolean, default: !1 },
securitySchemeUids: {},
server: {},
workspace: {}
},
setup(m) {
const h = z(), { securitySchemes: U } = h, C = K(
() => m.securitySchemeUids.map((t) => ({
scheme: U[t]
}))
), p = D(""), T = (t) => {
const r = t.description ? `: ${t.description}` : "", e = `${S(t.nameKey)}${r || `: ${t.type}`}`;
if (t.type === "apiKey")
return `${S(t.nameKey)}${r || `: ${t.in}`}`;
if (t.type === "oauth2") {
const a = Object.values(t.flows ?? {})[0];
return `${S(t.nameKey)}: ${p.value ? p.value : a?.type ?? ""}${r}`;
}
return t.type === "http" ? `${S(t.nameKey)}: ${t.scheme}${r}` : `${e}${r}`;
}, w = (t, r, e) => {
Q(t, r, e, h, _.value, m.persistAuth);
};
M(() => {
if (!m.persistAuth)
return;
const t = JSON.parse(
N().getItem(j.AUTH) ?? "{}"
), r = Object.keys(U).reduce(
(e, a) => {
const o = U[a];
return o && (e[o.nameKey] = o.uid), e;
},
{}
);
Object.entries(t).forEach(([e, a]) => {
const o = r[e];
o && Object.entries(a).forEach(([E, L]) => {
F(_.value, "scalar-edit-security-scheme", {
uid: o,
path: E,
value: L
});
});
});
try {
const a = JSON.parse(
N().getItem(j.SELECTED_SECURITY_SCHEMES) ?? ""
).map((o) => Array.isArray(o) ? o.map((c) => r[c]).filter(B) : r[o]).filter(B);
F(_.value, "scalar-select-security-schemes", {
uids: a
});
} catch {
}
});
const b = {
environment: m.environment,
envVariables: m.envVariables,
workspace: m.workspace
}, _ = P("wrapperRef");
return (t, r) => (l(), u(d, null, [
x("div", {
ref_key: "wrapperRef",
ref: _
}, null, 512),
(l(!0), u(d, null, $(C.value, ({ scheme: e }) => (l(), u(d, {
key: e?.uid
}, [
C.value.length > 1 && e ? (l(), g(s(f), { key: 0 }, {
default: n(() => [
i(s(R), {
"aria-label": T(e),
class: "text-c-2 group/auth flex items-center leading-[22px] whitespace-nowrap outline-none hover:whitespace-normal"
}, {
default: n(() => [
x("p", J, A(T(e)), 1)
]),
_: 2
}, 1032, ["aria-label"])
]),
_: 2
}, 1024)) : y("", !0),
e?.description && C.value.length <= 1 ? (l(), g(s(f), { key: 1 }, {
default: n(() => [
i(s(R), {
"aria-label": e.description,
class: "max-h-[auto]"
}, {
default: n(() => [
i(s(H), {
class: "auth-description bg-b-1 text-c-2 min-w-0 flex-1 px-3 py-1.25",
value: e.description
}, null, 8, ["value"])
]),
_: 2
}, 1032, ["aria-label"])
]),
_: 2
}, 1024)) : y("", !0),
e?.type === "http" ? (l(), u(d, { key: 2 }, [
e.scheme === "bearer" ? (l(), g(s(f), { key: 0 }, {
default: n(() => [
i(k, v({ ref_for: !0 }, b, {
containerClass: t.layout === "reference" && "border-t",
modelValue: e.token,
placeholder: "Token",
type: "password",
"onUpdate:modelValue": (a) => w(e.uid, "token", a)
}), {
default: n(() => r[0] || (r[0] = [
V(" Bearer Token ")
])),
_: 2,
__: [0]
}, 1040, ["containerClass", "modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1024)) : e?.scheme === "basic" ? (l(), u(d, { key: 1 }, [
i(s(f), null, {
default: n(() => [
i(k, v({ ref_for: !0 }, b, {
class: "text-c-2",
modelValue: e.username,
placeholder: "janedoe",
required: "",
"onUpdate:modelValue": (a) => w(e.uid, "username", a)
}), {
default: n(() => r[1] || (r[1] = [
V(" Username ")
])),
_: 2,
__: [1]
}, 1040, ["modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1024),
i(s(f), null, {
default: n(() => [
i(k, v({ ref_for: !0 }, b, {
modelValue: e.password,
placeholder: "********",
type: "password",
"onUpdate:modelValue": (a) => w(e.uid, "password", a)
}), {
default: n(() => r[2] || (r[2] = [
V(" Password ")
])),
_: 2,
__: [2]
}, 1040, ["modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1024)
], 64)) : y("", !0)
], 64)) : e?.type === "apiKey" ? (l(), u(d, { key: 3 }, [
i(s(f), null, {
default: n(() => [
i(k, v({ ref_for: !0 }, b, {
containerClass: t.layout === "reference" && "border-t",
modelValue: e.name,
placeholder: "api-key",
"onUpdate:modelValue": (a) => w(e.uid, "name", a)
}), {
default: n(() => r[3] || (r[3] = [
V(" Name ")
])),
_: 2,
__: [3]
}, 1040, ["containerClass", "modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1024),
i(s(f), null, {
default: n(() => [
i(k, v({ ref_for: !0 }, b, {
modelValue: e.value,
placeholder: "QUxMIFlPVVIgQkFTRSBBUkUgQkVMT05HIFRPIFVT",
type: "password",
"onUpdate:modelValue": (a) => w(e.uid, "value", a)
}), {
default: n(() => r[4] || (r[4] = [
V(" Value ")
])),
_: 2,
__: [4]
}, 1040, ["modelValue", "onUpdate:modelValue"])
]),
_: 2
}, 1024)
], 64)) : e?.type === "oauth2" ? (l(), u(d, { key: 4 }, [
i(s(f), null, {
default: n(() => [
Object.keys(e.flows).length > 1 ? (l(), u("div", Y, [
x("div", W, [
(l(!0), u(d, null, $(e?.flows, (a, o, c) => (l(), u("button", {
key: o,
class: I(["floating-bg text-c-3 relative cursor-pointer border-b-[1px] border-transparent py-1 text-base font-medium", {
"!text-c-1 !rounded-none border-b-[1px] !border-current": t.layout !== "reference" && (p.value === o || c === 0 && !p.value),
"!text-c-1 !rounded-none border-b-[1px] !border-current opacity-100": t.layout === "reference" && (p.value === o || c === 0 && !p.value)
}]),
type: "button",
onClick: (E) => p.value = o
}, [
x("span", X, A(o), 1)
], 10, G))), 128))
])
])) : y("", !0)
]),
_: 2
}, 1024),
(l(!0), u(d, null, $(e?.flows, (a, o, c) => (l(), u(d, { key: o }, [
p.value === o || c === 0 && !p.value ? (l(), g(q, v({
key: 0,
ref_for: !0
}, b, {
collection: t.collection,
flow: a,
persistAuth: t.persistAuth,
scheme: e,
server: t.server,
workspace: t.workspace
}), null, 16, ["collection", "flow", "persistAuth", "scheme", "server", "workspace"])) : y("", !0)
], 64))), 128))
], 64)) : e?.type === "openIdConnect" ? (l(), u("div", {
key: 5,
class: I(["text-c-3 bg-b-1 flex min-h-[calc(4rem+1px)] items-center justify-center border-t border-b-0 px-4 text-base", { "rounded-b-lg": t.layout === "reference" }])
}, " Coming soon ", 2)) : y("", !0)
], 64))), 128))
], 64));
}
});
export {
se as default
};