@temelj/mdx 0.7.0 → 0.8.0

package/.turbo/turbo-build.log

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

package/README.md

@@ -38,7 +38,7 @@ $ deno add jsr:@temelj/mdx # or jsr add @temelj/mdx
 ## Compile
 
 ```ts
-import { assert, assertEquals } from "@std/assert";
+import { expect, test } from "vitest";
 import {
   type HastElement,
   headingIdPlugin,

package/compiler.test.ts

@@ -0,0 +1,117 @@
+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

@@ -0,0 +1,124 @@
+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/{types → dist}/compiler.d.ts

@@ -3,7 +3,7 @@ import remarkFrontmatterPlugin from "remark-frontmatter";
 import remarkGfmPlugin from "remark-gfm";
 import type { Plugin } from "unified";
 import type { z } from "zod";
-import type { HastNode } from "./types.js";
+import type { HastNode } from "./types";
 export { remarkFrontmatterPlugin, remarkGfmPlugin };
 /**
  * Represents the source content for an MDX document.
@@ -36,4 +36,3 @@ export declare class MdxCompiler {
     withRehypePlugin<TOptions>(plugin: Plugin<[TOptions?], HastNode, HastNode>, options?: TOptions): MdxCompiler;
     compile<TFrontmatterSchema extends z.ZodSchema>(source: MdxSource, { frontmatterOnly, mdxOptions }?: MdxCompileOptions, frontmatterSchema?: TFrontmatterSchema): Promise<MdxArtifact<z.output<TFrontmatterSchema>>>;
 }
-//# sourceMappingURL=compiler.d.ts.map

package/{esm → dist}/compiler.js

@@ -8,25 +8,10 @@ export { remarkFrontmatterPlugin, remarkGfmPlugin };
  * A reusable compiler for compiling MDX.
  */
 export class MdxCompiler {
+    mdxOptions;
+    remarkPlugins;
+    rehypePlugins;
     constructor(mdxOptions = {}) {
-        Object.defineProperty(this, "mdxOptions", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "remarkPlugins", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "rehypePlugins", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
         this.mdxOptions = mdxOptions;
         this.remarkPlugins = [remarkFrontmatterPlugin, remarkGfmPlugin];
         this.rehypePlugins = [];

package/dist/mod.d.ts

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

package/dist/mod.js

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

package/{types → dist}/plugins/heading-id/plugin.d.ts

@@ -1,5 +1,5 @@
 import type { Plugin } from "unified";
-import type { HastNode } from "../../types.js";
+import type { HastNode } from "../../types";
 /**
  * Options for {@linkcode headingIdPlugin}.
  */
@@ -13,4 +13,3 @@ export interface HeadingIdPluginOptions {
 export declare const headingIdPlugin: Plugin<[
     HeadingIdPluginOptions?
 ], HastNode, HastNode>;
-//# sourceMappingURL=plugin.d.ts.map

package/dist/plugins/mod.d.ts

@@ -0,0 +1,4 @@
+export * from "./heading-id/plugin";
+export * from "./syntax-highlight/plugin";
+export * from "./tree-processor/plugin";
+export * from "./remove-imports-exports";

package/dist/plugins/mod.js

@@ -0,0 +1,4 @@
+export * from "./heading-id/plugin";
+export * from "./syntax-highlight/plugin";
+export * from "./tree-processor/plugin";
+export * from "./remove-imports-exports";

package/{types → dist}/plugins/remove-imports-exports.d.ts

@@ -1,9 +1,8 @@
 import type { Plugin } from "unified";
-import type { HastNode } from "../types.js";
+import type { HastNode } from "../types";
 /**
  * A remark plugin which removes all import and export statements.
  */
 export declare const removeImportsExportsPlugin: Plugin<[
     unknown
 ], HastNode, HastNode>;
-//# sourceMappingURL=remove-imports-exports.d.ts.map

package/{types → dist}/plugins/syntax-highlight/code-meta.d.ts

@@ -1,5 +1,5 @@
 import { type NumericRange } from "@temelj/iterator";
-import type { HastElement } from "../../types.js";
+import type { HastElement } from "../../types";
 export interface MdxCodeMeta {
     highlight?: MdxCodeMetaHighlightLine;
     showLineNumbers?: MdxCodeMetaLineNumbers;
@@ -16,4 +16,3 @@ export type MdxCodeMetaCommandLine = {
     commandRange: NumericRange;
 };
 export declare function extractCodeMeta(node: HastElement): MdxCodeMeta;
-//# sourceMappingURL=code-meta.d.ts.map

package/{types → dist}/plugins/syntax-highlight/plugin.d.ts

@@ -1,7 +1,7 @@
 import { type BundledLanguage, type BundledTheme, type CodeToHastOptions } from "shiki";
 import { type TransformerNotationHighlightOptions } from "@shikijs/transformers";
 import type { Plugin } from "unified";
-import type { HastNode } from "../../types.js";
+import type { HastNode } from "../../types";
 type ShikiHastOptions = Partial<CodeToHastOptions<BundledLanguage, BundledTheme>>;
 type SyntaxDataAttribute = "source-code" | "language" | "line-count";
 /**
@@ -54,4 +54,3 @@ export declare const syntaxHighlightPlugin: Plugin<[
     SyntaxHighlightPluginOptions?
 ], HastNode, HastNode>;
 export {};
-//# sourceMappingURL=plugin.d.ts.map

package/{esm → dist}/plugins/syntax-highlight/plugin.js

@@ -3,7 +3,7 @@ import { codeToHast, ShikiError, } from "shiki";
 import { visit } from "unist-util-visit";
 import { transformerNotationHighlight, } from "@shikijs/transformers";
 import { numericRangeContains } from "@temelj/iterator";
-import { extractCodeMeta } from "./code-meta.js";
+import { extractCodeMeta } from "./code-meta";
 /**
  * A plugin that highlights code blocks using Shiki.
  */

package/{types → dist}/plugins/tree-processor/plugin.d.ts

@@ -1,5 +1,5 @@
 import type { Plugin } from "unified";
-import type { HastElement, HastNode } from "../../types.js";
+import type { HastElement, HastNode } from "../../types";
 export type MdxTreeProcessor = (node: HastElement, index: number, parent: HastElement) => void | Promise<void>;
 /**
  * Options for {@linkcode treeProcessorPlugin}.
@@ -16,4 +16,3 @@ export declare const treeProcessorPlugin: Plugin<[
     TreeProcessorPluginOptions?
 ], HastNode, HastNode>;
 export {};
-//# sourceMappingURL=plugin.d.ts.map

package/{types → dist}/types.d.ts

@@ -1,3 +1,2 @@
 import type { Element, Node } from "hast";
 export type { Element as HastElement, Node as HastNode };
-//# sourceMappingURL=types.d.ts.map

package/mod.ts

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

package/package.json

@@ -1,48 +1,46 @@
 {
   "name": "@temelj/mdx",
-  "version": "0.7.0",
-  "description": "Utilities for working with MDX.",
-  "keywords": [
-    "mdx"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/tinrab/temelj.git"
-  },
+  "description": "MDX processing utilities.",
   "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/tinrab/temelj/issues"
-  },
-  "module": "./esm/mod.js",
-  "types": "./types/mod.d.ts",
+  "version": "0.8.0",
+  "type": "module",
+  "main": "./dist/mod.js",
+  "types": "./dist/mod.d.ts",
   "exports": {
     ".": {
-      "import": {
-        "types": "./types/mod.d.ts",
-        "default": "./esm/mod.js"
-      }
+      "types": "./dist/mod.d.ts",
+      "import": "./dist/mod.js"
     }
   },
   "dependencies": {
-    "@temelj/iterator": "^0.7.0",
-    "@mdx-js/mdx": "^3.1.0",
-    "@shikijs/transformers": "^3.8.0",
+    "@mdx-js/mdx": "^3.1.1",
+    "@shikijs/transformers": "^3.15.0",
     "@types/hast": "^3.0.4",
     "github-slugger": "^2.0.0",
     "hast": "^1.0.0",
     "hast-util-to-string": "^3.0.1",
     "remark-frontmatter": "^5.0.0",
     "remark-gfm": "^4.0.1",
-    "shiki": "^3.8.0",
+    "remark-parse": "^11.0.0",
+    "shiki": "^3.15.0",
     "unified": "^11.0.5",
     "unist-util-remove": "^4.0.0",
     "unist-util-visit": "^5.0.0",
     "vfile": "^6.0.3",
     "vfile-matter": "^5.0.1",
-    "zod": "^4.0.5"
+    "zod": "^4.1.12",
+    "@temelj/iterator": "0.8.0"
   },
   "devDependencies": {
-    "@types/node": "^20.9.0"
+    "@types/mdast": "^4.0.4",
+    "@types/node": "24.10.0",
+    "typescript": "^5.9.3",
+    "vitest": "^4.0.8"
   },
-  "_generatedBy": "dnt@dev"
+  "scripts": {
+    "build": "tsc",
+    "test": "vitest run",
+    "typecheck": "tsc --noEmit",
+    "clean": "shx rm -rf dist"
+  }
 }

package/plugins/heading-id/plugin.ts

@@ -0,0 +1,42 @@
+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;
+  };
+};

package/plugins/mod.ts

@@ -0,0 +1,4 @@
+export * from "./heading-id/plugin";
+export * from "./syntax-highlight/plugin";
+export * from "./tree-processor/plugin";
+export * from "./remove-imports-exports";

package/plugins/remove-imports-exports.ts

@@ -0,0 +1,18 @@
+import { remove } from "unist-util-remove";
+import type { Plugin } from "unified";
+
+import type { HastNode } from "../types";
+
+/**
+ * A remark plugin which removes all import and export statements.
+ */
+export const removeImportsExportsPlugin: Plugin<
+  [unknown],
+  HastNode,
+  HastNode
+> = () => {
+  return (tree: HastNode) => {
+    remove(tree, "mdxjsEsm");
+    return tree;
+  };
+};

package/plugins/syntax-highlight/code-meta.test.ts

@@ -0,0 +1,22 @@
+import { expect, test } from "vitest";
+
+import { extractCodeMeta } from "./code-meta";
+
+test("code meta - extract", () => {
+  expect(
+    extractCodeMeta({
+      type: "element",
+      tagName: "pre",
+      properties: {},
+      children: [],
+      data: {
+        meta: '{"highlight": "3..5", "showLineNumbers":true, "fileName":"test"}',
+      },
+    }),
+    {
+      highlight: { lineRange: [{ from: 3, to: 4 }] },
+      showLineNumbers: { lineRange: [] },
+      fileName: "test",
+    },
+  );
+});

package/plugins/syntax-highlight/code-meta.ts

@@ -0,0 +1,76 @@
+import { type NumericRange, parseNumericRange } from "@temelj/iterator";
+import { z } from "zod";
+
+import type { HastElement } from "../../types";
+
+export interface MdxCodeMeta {
+  highlight?: MdxCodeMetaHighlightLine;
+  showLineNumbers?: MdxCodeMetaLineNumbers;
+  commandLine?: MdxCodeMetaCommandLine;
+  fileName?: string;
+}
+
+export type MdxCodeMetaHighlightLine = {
+  lineRange: NumericRange;
+};
+
+export type MdxCodeMetaLineNumbers = {
+  lineRange: NumericRange;
+};
+
+export type MdxCodeMetaCommandLine = {
+  commandRange: NumericRange;
+};
+
+export function extractCodeMeta(node: HastElement): MdxCodeMeta {
+  const meta = node?.data?.meta ?? node?.properties?.metastring ?? "";
+  return parseMetaString(meta as string);
+}
+
+const metaSchema = z.object({
+  highlight: z.optional(z.string()),
+  showLineNumbers: z.optional(z.union([z.boolean(), z.string()])),
+  commandLine: z.optional(z.union([z.boolean(), z.string()])),
+  fileName: z.optional(z.string()),
+});
+
+function parseMetaString(meta: string): MdxCodeMeta {
+  let raw: unknown;
+  try {
+    raw = JSON.parse(meta.trim());
+  } catch {
+    return {};
+  }
+  const parsed = metaSchema.parse(raw);
+  const options: MdxCodeMeta = {};
+
+  if (parsed.highlight !== undefined) {
+    options.highlight = { lineRange: parseNumericRange(parsed.highlight) };
+  }
+
+  if (parsed.showLineNumbers !== undefined) {
+    if (typeof parsed.showLineNumbers === "string") {
+      options.showLineNumbers = {
+        lineRange: parseNumericRange(parsed.showLineNumbers),
+      };
+    } else if (parsed.showLineNumbers) {
+      options.showLineNumbers = { lineRange: [] };
+    }
+  }
+
+  if (parsed.commandLine !== undefined) {
+    if (typeof parsed.commandLine === "string") {
+      options.commandLine = {
+        commandRange: parseNumericRange(parsed.commandLine),
+      };
+    } else if (parsed.commandLine) {
+      options.commandLine = { commandRange: [] };
+    }
+  }
+
+  if (parsed.fileName !== undefined) {
+    options.fileName = parsed.fileName.trim();
+  }
+
+  return options;
+}

package/plugins/syntax-highlight/plugin.ts

@@ -0,0 +1,266 @@
+import { toString as hastToString } from "hast-util-to-string";
+import {
+  type BundledLanguage,
+  type BundledTheme,
+  codeToHast,
+  type CodeToHastOptions,
+  ShikiError,
+} from "shiki";
+import { visit } from "unist-util-visit";
+import {
+  transformerNotationHighlight,
+  type TransformerNotationHighlightOptions,
+} from "@shikijs/transformers";
+import { numericRangeContains } from "@temelj/iterator";
+import type { Plugin } from "unified";
+import type { Properties } from "hast";
+
+import type { HastElement, HastNode } from "../../types";
+
+import { extractCodeMeta } from "./code-meta";
+
+type ShikiHastOptions = Partial<
+  CodeToHastOptions<BundledLanguage, BundledTheme>
+>;
+
+type SyntaxDataAttribute = "source-code" | "language" | "line-count";
+
+/**
+ * Options for {@linkcode syntaxHighlightPlugin}.
+ */
+export interface SyntaxHighlightPluginOptions {
+  /**
+   * Include these data attributes on the `<pre>` element.
+   * These might be useful to have when building custom code components.
+   */
+  includeDataAttributes?: SyntaxDataAttribute[];
+
+  /**
+   * Options for the highlight transformer.
+   */
+  highlight?: {
+    transformer?: TransformerNotationHighlightOptions;
+  };
+
+  /**
+   * Options for line numbers.
+   */
+  lineNumbers?: {
+    /**
+     * The name of the variable that contains the line number width.
+     * This is used for padding the line numbers so that they align.
+     */
+    widthVariableName?: string;
+    /**
+     * A class name to be added to the line numbers.
+     */
+    className?: string;
+  };
+
+  /**
+   * Options for command line.
+   */
+  commandLine?: {
+    /**
+     * A class name to be added to the prompt line.
+     */
+    className?: string;
+  };
+
+  /**
+   * Extra options for the Shiki hast transformer.
+   */
+  shikiHastOptions?: ShikiHastOptions;
+}
+
+/**
+ * A plugin that highlights code blocks using Shiki.
+ */
+export const syntaxHighlightPlugin: Plugin<
+  [SyntaxHighlightPluginOptions?],
+  HastNode,
+  HastNode
+> = (options: SyntaxHighlightPluginOptions = {}) => {
+  return async (tree) => {
+    const promises: Promise<void>[] = [];
+
+    async function visitor(
+      node: HastElement,
+      index: number,
+      parent: HastElement,
+    ): Promise<void> {
+      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: CodeToHastOptions<BundledLanguage, BundledTheme> = {
+        tokenizeTimeLimit: 10_000,
+        lang,
+        themes: {
+          light: "github-light-default",
+          dark: "github-dark-default",
+        },
+        ...(options.shikiHastOptions ?? {}),
+      };
+      if (hastOptions.transformers === undefined) {
+        hastOptions.transformers = [];
+      }
+
+      if (options.highlight) {
+        hastOptions.transformers.push(
+          transformerNotationHighlight({
+            ...(options.highlight.transformer ?? {}),
+            matchAlgorithm: "v3",
+          }),
+        );
+      }
+
+      let lineCount = 0;
+      hastOptions.transformers.push({
+        code(node): void {
+          let lineIndex = 0;
+          for (const line of node.children.filter(
+            (node: HastNode) => node.type === "element",
+          ) as HastElement[]) {
+            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] as HastElement;
+
+        const properties: 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,
+        });
+      } 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;
+      }
+    }
+
+    visit(
+      tree,
+      "element",
+      (node: HastElement, index: number, parent: HastElement) => {
+        promises.push(visitor(node, index, parent));
+      },
+    );
+
+    await Promise.all(promises);
+
+    return tree;
+  };
+};
+
+function getNodeLanguage(node: HastElement): string | undefined {
+  if (!Array.isArray(node.properties.className)) {
+    return undefined;
+  }
+  const prefix = "language-";
+  const language = node.properties.className.find(
+    (name) => typeof name === "string" && name.startsWith(prefix),
+  ) as string | undefined;
+  if (typeof language === "string") {
+    return language.slice(prefix.length);
+  }
+  return language;
+}

package/plugins/tree-processor/plugin.ts

@@ -0,0 +1,54 @@
+import { visit } from "unist-util-visit";
+import type { Plugin } from "unified";
+
+import type { HastElement, HastNode } from "../../types";
+
+export type MdxTreeProcessor = (
+  node: HastElement,
+  index: number,
+  parent: HastElement,
+) => void | Promise<void>;
+
+/**
+ * Options for {@linkcode treeProcessorPlugin}.
+ */
+type TreeProcessorPluginOptions = {
+  /** The processor. */
+  process: MdxTreeProcessor;
+};
+
+/**
+ * A plugin that allows to process MDX tree nodes.
+ * It can be async or sync.
+ */
+export const treeProcessorPlugin: Plugin<
+  [TreeProcessorPluginOptions?],
+  HastNode,
+  HastNode
+> = ({ process } = { process: () => {} }) => {
+  return async (tree) => {
+    const promises: Promise<void>[] = [];
+
+    visit(
+      tree,
+      "element",
+      function visitor(
+        node: HastElement,
+        index: number,
+        parent: HastElement,
+      ): void {
+        const p = process(node, index, parent);
+        if (
+          p instanceof Promise ||
+          Object.prototype.toString.call(p) === "[object Promise]"
+        ) {
+          promises.push(p as Promise<void>);
+        }
+      },
+    );
+
+    await Promise.allSettled(promises);
+
+    return tree;
+  };
+};

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "declaration": true,
+    "outDir": "./dist",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "paths": {
+      "@temelj/iterator": ["../iterator/src/mod"]
+    }
+  },
+  "include": ["./**/*"],
+  "exclude": ["node_modules", "dist", "**/*.test.ts"]
+}

package/types.ts

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

package/esm/mod.js

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

package/esm/package.json

@@ -1,3 +0,0 @@
-{
-  "type": "module"
-}

package/esm/plugins/mod.js

@@ -1,4 +0,0 @@
-export * from "./heading-id/plugin.js";
-export * from "./syntax-highlight/plugin.js";
-export * from "./tree-processor/plugin.js";
-export * from "./remove-imports-exports.js";

package/types/compiler.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"compiler.d.ts","sourceRoot":"","sources":["../src/compiler.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,cAAc,IAAI,mBAAmB,EAC3C,MAAM,aAAa,CAAC;AACrB,OAAO,uBAAuB,MAAM,oBAAoB,CAAC;AACzD,OAAO,eAAe,MAAM,YAAY,CAAC;AAGzC,OAAO,KAAK,EAA4B,MAAM,EAAE,MAAM,SAAS,CAAC;AAChE,OAAO,KAAK,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAE7B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,uBAAuB,EAAE,eAAe,EAAE,CAAC;AAEpD;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,UAAU,CAAC;AAE5C;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,eAAe,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,UAAU,CAAC,EAAE,mBAAmB,CAAC;CAClC;AAED;;;GAGG;AACH,MAAM,WAAW,WAAW,CAAC,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACjE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,WAAW,EAAE,YAAY,CAAC;CAC3B;AAED;;GAEG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAsB;IACjD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAgB;IAC9C,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAgB;gBAE3B,UAAU,GAAE,mBAAwB;IAMhD,gBAAgB,CAAC,QAAQ,EAC9B,MAAM,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAC/C,OAAO,CAAC,EAAE,QAAQ,GACjB,WAAW;IASP,gBAAgB,CAAC,QAAQ,EAC9B,MAAM,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,CAAC,EAC/C,OAAO,CAAC,EAAE,QAAQ,GACjB,WAAW;IASD,OAAO,CAAC,kBAAkB,SAAS,CAAC,CAAC,SAAS,EACzD,MAAM,EAAE,SAAS,EACjB,EAAE,eAAuB,EAAE,UAAU,EAAE,GAAE,iBAAsB,EAC/D,iBAAiB,CAAC,EAAE,kBAAkB,GACrC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC;CA2CtD"}

package/types/mod.d.ts

@@ -1,4 +0,0 @@
-export * from "./plugins/mod.js";
-export * from "./types.js";
-export * from "./compiler.js";
-//# sourceMappingURL=mod.d.ts.map

package/types/mod.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mod.d.ts","sourceRoot":"","sources":["../src/mod.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC"}

package/types/plugins/heading-id/plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/heading-id/plugin.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEtC,OAAO,KAAK,EAAe,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE5D;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC,8BAA8B;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,MAAM,CAClC;IAAC,sBAAsB,CAAC;CAAC,EACzB,QAAQ,EACR,QAAQ,CAoBT,CAAC"}

package/types/plugins/mod.d.ts

@@ -1,5 +0,0 @@
-export * from "./heading-id/plugin.js";
-export * from "./syntax-highlight/plugin.js";
-export * from "./tree-processor/plugin.js";
-export * from "./remove-imports-exports.js";
-//# sourceMappingURL=mod.d.ts.map

package/types/plugins/mod.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mod.d.ts","sourceRoot":"","sources":["../../src/plugins/mod.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC"}

package/types/plugins/remove-imports-exports.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"remove-imports-exports.d.ts","sourceRoot":"","sources":["../../src/plugins/remove-imports-exports.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEtC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C;;GAEG;AACH,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAC7C;IAAC,OAAO;CAAC,EACT,QAAQ,EACR,QAAQ,CAMT,CAAC"}

package/types/plugins/syntax-highlight/code-meta.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"code-meta.d.ts","sourceRoot":"","sources":["../../../src/plugins/syntax-highlight/code-meta.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAqB,MAAM,kBAAkB,CAAC;AAGxE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,WAAW,WAAW;IAC1B,SAAS,CAAC,EAAE,wBAAwB,CAAC;IACrC,eAAe,CAAC,EAAE,sBAAsB,CAAC;IACzC,WAAW,CAAC,EAAE,sBAAsB,CAAC;IACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,YAAY,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,EAAE,YAAY,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,YAAY,EAAE,YAAY,CAAC;CAC5B,CAAC;AAEF,wBAAgB,eAAe,CAAC,IAAI,EAAE,WAAW,GAAG,WAAW,CAG9D"}

package/types/plugins/syntax-highlight/plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/syntax-highlight/plugin.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,YAAY,EAEjB,KAAK,iBAAiB,EAEvB,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,KAAK,mCAAmC,EACzC,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAGtC,OAAO,KAAK,EAAe,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAI5D,KAAK,gBAAgB,GAAG,OAAO,CAC7B,iBAAiB,CAAC,eAAe,EAAE,YAAY,CAAC,CACjD,CAAC;AAEF,KAAK,mBAAmB,GAAG,aAAa,GAAG,UAAU,GAAG,YAAY,CAAC;AAErE;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C;;;OAGG;IACH,qBAAqB,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAE9C;;OAEG;IACH,SAAS,CAAC,EAAE;QACV,WAAW,CAAC,EAAE,mCAAmC,CAAC;KACnD,CAAC;IAEF;;OAEG;IACH,WAAW,CAAC,EAAE;QACZ;;;WAGG;QACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;QAC3B;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAEF;;OAEG;IACH,WAAW,CAAC,EAAE;QACZ;;WAEG;QACH,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAEF;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB,EAAE,MAAM,CACxC;IAAC,4BAA4B,CAAC;CAAC,EAC/B,QAAQ,EACR,QAAQ,CA4KT,CAAC"}

package/types/plugins/tree-processor/plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../../../src/plugins/tree-processor/plugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEtC,OAAO,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE5D,MAAM,MAAM,gBAAgB,GAAG,CAC7B,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,WAAW,KAChB,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAE1B;;GAEG;AACH,KAAK,0BAA0B,GAAG;IAChC,qBAAqB;IACrB,OAAO,EAAE,gBAAgB,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,MAAM,CACtC;IAAC,0BAA0B,CAAC;CAAC,EAC7B,QAAQ,EACR,QAAQ,CA2BT,CAAC"}

package/types/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAE1C,YAAY,EAAE,OAAO,IAAI,WAAW,EAAE,IAAI,IAAI,QAAQ,EAAE,CAAC"}