@acorex/components 18.4.1 → 18.4.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (30) hide show
  1. package/conversation/lib/conversation-message/conversation-message.component.d.ts +1 -1
  2. package/conversation/lib/conversation-messages/conversation-message-audio/conversation-message-audio.component.d.ts +3 -3
  3. package/conversation/lib/conversation-messages/conversation-message-image/conversation-message-image.component.d.ts +3 -3
  4. package/conversation/lib/conversation-messages/conversation-message-text/conversation-message-text.component.d.ts +7 -1
  5. package/conversation/lib/conversation-messages/conversation-message-video/conversation-message-video.component.d.ts +3 -3
  6. package/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.d.ts +3 -3
  7. package/conversation/lib/conversation.module.d.ts +1 -1
  8. package/conversation/lib/conversation.types.d.ts +1 -1
  9. package/data-table/lib/columns/row-select-column.component.d.ts +1 -0
  10. package/esm2022/button/lib/button.component.mjs +2 -2
  11. package/esm2022/conversation/lib/conversation-message/conversation-message.component.mjs +4 -4
  12. package/esm2022/conversation/lib/conversation-messages/conversation-message-audio/conversation-message-audio.component.mjs +7 -7
  13. package/esm2022/conversation/lib/conversation-messages/conversation-message-file/conversation-message-file.component.mjs +9 -3
  14. package/esm2022/conversation/lib/conversation-messages/conversation-message-image/conversation-message-image.component.mjs +5 -5
  15. package/esm2022/conversation/lib/conversation-messages/conversation-message-text/conversation-message-text.component.mjs +85 -3
  16. package/esm2022/conversation/lib/conversation-messages/conversation-message-video/conversation-message-video.component.mjs +5 -5
  17. package/esm2022/conversation/lib/conversation-messages/conversation-message-voice/conversation-message-voice.component.mjs +5 -5
  18. package/esm2022/conversation/lib/conversation.module.mjs +21 -21
  19. package/esm2022/conversation/lib/conversation.types.mjs +1 -1
  20. package/esm2022/data-table/lib/columns/row-select-column.component.mjs +15 -4
  21. package/esm2022/otp/lib/otp.component.mjs +2 -1
  22. package/fesm2022/acorex-components-button.mjs +2 -2
  23. package/fesm2022/acorex-components-button.mjs.map +1 -1
  24. package/fesm2022/acorex-components-conversation.mjs +129 -41
  25. package/fesm2022/acorex-components-conversation.mjs.map +1 -1
  26. package/fesm2022/acorex-components-data-table.mjs +14 -3
  27. package/fesm2022/acorex-components-data-table.mjs.map +1 -1
  28. package/fesm2022/acorex-components-otp.mjs +1 -0
  29. package/fesm2022/acorex-components-otp.mjs.map +1 -1
  30. package/package.json +43 -43
@@ -273,7 +273,7 @@ class AXButtonComponent extends MXButtonBaseComponent {
273
273
  { provide: AXComponent, useExisting: AXButtonComponent },
274
274
  { provide: AXButtonItemComponent, useExisting: AXButtonComponent },
275
275
  { provide: AXFocusableComponent, useExisting: AXButtonComponent },
276
- ], usesInheritance: true, ngImport: i0, template: "<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>", styles: ["ax-button{position:relative;display:inline-flex;height:var(--ax-size-default);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);font-size:.875rem;line-height:1.25rem;outline:2px solid transparent;outline-offset:2px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-button.ax-xs{font-size:.75rem;line-height:1rem}ax-button.ax-xs>button{padding-left:.25rem;padding-right:.25rem}ax-button.ax-sm>button{padding-left:.5rem;padding-right:.5rem}ax-button.ax-sm,ax-button.ax-md{font-size:.875rem;line-height:1.25rem}ax-button.ax-lg{font-size:1rem;line-height:1.25rem}ax-button.ax-lg>button{padding-left:1.5rem;padding-right:1.5rem}ax-button.ax-xl{font-size:1.125rem;line-height:1.75rem}ax-button.ax-xl>button{padding-left:2rem;padding-right:2rem}ax-button.ax-xl.ax-button-icon{font-size:1.5rem}ax-button.ax-xs.ax-button-icon,ax-button.ax-sm.ax-button-icon{font-size:1rem}ax-button.ax-button-icon{height:var(--ax-size-default);width:var(--ax-size-default);font-size:1.25rem}ax-button.ax-state-disabled,ax-button.ax-state-loading{opacity:.5}ax-button.ax-state-disabled>button,ax-button.ax-state-loading>button{cursor:not-allowed}ax-button>button{position:relative;display:inline-flex;height:100%;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-rounded-border-default);padding-left:1rem;padding-right:1rem;outline-color:transparent}ax-button>button.ax-state-focus:focus,ax-button>button:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#000;border-radius:inherit}ax-button>button .ax-button-text{white-space:nowrap;padding-left:.5rem;padding-right:.5rem;font-weight:500;line-height:1}ax-button ax-button-item.ax-divided{border-bottom-width:1px!important;border-color:rgba(var(--ax-color-border-default))!important}\n"], dependencies: [{ kind: "directive", type: i3.AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
276
+ ], usesInheritance: true, ngImport: i0, template: "<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>", styles: ["ax-button{position:relative;display:inline-flex;height:var(--ax-size-default);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);font-size:.875rem;line-height:1.25rem;outline:2px solid transparent;outline-offset:2px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-button.ax-xs{font-size:.75rem;line-height:1rem}ax-button.ax-xs>button{padding-left:.25rem;padding-right:.25rem}ax-button.ax-sm>button{padding-left:.5rem;padding-right:.5rem}ax-button.ax-sm,ax-button.ax-md{font-size:.875rem;line-height:1.25rem}ax-button.ax-lg{font-size:1rem;line-height:1.25rem}ax-button.ax-lg>button{padding-left:1.5rem;padding-right:1.5rem}ax-button.ax-xl{font-size:1.125rem;line-height:1.75rem}ax-button.ax-xl>button{padding-left:2rem;padding-right:2rem}ax-button.ax-xl.ax-button-icon{font-size:1.5rem}ax-button.ax-xs.ax-button-icon,ax-button.ax-sm.ax-button-icon{font-size:1rem}ax-button.ax-button-icon{height:var(--ax-size-default);width:var(--ax-size-default);font-size:1.25rem}ax-button.ax-state-disabled,ax-button.ax-state-loading{opacity:.5}ax-button.ax-state-disabled>button,ax-button.ax-state-loading>button{cursor:not-allowed}ax-button>button{position:relative;display:inline-flex;height:100%;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:inherit;padding-left:1rem;padding-right:1rem;outline-color:transparent}ax-button>button.ax-state-focus:focus,ax-button>button:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#000;border-radius:inherit}ax-button>button .ax-button-text{white-space:nowrap;padding-left:.5rem;padding-right:.5rem;font-weight:500;line-height:1}ax-button ax-button-item.ax-divided{border-bottom-width:1px!important;border-color:rgba(var(--ax-color-border-default))!important}\n"], dependencies: [{ kind: "directive", type: i3.AXRippleDirective, selector: "[axRipple]", inputs: ["axRipple", "axRippleColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
277
277
  }
278
278
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXButtonComponent, decorators: [{
279
279
  type: Component,
@@ -281,7 +281,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
281
281
  { provide: AXComponent, useExisting: AXButtonComponent },
282
282
  { provide: AXButtonItemComponent, useExisting: AXButtonComponent },
283
283
  { provide: AXFocusableComponent, useExisting: AXButtonComponent },
284
- ], template: "<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>", styles: ["ax-button{position:relative;display:inline-flex;height:var(--ax-size-default);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);font-size:.875rem;line-height:1.25rem;outline:2px solid transparent;outline-offset:2px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-button.ax-xs{font-size:.75rem;line-height:1rem}ax-button.ax-xs>button{padding-left:.25rem;padding-right:.25rem}ax-button.ax-sm>button{padding-left:.5rem;padding-right:.5rem}ax-button.ax-sm,ax-button.ax-md{font-size:.875rem;line-height:1.25rem}ax-button.ax-lg{font-size:1rem;line-height:1.25rem}ax-button.ax-lg>button{padding-left:1.5rem;padding-right:1.5rem}ax-button.ax-xl{font-size:1.125rem;line-height:1.75rem}ax-button.ax-xl>button{padding-left:2rem;padding-right:2rem}ax-button.ax-xl.ax-button-icon{font-size:1.5rem}ax-button.ax-xs.ax-button-icon,ax-button.ax-sm.ax-button-icon{font-size:1rem}ax-button.ax-button-icon{height:var(--ax-size-default);width:var(--ax-size-default);font-size:1.25rem}ax-button.ax-state-disabled,ax-button.ax-state-loading{opacity:.5}ax-button.ax-state-disabled>button,ax-button.ax-state-loading>button{cursor:not-allowed}ax-button>button{position:relative;display:inline-flex;height:100%;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-rounded-border-default);padding-left:1rem;padding-right:1rem;outline-color:transparent}ax-button>button.ax-state-focus:focus,ax-button>button:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#000;border-radius:inherit}ax-button>button .ax-button-text{white-space:nowrap;padding-left:.5rem;padding-right:.5rem;font-weight:500;line-height:1}ax-button ax-button-item.ax-divided{border-bottom-width:1px!important;border-color:rgba(var(--ax-color-border-default))!important}\n"] }]
284
+ ], template: "<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>", styles: ["ax-button{position:relative;display:inline-flex;height:var(--ax-size-default);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);font-size:.875rem;line-height:1.25rem;outline:2px solid transparent;outline-offset:2px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-button.ax-xs{font-size:.75rem;line-height:1rem}ax-button.ax-xs>button{padding-left:.25rem;padding-right:.25rem}ax-button.ax-sm>button{padding-left:.5rem;padding-right:.5rem}ax-button.ax-sm,ax-button.ax-md{font-size:.875rem;line-height:1.25rem}ax-button.ax-lg{font-size:1rem;line-height:1.25rem}ax-button.ax-lg>button{padding-left:1.5rem;padding-right:1.5rem}ax-button.ax-xl{font-size:1.125rem;line-height:1.75rem}ax-button.ax-xl>button{padding-left:2rem;padding-right:2rem}ax-button.ax-xl.ax-button-icon{font-size:1.5rem}ax-button.ax-xs.ax-button-icon,ax-button.ax-sm.ax-button-icon{font-size:1rem}ax-button.ax-button-icon{height:var(--ax-size-default);width:var(--ax-size-default);font-size:1.25rem}ax-button.ax-state-disabled,ax-button.ax-state-loading{opacity:.5}ax-button.ax-state-disabled>button,ax-button.ax-state-loading>button{cursor:not-allowed}ax-button>button{position:relative;display:inline-flex;height:100%;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:inherit;padding-left:1rem;padding-right:1rem;outline-color:transparent}ax-button>button.ax-state-focus:focus,ax-button>button:focus-visible{outline-width:2px;outline-offset:2px;outline-color:#000;border-radius:inherit}ax-button>button .ax-button-text{white-space:nowrap;padding-left:.5rem;padding-right:.5rem;font-weight:500;line-height:1}ax-button ax-button-item.ax-divided{border-bottom-width:1px!important;border-color:rgba(var(--ax-color-border-default))!important}\n"] }]
285
285
  }], propDecorators: { __hostClass: [{
286
286
  type: HostBinding,
287
287
  args: ['class']
@@ -1 +1 @@
1
- {"version":3,"file":"acorex-components-button.mjs","sources":["../../../../libs/components/button/src/lib/button-item.component.ts","../../../../libs/components/button/src/lib/button-item-list.component.ts","../../../../libs/components/button/src/lib/button.component.ts","../../../../libs/components/button/src/lib/button.component.html","../../../../libs/components/button/src/lib/button.module.ts","../../../../libs/components/button/src/acorex-components-button.ts"],"sourcesContent":["import { AXClickEvent, AXStyleColorType, MXColorComponent, MXInteractiveComponent } from '@acorex/components/common';\n\nimport {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n Output,\n ViewEncapsulation,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\nexport interface AXButtonItemListItem {\n name: string;\n text: string;\n icon: string;\n divided?: boolean;\n disabled?: boolean;\n color?: AXStyleColorType;\n}\n\n@Component({\n selector: 'ax-button-item',\n template: `\n <ng-content select=\"ax-prefix\"> </ng-content>\n <ng-content select=\"ax-loading\"> </ng-content>\n <ng-content select=\"ax-icon\"> </ng-content>\n @if (text) {\n <span class=\"ax-button-item-text\">{{ text }}</span>\n }\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n `,\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n inputs: ['color', 'disabled'],\n outputs: ['onClick', 'onFocus', 'onBlur', 'disabledChange'],\n})\nexport class AXButtonItemComponent extends classes(MXInteractiveComponent, MXColorComponent) {\n @Input()\n text: string;\n\n private _selected: boolean;\n @Input()\n public get selected(): boolean {\n return this._selected;\n }\n public set selected(v: boolean) {\n this._selected = v;\n this.cdr.markForCheck();\n }\n\n @Input()\n divided = false;\n\n @Input()\n data: unknown;\n\n @Input()\n name: string;\n\n @Output()\n onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();\n\n @HostListener('click', ['$event'])\n private __hostClick(e: MouseEvent) {\n if (!this.disabled) {\n this.onClick.emit({\n component: this,\n htmlElement: this.getHostElement(),\n nativeEvent: e,\n });\n }\n }\n\n @HostListener('focus', ['$event'])\n private __hostFocus(e: FocusEvent) {\n this.emitOnFocusEvent(e);\n }\n\n @HostListener('blur', ['$event'])\n private __hostBlur(e: FocusEvent) {\n this.emitOnBlurEvent(e);\n }\n\n @HostBinding('class')\n private get __hostClass(): string {\n const cssClasses = {\n 'ax-button-icon': !this.text,\n 'ax-state-disabled': this.disabled,\n 'ax-state-selected': this.selected,\n 'ax-divided': this.divided,\n };\n cssClasses[`ax-${this.color || 'primary'}-default`] = true;\n return Object.entries(cssClasses)\n .filter((c) => c[1])\n .map((c) => c[0])\n .join(' ');\n }\n\n @HostBinding('attr.tabindex') tabindex = '0';\n}\n","import { AXClickEvent, AXClosbaleComponent, AXItemClickEvent, MXInteractiveComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n Inject,\n Optional,\n Output,\n QueryList,\n ViewEncapsulation,\n afterNextRender,\n input,\n} from '@angular/core';\nimport { AXButtonItemComponent, AXButtonItemListItem } from './button-item.component';\n\n@Component({\n selector: 'ax-button-item-list',\n template: `\n @for (item of items(); track item.name) {\n <ax-button-item\n [text]=\"item.text\"\n [name]=\"item.name\"\n [disabled]=\"item.disabled\"\n [color]=\"item.color\"\n (onClick)=\"_handleOnItemClick($event)\"\n >\n @if (item.icon) {\n <ax-prefix>\n <ax-icon [icon]=\"item.icon\"></ax-icon>\n </ax-prefix>\n }\n </ax-button-item>\n @if (item.divided) {\n <ax-divider></ax-divider>\n }\n }\n <ng-content select=\"ax-button-item, ax-title, ax-divider, ng-container\"></ng-content>\n `,\n styleUrls: ['./button-item-list.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXButtonItemListComponent extends MXInteractiveComponent {\n @ContentChildren(AXButtonItemComponent)\n protected _contentButtons: QueryList<AXButtonItemComponent>;\n\n items = input<AXButtonItemListItem[]>([]);\n\n @Output()\n onItemClick: EventEmitter<AXItemClickEvent<AXButtonItemComponent>> = new EventEmitter<AXItemClickEvent<AXButtonItemComponent>>();\n\n constructor(\n @Optional()\n @Inject(AXClosbaleComponent)\n private parent?: AXClosbaleComponent,\n ) {\n super();\n afterNextRender(() => {\n this._initContents();\n this._contentButtons.changes.subscribe(() => {\n this._initContents();\n });\n });\n }\n\n private _initContents() {\n this._bindEvents();\n this._bindProps();\n this.cdr.markForCheck();\n }\n\n private _bindEvents() {\n this._contentButtons?.forEach((b) => {\n if (!b.onClick.length)\n b.onClick.subscribe((c) => {\n this._handleOnItemClick(c);\n });\n });\n }\n\n private _bindProps() {\n this._contentButtons?.forEach((b) => {\n b.disabled = b.disabled ?? this.disabled;\n });\n }\n\n protected _handleOnItemClick(e: AXClickEvent) {\n this.parent?.close();\n this._emitOnItemClickEvent(e, e.component);\n }\n\n _emitOnItemClickEvent(e: AXClickEvent, item: AXButtonItemComponent): void {\n this.onItemClick.emit({\n component: this,\n item,\n htmlElement: this.getHostElement(),\n nativeEvent: e.nativeEvent,\n name: item.name,\n data: item.data,\n });\n }\n}\n","import { AXClickEvent, AXComponent, AXFocusableComponent, MXButtonBaseComponent } from '@acorex/components/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n ViewEncapsulation,\n input,\n model,\n} from '@angular/core';\nimport { AXButtonType } from './button-item.class';\nimport { AXButtonItemComponent } from './button-item.component';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n selector: 'ax-button',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n inputs: ['disabled', 'size', 'tabIndex', 'color', 'look', 'text', 'toggleable', 'selected'],\n outputs: ['onBlur', 'onFocus', 'onClick', 'selectedChange', 'toggleableChange', 'lookChange', 'colorChange', 'disabledChange'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n { provide: AXComponent, useExisting: AXButtonComponent },\n { provide: AXButtonItemComponent, useExisting: AXButtonComponent },\n { provide: AXFocusableComponent, useExisting: AXButtonComponent },\n ],\n})\nexport class AXButtonComponent extends MXButtonBaseComponent implements AfterViewInit {\n /**\n * Fires each time the user clicks the button.\n * @event\n */\n onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();\n\n type = input<AXButtonType>('button');\n\n loadingText = model<string | null>(null);\n\n ngAfterViewInit(): void {\n this.getHostElement().removeAttribute('tabindex');\n }\n\n private getButton(): HTMLButtonElement {\n return this.getHostElement().firstElementChild as HTMLButtonElement;\n }\n\n _handleClick(e: MouseEvent) {\n if (this.disabled) {\n e.preventDefault();\n return;\n }\n if (this.toggleable) {\n this.selected = !this.selected;\n }\n this.onClick.emit({\n component: this,\n htmlElement: this.getHostElement(),\n nativeEvent: e,\n });\n\n // TODO: check keyboard event\n setTimeout(() => {\n this.blur();\n });\n }\n\n click() {\n this.getButton()?.click();\n }\n\n @HostBinding('class')\n private get __hostClass(): string[] {\n return Object.entries(this.cssClasses)\n .filter((c) => c[1])\n .map((c) => c[0]);\n }\n\n override focus() {\n this.getButton()?.focus();\n this.getButton().classList.add('ax-state-focus');\n }\n override blur() {\n this.getButton().classList.remove('ax-state-focus');\n }\n}\n","<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>","import { AXCommonModule, AXRippleDirective } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXButtonItemListComponent } from './button-item-list.component';\nimport { AXButtonItemComponent } from './button-item.component';\nimport { AXButtonComponent } from './button.component';\n\nconst COMPONENT = [\n AXButtonComponent,\n AXButtonItemComponent,\n AXButtonItemListComponent,\n];\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n AXDecoratorModule,\n AXLoadingModule,\n AXRippleDirective,\n];\n\n@NgModule({\n imports: [MODULES],\n exports: [...COMPONENT],\n declarations: [...COMPONENT],\n providers: [],\n})\nexport class AXButtonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2.AXButtonItemComponent","i1"],"mappings":"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"}
1
+ {"version":3,"file":"acorex-components-button.mjs","sources":["../../../../libs/components/button/src/lib/button-item.component.ts","../../../../libs/components/button/src/lib/button-item-list.component.ts","../../../../libs/components/button/src/lib/button.component.ts","../../../../libs/components/button/src/lib/button.component.html","../../../../libs/components/button/src/lib/button.module.ts","../../../../libs/components/button/src/acorex-components-button.ts"],"sourcesContent":["import { AXClickEvent, AXStyleColorType, MXColorComponent, MXInteractiveComponent } from '@acorex/components/common';\n\nimport {\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n HostListener,\n Input,\n Output,\n ViewEncapsulation,\n} from '@angular/core';\nimport { classes } from 'polytype';\n\nexport interface AXButtonItemListItem {\n name: string;\n text: string;\n icon: string;\n divided?: boolean;\n disabled?: boolean;\n color?: AXStyleColorType;\n}\n\n@Component({\n selector: 'ax-button-item',\n template: `\n <ng-content select=\"ax-prefix\"> </ng-content>\n <ng-content select=\"ax-loading\"> </ng-content>\n <ng-content select=\"ax-icon\"> </ng-content>\n @if (text) {\n <span class=\"ax-button-item-text\">{{ text }}</span>\n }\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n `,\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n inputs: ['color', 'disabled'],\n outputs: ['onClick', 'onFocus', 'onBlur', 'disabledChange'],\n})\nexport class AXButtonItemComponent extends classes(MXInteractiveComponent, MXColorComponent) {\n @Input()\n text: string;\n\n private _selected: boolean;\n @Input()\n public get selected(): boolean {\n return this._selected;\n }\n public set selected(v: boolean) {\n this._selected = v;\n this.cdr.markForCheck();\n }\n\n @Input()\n divided = false;\n\n @Input()\n data: unknown;\n\n @Input()\n name: string;\n\n @Output()\n onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();\n\n @HostListener('click', ['$event'])\n private __hostClick(e: MouseEvent) {\n if (!this.disabled) {\n this.onClick.emit({\n component: this,\n htmlElement: this.getHostElement(),\n nativeEvent: e,\n });\n }\n }\n\n @HostListener('focus', ['$event'])\n private __hostFocus(e: FocusEvent) {\n this.emitOnFocusEvent(e);\n }\n\n @HostListener('blur', ['$event'])\n private __hostBlur(e: FocusEvent) {\n this.emitOnBlurEvent(e);\n }\n\n @HostBinding('class')\n private get __hostClass(): string {\n const cssClasses = {\n 'ax-button-icon': !this.text,\n 'ax-state-disabled': this.disabled,\n 'ax-state-selected': this.selected,\n 'ax-divided': this.divided,\n };\n cssClasses[`ax-${this.color || 'primary'}-default`] = true;\n return Object.entries(cssClasses)\n .filter((c) => c[1])\n .map((c) => c[0])\n .join(' ');\n }\n\n @HostBinding('attr.tabindex') tabindex = '0';\n}\n","import { AXClickEvent, AXClosbaleComponent, AXItemClickEvent, MXInteractiveComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n EventEmitter,\n Inject,\n Optional,\n Output,\n QueryList,\n ViewEncapsulation,\n afterNextRender,\n input,\n} from '@angular/core';\nimport { AXButtonItemComponent, AXButtonItemListItem } from './button-item.component';\n\n@Component({\n selector: 'ax-button-item-list',\n template: `\n @for (item of items(); track item.name) {\n <ax-button-item\n [text]=\"item.text\"\n [name]=\"item.name\"\n [disabled]=\"item.disabled\"\n [color]=\"item.color\"\n (onClick)=\"_handleOnItemClick($event)\"\n >\n @if (item.icon) {\n <ax-prefix>\n <ax-icon [icon]=\"item.icon\"></ax-icon>\n </ax-prefix>\n }\n </ax-button-item>\n @if (item.divided) {\n <ax-divider></ax-divider>\n }\n }\n <ng-content select=\"ax-button-item, ax-title, ax-divider, ng-container\"></ng-content>\n `,\n styleUrls: ['./button-item-list.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXButtonItemListComponent extends MXInteractiveComponent {\n @ContentChildren(AXButtonItemComponent)\n protected _contentButtons: QueryList<AXButtonItemComponent>;\n\n items = input<AXButtonItemListItem[]>([]);\n\n @Output()\n onItemClick: EventEmitter<AXItemClickEvent<AXButtonItemComponent>> = new EventEmitter<AXItemClickEvent<AXButtonItemComponent>>();\n\n constructor(\n @Optional()\n @Inject(AXClosbaleComponent)\n private parent?: AXClosbaleComponent,\n ) {\n super();\n afterNextRender(() => {\n this._initContents();\n this._contentButtons.changes.subscribe(() => {\n this._initContents();\n });\n });\n }\n\n private _initContents() {\n this._bindEvents();\n this._bindProps();\n this.cdr.markForCheck();\n }\n\n private _bindEvents() {\n this._contentButtons?.forEach((b) => {\n if (!b.onClick.length)\n b.onClick.subscribe((c) => {\n this._handleOnItemClick(c);\n });\n });\n }\n\n private _bindProps() {\n this._contentButtons?.forEach((b) => {\n b.disabled = b.disabled ?? this.disabled;\n });\n }\n\n protected _handleOnItemClick(e: AXClickEvent) {\n this.parent?.close();\n this._emitOnItemClickEvent(e, e.component);\n }\n\n _emitOnItemClickEvent(e: AXClickEvent, item: AXButtonItemComponent): void {\n this.onItemClick.emit({\n component: this,\n item,\n htmlElement: this.getHostElement(),\n nativeEvent: e.nativeEvent,\n name: item.name,\n data: item.data,\n });\n }\n}\n","import { AXClickEvent, AXComponent, AXFocusableComponent, MXButtonBaseComponent } from '@acorex/components/common';\nimport {\n AfterViewInit,\n ChangeDetectionStrategy,\n Component,\n EventEmitter,\n HostBinding,\n ViewEncapsulation,\n input,\n model,\n} from '@angular/core';\nimport { AXButtonType } from './button-item.class';\nimport { AXButtonItemComponent } from './button-item.component';\n\n/**\n * The Button is a component which detects user interaction and triggers a corresponding event\n *\n * @category Components\n */\n@Component({\n selector: 'ax-button',\n templateUrl: './button.component.html',\n styleUrls: ['./button.component.scss'],\n inputs: ['disabled', 'size', 'tabIndex', 'color', 'look', 'text', 'toggleable', 'selected'],\n outputs: ['onBlur', 'onFocus', 'onClick', 'selectedChange', 'toggleableChange', 'lookChange', 'colorChange', 'disabledChange'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [\n { provide: AXComponent, useExisting: AXButtonComponent },\n { provide: AXButtonItemComponent, useExisting: AXButtonComponent },\n { provide: AXFocusableComponent, useExisting: AXButtonComponent },\n ],\n})\nexport class AXButtonComponent extends MXButtonBaseComponent implements AfterViewInit {\n /**\n * Fires each time the user clicks the button.\n * @event\n */\n onClick: EventEmitter<AXClickEvent> = new EventEmitter<AXClickEvent>();\n\n type = input<AXButtonType>('button');\n\n loadingText = model<string | null>(null);\n\n ngAfterViewInit(): void {\n this.getHostElement().removeAttribute('tabindex');\n }\n\n private getButton(): HTMLButtonElement {\n return this.getHostElement().firstElementChild as HTMLButtonElement;\n }\n\n _handleClick(e: MouseEvent) {\n if (this.disabled) {\n e.preventDefault();\n return;\n }\n if (this.toggleable) {\n this.selected = !this.selected;\n }\n this.onClick.emit({\n component: this,\n htmlElement: this.getHostElement(),\n nativeEvent: e,\n });\n\n // TODO: check keyboard event\n setTimeout(() => {\n this.blur();\n });\n }\n\n click() {\n this.getButton()?.click();\n }\n\n @HostBinding('class')\n private get __hostClass(): string[] {\n return Object.entries(this.cssClasses)\n .filter((c) => c[1])\n .map((c) => c[0]);\n }\n\n override focus() {\n this.getButton()?.focus();\n this.getButton().classList.add('ax-state-focus');\n }\n override blur() {\n this.getButton().classList.remove('ax-state-focus');\n }\n}\n","<button [axRipple] [disabled]=\"disabled\" [attr.tabindex]=\"tabIndex\" (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\" (click)=\"_handleClick($event)\" [attr.type]=\"type()\">\n <ng-content select=\"ax-prefix, ax-loading, ax-loading-spinner, ax-icon\"> </ng-content>\n <ng-content select=\"ax-content\"> </ng-content>\n\n @if(text && !loadingText()){\n <span class=\"ax-button-text\">{{ text }}</span>\n }\n @if(loadingText()){\n <span class=\"ax-button-text\">{{ loadingText() }}</span>\n }\n\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-content select=\"ax-dropdown-panel\"> </ng-content>\n <ng-content select=\".tab-content\"> </ng-content>\n</button>","import { AXCommonModule, AXRippleDirective } from '@acorex/components/common';\nimport { AXDecoratorModule } from '@acorex/components/decorators';\nimport { AXLoadingModule } from '@acorex/components/loading';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { AXButtonItemListComponent } from './button-item-list.component';\nimport { AXButtonItemComponent } from './button-item.component';\nimport { AXButtonComponent } from './button.component';\n\nconst COMPONENT = [\n AXButtonComponent,\n AXButtonItemComponent,\n AXButtonItemListComponent,\n];\nconst MODULES = [\n CommonModule,\n AXCommonModule,\n AXDecoratorModule,\n AXLoadingModule,\n AXRippleDirective,\n];\n\n@NgModule({\n imports: [MODULES],\n exports: [...COMPONENT],\n declarations: [...COMPONENT],\n providers: [],\n})\nexport class AXButtonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2.AXButtonItemComponent","i1"],"mappings":"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"}
@@ -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
- _handleAttched(ref) {
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 @if (chatMessage().replyTo) {\n <div class=\"ax-message-reply-container\">\n @switch (chatMessage().replyTo.type) {\n @case ('text') {\n {{ chatMessage().replyTo.content }}\n }\n @case ('image') {\n <img src=\"{{ chatMessage().replyTo.content }}\" alt=\"\" />\n }\n @case ('video') {\n <video src=\"{{ chatMessage().replyTo.content }}\"></video>\n }\n @case ('file') {\n <div class=\"file\">\n <i class=\"fa-regular fa-folder-open\"></i>\n {{ chatMessage().replyTo.name }}\n </div>\n }\n @default {\n {{ chatMessage().replyTo.type }}\n }\n }\n </div>\n }\n <ng-template [cdkPortalOutlet]=\"_portal\" (attached)=\"_handleAttched($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 }); }
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 @if (chatMessage().replyTo) {\n <div class=\"ax-message-reply-container\">\n @switch (chatMessage().replyTo.type) {\n @case ('text') {\n {{ chatMessage().replyTo.content }}\n }\n @case ('image') {\n <img src=\"{{ chatMessage().replyTo.content }}\" alt=\"\" />\n }\n @case ('video') {\n <video src=\"{{ chatMessage().replyTo.content }}\"></video>\n }\n @case ('file') {\n <div class=\"file\">\n <i class=\"fa-regular fa-folder-open\"></i>\n {{ chatMessage().replyTo.name }}\n </div>\n }\n @default {\n {{ chatMessage().replyTo.type }}\n }\n }\n </div>\n }\n <ng-template [cdkPortalOutlet]=\"_portal\" (attached)=\"_handleAttched($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"] }]
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 ConversationMessageAudioComponent extends AXConversationMessageBaseComponent {
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: ConversationMessageAudioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
534
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: ConversationMessageAudioComponent, 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 (onClick)=\"clickHandler($event)\" [maxValue]=\"duration()\" [minValue]=\"0\" [ngModel]=\"currentTime()\" color=\"secondary\"> </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}\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" }] }); }
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: ConversationMessageAudioComponent, decorators: [{
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 (onClick)=\"clickHandler($event)\" [maxValue]=\"duration()\" [minValue]=\"0\" [ngModel]=\"currentTime()\" color=\"secondary\"> </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}\n"] }]
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
- this.fileName.set(this.message.name);
578
- this.fileSize.set(this.fileService.getSize(this.message.content));
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 ConversationMessageImageComponent extends AXConversationMessageBaseComponent {
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: ConversationMessageImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
645
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ConversationMessageImageComponent, 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"] }); }
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: ConversationMessageImageComponent, decorators: [{
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: "14.0.0", version: "18.0.2", type: AXConversationTextMessageComponent, selector: "ng-component", inputs: { message: "message" }, usesInheritance: true, ngImport: i0, template: `<div class="ax-text-message" [innerHtml]="_text()"></div>`, isInline: true, styles: [".ax-text-message{word-break:break-all;white-space:break-spaces}\n"], encapsulation: i0.ViewEncapsulation.None }); }
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: `<div class="ax-text-message" [innerHtml]="_text()"></div>`, encapsulation: ViewEncapsulation.None, inputs: ['message'], styles: [".ax-text-message{word-break:break-all;white-space:break-spaces}\n"] }]
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 ConversationMessageVideoComponent extends AXConversationMessageBaseComponent {
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: ConversationMessageVideoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
678
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", type: ConversationMessageVideoComponent, 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"] }); }
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: ConversationMessageVideoComponent, decorators: [{
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 AXConversationAudioMessageComponent extends AXConversationMessageBaseComponent {
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: AXConversationAudioMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
779
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.2", type: AXConversationAudioMessageComponent, 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 }); }
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: AXConversationAudioMessageComponent, decorators: [{
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
- AXConversationAudioMessageComponent,
885
+ AXConversationVoiceMessageComponent,
798
886
  AXConversationFileMessageComponent,
799
887
  AXConversationContainerComponent,
800
- ConversationMessageAudioComponent,
801
- ConversationMessageImageComponent,
802
- ConversationMessageVideoComponent,
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: AXConversationAudioMessageComponent,
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: ConversationMessageAudioComponent,
937
+ component: AXConversationMessageAudioComponent,
850
938
  });
851
939
  registry.register({
852
940
  name: 'image',
853
- component: ConversationMessageImageComponent,
941
+ component: AXConversationMessageImageComponent,
854
942
  });
855
943
  registry.register({
856
944
  name: 'video',
857
- component: ConversationMessageVideoComponent,
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
- AXConversationAudioMessageComponent,
984
+ AXConversationVoiceMessageComponent,
897
985
  AXConversationFileMessageComponent,
898
986
  AXConversationContainerComponent,
899
- ConversationMessageAudioComponent,
900
- ConversationMessageImageComponent,
901
- ConversationMessageVideoComponent], imports: [CommonModule,
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
- AXConversationAudioMessageComponent,
1010
+ AXConversationVoiceMessageComponent,
923
1011
  AXConversationFileMessageComponent,
924
1012
  AXConversationContainerComponent,
925
- ConversationMessageAudioComponent,
926
- ConversationMessageImageComponent,
927
- ConversationMessageVideoComponent] }); }
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, AXConversationAudioMessageComponent, AXConversationContainerComponent, AXConversationFileMessageComponent, AXConversationInputComponent, AXConversationMessageBaseComponent, AXConversationMessageComponent, AXConversationMessageTypeRegistryService, AXConversationModule, AXConversationService, AXConversationTextMessageComponent, AXConversationViewComponent, AXRecordingService, ConversationMessageAudioComponent, ConversationMessageImageComponent, ConversationMessageImagePopupComponent, ConversationMessageVideoComponent };
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