@progress/kendo-angular-conversational-ui 21.0.0-develop.2 → 21.0.0-develop.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/chat/api/files-layout.d.ts +12 -0
  2. package/chat/api/index.d.ts +4 -1
  3. package/chat/api/message-settings.interface.d.ts +41 -0
  4. package/chat/api/message-width-mode.d.ts +1 -1
  5. package/chat/api/message.interface.d.ts +5 -1
  6. package/chat/api/suggestions-layout.d.ts +20 -0
  7. package/chat/api/timestamp-visibility.d.ts +10 -0
  8. package/chat/chat.component.d.ts +111 -34
  9. package/chat/chat.directives.d.ts +18 -0
  10. package/chat/chat.module.d.ts +15 -8
  11. package/chat/common/chat.service.d.ts +36 -3
  12. package/chat/common/models/model-fields.d.ts +0 -6
  13. package/chat/common/scroll-button.component.d.ts +32 -0
  14. package/chat/common/scroll.service.d.ts +39 -0
  15. package/chat/common/utils.d.ts +13 -1
  16. package/chat/l10n/messages.d.ts +9 -1
  17. package/chat/message-list.component.d.ts +22 -3
  18. package/chat/message.component.d.ts +40 -16
  19. package/chat/suggested-actions.component.d.ts +30 -5
  20. package/chat/templates/author-message-content-template.directive.d.ts +28 -0
  21. package/chat/templates/author-message-template.directive.d.ts +28 -0
  22. package/chat/templates/message-content-template.directive.d.ts +28 -0
  23. package/chat/templates/message-template.directive.d.ts +1 -1
  24. package/chat/templates/no-data-template.directive.d.ts +27 -0
  25. package/chat/templates/receiver-message-content-template.directive.d.ts +28 -0
  26. package/chat/templates/receiver-message-template.directive.d.ts +28 -0
  27. package/chat/templates/user-status-template.directive.d.ts +27 -0
  28. package/codemods/utils.js +477 -375
  29. package/codemods/v20/chat-user.js +7 -5
  30. package/codemods/v21/chat-messagetoolbarvisibility.js +53 -0
  31. package/codemods/v21/chat-pinnedbyfield.js +19 -0
  32. package/conversational-ui.module.d.ts +18 -11
  33. package/directives.d.ts +9 -2
  34. package/esm2022/chat/api/index.mjs +4 -1
  35. package/{chat/api/message-toolbar-visibility.d.ts → esm2022/chat/api/message-settings.interface.mjs} +1 -4
  36. package/esm2022/chat/api/suggestions-layout.mjs +5 -0
  37. package/esm2022/chat/api/timestamp-visibility.mjs +5 -0
  38. package/esm2022/chat/builtin-actions.mjs +2 -0
  39. package/esm2022/chat/chat-file.component.mjs +2 -2
  40. package/esm2022/chat/chat.component.mjs +295 -71
  41. package/esm2022/chat/chat.directives.mjs +18 -0
  42. package/esm2022/chat/chat.module.mjs +16 -9
  43. package/esm2022/chat/common/chat.service.mjs +86 -4
  44. package/esm2022/chat/common/models/default-model-fields.mjs +0 -1
  45. package/esm2022/chat/common/scroll-button.component.mjs +81 -0
  46. package/esm2022/chat/common/scroll.service.mjs +110 -0
  47. package/esm2022/chat/common/utils.mjs +22 -3
  48. package/esm2022/chat/l10n/messages.mjs +13 -1
  49. package/esm2022/chat/message-attachments.component.mjs +2 -2
  50. package/esm2022/chat/message-box.component.mjs +5 -2
  51. package/esm2022/chat/message-list.component.mjs +184 -40
  52. package/esm2022/chat/message.component.mjs +487 -326
  53. package/esm2022/chat/suggested-actions.component.mjs +298 -80
  54. package/esm2022/chat/templates/author-message-content-template.directive.mjs +39 -0
  55. package/esm2022/chat/templates/author-message-template.directive.mjs +39 -0
  56. package/esm2022/chat/templates/message-content-template.directive.mjs +39 -0
  57. package/esm2022/chat/templates/message-template.directive.mjs +1 -1
  58. package/esm2022/chat/templates/no-data-template.directive.mjs +38 -0
  59. package/esm2022/chat/templates/receiver-message-content-template.directive.mjs +39 -0
  60. package/esm2022/chat/templates/receiver-message-template.directive.mjs +39 -0
  61. package/esm2022/chat/templates/user-status-template.directive.mjs +38 -0
  62. package/esm2022/conversational-ui.module.mjs +19 -12
  63. package/esm2022/directives.mjs +15 -1
  64. package/esm2022/index.mjs +7 -0
  65. package/esm2022/package-metadata.mjs +2 -2
  66. package/fesm2022/progress-kendo-angular-conversational-ui.mjs +1822 -567
  67. package/index.d.ts +7 -0
  68. package/package.json +26 -14
  69. /package/esm2022/chat/api/{message-toolbar-visibility.mjs → files-layout.mjs} +0 -0
@@ -0,0 +1,12 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ /**
6
+ * The layout of the files in the message bubble.
7
+ *
8
+ * 'horizontal' - Files are laid out in a row and are horizontally scrollable.
9
+ * 'vertical' - Files are displayed in a vertical stack.
10
+ * 'wrap' - Files wrap to new lines when space is limited.
11
+ */
12
+ export type FilesLayoutMode = 'horizontal' | 'vertical' | 'wrap';
@@ -8,11 +8,14 @@ export * from './chat-file-interface';
8
8
  export * from './chat-suggestion.interface';
9
9
  export * from './execute-action-event';
10
10
  export * from './message-action';
11
- export * from './message-toolbar-visibility';
12
11
  export * from './message-width-mode';
13
12
  export * from './message.interface';
13
+ export * from './message-settings.interface';
14
14
  export * from './post-message-event';
15
15
  export * from './user.interface';
16
16
  export * from './file-action';
17
17
  export * from './file-download-event.interface';
18
18
  export * from './send-button-settings';
19
+ export * from './files-layout';
20
+ export * from './suggestions-layout';
21
+ export * from './timestamp-visibility';
@@ -0,0 +1,41 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import { FileAction } from "./file-action";
6
+ import { MessageAction } from "./message-action";
7
+ import { MessageWidthMode } from "./message-width-mode";
8
+ /**
9
+ * Represents the settings for the Chat message ([see example](slug:databinding_chat)).
10
+ *
11
+ */
12
+ export interface MessageSettings {
13
+ /**
14
+ * If set to `true`, enables the expanding/collapsing of long messages.
15
+ */
16
+ allowMessageCollapse?: boolean;
17
+ /**
18
+ * Sets the array of actions that will be displayed in the message toolbar.
19
+ */
20
+ messageToolbarActions?: MessageAction[];
21
+ /**
22
+ * Sets the array of actions that will be displayed in the message context menu.
23
+ */
24
+ messageContextMenuActions?: MessageAction[];
25
+ /**
26
+ * Sets the array of actions that will be displayed for the message files.
27
+ */
28
+ fileActions?: FileAction[];
29
+ /**
30
+ * Sets the mode that will be used to determine the message width.
31
+ */
32
+ messageWidthMode?: MessageWidthMode;
33
+ /**
34
+ * Sets the visibility of the author's avatar for the message group.
35
+ */
36
+ showAvatar?: boolean;
37
+ /**
38
+ * Sets the visibility of the author's username for the message group.
39
+ */
40
+ showUsername?: boolean;
41
+ }
@@ -3,7 +3,7 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  /**
6
- * Defines the possible modes for message width in the chat component.
6
+ * Defines the possible modes for message width in the Chat component.
7
7
  * - `full`: The message takes the full width of the chat container.
8
8
  * - `standard`: (Default) The message width is standard, allowing for a more compact layout.
9
9
  */
@@ -14,7 +14,7 @@ export interface Message {
14
14
  /**
15
15
  * Sets a unique ID for the message.
16
16
  */
17
- id?: string | number;
17
+ id: string | number;
18
18
  /**
19
19
  * Sets the text content for the message. Some messages may contain only attachments or quick actions.
20
20
  */
@@ -65,4 +65,8 @@ export interface Message {
65
65
  * Indicates if the message is still being typed by the user. If `true`, the Chat shows a typing indicator.
66
66
  */
67
67
  typing?: boolean;
68
+ /**
69
+ * Provides a reference to the original data item, if any.
70
+ */
71
+ dataItem?: any;
68
72
  }
@@ -0,0 +1,20 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ /**
6
+ * Defines the layout for the suggestions list.
7
+ *
8
+ * 'scroll' - The list is scrollable when the content overflows.
9
+ * 'wrap' - The list wraps to new lines when space is limited.
10
+ * 'scrollbuttons' - The list is scrollable with navigation buttons when the content overflows.
11
+ */
12
+ export type SuggestionsLayoutMode = 'scroll' | 'wrap' | 'scrollbuttons';
13
+ /**
14
+ * Defines the layout for the quick actions list.
15
+ *
16
+ * 'scroll' - The list is scrollable when the content overflows.
17
+ * 'wrap' - The list wraps to new lines when space is limited.
18
+ * 'scrollbuttons' - The list is scrollable with navigation buttons when the content overflows.
19
+ */
20
+ export type QuickActionsLayoutMode = 'scroll' | 'wrap' | 'scrollbuttons';
@@ -0,0 +1,10 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ /**
6
+ * Defines the possible modes for timestamp visibility in the Chat component.
7
+ * - `focus`: Timestamps are only visible for selected/focused messages (default Chat behavior).
8
+ * - `hidden`: Timestamps are hidden for all messages.
9
+ */
10
+ export type TimestampVisibilityMode = 'focus' | 'hidden';
@@ -5,8 +5,7 @@
5
5
  import { AfterViewInit, ElementRef, EventEmitter, OnDestroy, NgZone, Renderer2, SimpleChanges, OnInit, ViewContainerRef } from '@angular/core';
6
6
  import { AttachmentTemplateDirective } from './templates/attachment-template.directive';
7
7
  import { LocalizationService } from '@progress/kendo-angular-l10n';
8
- import { MessageTemplateDirective } from './templates/message-template.directive';
9
- import { ExecuteActionEvent, FileAction, Message, SendMessageEvent, FileActionEvent, FileDownloadEvent, SendButtonSettings, MessageToolbarVisibility } from './api';
8
+ import { ExecuteActionEvent, FileAction, Message, SendMessageEvent, FileActionEvent, FileDownloadEvent, SendButtonSettings, FilesLayoutMode, MessageSettings } from './api';
10
9
  import { MessageBoxType } from './common/models/message-box-options';
11
10
  import { ChatMessageBoxTemplateDirective } from './templates/message-box.directive';
12
11
  import { MessageBoxComponent } from './message-box.component';
@@ -22,6 +21,11 @@ import { ConversationalUIModelFields } from './common/models/model-fields';
22
21
  import { ChatTimestampTemplateDirective } from './templates/timestamp-template.directive';
23
22
  import { ChatStatusTemplateDirective } from './templates/status-template.directive';
24
23
  import { ChatSuggestionTemplateDirective } from './templates/suggestion-template.directive';
24
+ import { ContextMenuComponent, ContextMenuPopupEvent } from '@progress/kendo-angular-menu';
25
+ import { NoDataTemplateDirective, MessageTemplateDirective, AuthorMessageContentTemplateDirective, ReceiverMessageContentTemplateDirective, ReceiverMessageTemplateDirective, AuthorMessageTemplateDirective, MessageContentTemplateDirective } from './chat.directives';
26
+ import { ChatUserStatusTemplateDirective } from './templates/user-status-template.directive';
27
+ import { QuickActionsLayoutMode, SuggestionsLayoutMode } from './api/suggestions-layout';
28
+ import { TimestampVisibilityMode } from './api/timestamp-visibility';
25
29
  import * as i0 from "@angular/core";
26
30
  /**
27
31
  * Represents the [Kendo UI Chat component for Angular](slug:overview_convui).
@@ -40,7 +44,7 @@ import * as i0 from "@angular/core";
40
44
  * ```
41
45
  *
42
46
  * @remarks
43
- * Supported children components are: {@link CustomMessagesComponent}, {@link HeroCardComponent}, {@link AttachmentTemplateDirective}, {@link ChatHeaderTemplateDirective}, {@link ChatMessageBoxTemplateDirective}, {@link MessageTemplateDirective}, {@link ChatStatusTemplateDirective}, {@link ChatSuggestionTemplateDirective}, {@link ChatTimestampTemplateDirective}.
47
+ * Supported children components are: {@link CustomMessagesComponent}, {@link HeroCardComponent}, {@link AttachmentTemplateDirective}, {@link ChatHeaderTemplateDirective}, {@link ChatMessageBoxTemplateDirective}, {@link MessageContentTemplateDirective}, {@link MessageTemplateDirective},{@link ChatStatusTemplateDirective}, {@link ChatSuggestionTemplateDirective}, {@link ChatTimestampTemplateDirective}, {@link ChatNoDataTemplateDirective}, {@link ChatUserStatusTemplateDirective}, {@link AuthorMessageContentTemplateDirective}, {@link ReceiverMessageContentTemplateDirective}, {@link ReceiverMessageTemplateDirective}, {@link AuthorMessageTemplateDirective}.
44
48
  */
45
49
  export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
46
50
  private localization;
@@ -49,13 +53,13 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
49
53
  private element;
50
54
  private chatService;
51
55
  /**
52
- * Defines the array of messages displayed in the Chat.
53
- * Each message can include a timestamp for unique identification.
54
- * For more information, see [ngFor - Change Tracking](link:site.data.urls.angular['ngforof']#change-propagation).
56
+ * Sets the Chat messages.
57
+ * Accepts an array of `Message` objects, but can also accept custom data structures.
58
+ * For more information, check [Data Binding](slug:databinding_chat) section in the documentation.
55
59
  */
56
- messages: Message[];
60
+ messages: any[];
57
61
  /**
58
- * Specifies the id representing the local user.
62
+ * Sets the ID that represents the local user.
59
63
  */
60
64
  authorId: string | number;
61
65
  /**
@@ -83,13 +87,32 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
83
87
  */
84
88
  placeholder: string;
85
89
  /**
86
- * Switches the width of the message between the predefined options.
90
+ * Controls the width of the message between the predefined options.
87
91
  *
88
92
  * @default 'standard'
89
93
  */
90
94
  messageWidthMode: MessageWidthMode;
95
+ /**
96
+ * Controls the visibility of timestamps in messages.
97
+ *
98
+ * @default 'focus'
99
+ */
100
+ timestampVisibility: TimestampVisibilityMode;
101
+ /**
102
+ * Controls the visibility of the author's avatar for the message group.
103
+ *
104
+ * @default true
105
+ */
106
+ showUsername: boolean;
107
+ /**
108
+ * Controls the visibility of the author's username for the message group.
109
+ *
110
+ * @default true
111
+ */
112
+ showAvatar: boolean;
91
113
  /**
92
114
  * Enables the expand or collapse functionality for messages.
115
+ *
93
116
  * @default false
94
117
  */
95
118
  allowMessageCollapse: boolean;
@@ -106,35 +129,47 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
106
129
  */
107
130
  enableFileSelect: boolean | FileSelectSettings;
108
131
  /**
109
- * Specifies the actions available in the message toolbar.
132
+ * Sets the actions of the message toolbar.
110
133
  * These actions display in the message toolbar and let you perform specific operations on the message.
134
+ *
111
135
  * @default []
112
136
  */
113
137
  messageToolbarActions: MessageAction[];
114
138
  /**
115
139
  * Sets the value of the Message Box.
140
+ *
116
141
  * @default ''
117
142
  */
118
143
  inputValue: string;
119
144
  /**
120
- * Specifies the default actions available in the message context menu.
145
+ * Sets the settings for the author's messages.
146
+ */
147
+ authorMessageSettings: MessageSettings;
148
+ /**
149
+ * Sets the settings for the receivers' messages.
150
+ */
151
+ receiverMessageSettings: MessageSettings;
152
+ /**
153
+ * Sets the default actions that display in the message context menu.
121
154
  *
122
155
  * @default [{ id: 'copy', label: 'Copy', icon: 'copy', svgIcon: copyIcon, disabled: false }, { id: 'reply', label: 'Reply', icon: 'undo', svgIcon: undoIcon, disabled: false }]
123
156
  */
124
157
  defaultContextMenuActions: MessageAction[];
125
158
  /**
126
- * Specifies the actions available in the message as a context menu.
159
+ * Sets the actions that display in the message as a context menu.
127
160
  * These actions display as menu items and let you perform specific operations on the message.
128
161
  * The default actions are `copy` and `reply` and are defined by their `id`.
129
162
  */
130
163
  set messageContextMenuActions(actions: MessageAction[] | null);
131
164
  get messageContextMenuActions(): MessageAction[];
132
165
  /**
133
- * Specifies the default actions available in the file actions DropDownButton.
166
+ * Sets the default actions that display in the file actions DropDownButton.
167
+ *
168
+ * @default [{ id: 'download', label: 'Download', icon: 'download', svgIcon: downloadIcon, disabled: false }]
134
169
  */
135
170
  defaultFileActions: FileAction[];
136
171
  /**
137
- * Specifies the actions available in the file as items of a DropDownButton.
172
+ * Sets the actions that display in the file as items of a DropDownButton.
138
173
  * These actions display when you click the file DropDownButton and let you perform specific operations on the file.
139
174
  * The default action is `download` and is defined by its `id`.
140
175
  *
@@ -143,17 +178,30 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
143
178
  set fileActions(actions: FileAction[] | null);
144
179
  get fileActions(): FileAction[];
145
180
  /**
146
- * Sets the suggestions to display in the message input box.
147
- * Suggestions display as a list of clickable items that let you quickly insert predefined text into the message input.
148
- * @default []
181
+ * Sets the layout of the files in the message bubble.
182
+ *
183
+ * @default 'vertical'
149
184
  */
150
- suggestions: ChatSuggestion[];
185
+ set messageFilesLayout(layout: FilesLayoutMode);
186
+ /**
187
+ * Sets the layout of the suggestions above the message input box.
188
+ *
189
+ * @default 'scroll'
190
+ */
191
+ set suggestionsLayout(layoutMode: SuggestionsLayoutMode);
192
+ /**
193
+ * Sets the layout of the quick actions suggested below the messages.
194
+ *
195
+ * @default 'scroll'
196
+ */
197
+ set quickActionsLayout(layoutMode: QuickActionsLayoutMode);
151
198
  /**
152
- * Sets the visibility of the message toolbar.
199
+ * Sets the suggestions that display in the message input box.
200
+ * Suggestions display as a list of clickable items that let you quickly insert predefined text into the message input.
153
201
  *
154
- * @default 'hidden'
202
+ * @default []
155
203
  */
156
- messageToolbarVisibility: MessageToolbarVisibility;
204
+ suggestions: ChatSuggestion[];
157
205
  /**
158
206
  * Sets the send button settings for the Chat component.
159
207
  * Allows customization of the send button appearance, icons and disabled state.
@@ -168,64 +216,72 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
168
216
  set modelFields(value: ConversationalUIModelFields);
169
217
  get modelFields(): ConversationalUIModelFields;
170
218
  /**
171
- * Emits when the user sends a message by clicking the **Send** button or pressing **Enter**.
219
+ * Fires when the user sends a message by clicking the **Send** button or pressing **Enter**.
172
220
  *
173
221
  * The message is not automatically added to the `messages` array.
174
222
  */
175
223
  sendMessage: EventEmitter<SendMessageEvent>;
176
224
  /**
177
- * Emits when the user clicks a quick action button in the message toolbar.
225
+ * Fires when the user clicks a quick action button in the message toolbar.
178
226
  */
179
227
  toolbarActionClick: EventEmitter<MessageActionEvent>;
180
228
  /**
181
- * Emits when the user clicks an action in the message context menu.
229
+ * Fires when the user clicks an action in the message context menu.
182
230
  */
183
231
  contextMenuActionClick: EventEmitter<MessageActionEvent>;
184
232
  /**
185
- * Emits when the user clicks an action in the file context menu.
233
+ * Fires when the user clicks an action in the file context menu.
186
234
  */
187
235
  fileActionClick: EventEmitter<FileActionEvent>;
188
236
  /**
189
- * Emits when the user clicks an action in the file context menu.
237
+ * Fires when the user clicks an action in the file context menu.
190
238
  */
191
239
  download: EventEmitter<FileDownloadEvent>;
192
240
  /**
193
- * Emits when the user clicks a quick action button.
241
+ * Fires when the user clicks a quick action button.
194
242
  * The Chat internally handles [known actions](slug:api_conversational-ui_actiontype) such as `reply`, `openUrl`, and `call`.
195
243
  *
196
244
  * The event is preventable. Calling [`preventDefault`](https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault) suppresses the built-in action.
197
245
  */
198
246
  executeAction: EventEmitter<ExecuteActionEvent>;
199
247
  /**
200
- * Emits when the user clicks a suggestion in the message input box.
248
+ * Fires when the user clicks a suggestion in the message input box.
201
249
  */
202
250
  suggestionExecute: EventEmitter<ChatSuggestion>;
203
251
  /**
204
- * Emits when the user selects a file in the message input box.
252
+ * Fires when the user selects a file in the message input box.
205
253
  */
206
254
  fileSelect: EventEmitter<SelectEvent>;
207
255
  /**
208
- * Emits when the user removes a file from the message input box.
256
+ * Fires when the user removes a file from the message input box.
209
257
  */
210
258
  fileRemove: EventEmitter<ChatFile>;
211
259
  /**
212
- * Emits when the user unpins the pinned message.
260
+ * Fires when the user unpins the pinned message.
213
261
  * This event triggers when the user clicks the delete button on the pinned message.
214
262
  */
215
263
  unpin: EventEmitter<Message>;
216
264
  /**
217
- * Emits when the user types in the message input box.
265
+ * Fires when the user types in the message input box.
218
266
  */
219
267
  inputValueChange: EventEmitter<string>;
220
268
  get className(): string;
221
269
  get dirAttr(): string;
270
+ set messagesContextMenu(contextMenu: ContextMenuComponent);
222
271
  attachmentTemplate: AttachmentTemplateDirective;
223
272
  chatHeaderTemplate: ChatHeaderTemplateDirective;
273
+ chatNoDataTemplate: NoDataTemplateDirective;
274
+ authorMessageContentTemplate: AuthorMessageContentTemplateDirective;
275
+ receiverMessageContentTemplate: ReceiverMessageContentTemplateDirective;
276
+ messageContentTemplate: MessageContentTemplateDirective;
277
+ authorMessageTemplate: AuthorMessageTemplateDirective;
278
+ receiverMessageTemplate: ReceiverMessageTemplateDirective;
224
279
  messageTemplate: MessageTemplateDirective;
225
280
  timestampTemplate: ChatTimestampTemplateDirective;
226
281
  suggestionTemplate: ChatSuggestionTemplateDirective;
227
282
  statusTemplate: ChatStatusTemplateDirective;
228
283
  messageBoxTemplate: ChatMessageBoxTemplateDirective;
284
+ userStatusTemplate: ChatUserStatusTemplateDirective;
229
285
  messageBox: MessageBoxComponent;
230
286
  /**
231
287
  * @hidden
@@ -233,9 +289,15 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
233
289
  messageList: ViewContainerRef;
234
290
  /**
235
291
  * @hidden
236
- * Returns processed messages when model fields are used, otherwise returns original messages
292
+ * Returns processed messages when model fields are used, otherwise returns original messages.
237
293
  */
238
294
  get processedMessages(): Message[];
295
+ /**
296
+ * Gets the actions available in the message context menu.
297
+ *
298
+ * @hidden
299
+ */
300
+ get contextMenuActions(): any[];
239
301
  /**
240
302
  * @hidden
241
303
  */
@@ -261,6 +323,9 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
261
323
  private _modelFields;
262
324
  private _messageContextMenuActions;
263
325
  private _fileActions;
326
+ private _cachedProcessedMessages;
327
+ private _lastMessagesReference;
328
+ private _lastModelFields;
264
329
  constructor(localization: LocalizationService, zone: NgZone, renderer: Renderer2, element: ElementRef, chatService: ChatService);
265
330
  /**
266
331
  * @hidden
@@ -290,9 +355,21 @@ export declare class ChatComponent implements OnInit, AfterViewInit, OnDestroy {
290
355
  * @hidden
291
356
  */
292
357
  scrollToPinnedMessage(): void;
358
+ /**
359
+ * @hidden
360
+ */
361
+ onContextMenuAction(action: MessageAction): void;
362
+ /**
363
+ * @hidden
364
+ */
365
+ handleMenuClose(event: ContextMenuPopupEvent): void;
366
+ /**
367
+ * @hidden
368
+ */
369
+ onActionButtonClick(event: MouseEvent): void;
293
370
  private findLastPinnedMessage;
294
371
  private updateChatServiceProperties;
295
372
  private mergeWithDefaultActions;
296
373
  static ɵfac: i0.ɵɵFactoryDeclaration<ChatComponent, never>;
297
- static ɵcmp: i0.ɵɵComponentDeclaration<ChatComponent, "kendo-chat", never, { "messages": { "alias": "messages"; "required": false; }; "authorId": { "alias": "authorId"; "required": false; }; "messageBoxType": { "alias": "messageBoxType"; "required": false; }; "height": { "alias": "height"; "required": false; }; "width": { "alias": "width"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "messageWidthMode": { "alias": "messageWidthMode"; "required": false; }; "allowMessageCollapse": { "alias": "allowMessageCollapse"; "required": false; }; "enableSpeechToText": { "alias": "enableSpeechToText"; "required": false; }; "enableFileSelect": { "alias": "enableFileSelect"; "required": false; }; "messageToolbarActions": { "alias": "messageToolbarActions"; "required": false; }; "inputValue": { "alias": "inputValue"; "required": false; }; "messageContextMenuActions": { "alias": "messageContextMenuActions"; "required": false; }; "fileActions": { "alias": "fileActions"; "required": false; }; "suggestions": { "alias": "suggestions"; "required": false; }; "messageToolbarVisibility": { "alias": "messageToolbarVisibility"; "required": false; }; "sendButtonSettings": { "alias": "sendButtonSettings"; "required": false; }; "modelFields": { "alias": "modelFields"; "required": false; }; }, { "sendMessage": "sendMessage"; "toolbarActionClick": "toolbarActionClick"; "contextMenuActionClick": "contextMenuActionClick"; "fileActionClick": "fileActionClick"; "download": "download"; "executeAction": "executeAction"; "suggestionExecute": "suggestionExecute"; "fileSelect": "fileSelect"; "fileRemove": "fileRemove"; "unpin": "unpin"; "inputValueChange": "inputValueChange"; }, ["attachmentTemplate", "chatHeaderTemplate", "messageTemplate", "timestampTemplate", "suggestionTemplate", "statusTemplate", "messageBoxTemplate"], never, true, never>;
374
+ static ɵcmp: i0.ɵɵComponentDeclaration<ChatComponent, "kendo-chat", never, { "messages": { "alias": "messages"; "required": false; }; "authorId": { "alias": "authorId"; "required": false; }; "messageBoxType": { "alias": "messageBoxType"; "required": false; }; "height": { "alias": "height"; "required": false; }; "width": { "alias": "width"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "messageWidthMode": { "alias": "messageWidthMode"; "required": false; }; "timestampVisibility": { "alias": "timestampVisibility"; "required": false; }; "showUsername": { "alias": "showUsername"; "required": false; }; "showAvatar": { "alias": "showAvatar"; "required": false; }; "allowMessageCollapse": { "alias": "allowMessageCollapse"; "required": false; }; "enableSpeechToText": { "alias": "enableSpeechToText"; "required": false; }; "enableFileSelect": { "alias": "enableFileSelect"; "required": false; }; "messageToolbarActions": { "alias": "messageToolbarActions"; "required": false; }; "inputValue": { "alias": "inputValue"; "required": false; }; "authorMessageSettings": { "alias": "authorMessageSettings"; "required": false; }; "receiverMessageSettings": { "alias": "receiverMessageSettings"; "required": false; }; "messageContextMenuActions": { "alias": "messageContextMenuActions"; "required": false; }; "fileActions": { "alias": "fileActions"; "required": false; }; "messageFilesLayout": { "alias": "messageFilesLayout"; "required": false; }; "suggestionsLayout": { "alias": "suggestionsLayout"; "required": false; }; "quickActionsLayout": { "alias": "quickActionsLayout"; "required": false; }; "suggestions": { "alias": "suggestions"; "required": false; }; "sendButtonSettings": { "alias": "sendButtonSettings"; "required": false; }; "modelFields": { "alias": "modelFields"; "required": false; }; }, { "sendMessage": "sendMessage"; "toolbarActionClick": "toolbarActionClick"; "contextMenuActionClick": "contextMenuActionClick"; "fileActionClick": "fileActionClick"; "download": "download"; "executeAction": "executeAction"; "suggestionExecute": "suggestionExecute"; "fileSelect": "fileSelect"; "fileRemove": "fileRemove"; "unpin": "unpin"; "inputValueChange": "inputValueChange"; }, ["attachmentTemplate", "chatHeaderTemplate", "chatNoDataTemplate", "authorMessageContentTemplate", "receiverMessageContentTemplate", "messageContentTemplate", "authorMessageTemplate", "receiverMessageTemplate", "messageTemplate", "timestampTemplate", "suggestionTemplate", "statusTemplate", "messageBoxTemplate", "userStatusTemplate"], never, true, never>;
298
375
  }
@@ -0,0 +1,18 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ export { ChatComponent } from './chat.component';
6
+ export { AttachmentTemplateDirective } from './templates/attachment-template.directive';
7
+ export { MessageContentTemplateDirective } from './templates/message-content-template.directive';
8
+ export { MessageTemplateDirective } from './templates/message-template.directive';
9
+ export { ChatUserStatusTemplateDirective } from './templates/user-status-template.directive';
10
+ export { ChatMessageBoxTemplateDirective } from './templates/message-box.directive';
11
+ export { ChatHeaderTemplateDirective } from './templates/header-template.directive';
12
+ export { NoDataTemplateDirective } from './templates/no-data-template.directive';
13
+ export { ChatTimestampTemplateDirective } from './templates/timestamp-template.directive';
14
+ export { ChatStatusTemplateDirective } from './templates/status-template.directive';
15
+ export { AuthorMessageContentTemplateDirective } from './templates/author-message-content-template.directive';
16
+ export { ReceiverMessageContentTemplateDirective } from './templates/receiver-message-content-template.directive';
17
+ export { ReceiverMessageTemplateDirective } from './templates/receiver-message-template.directive';
18
+ export { AuthorMessageTemplateDirective } from './templates/author-message-template.directive';
@@ -6,13 +6,20 @@ import * as i0 from "@angular/core";
6
6
  import * as i1 from "./chat.component";
7
7
  import * as i2 from "./l10n/custom-messages.component";
8
8
  import * as i3 from "./templates/attachment-template.directive";
9
- import * as i4 from "./templates/message-template.directive";
10
- import * as i5 from "./cards/hero-card.component";
11
- import * as i6 from "./templates/message-box.directive";
12
- import * as i7 from "./templates/header-template.directive";
13
- import * as i8 from "./templates/timestamp-template.directive";
14
- import * as i9 from "./templates/status-template.directive";
15
- import * as i10 from "./templates/suggestion-template.directive";
9
+ import * as i4 from "./templates/author-message-content-template.directive";
10
+ import * as i5 from "./templates/receiver-message-content-template.directive";
11
+ import * as i6 from "./templates/message-content-template.directive";
12
+ import * as i7 from "./templates/author-message-template.directive";
13
+ import * as i8 from "./templates/receiver-message-template.directive";
14
+ import * as i9 from "./templates/message-template.directive";
15
+ import * as i10 from "./cards/hero-card.component";
16
+ import * as i11 from "./templates/message-box.directive";
17
+ import * as i12 from "./templates/header-template.directive";
18
+ import * as i13 from "./templates/no-data-template.directive";
19
+ import * as i14 from "./templates/timestamp-template.directive";
20
+ import * as i15 from "./templates/status-template.directive";
21
+ import * as i16 from "./templates/suggestion-template.directive";
22
+ import * as i17 from "./templates/user-status-template.directive";
16
23
  /**
17
24
  * Represents the [`NgModule`](link:site.data.urls.angular['ngmodules']) for the Chat component.
18
25
  *
@@ -36,6 +43,6 @@ import * as i10 from "./templates/suggestion-template.directive";
36
43
  */
37
44
  export declare class ChatModule {
38
45
  static ɵfac: i0.ɵɵFactoryDeclaration<ChatModule, never>;
39
- static ɵmod: i0.ɵɵNgModuleDeclaration<ChatModule, never, [typeof i1.ChatComponent, typeof i2.CustomMessagesComponent, typeof i3.AttachmentTemplateDirective, typeof i4.MessageTemplateDirective, typeof i5.HeroCardComponent, typeof i6.ChatMessageBoxTemplateDirective, typeof i7.ChatHeaderTemplateDirective, typeof i8.ChatTimestampTemplateDirective, typeof i9.ChatStatusTemplateDirective, typeof i10.ChatSuggestionTemplateDirective], [typeof i1.ChatComponent, typeof i2.CustomMessagesComponent, typeof i3.AttachmentTemplateDirective, typeof i4.MessageTemplateDirective, typeof i5.HeroCardComponent, typeof i6.ChatMessageBoxTemplateDirective, typeof i7.ChatHeaderTemplateDirective, typeof i8.ChatTimestampTemplateDirective, typeof i9.ChatStatusTemplateDirective, typeof i10.ChatSuggestionTemplateDirective]>;
46
+ static ɵmod: i0.ɵɵNgModuleDeclaration<ChatModule, never, [typeof i1.ChatComponent, typeof i2.CustomMessagesComponent, typeof i3.AttachmentTemplateDirective, typeof i4.AuthorMessageContentTemplateDirective, typeof i5.ReceiverMessageContentTemplateDirective, typeof i6.MessageContentTemplateDirective, typeof i7.AuthorMessageTemplateDirective, typeof i8.ReceiverMessageTemplateDirective, typeof i9.MessageTemplateDirective, typeof i10.HeroCardComponent, typeof i11.ChatMessageBoxTemplateDirective, typeof i12.ChatHeaderTemplateDirective, typeof i13.NoDataTemplateDirective, typeof i14.ChatTimestampTemplateDirective, typeof i15.ChatStatusTemplateDirective, typeof i16.ChatSuggestionTemplateDirective, typeof i17.ChatUserStatusTemplateDirective], [typeof i1.ChatComponent, typeof i2.CustomMessagesComponent, typeof i3.AttachmentTemplateDirective, typeof i4.AuthorMessageContentTemplateDirective, typeof i5.ReceiverMessageContentTemplateDirective, typeof i6.MessageContentTemplateDirective, typeof i7.AuthorMessageTemplateDirective, typeof i8.ReceiverMessageTemplateDirective, typeof i9.MessageTemplateDirective, typeof i10.HeroCardComponent, typeof i11.ChatMessageBoxTemplateDirective, typeof i12.ChatHeaderTemplateDirective, typeof i13.NoDataTemplateDirective, typeof i14.ChatTimestampTemplateDirective, typeof i15.ChatStatusTemplateDirective, typeof i16.ChatSuggestionTemplateDirective, typeof i17.ChatUserStatusTemplateDirective]>;
40
47
  static ɵinj: i0.ɵɵInjectorDeclaration<ChatModule>;
41
48
  }
@@ -5,8 +5,10 @@
5
5
  import { ViewContainerRef, ElementRef } from '@angular/core';
6
6
  import { SpeechToTextButtonSettings } from '@progress/kendo-angular-buttons';
7
7
  import { MessageWidthMode } from '../api/message-width-mode';
8
- import { FileAction, FileActionEvent, FileDownloadEvent, Message, MessageAction, MessageActionEvent, MessageToolbarVisibility, SendButtonSettings } from '../api';
8
+ import { FileAction, FileActionEvent, FileDownloadEvent, FilesLayoutMode, Message, MessageAction, MessageActionEvent, MessageSettings, QuickActionsLayoutMode, SendButtonSettings, SuggestionsLayoutMode } from '../api';
9
9
  import { FileSelectSettings } from '@progress/kendo-angular-upload';
10
+ import { ContextMenuComponent } from '@progress/kendo-angular-menu';
11
+ import { TimestampVisibilityMode } from '../api/timestamp-visibility';
10
12
  import * as i0 from "@angular/core";
11
13
  /**
12
14
  * @hidden
@@ -14,19 +16,32 @@ import * as i0 from "@angular/core";
14
16
  export declare class ChatService {
15
17
  authorId: string | number;
16
18
  messageWidthMode: MessageWidthMode;
17
- allowMessageCollapse: boolean;
18
19
  messageToolbarActions: MessageAction[];
19
20
  messageContextMenuActions: MessageAction[];
21
+ calculatedContextMenuActions: MessageAction[];
20
22
  fileActions: FileAction[];
21
- messageToolbarVisibility: MessageToolbarVisibility;
22
23
  toggleMessageState: boolean;
23
24
  reply: Message;
24
25
  messages: Message[];
25
26
  chatElement: ViewContainerRef;
26
27
  messageElementsMap: Map<string | number, ElementRef>;
28
+ messagesContextMenu: ContextMenuComponent;
29
+ activeMessage: Message;
30
+ activeMessageElement: any;
31
+ selectOnMenuClose: boolean;
32
+ active: boolean;
33
+ messageFilesLayout: FilesLayoutMode;
34
+ timestampVisibility: TimestampVisibilityMode;
35
+ showUsername: boolean;
36
+ showAvatar: boolean;
27
37
  private _enableSpeechToText;
28
38
  private _enableFileSelect;
29
39
  private _sendButtonSettings;
40
+ private _suggestionsLayout;
41
+ private _quickActionsLayout;
42
+ _authorMessageSettings: MessageSettings;
43
+ _receiverMessageSettings: MessageSettings;
44
+ private _allowMessageCollapse;
30
45
  private subjects;
31
46
  toolbarAction$: import("rxjs").Observable<MessageActionEvent>;
32
47
  contextMenuAction$: import("rxjs").Observable<MessageActionEvent>;
@@ -34,17 +49,35 @@ export declare class ChatService {
34
49
  fileDownload$: import("rxjs").Observable<FileDownloadEvent>;
35
50
  replyReferenceClick$: import("rxjs").Observable<string | number>;
36
51
  inputValueChange$: import("rxjs").Observable<string>;
52
+ contextMenuVisibilityChange$: import("rxjs").Observable<boolean>;
53
+ suggestionsLayoutChange$: import("rxjs").Observable<SuggestionsLayoutMode>;
54
+ quickActionsLayoutChange$: import("rxjs").Observable<SuggestionsLayoutMode>;
55
+ authorMessageSettingsChange$: import("rxjs").Observable<MessageSettings>;
56
+ receiverMessageSettingsChange$: import("rxjs").Observable<MessageSettings>;
57
+ allowMessageCollapseChange$: import("rxjs").Observable<boolean>;
58
+ set authorMessageSettings(settings: MessageSettings);
59
+ get authorMessageSettings(): MessageSettings;
60
+ set receiverMessageSettings(settings: MessageSettings);
61
+ get receiverMessageSettings(): MessageSettings;
37
62
  set enableSpeechToText(settings: boolean | SpeechToTextButtonSettings);
38
63
  get enableSpeechToText(): SpeechToTextButtonSettings;
39
64
  set enableFileSelect(settings: boolean | FileSelectSettings);
40
65
  get enableFileSelect(): FileSelectSettings;
41
66
  set sendButtonSettings(settings: boolean | SendButtonSettings);
42
67
  get sendButtonSettings(): SendButtonSettings;
68
+ set suggestionsLayout(layoutMode: SuggestionsLayoutMode);
69
+ get suggestionsLayout(): SuggestionsLayoutMode;
70
+ set quickActionsLayout(layoutMode: QuickActionsLayoutMode);
71
+ get quickActionsLayout(): QuickActionsLayoutMode;
72
+ set allowMessageCollapse(value: boolean);
73
+ get allowMessageCollapse(): boolean;
74
+ calculateContextMenuActions(isOwn: boolean): void;
43
75
  emit(subjectKey: string, value?: any): void;
44
76
  getMessageById(id: string | number): Message | undefined;
45
77
  registerMessageElement(messageId: string | number, elementRef: ElementRef): void;
46
78
  unregisterMessageElement(messageId: string | number): void;
47
79
  scrollToMessage(messageId: string | number): void;
80
+ focusActiveMessageElement(): void;
48
81
  private updateComponentSettings;
49
82
  static ɵfac: i0.ɵɵFactoryDeclaration<ChatService, never>;
50
83
  static ɵprov: i0.ɵɵInjectableDeclaration<ChatService>;
@@ -84,12 +84,6 @@ export interface ConversationalUIModelFields {
84
84
  * @default "isPinned"
85
85
  */
86
86
  isPinnedField?: string;
87
- /**
88
- * Field name for the user who pinned the message.
89
- *
90
- * @default "pinnedBy"
91
- */
92
- pinnedByField?: string;
93
87
  /**
94
88
  * Field name for reply-to message ID.
95
89
  *
@@ -0,0 +1,32 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2025 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import { ElementRef, Renderer2, NgZone, AfterViewInit, OnDestroy, EventEmitter } from '@angular/core';
6
+ import { SVGIcon } from '@progress/kendo-svg-icons';
7
+ import { LocalizationService } from '@progress/kendo-angular-l10n';
8
+ import { ScrollButtonType } from './utils';
9
+ import * as i0 from "@angular/core";
10
+ /**
11
+ * @hidden
12
+ */
13
+ export declare class ChatScrollableButtonComponent implements AfterViewInit, OnDestroy {
14
+ host: ElementRef;
15
+ private renderer;
16
+ private ngZone;
17
+ private localization;
18
+ role: string;
19
+ prev: boolean;
20
+ onClick: EventEmitter<ScrollButtonType>;
21
+ get scrollButtonIconClass(): string;
22
+ get scrollButtonSVGIcon(): SVGIcon;
23
+ private chevronLeftIcon;
24
+ private chevronRightIcon;
25
+ private subs;
26
+ constructor(host: ElementRef, renderer: Renderer2, ngZone: NgZone, localization: LocalizationService);
27
+ ngAfterViewInit(): void;
28
+ ngOnDestroy(): void;
29
+ private clickHandler;
30
+ static ɵfac: i0.ɵɵFactoryDeclaration<ChatScrollableButtonComponent, never>;
31
+ static ɵcmp: i0.ɵɵComponentDeclaration<ChatScrollableButtonComponent, "[kendoChatScrollableButton]", never, { "prev": { "alias": "prev"; "required": false; }; }, { "onClick": "onClick"; }, never, never, true, never>;
32
+ }