react-native-rectangle-doc-scanner 3.111.0 → 3.114.0

package/dist/FullDocScanner.d.ts

@@ -8,6 +8,8 @@ export interface FullDocScannerResult {
     base64?: string;
     /** Original captured document info */
     original?: CapturedDocument;
+    /** Rotation angle applied by user (0, 90, 180, 270) */
+    rotationDegrees?: number;
 }
 export interface FullDocScannerStrings {
     captureHint?: string;
@@ -18,9 +20,12 @@ export interface FullDocScannerStrings {
     retake?: string;
     confirm?: string;
     cropTitle?: string;
+    first?: string;
+    second?: string;
+    secondBtn?: string;
 }
 export interface FullDocScannerProps {
-    onResult: (result: FullDocScannerResult) => void;
+    onResult: (results: FullDocScannerResult[]) => void;
     onClose?: () => void;
     detectionConfig?: DetectionConfig;
     overlayColor?: string;
@@ -33,5 +38,6 @@ export interface FullDocScannerProps {
     enableGallery?: boolean;
     cropWidth?: number;
     cropHeight?: number;
+    type?: 'business';
 }
 export declare const FullDocScanner: React.FC<FullDocScannerProps>;

package/dist/FullDocScanner.js

@@ -52,9 +52,9 @@ catch (error) {
 }
 let expoManipulatorUnavailable = false;
 const isExpoImageManipulatorAvailable = () => !!ImageManipulator?.manipulateAsync && !expoManipulatorUnavailable;
-const isImageRotationSupported = () => isExpoImageManipulatorAvailable();
+// 회전은 항상 지원됨 (회전 각도를 반환하고 tdb 앱에서 처리)
+const isImageRotationSupported = () => true;
 const stripFileUri = (value) => value.replace(/^file:\/\//, '');
-const ensureFileUri = (value) => (value.startsWith('file://') ? value : `file://${value}`);
 const CROPPER_TIMEOUT_MS = 8000;
 const CROPPER_TIMEOUT_CODE = 'cropper_timeout';
 const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
@@ -115,7 +115,7 @@ const normalizeCapturedDocument = (document) => {
         croppedPath: document.croppedPath ? stripFileUri(document.croppedPath) : null,
     };
 };
-const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3170f3', gridColor, gridLineWidth, showGrid, strings, minStableFrames, onError, enableGallery = true, cropWidth = 1200, cropHeight = 1600, }) => {
+const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3170f3', gridColor, gridLineWidth, showGrid, strings, minStableFrames, onError, enableGallery = true, cropWidth = 1200, cropHeight = 1600, type, }) => {
     const [processing, setProcessing] = (0, react_1.useState)(false);
     const [croppedImageData, setCroppedImageData] = (0, react_1.useState)(null);
     const [isGalleryOpen, setIsGalleryOpen] = (0, react_1.useState)(false);
@@ -123,12 +123,16 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
     const [rectangleHint, setRectangleHint] = (0, react_1.useState)(false);
     const [flashEnabled, setFlashEnabled] = (0, react_1.useState)(false);
     const [rotationDegrees, setRotationDegrees] = (0, react_1.useState)(0);
+    const [capturedPhotos, setCapturedPhotos] = (0, react_1.useState)([]);
+    const [currentPhotoIndex, setCurrentPhotoIndex] = (0, react_1.useState)(0);
     const resolvedGridColor = gridColor ?? overlayColor;
     const docScannerRef = (0, react_1.useRef)(null);
     const captureModeRef = (0, react_1.useRef)(null);
     const captureInProgressRef = (0, react_1.useRef)(false);
     const rectangleCaptureTimeoutRef = (0, react_1.useRef)(null);
     const rectangleHintTimeoutRef = (0, react_1.useRef)(null);
+    const isBusinessMode = type === 'business';
+    const maxPhotos = isBusinessMode ? 2 : 1;
     const mergedStrings = (0, react_1.useMemo)(() => ({
         captureHint: strings?.captureHint,
         manualHint: strings?.manualHint,
@@ -138,6 +142,9 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
         retake: strings?.retake ?? 'Retake',
         confirm: strings?.confirm ?? 'Confirm',
         cropTitle: strings?.cropTitle ?? 'Crop Document',
+        first: strings?.first ?? 'Front',
+        second: strings?.second ?? 'Back',
+        secondBtn: strings?.secondBtn ?? 'Capture Back Side?',
     }), [strings]);
     const emitError = (0, react_1.useCallback)((error, fallbackMessage) => {
         console.error('[FullDocScanner] error', error);
@@ -374,95 +381,56 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
         if (!croppedImageData) {
             return;
         }
-        // 회전이 없으면 기존 데이터 그대로 전달
-        if (rotationDegrees === 0) {
-            console.log('[FullDocScanner] No rotation, returning original image');
-            onResult({
-                path: croppedImageData.path,
-                base64: croppedImageData.base64,
-            });
+        // 회전 각도 정규화 (0, 90, 180, 270)
+        const rotationNormalized = ((rotationDegrees % 360) + 360) % 360;
+        console.log('[FullDocScanner] Confirm - rotation degrees:', rotationDegrees, 'normalized:', rotationNormalized);
+        // 현재 사진을 capturedPhotos에 추가
+        const currentPhoto = {
+            path: croppedImageData.path,
+            base64: croppedImageData.base64,
+            rotationDegrees: rotationNormalized,
+        };
+        const updatedPhotos = [...capturedPhotos, currentPhoto];
+        console.log('[FullDocScanner] Photos captured:', updatedPhotos.length, 'of', maxPhotos);
+        // Business 모드이고 아직 첫 번째 사진만 찍은 경우
+        if (isBusinessMode && updatedPhotos.length === 1) {
+            // 두 번째 사진 촬영 여부를 물어봄 (UI에서 버튼으로 표시)
+            setCapturedPhotos(updatedPhotos);
+            setCurrentPhotoIndex(1);
+            // 확인 화면을 유지하고 "뒷면 촬영" 버튼을 표시
             return;
         }
-        try {
-            setProcessing(true);
-            // 회전 각도 정규화 (0, 90, 180, 270)
-            const rotationNormalized = ((rotationDegrees % 360) + 360) % 360;
-            console.log('[FullDocScanner] Rotation degrees:', rotationDegrees, 'normalized:', rotationNormalized);
-            if (rotationNormalized === 0) {
-                console.log('[FullDocScanner] Normalized to 0, returning original image');
-                onResult({
-                    path: croppedImageData.path,
-                    base64: croppedImageData.base64,
-                });
-                setProcessing(false);
-                return;
-            }
-            // expo-image-manipulator 시도
-            if (isExpoImageManipulatorAvailable() && ImageManipulator?.manipulateAsync) {
-                try {
-                    console.log('[FullDocScanner] Using expo-image-manipulator for rotation');
-                    const inputUri = ensureFileUri(croppedImageData.path);
-                    const result = await ImageManipulator.manipulateAsync(inputUri, [{ rotate: rotationNormalized }], {
-                        compress: 0.9,
-                        format: ImageManipulator.SaveFormat.JPEG,
-                        base64: true,
-                    });
-                    console.log('[FullDocScanner] Rotation complete via expo-image-manipulator:', {
-                        path: result.uri,
-                        hasBase64: !!result.base64,
-                    });
-                    onResult({
-                        path: stripFileUri(result.uri),
-                        base64: result.base64,
-                    });
-                    setProcessing(false);
-                    return;
-                }
-                catch (manipulatorError) {
-                    const code = manipulatorError && typeof manipulatorError === 'object' && 'code' in manipulatorError
-                        ? String(manipulatorError.code)
-                        : undefined;
-                    console.error('[FullDocScanner] expo-image-manipulator error:', manipulatorError);
-                    if (code === 'ERR_UNAVAILABLE') {
-                        expoManipulatorUnavailable = true;
-                        console.warn('[FullDocScanner] expo-image-manipulator unavailable at runtime. Trying react-native-image-rotate.');
-                    }
-                    else {
-                        throw manipulatorError;
-                    }
-                }
-            }
-            // expo-image-manipulator를 사용할 수 없는 경우 에러 처리
-            console.error('[FullDocScanner] Rotation requested but expo-image-manipulator is not available.');
-            setProcessing(false);
-            react_native_1.Alert.alert('회전 불가', 'expo-image-manipulator가 설치되지 않아 이미지 회전을 수행할 수 없습니다.\n\n패키지를 설치해주세요:\nnpm install expo-image-manipulator', [
-                {
-                    text: '원본 사용',
-                    onPress: () => {
-                        onResult({
-                            path: croppedImageData.path,
-                            base64: croppedImageData.base64,
-                        });
-                    },
-                },
-                {
-                    text: '취소',
-                    style: 'cancel',
-                },
-            ]);
+        // 모든 사진 촬영 완료 - 결과 반환
+        console.log('[FullDocScanner] All photos captured, returning results');
+        onResult(updatedPhotos);
+    }, [croppedImageData, rotationDegrees, capturedPhotos, isBusinessMode, maxPhotos, onResult]);
+    const handleCaptureSecondPhoto = (0, react_1.useCallback)(() => {
+        console.log('[FullDocScanner] Capturing second photo');
+        // 확인 화면을 닫고 카메라로 돌아감
+        setCroppedImageData(null);
+        setRotationDegrees(0);
+        setProcessing(false);
+        setRectangleDetected(false);
+        setRectangleHint(false);
+        captureModeRef.current = null;
+        captureInProgressRef.current = false;
+        if (rectangleCaptureTimeoutRef.current) {
+            clearTimeout(rectangleCaptureTimeoutRef.current);
+            rectangleCaptureTimeoutRef.current = null;
         }
-        catch (error) {
-            console.error('[FullDocScanner] Image rotation error on confirm:', error);
-            setProcessing(false);
-            const errorMessage = error && typeof error === 'object' && 'message' in error ? error.message : String(error);
-            react_native_1.Alert.alert('회전 실패', `이미지 회전 중 오류가 발생했습니다.\n원본 이미지를 사용합니다.\n\n오류: ${errorMessage}`);
-            // 에러 발생 시 원본 이미지 반환
-            onResult({
-                path: croppedImageData.path,
-                base64: croppedImageData.base64,
-            });
+        if (rectangleHintTimeoutRef.current) {
+            clearTimeout(rectangleHintTimeoutRef.current);
+            rectangleHintTimeoutRef.current = null;
         }
-    }, [croppedImageData, rotationDegrees, onResult]);
+        if (docScannerRef.current?.reset) {
+            docScannerRef.current.reset();
+        }
+    }, []);
+    const handleSkipSecondPhoto = (0, react_1.useCallback)(() => {
+        console.log('[FullDocScanner] Skipping second photo');
+        // 첫 번째 사진만 반환
+        onResult(capturedPhotos);
+    }, [capturedPhotos, onResult]);
     const handleRetake = (0, react_1.useCallback)(() => {
         console.log('[FullDocScanner] Retake - clearing cropped image and resetting scanner');
         setCroppedImageData(null);
@@ -537,6 +505,8 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
         croppedImageData ? (
         // check_DP: Show confirmation screen
         react_1.default.createElement(react_native_1.View, { style: styles.confirmationContainer },
+            isBusinessMode && (react_1.default.createElement(react_native_1.View, { style: styles.photoHeader },
+                react_1.default.createElement(react_native_1.Text, { style: styles.photoHeaderText }, currentPhotoIndex === 0 ? mergedStrings.first : mergedStrings.second))),
             isImageRotationSupported() ? (react_1.default.createElement(react_native_1.View, { style: styles.rotateButtonsCenter },
                 react_1.default.createElement(react_native_1.TouchableOpacity, { style: styles.rotateButtonTop, onPress: () => handleRotateImage(-90), accessibilityLabel: "\uC67C\uCABD\uC73C\uB85C 90\uB3C4 \uD68C\uC804", accessibilityRole: "button" },
                     react_1.default.createElement(react_native_1.Text, { style: styles.rotateIconText }, "\u21BA"),
@@ -551,8 +521,12 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
             react_1.default.createElement(react_native_1.View, { style: styles.confirmationButtons },
                 react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.confirmButton, styles.retakeButton], onPress: handleRetake, accessibilityLabel: mergedStrings.retake, accessibilityRole: "button" },
                     react_1.default.createElement(react_native_1.Text, { style: styles.confirmButtonText }, mergedStrings.retake)),
-                react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.confirmButton, styles.confirmButtonPrimary], onPress: handleConfirm, accessibilityLabel: mergedStrings.confirm, accessibilityRole: "button" },
-                    react_1.default.createElement(react_native_1.Text, { style: styles.confirmButtonText }, mergedStrings.confirm))))) : (react_1.default.createElement(react_native_1.View, { style: styles.flex },
+                isBusinessMode && capturedPhotos.length === 1 && currentPhotoIndex === 1 ? (react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.confirmButton, styles.confirmButtonPrimary], onPress: handleCaptureSecondPhoto, accessibilityLabel: mergedStrings.secondBtn, accessibilityRole: "button" },
+                        react_1.default.createElement(react_native_1.Text, { style: styles.confirmButtonText }, mergedStrings.secondBtn)),
+                    react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.confirmButton, styles.skipButton], onPress: handleSkipSecondPhoto, accessibilityLabel: mergedStrings.confirm, accessibilityRole: "button" },
+                        react_1.default.createElement(react_native_1.Text, { style: styles.confirmButtonText }, mergedStrings.confirm)))) : (react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.confirmButton, styles.confirmButtonPrimary], onPress: handleConfirm, accessibilityLabel: mergedStrings.confirm, accessibilityRole: "button" },
+                    react_1.default.createElement(react_native_1.Text, { style: styles.confirmButtonText }, mergedStrings.confirm)))))) : (react_1.default.createElement(react_native_1.View, { style: styles.flex },
             react_1.default.createElement(DocScanner_1.DocScanner, { ref: docScannerRef, autoCapture: false, overlayColor: overlayColor, showGrid: showGrid, gridColor: resolvedGridColor, gridLineWidth: gridLineWidth, minStableFrames: minStableFrames ?? 6, detectionConfig: detectionConfig, onCapture: handleCapture, onRectangleDetect: handleRectangleDetect, showManualCaptureButton: false, enableTorch: flashEnabled },
                 react_1.default.createElement(react_native_1.View, { style: styles.overlayTop, pointerEvents: "box-none" },
                     react_1.default.createElement(react_native_1.TouchableOpacity, { style: [
@@ -562,6 +536,8 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
                         ], onPress: handleFlashToggle, disabled: processing, accessibilityLabel: "Toggle flash", accessibilityRole: "button" },
                         react_1.default.createElement(react_native_1.View, { style: styles.iconContainer },
                             react_1.default.createElement(react_native_1.Text, { style: styles.iconText }, "\u26A1\uFE0F"))),
+                    isBusinessMode && (react_1.default.createElement(react_native_1.View, { style: styles.cameraHeaderContainer },
+                        react_1.default.createElement(react_native_1.Text, { style: styles.cameraHeaderText }, currentPhotoIndex === 0 ? mergedStrings.first : mergedStrings.second))),
                     react_1.default.createElement(react_native_1.TouchableOpacity, { style: styles.iconButton, onPress: handleClose, accessibilityLabel: mergedStrings.cancel, accessibilityRole: "button" },
                         react_1.default.createElement(react_native_1.View, { style: styles.iconContainer },
                             react_1.default.createElement(react_native_1.Text, { style: styles.closeIconText }, "\u00D7")))),
@@ -765,9 +741,44 @@ const styles = react_native_1.StyleSheet.create({
     confirmButtonPrimary: {
         backgroundColor: '#3170f3',
     },
+    skipButton: {
+        backgroundColor: 'rgba(100,100,100,0.8)',
+    },
     confirmButtonText: {
         color: '#fff',
         fontSize: 18,
         fontWeight: '600',
     },
+    photoHeader: {
+        position: 'absolute',
+        top: 20,
+        left: 0,
+        right: 0,
+        alignItems: 'center',
+        zIndex: 5,
+    },
+    photoHeaderText: {
+        color: '#fff',
+        fontSize: 20,
+        fontWeight: 'bold',
+        backgroundColor: 'rgba(0,0,0,0.6)',
+        paddingHorizontal: 24,
+        paddingVertical: 8,
+        borderRadius: 20,
+    },
+    cameraHeaderContainer: {
+        position: 'absolute',
+        left: 0,
+        right: 0,
+        alignItems: 'center',
+    },
+    cameraHeaderText: {
+        color: '#fff',
+        fontSize: 18,
+        fontWeight: 'bold',
+        backgroundColor: 'rgba(0,0,0,0.7)',
+        paddingHorizontal: 20,
+        paddingVertical: 6,
+        borderRadius: 16,
+    },
 });

package/package.json

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

package/src/FullDocScanner.tsx

@@ -37,10 +37,10 @@ try {
 let expoManipulatorUnavailable = false;
 const isExpoImageManipulatorAvailable = () =>
   !!ImageManipulator?.manipulateAsync && !expoManipulatorUnavailable;
-const isImageRotationSupported = () => isExpoImageManipulatorAvailable();
+// 회전은 항상 지원됨 (회전 각도를 반환하고 tdb 앱에서 처리)
+const isImageRotationSupported = () => true;
 
 const stripFileUri = (value: string) => value.replace(/^file:\/\//, '');
-const ensureFileUri = (value: string) => (value.startsWith('file://') ? value : `file://${value}`);
 
 const CROPPER_TIMEOUT_MS = 8000;
 const CROPPER_TIMEOUT_CODE = 'cropper_timeout';
@@ -122,6 +122,8 @@ export interface FullDocScannerResult {
   base64?: string;
   /** Original captured document info */
   original?: CapturedDocument;
+  /** Rotation angle applied by user (0, 90, 180, 270) */
+  rotationDegrees?: number;
 }
 
 export interface FullDocScannerStrings {
@@ -133,10 +135,13 @@ export interface FullDocScannerStrings {
   retake?: string;
   confirm?: string;
   cropTitle?: string;
+  first?: string;
+  second?: string;
+  secondBtn?: string;
 }
 
 export interface FullDocScannerProps {
-  onResult: (result: FullDocScannerResult) => void;
+  onResult: (results: FullDocScannerResult[]) => void;
   onClose?: () => void;
   detectionConfig?: DetectionConfig;
   overlayColor?: string;
@@ -149,6 +154,7 @@ export interface FullDocScannerProps {
   enableGallery?: boolean;
   cropWidth?: number;
   cropHeight?: number;
+  type?: 'business';
 }
 
 export const FullDocScanner: React.FC<FullDocScannerProps> = ({
@@ -165,6 +171,7 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
   enableGallery = true,
   cropWidth = 1200,
   cropHeight = 1600,
+  type,
 }) => {
   const [processing, setProcessing] = useState(false);
   const [croppedImageData, setCroppedImageData] = useState<{path: string; base64?: string} | null>(null);
@@ -173,6 +180,8 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
   const [rectangleHint, setRectangleHint] = useState(false);
   const [flashEnabled, setFlashEnabled] = useState(false);
   const [rotationDegrees, setRotationDegrees] = useState(0);
+  const [capturedPhotos, setCapturedPhotos] = useState<FullDocScannerResult[]>([]);
+  const [currentPhotoIndex, setCurrentPhotoIndex] = useState(0);
   const resolvedGridColor = gridColor ?? overlayColor;
   const docScannerRef = useRef<DocScannerHandle | null>(null);
   const captureModeRef = useRef<'grid' | 'no-grid' | null>(null);
@@ -180,6 +189,9 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
   const rectangleCaptureTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const rectangleHintTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
+  const isBusinessMode = type === 'business';
+  const maxPhotos = isBusinessMode ? 2 : 1;
+
   const mergedStrings = useMemo(
     () => ({
       captureHint: strings?.captureHint,
@@ -190,6 +202,9 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
       retake: strings?.retake ?? 'Retake',
       confirm: strings?.confirm ?? 'Confirm',
       cropTitle: strings?.cropTitle ?? 'Crop Document',
+      first: strings?.first ?? 'Front',
+      second: strings?.second ?? 'Back',
+      secondBtn: strings?.secondBtn ?? 'Capture Back Side?',
     }),
     [strings],
   );
@@ -500,118 +515,62 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
       return;
     }
 
-    // 회전이 없으면 기존 데이터 그대로 전달
-    if (rotationDegrees === 0) {
-      console.log('[FullDocScanner] No rotation, returning original image');
-      onResult({
-        path: croppedImageData.path,
-        base64: croppedImageData.base64,
-      });
-      return;
-    }
-
-    try {
-      setProcessing(true);
+    // 회전 각도 정규화 (0, 90, 180, 270)
+    const rotationNormalized = ((rotationDegrees % 360) + 360) % 360;
+    console.log('[FullDocScanner] Confirm - rotation degrees:', rotationDegrees, 'normalized:', rotationNormalized);
 
-      // 회전 각도 정규화 (0, 90, 180, 270)
-      const rotationNormalized = ((rotationDegrees % 360) + 360) % 360;
-      console.log('[FullDocScanner] Rotation degrees:', rotationDegrees, 'normalized:', rotationNormalized);
-
-      if (rotationNormalized === 0) {
-        console.log('[FullDocScanner] Normalized to 0, returning original image');
-        onResult({
-          path: croppedImageData.path,
-          base64: croppedImageData.base64,
-        });
-        setProcessing(false);
-        return;
-      }
-
-      // expo-image-manipulator 시도
-      if (isExpoImageManipulatorAvailable() && ImageManipulator?.manipulateAsync) {
-        try {
-          console.log('[FullDocScanner] Using expo-image-manipulator for rotation');
-          const inputUri = ensureFileUri(croppedImageData.path);
-
-          const result = await ImageManipulator.manipulateAsync(
-            inputUri,
-            [{ rotate: rotationNormalized }],
-            {
-              compress: 0.9,
-              format: ImageManipulator.SaveFormat.JPEG,
-              base64: true,
-            },
-          );
-
-          console.log('[FullDocScanner] Rotation complete via expo-image-manipulator:', {
-            path: result.uri,
-            hasBase64: !!result.base64,
-          });
+    // 현재 사진을 capturedPhotos에 추가
+    const currentPhoto: FullDocScannerResult = {
+      path: croppedImageData.path,
+      base64: croppedImageData.base64,
+      rotationDegrees: rotationNormalized,
+    };
 
-          onResult({
-            path: stripFileUri(result.uri),
-            base64: result.base64,
-          });
-          setProcessing(false);
-          return;
-        } catch (manipulatorError) {
-          const code =
-            manipulatorError && typeof manipulatorError === 'object' && 'code' in manipulatorError
-              ? String((manipulatorError as any).code)
-              : undefined;
-
-          console.error('[FullDocScanner] expo-image-manipulator error:', manipulatorError);
-
-          if (code === 'ERR_UNAVAILABLE') {
-            expoManipulatorUnavailable = true;
-            console.warn(
-              '[FullDocScanner] expo-image-manipulator unavailable at runtime. Trying react-native-image-rotate.',
-            );
-          } else {
-            throw manipulatorError;
-          }
-        }
-      }
+    const updatedPhotos = [...capturedPhotos, currentPhoto];
+    console.log('[FullDocScanner] Photos captured:', updatedPhotos.length, 'of', maxPhotos);
 
-      // expo-image-manipulator를 사용할 수 없는 경우 에러 처리
-      console.error(
-        '[FullDocScanner] Rotation requested but expo-image-manipulator is not available.',
-      );
-      setProcessing(false);
-      Alert.alert(
-        '회전 불가',
-        'expo-image-manipulator가 설치되지 않아 이미지 회전을 수행할 수 없습니다.\n\n패키지를 설치해주세요:\nnpm install expo-image-manipulator',
-        [
-          {
-            text: '원본 사용',
-            onPress: () => {
-              onResult({
-                path: croppedImageData.path,
-                base64: croppedImageData.base64,
-              });
-            },
-          },
-          {
-            text: '취소',
-            style: 'cancel',
-          },
-        ],
-      );
-    } catch (error) {
-      console.error('[FullDocScanner] Image rotation error on confirm:', error);
-      setProcessing(false);
+    // Business 모드이고 아직 첫 번째 사진만 찍은 경우
+    if (isBusinessMode && updatedPhotos.length === 1) {
+      // 두 번째 사진 촬영 여부를 물어봄 (UI에서 버튼으로 표시)
+      setCapturedPhotos(updatedPhotos);
+      setCurrentPhotoIndex(1);
+      // 확인 화면을 유지하고 "뒷면 촬영" 버튼을 표시
+      return;
+    }
 
-      const errorMessage =
-        error && typeof error === 'object' && 'message' in error ? (error as Error).message : String(error);
-      Alert.alert('회전 실패', `이미지 회전 중 오류가 발생했습니다.\n원본 이미지를 사용합니다.\n\n오류: ${errorMessage}`);
+    // 모든 사진 촬영 완료 - 결과 반환
+    console.log('[FullDocScanner] All photos captured, returning results');
+    onResult(updatedPhotos);
+  }, [croppedImageData, rotationDegrees, capturedPhotos, isBusinessMode, maxPhotos, onResult]);
 
-      // 에러 발생 시 원본 이미지 반환
-      onResult({
-        path: croppedImageData.path,
-        base64: croppedImageData.base64,
-      });
+  const handleCaptureSecondPhoto = useCallback(() => {
+    console.log('[FullDocScanner] Capturing second photo');
+    // 확인 화면을 닫고 카메라로 돌아감
+    setCroppedImageData(null);
+    setRotationDegrees(0);
+    setProcessing(false);
+    setRectangleDetected(false);
+    setRectangleHint(false);
+    captureModeRef.current = null;
+    captureInProgressRef.current = false;
+    if (rectangleCaptureTimeoutRef.current) {
+      clearTimeout(rectangleCaptureTimeoutRef.current);
+      rectangleCaptureTimeoutRef.current = null;
+    }
+    if (rectangleHintTimeoutRef.current) {
+      clearTimeout(rectangleHintTimeoutRef.current);
+      rectangleHintTimeoutRef.current = null;
     }
-  }, [croppedImageData, rotationDegrees, onResult]);
+    if (docScannerRef.current?.reset) {
+      docScannerRef.current.reset();
+    }
+  }, []);
+
+  const handleSkipSecondPhoto = useCallback(() => {
+    console.log('[FullDocScanner] Skipping second photo');
+    // 첫 번째 사진만 반환
+    onResult(capturedPhotos);
+  }, [capturedPhotos, onResult]);
 
   const handleRetake = useCallback(() => {
     console.log('[FullDocScanner] Retake - clearing cropped image and resetting scanner');
@@ -698,6 +657,15 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
       {croppedImageData ? (
         // check_DP: Show confirmation screen
         <View style={styles.confirmationContainer}>
+          {/* 헤더 - 앞면/뒷면 표시 */}
+          {isBusinessMode && (
+            <View style={styles.photoHeader}>
+              <Text style={styles.photoHeaderText}>
+                {currentPhotoIndex === 0 ? mergedStrings.first : mergedStrings.second}
+              </Text>
+            </View>
+          )}
+
           {/* 회전 버튼들 - 가운데 정렬 */}
           {isImageRotationSupported() ? (
             <View style={styles.rotateButtonsCenter}>
@@ -738,14 +706,37 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
             >
               <Text style={styles.confirmButtonText}>{mergedStrings.retake}</Text>
             </TouchableOpacity>
-            <TouchableOpacity
-              style={[styles.confirmButton, styles.confirmButtonPrimary]}
-              onPress={handleConfirm}
-              accessibilityLabel={mergedStrings.confirm}
-              accessibilityRole="button"
-            >
-              <Text style={styles.confirmButtonText}>{mergedStrings.confirm}</Text>
-            </TouchableOpacity>
+
+            {/* Business 모드이고 첫 번째 사진을 찍은 후: 뒷면 촬영 버튼 또는 확인 버튼 */}
+            {isBusinessMode && capturedPhotos.length === 1 && currentPhotoIndex === 1 ? (
+              <>
+                <TouchableOpacity
+                  style={[styles.confirmButton, styles.confirmButtonPrimary]}
+                  onPress={handleCaptureSecondPhoto}
+                  accessibilityLabel={mergedStrings.secondBtn}
+                  accessibilityRole="button"
+                >
+                  <Text style={styles.confirmButtonText}>{mergedStrings.secondBtn}</Text>
+                </TouchableOpacity>
+                <TouchableOpacity
+                  style={[styles.confirmButton, styles.skipButton]}
+                  onPress={handleSkipSecondPhoto}
+                  accessibilityLabel={mergedStrings.confirm}
+                  accessibilityRole="button"
+                >
+                  <Text style={styles.confirmButtonText}>{mergedStrings.confirm}</Text>
+                </TouchableOpacity>
+              </>
+            ) : (
+              <TouchableOpacity
+                style={[styles.confirmButton, styles.confirmButtonPrimary]}
+                onPress={handleConfirm}
+                accessibilityLabel={mergedStrings.confirm}
+                accessibilityRole="button"
+              >
+                <Text style={styles.confirmButtonText}>{mergedStrings.confirm}</Text>
+              </TouchableOpacity>
+            )}
           </View>
         </View>
       ) : (
@@ -765,6 +756,7 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
             enableTorch={flashEnabled}
           >
           <View style={styles.overlayTop} pointerEvents="box-none">
+            {/* 좌측: 플래시 버튼 */}
             <TouchableOpacity
               style={[
                 styles.iconButton,
@@ -780,6 +772,17 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
                 <Text style={styles.iconText}>⚡️</Text>
               </View>
             </TouchableOpacity>
+
+            {/* 중앙: 앞면/뒷면 헤더 */}
+            {isBusinessMode && (
+              <View style={styles.cameraHeaderContainer}>
+                <Text style={styles.cameraHeaderText}>
+                  {currentPhotoIndex === 0 ? mergedStrings.first : mergedStrings.second}
+                </Text>
+              </View>
+            )}
+
+            {/* 우측: 닫기 버튼 */}
             <TouchableOpacity
               style={styles.iconButton}
               onPress={handleClose}
@@ -1028,9 +1031,44 @@ const styles = StyleSheet.create({
   confirmButtonPrimary: {
     backgroundColor: '#3170f3',
   },
+  skipButton: {
+    backgroundColor: 'rgba(100,100,100,0.8)',
+  },
   confirmButtonText: {
     color: '#fff',
     fontSize: 18,
     fontWeight: '600',
   },
+  photoHeader: {
+    position: 'absolute',
+    top: 20,
+    left: 0,
+    right: 0,
+    alignItems: 'center',
+    zIndex: 5,
+  },
+  photoHeaderText: {
+    color: '#fff',
+    fontSize: 20,
+    fontWeight: 'bold',
+    backgroundColor: 'rgba(0,0,0,0.6)',
+    paddingHorizontal: 24,
+    paddingVertical: 8,
+    borderRadius: 20,
+  },
+  cameraHeaderContainer: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    alignItems: 'center',
+  },
+  cameraHeaderText: {
+    color: '#fff',
+    fontSize: 18,
+    fontWeight: 'bold',
+    backgroundColor: 'rgba(0,0,0,0.7)',
+    paddingHorizontal: 20,
+    paddingVertical: 6,
+    borderRadius: 16,
+  },
 });