@scalar/api-reference
Version:
Generate beautiful API references from OpenAPI documents
62 lines (61 loc) • 2.06 kB
JavaScript
import { defineComponent as u, ref as m, watch as p, nextTick as f, createElementBlock as v, openBlock as i, createElementVNode as b, createBlock as h, createCommentVNode as g, normalizeClass as n, createVNode as r, unref as o, withCtx as s, renderSlot as d } from "vue";
import { scrollToId as C } from "@scalar/helpers/dom/scroll-to-id";
import { ScalarIconCaretRight as k } from "@scalar/icons";
import { useNavState as S } from "../../hooks/useNavState.js";
import w from "../Anchor/Anchor.vue.js";
import y from "./Section.vue.js";
const B = { class: "collapsible-section" }, N = ["id", "aria-controls", "aria-expanded"], R = /* @__PURE__ */ u({
__name: "CompactSection",
props: {
id: {},
label: {},
defaultOpen: { type: Boolean, default: !1 }
},
setup(a) {
const { hash: c } = S(), t = m(a.defaultOpen);
return p(
c,
async (e) => {
a.id === e && !t.value && (t.value = !0, await f(), C(a.id));
},
{ immediate: !0 }
), (e, l) => (i(), v("div", B, [
b("button", {
id: e.id,
"aria-controls": e.id,
"aria-expanded": t.value,
class: n(["collapsible-section-trigger", { "collapsible-section-trigger-open": t.value }]),
type: "button",
onClick: l[0] || (l[0] = ($) => t.value = !t.value)
}, [
r(o(k), {
class: n(["size-3 transition-transform duration-100", { "rotate-90": t.value }]),
weight: "bold"
}, null, 8, ["class"]),
r(o(w), {
id: e.id,
class: "collapsible-section-header"
}, {
default: s(() => [
d(e.$slots, "heading", {}, void 0, !0)
]),
_: 3
}, 8, ["id"])
], 10, N),
t.value ? (i(), h(o(y), {
key: 0,
id: e.id,
class: "collapsible-section-content",
label: e.label
}, {
default: s(() => [
d(e.$slots, "default", {}, void 0, !0)
]),
_: 3
}, 8, ["id", "label"])) : g("", !0)
]));
}
});
export {
R as default
};