@scalar/api-client
Version:
the open source API testing client
61 lines (60 loc) • 2.06 kB
JavaScript
import { defineComponent as p, ref as f, useId as v, onBeforeMount as C, watch as S, nextTick as h, onBeforeUnmount as k, createBlock as T, openBlock as _, Transition as w, withCtx as n, withDirectives as x, createElementVNode as a, mergeProps as y, unref as c, createVNode as B, renderSlot as F, vShow as $ } from "vue";
import { addScalarClassesToHeadless as b, ScalarTeleportRoot as g } from "@scalar/components";
import { useFocusTrap as I } from "@vueuse/integrations/useFocusTrap";
const M = { class: "scalar scalar-app z-overlay relative" }, N = { class: "scalar-container" }, P = ["id"], E = /* @__PURE__ */ p({
__name: "ModalClientContainer",
props: {
modalState: {}
},
emits: ["open", "close"],
setup(t, { emit: d }) {
const m = t, o = d, l = f(null), s = v(), { activate: u, deactivate: i } = I(l, {
allowOutsideClick: !0,
fallbackFocus: `#${s}`
});
return C(() => b()), S(
() => m.modalState.open,
async (e) => {
e ? (await h(), u(), o("open")) : (i(), o("close"));
},
{ immediate: !1 }
), k(() => {
i();
}), (e, r) => (_(), T(w, { name: "scalar-client-fade" }, {
default: n(() => [
x(a("div", M, [
a("div", N, [
a("div", y({
id: c(s),
ref_key: "client",
ref: l,
"aria-label": "API Client",
"aria-modal": "true"
}, e.$attrs, {
class: "scalar-app-layout scalar-client",
role: "dialog",
tabindex: "-1"
}), [
B(c(g), null, {
default: n(() => [
F(e.$slots, "default", {}, void 0, !0)
]),
_: 3
})
], 16, P),
a("div", {
class: "scalar-app-exit",
onClick: r[0] || (r[0] = (V) => t.modalState.hide())
})
])
], 512), [
[$, t.modalState.open]
])
]),
_: 3
}));
}
});
export {
E as default
};