ferns-ui 0.37.5 → 0.37.6
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 +4 -0
- package/dist/Avatar.js +15 -6
- package/dist/Avatar.js.map +1 -1
- package/package.json +1 -1
- package/src/Avatar.tsx +18 -3
package/dist/Avatar.d.ts
CHANGED
|
@@ -63,6 +63,10 @@ interface AvatarProps {
|
|
|
63
63
|
* Text to show when hovering over the avatar image. Only works on web.
|
|
64
64
|
*/
|
|
65
65
|
statusText?: string;
|
|
66
|
+
/**
|
|
67
|
+
* If edit icon should be present when no image is present
|
|
68
|
+
*/
|
|
69
|
+
shouldShowEditIconIfNoImage?: boolean;
|
|
66
70
|
}
|
|
67
71
|
export declare const Avatar: (props: AvatarProps) => React.ReactElement;
|
|
68
72
|
export {};
|
package/dist/Avatar.js
CHANGED
|
@@ -39,7 +39,7 @@ export const Avatar = (props) => {
|
|
|
39
39
|
const [isImageLoaded, setIsImageLoaded] = useState(true);
|
|
40
40
|
const [hovered, setHovered] = useState(false);
|
|
41
41
|
const [src, setSrc] = useState((_a = props.src) !== null && _a !== void 0 ? _a : undefined);
|
|
42
|
-
const { name, initials, outline, size = "md", imageFit = "contain", editAvatarImage, onChange, avatarImageWidth = sizes[size], avatarImageHeight, avatarImageFormat = SaveFormat.PNG, } = props;
|
|
42
|
+
const { name, initials, outline, size = "md", imageFit = "contain", editAvatarImage, onChange, avatarImageWidth = sizes[size], avatarImageHeight, avatarImageFormat = SaveFormat.PNG, shouldShowEditIconIfNoImage = false, } = props;
|
|
43
43
|
const width = sizes[size];
|
|
44
44
|
const height = sizes[size];
|
|
45
45
|
const radius = sizes[size] / 2;
|
|
@@ -78,14 +78,23 @@ export const Avatar = (props) => {
|
|
|
78
78
|
const resizeImage = async (imageUri) => {
|
|
79
79
|
return manipulateAsync(imageUri, [{ resize: { width: avatarImageWidth, height: avatarImageHeight } }], { format: avatarImageFormat });
|
|
80
80
|
};
|
|
81
|
+
function shouldShowEditIcon() {
|
|
82
|
+
if (Platform.OS === "web") {
|
|
83
|
+
return (shouldShowEditIconIfNoImage && !src) || (editAvatarImage && hovered);
|
|
84
|
+
}
|
|
85
|
+
else {
|
|
86
|
+
return (shouldShowEditIconIfNoImage && !src) || editAvatarImage;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
81
89
|
const renderEditIcon = () => {
|
|
82
|
-
if (
|
|
90
|
+
if (shouldShowEditIcon() && Platform.OS === "web") {
|
|
83
91
|
return (React.createElement(Box, { alignItems: "center", dangerouslySetInlineStyle: {
|
|
84
|
-
__style: { backgroundColor: "rgba(255,255,255,0.
|
|
85
|
-
}, height: height, justifyContent: "center", position: "absolute", zIndex: 5, onClick: pickImage, onHoverEnd: () => setHovered(false), onHoverStart: () => setHovered(true) },
|
|
86
|
-
React.createElement(Icon, { color: "darkGray", name: "edit", size: size })
|
|
92
|
+
__style: { backgroundColor: "rgba(255,255,255,0.8)", borderRadius: radius },
|
|
93
|
+
}, height: height, justifyContent: "center", position: "absolute", width: width, zIndex: 5, onClick: pickImage, onHoverEnd: () => setHovered(false), onHoverStart: () => setHovered(true) },
|
|
94
|
+
React.createElement(Icon, { color: "darkGray", name: "edit", size: size }),
|
|
95
|
+
React.createElement(Text, { style: { fontWeight: "bold" } }, "Upload Image")));
|
|
87
96
|
}
|
|
88
|
-
else if (
|
|
97
|
+
else if (shouldShowEditIcon() && Platform.OS !== "web") {
|
|
89
98
|
return (React.createElement(Box, { bottom: true, left: Boolean(props.status), paddingX: sizeIconPadding[size], position: "absolute", right: !Boolean(props.status), zIndex: 5, onClick: pickImage },
|
|
90
99
|
React.createElement(Icon, { color: "darkGray", name: "edit", size: size })));
|
|
91
100
|
}
|
package/dist/Avatar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.tsx"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,OAAO,EAAc,eAAe,EAAE,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAC,uBAAuB,EAAE,gBAAgB,EAAC,MAAM,mBAAmB,CAAC;AAC5E,OAAO,KAAK,EAAE,EAAC,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAC,KAAK,EAAmB,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,cAAc,CAAC;AAE1E,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,OAAO,EAAC,cAAc,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAC,YAAY,EAAC,MAAM,SAAS,CAAC;AACrC,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAElC,MAAM,KAAK,GAAG;IACZ,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,GAAG;CACR,CAAC;AAEF,MAAM,eAAe,GAAmC;IACtD,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;CACN,CAAC;AAEF,MAAM,WAAW,GAAsE;IACrF,MAAM,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAC;IACzD,OAAO,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAC;IAC1D,YAAY,EAAE,EAAC,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,gBAAgB,EAAC;IAC3E,IAAI,EAAE,EAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAC;IACpD,OAAO,EAAE,EAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,cAAc,EAAC;IACnE,QAAQ,EAAE,EAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAC;IAChE,IAAI,EAAE,EAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAC;IAC9D,WAAW,EAAE,EAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,eAAe,EAAC;IACrE,SAAS,EAAE,EAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAC;CAC9D,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
|
@@ -113,6 +113,10 @@ interface AvatarProps {
|
|
|
113
113
|
* Text to show when hovering over the avatar image. Only works on web.
|
|
114
114
|
*/
|
|
115
115
|
statusText?: string;
|
|
116
|
+
/**
|
|
117
|
+
* If edit icon should be present when no image is present
|
|
118
|
+
*/
|
|
119
|
+
shouldShowEditIconIfNoImage?: boolean;
|
|
116
120
|
}
|
|
117
121
|
|
|
118
122
|
export const Avatar = (props: AvatarProps): React.ReactElement => {
|
|
@@ -132,6 +136,7 @@ export const Avatar = (props: AvatarProps): React.ReactElement => {
|
|
|
132
136
|
avatarImageWidth = sizes[size],
|
|
133
137
|
avatarImageHeight,
|
|
134
138
|
avatarImageFormat = SaveFormat.PNG,
|
|
139
|
+
shouldShowEditIconIfNoImage = false,
|
|
135
140
|
} = props;
|
|
136
141
|
const width = sizes[size];
|
|
137
142
|
const height = sizes[size];
|
|
@@ -184,26 +189,36 @@ export const Avatar = (props: AvatarProps): React.ReactElement => {
|
|
|
184
189
|
);
|
|
185
190
|
};
|
|
186
191
|
|
|
192
|
+
function shouldShowEditIcon() {
|
|
193
|
+
if (Platform.OS === "web") {
|
|
194
|
+
return (shouldShowEditIconIfNoImage && !src) || (editAvatarImage && hovered);
|
|
195
|
+
} else {
|
|
196
|
+
return (shouldShowEditIconIfNoImage && !src) || editAvatarImage;
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
|
|
187
200
|
const renderEditIcon = () => {
|
|
188
|
-
if (
|
|
201
|
+
if (shouldShowEditIcon() && Platform.OS === "web") {
|
|
189
202
|
return (
|
|
190
203
|
<Box
|
|
191
204
|
alignItems="center"
|
|
192
205
|
dangerouslySetInlineStyle={{
|
|
193
|
-
__style: {backgroundColor: "rgba(255,255,255,0.
|
|
206
|
+
__style: {backgroundColor: "rgba(255,255,255,0.8)", borderRadius: radius},
|
|
194
207
|
}}
|
|
195
208
|
height={height}
|
|
196
209
|
justifyContent="center"
|
|
197
210
|
position="absolute"
|
|
211
|
+
width={width}
|
|
198
212
|
zIndex={5}
|
|
199
213
|
onClick={pickImage}
|
|
200
214
|
onHoverEnd={() => setHovered(false)}
|
|
201
215
|
onHoverStart={() => setHovered(true)}
|
|
202
216
|
>
|
|
203
217
|
<Icon color="darkGray" name="edit" size={size} />
|
|
218
|
+
<Text style={{fontWeight: "bold"}}>Upload Image</Text>
|
|
204
219
|
</Box>
|
|
205
220
|
);
|
|
206
|
-
} else if (
|
|
221
|
+
} else if (shouldShowEditIcon() && Platform.OS !== "web") {
|
|
207
222
|
return (
|
|
208
223
|
<Box
|
|
209
224
|
bottom
|