UNPKG

@scalar/api-client

Version:

the open source API testing client

220 lines (219 loc) 8.87 kB
import { defineComponent as K, computed as N, ref as P, onMounted as j, createElementBlock as u, openBlock as r, Fragment as s, renderList as C, createBlock as x, createCommentVNode as b, unref as i, withCtx as a, createVNode as n, createElementVNode as h, toDisplayString as _, mergeProps as y, createTextVNode as V, normalizeClass as A, renderSlot as L, capitalize as g } from "vue"; import { ScalarMarkdownSummary as M } from "@scalar/components"; import { useWorkspace as R } from "../../../../store/store.js"; import { updateScheme as Q } from "../helpers/update-scheme.js"; import { restoreAuthFromLocalStorage as q } from "./helpers/restore-auth-from-local-storage.js"; import D from "./OAuth2.vue.js"; import w from "./RequestAuthDataTableInput.vue.js"; import f from "../../../../components/DataTable/DataTableRow.vue.js"; import T from "../../../../components/DataTable/DataTableCell.vue.js"; const E = { 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" }, O = { key: 0, class: "flex min-h-8 border-t text-base" }, H = { class: "flex h-8 max-w-full gap-2.5 overflow-x-auto px-3" }, W = ["onClick"], G = { class: "relative z-10" }, le = /* @__PURE__ */ K({ __name: "RequestAuthTab", props: { collection: {}, environment: {}, envVariables: {}, layout: {}, persistAuth: { type: Boolean, default: !1 }, securitySchemeUids: {}, server: {}, workspace: {} }, emits: ["authorized"], setup(m, { emit: F }) { const z = F, $ = R(), { securitySchemes: B } = $, U = N( () => m.securitySchemeUids.map((t) => ({ scheme: B[t] })) ), d = P(""), S = (t) => { const o = t.description ? `: ${t.description}` : "", e = `${g(t.nameKey)}${o || `: ${t.type}`}`; if (t.type === "apiKey") return `${g(t.nameKey)}${o || `: ${t.in}`}`; if (t.type === "oauth2") { const l = Object.values(t.flows ?? {})[0]; return `${g(t.nameKey)}: ${d.value ? d.value : l?.type ?? ""}${o}`; } return t.type === "http" ? `${g(t.nameKey)}: ${t.scheme}${o}` : `${e}${o}`; }, v = (t, o, e) => { Q(t, o, e, $, m.persistAuth); }; j(() => { m.persistAuth && q($, m.collection.uid); }); const c = { environment: m.environment, envVariables: m.envVariables, workspace: m.workspace }; return (t, o) => (r(!0), u(s, null, C(U.value, ({ scheme: e }) => (r(), u(s, { key: e?.uid }, [ U.value.length > 1 && e ? (r(), x(i(f), { key: 0 }, { default: a(() => [ n(i(T), { "aria-label": S(e), class: "text-c-2 group/auth flex items-center leading-[22px] whitespace-nowrap outline-none hover:whitespace-normal" }, { default: a(() => [ h("p", E, _(S(e)), 1) ]), _: 2 }, 1032, ["aria-label"]) ]), _: 2 }, 1024)) : b("", !0), e?.description && U.value.length <= 1 ? (r(), x(i(f), { key: 1 }, { default: a(() => [ n(i(T), { "aria-label": e.description, class: "max-h-[auto]" }, { default: a(() => [ n(i(M), { 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)) : b("", !0), e?.type === "http" ? (r(), u(s, { key: 2 }, [ e.scheme === "bearer" ? (r(), x(i(f), { key: 0 }, { default: a(() => [ n(w, y({ ref_for: !0 }, c, { containerClass: t.layout === "reference" && "border-t", modelValue: e.token, placeholder: "Token", type: "password", "onUpdate:modelValue": (l) => v(e.uid, "token", l) }), { default: a(() => [...o[1] || (o[1] = [ V(" Bearer Token ", -1) ])]), _: 1 }, 16, ["containerClass", "modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024)) : e?.scheme === "basic" ? (r(), u(s, { key: 1 }, [ n(i(f), null, { default: a(() => [ n(w, y({ ref_for: !0 }, c, { class: "text-c-2", modelValue: e.username, placeholder: "janedoe", required: "", "onUpdate:modelValue": (l) => v(e.uid, "username", l) }), { default: a(() => [...o[2] || (o[2] = [ V(" Username ", -1) ])]), _: 1 }, 16, ["modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024), n(i(f), null, { default: a(() => [ n(w, y({ ref_for: !0 }, c, { modelValue: e.password, placeholder: "********", type: "password", "onUpdate:modelValue": (l) => v(e.uid, "password", l) }), { default: a(() => [...o[3] || (o[3] = [ V(" Password ", -1) ])]), _: 1 }, 16, ["modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024) ], 64)) : b("", !0) ], 64)) : e?.type === "apiKey" ? (r(), u(s, { key: 3 }, [ n(i(f), null, { default: a(() => [ n(w, y({ ref_for: !0 }, c, { containerClass: t.layout === "reference" && "border-t", modelValue: e.name, placeholder: "api-key", "onUpdate:modelValue": (l) => v(e.uid, "name", l) }), { default: a(() => [...o[4] || (o[4] = [ V(" Name ", -1) ])]), _: 1 }, 16, ["containerClass", "modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024), n(i(f), null, { default: a(() => [ n(w, y({ ref_for: !0 }, c, { modelValue: e.value, placeholder: "QUxMIFlPVVIgQkFTRSBBUkUgQkVMT05HIFRPIFVT", type: "password", "onUpdate:modelValue": (l) => v(e.uid, "value", l) }), { default: a(() => [...o[5] || (o[5] = [ V(" Value ", -1) ])]), _: 1 }, 16, ["modelValue", "onUpdate:modelValue"]) ]), _: 2 }, 1024) ], 64)) : e?.type === "oauth2" ? (r(), u(s, { key: 4 }, [ n(i(f), null, { default: a(() => [ Object.keys(e.flows).length > 1 ? (r(), u("div", O, [ h("div", H, [ (r(!0), u(s, null, C(e?.flows, (l, p, k) => (r(), u("button", { key: p, class: A(["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" && (d.value === p || k === 0 && !d.value), "!text-c-1 !rounded-none border-b-[1px] !border-current opacity-100": t.layout === "reference" && (d.value === p || k === 0 && !d.value) }]), type: "button", onClick: (I) => d.value = p }, [ h("span", G, _(p), 1) ], 10, W))), 128)) ]) ])) : b("", !0) ]), _: 2 }, 1024), (r(!0), u(s, null, C(e?.flows, (l, p, k) => (r(), u(s, { key: p }, [ d.value === p || k === 0 && !d.value ? (r(), x(D, y({ key: 0, ref_for: !0 }, c, { collection: t.collection, flow: l, persistAuth: t.persistAuth, scheme: e, server: t.server, workspace: t.workspace, onAuthorized: o[0] || (o[0] = (I) => z("authorized")) }), { "oauth-actions": a(() => [ L(t.$slots, "oauth-actions") ]), _: 3 }, 16, ["collection", "flow", "persistAuth", "scheme", "server", "workspace"])) : b("", !0) ], 64))), 128)) ], 64)) : e?.type === "openIdConnect" ? (r(), u("div", { key: 5, class: A(["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)) : b("", !0) ], 64))), 128)); } }); export { le as default };