Menu

Tree [17d8ea] master /
 History

HTTPS access


File Date Author Commit
 __tests__ 2019-08-28 Arny Arny [157a18] + test styles
 dist 2019-09-25 Arny Arny [17d8ea] fix naming
 example 2019-09-25 Arny Arny [17d8ea] fix naming
 src 2019-08-28 Arny Arny [157a18] + test styles
 .babelrc 2019-08-08 Arny Arny [87823c] init
 .eslintrc.js 2019-08-08 Arny Arny [87823c] init
 .gitignore 2019-09-25 Arny Arny [6ef554] remove coverage from git
 LICENSE.txt 2019-08-08 Arny Arny [312b78] + tests + license + dist
 README.md 2019-08-13 Arny Arny [772c6a] fix readme
 package-lock.json 2019-09-25 Arny Arny [a40b9e] 0.1.7
 package.json 2019-09-25 Arny Arny [17d8ea] fix naming
 webpack.config.js 2019-09-25 Arny Arny [17d8ea] fix naming

Read Me

react-html-component

Download arny/react-html-component

This component renders raw html string to ReactJS components tree.

It supports:
- [x] links
- [x] hashtags
- [x] highlighting words

Usage (see example):

import HTMLComponent from 'react-html-component'

class App extends Component {
    render() {
        const html = '<p>This text is <span style="color:red">raw<span> html</p>'
        return (
            <HTMLComponent html={html} />
        )
    }
}

Available options:
- html: PropTypes.string.isRequired, // String to parse
- withLinksParsing: PropTypes.bool, // Should links be parsed and wrapped in A tag
- onLinkClick: PropTypes.func, // link click callback
- containerTag: PropTypes.string, // Tag for html container
- tags: PropTypes.array, // tags that allowed to use
- attributes: PropTypes.array, // attributes that allowed to use
- highlightWords: PropTypes.array, // Words to highlight
- highlightStyle: PropTypes.object, // style of highlighted words
- replaceTags: PropTypes.object, // Tags that must be replaced, for example: {'BR': ' '}
- withHashTags: PropTypes.bool, // Can parse hashtags
- onHashTagClick: PropTypes.func // hashtags click callback

Want the latest updates on software, tech news, and AI?
Get latest updates about software, tech news, and AI from SourceForge directly in your inbox once a month.