import * as i0 from '@angular/core';
import { AfterContentInit, EventEmitter, QueryList, ElementRef } from '@angular/core';
import { FormGroup } from '@angular/forms';
/**
* @description
* Individual comment item component displaying a single comment with author information, timestamp, and nested replies.
* Provides automatic text truncation with expand/collapse functionality for long comments.
* Supports nested comment threads with collapsible child comments and integrated reply textarea.
* Displays author avatar, name, creation timestamp, and optional action buttons.
* Automatically counts and manages child comment items through content projection.
*
* @usageNotes
* ```html
*
* This is the comment text that will be automatically truncated if it exceeds the character limit.
*
*
*
*
* ```
*
* ### Accessibility
* - "Read more" and "Read less" links are keyboard accessible with proper focus management
* - Reply link is accessible via keyboard navigation
* - Nested comment structure uses semantic `
` and `
` elements
* - Avatar component includes proper alt text support
*
* ### Notes
* - Comment text is automatically truncated based on `commentCharLimit` (default: 500 characters)
* - Nested `eui-comment-item` elements are automatically counted and displayed
* - Reply textarea appears inline when user clicks "Answer" link
* - Use `eui-comment-item-right-actions` for action buttons like edit or delete
*/
declare class EuiCommentItemComponent implements AfterContentInit {
/** @internal */
get cssClasses(): string;
role: string;
/**
* URL path to the comment author's avatar image.
* Displayed alongside the comment to identify the author.
* Optional.
*/
authorAvatarUrl: string;
/**
* Name of the comment author.
* Displayed as the comment header to identify who wrote the comment.
* Optional.
*/
authorName: string;
/**
* Timestamp or date string indicating when the comment was created.
* Displayed in the comment header for temporal context.
* Optional.
*/
createdAt: string;
/**
* URL path to the current user's avatar image.
* Used for the reply textarea to identify the replying user.
* Optional.
*/
currentAuthorAvatarUrl: string;
/**
* Indicates whether this comment has nested child comments.
* When true, displays collapse/expand controls for child comments.
* @default false
*/
hasChildren: boolean;
/**
* Controls the expanded/collapsed state of nested child comments.
* When true, child comments are visible; when false, they are hidden.
* @default false
*/
isOpen: boolean;
/**
* Maximum character length before comment text is truncated.
* Comments exceeding this limit show "Read more" link to expand full text.
* @default 500
*/
commentCharLimit: number;
/**
* Emitted when the user cancels reply input.
* Payload: void
* Triggered when user clicks cancel button in the reply textarea.
*/
commentCancel: EventEmitter;
/**
* Emitted when the user submits a reply comment.
* Payload: string - the reply comment text entered by the user
* Triggered when user clicks send button in the reply textarea.
*/
commentSend: EventEmitter;
subCommentItems: QueryList;
comment: ElementRef;
isVisibleReplyInput: boolean;
fullText: string;
truncatedText: string;
isTruncated: boolean;
isExpanded: boolean;
get nbSubCommentItems(): number;
ngAfterContentInit(): void;
toggleExpanded(e: MouseEvent): void;
onToggleReplyInput(e: MouseEvent): void;
onToggleOpen(): void;
onCommentCancel(): void;
onCommentSend(comment: string): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
static ngAcceptInputType_hasChildren: unknown;
static ngAcceptInputType_isOpen: unknown;
static ngAcceptInputType_commentCharLimit: unknown;
}
/**
* @description
* `eui-comment-thread` component for displaying nested conversations with reply functionality.
* Provides a collapsible container for comment items with integrated textarea for adding new comments.
* Supports flexible textarea positioning (top or bottom) and optional collapse/expand behavior.
* Automatically counts and manages child comment items through content projection.
* Typically used for discussion threads, feedback sections, or collaborative commenting features.
*
* @usageNotes
* ```html
*
*
* This is a comment text.
*
*
* ```
*
* ### Accessibility
* - Collapse/expand buttons include proper ARIA labels through translation keys
* - Comment count is announced to screen readers (singular/plural forms)
* - Nested comment structure maintains semantic HTML with proper list elements
*
* ### Notes
* - Use `textareaPosition` to control whether new comments appear above or below existing ones
* - Set `isCollapsable` to false for always-visible comment threads
* - The component automatically counts child `eui-comment-item` elements
*/
declare class EuiCommentThreadComponent {
get cssClasses(): string;
/**
* Placeholder text displayed in the comment textarea when empty.
* Supports translation keys for internationalization.
* @default 'eui.ADD-A-COMMENT'
*/
placeholder: string;
/**
* Position of the comment textarea relative to the comment items.
* When 'top', textarea appears above comments; when 'bottom', below comments.
* @default 'top'
*/
textareaPosition: ('top' | 'bottom');
/**
* Controls visibility of the comment textarea.
* When false, hides the textarea preventing new comment input.
* @default true
*/
hasTextarea: boolean;
/**
* URL path to the current user's avatar image.
* Displayed alongside the comment textarea to identify the commenter.
* Optional.
*/
currentAuthorAvatarUrl: string;
/**
* Controls the expanded/collapsed state of the comment thread.
* When true, thread is expanded showing all comments; when false, thread is collapsed.
* @default false
*/
isOpen: boolean;
/**
* Enables collapse/expand functionality for the comment thread.
* When true, displays toggle control; when false, thread remains static.
* @default true
*/
isCollapsable: boolean;
/**
* Emitted when the user cancels comment input.
* Payload: void
* Triggered when user clicks cancel button in the comment textarea.
*/
commentCancel: EventEmitter;
/**
* Emitted when the user submits a new comment.
* Payload: string - the comment text entered by the user
* Triggered when user clicks send button in the comment textarea.
*/
commentSend: EventEmitter;
subCommentItems: QueryList;
get nbSubCommentItems(): number;
onCommentCancel(): void;
onCommentSend(comment: string): void;
onToggleOpen(): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
static ngAcceptInputType_hasTextarea: unknown;
static ngAcceptInputType_isOpen: unknown;
static ngAcceptInputType_isCollapsable: unknown;
}
/**
* @description
* `eui-comment-textarea` component providing an input area for composing and submitting comments.
* Displays user avatar alongside textarea with send and cancel action buttons.
* Implements reactive forms for comment input with automatic reset after submission or cancellation.
* Includes accessibility features through Angular CDK A11y module with focus trapping.
* Used within eui-comment-thread for adding new comments or replies.
*
* @usageNotes
* ```html
*
*
* ```
*
* ### Accessibility
* - Focus is automatically trapped within the textarea using `cdkTrapFocus`
* - Focus is captured on component initialization with `cdkTrapFocusAutoCapture`
* - Send and Cancel buttons are keyboard accessible
* - Placeholder text supports translation for internationalization
*
* ### Notes
* - Form automatically resets after sending or canceling a comment
* - Textarea auto-resizes based on content using `autoResize` directive
* - Uses reactive forms for robust form state management
* - Avatar is optional and can be omitted by not providing `currentAuthorAvatarUrl`
*/
declare class EuiCommentTextareaComponent {
get cssClasses(): string;
/**
* URL path to the current user's avatar image.
* Displayed alongside the textarea to identify the commenter.
* Optional.
*/
currentAuthorAvatarUrl: string;
/**
* Placeholder text displayed in the textarea when empty.
* Supports translation keys for internationalization.
* @default 'eui.ANSWER'
*/
placeholder: string;
/**
* Emitted when the user cancels comment input.
* Payload: void
* Triggered when user clicks cancel button. Automatically resets the form.
*/
commentCancel: EventEmitter;
/**
* Emitted when the user submits a comment.
* Payload: string - the comment text entered by the user
* Triggered when user clicks send button. Automatically resets the form after emission.
*/
commentSend: EventEmitter;
form: FormGroup;
onCommentCancel(): void;
onCommentSend(): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
/**
* @description
* Container component for right-aligned action buttons within a comment item.
* Provides a designated area for actions like edit, delete, reply, or other comment-specific operations.
* Content is projected via ng-content allowing flexible composition of action buttons.
* Automatically applies appropriate positioning and spacing for right-aligned actions.
* Used within eui-comment-item to organize action controls.
*
* @usageNotes
* ```html
*
* Comment text here
*
*
*
*
*
* ```
*
* ### Accessibility
* - Ensure projected buttons have proper ARIA labels or accessible text
* - Icon buttons should include `aria-label` attributes for screen readers
* - Maintain logical tab order for keyboard navigation
*
* ### Notes
* - Must be used as a child of `eui-comment-item` component
* - Accepts any content via content projection (buttons, dropdowns, etc.)
* - Automatically positioned in the top-right corner of the comment header
* - Commonly used for edit, delete, flag, or more actions menu
*/
declare class EuiCommentItemRightActionsComponent {
get cssClasses(): string;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}
declare const EUI_COMMENT_THREAD: readonly [typeof EuiCommentThreadComponent, typeof EuiCommentItemComponent, typeof EuiCommentTextareaComponent, typeof EuiCommentItemRightActionsComponent];
export { EUI_COMMENT_THREAD, EuiCommentItemComponent, EuiCommentItemRightActionsComponent, EuiCommentTextareaComponent, EuiCommentThreadComponent };
//# sourceMappingURL=eui-components-eui-comment-thread.d.ts.map