@maplibre/maplibre-react-native 11.0.0-alpha.7 → 11.0.0-alpha.9

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maplibre/maplibre-react-native",
   "description": "React Native library for creating maps with MapLibre Native for Android & iOS",
-  "version": "11.0.0-alpha.7",
+  "version": "11.0.0-alpha.9",
   "publishConfig": {
     "access": "public",
     "provenance": true
@@ -40,18 +40,20 @@
     "docs",
     "examples/*"
   ],
-  "packageManager": "yarn@4.5.3",
+  "packageManager": "yarn@4.10.3",
   "main": "./lib/commonjs/index.js",
-  "source": "./src/index.ts",
   "module": "./lib/module/index.js",
-  "types": "./lib/typescript/commonjs/src/index.d.ts",
+  "source": "./src/index.ts",
+  "types": "./lib/typescript/module/src/index.d.ts",
   "exports": {
     ".": {
       "import": {
+        "source": "./src/index.ts",
         "types": "./lib/typescript/module/src/index.d.ts",
         "default": "./lib/module/index.js"
       },
       "require": {
+        "source": "./src/index.ts",
         "types": "./lib/typescript/commonjs/src/index.d.ts",
         "default": "./lib/commonjs/index.js"
       }
@@ -118,18 +120,27 @@
   },
   "codegenConfig": {
     "name": "MapLibreReactNativeSpec",
-    "type": "modules",
+    "type": "all",
     "jsSrcsDir": "src",
     "android": {
       "javaPackageName": "org.maplibre.reactnative"
+    },
+    "ios": {
+      "componentProvider": {
+        "MLRNMapView": "MLRNMapViewComponentView",
+        "MLRNCamera": "MLRNCameraComponentView"
+      },
+      "modulesProvider": {
+        "MLRNMapViewModule": "MLRNMapViewModule"
+      }
     }
   },
   "peerDependencies": {
-    "@expo/config-plugins": ">=7",
+    "@expo/config-plugins": ">=54.0.0",
     "@types/geojson": "^7946.0.0",
-    "@types/react": ">=16.6.1",
-    "react": ">=16.6.1",
-    "react-native": ">=0.59.9"
+    "@types/react": ">=19.1.0",
+    "react": ">=19.1.0",
+    "react-native": ">=0.80.0"
   },
   "peerDependenciesMeta": {
     "@expo/config-plugins": {
@@ -146,38 +157,37 @@
     "@turf/distance": "^7.1.0",
     "@turf/helpers": "^7.1.0",
     "@turf/length": "^7.1.0",
-    "@turf/nearest-point-on-line": "^7.1.0",
-    "debounce": "^2.2.0"
+    "@turf/nearest-point-on-line": "^7.1.0"
   },
   "devDependencies": {
-    "@expo/config-plugins": "~10.0.0",
+    "@expo/config-plugins": "~54.0.2",
     "@maplibre/maplibre-gl-style-spec": "24.3.0",
-    "@react-native-community/cli": "^18.0.0",
-    "@react-native/babel-preset": "^0.79.2",
+    "@react-native-community/cli": "^20.0.2",
+    "@react-native/babel-preset": "0.81.5",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
     "@sinonjs/fake-timers": "^15.0.0",
-    "@testing-library/react-native": "^13.0.1",
+    "@testing-library/react-native": "^13.3.3",
     "@types/ejs": "^3.1.5",
-    "@types/geojson": "^7946.0.14",
-    "@types/node": "^22.15.21",
-    "@types/react": "^19.0.14",
+    "@types/geojson": "^7946.0.16",
+    "@types/node": "^22.18.6",
+    "@types/react": "^19.1.13",
     "documentation": "^14.0.0",
     "ejs": "^3.1.10",
     "eslint": "^8.57.1",
     "eslint-config-universe": "15.0.3",
-    "expo-module-scripts": "^4.1.7",
-    "jest": "^30.0.2",
+    "expo-module-scripts": "^5.0.7",
+    "jest": "^30.1.3",
     "prettier": "3.6.2",
-    "react": "19.0.0",
-    "react-docgen": "^8.0.0",
-    "react-native": "0.79.2",
-    "react-native-builder-bob": "^0.40.11",
-    "react-test-renderer": "19.0.0",
-    "semantic-release": "^24.2.0",
+    "react": "19.1.0",
+    "react-docgen": "^8.0.1",
+    "react-native": "0.81.5",
+    "react-native-builder-bob": "^0.40.13",
+    "react-test-renderer": "19.1.0",
+    "semantic-release": "^24.2.9",
     "snapshot-diff": "^0.10.0",
     "ts-node": "^10.9.2",
-    "tsx": "^4.19.2",
-    "typescript": "^5.7.2"
+    "tsx": "^4.20.5",
+    "typescript": "^5.9.2"
   }
 }

package/src/MLRNModule.ts

@@ -1,15 +1,6 @@
 import { NativeModules } from "react-native";
 
-import { CameraMode } from "./types/CameraMode";
-
 interface IMLRNModule {
-  CameraModes: {
-    Flight: CameraMode.Flight;
-    Ease: CameraMode.Ease;
-    Linear: CameraMode.Linear;
-    None: CameraMode.None;
-  };
-
   OfflinePackDownloadState: {
     Inactive: string | number;
     Active: string | number;
@@ -34,7 +25,6 @@ interface IMLRNModule {
 const MLRNModule: IMLRNModule = Object.create(NativeModules.MLRNModule);
 
 export const {
-  CameraModes,
   OfflinePackDownloadState,
   StyleSource,
   StyleURL,

package/src/components/Annotation.tsx

@@ -1,16 +1,19 @@
 import {
   forwardRef,
   type ReactNode,
-  useCallback,
   useEffect,
   useImperativeHandle,
   useState,
 } from "react";
-import { Animated as RNAnimated, Easing } from "react-native";
+import {
+  Animated as RNAnimated,
+  Easing,
+  type NativeSyntheticEvent,
+} from "react-native";
 
 import { SymbolLayer } from "./SymbolLayer";
 import { type SymbolLayerStyle } from "../types/MapLibreRNStyles";
-import { type OnPressEvent } from "../types/OnPressEvent";
+import { type PressEventWithFeatures } from "../types/PressEvent";
 import { AnimatedShapeSource } from "../utils/animated/Animated";
 import { AnimatedPoint } from "../utils/animated/AnimatedPoint";
 
@@ -20,7 +23,7 @@ interface AnnotationProps {
   animationDuration?: number;
   animationEasingFunction?: (x: number) => number;
   coordinates?: number[];
-  onPress?: (event: OnPressEvent) => void;
+  onPress?: (event: NativeSyntheticEvent<PressEventWithFeatures>) => void;
   children?: ReactNode;
   style?: object;
   icon?: string | number | object;
@@ -45,7 +48,6 @@ function isShapeAnimated(shape: Shape): shape is AnimatedPoint {
 }
 
 interface AnnotationRef {
-  onPress(event: OnPressEvent): void;
   symbolStyle: SymbolLayerStyle | undefined;
 }
 
@@ -69,7 +71,6 @@ export const Annotation = forwardRef<AnnotationRef, AnnotationProps>(
     useImperativeHandle(
       ref,
       (): AnnotationRef => ({
-        onPress,
         symbolStyle,
       }),
     );
@@ -105,22 +106,6 @@ export const Annotation = forwardRef<AnnotationRef, AnnotationProps>(
       }
     }, [coordinateDeps]);
 
-    const onPressProp = props.onPress;
-
-    const _onPress = useCallback(
-      (event: OnPressEvent) => {
-        if (onPressProp) {
-          onPressProp(event);
-        }
-      },
-      [onPressProp],
-    );
-
-    // This function is needed to correctly generate Annotation.md doc
-    function onPress(event: OnPressEvent): void {
-      _onPress(event);
-    }
-
     if (!props.coordinates) {
       return null;
     }
@@ -150,7 +135,7 @@ export const Annotation = forwardRef<AnnotationRef, AnnotationProps>(
     return (
       <AnimatedShapeSource
         id={props.id}
-        onPress={_onPress}
+        onPress={props.onPress}
         shape={shape as RNAnimated.WithAnimatedObject<GeoJSON.Point>}
       >
         {children}

package/src/components/Images.tsx

@@ -1,15 +1,13 @@
 import { type ReactNode, useMemo } from "react";
 import {
   Image,
+  type ImageRequireSource,
   type ImageResolvedAssetSource,
   type ImageSourcePropType,
+  type ImageURISource,
   type NativeSyntheticEvent,
   requireNativeComponent,
 } from "react-native";
-import type {
-  ImageRequireSource,
-  ImageURISource,
-} from "react-native/Libraries/Image/ImageSource";
 
 import { type BaseProps } from "../types/BaseProps";
 

package/src/components/ShapeSource.tsx

@@ -19,13 +19,8 @@ import {
   type ExpressionField,
   type FilterExpression,
 } from "../types/MapLibreRNStyles";
-import { type OnPressEvent } from "../types/OnPressEvent";
-import {
-  cloneReactChildrenWithProps,
-  isAndroid,
-  isFunction,
-  toJSONString,
-} from "../utils";
+import { type PressEventWithFeatures } from "../types/PressEvent";
+import { cloneReactChildrenWithProps, isAndroid, toJSONString } from "../utils";
 import { getFilter } from "../utils/filterUtils";
 
 const MLRNModule = NativeModules.MLRNModule;
@@ -42,10 +37,12 @@ export interface ShapeSourceProps extends BaseProps {
    * A string that uniquely identifies the source.
    */
   id: string;
+
   /**
    * An HTTP(S) URL, absolute file URL, or local file URL relative to the current application’s resource bundle.
    */
   url?: string;
+
   /**
    * The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature colllection.
    */
@@ -54,27 +51,32 @@ export interface ShapeSourceProps extends BaseProps {
     | GeoJSON.Feature
     | GeoJSON.FeatureCollection
     | GeoJSON.Geometry;
+
   /**
    * Enables clustering on the source for point shapes.
    */
   cluster?: boolean;
+
   /**
    * Specifies the radius of each cluster if clustering is enabled.
    * A value of 512 produces a radius equal to the width of a tile.
    * The default value is 50.
    */
   clusterRadius?: number;
+
   /**
    * Specifies minimum number of points to form a cluster if clustering is enabled.
    * The default value is 2.
    */
   clusterMinPoints?: number;
+
   /**
    * Specifies the maximum zoom level at which to cluster points if clustering is enabled.
    * Defaults to one zoom level less than the value of maxZoomLevel so that, at the maximum zoom level,
    * the shapes are not clustered.
    */
   clusterMaxZoomLevel?: number;
+
   /**
    * Specifies custom properties on the generated clusters if clustering
    * is enabled, aggregating values from clustered points.
@@ -88,12 +90,14 @@ export interface ShapeSourceProps extends BaseProps {
    *
    */
   clusterProperties?: { [propertyName: string]: ExpressionField };
+
   /**
    * Specifies the maximum zoom level at which to create vector tiles.
    * A greater value produces greater detail at high zoom levels.
    * The default value is 18.
    */
   maxZoomLevel?: number;
+
   /**
    * Specifies the size of the tile buffer on each side.
    * A value of 0 produces no buffer. A value of 512 produces a buffer as wide as the tile itself.
@@ -101,22 +105,26 @@ export interface ShapeSourceProps extends BaseProps {
    * The default value is 128.
    */
   buffer?: number;
+
   /**
    * Specifies the Douglas-Peucker simplification tolerance.
    * A greater value produces simpler geometries and improves performance.
    * The default value is 0.375.
    */
   tolerance?: number;
+
   /**
    * Whether to calculate line distance metrics.
    * This is required for line layers that specify lineGradient values.
    * The default value is false.
    */
   lineMetrics?: boolean;
+
   /**
    * Source press listener, gets called when a user presses one of the children layers only if that layer has a higher z-index than another source layers.
    */
-  onPress?: (event: OnPressEvent) => void;
+  onPress?: (event: NativeSyntheticEvent<PressEventWithFeatures>) => void;
+
   /**
    * Overrides the default touch hitbox (44x44 pixels) for the source layers
    */
@@ -150,7 +158,6 @@ export interface ShapeSourceRef {
   ): Promise<GeoJSON.FeatureCollection>;
 
   setNativeProps: (props: NativeProps) => void;
-  onPress: (event: NativeSyntheticEvent<{ payload: OnPressEvent }>) => void;
 
   // this was required by existing test __tests__/utils/animated/AnimatedCoordinatesArray.test.js
   _nativeRef: MLRNShapeSourceRefType | null;
@@ -221,8 +228,6 @@ export const ShapeSource = memo(
 
         setNativeProps,
 
-        onPress,
-
         _nativeRef: _nativeRef.current,
       }));
 
@@ -321,31 +326,13 @@ export const ShapeSource = memo(
         return toJSONString(props.shape);
       }
 
-      function onPress(
-        event: NativeSyntheticEvent<{ payload: OnPressEvent }>,
-      ): void {
-        const {
-          nativeEvent: {
-            payload: { features, coordinates, point },
-          },
-        } = event;
-
-        if (props.onPress) {
-          props.onPress({
-            features,
-            coordinates,
-            point,
-          });
-        }
-      }
-
       const shapeProps = {
         id: shapeId,
         url: props.url,
         shape: _getShape(),
         hitbox: props.hitbox,
-        hasPressListener: isFunction(props.onPress),
-        onMapboxShapeSourcePress: onPress.bind(this),
+        hasPressListener: !!props.onPress,
+        onMapboxShapeSourcePress: props.onPress,
         cluster: props.cluster ? 1 : 0,
         clusterRadius: props.clusterRadius,
         clusterMinPoints: props.clusterMinPoints,

package/src/components/VectorSource.tsx

@@ -10,8 +10,8 @@ import { useAbstractSource } from "../hooks/useAbstractSource";
 import { useNativeBridge } from "../hooks/useNativeBridge";
 import { type BaseProps } from "../types/BaseProps";
 import { type FilterExpression } from "../types/MapLibreRNStyles";
-import { type OnPressEvent } from "../types/OnPressEvent";
-import { cloneReactChildrenWithProps, isFunction, isAndroid } from "../utils";
+import { type PressEventWithFeatures } from "../types/PressEvent";
+import { cloneReactChildrenWithProps, isAndroid } from "../utils";
 import { getFilter } from "../utils/filterUtils";
 
 const MLRNModule = NativeModules.MLRNModule;
@@ -57,7 +57,7 @@ interface VectorSourceProps extends BaseProps {
    * Source press listener, gets called when a user presses one of the children layers only
    * if that layer has a higher z-index than another source layers
    */
-  onPress?: (event: OnPressEvent) => void;
+  onPress?: (event: NativeSyntheticEvent<PressEventWithFeatures>) => void;
   /**
    * Overrides the default touch hitbox(44x44 pixels) for the source layers
    */
@@ -108,7 +108,6 @@ export const VectorSource = memo(
          * @return {GeoJSON.FeatureCollection}
          */
         features,
-        onPress,
       }));
 
       const {
@@ -146,28 +145,6 @@ export const VectorSource = memo(
         return res.data as GeoJSON.FeatureCollection;
       };
 
-      const onPress = (
-        event: NativeSyntheticEvent<{ payload: OnPressEvent }>,
-      ): void => {
-        const { onPress } = props;
-
-        if (!onPress) {
-          return;
-        }
-
-        const {
-          nativeEvent: {
-            payload: { features, coordinates, point },
-          },
-        } = event;
-
-        onPress({
-          features,
-          coordinates,
-          point,
-        });
-      };
-
       const allProps = {
         id,
         url: props.url,
@@ -177,8 +154,8 @@ export const VectorSource = memo(
         tms: props.tms,
         attribution: props.attribution,
         hitbox: props.hitbox,
-        hasPressListener: isFunction(props.onPress),
-        onMapboxVectorSourcePress: onPress,
+        hasPressListener: !!props.onPress,
+        onMapboxVectorSourcePress: props.onPress,
         onPress: undefined,
         onAndroidCallback: isAndroid() ? _onAndroidCallback : undefined,
       };