MDX Framework Adapter

Build a simple MDX document compiler that can target different JSX frameworks by configuring the JSX runtime.

Requirements

Create a module that exports a compileForFramework function which compiles MDX content with framework-specific JSX runtime configuration.

The function should:

• Accept MDX content as a string
• Accept a framework name ('react' or 'preact')
• Configure the JSX runtime appropriately for the target framework
• Return the compiled JavaScript code as a string

Framework Configuration

• For React: Use the default JSX import source
• For Preact: Use 'preact' as the JSX import source

Test Cases

• Given MDX content "# Hello\n\nThis is **bold**." and framework 'react', the output includes jsx-runtime imports from React @test
• Given MDX content "# Hello\n\nThis is **bold**." and framework 'preact', the output includes jsx-runtime imports from Preact @test
• Given MDX content containing JSX "<CustomComponent />" and framework 'react', the compiled output correctly handles the JSX element @test

Implementation

@generates

API

/**
 * Compiles MDX content for a specific framework.
 *
 * @param {string} content - The MDX content to compile
 * @param {'react' | 'preact'} framework - The target framework
 * @returns {Promise<string>} The compiled JavaScript code
 */
export async function compileForFramework(content, framework) {
  // Implementation here
}

Dependencies { .dependencies }

@mdx-js/mdx { .dependency }

Provides MDX compilation functionality with JSX runtime configuration.

@satisfied-by