Neatly Planned Meal

    dom-parser-react
    TypeScript icon, indicating that this package has built-in type declarations

    0.2.2 • Public • Published

    DOMParserReact

    A small parser that converts HTML to React using the DOMParser API.

    Usage

    import React from 'react'
    import DOMParserReact, { parse } from 'dom-parser-react'
    // import { renderToStaticMarkup as render } from 'react-dom/server'
    
    const App = () =>
      <DOMParserReact source="<h1>HTML Text</h1>" />
    
    render(<App />) // `<h1>HTML Text</h1>`
    
    // or
    
    const contents = parse("<h1>HTML Text for parse API</h1>", {
      createElement: React.createElement,
      Fragment: React.Fragment,
    })
    
    render(<>{contents}</>) // `<h1>HTML Text</h1>`

    Custom Components

    import React from 'react'
    import DOMParserReact from 'dom-parser-react'
    // import { renderToStaticMarkup as render } from 'react-dom/server'
    
    const Title = (props) =>
      <div className="title">
        <h1 {...props} />
      </div>
    
    const App = () =>
      <DOMParserReact source="<h1>HTML Text</h1>" components={{ h1: Title }} />
    
    render(<App />) // `<div class="title"><h1>HTML Text</h1></div>`

    Install

    npm i dom-parser-react

    DownloadsWeekly Downloads

    793

    Version

    0.2.2

    License

    MIT

    Unpacked Size

    41.9 kB

    Total Files

    17

    Last publish

    Collaborators

    • imasanari