@scalar/api-client
Version:
the open source API testing client
125 lines (124 loc) • 5.22 kB
JavaScript
import { defineComponent as g, ref as c, computed as x, createBlock as d, openBlock as n, normalizeClass as B, withCtx as $, createElementBlock as s, createCommentVNode as m, createElementVNode as I, renderSlot as f, createTextVNode as O, Fragment as S, mergeProps as v, unref as r } from "vue";
import { ScalarIconButton as V } from "@scalar/components";
import { ScalarIconX as E, ScalarIconEye as h, ScalarIconEyeSlash as A } from "@scalar/icons";
import W from "../CodeInput/CodeInput.vue.js";
import q from "./DataTableCell.vue.js";
import F from "./DataTableInputSelect.vue.js";
const T = ["for"], N = { class: "relative flex min-w-0 flex-1" }, P = ["readOnly", "type", "value"], D = {
key: 1,
class: "centered-y text-orange absolute right-7 text-xs"
}, G = /* @__PURE__ */ g({
inheritAttrs: !1,
__name: "DataTableInput",
props: {
id: {},
type: {},
containerClass: {},
required: { type: Boolean, default: !1 },
modelValue: {},
canAddCustomEnumValue: { type: Boolean, default: !0 },
readOnly: { type: Boolean, default: !1 },
enum: {},
min: {},
max: {},
environment: {},
envVariables: {},
description: {},
lineWrapping: { type: Boolean, default: !1 }
},
emits: ["update:modelValue", "inputFocus", "inputBlur", "selectVariable"],
setup(e, { emit: w }) {
const t = e, i = w, u = c(!0), k = c(!1), p = c(null), b = () => {
k.value || i("inputBlur");
}, y = x(
() => t.type === "password" ? "text" : t.type ?? "text"
), C = () => {
!t.enum?.length && !t.readOnly && p.value?.focus();
};
return (a, l) => (n(), d(q, {
class: B(["relative flex", e.containerClass])
}, {
default: $(() => [
a.$slots.default ? (n(), s("div", {
key: 0,
class: "text-c-1 flex items-center pr-0 pl-3",
for: e.id ?? "",
onClick: C
}, [
f(a.$slots, "default", {}, void 0, !0),
l[6] || (l[6] = O(": ", -1))
], 8, T)) : m("", !0),
I("div", N, [
t.enum && t.enum.length ? (n(), d(F, {
key: 0,
canAddCustomValue: t.canAddCustomEnumValue,
modelValue: t.modelValue,
value: t.enum,
"onUpdate:modelValue": l[0] || (l[0] = (o) => i("update:modelValue", o))
}, null, 8, ["canAddCustomValue", "modelValue", "value"])) : (n(), s(S, { key: 1 }, [
u.value && e.type === "password" ? (n(), s("input", v({ key: 0 }, e.id ? { ...a.$attrs, id: e.id } : a.$attrs, {
autocomplete: "off",
class: ["text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none px-2 py-1.25 -outline-offset-1", { "scalar-password-input": e.type === "password" }],
"data-1p-ignore": "",
readOnly: e.readOnly,
spellcheck: "false",
type: y.value,
value: e.modelValue,
onInput: l[1] || (l[1] = (o) => i(
"update:modelValue",
o.target.value ?? ""
))
}), null, 16, P)) : (n(), d(W, v({ key: 1 }, a.$attrs, {
id: e.id,
ref_key: "codeInput",
ref: p,
class: ["text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none -outline-offset-1", [
e.type === "password" && e.description && "pr-12",
e.description && "pr-8",
e.type === "password" && "scalar-password-input"
]],
description: e.description,
disableCloseBrackets: "",
disableTabIndent: "",
envVariables: e.envVariables,
environment: e.environment,
lineWrapping: !!e.lineWrapping,
max: e.max,
min: e.min,
modelValue: e.modelValue ?? "",
readOnly: e.readOnly,
required: !!e.required,
spellcheck: "false",
type: y.value,
onBlur: b,
onFocus: l[2] || (l[2] = (o) => i("inputFocus")),
"onUpdate:modelValue": l[3] || (l[3] = (o) => i("update:modelValue", o))
}), null, 16, ["id", "class", "description", "envVariables", "environment", "lineWrapping", "max", "min", "modelValue", "readOnly", "required", "type"]))
], 64))
]),
a.$slots.warning ? (n(), s("div", D, [
f(a.$slots, "warning", {}, void 0, !0)
])) : m("", !0),
f(a.$slots, "icon", {}, void 0, !0),
e.modelValue ? (n(), d(r(V), {
key: 2,
class: "-ml-.25 h-6 w-6 self-center p-1.25",
icon: r(E),
label: "Clear Value",
onClick: l[4] || (l[4] = (o) => i("update:modelValue", ""))
}, null, 8, ["icon"])) : m("", !0),
e.type === "password" ? (n(), d(r(V), {
key: 3,
class: "-ml-.5 mr-1.25 h-6 w-6 self-center p-1.25",
icon: u.value ? r(h) : r(A),
label: u.value ? "Show Password" : "Hide Password",
onClick: l[5] || (l[5] = (o) => u.value = !u.value)
}, null, 8, ["icon", "label"])) : m("", !0)
]),
_: 3
}, 8, ["class"]));
}
});
export {
G as default
};