VenueMap

organisms

Google Maps venue display. API key via env var, not hardcoded. Replaces legacy google-map.xsl.

ARIA Role: region

Demo

Demo for VenueMap (organisms)

Google Maps venue display. API key via env var, not hardcoded. Replaces legacy google-map.xsl.

Props

PropTypeRequiredDefaultDescription
venue{lat: number; lng: number; name: string; address: string}YesVenue location data
zoomnumberNo15Map zoom level
apiKeystringNoGoogle Maps API key (from env var)

TypeScript Interface

interface VenueMapProps {
  venue: { lat: number; lng: number; name: string; address: string };
  zoom?: number;
  apiKey?: string;
}

Assertions (NASA Rule 5)

  • [aria]Map must have role='application' with descriptive aria-label(WAI-ARIA APG)
  • [aria]Interactive zones use role='button' with aria-label(WCAG 1.1.1)
  • [keyboard]Tab navigates zones, Enter activates, arrow keys within(WCAG 2.1.1)

Usage

Import

import { Venuemap } from '@epasslive/design-system'

Basic

<Venuemap />

With Variants

<Venuemap variant="primary" size="md" />