bquintan/application-amicale
1
0
Fork 0
forked from vergnet/application-amicale
Code Issues Pull requests Releases Wiki Activity

Improved html component to ignore text styles

Browse source
This commit is contained in:
Arnaud Vergnet 2020-04-10 23:06:13 +02:00
parent db1d5166c6
commit 24fb1e3f9b
1 changed files with 14 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
src/components/Custom/CustomHTML.js
View file

@ -1,6 +1,5 @@
import * as React from 'react'; import * as React from 'react';
import {View} from "react-native"; import {Text, withTheme} from 'react-native-paper';
import {withTheme} from 'react-native-paper';
import HTML from "react-native-render-html"; import HTML from "react-native-render-html";
import {Linking} from "expo"; import {Linking} from "expo";
@ -18,26 +17,21 @@ class CustomHTML extends React.Component<Props> {
Linking.openURL(link).catch((err) => console.error('Error opening link', err)); Linking.openURL(link).catch((err) => console.error('Error opening link', err));
}; };
getHTML() { getBasicText = (htmlAttribs, children, convertedCSSStyles, passProps) => {
// Surround description with div to allow text styling if the description is not html // console.log(convertedCSSStyles);
return <HTML html={"<div>" + this.props.html + "</div>"} return <Text {...passProps}>{children}</Text>;
tagsStyles={{ };
p: {color: this.props.theme.colors.text},
div: {color: this.props.theme.colors.text}
}}
onLinkPress={this.openWebLink}/>;
}
render() { render() {
// Completely recreate the component on theme change to force theme reload // Surround description with p to allow text styling if the description is not html
if (this.props.theme.dark) return <HTML
return ( html={"<p>" + this.props.html + "</p>"}
<View> renderers={{
{this.getHTML()} p: this.getBasicText,
</View> }}
); ignoredStyles={['color', 'background-color']}
else
return this.getHTML(); onLinkPress={this.openWebLink}/>;
} }
} }