@unifast/react

Convert unifast HAST output to React elements with component mapping

Overview

@unifast/react converts unifast HAST (HTML Abstract Syntax Tree) output into React elements. It provides two main functions:

compileToReact() - High-level: compile Markdown/MDX and return React elements directly
hastToReact() - Low-level: convert a HAST tree into React elements

The package automatically handles HTML-to-React property renaming (class to className, for to htmlFor, etc.) and CSS style string parsing.

Peer dependency: @unifast/node is required for compileToReact.

Extends CompileOptions with React-specific fields.

Property	Type	Description
`createElement`	`CreateElement`	React’s `createElement` function
`Fragment`	`unknown`	React’s `Fragment` component
`components?`	`ComponentMap`	Map of HTML tag names to React components
(all CompileOptions)	-	Inherited from `CompileOptions`

Property	Type	Description
`element`	`unknown`	The root React element
`frontmatter`	`Record<string, unknown>`	Parsed frontmatter metadata
`diagnostics`	`Diagnostic[]`	Warnings and errors
`stats`	`{ parseMs, transformMs, emitMs }`	Timing breakdown (ms)
`toc`	`TocEntry[]`	Extracted table of contents

Property	Type	Description
`createElement`	`CreateElement`	React’s `createElement` function
`Fragment`	`unknown`	React’s `Fragment` component
`components?`	`ComponentMap`	Map of HTML tag names to custom React components

type CreateElement = (type: any, props: any, ...children: any[]) => any;

type ComponentMap = Record<string, unknown>;

CSS style strings are automatically parsed into React style objects (e.g., "font-size: 16px" becomes { fontSize: "16px" }).

Export	Kind	Description
`compileToReact`	function	Compile Markdown/MDX to React elements
`hastToReact`	function	Convert HAST to React elements
`CompileToReactOptions`	type	Options for `compileToReact`
`CompileToReactResult`	type	Result of `compileToReact`
`HastToReactOptions`	type	Options for `hastToReact`
`CreateElement`	type	React createElement signature
`ComponentMap`	type	HTML tag to component map