To implement the Itinerary component into your project you’ll need to add the import:

import Itinerary, {
  ItinerarySegment,
  ItineraryStatus,
  ItineraryBadgeList,
  ItinerarySegmentStop,
  ItinerarySegmentDetail,
} from "@kiwicom/orbit-components/lib/Itinerary";

After adding import to your project you can use it simply like:

<Itinerary>
  <ItinerarySegment spaceAfter="large">
    <ItinerarySegmentStop
      city="Moscow"
      station="Sheremetyevo International Airport (SVO)"
      date="Fri, 19.10"
      time="14:05"
    />
    <ItinerarySegmentDetail duration="2h 30m" summary={<BadgeGroup />}>
      <CollapsedContent />
    </ItinerarySegmentDetail>
    <ItinerarySegmentStop
      city="Prague"
      station="Václav Havel Airport Prague (PRG)"
      date="Fri, 19.10"
      time="16:35"
    />
  </ItinerarySegment>
</Itinerary>

The ItinerarySegment component serves as a wrapper of atomic unit ItinerarySegmentStop and `ItinerarySegmentDetail, have a status prop for showing important information about the connection between two segments of a journey.

ItinerarySegmentStop is an atomic unit of the Itinerary component, shows two locations, date and time, have the warning property which changes the icon to <AlertCircle color="warning" /> to attract user attention to some important information about a journey.

ItineraryStatus is a wrapper for ItinerarySegment or a group of segments. Shows the status of the Itinerary or ItinerarySegment

ItinerarySegmentDetail serves as a connection between two ItinerarySegmentStop components (segments)