react-native-navigation-mode 0.2.0

package/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2025 Jairaj Jangle
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/NavigationMode.podspec

@@ -0,0 +1,19 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+  s.name         = "NavigationMode"
+  s.version      = package["version"]
+  s.summary      = package["description"]
+  s.homepage     = package["homepage"]
+  s.license      = package["license"]
+  s.authors      = package["author"]
+
+  s.platforms    = { :ios => "11.0" }
+  s.source       = { :git => package["repository"]["url"], :tag => "#{s.version}" }
+
+  s.source_files = "ios/**/*.{h,m,mm}"
+
+  install_modules_dependencies(s)
+end

package/README.md

@@ -0,0 +1,279 @@
+# react-native-navigation-mode
+
+🧭 Detect Android navigation mode (3-button, 2-button, or gesture navigation) with native precision using Turbo modules.
+
+[![npm version](https://img.shields.io/npm/v/react-native-navigation-mode)](https://badge.fury.io/js/react-native-navigation-mode) [![License](https://img.shields.io/github/license/JairajJangle/react-native-navigation-mode)](https://github.com/JairajJangle/react-native-navigation-mode/blob/main/LICENSE) [![Workflow Status](https://github.com/JairajJangle/react-native-navigation-mode/actions/workflows/ci.yml/badge.svg)](https://github.com/JairajJangle/react-native-navigation-mode/actions/workflows/ci.yml) ![Android](https://img.shields.io/badge/-Android-555555?logo=android&logoColor=3DDC84) ![iOS](https://img.shields.io/badge/-iOS-555555?logo=apple&logoColor=white) [![GitHub issues](https://img.shields.io/github/issues/JairajJangle/react-native-navigation-mode)](https://github.com/JairajJangle/react-native-navigation-mode/issues?q=is%3Aopen+is%3Aissue) ![TS](https://img.shields.io/badge/TypeScript-strict_💪-blue) ![Turbo Module](https://img.shields.io/badge/Turbo%20Module-⚡-orange) ![Expo Compatible](https://img.shields.io/badge/Expo-555555?style=flat&logo=expo&logoColor=white) ![npm bundle size](https://img.shields.io/bundlephobia/minzip/react-native-navigation-mode)
+
+<table align="center">
+  <tr>
+    <td align="center"><img src=".github/assets/buttons.png" alt="Visibility Sensor demo" height="600"></td>
+    <td align="center"><img src=".github/assets/gesture.png" alt="Visibility Sensor demo" height="600"></td>
+  </tr>
+</table>
+
+
+<div align="center">
+  <table>
+    <tr>
+      <td align="center">
+        <img src="https://img.shields.io/badge/3--Button-Navigation-blue?style=for-the-badge" alt="3-Button Navigation" />
+        <br />
+        <small>Traditional Android navigation</small>
+      </td>
+      <td align="center">
+        <img src="https://img.shields.io/badge/2--Button-Navigation-green?style=for-the-badge" alt="2-Button Navigation" />
+        <br />
+        <small>Home + Back buttons</small>
+      </td>
+      <td align="center">
+        <img src="https://img.shields.io/badge/Gesture-Navigation-purple?style=for-the-badge" alt="Gesture Navigation" />
+        <br />
+        <small>Swipe-based navigation</small>
+      </td>
+    </tr>
+  </table>
+</div>
+
+## ✨ Features
+
+- 🎯 **Direct Native Detection** - No hacky workarounds or dimension-based guessing
+- ⚡ **Turbo Module** - Built with the latest React Native architecture
+- 🔄 **Real-time Detection** - Accurate navigation mode identification
+- 📱 **Cross Platform** - Android detection + iOS compatibility
+- 🎣 **React Hooks** - Easy integration with `useNavigationMode()`
+- 🚀 **Expo Compatible** - Works with Expo managed workflow (dev builds)
+- 📦 **Zero Dependencies** - Lightweight and performant
+- 🛡️ **TypeScript** - Full type safety out of the box
+
+## Installation
+
+Using yarn:
+
+```sh
+yarn add react-native-navigation-mode
+```
+
+Using npm:
+
+```sh
+npm install react-native-navigation-mode
+```
+
+### For Expo Managed Workflow
+
+```sh
+npx expo install react-native-navigation-mode
+```
+
+Add the plugin to your `app.config.js`:
+
+```javascript
+export default {
+  expo: {
+    plugins: ["react-native-navigation-mode"],
+  },
+};
+```
+
+Create a development build:
+
+```sh
+npx expo run:android
+```
+
+> ⚠️ **Note:** This library requires a development build and will NOT work in Expo Go due to native code requirements.
+
+### For React Native CLI
+
+Auto-linking handles setup automatically for React Native 0.60+.
+
+## Usage
+
+### Quick Check
+
+```typescript
+import { isGestureNavigation } from 'react-native-navigation-mode';
+
+// Simple boolean check
+const isGesture = await isGestureNavigation();
+console.log('Gesture navigation:', isGesture); // true/false
+```
+
+### Detailed Information
+
+```typescript
+import { getNavigationMode } from 'react-native-navigation-mode';
+
+// Get comprehensive navigation info
+const navInfo = await getNavigationMode();
+console.log('Navigation type:', navInfo.type); // '3_button', '2_button', 'gesture', or 'unknown'
+console.log('SDK version:', navInfo.sdkVersion);
+console.log('Device model:', navInfo.deviceModel);
+```
+
+### React Hook (Recommended)
+
+```typescript
+import React from 'react';
+import { View, Text } from 'react-native';
+import { useNavigationMode } from 'react-native-navigation-mode';
+
+export default function NavigationInfo() {
+  const { navigationMode, loading, error } = useNavigationMode();
+
+  if (loading) return <Text>Detecting navigation mode...</Text>;
+  if (error) return <Text>Error: {error.message}</Text>;
+
+  return (
+    <View>
+      <Text>Navigation Type: {navigationMode?.type}</Text>
+      <Text>Gesture Navigation: {navigationMode?.isGestureNavigation ? 'Yes' : 'No'}</Text>
+      <Text>Has Navigation Bar: {navigationMode?.hasNavigationBar ? 'Yes' : 'No'}</Text>
+      <Text>Android SDK: {navigationMode?.sdkVersion}</Text>
+      <Text>Device: {navigationMode?.deviceModel}</Text>
+    </View>
+  );
+}
+```
+
+### Conditional UI Rendering
+
+```typescript
+import React from 'react';
+import { View } from 'react-native';
+import { useNavigationMode } from 'react-native-navigation-mode';
+
+export default function AdaptiveUI() {
+  const { navigationMode } = useNavigationMode();
+
+  return (
+    <View 
+      style={{
+        paddingBottom: navigationMode?.isGestureNavigation ? 34 : 48 // Adjust for gesture nav
+      }}
+    >
+      {/* Your content */}
+    </View>
+  );
+}
+```
+
+## API Reference
+
+### Functions
+
+#### `getNavigationMode(): Promise<NavigationModeInfo>`
+
+Returns comprehensive navigation mode information.
+
+#### `isGestureNavigation(): Promise<boolean>`
+
+Quick check if device is using gesture navigation.
+
+### Hooks
+
+#### `useNavigationMode(): { navigationMode, loading, error }`
+
+React hook for navigation mode detection with loading and error states.
+
+### Types
+
+#### `NavigationModeInfo`
+
+| Property            | Type                                           | Description                                      |
+| ------------------- | ---------------------------------------------- | ------------------------------------------------ |
+| type                | `'3_button' \| '2_button' \| 'gesture' \| 'unknown'` | Navigation mode type                             |
+| isGestureNavigation | `boolean`                                      | Whether gesture navigation is active             |
+| hasNavigationBar    | `boolean`                                      | Whether device has a navigation bar              |
+| sdkVersion          | `number`                                       | Android SDK version (iOS: iOS version)          |
+| deviceModel         | `string`                                       | Device model name                                |
+| interactionMode     | `number \| undefined`                          | Raw Android interaction mode (0, 1, 2, or -1)   |
+
+## Platform Support
+
+| Platform | Support | Notes |
+|----------|---------|-------|
+| Android  | ✅ Full | Detects all navigation modes via native Android APIs |
+| iOS      | ✅ Compatible | Always returns `gesture` (iOS uses gesture navigation) |
+
+### Android Compatibility
+
+- **API 21+** - Basic navigation bar detection
+- **API 29+** - Full navigation mode detection (`config_navBarInteractionMode`)
+- **All versions** - Fallback detection methods included
+
+## How It Works
+
+The library uses multiple detection methods for maximum accuracy:
+
+1. **`config_navBarInteractionMode`** - Official Android configuration (API 29+)
+2. **Settings Provider** - Checks `navigation_mode` system setting
+3. **Navigation Bar Detection** - Validates navigation bar presence
+4. **Hardware Key Detection** - Fallback for older devices
+
+### Navigation Mode Values
+
+| Android Mode | Type | Description |
+|--------------|------|-------------|
+| 0 | `3_button` | Traditional Android navigation (Back, Home, Recent) |
+| 1 | `2_button` | Two-button navigation (Back, Home) |
+| 2 | `gesture` | Full gesture navigation |
+| -1 | `unknown` | Could not determine navigation mode |
+
+## Notes
+
+1. 🍎 **iOS Behavior** - iOS always returns `isGestureNavigation: true` since iOS doesn't have 3-button navigation
+2. 📱 **Expo Go** - Not supported due to native module requirements. Use development builds instead
+3. ⚡ **Performance** - Turbo module ensures minimal performance impact
+4. 🔄 **Real-time** - Navigation mode is detected at call time, reflecting current device settings
+
+## Troubleshooting
+
+### Common Issues
+
+**"TurboModuleRegistry.getEnforcing(...) is not a function"**
+- Ensure you're using React Native 0.68+ with new architecture enabled
+- For older RN versions, the module will fallback gracefully
+
+**Expo Go not working**
+- This is expected. Create a development build with `npx expo run:android`
+
+**Always returns 'unknown' on Android**
+- Check if your device/emulator supports the navigation mode APIs
+- Some custom ROMs may not expose standard Android navigation settings
+
+## Contributing
+
+See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
+
+## License
+
+MIT
+
+## Support the project
+
+<p align="center" valign="center">
+  <a href="https://liberapay.com/FutureJJ/donate">
+    <img src="https://liberapay.com/assets/widgets/donate.svg" alt="LiberPay_Donation_Button" height="50" > 
+  </a>
+  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+  <a href=".github/assets/Jairaj_Jangle_Google_Pay_UPI_QR_Code.jpg">
+    <img src=".github/assets/upi.png" alt="UPI_Donation_Button" height="50" >
+  </a>
+  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+  <a href="https://www.paypal.com/paypalme/jairajjangle001/usd">
+    <img src=".github/assets/paypal_donate.png" alt="Paypal_Donation_Button" height="50" >
+  </a>
+</p>
+
+## ❤️ Thanks to
+
+- Module built using [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
+- Inspiration from various Android navigation detection attempts in the community
+- React Native team for Turbo Modules architecture
+- Expo team for config plugin support
+- Readme is edited using [Typora](https://typora.io/)
+
+---
+
+Made with ❤️ by [JairajJangle](https://github.com/JairajJangle)

package/android/build.gradle

@@ -0,0 +1,83 @@
+buildscript {
+  ext.getExtOrDefault = {name ->
+    return rootProject.ext.has(name) ? rootProject.ext.get(name) : project.properties['NavigationMode_' + name]
+  }
+
+  repositories {
+    google()
+    mavenCentral()
+  }
+
+  dependencies {
+    classpath "com.android.tools.build:gradle:8.7.2"
+    // noinspection DifferentKotlinGradleVersion
+    classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:${getExtOrDefault('kotlinVersion')}"
+  }
+}
+
+
+apply plugin: "com.android.library"
+apply plugin: "kotlin-android"
+
+apply plugin: "com.facebook.react"
+
+def getExtOrIntegerDefault(name) {
+  return rootProject.ext.has(name) ? rootProject.ext.get(name) : (project.properties["NavigationMode_" + name]).toInteger()
+}
+
+android {
+  namespace "com.navigationmode"
+
+  compileSdkVersion getExtOrIntegerDefault("compileSdkVersion")
+
+  defaultConfig {
+    minSdkVersion getExtOrIntegerDefault("minSdkVersion")
+    targetSdkVersion getExtOrIntegerDefault("targetSdkVersion")
+  }
+
+  buildFeatures {
+    buildConfig true
+  }
+
+  buildTypes {
+    release {
+      minifyEnabled false
+    }
+  }
+
+  lintOptions {
+    disable "GradleCompatible"
+  }
+
+  compileOptions {
+    sourceCompatibility JavaVersion.VERSION_1_8
+    targetCompatibility JavaVersion.VERSION_1_8
+  }
+
+  sourceSets {
+    main {
+      java.srcDirs += [
+        "generated/java",
+        "generated/jni"
+      ]
+    }
+  }
+}
+
+repositories {
+  mavenCentral()
+  google()
+}
+
+def kotlin_version = getExtOrDefault("kotlinVersion")
+
+dependencies {
+  implementation "com.facebook.react:react-android"
+  implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
+}
+
+react {
+  jsRootDir = file("../src/")
+  libraryName = "NavigationMode"
+  codegenJavaPackageName = "com.navigationmode"
+}

package/android/gradle.properties

@@ -0,0 +1,5 @@
+NavigationMode_kotlinVersion=2.0.21
+NavigationMode_minSdkVersion=24
+NavigationMode_targetSdkVersion=34
+NavigationMode_compileSdkVersion=35
+NavigationMode_ndkVersion=27.1.12297006

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+</manifest>

package/android/src/main/java/com/navigationmode/NavigationModeModule.kt

@@ -0,0 +1,117 @@
+package com.navigationmode
+
+import android.content.Context
+import android.content.res.Resources
+import android.os.Build
+import android.provider.Settings
+import android.view.ViewConfiguration
+import com.facebook.react.bridge.Promise
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.module.annotations.ReactModule
+
+@ReactModule(name = NavigationModeModule.NAME)
+class NavigationModeModule(reactContext: ReactApplicationContext) : 
+    NativeNavigationModeSpec(reactContext) {
+    
+    companion object {
+        const val NAME = "NavigationMode"
+    }
+
+    override fun getName(): String = NAME
+
+    override fun getNavigationMode(promise: Promise) {
+        try {
+            val result = Arguments.createMap()
+            val context = reactApplicationContext
+            
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+                val navBarInteractionMode = getNavBarInteractionMode(context)
+                result.putInt("interactionMode", navBarInteractionMode)
+                result.putString("type", getNavigationTypeFromInteractionMode(navBarInteractionMode))
+            }
+            
+            val gestureNavEnabled = isGestureNavigationEnabled(context)
+            result.putBoolean("isGestureNavigation", gestureNavEnabled)
+            
+            val hasNavigationBar = hasNavigationBar(context)
+            result.putBoolean("hasNavigationBar", hasNavigationBar)
+            
+            result.putInt("sdkVersion", Build.VERSION.SDK_INT)
+            result.putString("deviceModel", Build.MODEL)
+            
+            promise.resolve(result)
+        } catch (e: Exception) {
+            promise.reject("NAVIGATION_MODE_ERROR", "Failed to get navigation mode: ${e.message}", e)
+        }
+    }
+
+    override fun isGestureNavigation(promise: Promise) {
+        try {
+            val context = reactApplicationContext
+            
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+                val navBarInteractionMode = getNavBarInteractionMode(context)
+                promise.resolve(navBarInteractionMode == 2)
+            } else {
+                val gestureEnabled = isGestureNavigationEnabled(context)
+                promise.resolve(gestureEnabled)
+            }
+        } catch (e: Exception) {
+            promise.reject("GESTURE_NAV_ERROR", "Failed to check gesture navigation: ${e.message}", e)
+        }
+    }
+
+    private fun getNavBarInteractionMode(context: Context): Int {
+        return if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+            try {
+                val resources = context.resources
+                val resourceId = resources.getIdentifier("config_navBarInteractionMode", "integer", "android")
+                if (resourceId > 0) {
+                    resources.getInteger(resourceId)
+                } else -1
+            } catch (e: Exception) {
+                -1
+            }
+        } else -1
+    }
+
+    private fun getNavigationTypeFromInteractionMode(mode: Int): String {
+        return when (mode) {
+            0 -> "3_button"
+            1 -> "2_button"
+            2 -> "gesture"
+            else -> "unknown"
+        }
+    }
+
+    private fun isGestureNavigationEnabled(context: Context): Boolean {
+        return if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+            try {
+                val navBarMode = Settings.Secure.getString(
+                    context.contentResolver,
+                    "navigation_mode"
+                )
+                "2" == navBarMode
+            } catch (e: Exception) {
+                false
+            }
+        } else false
+    }
+
+    private fun hasNavigationBar(context: Context): Boolean {
+        return try {
+            val resources = context.resources
+            val resourceId = resources.getIdentifier("config_showNavigationBar", "bool", "android")
+            
+            if (resourceId > 0) {
+                resources.getBoolean(resourceId)
+            } else {
+                !ViewConfiguration.get(context).hasPermanentMenuKey()
+            }
+        } catch (e: Exception) {
+            true
+        }
+    }
+}

package/android/src/main/java/com/navigationmode/NavigationModePackage.kt

@@ -0,0 +1,34 @@
+package com.navigationmode
+
+import com.facebook.react.TurboReactPackage
+import com.facebook.react.bridge.NativeModule
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.module.model.ReactModuleInfo
+import com.facebook.react.module.model.ReactModuleInfoProvider
+
+class NavigationModePackage : TurboReactPackage() {
+    
+    override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? {
+        return if (name == NavigationModeModule.NAME) {
+            NavigationModeModule(reactContext)
+        } else {
+            null
+        }
+    }
+
+    override fun getReactModuleInfoProvider(): ReactModuleInfoProvider {
+        return ReactModuleInfoProvider {
+            mapOf(
+                NavigationModeModule.NAME to ReactModuleInfo(
+                    NavigationModeModule.NAME,
+                    NavigationModeModule.NAME,
+                    false, // canOverrideExistingModule
+                    false, // needsEagerInit
+                    true,  // hasConstants
+                    false, // isCxxModule
+                    true   // isTurboModule
+                )
+            )
+        }
+    }
+}

package/ios/NavigationMode.h

@@ -0,0 +1,9 @@
+#import <NavigationModeSpec/NavigationModeSpec.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface NavigationMode : NSObject <NativeNavigationModeSpec>
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/NavigationMode.mm

@@ -0,0 +1,31 @@
+#import "NavigationMode.h"
+
+@implementation NavigationMode
+
+RCT_EXPORT_MODULE()
+
+- (void)getNavigationMode:(RCTPromiseResolveBlock)resolve
+                   reject:(RCTPromiseRejectBlock)reject {
+    // iOS always uses gesture navigation - handled in TypeScript
+    NSDictionary *result = @{
+        @"type": @"gesture",
+        @"isGestureNavigation": @YES,
+        @"hasNavigationBar": @NO,
+        @"sdkVersion": @([[NSProcessInfo processInfo] operatingSystemVersion].majorVersion),
+        @"deviceModel": @"iOS"
+    };
+    resolve(result);
+}
+
+- (void)isGestureNavigation:(RCTPromiseResolveBlock)resolve
+                     reject:(RCTPromiseRejectBlock)reject {
+    // iOS always uses gesture navigation - handled in TypeScript
+    resolve(@YES);
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
+    (const facebook::react::ObjCTurboModule::InitParams &)params {
+    return std::make_shared<facebook::react::NativeNavigationModeSpecJSI>(params);
+}
+
+@end

package/lib/module/NativeNavigationMode.js

@@ -0,0 +1,5 @@
+"use strict";
+
+import { TurboModuleRegistry } from 'react-native';
+export default TurboModuleRegistry.getEnforcing('NavigationMode');
+//# sourceMappingURL=NativeNavigationMode.js.map

package/lib/module/NativeNavigationMode.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["TurboModuleRegistry","getEnforcing"],"sourceRoot":"../../src","sources":["NativeNavigationMode.ts"],"mappings":";;AACA,SAASA,mBAAmB,QAAQ,cAAc;AAgBlD,eAAeA,mBAAmB,CAACC,YAAY,CAAO,gBAAgB,CAAC","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,78 @@
+"use strict";
+
+import { Platform } from 'react-native';
+import React from 'react';
+import NavigationModeModule from "./NativeNavigationMode.js";
+/**
+ * Get detailed navigation mode information
+ * Returns navigation type, interaction mode, and device info
+ */
+export function getNavigationMode() {
+  if (Platform.OS === 'ios') {
+    // iOS always uses gesture navigation (no 3-button navigation exists)
+    return Promise.resolve({
+      type: 'gesture',
+      isGestureNavigation: true,
+      hasNavigationBar: false,
+      sdkVersion: parseInt(Platform.Version, 10),
+      deviceModel: 'iOS'
+    });
+  }
+  return NavigationModeModule.getNavigationMode();
+}
+
+/**
+ * Quick check if the device is using gesture-based navigation
+ * @returns Promise<boolean> - true if gesture navigation is active
+ */
+export function isGestureNavigation() {
+  if (Platform.OS === 'ios') {
+    // iOS always uses gesture navigation
+    return Promise.resolve(true);
+  }
+  return NavigationModeModule.isGestureNavigation();
+}
+
+/**
+ * Hook for React components to get navigation mode
+ */
+export function useNavigationMode() {
+  const [navigationMode, setNavigationMode] = React.useState(null);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
+  React.useEffect(() => {
+    let mounted = true;
+    async function fetchNavigationMode() {
+      try {
+        const mode = await getNavigationMode();
+        if (mounted) {
+          setNavigationMode(mode);
+          setError(null);
+        }
+      } catch (err) {
+        if (mounted) {
+          setError(err instanceof Error ? err : new Error('Unknown error'));
+        }
+      } finally {
+        if (mounted) {
+          setLoading(false);
+        }
+      }
+    }
+    fetchNavigationMode();
+    return () => {
+      mounted = false;
+    };
+  }, []);
+  return {
+    navigationMode,
+    loading,
+    error
+  };
+}
+export default {
+  getNavigationMode,
+  isGestureNavigation,
+  useNavigationMode
+};
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","React","NavigationModeModule","getNavigationMode","OS","Promise","resolve","type","isGestureNavigation","hasNavigationBar","sdkVersion","parseInt","Version","deviceModel","useNavigationMode","navigationMode","setNavigationMode","useState","loading","setLoading","error","setError","useEffect","mounted","fetchNavigationMode","mode","err","Error"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,OAAOC,KAAK,MAAM,OAAO;AACzB,OAAOC,oBAAoB,MAEpB,2BAAwB;AAI/B;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAAA,EAAgC;EAC/D,IAAIH,QAAQ,CAACI,EAAE,KAAK,KAAK,EAAE;IACzB;IACA,OAAOC,OAAO,CAACC,OAAO,CAAC;MACrBC,IAAI,EAAE,SAAS;MACfC,mBAAmB,EAAE,IAAI;MACzBC,gBAAgB,EAAE,KAAK;MACvBC,UAAU,EAAEC,QAAQ,CAACX,QAAQ,CAACY,OAAO,EAAY,EAAE,CAAC;MACpDC,WAAW,EAAE;IACf,CAAC,CAAC;EACJ;EAEA,OAAOX,oBAAoB,CAACC,iBAAiB,CAAC,CAAC;AACjD;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASK,mBAAmBA,CAAA,EAAqB;EACtD,IAAIR,QAAQ,CAACI,EAAE,KAAK,KAAK,EAAE;IACzB;IACA,OAAOC,OAAO,CAACC,OAAO,CAAC,IAAI,CAAC;EAC9B;EAEA,OAAOJ,oBAAoB,CAACM,mBAAmB,CAAC,CAAC;AACnD;;AAEA;AACA;AACA;AACA,OAAO,SAASM,iBAAiBA,CAAA,EAAG;EAClC,MAAM,CAACC,cAAc,EAAEC,iBAAiB,CAAC,GACvCf,KAAK,CAACgB,QAAQ,CAA4B,IAAI,CAAC;EACjD,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGlB,KAAK,CAACgB,QAAQ,CAAC,IAAI,CAAC;EAClD,MAAM,CAACG,KAAK,EAAEC,QAAQ,CAAC,GAAGpB,KAAK,CAACgB,QAAQ,CAAe,IAAI,CAAC;EAE5DhB,KAAK,CAACqB,SAAS,CAAC,MAAM;IACpB,IAAIC,OAAO,GAAG,IAAI;IAElB,eAAeC,mBAAmBA,CAAA,EAAG;MACnC,IAAI;QACF,MAAMC,IAAI,GAAG,MAAMtB,iBAAiB,CAAC,CAAC;QACtC,IAAIoB,OAAO,EAAE;UACXP,iBAAiB,CAACS,IAAI,CAAC;UACvBJ,QAAQ,CAAC,IAAI,CAAC;QAChB;MACF,CAAC,CAAC,OAAOK,GAAG,EAAE;QACZ,IAAIH,OAAO,EAAE;UACXF,QAAQ,CAACK,GAAG,YAAYC,KAAK,GAAGD,GAAG,GAAG,IAAIC,KAAK,CAAC,eAAe,CAAC,CAAC;QACnE;MACF,CAAC,SAAS;QACR,IAAIJ,OAAO,EAAE;UACXJ,UAAU,CAAC,KAAK,CAAC;QACnB;MACF;IACF;IAEAK,mBAAmB,CAAC,CAAC;IAErB,OAAO,MAAM;MACXD,OAAO,GAAG,KAAK;IACjB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IAAER,cAAc;IAAEG,OAAO;IAAEE;EAAM,CAAC;AAC3C;AAEA,eAAe;EACbjB,iBAAiB;EACjBK,mBAAmB;EACnBM;AACF,CAAC","ignoreList":[]}

package/lib/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/plugin/src/index.d.ts

@@ -0,0 +1,4 @@
+import { type ConfigPlugin } from '@expo/config-plugins';
+declare const _default: ConfigPlugin<void>;
+export default _default;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/plugin/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../plugin/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAuB,MAAM,sBAAsB,CAAC;;AAQ9E,wBAA8E"}

package/lib/typescript/src/NativeNavigationMode.d.ts

@@ -0,0 +1,16 @@
+import type { TurboModule } from 'react-native';
+export interface NavigationModeInfo {
+    interactionMode?: number;
+    type: '3_button' | '2_button' | 'gesture' | 'unknown';
+    isGestureNavigation: boolean;
+    hasNavigationBar: boolean;
+    sdkVersion: number;
+    deviceModel: string;
+}
+export interface Spec extends TurboModule {
+    getNavigationMode(): Promise<NavigationModeInfo>;
+    isGestureNavigation(): Promise<boolean>;
+}
+declare const _default: Spec;
+export default _default;
+//# sourceMappingURL=NativeNavigationMode.d.ts.map

package/lib/typescript/src/NativeNavigationMode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeNavigationMode.d.ts","sourceRoot":"","sources":["../../../src/NativeNavigationMode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGhD,MAAM,WAAW,kBAAkB;IACjC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,EAAE,UAAU,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;IACtD,mBAAmB,EAAE,OAAO,CAAC;IAC7B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,iBAAiB,IAAI,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACjD,mBAAmB,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC;CACzC;;AAED,wBAAwE"}

package/lib/typescript/src/index.d.ts

@@ -0,0 +1,27 @@
+import { type NavigationModeInfo } from './NativeNavigationMode';
+export type { NavigationModeInfo };
+/**
+ * Get detailed navigation mode information
+ * Returns navigation type, interaction mode, and device info
+ */
+export declare function getNavigationMode(): Promise<NavigationModeInfo>;
+/**
+ * Quick check if the device is using gesture-based navigation
+ * @returns Promise<boolean> - true if gesture navigation is active
+ */
+export declare function isGestureNavigation(): Promise<boolean>;
+/**
+ * Hook for React components to get navigation mode
+ */
+export declare function useNavigationMode(): {
+    navigationMode: NavigationModeInfo | null;
+    loading: boolean;
+    error: Error | null;
+};
+declare const _default: {
+    readonly getNavigationMode: typeof getNavigationMode;
+    readonly isGestureNavigation: typeof isGestureNavigation;
+    readonly useNavigationMode: typeof useNavigationMode;
+};
+export default _default;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAEA,OAA6B,EAC3B,KAAK,kBAAkB,EACxB,MAAM,wBAAwB,CAAC;AAEhC,YAAY,EAAE,kBAAkB,EAAE,CAAC;AAEnC;;;GAGG;AACH,wBAAgB,iBAAiB,IAAI,OAAO,CAAC,kBAAkB,CAAC,CAa/D;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,OAAO,CAAC,OAAO,CAAC,CAOtD;AAED;;GAEG;AACH,wBAAgB,iBAAiB;;;;EAmChC;;;;;;AAED,wBAIW"}

package/package.json

@@ -0,0 +1,174 @@
+{
+  "name": "react-native-navigation-mode",
+  "version": "0.2.0",
+  "description": "Detect Android navigation mode (3-button, 2-button, or gesture)",
+  "main": "./lib/module/index.js",
+  "types": "./lib/typescript/src/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.tsx",
+      "types": "./lib/typescript/src/index.d.ts",
+      "default": "./lib/module/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "expo": {
+    "platforms": [
+      "android",
+      "ios"
+    ],
+    "plugin": "./plugin/build/index.js"
+  },
+  "files": [
+    "src",
+    "lib",
+    "android",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "react-native.config.js",
+    "!ios/build",
+    "!android/build",
+    "!android/gradle",
+    "!android/gradlew",
+    "!android/gradlew.bat",
+    "!android/local.properties",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "scripts": {
+    "example": "yarn workspace react-native-navigation-mode-example",
+    "test": "jest",
+    "typecheck": "tsc",
+    "lint": "eslint \"**/*.{js,ts,tsx}\"",
+    "clean": "del-cli android/build example/android/build example/android/app/build example/ios/build lib",
+    "prepare": "bob build",
+    "release": "release-it --only-version"
+  },
+  "keywords": [
+    "react-native",
+    "android",
+    "navigation",
+    "gesture",
+    "turbo-module"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/JairajJangle/react-native-navigation-mode.git"
+  },
+  "author": "Jairaj Jangle <reachout.jairaj.jangle@gmail.com> (https://github.com/JairajJangle)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/JairajJangle/react-native-navigation-mode/issues"
+  },
+  "homepage": "https://github.com/JairajJangle/react-native-navigation-mode#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^19.6.0",
+    "@eslint/compat": "^1.2.7",
+    "@eslint/eslintrc": "^3.3.0",
+    "@eslint/js": "^9.22.0",
+    "@evilmartians/lefthook": "^1.5.0",
+    "@expo/config-plugins": "^10.0.0",
+    "@react-native-community/cli": "15.0.0-alpha.2",
+    "@react-native/babel-preset": "0.79.2",
+    "@react-native/eslint-config": "^0.78.0",
+    "@release-it/conventional-changelog": "^9.0.2",
+    "@types/jest": "^29.5.5",
+    "@types/react": "^19.0.0",
+    "commitlint": "^19.6.1",
+    "del-cli": "^5.1.0",
+    "eslint": "^9.22.0",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-plugin-prettier": "^5.2.3",
+    "jest": "^29.7.0",
+    "prettier": "^3.0.3",
+    "react": "19.0.0",
+    "react-native": "0.79.2",
+    "react-native-builder-bob": "^0.40.11",
+    "release-it": "^17.10.0",
+    "turbo": "^1.10.7",
+    "typescript": "^5.8.3"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "workspaces": [
+    "example"
+  ],
+  "packageManager": "yarn@3.6.1",
+  "jest": {
+    "preset": "react-native",
+    "modulePathIgnorePatterns": [
+      "<rootDir>/example/node_modules",
+      "<rootDir>/lib/"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release ${version}",
+      "tagName": "v${version}"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": {
+          "name": "angular"
+        }
+      }
+    }
+  },
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  },
+  "codegenConfig": {
+    "name": "NavigationModeSpec",
+    "type": "modules",
+    "jsSrcsDir": "src",
+    "android": {
+      "javaPackageName": "com.navigationmode"
+    }
+  },
+  "create-react-native-library": {
+    "languages": "kotlin-objc",
+    "type": "turbo-module",
+    "version": "0.50.3"
+  }
+}

package/src/NativeNavigationMode.ts

@@ -0,0 +1,18 @@
+import type { TurboModule } from 'react-native';
+import { TurboModuleRegistry } from 'react-native';
+
+export interface NavigationModeInfo {
+  interactionMode?: number;
+  type: '3_button' | '2_button' | 'gesture' | 'unknown';
+  isGestureNavigation: boolean;
+  hasNavigationBar: boolean;
+  sdkVersion: number;
+  deviceModel: string;
+}
+
+export interface Spec extends TurboModule {
+  getNavigationMode(): Promise<NavigationModeInfo>;
+  isGestureNavigation(): Promise<boolean>;
+}
+
+export default TurboModuleRegistry.getEnforcing<Spec>('NavigationMode');

package/src/index.tsx

@@ -0,0 +1,85 @@
+import { Platform } from 'react-native';
+import React from 'react';
+import NavigationModeModule, {
+  type NavigationModeInfo,
+} from './NativeNavigationMode';
+
+export type { NavigationModeInfo };
+
+/**
+ * Get detailed navigation mode information
+ * Returns navigation type, interaction mode, and device info
+ */
+export function getNavigationMode(): Promise<NavigationModeInfo> {
+  if (Platform.OS === 'ios') {
+    // iOS always uses gesture navigation (no 3-button navigation exists)
+    return Promise.resolve({
+      type: 'gesture',
+      isGestureNavigation: true,
+      hasNavigationBar: false,
+      sdkVersion: parseInt(Platform.Version as string, 10),
+      deviceModel: 'iOS',
+    });
+  }
+
+  return NavigationModeModule.getNavigationMode();
+}
+
+/**
+ * Quick check if the device is using gesture-based navigation
+ * @returns Promise<boolean> - true if gesture navigation is active
+ */
+export function isGestureNavigation(): Promise<boolean> {
+  if (Platform.OS === 'ios') {
+    // iOS always uses gesture navigation
+    return Promise.resolve(true);
+  }
+
+  return NavigationModeModule.isGestureNavigation();
+}
+
+/**
+ * Hook for React components to get navigation mode
+ */
+export function useNavigationMode() {
+  const [navigationMode, setNavigationMode] =
+    React.useState<NavigationModeInfo | null>(null);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState<Error | null>(null);
+
+  React.useEffect(() => {
+    let mounted = true;
+
+    async function fetchNavigationMode() {
+      try {
+        const mode = await getNavigationMode();
+        if (mounted) {
+          setNavigationMode(mode);
+          setError(null);
+        }
+      } catch (err) {
+        if (mounted) {
+          setError(err instanceof Error ? err : new Error('Unknown error'));
+        }
+      } finally {
+        if (mounted) {
+          setLoading(false);
+        }
+      }
+    }
+
+    fetchNavigationMode();
+
+    return () => {
+      mounted = false;
+    };
+  }, []);
+
+  return { navigationMode, loading, error };
+}
+
+export default {
+  getNavigationMode,
+  isGestureNavigation,
+  useNavigationMode,
+} as const;