### File

`packages/components/eui-discussion-thread/eui-discussion-thread.component.ts`

### Description

A component for displaying threaded discussions or conversation timelines in a structured format. Renders a list of discussion items with support for titles, subtitles, and tooltips. Ideal for comment threads, activity feeds, chat histories, and collaborative communication interfaces.

### Basic Usage with Items Array

Example :

    // Component
    discussionItems: EuiDiscussionThreadItem[] = [
      {
        author: 'John Doe',
        timestamp: new Date(),
        message: 'First comment'
      },
      {
        author: 'Jane Smith',
        timestamp: new Date(),
        message: 'Reply to comment'
      }
    ];

    // Template
    <eui-discussion-thread
      [items]="discussionItems"
      [titleLabel]="'Project Discussion'"
      [subTitleLabel]="'Team Collaboration'">
    </eui-discussion-thread>

### Using Content Projection

Example :

    <eui-discussion-thread
      [titleLabel]="'Comments'"
      [tooltip]="'Discussion thread for this task'">
      <eui-discussion-thread-item
        [author]="'Alice'"
        [timestamp]="date1"
        [message]="'Initial comment'">
      </eui-discussion-thread-item>
      <eui-discussion-thread-item
        [author]="'Bob'"
        [timestamp]="date2"
        [message]="'Follow-up response'">
      </eui-discussion-thread-item>
    </eui-discussion-thread>

### Accessibility

- Automatically applies `role="list"` when items are present
- Each discussion item should have `role="listitem"` for proper structure
- Timestamps should be formatted for screen reader clarity
- Author names are announced before message content
- Tooltip provides additional context for assistive technologies

### Notes

- Supports both data-driven (`items` array) and content projection approaches
- Use `titleLabel` and `subTitleLabel` for thread categorization
- Items are rendered in the order provided
- Component automatically detects and counts projected `eui-discussion-thread-item` children
- Styling adapts based on thread depth and nesting level

### Metadata

selector | `eui-discussion-thread`
imports | `EuiDiscussionThreadItemComponent` `EUI_ICON` `EUI_LABEL`
styleUrls | `./eui-discussion-thread.scss`
templateUrl | `./eui-discussion-thread.component.html`

### Index

###### Inputs

- items
- subTitleLabel
- titleLabel
- tooltip

###### HostBindings

- attr.role
- class

###### Accessors

- cssClasses
- checkRole

### Inputs

items
Type : `EuiDiscussionThreadItem[]`
Array of discussion thread items to be displayed. Each item should conform to the EuiDiscussionThreadItem interface.

subTitleLabel
Type : `string`
The subtitle label for the discussion thread, typically used to provide additional context or categorization.

titleLabel
Type : `string`
The main title label for the discussion thread.

tooltip
Type : `string`
Tooltip text to display when hovering over the discussion thread.

### HostBindings

attr.role
Type : `string`
ARIA role for the host element to ensure proper accessibility.

class
Type : `string`
Gets the CSS classes to apply to the host element.

### Accessors

cssClasses
get `cssClasses()`
Gets the CSS classes to apply to the host element. Returns : `string`

checkRole
get `checkRole()`
ARIA role for the host element to ensure proper accessibility. Returns : `string`

# results matching ""

# No results matching ""