Merge pull request JustFly1984#879 from joshcoales/infowindow-children-of-marker

Anchoring InfoWindow children of Markers

Author: JustFly1984

packages/react-google-maps-api/src/components/drawing/Marker.tsx

@@ -3,8 +3,10 @@ import * as React from 'react'
 import { unregisterEvents, applyUpdatersToPropsAndRegisterEvents } from '../../utils/helper'
 
 import MapContext from '../../map-context'
+import { HasMarkerAnchor } from '../../types'
 
 import { Clusterer } from '@react-google-maps/marker-clusterer'
+import { ReactNode } from 'react'
 
 const eventMap = {
   onAnimationChanged: 'animation_changed',
@@ -248,7 +250,18 @@ export class Marker extends React.PureComponent<MarkerProps, MarkerState> {
   }
 
   render(): React.ReactNode {
-    return this.props.children || null
+    let children: ReactNode | null = null
+    if(this.props.children) {
+      children = React.Children.map(this.props.children, child => {
+        if(!React.isValidElement<HasMarkerAnchor>(child)) {
+          return child;
+        }
+
+        let elementChild: React.ReactElement<HasMarkerAnchor> = child;
+        return React.cloneElement(elementChild, {anchor: this.state.marker});
+      })
+    }
+    return children || null
   }
 }
 

packages/react-google-maps-api/src/types.tsx

@@ -0,0 +1,3 @@
+export interface HasMarkerAnchor {
+  anchor?: google.maps.Marker | null
+}