react-native-rectangle-doc-scanner 3.54.0 → 3.55.0

package/dist/DocScanner.js

@@ -205,8 +205,9 @@ exports.DocScanner = (0, react_1.forwardRef)(({ onCapture, overlayColor = DEFAUL
     }), [capture]);
     const overlayPolygon = detectedRectangle?.rectangleOnScreen ?? detectedRectangle?.rectangleCoordinates ?? null;
     const overlayIsActive = autoCapture ? isAutoCapturing : (detectedRectangle?.stableCounter ?? 0) > 0;
+    const detectionThreshold = autoCapture ? minStableFrames : 9999;
     return (react_1.default.createElement(react_native_1.View, { style: styles.container },
-        react_1.default.createElement(react_native_document_scanner_1.default, { ref: scannerRef, style: styles.scanner, detectionCountBeforeCapture: minStableFrames, overlayColor: overlayColor, enableTorch: enableTorch, quality: normalizedQuality, useBase64: useBase64, manualOnly: !autoCapture, detectionConfig: detectionConfig, onPictureTaken: handlePictureTaken, onError: handleError, onRectangleDetect: handleRectangleDetect }),
+        react_1.default.createElement(react_native_document_scanner_1.default, { ref: scannerRef, style: styles.scanner, detectionCountBeforeCapture: detectionThreshold, overlayColor: overlayColor, enableTorch: enableTorch, quality: normalizedQuality, useBase64: useBase64, manualOnly: !autoCapture, detectionConfig: detectionConfig, onPictureTaken: handlePictureTaken, onError: handleError, onRectangleDetect: handleRectangleDetect }),
         showGrid && overlayPolygon && (react_1.default.createElement(overlay_1.ScannerOverlay, { active: overlayIsActive, color: gridColor ?? overlayColor, lineWidth: gridLineWidth, polygon: overlayPolygon })),
         showManualCaptureButton && (react_1.default.createElement(react_native_1.TouchableOpacity, { style: styles.button, onPress: handleManualCapture })),
         children));

package/dist/FullDocScanner.js

@@ -62,6 +62,7 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
     const docScannerRef = (0, react_1.useRef)(null);
     const captureModeRef = (0, react_1.useRef)(null);
     const captureInProgressRef = (0, react_1.useRef)(false);
+    const rectangleTimeoutRef = (0, react_1.useRef)(null);
     const mergedStrings = (0, react_1.useMemo)(() => ({
         captureHint: strings?.captureHint,
         manualHint: strings?.manualHint,
@@ -236,6 +237,10 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
         setRectangleDetected(false);
         captureModeRef.current = null;
         captureInProgressRef.current = false;
+        if (rectangleTimeoutRef.current) {
+            clearTimeout(rectangleTimeoutRef.current);
+            rectangleTimeoutRef.current = null;
+        }
         // Reset DocScanner state
         if (docScannerRef.current?.reset) {
             docScannerRef.current.reset();
@@ -244,7 +249,20 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
     const handleRectangleDetect = (0, react_1.useCallback)((event) => {
         const stableCounter = event.stableCounter ?? 0;
         const hasRectangle = Boolean(event.rectangleOnScreen ?? event.rectangleCoordinates);
-        const isGoodRectangle = hasRectangle;
+        const isGoodRectangle = hasRectangle && event.lastDetectionType === 0;
+        if (hasRectangle) {
+            if (rectangleTimeoutRef.current) {
+                clearTimeout(rectangleTimeoutRef.current);
+            }
+            rectangleTimeoutRef.current = setTimeout(() => {
+                rectangleTimeoutRef.current = null;
+                setRectangleDetected(false);
+            }, 300);
+        }
+        else if (rectangleTimeoutRef.current) {
+            clearTimeout(rectangleTimeoutRef.current);
+            rectangleTimeoutRef.current = null;
+        }
         setRectangleDetected((prev) => {
             if (prev !== isGoodRectangle) {
                 console.log('[FullDocScanner] Rectangle detection update', {
@@ -257,6 +275,11 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
             return isGoodRectangle;
         });
     }, []);
+    (0, react_1.useEffect)(() => () => {
+        if (rectangleTimeoutRef.current) {
+            clearTimeout(rectangleTimeoutRef.current);
+        }
+    }, []);
     return (react_1.default.createElement(react_native_1.View, { style: styles.container },
         croppedImageData ? (
         // check_DP: Show confirmation screen

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-rectangle-doc-scanner",
-  "version": "3.54.0",
+  "version": "3.55.0",
   "description": "Native-backed document scanner for React Native with customizable overlays.",
   "license": "MIT",
   "main": "dist/index.js",

package/src/DocScanner.tsx

@@ -293,12 +293,14 @@ export const DocScanner = forwardRef<DocScannerHandle, Props>(
     const overlayPolygon = detectedRectangle?.rectangleOnScreen ?? detectedRectangle?.rectangleCoordinates ?? null;
     const overlayIsActive = autoCapture ? isAutoCapturing : (detectedRectangle?.stableCounter ?? 0) > 0;
 
-    return (
+  const detectionThreshold = autoCapture ? minStableFrames : 9999;
+
+  return (
       <View style={styles.container}>
         <DocumentScanner
           ref={scannerRef}
           style={styles.scanner}
-          detectionCountBeforeCapture={minStableFrames}
+          detectionCountBeforeCapture={detectionThreshold}
           overlayColor={overlayColor}
           enableTorch={enableTorch}
           quality={normalizedQuality}

package/src/FullDocScanner.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import {
   ActivityIndicator,
   Alert,
@@ -90,6 +90,7 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
   const docScannerRef = useRef<DocScannerHandle | null>(null);
   const captureModeRef = useRef<'grid' | 'no-grid' | null>(null);
   const captureInProgressRef = useRef(false);
+  const rectangleTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   const mergedStrings = useMemo(
     () => ({
@@ -314,6 +315,10 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
     setRectangleDetected(false);
     captureModeRef.current = null;
     captureInProgressRef.current = false;
+    if (rectangleTimeoutRef.current) {
+      clearTimeout(rectangleTimeoutRef.current);
+      rectangleTimeoutRef.current = null;
+    }
     // Reset DocScanner state
     if (docScannerRef.current?.reset) {
       docScannerRef.current.reset();
@@ -323,7 +328,20 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
   const handleRectangleDetect = useCallback((event: RectangleDetectEvent) => {
     const stableCounter = event.stableCounter ?? 0;
     const hasRectangle = Boolean(event.rectangleOnScreen ?? event.rectangleCoordinates);
-    const isGoodRectangle = hasRectangle;
+    const isGoodRectangle = hasRectangle && event.lastDetectionType === 0;
+
+    if (hasRectangle) {
+      if (rectangleTimeoutRef.current) {
+        clearTimeout(rectangleTimeoutRef.current);
+      }
+      rectangleTimeoutRef.current = setTimeout(() => {
+        rectangleTimeoutRef.current = null;
+        setRectangleDetected(false);
+      }, 300);
+    } else if (rectangleTimeoutRef.current) {
+      clearTimeout(rectangleTimeoutRef.current);
+      rectangleTimeoutRef.current = null;
+    }
 
     setRectangleDetected((prev) => {
       if (prev !== isGoodRectangle) {
@@ -334,11 +352,16 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
           isGoodRectangle,
         });
       }
-
       return isGoodRectangle;
     });
   }, []);
 
+  useEffect(() => () => {
+    if (rectangleTimeoutRef.current) {
+      clearTimeout(rectangleTimeoutRef.current);
+    }
+  }, []);
+
   return (
     <View style={styles.container}>
       {croppedImageData ? (