ferns-ui 0.4.2 → 0.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Avatar.d.ts +3 -0
- package/dist/Avatar.js +5 -2
- package/dist/Avatar.js.map +1 -1
- package/package.json +1 -1
- package/src/Avatar.tsx +11 -2
package/dist/Avatar.d.ts
CHANGED
package/dist/Avatar.js
CHANGED
|
@@ -10,6 +10,7 @@ const sizes = {
|
|
|
10
10
|
xl: 120,
|
|
11
11
|
};
|
|
12
12
|
export const Avatar = (props) => {
|
|
13
|
+
var _a;
|
|
13
14
|
const [isImageLoaded, setIsImageLoaded] = useState(true);
|
|
14
15
|
const { name, initials, outline, size = "md", src } = props;
|
|
15
16
|
const width = sizes[size];
|
|
@@ -41,8 +42,10 @@ export const Avatar = (props) => {
|
|
|
41
42
|
display: "flex",
|
|
42
43
|
alignItems: "center",
|
|
43
44
|
justifyContent: "center",
|
|
44
|
-
backgroundColor:
|
|
45
|
+
backgroundColor: props.backgroundColor
|
|
46
|
+
? Unifier.theme[props.backgroundColor]
|
|
47
|
+
: Unifier.theme.gray,
|
|
45
48
|
} },
|
|
46
|
-
React.createElement(Text, { style: { fontSize, color: Unifier.theme.darkGray } }, computedInitials)))));
|
|
49
|
+
React.createElement(Text, { style: { fontSize, color: (_a = props.textColor) !== null && _a !== void 0 ? _a : Unifier.theme.darkGray } }, computedInitials)))));
|
|
47
50
|
};
|
|
48
51
|
//# sourceMappingURL=Avatar.js.map
|
package/dist/Avatar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AACtC,OAAO,EAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/Avatar.tsx
CHANGED
|
@@ -2,6 +2,7 @@ import React, {useState} from "react";
|
|
|
2
2
|
import {Image, Text, View} from "react-native";
|
|
3
3
|
|
|
4
4
|
import {Box} from "./Box";
|
|
5
|
+
import {AllColors} from "./Common";
|
|
5
6
|
import {Unifier} from "./Unifier";
|
|
6
7
|
|
|
7
8
|
const sizes = {
|
|
@@ -13,6 +14,10 @@ const sizes = {
|
|
|
13
14
|
};
|
|
14
15
|
|
|
15
16
|
interface AvatarProps {
|
|
17
|
+
// Color for the background of the circle when no src picture is present.
|
|
18
|
+
backgroundColor?: AllColors;
|
|
19
|
+
// Color for the initials when no src picture is present.
|
|
20
|
+
textColor?: AllColors;
|
|
16
21
|
/**
|
|
17
22
|
* The name of the user. This is used for the placeholder treatment if an image is not available.
|
|
18
23
|
*/
|
|
@@ -87,10 +92,14 @@ export const Avatar = (props: AvatarProps): React.ReactElement => {
|
|
|
87
92
|
display: "flex",
|
|
88
93
|
alignItems: "center",
|
|
89
94
|
justifyContent: "center",
|
|
90
|
-
backgroundColor:
|
|
95
|
+
backgroundColor: props.backgroundColor
|
|
96
|
+
? Unifier.theme[props.backgroundColor]
|
|
97
|
+
: Unifier.theme.gray,
|
|
91
98
|
}}
|
|
92
99
|
>
|
|
93
|
-
<Text style={{fontSize, color: Unifier.theme.darkGray}}>
|
|
100
|
+
<Text style={{fontSize, color: props.textColor ?? Unifier.theme.darkGray}}>
|
|
101
|
+
{computedInitials}
|
|
102
|
+
</Text>
|
|
94
103
|
</View>
|
|
95
104
|
)}
|
|
96
105
|
</Box>
|