fumadocs-openapi 5.4.4 → 5.4.6

package/dist/server/index.js

@@ -1,17 +1,19 @@
-import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import Slugger from 'github-slugger';
 import Parser from '@apidevtools/json-schema-ref-parser';
-import { createElement, Fragment, useMemo } from 'react';
+import { Fragment as Fragment$1 } from 'react';
 import { sample } from 'openapi-sampler';
-import { compile } from 'json-schema-to-typescript';
-import { createProcessor } from '@mdx-js/mdx';
-import { remarkGfm, rehypeCode } from 'fumadocs-core/mdx-plugins';
+import { compile } from '@fumari/json-schema-to-typescript';
+import { remarkGfm, remarkImage, rehypeCode } from 'fumadocs-core/mdx-plugins';
 import defaultMdxComponents from 'fumadocs-ui/mdx';
+import { remark } from 'remark';
+import remarkRehype from 'remark-rehype';
+import { toJsxRuntime } from 'hast-util-to-jsx-runtime';
 import { Heading } from 'fumadocs-ui/components/heading';
 import { Tabs, Tab } from 'fumadocs-ui/components/tabs';
 import { Accordions, Accordion } from 'fumadocs-ui/components/accordion';
 import * as Base from 'fumadocs-ui/components/codeblock';
-import { createHighlighter, bundledThemes, bundledLanguages } from 'shiki';
+import { codeToHast } from 'shiki';
 import { Root, API, APIInfo, APIExample as APIExample$1, Property, ObjectCollapsible, APIPlayground } from '../ui/index.js';
 import { cva } from 'class-variance-authority';
 
@@ -433,29 +435,20 @@ function idToTitle(id) {
     return result.join('');
 }
 
-const processor = createProcessor({
-    remarkPlugins: [
-        remarkGfm
-    ],
-    rehypePlugins: [
-        rehypeCode
-    ],
-    outputFormat: 'function-body',
-    development: process.env.NODE_ENV === 'development'
-});
+const processor = remark().use(remarkGfm).use(remarkImage, {
+    useImport: false
+}).use(remarkRehype).use(rehypeCode);
 async function Markdown({ text }) {
-    const result = await processor.process({
+    const nodes = processor.parse({
         value: text
     });
-    const jsxRuntime = process.env.NODE_ENV === 'development' ? await import('react/jsx-dev-runtime') : await import('react/jsx-runtime');
-    const fullScope = {
-        opts: jsxRuntime
-    };
-    const keys = Object.keys(fullScope);
-    const values = Object.values(fullScope);
-    const hydrateFn = Reflect.construct(Function, keys.concat(String(result.value)));
-    const rendered = hydrateFn.apply(hydrateFn, values);
-    return /*#__PURE__*/ createElement(rendered.default, {
+    const hast = await processor.run(nodes);
+    return toJsxRuntime(hast, {
+        development: false,
+        jsx: jsx,
+        jsxs: jsxs,
+        Fragment,
+        // @ts-expect-error -- safe to use
         components: defaultMdxComponents
     });
 }
@@ -700,7 +693,7 @@ function Operation({ path, method, ctx, hasHead }) {
     if (body) {
         const type = getPreferredType(body.content);
         if (!type) throw new Error(`No supported media type for body content: ${path}`);
-        info.push(/*#__PURE__*/ jsxs(Fragment, {
+        info.push(/*#__PURE__*/ jsxs(Fragment$1, {
             children: [
                 heading(level, 'Request Body', ctx),
                 /*#__PURE__*/ jsxs("div", {
@@ -1001,33 +994,34 @@ const sharedTransformers = [
     }
 ];
 
-const highlighter = await createHighlighter({
-    themes: Object.values(bundledThemes),
-    langs: Object.values(bundledLanguages)
-});
-function CodeBlock({ code, lang, ...props }) {
-    const html = useMemo(()=>{
-        return highlighter.codeToHtml(code, {
-            lang,
-            defaultColor: false,
-            themes: {
-                light: 'github-light',
-                dark: 'github-dark'
-            },
-            transformers: sharedTransformers
-        });
-    }, [
-        code,
-        lang
-    ]);
+async function CodeBlock({ code, lang, ...options }) {
+    const html = await codeToHast(code, {
+        lang,
+        defaultColor: false,
+        themes: {
+            light: 'github-light',
+            dark: 'github-dark'
+        },
+        transformers: sharedTransformers
+    });
+    const codeblock = toJsxRuntime(html, {
+        development: false,
+        // @ts-expect-error -- untyped
+        jsx,
+        // @ts-expect-error -- untyped
+        jsxs,
+        components: {
+            // eslint-disable-next-line react/no-unstable-nested-components -- server component
+            pre: (props)=>/*#__PURE__*/ jsx(Base.Pre, {
+                    ...props,
+                    ...options
+                })
+        },
+        Fragment: Fragment$1
+    });
     return /*#__PURE__*/ jsx(Base.CodeBlock, {
         className: "my-0",
-        children: /*#__PURE__*/ jsx(Base.Pre, {
-            ...props,
-            dangerouslySetInnerHTML: {
-                __html: html
-            }
-        })
+        children: codeblock
     });
 }
 
@@ -1053,7 +1047,10 @@ const defaultRenderer = {
         }),
     Property,
     ObjectCollapsible,
-    Requests: Tabs,
+    Requests: (props)=>/*#__PURE__*/ jsx(Tabs, {
+            groupId: "fumadocs_openapi_requests",
+            ...props
+        }),
     Request: (props)=>/*#__PURE__*/ jsx(Tab, {
             value: props.name,
             children: /*#__PURE__*/ jsx(CodeBlock, {
@@ -1158,7 +1155,7 @@ function getBadgeColor(method) {
     }
     if (method) {
         const color = getBadgeColor(method);
-        node.name = /*#__PURE__*/ jsxs(Fragment$1, {
+        node.name = /*#__PURE__*/ jsxs(Fragment, {
             children: [
                 node.name,
                 ' ',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fumadocs-openapi",
-  "version": "5.4.4",
+  "version": "5.4.6",
   "description": "Generate MDX docs for your OpenAPI spec",
   "keywords": [
     "NextJs",
@@ -45,31 +45,31 @@
   ],
   "dependencies": {
     "@apidevtools/json-schema-ref-parser": "^11.7.0",
-    "@mdx-js/mdx": "^3.0.1",
+    "@fumari/json-schema-to-typescript": "^1.1.0",
     "@radix-ui/react-select": "^2.1.1",
     "@radix-ui/react-slot": "^1.1.0",
-    "@types/mdx": "^2.0.13",
     "class-variance-authority": "^0.7.0",
     "fast-glob": "^3.3.1",
     "github-slugger": "^2.0.0",
+    "hast-util-to-jsx-runtime": "^2.3.0",
     "js-yaml": "^4.1.0",
-    "json-schema-to-typescript": "^15.0.0",
-    "lucide-react": "^0.428.0",
+    "lucide-react": "^0.437.0",
     "openapi-sampler": "^1.5.1",
-    "react-hook-form": "^7.52.2",
-    "remark": "^15.0.0",
-    "shiki": "^1.13.0",
+    "react-hook-form": "^7.53.0",
+    "remark": "^15.0.1",
+    "remark-rehype": "^11.1.0",
+    "shiki": "^1.15.2",
     "swr": "^2.2.5",
-    "fumadocs-core": "13.4.0",
-    "fumadocs-ui": "13.4.0"
+    "fumadocs-core": "13.4.2",
+    "fumadocs-ui": "13.4.2"
   },
   "devDependencies": {
     "@types/js-yaml": "^4.0.9",
-    "@types/node": "22.3.0",
+    "@types/node": "22.5.2",
     "@types/openapi-sampler": "^1.0.3",
-    "@types/react": "^18.3.3",
-    "bunchee": "^5.3.2",
-    "next": "^14.2.5",
+    "@types/react": "^18.3.5",
+    "bunchee": "^5.4.0",
+    "next": "^14.2.7",
     "openapi-types": "^12.1.3",
     "eslint-config-custom": "0.0.0",
     "tsconfig": "0.0.0"