@scalar/api-client
Version:
the open source API testing client
228 lines (227 loc) • 9.33 kB
JavaScript
import { defineComponent as _, createBlock as i, openBlock as u, withCtx as n, createVNode as r, createElementBlock as b, createTextVNode as f, toDisplayString as c, Fragment as g, renderList as z, normalizeClass as v, unref as s, createCommentVNode as k, createElementVNode as p } from "vue";
import { ScalarTooltip as q, ScalarIcon as B, ScalarButton as R } from "@scalar/components";
import { ScalarIconTrash as D } from "@scalar/icons";
import { RouterLink as E } from "vue-router";
import C from "../../../components/CodeInput/CodeInput.vue.js";
import G from "../../../components/DataTable/DataTable.vue.js";
import y from "../../../components/DataTable/DataTableCell.vue.js";
import N from "../../../components/DataTable/DataTableCheckbox.vue.js";
import V from "../../../components/DataTable/DataTableHeader.vue.js";
import $ from "../../../components/DataTable/DataTableRow.vue.js";
import { parameterIsInvalid as P, hasItemProperties as h } from "../libs/request.js";
import j from "./RequestTableTooltip.vue.js";
const K = { class: "text-c-2 filemask flex w-full max-w-[100%] items-end justify-end overflow-hidden p-1" }, O = ["onClick"], A = {
key: 1,
class: "p-0.5"
}, oe = /* @__PURE__ */ _({
__name: "RequestTable",
props: {
items: {},
hasCheckboxDisabled: { type: Boolean, default: !1 },
showUploadButton: { type: Boolean, default: !1 },
isGlobal: { type: Boolean, default: !1 },
isReadOnly: { type: Boolean, default: !1 },
environment: {},
envVariables: {},
workspace: {},
invalidParams: {},
label: {}
},
emits: ["updateRow", "toggleRow", "addRow", "deleteRow", "inputFocus", "inputBlur", "uploadFile", "removeFile"],
setup(x, { emit: F }) {
const m = x, t = F, U = ["", "", "36px"], w = (e, o, l) => {
t("updateRow", e, o, l);
}, S = (e) => {
t("uploadFile", e);
}, T = (e) => Array.isArray(e.default) && e.default.length === 1 ? e.default[0] : e.default, I = (e) => !!(e.key || e.value);
return (e, o) => (u(), i(G, {
class: "group/table flex-1",
columns: U
}, {
default: n(() => [
r($, { class: "sr-only !block" }, {
default: n(() => [
r(V, null, {
default: n(() => [
f(c(e.label) + " Enabled", 1)
]),
_: 1
}),
r(V, null, {
default: n(() => [
f(c(e.label) + " Key", 1)
]),
_: 1
}),
r(V, null, {
default: n(() => [
f(c(e.label) + " Value", 1)
]),
_: 1
})
]),
_: 1
}),
(u(!0), b(g, null, z(e.items, (l, d) => (u(), i($, {
id: l.key,
key: d,
class: v({
alert: s(P)(l).value,
error: e.invalidParams && e.invalidParams.has(l.key)
})
}, {
default: n(() => [
e.isGlobal ? (u(), i(s(E), {
key: 0,
class: "text-c-2 flex items-center justify-center border-t !border-r",
to: l.route ?? {}
}, {
default: n(() => [
o[4] || (o[4] = p("span", { class: "sr-only" }, "Global", -1)),
r(s(q), {
content: "Global cookies are shared across the whole workspace.",
placement: "top"
}, {
default: n(() => [
r(s(B), {
tabindex: "0",
class: "text-c-1",
icon: "Globe",
size: "xs"
})
]),
_: 1
})
]),
_: 1
}, 8, ["to"])) : (u(), i(N, {
key: 1,
class: "!border-r",
disabled: m.hasCheckboxDisabled,
modelValue: l.enabled,
"onUpdate:modelValue": (a) => t("toggleRow", d, a)
}, null, 8, ["disabled", "modelValue", "onUpdate:modelValue"])),
r(y, null, {
default: n(() => [
r(C, {
"aria-label": `${e.label} Key`,
disableCloseBrackets: "",
disabled: m.isReadOnly,
disableEnter: "",
disableTabIndent: "",
lineWrapping: "",
envVariables: e.envVariables,
environment: e.environment,
modelValue: l.key,
placeholder: "Key",
required: !!l.required,
workspace: e.workspace,
onBlur: o[0] || (o[0] = (a) => t("inputBlur")),
onFocus: o[1] || (o[1] = (a) => t("inputFocus")),
onSelectVariable: (a) => w(d, "key", a),
"onUpdate:modelValue": (a) => t("updateRow", d, "key", a)
}, null, 8, ["aria-label", "disabled", "envVariables", "environment", "modelValue", "required", "workspace", "onSelectVariable", "onUpdate:modelValue"])
]),
_: 2
}, 1024),
r(y, null, {
default: n(() => [
r(C, {
"aria-label": `${e.label} Value`,
class: v(
s(h)(l) ? "pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10" : "group-hover:pr-6 group-has-[.cm-focused]:pr-6"
),
default: l.default,
disableCloseBrackets: "",
disabled: m.isReadOnly,
disableEnter: "",
disableTabIndent: "",
lineWrapping: "",
enum: l.enum ?? [],
envVariables: e.envVariables,
environment: e.environment,
examples: l.examples ?? [],
max: l.maximum,
min: l.minimum,
modelValue: l.value,
nullable: !!l.nullable,
placeholder: "Value",
type: l.type,
workspace: e.workspace,
onBlur: o[2] || (o[2] = (a) => t("inputBlur")),
onFocus: o[3] || (o[3] = (a) => t("inputFocus")),
onSelectVariable: (a) => w(d, "value", a),
"onUpdate:modelValue": (a) => t("updateRow", d, "value", a)
}, {
icon: n(() => [
I(l) && !l.required ? (u(), i(s(R), {
key: 0,
class: v([{
"-mr-0.5": s(h)(l)
}, "text-c-2 hover:text-c-1 hover:bg-b-2 z-context hidden h-fit rounded p-1 group-hover:flex group-has-[.cm-focused]:flex"]),
size: "sm",
variant: "ghost",
onClick: (a) => t("deleteRow", d)
}, {
default: n(() => [
r(s(D), { class: "size-3.5" })
]),
_: 1
}, 8, ["class", "onClick"])) : k("", !0),
s(h)(l) ? (u(), i(j, {
key: 1,
item: { ...l, default: T(l) }
}, null, 8, ["item"])) : k("", !0)
]),
_: 2
}, 1032, ["aria-label", "class", "default", "disabled", "enum", "envVariables", "environment", "examples", "max", "min", "modelValue", "nullable", "type", "workspace", "onSelectVariable", "onUpdate:modelValue"])
]),
_: 2
}, 1024),
e.showUploadButton ? (u(), i(y, {
key: 2,
class: "group/upload flex items-center justify-center whitespace-nowrap"
}, {
default: n(() => [
l.file ? (u(), b(g, { key: 0 }, [
p("div", K, [
p("span", null, c(l.file?.name), 1)
]),
p("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) => t("removeFile", d)
}, " Delete ", 8, O)
], 64)) : (u(), b("div", A, [
r(s(R), {
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) => S(d)
}, {
default: n(() => [
o[5] || (o[5] = p("span", null, "Upload File", -1)),
r(s(B), {
class: "ml-1",
icon: "Upload",
size: "xs",
thickness: "2.5"
})
]),
_: 1
}, 8, ["onClick"])
]))
]),
_: 2
}, 1024)) : k("", !0)
]),
_: 2
}, 1032, ["id", "class"]))), 128))
]),
_: 1
}));
}
});
export {
oe as default
};