@trustchex/react-native-sdk 1.374.0 → 1.409.0

package/lib/module/Shared/Components/DebugOverlay.js

@@ -0,0 +1,541 @@
+"use strict";
+
+/* eslint-disable react-native/no-inline-styles */
+import React from 'react';
+import { View, Text as TextView, Image, ScrollView } from 'react-native';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { HOLOGRAM_IMAGE_COUNT } from "./IdentityDocumentCamera.constants.js";
+import { angleBetweenPoints, distanceBetweenPoints } from "./IdentityDocumentCamera.utils.js";
+
+// --- Shared overlay sub-components ---
+
+/**
+ * Renders a rotated face bounds overlay with optional crop padding border.
+ */
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+function FaceBoundsOverlay({
+  bounds,
+  color
+}) {
+  const dashColor = color.replace(')', ', 0.5)').replace('rgb', 'rgba');
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [!!bounds.cropPadding && /*#__PURE__*/_jsx(View, {
+      style: {
+        position: 'absolute',
+        left: bounds.x - bounds.cropPadding,
+        top: bounds.y - bounds.cropPadding,
+        width: bounds.width + 2 * bounds.cropPadding,
+        height: bounds.height + 2 * bounds.cropPadding,
+        borderWidth: 2,
+        borderColor: dashColor,
+        borderStyle: 'dashed',
+        borderRadius: 8,
+        backgroundColor: 'transparent',
+        transform: [{
+          rotate: `${-(bounds.rollAngle || 0)}deg`
+        }],
+        transformOrigin: 'center'
+      }
+    }), /*#__PURE__*/_jsx(View, {
+      style: {
+        position: 'absolute',
+        left: bounds.x,
+        top: bounds.y,
+        width: bounds.width,
+        height: bounds.height,
+        borderWidth: 3,
+        borderColor: color,
+        borderRadius: 8,
+        backgroundColor: 'transparent',
+        transform: [{
+          rotate: `${-(bounds.rollAngle || 0)}deg`
+        }],
+        transformOrigin: 'center'
+      },
+      children: !!bounds.rollAngle && Math.abs(bounds.rollAngle) > 5 && /*#__PURE__*/_jsxs(TextView, {
+        style: {
+          position: 'absolute',
+          top: -20,
+          left: 0,
+          color: color,
+          fontSize: 10,
+          fontWeight: 'bold',
+          backgroundColor: 'rgba(0,0,0,0.7)',
+          paddingHorizontal: 4,
+          paddingVertical: 2,
+          borderRadius: 2
+        },
+        children: [bounds.rollAngle.toFixed(1), "\xB0"]
+      })
+    })]
+  });
+}
+
+/**
+ * Renders bounds with corner points (for barcode, MRZ, signature).
+ * Falls back to a rotated rectangle when corners aren't available.
+ */
+function CornerBoundsOverlay({
+  bounds,
+  color
+}) {
+  if (bounds.corners && bounds.corners.length >= 2) {
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [bounds.corners.map((corner, idx) => {
+        const nextCorner = bounds.corners[(idx + 1) % bounds.corners.length];
+        const length = distanceBetweenPoints(corner, nextCorner);
+        const angle = angleBetweenPoints(corner, nextCorner);
+        return /*#__PURE__*/_jsx(View, {
+          style: {
+            position: 'absolute',
+            left: corner.x,
+            top: corner.y,
+            width: length,
+            height: 3,
+            backgroundColor: color,
+            transform: [{
+              rotate: `${angle}deg`
+            }],
+            transformOrigin: 'top left'
+          }
+        }, idx);
+      }), bounds.corners.length >= 4 && bounds.corners.map((corner, idx) => /*#__PURE__*/_jsx(View, {
+        style: {
+          position: 'absolute',
+          left: corner.x - 4,
+          top: corner.y - 4,
+          width: 8,
+          height: 8,
+          borderRadius: 4,
+          backgroundColor: color
+        }
+      }, `corner-${idx}`)), !!bounds.angle && Math.abs(bounds.angle) > 5 && /*#__PURE__*/_jsxs(TextView, {
+        style: {
+          position: 'absolute',
+          left: bounds.x,
+          top: bounds.y - 20,
+          color: color,
+          fontSize: 10,
+          fontWeight: 'bold',
+          backgroundColor: 'rgba(0,0,0,0.7)',
+          paddingHorizontal: 4,
+          paddingVertical: 2,
+          borderRadius: 2
+        },
+        children: [bounds.angle.toFixed(1), "\xB0"]
+      })]
+    });
+  }
+
+  // Fallback: rotated rectangle
+  return /*#__PURE__*/_jsx(View, {
+    style: {
+      position: 'absolute',
+      left: bounds.x + bounds.width / 2,
+      top: bounds.y + bounds.height / 2,
+      width: bounds.width,
+      height: bounds.height,
+      marginLeft: -bounds.width / 2,
+      marginTop: -bounds.height / 2,
+      borderWidth: 3,
+      borderColor: color,
+      borderRadius: 8,
+      backgroundColor: 'transparent',
+      transform: [{
+        rotate: `${bounds.angle || 0}deg`
+      }]
+    },
+    children: !!bounds.angle && Math.abs(bounds.angle) > 5 && /*#__PURE__*/_jsxs(TextView, {
+      style: {
+        position: 'absolute',
+        top: -20,
+        left: 0,
+        color: color,
+        fontSize: 10,
+        fontWeight: 'bold',
+        backgroundColor: 'rgba(0,0,0,0.7)',
+        paddingHorizontal: 4,
+        paddingVertical: 2,
+        borderRadius: 2
+      },
+      children: [bounds.angle.toFixed(1), "\xB0"]
+    })
+  });
+}
+
+/**
+ * Debug image thumbnail with label
+ */
+function DebugImageThumbnail({
+  image,
+  label,
+  activeColor,
+  borderColor
+}) {
+  return /*#__PURE__*/_jsxs(View, {
+    style: {
+      alignItems: 'center'
+    },
+    children: [image ? /*#__PURE__*/_jsx(Image, {
+      source: {
+        uri: `data:image/jpeg;base64,${image}`
+      },
+      style: {
+        width: 40,
+        height: 48,
+        borderRadius: 2,
+        borderWidth: 1,
+        borderColor
+      }
+    }) : /*#__PURE__*/_jsx(View, {
+      style: {
+        width: 40,
+        height: 48,
+        borderRadius: 2,
+        borderWidth: 1,
+        borderColor: '#666',
+        backgroundColor: '#222',
+        justifyContent: 'center',
+        alignItems: 'center'
+      },
+      children: /*#__PURE__*/_jsx(TextView, {
+        style: {
+          color: '#666',
+          fontSize: 7
+        },
+        children: "\u2014"
+      })
+    }), /*#__PURE__*/_jsx(TextView, {
+      style: {
+        color: image ? activeColor : '#999',
+        fontSize: 7,
+        marginTop: 1,
+        fontWeight: 'bold'
+      },
+      children: `${image ? '✓' : '○'} ${label}`
+    })]
+  });
+}
+
+// --- Main DebugOverlay ---
+
+const DebugOverlay = /*#__PURE__*/React.memo(function DebugOverlay({
+  nextStep,
+  status,
+  detectedDocumentType,
+  isBrightnessLow,
+  isFrameBlurry,
+  isTorchOn,
+  documentPlaneBounds,
+  secondaryFaceBounds,
+  barcodeBounds,
+  mrzBounds,
+  signatureBounds,
+  currentFaceImage,
+  currentSecondaryFaceImage,
+  currentHologramImage,
+  currentHologramMaskImage,
+  latestHologramFaceImage,
+  hologramImageCount,
+  elementsOutsideScanArea
+}) {
+  const insets = useSafeAreaInsets();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [documentPlaneBounds && nextStep !== 'COMPLETED' && /*#__PURE__*/_jsx(FaceBoundsOverlay, {
+      bounds: documentPlaneBounds,
+      color: "#4CAF50"
+    }), secondaryFaceBounds && nextStep !== 'COMPLETED' && /*#__PURE__*/_jsx(FaceBoundsOverlay, {
+      bounds: secondaryFaceBounds,
+      color: "#2196F3"
+    }), barcodeBounds && nextStep !== 'COMPLETED' && /*#__PURE__*/_jsx(CornerBoundsOverlay, {
+      bounds: barcodeBounds,
+      color: "#FF9800"
+    }), mrzBounds && nextStep !== 'COMPLETED' && /*#__PURE__*/_jsx(CornerBoundsOverlay, {
+      bounds: mrzBounds,
+      color: "#9C27B0"
+    }), signatureBounds && nextStep !== 'COMPLETED' && /*#__PURE__*/_jsx(CornerBoundsOverlay, {
+      bounds: signatureBounds,
+      color: "#00BCD4"
+    }), /*#__PURE__*/_jsx(View, {
+      style: {
+        position: 'absolute',
+        top: 0,
+        left: 0,
+        right: 0,
+        paddingTop: insets.top,
+        alignItems: 'center',
+        pointerEvents: 'none'
+      },
+      children: /*#__PURE__*/_jsxs(View, {
+        style: {
+          marginTop: 8,
+          marginHorizontal: 8,
+          backgroundColor: 'rgba(0, 0, 0, 0.9)',
+          padding: 8,
+          borderRadius: 6,
+          borderWidth: 1,
+          borderColor: 'rgba(255, 82, 82, 0.5)',
+          minWidth: 220,
+          maxWidth: '92%'
+        },
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: 'row',
+            justifyContent: 'space-between',
+            marginBottom: 4
+          },
+          children: [/*#__PURE__*/_jsx(TextView, {
+            style: {
+              color: '#88D8B0',
+              fontSize: 10,
+              fontWeight: 'bold'
+            },
+            children: `Status: ${status}`
+          }), /*#__PURE__*/_jsx(TextView, {
+            style: {
+              color: '#FFEB3B',
+              fontSize: 10,
+              fontWeight: 'bold'
+            },
+            children: `Step: ${nextStep}`
+          })]
+        }), /*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: 'row',
+            justifyContent: 'space-between',
+            marginBottom: 4,
+            gap: 3
+          },
+          children: [/*#__PURE__*/_jsx(View, {
+            style: {
+              backgroundColor: isBrightnessLow ? '#f44336' : '#4CAF50',
+              paddingHorizontal: 6,
+              paddingVertical: 1,
+              borderRadius: 3
+            },
+            children: /*#__PURE__*/_jsx(TextView, {
+              style: {
+                color: '#FFFFFF',
+                fontSize: 8,
+                fontWeight: 'bold'
+              },
+              children: isBrightnessLow ? 'Low Light' : 'Good Light'
+            })
+          }), /*#__PURE__*/_jsx(View, {
+            style: {
+              backgroundColor: isFrameBlurry ? '#f44336' : '#4CAF50',
+              paddingHorizontal: 6,
+              paddingVertical: 1,
+              borderRadius: 3
+            },
+            children: /*#__PURE__*/_jsx(TextView, {
+              style: {
+                color: '#FFFFFF',
+                fontSize: 8,
+                fontWeight: 'bold'
+              },
+              children: isFrameBlurry ? 'Blurry' : 'Sharp'
+            })
+          })]
+        }), /*#__PURE__*/_jsx(TextView, {
+          style: {
+            color: elementsOutsideScanArea.length === 0 ? '#4CAF50' : '#FFA500',
+            fontSize: 8,
+            marginBottom: 3
+          },
+          children: elementsOutsideScanArea.length === 0 ? 'All elements in frame' : `Outside: ${elementsOutsideScanArea.join(', ')}`
+        }), /*#__PURE__*/_jsx(TextView, {
+          style: {
+            color: 'rgba(255, 255, 255, 0.7)',
+            fontSize: 8,
+            marginBottom: 3
+          },
+          children: `Face: ${documentPlaneBounds ? '✓' : '✗'}, MRZ: ${mrzBounds ? '✓' : '✗'}, Sig: ${signatureBounds ? '✓' : '✗'}`
+        }), nextStep === 'SCAN_HOLOGRAM' && hologramImageCount > 0 && /*#__PURE__*/_jsx(TextView, {
+          style: {
+            color: '#9C27B0',
+            fontSize: 8,
+            fontWeight: 'bold',
+            marginBottom: 3
+          },
+          children: `Hologram: ${hologramImageCount}/${HOLOGRAM_IMAGE_COUNT}`
+        }), /*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: 'row',
+            gap: 8,
+            paddingTop: 3,
+            borderTopWidth: 1,
+            borderTopColor: 'rgba(255, 255, 255, 0.2)',
+            marginBottom: 4
+          },
+          children: [/*#__PURE__*/_jsx(TextView, {
+            style: {
+              color: 'rgba(255, 255, 255, 0.7)',
+              fontSize: 8,
+              marginTop: 3
+            },
+            children: `Doc: ${detectedDocumentType}`
+          }), /*#__PURE__*/_jsx(TextView, {
+            style: {
+              color: 'rgba(255, 255, 255, 0.7)',
+              fontSize: 8,
+              marginTop: 3
+            },
+            children: `Flash: ${isTorchOn ? '🔦' : '○'}`
+          })]
+        }), /*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            gap: 4,
+            justifyContent: 'center'
+          },
+          children: [/*#__PURE__*/_jsx(DebugImageThumbnail, {
+            image: currentFaceImage,
+            label: "Face",
+            activeColor: "#4CAF50",
+            borderColor: "#4CAF50"
+          }), /*#__PURE__*/_jsx(DebugImageThumbnail, {
+            image: currentSecondaryFaceImage,
+            label: "2nd",
+            activeColor: "#2196F3",
+            borderColor: "#2196F3"
+          }), /*#__PURE__*/_jsxs(View, {
+            style: {
+              alignItems: 'center'
+            },
+            children: [currentHologramImage ? /*#__PURE__*/_jsx(Image, {
+              source: {
+                uri: `data:image/jpeg;base64,${currentHologramImage}`
+              },
+              style: {
+                width: 40,
+                height: 48,
+                borderRadius: 2,
+                borderWidth: 1,
+                borderColor: '#9C27B0'
+              }
+            }) : latestHologramFaceImage && hologramImageCount > 0 ? /*#__PURE__*/_jsxs(View, {
+              style: {
+                position: 'relative'
+              },
+              children: [/*#__PURE__*/_jsx(Image, {
+                source: {
+                  uri: `data:image/jpeg;base64,${latestHologramFaceImage}`
+                },
+                style: {
+                  width: 40,
+                  height: 48,
+                  borderRadius: 2,
+                  borderWidth: 1,
+                  borderColor: '#FFA500',
+                  opacity: 0.7
+                }
+              }), /*#__PURE__*/_jsx(View, {
+                style: {
+                  position: 'absolute',
+                  bottom: 1,
+                  left: 1,
+                  right: 1,
+                  backgroundColor: 'rgba(0,0,0,0.8)',
+                  paddingVertical: 0,
+                  borderRadius: 1
+                },
+                children: /*#__PURE__*/_jsxs(TextView, {
+                  style: {
+                    color: '#FFA500',
+                    fontSize: 6,
+                    textAlign: 'center',
+                    fontWeight: 'bold'
+                  },
+                  children: [hologramImageCount, "/", HOLOGRAM_IMAGE_COUNT]
+                })
+              })]
+            }) : /*#__PURE__*/_jsx(View, {
+              style: {
+                width: 40,
+                height: 48,
+                borderRadius: 2,
+                borderWidth: 1,
+                borderColor: '#666',
+                backgroundColor: '#222',
+                justifyContent: 'center',
+                alignItems: 'center'
+              },
+              children: /*#__PURE__*/_jsx(TextView, {
+                style: {
+                  color: '#666',
+                  fontSize: 7
+                },
+                children: "\u2014"
+              })
+            }), /*#__PURE__*/_jsx(TextView, {
+              style: {
+                color: currentHologramImage ? '#9C27B0' : latestHologramFaceImage ? '#FFA500' : '#999',
+                fontSize: 7,
+                marginTop: 1,
+                fontWeight: 'bold'
+              },
+              children: `${currentHologramImage ? '✓' : latestHologramFaceImage ? '⏳' : '○'} Holo`
+            })]
+          }), /*#__PURE__*/_jsx(DebugImageThumbnail, {
+            image: currentHologramMaskImage,
+            label: "Mask",
+            activeColor: "#FF6B6B",
+            borderColor: "#FF6B6B"
+          })]
+        })]
+      })
+    })]
+  });
+});
+
+// --- Test Mode Panel ---
+
+export const TestModePanel = /*#__PURE__*/React.memo(function TestModePanel({
+  mrzText
+}) {
+  const insets = useSafeAreaInsets();
+  return /*#__PURE__*/_jsx(View, {
+    style: {
+      position: 'absolute',
+      bottom: 0,
+      left: 0,
+      right: 0,
+      maxHeight: '40%',
+      paddingBottom: insets.bottom,
+      backgroundColor: 'rgba(0, 0, 0, 0.95)',
+      borderTopWidth: 2,
+      borderTopColor: '#FFA500'
+    },
+    children: /*#__PURE__*/_jsx(ScrollView, {
+      style: {
+        flex: 1
+      },
+      children: /*#__PURE__*/_jsxs(View, {
+        style: {
+          padding: 10
+        },
+        children: [/*#__PURE__*/_jsx(TextView, {
+          style: {
+            color: '#FFA500',
+            fontSize: 12,
+            fontWeight: 'bold',
+            marginBottom: 8,
+            textAlign: 'center'
+          },
+          children: "MRZ Text Read"
+        }), /*#__PURE__*/_jsx(TextView, {
+          style: {
+            color: '#FFFFFF',
+            fontSize: 9,
+            fontFamily: 'monospace',
+            lineHeight: 16
+          },
+          children: mrzText.split('\n').map((line, i) => `Line ${i + 1}: ${line} (${line.length} chars)`).join('\n')
+        })]
+      })
+    })
+  });
+});
+export default DebugOverlay;

package/lib/module/Shared/Components/EIDScanner.js

@@ -73,7 +73,6 @@ const EIDScanner = ({
   const appContext = React.useContext(AppContext);
   const [voiceGuidanceMessage, setVoiceGuidanceMessage] = useState();
   const [attemptNumber, setAttemptNumber] = useState(0);
-  const lastVoiceGuidanceMessage = useRef('');
   const readNFC = useCallback(async () => {
     const startTime = Date.now();
     const currentAttempt = attemptNumber + 1;
@@ -82,7 +81,6 @@ const EIDScanner = ({
     setIsScanned(false);
     setProgress(0);
     setProgressStage('');
-    lastVoiceGuidanceMessage.current = '';
     resetLastMessage();
 
     // Track EID scan start using analytics helper
@@ -241,8 +239,7 @@ const EIDScanner = ({
     }
   }, [isScanning, progress, pulseAnim]);
   useEffect(() => {
-    if (voiceGuidanceMessage && appContext.currentWorkflowStep?.data?.voiceGuidanceActive && voiceGuidanceMessage !== lastVoiceGuidanceMessage.current) {
-      lastVoiceGuidanceMessage.current = voiceGuidanceMessage;
+    if (voiceGuidanceMessage && appContext.currentWorkflowStep?.data?.voiceGuidanceActive) {
       speak(voiceGuidanceMessage, true);
     }
   }, [voiceGuidanceMessage, appContext.currentWorkflowStep?.data?.voiceGuidanceActive]);

package/lib/module/Shared/Components/IdentityDocumentCamera.constants.js

@@ -0,0 +1,44 @@
+"use strict";
+
+export const HOLOGRAM_IMAGE_COUNT = 16;
+export const HOLOGRAM_DETECTION_THRESHOLD = 1000;
+export const HOLOGRAM_DETECTION_RETRY_COUNT = 3;
+export const HOLOGRAM_CAPTURE_INTERVAL = 250;
+export const HOLOGRAM_MAX_FRAMES_WITHOUT_FACE = 30;
+export const MIN_BRIGHTNESS_THRESHOLD = 45;
+export const MAX_BRIGHTNESS_THRESHOLD = 210; // Glare detection threshold
+export const MAX_CONSECUTIVE_QUALITY_FAILURES = 30;
+export const FACE_EDGE_MARGIN_PERCENT = 0.08; // Minimum 8% margin from edges
+export const MIN_CARD_FACE_SIZE_PERCENT = 0.05; // Main face: min 5% of frame width
+export const MIN_MLI_FACE_SIZE_PERCENT = 0.01; // MLI (Multi Layer Image): min 1% of frame width - lowered for better detection
+
+export const REQUIRED_CONSISTENT_MRZ_READS = 2;
+export const REQUIRED_CONSISTENT_DOCTYPE_DETECTIONS = 3;
+export const SIGNATURE_REGEX = /s[gi]g?n[au]?t[u]?r|imz[a]s?/i;
+export const SIGNATURE_TEXT_REGEX = /signature|imza|İmza/i;
+export const MRZ_BLOCK_PATTERN = /[A-Z0-9<]{8,}.*</i;
+export const PASSPORT_MRZ_PATTERN = /P<[A-Z]{3}/;
+
+// BDDK Madde 7 - Security Feature Validation
+// When NFC chip reading unavailable, must verify at least 4 visual security features
+export const MIN_SECURITY_FEATURES_REQUIRED = 4;
+export const SECURITY_FEATURE_NAMES = {
+  icao_photo: 'ICAO Uyumlu Fotoğraf (ICAO Compliant Photo)',
+  barcode: 'Barkod (Barcode)',
+  hologram: 'DOVID/OVD (Hologram)',
+  wet_signature: 'Islak İmza (Wet Signature)',
+  guilloche: 'Giyoş (Guilloche Pattern)',
+  rainbow_print: 'Gökkuşağı Baskı (Rainbow Print)',
+  ovi: 'Optik Değişken Mürekkep (OVI)',
+  latent_image: 'Gizli Görüntü (Latent Image)',
+  microtext: 'Mikro Yazı (Microtext)'
+};
+
+// BDDK Madde 8 - Device-side Face Shape & Visual Similarity Thresholds
+// Backend does full FaceNet biometric matching
+// Relaxed thresholds for device-side pre-filtering only
+export const FACE_SHAPE_MATCH_THRESHOLD = 0.5; // Facial geometry similarity (0-1) - very lenient
+export const FACE_VISUAL_SIMILARITY_THRESHOLD = 0.5; // Pixel-level similarity (0-1) - very lenient
+export const FACE_ASPECT_RATIO_TOLERANCE = 0.15; // 15% tolerance for width/height ratio
+export const FACE_SIZE_RATIO_MIN = 0.7; // Minimum 70% of primary face area
+export const FACE_SIZE_RATIO_MAX = 1.3; // Maximum 130% of primary face area