Markdown Viewer component

Props

export interface MarkdownViewerProps {
  input: string;
  escapeHtml: boolean;
  disallowedTypes?: string[];
  unwrapDisallowed?: boolean;
}

• input The Markdown source to parse (required)
• escapeHtml Setting to false will cause HTML to be rendered. Be aware that setting this to false might cause security issues if the input is user-generated. Use at your own risk. (default: true).
• disallowedTypes - Defines which types of nodes should be disallowed (not rendered).
• unwrapDisallowed - boolean Setting to true will try to extract/unwrap the children of disallowed nodes. For instance, if disallowing Strong, the default behaviour is to simply skip the text within the strong altogether, while the behaviour some might want is to simply have the text returned without the strong wrapping it. (default: false)

Node types

The node types available are the following, use these names in disallowedTypes:

• root - Root container element that contains the rendered markdown
• text - Text rendered inside of other elements, such as paragraphs
• break - Hard-break (<br>)
• paragraph - Paragraph (<p>)
• emphasis - Emphasis (<em>)
• strong - Strong/bold (<strong>)
• thematicBreak - Horizontal rule / thematic break (<hr>)
• blockquote - Block quote (<blockquote>)
• delete - Deleted/strike-through (<del>)
• link - Link (<a>)
• image - Image (<img>)
• linkReference - Link (through a reference) (<a>)
• imageReference - Image (through a reference) (<img>)
• table - Table (<table>)
• tableHead - Table head (<thead>)
• tableBody - Table body (<tbody>)
• tableRow - Table row (<tr>)
• tableCell - Table cell (<td>/<th>)
• list - List (<ul>/<ol>)
• listItem - List item (<li>)
• definition - Definition (not rendered by default)
• heading - Heading (<h1>-<h6>)
• inlineCode - Inline code (<code>)
• code - Block of code (<pre><code>)
• html - HTML node (Best-effort rendering)
• virtualHtml - When not using the HTML parser plugin, a cheap and dirty approach to supporting simple HTML elements without a complete parser.
• parsedHtml - When using the HTML parser plugin, HTML parsed to a React element.

Note: Disallowing a node will also prevent the rendering of any children of that node, unless the unwrapDisallowed option is set to true. E.g., disallowing a paragraph will not render its children text nodes.