Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 | 10x 22x 22x 10x 10x 10x | import React from 'react';
import PropTypes from 'prop-types';
import { Text, StyleSheet, Platform } from 'react-native';
import { fonts, withTheme } from '../config';
import normalize from '../helpers/normalizeText';
const TextElement = props => {
const {
style,
children,
h1,
h2,
h3,
h4,
h1Style,
h2Style,
h3Style,
h4Style,
...rest
} = props;
return (
<Text
style={StyleSheet.flatten([
styles.text,
style && style,
h1 && StyleSheet.flatten([{ fontSize: normalize(40) }, h1Style]),
h2 && StyleSheet.flatten([{ fontSize: normalize(34) }, h2Style]),
h3 && StyleSheet.flatten([{ fontSize: normalize(28) }, h3Style]),
h4 && StyleSheet.flatten([{ fontSize: normalize(22) }, h4Style]),
h1 && styles.bold,
h2 && styles.bold,
h3 && styles.bold,
h4 && styles.bold,
])}
{...rest}
>
{children}
</Text>
);
};
TextElement.propTypes = {
style: Text.propTypes.style,
h1: PropTypes.bool,
h2: PropTypes.bool,
h3: PropTypes.bool,
h4: PropTypes.bool,
h1Style: Text.propTypes.style,
h2Style: Text.propTypes.style,
h3Style: Text.propTypes.style,
h4Style: Text.propTypes.style,
children: PropTypes.node,
};
TextElement.defaultProps = {
h1: false,
h2: false,
h3: false,
h4: false,
style: {},
h1Style: {},
h2Style: {},
h3Style: {},
h4Style: {},
children: '',
};
const styles = StyleSheet.create({
text: {
...Platform.select({
android: {
...fonts.android.regular,
},
}),
},
bold: {
...Platform.select({
android: {
...fonts.android.bold,
},
}),
},
});
export { TextElement };
export default withTheme(TextElement, 'Text');
|