react-native-rectangle-doc-scanner 3.94.0 → 3.95.0

package/dist/FullDocScanner.d.ts

@@ -8,8 +8,6 @@ export interface FullDocScannerResult {
     base64?: string;
     /** Original captured document info */
     original?: CapturedDocument;
-    /** Rotation degrees (0, 90, 180, 270) */
-    rotation?: number;
 }
 export interface FullDocScannerStrings {
     captureHint?: string;

package/dist/FullDocScanner.js

@@ -41,6 +41,7 @@ const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const react_native_image_picker_1 = require("react-native-image-picker");
 const react_native_image_crop_picker_1 = __importDefault(require("react-native-image-crop-picker"));
+const react_native_image_rotate_1 = __importDefault(require("react-native-image-rotate"));
 const DocScanner_1 = require("./DocScanner");
 const stripFileUri = (value) => value.replace(/^file:\/\//, '');
 const CROPPER_TIMEOUT_MS = 8000;
@@ -329,14 +330,35 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
     const handleFlashToggle = (0, react_1.useCallback)(() => {
         setFlashEnabled(prev => !prev);
     }, []);
-    const handleRotateImage = (0, react_1.useCallback)((degrees) => {
+    const handleRotateImage = (0, react_1.useCallback)(async (degrees) => {
         if (!croppedImageData)
             return;
-        // UI에서만 회전 (실제 파일은 confirm 시에 처리)
-        setRotationDegrees(prev => {
-            const newRotation = (prev + degrees + 360) % 360;
-            return newRotation;
-        });
+        try {
+            // UI 회전 상태 먼저 업데이트 (즉각 반응)
+            setRotationDegrees(prev => {
+                const newRotation = (prev + degrees + 360) % 360;
+                return newRotation;
+            });
+            console.log('[FullDocScanner] Starting image rotation...');
+            // ImageRotate를 사용해서 실제로 이미지 회전 (UI 없이)
+            const rotatedImagePath = await react_native_image_rotate_1.default.rotateImage(croppedImageData.path, degrees);
+            console.log('[FullDocScanner] Image rotated successfully:', rotatedImagePath);
+            // 회전된 이미지로 교체
+            setCroppedImageData({
+                path: rotatedImagePath,
+                base64: undefined, // base64는 다시 읽어야 함
+            });
+            // rotation degrees는 0으로 리셋 (이미 실제 파일에 적용되었으므로)
+            setRotationDegrees(0);
+        }
+        catch (error) {
+            console.error('[FullDocScanner] Image rotation error:', error);
+            // 에러 발생 시 UI rotation 원복
+            setRotationDegrees(prev => {
+                const revertRotation = (prev - degrees + 360) % 360;
+                return revertRotation;
+            });
+        }
     }, [croppedImageData]);
     const handleConfirm = (0, react_1.useCallback)(() => {
         if (!croppedImageData)
@@ -344,9 +366,8 @@ const FullDocScanner = ({ onResult, onClose, detectionConfig, overlayColor = '#3
         onResult({
             path: croppedImageData.path,
             base64: croppedImageData.base64,
-            rotation: rotationDegrees !== 0 ? rotationDegrees : undefined,
         });
-    }, [croppedImageData, rotationDegrees, onResult]);
+    }, [croppedImageData, onResult]);
     const handleRetake = (0, react_1.useCallback)(() => {
         console.log('[FullDocScanner] Retake - clearing cropped image and resetting scanner');
         setCroppedImageData(null);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-rectangle-doc-scanner",
-  "version": "3.94.0",
+  "version": "3.95.0",
   "description": "Native-backed document scanner for React Native with customizable overlays.",
   "license": "MIT",
   "main": "dist/index.js",
@@ -33,15 +33,19 @@
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-image-picker": "*",
     "react-native-image-crop-picker": "*",
+    "react-native-image-picker": "*",
+    "react-native-image-rotate": "*",
     "react-native-svg": "*"
   },
   "devDependencies": {
     "@types/react": "^18.2.41",
     "@types/react-native": "0.73.0",
-    "react-native-image-picker": "^7.1.2",
     "react-native-image-crop-picker": "^0.41.2",
+    "react-native-image-picker": "^7.1.2",
     "typescript": "^5.3.3"
+  },
+  "dependencies": {
+    "react-native-image-rotate": "^2.1.0"
   }
 }

package/src/FullDocScanner.tsx

@@ -11,6 +11,7 @@ import {
 } from 'react-native';
 import { launchImageLibrary } from 'react-native-image-picker';
 import ImageCropPicker from 'react-native-image-crop-picker';
+import ImageRotate from 'react-native-image-rotate';
 import { DocScanner } from './DocScanner';
 import type { CapturedDocument } from './types';
 import type {
@@ -102,8 +103,6 @@ export interface FullDocScannerResult {
   base64?: string;
   /** Original captured document info */
   original?: CapturedDocument;
-  /** Rotation degrees (0, 90, 180, 270) */
-  rotation?: number;
 }
 
 export interface FullDocScannerStrings {
@@ -442,14 +441,42 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
     setFlashEnabled(prev => !prev);
   }, []);
 
-  const handleRotateImage = useCallback((degrees: -90 | 90) => {
+  const handleRotateImage = useCallback(async (degrees: -90 | 90) => {
     if (!croppedImageData) return;
 
-    // UI에서만 회전 (실제 파일은 confirm 시에 처리)
-    setRotationDegrees(prev => {
-      const newRotation = (prev + degrees + 360) % 360;
-      return newRotation;
-    });
+    try {
+      // UI 회전 상태 먼저 업데이트 (즉각 반응)
+      setRotationDegrees(prev => {
+        const newRotation = (prev + degrees + 360) % 360;
+        return newRotation;
+      });
+
+      console.log('[FullDocScanner] Starting image rotation...');
+
+      // ImageRotate를 사용해서 실제로 이미지 회전 (UI 없이)
+      const rotatedImagePath = await ImageRotate.rotateImage(
+        croppedImageData.path,
+        degrees,
+      );
+
+      console.log('[FullDocScanner] Image rotated successfully:', rotatedImagePath);
+
+      // 회전된 이미지로 교체
+      setCroppedImageData({
+        path: rotatedImagePath,
+        base64: undefined, // base64는 다시 읽어야 함
+      });
+
+      // rotation degrees는 0으로 리셋 (이미 실제 파일에 적용되었으므로)
+      setRotationDegrees(0);
+    } catch (error) {
+      console.error('[FullDocScanner] Image rotation error:', error);
+      // 에러 발생 시 UI rotation 원복
+      setRotationDegrees(prev => {
+        const revertRotation = (prev - degrees + 360) % 360;
+        return revertRotation;
+      });
+    }
   }, [croppedImageData]);
 
   const handleConfirm = useCallback(() => {
@@ -458,9 +485,8 @@ export const FullDocScanner: React.FC<FullDocScannerProps> = ({
     onResult({
       path: croppedImageData.path,
       base64: croppedImageData.base64,
-      rotation: rotationDegrees !== 0 ? rotationDegrees : undefined,
     });
-  }, [croppedImageData, rotationDegrees, onResult]);
+  }, [croppedImageData, onResult]);
 
   const handleRetake = useCallback(() => {
     console.log('[FullDocScanner] Retake - clearing cropped image and resetting scanner');

package/src/types/react-native-image-rotate.d.ts

@@ -0,0 +1,8 @@
+declare module 'react-native-image-rotate' {
+  export default class ImageRotate {
+    static rotateImage(
+      imagePath: string,
+      degrees: number,
+    ): Promise<string>;
+  }
+}