@scalar/api-client
Version:
the open source API testing client
153 lines (152 loc) • 6.03 kB
JavaScript
import { defineComponent as P, ref as V, computed as r, createElementBlock as $, createBlock as f, unref as t, openBlock as p, Fragment as F, createElementVNode as w, createVNode as m, withCtx as z, withDirectives as G, vShow as K, normalizeProps as j, guardReactiveProps as q } from "vue";
import { useModal as J, ScalarTeleportRoot as Q } from "@scalar/components";
import { isHttpMethod as X } from "@scalar/helpers/http/is-http-method";
import { getThemeStyles as Y } from "@scalar/themes";
import { createWorkspaceEventBus as Z } from "@scalar/workspace-store/events";
import { xScalarEnvironmentSchema as S } from "@scalar/workspace-store/schemas/extensions/document/x-scalar-environments";
import { coerceValue as h } from "@scalar/workspace-store/schemas/typebox-coerce";
import { useRoute as ee, useRouter as oe, RouterView as te } from "vue-router";
import ae from "./components/CreateWorkspaceModal.vue.js";
import re from "./components/SplashScreen.vue.js";
import { useColorMode as se } from "../../hooks/use-color-mode.js";
import { useDocumentWatcher as ne } from "../../hooks/use-document-watcher.js";
import { useGlobalHotKeys as le } from "../../hooks/use-global-hot-keys.js";
import { useSidebarState as ce } from "../../hooks/use-sidebar-state.js";
import { useWorkspaceClientEvents as ue } from "../../hooks/use-workspace-client-events.js";
import { useWorkspaceSelector as ie } from "../../hooks/use-workspace-selector.js";
import pe from "./components/AppSidebar.vue.js";
import me from "./components/DesktopTabs.vue.js";
import de from "./components/WebTopNav.vue.js";
const ve = ["innerHTML"], ke = { class: "flex min-h-0 flex-1" }, fe = { class: "bg-b-1 flex-1" }, we = {}, He = /* @__PURE__ */ P({
...we,
__name: "App",
props: {
layout: {}
},
setup(W) {
typeof window < "u" && (window.dataDumpWorkspace = () => o.value);
const c = Z({
debug: !1
}), u = V(!0), x = ee(), C = oe(), l = (e) => {
const a = x.params[e];
return typeof a == "string" ? a : void 0;
}, d = r(() => l("workspaceSlug")), n = r(() => l("documentSlug")), v = r(() => !n.value || o.value === null ? null : o.value.workspace.documents[n.value] ?? null), b = r(() => {
const e = l("pathEncoded");
return e ? decodeURIComponent(e) : void 0;
}), T = r(() => {
const e = l("method");
return e && X(e) ? e : void 0;
}), y = r(() => l("exampleName")), { store: o, workspaces: E, activeWorkspace: i, setWorkspaceId: D, createWorkspace: I } = ie({
workspaceId: d
});
se({ workspaceStore: o });
const { handleSelectItem: _, sidebarState: O } = ce({
workspaceStore: o,
documentSlug: n,
path: b,
method: T,
exampleName: y
});
ue({
eventBus: c,
document: v,
workspaceStore: o,
navigateTo: _,
isSidebarOpen: u
}), le(c, W.layout), ne({
documentName: n,
store: o,
initialTimeout: 5e3
});
const U = r(() => {
if (o.value === null)
return h(S, {});
const e = o.value.workspace["x-scalar-active-environment"];
if (!e)
return h(S, {});
const a = o.value.workspace["x-scalar-environments"]?.[e] ?? {
variables: []
}, s = v.value?.["x-scalar-environments"]?.[e] ?? {
variables: []
};
return h(S, {
...a,
...s,
variables: [...a.variables, ...s.variables]
});
}), M = r(() => {
if (o.value === null)
return "";
const e = o.value.workspace["x-scalar-theme"];
return e ? `<style>${Y(e)}</style>` : "";
}), B = 288, A = r(
() => o.value?.workspace?.["x-scalar-sidebar-width"] ?? B
), N = r(
() => !!(d.value && !n.value)
), R = (e) => o.value?.update("x-scalar-sidebar-width", e), H = () => C.push({
name: "workspace.environment",
params: { workspaceSlug: d.value }
}), g = (e) => {
e && D(e);
}, L = r(
() => ({
documentSlug: n.value ?? "",
document: v.value,
environment: U.value,
eventBus: c,
exampleName: y.value,
layout: W.layout,
method: T.value,
path: b.value,
workspaceStore: o.value,
activeWorkspace: i.value
})
), k = J();
return (e, a) => t(o) !== null && t(i) !== null ? (p(), $(F, { key: 0 }, [
w("div", { innerHTML: M.value }, null, 8, ve),
m(t(Q), null, {
default: z(() => [
e.layout === "desktop" ? (p(), f(me, { key: 0 })) : (p(), f(de, {
key: 1,
activeWorkspace: t(i),
workspaces: t(E),
"onCreate:workspace": a[0] || (a[0] = (s) => t(k).show()),
"onSelect:workspace": g
}, null, 8, ["activeWorkspace", "workspaces"])),
w("main", ke, [
G(m(pe, {
isSidebarOpen: u.value,
"onUpdate:isSidebarOpen": a[1] || (a[1] = (s) => u.value = s),
activeWorkspace: t(i),
eventBus: t(c),
isWorkspaceOpen: N.value,
layout: e.layout,
sidebarState: t(O),
sidebarWidth: A.value,
store: t(o),
workspaces: t(E),
"onClick:workspace": H,
"onCreate:workspace": a[2] || (a[2] = (s) => t(k).show()),
"onSelect:workspace": g,
onSelectItem: t(_),
"onUpdate:sidebarWidth": R
}, null, 8, ["isSidebarOpen", "activeWorkspace", "eventBus", "isWorkspaceOpen", "layout", "sidebarState", "sidebarWidth", "store", "workspaces", "onSelectItem"]), [
[K, u.value]
]),
m(ae, {
state: t(k),
"onCreate:workspace": a[3] || (a[3] = (s) => t(I)(s))
}, null, 8, ["state"]),
w("div", fe, [
m(t(te), j(q(L.value)), null, 16)
])
])
]),
_: 1
})
], 64)) : (p(), f(re, { key: 1 }));
}
});
export {
He as default
};