motorinc-gallery-picker-pro 1.0.4 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "motorinc-gallery-picker-pro",
-  "version": "1.0.4",
+  "version": "1.0.7",
   "description": "A comprehensive React Native media gallery picker with smooth animations, multi-select, single-select, crop functionality, and native iOS/Android support",
   "main": "index.js",
   "types": "index.d.ts",

package/src/components/MainPhotoGallery.tsx

@@ -45,6 +45,7 @@ import {
   SPACING_16,
   SPACING_24,
   SPACING_4,
+  Header,
 } from 'motorinc-global-components';
 import {ThemeContext, FontProvider, useTheme} from 'motorinc-global-components';
 const {width: screenWidth, height: screenHeight} = Dimensions.get('window');
@@ -1475,7 +1476,7 @@ const MainPhotoGallery = React.forwardRef<MainPhotoGalleryRef, props>(
               <TouchableOpacity
                 activeOpacity={0.8}
                 key={ratio}
-                style={[styles.aspectRatioButton]}
+                // style={[styles.aspectRatioButton]}
                 onPress={() => setAspectRatio(ratio)}
                 hitSlop={{top: 12, bottom: 12}}>
                 <View
@@ -1576,7 +1577,7 @@ const MainPhotoGallery = React.forwardRef<MainPhotoGalleryRef, props>(
                     ? 'rgba(235, 238, 245, 0.60)'
                     : '#fff'
                 }>
-                {String.fromCharCode(60558)}
+                {String.fromCharCode(60559)}
               </PlayyText>
             </TouchableOpacity>
           </View>
@@ -1685,6 +1686,12 @@ const MainPhotoGallery = React.forwardRef<MainPhotoGalleryRef, props>(
       );
     };
 
+    const handleNextPress = useCallback(() => {
+      if (onNext) {
+        onNext(selectedAssets || []);
+      }
+    }, [onNext, selectedAssets]);
+
     const renderCancelNextButtons = () => {
       // Only show buttons if we have the callbacks and are in multi-select mode
       if (!multiSelect || (!onCancel && !onNext)) {
@@ -1694,19 +1701,36 @@ const MainPhotoGallery = React.forwardRef<MainPhotoGalleryRef, props>(
       const currentSelectedAssets = selectedAssets || [];
 
       return (
-        <NavigationHeader
-          backIcon
-          statusBarvalue={statusBarvalue!}
-          handleBack={onCancel}
-          buttonTitle="Next"
-          buttontextColor="#fff"
-          backIconColor="#fff"
-          isButton
-          label="Back"
-          labelColor="#fff"
-          // @ts-ignore
-          handlePressButton={onNext}
-        />
+        // <NavigationHeader
+        //   backIcon
+        //   statusBarvalue={statusBarvalue!}
+        //   handleBack={onCancel}
+        //   buttonTitle="Next"
+        //   buttontextColor="#fff"
+        //   backIconColor="#fff"
+        //   isButton
+        //   label="Back"
+        //   labelColor="#fff"
+        //   // @ts-ignore
+        //   handlePressButton={onNext}
+        // />
+        <Header
+          statusBarValue={statusBarvalue}
+          style={{backgroundColor: '#000'}}>
+          <Header.Row>
+            <Header.Left
+              label="Cancel"
+              labelColor="#fff"
+              onBackPress={onCancel}
+            />
+            <Header.Right
+              buttonTitle="Next"
+              buttonTextColor="#008BF5"
+              isButton
+              onButtonPress={handleNextPress}
+            />
+          </Header.Row>
+        </Header>
       );
     };
 
@@ -2068,8 +2092,8 @@ const styles = StyleSheet.create({
   navControls: {
     flexDirection: 'row',
     justifyContent: 'center',
+    gap: 16,
     alignItems: 'center',
-    gap: 8,
   },
   simpleHeader: {
     flexDirection: 'row',
@@ -2608,6 +2632,7 @@ const styles = StyleSheet.create({
   aspectRatioContainer: {
     flexDirection: 'row',
     paddingHorizontal: 4,
+    gap: 12,
   },
   aspectRatioButton: {
     paddingHorizontal: 12,