react-native-expo-cropper 1.0.21 → 1.0.23

package/.babelrc

@@ -1,4 +1,7 @@
 {
-    "presets": ["@babel/preset-env"]
+  "presets": [
+    "@babel/preset-env",
+    "@babel/preset-react"
+  ]
 }
   

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-expo-cropper",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "description": "Recadrage polygonal d'images.",
   "main": "index.js",
   "author": "PCS AGRI",
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@expo/vector-icons": "^15.0.2",
-    "expo": "^54.0.0",
+    "expo": "54.0.0",
     "expo-camera": "~17.0.8",
     "expo-image-manipulator": "~14.0.7",
     "expo-image-picker": "~17.0.8",
@@ -43,6 +43,12 @@
   "homepage": "https://github.com/pcsagri/react-native-expo-cropper#readme",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "babel src --out-dir dist"
+    "build": "babel src --out-dir dist",
+    "build:lib": "babel src --out-dir lib"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.28.3",
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5"
   }
 }

package/src/ImageCropper.js

@@ -1,8 +1,8 @@
 import styles from './ImageCropperStyles';
 import React, { useState, useRef, useEffect } from 'react';
-import { Modal,View, Image, Dimensions, TouchableOpacity, Animated, Text, InteractionManager } from 'react-native';
+import { Modal,View, Image, Dimensions, TouchableOpacity, Animated, Text } from 'react-native';
 import Svg, { Path, Circle } from 'react-native-svg';
-import { captureRef } from 'react-native-view-shot';
+import * as ViewShot from 'react-native-view-shot';
 import CustomCamera from './CustomCamera';
 import { enhanceImage } from './ImageProcessor';
 
@@ -183,62 +183,33 @@ const ImageCropper = ({ onConfirm, openCameraFirst, initialImage ,addheight}) =>
               <TouchableOpacity
                 style={styles.button}
                   onPress={async () => {
+                        // setShowFullScreenCapture(true); 
+                        setIsLoading(true);
+                        setShowResult(true);
                         try {
-                          // Yield for UI to settle to avoid ref invalidation on iOS
-                          await new Promise(resolve => InteractionManager.runAfterInteractions(resolve));
-
-                          // Use JPG + tmpfile for faster iOS snapshots and real file URIs
-                          const captureOptions = { format: 'jpg', quality: 1, result: 'tmpfile' };
-
-                          // Timeout wrapper to avoid indefinite hangs
-                          const withTimeout = (promise, ms) =>
-                            new Promise((resolve, reject) => {
-                              const t = setTimeout(() => reject(new Error('captureRef timeout')), ms);
-                              promise.then(
-                                v => { clearTimeout(t); resolve(v); },
-                                e => { clearTimeout(t); reject(e); }
-                              );
-                            });
-
-                          // Pass ref object directly (SDK 54 compatibility)
-                          const capturedUri = await withTimeout(captureRef(viewRef, captureOptions), 6000);
-
-                          // Try enhancement with a timeout; fallback to captured if slow/fails
-                          const enhanceWithTimeout = (promise, ms) =>
-                            new Promise((resolve) => {
-                              const t = setTimeout(() => resolve(null), ms);
-                              promise.then(uri => { clearTimeout(t); resolve(uri); })
-                                     .catch(() => { clearTimeout(t); resolve(null); });
-                            });
-
-                          const enhancedUri = await enhanceWithTimeout(enhanceImage(capturedUri, addheight), 4000);
-
-                          const resultUri = enhancedUri || capturedUri || image;
-                          const name = `IMAGE XTK${Date.now()}.jpg`;
-
-                          if (onConfirm && resultUri) {
-                            // Invoke callback first, then clean up UI to avoid re-render churn
-                            setTimeout(() => onConfirm(resultUri, name), 0);
-                          }
-
-                          // Reset UI states after callback
-                          setShowResult(false);
-                          setIsLoading(false);
-                          setShowFullScreenCapture(false);
-                        } catch (error) {
-                          console.error("Erreur lors de la capture :", error);
-                          alert("Erreur lors de la capture !");
-
-                          // Fallback to original image to keep UX moving
-                          if (onConfirm && image) {
-                            const name = `IMAGE_FALLBACK_${Date.now()}.jpg`;
-                            setTimeout(() => onConfirm(image, name), 0);
-                          }
-
-                          setShowResult(false);
-                          setIsLoading(false);
-                          setShowFullScreenCapture(false);
-                        }
+
+                          const capturedUri = await ViewShot.captureRef(viewRef.current, {
+                            format: 'png',
+                            quality: 1,
+                            result: "tmpfile",
+                          });
+
+                        
+                        const enhancedUri = await enhanceImage(capturedUri ,addheight);
+                        const name = `IMAGE XTK${Date.now()}.png`;
+
+                    
+                    if (onConfirm) {
+                      onConfirm(enhancedUri, name);
+                    }
+                  } catch (error) {
+                    console.error("Erreur lors de la capture :", error);
+                    alert("Erreur lors de la capture !");
+                  } finally {
+                    setShowResult(false);
+                    setIsLoading(false);
+                    setShowFullScreenCapture(false);
+                  }
                 }}
   >
     <Text style={styles.buttonText}>Confirm</Text>

package/src/ImageProcessor.js

@@ -1,28 +1,40 @@
-import * as ImageManipulator from 'expo-image-manipulator';
+import * as ImageManipulator from "expo-image-manipulator";
+import * as FileSystem from "expo-file-system";
 
-export const enhanceImage = async (uri , addheight) => {
+export const enhanceImage = async (uri, addheight) => {
   try {
-    const imageInfo = await ImageManipulator.manipulateAsync(uri, []);
-    const ratio = imageInfo.height / imageInfo.width;
+    let fileUri = uri;
 
-    const maxHeight = addheight;
-    const newWidth = Math.round(maxHeight / ratio);
+    // ✅ Convert Base64 → file on iOS SDK54 if needed
+    if (uri.startsWith("data:image")) {
+      const base64 = uri.split(",")[1];
+      const filePath = `${FileSystem.cacheDirectory}crop_${Date.now()}.png`;
+
+      await FileSystem.writeAsStringAsync(filePath, base64, {
+        encoding: FileSystem.EncodingType.Base64,
+      });
+
+      fileUri = filePath;
+    }
+
+    const info = await ImageManipulator.manipulateAsync(fileUri, []);
+    const ratio = info.height / info.width;
+
+    const newWidth = Math.round(addheight / ratio);
     const newHeight = Math.round(newWidth * ratio);
 
-    const result = await ImageManipulator.manipulateAsync(
-      uri,
-      [
-        { resize: { width: newWidth, height: newHeight } },
-      ],
+    const resized = await ImageManipulator.manipulateAsync(
+      fileUri,
+      [{ resize: { width: newWidth, height: newHeight } }],
       {
         compress: 1,
-        format: ImageManipulator.SaveFormat.PNG
+        format: ImageManipulator.SaveFormat.PNG,
       }
     );
 
-    return result.uri;
+    return resized.uri;
   } catch (error) {
-    console.error("Erreur T404K:", error);
+    console.log("iOS SDK54 enhanceImage error:", error);
     return uri;
   }
 };