/**----------------------------------------------------------------------------------------- * Copyright © 2026 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the project root for more information *-------------------------------------------------------------------------------------------*/ import { AfterViewInit, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit, Renderer2, SimpleChanges, ViewContainerRef } from '@angular/core'; import { SpeechToTextButtonSettings } from '@progress/kendo-angular-buttons'; import { LocalizationService } from '@progress/kendo-angular-l10n'; import { ContextMenuComponent, ContextMenuPopupEvent } from '@progress/kendo-angular-menu'; import { SelectEvent } from '@progress/kendo-angular-upload'; import { SVGIcon } from '@progress/kendo-svg-icons'; import { FileSelectButtonSettings } from '../promptbox/common/models'; import { ExecuteActionEvent, FileAction, FileActionEvent, FileDownloadEvent, FilesLayoutMode, Message, MessageSettings, ResendMessageEvent, SendButtonSettings, SendMessageEvent } from './api'; import { ChatFile } from './api/chat-file-interface'; import { ChatSuggestion } from './api/chat-suggestion.interface'; import { MessageAction, MessageActionEvent } from './api/message-action'; import { MessageBoxSettings, MessageBoxType } from './api/message-box'; import { MessageWidthMode } from './api/message-width-mode'; import { QuickActionsLayoutMode, SuggestionsLayoutMode } from './api/suggestions-layout'; import { TimestampVisibilityMode } from './api/timestamp-visibility'; import { AuthorMessageContentTemplateDirective, AuthorMessageTemplateDirective, MessageContentTemplateDirective, MessageTemplateDirective, NoDataTemplateDirective, ReceiverMessageContentTemplateDirective, ReceiverMessageTemplateDirective } from './chat.directives'; import { ChatService } from './common/chat.service'; import { ConversationalUIModelFields } from './common/models/model-fields'; import { MessageBoxComponent } from './message-box.component'; import { AttachmentTemplateDirective } from './templates/attachment-template.directive'; import { ChatHeaderTemplateDirective } from './templates/header-template.directive'; import { ChatMessageBoxEndAffixTemplateDirective } from './templates/message-box-end-affix-template.directive'; import { ChatMessageBoxStartAffixTemplateDirective } from './templates/message-box-start-affix-template.directive'; import { ChatMessageBoxTopAffixTemplateDirective } from './templates/message-box-top-affix-template.directive'; import { ChatMessageBoxTemplateDirective } from './templates/message-box.directive'; import { ChatStatusTemplateDirective } from './templates/status-template.directive'; import { ChatSuggestionTemplateDirective } from './templates/suggestion-template.directive'; import { ChatTimestampTemplateDirective } from './templates/timestamp-template.directive'; import { ChatUserStatusTemplateDirective } from './templates/user-status-template.directive'; import * as i0 from "@angular/core"; /** * Represents the [Kendo UI Chat component for Angular](https://www.telerik.com/kendo-angular-ui/components/conversational-ui/chat). * * Provides a conversational UI for chat-based applications. * Supports message templates, attachments, localization, and user actions. * * @example * ```html * * * ``` * * @remarks * Supported children components are: {@link CustomMessagesComponent}, {@link HeroCardComponent}. */ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy { private localization; private zone; private renderer; private element; private chatService; /** * Sets the Chat messages. * Accepts an array of `Message` objects, but can also accept custom data types. * For more information, check [Data Binding](https://www.telerik.com/kendo-angular-ui/components/conversational-ui/chat/data-binding) section in the documentation. */ messages: any[]; /** * Sets the ID that represents the local user. */ authorId: string | number; /** * Determines the type of input used in the message box. * ([see example](https://www.telerik.com/kendo-angular-ui/components/conversational-ui/chat/message)). * @default 'textarea' * * @hidden */ messageBoxType: MessageBoxType; /** * Sets the height of the Chat component. * Accepts a string with CSS units (for example, `'400px'`, `'50%'`) or a number (interpreted as pixels). * The minimum height is `600px`. */ height: string | number; /** * Sets the width of the Chat component. * Accepts a string with CSS units (for example, `'400px'`, `'50%'`) or a number (interpreted as pixels). * The minimum width is `320px`. */ width: string | number; /** * Sets the placeholder text for the message input box. */ placeholder: string; /** * Controls the width of the message between the predefined options. * * @default 'standard' */ messageWidthMode: MessageWidthMode; /** * Controls the visibility of timestamps in messages. * * @default 'focus' */ timestampVisibility: TimestampVisibilityMode; /** * Controls the visibility of usernames in messages. * When set to `true`, the username displays above each message bubble. * * @default true */ showUsername: boolean; /** * Controls the avatar visibility for the messages. * When set to `true`, the user avatar displays next to each message bubble. * * @default true */ showAvatar: boolean; /** * Enables the expand or collapse functionality for messages. * * @default false */ allowMessageCollapse: boolean; /** * Sets the Speech to Text button settings. * * @default true */ speechToTextButton: boolean | SpeechToTextButtonSettings; /** * Sets the File Select Button settings. * * @default true */ fileSelectButton: boolean | FileSelectButtonSettings; /** * Sets the message box settings. */ messageBoxSettings: MessageBoxSettings; /** * Sets the actions of the message toolbar. * These actions display in the message toolbar and let you perform specific operations on the message. * * @default [] */ messageToolbarActions: MessageAction[]; /** * Sets the value of the Message Box. * * @default '' */ inputValue: string; /** * Sets the settings for the author's messages. */ authorMessageSettings: MessageSettings; /** * Sets the settings for the receivers' messages. */ receiverMessageSettings: MessageSettings; /** * Sets the default actions that display in the message context menu. * * @default [{ id: 'copy', label: 'Copy', icon: 'copy', svgIcon: copyIcon, disabled: false }, { id: 'reply', label: 'Reply', icon: 'undo', svgIcon: undoIcon, disabled: false }] */ defaultContextMenuActions: MessageAction[]; /** * Sets the actions that display in the message as a context menu. * These actions display as menu items and let you perform specific operations on the message. * The default actions are `copy` and `reply` and are defined by their `id`. */ set messageContextMenuActions(actions: MessageAction[] | null); get messageContextMenuActions(): MessageAction[]; /** * Sets the default actions that display in the file actions DropDownButton. * * @default [{ id: 'download', label: 'Download', icon: 'download', svgIcon: downloadIcon, disabled: false }] */ defaultFileActions: FileAction[]; /** * Sets the actions that display in the file as items of a DropDownButton. * These actions display when you click the file DropDownButton and let you perform specific operations on the file. * The default action is `download` and is defined by its `id`. * * @default [{ id: 'download', label: 'Download', icon: 'download', svgIcon: downloadIcon, disabled: false }] */ set fileActions(actions: FileAction[] | null); get fileActions(): FileAction[]; /** * Sets the layout of the files in the message bubble. * * @default 'vertical' */ set messageFilesLayout(layout: FilesLayoutMode); /** * Sets the layout of the suggestions above the message input box. * * @default 'scroll' */ set suggestionsLayout(layoutMode: SuggestionsLayoutMode); /** * Sets the layout of the quick actions suggested below the messages. * * @default 'scroll' */ set quickActionsLayout(layoutMode: QuickActionsLayoutMode); /** * Sets the suggestions that display in the message input box. * Suggestions display as a list of clickable items that let you quickly insert predefined text into the message input. * * @default [] */ suggestions: ChatSuggestion[]; /** * Sets the send button settings for the Chat component. * Allows customization of the send button appearance, icons and disabled state. * * @default true */ sendButton: boolean | SendButtonSettings; /** * @hidden */ set sendButtonSettings(value: boolean | SendButtonSettings); get sendButtonSettings(): boolean | SendButtonSettings; /** * Sets the names of the model fields from which the Chat reads its data. * Lets you map custom data types to the expected `Message` format. */ set modelFields(value: ConversationalUIModelFields); get modelFields(): ConversationalUIModelFields; /** * Controls whether a scroll to bottom button is rendered at the bottom of the Chat. Displayed only when the user has scrolled the component upward. * * @default true */ scrollToBottomButton: boolean; /** * Sets the loading state of the Chat component. * When set to `true`, a loading button is displayed instead of the send button. * * @default false */ loading: boolean; /** * Fires when the user sends a message by clicking the **Send** button or pressing **Enter**. * * The message is not automatically added to the `messages` array. */ sendMessage: EventEmitter; /** * Fires when the user clicks the resend button on a failed message. */ resendMessage: EventEmitter; /** * Fires when the user clicks a quick action button in the message toolbar. */ toolbarActionClick: EventEmitter; /** * Fires when the user clicks an action in the message context menu. */ contextMenuActionClick: EventEmitter; /** * Fires when the user clicks an action in the file context menu. */ fileActionClick: EventEmitter; /** * Fires when the user clicks an action in the file context menu. */ download: EventEmitter; /** * Fires when the user clicks a quick action button. * The Chat internally handles [known actions](https://www.telerik.com/kendo-angular-ui/components/conversational-ui/api/actiontype) such as `reply`, `openUrl`, and `call`. * * The event is preventable. Calling [`preventDefault`](https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault) suppresses the built-in action. */ executeAction: EventEmitter; /** * Fires when the user clicks a suggestion in the message input box. */ suggestionExecute: EventEmitter; /** * Fires when the user selects a file in the message input box. */ fileSelect: EventEmitter; /** * Fires when the user removes a file from the message input box. */ fileRemove: EventEmitter; /** * Fires when the user unpins the pinned message. * This event triggers when the user clicks the delete button on the pinned message. */ unpin: EventEmitter; /** * Fires when the user types in the message input box. */ inputValueChange: EventEmitter; get className(): string; get dirAttr(): string; set messagesContextMenu(contextMenu: ContextMenuComponent); attachmentTemplate: AttachmentTemplateDirective; chatHeaderTemplate: ChatHeaderTemplateDirective; chatNoDataTemplate: NoDataTemplateDirective; authorMessageContentTemplate: AuthorMessageContentTemplateDirective; receiverMessageContentTemplate: ReceiverMessageContentTemplateDirective; messageContentTemplate: MessageContentTemplateDirective; authorMessageTemplate: AuthorMessageTemplateDirective; receiverMessageTemplate: ReceiverMessageTemplateDirective; messageTemplate: MessageTemplateDirective; timestampTemplate: ChatTimestampTemplateDirective; suggestionTemplate: ChatSuggestionTemplateDirective; statusTemplate: ChatStatusTemplateDirective; messageBoxTemplate: ChatMessageBoxTemplateDirective; messageBoxStartAffixTemplate: ChatMessageBoxStartAffixTemplateDirective; messageBoxEndAffixTemplate: ChatMessageBoxEndAffixTemplateDirective; messageBoxTopAffixTemplate: ChatMessageBoxTopAffixTemplateDirective; userStatusTemplate: ChatUserStatusTemplateDirective; messageBox: MessageBoxComponent; /** * @hidden */ messageList: ViewContainerRef; /** * @hidden * Returns processed messages when model fields are used, otherwise returns original messages. */ get processedMessages(): Message[]; /** * @hidden */ isOwnMessage(message: Message): boolean; /** * Gets the actions available in the message context menu. * * @hidden */ get contextMenuActions(): any[]; /** * @hidden */ get localizationText(): LocalizationService; /** * @hidden */ autoScroll: boolean; /** * @hidden */ pinIcon: SVGIcon; /** * @hidden */ deleteIcon: SVGIcon; /** * @hidden */ pinnedMessage: Message; /** * @hidden */ scrollToBottomIcon: SVGIcon; private direction; private subs; private _modelFields; private _messageContextMenuActions; private _fileActions; private _cachedProcessedMessages; private _lastMessagesReference; private _lastModelFields; private _cachedContextMenuActions; private _lastContextMenuActionsReference; constructor(localization: LocalizationService, zone: NgZone, renderer: Renderer2, element: ElementRef, chatService: ChatService); /** * @hidden */ ngOnInit(): void; /** * @hidden */ ngOnChanges(changes: SimpleChanges): void; /** * @hidden */ ngAfterViewInit(): void; /** * @hidden */ ngOnDestroy(): void; /** * @hidden */ dispatchAction(e: ExecuteActionEvent): void; /** * @hidden */ textFor(key: string): string; /** * @hidden */ scrollToPinnedMessage(): void; /** * @hidden */ onContextMenuAction(action: MessageAction): void; /** * @hidden */ handleMenuClose(event: ContextMenuPopupEvent): void; /** * @hidden */ onActionButtonClick(event: MouseEvent): void; private findLastPinnedMessage; private updateChatServiceProperties; private mergeWithDefaultActions; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; }