@sanctum-key/react-native-sdk 1.0.0

package/build/components/KYCElements/WelcomeTemplate.js

@@ -0,0 +1,244 @@
+import React, { useState, useEffect } from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import { useTemplateKYCFlowContext } from '../../hooks/useTemplateKYCFlow';
+import { useI18n } from '../../hooks/useI18n';
+import { Button } from '../ui/Button';
+import ShieldIcon from '../Svgs/Schield';
+export const WelcomeTemplate = ({ component, value, onValueChange, error, }) => {
+    const { t } = useI18n();
+    const { getLocalizedText, actions } = useTemplateKYCFlowContext();
+    const config = component.config;
+    // Consentements cochés par défaut
+    const privacyConsent = true;
+    const termsConsent = true;
+    const [shouldProceed, setShouldProceed] = useState(false);
+    // Get localized text
+    const title = getLocalizedText(component.labels);
+    const description = getLocalizedText(component.instructions);
+    const welcomeMessage = config.welcomeMessage || description;
+    const buttonText = config.buttonText || getLocalizedText(component.ui.buttonText || { en: 'Get Started', fr: 'Commencer' });
+    // Passer à l'étape suivante après que les données sont mises à jour
+    useEffect(() => {
+        if (shouldProceed && value && value.consentGiven) {
+            // Petit délai pour s'assurer que le state est bien mis à jour
+            const timer = setTimeout(() => {
+                actions.nextComponent();
+                setShouldProceed(false);
+            }, 100);
+            return () => clearTimeout(timer);
+        }
+        return undefined;
+    }, [value, shouldProceed, actions]);
+    const handleGetStarted = () => {
+        // Mark component as complete
+        const consentData = { consentGiven: true, privacyConsent, termsConsent };
+        onValueChange(consentData);
+        setShouldProceed(true);
+    };
+    return (<View style={styles.container}>
+      <View style={{ flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
+        {/* Icon Section */}
+        <View style={{ position: 'relative', width: 70 }}>
+          <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'center', width: 60, height: 60, backgroundColor: '#2DBE60', borderRadius: 100 }}>
+            <ShieldIcon />
+          </View>
+          <View style={{ position: 'absolute', top: '60%', right: 0, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', width: 40, height: 40, backgroundColor: 'white', borderRadius: 100, shadowColor: '#000', shadowOffset: { width: 0, height: 2 }, shadowOpacity: 0.15, shadowRadius: 1.84, elevation: 5 }}>
+            <Text style={{ fontSize: 20, color: '#2DBE60' }}>✓</Text>
+          </View>
+        </View>
+
+        {/* Title and Description */}
+        <View style={{ flexDirection: 'column', alignItems: 'center', justifyContent: 'center', marginTop: 36 }}>
+          <Text style={styles.title}>{title}</Text>
+          {welcomeMessage && (<Text style={styles.description}>
+              {welcomeMessage}
+            </Text>)}
+        </View>
+
+        {/* Requirements List */}
+        {config.requirements && config.requirements.length > 0 && (<View style={styles.requirementsSection}>
+            <Text style={styles.sectionTitle}>
+              {t('kyc.welcome.requirements') || `What you'll need:`}
+            </Text>
+            {config.requirements.map((requirement, index) => (<View key={index} style={styles.requirementItem}>
+                <Text style={styles.checkmark}>✓</Text>
+                <Text style={styles.requirementText}>{requirement}</Text>
+              </View>))}
+          </View>)}
+
+        {/* Estimated Time */}
+        {config.showEstimatedTime !== false && config.estimatedTime && (<View style={styles.timeSection}>
+            <Text style={styles.timeLabel}>
+              {t('kyc.welcome.estimatedTime') || 'Estimated time:'}
+            </Text>
+            <Text style={styles.timeValue}>{config.estimatedTime}</Text>
+          </View>)}
+
+        {/* Consent Options - Hidden by default as they're pre-checked */}
+        {(config.consentOptions?.showPrivacyPolicy || config.consentOptions?.showTermsOfService || config.consentOptions?.showMarketingConsent) && (<View style={styles.consentSection}>
+            {config.consentOptions.showPrivacyPolicy && (<View style={styles.consentItem}>
+                <View style={[styles.checkbox, styles.checkboxChecked]}>
+                  <Text style={styles.checkmarkSmall}>✓</Text>
+                </View>
+                <Text style={styles.consentText}>
+                  {t('kyc.welcome.privacyPolicy') || 'I agree to the Privacy Policy'}
+                </Text>
+              </View>)}
+
+            {config.consentOptions.showTermsOfService && (<View style={styles.consentItem}>
+                <View style={[styles.checkbox, styles.checkboxChecked]}>
+                  <Text style={styles.checkmarkSmall}>✓</Text>
+                </View>
+                <Text style={styles.consentText}>
+                  {t('kyc.welcome.termsOfService') || 'I agree to the Terms of Service'}
+                </Text>
+              </View>)}
+
+            {config.consentOptions.showMarketingConsent && (<View style={styles.consentItem}>
+                <View style={[styles.checkbox, styles.checkboxChecked]}>
+                  <Text style={styles.checkmarkSmall}>✓</Text>
+                </View>
+                <Text style={styles.consentText}>
+                  {t('kyc.welcome.marketingConsent') || 'I agree to receive marketing communications'}
+                </Text>
+              </View>)}
+          </View>)}
+
+        {error && (<View style={styles.errorContainer}>
+            <Text style={styles.errorText}>{error}</Text>
+          </View>)}
+
+        {/* Get Started Button */}
+        <Button title={buttonText?.length === 0 ? t('kyc.welcome.getStarted') || 'Get Started' : buttonText} fullWidth onPress={handleGetStarted} style={{ paddingVertical: 20, marginTop: 36 }}/>
+
+        <View style={{ height: 12 }}/>
+      </View>
+    </View>);
+};
+const styles = StyleSheet.create({
+    container: {
+        padding: 16,
+        backgroundColor: 'white',
+        marginHorizontal: 12,
+        marginTop: 12,
+        borderRadius: 12,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.15,
+        shadowRadius: 1.84,
+        elevation: 3,
+        maxWidth: 760,
+        width: '94%',
+    },
+    title: {
+        fontSize: 24,
+        fontWeight: 'bold',
+        color: '#333',
+        marginBottom: 8,
+        textAlign: 'center',
+    },
+    description: {
+        fontSize: 16,
+        color: '#666',
+        textAlign: 'center',
+        marginBottom: 24,
+        lineHeight: 22,
+    },
+    requirementsSection: {
+        backgroundColor: '#F9FAFB',
+        padding: 12,
+        borderRadius: 12,
+        width: '100%',
+        marginTop: 24,
+    },
+    sectionTitle: {
+        fontSize: 16,
+        fontWeight: 'bold',
+        color: 'black',
+        marginBottom: 12,
+        textAlign: 'left',
+    },
+    requirementItem: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginBottom: 8,
+    },
+    checkmark: {
+        fontSize: 18,
+        color: '#2DBD60',
+        marginRight: 12,
+        fontWeight: 'bold',
+    },
+    requirementText: {
+        flex: 1,
+        fontSize: 16,
+        color: '#666',
+        textAlign: 'left',
+        lineHeight: 22,
+    },
+    timeSection: {
+        backgroundColor: '#F9FAFB',
+        padding: 12,
+        borderRadius: 12,
+        marginTop: 16,
+        alignItems: 'center',
+        width: '100%',
+    },
+    timeLabel: {
+        fontSize: 14,
+        color: '#666',
+        marginBottom: 4,
+    },
+    timeValue: {
+        fontSize: 20,
+        fontWeight: 'bold',
+        color: '#2DBD60',
+    },
+    consentSection: {
+        width: '100%',
+        marginTop: 24,
+    },
+    consentItem: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginBottom: 12,
+    },
+    checkbox: {
+        width: 20,
+        height: 20,
+        borderWidth: 2,
+        borderColor: '#ddd',
+        borderRadius: 4,
+        marginRight: 12,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    checkboxChecked: {
+        backgroundColor: '#2DBD60',
+        borderColor: '#2DBD60',
+    },
+    checkmarkSmall: {
+        fontSize: 14,
+        color: 'white',
+        fontWeight: 'bold',
+    },
+    consentText: {
+        flex: 1,
+        fontSize: 15,
+        color: '#333',
+        lineHeight: 22,
+    },
+    errorContainer: {
+        backgroundColor: '#fee',
+        padding: 12,
+        borderRadius: 8,
+        marginTop: 16,
+        width: '100%',
+    },
+    errorText: {
+        color: '#dc2626',
+        fontSize: 14,
+        textAlign: 'center',
+    },
+});
+//# sourceMappingURL=WelcomeTemplate.js.map

package/build/components/KYCElements/WelcomeTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WelcomeTemplate.js","sourceRoot":"","sources":["../../../src/components/KYCElements/WelcomeTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { View, Text, StyleSheet } from 'react-native';\nimport { TemplateComponent, WelcomeConfig, LocalizedText } from '../../types/KYC.types';\nimport { useTemplateKYCFlowContext } from '../../hooks/useTemplateKYCFlow';\nimport { useI18n } from '../../hooks/useI18n';\nimport { Button } from '../ui/Button';\nimport ShieldIcon from '../Svgs/Schield';\n\ninterface WelcomeTemplateProps {\n  component: TemplateComponent;\n  value?: any;\n  onValueChange: (data: any) => void;\n  error?: string;\n  language?: string;\n}\n\nexport const WelcomeTemplate: React.FC<WelcomeTemplateProps> = ({\n  component,\n  value,\n  onValueChange,\n  error,\n}) => {\n  const { t } = useI18n();\n  const { getLocalizedText, actions } = useTemplateKYCFlowContext();\n  const config = component.config as WelcomeConfig;\n\n  // Consentements cochés par défaut\n  const privacyConsent = true;\n  const termsConsent = true;\n  const [shouldProceed, setShouldProceed] = useState(false);\n\n  // Get localized text\n  const title = getLocalizedText(component.labels as LocalizedText);\n  const description = getLocalizedText(component.instructions as LocalizedText);\n  const welcomeMessage = config.welcomeMessage || description;\n  const buttonText = config.buttonText || getLocalizedText((component.ui as any).buttonText || { en: 'Get Started', fr: 'Commencer' });\n\n  // Passer à l'étape suivante après que les données sont mises à jour\n  useEffect(() => {\n    if (shouldProceed && value && value.consentGiven) {\n      // Petit délai pour s'assurer que le state est bien mis à jour\n      const timer = setTimeout(() => {\n        actions.nextComponent();\n        setShouldProceed(false);\n      }, 100);\n\n      return () => clearTimeout(timer);\n    }\n    return undefined;\n  }, [value, shouldProceed, actions]);\n\n  const handleGetStarted = () => {\n    // Mark component as complete\n    const consentData = { consentGiven: true, privacyConsent, termsConsent };\n    onValueChange(consentData);\n    setShouldProceed(true);\n  };\n\n  return (\n    <View style={styles.container}>\n      <View style={{ flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>\n        {/* Icon Section */}\n        <View style={{ position: 'relative', width: 70 }}>\n          <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'center', width: 60, height: 60, backgroundColor: '#2DBE60', borderRadius: 100 }}>\n            <ShieldIcon />\n          </View>\n          <View style={{ position: 'absolute', top: '60%', right: 0, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', width: 40, height: 40, backgroundColor: 'white', borderRadius: 100, shadowColor: '#000', shadowOffset: { width: 0, height: 2 }, shadowOpacity: 0.15, shadowRadius: 1.84, elevation: 5 }}>\n            <Text style={{ fontSize: 20, color: '#2DBE60' }}>✓</Text>\n          </View>\n        </View>\n\n        {/* Title and Description */}\n        <View style={{ flexDirection: 'column', alignItems: 'center', justifyContent: 'center', marginTop: 36 }}>\n          <Text style={styles.title}>{title}</Text>\n          {welcomeMessage && (\n            <Text style={styles.description}>\n              {welcomeMessage}\n            </Text>\n          )}\n        </View>\n\n        {/* Requirements List */}\n        {config.requirements && config.requirements.length > 0 && (\n          <View style={styles.requirementsSection}>\n            <Text style={styles.sectionTitle}>\n              {t('kyc.welcome.requirements') || `What you'll need:`}\n            </Text>\n            {config.requirements.map((requirement, index) => (\n              <View key={index} style={styles.requirementItem}>\n                <Text style={styles.checkmark}>✓</Text>\n                <Text style={styles.requirementText}>{requirement}</Text>\n              </View>\n            ))}\n          </View>\n        )}\n\n        {/* Estimated Time */}\n        {config.showEstimatedTime !== false && config.estimatedTime && (\n          <View style={styles.timeSection}>\n            <Text style={styles.timeLabel}>\n              {t('kyc.welcome.estimatedTime') || 'Estimated time:'}\n            </Text>\n            <Text style={styles.timeValue}>{config.estimatedTime}</Text>\n          </View>\n        )}\n\n        {/* Consent Options - Hidden by default as they're pre-checked */}\n        {(config.consentOptions?.showPrivacyPolicy || config.consentOptions?.showTermsOfService || config.consentOptions?.showMarketingConsent) && (\n          <View style={styles.consentSection}>\n            {config.consentOptions.showPrivacyPolicy && (\n              <View style={styles.consentItem}>\n                <View style={[styles.checkbox, styles.checkboxChecked]}>\n                  <Text style={styles.checkmarkSmall}>✓</Text>\n                </View>\n                <Text style={styles.consentText}>\n                  {t('kyc.welcome.privacyPolicy') || 'I agree to the Privacy Policy'}\n                </Text>\n              </View>\n            )}\n\n            {config.consentOptions.showTermsOfService && (\n              <View style={styles.consentItem}>\n                <View style={[styles.checkbox, styles.checkboxChecked]}>\n                  <Text style={styles.checkmarkSmall}>✓</Text>\n                </View>\n                <Text style={styles.consentText}>\n                  {t('kyc.welcome.termsOfService') || 'I agree to the Terms of Service'}\n                </Text>\n              </View>\n            )}\n\n            {config.consentOptions.showMarketingConsent && (\n              <View style={styles.consentItem}>\n                <View style={[styles.checkbox, styles.checkboxChecked]}>\n                  <Text style={styles.checkmarkSmall}>✓</Text>\n                </View>\n                <Text style={styles.consentText}>\n                  {t('kyc.welcome.marketingConsent') || 'I agree to receive marketing communications'}\n                </Text>\n              </View>\n            )}\n          </View>\n        )}\n\n        {error && (\n          <View style={styles.errorContainer}>\n            <Text style={styles.errorText}>{error}</Text>\n          </View>\n        )}\n\n        {/* Get Started Button */}\n        <Button\n          title={buttonText?.length === 0 ? t('kyc.welcome.getStarted') || 'Get Started' : buttonText}\n          fullWidth\n          onPress={handleGetStarted}\n          style={{ paddingVertical: 20, marginTop: 36 }}\n        />\n\n        <View style={{ height: 12 }} />\n      </View>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    padding: 16,\n    backgroundColor: 'white',\n    marginHorizontal: 12,\n    marginTop: 12,\n    borderRadius: 12,\n    shadowColor: '#000',\n    shadowOffset: { width: 0, height: 2 },\n    shadowOpacity: 0.15,\n    shadowRadius: 1.84,\n    elevation: 3,\n    maxWidth: 760,\n    width: '94%',\n  },\n  title: {\n    fontSize: 24,\n    fontWeight: 'bold',\n    color: '#333',\n    marginBottom: 8,\n    textAlign: 'center',\n  },\n  description: {\n    fontSize: 16,\n    color: '#666',\n    textAlign: 'center',\n    marginBottom: 24,\n    lineHeight: 22,\n  },\n  requirementsSection: {\n    backgroundColor: '#F9FAFB',\n    padding: 12,\n    borderRadius: 12,\n    width: '100%',\n    marginTop: 24,\n  },\n  sectionTitle: {\n    fontSize: 16,\n    fontWeight: 'bold',\n    color: 'black',\n    marginBottom: 12,\n    textAlign: 'left',\n  },\n  requirementItem: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginBottom: 8,\n  },\n  checkmark: {\n    fontSize: 18,\n    color: '#2DBD60',\n    marginRight: 12,\n    fontWeight: 'bold',\n  },\n  requirementText: {\n    flex: 1,\n    fontSize: 16,\n    color: '#666',\n    textAlign: 'left',\n    lineHeight: 22,\n  },\n  timeSection: {\n    backgroundColor: '#F9FAFB',\n    padding: 12,\n    borderRadius: 12,\n    marginTop: 16,\n    alignItems: 'center',\n    width: '100%',\n  },\n  timeLabel: {\n    fontSize: 14,\n    color: '#666',\n    marginBottom: 4,\n  },\n  timeValue: {\n    fontSize: 20,\n    fontWeight: 'bold',\n    color: '#2DBD60',\n  },\n  consentSection: {\n    width: '100%',\n    marginTop: 24,\n  },\n  consentItem: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    marginBottom: 12,\n  },\n  checkbox: {\n    width: 20,\n    height: 20,\n    borderWidth: 2,\n    borderColor: '#ddd',\n    borderRadius: 4,\n    marginRight: 12,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  checkboxChecked: {\n    backgroundColor: '#2DBD60',\n    borderColor: '#2DBD60',\n  },\n  checkmarkSmall: {\n    fontSize: 14,\n    color: 'white',\n    fontWeight: 'bold',\n  },\n  consentText: {\n    flex: 1,\n    fontSize: 15,\n    color: '#333',\n    lineHeight: 22,\n  },\n  errorContainer: {\n    backgroundColor: '#fee',\n    padding: 12,\n    borderRadius: 8,\n    marginTop: 16,\n    width: '100%',\n  },\n  errorText: {\n    color: '#dc2626',\n    fontSize: 14,\n    textAlign: 'center',\n  },\n});"]}

package/build/components/KYCExample.d.ts

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

package/build/components/KYCExample.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KYCExample.d.ts","sourceRoot":"","sources":["../../src/components/KYCExample.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAYxC,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EA+L9B,CAAC"}

package/build/components/KYCExample.js

@@ -0,0 +1,247 @@
+import React, { useState } from 'react';
+import { View, Text, TouchableOpacity, StyleSheet, Alert } from 'react-native';
+import { ConfigurableKYCFlow } from './ConfigurableKYCFlow';
+import { basicKYCConfig, advancedKYCConfig, quickKYCConfig, professionalKYCConfig, createCustomKYCConfig } from '../config/KYCConfigs';
+export const KYCExample = () => {
+    const [selectedConfig, setSelectedConfig] = useState(null);
+    const [showFlow, setShowFlow] = useState(false);
+    const handleConfigSelect = (config) => {
+        setSelectedConfig(config);
+        setShowFlow(true);
+    };
+    const handleComplete = (data) => {
+        Alert.alert('KYC Terminé !', `Vérification terminée avec succès.\nDonnées collectées: ${JSON.stringify(data, null, 2)}`, [
+            {
+                text: 'OK',
+                onPress: () => {
+                    setShowFlow(false);
+                    setSelectedConfig(null);
+                }
+            }
+        ]);
+    };
+    const handleError = (error) => {
+        Alert.alert('Erreur', `Une erreur s'est produite: ${error.message}`);
+    };
+    const handleClose = () => {
+        setShowFlow(false);
+        setSelectedConfig(null);
+    };
+    // Exemple de configuration personnalisée
+    const customConfig = createCustomKYCConfig('custom_kyc', 'KYC Personnalisé', 'Configuration personnalisée pour votre service', [
+        {
+            id: 'country_selection',
+            type: 'country_selection',
+            title: 'Sélectionnez votre pays',
+            description: 'Choisissez le pays qui a émis votre document',
+            isRequired: true,
+            isVisible: true,
+            order: 0,
+            validation: { required: true },
+        },
+        {
+            id: 'selfie',
+            type: 'selfie_capture',
+            title: 'Prenez votre photo',
+            description: 'Une photo de votre visage est requise',
+            isRequired: true,
+            isVisible: true,
+            order: 1,
+            validation: { required: true },
+            cameraConfig: {
+                aspectRatio: 1,
+                quality: 0.8,
+                flashMode: 'off',
+                cameraType: 'front',
+                allowRetake: true,
+                maxRetakes: 3,
+            },
+        },
+        {
+            id: 'verification',
+            type: 'verification',
+            title: 'Vérification',
+            description: 'Vérification en cours...',
+            isRequired: true,
+            isVisible: true,
+            order: 2,
+        },
+        {
+            id: 'completion',
+            type: 'completion',
+            title: 'Terminé !',
+            description: 'Vérification réussie',
+            isRequired: true,
+            isVisible: true,
+            order: 3,
+        },
+    ], {
+        allowBackNavigation: false,
+        showProgressBar: true,
+        showStepNumbers: true,
+        autoAdvance: true,
+    }, {
+        primaryColor: '#FF6B6B',
+        secondaryColor: '#4ECDC4',
+        backgroundColor: '#f8f9fa',
+    });
+    if (showFlow && selectedConfig) {
+        return (<ConfigurableKYCFlow config={selectedConfig} onComplete={handleComplete} onError={handleError} onClose={handleClose}/>);
+    }
+    return (<View style={styles.container}>
+      <Text style={styles.title}>Système KYC Configurable</Text>
+      <Text style={styles.subtitle}>
+        Sélectionnez le type de vérification d'identité que vous souhaitez utiliser
+      </Text>
+
+      <View style={styles.configGrid}>
+        <TouchableOpacity style={styles.configCard} onPress={() => handleConfigSelect(basicKYCConfig)}>
+          <Text style={styles.configIcon}>📋</Text>
+          <Text style={styles.configTitle}>KYC Basique</Text>
+          <Text style={styles.configDescription}>
+            Vérification standard avec document d'identité et selfie
+          </Text>
+          <Text style={styles.configSteps}>7 étapes</Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity style={styles.configCard} onPress={() => handleConfigSelect(advancedKYCConfig)}>
+          <Text style={styles.configIcon}>📁</Text>
+          <Text style={styles.configTitle}>KYC Avancé</Text>
+          <Text style={styles.configDescription}>
+            Vérification avec documents supplémentaires optionnels
+          </Text>
+          <Text style={styles.configSteps}>8 étapes</Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity style={styles.configCard} onPress={() => handleConfigSelect(quickKYCConfig)}>
+          <Text style={styles.configIcon}>⚡</Text>
+          <Text style={styles.configTitle}>KYC Rapide</Text>
+          <Text style={styles.configDescription}>
+            Vérification rapide avec selfie uniquement
+          </Text>
+          <Text style={styles.configSteps}>3 étapes</Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity style={styles.configCard} onPress={() => handleConfigSelect(professionalKYCConfig)}>
+          <Text style={styles.configIcon}>💼</Text>
+          <Text style={styles.configTitle}>KYC Professionnel</Text>
+          <Text style={styles.configDescription}>
+            Vérification complète pour professionnels
+          </Text>
+          <Text style={styles.configSteps}>8 étapes</Text>
+        </TouchableOpacity>
+
+        <TouchableOpacity style={styles.configCard} onPress={() => handleConfigSelect(customConfig)}>
+          <Text style={styles.configIcon}>🎨</Text>
+          <Text style={styles.configTitle}>KYC Personnalisé</Text>
+          <Text style={styles.configDescription}>
+            Configuration personnalisée pour votre service
+          </Text>
+          <Text style={styles.configSteps}>4 étapes</Text>
+        </TouchableOpacity>
+      </View>
+
+      <View style={styles.infoContainer}>
+        <Text style={styles.infoTitle}>Fonctionnalités du système :</Text>
+        <Text style={styles.infoText}>• Configuration automatique des étapes</Text>
+        <Text style={styles.infoText}>• Validation personnalisable</Text>
+        <Text style={styles.infoText}>• Interface adaptative</Text>
+        <Text style={styles.infoText}>• Gestion des erreurs</Text>
+        <Text style={styles.infoText}>• Styles personnalisables</Text>
+        <Text style={styles.infoText}>• Support multi-langues</Text>
+      </View>
+    </View>);
+};
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: '#f8f9fa',
+        padding: 16,
+    },
+    title: {
+        fontSize: 28,
+        fontWeight: 'bold',
+        color: '#333',
+        textAlign: 'center',
+        marginBottom: 8,
+    },
+    subtitle: {
+        fontSize: 16,
+        color: '#666',
+        textAlign: 'center',
+        marginBottom: 32,
+        lineHeight: 22,
+    },
+    configGrid: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        justifyContent: 'space-between',
+        marginBottom: 32,
+    },
+    configCard: {
+        width: '48%',
+        backgroundColor: 'white',
+        borderRadius: 12,
+        padding: 16,
+        marginBottom: 16,
+        shadowColor: '#000',
+        shadowOffset: {
+            width: 0,
+            height: 2,
+        },
+        shadowOpacity: 0.1,
+        shadowRadius: 3.84,
+        elevation: 5,
+    },
+    configIcon: {
+        fontSize: 32,
+        textAlign: 'center',
+        marginBottom: 12,
+    },
+    configTitle: {
+        fontSize: 18,
+        fontWeight: '600',
+        color: '#333',
+        textAlign: 'center',
+        marginBottom: 8,
+    },
+    configDescription: {
+        fontSize: 14,
+        color: '#666',
+        textAlign: 'center',
+        lineHeight: 18,
+        marginBottom: 12,
+    },
+    configSteps: {
+        fontSize: 12,
+        color: '#4CAF50',
+        fontWeight: '600',
+        textAlign: 'center',
+    },
+    infoContainer: {
+        backgroundColor: 'white',
+        borderRadius: 12,
+        padding: 20,
+        shadowColor: '#000',
+        shadowOffset: {
+            width: 0,
+            height: 2,
+        },
+        shadowOpacity: 0.1,
+        shadowRadius: 3.84,
+        elevation: 5,
+    },
+    infoTitle: {
+        fontSize: 18,
+        fontWeight: '600',
+        color: '#333',
+        marginBottom: 12,
+    },
+    infoText: {
+        fontSize: 14,
+        color: '#666',
+        marginBottom: 6,
+        lineHeight: 20,
+    },
+});
+//# sourceMappingURL=KYCExample.js.map

package/build/components/KYCExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KYCExample.js","sourceRoot":"","sources":["../../src/components/KYCExample.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,gBAAgB,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAC/E,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EACL,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,sBAAsB,CAAC;AAG9B,MAAM,CAAC,MAAM,UAAU,GAAa,GAAG,EAAE;IACvC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAuB,IAAI,CAAC,CAAC;IACjF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,kBAAkB,GAAG,CAAC,MAAqB,EAAE,EAAE;QACnD,iBAAiB,CAAC,MAAM,CAAC,CAAC;QAC1B,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,IAAS,EAAE,EAAE;QACnC,KAAK,CAAC,KAAK,CACT,eAAe,EACf,2DAA2D,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,EAAE,EAC1F;YACE;gBACE,IAAI,EAAE,IAAI;gBACV,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,KAAK,CAAC,CAAC;oBACnB,iBAAiB,CAAC,IAAI,CAAC,CAAC;gBAC1B,CAAC;aACF;SACF,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,KAAU,EAAE,EAAE;QACjC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,8BAA8B,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC;IACvE,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,WAAW,CAAC,KAAK,CAAC,CAAC;QACnB,iBAAiB,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,CAAC;IAEF,yCAAyC;IACzC,MAAM,YAAY,GAAG,qBAAqB,CACxC,YAAY,EACZ,kBAAkB,EAClB,gDAAgD,EAChD;QACE;YACE,EAAE,EAAE,mBAAmB;YACvB,IAAI,EAAE,mBAAmB;YACzB,KAAK,EAAE,yBAAyB;YAChC,WAAW,EAAE,8CAA8C;YAC3D,UAAU,EAAE,IAAI;YAChB,SAAS,EAAE,IAAI;YACf,KAAK,EAAE,CAAC;YACR,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;SAC/B;QACD;YACE,EAAE,EAAE,QAAQ;YACZ,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,oBAAoB;YAC3B,WAAW,EAAE,uCAAuC;YACpD,UAAU,EAAE,IAAI;YAChB,SAAS,EAAE,IAAI;YACf,KAAK,EAAE,CAAC;YACR,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;YAC9B,YAAY,EAAE;gBACZ,WAAW,EAAE,CAAC;gBACd,OAAO,EAAE,GAAG;gBACZ,SAAS,EAAE,KAAK;gBAChB,UAAU,EAAE,OAAO;gBACnB,WAAW,EAAE,IAAI;gBACjB,UAAU,EAAE,CAAC;aACd;SACF;QACD;YACE,EAAE,EAAE,cAAc;YAClB,IAAI,EAAE,cAAc;YACpB,KAAK,EAAE,cAAc;YACrB,WAAW,EAAE,0BAA0B;YACvC,UAAU,EAAE,IAAI;YAChB,SAAS,EAAE,IAAI;YACf,KAAK,EAAE,CAAC;SACT;QACD;YACE,EAAE,EAAE,YAAY;YAChB,IAAI,EAAE,YAAY;YAClB,KAAK,EAAE,WAAW;YAClB,WAAW,EAAE,sBAAsB;YACnC,UAAU,EAAE,IAAI;YAChB,SAAS,EAAE,IAAI;YACf,KAAK,EAAE,CAAC;SACT;KACF,EACD;QACE,mBAAmB,EAAE,KAAK;QAC1B,eAAe,EAAE,IAAI;QACrB,eAAe,EAAE,IAAI;QACrB,WAAW,EAAE,IAAI;KAClB,EACD;QACE,YAAY,EAAE,SAAS;QACvB,cAAc,EAAE,SAAS;QACzB,eAAe,EAAE,SAAS;KAC3B,CACF,CAAC;IAEF,IAAI,QAAQ,IAAI,cAAc,EAAE,CAAC;QAC/B,OAAO,CACL,CAAC,mBAAmB,CAClB,MAAM,CAAC,CAAC,cAAc,CAAC,CACvB,UAAU,CAAC,CAAC,cAAc,CAAC,CAC3B,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,OAAO,CAAC,CAAC,WAAW,CAAC,EACrB,CACH,CAAC;IACJ,CAAC;IAED,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAC5B;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,wBAAwB,EAAE,IAAI,CACzD;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAC3B;;MACF,EAAE,IAAI,CAEN;;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAC7B;QAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,cAAc,CAAC,CAAC,CAElD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,CACxC;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,WAAW,EAAE,IAAI,CAClD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CACpC;;UACF,EAAE,IAAI,CACN;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,IAAI,CACjD;QAAA,EAAE,gBAAgB,CAElB;;QAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CAAC,CAErD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,CACxC;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,UAAU,EAAE,IAAI,CACjD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CACpC;;UACF,EAAE,IAAI,CACN;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,IAAI,CACjD;QAAA,EAAE,gBAAgB,CAElB;;QAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,cAAc,CAAC,CAAC,CAElD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,CACvC;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,UAAU,EAAE,IAAI,CACjD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CACpC;;UACF,EAAE,IAAI,CACN;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,IAAI,CACjD;QAAA,EAAE,gBAAgB,CAElB;;QAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,qBAAqB,CAAC,CAAC,CAEzD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,CACxC;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,iBAAiB,EAAE,IAAI,CACxD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CACpC;;UACF,EAAE,IAAI,CACN;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,IAAI,CACjD;QAAA,EAAE,gBAAgB,CAElB;;QAAA,CAAC,gBAAgB,CACf,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CACzB,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC,CAEhD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,IAAI,CACxC;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,gBAAgB,EAAE,IAAI,CACvD;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CACpC;;UACF,EAAE,IAAI,CACN;UAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,QAAQ,EAAE,IAAI,CACjD;QAAA,EAAE,gBAAgB,CACpB;MAAA,EAAE,IAAI,CAEN;;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,CAChC;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,4BAA4B,EAAE,IAAI,CACjE;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,sCAAsC,EAAE,IAAI,CAC1E;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,4BAA4B,EAAE,IAAI,CAChE;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,sBAAsB,EAAE,IAAI,CAC1D;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,qBAAqB,EAAE,IAAI,CACzD;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,yBAAyB,EAAE,IAAI,CAC7D;QAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,uBAAuB,EAAE,IAAI,CAC7D;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,IAAI,EAAE,CAAC;QACP,eAAe,EAAE,SAAS;QAC1B,OAAO,EAAE,EAAE;KACZ;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,CAAC;KAChB;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,EAAE;QAChB,UAAU,EAAE,EAAE;KACf;IACD,UAAU,EAAE;QACV,aAAa,EAAE,KAAK;QACpB,QAAQ,EAAE,MAAM;QAChB,cAAc,EAAE,eAAe;QAC/B,YAAY,EAAE,EAAE;KACjB;IACD,UAAU,EAAE;QACV,KAAK,EAAE,KAAK;QACZ,eAAe,EAAE,OAAO;QACxB,YAAY,EAAE,EAAE;QAChB,OAAO,EAAE,EAAE;QACX,YAAY,EAAE,EAAE;QAChB,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE;YACZ,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACV;QACD,aAAa,EAAE,GAAG;QAClB,YAAY,EAAE,IAAI;QAClB,SAAS,EAAE,CAAC;KACb;IACD,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE;QACZ,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,EAAE;KACjB;IACD,WAAW,EAAE;QACX,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;QACjB,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,CAAC;KAChB;IACD,iBAAiB,EAAE;QACjB,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,QAAQ;QACnB,UAAU,EAAE,EAAE;QACd,YAAY,EAAE,EAAE;KACjB;IACD,WAAW,EAAE;QACX,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,SAAS;QAChB,UAAU,EAAE,KAAK;QACjB,SAAS,EAAE,QAAQ;KACpB;IACD,aAAa,EAAE;QACb,eAAe,EAAE,OAAO;QACxB,YAAY,EAAE,EAAE;QAChB,OAAO,EAAE,EAAE;QACX,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE;YACZ,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACV;QACD,aAAa,EAAE,GAAG;QAClB,YAAY,EAAE,IAAI;QAClB,SAAS,EAAE,CAAC;KACb;IACD,SAAS,EAAE;QACT,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;QACjB,KAAK,EAAE,MAAM;QACb,YAAY,EAAE,EAAE;KACjB;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,MAAM;QACb,YAAY,EAAE,CAAC;QACf,UAAU,EAAE,EAAE;KACf;CACF,CAAC,CAAC","sourcesContent":["import React, { useState } from 'react';\nimport { View, Text, TouchableOpacity, StyleSheet, Alert } from 'react-native';\nimport { ConfigurableKYCFlow } from './ConfigurableKYCFlow';\nimport { \n  basicKYCConfig, \n  advancedKYCConfig, \n  quickKYCConfig, \n  professionalKYCConfig,\n  createCustomKYCConfig \n} from '../config/KYCConfigs';\nimport { KYCFlowConfig } from '../types/KYC.types';\n\nexport const KYCExample: React.FC = () => {\n  const [selectedConfig, setSelectedConfig] = useState<KYCFlowConfig | null>(null);\n  const [showFlow, setShowFlow] = useState(false);\n\n  const handleConfigSelect = (config: KYCFlowConfig) => {\n    setSelectedConfig(config);\n    setShowFlow(true);\n  };\n\n  const handleComplete = (data: any) => {\n    Alert.alert(\n      'KYC Terminé !',\n      `Vérification terminée avec succès.\\nDonnées collectées: ${JSON.stringify(data, null, 2)}`,\n      [\n        {\n          text: 'OK',\n          onPress: () => {\n            setShowFlow(false);\n            setSelectedConfig(null);\n          }\n        }\n      ]\n    );\n  };\n\n  const handleError = (error: any) => {\n    Alert.alert('Erreur', `Une erreur s'est produite: ${error.message}`);\n  };\n\n  const handleClose = () => {\n    setShowFlow(false);\n    setSelectedConfig(null);\n  };\n\n  // Exemple de configuration personnalisée\n  const customConfig = createCustomKYCConfig(\n    'custom_kyc',\n    'KYC Personnalisé',\n    'Configuration personnalisée pour votre service',\n    [\n      {\n        id: 'country_selection',\n        type: 'country_selection',\n        title: 'Sélectionnez votre pays',\n        description: 'Choisissez le pays qui a émis votre document',\n        isRequired: true,\n        isVisible: true,\n        order: 0,\n        validation: { required: true },\n      },\n      {\n        id: 'selfie',\n        type: 'selfie_capture',\n        title: 'Prenez votre photo',\n        description: 'Une photo de votre visage est requise',\n        isRequired: true,\n        isVisible: true,\n        order: 1,\n        validation: { required: true },\n        cameraConfig: {\n          aspectRatio: 1,\n          quality: 0.8,\n          flashMode: 'off',\n          cameraType: 'front',\n          allowRetake: true,\n          maxRetakes: 3,\n        },\n      },\n      {\n        id: 'verification',\n        type: 'verification',\n        title: 'Vérification',\n        description: 'Vérification en cours...',\n        isRequired: true,\n        isVisible: true,\n        order: 2,\n      },\n      {\n        id: 'completion',\n        type: 'completion',\n        title: 'Terminé !',\n        description: 'Vérification réussie',\n        isRequired: true,\n        isVisible: true,\n        order: 3,\n      },\n    ],\n    {\n      allowBackNavigation: false,\n      showProgressBar: true,\n      showStepNumbers: true,\n      autoAdvance: true,\n    },\n    {\n      primaryColor: '#FF6B6B',\n      secondaryColor: '#4ECDC4',\n      backgroundColor: '#f8f9fa',\n    }\n  );\n\n  if (showFlow && selectedConfig) {\n    return (\n      <ConfigurableKYCFlow\n        config={selectedConfig}\n        onComplete={handleComplete}\n        onError={handleError}\n        onClose={handleClose}\n      />\n    );\n  }\n\n  return (\n    <View style={styles.container}>\n      <Text style={styles.title}>Système KYC Configurable</Text>\n      <Text style={styles.subtitle}>\n        Sélectionnez le type de vérification d'identité que vous souhaitez utiliser\n      </Text>\n\n      <View style={styles.configGrid}>\n        <TouchableOpacity \n          style={styles.configCard}\n          onPress={() => handleConfigSelect(basicKYCConfig)}\n        >\n          <Text style={styles.configIcon}>📋</Text>\n          <Text style={styles.configTitle}>KYC Basique</Text>\n          <Text style={styles.configDescription}>\n            Vérification standard avec document d'identité et selfie\n          </Text>\n          <Text style={styles.configSteps}>7 étapes</Text>\n        </TouchableOpacity>\n\n        <TouchableOpacity \n          style={styles.configCard}\n          onPress={() => handleConfigSelect(advancedKYCConfig)}\n        >\n          <Text style={styles.configIcon}>📁</Text>\n          <Text style={styles.configTitle}>KYC Avancé</Text>\n          <Text style={styles.configDescription}>\n            Vérification avec documents supplémentaires optionnels\n          </Text>\n          <Text style={styles.configSteps}>8 étapes</Text>\n        </TouchableOpacity>\n\n        <TouchableOpacity \n          style={styles.configCard}\n          onPress={() => handleConfigSelect(quickKYCConfig)}\n        >\n          <Text style={styles.configIcon}>⚡</Text>\n          <Text style={styles.configTitle}>KYC Rapide</Text>\n          <Text style={styles.configDescription}>\n            Vérification rapide avec selfie uniquement\n          </Text>\n          <Text style={styles.configSteps}>3 étapes</Text>\n        </TouchableOpacity>\n\n        <TouchableOpacity \n          style={styles.configCard}\n          onPress={() => handleConfigSelect(professionalKYCConfig)}\n        >\n          <Text style={styles.configIcon}>💼</Text>\n          <Text style={styles.configTitle}>KYC Professionnel</Text>\n          <Text style={styles.configDescription}>\n            Vérification complète pour professionnels\n          </Text>\n          <Text style={styles.configSteps}>8 étapes</Text>\n        </TouchableOpacity>\n\n        <TouchableOpacity \n          style={styles.configCard}\n          onPress={() => handleConfigSelect(customConfig)}\n        >\n          <Text style={styles.configIcon}>🎨</Text>\n          <Text style={styles.configTitle}>KYC Personnalisé</Text>\n          <Text style={styles.configDescription}>\n            Configuration personnalisée pour votre service\n          </Text>\n          <Text style={styles.configSteps}>4 étapes</Text>\n        </TouchableOpacity>\n      </View>\n\n      <View style={styles.infoContainer}>\n        <Text style={styles.infoTitle}>Fonctionnalités du système :</Text>\n        <Text style={styles.infoText}>• Configuration automatique des étapes</Text>\n        <Text style={styles.infoText}>• Validation personnalisable</Text>\n        <Text style={styles.infoText}>• Interface adaptative</Text>\n        <Text style={styles.infoText}>• Gestion des erreurs</Text>\n        <Text style={styles.infoText}>• Styles personnalisables</Text>\n        <Text style={styles.infoText}>• Support multi-langues</Text>\n      </View>\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n    backgroundColor: '#f8f9fa',\n    padding: 16,\n  },\n  title: {\n    fontSize: 28,\n    fontWeight: 'bold',\n    color: '#333',\n    textAlign: 'center',\n    marginBottom: 8,\n  },\n  subtitle: {\n    fontSize: 16,\n    color: '#666',\n    textAlign: 'center',\n    marginBottom: 32,\n    lineHeight: 22,\n  },\n  configGrid: {\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    justifyContent: 'space-between',\n    marginBottom: 32,\n  },\n  configCard: {\n    width: '48%',\n    backgroundColor: 'white',\n    borderRadius: 12,\n    padding: 16,\n    marginBottom: 16,\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  configIcon: {\n    fontSize: 32,\n    textAlign: 'center',\n    marginBottom: 12,\n  },\n  configTitle: {\n    fontSize: 18,\n    fontWeight: '600',\n    color: '#333',\n    textAlign: 'center',\n    marginBottom: 8,\n  },\n  configDescription: {\n    fontSize: 14,\n    color: '#666',\n    textAlign: 'center',\n    lineHeight: 18,\n    marginBottom: 12,\n  },\n  configSteps: {\n    fontSize: 12,\n    color: '#4CAF50',\n    fontWeight: '600',\n    textAlign: 'center',\n  },\n  infoContainer: {\n    backgroundColor: 'white',\n    borderRadius: 12,\n    padding: 20,\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  infoTitle: {\n    fontSize: 18,\n    fontWeight: '600',\n    color: '#333',\n    marginBottom: 12,\n  },\n  infoText: {\n    fontSize: 14,\n    color: '#666',\n    marginBottom: 6,\n    lineHeight: 20,\n  },\n}); "]}

package/build/components/KYCFlow.d.ts

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

package/build/components/KYCFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KYCFlow.d.ts","sourceRoot":"","sources":["../../src/components/KYCFlow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EA2O3B,CAAC"}