@progress/kendo-angular-conversational-ui 21.1.1-develop.2 → 21.2.0-develop.10
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.
- package/chat/chat.component.d.ts +2 -0
- package/chat/message-list.component.d.ts +2 -2
- package/codemods/utils.js +805 -394
- package/codemods/v20/chat-user.js +9 -12
- package/codemods/v21/chat-messagetoolbarvisibility.js +9 -13
- package/codemods/v21/chat-pinnedbyfield.js +1 -2
- package/esm2022/ai-prompt/aiprompt.component.mjs +155 -139
- package/esm2022/ai-prompt/common/output-card.component.mjs +81 -83
- package/esm2022/ai-prompt/common/toolbar-focusable.directive.mjs +2 -2
- package/esm2022/ai-prompt/views/output-view.component.mjs +27 -29
- package/esm2022/ai-prompt/views/prompt-view.component.mjs +150 -135
- package/esm2022/chat/attachment.component.mjs +53 -37
- package/esm2022/chat/cards/hero-card.component.mjs +48 -35
- package/esm2022/chat/chat-file.component.mjs +32 -29
- package/esm2022/chat/chat-view.mjs +2 -2
- package/esm2022/chat/chat.component.mjs +259 -242
- package/esm2022/chat/message-attachments.component.mjs +60 -55
- package/esm2022/chat/message-box.component.mjs +203 -183
- package/esm2022/chat/message-list.component.mjs +249 -209
- package/esm2022/chat/message-reference-content.component.mjs +30 -19
- package/esm2022/chat/message.component.mjs +301 -281
- package/esm2022/chat/suggested-actions.component.mjs +142 -134
- package/esm2022/inline-ai-prompt/inlineaiprompt-content.component.mjs +205 -179
- package/esm2022/package-metadata.mjs +2 -2
- package/fesm2022/progress-kendo-angular-conversational-ui.mjs +1988 -1777
- package/package.json +14 -14
- package/codemods/template-transformer/index.js +0 -93
|
@@ -18,7 +18,7 @@ import { isChanged, isPresent, processCssValue } from '@progress/kendo-angular-c
|
|
|
18
18
|
import { ChatService } from './common/chat.service';
|
|
19
19
|
import { AppBarComponent } from "@progress/kendo-angular-navigation";
|
|
20
20
|
import { ChatHeaderTemplateDirective } from './templates/header-template.directive';
|
|
21
|
-
import {
|
|
21
|
+
import { NgTemplateOutlet } from '@angular/common';
|
|
22
22
|
import { KENDO_BUTTON } from '@progress/kendo-angular-buttons';
|
|
23
23
|
import { pinIcon, xIcon } from '@progress/kendo-svg-icons';
|
|
24
24
|
import { IconWrapperComponent } from '@progress/kendo-angular-icons';
|
|
@@ -350,7 +350,12 @@ export class ChatComponent {
|
|
|
350
350
|
* @hidden
|
|
351
351
|
*/
|
|
352
352
|
get contextMenuActions() {
|
|
353
|
-
|
|
353
|
+
const currentActions = this.chatService.calculatedContextMenuActions;
|
|
354
|
+
if (currentActions !== this._lastContextMenuActionsReference) {
|
|
355
|
+
this._cachedContextMenuActions = transformActions(currentActions);
|
|
356
|
+
this._lastContextMenuActionsReference = currentActions;
|
|
357
|
+
}
|
|
358
|
+
return this._cachedContextMenuActions;
|
|
354
359
|
}
|
|
355
360
|
/**
|
|
356
361
|
* @hidden
|
|
@@ -382,6 +387,8 @@ export class ChatComponent {
|
|
|
382
387
|
_cachedProcessedMessages = [];
|
|
383
388
|
_lastMessagesReference = null;
|
|
384
389
|
_lastModelFields = null;
|
|
390
|
+
_cachedContextMenuActions = [];
|
|
391
|
+
_lastContextMenuActionsReference = null;
|
|
385
392
|
constructor(localization, zone, renderer, element, chatService) {
|
|
386
393
|
this.localization = localization;
|
|
387
394
|
this.zone = zone;
|
|
@@ -571,7 +578,7 @@ export class ChatComponent {
|
|
|
571
578
|
});
|
|
572
579
|
}
|
|
573
580
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChatComponent, deps: [{ token: i1.LocalizationService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i2.ChatService }], target: i0.ɵɵFactoryTarget.Component });
|
|
574
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
581
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ChatComponent, isStandalone: true, selector: "kendo-chat", inputs: { messages: "messages", authorId: "authorId", messageBoxType: "messageBoxType", height: "height", width: "width", placeholder: "placeholder", messageWidthMode: "messageWidthMode", timestampVisibility: "timestampVisibility", showUsername: "showUsername", showAvatar: "showAvatar", allowMessageCollapse: "allowMessageCollapse", enableSpeechToText: "enableSpeechToText", enableFileSelect: "enableFileSelect", messageToolbarActions: "messageToolbarActions", inputValue: "inputValue", authorMessageSettings: "authorMessageSettings", receiverMessageSettings: "receiverMessageSettings", messageContextMenuActions: "messageContextMenuActions", fileActions: "fileActions", messageFilesLayout: "messageFilesLayout", suggestionsLayout: "suggestionsLayout", quickActionsLayout: "quickActionsLayout", suggestions: "suggestions", sendButtonSettings: "sendButtonSettings", modelFields: "modelFields" }, outputs: { sendMessage: "sendMessage", toolbarActionClick: "toolbarActionClick", contextMenuActionClick: "contextMenuActionClick", fileActionClick: "fileActionClick", download: "download", executeAction: "executeAction", suggestionExecute: "suggestionExecute", fileSelect: "fileSelect", fileRemove: "fileRemove", unpin: "unpin", inputValueChange: "inputValueChange" }, host: { properties: { "class": "this.className", "attr.dir": "this.dirAttr" } }, providers: [
|
|
575
582
|
LocalizationService,
|
|
576
583
|
ChatService,
|
|
577
584
|
SuggestionsScrollService,
|
|
@@ -581,139 +588,144 @@ export class ChatComponent {
|
|
|
581
588
|
}
|
|
582
589
|
], queries: [{ propertyName: "attachmentTemplate", first: true, predicate: AttachmentTemplateDirective, descendants: true }, { propertyName: "chatHeaderTemplate", first: true, predicate: ChatHeaderTemplateDirective, descendants: true }, { propertyName: "chatNoDataTemplate", first: true, predicate: NoDataTemplateDirective, descendants: true }, { propertyName: "authorMessageContentTemplate", first: true, predicate: AuthorMessageContentTemplateDirective, descendants: true }, { propertyName: "receiverMessageContentTemplate", first: true, predicate: ReceiverMessageContentTemplateDirective, descendants: true }, { propertyName: "messageContentTemplate", first: true, predicate: MessageContentTemplateDirective, descendants: true }, { propertyName: "authorMessageTemplate", first: true, predicate: AuthorMessageTemplateDirective, descendants: true }, { propertyName: "receiverMessageTemplate", first: true, predicate: ReceiverMessageTemplateDirective, descendants: true }, { propertyName: "messageTemplate", first: true, predicate: MessageTemplateDirective, descendants: true }, { propertyName: "timestampTemplate", first: true, predicate: ChatTimestampTemplateDirective, descendants: true }, { propertyName: "suggestionTemplate", first: true, predicate: ChatSuggestionTemplateDirective, descendants: true }, { propertyName: "statusTemplate", first: true, predicate: ChatStatusTemplateDirective, descendants: true }, { propertyName: "messageBoxTemplate", first: true, predicate: ChatMessageBoxTemplateDirective, descendants: true }, { propertyName: "userStatusTemplate", first: true, predicate: ChatUserStatusTemplateDirective, descendants: true }], viewQueries: [{ propertyName: "messagesContextMenu", first: true, predicate: ["messagesContextMenu"], descendants: true }, { propertyName: "messageBox", first: true, predicate: ["messageBox"], descendants: true }, { propertyName: "messageList", first: true, predicate: ["messageList"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: `
|
|
583
590
|
<ng-container kendoChatLocalizedMessages
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
591
|
+
i18n-deletedMessageSenderText="kendo.chat.deletedMessageSenderText|The text that is displayed when the sender deletes a message"
|
|
592
|
+
deletedMessageSenderText="You removed this message."
|
|
593
|
+
|
|
594
|
+
i18n-deletedMessageReceiverText="kendo.chat.deletedMessageReceiverText|The text that is displayed when the receiver deletes a message"
|
|
595
|
+
deletedMessageReceiverText="This message was removed by its sender."
|
|
596
|
+
|
|
597
|
+
i18n-messagePlaceholder="kendo.chat.messagePlaceholder|The placholder text of the message text input"
|
|
598
|
+
messagePlaceholder="Type a message..."
|
|
599
|
+
|
|
600
|
+
i18n-send="kendo.chat.send|The text for the Send button"
|
|
601
|
+
send="Send..."
|
|
602
|
+
|
|
603
|
+
i18n-messageListLabel="kendo.chat.messageListLabel|The label text for the Message list"
|
|
604
|
+
messageListLabel="Message list"
|
|
605
|
+
|
|
606
|
+
i18n-messageBoxInputLabel="kendo.chat.messageBoxInputLabel|The label text for the Message input box"
|
|
607
|
+
messageBoxInputLabel="Message"
|
|
608
|
+
|
|
609
|
+
i18n-messageAttachmentLeftArrow="kendo.chat.messageAttachmentLeftArrow|The text for the left arrow of the message attachments"
|
|
610
|
+
messageAttachmentLeftArrow="Previous item"
|
|
611
|
+
|
|
612
|
+
i18n-messageAttachmentRightArrow="kendo.chat.messageAttachmentRightArrow|The text for the right arrow of the message attachments"
|
|
613
|
+
messageAttachmentRightArrow="Next item"
|
|
614
|
+
|
|
615
|
+
i18n-speechToTextButtonTitle="kendo.chat.speechToTextButtonTitle|Sets the Speech to Text button title."
|
|
616
|
+
speechToTextButtonTitle="Speech to Text"
|
|
617
|
+
|
|
618
|
+
i18n-fileSelectButtonTitle="kendo.chat.fileSelectButtonTitle|Sets the File Select button title."
|
|
619
|
+
fileSelectButtonTitle="Select files"
|
|
620
|
+
|
|
621
|
+
i18n-removeReplyTitle="kendo.chat.removeReplyTitle|Sets the title of the icon which removes the reply reference in the Message Box."
|
|
622
|
+
removeReplyTitle="Remove reply"
|
|
623
|
+
|
|
624
|
+
i18n-removeFileTitle="kendo.chat.removeFileTitle|Sets the title of the icon which removes a selected file in the Message Box."
|
|
625
|
+
removeFileTitle="Remove file"
|
|
626
|
+
|
|
627
|
+
i18n-expandTitle="kendo.chat.expandTitle|Sets the title of the icon which demonstrates that the message can be expanded."
|
|
628
|
+
expandTitle="Expand message"
|
|
629
|
+
|
|
630
|
+
i18n-collapseTitle="kendo.chat.collapseTitle|Sets the title of the icon which demonstrates that the message can be collapsed."
|
|
631
|
+
collapseTitle="Collapse message"
|
|
632
|
+
|
|
633
|
+
i18n-fileActionsTitle="kendo.chat.fileActionsTitle|Sets the title of the DropDownButton which opens the File actions."
|
|
634
|
+
fileActionsTitle="File actions"
|
|
635
|
+
|
|
636
|
+
i18n-downloadAllFilesText="kendo.chat.downloadAllFilesText|Sets the text that is displayed in the download section of the message."
|
|
637
|
+
downloadAllFilesText="Download all"
|
|
638
|
+
|
|
639
|
+
i18n-previousSuggestionsButtonTitle="kendo.chat.previousSuggestionsButtonTitle|The title of the button that scrolls to the previous suggestions"
|
|
640
|
+
previousSuggestionsButtonTitle="Scroll left"
|
|
641
|
+
|
|
642
|
+
i18n-nextSuggestionsButtonTitle="kendo.chat.nextSuggestionsButtonTitle|The title of the button that scrolls to the next suggestions"
|
|
643
|
+
nextSuggestionsButtonTitle="Scroll right"
|
|
644
|
+
>
|
|
638
645
|
</ng-container>
|
|
639
|
-
|
|
640
|
-
|
|
646
|
+
|
|
647
|
+
@if (chatHeaderTemplate) {
|
|
648
|
+
<kendo-appbar class="k-chat-header" positionMode="sticky" themeColor="inherit">
|
|
641
649
|
<ng-container *ngTemplateOutlet="chatHeaderTemplate.templateRef"></ng-container>
|
|
642
|
-
|
|
643
|
-
|
|
650
|
+
</kendo-appbar>
|
|
651
|
+
}
|
|
652
|
+
@if (pinnedMessage) {
|
|
653
|
+
<div class="k-message-reference k-message-reference-receiver k-message-pinned" (click)="scrollToPinnedMessage()">
|
|
644
654
|
<kendo-icon-wrapper
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
655
|
+
size="xlarge"
|
|
656
|
+
name="pin"
|
|
657
|
+
[svgIcon]="pinIcon"
|
|
658
|
+
>
|
|
649
659
|
</kendo-icon-wrapper>
|
|
650
660
|
<chat-message-reference-content [message]="pinnedMessage"></chat-message-reference-content>
|
|
651
661
|
<span class="k-spacer"></span>
|
|
652
662
|
<button kendoButton [svgIcon]="deleteIcon" (click)="unpin.emit(pinnedMessage)" fillMode="flat"></button>
|
|
653
|
-
|
|
663
|
+
</div>
|
|
664
|
+
}
|
|
654
665
|
<div
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
666
|
+
#messageList
|
|
667
|
+
class="k-message-list"
|
|
668
|
+
aria-live="polite"
|
|
669
|
+
role="log"
|
|
670
|
+
kendoChatScrollAnchor
|
|
671
|
+
[attr.aria-label]="textFor('messageListLabel')"
|
|
672
|
+
#anchor="scrollAnchor"
|
|
673
|
+
[(autoScroll)]="autoScroll"
|
|
674
|
+
>
|
|
675
|
+
@if (processedMessages && processedMessages.length === 0) {
|
|
676
|
+
<div class="k-message-list-content k-message-list-content-empty">
|
|
677
|
+
<ng-template
|
|
678
|
+
[ngTemplateOutlet]="chatNoDataTemplate?.templateRef">
|
|
679
|
+
</ng-template>
|
|
668
680
|
</div>
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
681
|
+
} @else {
|
|
682
|
+
<kendo-chat-message-list
|
|
683
|
+
[messages]="processedMessages"
|
|
684
|
+
[authorMessageContentTemplate]="authorMessageContentTemplate"
|
|
685
|
+
[receiverMessageContentTemplate]="receiverMessageContentTemplate"
|
|
686
|
+
[messageContentTemplate]="messageContentTemplate"
|
|
687
|
+
[authorMessageTemplate]="authorMessageTemplate"
|
|
688
|
+
[receiverMessageTemplate]="receiverMessageTemplate"
|
|
689
|
+
[messageTemplate]="messageTemplate"
|
|
690
|
+
[timestampTemplate]="timestampTemplate"
|
|
691
|
+
[statusTemplate]="statusTemplate"
|
|
692
|
+
[userStatusTemplate]="userStatusTemplate"
|
|
693
|
+
[localization]="localizationText"
|
|
694
|
+
[attachmentTemplate]="attachmentTemplate"
|
|
695
|
+
[authorId]="authorId"
|
|
696
|
+
(executeAction)="dispatchAction($event)"
|
|
697
|
+
(resize)="anchor.scrollToBottom()"
|
|
698
|
+
(navigate)="this.autoScroll = false"
|
|
699
|
+
>
|
|
700
|
+
</kendo-chat-message-list>
|
|
701
|
+
}
|
|
690
702
|
</div>
|
|
691
703
|
<kendo-message-box
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
704
|
+
#messageBox
|
|
705
|
+
[messageBoxTemplate]="messageBoxTemplate"
|
|
706
|
+
[suggestionTemplate]="suggestionTemplate"
|
|
707
|
+
[suggestions]="suggestions"
|
|
708
|
+
[placeholder]="placeholder"
|
|
709
|
+
[authorId]="authorId"
|
|
710
|
+
[autoScroll]="autoScroll"
|
|
711
|
+
[inputValue]="inputValue"
|
|
712
|
+
[localization]="localizationText"
|
|
713
|
+
(sendMessage)="sendMessage.emit($event)"
|
|
714
|
+
(executeSuggestion)="suggestionExecute.emit($event)"
|
|
715
|
+
(fileSelect)="fileSelect.emit($event)"
|
|
716
|
+
(fileRemove)="fileRemove.emit($event)"
|
|
717
|
+
>
|
|
706
718
|
</kendo-message-box>
|
|
707
|
-
|
|
719
|
+
|
|
708
720
|
<kendo-contextmenu
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
721
|
+
#messagesContextMenu
|
|
722
|
+
[items]="contextMenuActions"
|
|
723
|
+
[popupAlign]="{ horizontal: 'right', vertical: 'top' }"
|
|
724
|
+
[collision]="{ horizontal: 'flip', vertical: 'flip'}"
|
|
725
|
+
(popupClose)="handleMenuClose($event)"
|
|
726
|
+
(select)="onContextMenuAction($event.item.originalAction)"
|
|
715
727
|
></kendo-contextmenu>
|
|
716
|
-
|
|
728
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoChatLocalizedMessages]" }, { kind: "directive", type: ScrollAnchorDirective, selector: "[kendoChatScrollAnchor]", inputs: ["autoScroll"], outputs: ["autoScrollChange"], exportAs: ["scrollAnchor"] }, { kind: "component", type: MessageListComponent, selector: "kendo-chat-message-list", inputs: ["messages", "attachmentTemplate", "authorMessageContentTemplate", "receiverMessageContentTemplate", "messageContentTemplate", "authorMessageTemplate", "receiverMessageTemplate", "messageTemplate", "timestampTemplate", "statusTemplate", "userStatusTemplate", "localization", "authorId"], outputs: ["executeAction", "navigate", "resize"] }, { kind: "component", type: MessageBoxComponent, selector: "kendo-message-box", inputs: ["authorId", "autoScroll", "suggestions", "placeholder", "inputValue", "localization", "messageBoxTemplate", "suggestionTemplate"], outputs: ["sendMessage", "executeSuggestion", "fileSelect", "fileRemove"] }, { kind: "component", type: MessageReferenceComponent, selector: "chat-message-reference-content", inputs: ["message"] }, { kind: "component", type: AppBarComponent, selector: "kendo-appbar", inputs: ["position", "positionMode", "themeColor"], exportAs: ["kendoAppBar"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ContextMenuComponent, selector: "kendo-contextmenu", inputs: ["showOn", "target", "filter", "alignToAnchor", "vertical", "popupAnimate", "popupAlign", "anchorAlign", "collision", "appendTo", "ariaLabel"], outputs: ["popupOpen", "popupClose", "select", "open", "close"], exportAs: ["kendoContextMenu"] }] });
|
|
717
729
|
}
|
|
718
730
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChatComponent, decorators: [{
|
|
719
731
|
type: Component,
|
|
@@ -730,141 +742,146 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
730
742
|
selector: 'kendo-chat',
|
|
731
743
|
template: `
|
|
732
744
|
<ng-container kendoChatLocalizedMessages
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
745
|
+
i18n-deletedMessageSenderText="kendo.chat.deletedMessageSenderText|The text that is displayed when the sender deletes a message"
|
|
746
|
+
deletedMessageSenderText="You removed this message."
|
|
747
|
+
|
|
748
|
+
i18n-deletedMessageReceiverText="kendo.chat.deletedMessageReceiverText|The text that is displayed when the receiver deletes a message"
|
|
749
|
+
deletedMessageReceiverText="This message was removed by its sender."
|
|
750
|
+
|
|
751
|
+
i18n-messagePlaceholder="kendo.chat.messagePlaceholder|The placholder text of the message text input"
|
|
752
|
+
messagePlaceholder="Type a message..."
|
|
753
|
+
|
|
754
|
+
i18n-send="kendo.chat.send|The text for the Send button"
|
|
755
|
+
send="Send..."
|
|
756
|
+
|
|
757
|
+
i18n-messageListLabel="kendo.chat.messageListLabel|The label text for the Message list"
|
|
758
|
+
messageListLabel="Message list"
|
|
759
|
+
|
|
760
|
+
i18n-messageBoxInputLabel="kendo.chat.messageBoxInputLabel|The label text for the Message input box"
|
|
761
|
+
messageBoxInputLabel="Message"
|
|
762
|
+
|
|
763
|
+
i18n-messageAttachmentLeftArrow="kendo.chat.messageAttachmentLeftArrow|The text for the left arrow of the message attachments"
|
|
764
|
+
messageAttachmentLeftArrow="Previous item"
|
|
765
|
+
|
|
766
|
+
i18n-messageAttachmentRightArrow="kendo.chat.messageAttachmentRightArrow|The text for the right arrow of the message attachments"
|
|
767
|
+
messageAttachmentRightArrow="Next item"
|
|
768
|
+
|
|
769
|
+
i18n-speechToTextButtonTitle="kendo.chat.speechToTextButtonTitle|Sets the Speech to Text button title."
|
|
770
|
+
speechToTextButtonTitle="Speech to Text"
|
|
771
|
+
|
|
772
|
+
i18n-fileSelectButtonTitle="kendo.chat.fileSelectButtonTitle|Sets the File Select button title."
|
|
773
|
+
fileSelectButtonTitle="Select files"
|
|
774
|
+
|
|
775
|
+
i18n-removeReplyTitle="kendo.chat.removeReplyTitle|Sets the title of the icon which removes the reply reference in the Message Box."
|
|
776
|
+
removeReplyTitle="Remove reply"
|
|
777
|
+
|
|
778
|
+
i18n-removeFileTitle="kendo.chat.removeFileTitle|Sets the title of the icon which removes a selected file in the Message Box."
|
|
779
|
+
removeFileTitle="Remove file"
|
|
780
|
+
|
|
781
|
+
i18n-expandTitle="kendo.chat.expandTitle|Sets the title of the icon which demonstrates that the message can be expanded."
|
|
782
|
+
expandTitle="Expand message"
|
|
783
|
+
|
|
784
|
+
i18n-collapseTitle="kendo.chat.collapseTitle|Sets the title of the icon which demonstrates that the message can be collapsed."
|
|
785
|
+
collapseTitle="Collapse message"
|
|
786
|
+
|
|
787
|
+
i18n-fileActionsTitle="kendo.chat.fileActionsTitle|Sets the title of the DropDownButton which opens the File actions."
|
|
788
|
+
fileActionsTitle="File actions"
|
|
789
|
+
|
|
790
|
+
i18n-downloadAllFilesText="kendo.chat.downloadAllFilesText|Sets the text that is displayed in the download section of the message."
|
|
791
|
+
downloadAllFilesText="Download all"
|
|
792
|
+
|
|
793
|
+
i18n-previousSuggestionsButtonTitle="kendo.chat.previousSuggestionsButtonTitle|The title of the button that scrolls to the previous suggestions"
|
|
794
|
+
previousSuggestionsButtonTitle="Scroll left"
|
|
795
|
+
|
|
796
|
+
i18n-nextSuggestionsButtonTitle="kendo.chat.nextSuggestionsButtonTitle|The title of the button that scrolls to the next suggestions"
|
|
797
|
+
nextSuggestionsButtonTitle="Scroll right"
|
|
798
|
+
>
|
|
787
799
|
</ng-container>
|
|
788
|
-
|
|
789
|
-
|
|
800
|
+
|
|
801
|
+
@if (chatHeaderTemplate) {
|
|
802
|
+
<kendo-appbar class="k-chat-header" positionMode="sticky" themeColor="inherit">
|
|
790
803
|
<ng-container *ngTemplateOutlet="chatHeaderTemplate.templateRef"></ng-container>
|
|
791
|
-
|
|
792
|
-
|
|
804
|
+
</kendo-appbar>
|
|
805
|
+
}
|
|
806
|
+
@if (pinnedMessage) {
|
|
807
|
+
<div class="k-message-reference k-message-reference-receiver k-message-pinned" (click)="scrollToPinnedMessage()">
|
|
793
808
|
<kendo-icon-wrapper
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
809
|
+
size="xlarge"
|
|
810
|
+
name="pin"
|
|
811
|
+
[svgIcon]="pinIcon"
|
|
812
|
+
>
|
|
798
813
|
</kendo-icon-wrapper>
|
|
799
814
|
<chat-message-reference-content [message]="pinnedMessage"></chat-message-reference-content>
|
|
800
815
|
<span class="k-spacer"></span>
|
|
801
816
|
<button kendoButton [svgIcon]="deleteIcon" (click)="unpin.emit(pinnedMessage)" fillMode="flat"></button>
|
|
802
|
-
|
|
817
|
+
</div>
|
|
818
|
+
}
|
|
803
819
|
<div
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
820
|
+
#messageList
|
|
821
|
+
class="k-message-list"
|
|
822
|
+
aria-live="polite"
|
|
823
|
+
role="log"
|
|
824
|
+
kendoChatScrollAnchor
|
|
825
|
+
[attr.aria-label]="textFor('messageListLabel')"
|
|
826
|
+
#anchor="scrollAnchor"
|
|
827
|
+
[(autoScroll)]="autoScroll"
|
|
828
|
+
>
|
|
829
|
+
@if (processedMessages && processedMessages.length === 0) {
|
|
830
|
+
<div class="k-message-list-content k-message-list-content-empty">
|
|
831
|
+
<ng-template
|
|
832
|
+
[ngTemplateOutlet]="chatNoDataTemplate?.templateRef">
|
|
833
|
+
</ng-template>
|
|
817
834
|
</div>
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
835
|
+
} @else {
|
|
836
|
+
<kendo-chat-message-list
|
|
837
|
+
[messages]="processedMessages"
|
|
838
|
+
[authorMessageContentTemplate]="authorMessageContentTemplate"
|
|
839
|
+
[receiverMessageContentTemplate]="receiverMessageContentTemplate"
|
|
840
|
+
[messageContentTemplate]="messageContentTemplate"
|
|
841
|
+
[authorMessageTemplate]="authorMessageTemplate"
|
|
842
|
+
[receiverMessageTemplate]="receiverMessageTemplate"
|
|
843
|
+
[messageTemplate]="messageTemplate"
|
|
844
|
+
[timestampTemplate]="timestampTemplate"
|
|
845
|
+
[statusTemplate]="statusTemplate"
|
|
846
|
+
[userStatusTemplate]="userStatusTemplate"
|
|
847
|
+
[localization]="localizationText"
|
|
848
|
+
[attachmentTemplate]="attachmentTemplate"
|
|
849
|
+
[authorId]="authorId"
|
|
850
|
+
(executeAction)="dispatchAction($event)"
|
|
851
|
+
(resize)="anchor.scrollToBottom()"
|
|
852
|
+
(navigate)="this.autoScroll = false"
|
|
853
|
+
>
|
|
854
|
+
</kendo-chat-message-list>
|
|
855
|
+
}
|
|
839
856
|
</div>
|
|
840
857
|
<kendo-message-box
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
858
|
+
#messageBox
|
|
859
|
+
[messageBoxTemplate]="messageBoxTemplate"
|
|
860
|
+
[suggestionTemplate]="suggestionTemplate"
|
|
861
|
+
[suggestions]="suggestions"
|
|
862
|
+
[placeholder]="placeholder"
|
|
863
|
+
[authorId]="authorId"
|
|
864
|
+
[autoScroll]="autoScroll"
|
|
865
|
+
[inputValue]="inputValue"
|
|
866
|
+
[localization]="localizationText"
|
|
867
|
+
(sendMessage)="sendMessage.emit($event)"
|
|
868
|
+
(executeSuggestion)="suggestionExecute.emit($event)"
|
|
869
|
+
(fileSelect)="fileSelect.emit($event)"
|
|
870
|
+
(fileRemove)="fileRemove.emit($event)"
|
|
871
|
+
>
|
|
855
872
|
</kendo-message-box>
|
|
856
|
-
|
|
873
|
+
|
|
857
874
|
<kendo-contextmenu
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
875
|
+
#messagesContextMenu
|
|
876
|
+
[items]="contextMenuActions"
|
|
877
|
+
[popupAlign]="{ horizontal: 'right', vertical: 'top' }"
|
|
878
|
+
[collision]="{ horizontal: 'flip', vertical: 'flip'}"
|
|
879
|
+
(popupClose)="handleMenuClose($event)"
|
|
880
|
+
(select)="onContextMenuAction($event.item.originalAction)"
|
|
864
881
|
></kendo-contextmenu>
|
|
865
|
-
|
|
882
|
+
`,
|
|
866
883
|
standalone: true,
|
|
867
|
-
imports: [LocalizedMessagesDirective, ScrollAnchorDirective, MessageListComponent, MessageBoxComponent, MessageReferenceComponent, AppBarComponent, NgTemplateOutlet,
|
|
884
|
+
imports: [LocalizedMessagesDirective, ScrollAnchorDirective, MessageListComponent, MessageBoxComponent, MessageReferenceComponent, AppBarComponent, NgTemplateOutlet, IconWrapperComponent, KENDO_BUTTON, ContextMenuComponent]
|
|
868
885
|
}]
|
|
869
886
|
}], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i2.ChatService }], propDecorators: { messages: [{
|
|
870
887
|
type: Input
|