@scalar/api-client
Version:
the open source API testing client
106 lines (105 loc) • 4.28 kB
JavaScript
import { defineComponent as k, computed as x, createBlock as i, openBlock as a, unref as e, withCtx as o, createVNode as l, createSlots as y, createCommentVNode as p, createElementVNode as s, normalizeStyle as C, createElementBlock as S, Fragment as b, renderList as H, toDisplayString as u, normalizeClass as q } from "vue";
import { Menu as B, MenuButton as M, MenuItems as w, MenuItem as z } from "@headlessui/vue";
import { ScalarFloating as I, ScalarIcon as F, ScalarFloatingBackdrop as N } from "@scalar/components";
import { httpStatusCodes as R } from "@scalar/oas-utils/helpers";
import { formatMs as V } from "../../libs/formatters.js";
import E from "../HttpMethod/HttpMethod.vue.js";
import { getStatusCodeColor as A } from "./httpStatusCodeColors.js";
import { useWorkspace as D } from "../../store/store.js";
const L = { class: "min-w-0" }, U = { class: "text-c-1 min-w-0 truncate" }, Q = /* @__PURE__ */ k({
__name: "AddressBarHistory",
props: {
operation: {},
target: {}
},
setup(f) {
const { requestHistory: h } = D(), d = x(
() => h.filter((r) => r.request.requestUid === f.operation.uid).slice().reverse()
);
function g(r) {
console.warn(
"Restoring from the request history doesn't work yet. Request History Item:",
r
);
}
return (r, m) => (a(), i(e(B), { as: "div" }, {
default: o(({ open: _ }) => [
l(e(I), {
offset: 0,
resize: "",
target: r.target
}, y({
default: o(() => {
var n;
return [
(n = d.value) != null && n.length ? (a(), i(e(M), {
key: 0,
class: "address-bar-history-button z-context-plus text-c-3 focus:text-c-1 relative mr-1 rounded-lg p-1.5"
}, {
default: o(() => [
l(e(F), {
icon: "History",
size: "sm",
thickness: "2.25"
}),
m[0] || (m[0] = s("span", { class: "sr-only" }, "Request History", -1))
]),
_: 1,
__: [0]
})) : p("", !0)
];
}),
_: 2
}, [
_ ? {
name: "floating",
fn: o(({ width: n }) => [
l(e(w), {
class: "custom-scroll grid max-h-[inherit] grid-cols-[44px_1fr_repeat(3,auto)] items-center border-t p-0.75",
static: "",
style: C({ width: n })
}, {
default: o(() => [
(a(!0), S(b, null, H(d.value, (t, v) => (a(), i(e(z), {
key: t.timestamp,
as: "button",
class: "font-code ui-active:*:bg-b-2 text-c-2 contents text-sm font-medium *:flex *:h-8 *:cursor-pointer *:items-center *:rounded-none *:px-1.5 *:first:rounded-l *:last:rounded-r",
value: v,
onClick: (c) => g(t)
}, {
default: o(() => {
var c;
return [
t.response.method ? (a(), i(E, {
key: 0,
class: "text-[11px]",
method: t.response.method
}, null, 8, ["method"])) : p("", !0),
s("div", L, [
s("div", U, u(t.response.path), 1)
]),
s("div", null, u(e(V)(t.response.duration)), 1),
s("div", {
class: q([e(A)(t.response.status).color])
}, u(t.response.status), 3),
s("div", null, u((c = e(R)[t.response.status]) == null ? void 0 : c.name), 1)
];
}),
_: 2
}, 1032, ["value", "onClick"]))), 128))
]),
_: 2
}, 1032, ["style"]),
l(e(N), { class: "-top-(--scalar-address-bar-height) rounded-lg" })
]),
key: "0"
} : void 0
]), 1032, ["target"])
]),
_: 1
}));
}
});
export {
Q as default
};