Multi-City Route

Minimal multi-stop route with airport codes joined by thin connectors and a caption beneath each hop.

ISTDepart
DOH2h
BKK4 days
SIN3 days
TYOReturn
11-day multi-city itinerary

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

Import & use
import { Travel23 } from "@/components/beste/piece/travel23";

<Travel23
  hops={[
    {
      "code": "IST",
      "caption": "Depart"
    },
    {
      "code": "DOH",
      "caption": "2h"
    },
    {
      "code": "BKK",
      "caption": "4 days"
    },
    {
      "code": "SIN",
      "caption": "3 days"
    },
    {
      "code": "TYO",
      "caption": "Return"
    }
  ]}
  summary="11-day multi-city itinerary"
/>