Stop marker event propagation in order to prevent onPress for MapView…

docs/marker.md

@@ -19,6 +19,7 @@
 | `draggable` | `<null>` |  | This is a non-value based prop. Adding this allows the marker to be draggable (re-positioned).
 | `tracksViewChanges` | `Boolean` | true | Sets whether this marker should track view changes. It's recommended to turn it off whenever it's possible to improve custom marker performance. **Note**: iOS Google Maps only.
 | `tracksInfoWindowChanges` | `Boolean` | false | Sets whether this marker should track view changes in info window. Enabling it will let marker change content of info window after first render pass, but will lead to decreased performance, so it's recommended to disable it whenever you don't need it. **Note**: iOS Google Maps only.
+| `stopPropagation` | `Boolean` | false | Sets whether this marker should propagate `onPress` events. Enabling it will stop the parent `MapView`'s `onPress` from being called. **Note**: iOS only. Android does not propagate `onPress` events. See [#1132](https://github.com/react-community/react-native-maps/issues/1132) for more information.
 
 ## Events
 

index.d.ts

@@ -146,6 +146,7 @@ declare module "react-native-maps" {
         rotation?: number;
         tracksViewChanges?: boolean
         tracksInfoWindowChanges?: boolean
+        stopPropagation?: boolean
     }
 
     export interface MapPolylineProps {

lib/components/MapMarker.js

@@ -185,6 +185,14 @@ const propTypes = {
 
   tracksInfoWindowChanges: PropTypes.bool,
 
+  /**
+   * Stops Marker onPress events from propagating to and triggering MapView onPress events.
+   *
+   * @platform ios
+   */
+
+  stopPropagation: PropTypes.bool,
+
   /**
    * Callback that is called when the user presses on the marker
    */
@@ -227,7 +235,7 @@ const propTypes = {
 };
 
 const defaultProps = {
-  onPress() {},
+  stopPropagation: false,
 };
 
 class MapMarker extends React.Component {
@@ -295,6 +303,14 @@ class MapMarker extends React.Component {
         {...this.props}
         image={image}
         style={[styles.marker, this.props.style]}
+        onPress={event => {
+          if (this.props.stopPropagation) {
+            event.stopPropagation();
+          }
+          if (this.props.onPress) {
+            this.props.onPress(event);
+          }
+        }}
       />
     );
   }