fumadocs-core 15.3.1 → 15.3.3

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

@@ -112,7 +112,15 @@ interface RehypeTocOptions {
 }
 declare function rehypeToc(this: Processor, { exportToc }?: RehypeTocOptions): Transformer<Root, Root>;
 
-declare function remarkCodeTab(): Transformer<Root$1, Root$1>;
+interface RemarkCodeTabOptions {
+    /**
+     * Parse MDX in tab values
+     *
+     * @defaultValue false
+     */
+    parseMdx?: boolean;
+}
+declare function remarkCodeTab(this: Processor, options?: RemarkCodeTabOptions): Transformer<Root$1, Root$1>;
 
 interface RemarkStepsOptions {
     /**
@@ -133,4 +141,4 @@ interface RemarkStepsOptions {
  */
 declare function remarkSteps({ steps, step, }?: RemarkStepsOptions): Transformer<Root$1, Root$1>;
 
-export { type CodeBlockIcon, type RehypeCodeOptions, type RehypeTocOptions, type RemarkAdmonitionOptions, type RemarkImageOptions, type RemarkStepsOptions, rehypeCode, rehypeCodeDefaultOptions, rehypeToc, remarkAdmonition, remarkCodeTab, remarkImage, remarkSteps, transformerIcon, transformerTab };
+export { type CodeBlockIcon, type RehypeCodeOptions, type RehypeTocOptions, type RemarkAdmonitionOptions, type RemarkCodeTabOptions, type RemarkImageOptions, type RemarkStepsOptions, rehypeCode, rehypeCodeDefaultOptions, rehypeToc, remarkAdmonition, remarkCodeTab, remarkImage, remarkSteps, transformerIcon, transformerTab };

package/dist/mdx-plugins/index.js

@@ -21,6 +21,7 @@ import {
 import rehypeShikiFromHighlighter from "@shikijs/rehype/core";
 import {
   transformerNotationDiff,
+  transformerNotationFocus,
   transformerNotationHighlight,
   transformerNotationWordHighlight
 } from "@shikijs/transformers";
@@ -209,6 +210,9 @@ var rehypeCodeDefaultOptions = {
     }),
     transformerNotationDiff({
       matchAlgorithm: "v3"
+    }),
+    transformerNotationFocus({
+      matchAlgorithm: "v3"
     })
   ],
   parseMetaString(meta) {
@@ -297,7 +301,7 @@ function transformerTab() {
 }
 
 // src/mdx-plugins/remark-image.ts
-import * as path from "node:path";
+import * as path from "path";
 import { visit } from "unist-util-visit";
 import { imageSize } from "image-size";
 import { imageSizeFromFile } from "image-size/fromFile";
@@ -757,8 +761,40 @@ function rehypeToc({ exportToc = true } = {}) {
 // src/mdx-plugins/remark-code-tab.ts
 import { visit as visit5 } from "unist-util-visit";
 var TabRegex = /tab="(.+?)"/;
-function toTab(nodes) {
-  const names = nodes.map((node, i) => {
+function remarkCodeTab(options = {}) {
+  return (tree) => {
+    visit5(tree, (node) => {
+      if (!("children" in node)) return;
+      if (node.type === "mdxJsxFlowElement" && node.name === "Tabs") return;
+      let start = -1;
+      let i = 0;
+      while (i < node.children.length) {
+        const child = node.children[i];
+        const isSwitcher = child.type === "code" && child.meta && child.meta.match(TabRegex);
+        if (isSwitcher && start === -1) {
+          start = i;
+        }
+        const isLast = i === node.children.length - 1;
+        if (start !== -1 && (isLast || !isSwitcher)) {
+          const end = isSwitcher ? i + 1 : i;
+          const targets = node.children.slice(start, end);
+          node.children.splice(
+            start,
+            end - start,
+            options.parseMdx ? toTabMdx(this, targets) : toTab(targets)
+          );
+          if (isLast) break;
+          i = start + 1;
+          start = -1;
+        } else {
+          i++;
+        }
+      }
+    });
+  };
+}
+function processTabValue(nodes) {
+  return nodes.map((node, i) => {
     let title = `Tab ${i + 1}`;
     node.meta = node.meta?.replace(TabRegex, (_, value) => {
       title = value;
@@ -766,16 +802,9 @@ function toTab(nodes) {
     });
     return title;
   });
-  const itemsArr = {
-    type: "ExpressionStatement",
-    expression: {
-      type: "ArrayExpression",
-      elements: names.map((name) => ({
-        type: "Literal",
-        value: name
-      }))
-    }
-  };
+}
+function toTab(nodes) {
+  const names = processTabValue(nodes);
   return {
     type: "mdxJsxFlowElement",
     name: "Tabs",
@@ -785,12 +814,24 @@ function toTab(nodes) {
         name: "items",
         value: {
           type: "mdxJsxAttributeValueExpression",
+          value: names.join(", "),
           data: {
             estree: {
               type: "Program",
               sourceType: "module",
               comments: [],
-              body: [itemsArr]
+              body: [
+                {
+                  type: "ExpressionStatement",
+                  expression: {
+                    type: "ArrayExpression",
+                    elements: names.map((name) => ({
+                      type: "Literal",
+                      value: name
+                    }))
+                  }
+                }
+              ]
             }
           }
         }
@@ -812,35 +853,63 @@ function toTab(nodes) {
     })
   };
 }
-function remarkCodeTab() {
-  return (tree) => {
-    visit5(tree, (node) => {
-      if (!("children" in node)) return;
-      if (node.type === "mdxJsxFlowElement" && node.name === "Tabs") return;
-      let start = -1;
-      let i = 0;
-      while (i < node.children.length) {
-        const child = node.children[i];
-        const isSwitcher = child.type === "code" && child.meta && child.meta.match(TabRegex);
-        if (isSwitcher && start === -1) {
-          start = i;
-        }
-        const isLast = i === node.children.length - 1;
-        if (start !== -1 && (isLast || !isSwitcher)) {
-          const end = isSwitcher ? i + 1 : i;
-          const targets = node.children.slice(start, end);
-          node.children.splice(
-            start,
-            end - start,
-            toTab(targets)
-          );
-          if (isLast) break;
-          i = start;
-          start = -1;
-        }
-        i++;
+function toTabMdx(processor, nodes) {
+  const names = processTabValue(nodes);
+  function inline(node) {
+    if (node.type === "root") {
+      node.children = node.children.flatMap((child) => {
+        if (child.type === "paragraph") return child.children;
+        return child;
+      });
+    }
+    return node;
+  }
+  return {
+    type: "mdxJsxFlowElement",
+    name: "Tabs",
+    attributes: [
+      {
+        type: "mdxJsxAttribute",
+        name: "defaultValue",
+        value: names[0]
       }
-    });
+    ],
+    children: [
+      {
+        type: "mdxJsxFlowElement",
+        name: "TabsList",
+        attributes: [],
+        children: names.map((name) => ({
+          type: "mdxJsxFlowElement",
+          name: "TabsTrigger",
+          attributes: [
+            {
+              type: "mdxJsxAttribute",
+              name: "value",
+              value: name
+            }
+          ],
+          children: [
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any -- needed
+            inline(processor.parse(name))
+          ]
+        }))
+      },
+      ...nodes.map(
+        (node, i) => ({
+          type: "mdxJsxFlowElement",
+          name: "TabsContent",
+          attributes: [
+            {
+              type: "mdxJsxAttribute",
+              name: "value",
+              value: names[i]
+            }
+          ],
+          children: [node]
+        })
+      )
+    ]
   };
 }
 

package/dist/toc.js

@@ -46,8 +46,9 @@ function useAnchorObserver(watch, single) {
     function onScroll() {
       const element = document.scrollingElement;
       if (!element) return;
-      if (element.scrollTop === 0 && single) setActiveAnchor(watch.slice(0, 1));
-      else if (element.scrollTop + element.clientHeight >= element.scrollHeight - 6) {
+      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);
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-core",
-  "version": "15.3.1",
+  "version": "15.3.3",
   "description": "The library for building a documentation website in Next.js",
   "keywords": [
     "NextJs",
@@ -79,8 +79,8 @@
   "dependencies": {
     "@formatjs/intl-localematcher": "^0.6.1",
     "@orama/orama": "^3.1.6",
-    "@shikijs/rehype": "^3.4.0",
-    "@shikijs/transformers": "^3.4.0",
+    "@shikijs/rehype": "^3.4.2",
+    "@shikijs/transformers": "^3.4.2",
     "github-slugger": "^2.0.0",
     "hast-util-to-estree": "^3.1.3",
     "hast-util-to-jsx-runtime": "^2.3.6",
@@ -90,26 +90,26 @@
     "remark": "^15.0.0",
     "remark-gfm": "^4.0.1",
     "scroll-into-view-if-needed": "^3.1.0",
-    "shiki": "^3.4.0",
+    "shiki": "^3.4.2",
     "unist-util-visit": "^5.0.0"
   },
   "devDependencies": {
     "@algolia/client-search": "4.24.0",
     "@mdx-js/mdx": "^3.1.0",
     "@oramacloud/client": "^2.1.4",
-    "@tanstack/react-router": "^1.119.0",
+    "@tanstack/react-router": "^1.120.3",
     "@types/estree-jsx": "^1.0.5",
     "@types/hast": "^3.0.4",
     "@types/mdast": "^4.0.3",
     "@types/negotiator": "^0.6.3",
-    "@types/node": "22.15.12",
-    "@types/react": "^19.1.3",
-    "@types/react-dom": "^19.1.3",
+    "@types/node": "22.15.18",
+    "@types/react": "^19.1.4",
+    "@types/react-dom": "^19.1.5",
     "algoliasearch": "4.24.0",
     "mdast-util-mdx-jsx": "^3.2.0",
     "mdast-util-mdxjs-esm": "^2.0.1",
-    "next": "^15.3.1",
-    "react-router": "^7.5.3",
+    "next": "^15.3.2",
+    "react-router": "^7.6.0",
     "remark-mdx": "^3.1.0",
     "remark-rehype": "^11.1.2",
     "typescript": "^5.8.3",