@scalar/api-client
Version:
the open source API testing client
110 lines (109 loc) • 4.54 kB
JavaScript
import { defineComponent as V, mergeModels as S, useSlots as h, ref as B, useModel as M, computed as C, createBlock as u, openBlock as l, unref as r, withCtx as s, createVNode as y, createSlots as E, renderSlot as i, createElementBlock as g, createCommentVNode as m, Fragment as N, normalizeProps as f, guardReactiveProps as p, createElementVNode as w, isRef as R } from "vue";
import { ScalarIconButton as z, ScalarSidebarSearchInput as F } from "@scalar/components";
import { ScalarIconFileDashed as q, ScalarIconMagnifyingGlass as A } from "@scalar/icons";
import { ScalarSidebar as U } from "@scalar/sidebar";
import j from "./SidebarMenu.vue.js";
import { useSearchIndex as G } from "../../features/search/hooks/use-search-index.js";
import H from "../resize/Resize.vue.js";
const J = { class: "bg-sidebar-b-1 z-1 flex flex-col gap-1.5 px-3 pb-1.5" }, K = { class: "flex items-center justify-between" }, L = { key: 1 }, _ = /* @__PURE__ */ V({
__name: "Sidebar",
props: /* @__PURE__ */ S({
sidebarState: {},
layout: {},
activeWorkspace: {},
workspaces: {},
documents: {},
isDroppable: { type: [Boolean, Function] }
}, {
sidebarWidth: {
required: !0,
default: 288
},
sidebarWidthModifiers: {}
}),
emits: /* @__PURE__ */ S(["selectItem", "select:workspace", "create:workspace", "reorder", "navigate:to:settings"], ["update:sidebarWidth"]),
setup(a, { emit: x }) {
const n = x, b = h(), d = B(!1), v = M(a, "sidebarWidth"), k = (o) => o.type === "example" && o.title === "draft", { query: c, results: $ } = G(() => a.documents), I = C(() => $.value ?? a.sidebarState.items.value), W = (o) => {
n("selectItem", o), c.value = "", d.value = !1;
};
return (o, t) => (l(), u(r(H), {
width: v.value,
"onUpdate:width": t[6] || (t[6] = (e) => v.value = e),
class: "flex flex-col"
}, {
default: s(() => [
y(r(U), {
class: "mac:pt-10 flex w-auto flex-1 pt-2",
indent: 20,
isDraggable: a.layout !== "modal",
isDroppable: a.isDroppable,
isExpanded: a.sidebarState.isExpanded,
isSelected: a.sidebarState.isSelected,
items: I.value,
layout: "client",
onReorder: t[5] || (t[5] = (e, D) => n("reorder", e, D)),
onSelectItem: W
}, E({
header: s(() => [
w("div", J, [
w("div", K, [
a.layout !== "modal" ? (l(), u(j, {
key: 0,
activeWorkspace: a.activeWorkspace,
workspaces: a.workspaces,
"onCreate:workspace": t[0] || (t[0] = (e) => n("create:workspace")),
"onNavigate:to:settings": t[1] || (t[1] = (e) => n("navigate:to:settings")),
"onSelect:workspace": t[2] || (t[2] = (e) => n("select:workspace", e))
}, {
sidebarMenuActions: s(() => [
i(o.$slots, "sidebarMenuActions")
]),
_: 3
}, 8, ["activeWorkspace", "workspaces"])) : a.layout === "modal" ? (l(), g("div", L)) : m("", !0),
y(r(z), {
icon: r(A),
label: "Search",
onClick: t[3] || (t[3] = (e) => d.value = !d.value)
}, null, 8, ["icon"])
]),
d.value ? (l(), u(r(F), {
key: 0,
modelValue: r(c),
"onUpdate:modelValue": t[4] || (t[4] = (e) => R(c) ? c.value = e : null),
autofocus: ""
}, null, 8, ["modelValue"])) : m("", !0)
])
]),
decorator: s((e) => [
i(o.$slots, "decorator", f(p(e)))
]),
icon: s((e) => [
b.icon || k(e.item) ? (l(), g(N, { key: 0 }, [
k(e.item) ? (l(), u(r(q), { key: 0 })) : m("", !0),
i(o.$slots, "icon", f(p(e)))
], 64)) : m("", !0)
]),
before: s(() => [
i(o.$slots, "workspaceButton")
]),
footer: s(() => [
i(o.$slots, "footer")
]),
_: 2
}, [
b.empty ? {
name: "empty",
fn: s((e) => [
i(o.$slots, "empty", f(p(e)))
]),
key: "0"
} : void 0
]), 1032, ["isDraggable", "isDroppable", "isExpanded", "isSelected", "items"])
]),
_: 3
}, 8, ["width"]));
}
});
export {
_ as default
};