Timeline

Visually display timeline.

Basic usage

Timeline can be split into multiple activities. Timestamps are important features that distinguish them from other components. Note the difference with Steps.

Custom node

Size, color, and icons can be customized in node.

Custom timestamp

Timestamp can be placed on top of content when content is too high.

Vertically centered

Timeline-Item is centered vertically.

Timeline API

Timeline Slots

Name	Description	Subtags
default	customize default content for timeline	Timeline-Item

Timeline-Item API

Timeline-Item Attributes

Name	Description	Type	Default
timestamp	timestamp content	`string`	''
hide-timestamp	whether to show timestamp	`boolean`	false
center	whether vertically centered	`boolean`	false
placement	position of timestamp	`enum`	bottom
type	node type	`enum`	''
color	background color of node	`enum`	''
size	node size	`enum`	normal
icon	icon component	`string` / `Component`	—
hollow	icon is hollow	`boolean`	false