Velocity X Components

Cards & Expandables

Map Location Card

A store/branch listing tile — address, today's hours, distance and a Get Directions action that deep-links to Google Maps by default. Drop in any static map image (Mapbox/Google Static Maps API or a screenshot) via a plain prop; no map SDK, no API key required to render the card itself.

Subscription Included with the Velocity Components subscription.
bash
$ velocityx add map-location-card

Built for astro.

Full docs for Map Location Card →

Needs a licence key — subscribe here, then velocityx loginonce.

astro v1.0.1
Map Location Card
Map showing the location of Fortitude Valley Showroom 2.4 km away

Fortitude Valley Showroom

123 Brunswick St, Fortitude Valley QLD 4006

Open until 5:00 PM

Props

NameTypeRequiredDefaultDescription
namestringYes
addressstringYes
hoursTodaystringNo
distancestringNo
mapImageSrcstringNo
mapImageAltstringNo`Map showing the location of ${name}`
directionsHrefstringNo
directionsLabelstringNo'Get directions'
phonestringNo
classstringNo''

File this creates

The CLI writes this path into your project, relative to its root — nothing else moves.

text
components/velocity/map-location-card/MapLocationCard.astro

Using the Map Location Card component

Install it with velocityx add map-location-card. The CLI writes the source straight into your project — no runtime dependency, no registry lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.

More from Cards & Expandables.