@e-burgos/tucu-ui 2.5.0 → 2.7.0

package/docs-kit/components/table-of-contents/use-toc.mjs

@@ -0,0 +1,131 @@
+import { useState as O, useRef as x, useEffect as p, useMemo as z } from "react";
+/* empty css                   */
+import "lucide-react";
+import "react-router-dom";
+import "swiper/react";
+import "swiper/modules";
+import { LAYOUT_OPTIONS as a } from "../../../themes/config/index.mjs";
+import { useBreakpoint as B } from "../../../hooks/use-breakpoint.mjs";
+import { useTheme as H } from "../../../themes/hooks/use-theme.mjs";
+function N({
+  items: r,
+  navigationMode: c,
+  activeSectionId: f,
+  onItemClick: d,
+  onSidebarToggle: w
+}) {
+  const l = B(), { layout: i } = H(), [h, u] = O(!1), [v, S] = O(""), [E, m] = O(/* @__PURE__ */ new Set()), b = x({});
+  p(() => {
+    const n = () => {
+      window.innerWidth >= 1024 ? u(!0) : u(!1);
+    };
+    return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
+  }, []), p(() => {
+    w && w(h);
+  }, [h, w]), p(() => {
+    if (c === "route" && f !== void 0 && (S(f), f)) {
+      const n = r.find((t) => t.id === f);
+      if (n?.category) {
+        const t = n.category;
+        m((s) => {
+          const e = new Set(s);
+          return e.add(t), e;
+        });
+      }
+    }
+  }, [c, f, r]), p(() => {
+    if (c === "route") return;
+    const n = {
+      root: null,
+      rootMargin: "-20% 0px -70% 0px",
+      threshold: 0
+    }, t = (e) => {
+      e.forEach((o) => {
+        o.isIntersecting && S(o.target.id);
+      });
+    }, s = new IntersectionObserver(
+      t,
+      n
+    );
+    return r.forEach((e) => {
+      const o = document.getElementById(e.id);
+      o && s.observe(o);
+    }), () => {
+      s.disconnect();
+    };
+  }, [r, c]);
+  const g = z(() => {
+    if (!r.some((s) => s.category))
+      return null;
+    const t = {};
+    return r.forEach((s) => {
+      const e = s.category || "Uncategorized";
+      t[e] || (t[e] = []), t[e].push(s);
+    }), t;
+  }, [r]), C = (n, t) => {
+    if (E.has(n))
+      m((e) => {
+        const o = new Set(e);
+        return o.delete(n), o;
+      });
+    else if (m((e) => {
+      const o = new Set(e);
+      return o.add(n), o;
+    }), t.length > 0) {
+      const e = t[0];
+      c === "route" ? d && d(e) : (window.dispatchEvent(
+        new CustomEvent("forceLoadSection", {
+          detail: { sectionId: e.id }
+        })
+      ), setTimeout(() => {
+        const o = document.getElementById(e.id);
+        o && (window.history.replaceState(null, "", `#${e.id}`), o.scrollIntoView({
+          behavior: "smooth",
+          block: "start"
+        }));
+      }, 100));
+    }
+  }, I = (n, t) => {
+    if (n.preventDefault(), window.innerWidth < 1024 && u(!1), c === "route") {
+      d && d(t);
+      return;
+    }
+    window.dispatchEvent(
+      new CustomEvent("forceLoadSection", { detail: { sectionId: t.id } })
+    );
+    const s = () => {
+      const e = document.getElementById(t.id);
+      return e ? (window.history.replaceState(null, "", `#${t.id}`), e.scrollIntoView({
+        behavior: "smooth",
+        block: "start"
+      }), !0) : !1;
+    };
+    if (!s()) {
+      let e = 0;
+      const o = 5, M = setInterval(() => {
+        e++, (s() || e >= o) && clearInterval(M);
+      }, 50);
+    }
+    d && d(t);
+  }, y = l === "sm" || l === "xs" || l === "md" || l === "lg", T = typeof window < "u" && window.innerWidth < 1024, A = i === a.MACOS || i === a.MACOS_TAHOE || i === a.MACOS_TAHOE_DOCK, _ = i === a.MACOS_TAHOE || i === a.MACOS_TAHOE_DOCK, L = i === a.MACOS;
+  return {
+    layout: i,
+    breakPoint: l,
+    isSidebarOpen: h,
+    setIsSidebarOpen: u,
+    activeSection: v,
+    openCategories: E,
+    categoryRefs: b,
+    groupedItems: g,
+    handleCategoryToggle: C,
+    handleItemClick: I,
+    smallScreen: y,
+    isMobile: T,
+    isMacOS: A,
+    isTahoe: _,
+    isSonoma: L
+  };
+}
+export {
+  N as useToc
+};