Shadcn.io is not affiliated with official shadcn/ui
Timeline Map Route
React timeline component displaying journey waypoints with travel modes, distances, and durations for Next.js apps using shadcn/ui and Tailwind CSS.
A location-based journey timeline component built with React, Next.js, TypeScript, shadcn/ui Badge component, and Tailwind CSS. Each waypoint displays stop name, arrival time, duration, and the travel segment to the next location with mode icons (car, walk, transit), distance, and estimated time. Perfect for trip itineraries, delivery tracking, and mapping applications.
Related Components
Order Tracking Timeline
Delivery tracking steps
Vertical Dots Timeline
Classic vertical timeline
Timeline Dashboard
Timeline analytics overview
Company History Timeline
Milestone-based company timeline
Gantt-Inspired Timeline
Horizontal bar chart timeline
Calendar View Timeline
Calendar-integrated timeline
FAQ
Was this page helpful?
Sign in to leave feedback.