1 files changed, 86 insertions, 0 deletions
diff --git a/node_modules/pigeon-maps/src/overlays/Marker.tsx b/node_modules/pigeon-maps/src/overlays/Marker.tsx
new file mode 100644
index 0000000..f1970c2
--- /dev/null
+++ b/node_modules/pigeon-maps/src/overlays/Marker.tsx
@@ -0,0 +1,86 @@
+import React, { useState } from 'react'
+import { PigeonProps } from '../types'
+
+interface MarkerProps extends PigeonProps {
+  color?: string
+  payload?: any
+
+  width?: number
+  height?: number
+
+  // optional modifiers
+  hover?: boolean
+  style?: React.CSSProperties
+  className?: string
+
+  children?: JSX.Element
+
+  // callbacks
+  onClick?: ({ event: HTMLMouseEvent, anchor: Point, payload: any }) => void
+  onContextMenu?: ({ event: HTMLMouseEvent, anchor: Point, payload: any }) => void
+  onMouseOver?: ({ event: HTMLMouseEvent, anchor: Point, payload: any }) => void
+  onMouseOut?: ({ event: HTMLMouseEvent, anchor: Point, payload: any }) => void
+}
+
+export function Marker(props: MarkerProps): JSX.Element {
+  const width =
+    typeof props.width !== 'undefined'
+      ? props.width
+      : typeof props.height !== 'undefined'
+      ? (props.height * 29) / 34
+      : 29
+  const height =
+    typeof props.height !== 'undefined'
+      ? props.height
+      : typeof props.width !== 'undefined'
+      ? (props.width * 34) / 29
+      : 34
+  const [internalHover, setInternalHover] = useState(props.hover || false)
+  const hover = typeof props.hover === 'undefined' ? internalHover : props.hover
+  const color = props.color || '#93C0D0'
+
+  // what do you expect to get back with the event
+  const eventParameters = (event: React.MouseEvent) => ({
+    event,
+    anchor: props.anchor,
+    payload: props.payload,
+  })
+
+  return (
+    <div
+      style={{
+        position: 'absolute',
+        transform: `translate(${props.left - width / 2}px, ${props.top - (height - 1)}px)`,
+        filter: hover ? 'drop-shadow(0 0 4px rgba(0, 0, 0, .3))' : '',
+        pointerEvents: 'none',
+        cursor: 'pointer',
+        ...(props.style || {}),
+      }}
+      className={props.className ? `${props.className} pigeon-click-block` : 'pigeon-click-block'}
+      onClick={props.onClick ? (event) => props.onClick(eventParameters(event)) : null}
+      onContextMenu={props.onContextMenu ? (event) => props.onContextMenu(eventParameters(event)) : null}
+      onMouseOver={(event) => {
+        props.onMouseOver && props.onMouseOver(eventParameters(event))
+        setInternalHover(true)
+      }}
+      onMouseOut={(event) => {
+        props.onMouseOut && props.onMouseOut(eventParameters(event))
+        setInternalHover(false)
+      }}
+    >
+      {props.children || (
+        <svg width={width} height={height} viewBox="0 0 61 71" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <g style={{ pointerEvents: 'auto' }}>
+            <path
+              d="M52 31.5C52 36.8395 49.18 42.314 45.0107 47.6094C40.8672 52.872 35.619 57.678 31.1763 61.6922C30.7916 62.0398 30.2084 62.0398 29.8237 61.6922C25.381 57.678 20.1328 52.872 15.9893 47.6094C11.82 42.314 9 36.8395 9 31.5C9 18.5709 18.6801 9 30.5 9C42.3199 9 52 18.5709 52 31.5Z"
+              fill={color}
+              stroke="white"
+              strokeWidth="4"
+            />
+            <circle cx="30.5" cy="30.5" r="8.5" fill="white" opacity={hover ? 0.98 : 0.6} />
+          </g>
+        </svg>
+      )}
+    </div>
+  )
+}