@acorex/components 18.4.2 → 18.4.3
Sign up to get free protection for your applications and to get access to all the features.
- package/conversation/lib/conversation-message/conversation-message.component.d.ts +1 -1
- package/conversation/lib/conversation-messages/conversation-message-audio/conversation-message-audio.component.d.ts +3 -3
- package/conversation/lib/conversation-messages/conversation-message-image/conversation-message-image.component.d.ts +3 -3
- package/conversation/lib/conversation-messages/conversation-message-text/conversation-message-text.component.d.ts +7 -1
- package/conversation/lib/conversation-messages/conversation-message-video/conversation-message-video.component.d.ts +3 -3
- package/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.d.ts +3 -3
- package/conversation/lib/conversation.module.d.ts +1 -1
- package/conversation/lib/conversation.types.d.ts +1 -1
- package/esm2022/button/lib/button.component.mjs +2 -2
- package/esm2022/conversation/lib/conversation-message/conversation-message.component.mjs +4 -4
- package/esm2022/conversation/lib/conversation-messages/conversation-message-audio/conversation-message-audio.component.mjs +7 -7
- package/esm2022/conversation/lib/conversation-messages/conversation-message-file/conversation-message-file.component.mjs +9 -3
- package/esm2022/conversation/lib/conversation-messages/conversation-message-image/conversation-message-image.component.mjs +5 -5
- package/esm2022/conversation/lib/conversation-messages/conversation-message-text/conversation-message-text.component.mjs +85 -3
- package/esm2022/conversation/lib/conversation-messages/conversation-message-video/conversation-message-video.component.mjs +5 -5
- package/esm2022/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.mjs +5 -5
- package/esm2022/conversation/lib/conversation.module.mjs +21 -21
- package/esm2022/conversation/lib/conversation.types.mjs +1 -1
- package/fesm2022/acorex-components-button.mjs +2 -2
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +129 -41
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/package.json +53 -53
|
@@ -412,7 +412,7 @@ class AXConversationMessageComponent extends MXBaseComponent {
|
|
|
412
412
|
ngOnInit() {
|
|
413
413
|
this._portal = new ComponentPortal(this.registryService.resolve(this.chatMessage().type).component);
|
|
414
414
|
}
|
|
415
|
-
|
|
415
|
+
_handleAttached(ref) {
|
|
416
416
|
ref = ref;
|
|
417
417
|
if (ref.instance && isBrowser()) {
|
|
418
418
|
Object.assign(ref.instance, { message: this.chatMessage() });
|
|
@@ -443,11 +443,11 @@ class AXConversationMessageComponent extends MXBaseComponent {
|
|
|
443
443
|
this.conversationService.replyId.set(e);
|
|
444
444
|
}
|
|
445
445
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
446
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationMessageComponent, selector: "ax-conversation-message", inputs: { chatMessage: { classPropertyName: "chatMessage", publicName: "chatMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (chatMessage().fromId) {\n <ax-avatar [size]=\"36\"></ax-avatar>\n}\n\n@if (isOwn) {\n <i (click)=\"replyHandler(chatMessage().id)\" class=\"fa-solid fa-reply ax-cursor-pointer\"></i>\n}\n\n<div class=\"ax-message-content\" [class.ax-state-own]=\"!chatMessage().fromId\" [class.ax-state-other]=\"chatMessage().fromId\">\n
|
|
446
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationMessageComponent, selector: "ax-conversation-message", inputs: { chatMessage: { classPropertyName: "chatMessage", publicName: "chatMessage", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (chatMessage().fromId) {\n <ax-avatar [size]=\"36\"></ax-avatar>\n}\n\n@if (isOwn) {\n <i (click)=\"replyHandler(chatMessage().id)\" class=\"fa-solid fa-reply ax-cursor-pointer\"></i>\n}\n\n<div class=\"ax-message-content\" [class.ax-state-own]=\"!chatMessage().fromId\" [class.ax-state-other]=\"chatMessage().fromId\">\n <ng-template [cdkPortalOutlet]=\"_portal\" (attached)=\"_handleAttached($event)\"></ng-template>\n\n <div class=\"ax-chat-message-status\">\n <div class=\"ax-message-prefix\"></div>\n <div>\n <div class=\"ax-message-suffix\"></div>\n <span>\n {{ chatMessage().sendTime | format: 'datetime' : 'HH:mm' | async }}\n </span>\n <span>\n @if (isOwn) {\n @if (chatMessage().deliverTime && chatMessage().sendTime) {\n <i class=\"ax-icon ax-icon-check ax-message-status\"></i>\n }\n @if (chatMessage().readTime && chatMessage().sendTime) {\n <i class=\"ax-icon ax-icon-dobble-check ax-message-status\"></i>\n }\n }\n </span>\n </div>\n </div>\n</div>\n\n@if (!chatMessage().sendTime) {\n <ax-button class=\"ax-resend-button ax-xs\" color=\"danger\" #b>\n <ax-icon class=\"ax-icon ax-icon-error\"></ax-icon>\n\n <ax-popover [target]=\"b\" placement=\"bottom-end\" #popover>\n <div class=\"ax-overlay-pane\">\n <ax-content> </ax-content>\n <ax-button-item-list>\n @if (chatMessage().onResendClick) {\n <ax-button-item text=\"Resend\" (onClick)=\"handleResendClick()\">\n <ax-icon class=\"ax-icon ax-icon-reload ax-bold\"></ax-icon>\n </ax-button-item>\n }\n @if (chatMessage().onDeleteClick) {\n <ax-button-item text=\"Delete\" color=\"danger\" (onClick)=\"handleDeleteClick()\">\n <ax-icon class=\"ax-icon ax-icon-clear ax-bold\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </div>\n </ax-popover>\n </ax-button>\n}\n", styles: [":root{--ax-message-other-color: rgba(var(--ax-color-primary-500));--ax-message-other-color-fore: rgba(var(--ax-color-primary-fore));--ax-message-status-color: rgba(var(--ax-color-primary-700));--ax-message-other-bar-color: rgba(var(--ax-color-primary-400));--ax-message-other-progress-color: rgba(var(--ax-color-primary-fore));--ax-message-own-color: rgba(var(--ax-color-primary-100));--ax-message-own-color-fore: rgba(var(--ax-color-primary-700));--ax-message-own-reply-color: rgba(var(--ax-color-primary-200));--ax-message-own-reply-color-fore: rgba(var(--ax-color-primary-800));--ax-message-other-reply-color: rgba(var(--ax-color-primary-700));--ax-message-other-reply-color-fore: white;--ax-message-border-color: rgba(var(--ax-color-primary-800));--ax-message-own-bar-color: rgba(var(--ax-color-primary-200));--ax-message-own-progress-color: rgba(var(--ax-color-primary-700))}ax-conversation-message{display:flex;gap:.5rem;align-items:flex-end}ax-conversation-message .ax-message-reply-container{border-left:.3rem solid var(--ax-message-border-color);border-radius:.75rem;padding:.75rem;margin-bottom:.25rem}ax-conversation-message .ax-message-reply-container .file{display:flex;align-items:center}ax-conversation-message .ax-message-reply-container .file i{margin-inline-end:.5rem}ax-conversation-message .ax-message-reply-container img,ax-conversation-message .ax-message-reply-container video{width:6rem}ax-conversation-message.ax-state-own{justify-content:flex-end}ax-conversation-message.ax-state-own .ax-conversation-controller button{background-color:var(--ax-message-own-color-fore);color:var(--ax-message-own-color)}ax-conversation-message.ax-state-own .ax-message-reply-container{background-color:var(--ax-message-own-reply-color);color:var(--ax-message-own-reply-color-fore)}ax-conversation-message.ax-state-other .ax-conversation-controller button{background-color:var(--ax-message-other-color-fore);color:var(--ax-message-other-color)}ax-conversation-message.ax-state-other .ax-message-reply-container{background-color:var(--ax-message-other-reply-color);color:var(--ax-message-other-reply-color-fore)}ax-conversation-message .ax-conversation-controller button{width:2.5rem;height:2.5rem;border-radius:999rem;display:flex;align-items:center;justify-content:center}ax-conversation-message .ax-conversation-controller button ax-loading-spinner{display:flex}ax-conversation-message .ax-conversation-controller button.ax-state-error{background-color:rgba(var(--ax-color-danger-500));color:rgba(var(--ax-color-danger-fore))}ax-conversation-message .ax-conversation-controller button>i{width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700}ax-conversation-message .ax-message-content{display:block;padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem;border-radius:1rem;width:fit-content;max-width:50%}ax-conversation-message .ax-message-content.ax-state-own{border-end-end-radius:0!important;background-color:var(--ax-message-own-color);color:var(--ax-message-own-color-fore);justify-content:flex-end}ax-conversation-message .ax-message-content.ax-state-own .ax-chat-message-status{color:var(--ax-message-own-color-fore)}ax-conversation-message .ax-message-content.ax-state-other{border-end-start-radius:0!important;background-color:var(--ax-message-other-color);color:var(--ax-message-other-color-fore)}ax-conversation-message .ax-message-content.ax-state-other .ax-chat-message-status{color:var(--ax-message-other-color-fore)}ax-conversation-message .ax-message-content .ax-chat-message-status{display:flex;justify-content:space-between;align-items:center;font-size:.75rem}ax-conversation-message .ax-message-content .ax-chat-message-status>div{display:flex;gap:.125rem;align-items:center}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-message-status{color:var(--ax-message-status-color)}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-icon{font-weight:700;font-size:.875rem}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-icon-error{color:rgba(var(--ax-color-danger-500))}ax-conversation-message .ax-message-content ax-prefix,ax-conversation-message .ax-message-content ax-suffix{display:none}ax-conversation-message .ax-resend-button{border-radius:999rem}ax-conversation-message .ax-cursor-pointer{cursor:pointer}ax-conversation-message .ax-rounded{border-radius:.75rem}ax-conversation-message .ax-message-content p{padding:.75rem;color:rgba(var(--ax-color-primary-fore))}@media (min-width: 320px) and (max-width: 600px){ax-conversation-message ax-avatar{display:none!important}ax-conversation-message .ax-message-content{max-width:100%}}\n"], dependencies: [{ kind: "component", type: i1$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: i1$1.AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: i1$1.AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items"], outputs: ["onItemClick"] }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: i4$2.AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "look"] }, { kind: "component", type: i5.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: i4$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.AXFormatPipe, name: "format" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
447
447
|
}
|
|
448
448
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageComponent, decorators: [{
|
|
449
449
|
type: Component,
|
|
450
|
-
args: [{ selector: 'ax-conversation-message', encapsulation: ViewEncapsulation.None, template: "@if (chatMessage().fromId) {\n <ax-avatar [size]=\"36\"></ax-avatar>\n}\n\n@if (isOwn) {\n <i (click)=\"replyHandler(chatMessage().id)\" class=\"fa-solid fa-reply ax-cursor-pointer\"></i>\n}\n\n<div class=\"ax-message-content\" [class.ax-state-own]=\"!chatMessage().fromId\" [class.ax-state-other]=\"chatMessage().fromId\">\n
|
|
450
|
+
args: [{ selector: 'ax-conversation-message', encapsulation: ViewEncapsulation.None, template: "@if (chatMessage().fromId) {\n <ax-avatar [size]=\"36\"></ax-avatar>\n}\n\n@if (isOwn) {\n <i (click)=\"replyHandler(chatMessage().id)\" class=\"fa-solid fa-reply ax-cursor-pointer\"></i>\n}\n\n<div class=\"ax-message-content\" [class.ax-state-own]=\"!chatMessage().fromId\" [class.ax-state-other]=\"chatMessage().fromId\">\n <ng-template [cdkPortalOutlet]=\"_portal\" (attached)=\"_handleAttached($event)\"></ng-template>\n\n <div class=\"ax-chat-message-status\">\n <div class=\"ax-message-prefix\"></div>\n <div>\n <div class=\"ax-message-suffix\"></div>\n <span>\n {{ chatMessage().sendTime | format: 'datetime' : 'HH:mm' | async }}\n </span>\n <span>\n @if (isOwn) {\n @if (chatMessage().deliverTime && chatMessage().sendTime) {\n <i class=\"ax-icon ax-icon-check ax-message-status\"></i>\n }\n @if (chatMessage().readTime && chatMessage().sendTime) {\n <i class=\"ax-icon ax-icon-dobble-check ax-message-status\"></i>\n }\n }\n </span>\n </div>\n </div>\n</div>\n\n@if (!chatMessage().sendTime) {\n <ax-button class=\"ax-resend-button ax-xs\" color=\"danger\" #b>\n <ax-icon class=\"ax-icon ax-icon-error\"></ax-icon>\n\n <ax-popover [target]=\"b\" placement=\"bottom-end\" #popover>\n <div class=\"ax-overlay-pane\">\n <ax-content> </ax-content>\n <ax-button-item-list>\n @if (chatMessage().onResendClick) {\n <ax-button-item text=\"Resend\" (onClick)=\"handleResendClick()\">\n <ax-icon class=\"ax-icon ax-icon-reload ax-bold\"></ax-icon>\n </ax-button-item>\n }\n @if (chatMessage().onDeleteClick) {\n <ax-button-item text=\"Delete\" color=\"danger\" (onClick)=\"handleDeleteClick()\">\n <ax-icon class=\"ax-icon ax-icon-clear ax-bold\"></ax-icon>\n </ax-button-item>\n }\n </ax-button-item-list>\n </div>\n </ax-popover>\n </ax-button>\n}\n", styles: [":root{--ax-message-other-color: rgba(var(--ax-color-primary-500));--ax-message-other-color-fore: rgba(var(--ax-color-primary-fore));--ax-message-status-color: rgba(var(--ax-color-primary-700));--ax-message-other-bar-color: rgba(var(--ax-color-primary-400));--ax-message-other-progress-color: rgba(var(--ax-color-primary-fore));--ax-message-own-color: rgba(var(--ax-color-primary-100));--ax-message-own-color-fore: rgba(var(--ax-color-primary-700));--ax-message-own-reply-color: rgba(var(--ax-color-primary-200));--ax-message-own-reply-color-fore: rgba(var(--ax-color-primary-800));--ax-message-other-reply-color: rgba(var(--ax-color-primary-700));--ax-message-other-reply-color-fore: white;--ax-message-border-color: rgba(var(--ax-color-primary-800));--ax-message-own-bar-color: rgba(var(--ax-color-primary-200));--ax-message-own-progress-color: rgba(var(--ax-color-primary-700))}ax-conversation-message{display:flex;gap:.5rem;align-items:flex-end}ax-conversation-message .ax-message-reply-container{border-left:.3rem solid var(--ax-message-border-color);border-radius:.75rem;padding:.75rem;margin-bottom:.25rem}ax-conversation-message .ax-message-reply-container .file{display:flex;align-items:center}ax-conversation-message .ax-message-reply-container .file i{margin-inline-end:.5rem}ax-conversation-message .ax-message-reply-container img,ax-conversation-message .ax-message-reply-container video{width:6rem}ax-conversation-message.ax-state-own{justify-content:flex-end}ax-conversation-message.ax-state-own .ax-conversation-controller button{background-color:var(--ax-message-own-color-fore);color:var(--ax-message-own-color)}ax-conversation-message.ax-state-own .ax-message-reply-container{background-color:var(--ax-message-own-reply-color);color:var(--ax-message-own-reply-color-fore)}ax-conversation-message.ax-state-other .ax-conversation-controller button{background-color:var(--ax-message-other-color-fore);color:var(--ax-message-other-color)}ax-conversation-message.ax-state-other .ax-message-reply-container{background-color:var(--ax-message-other-reply-color);color:var(--ax-message-other-reply-color-fore)}ax-conversation-message .ax-conversation-controller button{width:2.5rem;height:2.5rem;border-radius:999rem;display:flex;align-items:center;justify-content:center}ax-conversation-message .ax-conversation-controller button ax-loading-spinner{display:flex}ax-conversation-message .ax-conversation-controller button.ax-state-error{background-color:rgba(var(--ax-color-danger-500));color:rgba(var(--ax-color-danger-fore))}ax-conversation-message .ax-conversation-controller button>i{width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700}ax-conversation-message .ax-message-content{display:block;padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem;border-radius:1rem;width:fit-content;max-width:50%}ax-conversation-message .ax-message-content.ax-state-own{border-end-end-radius:0!important;background-color:var(--ax-message-own-color);color:var(--ax-message-own-color-fore);justify-content:flex-end}ax-conversation-message .ax-message-content.ax-state-own .ax-chat-message-status{color:var(--ax-message-own-color-fore)}ax-conversation-message .ax-message-content.ax-state-other{border-end-start-radius:0!important;background-color:var(--ax-message-other-color);color:var(--ax-message-other-color-fore)}ax-conversation-message .ax-message-content.ax-state-other .ax-chat-message-status{color:var(--ax-message-other-color-fore)}ax-conversation-message .ax-message-content .ax-chat-message-status{display:flex;justify-content:space-between;align-items:center;font-size:.75rem}ax-conversation-message .ax-message-content .ax-chat-message-status>div{display:flex;gap:.125rem;align-items:center}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-message-status{color:var(--ax-message-status-color)}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-icon{font-weight:700;font-size:.875rem}ax-conversation-message .ax-message-content .ax-chat-message-status .ax-icon-error{color:rgba(var(--ax-color-danger-500))}ax-conversation-message .ax-message-content ax-prefix,ax-conversation-message .ax-message-content ax-suffix{display:none}ax-conversation-message .ax-resend-button{border-radius:999rem}ax-conversation-message .ax-cursor-pointer{cursor:pointer}ax-conversation-message .ax-rounded{border-radius:.75rem}ax-conversation-message .ax-message-content p{padding:.75rem;color:rgba(var(--ax-color-primary-fore))}@media (min-width: 320px) and (max-width: 600px){ax-conversation-message ax-avatar{display:none!important}ax-conversation-message .ax-message-content{max-width:100%}}\n"] }]
|
|
451
451
|
}], propDecorators: { __hostClass: [{
|
|
452
452
|
type: HostBinding,
|
|
453
453
|
args: ['class']
|
|
@@ -461,7 +461,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
|
|
|
461
461
|
type: Injectable
|
|
462
462
|
}] });
|
|
463
463
|
|
|
464
|
-
class
|
|
464
|
+
class AXConversationMessageAudioComponent extends AXConversationMessageBaseComponent {
|
|
465
465
|
constructor() {
|
|
466
466
|
super();
|
|
467
467
|
this.audioState = signal('paused');
|
|
@@ -530,12 +530,12 @@ class ConversationMessageAudioComponent extends AXConversationMessageBaseCompone
|
|
|
530
530
|
this.currentTimeFormat.set(Math.ceil(this.audioTag().nativeElement.currentTime * 1000));
|
|
531
531
|
});
|
|
532
532
|
}
|
|
533
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
534
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type:
|
|
533
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageAudioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
534
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationMessageAudioComponent, selector: "ax-conversation-message-audio", viewQueries: [{ propertyName: "audioTag", first: true, predicate: ["a"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<audio #a></audio>\n<ax-prefix>\n <div class=\"ax-time-rate\">\n @switch (audioState()) {\n @case ('paused') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @case ('playing') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @default {\n {{ durationFormat() | format: 'time-duration' | async }}\n }\n }\n <button class=\"ax-audio-speed\" (click)=\"handleRateClick()\">{{ audioRate() }}X</button>\n </div>\n</ax-prefix>\n<div class=\"ax-conversation-controller\">\n @switch (audioState()) {\n @case ('playing') {\n <button (click)=\"handlePauseClick()\">\n <i class=\"ax-icon ax-icon-pause\"></i>\n </button>\n }\n @case ('paused') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n }\n</div>\n<ax-slider\n class=\"ax-modify-bgSlider\"\n (onClick)=\"clickHandler($event)\"\n [maxValue]=\"duration()\"\n [minValue]=\"0\"\n [ngModel]=\"currentTime()\"\n color=\"secondary\"\n>\n</ax-slider>\n", styles: [".ax-time-rate button{margin-inline-start:.3rem;background-color:rgba(var(--ax-color-primary-fore));color:rgba(var(--ax-color-neutral-950));border-radius:.2rem;min-width:2rem}.ax-modify-bgSlider input[type=range]::-webkit-slider-runnable-track{background:rgba(var(--ax-color-primary-400));height:.5rem}.ax-modify-bgSlider input[type=range]::-moz-range-track{background:rgba(var(--ax-color-primary-400));height:.5rem}.ax-modify-bgSlider input[type=range]::-webkit-slider-thumb{margin-top:-.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i3$1.AXSliderComponent, selector: "ax-slider", inputs: ["readonly", "disabled", "value", "name", "color", "minValue", "maxValue", "step", "direction"], outputs: ["valueChange", "onValueChanged", "readonlyChange", "disabledChange", "onChange", "onClick"] }, { kind: "pipe", type: i4$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.AXFormatPipe, name: "format" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
535
535
|
}
|
|
536
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
536
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageAudioComponent, decorators: [{
|
|
537
537
|
type: Component,
|
|
538
|
-
args: [{ selector: 'ax-conversation-message-audio', template: "<audio #a></audio>\n<ax-prefix>\n <div class=\"ax-time-rate\">\n @switch (audioState()) {\n @case ('paused') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @case ('playing') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @default {\n {{ durationFormat() | format: 'time-duration' | async }}\n }\n }\n <button class=\"ax-audio-speed\" (click)=\"handleRateClick()\">{{ audioRate() }}X</button>\n </div>\n</ax-prefix>\n<div class=\"ax-conversation-controller\">\n @switch (audioState()) {\n @case ('playing') {\n <button (click)=\"handlePauseClick()\">\n <i class=\"ax-icon ax-icon-pause\"></i>\n </button>\n }\n @case ('paused') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n }\n</div>\n<ax-slider
|
|
538
|
+
args: [{ selector: 'ax-conversation-message-audio', encapsulation: ViewEncapsulation.None, template: "<audio #a></audio>\n<ax-prefix>\n <div class=\"ax-time-rate\">\n @switch (audioState()) {\n @case ('paused') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @case ('playing') {\n {{ currentTimeFormat() | format: 'time-duration' | async }}\n }\n @default {\n {{ durationFormat() | format: 'time-duration' | async }}\n }\n }\n <button class=\"ax-audio-speed\" (click)=\"handleRateClick()\">{{ audioRate() }}X</button>\n </div>\n</ax-prefix>\n<div class=\"ax-conversation-controller\">\n @switch (audioState()) {\n @case ('playing') {\n <button (click)=\"handlePauseClick()\">\n <i class=\"ax-icon ax-icon-pause\"></i>\n </button>\n }\n @case ('paused') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n }\n</div>\n<ax-slider\n class=\"ax-modify-bgSlider\"\n (onClick)=\"clickHandler($event)\"\n [maxValue]=\"duration()\"\n [minValue]=\"0\"\n [ngModel]=\"currentTime()\"\n color=\"secondary\"\n>\n</ax-slider>\n", styles: [".ax-time-rate button{margin-inline-start:.3rem;background-color:rgba(var(--ax-color-primary-fore));color:rgba(var(--ax-color-neutral-950));border-radius:.2rem;min-width:2rem}.ax-modify-bgSlider input[type=range]::-webkit-slider-runnable-track{background:rgba(var(--ax-color-primary-400));height:.5rem}.ax-modify-bgSlider input[type=range]::-moz-range-track{background:rgba(var(--ax-color-primary-400));height:.5rem}.ax-modify-bgSlider input[type=range]::-webkit-slider-thumb{margin-top:-.5rem}\n"] }]
|
|
539
539
|
}], ctorParameters: () => [] });
|
|
540
540
|
|
|
541
541
|
class AXConversationViewComponent extends MXBaseComponent {
|
|
@@ -574,8 +574,14 @@ class AXConversationFileMessageComponent extends AXConversationMessageBaseCompon
|
|
|
574
574
|
this.http = inject(HttpClient);
|
|
575
575
|
this.parent = inject(AXConversationViewComponent);
|
|
576
576
|
afterNextRender(() => {
|
|
577
|
-
|
|
578
|
-
|
|
577
|
+
if (this.message.name) {
|
|
578
|
+
this.fileName.set(this.message.name);
|
|
579
|
+
this.fileSize.set(this.fileService.getSize(this.message.content));
|
|
580
|
+
}
|
|
581
|
+
else {
|
|
582
|
+
this.fileName.set(this.message.content[0].name);
|
|
583
|
+
this.fileSize.set(this.message.content[0].size);
|
|
584
|
+
}
|
|
579
585
|
});
|
|
580
586
|
}
|
|
581
587
|
handleDownloadFile() {
|
|
@@ -606,7 +612,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
|
|
|
606
612
|
args: [{ selector: 'ax-conversation-message-image-popup', template: ` <div class="ax-image-popup-container"><img class="ax-image-popup" [src]="url" alt="" /></div>`, styles: [".ax-image-popup-container{display:flex;justify-content:center;align-items:center}.ax-image-popup{width:100%;height:auto;object-fit:cover}\n"] }]
|
|
607
613
|
}], ctorParameters: () => [] });
|
|
608
614
|
|
|
609
|
-
class
|
|
615
|
+
class AXConversationMessageImageComponent extends AXConversationMessageBaseComponent {
|
|
610
616
|
constructor() {
|
|
611
617
|
super();
|
|
612
618
|
this._imageUrl = signal('');
|
|
@@ -641,10 +647,10 @@ class ConversationMessageImageComponent extends AXConversationMessageBaseCompone
|
|
|
641
647
|
console.log(c);
|
|
642
648
|
});
|
|
643
649
|
}
|
|
644
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
645
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type:
|
|
650
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
651
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXConversationMessageImageComponent, selector: "ax-conversation-message-image", inputs: { message: "message" }, usesInheritance: true, ngImport: i0, template: `<img (click)="openPopup()" [src]="_imageUrl()" alt="" /> `, isInline: true, styles: ["img{cursor:pointer;margin-bottom:.5rem;width:100%;border-radius:.75rem}\n"] }); }
|
|
646
652
|
}
|
|
647
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
653
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageImageComponent, decorators: [{
|
|
648
654
|
type: Component,
|
|
649
655
|
args: [{ selector: 'ax-conversation-message-image', template: `<img (click)="openPopup()" [src]="_imageUrl()" alt="" /> `, inputs: ['message'], styles: ["img{cursor:pointer;margin-bottom:.5rem;width:100%;border-radius:.75rem}\n"] }]
|
|
650
656
|
}], ctorParameters: () => [] });
|
|
@@ -653,19 +659,101 @@ class AXConversationTextMessageComponent extends AXConversationMessageBaseCompon
|
|
|
653
659
|
constructor() {
|
|
654
660
|
super(...arguments);
|
|
655
661
|
this._text = signal('');
|
|
662
|
+
this.replyText = signal(null);
|
|
663
|
+
this.replyImage = signal(null);
|
|
664
|
+
this.replyVideo = signal(null);
|
|
665
|
+
this.replyAudio = signal(null);
|
|
666
|
+
this.replyVoice = signal(null);
|
|
667
|
+
this.replyFile = signal(null);
|
|
656
668
|
}
|
|
657
669
|
ngOnInit() {
|
|
658
670
|
this._text.set(this.message?.content);
|
|
671
|
+
if (!this.message?.replyTo)
|
|
672
|
+
return;
|
|
673
|
+
switch (this.message.replyTo.type) {
|
|
674
|
+
case 'text':
|
|
675
|
+
this.replyText.set(this.message?.replyTo);
|
|
676
|
+
break;
|
|
677
|
+
case 'image':
|
|
678
|
+
this.replyImage.set(this.message?.replyTo);
|
|
679
|
+
break;
|
|
680
|
+
case 'video':
|
|
681
|
+
this.replyVideo.set(this.message?.replyTo);
|
|
682
|
+
break;
|
|
683
|
+
case 'audio':
|
|
684
|
+
this.replyAudio.set(this.message?.replyTo);
|
|
685
|
+
break;
|
|
686
|
+
case 'voice':
|
|
687
|
+
this.replyVoice.set(this.message?.replyTo);
|
|
688
|
+
break;
|
|
689
|
+
case 'file':
|
|
690
|
+
this.replyFile.set(this.message?.replyTo);
|
|
691
|
+
break;
|
|
692
|
+
}
|
|
659
693
|
}
|
|
660
694
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationTextMessageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
661
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
695
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationTextMessageComponent, selector: "ng-component", inputs: { message: "message" }, usesInheritance: true, ngImport: i0, template: `
|
|
696
|
+
@if (replyText()) {
|
|
697
|
+
<div class="ax-message-reply-container">{{ replyText().content }}</div>
|
|
698
|
+
}
|
|
699
|
+
|
|
700
|
+
@if (replyImage()) {
|
|
701
|
+
<div class="ax-message-reply-container"><img [src]="replyImage()" alt="" /></div>
|
|
702
|
+
}
|
|
703
|
+
|
|
704
|
+
@if (replyVideo()) {
|
|
705
|
+
<div class="ax-message-reply-container"><video [src]="replyVideo()"></video></div>
|
|
706
|
+
}
|
|
707
|
+
|
|
708
|
+
@if (replyFile()) {
|
|
709
|
+
<div class="ax-message-reply-container">
|
|
710
|
+
<div class="file">
|
|
711
|
+
<i class="fa-regular fa-folder-open"></i>
|
|
712
|
+
{{ replyFile().name }}
|
|
713
|
+
</div>
|
|
714
|
+
</div>
|
|
715
|
+
}
|
|
716
|
+
|
|
717
|
+
@if (replyAudio() || replyVoice()) {
|
|
718
|
+
<div class="ax-message-reply-container">{{ replyAudio().type }}</div>
|
|
719
|
+
}
|
|
720
|
+
|
|
721
|
+
<div class="ax-text-message" [innerHtml]="_text()"></div>
|
|
722
|
+
`, isInline: true, styles: [".ax-text-message{word-break:break-all;white-space:break-spaces}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
662
723
|
}
|
|
663
724
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationTextMessageComponent, decorators: [{
|
|
664
725
|
type: Component,
|
|
665
|
-
args: [{ template:
|
|
726
|
+
args: [{ template: `
|
|
727
|
+
@if (replyText()) {
|
|
728
|
+
<div class="ax-message-reply-container">{{ replyText().content }}</div>
|
|
729
|
+
}
|
|
730
|
+
|
|
731
|
+
@if (replyImage()) {
|
|
732
|
+
<div class="ax-message-reply-container"><img [src]="replyImage()" alt="" /></div>
|
|
733
|
+
}
|
|
734
|
+
|
|
735
|
+
@if (replyVideo()) {
|
|
736
|
+
<div class="ax-message-reply-container"><video [src]="replyVideo()"></video></div>
|
|
737
|
+
}
|
|
738
|
+
|
|
739
|
+
@if (replyFile()) {
|
|
740
|
+
<div class="ax-message-reply-container">
|
|
741
|
+
<div class="file">
|
|
742
|
+
<i class="fa-regular fa-folder-open"></i>
|
|
743
|
+
{{ replyFile().name }}
|
|
744
|
+
</div>
|
|
745
|
+
</div>
|
|
746
|
+
}
|
|
747
|
+
|
|
748
|
+
@if (replyAudio() || replyVoice()) {
|
|
749
|
+
<div class="ax-message-reply-container">{{ replyAudio().type }}</div>
|
|
750
|
+
}
|
|
751
|
+
|
|
752
|
+
<div class="ax-text-message" [innerHtml]="_text()"></div>
|
|
753
|
+
`, encapsulation: ViewEncapsulation.None, inputs: ['message'], styles: [".ax-text-message{word-break:break-all;white-space:break-spaces}\n"] }]
|
|
666
754
|
}] });
|
|
667
755
|
|
|
668
|
-
class
|
|
756
|
+
class AXConversationMessageVideoComponent extends AXConversationMessageBaseComponent {
|
|
669
757
|
constructor() {
|
|
670
758
|
super(...arguments);
|
|
671
759
|
this._videoUrl = signal('');
|
|
@@ -674,15 +762,15 @@ class ConversationMessageVideoComponent extends AXConversationMessageBaseCompone
|
|
|
674
762
|
this._videoUrl.set(this.message?.content);
|
|
675
763
|
console.log(this._videoUrl());
|
|
676
764
|
}
|
|
677
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
678
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type:
|
|
765
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageVideoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
766
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: AXConversationMessageVideoComponent, selector: "ax-conversation-message-video", usesInheritance: true, ngImport: i0, template: `<video controls [src]="_videoUrl()"></video>`, isInline: true, styles: ["video{margin-bottom:.5rem;width:100%;border-radius:.75rem}\n"] }); }
|
|
679
767
|
}
|
|
680
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
768
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationMessageVideoComponent, decorators: [{
|
|
681
769
|
type: Component,
|
|
682
770
|
args: [{ selector: 'ax-conversation-message-video', template: `<video controls [src]="_videoUrl()"></video>`, styles: ["video{margin-bottom:.5rem;width:100%;border-radius:.75rem}\n"] }]
|
|
683
771
|
}] });
|
|
684
772
|
|
|
685
|
-
class
|
|
773
|
+
class AXConversationVoiceMessageComponent extends AXConversationMessageBaseComponent {
|
|
686
774
|
constructor() {
|
|
687
775
|
super();
|
|
688
776
|
this.config = { url: '' };
|
|
@@ -775,10 +863,10 @@ class AXConversationAudioMessageComponent extends AXConversationMessageBaseCompo
|
|
|
775
863
|
get __hostClass() {
|
|
776
864
|
return `${this.message.fromId ? 'ax-state-other' : 'ax-state-own'}`;
|
|
777
865
|
}
|
|
778
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
779
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type:
|
|
866
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationVoiceMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
867
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationVoiceMessageComponent, selector: "ax-conversation-message-audio", inputs: { message: "message" }, host: { properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "audio", first: true, predicate: ["a"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-prefix>\n @switch (audioState()) {\n @case ('paused') {\n {{ currentTime() | format: 'time-duration' | async }}\n }\n @case ('playing') {\n {{ currentTime() | format: 'time-duration' | async }}\n }\n @default {\n {{ duration() | format: 'time-duration' | async }}\n }\n }\n <button class=\"ax-audio-speed\" (click)=\"handleRateClick()\"></button>\n</ax-prefix>\n<div class=\"ax-conversation-controller\">\n @switch (audioState()) {\n @case ('playing') {\n <button (click)=\"handlePauseClick()\">\n <i class=\"ax-icon ax-icon-pause\"></i>\n </button>\n }\n\n @case ('ready') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n\n @case ('paused') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n\n @case ('error') {\n <button class=\"ax-state-error\" (click)=\"handleReloadClick()\">\n <i class=\"ax-icon ax-icon-reload\"></i>\n </button>\n }\n\n @default {\n <button (click)=\"handleCancelLoading()\">\n <ax-loading-spinner\n [size]=\"24\"\n [stroke]=\"2\"\n [color]=\"message.fromId ? 'var(--ax-other-color)' : 'var(--ax-own-color)'\"\n ></ax-loading-spinner>\n </button>\n }\n }\n</div>\n<ax-audio-wave #a [config]=\"config\" (onStatusChanged)=\"handleOnStatusChanged($event)\"></ax-audio-wave>\n<ax-suffix>\n <div class=\"ax-audio-rate-button\" [class.ax-state-own]=\"!message?.fromId\" (click)=\"handleRateClick()\">{{ selectedRate() }}X</div>\n</ax-suffix>\n", styles: ["ax-conversation-message-audio{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-width:18rem;max-width:100%}ax-conversation-message-audio .ax-audio-wave{flex:1}.ax-audio-rate-button{background-color:var(--ax-message-other-color-fore);color:var(--ax-message-other-color);border-radius:.5rem;padding:0 .5rem;font-weight:700;margin-inline-end:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}.ax-audio-rate-button.ax-state-own{background-color:var(--ax-message-own-color-fore);color:var(--ax-message-own-color)}html[dir=rtl] ax-conversation-message-audio{flex-direction:row-reverse}\n"], dependencies: [{ kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i2$2.AXAudioWaveComponent, selector: "ax-audio-wave", inputs: ["config"], outputs: ["onStatusChanged"] }, { kind: "component", type: i2$1.AXLoadingSpinnerComponent, selector: "ax-loading-spinner", inputs: ["color", "size", "stroke"] }, { kind: "pipe", type: i4$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.AXFormatPipe, name: "format" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
780
868
|
}
|
|
781
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type:
|
|
869
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationVoiceMessageComponent, decorators: [{
|
|
782
870
|
type: Component,
|
|
783
871
|
args: [{ selector: 'ax-conversation-message-audio', encapsulation: ViewEncapsulation.None, inputs: ['message'], template: "<ax-prefix>\n @switch (audioState()) {\n @case ('paused') {\n {{ currentTime() | format: 'time-duration' | async }}\n }\n @case ('playing') {\n {{ currentTime() | format: 'time-duration' | async }}\n }\n @default {\n {{ duration() | format: 'time-duration' | async }}\n }\n }\n <button class=\"ax-audio-speed\" (click)=\"handleRateClick()\"></button>\n</ax-prefix>\n<div class=\"ax-conversation-controller\">\n @switch (audioState()) {\n @case ('playing') {\n <button (click)=\"handlePauseClick()\">\n <i class=\"ax-icon ax-icon-pause\"></i>\n </button>\n }\n\n @case ('ready') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n\n @case ('paused') {\n <button (click)=\"handlePlayClick()\">\n <i class=\"ax-icon ax-icon-play\"></i>\n </button>\n }\n\n @case ('error') {\n <button class=\"ax-state-error\" (click)=\"handleReloadClick()\">\n <i class=\"ax-icon ax-icon-reload\"></i>\n </button>\n }\n\n @default {\n <button (click)=\"handleCancelLoading()\">\n <ax-loading-spinner\n [size]=\"24\"\n [stroke]=\"2\"\n [color]=\"message.fromId ? 'var(--ax-other-color)' : 'var(--ax-own-color)'\"\n ></ax-loading-spinner>\n </button>\n }\n }\n</div>\n<ax-audio-wave #a [config]=\"config\" (onStatusChanged)=\"handleOnStatusChanged($event)\"></ax-audio-wave>\n<ax-suffix>\n <div class=\"ax-audio-rate-button\" [class.ax-state-own]=\"!message?.fromId\" (click)=\"handleRateClick()\">{{ selectedRate() }}X</div>\n</ax-suffix>\n", styles: ["ax-conversation-message-audio{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-width:18rem;max-width:100%}ax-conversation-message-audio .ax-audio-wave{flex:1}.ax-audio-rate-button{background-color:var(--ax-message-other-color-fore);color:var(--ax-message-other-color);border-radius:.5rem;padding:0 .5rem;font-weight:700;margin-inline-end:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}.ax-audio-rate-button.ax-state-own{background-color:var(--ax-message-own-color-fore);color:var(--ax-message-own-color)}html[dir=rtl] ax-conversation-message-audio{flex-direction:row-reverse}\n"] }]
|
|
784
872
|
}], ctorParameters: () => [], propDecorators: { audio: [{
|
|
@@ -794,12 +882,12 @@ const COMPONENT = [
|
|
|
794
882
|
AXConversationInputComponent,
|
|
795
883
|
AXConversationMessageComponent,
|
|
796
884
|
AXConversationTextMessageComponent,
|
|
797
|
-
|
|
885
|
+
AXConversationVoiceMessageComponent,
|
|
798
886
|
AXConversationFileMessageComponent,
|
|
799
887
|
AXConversationContainerComponent,
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
888
|
+
AXConversationMessageAudioComponent,
|
|
889
|
+
AXConversationMessageImageComponent,
|
|
890
|
+
AXConversationMessageVideoComponent,
|
|
803
891
|
];
|
|
804
892
|
const MODULES = [
|
|
805
893
|
CommonModule,
|
|
@@ -838,7 +926,7 @@ class AXConversationModule {
|
|
|
838
926
|
});
|
|
839
927
|
registry.register({
|
|
840
928
|
name: 'voice',
|
|
841
|
-
component:
|
|
929
|
+
component: AXConversationVoiceMessageComponent,
|
|
842
930
|
});
|
|
843
931
|
registry.register({
|
|
844
932
|
name: 'file',
|
|
@@ -846,15 +934,15 @@ class AXConversationModule {
|
|
|
846
934
|
});
|
|
847
935
|
registry.register({
|
|
848
936
|
name: 'audio',
|
|
849
|
-
component:
|
|
937
|
+
component: AXConversationMessageAudioComponent,
|
|
850
938
|
});
|
|
851
939
|
registry.register({
|
|
852
940
|
name: 'image',
|
|
853
|
-
component:
|
|
941
|
+
component: AXConversationMessageImageComponent,
|
|
854
942
|
});
|
|
855
943
|
registry.register({
|
|
856
944
|
name: 'video',
|
|
857
|
-
component:
|
|
945
|
+
component: AXConversationMessageVideoComponent,
|
|
858
946
|
});
|
|
859
947
|
},
|
|
860
948
|
deps: [AXConversationMessageTypeRegistryService],
|
|
@@ -893,12 +981,12 @@ class AXConversationModule {
|
|
|
893
981
|
AXConversationInputComponent,
|
|
894
982
|
AXConversationMessageComponent,
|
|
895
983
|
AXConversationTextMessageComponent,
|
|
896
|
-
|
|
984
|
+
AXConversationVoiceMessageComponent,
|
|
897
985
|
AXConversationFileMessageComponent,
|
|
898
986
|
AXConversationContainerComponent,
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
987
|
+
AXConversationMessageAudioComponent,
|
|
988
|
+
AXConversationMessageImageComponent,
|
|
989
|
+
AXConversationMessageVideoComponent], imports: [CommonModule,
|
|
902
990
|
FormsModule,
|
|
903
991
|
AsyncPipe,
|
|
904
992
|
AXRippleDirective,
|
|
@@ -919,12 +1007,12 @@ class AXConversationModule {
|
|
|
919
1007
|
AXConversationInputComponent,
|
|
920
1008
|
AXConversationMessageComponent,
|
|
921
1009
|
AXConversationTextMessageComponent,
|
|
922
|
-
|
|
1010
|
+
AXConversationVoiceMessageComponent,
|
|
923
1011
|
AXConversationFileMessageComponent,
|
|
924
1012
|
AXConversationContainerComponent,
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
1013
|
+
AXConversationMessageAudioComponent,
|
|
1014
|
+
AXConversationMessageImageComponent,
|
|
1015
|
+
AXConversationMessageVideoComponent] }); }
|
|
928
1016
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXConversationModule, providers: [AXRecordingService, AXConversationService, AXPopupService], imports: [CommonModule,
|
|
929
1017
|
FormsModule,
|
|
930
1018
|
AXButtonModule,
|
|
@@ -960,5 +1048,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
|
|
|
960
1048
|
* Generated bundle index. Do not edit.
|
|
961
1049
|
*/
|
|
962
1050
|
|
|
963
|
-
export { AXConversationActionEvent,
|
|
1051
|
+
export { AXConversationActionEvent, AXConversationContainerComponent, AXConversationFileMessageComponent, AXConversationInputComponent, AXConversationMessageAudioComponent, AXConversationMessageBaseComponent, AXConversationMessageComponent, AXConversationMessageImageComponent, AXConversationMessageTypeRegistryService, AXConversationMessageVideoComponent, AXConversationModule, AXConversationService, AXConversationTextMessageComponent, AXConversationViewComponent, AXConversationVoiceMessageComponent, AXRecordingService, ConversationMessageImagePopupComponent };
|
|
964
1052
|
//# sourceMappingURL=acorex-components-conversation.mjs.map
|