blob: 979fe0c06eb5cc42c3da3abac9ae665f46b495cd (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
|
const React = require('react');
const ReactSafeHtml = require('react-safe-html');
const htmlTags = require('html-tags');
const { InjectedComponent } = require('./InjectedComponent');
/*
HTMLContent is a container for the page HTML that parse the content and
render the right block.
All html elements can be extended using the injected component.
*/
function inject(injectedProps, Component) {
return (props) => {
return (
<InjectedComponent {...injectedProps(props)}>
<Component {...props} />
</InjectedComponent>
);
};
}
const COMPONENTS = {
// Templating blocks are exported as <template-block block="youtube" props="{}" />
'template-block': inject(
({block, props}) => {
return {
matching: { role: `block:${block}` },
props: JSON.parse(props)
};
},
props => <div {...props} />
)
};
htmlTags.forEach(tag => {
COMPONENTS[tag] = inject(
props => {
return {
matching: { role: `html:${tag}` },
props
};
},
props => React.createElement(tag, props)
);
});
const HTMLContent = React.createClass({
propTypes: {
html: React.PropTypes.string.isRequired
},
render() {
const { html } = this.props;
return <ReactSafeHtml html={html} components={COMPONENTS} />;
}
});
module.exports = HTMLContent;
|
