@dataclouder/ngx-agent-cards 0.1.86 → 0.1.88

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.
@@ -3647,7 +3647,6 @@ class VideoPlayerNativeService {
3647
3647
  this.playNextInQueue();
3648
3648
  }
3649
3649
  playNextInQueue() {
3650
- console.log('Playing next in queue');
3651
3650
  if (this.videoQueue.length > 0) {
3652
3651
  const videoUrl = this.videoQueue.shift();
3653
3652
  if (videoUrl && this.videoElement) {
@@ -3656,10 +3655,14 @@ class VideoPlayerNativeService {
3656
3655
  }
3657
3656
  }
3658
3657
  else if (this.defaultVideoUrl && this.videoElement) {
3659
- console.log('Playing default video');
3660
- this.videoElement.src = this.defaultVideoUrl;
3661
- // this.videoElement.loop = true;
3662
- this.videoElement.play();
3658
+ if (this.videoElement.src !== this.defaultVideoUrl) {
3659
+ this.videoElement.src = this.defaultVideoUrl;
3660
+ this.videoElement.play();
3661
+ }
3662
+ else {
3663
+ this.videoElement.currentTime = 0;
3664
+ this.videoElement.play();
3665
+ }
3663
3666
  }
3664
3667
  else {
3665
3668
  console.log('No default video');
@@ -4401,11 +4404,11 @@ class ChatMessageComponent {
4401
4404
  console.log(res);
4402
4405
  }
4403
4406
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ChatMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4404
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ChatMessageComponent, isStandalone: true, selector: "dc-chat-message", inputs: { chatMessage: { classPropertyName: "chatMessage", publicName: "chatMessage", isSignal: true, isRequired: true, transformFunction: null }, chatUserSettings: { classPropertyName: "chatUserSettings", publicName: "chatUserSettings", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"message-wrapper\" [ngClass]=\"{ 'user-message': isUserMessage(), 'assistant-message': !isUserMessage() }\">\n <div class=\"message-container\">\n <!-- Avatar -->\n @if (!isUserMessage()) {\n <div class=\"avatar-container\">\n <div class=\"avatar\" (click)=\"printData()\">\n <img [src]=\"chatMessage().imgUrl\" alt=\"AI\" class=\"avatar-image\" />\n </div>\n </div>\n } @if (isUserMessage()) {\n <div class=\"avatar-container-right\" (click)=\"printData()\">\n <div class=\"avatar user-avatar\">\n <img [src]=\"chatMessage()?.imgUrl || '/assets/defaults/avatar_user.jpg'\" alt=\"User\" class=\"avatar-image\" />\n </div>\n </div>\n }\n\n <!-- Message Bubble -->\n <div class=\"message-bubble\">\n @if (chatMessage().generatedImg) {\n <img class=\"generated-img\" [src]=\"chatMessage().generatedImg\" alt=\"Generated Image\" />\n } @if (hasMultiMessages()) {\n <dc-message-orchestrator [messages]=\"multiMessages()\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n } @else {\n <dc-message-orchestrator [messages]=\"[messageContent()]\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n }\n\n <!-- Translation -->\n @if (isAssistantMessage() && chatMessage().evaluation?.['text']) {\n <div class=\"translation\">\n <hr class=\"divider\" />\n\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n } @if (isUserMessage() && chatMessage().evaluation) {\n <div class=\"translation\" style=\"color: white\">\n <hr class=\"divider\" />\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n <div class=\"evaluation-footer\">\n <span>{{ evaluationEmoji() }}</span>\n <span class=\"pointer\" (click)=\"showEvaluation()\"> \uD83E\uDDD0 </span>\n </div>\n } @if (userService.isAdmin()) {\n <div class=\"options-footer\">\n <i #popoverTarget class=\"pi pi-ellipsis-h\" style=\"font-size: 1rem\" (click)=\"op.toggle($event)\"></i>\n <p-popover #op>\n <ul class=\"list-none p-0 m-0 flex flex-col\">\n <li class=\"flex items-center gap-2 px-2 py-3 hover:bg-emphasis cursor-pointer rounded-border\" (click)=\"generateImage()\">\n <span>Generate image</span>\n </li>\n </ul>\n </p-popover>\n </div>\n }\n </div>\n\n <!-- Tags -->\n @if (chatMessage().tags?.length) {\n <div class=\"tags\">\n @for (tag of chatMessage().tags; track tag) {\n <span class=\"tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{--user-message-bg: rgba(244, 100, 81, .5);--assistant-message-bg: rgba(13, 88, 120, .5);--user-text-color: white;--assistant-text-color: #ffffff;--avatar-user-bg: #ffa77e;--divider-color: #ffa77e;--border-radius: 18px;--avatar-size: 36px;--shadow: 0 2px 8px rgba(0, 0, 0, .15);display:block;margin-bottom:16px}.message-wrapper{display:flex;width:100%;margin-bottom:12px}.message-container{display:flex;max-width:98%;line-height:1.5;position:relative}.user-message{justify-content:flex-end}.user-message .message-bubble{background-color:var(--user-message-bg);color:var(--user-text-color);border-radius:var(--border-radius) var(--border-radius) 0 var(--border-radius);margin-left:8px;min-width:150px}.user-message dc-message-orchestrator{margin-right:19px}.assistant-message{justify-content:flex-start}.assistant-message .message-bubble{background-color:var(--assistant-message-bg);color:var(--assistant-text-color);border-radius:var(--border-radius) var(--border-radius) var(--border-radius) 0;margin-left:8px}.message-bubble{padding:9px;box-shadow:var(--shadow);max-width:98%;min-width:0;position:relative;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.avatar-container,.avatar-container-right{position:absolute;bottom:-20px}.avatar-container{left:-7px;z-index:1}.avatar-container-right{right:-5px;z-index:1}.avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:50%;background-color:var(--user-message-bg);display:flex;align-items:center;justify-content:center;color:var(--user-text-color);font-weight:700;font-size:14px;overflow:hidden}.avatar-image{width:100%;height:100%;object-fit:cover}.user-avatar{background-color:var(--avatar-user-bg)}::ng-deep .em{color:inherit;font-style:italic}::ng-deep .strong{font-weight:700;color:inherit}::ng-deep .em_strong{font-weight:700;font-style:italic;color:inherit}.translation{margin-top:8px;font-size:small;line-height:1.6;color:#d8d8d8;font-style:italic}.divider{margin:.5rem 40px;border-top:1px solid var(--divider-color)}.evaluation-footer{position:absolute;bottom:-10px;left:20px;display:flex;align-items:center;gap:8px}.options-footer{position:absolute;bottom:5px;right:20px;display:flex;align-items:center;gap:8px}.pointer{cursor:pointer}.tags{position:absolute;top:-10px;right:15px;display:flex;gap:5px;z-index:1}.tag{font-size:16px;transition:transform .3s ease-in-out;animation:float 6s ease-in-out infinite;cursor:default}.tag:hover{transform:scale(1.2)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-2px)}to{transform:translateY(0)}}.generated-img{width:100%;border-radius:var(--border-radius)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatMessageOrchestratorComponent, selector: "dc-message-orchestrator", inputs: ["messages", "messageRole"], outputs: ["audioCompleted"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i2$3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4407
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ChatMessageComponent, isStandalone: true, selector: "dc-chat-message", inputs: { chatMessage: { classPropertyName: "chatMessage", publicName: "chatMessage", isSignal: true, isRequired: true, transformFunction: null }, chatUserSettings: { classPropertyName: "chatUserSettings", publicName: "chatUserSettings", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"message-wrapper\" [ngClass]=\"{ 'user-message': isUserMessage(), 'assistant-message': !isUserMessage() }\">\n <div class=\"message-container\">\n <!-- Avatar -->\n @if (!isUserMessage()) {\n <div class=\"avatar-container\">\n <div class=\"avatar\" (click)=\"printData()\">\n <img [src]=\"chatMessage().imgUrl\" alt=\"AI\" class=\"avatar-image\" />\n </div>\n </div>\n } @if (isUserMessage()) {\n <div class=\"avatar-container-right\" (click)=\"printData()\">\n <div class=\"avatar user-avatar\">\n <img [src]=\"chatMessage()?.imgUrl || '/assets/defaults/avatar_user.jpg'\" alt=\"User\" class=\"avatar-image\" />\n </div>\n </div>\n }\n\n <!-- Message Bubble -->\n <div class=\"message-bubble\">\n @if (chatMessage().generatedImg) {\n <img class=\"generated-img\" [src]=\"chatMessage().generatedImg\" alt=\"Generated Image\" />\n } @if (hasMultiMessages()) {\n <dc-message-orchestrator [messages]=\"multiMessages()\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n } @else {\n <dc-message-orchestrator [messages]=\"[messageContent()]\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n }\n\n <!-- Translation -->\n @if (isAssistantMessage() && chatMessage().evaluation?.['text']) {\n <div class=\"translation\">\n <hr class=\"divider\" />\n\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n } @if (isUserMessage() && chatMessage().evaluation) {\n <div class=\"translation\" style=\"color: white\">\n <hr class=\"divider\" />\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n <div class=\"evaluation-footer\">\n <span>{{ evaluationEmoji() }}</span>\n <span class=\"pointer\" (click)=\"showEvaluation()\"> \uD83E\uDDD0 </span>\n </div>\n } @if (userService.isAdmin()) {\n <div class=\"options-footer\">\n <i #popoverTarget class=\"pi pi-ellipsis-h\" style=\"font-size: 1rem\" (click)=\"op.toggle($event)\"></i>\n <p-popover #op>\n <ul class=\"list-none p-0 m-0 flex flex-col\">\n <li class=\"flex items-center gap-2 px-2 py-3 hover:bg-emphasis cursor-pointer rounded-border\" (click)=\"generateImage()\">\n <span>Generate image</span>\n </li>\n </ul>\n </p-popover>\n </div>\n }\n </div>\n\n <!-- Tags -->\n @if (chatMessage().tags?.length) {\n <div class=\"tags\">\n @for (tag of chatMessage().tags; track tag) {\n <span class=\"tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{--user-message-bg: var(--chat-user-message-bg);--assistant-message-bg: var(--chat-assistant-message-bg);--user-text-color: white;--assistant-text-color: #ffffff;--avatar-user-bg: #ffa77e;--divider-color: #ffa77e;--border-radius: 18px;--avatar-size: 36px;--shadow: 0 2px 8px rgba(0, 0, 0, .15);display:block;margin-bottom:16px}.message-wrapper{display:flex;width:100%;margin-bottom:12px}.message-container{display:flex;max-width:98%;line-height:1.5;position:relative}.user-message{justify-content:flex-end}.user-message .message-bubble{background-color:var(--user-message-bg);color:var(--user-text-color);border-radius:var(--border-radius) var(--border-radius) 0 var(--border-radius);margin-left:8px;min-width:150px}.user-message dc-message-orchestrator{margin-right:19px}.assistant-message{justify-content:flex-start}.assistant-message .message-bubble{background-color:var(--assistant-message-bg);color:var(--assistant-text-color);border-radius:var(--border-radius) var(--border-radius) var(--border-radius) 0;margin-left:8px}.message-bubble{padding:9px;box-shadow:var(--shadow);max-width:98%;min-width:0;position:relative;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.avatar-container,.avatar-container-right{position:absolute;bottom:-20px}.avatar-container{left:-7px;z-index:1}.avatar-container-right{right:-5px;z-index:1}.avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:50%;background-color:var(--user-message-bg);display:flex;align-items:center;justify-content:center;color:var(--user-text-color);font-weight:700;font-size:14px;overflow:hidden}.avatar-image{width:100%;height:100%;object-fit:cover}.user-avatar{background-color:var(--avatar-user-bg)}::ng-deep .em{color:inherit;font-style:italic}::ng-deep .strong{font-weight:700;color:inherit}::ng-deep .em_strong{font-weight:700;font-style:italic;color:inherit}.translation{margin-top:8px;font-size:small;line-height:1.6;color:#d8d8d8;font-style:italic}.divider{margin:.5rem 40px;border-top:1px solid var(--divider-color)}.evaluation-footer{position:absolute;bottom:-10px;left:20px;display:flex;align-items:center;gap:8px}.options-footer{position:absolute;bottom:5px;right:20px;display:flex;align-items:center;gap:8px}.pointer{cursor:pointer}.tags{position:absolute;top:-10px;right:15px;display:flex;gap:5px;z-index:1}.tag{font-size:16px;transition:transform .3s ease-in-out;animation:float 6s ease-in-out infinite;cursor:default}.tag:hover{transform:scale(1.2)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-2px)}to{transform:translateY(0)}}.generated-img{width:100%;border-radius:var(--border-radius)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ChatMessageOrchestratorComponent, selector: "dc-message-orchestrator", inputs: ["messages", "messageRole"], outputs: ["audioCompleted"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i2$3.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4405
4408
  }
4406
4409
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ChatMessageComponent, decorators: [{
4407
4410
  type: Component,
4408
- args: [{ selector: 'dc-chat-message', standalone: true, imports: [CommonModule, ChatMessageOrchestratorComponent, PopoverModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"message-wrapper\" [ngClass]=\"{ 'user-message': isUserMessage(), 'assistant-message': !isUserMessage() }\">\n <div class=\"message-container\">\n <!-- Avatar -->\n @if (!isUserMessage()) {\n <div class=\"avatar-container\">\n <div class=\"avatar\" (click)=\"printData()\">\n <img [src]=\"chatMessage().imgUrl\" alt=\"AI\" class=\"avatar-image\" />\n </div>\n </div>\n } @if (isUserMessage()) {\n <div class=\"avatar-container-right\" (click)=\"printData()\">\n <div class=\"avatar user-avatar\">\n <img [src]=\"chatMessage()?.imgUrl || '/assets/defaults/avatar_user.jpg'\" alt=\"User\" class=\"avatar-image\" />\n </div>\n </div>\n }\n\n <!-- Message Bubble -->\n <div class=\"message-bubble\">\n @if (chatMessage().generatedImg) {\n <img class=\"generated-img\" [src]=\"chatMessage().generatedImg\" alt=\"Generated Image\" />\n } @if (hasMultiMessages()) {\n <dc-message-orchestrator [messages]=\"multiMessages()\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n } @else {\n <dc-message-orchestrator [messages]=\"[messageContent()]\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n }\n\n <!-- Translation -->\n @if (isAssistantMessage() && chatMessage().evaluation?.['text']) {\n <div class=\"translation\">\n <hr class=\"divider\" />\n\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n } @if (isUserMessage() && chatMessage().evaluation) {\n <div class=\"translation\" style=\"color: white\">\n <hr class=\"divider\" />\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n <div class=\"evaluation-footer\">\n <span>{{ evaluationEmoji() }}</span>\n <span class=\"pointer\" (click)=\"showEvaluation()\"> \uD83E\uDDD0 </span>\n </div>\n } @if (userService.isAdmin()) {\n <div class=\"options-footer\">\n <i #popoverTarget class=\"pi pi-ellipsis-h\" style=\"font-size: 1rem\" (click)=\"op.toggle($event)\"></i>\n <p-popover #op>\n <ul class=\"list-none p-0 m-0 flex flex-col\">\n <li class=\"flex items-center gap-2 px-2 py-3 hover:bg-emphasis cursor-pointer rounded-border\" (click)=\"generateImage()\">\n <span>Generate image</span>\n </li>\n </ul>\n </p-popover>\n </div>\n }\n </div>\n\n <!-- Tags -->\n @if (chatMessage().tags?.length) {\n <div class=\"tags\">\n @for (tag of chatMessage().tags; track tag) {\n <span class=\"tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{--user-message-bg: rgba(244, 100, 81, .5);--assistant-message-bg: rgba(13, 88, 120, .5);--user-text-color: white;--assistant-text-color: #ffffff;--avatar-user-bg: #ffa77e;--divider-color: #ffa77e;--border-radius: 18px;--avatar-size: 36px;--shadow: 0 2px 8px rgba(0, 0, 0, .15);display:block;margin-bottom:16px}.message-wrapper{display:flex;width:100%;margin-bottom:12px}.message-container{display:flex;max-width:98%;line-height:1.5;position:relative}.user-message{justify-content:flex-end}.user-message .message-bubble{background-color:var(--user-message-bg);color:var(--user-text-color);border-radius:var(--border-radius) var(--border-radius) 0 var(--border-radius);margin-left:8px;min-width:150px}.user-message dc-message-orchestrator{margin-right:19px}.assistant-message{justify-content:flex-start}.assistant-message .message-bubble{background-color:var(--assistant-message-bg);color:var(--assistant-text-color);border-radius:var(--border-radius) var(--border-radius) var(--border-radius) 0;margin-left:8px}.message-bubble{padding:9px;box-shadow:var(--shadow);max-width:98%;min-width:0;position:relative;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.avatar-container,.avatar-container-right{position:absolute;bottom:-20px}.avatar-container{left:-7px;z-index:1}.avatar-container-right{right:-5px;z-index:1}.avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:50%;background-color:var(--user-message-bg);display:flex;align-items:center;justify-content:center;color:var(--user-text-color);font-weight:700;font-size:14px;overflow:hidden}.avatar-image{width:100%;height:100%;object-fit:cover}.user-avatar{background-color:var(--avatar-user-bg)}::ng-deep .em{color:inherit;font-style:italic}::ng-deep .strong{font-weight:700;color:inherit}::ng-deep .em_strong{font-weight:700;font-style:italic;color:inherit}.translation{margin-top:8px;font-size:small;line-height:1.6;color:#d8d8d8;font-style:italic}.divider{margin:.5rem 40px;border-top:1px solid var(--divider-color)}.evaluation-footer{position:absolute;bottom:-10px;left:20px;display:flex;align-items:center;gap:8px}.options-footer{position:absolute;bottom:5px;right:20px;display:flex;align-items:center;gap:8px}.pointer{cursor:pointer}.tags{position:absolute;top:-10px;right:15px;display:flex;gap:5px;z-index:1}.tag{font-size:16px;transition:transform .3s ease-in-out;animation:float 6s ease-in-out infinite;cursor:default}.tag:hover{transform:scale(1.2)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-2px)}to{transform:translateY(0)}}.generated-img{width:100%;border-radius:var(--border-radius)}\n"] }]
4411
+ args: [{ selector: 'dc-chat-message', standalone: true, imports: [CommonModule, ChatMessageOrchestratorComponent, PopoverModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"message-wrapper\" [ngClass]=\"{ 'user-message': isUserMessage(), 'assistant-message': !isUserMessage() }\">\n <div class=\"message-container\">\n <!-- Avatar -->\n @if (!isUserMessage()) {\n <div class=\"avatar-container\">\n <div class=\"avatar\" (click)=\"printData()\">\n <img [src]=\"chatMessage().imgUrl\" alt=\"AI\" class=\"avatar-image\" />\n </div>\n </div>\n } @if (isUserMessage()) {\n <div class=\"avatar-container-right\" (click)=\"printData()\">\n <div class=\"avatar user-avatar\">\n <img [src]=\"chatMessage()?.imgUrl || '/assets/defaults/avatar_user.jpg'\" alt=\"User\" class=\"avatar-image\" />\n </div>\n </div>\n }\n\n <!-- Message Bubble -->\n <div class=\"message-bubble\">\n @if (chatMessage().generatedImg) {\n <img class=\"generated-img\" [src]=\"chatMessage().generatedImg\" alt=\"Generated Image\" />\n } @if (hasMultiMessages()) {\n <dc-message-orchestrator [messages]=\"multiMessages()\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n } @else {\n <dc-message-orchestrator [messages]=\"[messageContent()]\" [messageRole]=\"chatMessage().role\"></dc-message-orchestrator>\n }\n\n <!-- Translation -->\n @if (isAssistantMessage() && chatMessage().evaluation?.['text']) {\n <div class=\"translation\">\n <hr class=\"divider\" />\n\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n } @if (isUserMessage() && chatMessage().evaluation) {\n <div class=\"translation\" style=\"color: white\">\n <hr class=\"divider\" />\n {{ chatMessage().evaluation?.['text'] }}\n </div>\n <div class=\"evaluation-footer\">\n <span>{{ evaluationEmoji() }}</span>\n <span class=\"pointer\" (click)=\"showEvaluation()\"> \uD83E\uDDD0 </span>\n </div>\n } @if (userService.isAdmin()) {\n <div class=\"options-footer\">\n <i #popoverTarget class=\"pi pi-ellipsis-h\" style=\"font-size: 1rem\" (click)=\"op.toggle($event)\"></i>\n <p-popover #op>\n <ul class=\"list-none p-0 m-0 flex flex-col\">\n <li class=\"flex items-center gap-2 px-2 py-3 hover:bg-emphasis cursor-pointer rounded-border\" (click)=\"generateImage()\">\n <span>Generate image</span>\n </li>\n </ul>\n </p-popover>\n </div>\n }\n </div>\n\n <!-- Tags -->\n @if (chatMessage().tags?.length) {\n <div class=\"tags\">\n @for (tag of chatMessage().tags; track tag) {\n <span class=\"tag\">{{ tag }}</span>\n }\n </div>\n }\n </div>\n</div>\n", styles: [":host{--user-message-bg: var(--chat-user-message-bg);--assistant-message-bg: var(--chat-assistant-message-bg);--user-text-color: white;--assistant-text-color: #ffffff;--avatar-user-bg: #ffa77e;--divider-color: #ffa77e;--border-radius: 18px;--avatar-size: 36px;--shadow: 0 2px 8px rgba(0, 0, 0, .15);display:block;margin-bottom:16px}.message-wrapper{display:flex;width:100%;margin-bottom:12px}.message-container{display:flex;max-width:98%;line-height:1.5;position:relative}.user-message{justify-content:flex-end}.user-message .message-bubble{background-color:var(--user-message-bg);color:var(--user-text-color);border-radius:var(--border-radius) var(--border-radius) 0 var(--border-radius);margin-left:8px;min-width:150px}.user-message dc-message-orchestrator{margin-right:19px}.assistant-message{justify-content:flex-start}.assistant-message .message-bubble{background-color:var(--assistant-message-bg);color:var(--assistant-text-color);border-radius:var(--border-radius) var(--border-radius) var(--border-radius) 0;margin-left:8px}.message-bubble{padding:9px;box-shadow:var(--shadow);max-width:98%;min-width:0;position:relative;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.avatar-container,.avatar-container-right{position:absolute;bottom:-20px}.avatar-container{left:-7px;z-index:1}.avatar-container-right{right:-5px;z-index:1}.avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:50%;background-color:var(--user-message-bg);display:flex;align-items:center;justify-content:center;color:var(--user-text-color);font-weight:700;font-size:14px;overflow:hidden}.avatar-image{width:100%;height:100%;object-fit:cover}.user-avatar{background-color:var(--avatar-user-bg)}::ng-deep .em{color:inherit;font-style:italic}::ng-deep .strong{font-weight:700;color:inherit}::ng-deep .em_strong{font-weight:700;font-style:italic;color:inherit}.translation{margin-top:8px;font-size:small;line-height:1.6;color:#d8d8d8;font-style:italic}.divider{margin:.5rem 40px;border-top:1px solid var(--divider-color)}.evaluation-footer{position:absolute;bottom:-10px;left:20px;display:flex;align-items:center;gap:8px}.options-footer{position:absolute;bottom:5px;right:20px;display:flex;align-items:center;gap:8px}.pointer{cursor:pointer}.tags{position:absolute;top:-10px;right:15px;display:flex;gap:5px;z-index:1}.tag{font-size:16px;transition:transform .3s ease-in-out;animation:float 6s ease-in-out infinite;cursor:default}.tag:hover{transform:scale(1.2)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-2px)}to{transform:translateY(0)}}.generated-img{width:100%;border-radius:var(--border-radius)}\n"] }]
4409
4412
  }], ctorParameters: () => [] });
4410
4413
 
4411
4414
  class ChatMessagesListComponent {