Vertical origin to destination route with emerald and rose dots joined by a connector, plus distance and duration.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Location5 } from "@/components/beste/piece/location5";
<Location5
origin="Office · 5th Ave"
destination="Beste HQ · Brooklyn"
distance="4.2 mi"
duration="12 min"
mode="by car"
/>Brightwell · Camden
18 Parkway, London NW1
Open · closes 6pm
A compact location card with a pin chip, a site name and address, and an open-status line.
Latitude and longitude in tabular monospace, separated by a dashed line from the resolved place name.
Colored pin paired with city, country, and a monospace coordinate.
Plain text address block with an uppercase label, two street lines, city and postal, and a muted country.
Tiny gridded map panel with a centered tone pin, captioned by a place name and address line.
Place name with star rating, review count, and category, finished by an open or closed status pill and hours.