Improve analytics UX with geo maps and readability updates

src/types/react-simple-maps.d.ts

@@ -0,0 +1,45 @@
+declare module 'react-simple-maps' {
+  import { ComponentType, ReactNode, CSSProperties, MouseEvent } from 'react'
+
+  interface ComposableMapProps {
+    projection?: string
+    projectionConfig?: Record<string, unknown>
+    style?: CSSProperties
+    children?: ReactNode
+  }
+
+  interface GeographiesProps {
+    geography: string | object
+    children: (props: { geographies: GeoFeature[] }) => ReactNode
+  }
+
+  interface GeoFeature {
+    rsmKey?: string
+    id?: string | number
+    properties: Record<string, string>
+    geometry?: object
+  }
+
+  interface GeographyProps {
+    key?: string
+    geography: GeoFeature
+    fill?: string
+    stroke?: string
+    strokeWidth?: number
+    style?: {
+      default?: CSSProperties
+      hover?: CSSProperties
+      pressed?: CSSProperties
+    }
+    onMouseEnter?: (e: MouseEvent<SVGPathElement>) => void
+    onMouseMove?: (e: MouseEvent<SVGPathElement>) => void
+    onMouseLeave?: (e: MouseEvent<SVGPathElement>) => void
+    onClick?: (e: MouseEvent<SVGPathElement>) => void
+  }
+
+  export const ComposableMap: ComponentType<ComposableMapProps>
+  export const Geographies: ComponentType<GeographiesProps>
+  export const Geography: ComponentType<GeographyProps>
+  export const ZoomableGroup: ComponentType<{ children?: ReactNode; [key: string]: unknown }>
+  export const Marker: ComponentType<{ coordinates: [number, number]; children?: ReactNode; [key: string]: unknown }>
+}