Marketplace Map

The orchestrating map surface: supercluster bubbles with type-mix rings, toned facility pins with hover and selected states, an HTML spiderfy fan for co-located listings, the travel-time and route tools, search-this-area re-querying, and the select-for-exchange transfer flow — all driven by the headless use-marketplace hook.

$bunx shadcn@latest add @nx-ui/marketplace-map
Registry item
Installs withbuttonisochrone-toollisting-cardmap-toolbarmap-viewmarketplace-typesroute-toolspinnertransfer-previewuse-listings-clustersuse-marketplaceutils

South-east England subset

The same block that powers /view/marketplace, scoped to a regional query area. The popup's “Select for exchange” on two different listings launches the full transfer preview.

Loading listings…

Loading the south-east England subset…

API reference

Exported parts and their props, extracted from the component source.

PropTypeDefaultDescription
marketplace*Marketplace
detailEndpointstring"/api/geo/listings"Base listings endpoint, used for the popup's lazy detail fetch.
routeEndpointstring"/api/geo/route"nx-geo-shaped routing endpoint (route tool + transfer preview).
isochroneEndpointstring"/api/geo/isochrone"nx-geo-shaped isochrone endpoint (travel-time tool).
onSaveProposal(proposal: TransferProposal) => voidFired when the transfer dock saves a proposal.
volumeForListing(listing: MarketplaceListing) => numberdefaultVolumeNominal exchange volume for a listing, m³ (demo default: deterministic).
overlayReact.ReactNodeExtra overlays / map children.
childrenReact.ReactNode

…extends Pick<MapViewProps, "initialViewState" | "className">