@scalar/api-client
Version:
the open source API testing client
224 lines (223 loc) • 8.25 kB
JavaScript
import { defineComponent as D, computed as l, ref as Q, useId as o, watch as $, createBlock as w, openBlock as r, withCtx as K, withDirectives as d, createElementBlock as f, createVNode as u, unref as v, vShow as y, mergeProps as B, toHandlers as k, Fragment as M, renderList as j, createCommentVNode as g, resolveDynamicComponent as z, createElementVNode as L, toDisplayString as G } from "vue";
import { ScalarErrorBoundary as X } from "@scalar/components";
import { canMethodHaveBody as S } from "@scalar/helpers/http/can-method-have-body";
import { REGEX as J } from "@scalar/helpers/regex/regex-helpers";
import { getResolvedRef as V } from "@scalar/workspace-store/helpers/get-resolved-ref";
import W from "../../../components/SectionFilter.vue.js";
import Y from "../../../components/ViewLayout/ViewLayoutSection.vue.js";
import Z from "./components/RequestBody.vue.js";
import R from "./components/RequestParams.vue.js";
import { createParameterHandlers as q } from "./helpers/create-parameter-handlers.js";
import { groupBy as _ } from "./helpers/group-by.js";
import ee from "../scalar-auth-selector-block/components/AuthSelector.vue.js";
const te = { class: "group pointer-events-none flex flex-1 items-center gap-1 lg:pr-24" }, ae = ["for"], oe = ["id", "placeholder", "value"], ne = {
key: 2,
class: "text-c-1 flex h-8 items-center"
}, fe = /* @__PURE__ */ D({
__name: "RequestBlock",
props: {
method: {},
path: {},
operation: {},
authMeta: { default: () => ({ type: "document" }) },
exampleKey: {},
securitySchemes: {},
selectedSecurity: {},
security: {},
server: {},
layout: {},
plugins: {},
eventBus: {},
environment: {}
},
setup(t) {
const a = l(() => ({
method: t.method,
path: t.path,
exampleKey: t.exampleKey
})), i = l(
() => _(
t.operation.parameters?.map((e) => V(e)) ?? [],
"in"
)
), m = Q("All"), C = [
"Auth",
"Variables",
"Cookies",
"Headers",
"Query",
"Body"
], E = {
All: o(),
Auth: o(),
Variables: o(),
Cookies: o(),
Headers: o(),
Query: o(),
Body: o()
}, A = l(() => {
const e = /* @__PURE__ */ new Set(["All", ...C]);
return i.value.path?.length || e.delete("Variables"), S(t.method) || e.delete("Body"), b.value && e.delete("Auth"), [...e];
}), n = l(
() => Object.fromEntries(
A.value.map((e) => [e, E[e]])
)
), b = l(
() => t.layout === "modal" && !t.operation.security && !Object.keys(t.securitySchemes ?? {}).length
), H = l(() => t.operation.summary ? t.operation.summary : t.path.replace(J.PROTOCOL, "") || "Request Name"), s = (e) => m.value === "All" || m.value === e;
$(
() => t.method,
(e) => {
m.value === "Body" && !S(e) && (m.value = "All");
}
);
const P = (e) => {
const p = e.target.value;
t.eventBus.emit("operation:update:summary", {
meta: a.value,
payload: { summary: p }
});
}, c = l(() => ({
path: q("path", t.eventBus, a.value),
cookie: q("cookie", t.eventBus, a.value),
header: q("header", t.eventBus, a.value),
query: q("query", t.eventBus, a.value)
})), I = (e) => {
t.eventBus.emit("operation:add:requestBody:formRow", {
contentType: e.contentType,
meta: a.value,
payload: {
key: e.data.key ?? "",
value: e.data.value ?? ""
}
});
}, N = (e) => t.eventBus.emit("operation:delete:requestBody:formRow", {
contentType: e.contentType,
index: e.index,
meta: a.value
}), O = (e) => t.eventBus.emit("operation:update:requestBody:contentType", {
payload: { contentType: e.value },
meta: a.value
}), U = (e) => t.eventBus.emit("operation:update:requestBody:formRow", {
contentType: e.contentType,
meta: a.value,
index: e.index,
payload: {
key: e.data.key ?? "",
value: e.data.value ?? ""
}
}), x = (e) => t.eventBus.emit("operation:update:requestBody:value", {
contentType: e.contentType,
payload: { value: e.value ?? "" },
meta: a.value
}), T = o();
return (e, p) => (r(), w(Y, {
"aria-label": `Request: ${e.operation.summary}`
}, {
title: K(() => [
L("div", te, [
e.layout !== "modal" ? (r(), f("label", {
key: 0,
class: "pointer-events-auto absolute top-0 left-0 h-full w-full cursor-text opacity-0",
for: v(T)
}, null, 8, ae)) : g("", !0),
e.layout !== "modal" ? (r(), f("input", {
key: 1,
id: v(T),
class: "text-c-1 group-hover-input pointer-events-auto relative z-10 -ml-0.5 h-8 w-full rounded pl-1.25 has-[:focus-visible]:outline md:-ml-1.25",
placeholder: H.value,
value: e.operation.summary,
onInput: P
}, null, 40, oe)) : (r(), f("span", ne, G(e.operation.summary), 1))
]),
u(W, {
modelValue: m.value,
"onUpdate:modelValue": p[0] || (p[0] = (h) => m.value = h),
filterIds: n.value,
filters: A.value
}, null, 8, ["modelValue", "filterIds", "filters"])
]),
default: K(() => [
d(u(v(ee), {
id: n.value.Auth,
environment: e.environment,
eventBus: e.eventBus,
meta: e.authMeta,
security: e.security,
securitySchemes: e.securitySchemes,
selectedSecurity: e.selectedSecurity,
server: e.server,
title: "Authorization"
}, null, 8, ["id", "environment", "eventBus", "meta", "security", "securitySchemes", "selectedSecurity", "server"]), [
[y, s("Auth") && !b.value]
]),
d(u(R, B({
id: n.value.Variables,
environment: e.environment,
exampleKey: e.exampleKey,
parameters: i.value.path ?? [],
showAddRowPlaceholder: !1,
title: "Variables"
}, k(c.value.path)), null, 16, ["id", "environment", "exampleKey", "parameters"]), [
[y, s("Variables") && i.value.path?.length]
]),
d(u(R, B({
id: n.value.Cookies,
environment: e.environment,
exampleKey: e.exampleKey,
parameters: i.value.cookie ?? [],
showAddRowPlaceholder: !0,
title: "Cookies"
}, k(c.value.cookie)), null, 16, ["id", "environment", "exampleKey", "parameters"]), [
[y, s("Cookies")]
]),
d(u(R, B({
id: n.value.Headers,
environment: e.environment,
exampleKey: e.exampleKey,
parameters: i.value.header ?? [],
title: "Headers"
}, k(c.value.header)), null, 16, ["id", "environment", "exampleKey", "parameters"]), [
[y, s("Headers")]
]),
d(u(R, B({
id: n.value.Query,
environment: e.environment,
exampleKey: e.exampleKey,
parameters: i.value.query ?? [],
title: "Query Parameters"
}, k(c.value.query)), null, 16, ["id", "environment", "exampleKey", "parameters"]), [
[y, s("Query")]
]),
d(u(Z, {
id: n.value.Body,
environment: e.environment,
exampleKey: e.exampleKey,
requestBody: v(V)(e.operation.requestBody),
title: "Request Body",
"onAdd:formRow": I,
"onDelete:fromRow": N,
"onUpdate:contentType": O,
"onUpdate:formRow": U,
"onUpdate:value": x
}, null, 8, ["id", "environment", "exampleKey", "requestBody"]), [
[y, s("Body") && v(S)(e.method)]
]),
(r(!0), f(M, null, j(e.plugins, (h, F) => (r(), w(v(X), { key: F }, {
default: K(() => [
h?.components?.request ? (r(), w(z(h.components.request), {
key: 0,
operation: e.operation,
selectedExample: e.exampleKey
}, null, 8, ["operation", "selectedExample"])) : g("", !0)
]),
_: 2
}, 1024))), 128))
]),
_: 1
}, 8, ["aria-label"]));
}
});
export {
fe as default
};