@scalar/api-client
Version:
the open source API testing client
193 lines (192 loc) • 7.86 kB
JavaScript
import { defineComponent as U, computed as r, resolveComponent as $, createBlock as u, openBlock as s, unref as l, normalizeClass as q, withCtx as n, createVNode as d, createCommentVNode as b, createElementVNode as m, createElementBlock as v, Fragment as D, toDisplayString as I } from "vue";
import { ScalarTooltip as S, ScalarIcon as h, ScalarButton as y } from "@scalar/components";
import { ScalarIconTrash as E } from "@scalar/icons";
import { unpackProxyObject as c } from "@scalar/workspace-store/helpers/unpack-proxy";
import { getFileName as k } from "../helpers/files.js";
import { validateParameter as j } from "../helpers/validate-parameter.js";
import N from "./RequestTableTooltip.vue.js";
import O from "../../../components/data-table/DataTableRow.vue.js";
import P from "../../../components/data-table/DataTableCheckbox.vue.js";
import f from "../../../components/data-table/DataTableCell.vue.js";
import w from "../../../components/code-input/CodeInput.vue.js";
const G = { class: "text-c-2 filemask flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1" }, K = {
key: 1,
class: "p-0.5"
}, ee = /* @__PURE__ */ U({
__name: "RequestTableRow",
props: {
data: {},
isReadOnly: { type: Boolean },
hasCheckboxDisabled: { type: Boolean },
invalidParams: {},
label: {},
environment: {},
showUploadButton: { type: Boolean }
},
emits: ["updateRow", "deleteRow", "uploadFile", "removeFile"],
setup(t, { emit: R }) {
const i = R, V = r(() => t.data.schema?.default), g = r(() => t.data.schema?.enum), B = r(
() => t.data.schema && "minimum" in t.data.schema ? t.data.schema.minimum : void 0
), C = r(
() => t.data.schema && "maximum" in t.data.schema ? t.data.schema.maximum : void 0
), F = r(
() => t.data.schema && "type" in t.data.schema ? t.data.schema.type : void 0
), p = r(
() => j(t.data.schema, t.data.value)
), x = (e) => e instanceof File, T = r({
get: () => {
const e = c(t.data.value);
return e instanceof File ? k(c(t.data.value)) ?? "" : e === null ? "" : e;
},
set: (e) => {
typeof e == "string" && i("updateRow", { value: e });
}
});
return (e, a) => {
const z = $("RouterLink");
return s(), u(l(O), {
id: e.data.name,
class: q({
alert: p.value.ok === !1,
error: p.value.ok === !1 && e.invalidParams?.has(e.data.name)
})
}, {
default: n(() => [
e.data.globalRoute !== void 0 ? (s(), u(z, {
key: 0,
class: "text-c-2 flex items-center justify-center border-t !border-r",
to: e.data.globalRoute ?? {}
}, {
default: n(() => [
a[7] || (a[7] = m("span", { class: "sr-only" }, "Global", -1)),
d(l(S), {
content: "Global cookies are shared across the whole workspace.",
placement: "top"
}, {
default: n(() => [
d(l(h), {
class: "text-c-1",
icon: "Globe",
size: "xs",
tabindex: "0"
})
]),
_: 1
})
]),
_: 1
}, 8, ["to"])) : (s(), u(l(P), {
key: 1,
class: "!border-r",
disabled: e.hasCheckboxDisabled ?? !1,
modelValue: !e.data.isDisabled,
"onUpdate:modelValue": a[0] || (a[0] = (o) => i("updateRow", { isEnabled: o }))
}, null, 8, ["disabled", "modelValue"])),
d(l(f), null, {
default: n(() => [
d(l(w), {
"aria-label": `${e.label} Key`,
disableCloseBrackets: "",
disabled: e.isReadOnly,
disableEnter: "",
disableTabIndent: "",
environment: e.environment,
lineWrapping: "",
modelValue: e.data.name,
placeholder: "Key",
required: !!e.data.isRequired,
onSelectVariable: a[1] || (a[1] = (o) => i("updateRow", { key: o })),
"onUpdate:modelValue": a[2] || (a[2] = (o) => i("updateRow", { key: o }))
}, null, 8, ["aria-label", "disabled", "environment", "modelValue", "required"])
]),
_: 1
}),
d(l(f), null, {
default: n(() => [
d(l(w), {
"aria-label": `${e.label} Value`,
class: "pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10",
default: V.value,
disableCloseBrackets: "",
disabled: e.isReadOnly,
disableEnter: "",
disableTabIndent: "",
enum: g.value ?? [],
environment: e.environment,
lineWrapping: "",
max: C.value,
min: B.value,
modelValue: T.value,
placeholder: "Value",
type: F.value,
"onUpdate:modelValue": a[4] || (a[4] = (o) => i("updateRow", { value: o }))
}, {
icon: n(() => [
(e.data.name || e.data.value) && !e.data.isRequired ? (s(), u(l(y), {
key: 0,
class: "text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 hidden h-fit rounded p-1 group-hover:flex group-has-[.cm-focused]:flex",
size: "sm",
variant: "ghost",
onClick: a[3] || (a[3] = (o) => i("deleteRow"))
}, {
default: n(() => [
d(l(E), { class: "size-3.5" })
]),
_: 1
})) : b("", !0),
e.data.schema ? (s(), u(N, {
key: 1,
schema: e.data.schema,
value: e.data.value
}, null, 8, ["schema", "value"])) : b("", !0)
]),
_: 1
}, 8, ["aria-label", "default", "disabled", "enum", "environment", "max", "min", "modelValue", "type"])
]),
_: 1
}),
e.showUploadButton ? (s(), u(l(f), {
key: 2,
class: "group/upload flex items-center justify-center whitespace-nowrap"
}, {
default: n(() => [
x(l(c)(e.data.value)) ? (s(), v(D, { key: 0 }, [
m("div", G, [
m("span", null, I(l(k)(l(c)(e.data.value))), 1)
]),
m("button", {
class: "bg-b-2 centered-x centered-y absolute hidden w-[calc(100%_-_8px)] rounded p-0.5 text-center text-xs font-medium group-hover/upload:block",
type: "button",
onClick: a[5] || (a[5] = (o) => i("removeFile"))
}, " Delete ")
], 64)) : (s(), v("div", K, [
d(l(y), {
class: "bg-b-2 hover:bg-b-3 text-c-2 h-fit border-0 py-px shadow-none",
size: "sm",
variant: "outlined",
onClick: a[6] || (a[6] = (o) => i("uploadFile"))
}, {
default: n(() => [
a[8] || (a[8] = m("span", null, "Upload File", -1)),
d(l(h), {
class: "ml-1",
icon: "Upload",
size: "xs",
thickness: "2.5"
})
]),
_: 1
})
]))
]),
_: 1
})) : b("", !0)
]),
_: 1
}, 8, ["id", "class"]);
};
}
});
export {
ee as default
};