decathlon-ui 0.1.2 → 0.1.4

package/dist/components/radio/radio.styles.js

@@ -0,0 +1,59 @@
+import { useMemo } from "react";
+import { StyleSheet } from "react-native";
+import { useTheme } from "../../themes";
+export const useRadioStyles = () => {
+    const { colors, spacing } = useTheme();
+    return useMemo(() => StyleSheet.create({
+        container: {
+            gap: spacing.sm,
+        },
+        optionContainer: {
+            flexDirection: "row",
+            alignItems: "center",
+            gap: spacing.xs,
+        },
+        radio: {
+            width: 20,
+            height: 20,
+            borderRadius: 10,
+            borderWidth: 2,
+            borderColor: colors.textPrimary,
+            justifyContent: "center",
+            alignItems: "center",
+        },
+        radioDisabled: {
+            borderColor: colors.textDisabled,
+        },
+        radioSelected: {
+            borderColor: colors.textAction,
+        },
+        radioError: {
+            borderColor: colors.textError,
+        },
+        dot: {
+            width: 10,
+            height: 10,
+            borderRadius: 5,
+            backgroundColor: colors.textAction,
+        },
+        dotDisabled: {
+            backgroundColor: colors.textDisabled,
+        },
+        label: {
+            color: colors.textPrimary,
+            fontSize: 14,
+            lineHeight: 20,
+        },
+        labelDisabled: {
+            color: colors.textDisabled,
+        },
+        labelError: {
+            color: colors.textError,
+        },
+        errorText: {
+            color: colors.textError,
+            fontSize: 12,
+            marginTop: spacing.xs,
+        },
+    }), [colors, spacing]);
+};

package/dist/components/radio/radio.types.d.ts

@@ -0,0 +1,14 @@
+export interface RadioOption {
+    label: string;
+    value: string;
+}
+export interface RadioProps {
+    label: string;
+    value: string;
+    selected?: boolean;
+    onChange?: (value: string) => void;
+    disabled?: boolean;
+    error?: boolean;
+    testID?: string;
+}
+//# sourceMappingURL=radio.types.d.ts.map

package/dist/components/radio/radio.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.types.d.ts","sourceRoot":"","sources":["../../../src/components/radio/radio.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/components/radio/radio.types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/range-slider/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./range-slider.component";
+export * from "./range-slider.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/range-slider/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC"}

package/dist/components/range-slider/index.js

@@ -0,0 +1,2 @@
+export * from "./range-slider.component";
+export * from "./range-slider.types";

package/dist/components/range-slider/range-slider.component.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { RangeSliderProps } from "./range-slider.types";
+export declare const RangeSlider: React.FC<RangeSliderProps>;
+//# sourceMappingURL=range-slider.component.d.ts.map

package/dist/components/range-slider/range-slider.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"range-slider.component.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAQxD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6JlD,CAAC"}

package/dist/components/range-slider/range-slider.component.js

@@ -0,0 +1,121 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Animated, PanResponder, Platform, UIManager, View } from "react-native";
+import { useRangeSliderStyles } from "./range-slider.styles";
+if (Platform.OS === 'android') {
+    if (UIManager.setLayoutAnimationEnabledExperimental) {
+        UIManager.setLayoutAnimationEnabledExperimental(true);
+    }
+}
+export const RangeSlider = ({ value = [0, 100], min = 0, max = 100, disabled, selected, error, onChangeValue, testID, }) => {
+    const styles = useRangeSliderStyles();
+    // Referência para o container do slider
+    const sliderContainerRef = React.useRef(null);
+    // Estado para valores do slider
+    const [sliderWidth, setSliderWidth] = React.useState(343);
+    const [leftValue, setLeftValue] = React.useState(value[0] || min);
+    const [rightValue, setRightValue] = React.useState(value[1] || max);
+    // Valores animados para as posições dos thumbs
+    const leftThumbPosition = React.useRef(new Animated.Value(0)).current;
+    const rightThumbPosition = React.useRef(new Animated.Value(sliderWidth)).current;
+    // Atualiza os valores quando as props mudam
+    React.useEffect(() => {
+        if (value && value.length === 2) {
+            setLeftValue(value[0]);
+            setRightValue(value[1]);
+        }
+    }, [value]);
+    // Atualiza as posições dos thumbs quando o tamanho do slider muda ou os valores mudam
+    React.useEffect(() => {
+        // Garante que os valores estejam dentro dos limites
+        const clampedLeftValue = Math.max(min, Math.min(max, leftValue));
+        const clampedRightValue = Math.max(min, Math.min(max, rightValue));
+        // Calcula a porcentagem relativa ao intervalo min-max
+        const leftPercentage = (clampedLeftValue - min) / (max - min);
+        const rightPercentage = (clampedRightValue - min) / (max - min);
+        // Calcula a posição em pixels
+        const leftPos = leftPercentage * sliderWidth;
+        const rightPos = rightPercentage * sliderWidth;
+        // Atualiza as posições dos thumbs
+        leftThumbPosition.setValue(leftPos);
+        rightThumbPosition.setValue(rightPos);
+    }, [sliderWidth, leftValue, rightValue, min, max]);
+    // Função para obter a posição X relativa ao slider
+    const getPositionInSlider = (gestureState) => {
+        return new Promise((resolve) => {
+            if (sliderContainerRef.current) {
+                sliderContainerRef.current.measure((x, y, width, height, pageX, pageY) => {
+                    const touchX = gestureState.moveX - pageX;
+                    const position = Math.max(0, Math.min(sliderWidth, touchX));
+                    resolve(position);
+                });
+            }
+            else {
+                resolve(Math.max(0, Math.min(sliderWidth, gestureState.moveX)));
+            }
+        });
+    };
+    // Converte posição para valor real
+    const positionToValue = (position) => {
+        const percentage = position / sliderWidth;
+        const value = min + percentage * (max - min);
+        return Math.round(value);
+    };
+    // Cria os pan responders para ambos os thumbs
+    const createPanResponder = (isLeft) => PanResponder.create({
+        onStartShouldSetPanResponder: () => !disabled,
+        onMoveShouldSetPanResponder: () => !disabled,
+        onPanResponderGrant: () => {
+            // Feedback visual pode ser adicionado aqui
+        },
+        onPanResponderMove: async (_, gestureState) => {
+            if (disabled)
+                return;
+            const newPosition = await getPositionInSlider(gestureState);
+            const newValue = positionToValue(newPosition);
+            if (isLeft) {
+                if (newValue < rightValue) {
+                    setLeftValue(newValue);
+                    // A posição é calculada com base na porcentagem do intervalo
+                    const leftPos = ((newValue - min) / (max - min)) * sliderWidth;
+                    leftThumbPosition.setValue(leftPos);
+                    if (onChangeValue) {
+                        onChangeValue([newValue, rightValue]);
+                    }
+                }
+            }
+            else {
+                if (newValue > leftValue) {
+                    setRightValue(newValue);
+                    // A posição é calculada com base na porcentagem do intervalo
+                    const rightPos = ((newValue - min) / (max - min)) * sliderWidth;
+                    rightThumbPosition.setValue(rightPos);
+                    if (onChangeValue) {
+                        onChangeValue([leftValue, newValue]);
+                    }
+                }
+            }
+        },
+        onPanResponderRelease: () => {
+            // Feedback ao soltar pode ser adicionado aqui
+        }
+    });
+    const leftPanResponder = createPanResponder(true);
+    const rightPanResponder = createPanResponder(false);
+    return (_jsxs(View, { ref: sliderContainerRef, style: [
+            styles.sliderContainer,
+            disabled && { opacity: 0.5 }
+        ], onLayout: (event) => setSliderWidth(event.nativeEvent.layout.width), testID: testID, children: [_jsx(View, { style: styles.sliderTrack }), _jsx(Animated.View, { style: [
+                    styles.sliderFilledTrack,
+                    {
+                        left: leftThumbPosition,
+                        right: Animated.subtract(sliderWidth, rightThumbPosition),
+                    },
+                ] }), _jsx(Animated.View, { ...leftPanResponder.panHandlers, style: [
+                    styles.thumb,
+                    { transform: [{ translateX: leftThumbPosition }] },
+                ], children: _jsx(View, { style: styles.thumbDot }) }), _jsx(Animated.View, { ...rightPanResponder.panHandlers, style: [
+                    styles.thumb,
+                    { transform: [{ translateX: rightThumbPosition }] },
+                ], children: _jsx(View, { style: styles.thumbDot }) })] }));
+};

package/dist/components/range-slider/range-slider.styles.d.ts

@@ -0,0 +1,36 @@
+export declare const useRangeSliderStyles: () => {
+    sliderContainer: {
+        height: number;
+        width: "100%";
+        marginVertical: number;
+    };
+    sliderTrack: {
+        position: "absolute";
+        top: number;
+        height: number;
+        backgroundColor: string;
+    };
+    sliderFilledTrack: {
+        position: "absolute";
+        top: number;
+        height: number;
+        backgroundColor: "#3643BA";
+    };
+    thumb: {
+        position: "absolute";
+        top: number;
+        width: number;
+        height: number;
+        backgroundColor: "#3643BA";
+        borderRadius: number;
+        justifyContent: "center";
+        alignItems: "center";
+    };
+    thumbDot: {
+        width: number;
+        height: number;
+        backgroundColor: string;
+        borderRadius: number;
+    };
+};
+//# sourceMappingURL=range-slider.styles.d.ts.map

package/dist/components/range-slider/range-slider.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"range-slider.styles.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsChC,CAAC"}

package/dist/components/range-slider/range-slider.styles.js

@@ -0,0 +1,40 @@
+import { StyleSheet } from "react-native";
+import { useTheme } from "../../themes";
+export const useRangeSliderStyles = () => {
+    const theme = useTheme();
+    return StyleSheet.create({
+        sliderContainer: {
+            height: 40,
+            width: "100%",
+            marginVertical: 20,
+        },
+        sliderTrack: {
+            position: "absolute",
+            top: 18,
+            height: 2,
+            backgroundColor: "#d9dde1",
+        },
+        sliderFilledTrack: {
+            position: "absolute",
+            top: 18,
+            height: 2,
+            backgroundColor: theme.colors.backgroundAction1,
+        },
+        thumb: {
+            position: "absolute",
+            top: 8,
+            width: 20,
+            height: 20,
+            backgroundColor: theme.colors.backgroundAction1,
+            borderRadius: 10,
+            justifyContent: "center",
+            alignItems: "center",
+        },
+        thumbDot: {
+            width: 4,
+            height: 4,
+            backgroundColor: "white",
+            borderRadius: 2,
+        },
+    });
+};

package/dist/components/range-slider/range-slider.types.d.ts

@@ -0,0 +1,11 @@
+export interface RangeSliderProps {
+    value?: [number, number];
+    min?: number;
+    max?: number;
+    disabled?: boolean;
+    selected?: boolean;
+    error?: boolean;
+    onChangeValue?: (value: [number, number]) => void;
+    testID?: string;
+}
+//# sourceMappingURL=range-slider.types.d.ts.map

package/dist/components/range-slider/range-slider.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"range-slider.types.d.ts","sourceRoot":"","sources":["../../../src/components/range-slider/range-slider.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAClD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/components/range-slider/range-slider.types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/search-button/index.d.ts

@@ -0,0 +1,4 @@
+import SearchButton from "./search-button.component";
+export type { SearchButtonProps } from "./search-button.types";
+export { SearchButton };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/search-button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/search-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,2BAA2B,CAAC;AAErD,YAAY,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/dist/components/search-button/index.js

@@ -0,0 +1,2 @@
+import SearchButton from "./search-button.component";
+export { SearchButton };

package/dist/components/search-button/search-button.component.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { SearchButtonProps } from "./search-button.props";
+declare const SearchButton: React.FC<SearchButtonProps>;
+export default SearchButton;
+//# sourceMappingURL=search-button.component.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"search-button.component.d.ts","sourceRoot":"","sources":["../../../src/components/search-button/search-button.component.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAG1D,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAY7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

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

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text, TouchableOpacity } from "react-native";
+import { SearchIcon } from "../../icons";
+import { useSearchButtonStyles } from "./search-button.styles";
+const SearchButton = ({ onPress, label = "Buscar", }) => {
+    const styles = useSearchButtonStyles();
+    return (_jsxs(TouchableOpacity, { style: styles.container, onPress: onPress, children: [_jsx(SearchIcon, { size: 20, color: "#3E4751" }), _jsx(Text, { style: styles.label, children: label })] }));
+};
+export default SearchButton;

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

@@ -0,0 +1,5 @@
+export type SearchButtonProps = {
+    onPress?: () => void;
+    label?: string;
+};
+//# sourceMappingURL=search-button.props.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"search-button.props.d.ts","sourceRoot":"","sources":["../../../src/components/search-button/search-button.props.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}

package/dist/components/search-button/search-button.props.js

@@ -0,0 +1 @@
+export {};

package/dist/components/search-button/search-button.styles.d.ts

@@ -0,0 +1,21 @@
+export declare const useSearchButtonStyles: () => {
+    container: {
+        flexDirection: "row";
+        justifyContent: "center";
+        alignItems: "center";
+        padding: 16;
+        gap: 8;
+        backgroundColor: "#F7F8F9";
+        borderWidth: number;
+        borderColor: string;
+        borderRadius: 360;
+        height: 48;
+    };
+    label: {
+        fontFamily: "Inter-Regular";
+        fontSize: 14;
+        lineHeight: number;
+        color: string;
+    };
+};
+//# sourceMappingURL=search-button.styles.d.ts.map

package/dist/components/search-button/search-button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/search-button/search-button.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;CAuBjC,CAAC"}

package/dist/components/search-button/search-button.styles.js

@@ -0,0 +1,25 @@
+import { StyleSheet } from "react-native";
+import { useTheme } from "../../themes";
+export const useSearchButtonStyles = () => {
+    const theme = useTheme();
+    return StyleSheet.create({
+        container: {
+            flexDirection: "row",
+            justifyContent: "center",
+            alignItems: "center",
+            padding: theme.spacing.md,
+            gap: theme.spacing.xs,
+            backgroundColor: theme.colors.backgroundSecondary,
+            borderWidth: 1,
+            borderColor: "#E1E4E7",
+            borderRadius: theme.radius.round,
+            height: theme.inputHeight.sm,
+        },
+        label: {
+            fontFamily: theme.fonts.inter.regular,
+            fontSize: theme.fonts.sizes.xs,
+            lineHeight: 21,
+            color: "#3E4751",
+        },
+    });
+};

package/dist/components/search-button/search-button.types.d.ts

@@ -0,0 +1,4 @@
+export interface SearchButtonProps {
+    onPress?: () => void;
+}
+//# sourceMappingURL=search-button.types.d.ts.map

package/dist/components/search-button/search-button.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"search-button.types.d.ts","sourceRoot":"","sources":["../../../src/components/search-button/search-button.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,iBAAiB;IAChC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/dist/components/search-button/search-button.types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/seller-box/index.d.ts

@@ -0,0 +1,3 @@
+export { SellerBox } from "./seller-box.component";
+export type { SellerBox1PProps, SellerBox3PProps, SellerBoxProps, SellerType, } from "./seller-box.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/seller-box/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/seller-box/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,YAAY,EACV,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,EACd,UAAU,GACX,MAAM,oBAAoB,CAAC"}

package/dist/components/seller-box/index.js

@@ -0,0 +1 @@
+export { SellerBox } from "./seller-box.component";

package/dist/components/seller-box/seller-box.component.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import type { SellerBoxProps } from "./seller-box.types";
+export declare const SellerBox: React.FC<SellerBoxProps>;
+//# sourceMappingURL=seller-box.component.d.ts.map

package/dist/components/seller-box/seller-box.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seller-box.component.d.ts","sourceRoot":"","sources":["../../../src/components/seller-box/seller-box.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,oBAAoB,CAAC;AAgG5B,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA2B9C,CAAC"}

package/dist/components/seller-box/seller-box.component.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text, TouchableOpacity, View } from "react-native";
+import { CheckCircleIcon } from "../../icons";
+import { useSellerBoxStyles } from "./seller-box.styles";
+const Seller1PCard = ({ cashbackText, cashbackDescription, onSaibaMaisPress, }) => {
+    const styles = useSellerBoxStyles();
+    return (_jsxs(View, { style: styles.card, children: [_jsx(Text, { style: styles.title, children: "Vendido e entregue por Decathlon" }), _jsx(Text, { style: styles.description, children: cashbackDescription }), _jsx(View, { style: styles.cashbackBadge, children: _jsx(Text, { style: styles.cashbackText, children: cashbackText }) }), onSaibaMaisPress && (_jsx(TouchableOpacity, { onPress: onSaibaMaisPress, accessibilityLabel: "Saiba mais sobre o vendedor", accessibilityRole: "button", children: _jsx(Text, { style: styles.saibaMais, children: "Saiba mais" }) }))] }));
+};
+const Seller3PCard = ({ partnerName, partnershipTime, isVerified, salesCount, salesPeriod, productsCount, onSaibaMaisPress, onPartnerNamePress, }) => {
+    const styles = useSellerBoxStyles();
+    return (_jsxs(View, { style: styles.card, children: [_jsxs(View, { style: { flexDirection: "row", alignItems: "baseline" }, children: [_jsx(Text, { style: styles.title, children: "Vendido e entregue por " }), _jsx(TouchableOpacity, { onPress: onPartnerNamePress, accessibilityLabel: `Ver detalhes do parceiro ${partnerName}`, accessibilityRole: "button", children: _jsx(Text, { style: styles.partnerName, children: partnerName }) })] }), _jsxs(Text, { style: styles.partnershipTime, children: ["Parceiro oficial ", partnershipTime] }), isVerified && (_jsxs(View, { style: styles.verifiedBadge, children: [_jsx(CheckCircleIcon, { size: 16, color: "#101010", fill: "#D3FFE3", style: styles.verifiedIcon }), _jsx(Text, { style: styles.verifiedText, children: "Vendedor verificado" })] })), _jsxs(Text, { style: styles.infoText, children: ["+ ", salesCount, " vendas nos \u00FAltimos ", salesPeriod] }), _jsxs(Text, { style: styles.infoText, children: [productsCount, " produtos em cat\u00E1logo"] }), onSaibaMaisPress && (_jsx(TouchableOpacity, { onPress: onSaibaMaisPress, style: { marginTop: 8 }, accessibilityLabel: "Saiba mais sobre o vendedor", accessibilityRole: "button", children: _jsx(Text, { style: styles.saibaMais, children: "Saiba mais" }) }))] }));
+};
+export const SellerBox = (props) => {
+    const styles = useSellerBoxStyles();
+    return (_jsx(View, { testID: props.testID, style: styles.container, children: _jsx(View, { style: styles.row, children: props.sellerType === "1P" ? (_jsx(Seller1PCard, { cashbackText: props.cashbackText, cashbackDescription: props.cashbackDescription, onSaibaMaisPress: props.onSaibaMaisPress })) : (_jsx(Seller3PCard, { partnerName: props.partnerName, partnershipTime: props.partnershipTime, isVerified: props.isVerified, salesCount: props.salesCount, salesPeriod: props.salesPeriod, productsCount: props.productsCount, onSaibaMaisPress: props.onSaibaMaisPress, onPartnerNamePress: props.onPartnerNamePress })) }) }));
+};

package/dist/components/seller-box/seller-box.styles.d.ts

@@ -0,0 +1,89 @@
+export declare const useSellerBoxStyles: () => {
+    container: {
+        width: "100%";
+    };
+    row: {
+        flexDirection: "row";
+        flexWrap: "wrap";
+    };
+    card: {
+        flex: number;
+        backgroundColor: "#FFFFFF";
+        padding: 16;
+        marginHorizontal: number;
+        minWidth: number;
+        borderWidth: number;
+        borderColor: "#B3BAC3";
+    };
+    title: {
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: "500";
+        color: string;
+        marginBottom: number;
+    };
+    partnerName: {
+        fontSize: number;
+        lineHeight: number;
+        fontWeight: "500";
+        color: string;
+        textDecorationLine: "underline";
+    };
+    description: {
+        fontSize: number;
+        lineHeight: number;
+        color: string;
+        marginBottom: number;
+    };
+    partnershipTime: {
+        fontSize: number;
+        lineHeight: number;
+        color: string;
+        marginBottom: number;
+    };
+    cashbackBadge: {
+        backgroundColor: string;
+        borderRadius: number;
+        paddingVertical: number;
+        paddingHorizontal: number;
+        alignSelf: "flex-start";
+        marginBottom: number;
+    };
+    verifiedBadge: {
+        backgroundColor: string;
+        borderRadius: number;
+        paddingVertical: number;
+        paddingHorizontal: number;
+        alignSelf: "flex-start";
+        marginBottom: number;
+        flexDirection: "row";
+        alignItems: "center";
+    };
+    cashbackText: {
+        fontSize: number;
+        fontWeight: "500";
+        color: string;
+    };
+    verifiedText: {
+        fontSize: number;
+        fontWeight: "500";
+        color: string;
+        marginLeft: number;
+    };
+    infoText: {
+        fontSize: number;
+        lineHeight: number;
+        color: string;
+        marginBottom: number;
+    };
+    saibaMais: {
+        fontSize: number;
+        fontWeight: "500";
+        color: string;
+        textDecorationLine: "underline";
+    };
+    verifiedIcon: {
+        marginRight: number;
+    };
+};
+//# sourceMappingURL=seller-box.styles.d.ts.map

package/dist/components/seller-box/seller-box.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seller-box.styles.d.ts","sourceRoot":"","sources":["../../../src/components/seller-box/seller-box.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8F9B,CAAC"}