decathlon-ui 0.3.4 → 0.3.6

package/dist/components/product-card/product-card.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"product-card.component.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AA+I7D,eAAO,MAAM,WAAW,8CAAmC,CAAC"}
+{"version":3,"file":"product-card.component.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAkJ7D,eAAO,MAAM,WAAW,8CAAmC,CAAC"}

package/dist/components/product-card/product-card.component.js

@@ -4,17 +4,17 @@ import { Image, Text, TouchableOpacity, View } from "react-native";
 import { HeartIcon, StarIcon } from "../../icons";
 import { Badge } from "../badge";
 import { useProductCardStyles } from "./product-card.styles";
-const ProductCardComponent = ({ variant = "grid", imageUrl, brand, productName, rating, reviewCount, price, isFavorite = false, onFavoritePress, onPress, testID, flags = [], }) => {
-    const styles = useProductCardStyles(variant);
+const ProductCardComponent = ({ variant = "grid", imageUrl, brand, productName, rating, reviewCount, price, isFavorite = false, onFavoritePress, onPress, testID, width, flags = [], showFavoriteButton = true, showRating = true, }) => {
+    const styles = useProductCardStyles(variant, width);
     const handleFavoritePress = React.useCallback((e) => {
         e.stopPropagation();
         onFavoritePress === null || onFavoritePress === void 0 ? void 0 : onFavoritePress();
     }, [onFavoritePress]);
     const renderContent = React.useCallback(() => (_jsxs(View, { style: styles.cardContainer, 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) &&
                         (flags === null || flags === void 0 ? void 0 : flags.length) > 0 &&
-                        (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)))), variant === "grid" && (_jsx(TouchableOpacity, { style: [
+                        (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)))), variant === "grid" && showFavoriteButton && (_jsx(TouchableOpacity, { style: [
                             isFavorite ? styles.favoriteButton : styles.unfavoriteButton,
-                        ], onPress: handleFavoritePress, accessibilityLabel: isFavorite ? "Remover dos favoritos" : "Adicionar aos favoritos", accessibilityRole: "button", children: _jsx(HeartIcon, { size: 20, color: "#101010", fill: isFavorite ? "#101010" : "transparent" }) }))] }), 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" && (_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 }) })] }))] })), [
+                        ], onPress: handleFavoritePress, accessibilityLabel: isFavorite ? "Remover dos favoritos" : "Adicionar aos favoritos", accessibilityRole: "button", children: _jsx(HeartIcon, { size: 20, color: "#101010", fill: isFavorite ? "#101010" : "transparent" }) }))] }), 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 }) })] }))] })), [
         brand,
         handleFavoritePress,
         imageUrl,

package/dist/components/product-card/product-card.styles.d.ts

@@ -1,7 +1,8 @@
 import type { ProductCardVariant } from "./product-card.types";
-export declare const useProductCardStyles: (variant?: ProductCardVariant) => {
+export declare const useProductCardStyles: (variant?: ProductCardVariant, customWidth?: number) => {
     cardContainer: {
         display: "flex";
+        width: number;
         maxWidth: number;
         flexDirection: "column";
         alignItems: "stretch";
@@ -94,7 +95,7 @@ export declare const useProductCardStyles: (variant?: ProductCardVariant) => {
         color: string;
     };
     touchable: {
-        width: "100%";
+        width: number;
         maxWidth: number;
     };
 };

package/dist/components/product-card/product-card.styles.d.ts.map

@@ -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,GAAI,UAAS,kBAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoHxE,CAAC"}
+{"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyHrB,CAAC"}

package/dist/components/product-card/product-card.styles.js

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
 import { StyleSheet } from "react-native";
-export const useProductCardStyles = (variant = "grid") => {
+export const useProductCardStyles = (variant = "grid", customWidth) => {
     return useMemo(() => {
         const getImageSize = () => {
             switch (variant) {
@@ -13,10 +13,14 @@ export const useProductCardStyles = (variant = "grid") => {
             }
         };
         const imageSize = getImageSize();
+        const cardWidth = customWidth
+            ? Math.max(customWidth, imageSize)
+            : imageSize;
         return StyleSheet.create({
             cardContainer: {
                 display: "flex",
-                maxWidth: imageSize,
+                width: cardWidth,
+                maxWidth: cardWidth,
                 flexDirection: "column",
                 alignItems: "stretch",
             },
@@ -33,8 +37,8 @@ export const useProductCardStyles = (variant = "grid") => {
                 aspectRatio: 1,
                 gap: 20,
                 justifyContent: "space-between",
-                width: imageSize,
-                height: imageSize,
+                width: cardWidth,
+                height: cardWidth,
             },
             detailsContainer: {
                 display: variant === "lastViewed" ? "none" : "flex",
@@ -108,9 +112,9 @@ export const useProductCardStyles = (variant = "grid") => {
                 color: "#383838",
             },
             touchable: {
-                width: "100%",
-                maxWidth: imageSize,
+                width: cardWidth,
+                maxWidth: cardWidth,
             },
         });
-    }, [variant]);
+    }, [variant, customWidth]);
 };

package/dist/components/product-card/product-card.types.d.ts

@@ -11,10 +11,13 @@ export interface ProductCardProps {
     onFavoritePress?: () => void;
     onPress?: () => void;
     testID?: string;
+    width?: number;
     flags?: {
         name: string;
         icon: string;
         text: string;
     }[];
+    showFavoriteButton?: boolean;
+    showRating?: boolean;
 }
 //# sourceMappingURL=product-card.types.d.ts.map

package/dist/components/product-card/product-card.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"product-card.types.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.types.ts"],"names":[],"mappings":"AAAA,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,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,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;QACN,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACd,EAAE,CAAC;CACL"}
+{"version":3,"file":"product-card.types.d.ts","sourceRoot":"","sources":["../../../src/components/product-card/product-card.types.ts"],"names":[],"mappings":"AAAA,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,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,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;CACtB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "decathlon-ui",
-  "version": "0.3.4",
+  "version": "0.3.6",
   "description": "Biblioteca de componentes React Native com Storybook e documentação via GitHub Pages.",
   "main": "dist/index.js",
   "module": "dist/index.js",