fumadocs-core 16.0.5 → 16.0.7

package/dist/{chunk-QMATWJ5F.js → chunk-JD3M54YF.js}

@@ -2,13 +2,48 @@
 import Slugger from "github-slugger";
 import { visit } from "unist-util-visit";
 
-// src/mdx-plugins/remark-utils.ts
+// src/mdx-plugins/mdast-utils.ts
+import { valueToEstree } from "estree-util-value-to-estree";
 function flattenNode(node) {
   if ("children" in node)
     return node.children.map((child) => flattenNode(child)).join("");
   if ("value" in node) return node.value;
   return "";
 }
+function toMdxExport(name, value) {
+  return {
+    type: "mdxjsEsm",
+    value: "",
+    data: {
+      estree: {
+        type: "Program",
+        sourceType: "module",
+        body: [
+          {
+            type: "ExportNamedDeclaration",
+            attributes: [],
+            specifiers: [],
+            source: null,
+            declaration: {
+              type: "VariableDeclaration",
+              kind: "let",
+              declarations: [
+                {
+                  type: "VariableDeclarator",
+                  id: {
+                    type: "Identifier",
+                    name
+                  },
+                  init: valueToEstree(value)
+                }
+              ]
+            }
+          }
+        ]
+      }
+    }
+  };
+}
 
 // src/mdx-plugins/remark-heading.ts
 var slugger = new Slugger();
@@ -53,5 +88,6 @@ function remarkHeading({
 
 export {
   flattenNode,
+  toMdxExport,
   remarkHeading
 };

package/dist/{chunk-H2GMUTQG.js → chunk-N2ZQXKIX.js}

@@ -12,6 +12,7 @@ var Link2 = forwardRef(
     external = href.match(/^\w+:/) || // protocol relative URL
     href.startsWith("//"),
     prefetch,
+    children,
     ...props
   }, ref) => {
     if (external) {
@@ -23,11 +24,11 @@ var Link2 = forwardRef(
           rel: "noreferrer noopener",
           target: "_blank",
           ...props,
-          children: props.children
+          children
         }
       );
     }
-    return /* @__PURE__ */ jsx(Link, { ref, href, prefetch, ...props });
+    return /* @__PURE__ */ jsx(Link, { ref, href, prefetch, ...props, children });
   }
 );
 Link2.displayName = "Link";

package/dist/content/toc.d.ts

@@ -1,8 +1,8 @@
 import { PluggableList } from 'unified';
 import { Compatible } from 'vfile';
 import { TOCItemType } from '../toc.js';
-import 'react';
 import 'react/jsx-runtime';
+import 'react';
 
 /**
  * Get Table of Contents from markdown/mdx document (using remark)

package/dist/content/toc.js

@@ -1,6 +1,6 @@
 import {
   remarkHeading
-} from "../chunk-QMATWJ5F.js";
+} from "../chunk-JD3M54YF.js";
 import "../chunk-U67V476Y.js";
 
 // src/content/toc.ts

package/dist/dynamic-link.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   Link
-} from "./chunk-H2GMUTQG.js";
+} from "./chunk-N2ZQXKIX.js";
 import {
   useParams
 } from "./chunk-BBP7MIO4.js";

package/dist/link.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   Link
-} from "./chunk-H2GMUTQG.js";
+} from "./chunk-N2ZQXKIX.js";
 import "./chunk-BBP7MIO4.js";
 import "./chunk-U67V476Y.js";
 export {

package/dist/mdx-plugins/index.d.ts

@@ -4,7 +4,7 @@ import { RehypeShikiOptions } from '@shikijs/rehype';
 import { Processor, Transformer } from 'unified';
 import { ShikiTransformer } from 'shiki';
 import { Root as Root$1, BlockContent, Text } from 'mdast';
-export { a as StructureOptions, S as StructuredData, r as remarkStructure, s as structure } from '../remark-structure-DkCXCzpD.js';
+export { a as StructureOptions, S as StructuredData, r as remarkStructure, s as structure } from '../remark-structure-BJxaB5zZ.js';
 export { a as RemarkCodeTabOptions, R as RemarkHeadingOptions, b as remarkCodeTab, r as remarkHeading } from '../remark-code-tab-DmyIyi6m.js';
 import { MdxJsxAttribute, MdxJsxFlowElement } from 'mdast-util-mdx-jsx';
 
@@ -51,6 +51,12 @@ type RehypeCodeOptions = RehypeShikiOptions & {
 declare function rehypeCode(this: Processor, _options?: Partial<RehypeCodeOptions>): Transformer<Root, Root>;
 declare function transformerTab(): ShikiTransformer;
 
+type ExternalImageOptions = {
+    /**
+     * timeout for fetching remote images (in milliseconds)
+     */
+    timeout?: number;
+} | boolean;
 interface RemarkImageOptions {
     /**
      * Directory or base URL to resolve absolute image paths
@@ -91,7 +97,7 @@ interface RemarkImageOptions {
      *
      * @defaultValue true
      */
-    external?: boolean;
+    external?: ExternalImageOptions;
 }
 /**
  * Turn images into Next.js Image compatible usage.

package/dist/mdx-plugins/index.js

@@ -4,8 +4,9 @@ import {
 } from "../chunk-XN2LKXFZ.js";
 import {
   flattenNode,
-  remarkHeading
-} from "../chunk-QMATWJ5F.js";
+  remarkHeading,
+  toMdxExport
+} from "../chunk-JD3M54YF.js";
 import "../chunk-U67V476Y.js";
 
 // src/mdx-plugins/index.ts
@@ -426,8 +427,7 @@ function remarkImage({
         }
         return out;
       }
-      if (src.type === "url" && !external) return;
-      const size = await getImageSize(src).catch((e) => {
+      const size = await getImageSize(src, external).catch((e) => {
         throw new Error(
           `[Remark Image] Failed obtain image size for ${node.url} (public directory configured as ${publicDir})`,
           {
@@ -435,6 +435,7 @@ function remarkImage({
           }
         );
       });
+      if (!size) return;
       return {
         type: "mdxJsxFlowElement",
         name: "img",
@@ -550,9 +551,13 @@ function parseSrc(src, publicDir, dir) {
     file: path.join(dir, src)
   };
 }
-async function getImageSize(src) {
+async function getImageSize(src, onExternal) {
   if (src.type === "file") return imageSizeFromFile(src.file);
-  const res = await fetch(src.url);
+  if (onExternal === false) return;
+  const { timeout } = typeof onExternal === "object" ? onExternal : {};
+  const res = await fetch(src.url, {
+    signal: typeof timeout === "number" ? AbortSignal.timeout(timeout) : void 0
+  });
   if (!res.ok) {
     throw new Error(
       `[Remark Image] Failed to fetch ${src.url} (${res.status}): ${await res.text()}`
@@ -577,7 +582,8 @@ function remarkStructure({
   allowedMdxAttributes = (node) => {
     if (!node.name) return false;
     return ["TypeTable", "Callout"].includes(node.name);
-  }
+  },
+  exportAs = false
 } = {}) {
   const slugger = new Slugger();
   if (Array.isArray(allowedMdxAttributes)) {
@@ -588,7 +594,7 @@ function remarkStructure({
     const arr = types;
     types = (node) => arr.includes(node.type);
   }
-  return (node, file) => {
+  return (tree, file) => {
     slugger.reset();
     const data = { contents: [], headings: [] };
     let lastHeading;
@@ -599,9 +605,8 @@ function remarkStructure({
         data.contents.push(...frontmatter._openapi.structuredData.contents);
       }
     }
-    visit2(node, (element) => {
-      if (element.type === "root") return;
-      if (!types(element)) return;
+    visit2(tree, (element) => {
+      if (element.type === "root" || !types(element)) return;
       if (element.type === "heading") {
         element.data ||= {};
         element.data.hProperties ||= {};
@@ -648,6 +653,14 @@ function remarkStructure({
       return "skip";
     });
     file.data.structuredData = data;
+    if (exportAs) {
+      tree.children.unshift(
+        toMdxExport(
+          typeof exportAs === "string" ? exportAs : "structuredData",
+          data
+        )
+      );
+    }
   };
 }
 function structure(content, remarkPlugins = [], options = {}) {

package/dist/{remark-structure-DkCXCzpD.d.ts → remark-structure-BJxaB5zZ.d.ts}

@@ -31,26 +31,31 @@ interface StructureOptions {
      * - a function that determines if attribute should be indexed.
      */
     allowedMdxAttributes?: string[] | ((node: MdxJsxFlowElement, attribute: MdxJsxAttribute | MdxJsxExpressionAttribute) => boolean);
+    /**
+     * export as `structuredData` or specified variable name.
+     */
+    exportAs?: string | boolean;
 }
 declare module 'mdast' {
     interface Data {
         /**
-         * Get content of unserializable element
-         *
-         * Needed for `remarkStructure` to generate search index
+         * [Fumadocs] Get content of unserializable element, `remarkStructure` uses it to generate search index.
          */
         _string?: string[];
     }
 }
 declare module 'vfile' {
     interface DataMap {
+        /**
+         * [Fumadocs] injected by `remarkStructure`
+         */
         structuredData: StructuredData;
     }
 }
 /**
  * Attach structured data to VFile, you can access via `vfile.data.structuredData`.
  */
-declare function remarkStructure({ types, allowedMdxAttributes, }?: StructureOptions): Transformer<Root, Root>;
+declare function remarkStructure({ types, allowedMdxAttributes, exportAs, }?: StructureOptions): Transformer<Root, Root>;
 /**
  * Extract data from markdown/mdx content
  */

package/dist/search/algolia.d.ts

@@ -1,5 +1,5 @@
 import { Algoliasearch } from 'algoliasearch';
-import { S as StructuredData } from '../remark-structure-DkCXCzpD.js';
+import { S as StructuredData } from '../remark-structure-BJxaB5zZ.js';
 import 'mdast';
 import 'unified';
 import 'mdast-util-mdx-jsx';

package/dist/search/client.d.ts

@@ -1,5 +1,5 @@
 import { AnyOrama } from '@orama/orama';
-import '../remark-structure-DkCXCzpD.js';
+import '../remark-structure-BJxaB5zZ.js';
 import { BaseIndex } from './algolia.js';
 import { LiteClient, SearchResponse } from 'algoliasearch/lite';
 import { OramaCloud, OramaCloudSearchParams } from '@orama/core';

package/dist/search/orama-cloud.d.ts

@@ -1,4 +1,4 @@
-import { S as StructuredData } from '../remark-structure-DkCXCzpD.js';
+import { S as StructuredData } from '../remark-structure-BJxaB5zZ.js';
 import '../remark-code-tab-DmyIyi6m.js';
 import { OramaCloud } from '@orama/core';
 import 'mdast';

package/dist/search/server.d.ts

@@ -1,5 +1,5 @@
 import { TypedDocument, Orama, Language, RawData, create, SearchParams } from '@orama/orama';
-import { S as StructuredData } from '../remark-structure-DkCXCzpD.js';
+import { S as StructuredData } from '../remark-structure-BJxaB5zZ.js';
 import { SortedResult } from './index.js';
 export { HighlightedText, ReactSortedResult, createContentHighlighter } from './index.js';
 import { I18nConfig } from '../i18n/index.js';

package/dist/toc.d.ts

@@ -1,6 +1,5 @@
-import * as react from 'react';
-import { ReactNode, RefObject, AnchorHTMLAttributes } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode, RefObject, ComponentProps } from 'react';
 
 interface TOCItemType {
     title: ReactNode;
@@ -35,10 +34,10 @@ interface ScrollProviderProps {
 }
 declare function ScrollProvider({ containerRef, children, }: ScrollProviderProps): react_jsx_runtime.JSX.Element;
 declare function AnchorProvider({ toc, single, children, }: AnchorProviderProps): react_jsx_runtime.JSX.Element;
-interface TOCItemProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
+interface TOCItemProps extends Omit<ComponentProps<'a'>, 'href'> {
     href: string;
     onActiveChange?: (v: boolean) => void;
 }
-declare const TOCItem: react.ForwardRefExoticComponent<TOCItemProps & react.RefAttributes<HTMLAnchorElement>>;
+declare function TOCItem({ ref, onActiveChange, ...props }: TOCItemProps): react_jsx_runtime.JSX.Element;
 
 export { AnchorProvider, type AnchorProviderProps, ScrollProvider, type ScrollProviderProps, TOCItem, type TOCItemProps, type TOCItemType, type TableOfContents, useActiveAnchor, useActiveAnchors };

package/dist/toc.js

@@ -1,11 +1,17 @@
 "use client";
-import {
-  useOnChange
-} from "./chunk-EMWGTXSW.js";
 import "./chunk-U67V476Y.js";
 
 // src/toc.tsx
-import { createContext, forwardRef, useContext, useMemo, useRef } from "react";
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useEffectEvent,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState
+} from "react";
 import scrollIntoView from "scroll-into-view-if-needed";
 
 // src/utils/merge-refs.ts
@@ -14,60 +20,13 @@ function mergeRefs(...refs) {
     refs.forEach((ref) => {
       if (typeof ref === "function") {
         ref(value);
-      } else if (ref !== null) {
+      } else if (ref != null) {
         ref.current = value;
       }
     });
   };
 }
 
-// src/utils/use-anchor-observer.ts
-import { useEffect, useState } from "react";
-function useAnchorObserver(watch, single) {
-  const [activeAnchor, setActiveAnchor] = useState([]);
-  useEffect(() => {
-    let visible = [];
-    const observer = new IntersectionObserver(
-      (entries) => {
-        for (const entry of entries) {
-          if (entry.isIntersecting && !visible.includes(entry.target.id)) {
-            visible = [...visible, entry.target.id];
-          } else if (!entry.isIntersecting && visible.includes(entry.target.id)) {
-            visible = visible.filter((v) => v !== entry.target.id);
-          }
-        }
-        if (visible.length > 0) setActiveAnchor(visible);
-      },
-      {
-        rootMargin: single ? "-80px 0% -70% 0%" : `-20px 0% -40% 0%`,
-        threshold: 1
-      }
-    );
-    function onScroll() {
-      const element = document.scrollingElement;
-      if (!element) return;
-      const top = element.scrollTop;
-      if (top <= 0 && single) setActiveAnchor(watch.slice(0, 1));
-      else if (top + element.clientHeight >= element.scrollHeight - 6) {
-        setActiveAnchor((active) => {
-          return active.length > 0 && !single ? watch.slice(watch.indexOf(active[0])) : watch.slice(-1);
-        });
-      }
-    }
-    for (const heading of watch) {
-      const element = document.getElementById(heading);
-      if (element) observer.observe(element);
-    }
-    onScroll();
-    window.addEventListener("scroll", onScroll);
-    return () => {
-      window.removeEventListener("scroll", onScroll);
-      observer.disconnect();
-    };
-  }, [single, watch]);
-  return single ? activeAnchor.slice(0, 1) : activeAnchor;
-}
-
 // src/toc.tsx
 import { jsx } from "react/jsx-runtime";
 var ActiveAnchorContext = createContext([]);
@@ -75,7 +34,7 @@ var ScrollContext = createContext({
   current: null
 });
 function useActiveAnchor() {
-  return useContext(ActiveAnchorContext).at(-1);
+  return useContext(ActiveAnchorContext)[0];
 }
 function useActiveAnchors() {
   return useContext(ActiveAnchorContext);
@@ -96,31 +55,93 @@ function AnchorProvider({
   }, [toc]);
   return /* @__PURE__ */ jsx(ActiveAnchorContext.Provider, { value: useAnchorObserver(headings, single), children });
 }
-var TOCItem = forwardRef(
-  ({ onActiveChange, ...props }, ref) => {
-    const containerRef = useContext(ScrollContext);
-    const anchors = useActiveAnchors();
-    const anchorRef = useRef(null);
-    const mergedRef = mergeRefs(anchorRef, ref);
-    const isActive = anchors.includes(props.href.slice(1));
-    useOnChange(isActive, (v) => {
-      const element = anchorRef.current;
-      if (!element) return;
-      if (v && containerRef.current) {
-        scrollIntoView(element, {
-          behavior: "smooth",
-          block: "center",
-          inline: "center",
-          scrollMode: "always",
-          boundary: containerRef.current
-        });
+function TOCItem({
+  ref,
+  onActiveChange = () => null,
+  ...props
+}) {
+  const containerRef = useContext(ScrollContext);
+  const anchorRef = useRef(null);
+  const activeOrder = useActiveAnchors().indexOf(props.href.slice(1));
+  const isActive = activeOrder !== -1;
+  const shouldScroll = activeOrder === 0;
+  const onActiveChangeEvent = useEffectEvent(onActiveChange);
+  useLayoutEffect(() => {
+    const anchor = anchorRef.current;
+    const container = containerRef.current;
+    if (container && anchor && shouldScroll)
+      scrollIntoView(anchor, {
+        behavior: "smooth",
+        block: "center",
+        inline: "center",
+        scrollMode: "always",
+        boundary: container
+      });
+  }, [containerRef, shouldScroll]);
+  useEffect(() => {
+    return () => onActiveChangeEvent(isActive);
+  }, [isActive]);
+  return /* @__PURE__ */ jsx("a", { ref: mergeRefs(anchorRef, ref), "data-active": isActive, ...props, children: props.children });
+}
+function useAnchorObserver(watch, single) {
+  const observerRef = useRef(null);
+  const [activeAnchor, setActiveAnchor] = useState(() => []);
+  const stateRef = useRef(null);
+  const onChange = useEffectEvent((entries) => {
+    stateRef.current ??= {
+      visible: /* @__PURE__ */ new Set()
+    };
+    const state = stateRef.current;
+    for (const entry of entries) {
+      if (entry.isIntersecting) {
+        state.visible.add(entry.target.id);
+      } else {
+        state.visible.delete(entry.target.id);
+      }
+    }
+    if (state.visible.size === 0) {
+      const viewTop = entries[0].rootBounds.top;
+      let fallback;
+      let min = -1;
+      for (const id of watch) {
+        const element = document.getElementById(id);
+        if (!element) continue;
+        const d = Math.abs(viewTop - element.getBoundingClientRect().top);
+        if (min === -1 || d < min) {
+          fallback = element;
+          min = d;
+        }
       }
-      onActiveChange?.(v);
+      setActiveAnchor(fallback ? [fallback.id] : []);
+    } else {
+      const items = watch.filter((item) => state.visible.has(item));
+      setActiveAnchor(single ? items.slice(0, 1) : items);
+    }
+  });
+  useEffect(() => {
+    if (observerRef.current) return;
+    observerRef.current = new IntersectionObserver(onChange, {
+      rootMargin: "0px",
+      threshold: 0.98
     });
-    return /* @__PURE__ */ jsx("a", { ref: mergedRef, "data-active": isActive, ...props, children: props.children });
-  }
-);
-TOCItem.displayName = "TOCItem";
+    return () => {
+      observerRef.current?.disconnect();
+      observerRef.current = null;
+    };
+  }, []);
+  useEffect(() => {
+    const observer = observerRef.current;
+    if (!observer) return;
+    const elements = watch.flatMap(
+      (heading) => document.getElementById(heading) ?? []
+    );
+    for (const element of elements) observer.observe(element);
+    return () => {
+      for (const element of elements) observer.unobserve(element);
+    };
+  }, [watch]);
+  return activeAnchor;
+}
 export {
   AnchorProvider,
   ScrollProvider,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-core",
-  "version": "16.0.5",
+  "version": "16.0.7",
   "description": "The library for building a documentation website in any React.js framework",
   "keywords": [
     "Fumadocs",
@@ -105,6 +105,7 @@
     "@orama/orama": "^3.1.16",
     "@shikijs/rehype": "^3.14.0",
     "@shikijs/transformers": "^3.14.0",
+    "estree-util-value-to-estree": "^3.5.0",
     "github-slugger": "^2.0.0",
     "hast-util-to-estree": "^3.1.3",
     "hast-util-to-jsx-runtime": "^2.3.6",
@@ -123,19 +124,19 @@
     "@mdx-js/mdx": "^3.1.1",
     "@mixedbread/sdk": "^0.35.1",
     "@orama/core": "^1.2.13",
-    "@tanstack/react-router": "^1.133.32",
+    "@tanstack/react-router": "^1.133.36",
     "@types/estree-jsx": "^1.0.5",
     "@types/hast": "^3.0.4",
     "@types/mdast": "^4.0.4",
     "@types/negotiator": "^0.6.4",
-    "@types/node": "24.9.1",
+    "@types/node": "24.9.2",
     "@types/react": "^19.2.2",
     "@types/react-dom": "^19.2.2",
     "algoliasearch": "5.41.0",
     "lucide-react": "^0.548.0",
     "mdast-util-mdx-jsx": "^3.2.0",
     "mdast-util-mdxjs-esm": "^2.0.1",
-    "next": "16.0.0",
+    "next": "16.0.1",
     "react-router": "^7.9.4",
     "remark-mdx": "^3.1.1",
     "remove-markdown": "^0.6.2",