@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
89 lines (88 loc) • 3.56 kB
JavaScript
import { defineComponent, ref, watch, nextTick, onMounted, onBeforeUnmount, createElementBlock, openBlock, Fragment, createBlock, createVNode, unref, normalizeClass, withCtx, createElementVNode, createTextVNode, toDisplayString } from "vue";
import { useModal, ScalarIconButton, ScalarSidebarSearchButton } from "@scalar/components";
import { isMacOS } from "@scalar/helpers/general/is-mac-os";
import { ScalarIconMagnifyingGlass } from "@scalar/icons";
import SearchModal from "./SearchModal.vue.js";
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "SearchButton",
props: {
forceIcon: { type: Boolean },
searchHotKey: { default: "k" },
hideModels: { type: Boolean, default: false },
document: {},
eventBus: {}
},
setup(__props) {
const button = ref();
const modalState = useModal();
const handleHotKey = (e) => {
if ((isMacOS() ? e.metaKey : e.ctrlKey) && e.key === __props.searchHotKey) {
e.preventDefault();
e.stopPropagation();
if (modalState.open) {
modalState.hide();
} else {
modalState.show();
}
}
};
watch(
() => modalState.open,
async (next, prev) => {
if (!next && prev) {
await nextTick();
button.value?.$el.focus();
}
}
);
onMounted(() => window.addEventListener("keydown", handleHotKey));
onBeforeUnmount(() => window.removeEventListener("keydown", handleHotKey));
function handleClick() {
modalState.show();
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
__props.forceIcon ? (openBlock(), createBlock(unref(ScalarIconButton), {
key: 0,
icon: unref(ScalarIconMagnifyingGlass),
label: "Search",
onClick: handleClick
}, null, 8, ["icon"])) : (openBlock(), createBlock(unref(ScalarSidebarSearchButton), {
key: 1,
ref_key: "button",
ref: button,
class: normalizeClass(["w-full", _ctx.$attrs.class]),
onClick: handleClick
}, {
shortcut: withCtx(() => [
unref(isMacOS)() ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
_cache[0] || (_cache[0] = createElementVNode("span", { class: "sr-only" }, "Command", -1)),
_cache[1] || (_cache[1] = createElementVNode("span", { "aria-hidden": "true" }, "⌘", -1))
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
_cache[2] || (_cache[2] = createElementVNode("span", { class: "sr-only" }, "CTRL", -1)),
_cache[3] || (_cache[3] = createElementVNode("span", { "aria-hidden": "true" }, "⌃", -1))
], 64)),
createTextVNode(" " + toDisplayString(__props.searchHotKey), 1)
]),
default: withCtx(() => [
_cache[4] || (_cache[4] = createElementVNode("span", { class: "sr-only" }, "Open Search", -1)),
_cache[5] || (_cache[5] = createElementVNode("span", {
"aria-hidden": "true",
class: "sidebar-search-placeholder"
}, " Search ", -1))
]),
_: 1
}, 8, ["class"])),
createVNode(SearchModal, {
document: __props.document,
eventBus: __props.eventBus,
hideModels: __props.hideModels,
modalState: unref(modalState)
}, null, 8, ["document", "eventBus", "hideModels", "modalState"])
], 64);
};
}
});
export {
_sfc_main as default
};