#Timeline

A vertical run of events in the order they happened — a timeline records what occurred, so reach for Progress when the question is how far along something is rather than what has already taken place. TimelineConnector and TimelineContent are each optional, and the last item looks after itself: its line and its bottom padding go without any special casing.

Source · Storybook

#Usage

import { Timeline, TimelineConnector, TimelineIndicator, TimelineItem, TimelineSeparator } from '@wallarm-org/design-system/Timeline';

#Examples

#With content

Content beside the rail. The line stretches to whatever height the row turns out to need, which is why the third step's long description does not break the rhythm.

#Without connector

Content with no rail at all — effectively a List of titles and descriptions, for when the order carries the sequence and a drawn line would only add furniture.

#Props

#TimelineConnector

#TimelineContent

#TimelineDescription

#TimelineIndicator

#TimelineItem

#TimelineSeparator

#TimelineTitle

#Explorer