@transfergratis/react-native-sdk 0.1.2

package/build/components/example/SelfieCaptureEx.js

@@ -0,0 +1,238 @@
+import { StyleSheet, View, Dimensions, Text, Animated, Image } from "react-native";
+import { EnhancedCameraView } from "../EnhancedCameraView";
+import Svg, { Rect, Path, Mask, Defs, LinearGradient, Stop } from 'react-native-svg';
+import React, { useEffect, useRef, useState } from 'react';
+const SelfieCaptureEx = () => {
+    const { width: screenWidth, height: screenHeight } = Dimensions.get('window');
+    const bbox = [20, 140, 370, 340]; // [xMin, yMin, xMax, yMax]
+    const [xMin, yMin, xMax, yMax] = bbox;
+    const boxWidth = xMax - xMin;
+    const boxHeight = yMax - yMin;
+    // Animations
+    // const instructionAnimation = useRef(new Animated.Value(0)).current;
+    const [cornerOpacity, setCornerOpacity] = useState(0.8);
+    const [scanLineX, setScanLineX] = useState({
+        val: yMin - (40 + 280),
+        direction: 'down'
+    });
+    const [imageUrl, setImageUrl] = useState(null);
+    const scanY = useRef(new Animated.Value(yMin)).current;
+    useEffect(() => {
+        // Animation boucle : descend puis remonte
+        Animated.loop(Animated.sequence([
+            Animated.timing(scanY, {
+                toValue: yMax,
+                duration: 2000,
+                useNativeDriver: false,
+            }),
+            Animated.timing(scanY, {
+                toValue: yMin,
+                duration: 2000,
+                useNativeDriver: false,
+            }),
+        ])).start();
+    }, [scanY, yMin, yMax]);
+    useEffect(() => {
+        // Animation des coins avec setState
+        const cornerInterval = setInterval(() => {
+            setCornerOpacity(prev => prev === 0.8 ? 1 : 0.8);
+        }, 800);
+        const scanLineInterval = setInterval(() => {
+            setScanLineX(prev => {
+                const newX = prev.val + (prev.direction === 'up' ? -1 : 1) * Math.round(Math.random() * 2); // Vitesse de déplacement horizontal 
+                if (prev.direction === "down") {
+                    if (newX > yMax - (280 - 40)) {
+                        return { val: yMax + (40), direction: 'up' };
+                    }
+                    else {
+                        return { val: newX, direction: 'down' };
+                    }
+                }
+                else {
+                    if (newX < yMin - (40)) {
+                        return { val: yMin - (40 + 280), direction: 'down' };
+                    }
+                    else {
+                        return { val: newX, direction: 'up' };
+                    }
+                }
+            });
+        }, 2); // Fréquence de mise à jour
+        // Démarrer les animations
+        return () => {
+            clearInterval(cornerInterval);
+            clearInterval(scanLineInterval);
+        };
+    }, [yMin, yMax]);
+    if (imageUrl) {
+        return (<View style={{
+                flex: 1,
+                justifyContent: 'center',
+                alignItems: 'center',
+            }}>
+
+               <View style={{
+                justifyContent: 'center',
+                alignItems: 'center',
+            }}>
+               <Image source={{ uri: imageUrl }} style={[styles.image,
+                {
+                    width: boxWidth,
+                    height: boxHeight,
+                    marginLeft: -xMin,
+                    marginTop: -yMin,
+                },
+            ]}/>
+               </View>
+
+            </View>);
+    }
+    return (<EnhancedCameraView showCamera={true} showSwitchCamera={false} bbox={{
+            xMin: 150,
+            yMin: 210,
+            xMax: 350,
+            yMax: 410,
+            borderColor: "#2DBD60",
+            borderWidth: 3,
+            cornerRadius: 8
+        }} onCapture={(image) => {
+            setImageUrl(image.path ?? null);
+        }} overlayComponent={<View style={StyleSheet.absoluteFill}>
+                    {/* <Animated.View
+                style={[
+                    styles.topIntruction,
+
+                ]}
+            >
+                <Text style={styles.topIntructionText}>
+                    💡 Alignez le code QR avec la zone de capture • déplacez la caméra pour ajuster la zone de capture • mesurez 100cm de hauteur.
+                </Text>
+            </Animated.View> */}
+
+                    <Svg height={screenHeight} width={screenWidth} style={styles.svg}>
+                        <Defs>
+                            <Mask id="cameraMask">
+                                {/* Fond blanc - zone visible */}
+                                <Rect x="0" y="0" width={screenWidth} height={screenHeight} fill="white"/>
+                                {/* Zone noire - zone masquée (transparente) */}
+                                <Rect x={xMin} y={yMin} width={boxWidth} height={boxHeight} fill="black"/>
+                            </Mask>
+                        </Defs>
+
+                        {/* Overlay semi-transparent avec masque */}
+                        <Rect x="0" y="0" width={screenWidth} height={screenHeight} fill="rgba(0, 0, 0, 0.5)" mask="url(#cameraMask)"/>
+
+                        {/* Coins de la zone de capture - arrondis avec animation */}
+                        <Path d={`M ${xMin + 15} ${yMin} Q ${xMin} ${yMin} ${xMin} ${yMin + 15} L ${xMin} ${yMin + 20}`} stroke="#4CAF50" strokeWidth="8" fill="none" opacity={cornerOpacity}/>
+                        <Path d={`M ${xMin + 20} ${yMin} L ${xMin + 15} ${yMin}`} stroke="#4CAF50" strokeWidth="8" opacity={cornerOpacity}/>
+
+                        <Path d={`M ${xMax - 15} ${yMin} Q ${xMax} ${yMin} ${xMax} ${yMin + 15} L ${xMax} ${yMin + 20}`} stroke="#4CAF50" strokeWidth="8" fill="none" opacity={cornerOpacity}/>
+                        <Path d={`M ${xMax - 20} ${yMin} L ${xMax - 15} ${yMin}`} stroke="#4CAF50" strokeWidth="8" opacity={cornerOpacity}/>
+
+                        <Path d={`M ${xMin + 15} ${yMax} Q ${xMin} ${yMax} ${xMin} ${yMax - 15} L ${xMin} ${yMax - 20}`} stroke="#4CAF50" strokeWidth="8" fill="none" opacity={cornerOpacity}/>
+                        <Path d={`M ${xMin + 20} ${yMax} L ${xMin + 15} ${yMax}`} stroke="#4CAF50" strokeWidth="8" opacity={cornerOpacity}/>
+
+                        <Path d={`M ${xMax - 15} ${yMax} Q ${xMax} ${yMax} ${xMax} ${yMax - 15} L ${xMax} ${yMax - 20}`} stroke="#4CAF50" strokeWidth="8" fill="none" opacity={cornerOpacity}/>
+                        <Path d={`M ${xMax - 20} ${yMax} L ${xMax - 15} ${yMax}`} stroke="#4CAF50" strokeWidth="8" opacity={cornerOpacity}/>
+
+                        <Defs>
+                            <LinearGradient id="grad-rect" x1="0%" y1={scanLineX.direction === 'up' ? "100%" : "0%"} x2="0%" y2={scanLineX.direction === 'up' ? "0%" : "100%"}>
+                                <Stop offset="70%" stopColor="#2DBD60" stopOpacity="0"/>
+                                <Stop offset="85%" stopColor="#2DBD60" stopOpacity="0.1"/>
+                                <Stop offset="88%" stopColor="#2DBD60" stopOpacity="0.15"/>
+                                <Stop offset="90%" stopColor="#2DBD60" stopOpacity="0.2"/>
+                                <Stop offset="100%" stopColor="#2DBD60" stopOpacity="1"/>
+                            </LinearGradient>
+                        </Defs>
+
+
+                        <Rect x="0" y={scanLineX.val} width={screenWidth} height="280" rx="0" ry="0" fill="url(#grad-rect)"/>
+                    </Svg>
+
+                    <View style={styles.bottomIntruction}>
+                        <Text style={styles.bottomTitle}>
+                            Mesurez 100cm de hauteur.
+                        </Text>
+                        <Text style={styles.bottomSubtitle}>
+                            Ne pas déplacer la caméra pendant la capture. • Ne pas déplacer la caméra pendant la capture.
+                        </Text>
+                    </View>
+                </View>}/>);
+};
+const styles = StyleSheet.create({
+    overlay: {
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        width: '100%',
+        height: '50%',
+        backgroundColor: 'rgba(0, 0, 0, 0.5)',
+    },
+    svg: {
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        width: '100%',
+        height: '100%',
+    },
+    topIntruction: {
+        zIndex: 1000,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        paddingVertical: 20,
+        paddingHorizontal: 10,
+        marginHorizontal: 20,
+        marginTop: 10,
+        backgroundColor: "#FDE04730",
+        borderColor: "#FDE047",
+        borderWidth: 1,
+        borderRadius: 10,
+        gap: 10,
+    },
+    topIntructionText: {
+        color: '#FDE047',
+        fontSize: 14,
+        fontWeight: 'bold',
+        textAlign: 'center',
+    },
+    bottomIntruction: {
+        position: 'absolute',
+        bottom: 0,
+        left: 0,
+        width: '100%',
+        height: '35%',
+        paddingHorizontal: 20,
+    },
+    bottomIntructionTextBold: {
+        color: 'white',
+        fontSize: 16,
+        fontWeight: 'bold',
+        textAlign: 'center',
+    },
+    bottomIntructionText: {
+        color: 'white',
+        fontSize: 14,
+        fontWeight: 'bold',
+        textAlign: 'center',
+    },
+    bottomTitle: {
+        color: 'white',
+        fontSize: 25,
+        fontWeight: 'bold',
+        textAlign: 'center',
+    },
+    bottomSubtitle: {
+        color: 'white',
+        marginTop: 15,
+        fontSize: 14,
+        fontWeight: '500',
+        textAlign: 'center',
+    },
+    image: {
+        position: 'absolute',
+        borderRadius: 10,
+    },
+});
+export default SelfieCaptureEx;
+//# sourceMappingURL=SelfieCaptureEx.js.map

package/build/components/example/SelfieCaptureEx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelfieCaptureEx.js","sourceRoot":"","sources":["../../../src/components/example/SelfieCaptureEx.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StyleSheet, View, Dimensions, Text, Animated, Image } from \"react-native\"\nimport { EnhancedCameraView } from \"../EnhancedCameraView\"\nimport Svg, {  Rect, Path, Mask, Defs, LinearGradient, Stop } from 'react-native-svg';\nimport React, { useEffect, useRef, useState } from 'react';\n\nconst SelfieCaptureEx = () => {\n    const { width: screenWidth, height: screenHeight } = Dimensions.get('window');\n\n\n    const bbox = [20, 140, 370, 340]; // [xMin, yMin, xMax, yMax]\n    const [xMin, yMin, xMax, yMax] = bbox;\n    const boxWidth = xMax - xMin;\n    const boxHeight = yMax - yMin;\n\n    // Animations\n    // const instructionAnimation = useRef(new Animated.Value(0)).current;\n\n    const [cornerOpacity, setCornerOpacity] = useState(0.8);\n    const [scanLineX, setScanLineX] = useState<{\n        val: number,\n        direction: 'up' | 'down'\n    }>({\n        val: yMin - (40 + 280),\n        direction: 'down'\n    });\n    const [imageUrl, setImageUrl] = useState<string | null>(null);\n\n    const scanY = useRef(new Animated.Value(yMin)).current;\n\n\n    useEffect(() => {\n        // Animation boucle : descend puis remonte\n        Animated.loop(\n            Animated.sequence([\n                Animated.timing(scanY, {\n                    toValue: yMax,\n                    duration: 2000,\n                    useNativeDriver: false,\n                }),\n                Animated.timing(scanY, {\n                    toValue: yMin,\n                    duration: 2000,\n                    useNativeDriver: false,\n                }),\n            ])\n        ).start();\n    }, [scanY, yMin, yMax]);\n\n    useEffect(() => {\n       \n        // Animation des coins avec setState\n        const cornerInterval = setInterval(() => {\n            setCornerOpacity(prev => prev === 0.8 ? 1 : 0.8);\n        }, 800);\n\n\n        const scanLineInterval = setInterval(() => {\n            setScanLineX(prev => {\n\n                const newX = prev.val + (prev.direction === 'up' ? -1 : 1) * Math.round(Math.random() * 2); // Vitesse de déplacement horizontal \n                if (prev.direction === \"down\") {\n                    if (newX > yMax - (280 - 40)) {\n                        return { val: yMax + (40), direction: 'up' }\n                    } else {\n                        return { val: newX, direction: 'down' }\n                    }\n                } else {\n                    if (newX < yMin - (40)) {\n                        return { val: yMin - (40 + 280), direction: 'down' }\n                    } else {\n                        return { val: newX, direction: 'up' }\n                    }\n                }\n\n            });\n        }, 2); // Fréquence de mise à jour\n\n        // Démarrer les animations\n\n        return () => {\n            clearInterval(cornerInterval);\n            clearInterval(scanLineInterval);\n        };\n    }, [yMin, yMax]);\n\n    if (imageUrl) {\n        return (\n            <View style={\n                {\n                    flex: 1,\n                    justifyContent: 'center',\n                    alignItems: 'center', \n                }\n            }>\n\n               <View style={\n                { \n                    \n                    justifyContent: 'center',\n                    alignItems: 'center', \n                }\n               }>\n               <Image\n                    source={{ uri: imageUrl }}\n                    style={[styles.image,\n                    {\n                        width: boxWidth,\n                        height: boxHeight,\n                        marginLeft: -xMin,\n                        marginTop: -yMin,\n                        \n                    },\n                    ]} />\n               </View>\n\n            </View>\n        )\n    }\n\n    return (\n        <EnhancedCameraView\n            showCamera={true}\n            showSwitchCamera={false}\n            bbox={{\n              xMin: 150,\n              yMin: 210,\n              xMax: 350,\n              yMax: 410,\n              borderColor: \"#2DBD60\",\n              borderWidth: 3,\n              cornerRadius: 8\n            }}\n            onCapture={(image) => {\n                setImageUrl(image.path ?? null);\n            }}\n            overlayComponent={\n                <View style={StyleSheet.absoluteFill}>\n                    {/* <Animated.View\n                        style={[\n                            styles.topIntruction,\n\n                        ]}\n                    >\n                        <Text style={styles.topIntructionText}>\n                            💡 Alignez le code QR avec la zone de capture • déplacez la caméra pour ajuster la zone de capture • mesurez 100cm de hauteur.\n                        </Text>\n                    </Animated.View> */}\n\n                    <Svg\n                        height={screenHeight}\n                        width={screenWidth}\n                        style={styles.svg}\n                    >\n                        <Defs>\n                            <Mask id=\"cameraMask\">\n                                {/* Fond blanc - zone visible */}\n                                <Rect\n                                    x=\"0\"\n                                    y=\"0\"\n                                    width={screenWidth}\n                                    height={screenHeight}\n                                    fill=\"white\"\n                                />\n                                {/* Zone noire - zone masquée (transparente) */}\n                                <Rect\n                                    x={xMin}\n                                    y={yMin}\n                                    width={boxWidth}\n                                    height={boxHeight}\n                                    fill=\"black\"\n                                />\n                            </Mask>\n                        </Defs>\n\n                        {/* Overlay semi-transparent avec masque */}\n                        <Rect\n                            x=\"0\"\n                            y=\"0\"\n                            width={screenWidth}\n                            height={screenHeight}\n                            fill=\"rgba(0, 0, 0, 0.5)\"\n                            mask=\"url(#cameraMask)\"\n                        />\n\n                        {/* Coins de la zone de capture - arrondis avec animation */}\n                        <Path\n                            d={`M ${xMin + 15} ${yMin} Q ${xMin} ${yMin} ${xMin} ${yMin + 15} L ${xMin} ${yMin + 20}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            fill=\"none\"\n                            opacity={cornerOpacity}\n                        />\n                        <Path\n                            d={`M ${xMin + 20} ${yMin} L ${xMin + 15} ${yMin}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            opacity={cornerOpacity}\n                        />\n\n                        <Path\n                            d={`M ${xMax - 15} ${yMin} Q ${xMax} ${yMin} ${xMax} ${yMin + 15} L ${xMax} ${yMin + 20}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            fill=\"none\"\n                            opacity={cornerOpacity}\n                        />\n                        <Path\n                            d={`M ${xMax - 20} ${yMin} L ${xMax - 15} ${yMin}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            opacity={cornerOpacity}\n                        />\n\n                        <Path\n                            d={`M ${xMin + 15} ${yMax} Q ${xMin} ${yMax} ${xMin} ${yMax - 15} L ${xMin} ${yMax - 20}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            fill=\"none\"\n                            opacity={cornerOpacity}\n                        />\n                        <Path\n                            d={`M ${xMin + 20} ${yMax} L ${xMin + 15} ${yMax}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            opacity={cornerOpacity}\n                        />\n\n                        <Path\n                            d={`M ${xMax - 15} ${yMax} Q ${xMax} ${yMax} ${xMax} ${yMax - 15} L ${xMax} ${yMax - 20}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            fill=\"none\"\n                            opacity={cornerOpacity}\n                        />\n                        <Path\n                            d={`M ${xMax - 20} ${yMax} L ${xMax - 15} ${yMax}`}\n                            stroke=\"#4CAF50\"\n                            strokeWidth=\"8\"\n                            opacity={cornerOpacity}\n                        />\n\n                        <Defs>\n                            <LinearGradient id=\"grad-rect\" x1=\"0%\"\n                                y1={scanLineX.direction === 'up' ? \"100%\" : \"0%\"} x2=\"0%\"\n                                y2={scanLineX.direction === 'up' ? \"0%\" : \"100%\"}>\n                                <Stop offset=\"70%\" stopColor=\"#2DBD60\" stopOpacity=\"0\" />\n                                <Stop offset=\"85%\" stopColor=\"#2DBD60\" stopOpacity=\"0.1\" />\n                                <Stop offset=\"88%\" stopColor=\"#2DBD60\" stopOpacity=\"0.15\" />\n                                <Stop offset=\"90%\" stopColor=\"#2DBD60\" stopOpacity=\"0.2\" />\n                                <Stop offset=\"100%\" stopColor=\"#2DBD60\" stopOpacity=\"1\" />\n                            </LinearGradient>\n                        </Defs>\n\n\n                        <Rect x=\"0\"\n                            y={scanLineX.val}\n                            width={screenWidth}\n                            height=\"280\"\n                            rx=\"0\"\n                            ry=\"0\"\n                            fill=\"url(#grad-rect)\"\n\n                        />\n                    </Svg>\n\n                    <View style={styles.bottomIntruction}>\n                        <Text style={styles.bottomTitle}>\n                            Mesurez 100cm de hauteur.\n                        </Text>\n                        <Text style={styles.bottomSubtitle}>\n                            Ne pas déplacer la caméra pendant la capture. • Ne pas déplacer la caméra pendant la capture.\n                        </Text>\n                    </View>\n                </View>\n            }\n        />\n    )\n}\n\nconst styles = StyleSheet.create({\n    overlay: {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        width: '100%',\n        height: '50%',\n        backgroundColor: 'rgba(0, 0, 0, 0.5)',\n    },\n    svg: {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        width: '100%',\n        height: '100%',\n    },\n    topIntruction: {\n        zIndex: 1000,\n        flexDirection: 'row',\n        alignItems: 'center',\n        justifyContent: 'center',\n        paddingVertical: 20,\n        paddingHorizontal: 10,\n        marginHorizontal: 20,\n        marginTop: 10,\n        backgroundColor: \"#FDE04730\",\n        borderColor: \"#FDE047\",\n        borderWidth: 1,\n        borderRadius: 10,\n        gap: 10,\n    },\n    topIntructionText: {\n        color: '#FDE047',\n        fontSize: 14,\n        fontWeight: 'bold',\n        textAlign: 'center',\n    },\n    bottomIntruction: {\n        position: 'absolute',\n        bottom: 0,\n        left: 0,\n        width: '100%',\n        height: '35%',\n        paddingHorizontal: 20,\n    },\n    bottomIntructionTextBold: {\n        color: 'white',\n        fontSize: 16,\n        fontWeight: 'bold',\n        textAlign: 'center',\n    },\n    bottomIntructionText: {\n        color: 'white',\n        fontSize: 14,\n        fontWeight: 'bold',\n        textAlign: 'center',\n    },\n    bottomTitle: {\n        color: 'white',\n        fontSize: 25,\n        fontWeight: 'bold',\n        textAlign: 'center',\n    },\n    bottomSubtitle: {\n        color: 'white',\n        marginTop: 15,\n        fontSize: 14,\n        fontWeight: '500',\n        textAlign: 'center',\n    },\n\n     \n    image: {\n        position: 'absolute',\n        borderRadius: 10,\n    },\n})\n\nexport default SelfieCaptureEx"]}

package/build/components/ui/Button.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+interface ButtonProps {
+    title: string;
+    onPress: () => void;
+    variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success' | 'warning' | 'info' | "neutral";
+    size?: 'small' | 'medium' | 'large';
+    icon?: React.ReactNode;
+    iconPosition?: 'left' | 'right';
+    disabled?: boolean;
+    loading?: boolean;
+    style?: ViewStyle;
+    textStyle?: TextStyle;
+    fullWidth?: boolean;
+    rounded?: boolean;
+}
+export declare const Button: React.FC<ButtonProps>;
+export declare const PrimaryButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const SecondaryButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const OutlineButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const GhostButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const DangerButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const SuccessButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const WarningButton: React.FC<Omit<ButtonProps, 'variant'>>;
+export declare const SmallButton: React.FC<Omit<ButtonProps, 'size'>>;
+export declare const LargeButton: React.FC<Omit<ButtonProps, 'size'>>;
+export declare const IconButton: React.FC<ButtonProps & {
+    iconName: string;
+}>;
+export declare const BackButton: React.FC<Omit<ButtonProps, 'icon' | 'iconPosition' | 'onPress'> & {
+    onBack: () => void;
+}>;
+export declare const NextButton: React.FC<Omit<ButtonProps, 'icon' | 'iconPosition'>>;
+export declare const SubmitButton: React.FC<Omit<ButtonProps, 'variant' | 'icon' | 'iconPosition'>>;
+export declare const CancelButton: React.FC<Omit<ButtonProps, 'variant' | 'icon' | 'iconPosition'>>;
+export { buttonIcons } from './ButtonStyles';
+//# sourceMappingURL=Button.d.ts.map

package/build/components/ui/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Button.tsx"],"names":[],"mappings":"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"}

package/build/components/ui/Button.js

@@ -0,0 +1,194 @@
+import React from 'react';
+import { TouchableOpacity, Text, StyleSheet, ActivityIndicator } from 'react-native';
+// Configuration des variantes
+const buttonVariants = {
+    primary: {
+        backgroundColor: '#2DBD60',
+        borderColor: '#2DBD60',
+        textColor: '#FFFFFF',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+    secondary: {
+        backgroundColor: '#F8F9FA',
+        borderColor: '#E9ECEF',
+        textColor: '#495057',
+        disabledBackground: '#F8F9FA',
+        disabledText: '#ADB5BD',
+    },
+    outline: {
+        backgroundColor: 'transparent',
+        borderColor: '#2DBD60',
+        textColor: '#2DBD60',
+        disabledBackground: 'transparent',
+        disabledText: '#ADB5BD',
+    },
+    ghost: {
+        backgroundColor: 'transparent',
+        borderColor: 'transparent',
+        textColor: '#2DBD60',
+        disabledBackground: 'transparent',
+        disabledText: '#ADB5BD',
+    },
+    danger: {
+        backgroundColor: '#DC3545',
+        borderColor: '#DC3545',
+        textColor: '#FFFFFF',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+    success: {
+        backgroundColor: '#28A745',
+        borderColor: '#28A745',
+        textColor: '#FFFFFF',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+    info: {
+        backgroundColor: '#17A2B8',
+        borderColor: '#17A2B8',
+        textColor: '#FFFFFF',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+    warning: {
+        backgroundColor: '#FFC107',
+        borderColor: '#FFC107',
+        textColor: '#212529',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+    neutral: {
+        backgroundColor: '#6c757d',
+        borderColor: '#6c757d',
+        textColor: '#FFFFFF',
+        disabledBackground: '#E5E5E5',
+        disabledText: '#999999',
+    },
+};
+// Configuration des tailles
+const buttonSizes = {
+    small: {
+        paddingVertical: 8,
+        paddingHorizontal: 16,
+        fontSize: 14,
+        borderRadius: 6,
+        iconSize: 16,
+    },
+    medium: {
+        paddingVertical: 12,
+        paddingHorizontal: 24,
+        fontSize: 16,
+        borderRadius: 8,
+        iconSize: 20,
+    },
+    large: {
+        paddingVertical: 16,
+        paddingHorizontal: 32,
+        fontSize: 18,
+        borderRadius: 12,
+        iconSize: 24,
+    },
+};
+export const Button = ({ title, onPress, variant = 'primary', size = 'medium', icon, iconPosition = 'left', disabled = false, loading = false, style, textStyle, fullWidth = false, rounded = false, }) => {
+    // Obtenir la configuration de la variante
+    const variantConfig = buttonVariants[variant];
+    const sizeConfig = buttonSizes[size];
+    // Déterminer les styles dynamiques
+    const dynamicStyles = {
+        backgroundColor: disabled ? variantConfig.disabledBackground : variantConfig.backgroundColor,
+        borderColor: variantConfig.borderColor,
+        paddingVertical: sizeConfig.paddingVertical,
+        paddingHorizontal: sizeConfig.paddingHorizontal,
+        borderRadius: rounded ? 50 : sizeConfig.borderRadius,
+        width: fullWidth ? '100%' : 'auto',
+        borderWidth: variant === 'outline' ? 2 : 0,
+    };
+    const dynamicTextStyles = {
+        color: disabled ? variantConfig.disabledText : variantConfig.textColor,
+        fontSize: sizeConfig.fontSize,
+        fontWeight: '600',
+    };
+    // Rendu de l'icône
+    const renderIcon = () => {
+        if (!icon || loading)
+            return null;
+        return (<Text style={[styles.icon, { fontSize: sizeConfig.iconSize }]}>
+        {icon}
+      </Text>);
+    };
+    // Rendu du contenu
+    const renderContent = () => {
+        if (loading) {
+            return (<>
+          <ActivityIndicator size="small" color={variantConfig.textColor} style={styles.loadingSpinner}/>
+          <Text style={[styles.text, dynamicTextStyles, textStyle]}>
+            Chargement...
+          </Text>
+        </>);
+        }
+        if (iconPosition === 'right') {
+            return (<>
+          <Text style={[styles.text, dynamicTextStyles, textStyle]}>
+            {title}
+          </Text>
+          {renderIcon()}
+        </>);
+        }
+        return (<>
+        {renderIcon()}
+        <Text style={[styles.text, dynamicTextStyles, textStyle]}>
+          {title}
+        </Text>
+      </>);
+    };
+    return (<TouchableOpacity style={[styles.button, dynamicStyles, style]} onPress={onPress} disabled={disabled || loading} activeOpacity={0.8}>
+      {renderContent()}
+    </TouchableOpacity>);
+};
+const styles = StyleSheet.create({
+    button: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minHeight: 44,
+        shadowColor: '#000',
+        shadowOffset: {
+            width: 0,
+            height: 2,
+        },
+        shadowOpacity: 0.1,
+        shadowRadius: 3.84,
+        elevation: 5,
+    },
+    text: {
+        fontWeight: '600',
+        textAlign: 'center',
+    },
+    icon: {
+        marginHorizontal: 8,
+    },
+    loadingSpinner: {
+        marginRight: 8,
+    },
+});
+// Composants prédéfinis pour des cas d'usage courants
+export const PrimaryButton = (props) => (<Button variant="primary" {...props}/>);
+export const SecondaryButton = (props) => (<Button variant="secondary" {...props}/>);
+export const OutlineButton = (props) => (<Button variant="outline" {...props}/>);
+export const GhostButton = (props) => (<Button variant="ghost" {...props}/>);
+export const DangerButton = (props) => (<Button variant="danger" {...props}/>);
+export const SuccessButton = (props) => (<Button variant="success" {...props}/>);
+export const WarningButton = (props) => (<Button variant="warning" {...props}/>);
+// Composants de taille prédéfinie
+export const SmallButton = (props) => (<Button size="small" {...props}/>);
+export const LargeButton = (props) => (<Button size="large" {...props}/>);
+// Composants avec icônes prédéfinies
+export const IconButton = ({ iconName, ...props }) => (<Button icon={iconName} {...props}/>);
+export const BackButton = ({ onBack, ...props }) => (<Button icon="←" iconPosition="left" onPress={onBack} variant="ghost" size="medium" {...props}/>);
+export const NextButton = (props) => (<Button icon="→" iconPosition="right" variant="primary" size="medium" {...props}/>);
+export const SubmitButton = (props) => (<Button variant="primary" size="large" fullWidth {...props}/>);
+export const CancelButton = (props) => (<Button variant="secondary" size="medium" {...props}/>);
+// Export des icônes depuis ButtonStyles
+export { buttonIcons } from './ButtonStyles';
+//# sourceMappingURL=Button.js.map

package/build/components/ui/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/ui/Button.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { TouchableOpacity, Text, StyleSheet, ViewStyle, TextStyle, ActivityIndicator } from 'react-native';\n\n// Types pour les props du bouton\ninterface ButtonProps {\n  // Contenu\n  title: string;\n  onPress: () => void;\n  \n  // Variantes\n  variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'danger' | 'success' | 'warning' | 'info' | \"neutral\";\n  size?: 'small' | 'medium' | 'large';\n  \n  // Icône\n  icon?: React.ReactNode;\n  iconPosition?: 'left' | 'right';\n  \n  // État\n  disabled?: boolean;\n  loading?: boolean;\n  \n  // Style personnalisé\n  style?: ViewStyle;\n  textStyle?: TextStyle;\n  \n  // Autres props\n  fullWidth?: boolean;\n  rounded?: boolean;\n}\n\n// Configuration des variantes\nconst buttonVariants = {\n  primary: {\n    backgroundColor: '#2DBD60',\n    borderColor: '#2DBD60',\n    textColor: '#FFFFFF',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n  secondary: {\n    backgroundColor: '#F8F9FA',\n    borderColor: '#E9ECEF',\n    textColor: '#495057',\n    disabledBackground: '#F8F9FA',\n    disabledText: '#ADB5BD',\n  },\n  outline: {\n    backgroundColor: 'transparent',\n    borderColor: '#2DBD60',\n    textColor: '#2DBD60',\n    disabledBackground: 'transparent',\n    disabledText: '#ADB5BD',\n  },\n  ghost: {\n    backgroundColor: 'transparent',\n    borderColor: 'transparent',\n    textColor: '#2DBD60',\n    disabledBackground: 'transparent',\n    disabledText: '#ADB5BD',\n  },\n  danger: {\n    backgroundColor: '#DC3545',\n    borderColor: '#DC3545',\n    textColor: '#FFFFFF',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n  success: {\n    backgroundColor: '#28A745',\n    borderColor: '#28A745',\n    textColor: '#FFFFFF',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n  info: {\n    backgroundColor: '#17A2B8',\n    borderColor: '#17A2B8',\n    textColor: '#FFFFFF',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n  warning: {\n    backgroundColor: '#FFC107',\n    borderColor: '#FFC107',\n    textColor: '#212529',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n  neutral: {\n    backgroundColor: '#6c757d',\n    borderColor: '#6c757d',\n    textColor: '#FFFFFF',\n    disabledBackground: '#E5E5E5',\n    disabledText: '#999999',\n  },\n};\n\n// Configuration des tailles\nconst buttonSizes = {\n  small: {\n    paddingVertical: 8,\n    paddingHorizontal: 16,\n    fontSize: 14,\n    borderRadius: 6,\n    iconSize: 16,\n  },\n  medium: {\n    paddingVertical: 12,\n    paddingHorizontal: 24,\n    fontSize: 16,\n    borderRadius: 8,\n    iconSize: 20,\n  },\n  large: {\n    paddingVertical: 16,\n    paddingHorizontal: 32,\n    fontSize: 18,\n    borderRadius: 12,\n    iconSize: 24,\n  },\n};\n\nexport const Button: React.FC<ButtonProps> = ({\n  title,\n  onPress,\n  variant = 'primary',\n  size = 'medium',\n  icon,\n  iconPosition = 'left',\n  disabled = false,\n  loading = false,\n  style,\n  textStyle,\n  fullWidth = false,\n  rounded = false,\n}) => {\n  // Obtenir la configuration de la variante\n  const variantConfig = buttonVariants[variant];\n  const sizeConfig = buttonSizes[size];\n  \n  // Déterminer les styles dynamiques\n  const dynamicStyles: ViewStyle = {\n    backgroundColor: disabled ? variantConfig.disabledBackground : variantConfig.backgroundColor,\n    borderColor: variantConfig.borderColor,\n    paddingVertical: sizeConfig.paddingVertical,\n    paddingHorizontal: sizeConfig.paddingHorizontal,\n    borderRadius: rounded ? 50 : sizeConfig.borderRadius,\n    width: fullWidth ? '100%' : 'auto',\n    borderWidth: variant === 'outline' ? 2 : 0,\n  };\n\n  const dynamicTextStyles: TextStyle = {\n    color: disabled ? variantConfig.disabledText : variantConfig.textColor,\n    fontSize: sizeConfig.fontSize,\n    fontWeight: '600',\n  };\n\n  // Rendu de l'icône\n  const renderIcon = () => {\n    if (!icon || loading) return null;\n    \n    return (\n      <Text style={[styles.icon, { fontSize: sizeConfig.iconSize }]}>\n        {icon}\n      </Text>\n    );\n  };\n\n  // Rendu du contenu\n  const renderContent = () => {\n    if (loading) {\n      return (\n        <>\n          <ActivityIndicator \n            size=\"small\" \n            color={variantConfig.textColor} \n            style={styles.loadingSpinner}\n          />\n          <Text style={[styles.text, dynamicTextStyles, textStyle]}>\n            Chargement...\n          </Text>\n        </>\n      );\n    }\n\n    if (iconPosition === 'right') {\n      return (\n        <>\n          <Text style={[styles.text, dynamicTextStyles, textStyle]}>\n            {title}\n          </Text>\n          {renderIcon()}\n        </>\n      );\n    }\n\n    return (\n      <>\n        {renderIcon()}\n        <Text style={[styles.text, dynamicTextStyles, textStyle]}>\n          {title}\n        </Text>\n      </>\n    );\n  };\n\n  return (\n    <TouchableOpacity\n      style={[styles.button, dynamicStyles, style]}\n      onPress={onPress}\n      disabled={disabled || loading}\n      activeOpacity={0.8}\n    >\n      {renderContent()}\n    </TouchableOpacity>\n  );\n};\n\nconst styles = StyleSheet.create({\n  button: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    minHeight: 44,\n    shadowColor: '#000',\n    shadowOffset: {\n      width: 0,\n      height: 2,\n    },\n    shadowOpacity: 0.1,\n    shadowRadius: 3.84,\n    elevation: 5,\n  },\n  text: {\n    fontWeight: '600',\n    textAlign: 'center',\n  },\n  icon: {\n    marginHorizontal: 8,\n  },\n  loadingSpinner: {\n    marginRight: 8,\n  },\n});\n\n// Composants prédéfinis pour des cas d'usage courants\nexport const PrimaryButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"primary\" {...props} />\n);\n\nexport const SecondaryButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"secondary\" {...props} />\n);\n\nexport const OutlineButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"outline\" {...props} />\n);\n\nexport const GhostButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"ghost\" {...props} />\n);\n\nexport const DangerButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"danger\" {...props} />\n);\n\nexport const SuccessButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"success\" {...props} />\n);\n\nexport const WarningButton: React.FC<Omit<ButtonProps, 'variant'>> = (props) => (\n  <Button variant=\"warning\" {...props} />\n);\n\n// Composants de taille prédéfinie\nexport const SmallButton: React.FC<Omit<ButtonProps, 'size'>> = (props) => (\n  <Button size=\"small\" {...props} />\n);\n\nexport const LargeButton: React.FC<Omit<ButtonProps, 'size'>> = (props) => (\n  <Button size=\"large\" {...props} />\n);\n\n// Composants avec icônes prédéfinies\nexport const IconButton: React.FC<ButtonProps & { iconName: string }> = ({ iconName, ...props }) => (\n  <Button icon={iconName} {...props} />\n);\n\nexport const BackButton: React.FC<Omit<ButtonProps, 'icon' | 'iconPosition' | 'onPress'> & { onBack: () => void }> = ({ onBack, ...props }) => (\n  <Button \n    icon=\"←\" \n    iconPosition=\"left\" \n    onPress={onBack} \n    variant=\"ghost\"\n    size=\"medium\"\n    {...props} \n  />\n);\n\nexport const NextButton: React.FC<Omit<ButtonProps, 'icon' | 'iconPosition'>> = (props) => (\n  <Button \n    icon=\"→\" \n    iconPosition=\"right\" \n    variant=\"primary\"\n    size=\"medium\"\n    {...props} \n  />\n);\n\nexport const SubmitButton: React.FC<Omit<ButtonProps, 'variant' | 'icon' | 'iconPosition'>> = (props) => (\n  <Button \n    variant=\"primary\"\n    size=\"large\"\n    fullWidth\n    {...props} \n  />\n);\n\nexport const CancelButton: React.FC<Omit<ButtonProps, 'variant' | 'icon' | 'iconPosition'>> = (props) => (\n  <Button \n    variant=\"secondary\"\n    size=\"medium\"\n    {...props} \n  />\n);\n\n// Export des icônes depuis ButtonStyles\nexport { buttonIcons } from './ButtonStyles'; "]}

package/build/components/ui/ButtonExample.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+declare const ButtonExample: React.FC;
+export default ButtonExample;
+//# sourceMappingURL=ButtonExample.d.ts.map

package/build/components/ui/ButtonExample.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonExample.d.ts","sourceRoot":"","sources":["../../../src/components/ui/ButtonExample.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAOxC,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAkP1B,CAAC;AAoEF,eAAe,aAAa,CAAC"}