# EuiListComponent

**Type:** component



Component that provides a navigable list implementation with keyboard interaction support.
Works with Angular CDK's FocusKeyManager to enable keyboard navigation between list items.

The component automatically manages focus between nested lists and supports rich content
navigation. It can contain multiple EuiListItemComponents as children.

### Basic Usage
```html
<ul euiList>
  <li euiListItem>First item</li>
  <li euiListItem>Second item</li>
  <li euiListItem>Third item</li>
</ul>
```

### With Nested Lists
```html
<ul euiList>
  <li euiListItem>
    Parent item
    <ul euiList>
      <li euiListItem>Child item</li>
    </ul>
  </li>
</ul>
```

### Accessibility
- Uses semantic `list` role
- Keyboard navigation with Arrow keys
- Enter key activates items
- Focus management for nested lists

### Notes
- Can be used as attribute `[euiList]` or element `<eui-list>`
- Supports nested list structures
- Automatically manages tabindex for keyboard navigation


**Selector:** `[euiList], eui-list`