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