Skip to content

Properties

Timeline properties

PropertyTypeDescription
dataArray<TimelineItemProps>(optional) List of timeline items to render. Each object in data can include all properties from Timeline.Item properties.
childrenReact.ReactNode(optional) Content of the component. Can be used instead of property data, by adding Timeline Item as children <Timeline.Item {...props} />.
skeletonboolean(optional) If set to true, an overlaying skeleton with animation will be shown.
Spacestring
object
(optional) Spacing properties like top or bottom are supported.

Timeline.Item properties

PropertyTypeDescription
titleReact.ReactNode(required) Title of the Timeline item.
statecompleted
current
upcoming
(required) The component state. Options: completed | current | upcoming.
subtitleReact.ReactNode
React.ReactNode[]
(optional) Subtitle of the Timeline item, displayed below the title. Also supports passing an array of subtitles. The subtitle is usually a date of the timeline item.
infoMessageReact.ReactNode(optional) Info message, displayed in a FormStatus of state info, below the subtitle if it exists.
iconReact.ReactNode(optional) Override icon displaying on the left side (Not recommended). Default: check for state completed, pin for state current, and calendar for state upcoming.
iconAltstring(optional) Alt label describing the icon provided.
skeletonboolean(optional) If set to true, an overlaying skeleton with animation will be shown.

Timeline.Item translations

More info about translations can be found in the general localization and Eufemia Forms localization docs.

Keynb-NOen-GBsv-SE (beta)
TimelineItem.alt_label_completedUtførtCompletedUtförd
TimelineItem.alt_label_currentNåværendeCurrentNuvarande
TimelineItem.alt_label_upcomingKommendeUpcomingKommande