fumadocs-docgen/dist/remark-ts2js.js

Useful remark utilities and plugins

import { visit } from "unist-util-visit";
import { generateCodeBlockTabs, parseCodeBlockAttributes } from "fumadocs-core/mdx-plugins/codeblock-utils";
//#region src/remark-ts2js.ts
/**
* A remark plugin to transform TypeScript codeblocks into two tabs of codeblocks with its JS variant.
*
* Add `ts2js` to enable transformation:
* ````md
* ```tsx ts2js
* import { ReactNode } from "react";
*
* export default function Layout({ children }: { children: ReactNode }) {
*     return <div>{children}</div>
* }
* ```
* ````
*/
function remarkTypeScriptToJavaScript({ persist = false, defaultValue = "ts", disableTrigger = false } = {}) {
	return async (tree, file) => {
		const oxc = await import("oxc-transform");
		const tasks = [];
		visit(tree, "code", (node) => {
			const lang = node.lang;
			if (lang !== "ts" && lang !== "tsx") return;
			const meta = parseCodeBlockAttributes(node.meta ?? "", ["ts2js"]);
			if (!disableTrigger && !("ts2js" in meta.attributes)) return;
			tasks.push((async () => {
				const result = await oxc.transform(`${file.path ?? "test"}.${lang}`, node.value, {
					sourcemap: false,
					jsx: "preserve"
				});
				const replacement = generateCodeBlockTabs({
					persist,
					defaultValue,
					triggers: [{
						value: "ts",
						children: [{
							type: "text",
							value: "TypeScript"
						}]
					}, {
						value: "js",
						children: [{
							type: "text",
							value: "JavaScript"
						}]
					}],
					tabs: [{
						value: "ts",
						children: [{
							type: "code",
							lang: node.lang,
							meta: meta.rest,
							value: node.value
						}]
					}, {
						value: "js",
						children: [{
							type: "code",
							lang: lang === "tsx" ? "jsx" : "js",
							meta: typeof meta.attributes.ts2js === "string" ? meta.attributes.ts2js : meta.rest,
							value: result.code
						}]
					}]
				});
				Object.assign(node, replacement);
			})());
			return "skip";
		});
		await Promise.all(tasks);
	};
}
//#endregion
export { remarkTypeScriptToJavaScript };

//# sourceMappingURL=remark-ts2js.js.map