import { BooleanInput } from '@angular/cdk/coercion'; import * as i0 from '@angular/core'; /** * @description * Individual item component for discussion threads, representing a single message or entry in a conversation. * Displays author information, timestamp, message content, and optional metadata with support for visual variants. * * @usageNotes * ### Basic Thread Item * ```html * * * ``` * * ### With Type Styling * ```html * * * ``` * * ### With Tooltip * ```html * * * ``` * * ### Accessibility * - Uses `role="listitem"` for proper list semantics * - Author and date information announced before message content * - Tooltip provides additional context for assistive technologies * - Ensure date format is screen reader friendly * * ### Notes * - Use within `eui-discussion-thread` component for proper structure * - `typeClass` affects icon and styling (info, warning, success, danger) * - `isOdd` property used for alternating row styling * - Date accepts string format and is displayed with DatePipe * - Supports rich content in body via content projection */ declare class EuiDiscussionThreadItemComponent { /** * Sets CSS classes on the host element based on the typeClass property. * This helps maintain consistent styling with the parent theme variant. * @returns {string} The CSS class to be applied */ get cssClasses(): string; /** * ARIA role for the host element to ensure proper accessibility. * @default 'listitem' */ role: string; /** * Unique identifier for the discussion thread item. */ id: string; /** * Type class defining the visual style of the item (e.g., 'info', 'warning', 'error'). * This affects the color scheme applied to the item. */ typeClass: string; /** * Date when the thread item was created or modified. */ date: string; /** * Name or identifier of the author who created the item. */ author: string; /** * Content body of the discussion thread item. */ body: string; /** * Tooltip text to display additional information when hovering over the item. */ tooltip: string; /** * Indicates if this item is in an odd position in the list. * Used for alternating styling patterns within the thread. */ get isOdd(): boolean; set isOdd(value: BooleanInput); private _isOdd; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * @description * Interface defining the structure of an item within a discussion thread. * * This interface encapsulates all the necessary properties to display * a single message or entry, including metadata like author, date, * and styling information. * * @see EuiDiscussionThreadComponent * @see EuiDiscussionThreadItemComponent */ interface EuiDiscussionThreadItem { /** * Unique identifier for the discussion thread item. * Used for tracking and reference purposes. */ id: string; /** * CSS class identifier that defines the visual style of the item. * Common values include 'info', 'warning', 'error', etc. */ typeClass: string; /** * Date when the thread item was created or modified. * Typically formatted as an ISO string or similar date format. */ date: string; /** * Name or identifier of the author who created the item. */ author: string; /** * Content body of the discussion thread item. * Contains the main message or comment text. */ body: string; /** * Optional tooltip text to display additional information * when hovering over the item. */ tooltip?: string; } /** * @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. * * @usageNotes * ### Basic Usage with Items Array * ```typescript * // Component * discussionItems: EuiDiscussionThreadItem[] = [ * { * author: 'John Doe', * timestamp: new Date(), * message: 'First comment' * }, * { * author: 'Jane Smith', * timestamp: new Date(), * message: 'Reply to comment' * } * ]; * * // Template * * * ``` * * ### Using Content Projection * ```html * * * * * * * ``` * * ### 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 */ declare class EuiDiscussionThreadComponent { /** * Gets the CSS classes to apply to the host element. * * @returns {string} The CSS classes as a space-separated string. */ get cssClasses(): string; /** * ARIA role for the host element to ensure proper accessibility. * @default 'list' */ get checkRole(): string; /** * Array of discussion thread items to be displayed. * Each item should conform to the EuiDiscussionThreadItem interface. */ items: EuiDiscussionThreadItem[]; /** * The main title label for the discussion thread. */ titleLabel: string; /** * The subtitle label for the discussion thread, typically used to provide * additional context or categorization. */ subTitleLabel: string; /** * Tooltip text to display when hovering over the discussion thread. */ tooltip: string; private discussionThreadItems; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } declare const EUI_DISCUSSION_THREAD: readonly [typeof EuiDiscussionThreadComponent, typeof EuiDiscussionThreadItemComponent]; export { EUI_DISCUSSION_THREAD, EuiDiscussionThreadComponent, EuiDiscussionThreadItemComponent }; export type { EuiDiscussionThreadItem }; //# sourceMappingURL=eui-components-eui-discussion-thread.d.ts.map