import { defineComponent as N, ref as T, watch as L, onMounted as F, onUnmounted as G, createElementBlock as a, openBlock as n, renderSlot as C, createElementVNode as A, createVNode as V, withCtx as p, Fragment as u, renderList as m, unref as o, createBlock as c, toDisplayString as M, createCommentVNode as $ } from "vue";
import { sleep as w } from "@scalar/helpers/testing/sleep";
import { useNavState as D } from "../../../hooks/useNavState.js";
import { useSidebar as H } from "../hooks/useSidebar.js";
import h from "./SidebarElement.vue.js";
import y from "./SidebarGroup.vue.js";
const R = { class: "sidebar" }, U = ["aria-label"], j = { class: "sidebar-group-title" }, q = -160, X = /* @__PURE__ */ N({
  __name: "Sidebar",
  props: {
    title: {}
  },
  setup(x) {
    const { hash: d, isIntersectionEnabled: I } = D(), { items: O, toggleCollapsedSidebarItem: _, collapsedSidebarItems: g } = H(), f = T(null), l = T(!0);
    L(d, (e) => {
      !I.value || l.value || typeof window > "u" || E(e);
    });
    const E = (e) => {
      var t, s, S, k;
      const r = document.getElementById(`sidebar-${e}`);
      if (!r || !f.value)
        return;
      let i = q;
      r.getAttribute("data-sidebar-type") === "heading" ? i += r.offsetTop + ((t = r.getElementsByClassName("sidebar-heading")) == null ? void 0 : t[0]).offsetHeight : i += r.offsetTop + (((s = r.parentElement) == null ? void 0 : s.offsetTop) ?? 0) + (((k = (S = r.parentElement) == null ? void 0 : S.parentElement) == null ? void 0 : k.offsetTop) ?? 0), f.value.scrollTo({ top: i, behavior: "smooth" });
    }, B = (e) => {
      if (!f.value)
        return;
      const r = new MutationObserver((i, t) => {
        document.getElementById(`sidebar-${e}`) && (E(e), l.value = !1, t.disconnect());
      });
      return r.observe(f.value, {
        childList: !0,
        subtree: !0
      }), r;
    }, v = (e) => d.value === e ? !0 : d.value.includes("/description/") ? d.value.split("/description/")[0] === e : !1;
    F(() => {
      const e = B(d.value);
      d.value || setTimeout(() => l.value = !1, 300), G(() => {
        e == null || e.disconnect();
      });
    });
    const b = (e) => {
      var r;
      return "children" in e && (((r = e.children) == null ? void 0 : r.length) ?? 0) > 0;
    };
    return (e, r) => (n(), a("div", R, [
      C(e.$slots, "sidebar-start", {}, void 0, !0),
      A("nav", {
        ref_key: "scrollerEl",
        ref: f,
        "aria-label": `Table of contents for ${e.title}`,
        class: "sidebar-pages custom-scroll custom-scroll-self-contain-overflow"
      }, [
        V(y, { level: 0 }, {
          default: p(() => [
            (n(!0), a(u, null, m(o(O).entries, (i) => (n(), a(u, {
              key: i.id
            }, [
              "isGroup" in i && i.isGroup ? (n(), a(u, { key: 0 }, [
                A("li", j, M(i.title), 1),
                (n(!0), a(u, null, m(i.children, (t) => (n(), c(h, {
                  key: t.id,
                  id: `sidebar-${t.id}`,
                  "data-sidebar-type": "heading",
                  hasChildren: b(t),
                  isActive: v(t.id),
                  item: t,
                  open: o(g)[t.id] ?? !1,
                  onToggleOpen: async () => {
                    l.value = !0, o(_)(t.id), await o(w)(100), l.value = !1;
                  }
                }, {
                  default: p(() => [
                    b(t) ? (n(), c(y, {
                      key: 0,
                      level: 1
                    }, {
                      default: p(() => [
                        (n(!0), a(u, null, m(t.children, (s) => (n(), c(h, {
                          key: s.id,
                          id: `sidebar-${s.id}`,
                          isActive: v(s.id),
                          item: s
                        }, null, 8, ["id", "isActive", "item"]))), 128))
                      ]),
                      _: 2
                    }, 1024)) : $("", !0)
                  ]),
                  _: 2
                }, 1032, ["id", "hasChildren", "isActive", "item", "open", "onToggleOpen"]))), 128))
              ], 64)) : (n(), c(h, {
                key: 1,
                id: `sidebar-${i.id}`,
                "data-sidebar-type": "heading",
                hasChildren: b(i),
                isActive: v(i.id),
                item: i,
                open: o(g)[i.id] ?? !1,
                onToggleOpen: async () => {
                  l.value = !0, o(_)(i.id), await o(w)(100), l.value = !1;
                }
              }, {
                default: p(() => [
                  b(i) ? (n(), c(y, {
                    key: 0,
                    level: 1
                  }, {
                    default: p(() => [
                      (n(!0), a(u, null, m(i.children, (t) => (n(), c(h, {
                        key: t.id,
                        id: `sidebar-${t.id}`,
                        isActive: v(t.id),
                        item: t
                      }, null, 8, ["id", "isActive", "item"]))), 128))
                    ]),
                    _: 2
                  }, 1024)) : $("", !0)
                ]),
                _: 2
              }, 1032, ["id", "hasChildren", "isActive", "item", "open", "onToggleOpen"]))
            ], 64))), 128))
          ]),
          _: 1
        })
      ], 8, U),
      C(e.$slots, "sidebar-end", {}, void 0, !0)
    ]));
  }
});
export {
  X as default
};
