@temelj/mdx 0.8.0 → 0.8.1

package/dist/plugins/syntax-highlight/plugin.js

@@ -1,135 +1,147 @@
 import { toString as hastToString } from "hast-util-to-string";
-import { codeToHast, ShikiError, } from "shiki";
+import {
+  codeToHast,
+  ShikiError
+} from "shiki";
 import { visit } from "unist-util-visit";
-import { transformerNotationHighlight, } from "@shikijs/transformers";
+import {
+  transformerNotationHighlight
+} from "@shikijs/transformers";
 import { numericRangeContains } from "@temelj/iterator";
 import { extractCodeMeta } from "./code-meta";
-/**
- * A plugin that highlights code blocks using Shiki.
- */
-export const syntaxHighlightPlugin = (options = {}) => {
-    return async (tree) => {
-        const promises = [];
-        async function visitor(node, index, parent) {
-            if (!parent || index === null || node.tagName !== "pre") {
-                return;
-            }
-            const codeNode = node.children[0];
-            if (!codeNode ||
-                codeNode.type !== "element" ||
-                codeNode.tagName !== "code" ||
-                !codeNode.properties) {
-                return;
-            }
-            const lang = getNodeLanguage(codeNode);
-            if (typeof lang !== "string") {
-                return;
-            }
-            const meta = extractCodeMeta(codeNode);
-            const sourceCode = hastToString(codeNode).trim();
-            const hastOptions = {
-                tokenizeTimeLimit: 10_000,
-                lang,
-                themes: {
-                    light: "github-light-default",
-                    dark: "github-dark-default",
-                },
-                ...(options.shikiHastOptions ?? {}),
-            };
-            if (hastOptions.transformers === undefined) {
-                hastOptions.transformers = [];
-            }
+const syntaxHighlightPlugin = (options = {}) => {
+  return async (tree) => {
+    const promises = [];
+    async function visitor(node, index, parent) {
+      if (!parent || index === null || node.tagName !== "pre") {
+        return;
+      }
+      const codeNode = node.children[0];
+      if (!codeNode || codeNode.type !== "element" || codeNode.tagName !== "code" || !codeNode.properties) {
+        return;
+      }
+      const lang = getNodeLanguage(codeNode);
+      if (typeof lang !== "string") {
+        return;
+      }
+      const meta = extractCodeMeta(codeNode);
+      const sourceCode = hastToString(codeNode).trim();
+      const hastOptions = {
+        tokenizeTimeLimit: 1e4,
+        lang,
+        themes: {
+          light: "github-light-default",
+          dark: "github-dark-default"
+        },
+        ...options.shikiHastOptions ?? {}
+      };
+      if (hastOptions.transformers === void 0) {
+        hastOptions.transformers = [];
+      }
+      if (options.highlight) {
+        hastOptions.transformers.push(
+          transformerNotationHighlight({
+            ...options.highlight.transformer ?? {},
+            matchAlgorithm: "v3"
+          })
+        );
+      }
+      let lineCount = 0;
+      hastOptions.transformers.push({
+        code(node2) {
+          let lineIndex = 0;
+          for (const line of node2.children.filter(
+            (node3) => node3.type === "element"
+          )) {
+            line.properties["data-line"] = lineIndex + 1;
             if (options.highlight) {
-                hastOptions.transformers.push(transformerNotationHighlight({
-                    ...(options.highlight.transformer ?? {}),
-                    matchAlgorithm: "v3",
-                }));
+              if (meta.highlight && numericRangeContains(meta.highlight.lineRange, lineIndex)) {
+                this.addClassToHast(
+                  line,
+                  options.highlight.transformer?.classActiveLine ?? "highlighted"
+                );
+              }
+            }
+            if (options.lineNumbers && meta.showLineNumbers && (meta.showLineNumbers.lineRange.length === 0 || numericRangeContains(meta.showLineNumbers.lineRange, lineIndex))) {
+              this.addClassToHast(
+                line,
+                options.lineNumbers.className ?? "line-number"
+              );
             }
-            let lineCount = 0;
-            hastOptions.transformers.push({
-                code(node) {
-                    let lineIndex = 0;
-                    for (const line of node.children.filter((node) => node.type === "element")) {
-                        line.properties["data-line"] = lineIndex + 1;
-                        if (options.highlight) {
-                            if (meta.highlight &&
-                                numericRangeContains(meta.highlight.lineRange, lineIndex)) {
-                                this.addClassToHast(line, options.highlight.transformer?.classActiveLine ??
-                                    "highlighted");
-                            }
-                        }
-                        if (options.lineNumbers &&
-                            meta.showLineNumbers &&
-                            (meta.showLineNumbers.lineRange.length === 0 ||
-                                numericRangeContains(meta.showLineNumbers.lineRange, lineIndex))) {
-                            this.addClassToHast(line, options.lineNumbers.className ?? "line-number");
-                        }
-                        if (options.commandLine &&
-                            meta.commandLine &&
-                            (meta.commandLine.commandRange.length === 0 ||
-                                numericRangeContains(meta.commandLine.commandRange, lineIndex))) {
-                            this.addClassToHast(line, options.commandLine.className ?? "line-command");
-                        }
-                        lineIndex++;
-                    }
-                    lineCount = lineIndex;
-                    if (meta.showLineNumbers) {
-                        if (typeof node.properties.style !== "string") {
-                            node.properties.style = "";
-                        }
-                        node.properties.style += `--${options.lineNumbers?.widthVariableName ?? "line-number-width"}:${1 + Math.floor(Math.log10(this.lines.length))}ch;`;
-                    }
-                },
-            });
-            try {
-                const hast = await codeToHast(sourceCode, hastOptions);
-                // Insert highlighted code into parent
-                const hastPre = hast.children[0];
-                const properties = {
-                    ...hastPre.properties,
-                    dataFileName: meta.fileName,
-                };
-                if (options.includeDataAttributes) {
-                    if (options.includeDataAttributes.includes("language")) {
-                        properties.dataLanguage = lang;
-                    }
-                    if (options.includeDataAttributes.includes("source-code")) {
-                        properties.dataSourceCode = sourceCode;
-                    }
-                    if (options.includeDataAttributes.includes("line-count")) {
-                        properties.dataLineCount = lineCount;
-                    }
-                }
-                parent.children.splice(index, 1, {
-                    ...hastPre,
-                    properties,
-                });
+            if (options.commandLine && meta.commandLine && (meta.commandLine.commandRange.length === 0 || numericRangeContains(meta.commandLine.commandRange, lineIndex))) {
+              this.addClassToHast(
+                line,
+                options.commandLine.className ?? "line-command"
+              );
             }
-            catch (error) {
-                if (error instanceof ShikiError) {
-                    if (error.message.includes("Language `math` is not included in this bundle")) {
-                        // Skip if the block is math block.
-                        return;
-                    }
-                }
-                throw error;
+            lineIndex++;
+          }
+          lineCount = lineIndex;
+          if (meta.showLineNumbers) {
+            if (typeof node2.properties.style !== "string") {
+              node2.properties.style = "";
             }
+            node2.properties.style += `--${options.lineNumbers?.widthVariableName ?? "line-number-width"}:${1 + Math.floor(Math.log10(this.lines.length))}ch;`;
+          }
+        }
+      });
+      try {
+        const hast = await codeToHast(sourceCode, hastOptions);
+        const hastPre = hast.children[0];
+        const properties = {
+          ...hastPre.properties,
+          dataFileName: meta.fileName
+        };
+        if (options.includeDataAttributes) {
+          if (options.includeDataAttributes.includes("language")) {
+            properties.dataLanguage = lang;
+          }
+          if (options.includeDataAttributes.includes("source-code")) {
+            properties.dataSourceCode = sourceCode;
+          }
+          if (options.includeDataAttributes.includes("line-count")) {
+            properties.dataLineCount = lineCount;
+          }
         }
-        visit(tree, "element", (node, index, parent) => {
-            promises.push(visitor(node, index, parent));
+        parent.children.splice(index, 1, {
+          ...hastPre,
+          properties
         });
-        await Promise.all(promises);
-        return tree;
-    };
+      } catch (error) {
+        if (error instanceof ShikiError) {
+          if (error.message.includes(
+            "Language `math` is not included in this bundle"
+          )) {
+            return;
+          }
+        }
+        throw error;
+      }
+    }
+    visit(
+      tree,
+      "element",
+      (node, index, parent) => {
+        promises.push(visitor(node, index, parent));
+      }
+    );
+    await Promise.all(promises);
+    return tree;
+  };
 };
 function getNodeLanguage(node) {
-    if (!Array.isArray(node.properties.className)) {
-        return undefined;
-    }
-    const prefix = "language-";
-    const language = node.properties.className.find((name) => typeof name === "string" && name.startsWith(prefix));
-    if (typeof language === "string") {
-        return language.slice(prefix.length);
-    }
-    return language;
+  if (!Array.isArray(node.properties.className)) {
+    return void 0;
+  }
+  const prefix = "language-";
+  const language = node.properties.className.find(
+    (name) => typeof name === "string" && name.startsWith(prefix)
+  );
+  if (typeof language === "string") {
+    return language.slice(prefix.length);
+  }
+  return language;
 }
+export {
+  syntaxHighlightPlugin
+};

package/dist/plugins/tree-processor/plugin.d.ts

@@ -1,6 +1,7 @@
-import type { Plugin } from "unified";
-import type { HastElement, HastNode } from "../../types";
-export type MdxTreeProcessor = (node: HastElement, index: number, parent: HastElement) => void | Promise<void>;
+import { Plugin } from 'unified';
+import { Element, Node } from 'hast';
+
+type MdxTreeProcessor = (node: Element, index: number, parent: Element) => void | Promise<void>;
 /**
  * Options for {@linkcode treeProcessorPlugin}.
  */
@@ -12,7 +13,8 @@ type TreeProcessorPluginOptions = {
  * A plugin that allows to process MDX tree nodes.
  * It can be async or sync.
  */
-export declare const treeProcessorPlugin: Plugin<[
+declare const treeProcessorPlugin: Plugin<[
     TreeProcessorPluginOptions?
-], HastNode, HastNode>;
-export {};
+], Node, Node>;
+
+export { type MdxTreeProcessor, treeProcessorPlugin };

package/dist/plugins/tree-processor/plugin.js

@@ -1,19 +1,22 @@
 import { visit } from "unist-util-visit";
-/**
- * A plugin that allows to process MDX tree nodes.
- * It can be async or sync.
- */
-export const treeProcessorPlugin = ({ process } = { process: () => { } }) => {
-    return async (tree) => {
-        const promises = [];
-        visit(tree, "element", function visitor(node, index, parent) {
-            const p = process(node, index, parent);
-            if (p instanceof Promise ||
-                Object.prototype.toString.call(p) === "[object Promise]") {
-                promises.push(p);
-            }
-        });
-        await Promise.allSettled(promises);
-        return tree;
-    };
+const treeProcessorPlugin = ({ process } = { process: () => {
+} }) => {
+  return async (tree) => {
+    const promises = [];
+    visit(
+      tree,
+      "element",
+      function visitor(node, index, parent) {
+        const p = process(node, index, parent);
+        if (p instanceof Promise || Object.prototype.toString.call(p) === "[object Promise]") {
+          promises.push(p);
+        }
+      }
+    );
+    await Promise.allSettled(promises);
+    return tree;
+  };
+};
+export {
+  treeProcessorPlugin
 };

package/dist/types.d.ts

@@ -1,2 +1 @@
-import type { Element, Node } from "hast";
-export type { Element as HastElement, Node as HastNode };
+export { Element as HastElement, Node as HastNode } from 'hast';

package/dist/types.js

@@ -1 +0,0 @@
-export {};

package/package.json

@@ -2,7 +2,7 @@
   "name": "@temelj/mdx",
   "description": "MDX processing utilities.",
   "license": "MIT",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "type": "module",
   "main": "./dist/mod.js",
   "types": "./dist/mod.d.ts",
@@ -12,6 +12,9 @@
       "import": "./dist/mod.js"
     }
   },
+  "files": [
+    "dist"
+  ],
   "dependencies": {
     "@mdx-js/mdx": "^3.1.1",
     "@shikijs/transformers": "^3.15.0",
@@ -29,16 +32,18 @@
     "vfile": "^6.0.3",
     "vfile-matter": "^5.0.1",
     "zod": "^4.1.12",
-    "@temelj/iterator": "0.8.0"
+    "@temelj/iterator": "0.8.1"
   },
   "devDependencies": {
     "@types/mdast": "^4.0.4",
-    "@types/node": "24.10.0",
+    "@types/node": "24.10.1",
+    "tsup": "^8.5.1",
+    "shx": "^0.4.0",
     "typescript": "^5.9.3",
     "vitest": "^4.0.8"
   },
   "scripts": {
-    "build": "tsc",
+    "build": "tsup",
     "test": "vitest run",
     "typecheck": "tsc --noEmit",
     "clean": "shx rm -rf dist"

package/.turbo/turbo-build.log

@@ -1,4 +0,0 @@
-
-> @temelj/mdx@0.8.0 build /home/runner/work/temelj/temelj/packages/mdx
-> tsc
-

package/compiler.test.ts

@@ -1,117 +0,0 @@
-import { expect, test } from "vitest";
-import { z } from "zod";
-
-import { MdxCompiler } from "./compiler";
-import { headingIdPlugin } from "./plugins/heading-id/plugin";
-import { syntaxHighlightPlugin } from "./plugins/syntax-highlight/plugin";
-import { treeProcessorPlugin } from "./plugins/tree-processor/plugin";
-
-test("mdx - compile", async () => {
-  let headingCount = 0;
-  const compiler = new MdxCompiler()
-    .withRehypePlugin(headingIdPlugin, {
-      prefix: "h-",
-    })
-    .withRehypePlugin(treeProcessorPlugin, {
-      process: (element) => {
-        if (element.tagName.startsWith("h")) {
-          headingCount++;
-        }
-      },
-    })
-    .withRehypePlugin(syntaxHighlightPlugin, {
-      includeDataAttributes: ["language", "source-code", "line-count"],
-      highlight: {
-        transformer: { classActiveLine: "hl" },
-      },
-      lineNumbers: {},
-    });
-
-  const frontmatterSchema = z.object({
-    title: z.string(),
-    x: z.optional(z.number()),
-    b: z.optional(z.boolean()).default(true),
-  });
-
-  const artifact = await compiler.compile(
-    `
----
-title: Test
-x: 42
----
-
-# Hello
-## Title 2
-## Duplicate
-## Duplicate
-
-\`\`\`ts {"highlight":"2", "showLineNumbers":true}
-type Mdx = never; // [!code highlight]
-const x1 = 1;
-\`\`\`
-    `.trim(),
-    {},
-    frontmatterSchema,
-  );
-
-  expect(headingCount).toBe(4);
-  expect(artifact.frontmatter.title).toBe("Test");
-  expect(artifact.frontmatter.x).toBe(42);
-  expect(artifact.frontmatter.b).toBe(true);
-
-  await expect(() =>
-    compiler.compile("", {}, frontmatterSchema),
-  ).rejects.toThrow(z.ZodError);
-
-  const value = artifact.compiled;
-  expect(typeof value === "string").toBe(true);
-  expect(value?.includes('"Hello"')).toBe(true);
-  expect(value?.includes('"h-title-2"')).toBe(true);
-
-  expect(value?.includes('"data-language": "ts"')).toBe(true);
-  expect(value?.includes('"data-line-count": "2"')).toBe(true);
-  expect(value?.includes('"data-source-code": "')).toBe(true);
-
-  expect(
-    value?.includes('"data-line": "1"') && value?.includes('"data-line": "2"'),
-  ).toBe(true);
-  expect(value?.includes('className: "line hl line-number"')).toBe(true);
-});
-
-test("mdx - parse frontmatter", async () => {
-  async function compile<TFrontmatterSchema extends z.ZodSchema>(
-    frontmatter: Record<string, unknown>,
-    schema: TFrontmatterSchema,
-  ): Promise<z.output<TFrontmatterSchema>> {
-    const compiler = new MdxCompiler();
-
-    const artifact = await compiler.compile(
-      `
----
-${JSON.stringify(frontmatter)}
----
-    `.trim(),
-      {},
-      schema,
-    );
-    return artifact.frontmatter;
-  }
-
-  const fm1 = await compile(
-    { x: 42 },
-    z.object({
-      x: z.number(),
-    }),
-  );
-  const _fm1type: { x: number } = fm1;
-  expect(fm1).toStrictEqual({ x: 42 });
-
-  const fm2 = await compile(
-    { s: "abc" },
-    z.object({
-      s: z.string(),
-    }),
-  );
-  const _fm2type: { s: string } = fm2;
-  expect(fm2).toStrictEqual({ s: "abc" });
-});

package/compiler.ts

@@ -1,124 +0,0 @@
-import {
-  compile as compileMdxJs,
-  type CompileOptions as MdxJsCompileOptions,
-} from "@mdx-js/mdx";
-import remarkFrontmatterPlugin from "remark-frontmatter";
-import remarkGfmPlugin from "remark-gfm";
-import { VFile } from "vfile";
-import { matter } from "vfile-matter";
-import type { Pluggable, PluggableList, Plugin } from "unified";
-import type { z } from "zod";
-
-import type { HastNode } from "./types";
-
-export { remarkFrontmatterPlugin, remarkGfmPlugin };
-
-/**
- * Represents the source content for an MDX document.
- */
-export type MdxSource = string | Uint8Array;
-
-/**
- * Options for compiling an MDX document.
- */
-export interface MdxCompileOptions {
-  frontmatterOnly?: boolean | undefined;
-  mdxOptions?: MdxJsCompileOptions;
-}
-
-/**
- * The result of compiling an MDX document.
- * Compiled content is optional, because sometimes we only need the frontmatter.
- */
-export interface MdxArtifact<TFrontmatter = Record<string, unknown>> {
-  compiled?: string | undefined;
-  frontmatter: TFrontmatter;
-}
-
-/**
- * A reusable compiler for compiling MDX.
- */
-export class MdxCompiler {
-  private readonly mdxOptions: MdxJsCompileOptions;
-  private readonly remarkPlugins: PluggableList;
-  private readonly rehypePlugins: PluggableList;
-
-  public constructor(mdxOptions: MdxJsCompileOptions = {}) {
-    this.mdxOptions = mdxOptions;
-    this.remarkPlugins = [remarkFrontmatterPlugin, remarkGfmPlugin];
-    this.rehypePlugins = [];
-  }
-
-  public withRemarkPlugin<TOptions>(
-    plugin: Plugin<[TOptions?], HastNode, HastNode>,
-    options?: TOptions,
-  ): MdxCompiler {
-    if (options === undefined) {
-      this.remarkPlugins.push(plugin as Pluggable);
-    } else {
-      this.remarkPlugins.push([plugin, options] as Pluggable);
-    }
-    return this;
-  }
-
-  public withRehypePlugin<TOptions>(
-    plugin: Plugin<[TOptions?], HastNode, HastNode>,
-    options?: TOptions,
-  ): MdxCompiler {
-    if (options === undefined) {
-      this.rehypePlugins.push(plugin as Pluggable);
-    } else {
-      this.rehypePlugins.push([plugin, options] as Pluggable);
-    }
-    return this;
-  }
-
-  public async compile<TFrontmatterSchema extends z.ZodSchema>(
-    source: MdxSource,
-    { frontmatterOnly = false, mdxOptions }: MdxCompileOptions = {},
-    frontmatterSchema?: TFrontmatterSchema,
-  ): Promise<MdxArtifact<z.output<TFrontmatterSchema>>> {
-    const vfile = new VFile({
-      value: source,
-      // Needed so vfile doesn't need to access fs.
-      cwd: "/",
-      path: "/",
-      message: {},
-      messages: {},
-    });
-    matter(vfile, { strip: true });
-
-    const remarkPlugins = [
-      ...this.remarkPlugins,
-      ...(this.mdxOptions?.remarkPlugins ?? []),
-      ...(mdxOptions?.remarkPlugins ?? []),
-    ];
-    const rehypePlugins = [
-      ...this.rehypePlugins,
-      ...(this.mdxOptions?.rehypePlugins ?? []),
-      ...(mdxOptions?.rehypePlugins ?? []),
-    ];
-
-    let compiled: string | undefined;
-    if (!frontmatterOnly) {
-      const compiledFile = await compileMdxJs(vfile, {
-        outputFormat: "function-body",
-        ...(this.mdxOptions ?? {}),
-        ...(mdxOptions ?? {}),
-        remarkPlugins,
-        rehypePlugins,
-      });
-      compiled = compiledFile.value.toString();
-    }
-
-    const frontmatter =
-      frontmatterSchema === undefined
-        ? (vfile.data.matter ?? {})
-        : frontmatterSchema.parse(vfile.data.matter ?? {});
-
-    return {
-      compiled,
-      frontmatter: frontmatter as z.output<TFrontmatterSchema>,
-    };
-  }
-}

package/mod.ts

@@ -1,3 +0,0 @@
-export * from "./plugins/mod";
-export * from "./types";
-export * from "./compiler";

package/plugins/heading-id/plugin.ts

@@ -1,42 +0,0 @@
-import GithubSlugger from "github-slugger";
-import { toString as hastToString } from "hast-util-to-string";
-import { visit } from "unist-util-visit";
-import type { Plugin } from "unified";
-
-import type { HastElement, HastNode } from "../../types";
-
-/**
- * Options for {@linkcode headingIdPlugin}.
- */
-export interface HeadingIdPluginOptions {
-  /** Prefix for title slugs. */
-  prefix?: string;
-}
-
-/**
- * A rehype plugin that adds IDs to heading tags.
- */
-export const headingIdPlugin: Plugin<
-  [HeadingIdPluginOptions?],
-  HastNode,
-  HastNode
-> = ({ prefix } = {}) => {
-  const slugger = new GithubSlugger();
-  return (tree) => {
-    slugger.reset();
-    visit(
-      tree,
-      "element",
-      function visitor(
-        node: HastElement,
-        index: number,
-        parent: HastElement,
-      ): void {
-        if (!parent || index === null || !node.tagName.startsWith("h")) return;
-        const id = (prefix ?? "") + slugger.slug(hastToString(node));
-        node.properties.id = id;
-      },
-    );
-    return tree;
-  };
-};