@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
67 lines (66 loc) • 2.64 kB
JavaScript
import { defineComponent, useModel, computed, createBlock, openBlock, unref, withCtx, createVNode, createElementVNode, toDisplayString, normalizeClass } from "vue";
import { ScalarCombobox, ScalarListboxCheckbox, ScalarThemeSwatches, ScalarFormInput } from "@scalar/components";
import { ScalarIconCaretDown } from "@scalar/icons";
import { themeIds, presets, themeLabels } from "@scalar/themes";
const _hoisted_1 = { class: "min-w-0 flex-1 truncate text-left" };
const _hoisted_2 = { class: "text-c-1 inline-block min-w-0 flex-1 truncate" };
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "ApiReferenceToolbarConfigTheme",
props: {
"modelValue": {},
"modelModifiers": {}
},
emits: ["update:modelValue"],
setup(__props) {
const model = useModel(__props, "modelValue");
const options = computed(
() => themeIds.filter((id) => id !== "none").map((id) => ({
id,
label: themeLabels[id],
css: presets[id].theme
}))
);
const selected = computed({
get: () => {
const theme = model.value ?? "default";
return options.value.find((o) => o.id === theme) ?? options.value[0];
},
set: (option) => model.value = option.id
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(ScalarCombobox), {
modelValue: selected.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selected.value = $event),
options: options.value,
resize: ""
}, {
default: withCtx(({ open }) => [
createVNode(unref(ScalarFormInput), null, {
default: withCtx(() => [
createElementVNode("div", _hoisted_1, toDisplayString(selected.value.label), 1),
createVNode(unref(ScalarThemeSwatches), {
class: "mr-2",
css: selected.value.css
}, null, 8, ["css"]),
createVNode(unref(ScalarIconCaretDown), {
class: normalizeClass(["size-3.5 transition-transform", { "rotate-180": open }])
}, null, 8, ["class"])
]),
_: 2
}, 1024)
]),
option: withCtx(({ selected: selected2, option }) => [
createVNode(unref(ScalarListboxCheckbox), { selected: selected2 }, null, 8, ["selected"]),
createElementVNode("span", _hoisted_2, toDisplayString(option.label), 1),
createVNode(unref(ScalarThemeSwatches), {
css: option.css
}, null, 8, ["css"])
]),
_: 1
}, 8, ["modelValue", "options"]);
};
}
});
export {
_sfc_main as default
};