@humanspeak/svelte-markdown
Version:
Markdown and HTML renderer for Svelte 5 — built for rendering streaming AI agent output from Claude Code, ChatGPT, and agentic workflows. XSS-safe defaults, streaming-aware sanitization, token caching, TypeScript types, and Svelte 5 runes.
76 lines (75 loc) • 3.1 kB
TypeScript
import type { MarkedExtension } from 'marked';
/** Token type emitted for inline math (`\(...\)`, opt-in `$...$`). */
export declare const INLINE_KATEX_TOKEN = "inlineKatex";
/** Token type emitted for block math (`\[...\]`, `$$...$$`, AMS environments). */
export declare const BLOCK_KATEX_TOKEN = "blockKatex";
/**
* Options for the {@link markedKatex} factory.
*/
export interface MarkedKatexOptions {
/**
* When `true`, also tokenize `$...$` (inline) and `$$...$$` (inline) as
* math, using the standard whitespace-boundary rule that prevents
* currency strings like `$5,000` from being parsed as a math expression.
*
* Off by default. KaTeX's own `auto-render` extension excludes `$...$`
* from its defaults with the comment "LaTeX uses $…$, but it ruins the
* display of normal `$` in text" — we follow the same opinion.
*
* Block-level `$$...$$` (own-line delimiters) is always enabled, and is
* unaffected by this option.
*
* @defaultValue `false`
*/
singleDollarInline?: boolean;
}
/**
* Creates a marked extension that tokenizes KaTeX math expressions into
* custom `inlineKatex` and `blockKatex` tokens.
*
* Default delimiter set (mirrors KaTeX's own `auto-render` defaults):
*
* | Delimiter pair | Level | `displayMode` |
* |---|---|---|
* | `\(...\)` | inline | `false` |
* | `\[...\]` (own-line **or** single-line) | block | `true` |
* | `$$...$$` (own-line **or** single-line) | block | `true` |
* | `\begin{equation}...\end{equation}` and other AMS envs | block | `true` |
*
* Both `\[x\]` and `\[\nx\n\]` parse as block math; same for `$$x$$` and the
* own-line `$$\nx\n$$` form. LLMs overwhelmingly emit the single-line form,
* so accepting both keeps the extension drop-in compatible with their output
* without losing the canonical own-line shape.
*
* Supported AMS environments: `equation`, `align`, `alignat`, `gather`, `CD`,
* plus their starred variants (e.g. `equation*`).
*
* `$...$` inline is **off** by default — KaTeX itself opts out of single-
* dollar inline because of currency-string clashes (`$5,000` etc.). Pass
* `{ singleDollarInline: true }` to enable it; when enabled it uses the
* whitespace-boundary rule from upstream `marked-katex-extension` so
* currency strings still won't match.
*
* @example
* ```svelte
* <script lang="ts">
* import SvelteMarkdown from '@humanspeak/svelte-markdown'
* import { markedKatex, KatexRenderer } from '@humanspeak/svelte-markdown/extensions'
*
* const renderers = { inlineKatex: KatexRenderer, blockKatex: KatexRenderer }
* </script>
*
* <SvelteMarkdown
* source={markdown}
* extensions={[markedKatex()]}
* {renderers}
* />
* ```
*
* Pair with `KatexRenderer` from the same subpath, or supply your own
* component that accepts `{ text: string; displayMode?: boolean }`.
*
* @param options - {@link MarkedKatexOptions}
* @returns A `MarkedExtension` containing one block-level and one inline tokenizer
*/
export declare function markedKatex(options?: MarkedKatexOptions): MarkedExtension;