|
1 | | -/* @flow */ |
2 | | -'use strict'; |
3 | | - |
4 | | -import React from 'react'; |
5 | | -import {Text} from 'react-native'; |
6 | | -import NativeBaseComponent from '../Base/NativeBaseComponent'; |
7 | | -import computeProps from '../../Utils/computeProps'; |
8 | | - |
9 | | - |
10 | | -export default class BadgeNB extends NativeBaseComponent { |
11 | | - |
12 | | - prepareRootProps() { |
13 | | - |
14 | | - var type = { |
15 | | - color: this.getTheme().badgeColor, |
16 | | - fontSize: this.getTheme().fontSizeBase, |
17 | | - backgroundColor: this.props.primary ? this.getTheme().brandPrimary : this.props.success ? this.getTheme().brandSuccess : |
18 | | - this.props.info ? this.getTheme().brandInfo : this.props.warning ? this.getTheme().brandWarning : |
19 | | - this.props.danger ? this.getTheme().brandDanger : this.getTheme().badgeBg, |
20 | | - padding: 4, |
21 | | - alignSelf: 'flex-start', |
22 | | - borderRadius: 13, |
23 | | - width: 27, |
24 | | - textAlign: 'center' |
25 | | - |
26 | | - } |
27 | | - |
28 | | - var defaultProps = { |
29 | | - style: type |
30 | | - } |
31 | | - |
32 | | - return computeProps(this.props, defaultProps); |
33 | | - |
34 | | - } |
35 | | - render() { |
36 | | - return( |
37 | | - <Text {...this.prepareRootProps()}>{this.props.children}</Text> |
38 | | - ); |
39 | | - } |
40 | | - |
41 | | -} |
42 | | - |
| 1 | +/* @flow */ |
| 2 | +'use strict'; |
| 3 | + |
| 4 | +import React from 'react'; |
| 5 | +import {Text, View} from 'react-native'; |
| 6 | +import NativeBaseComponent from '../Base/NativeBaseComponent'; |
| 7 | +import computeProps from '../../Utils/computeProps'; |
| 8 | + |
| 9 | + |
| 10 | +export default class BadgeNB extends NativeBaseComponent { |
| 11 | + |
| 12 | + prepareRootProps() { |
| 13 | + |
| 14 | + var type = { |
| 15 | + |
| 16 | + backgroundColor: this.props.primary ? this.getTheme().brandPrimary : this.props.success ? this.getTheme().brandSuccess : |
| 17 | + this.props.info ? this.getTheme().brandInfo : this.props.warning ? this.getTheme().brandWarning : |
| 18 | + this.props.danger ? this.getTheme().brandDanger : this.getTheme().badgeBg, |
| 19 | + padding: 4, |
| 20 | + alignSelf: 'flex-start', |
| 21 | + borderRadius: 13, |
| 22 | + width: 27 |
| 23 | + |
| 24 | + |
| 25 | + } |
| 26 | + |
| 27 | + var defaultProps = { |
| 28 | + style: type |
| 29 | + } |
| 30 | + |
| 31 | + return computeProps(this.props, defaultProps); |
| 32 | + |
| 33 | + } |
| 34 | + render() { |
| 35 | + return( |
| 36 | + <View {...this.prepareRootProps()}> |
| 37 | + <Text style={{ color: this.getTheme().badgeColor, |
| 38 | + fontSize: this.getTheme().fontSizeBase, |
| 39 | + textAlign: 'center'}}>{this.props.children} |
| 40 | + </Text> |
| 41 | + </View> |
| 42 | + ); |
| 43 | + } |
| 44 | + |
| 45 | +} |
| 46 | + |
0 commit comments