@progress/kendo-angular-conversational-ui 21.1.1-develop.2 → 21.2.0-develop.1
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/message-list.component.d.ts +2 -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/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.component.mjs +251 -241
- package/esm2022/chat/message-attachments.component.mjs +58 -53
- package/esm2022/chat/message-box.component.mjs +203 -183
- package/esm2022/chat/message-list.component.mjs +247 -207
- package/esm2022/chat/message-reference-content.component.mjs +30 -19
- package/esm2022/chat/message.component.mjs +307 -279
- package/esm2022/chat/suggested-actions.component.mjs +139 -131
- 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 +1979 -1767
- package/package.json +14 -14
|
@@ -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';
|
|
@@ -571,7 +571,7 @@ export class ChatComponent {
|
|
|
571
571
|
});
|
|
572
572
|
}
|
|
573
573
|
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: "
|
|
574
|
+
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
575
|
LocalizationService,
|
|
576
576
|
ChatService,
|
|
577
577
|
SuggestionsScrollService,
|
|
@@ -581,139 +581,144 @@ export class ChatComponent {
|
|
|
581
581
|
}
|
|
582
582
|
], 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
583
|
<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
|
-
|
|
584
|
+
i18n-deletedMessageSenderText="kendo.chat.deletedMessageSenderText|The text that is displayed when the sender deletes a message"
|
|
585
|
+
deletedMessageSenderText="You removed this message."
|
|
586
|
+
|
|
587
|
+
i18n-deletedMessageReceiverText="kendo.chat.deletedMessageReceiverText|The text that is displayed when the receiver deletes a message"
|
|
588
|
+
deletedMessageReceiverText="This message was removed by its sender."
|
|
589
|
+
|
|
590
|
+
i18n-messagePlaceholder="kendo.chat.messagePlaceholder|The placholder text of the message text input"
|
|
591
|
+
messagePlaceholder="Type a message..."
|
|
592
|
+
|
|
593
|
+
i18n-send="kendo.chat.send|The text for the Send button"
|
|
594
|
+
send="Send..."
|
|
595
|
+
|
|
596
|
+
i18n-messageListLabel="kendo.chat.messageListLabel|The label text for the Message list"
|
|
597
|
+
messageListLabel="Message list"
|
|
598
|
+
|
|
599
|
+
i18n-messageBoxInputLabel="kendo.chat.messageBoxInputLabel|The label text for the Message input box"
|
|
600
|
+
messageBoxInputLabel="Message"
|
|
601
|
+
|
|
602
|
+
i18n-messageAttachmentLeftArrow="kendo.chat.messageAttachmentLeftArrow|The text for the left arrow of the message attachments"
|
|
603
|
+
messageAttachmentLeftArrow="Previous item"
|
|
604
|
+
|
|
605
|
+
i18n-messageAttachmentRightArrow="kendo.chat.messageAttachmentRightArrow|The text for the right arrow of the message attachments"
|
|
606
|
+
messageAttachmentRightArrow="Next item"
|
|
607
|
+
|
|
608
|
+
i18n-speechToTextButtonTitle="kendo.chat.speechToTextButtonTitle|Sets the Speech to Text button title."
|
|
609
|
+
speechToTextButtonTitle="Speech to Text"
|
|
610
|
+
|
|
611
|
+
i18n-fileSelectButtonTitle="kendo.chat.fileSelectButtonTitle|Sets the File Select button title."
|
|
612
|
+
fileSelectButtonTitle="Select files"
|
|
613
|
+
|
|
614
|
+
i18n-removeReplyTitle="kendo.chat.removeReplyTitle|Sets the title of the icon which removes the reply reference in the Message Box."
|
|
615
|
+
removeReplyTitle="Remove reply"
|
|
616
|
+
|
|
617
|
+
i18n-removeFileTitle="kendo.chat.removeFileTitle|Sets the title of the icon which removes a selected file in the Message Box."
|
|
618
|
+
removeFileTitle="Remove file"
|
|
619
|
+
|
|
620
|
+
i18n-expandTitle="kendo.chat.expandTitle|Sets the title of the icon which demonstrates that the message can be expanded."
|
|
621
|
+
expandTitle="Expand message"
|
|
622
|
+
|
|
623
|
+
i18n-collapseTitle="kendo.chat.collapseTitle|Sets the title of the icon which demonstrates that the message can be collapsed."
|
|
624
|
+
collapseTitle="Collapse message"
|
|
625
|
+
|
|
626
|
+
i18n-fileActionsTitle="kendo.chat.fileActionsTitle|Sets the title of the DropDownButton which opens the File actions."
|
|
627
|
+
fileActionsTitle="File actions"
|
|
628
|
+
|
|
629
|
+
i18n-downloadAllFilesText="kendo.chat.downloadAllFilesText|Sets the text that is displayed in the download section of the message."
|
|
630
|
+
downloadAllFilesText="Download all"
|
|
631
|
+
|
|
632
|
+
i18n-previousSuggestionsButtonTitle="kendo.chat.previousSuggestionsButtonTitle|The title of the button that scrolls to the previous suggestions"
|
|
633
|
+
previousSuggestionsButtonTitle="Scroll left"
|
|
634
|
+
|
|
635
|
+
i18n-nextSuggestionsButtonTitle="kendo.chat.nextSuggestionsButtonTitle|The title of the button that scrolls to the next suggestions"
|
|
636
|
+
nextSuggestionsButtonTitle="Scroll right"
|
|
637
|
+
>
|
|
638
638
|
</ng-container>
|
|
639
|
-
|
|
640
|
-
|
|
639
|
+
|
|
640
|
+
@if (chatHeaderTemplate) {
|
|
641
|
+
<kendo-appbar class="k-chat-header" positionMode="sticky" themeColor="inherit">
|
|
641
642
|
<ng-container *ngTemplateOutlet="chatHeaderTemplate.templateRef"></ng-container>
|
|
642
|
-
|
|
643
|
-
|
|
643
|
+
</kendo-appbar>
|
|
644
|
+
}
|
|
645
|
+
@if (pinnedMessage) {
|
|
646
|
+
<div class="k-message-reference k-message-reference-receiver k-message-pinned" (click)="scrollToPinnedMessage()">
|
|
644
647
|
<kendo-icon-wrapper
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
648
|
+
size="xlarge"
|
|
649
|
+
name="pin"
|
|
650
|
+
[svgIcon]="pinIcon"
|
|
651
|
+
>
|
|
649
652
|
</kendo-icon-wrapper>
|
|
650
653
|
<chat-message-reference-content [message]="pinnedMessage"></chat-message-reference-content>
|
|
651
654
|
<span class="k-spacer"></span>
|
|
652
655
|
<button kendoButton [svgIcon]="deleteIcon" (click)="unpin.emit(pinnedMessage)" fillMode="flat"></button>
|
|
653
|
-
|
|
656
|
+
</div>
|
|
657
|
+
}
|
|
654
658
|
<div
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
659
|
+
#messageList
|
|
660
|
+
class="k-message-list"
|
|
661
|
+
aria-live="polite"
|
|
662
|
+
role="log"
|
|
663
|
+
kendoChatScrollAnchor
|
|
664
|
+
[attr.aria-label]="textFor('messageListLabel')"
|
|
665
|
+
#anchor="scrollAnchor"
|
|
666
|
+
[(autoScroll)]="autoScroll"
|
|
667
|
+
>
|
|
668
|
+
@if (processedMessages && processedMessages.length === 0) {
|
|
669
|
+
<div class="k-message-list-content k-message-list-content-empty">
|
|
670
|
+
<ng-template
|
|
671
|
+
[ngTemplateOutlet]="chatNoDataTemplate?.templateRef">
|
|
672
|
+
</ng-template>
|
|
668
673
|
</div>
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
674
|
+
} @else {
|
|
675
|
+
<kendo-chat-message-list
|
|
676
|
+
[messages]="processedMessages"
|
|
677
|
+
[authorMessageContentTemplate]="authorMessageContentTemplate"
|
|
678
|
+
[receiverMessageContentTemplate]="receiverMessageContentTemplate"
|
|
679
|
+
[messageContentTemplate]="messageContentTemplate"
|
|
680
|
+
[authorMessageTemplate]="authorMessageTemplate"
|
|
681
|
+
[receiverMessageTemplate]="receiverMessageTemplate"
|
|
682
|
+
[messageTemplate]="messageTemplate"
|
|
683
|
+
[timestampTemplate]="timestampTemplate"
|
|
684
|
+
[statusTemplate]="statusTemplate"
|
|
685
|
+
[userStatusTemplate]="userStatusTemplate"
|
|
686
|
+
[localization]="localizationText"
|
|
687
|
+
[attachmentTemplate]="attachmentTemplate"
|
|
688
|
+
[authorId]="authorId"
|
|
689
|
+
(executeAction)="dispatchAction($event)"
|
|
690
|
+
(resize)="anchor.scrollToBottom()"
|
|
691
|
+
(navigate)="this.autoScroll = false"
|
|
692
|
+
>
|
|
693
|
+
</kendo-chat-message-list>
|
|
694
|
+
}
|
|
690
695
|
</div>
|
|
691
696
|
<kendo-message-box
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
697
|
+
#messageBox
|
|
698
|
+
[messageBoxTemplate]="messageBoxTemplate"
|
|
699
|
+
[suggestionTemplate]="suggestionTemplate"
|
|
700
|
+
[suggestions]="suggestions"
|
|
701
|
+
[placeholder]="placeholder"
|
|
702
|
+
[authorId]="authorId"
|
|
703
|
+
[autoScroll]="autoScroll"
|
|
704
|
+
[inputValue]="inputValue"
|
|
705
|
+
[localization]="localizationText"
|
|
706
|
+
(sendMessage)="sendMessage.emit($event)"
|
|
707
|
+
(executeSuggestion)="suggestionExecute.emit($event)"
|
|
708
|
+
(fileSelect)="fileSelect.emit($event)"
|
|
709
|
+
(fileRemove)="fileRemove.emit($event)"
|
|
710
|
+
>
|
|
706
711
|
</kendo-message-box>
|
|
707
|
-
|
|
712
|
+
|
|
708
713
|
<kendo-contextmenu
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
714
|
+
#messagesContextMenu
|
|
715
|
+
[items]="contextMenuActions"
|
|
716
|
+
[popupAlign]="{ horizontal: 'right', vertical: 'top' }"
|
|
717
|
+
[collision]="{ horizontal: 'flip', vertical: 'flip'}"
|
|
718
|
+
(popupClose)="handleMenuClose($event)"
|
|
719
|
+
(select)="onContextMenuAction($event.item.originalAction)"
|
|
715
720
|
></kendo-contextmenu>
|
|
716
|
-
|
|
721
|
+
`, 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
722
|
}
|
|
718
723
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ChatComponent, decorators: [{
|
|
719
724
|
type: Component,
|
|
@@ -730,141 +735,146 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
730
735
|
selector: 'kendo-chat',
|
|
731
736
|
template: `
|
|
732
737
|
<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
|
-
|
|
738
|
+
i18n-deletedMessageSenderText="kendo.chat.deletedMessageSenderText|The text that is displayed when the sender deletes a message"
|
|
739
|
+
deletedMessageSenderText="You removed this message."
|
|
740
|
+
|
|
741
|
+
i18n-deletedMessageReceiverText="kendo.chat.deletedMessageReceiverText|The text that is displayed when the receiver deletes a message"
|
|
742
|
+
deletedMessageReceiverText="This message was removed by its sender."
|
|
743
|
+
|
|
744
|
+
i18n-messagePlaceholder="kendo.chat.messagePlaceholder|The placholder text of the message text input"
|
|
745
|
+
messagePlaceholder="Type a message..."
|
|
746
|
+
|
|
747
|
+
i18n-send="kendo.chat.send|The text for the Send button"
|
|
748
|
+
send="Send..."
|
|
749
|
+
|
|
750
|
+
i18n-messageListLabel="kendo.chat.messageListLabel|The label text for the Message list"
|
|
751
|
+
messageListLabel="Message list"
|
|
752
|
+
|
|
753
|
+
i18n-messageBoxInputLabel="kendo.chat.messageBoxInputLabel|The label text for the Message input box"
|
|
754
|
+
messageBoxInputLabel="Message"
|
|
755
|
+
|
|
756
|
+
i18n-messageAttachmentLeftArrow="kendo.chat.messageAttachmentLeftArrow|The text for the left arrow of the message attachments"
|
|
757
|
+
messageAttachmentLeftArrow="Previous item"
|
|
758
|
+
|
|
759
|
+
i18n-messageAttachmentRightArrow="kendo.chat.messageAttachmentRightArrow|The text for the right arrow of the message attachments"
|
|
760
|
+
messageAttachmentRightArrow="Next item"
|
|
761
|
+
|
|
762
|
+
i18n-speechToTextButtonTitle="kendo.chat.speechToTextButtonTitle|Sets the Speech to Text button title."
|
|
763
|
+
speechToTextButtonTitle="Speech to Text"
|
|
764
|
+
|
|
765
|
+
i18n-fileSelectButtonTitle="kendo.chat.fileSelectButtonTitle|Sets the File Select button title."
|
|
766
|
+
fileSelectButtonTitle="Select files"
|
|
767
|
+
|
|
768
|
+
i18n-removeReplyTitle="kendo.chat.removeReplyTitle|Sets the title of the icon which removes the reply reference in the Message Box."
|
|
769
|
+
removeReplyTitle="Remove reply"
|
|
770
|
+
|
|
771
|
+
i18n-removeFileTitle="kendo.chat.removeFileTitle|Sets the title of the icon which removes a selected file in the Message Box."
|
|
772
|
+
removeFileTitle="Remove file"
|
|
773
|
+
|
|
774
|
+
i18n-expandTitle="kendo.chat.expandTitle|Sets the title of the icon which demonstrates that the message can be expanded."
|
|
775
|
+
expandTitle="Expand message"
|
|
776
|
+
|
|
777
|
+
i18n-collapseTitle="kendo.chat.collapseTitle|Sets the title of the icon which demonstrates that the message can be collapsed."
|
|
778
|
+
collapseTitle="Collapse message"
|
|
779
|
+
|
|
780
|
+
i18n-fileActionsTitle="kendo.chat.fileActionsTitle|Sets the title of the DropDownButton which opens the File actions."
|
|
781
|
+
fileActionsTitle="File actions"
|
|
782
|
+
|
|
783
|
+
i18n-downloadAllFilesText="kendo.chat.downloadAllFilesText|Sets the text that is displayed in the download section of the message."
|
|
784
|
+
downloadAllFilesText="Download all"
|
|
785
|
+
|
|
786
|
+
i18n-previousSuggestionsButtonTitle="kendo.chat.previousSuggestionsButtonTitle|The title of the button that scrolls to the previous suggestions"
|
|
787
|
+
previousSuggestionsButtonTitle="Scroll left"
|
|
788
|
+
|
|
789
|
+
i18n-nextSuggestionsButtonTitle="kendo.chat.nextSuggestionsButtonTitle|The title of the button that scrolls to the next suggestions"
|
|
790
|
+
nextSuggestionsButtonTitle="Scroll right"
|
|
791
|
+
>
|
|
787
792
|
</ng-container>
|
|
788
|
-
|
|
789
|
-
|
|
793
|
+
|
|
794
|
+
@if (chatHeaderTemplate) {
|
|
795
|
+
<kendo-appbar class="k-chat-header" positionMode="sticky" themeColor="inherit">
|
|
790
796
|
<ng-container *ngTemplateOutlet="chatHeaderTemplate.templateRef"></ng-container>
|
|
791
|
-
|
|
792
|
-
|
|
797
|
+
</kendo-appbar>
|
|
798
|
+
}
|
|
799
|
+
@if (pinnedMessage) {
|
|
800
|
+
<div class="k-message-reference k-message-reference-receiver k-message-pinned" (click)="scrollToPinnedMessage()">
|
|
793
801
|
<kendo-icon-wrapper
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
802
|
+
size="xlarge"
|
|
803
|
+
name="pin"
|
|
804
|
+
[svgIcon]="pinIcon"
|
|
805
|
+
>
|
|
798
806
|
</kendo-icon-wrapper>
|
|
799
807
|
<chat-message-reference-content [message]="pinnedMessage"></chat-message-reference-content>
|
|
800
808
|
<span class="k-spacer"></span>
|
|
801
809
|
<button kendoButton [svgIcon]="deleteIcon" (click)="unpin.emit(pinnedMessage)" fillMode="flat"></button>
|
|
802
|
-
|
|
810
|
+
</div>
|
|
811
|
+
}
|
|
803
812
|
<div
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
813
|
+
#messageList
|
|
814
|
+
class="k-message-list"
|
|
815
|
+
aria-live="polite"
|
|
816
|
+
role="log"
|
|
817
|
+
kendoChatScrollAnchor
|
|
818
|
+
[attr.aria-label]="textFor('messageListLabel')"
|
|
819
|
+
#anchor="scrollAnchor"
|
|
820
|
+
[(autoScroll)]="autoScroll"
|
|
821
|
+
>
|
|
822
|
+
@if (processedMessages && processedMessages.length === 0) {
|
|
823
|
+
<div class="k-message-list-content k-message-list-content-empty">
|
|
824
|
+
<ng-template
|
|
825
|
+
[ngTemplateOutlet]="chatNoDataTemplate?.templateRef">
|
|
826
|
+
</ng-template>
|
|
817
827
|
</div>
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
828
|
+
} @else {
|
|
829
|
+
<kendo-chat-message-list
|
|
830
|
+
[messages]="processedMessages"
|
|
831
|
+
[authorMessageContentTemplate]="authorMessageContentTemplate"
|
|
832
|
+
[receiverMessageContentTemplate]="receiverMessageContentTemplate"
|
|
833
|
+
[messageContentTemplate]="messageContentTemplate"
|
|
834
|
+
[authorMessageTemplate]="authorMessageTemplate"
|
|
835
|
+
[receiverMessageTemplate]="receiverMessageTemplate"
|
|
836
|
+
[messageTemplate]="messageTemplate"
|
|
837
|
+
[timestampTemplate]="timestampTemplate"
|
|
838
|
+
[statusTemplate]="statusTemplate"
|
|
839
|
+
[userStatusTemplate]="userStatusTemplate"
|
|
840
|
+
[localization]="localizationText"
|
|
841
|
+
[attachmentTemplate]="attachmentTemplate"
|
|
842
|
+
[authorId]="authorId"
|
|
843
|
+
(executeAction)="dispatchAction($event)"
|
|
844
|
+
(resize)="anchor.scrollToBottom()"
|
|
845
|
+
(navigate)="this.autoScroll = false"
|
|
846
|
+
>
|
|
847
|
+
</kendo-chat-message-list>
|
|
848
|
+
}
|
|
839
849
|
</div>
|
|
840
850
|
<kendo-message-box
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
851
|
+
#messageBox
|
|
852
|
+
[messageBoxTemplate]="messageBoxTemplate"
|
|
853
|
+
[suggestionTemplate]="suggestionTemplate"
|
|
854
|
+
[suggestions]="suggestions"
|
|
855
|
+
[placeholder]="placeholder"
|
|
856
|
+
[authorId]="authorId"
|
|
857
|
+
[autoScroll]="autoScroll"
|
|
858
|
+
[inputValue]="inputValue"
|
|
859
|
+
[localization]="localizationText"
|
|
860
|
+
(sendMessage)="sendMessage.emit($event)"
|
|
861
|
+
(executeSuggestion)="suggestionExecute.emit($event)"
|
|
862
|
+
(fileSelect)="fileSelect.emit($event)"
|
|
863
|
+
(fileRemove)="fileRemove.emit($event)"
|
|
864
|
+
>
|
|
855
865
|
</kendo-message-box>
|
|
856
|
-
|
|
866
|
+
|
|
857
867
|
<kendo-contextmenu
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
868
|
+
#messagesContextMenu
|
|
869
|
+
[items]="contextMenuActions"
|
|
870
|
+
[popupAlign]="{ horizontal: 'right', vertical: 'top' }"
|
|
871
|
+
[collision]="{ horizontal: 'flip', vertical: 'flip'}"
|
|
872
|
+
(popupClose)="handleMenuClose($event)"
|
|
873
|
+
(select)="onContextMenuAction($event.item.originalAction)"
|
|
864
874
|
></kendo-contextmenu>
|
|
865
|
-
|
|
875
|
+
`,
|
|
866
876
|
standalone: true,
|
|
867
|
-
imports: [LocalizedMessagesDirective, ScrollAnchorDirective, MessageListComponent, MessageBoxComponent, MessageReferenceComponent, AppBarComponent, NgTemplateOutlet,
|
|
877
|
+
imports: [LocalizedMessagesDirective, ScrollAnchorDirective, MessageListComponent, MessageBoxComponent, MessageReferenceComponent, AppBarComponent, NgTemplateOutlet, IconWrapperComponent, KENDO_BUTTON, ContextMenuComponent]
|
|
868
878
|
}]
|
|
869
879
|
}], ctorParameters: () => [{ type: i1.LocalizationService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i2.ChatService }], propDecorators: { messages: [{
|
|
870
880
|
type: Input
|