UNPKG

react-native-ui-lib

Version:

UI Components Library for React Native ###### Lateset version support RN44

66 lines (58 loc) 1.52 kB
import React from 'react'; import {Text as RNText, StyleSheet} from 'react-native'; import PropTypes from 'prop-types'; import {BaseComponent} from '../../commons'; /** * @description: a Wrapper for Text component with extra functionality like modifiers support * @modifiers: margins, color */ export default class Text extends BaseComponent { static displayName = 'Text'; static propTypes = { ...RNText.propTypes, ...BaseComponent.propTypes, /** * color of the text */ color: PropTypes.string, /** * whether to center the text (using textAlign) */ center: PropTypes.bool, testID: PropTypes.string, }; // static defaultProps = { // color: Colors.dark10, // } generateStyles() { this.styles = createStyles(this.props); } setNativeProps(nativeProps) { this._root.setNativeProps(nativeProps); // eslint-disable-line } render() { const color = this.props.color || this.extractColorValue(); const typography = this.extractTypographyValue(); const {style, center, ...others} = this.props; const {margins} = this.state; const textStyle = [ this.styles.container, typography, color && {color}, margins, center && {textAlign: 'center'}, style]; return ( <RNText {...others} style={textStyle}> {this.props.children} </RNText> ); } } function createStyles() { return StyleSheet.create({ container: { backgroundColor: 'transparent', }, }); }