docs: add gmpDraggable example

Author: pyjun01

docs/src/components/api/AdvancedMarker/index.tsx

@@ -1,14 +1,14 @@
-import { AdvancedMarker, GoogleMap, PinElement } from "react-google-map-wrapper";
+import { AdvancedMarker, GoogleMap, PinElement } from 'react-google-map-wrapper';
 
-import { Container } from "../../Container";
+import { Container } from '../../Container';
 
 export function AdvancedMarkerEx() {
   return (
     <Container>
       <GoogleMap
         className='h-[400px]'
         containerProps={{
-          id:'my-map'
+          id: 'my-map',
         }}
         zoom={13}
         center={{ lat: 37.39, lng: -122.05 }}
@@ -34,12 +34,15 @@ export function AdvancedMarkerEx() {
         <AdvancedMarker lat={37.38} lng={-122.03}>
           <img src='https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png' />
         </AdvancedMarker>
-        <AdvancedMarker lat={37.39} lng={-122.05}>
-          <div className='px-5 py-3 rounded bg-[#0af] text-lg text-white'>
-            whole new marker content.
-          </div>
+        <AdvancedMarker lat={37.4} lng={-122.01}>
+          <PinElement>
+            <p className='bg-black text-white whitespace-nowrap'>Home</p>
+          </PinElement>
+        </AdvancedMarker>
+        <AdvancedMarker lat={37.39} lng={-122.05} gmpDraggable>
+          <div className='px-5 py-3 rounded bg-[#0af] text-lg text-white'>whole new marker content.</div>
         </AdvancedMarker>
       </GoogleMap>
     </Container>
-  )
+  );
 }

docs/src/content/docs/docs/api/advanced-marker.mdx

@@ -39,7 +39,12 @@ function MyMap() {
       <AdvancedMarker lat={37.38} lng={-122.03}>
         <img src='https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png' />
       </AdvancedMarker>
-      <AdvancedMarker lat={37.39} lng={-122.05}>
+      <AdvancedMarker lat={37.4} lng={-122.01}>
+        <PinElement>
+          <p className='bg-black text-white whitespace-nowrap'>Home</p>
+        </PinElement>
+      </AdvancedMarker>
+      <AdvancedMarker lat={37.39} lng={-122.05} gmpDraggable>
         <div className='px-5 py-3 rounded bg-[#0af] text-lg text-white'>
           whole new marker content.
         </div>