@wsui/html-processor
v1.12.2
Published
Provides a way to transform HTML strings into React component trees.
Downloads
16
Keywords
Readme
WSUI HTML Processor
Provides a way to transform HTML strings into React component trees.
Installation
Install the package and a Rehype parser; either rehype-parse
for server-side
rendering or rehype-dom-parse
for rendering in browser:
npm install --save @wsui/html-processor rehype-parse
—or—
npm install --save @wsui/html-processor rehype-dom-parse
How to use
Wrap your app in an HtmlProcessorProvider
and provide a Rehype parser. Then
use the Html
component to render HTML strings as React components.
import { Html, HtmlProcessorProvider } from "@wsui/html-processor";
import React from "react";
import { createRoot } from "react-dom/client";
import rehypeParse from "rehype-dom-parse";
const htmlString = "<h1>Hello, world!</h1>";
const domNode = document.getElementById("root");
const root = createRoot(domNode);
root.render(
<HtmlProcessorProvider rehypeParse={rehypeParse}>
<Html>{htmlString}</Html>
</HtmlProcessorProvider>,
);