({
label,
size = defaultSize,
style,
labelStyle,
color: customColor,
theme: themeOverrides,
maxFontSizeMultiplier,
...rest
}: Props)
| 61 | * ``` |
| 62 | */ |
| 63 | const AvatarText = ({ |
| 64 | label, |
| 65 | size = defaultSize, |
| 66 | style, |
| 67 | labelStyle, |
| 68 | color: customColor, |
| 69 | theme: themeOverrides, |
| 70 | maxFontSizeMultiplier, |
| 71 | ...rest |
| 72 | }: Props) => { |
| 73 | const theme = useInternalTheme(themeOverrides); |
| 74 | const { backgroundColor = theme.colors?.primary, ...restStyle } = |
| 75 | StyleSheet.flatten(style) || {}; |
| 76 | const textColor = |
| 77 | customColor ?? |
| 78 | getContrastingColor(backgroundColor, white, 'rgba(0, 0, 0, .54)'); |
| 79 | const { fontScale } = useWindowDimensions(); |
| 80 | |
| 81 | return ( |
| 82 | <View |
| 83 | style={[ |
| 84 | { |
| 85 | width: size, |
| 86 | height: size, |
| 87 | borderRadius: size / 2, |
| 88 | backgroundColor, |
| 89 | }, |
| 90 | styles.container, |
| 91 | restStyle, |
| 92 | ]} |
| 93 | {...rest} |
| 94 | > |
| 95 | <Text |
| 96 | style={[ |
| 97 | styles.text, |
| 98 | { |
| 99 | color: textColor, |
| 100 | fontSize: size / 2, |
| 101 | lineHeight: size / fontScale, |
| 102 | }, |
| 103 | labelStyle, |
| 104 | ]} |
| 105 | numberOfLines={1} |
| 106 | maxFontSizeMultiplier={maxFontSizeMultiplier} |
| 107 | > |
| 108 | {label} |
| 109 | </Text> |
| 110 | </View> |
| 111 | ); |
| 112 | }; |
| 113 | |
| 114 | AvatarText.displayName = 'Avatar.Text'; |
| 115 |
nothing calls this directly
no test coverage detected
searching dependent graphs…