@baeckerherz/expo-mapbox-navigation 0.1.0

package/plugin/build/withMapboxNavSPM.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withMapboxNavSPM = void 0;
+const config_plugins_1 = require("@expo/config-plugins");
+/**
+ * Injects Mapbox Navigation SDK v3 as a Swift Package Manager dependency
+ * into the Xcode project's .pbxproj. This avoids vendoring .xcframework files.
+ *
+ * Adds XCRemoteSwiftPackageReference, XCSwiftPackageProductDependency,
+ * and links MapboxNavigationUIKit + MapboxNavigationCore to the main target.
+ */
+const withMapboxNavSPM = (config, { navigationSdkVersion }) => {
+    return (0, config_plugins_1.withXcodeProject)(config, (config) => {
+        const xcodeProject = config.modResults;
+        const repoName = "mapbox-navigation-ios";
+        const repoUrl = "https://github.com/mapbox/mapbox-navigation-ios.git";
+        const products = ["MapboxNavigationUIKit", "MapboxNavigationCore"];
+        if (!xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"]) {
+            xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"] = {};
+        }
+        if (!xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"]) {
+            xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"] =
+                {};
+        }
+        // Idempotent: skip if already added
+        const existingRefs = Object.values(xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"]);
+        const alreadyAdded = existingRefs.some((ref) => typeof ref === "object" && ref.repositoryURL === repoUrl);
+        if (alreadyAdded)
+            return config;
+        // XCRemoteSwiftPackageReference
+        const packageRefUuid = xcodeProject.generateUuid();
+        xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"][packageRefUuid] = {
+            isa: "XCRemoteSwiftPackageReference",
+            repositoryURL: repoUrl,
+            requirement: { kind: "exactVersion", version: navigationSdkVersion },
+        };
+        xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"][`${packageRefUuid}_comment`] = `XCRemoteSwiftPackageReference "${repoName}"`;
+        // Add to PBXProject packageReferences
+        const projectKey = Object.keys(xcodeProject.hash.project.objects["PBXProject"]).find((key) => !key.includes("_comment"));
+        if (projectKey) {
+            const project = xcodeProject.hash.project.objects["PBXProject"][projectKey];
+            if (!project.packageReferences)
+                project.packageReferences = [];
+            project.packageReferences.push(packageRefUuid);
+        }
+        // For each product: add dependency, build file, and link
+        for (const productName of products) {
+            const productDepUuid = xcodeProject.generateUuid();
+            xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"][productDepUuid] = {
+                isa: "XCSwiftPackageProductDependency",
+                package: packageRefUuid,
+                productName,
+            };
+            xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"][`${productDepUuid}_comment`] = productName;
+            const buildFileUuid = xcodeProject.generateUuid();
+            xcodeProject.hash.project.objects["PBXBuildFile"][buildFileUuid] = {
+                isa: "PBXBuildFile",
+                productRef: productDepUuid,
+                productRef_comment: productName,
+            };
+            xcodeProject.hash.project.objects["PBXBuildFile"][`${buildFileUuid}_comment`] = `${productName} in Frameworks`;
+            const frameworkPhaseKey = Object.keys(xcodeProject.hash.project.objects["PBXFrameworksBuildPhase"]).find((key) => !key.includes("_comment"));
+            if (frameworkPhaseKey) {
+                const phase = xcodeProject.hash.project.objects["PBXFrameworksBuildPhase"][frameworkPhaseKey];
+                if (!phase.files)
+                    phase.files = [];
+                phase.files.push(buildFileUuid);
+            }
+            const nativeTargetKey = Object.keys(xcodeProject.hash.project.objects["PBXNativeTarget"]).find((key) => !key.includes("_comment"));
+            if (nativeTargetKey) {
+                const target = xcodeProject.hash.project.objects["PBXNativeTarget"][nativeTargetKey];
+                if (!target.packageProductDependencies)
+                    target.packageProductDependencies = [];
+                target.packageProductDependencies.push(productDepUuid);
+            }
+        }
+        return config;
+    });
+};
+exports.withMapboxNavSPM = withMapboxNavSPM;

package/plugin/src/index.ts

@@ -0,0 +1,63 @@
+import { ConfigPlugin, createRunOncePlugin } from "@expo/config-plugins";
+import { withMapboxNavSPM } from "./withMapboxNavSPM";
+import { withMapboxNavPodfile } from "./withMapboxNavPodfile";
+import { withMapboxNavGradle } from "./withMapboxNavGradle";
+
+interface PluginConfig {
+  /** Mapbox public access token (pk.xxx). Required for the native SDK. */
+  mapboxAccessToken: string;
+
+  /** Mapbox secret/download token (sk.xxx). Required for SPM and Maven auth. */
+  mapboxSecretToken?: string;
+
+  /** Mapbox Navigation SDK version. Default: "3.5.0" */
+  navigationSdkVersion?: string;
+}
+
+const withMapboxNavigation: ConfigPlugin<PluginConfig> = (
+  config,
+  {
+    mapboxAccessToken,
+    mapboxSecretToken,
+    navigationSdkVersion = "3.5.0",
+  }
+) => {
+  if (!mapboxAccessToken) {
+    throw new Error(
+      "[@baeckerherz/expo-mapbox-navigation] mapboxAccessToken is required."
+    );
+  }
+
+  // Inject MBXAccessToken and required background modes into Info.plist
+  if (!config.ios) config.ios = {};
+  if (!config.ios.infoPlist) config.ios.infoPlist = {};
+  config.ios.infoPlist.MBXAccessToken = mapboxAccessToken;
+  config.ios.infoPlist.UIBackgroundModes = [
+    ...(config.ios.infoPlist.UIBackgroundModes || []),
+    "audio",
+    "location",
+  ];
+  config.ios.infoPlist.NSLocationWhenInUseUsageDescription =
+    config.ios.infoPlist.NSLocationWhenInUseUsageDescription ||
+    "This app needs your location for turn-by-turn navigation.";
+  config.ios.infoPlist.NSLocationAlwaysAndWhenInUseUsageDescription =
+    config.ios.infoPlist.NSLocationAlwaysAndWhenInUseUsageDescription ||
+    "This app needs your location for turn-by-turn navigation, including in the background.";
+
+  // iOS: Inject SPM package references
+  config = withMapboxNavSPM(config, { navigationSdkVersion });
+
+  // iOS: Patch Podfile for SPM framework visibility
+  config = withMapboxNavPodfile(config);
+
+  // Android: Add Mapbox Maven repository
+  config = withMapboxNavGradle(config);
+
+  return config;
+};
+
+export default createRunOncePlugin(
+  withMapboxNavigation,
+  "@baeckerherz/expo-mapbox-navigation",
+  "0.1.0"
+);

package/plugin/src/withMapboxNavGradle.ts

@@ -0,0 +1,34 @@
+import { withProjectBuildGradle, ConfigPlugin } from "@expo/config-plugins";
+
+/**
+ * Adds the authenticated Mapbox Maven repository to the Android
+ * project's root build.gradle for Navigation SDK v3 downloads.
+ */
+export const withMapboxNavGradle: ConfigPlugin = (config) => {
+  return withProjectBuildGradle(config, (config) => {
+    let contents = config.modResults.contents;
+
+    if (!contents.includes("api.mapbox.com/downloads/v2/releases/maven")) {
+      const mapboxMaven = `
+        // @baeckerherz/expo-mapbox-navigation: Mapbox Navigation SDK Maven repository
+        maven {
+            url = uri("https://api.mapbox.com/downloads/v2/releases/maven")
+            authentication {
+                create<BasicAuthentication>("basic")
+            }
+            credentials {
+                username = "mapbox"
+                password = providers.gradleProperty("MAPBOX_DOWNLOADS_TOKEN").getOrElse("")
+            }
+        }`;
+
+      contents = contents.replace(
+        /allprojects\s*\{\s*repositories\s*\{/,
+        `allprojects {\n    repositories {${mapboxMaven}`
+      );
+    }
+
+    config.modResults.contents = contents;
+    return config;
+  });
+};

package/plugin/src/withMapboxNavPodfile.ts

@@ -0,0 +1,56 @@
+import { withDangerousMod, ConfigPlugin } from "@expo/config-plugins";
+import * as fs from "fs";
+import * as path from "path";
+
+/**
+ * Patches the iOS Podfile to make SPM framework products visible
+ * to the ExpoMapboxNavigation pod target, and sets BUILD_LIBRARY_FOR_DISTRIBUTION
+ * for Mapbox-related pods.
+ */
+export const withMapboxNavPodfile: ConfigPlugin = (config) => {
+  return withDangerousMod(config, [
+    "ios",
+    async (config) => {
+      const podfilePath = path.join(
+        config.modRequest.platformProjectRoot,
+        "Podfile"
+      );
+      let contents = fs.readFileSync(podfilePath, "utf8");
+
+      const hook = `
+    # @baeckerherz/expo-mapbox-navigation: Make SPM frameworks visible to the pod target
+    installer.pods_project.targets.each do |target|
+      if target.name == 'ExpoMapboxNavigation'
+        target.build_configurations.each do |config|
+          shared_products = '$(BUILT_PRODUCTS_DIR)/..'
+          config.build_settings['FRAMEWORK_SEARCH_PATHS'] ||= ['$(inherited)']
+          config.build_settings['FRAMEWORK_SEARCH_PATHS'] << shared_products
+          config.build_settings['SWIFT_INCLUDE_PATHS'] ||= ['$(inherited)']
+          config.build_settings['SWIFT_INCLUDE_PATHS'] << shared_products
+        end
+      end
+      if target.name.start_with?('Mapbox') || target.name == 'Turf'
+        target.build_configurations.each do |config|
+          config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
+        end
+      end
+    end`;
+
+      if (
+        !contents.includes(
+          "@baeckerherz/expo-mapbox-navigation: Make SPM frameworks"
+        )
+      ) {
+        if (contents.includes("post_install do |installer|")) {
+          contents = contents.replace(
+            "post_install do |installer|",
+            `post_install do |installer|${hook}`
+          );
+        }
+      }
+
+      fs.writeFileSync(podfilePath, contents);
+      return config;
+    },
+  ]);
+};

package/plugin/src/withMapboxNavSPM.ts

@@ -0,0 +1,124 @@
+import { withXcodeProject, ConfigPlugin } from "@expo/config-plugins";
+
+interface SPMConfig {
+  navigationSdkVersion: string;
+}
+
+/**
+ * Injects Mapbox Navigation SDK v3 as a Swift Package Manager dependency
+ * into the Xcode project's .pbxproj. This avoids vendoring .xcframework files.
+ *
+ * Adds XCRemoteSwiftPackageReference, XCSwiftPackageProductDependency,
+ * and links MapboxNavigationUIKit + MapboxNavigationCore to the main target.
+ */
+export const withMapboxNavSPM: ConfigPlugin<SPMConfig> = (
+  config,
+  { navigationSdkVersion }
+) => {
+  return withXcodeProject(config, (config) => {
+    const xcodeProject = config.modResults;
+
+    const repoName = "mapbox-navigation-ios";
+    const repoUrl = "https://github.com/mapbox/mapbox-navigation-ios.git";
+    const products = ["MapboxNavigationUIKit", "MapboxNavigationCore"];
+
+    if (!xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"]) {
+      xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"] = {};
+    }
+    if (
+      !xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"]
+    ) {
+      xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"] =
+        {};
+    }
+
+    // Idempotent: skip if already added
+    const existingRefs = Object.values(
+      xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"]
+    );
+    const alreadyAdded = existingRefs.some(
+      (ref: any) =>
+        typeof ref === "object" && ref.repositoryURL === repoUrl
+    );
+    if (alreadyAdded) return config;
+
+    // XCRemoteSwiftPackageReference
+    const packageRefUuid = xcodeProject.generateUuid();
+    xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"][
+      packageRefUuid
+    ] = {
+      isa: "XCRemoteSwiftPackageReference",
+      repositoryURL: repoUrl,
+      requirement: { kind: "exactVersion", version: navigationSdkVersion },
+    };
+    xcodeProject.hash.project.objects["XCRemoteSwiftPackageReference"][
+      `${packageRefUuid}_comment`
+    ] = `XCRemoteSwiftPackageReference "${repoName}"`;
+
+    // Add to PBXProject packageReferences
+    const projectKey = Object.keys(
+      xcodeProject.hash.project.objects["PBXProject"]
+    ).find((key) => !key.includes("_comment"));
+
+    if (projectKey) {
+      const project =
+        xcodeProject.hash.project.objects["PBXProject"][projectKey];
+      if (!project.packageReferences) project.packageReferences = [];
+      project.packageReferences.push(packageRefUuid);
+    }
+
+    // For each product: add dependency, build file, and link
+    for (const productName of products) {
+      const productDepUuid = xcodeProject.generateUuid();
+      xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"][
+        productDepUuid
+      ] = {
+        isa: "XCSwiftPackageProductDependency",
+        package: packageRefUuid,
+        productName,
+      };
+      xcodeProject.hash.project.objects["XCSwiftPackageProductDependency"][
+        `${productDepUuid}_comment`
+      ] = productName;
+
+      const buildFileUuid = xcodeProject.generateUuid();
+      xcodeProject.hash.project.objects["PBXBuildFile"][buildFileUuid] = {
+        isa: "PBXBuildFile",
+        productRef: productDepUuid,
+        productRef_comment: productName,
+      };
+      xcodeProject.hash.project.objects["PBXBuildFile"][
+        `${buildFileUuid}_comment`
+      ] = `${productName} in Frameworks`;
+
+      const frameworkPhaseKey = Object.keys(
+        xcodeProject.hash.project.objects["PBXFrameworksBuildPhase"]
+      ).find((key) => !key.includes("_comment"));
+
+      if (frameworkPhaseKey) {
+        const phase =
+          xcodeProject.hash.project.objects["PBXFrameworksBuildPhase"][
+            frameworkPhaseKey
+          ];
+        if (!phase.files) phase.files = [];
+        phase.files.push(buildFileUuid);
+      }
+
+      const nativeTargetKey = Object.keys(
+        xcodeProject.hash.project.objects["PBXNativeTarget"]
+      ).find((key) => !key.includes("_comment"));
+
+      if (nativeTargetKey) {
+        const target =
+          xcodeProject.hash.project.objects["PBXNativeTarget"][
+            nativeTargetKey
+          ];
+        if (!target.packageProductDependencies)
+          target.packageProductDependencies = [];
+        target.packageProductDependencies.push(productDepUuid);
+      }
+    }
+
+    return config;
+  });
+};

package/src/ExpoMapboxNavigation.tsx

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { requireNativeViewManager } from "expo-modules-core";
+import type { MapboxNavigationProps } from "./types";
+
+const NativeView: React.ComponentType<MapboxNavigationProps> =
+  requireNativeViewManager("ExpoMapboxNavigation");
+
+/**
+ * Full-screen Mapbox turn-by-turn navigation view.
+ *
+ * Renders the native Mapbox Navigation SDK UI (NavigationViewController on iOS,
+ * NavigationView on Android) with voice guidance, maneuver banners, and rerouting.
+ */
+export default function MapboxNavigation(props: MapboxNavigationProps) {
+  return <NativeView {...props} />;
+}

package/src/index.ts

@@ -0,0 +1,8 @@
+export { default as MapboxNavigation } from "./ExpoMapboxNavigation";
+export type {
+  MapboxNavigationProps,
+  Coordinate,
+  RouteProgressEvent,
+  WaypointArrivalEvent,
+  NavigationErrorEvent,
+} from "./types";

package/src/types.ts

@@ -0,0 +1,122 @@
+import type { ViewProps } from "react-native";
+
+export interface Coordinate {
+  latitude: number;
+  longitude: number;
+}
+
+export interface RouteProgressEvent {
+  distanceRemaining: number;
+  durationRemaining: number;
+  distanceTraveled: number;
+  fractionTraveled: number;
+}
+
+export interface WaypointArrivalEvent {
+  waypointIndex: number;
+}
+
+export interface NavigationErrorEvent {
+  message: string;
+}
+
+export interface MapboxNavigationProps extends ViewProps {
+  // -- Route --
+
+  /**
+   * Array of coordinates defining the route.
+   * Minimum 2 points (origin + destination). Intermediate points become waypoints.
+   */
+  coordinates: Coordinate[];
+
+  /**
+   * Indices into `coordinates` that should be treated as full waypoints
+   * (with arrival notification). All others are silent via-points.
+   * Must include the first and last index.
+   */
+  waypointIndices?: number[];
+
+  /**
+   * Mapbox routing profile.
+   * iOS: "mapbox/driving-traffic" (default), "mapbox/driving", "mapbox/walking", "mapbox/cycling"
+   * Android: omit the "mapbox/" prefix.
+   */
+  routeProfile?: string;
+
+  // -- Localization --
+
+  /**
+   * Language for voice guidance, maneuver instructions, and UI labels.
+   * BCP 47 language tag (e.g. "de", "en-US"). Defaults to device locale.
+   */
+  locale?: string;
+
+  /** Mute voice guidance. Default: false. */
+  mute?: boolean;
+
+  // -- Appearance --
+
+  /**
+   * Custom Mapbox map style URL. Overrides the default navigation style.
+   * Example: "mapbox://styles/mapbox/navigation-night-v1"
+   */
+  mapStyle?: string;
+
+  /**
+   * Controls day/night map appearance.
+   * - "day": Light map (default)
+   * - "night": Dark 3D map (like Google/Apple Maps night mode)
+   * - "auto": Automatic switching based on time of day
+   */
+  themeMode?: "day" | "night" | "auto";
+
+  /**
+   * Primary accent color (hex). Applied to route line, floating buttons,
+   * and interactive elements. Example: "#007AFF"
+   */
+  accentColor?: string;
+
+  /**
+   * Route line color (hex). Overrides accentColor for the route line only.
+   * Example: "#4264fb"
+   */
+  routeColor?: string;
+
+  /**
+   * Instruction banner background color (hex).
+   * Example: "#FFFFFF" for white, "#1A1A2E" for dark.
+   */
+  bannerBackgroundColor?: string;
+
+  /**
+   * Instruction banner text color (hex). Example: "#000000"
+   */
+  bannerTextColor?: string;
+
+  // -- Events --
+
+  /** Fires continuously as the user progresses along the route. */
+  onRouteProgressChanged?: (event: {
+    nativeEvent: RouteProgressEvent;
+  }) => void;
+
+  /** User tapped the cancel / close button. The library does NOT auto-dismiss. */
+  onCancelNavigation?: () => void;
+
+  /** Arrived at an intermediate waypoint. */
+  onWaypointArrival?: (event: {
+    nativeEvent: WaypointArrivalEvent;
+  }) => void;
+
+  /** Arrived at the final destination. */
+  onFinalDestinationArrival?: () => void;
+
+  /** Route was recalculated (e.g. reroute after going off-route). */
+  onRouteChanged?: () => void;
+
+  /** User deviated from the planned route. */
+  onUserOffRoute?: () => void;
+
+  /** A navigation error occurred. */
+  onError?: (event: { nativeEvent: NavigationErrorEvent }) => void;
+}