@sargsyansevak/expo-mapbox-navigation 1.0.0

package/src/ExpoMapboxNavigation.types.ts

@@ -0,0 +1,70 @@
+//@ts-ignore
+import { ViewStyle, StyleProp } from "react-native/types";
+import { Ref } from "react";
+
+type ProgressEvent = {
+  distanceRemaining: number;
+  distanceTraveled: number;
+  durationRemaining: number;
+  fractionTraveled: number;
+};
+
+type Route = {
+  distance: number;
+  expectedTravelTime: number;
+  legs: Array<{
+    source?: { latitude: number; longitude: number };
+    destination?: { latitude: number; longitude: number };
+    steps: Array<{
+      shape?: {
+        coordinates: Array<{ latitude: number; longitude: number }>;
+      };
+    }>;
+  }>;
+};
+
+type Routes = {
+  mainRoute: Route;
+  alternativeRoutes: Route[];
+};
+
+export type ExpoMapboxNavigationViewRef = {
+  recenterMap: () => void;
+};
+
+export type ExpoMapboxNavigationViewProps = {
+  ref?: Ref<ExpoMapboxNavigationViewRef>;
+  coordinates: Array<{ latitude: number; longitude: number }>;
+  waypointIndices?: number[];
+  useRouteMatchingApi?: boolean;
+  locale?: string;
+  routeProfile?: string;
+  routeExcludeList?: string[];
+  mapStyle?: string;
+  mute?: boolean;
+  vehicleMaxHeight?: number;
+  vehicleMaxWidth?: number;
+  initialLocation?: { latitude: number; longitude: number; zoom?: number };
+  /**
+   * The URL of the custom raster source to use for the map.
+   * Should be a template string with {x}, {y}, {z} placeholders.
+   * Example: "https://tile.openstreetmap.org/{z}/{x}/{y}.png"
+   */
+  customRasterSourceUrl?: string;
+  placeCustomRasterLayerAbove?: string;
+  disableAlternativeRoutes?: boolean;
+  followingZoom?: number;
+  onRouteProgressChanged?: (event: { nativeEvent: ProgressEvent }) => void;
+  onCancelNavigation?: () => void;
+  onWaypointArrival?: (event: {
+    nativeEvent: ProgressEvent | undefined;
+  }) => void;
+  onFinalDestinationArrival?: () => void;
+  onRouteChanged?: () => void;
+  onUserOffRoute?: () => void;
+  onRoutesLoaded?: (event: { nativeEvent: { routes: Routes } }) => void;
+  onRouteFailedToLoad?: (event: {
+    nativeEvent: { errorMessage: string };
+  }) => void;
+  style?: StyleProp<ViewStyle>;
+};

package/src/ExpoMapboxNavigationModule.ts

@@ -0,0 +1,2 @@
+import { requireNativeModule } from "expo-modules-core";
+export default requireNativeModule("ExpoMapboxNavigation");

package/src/ExpoMapboxNavigationView.tsx

@@ -0,0 +1,17 @@
+import { requireNativeViewManager } from "expo-modules-core";
+import * as React from "react";
+
+import {
+  ExpoMapboxNavigationViewProps,
+  ExpoMapboxNavigationViewRef,
+} from "./ExpoMapboxNavigation.types";
+
+const NativeView: React.ComponentType<ExpoMapboxNavigationViewProps> =
+  requireNativeViewManager("ExpoMapboxNavigation");
+
+export default React.forwardRef<
+  ExpoMapboxNavigationViewRef,
+  ExpoMapboxNavigationViewProps
+>((props, ref) => {
+  return <NativeView {...props} ref={ref} />;
+});

package/src/ExpoMapboxNavigationView.web.tsx

@@ -0,0 +1,13 @@
+import * as React from "react";
+
+import { ExpoMapboxNavigationViewProps } from "./ExpoMapboxNavigation.types";
+
+export default function ExpoMapboxNavigationView(
+  props: ExpoMapboxNavigationViewProps
+) {
+  return (
+    <div>
+      <span>Mapbox navigation not supported on web</span>
+    </div>
+  );
+}

package/src/index.ts

@@ -0,0 +1,11 @@
+import MapboxNavigationView from "./ExpoMapboxNavigationView";
+import {
+  ExpoMapboxNavigationViewProps,
+  ExpoMapboxNavigationViewRef,
+} from "./ExpoMapboxNavigation.types";
+
+export {
+  MapboxNavigationView,
+  ExpoMapboxNavigationViewProps as MapboxNavigationViewProps,
+  ExpoMapboxNavigationViewRef as MapboxNavigationViewRef,
+};