decathlon-ui 0.3.16 → 0.3.18
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/components/product-card/product-card.component.js +2 -2
- package/dist/components/product-card/product-card.styles.d.ts +5 -7
- package/dist/components/product-card/product-card.styles.d.ts.map +1 -1
- package/dist/components/product-card/product-card.styles.js +5 -7
- package/dist/components/product-card/product-card.types.d.ts +4 -4
- package/dist/components/product-card/product-card.types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -11,11 +11,11 @@ const ProductCardComponent = ({ variant = "grid", imageUrl, brand, productName,
|
|
|
11
11
|
e.stopPropagation();
|
|
12
12
|
onFavoritePress === null || onFavoritePress === void 0 ? void 0 : onFavoritePress();
|
|
13
13
|
}, [onFavoritePress]);
|
|
14
|
-
const renderContent = React.useCallback(() => (_jsxs(View, { style: [styles.cardContainer, customStyles
|
|
14
|
+
const renderContent = React.useCallback(() => (_jsxs(View, { style: [styles.cardContainer, customStyles], children: [_jsxs(View, { style: styles.imageContainer, children: [_jsx(Image, { resizeMode: "cover", source: { uri: imageUrl }, style: styles.productImage, accessibilityLabel: `Imagem do produto ${productName}` }), ["grid", "shelf"].includes(variant) &&
|
|
15
15
|
(flags === null || flags === void 0 ? void 0 : flags.length) > 0 &&
|
|
16
16
|
(flags === null || flags === void 0 ? void 0 : flags.map((flag, index) => (_jsx(Badge, { text: flag.text, style: { position: "absolute", top: 0, left: 0 }, icon: flag.icon }, flag.name + index + productName)))), isFavorite && (_jsx(TouchableOpacity, { style: [
|
|
17
17
|
isFavorite ? styles.favoriteButton : styles.unfavoriteButton,
|
|
18
|
-
], onPress: handleFavoritePress, accessibilityLabel: isFavorite ? "Remover dos favoritos" : "Adicionar aos favoritos", accessibilityRole: "button", children: isLoadingFavorite ? (_jsx(Loading, { size:
|
|
18
|
+
], onPress: handleFavoritePress, accessibilityLabel: isFavorite ? "Remover dos favoritos" : "Adicionar aos favoritos", accessibilityRole: "button", children: isLoadingFavorite ? (_jsx(Loading, { size: 16 })) : isFavorite ? (_jsx(HeartFillIcon, { size: 16, color: "#101010" })) : (_jsx(HeartIcon, { size: 16, color: "#101010" })) }))] }), variant !== "lastViewed" && (_jsxs(View, { style: styles.detailsContainer, children: [_jsxs(View, { style: styles.productInfo, children: [_jsx(Text, { style: styles.brandText, children: brand }), _jsx(View, { style: styles.nameContainer, children: _jsx(Text, { numberOfLines: 3, style: styles.nameText, accessibilityLabel: `Nome do produto: ${productName}`, children: productName }) })] }), variant === "grid" && showRating && (_jsxs(View, { style: styles.ratingContainer, accessibilityLabel: `Avaliação: ${rating} estrelas, ${reviewCount} avaliações`, children: [_jsx(StarIcon, { size: 11, color: "#101010", fill: "#101010" }), _jsxs(View, { style: styles.reviewCountWrapper, children: [_jsx(Text, { style: styles.ratingText, children: rating }), _jsxs(Text, { style: styles.reviewCountText, children: ["(", reviewCount, ")"] })] })] })), _jsx(View, { style: styles.priceContainer, children: _jsx(Text, { style: styles.priceText, accessibilityLabel: `Preço: ${price}`, children: price }) })] }))] })), [
|
|
19
19
|
brand,
|
|
20
20
|
handleFavoritePress,
|
|
21
21
|
imageUrl,
|
|
@@ -6,22 +6,20 @@ export declare const useProductCardStyles: (variant?: ProductCardVariant, custom
|
|
|
6
6
|
maxWidth: number;
|
|
7
7
|
flexDirection: "column";
|
|
8
8
|
alignItems: "stretch";
|
|
9
|
+
justifyContent: "center";
|
|
9
10
|
};
|
|
10
11
|
imageContainer: {
|
|
11
12
|
borderRadius: number;
|
|
12
13
|
display: "flex";
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
alignItems: "
|
|
14
|
+
flex: number;
|
|
15
|
+
justifyContent: "center";
|
|
16
|
+
alignItems: "center";
|
|
16
17
|
};
|
|
17
18
|
productImage: {
|
|
18
19
|
position: "relative";
|
|
19
20
|
display: "flex";
|
|
20
21
|
aspectRatio: number;
|
|
21
|
-
|
|
22
|
-
justifyContent: "space-between";
|
|
23
|
-
width: number;
|
|
24
|
-
height: number;
|
|
22
|
+
width: "100%";
|
|
25
23
|
};
|
|
26
24
|
detailsContainer: {
|
|
27
25
|
display: "none" | "flex";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"product-card.styles.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,eAAO,MAAM,oBAAoB,GAC/B,UAAS,kBAA2B,EACpC,cAAc,MAAM
|
|
1
|
+
{"version":3,"file":"product-card.styles.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,eAAO,MAAM,oBAAoB,GAC/B,UAAS,kBAA2B,EACpC,cAAc,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoHrB,CAAC"}
|
|
@@ -23,22 +23,20 @@ export const useProductCardStyles = (variant = "grid", customWidth) => {
|
|
|
23
23
|
maxWidth: 184,
|
|
24
24
|
flexDirection: "column",
|
|
25
25
|
alignItems: "stretch",
|
|
26
|
+
justifyContent: "center",
|
|
26
27
|
},
|
|
27
28
|
imageContainer: {
|
|
28
29
|
borderRadius: 0,
|
|
29
30
|
display: "flex",
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
alignItems: "
|
|
31
|
+
flex: 1,
|
|
32
|
+
justifyContent: "center",
|
|
33
|
+
alignItems: "center",
|
|
33
34
|
},
|
|
34
35
|
productImage: {
|
|
35
36
|
position: "relative",
|
|
36
37
|
display: "flex",
|
|
37
38
|
aspectRatio: 1,
|
|
38
|
-
|
|
39
|
-
justifyContent: "space-between",
|
|
40
|
-
width: cardWidth,
|
|
41
|
-
height: cardWidth,
|
|
39
|
+
width: "100%",
|
|
42
40
|
},
|
|
43
41
|
detailsContainer: {
|
|
44
42
|
display: variant === "lastViewed" ? "none" : "flex",
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { StyleProp, ViewStyle } from "react-native";
|
|
2
2
|
export type ProductCardVariant = "grid" | "shelf" | "lastViewed";
|
|
3
3
|
export interface ProductCardProps {
|
|
4
4
|
variant?: ProductCardVariant;
|
|
5
5
|
imageUrl: string;
|
|
6
6
|
brand: string;
|
|
7
7
|
productName: string;
|
|
8
|
-
rating
|
|
9
|
-
reviewCount
|
|
8
|
+
rating?: number;
|
|
9
|
+
reviewCount?: number;
|
|
10
10
|
price: string | number;
|
|
11
11
|
isFavorite?: boolean;
|
|
12
12
|
onFavoritePress?: () => void;
|
|
@@ -21,6 +21,6 @@ export interface ProductCardProps {
|
|
|
21
21
|
showFavoriteButton?: boolean;
|
|
22
22
|
showRating?: boolean;
|
|
23
23
|
isLoadingFavorite?: boolean;
|
|
24
|
-
customStyles?:
|
|
24
|
+
customStyles?: StyleProp<ViewStyle>;
|
|
25
25
|
}
|
|
26
26
|
//# sourceMappingURL=product-card.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"product-card.types.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"product-card.types.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,GAAG,YAAY,CAAC;AAEjE,MAAM,WAAW,gBAAgB;IAC/B,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd,EAAE,CAAC;IACJ,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CACrC"}
|