decathlon-ui 0.3.3 → 0.3.5

package/dist/components/button/button.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAiB,MAAM,gBAAgB,CAAC;AAsC5D,eAAO,MAAM,MAAM,yCAA8B,CAAC"}
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAiB,MAAM,gBAAgB,CAAC;AAqC5D,eAAO,MAAM,MAAM,yCAA8B,CAAC"}

package/dist/components/button/button.component.js

@@ -12,9 +12,7 @@ const ButtonComponent = ({ label, loading, variant, fullWidth, size, disabled, .
     });
     const { icon: Icon } = rest;
     const { colors } = useTheme();
-    return (_jsx(TouchableOpacity, { style: [buttonStyle.container, disabled && buttonStyle.disabled], ...rest, children: loading ? (
-        // <ActivityIndicator color="#fff" size="small" animating={true} />
-        _jsx(Loading, { size: 28, containerStyle: { padding: 0 } })) : (_jsxs(_Fragment, { children: [rest.icon && _jsx(Icon, { stroke: 0.5, color: colors.backgroundAction1 }), _jsx(Text, { style: buttonStyle.buttonText, children: label })] })) }));
+    return (_jsx(TouchableOpacity, { style: [buttonStyle.container, disabled && buttonStyle.disabled], ...rest, children: loading ? (_jsx(Loading, { size: 28, containerStyle: { padding: 0 } })) : (_jsxs(_Fragment, { children: [rest.icon && _jsx(Icon, { stroke: 0.5, color: colors.backgroundAction1 }), _jsx(Text, { style: buttonStyle.buttonText, children: label })] })) }));
 };
 export const Button = React.memo(ButtonComponent);
 Button.displayName = "Button";

package/dist/components/button/button.props.d.ts

@@ -1,3 +1,4 @@
+import { TouchableOpacityProps } from "react-native";
 export type ButtonProps = {
     onPress?: () => void;
     label?: string;
@@ -5,9 +6,9 @@ export type ButtonProps = {
     variant?: "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "converted" | "danger" | "danger-inverted" | "danger-outline";
     fullWidth?: boolean;
     size?: "small" | "medium" | "large";
-    icon?: any;
+    icon?: React.ReactNode | React.ReactElement | any;
     disabled?: boolean;
-};
+} & TouchableOpacityProps;
 export declare enum ButtonVariant {
     primary = "primary",
     primaryInverted = "primary-inverted",

package/dist/components/button/button.props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.props.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.props.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EACJ,SAAS,GACT,kBAAkB,GAClB,WAAW,GACX,oBAAoB,GACpB,WAAW,GACX,QAAQ,GACR,iBAAiB,GACjB,gBAAgB,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,aAAa;IACvB,OAAO,YAAY;IACnB,eAAe,qBAAqB;IACpC,SAAS,cAAc;IACvB,iBAAiB,uBAAuB;IACxC,SAAS,cAAc;IACvB,MAAM,WAAW;IACjB,cAAc,oBAAoB;IAClC,aAAa,mBAAmB;CACjC;AAED,oBAAY,UAAU;IACpB,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB"}
+{"version":3,"file":"button.props.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.props.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAErD,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EACJ,SAAS,GACT,kBAAkB,GAClB,WAAW,GACX,oBAAoB,GACpB,WAAW,GACX,QAAQ,GACR,iBAAiB,GACjB,gBAAgB,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC;IAClD,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,qBAAqB,CAAC;AAE1B,oBAAY,aAAa;IACvB,OAAO,YAAY;IACnB,eAAe,qBAAqB;IACpC,SAAS,cAAc;IACvB,iBAAiB,uBAAuB;IACxC,SAAS,cAAc;IACvB,MAAM,WAAW;IACjB,cAAc,oBAAoB;IAClC,aAAa,mBAAmB;CACjC;AAED,oBAAY,UAAU;IACpB,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB"}

package/dist/components/filter-chip/filter-chip.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.component.d.ts","sourceRoot":"","sources":["../../../src/components/filter-chip/filter-chip.component.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAmEtD,eAAO,MAAM,UAAU,6CAAkC,CAAC"}
+{"version":3,"file":"filter-chip.component.d.ts","sourceRoot":"","sources":["../../../src/components/filter-chip/filter-chip.component.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAkEtD,eAAO,MAAM,UAAU,6CAAkC,CAAC"}

package/dist/components/filter-chip/filter-chip.component.js

@@ -13,7 +13,7 @@ const FilterChipComponent = ({ label, selected = false, count, onPress, style, t
     const renderContent = () => {
         // Caso 1: Chip com ícone de filtro e contador (sem label)
         if (!label && count !== undefined) {
-            return (_jsxs(View, { style: styles.countContainer, children: [_jsx(SlidersIcon, { color: selected ? theme.colors.textPrimary : theme.colors.textSecondary, size: 20, style: styles.icon }), _jsx(Text, { style: styles.countText, children: count })] }));
+            return (_jsxs(View, { style: styles.countContainer, children: [_jsx(SlidersIcon, { color: selected ? theme.colors.textPrimary : theme.colors.textSecondary, size: 20, style: styles.icon }), count > 0 && _jsx(Text, { style: styles.countText, children: count })] }));
         }
         // Caso 2: Chip com label e botão de ação (+ ou X)
         if (label) {

package/dist/components/filter-chip/filter-chip.styles.d.ts

@@ -5,7 +5,7 @@ export declare const useFilterChipStyles: (variant?: FilterChipVariant) => {
         flexDirection: "row";
         alignItems: "center";
         paddingHorizontal: 16;
-        paddingVertical: 12;
+        paddingVertical: 16;
         borderRadius: 360;
         borderWidth: 1;
         backgroundColor: "#FFFFFF";
@@ -22,14 +22,12 @@ export declare const useFilterChipStyles: (variant?: FilterChipVariant) => {
         color: "#101010";
         fontFamily: "Inter-Medium";
         fontSize: 14;
-        marginLeft: 8;
-    };
-    icon: {
-        marginRight: 4;
     };
+    icon: {};
     countContainer: {
         flexDirection: "row";
         alignItems: "center";
+        gap: 8;
     };
     actionIcon: {
         marginLeft: 8;
@@ -39,7 +37,7 @@ export declare const useFilterChipStyles: (variant?: FilterChipVariant) => {
         flexDirection: "row";
         alignItems: "center";
         paddingHorizontal: 16;
-        paddingVertical: 12;
+        paddingVertical: 16;
         borderRadius: 360;
         borderWidth: 1;
         borderColor: "#D9DDE1";
@@ -53,18 +51,16 @@ export declare const useFilterChipStyles: (variant?: FilterChipVariant) => {
         lineHeight: number;
         letterSpacing: number;
     };
-    icon: {
-        marginRight: 4;
-    };
+    icon: {};
     countContainer: {
         flexDirection: "row";
         alignItems: "center";
+        gap: 8;
     };
     countText: {
         fontFamily: "Inter-Medium";
         fontSize: 14;
         color: "#101010";
-        marginLeft: 8;
     };
     actionIcon: {
         marginLeft: 8;

package/dist/components/filter-chip/filter-chip.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filter-chip.styles.d.ts","sourceRoot":"","sources":["../../../src/components/filter-chip/filter-chip.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,eAAO,MAAM,mBAAmB,GAAI,UAAS,iBAA6B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFzE,CAAC"}
+{"version":3,"file":"filter-chip.styles.d.ts","sourceRoot":"","sources":["../../../src/components/filter-chip/filter-chip.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,eAAO,MAAM,mBAAmB,GAAI,UAAS,iBAA6B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiFzE,CAAC"}

package/dist/components/filter-chip/filter-chip.styles.js

@@ -9,7 +9,7 @@ export const useFilterChipStyles = (variant = "default") => {
                 flexDirection: "row",
                 alignItems: "center",
                 paddingHorizontal: theme.spacing.md,
-                paddingVertical: theme.spacing.sm,
+                paddingVertical: theme.spacing.md,
                 borderRadius: theme.radius.round,
                 borderWidth: theme.borderWidth.sm,
                 borderColor: theme.colors.borderSecondary,
@@ -23,18 +23,17 @@ export const useFilterChipStyles = (variant = "default") => {
                 lineHeight: 21,
                 letterSpacing: 0,
             },
-            icon: {
-                marginRight: theme.spacing.xxs,
-            },
+            icon: {},
             countContainer: {
                 flexDirection: "row",
                 alignItems: "center",
+                gap: theme.spacing.xs,
             },
             countText: {
                 fontFamily: theme.fonts.inter.medium,
                 fontSize: theme.fonts.sizes.xs,
                 color: theme.colors.textPrimary,
-                marginLeft: theme.spacing.xs,
+                // marginLeft: theme.spacing.xs,
             },
             actionIcon: {
                 marginLeft: theme.spacing.xs,

package/dist/components/input/input.component.d.ts

@@ -2,7 +2,7 @@ import * as React from "react";
 import { TextInputProps } from "react-native";
 type MaskType = "cpf" | "phone" | "date" | "cep" | "custom";
 interface InputProps extends TextInputProps {
-    label: string;
+    label?: string;
     placeholder?: string;
     error?: string;
     value?: string;

package/dist/components/input/input.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAA6B,cAAc,EAAQ,MAAM,cAAc,CAAC;AAK/E,KAAK,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,UAAU,UAAW,SAAQ,cAAc;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AA2KD,eAAO,MAAM,KAAK,wCAA6B,CAAC"}
+{"version":3,"file":"input.component.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAA6B,cAAc,EAAQ,MAAM,cAAc,CAAC;AAK/E,KAAK,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,UAAU,UAAW,SAAQ,cAAc;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AA2KD,eAAO,MAAM,KAAK,wCAA6B,CAAC"}

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;AAgJ7D,eAAO,MAAM,WAAW,8CAAmC,CAAC"}

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

@@ -4,8 +4,8 @@ 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 = [], }) => {
+    const styles = useProductCardStyles(variant, width);
     const handleFavoritePress = React.useCallback((e) => {
         e.stopPropagation();
         onFavoritePress === null || onFavoritePress === void 0 ? void 0 : onFavoritePress();
@@ -14,7 +14,7 @@ const ProductCardComponent = ({ variant = "grid", imageUrl, brand, productName,
                         (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: [
                             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: [variant !== "shelf" && _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" && (_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,6 +11,7 @@ export interface ProductCardProps {
     onFavoritePress?: () => void;
     onPress?: () => void;
     testID?: string;
+    width?: number;
     flags?: {
         name: string;
         icon: string;

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;CACL"}

package/package.json

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