@teamnhz/rn-ui-toolkit 1.3.7 → 1.3.9

package/dist/components/ImagePicker/index.js

@@ -5,6 +5,7 @@ import { launchCamera, launchImageLibrary } from "react-native-image-picker";
 import ImageCropPicker from "react-native-image-crop-picker";
 import { Image as ImageCompressor, Video as VideoCompressor, } from "react-native-compressor";
 import { Colors, Images, Scale, Typography } from "../../styles";
+import ImageResizer from "react-native-image-resizer";
 // Permissions
 import { cameraPermissions, galleryPermissions, checkMicroPhonePermission, } from "../../utils/permissions";
 import { scale } from "../../styles/scale";
@@ -14,18 +15,34 @@ const ImagePicker = ({ mediaType, isMultiSelect = false, onSuccess, visible, onC
         onClose();
     }, [onSuccess, onClose]);
     // Compress Image
+    // const compressImage = async (imagePath: string) => {
+    //   if (!enableCompression) return imagePath;
+    //   try {
+    //     const compressedImage = await ImageCompressor.compress(imagePath, {
+    //       maxWidth: imageCompressionOptions.maxWidth,
+    //       quality: imageCompressionOptions.quality,
+    //     });
+    //     return compressedImage;
+    //   } catch (error) {
+    //     console.error("Image compression error:", error);
+    //     return imagePath;
+    //   }
+    // };
     const compressImage = async (imagePath) => {
-        if (!enableCompression)
-            return imagePath;
         try {
-            const compressedImage = await ImageCompressor.compress(imagePath, {
-                maxWidth: imageCompressionOptions.maxWidth,
-                quality: imageCompressionOptions.quality,
+            if (!enableCompression)
+                return imagePath;
+            // STEP 1 — Resize using image resizer
+            const resized = await ImageResizer.createResizedImage(imagePath, imageCompressionOptions.maxWidth ?? 1080, imageCompressionOptions.maxWidth ?? 1080, "JPEG", (imageCompressionOptions.quality ?? 0.7) * 100, 0, undefined, false);
+            // STEP 2 — Compress using compressor
+            const compressedUri = await ImageCompressor.compress(resized.uri, {
+                maxWidth: imageCompressionOptions.maxWidth ?? 1080,
+                quality: imageCompressionOptions.quality ?? 0.7,
             });
-            return compressedImage;
+            return compressedUri;
         }
-        catch (error) {
-            console.error("Image compression error:", error);
+        catch (err) {
+            console.log("Image final compression error:", err);
             return imagePath;
         }
     };

package/dist/components/LinearGradientButton/index.js

@@ -3,11 +3,10 @@ import { TouchableOpacity, Text, StyleSheet, ActivityIndicator, } from "react-na
 import LinearGradient from "react-native-linear-gradient";
 const LinearGradientButton = ({ title, onPress, loading = false, disabled = false, colors = ["#4c669f", "#3b5998", "#192f6a"], start = { x: 0, y: 0 }, end = { x: 1, y: 1 }, containerStyle, textStyle, height = 50, borderRadius = 12, }) => {
     const isDisabled = loading || disabled;
-    return (React.createElement(TouchableOpacity, { activeOpacity: 0.8, onPress: onPress, disabled: isDisabled, style: { opacity: isDisabled ? 0.6 : 1 } },
+    return (React.createElement(TouchableOpacity, { activeOpacity: 0.8, onPress: onPress, disabled: isDisabled, style: [{ opacity: isDisabled ? 0.6 : 1 }, containerStyle,] },
         React.createElement(LinearGradient, { colors: colors, start: start, end: end, style: [
                 styles.button,
-                { height, borderRadius },
-                containerStyle,
+                { height, borderRadius }
             ] }, loading ? (React.createElement(ActivityIndicator, { color: "#fff", size: "small" })) : (React.createElement(Text, { style: [styles.text, textStyle] }, title)))));
 };
 const styles = StyleSheet.create({
@@ -15,6 +14,7 @@ const styles = StyleSheet.create({
         justifyContent: "center",
         alignItems: "center",
         paddingHorizontal: 12,
+        width: "100%",
     },
     text: {
         color: "#fff",

package/dist/components/Modal/index.js

@@ -1,68 +1,33 @@
-// import React, { ReactNode } from "react";
-// import Modal, { ModalProps } from "react-native-modal";
+import React from "react";
+import Modal from "react-native-modal";
+// Base Modal Component customized for app needs
+const Modals = ({ children, closing, bkO = 0.5, ...props }) => (React.createElement(Modal, { backdropOpacity: bkO, animationInTiming: 400, animationOutTiming: 400, backdropTransitionOutTiming: 0, swipeDirection: ["down", "left", "right", "up"], onSwipeComplete: closing, onBackdropPress: closing, onBackButtonPress: closing, ...props }, children));
+export default Modals;
+// import React, { ReactNode } from 'react';
+// import Modal, { ModalProps } from 'react-native-modal';
 // type AppModalProps = Partial<ModalProps> & {
 //   children: ReactNode;
 //   closing: () => void;
 //   bkO?: number;
 // };
 // // Base Modal Component customized for app needs
-// const Modals = ({ children, closing, bkO = 0.5, ...props }: AppModalProps) => (
+// const Modals = ({
+//   children,
+//   closing,
+//   bkO = 0.5,
+//   ...props
+// }: AppModalProps) => (
 //   <Modal
 //     backdropOpacity={bkO}
 //     animationInTiming={400}
 //     animationOutTiming={400}
 //     backdropTransitionOutTiming={0}
-//     swipeDirection={["down", "left", "right", "up"]}
+//     swipeDirection={['down', 'left', 'right', 'up']}
 //     onSwipeComplete={closing}
 //     onBackdropPress={closing}
 //     onBackButtonPress={closing}
-//     {...props}
-//   >
+//     {...props}>
 //     {children}
 //   </Modal>
 // );
 // export default Modals;
-// // import React, { ReactNode } from 'react';
-// // import Modal, { ModalProps } from 'react-native-modal';
-// // type AppModalProps = Partial<ModalProps> & {
-// //   children: ReactNode;
-// //   closing: () => void;
-// //   bkO?: number;
-// // };
-// // // Base Modal Component customized for app needs
-// // const Modals = ({
-// //   children,
-// //   closing,
-// //   bkO = 0.5,
-// //   ...props
-// // }: AppModalProps) => (
-// //   <Modal
-// //     backdropOpacity={bkO}
-// //     animationInTiming={400}
-// //     animationOutTiming={400}
-// //     backdropTransitionOutTiming={0}
-// //     swipeDirection={['down', 'left', 'right', 'up']}
-// //     onSwipeComplete={closing}
-// //     onBackdropPress={closing}
-// //     onBackButtonPress={closing}
-// //     {...props}>
-// //     {children}
-// //   </Modal>
-// // );
-// // export default Modals;
-import React from "react";
-import { View, StyleSheet } from "react-native";
-import Modal from "react-native-modal";
-const Modals = ({ children, closing, bkO = 0.5, ...props }) => (React.createElement(Modal, { useNativeDriver: true, useNativeDriverForBackdrop: true, backdropOpacity: bkO, animationInTiming: 300, animationOutTiming: 300, onBackdropPress: closing, onBackButtonPress: closing, swipeDirection: ["down"], onSwipeComplete: closing, propagateSwipe: true, ...props },
-    React.createElement(View, { style: styles.innerContainer }, children)));
-const styles = StyleSheet.create({
-    innerContainer: {
-        width: "100%",
-        alignSelf: "center",
-        justifyContent: "center",
-        // MOST IMPORTANT FIX ⚠️
-        // Prevents children from being animated up/down
-        transform: [{ translateY: 0 }],
-    },
-});
-export default Modals;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamnhz/rn-ui-toolkit",
-  "version": "1.3.7",
+  "version": "1.3.9",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -33,7 +33,8 @@
     "react-native-video-trim": "^3.0.9",
     "react-native-compressor": "^1.13.0",
     "react-native-fs": "^2.20.0",
-    "react-native-linear-gradient": "^2.8.3"
+    "react-native-linear-gradient": "^2.8.3",
+    "react-native-image-resizer":"^1.4.5"
   },
   "devDependencies": {
     "@react-native-documents/picker": "^10.1.5",