MCPcopy
hub / github.com/callstack/react-native-paper / AvatarText

Function AvatarText

src/components/Avatar/AvatarText.tsx:63–112  ·  view source on GitHub ↗
({
  label,
  size = defaultSize,
  style,
  labelStyle,
  color: customColor,
  theme: themeOverrides,
  maxFontSizeMultiplier,
  ...rest
}: Props)

Source from the content-addressed store, hash-verified

61 * ```
62 */
63const 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
114AvatarText.displayName = 'Avatar.Text';
115

Callers

nothing calls this directly

Calls 2

useInternalThemeFunction · 0.90
getContrastingColorFunction · 0.85

Tested by

no test coverage detected

Used in the wild real call sites across dependent graphs

searching dependent graphs…