Multi-leg journey card with stacked segment rows and an amber layover strip between them.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Travel6 } from "@/components/beste/piece/travel6";
<Travel6
segments={[
{
"depart": "09:40",
"departCode": "IST",
"arrive": "12:20",
"arriveCode": "CDG",
"duration": "3h 40m"
},
{
"depart": "14:50",
"departCode": "CDG",
"arrive": "17:05",
"arriveCode": "LHR",
"duration": "1h 15m"
}
]}
layover="2h 30m layover in Paris"
/>Passenger baggage card with item rows, per-row included or paid pills, and a total allowance footer.
Poster-style destination tile with a warm gradient, corner save heart, category tag, and city label.
Traveler eSIM card showing carrier, plan, data-used fraction pill, and a progress bar toward the total allowance.
Ticket-shaped pass with notched edges, a passenger strip, and a detached seat column on the right.
Staff remembered our names by day two. The rooftop at sunset alone is worth the trip — would book again in a heartbeat.
Stayed 4 nightsTraveler review card with avatar initials, star rating, a clipped body paragraph, and a trip-type footer.
Flight result with airline, price, two airport codes, and a dotted route arc connecting times.