Itinerary Day

Day-of-trip card with a destination header and a vertical timeline of timed stops linked by a rail.

Day 3Lisbon

Sat, Jun 14

09:00Time Out MarketCais do Sodré

12:30Ride Tram 28Praça Luís Camões

18:00Miradouro sunsetGraça

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Travel3 } from "@/components/beste/piece/travel3";

<Travel3
  day={3}
  destination="Lisbon"
  date="Sat, Jun 14"
  dayLabel="Day"
  stops={[
    {
      "time": "09:00",
      "title": "Time Out Market",
      "place": "Cais do Sodré"
    },
    {
      "time": "12:30",
      "title": "Ride Tram 28",
      "place": "Praça Luís Camões"
    },
    {
      "time": "18:00",
      "title": "Miradouro sunset",
      "place": "Graça"
    }
  ]}
/>