@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
61 lines (60 loc) • 2.78 kB
JavaScript
import { defineComponent, renderSlot, createElementBlock, unref, normalizeProps, mergeProps, openBlock, normalizeClass, createElementVNode, createCommentVNode, createBlock, toDisplayString } from "vue";
import { cva, ScalarIconButton } from "@scalar/components";
import { ScalarIconX, ScalarIconList } from "@scalar/icons";
import { useBreakpoints } from "@scalar/use-hooks/useBreakpoints";
const _hoisted_1 = { class: "flex h-[var(--scalar-header-height)] w-full items-center border-b bg-inherit px-2" };
const _hoisted_2 = {
key: 1,
class: "flex-1 text-sm font-medium whitespace-nowrap"
};
const _hoisted_3 = { class: "flex h-6 items-center gap-1 pl-1" };
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "MobileHeader",
props: {
breadcrumb: {},
isSidebarOpen: { type: Boolean },
showSidebar: { type: Boolean }
},
emits: ["toggleSidebar"],
setup(__props, { emit: __emit }) {
const emit = __emit;
const { mediaQueries } = useBreakpoints();
const variants = cva({
base: "items-center bg-b-1 sticky top-0 z-1000",
variants: {
open: {
true: "max-h-dvh h-dvh custom-scrollbar flex flex-col"
},
lg: {
true: "hidden [grid-area:header]"
}
}
});
return (_ctx, _cache) => {
return unref(mediaQueries).lg.value ? renderSlot(_ctx.$slots, "sidebar", normalizeProps(mergeProps({ key: 0 }, { sidebarClasses: "sticky top-0 h-dvh [grid-area:navigation]" }))) : (openBlock(), createElementBlock("div", {
key: 1,
class: normalizeClass(["t-doc__header", unref(variants)({ open: __props.isSidebarOpen, lg: unref(mediaQueries).lg.value })])
}, [
createElementVNode("header", _hoisted_1, [
__props.showSidebar ? (openBlock(), createBlock(unref(ScalarIconButton), {
key: 0,
icon: __props.isSidebarOpen ? unref(ScalarIconX) : unref(ScalarIconList),
label: __props.isSidebarOpen ? "Close Menu" : "Open Menu",
size: "md",
onClick: _cache[0] || (_cache[0] = ($event) => emit("toggleSidebar"))
}, null, 8, ["icon", "label"])) : createCommentVNode("", true),
__props.showSidebar ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.breadcrumb), 1)) : renderSlot(_ctx.$slots, "search", { key: 2 }),
createElementVNode("div", _hoisted_3, [
renderSlot(_ctx.$slots, "actions")
])
]),
__props.isSidebarOpen ? renderSlot(_ctx.$slots, "sidebar", normalizeProps(mergeProps({ key: 0 }, {
sidebarClasses: "overflow-y-auto custom-scrollbar min-h-0 flex-1 w-full border-none"
}))) : createCommentVNode("", true)
], 2));
};
}
});
export {
_sfc_main as default
};