Type keyword

Timeline

A timeline component within a design system is a visual representation of chronological events or activities, usually displayed along a horizontal axis. It's utilized to present a sequence of events or milestones in a structured and chronological order.

Variant

Here are some types of time picker, including:

Left

Right

Alternative

Anatomy

  1. Line Pointer
  2. Messages

Usage

import React from 'react';
import { Timeline } from 'antd';

const App: React.FC = () => (
  <Timeline
    items={[
      {
        children: 'Create a services site 2015-09-01',
      },
      {
        children: 'Solve initial network problems 2015-09-01',
      },
      {
        children: 'Technical testing 2015-09-01',
      },
      {
        children: 'Network problems being solved 2015-09-01',
      },
    ]}
  />
);

export default App;