# EuiTimelineComponent

**Type:** component



A timeline component that displays a vertical list of events or activities in chronological order.
Can be configured to align items on the left side instead of centered.

### Basic Usage
```html
<eui-timeline>
  <eui-timeline-item
    label="Project Started"
    date="Jan 15, 2024"
    time="09:00"
    euiSuccess>
  </eui-timeline-item>
  <eui-timeline-item
    label="Milestone Reached"
    date="Feb 20, 2024"
    euiInfo>
  </eui-timeline-item>
</eui-timeline>

<!-- Left-aligned timeline -->
<eui-timeline [isLeftAligned]="true">
  <eui-timeline-item label="Event 1" />
  <eui-timeline-item label="Event 2" />
</eui-timeline>
```

### Accessibility
- Use semantic HTML structure with proper heading levels
- Provide clear, descriptive labels for each timeline item
- Consider using aria-label on timeline for screen readers

### Notes
- Default layout centers items with connecting line
- Left-aligned mode places all items on the left side
- Timeline items inherit alignment from parent timeline


**Selector:** `eui-timeline`

## Inputs
- **e2eAttr**: `string` - 
- **isLeftAligned**: `boolean` - When true, aligns timeline items to the left side instead of center