@generative-dom/plugin-markdown-code

Fenced code blocks with optional language tags for Generative DOM.

Installation

pnpm add @generative-dom/plugin-markdown-code

Usage

import { GenerativeDom } from '@generative-dom/core';
import { markdownCode } from '@generative-dom/plugin-markdown-code';

const md = new GenerativeDom(container, { plugins: [markdownCode()] });
md.push('```js\nconsole.log("hi");\n```\n');

Matching

Matches fenced code blocks opened by three or more backticks (```) or tildes (~~~), with an optional language identifier on the opening line. The closing fence must use the same character and be at least as long as the opening fence.

```typescript
const x = 1;

print("hello")

The plugin waits for a closing fence before consuming any input. Incomplete blocks are held
until more data arrives.

## Configuration

- priority: 100
- level: block (default)
- matchDescriptor: `{ startChars: '`~', requiresSOL: true }`
- allowedChildren: `[]` (no inline parsing — content is always plain text)

## Rendered Output

Produces `<pre><code>` with an optional `language-*` class on the `<code>` element.
Content is inserted as a plain text node — no HTML injection is possible.

```html
<pre><code class="language-typescript">const x = 1;
</code></pre>