@trustchex/react-native-sdk 1.512.0 → 1.513.0

package/lib/typescript/src/Translation/Resources/tr.d.ts

@@ -104,6 +104,19 @@ declare const _default: {
     'addressCaptureScreen.retakeProof': string;
     'addressCaptureScreen.proofCameraHint': string;
     'addressCaptureScreen.capture': string;
+    'addressCaptureScreen.previewHint': string;
+    'addressCaptureScreen.warnNoName': string;
+    'addressCaptureScreen.warnNoAddress': string;
+    'addressCaptureScreen.warnNoText': string;
+    'addressCaptureScreen.guideHeader': string;
+    'addressCaptureScreen.guideText': string;
+    'addressCaptureScreen.guidePointWholeDocument': string;
+    'addressCaptureScreen.guidePointLighting': string;
+    'addressCaptureScreen.guidePointSteady': string;
+    'addressCaptureScreen.guidePointDocuments': string;
+    'addressCaptureScreen.retakeTooDark': string;
+    'addressCaptureScreen.retakeTooBright': string;
+    'addressCaptureScreen.retakeBlurry': string;
     'eidScannerScreen.faceImageNotFound': string;
     'eidScannerScreen.documentCode': string;
     'eidScannerScreen.nationality': string;

package/lib/typescript/src/Translation/Resources/tr.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tr.d.ts","sourceRoot":"","sources":["../../../../../src/Translation/Resources/tr.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAgUE"}
+{"version":3,"file":"tr.d.ts","sourceRoot":"","sources":["../../../../../src/Translation/Resources/tr.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAyVE"}

package/lib/typescript/src/version.d.ts

@@ -1,2 +1,2 @@
-export declare const SDK_VERSION = "1.512.0";
+export declare const SDK_VERSION = "1.513.0";
 //# sourceMappingURL=version.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trustchex/react-native-sdk",
-  "version": "1.512.0",
+  "version": "1.513.0",
   "description": "Trustchex mobile app react native SDK for android or ios devices",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/Screens/Dynamic/AddressCaptureScreen.tsx

@@ -4,12 +4,14 @@ import {
   View,
   Text,
   StyleSheet,
-  ScrollView,
   Image,
   TouchableOpacity,
+  ActivityIndicator,
+  NativeModules,
 } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useTranslation } from 'react-i18next';
+import LottieView from 'lottie-react-native';
 import {
   TrustchexCamera,
   type Frame,
@@ -26,6 +28,56 @@ import {
   trackVerificationComplete,
 } from '../../Shared/Libs/analytics.utils';
 import { useKeepAwake } from '../../Shared/Libs/native-keep-awake.utils';
+import { assessAddressProof } from '../../Shared/Libs/addressProofHeuristic';
+import { recognizeVizBlocks } from '../../Shared/Libs/vizName';
+import { MIN_BRIGHTNESS_THRESHOLD } from '../../Shared/Components/IdentityDocumentCamera.constants';
+
+const { OpenCVModule } = NativeModules;
+
+// Quality thresholds for the captured proof photo. The darkness floor is shared
+// with the document camera (MIN_BRIGHTNESS_THRESHOLD) so a tuning pass applies
+// to both. The upper bound here is a FULL-FRAME mean-brightness cap for a
+// washed-out capture — deliberately looser than the document camera's
+// MAX_BRIGHTNESS_THRESHOLD (210), which is a REGION glare threshold, not a
+// full-frame mean.
+const MIN_BRIGHTNESS = MIN_BRIGHTNESS_THRESHOLD; // below → too dark
+const MAX_BRIGHTNESS = 245; // full-frame mean above → washed out / glare
+const BLUR_THRESHOLD = 50; // Laplacian variance below → too blurry
+
+type QualityReason = 'dark' | 'bright' | 'blurry' | null;
+
+/**
+ * Assess a captured proof photo. Brightness comes from the camera Frame (Y-plane
+ * luminance, computed natively per frame — no extra decode); only the blur check
+ * needs the image (native OpenCV Laplacian variance). Best-effort: returns ok
+ * when the native check is unavailable or throws, so an error never blocks.
+ */
+const assessImageQuality = async (
+  base64Image: string,
+  frameBrightness: number | undefined
+): Promise<QualityReason> => {
+  // Prefer the frame's native brightness; only fall back to a decode when the
+  // frame didn't carry one.
+  try {
+    let brightness = frameBrightness;
+    if (brightness == null && OpenCVModule) {
+      brightness = await OpenCVModule.getAverageBrightness(base64Image);
+    }
+    if (brightness != null) {
+      if (brightness < MIN_BRIGHTNESS) return 'dark';
+      if (brightness > MAX_BRIGHTNESS) return 'bright';
+    }
+    if (!OpenCVModule) return null;
+    const isBlurry: boolean = await OpenCVModule.checkBlurry(
+      base64Image,
+      BLUR_THRESHOLD
+    );
+    if (isBlurry) return 'blurry';
+    return null;
+  } catch {
+    return null;
+  }
+};
 
 /**
  * ADDRESS_CAPTURE step (MASAK Tebliğ No. 32 Article 4/C(1)(d)). The user confirms
@@ -52,26 +104,112 @@ const AddressCaptureScreen = () => {
     appContext.lastDocumentRead?.document.address ??
     '';
 
+  // Holder name parts (chip/MRZ), used to check the captured proof actually
+  // shows this person's name. Prefer the corrected display name when available.
+  const docName = appContext.lastDocumentRead?.name;
+  const nameParts = [
+    docName?.displayFirst,
+    docName?.displayLast,
+    docName?.rawFirst,
+    docName?.rawLast,
+  ];
+
+  // Whether the proof is mandatory is governed by the step's own `required`
+  // flag (like every other step) — there is no separate config. A required
+  // step blocks Continue until a proof photo is captured; an optional step
+  // lets the user proceed (and skip) without one. The skip affordance is the
+  // NavigationManager's, rendered on the guide for optional steps.
+
   const [proofImage, setProofImage] = useState<string | undefined>();
   const [isCameraOpen, setIsCameraOpen] = useState(false);
+  const [isPreviewOpen, setIsPreviewOpen] = useState(false);
+  const [capturing, setCapturing] = useState(false);
+  const [qualityReason, setQualityReason] = useState<QualityReason>(null);
+  // Soft content warning shown on the preview when the OCR text doesn't look
+  // like an address document with the holder's name. Never blocks Continue.
+  const [contentWarning, setContentWarning] = useState<
+    'noName' | 'noAddress' | 'noText' | null
+  >(null);
   const captureNextFrame = useRef(false);
+  // Mirrors proofImage for the async OCR guard (a stale OCR result must only
+  // apply to the photo currently being previewed).
+  const proofImageRef = useRef<string | undefined>(undefined);
+  proofImageRef.current = proofImage;
 
   useEffect(() => {
     trackVerificationStart('ADDRESS_CAPTURE');
   }, []);
 
+  const openCamera = () => {
+    setQualityReason(null);
+    setContentWarning(null);
+    setIsPreviewOpen(false);
+    setIsCameraOpen(true);
+  };
+
   const onFrameAvailable = (frame: Frame) => {
-    if (!captureNextFrame.current) return;
+    if (!captureNextFrame.current || capturing) return;
     const b64 = frame.base64Image;
-    if (b64) {
-      captureNextFrame.current = false;
+    if (!b64) return;
+    captureNextFrame.current = false;
+    const frameBrightness = frame.brightness;
+    setCapturing(true);
+    // Gate acceptance on a quality check: a too-dark / too-bright / blurry
+    // photo keeps the camera open with a retake message instead of accepting it.
+    assessImageQuality(b64, frameBrightness).then((reason) => {
+      setCapturing(false);
+      if (reason) {
+        setQualityReason(reason);
+        return;
+      }
+      setQualityReason(null);
+      setContentWarning(null);
       setProofImage(b64);
+      // Show the captured photo immediately (Retake / Continue) — don't make
+      // the user wait on OCR before seeing their photo.
       setIsCameraOpen(false);
+      setIsPreviewOpen(true);
+      // Soft content check runs in the background and fills in the warning. We
+      // OCR the FULL captured image (not frame.resultText, which the native
+      // camera crops to the MRZ ROI), so the name/address is actually in view.
+      // Best-effort: any failure → no warning, never blocks Continue.
+      assessProofContent(b64).then((warning) => {
+        // Only apply if the user is still viewing THIS captured photo.
+        if (proofImageRef.current === b64) setContentWarning(warning);
+      });
+    });
+  };
+
+  /// OCR the full captured image and run the address-proof heuristic. Returns
+  /// the warning key ('noName' | 'noAddress' | 'noText') or null when it looks
+  /// fine or the check can't run.
+  const assessProofContent = async (
+    b64: string
+  ): Promise<'noName' | 'noAddress' | 'noText' | null> => {
+    try {
+      const blocks = await recognizeVizBlocks(b64);
+      const ocrText = blocks.map((b) => b.text).join('\n');
+      const signals = assessAddressProof(ocrText, { nameParts, chipAddress });
+      if (signals.ok) return null;
+      if (!signals.hasName && !signals.hasAddress) return 'noText';
+      return signals.hasName ? 'noAddress' : 'noName';
+    } catch {
+      return null;
     }
   };
 
-  // A proof photo is the whole point of this step.
-  const canContinue = !!proofImage;
+  const qualityMessage = (): string => {
+    switch (qualityReason) {
+      case 'dark':
+        return t('addressCaptureScreen.retakeTooDark');
+      case 'bright':
+        return t('addressCaptureScreen.retakeTooBright');
+      case 'blurry':
+        return t('addressCaptureScreen.retakeBlurry');
+      default:
+        return t('addressCaptureScreen.proofCameraHint');
+    }
+  };
 
   const onContinue = () => {
     // Attach the proof to the existing (chip-sourced) address without changing
@@ -84,113 +222,334 @@ const AddressCaptureScreen = () => {
       proofImage,
       proofImageMimeType: proofImage ? 'image/jpeg' : undefined,
     };
+    setIsPreviewOpen(false);
     trackVerificationComplete('ADDRESS_CAPTURE', true, 1);
     navigationManagerRef.current?.navigateToNextStep();
   };
 
+  // Post-capture preview — confirm the photo, then Continue or Retake.
+  if (isPreviewOpen && proofImage) {
+    return (
+      <SafeAreaView style={styles.previewContainer}>
+        <View style={styles.previewImageWrap}>
+          <Image
+            source={{ uri: `data:image/jpeg;base64,${proofImage}` }}
+            style={styles.previewImage}
+            resizeMode="contain"
+          />
+        </View>
+        {contentWarning ? (
+          <View style={styles.previewWarning}>
+            <Text style={styles.previewWarningText}>
+              {contentWarning === 'noName'
+                ? t('addressCaptureScreen.warnNoName')
+                : contentWarning === 'noAddress'
+                  ? t('addressCaptureScreen.warnNoAddress')
+                  : t('addressCaptureScreen.warnNoText')}
+            </Text>
+          </View>
+        ) : (
+          <Text style={styles.previewHint}>
+            {t('addressCaptureScreen.previewHint')}
+          </Text>
+        )}
+        <View
+          style={[styles.previewFooter, { paddingBottom: insets.bottom + 12 }]}
+        >
+          <View style={styles.previewActions}>
+            <View style={styles.previewActionItem}>
+              <StyledButton mode="outlined" onPress={openCamera}>
+                {t('addressCaptureScreen.retakeProof')}
+              </StyledButton>
+            </View>
+            <View style={styles.previewActionItem}>
+              <StyledButton onPress={onContinue}>
+                {t('general.continue')}
+              </StyledButton>
+            </View>
+          </View>
+          {/* Skip below the actions (own row) so it never overlaps them. */}
+          <NavigationManager ref={navigationManagerRef} />
+        </View>
+      </SafeAreaView>
+    );
+  }
+
   if (isCameraOpen) {
     return (
-      <SafeAreaView style={styles.cameraContainer}>
+      <View style={styles.cameraContainer}>
         <TrustchexCamera
-          style={styles.camera}
+          style={StyleSheet.absoluteFill}
+          cameraType="back"
+          // The native camera emits onFrameAvailable when frame processing is on
+          // AND either a detector is enabled or includeBase64 is set. We only
+          // want the JPEG (no per-frame OCR), so includeBase64 alone keeps frames
+          // flowing; the proof photo is OCR'd once, on the still, at capture.
+          enableFrameProcessing
           includeBase64
+          targetFps={8}
           onFrameAvailable={(e) => onFrameAvailable(e.nativeEvent.frame)}
         />
-        <View style={[styles.cameraControls, { paddingBottom: insets.bottom + 16 }]}>
-          <Text style={styles.cameraHint}>
-            {t('addressCaptureScreen.proofCameraHint')}
-          </Text>
-          <StyledButton onPress={() => (captureNextFrame.current = true)}>
-            {t('addressCaptureScreen.capture')}
-          </StyledButton>
-          <TouchableOpacity onPress={() => setIsCameraOpen(false)}>
-            <Text style={styles.cancel}>{t('general.cancel')}</Text>
+
+        {/* Framing guide so the user lines up the whole document. The bottom
+            inset clears the hint + shutter stack so the border never overlaps
+            the "fit the whole document" message. */}
+        <View
+          style={[
+            styles.frameGuide,
+            { top: insets.top + 64, bottom: insets.bottom + 210 },
+          ]}
+          pointerEvents="none"
+        />
+
+        {/* Floating cancel (X), top-left. */}
+        <TouchableOpacity
+          style={[styles.cancelButton, { top: insets.top + 12 }]}
+          accessibilityLabel={t('general.cancel')}
+          onPress={() => {
+            captureNextFrame.current = false;
+            // Back to the guide (the only non-camera/non-preview screen).
+            setIsCameraOpen(false);
+          }}
+        >
+          <Text style={styles.cancelGlyph}>✕</Text>
+        </TouchableOpacity>
+
+        {/* Bottom: hint (red on quality failure) + floating shutter. */}
+        <View
+          style={[styles.cameraBottom, { paddingBottom: insets.bottom + 28 }]}
+          pointerEvents="box-none"
+        >
+          <View
+            style={[
+              styles.cameraHintPill,
+              qualityReason ? styles.cameraHintPillError : null,
+            ]}
+          >
+            <Text style={styles.cameraHint}>{qualityMessage()}</Text>
+          </View>
+          <TouchableOpacity
+            style={styles.shutter}
+            disabled={capturing}
+            accessibilityLabel={t('addressCaptureScreen.capture')}
+            onPress={() => {
+              captureNextFrame.current = true;
+            }}
+          >
+            {capturing ? (
+              <ActivityIndicator color="#111" />
+            ) : (
+              <View style={styles.shutterInner} />
+            )}
           </TouchableOpacity>
         </View>
-      </SafeAreaView>
+      </View>
     );
   }
 
+  // No interim form: the guide is the only non-camera/non-preview screen.
+  // Reached only if the camera was cancelled — fall back to the guide.
   return (
-    <SafeAreaView style={styles.container}>
-      <ScrollView
-        contentContainerStyle={[styles.content, { paddingBottom: insets.bottom + 24 }]}
-        keyboardShouldPersistTaps="handled"
-      >
-        <Text style={styles.title}>{t('addressCaptureScreen.title')}</Text>
-        <Text style={styles.subtitle}>{t('addressCaptureScreen.subtitle')}</Text>
-
+    <SafeAreaView style={styles.guideContainer}>
+      <View style={styles.guideContent}>
+        <LottieView
+          source={require('../../Shared/Animations/address-scan.json')}
+          style={styles.guideAnimation}
+          loop
+          autoPlay
+        />
+        <Text style={styles.guideHeader}>
+          {t('addressCaptureScreen.guideHeader')}
+        </Text>
+        {/* Subtitle + bullet points are LEFT-aligned, matching the other guides. */}
+        <View style={styles.guidePoints}>
+          <Text style={styles.guideText}>
+            {t('addressCaptureScreen.guideText')}
+          </Text>
+          <Text style={styles.guidePoint}>
+            • {t('addressCaptureScreen.guidePointWholeDocument')}
+          </Text>
+          <Text style={styles.guidePoint}>
+            • {t('addressCaptureScreen.guidePointLighting')}
+          </Text>
+          <Text style={styles.guidePoint}>
+            • {t('addressCaptureScreen.guidePointSteady')}
+          </Text>
+          <Text style={styles.guidePoint}>
+            • {t('addressCaptureScreen.guidePointDocuments')}
+          </Text>
+        </View>
         {chipAddress ? (
-          <>
-            <Text style={styles.label}>
+          <View style={styles.chipAddressBox}>
+            <Text style={styles.chipAddressLabel}>
               {t('addressCaptureScreen.addressLabel')}
             </Text>
-            <View style={styles.readonlyAddress}>
-              <Text style={styles.readonlyAddressText}>{chipAddress}</Text>
-            </View>
-            <Text style={styles.chipHint}>
+            <Text style={styles.chipAddressText}>{chipAddress}</Text>
+            <Text style={styles.chipAddressHint}>
               {t('addressCaptureScreen.prefilledFromChip')}
             </Text>
-          </>
-        ) : null}
-
-        <Text style={styles.label}>{t('addressCaptureScreen.proofLabel')}</Text>
-        <Text style={styles.proofHint}>{t('addressCaptureScreen.proofHint')}</Text>
-        {proofImage ? (
-          <Image
-            source={{ uri: `data:image/jpeg;base64,${proofImage}` }}
-            style={styles.proofPreview}
-            resizeMode="cover"
-          />
+          </View>
         ) : null}
-        <StyledButton onPress={() => setIsCameraOpen(true)}>
-          {proofImage
-            ? t('addressCaptureScreen.retakeProof')
-            : t('addressCaptureScreen.captureProof')}
-        </StyledButton>
-      </ScrollView>
-
-      <View style={[styles.footer, { paddingBottom: insets.bottom + 12 }]}>
-        <StyledButton disabled={!canContinue} onPress={onContinue}>
-          {t('general.continue')}
-        </StyledButton>
+        <View style={styles.guideButton}>
+          <StyledButton onPress={openCamera}>
+            {t('general.letsGo')}
+          </StyledButton>
+        </View>
       </View>
-
       <NavigationManager ref={navigationManagerRef} />
     </SafeAreaView>
   );
 };
 
 const styles = StyleSheet.create({
-  container: { flex: 1, backgroundColor: '#FFFFFF' },
-  content: { padding: 20 },
-  title: { fontSize: 22, fontWeight: '700', color: '#111', marginBottom: 8 },
-  subtitle: { fontSize: 15, color: '#555', marginBottom: 16 },
-  chipHint: { fontSize: 13, color: '#2E7D32', marginBottom: 12 },
-  label: { fontSize: 14, fontWeight: '600', color: '#222', marginTop: 16, marginBottom: 6 },
-  readonlyAddress: {
+  // Start guide — centered vertically + horizontally, like the other guides.
+  guideContainer: {
+    flex: 1,
+    backgroundColor: '#FFFFFF',
+  },
+  // Inner wrapper carries the horizontal padding + centering, so it always
+  // applies regardless of the SafeAreaView's own inset handling on iOS.
+  guideContent: {
+    flex: 1,
+    paddingHorizontal: 24,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  guideAnimation: { width: 220, height: 220, marginBottom: 8 },
+  guideHeader: {
+    fontSize: 18,
+    fontWeight: '700',
+    color: '#000',
+    textAlign: 'center',
+    marginBottom: 10,
+  },
+  // Subtitle + bullets: left-aligned block, full width.
+  guidePoints: { alignSelf: 'stretch', marginTop: 4 },
+  guideText: {
+    fontSize: 14,
+    color: '#000',
+    textAlign: 'left',
+    marginBottom: 12,
+  },
+  guidePoint: {
+    fontSize: 14,
+    color: '#000',
+    textAlign: 'left',
+    lineHeight: 20,
+    marginTop: 10,
+  },
+  chipAddressBox: {
+    alignSelf: 'stretch',
+    marginTop: 16,
+    padding: 12,
     borderWidth: 1,
     borderColor: '#E0E0E0',
     backgroundColor: '#F7F7F7',
     borderRadius: 8,
-    padding: 12,
-    minHeight: 56,
   },
-  readonlyAddressText: { fontSize: 15, color: '#111' },
-  proofHint: { fontSize: 13, color: '#777', marginBottom: 10 },
-  proofPreview: {
+  chipAddressLabel: {
+    fontSize: 13,
+    fontWeight: '600',
+    color: '#222',
+    marginBottom: 4,
+  },
+  chipAddressText: { fontSize: 15, color: '#111' },
+  chipAddressHint: { fontSize: 12, color: '#2E7D32', marginTop: 4 },
+  guideButton: { alignSelf: 'stretch', marginTop: 24 },
+  // Post-capture preview — white screen, matching the rest of the app.
+  previewContainer: { flex: 1, backgroundColor: '#FFFFFF' },
+  previewImageWrap: { flex: 1, padding: 16 },
+  previewImage: {
+    flex: 1,
     width: '100%',
-    height: 180,
-    borderRadius: 8,
+    borderRadius: 12,
+  },
+  previewHint: {
+    color: '#555',
+    fontSize: 13,
+    textAlign: 'center',
+    paddingHorizontal: 20,
+    marginBottom: 12,
+  },
+  previewWarning: {
+    marginHorizontal: 16,
     marginBottom: 12,
-    backgroundColor: '#EEE',
+    paddingHorizontal: 14,
+    paddingVertical: 10,
+    borderRadius: 8,
+    backgroundColor: '#FFF4E5',
+    borderWidth: 1,
+    borderColor: '#F0B27A',
+  },
+  previewWarningText: { color: '#92400E', fontSize: 13, textAlign: 'center' },
+  previewFooter: {
+    paddingHorizontal: 20,
+    paddingTop: 8,
+    backgroundColor: '#FFFFFF',
+    gap: 4,
   },
-  footer: { paddingHorizontal: 20, paddingTop: 8, backgroundColor: '#FFFFFF' },
+  previewActions: { flexDirection: 'row', gap: 12 },
+  previewActionItem: { flex: 1 },
   cameraContainer: { flex: 1, backgroundColor: '#000' },
-  camera: { flex: 1 },
-  cameraControls: { paddingHorizontal: 20, gap: 12, backgroundColor: '#000' },
-  cameraHint: { color: '#FFF', textAlign: 'center', marginBottom: 8 },
-  cancel: { color: '#FFF', textAlign: 'center', marginTop: 8, fontSize: 15 },
+  frameGuide: {
+    position: 'absolute',
+    left: 20,
+    right: 20,
+    borderWidth: 2,
+    borderColor: 'rgba(255,255,255,0.7)',
+    borderRadius: 12,
+    zIndex: 1,
+  },
+  cancelButton: {
+    position: 'absolute',
+    left: 16,
+    width: 44,
+    height: 44,
+    borderRadius: 22,
+    backgroundColor: 'rgba(0,0,0,0.45)',
+    alignItems: 'center',
+    justifyContent: 'center',
+    zIndex: 2,
+  },
+  cancelGlyph: {
+    color: '#FFF',
+    fontSize: 22,
+    fontWeight: '600',
+    lineHeight: 24,
+  },
+  cameraBottom: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: 0,
+    alignItems: 'center',
+  },
+  cameraHintPill: {
+    maxWidth: '88%',
+    paddingHorizontal: 16,
+    paddingVertical: 10,
+    borderRadius: 10,
+    backgroundColor: 'rgba(0,0,0,0.55)',
+    marginBottom: 20,
+  },
+  cameraHintPillError: { backgroundColor: 'rgba(176,0,32,0.85)' },
+  cameraHint: { color: '#FFF', textAlign: 'center', fontSize: 14 },
+  shutter: {
+    width: 74,
+    height: 74,
+    borderRadius: 37,
+    borderWidth: 4,
+    borderColor: 'rgba(255,255,255,0.85)',
+    backgroundColor: 'rgba(255,255,255,0.25)',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  shutterInner: {
+    width: 56,
+    height: 56,
+    borderRadius: 28,
+    backgroundColor: '#FFF',
+  },
 });
 
 export default AddressCaptureScreen;

package/src/Screens/Dynamic/IdentityDocumentEIDScanningScreen.tsx

@@ -118,14 +118,24 @@ const IdentityDocumentEIDScanningScreen = () => {
             }
             vizImage={
               // Full data-page image from the EID step's camera scan. EIDScanner
-              // runs a one-shot OCR pass over it to recover the diacritic printed
-              // name when the chip's DG11 is absent or one-sided (e.g. Turkish
-              // passports). The live camera only OCRs a cropped MRZ region, so the
-              // printed name must be recovered from the full image here.
+              // OCRs it to recover the diacritic printed name when the chip's
+              // DG11 is absent or one-sided (e.g. Turkish passports). The live
+              // camera only OCRs a cropped MRZ region, so the printed name must
+              // be recovered from the full image here.
               passportData?.image ??
               idFrontSideData?.image ??
               idBackSideData?.image
             }
+            vizImages={
+              // All available captures — EIDScanner OCRs each and votes on the
+              // recovered name so a single noisy pass can't corrupt it. De-dup
+              // happens in EIDScanner, so overlap with `vizImage` is harmless.
+              [
+                passportData?.image,
+                idFrontSideData?.image,
+                idBackSideData?.image,
+              ]
+            }
             onScanSuccess={(mrzFields, faceImage, mimeType) => {
               if (mrzFields && faceImage && mimeType) {
                 if (!appContext.identificationInfo.scannedDocument) {