From d8771790317666896c15808886618780e3c24f85 Mon Sep 17 00:00:00 2001
From: superstar1205 <devking1205@gmail.com>
Date: Sat, 10 Mar 2018 08:11:21 -0500
Subject: [PATCH] =?UTF-8?q?Stop=20marker=20event=20propagation=20in=20orde?=
 =?UTF-8?q?r=20to=20prevent=20onPress=20for=20MapView=E2=80=A6=20(#2068)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Stop marker event propagation in order to prevent onPress for MapViews from being called when a marker is clicked. This makes the behavior of Apple Maps identical to that of the behavior of Google Maps on Android. This fixes react-community/react-native-maps#1132.

* Added a new Marker prop called stopPropagation. This allows the user to control whether or not onPress events from Markers propagate up and trigger MapView onPress events. This is iOS only. The default behavior is disabled (false) to prevent a breaking change from the current behavior.
---
 docs/marker.md              |  1 +
 index.d.ts                  |  1 +
 lib/components/MapMarker.js | 18 +++++++++++++++++-
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/docs/marker.md b/docs/marker.md
index deb53f4..200ea2f 100644
--- a/docs/marker.md
+++ b/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
 
diff --git a/index.d.ts b/index.d.ts
index f68bd7e..605683c 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -146,6 +146,7 @@ declare module "react-native-maps" {
         rotation?: number;
         tracksViewChanges?: boolean
         tracksInfoWindowChanges?: boolean
+        stopPropagation?: boolean
     }
 
     export interface MapPolylineProps {
diff --git a/lib/components/MapMarker.js b/lib/components/MapMarker.js
index 5834d87..73b82b1 100644
--- a/lib/components/MapMarker.js
+++ b/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);
+          }
+        }}
       />
     );
   }