"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const index$1 = require("../../../index-C_bsiScj.js");
const vue = require("vue");
const getElement = require("../../../getElement-CodzX3WA.js");
const index = require("../../../index-JJEBhaXq.js");
const useScrollspy = (content, target, options = {}) => {
  const cont = vue.toRef(content);
  const tar = vue.toRef(target);
  const resolvedContent = vue.ref(getElement.getElement(cont.value));
  const resolvedTarget = vue.ref(getElement.getElement(tar.value));
  vue.watch([cont, tar], () => {
    updateList();
  });
  const {
    contentQuery = ":scope > [id]",
    targetQuery = "[href]",
    manual = false,
    root,
    rootMargin = "0px 0px -25%",
    threshold = [0.1, 0.5, 1],
    watchChanges = true
  } = options;
  const current = vue.ref(null);
  const list = vue.ref([]);
  const nodeList = vue.ref([]);
  const ctx = vue.getCurrentInstance();
  if (!ctx) {
    vue.nextTick(() => {
      updateList();
    });
  } else {
    vue.onMounted(() => {
      index.syncRef(cont, resolvedContent, {
        transform: {
          ltr: (v) => getElement.getElement(v)
        },
        direction: "ltr",
        immediate: true
      });
      index.syncRef(tar, resolvedTarget, {
        transform: {
          ltr: (v) => getElement.getElement(v)
        },
        direction: "ltr",
        immediate: true
      });
      updateList();
    });
  }
  const updateList = () => {
    nodeList.value = resolvedContent.value ? Array.from(resolvedContent.value.querySelectorAll(contentQuery)) : [];
    list.value = nodeList.value.map((el) => ({
      id: el.id,
      el,
      visible: false,
      text: el.textContent
    }));
  };
  let isScrollingDown = true;
  let previousScrollTop = 0;
  const scrollRoot = vue.computed(
    () => resolvedContent.value && getComputedStyle(resolvedContent.value).overflowY === "visible" ? null : resolvedContent.value
  );
  const iobs = index$1.useIntersectionObserver(
    nodeList,
    (entries) => {
      const scrollTop = (scrollRoot.value || document?.documentElement)?.scrollTop;
      isScrollingDown = scrollTop > previousScrollTop;
      previousScrollTop = scrollTop;
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          list.value.forEach((node) => {
            if (node.el === entry.target) {
              node.visible = true;
            }
          });
          return;
        }
        list.value.forEach((node) => {
          if (node.el === entry.target) {
            node.visible = false;
          }
        });
      });
      let newId = null;
      if (isScrollingDown) {
        newId = [...list.value].reverse().find((node) => node.visible)?.id || null;
      } else {
        newId = list.value.find((node) => node.visible)?.id || null;
      }
      if (newId !== null) {
        current.value = newId;
      }
      if (!current.value) {
        current.value = list.value[0]?.id || null;
      }
    },
    {
      root: root ? getElement.getElement(root) : scrollRoot,
      rootMargin,
      threshold
    }
  );
  vue.watch(current, (newId) => {
    if (manual) return;
    const nodes = resolvedTarget.value?.querySelectorAll(targetQuery);
    if (nodes === void 0) return;
    let foundParent = false;
    let activeElement = null;
    nodes.forEach((node) => {
      const parentDropdown = node.closest(".dropdown");
      if (node.getAttribute("href")?.includes(`#${newId}`)) {
        activeElement = node;
        node.classList.add("active");
        if (parentDropdown) {
          parentDropdown?.querySelector(".dropdown-toggle")?.classList.add("active");
          foundParent = true;
        }
        let parentNav = node.closest(".nav")?.previousSibling;
        while (parentNav?.classList?.contains("nav-item")) {
          foundParent = true;
          parentNav.querySelector(".nav-link")?.classList.add("active");
          parentNav = parentNav.closest(".nav")?.previousSibling;
        }
      } else {
        node.classList.remove("active");
        if (parentDropdown && !foundParent) {
          parentDropdown?.querySelector(".dropdown-toggle")?.classList.remove("active");
        }
        if (!foundParent) {
          let parentNav = node.closest(".nav")?.previousSibling;
          while (parentNav?.classList?.contains("nav-item")) {
            foundParent = true;
            if (parentNav.querySelector(".nav-link") !== activeElement) {
              parentNav.querySelector(".nav-link")?.classList.remove("active");
            }
            parentNav = parentNav.closest(".nav")?.previousSibling;
          }
        }
      }
    });
  });
  const mobs = !watchChanges ? { stop: () => {
  } } : index$1.useMutationObserver(
    resolvedContent,
    () => {
      updateList();
    },
    {
      childList: true
    }
  );
  const scrollIntoView = (event, smooth = false) => {
    event.preventDefault();
    const href = event.target?.getAttribute?.("href");
    const el = href ? document?.querySelector(href) : null;
    if (el && resolvedContent.value) {
      if (resolvedContent.value.scrollTo) {
        resolvedContent.value.scrollTo({ top: el.offsetTop, behavior: smooth ? "smooth" : "auto" });
      } else {
        resolvedContent.value.scrollTop = el.offsetTop;
      }
    }
  };
  const cleanup = () => {
    iobs.stop();
    mobs.stop();
  };
  return {
    current: vue.readonly(current),
    list,
    content: resolvedContent,
    target: resolvedTarget,
    scrollIntoView,
    updateList,
    cleanup
  };
};
exports.useScrollspy = useScrollspy;
//# sourceMappingURL=index.umd.js.map
