@acorex/components 22.1.0-next.24 → 22.1.0-next.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/acorex-components-alert.mjs +2 -2
- package/fesm2022/acorex-components-alert.mjs.map +1 -1
- package/fesm2022/acorex-components-combo-box.mjs +76 -6
- package/fesm2022/acorex-components-combo-box.mjs.map +1 -1
- package/fesm2022/acorex-components-conversation.mjs +326 -345
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-decorators.mjs +2 -2
- package/fesm2022/acorex-components-decorators.mjs.map +1 -1
- package/fesm2022/acorex-components-lookup.mjs +524 -120
- package/fesm2022/acorex-components-lookup.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +2 -2
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +40 -3
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
- package/lookup/README.md +3 -3
- package/package.json +3 -3
- package/types/acorex-components-combo-box.d.ts +6 -1
- package/types/acorex-components-conversation.d.ts +71 -277
- package/types/acorex-components-lookup.d.ts +99 -50
- package/types/acorex-components-tree-view.d.ts +9 -1
|
@@ -6,7 +6,7 @@ import * as i2 from '@angular/common';
|
|
|
6
6
|
import { CommonModule, NgComponentOutlet, isPlatformBrowser, DOCUMENT, AsyncPipe } from '@angular/common';
|
|
7
7
|
import * as i0 from '@angular/core';
|
|
8
8
|
import { InjectionToken, inject, Injectable, signal, computed, Injector, runInInjectionContext, PLATFORM_ID, DestroyRef, viewChild, ViewContainerRef, input, output, effect, ViewEncapsulation, Component, ElementRef, HostListener, Directive, reflectComponentType, EventEmitter, afterNextRender, untracked, model, NgZone, ChangeDetectorRef, viewChildren, SecurityContext, NgModule } from '@angular/core';
|
|
9
|
-
import { Subject,
|
|
9
|
+
import { Subject, takeUntil, catchError, EMPTY, debounceTime, distinctUntilChanged, firstValueFrom } from 'rxjs';
|
|
10
10
|
import { AXUploaderService, AXUploaderZoneDirective, AXUploaderBrowseDirective } from '@acorex/cdk/uploader';
|
|
11
11
|
import { AXDialogService } from '@acorex/components/dialog';
|
|
12
12
|
import { AXPopupService } from '@acorex/components/popup';
|
|
@@ -16,10 +16,8 @@ import { translateSync, AXTranslationService, AXTranslationModule } from '@acore
|
|
|
16
16
|
import { AXButtonComponent, AXButtonItemComponent, AXButtonItemListComponent } from '@acorex/components/button';
|
|
17
17
|
import { AXPopoverComponent } from '@acorex/components/popover';
|
|
18
18
|
import { AXTextAreaComponent } from '@acorex/components/text-area';
|
|
19
|
-
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
20
19
|
import * as i1$1 from '@angular/forms';
|
|
21
20
|
import { FormsModule } from '@angular/forms';
|
|
22
|
-
import { AXLoadingComponent } from '@acorex/components/loading';
|
|
23
21
|
import { AXActionSheetService } from '@acorex/components/action-sheet';
|
|
24
22
|
import { AXPlatform } from '@acorex/core/platform';
|
|
25
23
|
import { AXResizableDirective } from '@acorex/cdk/resizable';
|
|
@@ -30,6 +28,7 @@ import { AXLabelComponent, AXLabelModule } from '@acorex/components/label';
|
|
|
30
28
|
import { AXAvatarComponent } from '@acorex/components/avatar';
|
|
31
29
|
import { AXImageComponent } from '@acorex/components/image';
|
|
32
30
|
import { AXListComponent } from '@acorex/components/list';
|
|
31
|
+
import { AXLoadingComponent } from '@acorex/components/loading';
|
|
33
32
|
import * as i1$4 from '@acorex/components/search-box';
|
|
34
33
|
import { AXSearchBoxComponent, AXSearchBoxModule } from '@acorex/components/search-box';
|
|
35
34
|
import { AXFabComponent } from '@acorex/components/fab';
|
|
@@ -92,8 +91,6 @@ const AX_DEFAULT_CONVERSATION_CONFIG = {
|
|
|
92
91
|
minSidebarWidth: 250,
|
|
93
92
|
maxSidebarWidth: 500,
|
|
94
93
|
defaultSidebarWidth: 320,
|
|
95
|
-
// Cache
|
|
96
|
-
filterCacheSize: 100,
|
|
97
94
|
// Message Validation
|
|
98
95
|
maxMessageLength: 10000,
|
|
99
96
|
minMessageLength: 1,
|
|
@@ -361,36 +358,32 @@ class AXConversationMessageApi {
|
|
|
361
358
|
|
|
362
359
|
/**
|
|
363
360
|
* Abstract Real-time Events API
|
|
364
|
-
* Handle WebSocket/SSE
|
|
361
|
+
* Handle WebSocket/SSE event subscriptions for conversation domain updates
|
|
365
362
|
*/
|
|
366
363
|
/**
|
|
367
364
|
* Abstract Real-time Events API
|
|
368
365
|
*
|
|
369
|
-
* Implement this abstract class to
|
|
370
|
-
*
|
|
366
|
+
* Implement this abstract class to expose domain event streams from your WebSocket/SSE layer.
|
|
367
|
+
* Connection lifecycle is owned by the implementation — this contract only covers subscriptions.
|
|
368
|
+
*
|
|
369
|
+
* Covered domains: message CRUD, conversation (room) CRUD, typing indicators, and presence.
|
|
370
|
+
* Message updates include edits, reactions, delivery/read status, and other message field changes.
|
|
371
371
|
*
|
|
372
372
|
* @example
|
|
373
373
|
* ```typescript
|
|
374
374
|
* @Injectable()
|
|
375
375
|
* export class MyRealtimeApi extends AXConversationRealtimeApi {
|
|
376
|
-
* private
|
|
377
|
-
* private connectionStatus$ = new BehaviorSubject<AXConversationConnectionStatus>('disconnected');
|
|
376
|
+
* private readonly messageCreated$ = new Subject<AXConversationMessage>();
|
|
378
377
|
*
|
|
379
|
-
*
|
|
380
|
-
*
|
|
381
|
-
* this.socket.
|
|
382
|
-
* // ... handle other events
|
|
378
|
+
* constructor(private readonly socket: MyChatSocketService) {
|
|
379
|
+
* super();
|
|
380
|
+
* this.socket.on('message.created', (message) => this.messageCreated$.next(message));
|
|
383
381
|
* }
|
|
384
382
|
*
|
|
385
383
|
* subscribeToMessages(conversationId: string): Observable<AXConversationMessage> {
|
|
386
|
-
* return
|
|
387
|
-
*
|
|
388
|
-
*
|
|
389
|
-
* if (data.type === 'message' && data.conversationId === conversationId) {
|
|
390
|
-
* subscriber.next(data.message);
|
|
391
|
-
* }
|
|
392
|
-
* });
|
|
393
|
-
* });
|
|
384
|
+
* return this.messageCreated$.pipe(
|
|
385
|
+
* filter((message) => !conversationId || message.conversationId === conversationId),
|
|
386
|
+
* );
|
|
394
387
|
* }
|
|
395
388
|
*
|
|
396
389
|
* // ... implement other methods
|
|
@@ -518,6 +511,85 @@ function resolveConversationMessageFileType(type, fileType) {
|
|
|
518
511
|
return fileType ?? AX_CONVERSATION_MESSAGE_TYPE_FILE_TYPE[type];
|
|
519
512
|
}
|
|
520
513
|
|
|
514
|
+
const AX_CONVERSATION_GENERIC_PRIVATE_TITLES = new Set(['', 'new chat', 'new conversation']);
|
|
515
|
+
/** Default Font Awesome icon for group conversations without a custom avatar image. */
|
|
516
|
+
const AX_CONVERSATION_DEFAULT_GROUP_ICON = 'fa-light fa-users';
|
|
517
|
+
/** Default Font Awesome icon for private/bot conversations without a custom avatar image. */
|
|
518
|
+
const AX_CONVERSATION_DEFAULT_USER_ICON = 'fa-light fa-user';
|
|
519
|
+
/** True when the stored title is a placeholder, not a user-defined name. */
|
|
520
|
+
function isGenericPrivateConversationTitle(title) {
|
|
521
|
+
return AX_CONVERSATION_GENERIC_PRIVATE_TITLES.has((title ?? '').trim().toLowerCase());
|
|
522
|
+
}
|
|
523
|
+
/**
|
|
524
|
+
* Find an existing private 1:1 conversation between the current user and a peer.
|
|
525
|
+
* Matches conversations with exactly those two participants.
|
|
526
|
+
*/
|
|
527
|
+
function findExistingPrivateConversation(conversations, currentUserId, peerUserId) {
|
|
528
|
+
return conversations.find((conversation) => {
|
|
529
|
+
if (conversation.type !== 'private') {
|
|
530
|
+
return false;
|
|
531
|
+
}
|
|
532
|
+
const participantIds = new Set(conversation.participants.map((participant) => participant.id));
|
|
533
|
+
return participantIds.size === 2 && participantIds.has(currentUserId) && participantIds.has(peerUserId);
|
|
534
|
+
});
|
|
535
|
+
}
|
|
536
|
+
/** Other participant in a private 1v1 chat (excludes the current viewer). */
|
|
537
|
+
function resolvePrivatePeerParticipant(conversation, currentUserId) {
|
|
538
|
+
if (conversation.type !== 'private') {
|
|
539
|
+
return undefined;
|
|
540
|
+
}
|
|
541
|
+
return resolveConversationPeerParticipant(conversation, currentUserId);
|
|
542
|
+
}
|
|
543
|
+
/**
|
|
544
|
+
* Resolves the display title for the current viewer.
|
|
545
|
+
* Private and bot peer-scoped chats show the other participant's name when no custom title is set.
|
|
546
|
+
*/
|
|
547
|
+
function resolveConversationTitleForViewer(conversation, currentUserId) {
|
|
548
|
+
if (!AX_CONVERSATION_PEER_AVATAR_TYPES.has(conversation.type)) {
|
|
549
|
+
return conversation.title;
|
|
550
|
+
}
|
|
551
|
+
const peer = resolveConversationPeerParticipant(conversation, currentUserId);
|
|
552
|
+
if (peer?.name) {
|
|
553
|
+
return peer.name;
|
|
554
|
+
}
|
|
555
|
+
if (conversation.type === 'private' && isGenericPrivateConversationTitle(conversation.title)) {
|
|
556
|
+
return conversation.title || 'New Chat';
|
|
557
|
+
}
|
|
558
|
+
return conversation.title;
|
|
559
|
+
}
|
|
560
|
+
/**
|
|
561
|
+
* Returns a viewer-scoped copy of a conversation with dynamic peer title/avatar/icon.
|
|
562
|
+
* Does not mutate the source object.
|
|
563
|
+
*/
|
|
564
|
+
function resolveConversationForViewer(conversation, currentUserId) {
|
|
565
|
+
if (!AX_CONVERSATION_PEER_AVATAR_TYPES.has(conversation.type) || !currentUserId) {
|
|
566
|
+
return conversation;
|
|
567
|
+
}
|
|
568
|
+
const peer = resolveConversationPeerParticipant(conversation, currentUserId);
|
|
569
|
+
if (!peer) {
|
|
570
|
+
return conversation;
|
|
571
|
+
}
|
|
572
|
+
const title = resolveConversationTitleForViewer(conversation, currentUserId);
|
|
573
|
+
const avatar = conversation.avatar ?? peer.avatar;
|
|
574
|
+
const icon = conversation.icon ?? peer.icon;
|
|
575
|
+
if (title === conversation.title &&
|
|
576
|
+
avatar === conversation.avatar &&
|
|
577
|
+
icon === conversation.icon) {
|
|
578
|
+
return conversation;
|
|
579
|
+
}
|
|
580
|
+
return {
|
|
581
|
+
...conversation,
|
|
582
|
+
title,
|
|
583
|
+
avatar,
|
|
584
|
+
icon,
|
|
585
|
+
};
|
|
586
|
+
}
|
|
587
|
+
/** Whether message reactions are enabled for a conversation. Defaults to `true` when omitted. */
|
|
588
|
+
function isConversationReactionsEnabled(conversation) {
|
|
589
|
+
const value = conversation?.metadata?.reactionsEnabled;
|
|
590
|
+
return value !== false;
|
|
591
|
+
}
|
|
592
|
+
|
|
521
593
|
/**
|
|
522
594
|
* Message Utilities Service
|
|
523
595
|
* Helper functions for message formatting and display
|
|
@@ -761,85 +833,6 @@ function resolveConversationAvatarDisplay(conversation, currentUserId) {
|
|
|
761
833
|
};
|
|
762
834
|
}
|
|
763
835
|
|
|
764
|
-
const AX_CONVERSATION_GENERIC_PRIVATE_TITLES = new Set(['', 'new chat', 'new conversation']);
|
|
765
|
-
/** Default Font Awesome icon for group conversations without a custom avatar image. */
|
|
766
|
-
const AX_CONVERSATION_DEFAULT_GROUP_ICON = 'fa-light fa-users';
|
|
767
|
-
/** Default Font Awesome icon for private/bot conversations without a custom avatar image. */
|
|
768
|
-
const AX_CONVERSATION_DEFAULT_USER_ICON = 'fa-light fa-user';
|
|
769
|
-
/** True when the stored title is a placeholder, not a user-defined name. */
|
|
770
|
-
function isGenericPrivateConversationTitle(title) {
|
|
771
|
-
return AX_CONVERSATION_GENERIC_PRIVATE_TITLES.has((title ?? '').trim().toLowerCase());
|
|
772
|
-
}
|
|
773
|
-
/**
|
|
774
|
-
* Find an existing private 1:1 conversation between the current user and a peer.
|
|
775
|
-
* Matches conversations with exactly those two participants.
|
|
776
|
-
*/
|
|
777
|
-
function findExistingPrivateConversation(conversations, currentUserId, peerUserId) {
|
|
778
|
-
return conversations.find((conversation) => {
|
|
779
|
-
if (conversation.type !== 'private') {
|
|
780
|
-
return false;
|
|
781
|
-
}
|
|
782
|
-
const participantIds = new Set(conversation.participants.map((participant) => participant.id));
|
|
783
|
-
return participantIds.size === 2 && participantIds.has(currentUserId) && participantIds.has(peerUserId);
|
|
784
|
-
});
|
|
785
|
-
}
|
|
786
|
-
/** Other participant in a private 1v1 chat (excludes the current viewer). */
|
|
787
|
-
function resolvePrivatePeerParticipant(conversation, currentUserId) {
|
|
788
|
-
if (conversation.type !== 'private') {
|
|
789
|
-
return undefined;
|
|
790
|
-
}
|
|
791
|
-
return resolveConversationPeerParticipant(conversation, currentUserId);
|
|
792
|
-
}
|
|
793
|
-
/**
|
|
794
|
-
* Resolves the display title for the current viewer.
|
|
795
|
-
* Private and bot peer-scoped chats show the other participant's name when no custom title is set.
|
|
796
|
-
*/
|
|
797
|
-
function resolveConversationTitleForViewer(conversation, currentUserId) {
|
|
798
|
-
if (!AX_CONVERSATION_PEER_AVATAR_TYPES.has(conversation.type)) {
|
|
799
|
-
return conversation.title;
|
|
800
|
-
}
|
|
801
|
-
const peer = resolveConversationPeerParticipant(conversation, currentUserId);
|
|
802
|
-
if (peer?.name) {
|
|
803
|
-
return peer.name;
|
|
804
|
-
}
|
|
805
|
-
if (conversation.type === 'private' && isGenericPrivateConversationTitle(conversation.title)) {
|
|
806
|
-
return conversation.title || 'New Chat';
|
|
807
|
-
}
|
|
808
|
-
return conversation.title;
|
|
809
|
-
}
|
|
810
|
-
/**
|
|
811
|
-
* Returns a viewer-scoped copy of a conversation with dynamic peer title/avatar/icon.
|
|
812
|
-
* Does not mutate the source object.
|
|
813
|
-
*/
|
|
814
|
-
function resolveConversationForViewer(conversation, currentUserId) {
|
|
815
|
-
if (!AX_CONVERSATION_PEER_AVATAR_TYPES.has(conversation.type) || !currentUserId) {
|
|
816
|
-
return conversation;
|
|
817
|
-
}
|
|
818
|
-
const peer = resolveConversationPeerParticipant(conversation, currentUserId);
|
|
819
|
-
if (!peer) {
|
|
820
|
-
return conversation;
|
|
821
|
-
}
|
|
822
|
-
const title = resolveConversationTitleForViewer(conversation, currentUserId);
|
|
823
|
-
const avatar = conversation.avatar ?? peer.avatar;
|
|
824
|
-
const icon = conversation.icon ?? peer.icon;
|
|
825
|
-
if (title === conversation.title &&
|
|
826
|
-
avatar === conversation.avatar &&
|
|
827
|
-
icon === conversation.icon) {
|
|
828
|
-
return conversation;
|
|
829
|
-
}
|
|
830
|
-
return {
|
|
831
|
-
...conversation,
|
|
832
|
-
title,
|
|
833
|
-
avatar,
|
|
834
|
-
icon,
|
|
835
|
-
};
|
|
836
|
-
}
|
|
837
|
-
/** Whether message reactions are enabled for a conversation. Defaults to `true` when omitted. */
|
|
838
|
-
function isConversationReactionsEnabled(conversation) {
|
|
839
|
-
const value = conversation?.metadata?.reactionsEnabled;
|
|
840
|
-
return value !== false;
|
|
841
|
-
}
|
|
842
|
-
|
|
843
836
|
const AX_CONVERSATION_MEDIA_TYPES = new Set(['image', 'video', 'audio', 'file']);
|
|
844
837
|
const normalizers = {};
|
|
845
838
|
const loading = new Map();
|
|
@@ -2320,7 +2313,9 @@ class AXConversationComposerActionRegistry {
|
|
|
2320
2313
|
return this.injector.get(AXFileTypeRegistryService);
|
|
2321
2314
|
}
|
|
2322
2315
|
async ensureFileTypeExists(fileType) {
|
|
2323
|
-
const
|
|
2316
|
+
const registry = this.fileTypeRegistry();
|
|
2317
|
+
await ensureConversationFileCatalogRegistered(registry, fileType);
|
|
2318
|
+
const match = await registry.get(fileType);
|
|
2324
2319
|
if (!match) {
|
|
2325
2320
|
console.warn(`[AXConversationComposerActionRegistry] Unknown fileType "${fileType}". ` +
|
|
2326
2321
|
'Register its AXFileTypeInfoProvider in app providers before using this action.');
|
|
@@ -3002,9 +2997,15 @@ class AXConversationMessageRendererRegistry {
|
|
|
3002
2997
|
Promise.resolve().then(function () { return systemRenderer_plugin; }),
|
|
3003
2998
|
Promise.resolve().then(function () { return fallbackRenderer_plugin; }),
|
|
3004
2999
|
]);
|
|
3005
|
-
this.
|
|
3006
|
-
this.
|
|
3007
|
-
this.
|
|
3000
|
+
this.registerBuiltInRendererIfMissing(text.AX_CONVERSATION_TEXT_RENDERER);
|
|
3001
|
+
this.registerBuiltInRendererIfMissing(system.AX_CONVERSATION_SYSTEM_RENDERER);
|
|
3002
|
+
this.registerBuiltInRendererIfMissing(fallback.AX_CONVERSATION_FALLBACK_RENDERER);
|
|
3003
|
+
}
|
|
3004
|
+
registerBuiltInRendererIfMissing(renderer) {
|
|
3005
|
+
if (this._renderers().some((existing) => existing.type === renderer.type)) {
|
|
3006
|
+
return;
|
|
3007
|
+
}
|
|
3008
|
+
this.register(renderer);
|
|
3008
3009
|
}
|
|
3009
3010
|
/**
|
|
3010
3011
|
* Register a message renderer
|
|
@@ -3183,8 +3184,6 @@ class AXConversationService {
|
|
|
3183
3184
|
...(ngDevMode ? [{ debugName: "_conversationsPagination" }] : /* istanbul ignore next */ []));
|
|
3184
3185
|
this._messagesPaginationByConversation = signal(new Map(), /* @ts-ignore */
|
|
3185
3186
|
...(ngDevMode ? [{ debugName: "_messagesPaginationByConversation" }] : /* istanbul ignore next */ []));
|
|
3186
|
-
/** Emits when the active conversation changes, cancelling per-conversation subscriptions. */
|
|
3187
|
-
this._conversationSwitch$ = new Subject();
|
|
3188
3187
|
// Event subjects
|
|
3189
3188
|
this._messageReceived$ = new Subject();
|
|
3190
3189
|
this._messageUpdated$ = new Subject();
|
|
@@ -3234,8 +3233,6 @@ class AXConversationService {
|
|
|
3234
3233
|
...(ngDevMode ? [{ debugName: "activeMessagesPagination" }] : /* istanbul ignore next */ []));
|
|
3235
3234
|
/** Error state */
|
|
3236
3235
|
this.error = this._error.asReadonly();
|
|
3237
|
-
/** Connection status */
|
|
3238
|
-
this.connectionStatus$ = this.realtimeApi?.connectionStatus$ ?? new BehaviorSubject('disconnected').asObservable();
|
|
3239
3236
|
/** Error stream */
|
|
3240
3237
|
this.errors$ = this.errorHandler.errors$;
|
|
3241
3238
|
// Event observables
|
|
@@ -3266,15 +3263,16 @@ class AXConversationService {
|
|
|
3266
3263
|
this.conversationListLoadGeneration = 0;
|
|
3267
3264
|
/** Batched read-receipt queue keyed by conversation ID. */
|
|
3268
3265
|
this.readQueue = new Map();
|
|
3269
|
-
|
|
3266
|
+
/** Outgoing typing indicator throttle state (composer -> API). */
|
|
3267
|
+
this.outgoingTypingLastEmitAt = new Map();
|
|
3268
|
+
this.outgoingTypingActive = new Map();
|
|
3269
|
+
this.outgoingTypingStopHandles = new Map();
|
|
3270
3270
|
/** Session cache for available reaction emojis. */
|
|
3271
3271
|
this.availableReactionsCache = null;
|
|
3272
3272
|
this.availableReactionsPromise = null;
|
|
3273
3273
|
this.presenceTickHandle = setInterval(() => this.state.bumpPresenceTimeTick(), 60_000);
|
|
3274
3274
|
this.typingPruneHandle = setInterval(() => this.state.pruneExpiredTyping(), 1_000);
|
|
3275
3275
|
this.destroyRef.onDestroy(() => {
|
|
3276
|
-
this._conversationSwitch$.next();
|
|
3277
|
-
this._conversationSwitch$.complete();
|
|
3278
3276
|
this.destroy$.next();
|
|
3279
3277
|
this.destroy$.complete();
|
|
3280
3278
|
if (this.readFlushHandle) {
|
|
@@ -3286,9 +3284,13 @@ class AXConversationService {
|
|
|
3286
3284
|
if (this.typingPruneHandle) {
|
|
3287
3285
|
clearInterval(this.typingPruneHandle);
|
|
3288
3286
|
}
|
|
3289
|
-
|
|
3290
|
-
|
|
3287
|
+
for (const conversationId of [...this.outgoingTypingActive.keys()]) {
|
|
3288
|
+
this.notifyComposerStoppedTyping(conversationId);
|
|
3291
3289
|
}
|
|
3290
|
+
for (const handle of this.outgoingTypingStopHandles.values()) {
|
|
3291
|
+
clearTimeout(handle);
|
|
3292
|
+
}
|
|
3293
|
+
this.outgoingTypingStopHandles.clear();
|
|
3292
3294
|
void this.flushReadQueue();
|
|
3293
3295
|
void this.userApi.updatePresence('offline').catch(() => undefined);
|
|
3294
3296
|
});
|
|
@@ -3318,10 +3320,6 @@ class AXConversationService {
|
|
|
3318
3320
|
*/
|
|
3319
3321
|
async initializeService() {
|
|
3320
3322
|
try {
|
|
3321
|
-
// Connect to real-time API (optional)
|
|
3322
|
-
if (this.realtimeApi) {
|
|
3323
|
-
await this.callApi('initializeService', 'realtimeApi', 'connect', () => this.realtimeApi.connect());
|
|
3324
|
-
}
|
|
3325
3323
|
// Load current user
|
|
3326
3324
|
const currentUser = await this.callApi('initializeService', 'userApi', 'getCurrentUser', () => this.userApi.getCurrentUser());
|
|
3327
3325
|
this._currentUser.set(currentUser);
|
|
@@ -3342,8 +3340,9 @@ class AXConversationService {
|
|
|
3342
3340
|
}
|
|
3343
3341
|
}
|
|
3344
3342
|
/**
|
|
3345
|
-
* Subscribe to real-time events
|
|
3346
|
-
*
|
|
3343
|
+
* Subscribe to real-time events from {@link AXConversationRealtimeApi}.
|
|
3344
|
+
* Binds every abstract subscription: messages (create/update/delete/status/read),
|
|
3345
|
+
* conversations (create/update/delete), typing indicators, and presence.
|
|
3347
3346
|
*/
|
|
3348
3347
|
subscribeToEvents() {
|
|
3349
3348
|
// Skip if realtime API is not provided
|
|
@@ -3351,7 +3350,6 @@ class AXConversationService {
|
|
|
3351
3350
|
return;
|
|
3352
3351
|
}
|
|
3353
3352
|
// Subscribe to message updates
|
|
3354
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToMessageUpdates');
|
|
3355
3353
|
this.realtimeApi
|
|
3356
3354
|
.subscribeToMessageUpdates()
|
|
3357
3355
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3363,7 +3361,6 @@ class AXConversationService {
|
|
|
3363
3361
|
this._messageUpdated$.next(message);
|
|
3364
3362
|
});
|
|
3365
3363
|
// Subscribe to message deletions
|
|
3366
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToMessageDeletions');
|
|
3367
3364
|
this.realtimeApi
|
|
3368
3365
|
.subscribeToMessageDeletions()
|
|
3369
3366
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3375,7 +3372,6 @@ class AXConversationService {
|
|
|
3375
3372
|
this._messageDeleted$.next(messageId);
|
|
3376
3373
|
});
|
|
3377
3374
|
// Subscribe to typing indicators
|
|
3378
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToTypingIndicators', '');
|
|
3379
3375
|
this.realtimeApi
|
|
3380
3376
|
.subscribeToTypingIndicators('')
|
|
3381
3377
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3387,7 +3383,6 @@ class AXConversationService {
|
|
|
3387
3383
|
this._typingIndicator$.next(indicator);
|
|
3388
3384
|
});
|
|
3389
3385
|
// Subscribe to presence updates
|
|
3390
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToPresenceUpdates');
|
|
3391
3386
|
this.realtimeApi
|
|
3392
3387
|
.subscribeToPresenceUpdates()
|
|
3393
3388
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3399,7 +3394,6 @@ class AXConversationService {
|
|
|
3399
3394
|
this._presenceUpdate$.next(update);
|
|
3400
3395
|
});
|
|
3401
3396
|
// Subscribe to conversation updates (for badge updates, last message, etc.)
|
|
3402
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToConversationUpdates');
|
|
3403
3397
|
this.realtimeApi
|
|
3404
3398
|
.subscribeToConversationUpdates()
|
|
3405
3399
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3411,7 +3405,6 @@ class AXConversationService {
|
|
|
3411
3405
|
});
|
|
3412
3406
|
// Global message stream — backs message list even when the backend only pushes
|
|
3413
3407
|
// conversation.lastMessage updates or when per-conversation subscribe races loadMessages.
|
|
3414
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToMessages', '');
|
|
3415
3408
|
this.realtimeApi
|
|
3416
3409
|
.subscribeToMessages('')
|
|
3417
3410
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3422,18 +3415,6 @@ class AXConversationService {
|
|
|
3422
3415
|
this.handleNewMessage(message);
|
|
3423
3416
|
this._messageReceived$.next(message);
|
|
3424
3417
|
});
|
|
3425
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToMessageReactions');
|
|
3426
|
-
this.realtimeApi
|
|
3427
|
-
.subscribeToMessageReactions()
|
|
3428
|
-
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
3429
|
-
this.errorHandler.handle(error, 'subscribeToMessageReactions');
|
|
3430
|
-
return EMPTY;
|
|
3431
|
-
}))
|
|
3432
|
-
.subscribe((message) => {
|
|
3433
|
-
this.handleMessageUpdate(message);
|
|
3434
|
-
this._messageUpdated$.next(message);
|
|
3435
|
-
});
|
|
3436
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToConversationCreated');
|
|
3437
3418
|
this.realtimeApi
|
|
3438
3419
|
.subscribeToConversationCreated()
|
|
3439
3420
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3443,7 +3424,6 @@ class AXConversationService {
|
|
|
3443
3424
|
.subscribe((conversation) => {
|
|
3444
3425
|
this.handleConversationCreated(conversation);
|
|
3445
3426
|
});
|
|
3446
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToConversationDeleted');
|
|
3447
3427
|
this.realtimeApi
|
|
3448
3428
|
.subscribeToConversationDeleted()
|
|
3449
3429
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3453,7 +3433,6 @@ class AXConversationService {
|
|
|
3453
3433
|
.subscribe((conversationId) => {
|
|
3454
3434
|
this.handleConversationDeleted(conversationId);
|
|
3455
3435
|
});
|
|
3456
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToReadReceipts');
|
|
3457
3436
|
this.realtimeApi
|
|
3458
3437
|
.subscribeToReadReceipts()
|
|
3459
3438
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3463,7 +3442,6 @@ class AXConversationService {
|
|
|
3463
3442
|
.subscribe((receipt) => {
|
|
3464
3443
|
this.handleReadReceipt(receipt);
|
|
3465
3444
|
});
|
|
3466
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToMessageStatusChanges');
|
|
3467
3445
|
this.realtimeApi
|
|
3468
3446
|
.subscribeToMessageStatusChanges()
|
|
3469
3447
|
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
@@ -3473,16 +3451,6 @@ class AXConversationService {
|
|
|
3473
3451
|
.subscribe((change) => {
|
|
3474
3452
|
this.handleMessageStatusChange(change);
|
|
3475
3453
|
});
|
|
3476
|
-
this.logApi('subscribeToEvents', 'realtimeApi', 'subscribeToConversationSettingsChanges');
|
|
3477
|
-
this.realtimeApi
|
|
3478
|
-
.subscribeToConversationSettingsChanges()
|
|
3479
|
-
.pipe(takeUntil(this.destroy$), catchError((error) => {
|
|
3480
|
-
this.errorHandler.handle(error, 'subscribeToConversationSettingsChanges');
|
|
3481
|
-
return EMPTY;
|
|
3482
|
-
}))
|
|
3483
|
-
.subscribe((change) => {
|
|
3484
|
-
this.handleRoomPreferencesChange(change);
|
|
3485
|
-
});
|
|
3486
3454
|
}
|
|
3487
3455
|
getUserPresence(userId) {
|
|
3488
3456
|
return this.state.getUserPresence(userId);
|
|
@@ -3603,7 +3571,6 @@ class AXConversationService {
|
|
|
3603
3571
|
const hasCachedMessages = this.state.getConversationMessages(conversationId).length > 0;
|
|
3604
3572
|
try {
|
|
3605
3573
|
if (!isAlreadyActive) {
|
|
3606
|
-
this._conversationSwitch$.next();
|
|
3607
3574
|
this.messageLoadGeneration++;
|
|
3608
3575
|
this._activeConversationId.set(conversationId);
|
|
3609
3576
|
}
|
|
@@ -3855,17 +3822,25 @@ class AXConversationService {
|
|
|
3855
3822
|
* Updates message locally and syncs with server
|
|
3856
3823
|
*/
|
|
3857
3824
|
async editMessage(messageId, payload) {
|
|
3858
|
-
// Store original message for rollback
|
|
3859
3825
|
const originalMessage = this.state.getMessage(messageId);
|
|
3826
|
+
if (!originalMessage) {
|
|
3827
|
+
throw new Error(`Message not found: ${messageId}`);
|
|
3828
|
+
}
|
|
3860
3829
|
try {
|
|
3861
|
-
|
|
3862
|
-
|
|
3830
|
+
const optimisticMessage = {
|
|
3831
|
+
...originalMessage,
|
|
3863
3832
|
payload,
|
|
3864
3833
|
editedAt: new Date(),
|
|
3834
|
+
};
|
|
3835
|
+
this.state.updateMessage(messageId, {
|
|
3836
|
+
payload,
|
|
3837
|
+
editedAt: optimisticMessage.editedAt,
|
|
3865
3838
|
});
|
|
3839
|
+
this.syncLastMessageIfRelevant(optimisticMessage);
|
|
3866
3840
|
// Sync with server
|
|
3867
3841
|
const updatedMessage = await this.callApi('editMessage', 'messageApi', 'editMessage', () => this.messageApi.editMessage(messageId, payload), messageId, payload);
|
|
3868
3842
|
this.state.updateMessage(messageId, updatedMessage);
|
|
3843
|
+
this.syncLastMessageIfRelevant(updatedMessage);
|
|
3869
3844
|
}
|
|
3870
3845
|
catch (error) {
|
|
3871
3846
|
// Rollback on failure
|
|
@@ -3874,6 +3849,7 @@ class AXConversationService {
|
|
|
3874
3849
|
payload: originalMessage.payload,
|
|
3875
3850
|
editedAt: originalMessage.editedAt,
|
|
3876
3851
|
});
|
|
3852
|
+
this.syncLastMessageIfRelevant(originalMessage);
|
|
3877
3853
|
}
|
|
3878
3854
|
this.errorHandler.handle(error, 'editMessage', { messageId });
|
|
3879
3855
|
throw error;
|
|
@@ -3895,8 +3871,12 @@ class AXConversationService {
|
|
|
3895
3871
|
// Store message for rollback
|
|
3896
3872
|
const message = this.state.getMessage(messageId);
|
|
3897
3873
|
try {
|
|
3874
|
+
const conversationId = message?.conversationId;
|
|
3898
3875
|
// Optimistic delete
|
|
3899
3876
|
this.state.deleteMessage(messageId);
|
|
3877
|
+
if (conversationId) {
|
|
3878
|
+
this.refreshConversationLastMessage(conversationId);
|
|
3879
|
+
}
|
|
3900
3880
|
// Sync with server
|
|
3901
3881
|
await this.callApi('deleteMessage', 'messageApi', 'deleteMessage', () => this.messageApi.deleteMessage(messageId, forEveryone), messageId, forEveryone);
|
|
3902
3882
|
}
|
|
@@ -3904,6 +3884,7 @@ class AXConversationService {
|
|
|
3904
3884
|
// Rollback on failure
|
|
3905
3885
|
if (message) {
|
|
3906
3886
|
this.state.addMessage(message);
|
|
3887
|
+
this.syncLastMessageIfRelevant(message);
|
|
3907
3888
|
}
|
|
3908
3889
|
this.errorHandler.handle(error, 'deleteMessage', { messageId, forEveryone });
|
|
3909
3890
|
throw error;
|
|
@@ -4082,6 +4063,52 @@ class AXConversationService {
|
|
|
4082
4063
|
cancelGeneration() {
|
|
4083
4064
|
this.composerGenerationState.cancel();
|
|
4084
4065
|
}
|
|
4066
|
+
/**
|
|
4067
|
+
* Notify that the composer has draft content.
|
|
4068
|
+
* Emits typing indicators at most once per {@link AXConversationConfig.typingIndicatorThrottle}.
|
|
4069
|
+
*/
|
|
4070
|
+
notifyComposerTyping(conversationId) {
|
|
4071
|
+
this.clearOutgoingTypingStop(conversationId);
|
|
4072
|
+
const throttleMs = this.config.typingIndicatorThrottle;
|
|
4073
|
+
const lastEmit = this.outgoingTypingLastEmitAt.get(conversationId) ?? 0;
|
|
4074
|
+
const now = Date.now();
|
|
4075
|
+
const isActive = this.outgoingTypingActive.get(conversationId) === true;
|
|
4076
|
+
if (!isActive || now - lastEmit >= throttleMs) {
|
|
4077
|
+
this.outgoingTypingLastEmitAt.set(conversationId, now);
|
|
4078
|
+
this.outgoingTypingActive.set(conversationId, true);
|
|
4079
|
+
void this.sendTypingIndicator(conversationId);
|
|
4080
|
+
}
|
|
4081
|
+
this.scheduleOutgoingTypingStop(conversationId);
|
|
4082
|
+
}
|
|
4083
|
+
/**
|
|
4084
|
+
* Notify that the composer no longer has draft content (or user left the chat).
|
|
4085
|
+
* Sends a single stop event when a typing indicator was previously emitted.
|
|
4086
|
+
*/
|
|
4087
|
+
notifyComposerStoppedTyping(conversationId) {
|
|
4088
|
+
this.clearOutgoingTypingStop(conversationId);
|
|
4089
|
+
if (!this.outgoingTypingActive.get(conversationId)) {
|
|
4090
|
+
return;
|
|
4091
|
+
}
|
|
4092
|
+
this.outgoingTypingActive.set(conversationId, false);
|
|
4093
|
+
void this.stopTypingIndicator(conversationId);
|
|
4094
|
+
}
|
|
4095
|
+
scheduleOutgoingTypingStop(conversationId) {
|
|
4096
|
+
this.clearOutgoingTypingStop(conversationId);
|
|
4097
|
+
const timeoutMs = this.config.typingIndicatorTimeout;
|
|
4098
|
+
const handle = setTimeout(() => {
|
|
4099
|
+
this.outgoingTypingStopHandles.delete(conversationId);
|
|
4100
|
+
this.notifyComposerStoppedTyping(conversationId);
|
|
4101
|
+
}, timeoutMs);
|
|
4102
|
+
this.outgoingTypingStopHandles.set(conversationId, handle);
|
|
4103
|
+
}
|
|
4104
|
+
clearOutgoingTypingStop(conversationId) {
|
|
4105
|
+
const handle = this.outgoingTypingStopHandles.get(conversationId);
|
|
4106
|
+
if (!handle) {
|
|
4107
|
+
return;
|
|
4108
|
+
}
|
|
4109
|
+
clearTimeout(handle);
|
|
4110
|
+
this.outgoingTypingStopHandles.delete(conversationId);
|
|
4111
|
+
}
|
|
4085
4112
|
/**
|
|
4086
4113
|
* Send typing indicator
|
|
4087
4114
|
* Non-critical operation, doesn't throw on failure
|
|
@@ -4119,9 +4146,6 @@ class AXConversationService {
|
|
|
4119
4146
|
* Handle new message received
|
|
4120
4147
|
*/
|
|
4121
4148
|
handleNewMessage(message) {
|
|
4122
|
-
if (message.status === 'read') {
|
|
4123
|
-
return;
|
|
4124
|
-
}
|
|
4125
4149
|
if (this.state.getMessage(message.id)) {
|
|
4126
4150
|
return;
|
|
4127
4151
|
}
|
|
@@ -4131,10 +4155,11 @@ class AXConversationService {
|
|
|
4131
4155
|
const currentId = this._currentUser()?.id ?? 'current-user';
|
|
4132
4156
|
const isFromOtherUser = message.senderId !== currentId;
|
|
4133
4157
|
const isActiveConversation = message.conversationId === this._activeConversationId();
|
|
4134
|
-
|
|
4158
|
+
const isAlreadyRead = message.status === 'read';
|
|
4159
|
+
if (!isAlreadyRead && isFromOtherUser && isActiveConversation) {
|
|
4135
4160
|
this.queueMessageAsRead(message.id);
|
|
4136
4161
|
}
|
|
4137
|
-
else if (isFromOtherUser && !isActiveConversation) {
|
|
4162
|
+
else if (!isAlreadyRead && isFromOtherUser && !isActiveConversation) {
|
|
4138
4163
|
this.state.incrementUnreadCount(message.conversationId);
|
|
4139
4164
|
}
|
|
4140
4165
|
this.syncMessageCountFromRealtime(message, isActiveConversation);
|
|
@@ -4145,12 +4170,12 @@ class AXConversationService {
|
|
|
4145
4170
|
handleMessageUpdate(message) {
|
|
4146
4171
|
const existing = this.state.getMessage(message.id);
|
|
4147
4172
|
if (!existing) {
|
|
4148
|
-
|
|
4149
|
-
|
|
4150
|
-
}
|
|
4173
|
+
this.state.addMessage(message);
|
|
4174
|
+
this.syncLastMessageIfRelevant(message);
|
|
4151
4175
|
return;
|
|
4152
4176
|
}
|
|
4153
4177
|
this.state.updateMessage(message.id, message);
|
|
4178
|
+
this.syncLastMessageIfRelevant(message);
|
|
4154
4179
|
}
|
|
4155
4180
|
/**
|
|
4156
4181
|
* Bump reply/forward counts locally when realtime events arrive outside the active message list.
|
|
@@ -4176,7 +4201,12 @@ class AXConversationService {
|
|
|
4176
4201
|
* Handle message deletion
|
|
4177
4202
|
*/
|
|
4178
4203
|
handleMessageDeletion(messageId) {
|
|
4204
|
+
const message = this.state.getMessage(messageId);
|
|
4205
|
+
const conversationId = message?.conversationId;
|
|
4179
4206
|
this.state.deleteMessage(messageId);
|
|
4207
|
+
if (conversationId) {
|
|
4208
|
+
this.refreshConversationLastMessage(conversationId);
|
|
4209
|
+
}
|
|
4180
4210
|
}
|
|
4181
4211
|
/**
|
|
4182
4212
|
* Handle typing indicator
|
|
@@ -4190,7 +4220,7 @@ class AXConversationService {
|
|
|
4190
4220
|
this.state.clearTypingUser(indicator.conversationId, indicator.userId);
|
|
4191
4221
|
return;
|
|
4192
4222
|
}
|
|
4193
|
-
this.state.setTypingActive(indicator.conversationId, indicator.userId, this.config.typingDisplayDuration
|
|
4223
|
+
this.state.setTypingActive(indicator.conversationId, indicator.userId, this.config.typingDisplayDuration);
|
|
4194
4224
|
}
|
|
4195
4225
|
/**
|
|
4196
4226
|
* Handle presence update
|
|
@@ -4212,7 +4242,7 @@ class AXConversationService {
|
|
|
4212
4242
|
this.state.deleteConversation(conversationId);
|
|
4213
4243
|
this.readQueue.delete(conversationId);
|
|
4214
4244
|
if (this._activeConversationId() === conversationId) {
|
|
4215
|
-
this._activeConversationId.set(
|
|
4245
|
+
this._activeConversationId.set(null);
|
|
4216
4246
|
}
|
|
4217
4247
|
}
|
|
4218
4248
|
handleReadReceipt(receipt) {
|
|
@@ -4234,13 +4264,10 @@ class AXConversationService {
|
|
|
4234
4264
|
return;
|
|
4235
4265
|
}
|
|
4236
4266
|
this.state.updateMessage(change.messageId, { status: change.status });
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
if (!currentUserId) {
|
|
4241
|
-
return;
|
|
4267
|
+
const updated = this.state.getMessage(change.messageId);
|
|
4268
|
+
if (updated) {
|
|
4269
|
+
this.syncLastMessageIfRelevant(updated);
|
|
4242
4270
|
}
|
|
4243
|
-
this.state.updateRoomPreferences(change.conversationId, change.settings);
|
|
4244
4271
|
}
|
|
4245
4272
|
/**
|
|
4246
4273
|
* Insert or refresh a conversation in the in-memory inbox.
|
|
@@ -4273,6 +4300,34 @@ class AXConversationService {
|
|
|
4273
4300
|
updateConversationLastMessage(message) {
|
|
4274
4301
|
this.state.updateLastMessage(message);
|
|
4275
4302
|
}
|
|
4303
|
+
/** Keep sidebar preview in sync when the last cached message is edited or deleted. */
|
|
4304
|
+
syncLastMessageIfRelevant(message) {
|
|
4305
|
+
const conversation = this.state.getConversation(message.conversationId);
|
|
4306
|
+
if (!conversation) {
|
|
4307
|
+
return;
|
|
4308
|
+
}
|
|
4309
|
+
const cachedLast = this.state.getConversationMessages(message.conversationId).at(-1);
|
|
4310
|
+
if (cachedLast?.id === message.id || conversation.lastMessage?.id === message.id) {
|
|
4311
|
+
this.state.updateLastMessage(message);
|
|
4312
|
+
}
|
|
4313
|
+
}
|
|
4314
|
+
/** Recompute conversation preview after a message is removed from the local cache. */
|
|
4315
|
+
refreshConversationLastMessage(conversationId) {
|
|
4316
|
+
const conversation = this.state.getConversation(conversationId);
|
|
4317
|
+
if (!conversation) {
|
|
4318
|
+
return;
|
|
4319
|
+
}
|
|
4320
|
+
const last = this.state.getConversationMessages(conversationId).at(-1);
|
|
4321
|
+
if (last) {
|
|
4322
|
+
this.state.updateLastMessage(last);
|
|
4323
|
+
return;
|
|
4324
|
+
}
|
|
4325
|
+
this.state.updateConversation(conversationId, {
|
|
4326
|
+
lastMessage: undefined,
|
|
4327
|
+
lastMessageAt: conversation.createdAt ?? conversation.updatedAt ?? new Date(),
|
|
4328
|
+
updatedAt: new Date(),
|
|
4329
|
+
});
|
|
4330
|
+
}
|
|
4276
4331
|
// =====================
|
|
4277
4332
|
// Conversation Update APIs
|
|
4278
4333
|
// =====================
|
|
@@ -4521,21 +4576,6 @@ class AXConversationService {
|
|
|
4521
4576
|
return 0;
|
|
4522
4577
|
}
|
|
4523
4578
|
}
|
|
4524
|
-
/**
|
|
4525
|
-
* Disconnect and cleanup
|
|
4526
|
-
* Cleanly closes all connections and resources
|
|
4527
|
-
*/
|
|
4528
|
-
async disconnect() {
|
|
4529
|
-
try {
|
|
4530
|
-
if (this.realtimeApi) {
|
|
4531
|
-
await this.callApi('disconnect', 'realtimeApi', 'disconnect', () => this.realtimeApi.disconnect());
|
|
4532
|
-
}
|
|
4533
|
-
}
|
|
4534
|
-
catch (error) {
|
|
4535
|
-
this.errorHandler.handle(error, 'disconnect');
|
|
4536
|
-
// Don't throw - we're disconnecting anyway
|
|
4537
|
-
}
|
|
4538
|
-
}
|
|
4539
4579
|
// =====================
|
|
4540
4580
|
// Extended Conversation APIs
|
|
4541
4581
|
// =====================
|
|
@@ -4957,6 +4997,7 @@ class AXConversationComposerPopupComponent {
|
|
|
4957
4997
|
this.conversationService = inject(AXConversationService);
|
|
4958
4998
|
this.contentContainer = viewChild.required('contentContainer', { ...(ngDevMode ? { debugName: "contentContainer" } : /* istanbul ignore next */ {}), read: ViewContainerRef });
|
|
4959
4999
|
this.currentComponentRef = null;
|
|
5000
|
+
this.tabItemSelectedSubscription = null;
|
|
4960
5001
|
/** Popup open state (for backward compatibility) */
|
|
4961
5002
|
this.isOpen = input(false, /* @ts-ignore */
|
|
4962
5003
|
...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
|
|
@@ -5006,11 +5047,7 @@ class AXConversationComposerPopupComponent {
|
|
|
5006
5047
|
const tab = this.registry.composerTabs.getTabById(tabId);
|
|
5007
5048
|
if (!tab)
|
|
5008
5049
|
return;
|
|
5009
|
-
|
|
5010
|
-
if (this.currentComponentRef) {
|
|
5011
|
-
this.currentComponentRef.destroy();
|
|
5012
|
-
this.currentComponentRef = null;
|
|
5013
|
-
}
|
|
5050
|
+
this.clearTabContent();
|
|
5014
5051
|
this.contentContainer().clear();
|
|
5015
5052
|
const componentType = tab.component ?? (tab.componentLoader ? await tab.componentLoader() : undefined);
|
|
5016
5053
|
if (!componentType)
|
|
@@ -5020,7 +5057,7 @@ class AXConversationComposerPopupComponent {
|
|
|
5020
5057
|
// Pass item selection handler if component has it
|
|
5021
5058
|
const instance = this.currentComponentRef.instance;
|
|
5022
5059
|
if (instance && typeof instance.itemSelected === 'object' && 'subscribe' in instance.itemSelected) {
|
|
5023
|
-
instance.itemSelected.subscribe((item) => {
|
|
5060
|
+
this.tabItemSelectedSubscription = instance.itemSelected.subscribe((item) => {
|
|
5024
5061
|
// Call callback if provided (popover mode)
|
|
5025
5062
|
const callback = this.onItemSelected();
|
|
5026
5063
|
if (callback) {
|
|
@@ -5034,12 +5071,17 @@ class AXConversationComposerPopupComponent {
|
|
|
5034
5071
|
});
|
|
5035
5072
|
}
|
|
5036
5073
|
}
|
|
5037
|
-
|
|
5074
|
+
clearTabContent() {
|
|
5075
|
+
this.tabItemSelectedSubscription?.unsubscribe();
|
|
5076
|
+
this.tabItemSelectedSubscription = null;
|
|
5038
5077
|
if (this.currentComponentRef) {
|
|
5039
5078
|
this.currentComponentRef.destroy();
|
|
5040
5079
|
this.currentComponentRef = null;
|
|
5041
5080
|
}
|
|
5042
5081
|
}
|
|
5082
|
+
ngOnDestroy() {
|
|
5083
|
+
this.clearTabContent();
|
|
5084
|
+
}
|
|
5043
5085
|
/** Close popup (for backward compatibility) */
|
|
5044
5086
|
close() {
|
|
5045
5087
|
this.closed.emit();
|
|
@@ -6085,8 +6127,6 @@ class AXConversationRegistryComponentOutletComponent {
|
|
|
6085
6127
|
...(ngDevMode ? [{ debugName: "inputs" }] : /* istanbul ignore next */ []));
|
|
6086
6128
|
this.resolvedComponent = signal(null, /* @ts-ignore */
|
|
6087
6129
|
...(ngDevMode ? [{ debugName: "resolvedComponent" }] : /* istanbul ignore next */ []));
|
|
6088
|
-
this.loading = signal(false, /* @ts-ignore */
|
|
6089
|
-
...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
6090
6130
|
/** Avoid re-loading when the parent re-binds the same lazy loader reference. */
|
|
6091
6131
|
this.activeLoader = null;
|
|
6092
6132
|
effect(() => {
|
|
@@ -6095,35 +6135,31 @@ class AXConversationRegistryComponentOutletComponent {
|
|
|
6095
6135
|
if (direct) {
|
|
6096
6136
|
this.activeLoader = null;
|
|
6097
6137
|
this.resolvedComponent.set(direct);
|
|
6098
|
-
this.loading.set(false);
|
|
6099
6138
|
return;
|
|
6100
6139
|
}
|
|
6101
6140
|
if (!loader) {
|
|
6102
6141
|
this.activeLoader = null;
|
|
6103
6142
|
this.resolvedComponent.set(null);
|
|
6104
|
-
this.loading.set(false);
|
|
6105
6143
|
return;
|
|
6106
6144
|
}
|
|
6107
6145
|
if (this.resolvedComponent() && this.activeLoader === loader) {
|
|
6108
6146
|
return;
|
|
6109
6147
|
}
|
|
6110
6148
|
this.activeLoader = loader;
|
|
6111
|
-
this.loading.set(true);
|
|
6112
6149
|
void loader().then((loaded) => {
|
|
6113
6150
|
if (this.activeLoader !== loader) {
|
|
6114
6151
|
return;
|
|
6115
6152
|
}
|
|
6116
6153
|
this.resolvedComponent.set(loaded);
|
|
6117
|
-
this.loading.set(false);
|
|
6118
6154
|
});
|
|
6119
6155
|
});
|
|
6120
6156
|
}
|
|
6121
6157
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationRegistryComponentOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6122
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationRegistryComponentOutletComponent, isStandalone: true, selector: "ax-conversation-registry-component-outlet", inputs: { component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: false, transformFunction: null }, componentLoader: { classPropertyName: "componentLoader", publicName: "componentLoader", isSignal: true, isRequired: false, transformFunction: null }, inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "
|
|
6158
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationRegistryComponentOutletComponent, isStandalone: true, selector: "ax-conversation-registry-component-outlet", inputs: { component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: false, transformFunction: null }, componentLoader: { classPropertyName: "componentLoader", publicName: "componentLoader", isSignal: true, isRequired: false, transformFunction: null }, inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (resolvedComponent(); as component) {\n <ng-container *ngComponentOutlet=\"component; inputs: inputs()\" />\n}\n", styles: ["@layer components{ax-conversation-registry-component-outlet{display:block;min-width:calc(var(--spacing, .25rem) * 0)}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
6123
6159
|
}
|
|
6124
6160
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationRegistryComponentOutletComponent, decorators: [{
|
|
6125
6161
|
type: Component,
|
|
6126
|
-
args: [{ selector: 'ax-conversation-registry-component-outlet', encapsulation: ViewEncapsulation.None, imports: [NgComponentOutlet
|
|
6162
|
+
args: [{ selector: 'ax-conversation-registry-component-outlet', encapsulation: ViewEncapsulation.None, imports: [NgComponentOutlet], template: "@if (resolvedComponent(); as component) {\n <ng-container *ngComponentOutlet=\"component; inputs: inputs()\" />\n}\n", styles: ["@layer components{ax-conversation-registry-component-outlet{display:block;min-width:calc(var(--spacing, .25rem) * 0)}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
6127
6163
|
}], ctorParameters: () => [], propDecorators: { component: [{ type: i0.Input, args: [{ isSignal: true, alias: "component", required: false }] }], componentLoader: [{ type: i0.Input, args: [{ isSignal: true, alias: "componentLoader", required: false }] }], inputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputs", required: false }] }] } });
|
|
6128
6164
|
/** Resolve a registry component reference, preferring lazy loaders when provided. */
|
|
6129
6165
|
function hasRegistryComponent(ref) {
|
|
@@ -6501,7 +6537,6 @@ class AXConversationComposerComponent {
|
|
|
6501
6537
|
get composerActionRegistry() {
|
|
6502
6538
|
return this.conversationService.registry.composerActions;
|
|
6503
6539
|
}
|
|
6504
|
-
// Setup typing indicator throttling
|
|
6505
6540
|
constructor() {
|
|
6506
6541
|
this.conversationService = inject(AXConversationService);
|
|
6507
6542
|
this.composerService = inject(AXConversationComposerService);
|
|
@@ -6546,17 +6581,38 @@ class AXConversationComposerComponent {
|
|
|
6546
6581
|
this.composerPopupLoader = () => Promise.resolve().then(function () { return composerPopup_component; }).then((m) => m.AXConversationComposerPopupComponent);
|
|
6547
6582
|
/** Input placeholder - use service */
|
|
6548
6583
|
this.placeholder = this.composerService.placeholder;
|
|
6549
|
-
/**
|
|
6550
|
-
this.
|
|
6584
|
+
/** Number of input rows - use service */
|
|
6585
|
+
this.inputRows = this.composerService.inputRows;
|
|
6586
|
+
/** Can send message - use service */
|
|
6587
|
+
this.canSend = this.composerService.canSend;
|
|
6588
|
+
/** Whether AI/generation is in progress */
|
|
6589
|
+
this.isGenerating = this.composerService.isGenerating;
|
|
6590
|
+
/** Whether cancel cleanup is in progress */
|
|
6591
|
+
this.isStopping = this.composerService.isStopping;
|
|
6592
|
+
/** Primary button mode */
|
|
6593
|
+
this.primaryButtonMode = this.composerService.primaryButtonMode;
|
|
6594
|
+
/** Start actions from registry - use service */
|
|
6595
|
+
this.startActions = this.composerService.startActions;
|
|
6596
|
+
/** End actions from registry - use service */
|
|
6597
|
+
this.endActions = this.composerService.endActions;
|
|
6598
|
+
/** Start inline actions */
|
|
6599
|
+
this.startInlineActions = this.composerService.startInlineActions;
|
|
6600
|
+
/** Start menu actions (attachment popup) */
|
|
6601
|
+
this.startMenuActions = this.composerService.startMenuActions;
|
|
6602
|
+
/** End inline actions inside input pill */
|
|
6603
|
+
this.endInlineActions = this.composerService.endInlineActions;
|
|
6604
|
+
/** End menu actions */
|
|
6605
|
+
this.endMenuActions = this.composerService.endMenuActions;
|
|
6606
|
+
/** Default end action (voice/send morph) */
|
|
6607
|
+
this.defaultAction = this.composerService.defaultAction;
|
|
6551
6608
|
// Focus text area when requested via AXConversationComposerService.focusComposer()
|
|
6552
|
-
|
|
6609
|
+
effect(() => {
|
|
6553
6610
|
if (this.composerService.focusRequest() === 0)
|
|
6554
6611
|
return;
|
|
6555
6612
|
this.focusTextArea();
|
|
6556
|
-
}
|
|
6557
|
-
...(ngDevMode ? [{ debugName: "#focusComposerEffect" }] : /* istanbul ignore next */ []));
|
|
6613
|
+
});
|
|
6558
6614
|
// React to controller signals (reply/edit)
|
|
6559
|
-
|
|
6615
|
+
effect(() => {
|
|
6560
6616
|
const reply = this.composerService.replyMessage();
|
|
6561
6617
|
const edit = this.composerService.editMessage();
|
|
6562
6618
|
if (reply) {
|
|
@@ -6566,33 +6622,32 @@ class AXConversationComposerComponent {
|
|
|
6566
6622
|
this.startEdit(edit);
|
|
6567
6623
|
}
|
|
6568
6624
|
else {
|
|
6569
|
-
// Clear local state when service signals are cleared
|
|
6570
6625
|
this.editingMessage.set(null);
|
|
6571
6626
|
this.replyingToMessage.set(null);
|
|
6572
6627
|
}
|
|
6573
|
-
}
|
|
6574
|
-
...(ngDevMode ? [{ debugName: "#controllerEffect" }] : /* istanbul ignore next */ []));
|
|
6628
|
+
});
|
|
6575
6629
|
// Close composer popovers when conversation changes (draft/reply/edit reset is handled by message-list).
|
|
6576
|
-
|
|
6577
|
-
|
|
6630
|
+
let previousConversationId = undefined;
|
|
6631
|
+
effect(() => {
|
|
6578
6632
|
const currentId = this.activeConversation()?.id;
|
|
6579
|
-
if (
|
|
6633
|
+
if (previousConversationId !== undefined && previousConversationId !== currentId) {
|
|
6634
|
+
if (previousConversationId) {
|
|
6635
|
+
this.conversationService.notifyComposerStoppedTyping(previousConversationId);
|
|
6636
|
+
}
|
|
6580
6637
|
this.emojiPopoverTarget.set(null);
|
|
6581
6638
|
this.attachPopoverTarget.set(null);
|
|
6582
6639
|
this.editingMessage.set(null);
|
|
6583
6640
|
this.replyingToMessage.set(null);
|
|
6584
6641
|
}
|
|
6585
|
-
|
|
6586
|
-
}
|
|
6587
|
-
...(ngDevMode ? [{ debugName: "#conversationUiResetEffect" }] : /* istanbul ignore next */ []));
|
|
6642
|
+
previousConversationId = currentId;
|
|
6643
|
+
});
|
|
6588
6644
|
// Auto-save draft on text change
|
|
6589
|
-
|
|
6645
|
+
effect(() => {
|
|
6590
6646
|
const text = this.draftText();
|
|
6591
6647
|
const conversation = this.activeConversation();
|
|
6592
6648
|
const isEditing = !!this.composerService.editMessage();
|
|
6593
6649
|
if (conversation?.id && !isEditing) {
|
|
6594
6650
|
const conversationId = conversation.id;
|
|
6595
|
-
// Debounce auto-save
|
|
6596
6651
|
if (this.draftSaveTimeout) {
|
|
6597
6652
|
clearTimeout(this.draftSaveTimeout);
|
|
6598
6653
|
}
|
|
@@ -6603,102 +6658,41 @@ class AXConversationComposerComponent {
|
|
|
6603
6658
|
this.composerService.saveDraft(conversationId, text);
|
|
6604
6659
|
}, 500);
|
|
6605
6660
|
}
|
|
6606
|
-
}
|
|
6607
|
-
|
|
6608
|
-
|
|
6609
|
-
this.inputRows = this.composerService.inputRows;
|
|
6610
|
-
/** Can send message - use service */
|
|
6611
|
-
this.canSend = this.composerService.canSend;
|
|
6612
|
-
/** Whether AI/generation is in progress */
|
|
6613
|
-
this.isGenerating = this.composerService.isGenerating;
|
|
6614
|
-
/** Whether cancel cleanup is in progress */
|
|
6615
|
-
this.isStopping = this.composerService.isStopping;
|
|
6616
|
-
/** Primary button mode */
|
|
6617
|
-
this.primaryButtonMode = this.composerService.primaryButtonMode;
|
|
6618
|
-
/** Start actions from registry - use service */
|
|
6619
|
-
this.startActions = this.composerService.startActions;
|
|
6620
|
-
/** End actions from registry - use service */
|
|
6621
|
-
this.endActions = this.composerService.endActions;
|
|
6622
|
-
/** Start inline actions */
|
|
6623
|
-
this.startInlineActions = this.composerService.startInlineActions;
|
|
6624
|
-
/** Start menu actions (attachment popup) */
|
|
6625
|
-
this.startMenuActions = this.composerService.startMenuActions;
|
|
6626
|
-
/** End inline actions inside input pill */
|
|
6627
|
-
this.endInlineActions = this.composerService.endInlineActions;
|
|
6628
|
-
/** End menu actions */
|
|
6629
|
-
this.endMenuActions = this.composerService.endMenuActions;
|
|
6630
|
-
/** Default end action (voice/send morph) */
|
|
6631
|
-
this.defaultAction = this.composerService.defaultAction;
|
|
6632
|
-
this.typingSubject
|
|
6633
|
-
.pipe(throttleTime(this.config.typingIndicatorThrottle ?? 3000), takeUntilDestroyed())
|
|
6634
|
-
.subscribe((conversationId) => {
|
|
6635
|
-
this.conversationService.sendTypingIndicator(conversationId);
|
|
6636
|
-
});
|
|
6637
|
-
}
|
|
6638
|
-
// Focus text area when requested via AXConversationComposerService.focusComposer()
|
|
6639
|
-
#focusComposerEffect;
|
|
6640
|
-
// React to controller signals (reply/edit)
|
|
6641
|
-
#controllerEffect;
|
|
6642
|
-
// Close composer popovers when conversation changes (draft/reply/edit reset is handled by message-list).
|
|
6643
|
-
#previousConversationId;
|
|
6644
|
-
#conversationUiResetEffect;
|
|
6645
|
-
// Auto-save draft on text change
|
|
6646
|
-
#draftAutoSaveEffect;
|
|
6647
|
-
/** Handle key down */
|
|
6661
|
+
});
|
|
6662
|
+
}
|
|
6663
|
+
/** Handle key down (send on Enter; typing is driven by draft changes only). */
|
|
6648
6664
|
onKeyDown(event) {
|
|
6649
6665
|
const key = event?.nativeEvent?.key;
|
|
6650
6666
|
const shiftKey = event?.nativeEvent?.shiftKey;
|
|
6651
|
-
// Send on Enter (without Shift)
|
|
6652
6667
|
if (key === 'Enter' && !shiftKey) {
|
|
6653
6668
|
event?.nativeEvent?.preventDefault();
|
|
6654
6669
|
if (this.primaryButtonMode() === 'send') {
|
|
6655
|
-
this.onSendClick();
|
|
6670
|
+
void this.onSendClick();
|
|
6656
6671
|
}
|
|
6657
6672
|
}
|
|
6658
|
-
// Send typing indicator
|
|
6659
|
-
this.sendTypingIndicator();
|
|
6660
6673
|
}
|
|
6661
|
-
/** Handle
|
|
6662
|
-
|
|
6663
|
-
this.sendTypingIndicator();
|
|
6664
|
-
}
|
|
6665
|
-
/** Send typing indicator (throttled via RxJS) */
|
|
6666
|
-
sendTypingIndicator() {
|
|
6674
|
+
/** Handle draft text changes — throttled typing indicator via conversation service. */
|
|
6675
|
+
onDraftChanged() {
|
|
6667
6676
|
const conversation = this.activeConversation();
|
|
6668
|
-
if (!conversation)
|
|
6677
|
+
if (!conversation) {
|
|
6669
6678
|
return;
|
|
6679
|
+
}
|
|
6670
6680
|
const conversationId = conversation.id;
|
|
6671
|
-
|
|
6672
|
-
|
|
6673
|
-
this.stopTypingIndicator(conversationId);
|
|
6681
|
+
if (!this.draftText().trim()) {
|
|
6682
|
+
this.conversationService.notifyComposerStoppedTyping(conversationId);
|
|
6674
6683
|
return;
|
|
6675
6684
|
}
|
|
6676
|
-
this.
|
|
6677
|
-
if (this.typingStopHandle) {
|
|
6678
|
-
clearTimeout(this.typingStopHandle);
|
|
6679
|
-
}
|
|
6680
|
-
this.typingStopHandle = window.setTimeout(() => {
|
|
6681
|
-
this.stopTypingIndicator(conversationId);
|
|
6682
|
-
}, this.config.typingIndicatorTimeout ?? 3000);
|
|
6683
|
-
}
|
|
6684
|
-
stopTypingIndicator(conversationId) {
|
|
6685
|
-
if (this.typingStopHandle) {
|
|
6686
|
-
clearTimeout(this.typingStopHandle);
|
|
6687
|
-
this.typingStopHandle = undefined;
|
|
6688
|
-
}
|
|
6689
|
-
void this.conversationService.stopTypingIndicator(conversationId);
|
|
6685
|
+
this.conversationService.notifyComposerTyping(conversationId);
|
|
6690
6686
|
}
|
|
6691
6687
|
/** Cleanup on destroy */
|
|
6692
6688
|
ngOnDestroy() {
|
|
6693
6689
|
const conversation = this.activeConversation();
|
|
6694
6690
|
if (conversation?.id) {
|
|
6695
|
-
this.
|
|
6691
|
+
this.conversationService.notifyComposerStoppedTyping(conversation.id);
|
|
6696
6692
|
if (!this.composerService.editMessage()) {
|
|
6697
6693
|
this.composerService.saveDraft(conversation.id, this.draftText());
|
|
6698
6694
|
}
|
|
6699
6695
|
}
|
|
6700
|
-
this.typingSubject.complete();
|
|
6701
|
-
// Clear timeout
|
|
6702
6696
|
if (this.draftSaveTimeout) {
|
|
6703
6697
|
clearTimeout(this.draftSaveTimeout);
|
|
6704
6698
|
}
|
|
@@ -6734,7 +6728,7 @@ class AXConversationComposerComponent {
|
|
|
6734
6728
|
};
|
|
6735
6729
|
this.editingMessage.set(null);
|
|
6736
6730
|
this.replyingToMessage.set(null);
|
|
6737
|
-
this.
|
|
6731
|
+
this.conversationService.notifyComposerStoppedTyping(conversation.id);
|
|
6738
6732
|
void this.composerService
|
|
6739
6733
|
.sendMessage(command)
|
|
6740
6734
|
.then(() => {
|
|
@@ -6769,11 +6763,10 @@ class AXConversationComposerComponent {
|
|
|
6769
6763
|
/** Handle emoji/sticker selection from popup */
|
|
6770
6764
|
onEmojiItemSelected(item) {
|
|
6771
6765
|
if (typeof item === 'string') {
|
|
6772
|
-
// Emoji selected
|
|
6773
6766
|
this.draftText.update((text) => text + item);
|
|
6767
|
+
this.onDraftChanged();
|
|
6774
6768
|
}
|
|
6775
6769
|
else if (item && 'url' in item) {
|
|
6776
|
-
// Sticker selected - send immediately
|
|
6777
6770
|
this.sendSticker(item);
|
|
6778
6771
|
}
|
|
6779
6772
|
this.emojiPopoverRef()?.close();
|
|
@@ -6929,6 +6922,7 @@ class AXConversationComposerComponent {
|
|
|
6929
6922
|
this.editingMessage.set(message);
|
|
6930
6923
|
this.replyingToMessage.set(null);
|
|
6931
6924
|
this.draftText.set(message.payload?.text || '');
|
|
6925
|
+
this.onDraftChanged();
|
|
6932
6926
|
}
|
|
6933
6927
|
/** Start replying to a message */
|
|
6934
6928
|
startReply(message) {
|
|
@@ -6955,7 +6949,6 @@ class AXConversationComposerComponent {
|
|
|
6955
6949
|
if (!action)
|
|
6956
6950
|
return;
|
|
6957
6951
|
const context = this.composerService.actionContext();
|
|
6958
|
-
// Special handling for emoji action
|
|
6959
6952
|
if (actionId === 'emoji') {
|
|
6960
6953
|
this.onEmojiClick(event);
|
|
6961
6954
|
return;
|
|
@@ -6968,7 +6961,6 @@ class AXConversationComposerComponent {
|
|
|
6968
6961
|
});
|
|
6969
6962
|
return;
|
|
6970
6963
|
}
|
|
6971
|
-
// Otherwise execute the handler
|
|
6972
6964
|
if (action.handler) {
|
|
6973
6965
|
try {
|
|
6974
6966
|
await this.composerActionRegistry.executeAction(actionId, context);
|
|
@@ -7048,11 +7040,10 @@ class AXConversationComposerComponent {
|
|
|
7048
7040
|
const messageElement = document.getElementById(`message-${message.id}`);
|
|
7049
7041
|
if (messageElement) {
|
|
7050
7042
|
messageElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
7051
|
-
// Highlight the message briefly
|
|
7052
7043
|
messageElement.classList.add('message-highlight');
|
|
7053
7044
|
setTimeout(() => {
|
|
7054
7045
|
messageElement.classList.remove('message-highlight');
|
|
7055
|
-
}, this.config.messageHighlightDuration
|
|
7046
|
+
}, this.config.messageHighlightDuration);
|
|
7056
7047
|
}
|
|
7057
7048
|
}
|
|
7058
7049
|
/** Inputs for picker components opened in popup / action sheet */
|
|
@@ -7063,16 +7054,8 @@ class AXConversationComposerComponent {
|
|
|
7063
7054
|
service: this.composerService,
|
|
7064
7055
|
};
|
|
7065
7056
|
}
|
|
7066
|
-
async onEnter(event) {
|
|
7067
|
-
if (event.nativeEvent.key === 'Enter' && !event.nativeEvent.shiftKey) {
|
|
7068
|
-
event.nativeEvent.preventDefault();
|
|
7069
|
-
if (this.primaryButtonMode() === 'send') {
|
|
7070
|
-
await this.onSendClick();
|
|
7071
|
-
}
|
|
7072
|
-
}
|
|
7073
|
-
}
|
|
7074
7057
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationComposerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7075
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationComposerComponent, isStandalone: true, selector: "ax-conversation-composer", outputs: { messageSent: "messageSent", generationCancelled: "generationCancelled", emojiClick: "emojiClick", attachClick: "attachClick", voiceClick: "voiceClick" }, viewQueries: [{ propertyName: "textAreaRef", first: true, predicate: ["inputElement"], descendants: true, read: AXTextAreaComponent, isSignal: true }, { propertyName: "emojiPopoverRef", first: true, predicate: ["emojiPopover"], descendants: true, isSignal: true }, { propertyName: "attachPopoverRef", first: true, predicate: ["attachPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (activeConversation()) {\n <div class=\"composer\">\n <!-- Edit/Reply Banner -->\n @if (editingMessage() || replyingToMessage()) {\n <div\n class=\"ax-conversation-composer-banner\"\n [class.ax-conversation-composer-banner--edit]=\"!!editingMessage()\"\n [class.ax-conversation-composer-banner--reply]=\"!!replyingToMessage()\"\n >\n <div class=\"ax-conversation-composer-banner__accent\" aria-hidden=\"true\"></div>\n @if (editingMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-pen-to-square\"></i\n ></span>\n <div class=\"ax-conversation-composer-banner__body\">\n <span class=\"ax-conversation-composer-banner__label\">{{\n '@acorex:chat.composer.editing-message' | translate | async\n }}</span>\n @if (getEditingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n } @else if (replyingToMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-reply\"></i\n ></span>\n <div\n class=\"ax-conversation-composer-banner__body ax-conversation-composer-banner__body--clickable\"\n (click)=\"onReplyPreviewClick()\"\n >\n <span class=\"ax-conversation-composer-banner__label\">\n {{ '@acorex:chat.composer.replying-to' | translate | async }} {{ getReplyingSenderName() }}\n </span>\n @if (getReplyingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-composer-banner__close\"\n (click)=\"cancelEditReply()\"\n [attr.aria-label]=\"'@acorex:chat.actions.cancel' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n\n <!-- Input Area -->\n <div class=\"composer-input-container\">\n <!-- Start actions -->\n <div class=\"composer-actions-left\">\n @if (startMenuActions().length > 0) {\n <ax-button\n class=\"rounded-full text-xl\"\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"('@acorex:chat.tooltips.attach-file' | translate | async) ?? ''\"\n (onClick)=\"onAttachMenuClick($event)\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-paperclip\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n @for (action of startInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n </div>\n\n <!-- Text Input -->\n <div class=\"composer-input-wrapper\">\n <ax-text-area\n #inputElement\n [(ngModel)]=\"draftText\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onValueChanged)=\"onInput()\"\n [placeholder]=\"placeholder()\"\n (onKeyDown)=\"onEnter($event)\"\n [rows]=\"inputRows()\"\n ></ax-text-area>\n </div>\n\n <!-- End actions -->\n <div class=\"composer-actions-right\">\n @for (action of endInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <ax-button\n class=\"rounded-full text-xl\"\n [class.ax-conversation-composer-primary--stopping]=\"primaryButtonMode() === 'stopping'\"\n color=\"primary\"\n look=\"solid\"\n [iconOnly]=\"true\"\n [text]=\"getPrimaryButtonLabel()\"\n [disabled]=\"isPrimaryButtonDisabled()\"\n (onClick)=\"onPrimaryButtonClick()\"\n >\n <ax-prefix>\n <i [class]=\"getPrimaryButtonIcon()\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n\n <!-- Attachments Preview -->\n @if (attachments().length > 0) {\n <div class=\"composer-attachments\">\n @for (attachment of attachments(); track $index) {\n <div class=\"attachment-item\">\n <span class=\"attachment-icon\"><i class=\"fa-light fa-paperclip\"></i></span>\n <span class=\"attachment-name\">{{ attachment.name }}</span>\n <button\n type=\"button\"\n class=\"attachment-remove\"\n (click)=\"removeAttachment($index)\"\n [attr.aria-label]=\"'@acorex:chat.actions.remove-attachment' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n }\n </div>\n}\n\n<!-- Popover for attachment menu -->\n@if (attachPopoverTarget()) {\n <ax-popover\n #attachPopover\n [target]=\"attachPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n (onClosed)=\"onAttachPopoverClosed()\"\n >\n <ax-button-item-list>\n @for (action of startMenuActions(); track action.id) {\n <ax-button-item\n [text]=\"getActionLabel(action)\"\n (click)=\"onAttachMenuAction(action.id)\"\n [disabled]=\"!isActionEnabled(action)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-popover>\n}\n\n<!-- Popover for emoji/sticker picker -->\n@if (emojiPopoverTarget()) {\n <ax-popover\n #emojiPopover\n [target]=\"emojiPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n panelClass=\"composer-emoji-popover-panel\"\n (onClosed)=\"onEmojiPopoverClosed()\"\n >\n <div class=\"composer-emoji-popover\">\n <ax-conversation-registry-component-outlet\n [componentLoader]=\"composerPopupLoader\"\n [inputs]=\"getEmojiPopupInputs()\"\n />\n </div>\n </ax-popover>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-composer{display:block;width:100%;@keyframes ax-conversation-composer-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}ax-conversation-composer .ax-conversation-composer-banner{display:flex;min-height:2.75rem;align-items:stretch;gap:calc(var(--spacing, .25rem) * 0);border-block-style:var(--tw-border-style);border-block-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-composer .ax-conversation-composer-banner__accent{width:3px;flex-shrink:0;border-start-end-radius:var(--radius-sm, .25rem);border-end-end-radius:var(--radius-sm, .25rem);background-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__accent{background-color:rgba(var(--ax-sys-color-secondary-500))}ax-conversation-composer .ax-conversation-composer-banner__content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2)}ax-conversation-composer .ax-conversation-composer-banner__icon{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600));background:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__icon{color:rgba(var(--ax-sys-color-secondary-600));background:rgba(var(--ax-sys-color-secondary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner__body{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}ax-conversation-composer .ax-conversation-composer-banner__body--clickable{cursor:pointer;border-radius:var(--ax-sys-border-radius);transition:opacity .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__body--clickable:hover{opacity:.85}}ax-conversation-composer .ax-conversation-composer-banner__label{font-size:.6875rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-600));text-transform:uppercase}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__label{color:rgba(var(--ax-sys-color-secondary-600))}ax-conversation-composer .ax-conversation-composer-banner__preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);overflow:hidden;font-size:.8125rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:.88}ax-conversation-composer .ax-conversation-composer-banner__preview i{flex-shrink:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}ax-conversation-composer .ax-conversation-composer-banner__close{margin-inline-end:calc(var(--spacing, .25rem) * 1.5);display:flex;height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;align-self:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-primary-lightest-surface),.55);transition:background-color .15s ease,color .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__close:hover{color:rgba(var(--ax-sys-color-on-surface));background:rgba(var(--ax-sys-color-on-surface),.06)}}ax-conversation-composer .ax-conversation-composer-banner__close:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .emoji-icon{flex-shrink:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)))}ax-conversation-composer .composer-input-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-composer .composer-actions-left,ax-conversation-composer .composer-actions-right{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-composer .composer-input-wrapper{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-composer .composer-input-wrapper .ax-editor-container{padding:calc(var(--spacing, .25rem) * 0)}ax-conversation-composer .composer-input{max-height:120px;min-height:calc(var(--spacing, .25rem) * 10);width:100%;resize:none;border-radius:1.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);--tw-outline-style: none;outline-style:none;transition:border-color .2s}ax-conversation-composer .composer-input:focus{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .composer-attachments{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-bottom:calc(var(--spacing, .25rem) * 4)}ax-conversation-composer .attachment-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-conversation-composer .attachment-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-composer .attachment-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-conversation-composer .attachment-remove{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:background .2s}@media(hover:hover){ax-conversation-composer .attachment-remove:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}}ax-conversation-composer .composer-component-fullwidth{min-height:72px;width:100%;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-composer .composer-emoji-popover{width:100%}ax-conversation-composer .ax-conversation-composer-primary--stopping .fa-spinner{animation:ax-conversation-composer-spin .75s linear infinite}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial;--tw-outline-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AXConversationRegistryComponentOutletComponent, selector: "ax-conversation-registry-component-outlet", inputs: ["component", "componentLoader", "inputs"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXCommonModule }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
7058
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationComposerComponent, isStandalone: true, selector: "ax-conversation-composer", outputs: { messageSent: "messageSent", generationCancelled: "generationCancelled", emojiClick: "emojiClick", attachClick: "attachClick", voiceClick: "voiceClick" }, viewQueries: [{ propertyName: "textAreaRef", first: true, predicate: ["inputElement"], descendants: true, read: AXTextAreaComponent, isSignal: true }, { propertyName: "emojiPopoverRef", first: true, predicate: ["emojiPopover"], descendants: true, isSignal: true }, { propertyName: "attachPopoverRef", first: true, predicate: ["attachPopover"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (activeConversation()) {\n <div class=\"composer\">\n <!-- Edit/Reply Banner -->\n @if (editingMessage() || replyingToMessage()) {\n <div\n class=\"ax-conversation-composer-banner\"\n [class.ax-conversation-composer-banner--edit]=\"!!editingMessage()\"\n [class.ax-conversation-composer-banner--reply]=\"!!replyingToMessage()\"\n >\n <div class=\"ax-conversation-composer-banner__accent\" aria-hidden=\"true\"></div>\n @if (editingMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-pen-to-square\"></i\n ></span>\n <div class=\"ax-conversation-composer-banner__body\">\n <span class=\"ax-conversation-composer-banner__label\">{{\n '@acorex:chat.composer.editing-message' | translate | async\n }}</span>\n @if (getEditingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n } @else if (replyingToMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-reply\"></i\n ></span>\n <div\n class=\"ax-conversation-composer-banner__body ax-conversation-composer-banner__body--clickable\"\n (click)=\"onReplyPreviewClick()\"\n >\n <span class=\"ax-conversation-composer-banner__label\">\n {{ '@acorex:chat.composer.replying-to' | translate | async }} {{ getReplyingSenderName() }}\n </span>\n @if (getReplyingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-composer-banner__close\"\n (click)=\"cancelEditReply()\"\n [attr.aria-label]=\"'@acorex:chat.actions.cancel' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n\n <!-- Input Area -->\n <div class=\"composer-input-container\">\n <!-- Start actions -->\n <div class=\"composer-actions-left\">\n @if (startMenuActions().length > 0) {\n <ax-button\n class=\"rounded-full text-xl\"\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"('@acorex:chat.tooltips.attach-file' | translate | async) ?? ''\"\n (onClick)=\"onAttachMenuClick($event)\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-paperclip\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n @for (action of startInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n </div>\n\n <!-- Text Input -->\n <div class=\"composer-input-wrapper\">\n <ax-text-area\n #inputElement\n [(ngModel)]=\"draftText\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onValueChanged)=\"onDraftChanged()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"inputRows()\"\n ></ax-text-area>\n </div>\n\n <!-- End actions -->\n <div class=\"composer-actions-right\">\n @for (action of endInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <ax-button\n class=\"rounded-full text-xl\"\n [class.ax-conversation-composer-primary--stopping]=\"primaryButtonMode() === 'stopping'\"\n color=\"primary\"\n look=\"solid\"\n [iconOnly]=\"true\"\n [text]=\"getPrimaryButtonLabel()\"\n [disabled]=\"isPrimaryButtonDisabled()\"\n (onClick)=\"onPrimaryButtonClick()\"\n >\n <ax-prefix>\n <i [class]=\"getPrimaryButtonIcon()\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n\n <!-- Attachments Preview -->\n @if (attachments().length > 0) {\n <div class=\"composer-attachments\">\n @for (attachment of attachments(); track $index) {\n <div class=\"attachment-item\">\n <span class=\"attachment-icon\"><i class=\"fa-light fa-paperclip\"></i></span>\n <span class=\"attachment-name\">{{ attachment.name }}</span>\n <button\n type=\"button\"\n class=\"attachment-remove\"\n (click)=\"removeAttachment($index)\"\n [attr.aria-label]=\"'@acorex:chat.actions.remove-attachment' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n }\n </div>\n}\n\n<!-- Popover for attachment menu -->\n@if (attachPopoverTarget()) {\n <ax-popover\n #attachPopover\n [target]=\"attachPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n (onClosed)=\"onAttachPopoverClosed()\"\n >\n <ax-button-item-list>\n @for (action of startMenuActions(); track action.id) {\n <ax-button-item\n [text]=\"getActionLabel(action)\"\n (click)=\"onAttachMenuAction(action.id)\"\n [disabled]=\"!isActionEnabled(action)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-popover>\n}\n\n<!-- Popover for emoji/sticker picker -->\n@if (emojiPopoverTarget()) {\n <ax-popover\n #emojiPopover\n [target]=\"emojiPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n panelClass=\"composer-emoji-popover-panel\"\n (onClosed)=\"onEmojiPopoverClosed()\"\n >\n <div class=\"composer-emoji-popover\">\n <ax-conversation-registry-component-outlet\n [componentLoader]=\"composerPopupLoader\"\n [inputs]=\"getEmojiPopupInputs()\"\n />\n </div>\n </ax-popover>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-composer{display:block;width:100%;@keyframes ax-conversation-composer-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}ax-conversation-composer .ax-conversation-composer-banner{display:flex;min-height:2.75rem;align-items:stretch;gap:calc(var(--spacing, .25rem) * 0);border-block-style:var(--tw-border-style);border-block-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-composer .ax-conversation-composer-banner__accent{width:3px;flex-shrink:0;border-start-end-radius:var(--radius-sm, .25rem);border-end-end-radius:var(--radius-sm, .25rem);background-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__accent{background-color:rgba(var(--ax-sys-color-secondary-500))}ax-conversation-composer .ax-conversation-composer-banner__content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2)}ax-conversation-composer .ax-conversation-composer-banner__icon{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600));background:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__icon{color:rgba(var(--ax-sys-color-secondary-600));background:rgba(var(--ax-sys-color-secondary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner__body{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}ax-conversation-composer .ax-conversation-composer-banner__body--clickable{cursor:pointer;border-radius:var(--ax-sys-border-radius);transition:opacity .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__body--clickable:hover{opacity:.85}}ax-conversation-composer .ax-conversation-composer-banner__label{font-size:.6875rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-600));text-transform:uppercase}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__label{color:rgba(var(--ax-sys-color-secondary-600))}ax-conversation-composer .ax-conversation-composer-banner__preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);overflow:hidden;font-size:.8125rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:.88}ax-conversation-composer .ax-conversation-composer-banner__preview i{flex-shrink:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}ax-conversation-composer .ax-conversation-composer-banner__close{margin-inline-end:calc(var(--spacing, .25rem) * 1.5);display:flex;height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;align-self:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-primary-lightest-surface),.55);transition:background-color .15s ease,color .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__close:hover{color:rgba(var(--ax-sys-color-on-surface));background:rgba(var(--ax-sys-color-on-surface),.06)}}ax-conversation-composer .ax-conversation-composer-banner__close:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .emoji-icon{flex-shrink:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)))}ax-conversation-composer .composer-input-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-composer .composer-actions-left,ax-conversation-composer .composer-actions-right{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-composer .composer-input-wrapper{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-composer .composer-input-wrapper .ax-editor-container{padding:calc(var(--spacing, .25rem) * 0)}ax-conversation-composer .composer-input{max-height:120px;min-height:calc(var(--spacing, .25rem) * 10);width:100%;resize:none;border-radius:1.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);--tw-outline-style: none;outline-style:none;transition:border-color .2s}ax-conversation-composer .composer-input:focus{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .composer-attachments{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-bottom:calc(var(--spacing, .25rem) * 4)}ax-conversation-composer .attachment-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-conversation-composer .attachment-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-composer .attachment-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-conversation-composer .attachment-remove{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:background .2s}@media(hover:hover){ax-conversation-composer .attachment-remove:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}}ax-conversation-composer .composer-component-fullwidth{min-height:72px;width:100%;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-composer .composer-emoji-popover{width:100%}ax-conversation-composer .ax-conversation-composer-primary--stopping .fa-spinner{animation:ax-conversation-composer-spin .75s linear infinite}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial;--tw-outline-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AXConversationRegistryComponentOutletComponent, selector: "ax-conversation-registry-component-outlet", inputs: ["component", "componentLoader", "inputs"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXTextAreaComponent, selector: "ax-text-area", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "placeholder", "maxLength", "look", "rows", "allowResize", "showCounter", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXCommonModule }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXButtonItemComponent, selector: "ax-button-item", inputs: ["color", "disabled", "text", "selected", "divided", "data", "name"], outputs: ["onClick", "onFocus", "onBlur", "disabledChange"] }, { kind: "component", type: AXButtonItemListComponent, selector: "ax-button-item-list", inputs: ["items", "closeParentOnClick", "lockOnLoading"], outputs: ["onItemClick"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
7076
7059
|
}
|
|
7077
7060
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationComposerComponent, decorators: [{
|
|
7078
7061
|
type: Component,
|
|
@@ -7088,7 +7071,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
7088
7071
|
AXTranslationModule,
|
|
7089
7072
|
AXButtonItemComponent,
|
|
7090
7073
|
AXButtonItemListComponent,
|
|
7091
|
-
], template: "@if (activeConversation()) {\n <div class=\"composer\">\n <!-- Edit/Reply Banner -->\n @if (editingMessage() || replyingToMessage()) {\n <div\n class=\"ax-conversation-composer-banner\"\n [class.ax-conversation-composer-banner--edit]=\"!!editingMessage()\"\n [class.ax-conversation-composer-banner--reply]=\"!!replyingToMessage()\"\n >\n <div class=\"ax-conversation-composer-banner__accent\" aria-hidden=\"true\"></div>\n @if (editingMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-pen-to-square\"></i\n ></span>\n <div class=\"ax-conversation-composer-banner__body\">\n <span class=\"ax-conversation-composer-banner__label\">{{\n '@acorex:chat.composer.editing-message' | translate | async\n }}</span>\n @if (getEditingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n } @else if (replyingToMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-reply\"></i\n ></span>\n <div\n class=\"ax-conversation-composer-banner__body ax-conversation-composer-banner__body--clickable\"\n (click)=\"onReplyPreviewClick()\"\n >\n <span class=\"ax-conversation-composer-banner__label\">\n {{ '@acorex:chat.composer.replying-to' | translate | async }} {{ getReplyingSenderName() }}\n </span>\n @if (getReplyingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-composer-banner__close\"\n (click)=\"cancelEditReply()\"\n [attr.aria-label]=\"'@acorex:chat.actions.cancel' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n\n <!-- Input Area -->\n <div class=\"composer-input-container\">\n <!-- Start actions -->\n <div class=\"composer-actions-left\">\n @if (startMenuActions().length > 0) {\n <ax-button\n class=\"rounded-full text-xl\"\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"('@acorex:chat.tooltips.attach-file' | translate | async) ?? ''\"\n (onClick)=\"onAttachMenuClick($event)\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-paperclip\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n @for (action of startInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n </div>\n\n <!-- Text Input -->\n <div class=\"composer-input-wrapper\">\n <ax-text-area\n #inputElement\n [(ngModel)]=\"draftText\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onValueChanged)=\"onInput()\"\n [placeholder]=\"placeholder()\"\n (onKeyDown)=\"onEnter($event)\"\n [rows]=\"inputRows()\"\n ></ax-text-area>\n </div>\n\n <!-- End actions -->\n <div class=\"composer-actions-right\">\n @for (action of endInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <ax-button\n class=\"rounded-full text-xl\"\n [class.ax-conversation-composer-primary--stopping]=\"primaryButtonMode() === 'stopping'\"\n color=\"primary\"\n look=\"solid\"\n [iconOnly]=\"true\"\n [text]=\"getPrimaryButtonLabel()\"\n [disabled]=\"isPrimaryButtonDisabled()\"\n (onClick)=\"onPrimaryButtonClick()\"\n >\n <ax-prefix>\n <i [class]=\"getPrimaryButtonIcon()\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n\n <!-- Attachments Preview -->\n @if (attachments().length > 0) {\n <div class=\"composer-attachments\">\n @for (attachment of attachments(); track $index) {\n <div class=\"attachment-item\">\n <span class=\"attachment-icon\"><i class=\"fa-light fa-paperclip\"></i></span>\n <span class=\"attachment-name\">{{ attachment.name }}</span>\n <button\n type=\"button\"\n class=\"attachment-remove\"\n (click)=\"removeAttachment($index)\"\n [attr.aria-label]=\"'@acorex:chat.actions.remove-attachment' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n }\n </div>\n}\n\n<!-- Popover for attachment menu -->\n@if (attachPopoverTarget()) {\n <ax-popover\n #attachPopover\n [target]=\"attachPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n (onClosed)=\"onAttachPopoverClosed()\"\n >\n <ax-button-item-list>\n @for (action of startMenuActions(); track action.id) {\n <ax-button-item\n [text]=\"getActionLabel(action)\"\n (click)=\"onAttachMenuAction(action.id)\"\n [disabled]=\"!isActionEnabled(action)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-popover>\n}\n\n<!-- Popover for emoji/sticker picker -->\n@if (emojiPopoverTarget()) {\n <ax-popover\n #emojiPopover\n [target]=\"emojiPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n panelClass=\"composer-emoji-popover-panel\"\n (onClosed)=\"onEmojiPopoverClosed()\"\n >\n <div class=\"composer-emoji-popover\">\n <ax-conversation-registry-component-outlet\n [componentLoader]=\"composerPopupLoader\"\n [inputs]=\"getEmojiPopupInputs()\"\n />\n </div>\n </ax-popover>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-composer{display:block;width:100%;@keyframes ax-conversation-composer-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}ax-conversation-composer .ax-conversation-composer-banner{display:flex;min-height:2.75rem;align-items:stretch;gap:calc(var(--spacing, .25rem) * 0);border-block-style:var(--tw-border-style);border-block-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-composer .ax-conversation-composer-banner__accent{width:3px;flex-shrink:0;border-start-end-radius:var(--radius-sm, .25rem);border-end-end-radius:var(--radius-sm, .25rem);background-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__accent{background-color:rgba(var(--ax-sys-color-secondary-500))}ax-conversation-composer .ax-conversation-composer-banner__content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2)}ax-conversation-composer .ax-conversation-composer-banner__icon{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600));background:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__icon{color:rgba(var(--ax-sys-color-secondary-600));background:rgba(var(--ax-sys-color-secondary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner__body{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}ax-conversation-composer .ax-conversation-composer-banner__body--clickable{cursor:pointer;border-radius:var(--ax-sys-border-radius);transition:opacity .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__body--clickable:hover{opacity:.85}}ax-conversation-composer .ax-conversation-composer-banner__label{font-size:.6875rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-600));text-transform:uppercase}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__label{color:rgba(var(--ax-sys-color-secondary-600))}ax-conversation-composer .ax-conversation-composer-banner__preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);overflow:hidden;font-size:.8125rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:.88}ax-conversation-composer .ax-conversation-composer-banner__preview i{flex-shrink:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}ax-conversation-composer .ax-conversation-composer-banner__close{margin-inline-end:calc(var(--spacing, .25rem) * 1.5);display:flex;height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;align-self:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-primary-lightest-surface),.55);transition:background-color .15s ease,color .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__close:hover{color:rgba(var(--ax-sys-color-on-surface));background:rgba(var(--ax-sys-color-on-surface),.06)}}ax-conversation-composer .ax-conversation-composer-banner__close:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .emoji-icon{flex-shrink:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)))}ax-conversation-composer .composer-input-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-composer .composer-actions-left,ax-conversation-composer .composer-actions-right{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-composer .composer-input-wrapper{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-composer .composer-input-wrapper .ax-editor-container{padding:calc(var(--spacing, .25rem) * 0)}ax-conversation-composer .composer-input{max-height:120px;min-height:calc(var(--spacing, .25rem) * 10);width:100%;resize:none;border-radius:1.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);--tw-outline-style: none;outline-style:none;transition:border-color .2s}ax-conversation-composer .composer-input:focus{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .composer-attachments{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-bottom:calc(var(--spacing, .25rem) * 4)}ax-conversation-composer .attachment-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-conversation-composer .attachment-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-composer .attachment-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-conversation-composer .attachment-remove{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:background .2s}@media(hover:hover){ax-conversation-composer .attachment-remove:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}}ax-conversation-composer .composer-component-fullwidth{min-height:72px;width:100%;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-composer .composer-emoji-popover{width:100%}ax-conversation-composer .ax-conversation-composer-primary--stopping .fa-spinner{animation:ax-conversation-composer-spin .75s linear infinite}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial;--tw-outline-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
7074
|
+
], template: "@if (activeConversation()) {\n <div class=\"composer\">\n <!-- Edit/Reply Banner -->\n @if (editingMessage() || replyingToMessage()) {\n <div\n class=\"ax-conversation-composer-banner\"\n [class.ax-conversation-composer-banner--edit]=\"!!editingMessage()\"\n [class.ax-conversation-composer-banner--reply]=\"!!replyingToMessage()\"\n >\n <div class=\"ax-conversation-composer-banner__accent\" aria-hidden=\"true\"></div>\n @if (editingMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-pen-to-square\"></i\n ></span>\n <div class=\"ax-conversation-composer-banner__body\">\n <span class=\"ax-conversation-composer-banner__label\">{{\n '@acorex:chat.composer.editing-message' | translate | async\n }}</span>\n @if (getEditingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n } @else if (replyingToMessage()) {\n <div class=\"ax-conversation-composer-banner__content\">\n <span class=\"ax-conversation-composer-banner__icon\" aria-hidden=\"true\"\n ><i class=\"fa-light fa-reply\"></i\n ></span>\n <div\n class=\"ax-conversation-composer-banner__body ax-conversation-composer-banner__body--clickable\"\n (click)=\"onReplyPreviewClick()\"\n >\n <span class=\"ax-conversation-composer-banner__label\">\n {{ '@acorex:chat.composer.replying-to' | translate | async }} {{ getReplyingSenderName() }}\n </span>\n @if (getReplyingPreview(); as preview) {\n <span class=\"ax-conversation-composer-banner__preview\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i>\n }\n {{ getComposerPreviewLabel(preview) }}\n </span>\n }\n </div>\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-composer-banner__close\"\n (click)=\"cancelEditReply()\"\n [attr.aria-label]=\"'@acorex:chat.actions.cancel' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n\n <!-- Input Area -->\n <div class=\"composer-input-container\">\n <!-- Start actions -->\n <div class=\"composer-actions-left\">\n @if (startMenuActions().length > 0) {\n <ax-button\n class=\"rounded-full text-xl\"\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"('@acorex:chat.tooltips.attach-file' | translate | async) ?? ''\"\n (onClick)=\"onAttachMenuClick($event)\"\n >\n <ax-prefix>\n <i class=\"fa-light fa-paperclip\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n @for (action of startInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n </div>\n\n <!-- Text Input -->\n <div class=\"composer-input-wrapper\">\n <ax-text-area\n #inputElement\n [(ngModel)]=\"draftText\"\n (onKeyDown)=\"onKeyDown($event)\"\n (onValueChanged)=\"onDraftChanged()\"\n [placeholder]=\"placeholder()\"\n [rows]=\"inputRows()\"\n ></ax-text-area>\n </div>\n\n <!-- End actions -->\n <div class=\"composer-actions-right\">\n @for (action of endInlineActions(); track action.id) {\n <ax-button\n look=\"blank\"\n [iconOnly]=\"true\"\n [text]=\"getActionLabel(action)\"\n [disabled]=\"!isActionEnabled(action)\"\n [class]=\"getActionButtonClass(action)\"\n (onClick)=\"onActionClick(action.id, $event)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button>\n }\n\n <ax-button\n class=\"rounded-full text-xl\"\n [class.ax-conversation-composer-primary--stopping]=\"primaryButtonMode() === 'stopping'\"\n color=\"primary\"\n look=\"solid\"\n [iconOnly]=\"true\"\n [text]=\"getPrimaryButtonLabel()\"\n [disabled]=\"isPrimaryButtonDisabled()\"\n (onClick)=\"onPrimaryButtonClick()\"\n >\n <ax-prefix>\n <i [class]=\"getPrimaryButtonIcon()\"></i>\n </ax-prefix>\n </ax-button>\n </div>\n </div>\n\n <!-- Attachments Preview -->\n @if (attachments().length > 0) {\n <div class=\"composer-attachments\">\n @for (attachment of attachments(); track $index) {\n <div class=\"attachment-item\">\n <span class=\"attachment-icon\"><i class=\"fa-light fa-paperclip\"></i></span>\n <span class=\"attachment-name\">{{ attachment.name }}</span>\n <button\n type=\"button\"\n class=\"attachment-remove\"\n (click)=\"removeAttachment($index)\"\n [attr.aria-label]=\"'@acorex:chat.actions.remove-attachment' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n }\n </div>\n}\n\n<!-- Popover for attachment menu -->\n@if (attachPopoverTarget()) {\n <ax-popover\n #attachPopover\n [target]=\"attachPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n (onClosed)=\"onAttachPopoverClosed()\"\n >\n <ax-button-item-list>\n @for (action of startMenuActions(); track action.id) {\n <ax-button-item\n [text]=\"getActionLabel(action)\"\n (click)=\"onAttachMenuAction(action.id)\"\n [disabled]=\"!isActionEnabled(action)\"\n >\n <ax-prefix>\n <i [class]=\"action.icon\"></i>\n </ax-prefix>\n </ax-button-item>\n }\n </ax-button-item-list>\n </ax-popover>\n}\n\n<!-- Popover for emoji/sticker picker -->\n@if (emojiPopoverTarget()) {\n <ax-popover\n #emojiPopover\n [target]=\"emojiPopoverTarget()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"'top-start'\"\n panelClass=\"composer-emoji-popover-panel\"\n (onClosed)=\"onEmojiPopoverClosed()\"\n >\n <div class=\"composer-emoji-popover\">\n <ax-conversation-registry-component-outlet\n [componentLoader]=\"composerPopupLoader\"\n [inputs]=\"getEmojiPopupInputs()\"\n />\n </div>\n </ax-popover>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-composer{display:block;width:100%;@keyframes ax-conversation-composer-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}ax-conversation-composer .ax-conversation-composer-banner{display:flex;min-height:2.75rem;align-items:stretch;gap:calc(var(--spacing, .25rem) * 0);border-block-style:var(--tw-border-style);border-block-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-composer .ax-conversation-composer-banner__accent{width:3px;flex-shrink:0;border-start-end-radius:var(--radius-sm, .25rem);border-end-end-radius:var(--radius-sm, .25rem);background-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__accent{background-color:rgba(var(--ax-sys-color-secondary-500))}ax-conversation-composer .ax-conversation-composer-banner__content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2)}ax-conversation-composer .ax-conversation-composer-banner__icon{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);flex-shrink:0;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600));background:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__icon{color:rgba(var(--ax-sys-color-secondary-600));background:rgba(var(--ax-sys-color-secondary-500),.1)}ax-conversation-composer .ax-conversation-composer-banner__body{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}ax-conversation-composer .ax-conversation-composer-banner__body--clickable{cursor:pointer;border-radius:var(--ax-sys-border-radius);transition:opacity .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__body--clickable:hover{opacity:.85}}ax-conversation-composer .ax-conversation-composer-banner__label{font-size:.6875rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-primary-600));text-transform:uppercase}ax-conversation-composer .ax-conversation-composer-banner--reply .ax-conversation-composer-banner__label{color:rgba(var(--ax-sys-color-secondary-600))}ax-conversation-composer .ax-conversation-composer-banner__preview{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);overflow:hidden;font-size:.8125rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:.88}ax-conversation-composer .ax-conversation-composer-banner__preview i{flex-shrink:0;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));opacity:70%}ax-conversation-composer .ax-conversation-composer-banner__close{margin-inline-end:calc(var(--spacing, .25rem) * 1.5);display:flex;height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;align-self:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-primary-lightest-surface),.55);transition:background-color .15s ease,color .15s ease}@media(hover:hover){ax-conversation-composer .ax-conversation-composer-banner__close:hover{color:rgba(var(--ax-sys-color-on-surface));background:rgba(var(--ax-sys-color-on-surface),.06)}}ax-conversation-composer .ax-conversation-composer-banner__close:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .emoji-icon{flex-shrink:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)))}ax-conversation-composer .composer-input-container{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-composer .composer-actions-left,ax-conversation-composer .composer-actions-right{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-composer .composer-input-wrapper{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-composer .composer-input-wrapper .ax-editor-container{padding:calc(var(--spacing, .25rem) * 0)}ax-conversation-composer .composer-input{max-height:120px;min-height:calc(var(--spacing, .25rem) * 10);width:100%;resize:none;border-radius:1.25rem;border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);--tw-outline-style: none;outline-style:none;transition:border-color .2s}ax-conversation-composer .composer-input:focus{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-composer .composer-attachments{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-bottom:calc(var(--spacing, .25rem) * 4)}ax-conversation-composer .attachment-item{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-light-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-conversation-composer .attachment-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-composer .attachment-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-conversation-composer .attachment-remove{display:flex;height:calc(var(--spacing, .25rem) * 5);width:calc(var(--spacing, .25rem) * 5);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:background .2s}@media(hover:hover){ax-conversation-composer .attachment-remove:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}}ax-conversation-composer .composer-component-fullwidth{min-height:72px;width:100%;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-composer .composer-emoji-popover{width:100%}ax-conversation-composer .ax-conversation-composer-primary--stopping .fa-spinner{animation:ax-conversation-composer-spin .75s linear infinite}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-tracking: initial;--tw-leading: initial;--tw-outline-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
7092
7075
|
}], ctorParameters: () => [], propDecorators: { textAreaRef: [{ type: i0.ViewChild, args: ['inputElement', { ...{ read: AXTextAreaComponent }, isSignal: true }] }], messageSent: [{ type: i0.Output, args: ["messageSent"] }], generationCancelled: [{ type: i0.Output, args: ["generationCancelled"] }], emojiClick: [{ type: i0.Output, args: ["emojiClick"] }], attachClick: [{ type: i0.Output, args: ["attachClick"] }], voiceClick: [{ type: i0.Output, args: ["voiceClick"] }], emojiPopoverRef: [{ type: i0.ViewChild, args: ['emojiPopover', { isSignal: true }] }], attachPopoverRef: [{ type: i0.ViewChild, args: ['attachPopover', { isSignal: true }] }] } });
|
|
7093
7076
|
|
|
7094
7077
|
/**
|
|
@@ -7159,14 +7142,14 @@ class AXConversationContainerComponent {
|
|
|
7159
7142
|
});
|
|
7160
7143
|
}
|
|
7161
7144
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7162
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationContainerComponent, isStandalone: true, selector: "ax-conversation-container", inputs: { customClass: { classPropertyName: "customClass", publicName: "customClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:paste": "onDocumentPaste($event)" }, properties: { "class.conversation-container-host": "true", "tabindex": "\"-1\"" } }, ngImport: i0, template: " <div\n [class]=\"containerClasses()\"\n role=\"main\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-interface' | translate | async\"\n >\n <!-- Sidebar -->\n <div\n class=\"conversation-sidebar-container\"\n [axResizable]=\"true\"\n [minWidth]=\"config.minSidebarWidth
|
|
7145
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationContainerComponent, isStandalone: true, selector: "ax-conversation-container", inputs: { customClass: { classPropertyName: "customClass", publicName: "customClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:paste": "onDocumentPaste($event)" }, properties: { "class.conversation-container-host": "true", "tabindex": "\"-1\"" } }, ngImport: i0, template: " <div\n [class]=\"containerClasses()\"\n role=\"main\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-interface' | translate | async\"\n >\n <!-- Sidebar -->\n <div\n class=\"conversation-sidebar-container\"\n [axResizable]=\"true\"\n [minWidth]=\"config.minSidebarWidth\"\n [maxWidth]=\"config.maxSidebarWidth\"\n [width]=\"config.defaultSidebarWidth\"\n role=\"navigation\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-list' | translate | async\"\n >\n <ng-content select=\"ax-conversation-sidebar, [ax-conversation-sidebar]\"></ng-content>\n </div>\n\n <!-- Main conversation view -->\n <div\n class=\"conversation-main-container\"\n role=\"region\"\n [attr.aria-label]=\"\n activeConversation()\n ? ('@acorex:chat.aria.active-conversation' | translate | async)\n : ('@acorex:chat.status.no-conversation-selected' | translate | async)\n \"\n >\n @if (activeConversation(); as conversation) {\n <div class=\"conversation-view\">\n <!-- Info Bar -->\n <ng-content select=\"ax-conversation-info-bar, [ax-conversation-info-bar]\"></ng-content>\n\n <!-- Messages -->\n <div class=\"conversation-messages\">\n <ng-content select=\"ax-conversation-message-list, [ax-conversation-message-list]\"></ng-content>\n </div>\n\n <!-- Composer -->\n <ng-content select=\"ax-conversation-composer, [ax-conversation-composer]\"></ng-content>\n </div>\n } @else {\n <div class=\"conversation-empty-state\">\n <div class=\"empty-state-content\">\n <ng-content select=\"ax-conversation-empty\">\n <svg class=\"empty-state-icon\" width=\"120\" height=\"120\" viewBox=\"0 0 120 120\" fill=\"none\">\n <circle class=\"text-light\" cx=\"60\" cy=\"60\" r=\"50\" fill=\"currentColor\" />\n <path\n class=\"text-on-surface/55\"\n d=\"M40 50h40M40 70h30\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n />\n </svg>\n <h3 class=\"empty-state-title\">\n {{ '@acorex:chat.empty.no-conversation-selected-title' | translate | async }}\n </h3>\n <p class=\"empty-state-description\">\n {{ '@acorex:chat.empty.select-conversation-description' | translate | async }}\n </p>\n </ng-content>\n </div>\n </div>\n }\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-container{display:block;height:100%;width:100%;--tw-outline-style: none;outline-style:none}ax-conversation-container .conversation-container{display:flex;height:100%;width:100%;overflow:hidden;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-container .conversation-container-loading{display:flex;align-items:center;justify-content:center}ax-conversation-container .conversation-sidebar-container{display:none;height:100%;width:calc(var(--spacing, .25rem) * 0);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-conversation-container .conversation-sidebar-container:has(*){display:block;width:var(--ax-conversation-sidebar-width, 320px)}ax-conversation-container .conversation-main-container{display:flex;height:100%;flex:1;flex-direction:column;overflow:hidden;container-type:inline-size;container-name:conversation}ax-conversation-container .conversation-view{display:flex;height:100%;width:100%;flex-direction:column}ax-conversation-container .conversation-messages{flex:1;overflow:hidden}ax-conversation-container .conversation-empty-state{display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-container .empty-state-content{max-width:var(--container-md, 28rem);padding:calc(var(--spacing, .25rem) * 8);text-align:center}ax-conversation-container .empty-state-icon{margin-inline:auto;margin-bottom:calc(var(--spacing, .25rem) * 6);opacity:80%}ax-conversation-container .empty-state-title{margin:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-container .empty-state-description{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));opacity:70%}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: AXResizableDirective, selector: "[axResizable]", inputs: ["axResizable", "minWidth", "maxWidth", "dblClickAction", "width", "defaultWidth"], outputs: ["axResizableChange", "minWidthChange", "maxWidthChange", "dblClickActionChange", "widthChange", "defaultWidthChange", "onResizingStarted", "onResizingEnded", "onResizingDblClick"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
7163
7146
|
}
|
|
7164
7147
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationContainerComponent, decorators: [{
|
|
7165
7148
|
type: Component,
|
|
7166
7149
|
args: [{ selector: 'ax-conversation-container', encapsulation: ViewEncapsulation.None, imports: [CommonModule, AXResizableDirective, AXTranslationModule], host: {
|
|
7167
7150
|
'[class.conversation-container-host]': 'true',
|
|
7168
7151
|
'[tabindex]': '"-1"',
|
|
7169
|
-
}, template: " <div\n [class]=\"containerClasses()\"\n role=\"main\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-interface' | translate | async\"\n >\n <!-- Sidebar -->\n <div\n class=\"conversation-sidebar-container\"\n [axResizable]=\"true\"\n [minWidth]=\"config.minSidebarWidth
|
|
7152
|
+
}, template: " <div\n [class]=\"containerClasses()\"\n role=\"main\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-interface' | translate | async\"\n >\n <!-- Sidebar -->\n <div\n class=\"conversation-sidebar-container\"\n [axResizable]=\"true\"\n [minWidth]=\"config.minSidebarWidth\"\n [maxWidth]=\"config.maxSidebarWidth\"\n [width]=\"config.defaultSidebarWidth\"\n role=\"navigation\"\n [attr.aria-label]=\"'@acorex:chat.aria.conversation-list' | translate | async\"\n >\n <ng-content select=\"ax-conversation-sidebar, [ax-conversation-sidebar]\"></ng-content>\n </div>\n\n <!-- Main conversation view -->\n <div\n class=\"conversation-main-container\"\n role=\"region\"\n [attr.aria-label]=\"\n activeConversation()\n ? ('@acorex:chat.aria.active-conversation' | translate | async)\n : ('@acorex:chat.status.no-conversation-selected' | translate | async)\n \"\n >\n @if (activeConversation(); as conversation) {\n <div class=\"conversation-view\">\n <!-- Info Bar -->\n <ng-content select=\"ax-conversation-info-bar, [ax-conversation-info-bar]\"></ng-content>\n\n <!-- Messages -->\n <div class=\"conversation-messages\">\n <ng-content select=\"ax-conversation-message-list, [ax-conversation-message-list]\"></ng-content>\n </div>\n\n <!-- Composer -->\n <ng-content select=\"ax-conversation-composer, [ax-conversation-composer]\"></ng-content>\n </div>\n } @else {\n <div class=\"conversation-empty-state\">\n <div class=\"empty-state-content\">\n <ng-content select=\"ax-conversation-empty\">\n <svg class=\"empty-state-icon\" width=\"120\" height=\"120\" viewBox=\"0 0 120 120\" fill=\"none\">\n <circle class=\"text-light\" cx=\"60\" cy=\"60\" r=\"50\" fill=\"currentColor\" />\n <path\n class=\"text-on-surface/55\"\n d=\"M40 50h40M40 70h30\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n />\n </svg>\n <h3 class=\"empty-state-title\">\n {{ '@acorex:chat.empty.no-conversation-selected-title' | translate | async }}\n </h3>\n <p class=\"empty-state-description\">\n {{ '@acorex:chat.empty.select-conversation-description' | translate | async }}\n </p>\n </ng-content>\n </div>\n </div>\n }\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-container{display:block;height:100%;width:100%;--tw-outline-style: none;outline-style:none}ax-conversation-container .conversation-container{display:flex;height:100%;width:100%;overflow:hidden;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-container .conversation-container-loading{display:flex;align-items:center;justify-content:center}ax-conversation-container .conversation-sidebar-container{display:none;height:100%;width:calc(var(--spacing, .25rem) * 0);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-conversation-container .conversation-sidebar-container:has(*){display:block;width:var(--ax-conversation-sidebar-width, 320px)}ax-conversation-container .conversation-main-container{display:flex;height:100%;flex:1;flex-direction:column;overflow:hidden;container-type:inline-size;container-name:conversation}ax-conversation-container .conversation-view{display:flex;height:100%;width:100%;flex-direction:column}ax-conversation-container .conversation-messages{flex:1;overflow:hidden}ax-conversation-container .conversation-empty-state{display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(var(--ax-sys-color-lightest-surface))}ax-conversation-container .empty-state-content{max-width:var(--container-md, 28rem);padding:calc(var(--spacing, .25rem) * 8);text-align:center}ax-conversation-container .empty-state-icon{margin-inline:auto;margin-bottom:calc(var(--spacing, .25rem) * 6);opacity:80%}ax-conversation-container .empty-state-title{margin:calc(var(--spacing, .25rem) * 0);margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-2xl, 1.5rem);line-height:var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-container .empty-state-description{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));opacity:70%}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
7170
7153
|
}], ctorParameters: () => [], propDecorators: { customClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "customClass", required: false }] }], onDocumentPaste: [{
|
|
7171
7154
|
type: HostListener,
|
|
7172
7155
|
args: ['document:paste', ['$event']]
|
|
@@ -8980,22 +8963,8 @@ class AXConversationMessageListComponent {
|
|
|
8980
8963
|
this.messageAction.emit({ message, action: action.id });
|
|
8981
8964
|
}
|
|
8982
8965
|
}
|
|
8983
|
-
/**
|
|
8984
|
-
* TrackBy function for message groups.
|
|
8985
|
-
* Track by date only — new messages in the same day are handled by the inner message @for.
|
|
8986
|
-
*/
|
|
8987
|
-
trackMessageGroup(index, group) {
|
|
8988
|
-
return group.date;
|
|
8989
|
-
}
|
|
8990
|
-
/**
|
|
8991
|
-
* TrackBy function for messages
|
|
8992
|
-
* Tracks by ID only to prevent unnecessary re-renders
|
|
8993
|
-
*/
|
|
8994
|
-
trackMessage(index, message) {
|
|
8995
|
-
return message.id;
|
|
8996
|
-
}
|
|
8997
8966
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationMessageListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8998
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationMessageListComponent, isStandalone: true, selector: "ax-conversation-message-list", outputs: { messageAction: "messageAction" }, viewQueries: [{ propertyName: "reactionPopover", first: true, predicate: ["reactionPopover"], descendants: true, isSignal: true }, { propertyName: "messageListRef", first: true, predicate: ["messageList"], descendants: true, isSignal: true }, { propertyName: "messagesContainerRef", first: true, predicate: ["messagesContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (activeConversation(); as conv) {\n @for (cid of [conv.id]; track cid) {\n <div\n class=\"message-list message-list--conversation-surface\"\n [class.message-list--drag]=\"messageListDragging()\"\n #messageList\n role=\"log\"\n [attr.aria-label]=\"'@acorex:chat.aria.message-list' | translate | async\"\n aria-live=\"polite\"\n [style.background]=\"messageListBackgroundStyle()\"\n [style.--ax-comp-message-list-surface-bg]=\"messageListBackgroundStyle()\"\n axUploaderZone\n [disableBrowse]=\"true\"\n (dragEnter)=\"onMessageListDragEnter()\"\n (dragLeave)=\"onMessageListDragLeave()\"\n (fileChange)=\"onMessageListFilesDropped($event)\"\n >\n @if (loading()) {\n <div\n class=\"list-loading\"\n role=\"status\"\n aria-busy=\"true\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-messages' | translate | async\"\n >\n <div class=\"messages-skeleton\" aria-hidden=\"true\">\n @for (item of loadingSkeletonItems; track item) {\n <div class=\"message-skeleton\" [class.message-skeleton--own]=\"$odd\">\n @if ($even && isGroupConversation()) {\n <ax-skeleton class=\"message-skeleton-avatar\" [animated]=\"true\"></ax-skeleton>\n }\n <ax-skeleton\n class=\"message-skeleton-bubble\"\n [class.message-skeleton-bubble--short]=\"$index % 3 === 1\"\n [class.message-skeleton-bubble--medium]=\"$index % 3 === 2\"\n [animated]=\"true\"\n ></ax-skeleton>\n </div>\n }\n </div>\n </div>\n } @else if (messages().length === 0) {\n <div class=\"list-empty\" role=\"status\" [attr.aria-label]=\"'@acorex:chat.status.no-messages' | translate | async\">\n <ng-content select=\"ax-conversation-message-list-empty, [ax-conversation-message-list-empty]\">\n <ng-container\n *ngComponentOutlet=\"resolvedEmptyStateComponent(); inputs: { conversation: activeConversation()! }\"\n ></ng-container>\n </ng-content>\n </div>\n } @else {\n <div\n class=\"messages-container\"\n (scroll)=\"onScroll($event)\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'top'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreMessages()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n #messagesContainer\n role=\"feed\"\n [attr.aria-label]=\"'@acorex:chat.aria.messages' | translate | async\"\n >\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--prepend\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-older-messages' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{\n '@acorex:chat.status.loading-older-messages' | translate | async\n }}</ax-label>\n </div>\n }\n @for (group of messageGroups(); track trackMessageGroup($index, group)) {\n <!-- Date Separator -->\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"getDateSeparatorAriaLabel(group.dateLabel)\">\n <span class=\"date-separator__label\">{{ group.dateLabel }}</span>\n </div>\n\n <!-- Messages in this date group -->\n @for (message of group.messages; track trackMessage($index, message)) {\n <div\n [class]=\"getMessageClasses(message)\"\n role=\"article\"\n [attr.aria-label]=\"getMessageAriaLabel(message)\"\n [id]=\"'message-' + message.id\"\n >\n <!-- Avatar (only for group conversations and received messages) -->\n @if (shouldShowAvatar(message)) {\n <div class=\"message-avatar\">\n <ax-conversation-avatar\n kind=\"user\"\n [userId]=\"message.senderId\"\n [conversation]=\"activeConversation()\"\n [message]=\"message\"\n [size]=\"32\"\n />\n </div>\n }\n\n <div class=\"message-content-row\" [class.message-content-row-own]=\"isOwnMessage(message)\">\n @if (messageSupportsReactions(message)) {\n <button\n type=\"button\"\n class=\"add-reaction-button add-reaction-outside\"\n [class.add-reaction-visible]=\"reactionPickerTarget() === message.id\"\n (click)=\"toggleReactionPicker(message, $event)\"\n [attr.aria-label]=\"'@acorex:chat.actions.add-reaction' | translate | async\"\n #reactionButton\n >\n <i class=\"fa-light fa-face-smile\"></i>\n </button>\n }\n\n <div\n class=\"message-bubble-container\"\n [id]=\"'message-bubble-' + message.id\"\n [attr.data-message-id]=\"message.id\"\n >\n <div\n [class]=\"getBubbleClasses(message)\"\n [class.message-bubble-sent]=\"message.senderId === currentUser()?.id\"\n [class.message-bubble-received]=\"message.senderId !== currentUser()?.id\"\n >\n <!-- Sender name (only for group conversations and received messages) -->\n @if (shouldShowSenderName(message)) {\n <div class=\"message-sender\">{{ getSenderName(message) }}:</div>\n }\n\n <!-- Reply Preview -->\n @if (message.replyTo) {\n <div\n class=\"reply-preview\"\n (click)=\"scrollToMessage(message.replyTo.id)\"\n role=\"button\"\n [attr.aria-label]=\"'Reply to ' + getSenderName(message.replyTo)\"\n (keydown.enter)=\"scrollToMessage(message.replyTo.id)\"\n (keydown.space)=\"scrollToMessage(message.replyTo.id)\"\n >\n <div class=\"reply-preview-content\">\n <div class=\"reply-preview-sender\">{{ getSenderName(message.replyTo) }}</div>\n <div class=\"reply-preview-text\">\n @if (getMessagePreviewText(message.replyTo); as preview) {\n <span class=\"last-message\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i\n >{{ '@acorex:chat.' + preview.type | translate | async }}\n } @else {\n {{ preview.value }}\n }\n </span>\n }\n </div>\n </div>\n </div>\n }\n\n <!-- Forwarded Indicator -->\n @if (message.forwarded) {\n <div class=\"forwarded-preview\">\n <i class=\"fa-solid fa-share\"></i>\n <span class=\"forwarded-text\">{{ getForwardedText(message) }}</span>\n </div>\n }\n\n <ax-conversation-registry-component-outlet\n [component]=\"getRendererComponent(message)\"\n [componentLoader]=\"getRendererComponentLoader(message)\"\n [inputs]=\"getRendererInputs(message)\"\n />\n\n @if (messageSupportsReactions(message) && message.reactions.length > 0) {\n <div class=\"message-reactions-container\">\n <div class=\"message-reactions-bubbles\">\n @for (reaction of getGroupedReactions(message); track reaction.emoji) {\n <button\n type=\"button\"\n class=\"reaction-bubble\"\n [class.reaction-bubble-active]=\"reaction.hasReacted\"\n (click)=\"onReactionClick(message, reaction.emoji)\"\n [attr.aria-label]=\"reaction.emoji + ' ' + reaction.count\"\n >\n <span class=\"reaction-emoji\">{{ reaction.emoji }}</span>\n @if (reaction.count > 1) {\n <span class=\"reaction-count\">{{ reaction.count }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n\n <!-- Message Footer -->\n <div class=\"message-footer\">\n @let replyCount = getReplyCount(message);\n @let forwardCount = getForwardCount(message);\n @if (replyCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"replyCount + ' replies'\">\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ replyCount }}</span>\n </span>\n }\n @if (forwardCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"forwardCount + ' forwards'\">\n <i class=\"fa-solid fa-share\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ forwardCount }}</span>\n </span>\n }\n @if (replyCount > 0 || forwardCount > 0) {\n <span class=\"message-footer-split\" aria-hidden=\"true\"></span>\n }\n <span class=\"message-time\">{{ message.timestamp | format: 'timeleft' | async }}</span>\n @if (message.editedAt) {\n <span class=\"edited-indicator\">\n <span>{{ '@acorex:chat.status.edited' | translate | async }}</span>\n </span>\n }\n @if (isOwnMessage(message)) {\n <span [class]=\"getStatusIconClasses(message)\">\n <ax-icon><i [class]=\"getStatusIcon(message)\"></i></ax-icon>\n </span>\n }\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Menu for Message Actions -->\n <ax-context-menu\n [target]=\"'#message-bubble-' + message.id\"\n [openOn]=\"'click'\"\n [closeOn]=\"'click'\"\n (onOpening)=\"handleMessageContextMenuOpening($event, message)\"\n (onClose)=\"contextMenuMessageId.set(null)\"\n (onItemClick)=\"handleMessageContextMenuItemClick($event, message)\"\n >\n </ax-context-menu>\n </div>\n }\n }\n </div>\n\n <!-- Scroll to Bottom Button -->\n @if (showScrollButton()) {\n <div\n class=\"scroll-to-bottom-wrapper\"\n animate.enter=\"scroll-to-bottom-enter\"\n animate.leave=\"scroll-to-bottom-leave\"\n >\n <ax-fab\n class=\"scroll-to-bottom\"\n (onClick)=\"scrollToBottom()\"\n [attr.aria-label]=\"'@acorex:chat.actions.scroll-to-bottom' | translate | async\"\n >\n <ax-icon><i class=\"fa-light fa-arrow-down\" aria-hidden=\"true\"></i></ax-icon>\n </ax-fab>\n </div>\n }\n }\n </div>\n }\n\n <!-- Reaction Picker Popover -->\n @if (reactionsEnabled() && reactionPickerTarget()) {\n <ax-popover\n #reactionPopover\n [target]=\"reactionPickerElement()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"reactionPickerPlacement()\"\n (onClose)=\"closeReactionPicker()\"\n >\n <div class=\"reaction-picker-popup\">\n <div class=\"reaction-picker-header\">\n <span class=\"picker-title\">{{ '@acorex:chat.actions.react' | translate | async }}</span>\n <button\n type=\"button\"\n class=\"picker-close\"\n (click)=\"closeReactionPicker()\"\n [attr.aria-label]=\"'@acorex:chat.actions.close' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n <div\n class=\"reaction-picker-emojis\"\n role=\"listbox\"\n [attr.aria-label]=\"'@acorex:chat.actions.choose-reaction' | translate | async\"\n >\n @for (emoji of availableReactions(); track emoji) {\n <button\n type=\"button\"\n class=\"reaction-picker-emoji\"\n [class.reaction-picker-emoji-active]=\"hasUserReactedById(reactionPickerTarget()!, emoji)\"\n (click)=\"onReactionClickById(reactionPickerTarget()!, emoji); closeReactionPicker()\"\n [attr.aria-label]=\"emoji\"\n >\n {{ emoji }}\n </button>\n }\n </div>\n </div>\n </ax-popover>\n }\n} @else {\n <div\n class=\"message-list message-list--no-active\"\n role=\"region\"\n [attr.aria-label]=\"'@acorex:chat.status.no-conversation-selected' | translate | async\"\n >\n <div class=\"list-no-active\">\n <ng-content select=\"ax-conversation-message-list-no-active, [ax-conversation-message-list-no-active]\">\n <ng-container *ngComponentOutlet=\"noActiveFallbackComponent\"></ng-container>\n </ng-content>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-message-list{position:relative;display:block;height:100%;container-type:inline-size;--ax-comp-message-bubble-tail-height: 1.5625rem;--ax-comp-message-bubble-tail-fill-width: 1.25rem;--ax-comp-message-bubble-tail-fill-offset: -.4375rem;--ax-comp-message-bubble-tail-cutout-width: 1.625rem;--ax-comp-message-bubble-tail-cutout-offset: -1.625rem;--ax-comp-message-bubble-tail-curve: 1rem 0rem;--ax-comp-message-bubble-tail-cutout-curve: .625rem;@keyframes axConversationSurfaceIn{0%{opacity:0}to{opacity:1}}@keyframes axConversationSurfaceInReduced{0%{opacity:.92}to{opacity:1}}@keyframes messagesSkeletonIn{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes messagesSkeletonInReduced{0%{opacity:.85}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterPrepend{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeavePrepend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.35rem)}}@keyframes axScrollToBottomEnter{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes axScrollToBottomLeave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}}ax-conversation-message-list .message-list{position:relative;display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden}ax-conversation-message-list .message-list.ax-drop-zone>.ax-uploader-overlay-state{display:none!important}ax-conversation-message-list .message-list--drag{outline-style:var(--tw-outline-style);outline-width:2px;outline-color:rgba(var(--ax-sys-color-primary-surface));--tw-outline-style: dashed;outline-style:dashed;outline-offset:-2px}ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceIn .36s cubic-bezier(.22,1,.36,1) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceInReduced .18s ease both}}ax-conversation-message-list .list-loading{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;justify-content:flex-end;overflow:hidden}ax-conversation-message-list .messages-skeleton{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 6);animation:messagesSkeletonIn .42s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .message-skeleton{display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-message-list .message-skeleton--own{flex-direction:row-reverse}ax-conversation-message-list .message-skeleton-avatar{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-message-list .message-skeleton-bubble{height:calc(var(--spacing, .25rem) * 10);border-radius:var(--radius-2xl, 1rem);width:min(62%,17.5rem)}ax-conversation-message-list .message-skeleton-bubble--short{height:calc(var(--spacing, .25rem) * 8);width:min(36%,9.5rem)}ax-conversation-message-list .message-skeleton-bubble--medium{height:calc(var(--spacing, .25rem) * 9);width:min(48%,13rem)}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .messages-skeleton{animation:messagesSkeletonInReduced .2s ease both}}ax-conversation-message-list .list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;animation:fadeInUp .5s ease-out}ax-conversation-message-list .message-list--no-active{height:100%}ax-conversation-message-list .list-no-active{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 48);flex-direction:column;align-items:center;justify-content:center}ax-conversation-message-list .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:5.5rem;--tw-leading: 1;line-height:1;opacity:35%;filter:grayscale(.2)}ax-conversation-message-list .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:1.625rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-tight, -.025em);letter-spacing:var(--tracking-tight, -.025em);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-message-list .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:420px;font-size:1.0625rem;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-on-surface));opacity:.65}ax-conversation-message-list .spinner{margin-bottom:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:3px;border-color:rgba(var(--ax-sys-color-border-light-surface));border-top-color:rgb(var(--ax-sys-color-primary-500));animation:spin .8s linear infinite}ax-conversation-message-list .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 2);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-message-list .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:.3rem}ax-conversation-message-list .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-message-list .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-message-list .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-message-list .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-message-list .load-more-enter{animation:axChatLoadMoreEnterPrepend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .load-more-leave{animation:axChatLoadMoreLeavePrepend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .load-more-dot{animation:none;opacity:.65}ax-conversation-message-list .load-more-enter,ax-conversation-message-list .load-more-leave{animation:none}}ax-conversation-message-list .messages-container{position:relative;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1;overflow-y:auto;overflow-x:visible}ax-conversation-message-list .date-separator{pointer-events:none;position:sticky;z-index:150;display:flex;align-items:center;justify-content:center;top:.5rem;padding:.375rem 1rem .625rem;margin-block:.125rem .375rem}ax-conversation-message-list .date-separator__label{pointer-events:auto;display:inline-flex;width:calc(var(--spacing, .25rem) * 32);max-width:min(100%,18rem);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;-webkit-user-select:none;user-select:none;color:rgba(var(--ax-sys-color-on-lightest-surface));background:rgba(var(--ax-sys-color-lightest-surface));border:1px solid rgba(var(--ax-sys-color-on-lightest-surface),.25)}ax-conversation-message-list .unread-separator{margin-block:calc(var(--spacing, .25rem) * 6);display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4)}ax-conversation-message-list .unread-separator-line{height:1px;flex:1;background-color:rgba(var(--ax-sys-color-primary-surface));opacity:30%}ax-conversation-message-list .unread-separator-text{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);white-space:nowrap;color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}ax-conversation-message-list .message-item{position:relative;display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);padding-inline:1.75rem;transition:background-color .3s ease}ax-conversation-message-list .message-item-context-active{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.09);box-shadow:inset 0 0 0 1px rgba(var(--ax-sys-color-primary-500),.22)}ax-conversation-message-list .message-own.message-item-context-active{background-color:rgba(var(--ax-sys-color-primary-500),.12)}ax-conversation-message-list .message-highlight{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-message-list .message-item.message-own{flex-direction:row-reverse}ax-conversation-message-list .message-avatar{z-index:5;flex-shrink:0}ax-conversation-message-list .message-avatar-icon{display:flex;height:100%;width:100%;align-items:center;justify-content:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: 1;line-height:1}ax-conversation-message-list .message-content-row{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:0 1 auto;flex-direction:row;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 1);max-width:min(95%,50rem)}@container (min-width: 768px){ax-conversation-message-list .message-content-row{max-width:min(70%,50rem)}}ax-conversation-message-list .message-content-row-own{justify-content:flex-end}ax-conversation-message-list .message-item:not(.message-own) .message-content-row{justify-content:flex-start}ax-conversation-message-list .message-bubble-container{position:relative;display:flex;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex:1 1 auto;flex-direction:column}ax-conversation-message-list .message-own .message-bubble-container{align-items:flex-end}ax-conversation-message-list .message-sender{margin-bottom:.1rem;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-bubble{position:relative;display:flex;max-width:100%;flex-direction:column;border-radius:var(--radius-2xl, 1rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);padding-bottom:.1rem;overflow-wrap:break-word;transition:background-color .3s ease}ax-conversation-message-list .message-bubble>*{position:relative;z-index:1}ax-conversation-message-list .reply-preview{margin-bottom:calc(var(--spacing, .25rem) * 2);cursor:pointer;border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .reply-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .reply-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .reply-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .reply-preview-line{width:3px;flex-shrink:0;border-radius:1.5px;background:currentColor;opacity:.5}ax-conversation-message-list .reply-preview-content{min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-message-list .reply-preview-sender{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .reply-preview-text{overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .reply-preview-sender{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .reply-preview-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .last-message{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .forwarded-preview{margin-bottom:.1rem;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .forwarded-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .forwarded-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .forwarded-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .forwarded-preview i{flex-shrink:0;font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .forwarded-text{min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .forwarded-preview i{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .forwarded-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .message-bubble-received:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-lightest-surface));background-color:var(--ax-comp-message-bubble-bg);border-bottom-left-radius:.25rem}ax-conversation-message-list .message-bubble-sent:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-primary-surface));background-color:var(--ax-comp-message-bubble-bg);color:rgb(var(--ax-sys-color-on-primary-surface));border-bottom-right-radius:.25rem}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{content:\"\";position:absolute;bottom:0;height:var(--ax-comp-message-bubble-tail-height);pointer-events:none;z-index:0}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):before{width:var(--ax-comp-message-bubble-tail-fill-width);background-color:var(--ax-comp-message-bubble-bg)}ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{width:var(--ax-comp-message-bubble-tail-cutout-width);background:var(--ax-comp-message-list-surface-bg, rgb(var(--ax-sys-color-primary-lightest-surface)))}ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system){border-bottom-left-radius:1rem;border-bottom-right-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system){border-bottom-right-radius:1rem;border-bottom-left-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:auto;right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:auto;right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:auto;left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:auto;left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble.message-system:before,ax-conversation-message-list .message-bubble.message-system:after{display:none}ax-conversation-message-list .message-own .message-bubble{color:rgb(var(--ax-sys-color-on-primary-surface))}ax-conversation-message-list .message-bubble.message-system{background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);max-width:100%}ax-conversation-message-list .message-item:has(.message-system){justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .message-item:has(.message-system) .message-content-row{max-width:100%;justify-content:center}ax-conversation-message-list .message-item:has(.message-system) .message-bubble-container{align-items:center}ax-conversation-message-list .message-content{font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);white-space:pre-wrap}ax-conversation-message-list ax-conversation-registry-component-outlet{display:block;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0)}ax-conversation-message-list .message-footer{margin-top:.1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 1);padding-inline-start:calc(var(--spacing, .25rem) * 1);font-size:.6875rem;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%;-webkit-user-select:none;user-select:none}ax-conversation-message-list .message-footer-count{display:inline-flex;align-items:center;gap:.2rem;font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .message-footer-count i{font-size:.625rem;opacity:90%}ax-conversation-message-list .message-footer-count-value{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-footer-split{margin-inline:.2rem;height:.65rem;width:1px;flex-shrink:0;align-self:center;background-color:rgba(var(--ax-sys-color-border-light-surface));opacity:90%}ax-conversation-message-list .message-time{font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .edited-indicator{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline-start:.35rem;font-size:.675rem;opacity:75%}ax-conversation-message-list .status-icon{display:inline-flex;align-items:center}ax-conversation-message-list .status-icon i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-conversation-message-list .status-read{color:rgba(var(--ax-sys-color-primary-200))}ax-conversation-message-list .status-failed{color:rgba(var(--ax-sys-color-danger-200))}ax-conversation-message-list .message-reactions-bubbles{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem}ax-conversation-message-list .reaction-bubble{margin:calc(var(--spacing, .25rem) * 0);display:inline-flex;min-height:1.375rem;cursor:pointer;align-items:center;justify-content:center;gap:.15rem;border-radius:var(--radius-xl, .75rem);padding-inline:.35rem;padding-block:.1rem;color:rgba(var(--ax-sys-color-on-surface));--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background:rgba(var(--ax-sys-color-on-surface),.06);border:1px solid rgba(var(--ax-sys-color-on-surface),.1);transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ax-conversation-message-list .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-surface),.1);border-color:rgba(var(--ax-sys-color-on-surface),.18)}ax-conversation-message-list .reaction-bubble-active{background:rgba(var(--ax-sys-color-primary-500),.12);border-color:rgba(var(--ax-sys-color-primary-500),.45)}ax-conversation-message-list .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-primary-500),.18);border-color:rgba(var(--ax-sys-color-primary-500),.55)}ax-conversation-message-list .reaction-emoji{display:inline-block;font-size:.8125rem;--tw-leading: 1;line-height:1}ax-conversation-message-list .reaction-count{font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-on-surface));--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);opacity:.65}ax-conversation-message-list .reaction-bubble-active .reaction-count{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600));opacity:95%}ax-conversation-message-list .message-own .reaction-bubble{color:rgba(var(--ax-sys-color-on-primary-surface));background:rgba(var(--ax-sys-color-on-primary-surface),.12);border-color:rgba(var(--ax-sys-color-on-primary-surface),.2)}ax-conversation-message-list .message-own .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.2);border-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .reaction-bubble-active{background:rgba(var(--ax-sys-color-on-primary-surface),.28);border-color:rgba(var(--ax-sys-color-on-primary-surface),.5)}ax-conversation-message-list .message-own .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.34);border-color:rgba(var(--ax-sys-color-on-primary-surface),.6)}ax-conversation-message-list .message-own .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:80%}ax-conversation-message-list .message-own .reaction-bubble-active .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:100%}ax-conversation-message-list .message-reactions-container{margin-top:calc(var(--spacing, .25rem) * 1);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.2rem}ax-conversation-message-list .message-own .message-reactions-container{justify-content:flex-end}ax-conversation-message-list .message-own .message-footer .edited-indicator{border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .message-footer .message-footer-split{background:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .add-reaction-button.add-reaction-outside{position:absolute;top:50%;margin:calc(var(--spacing, .25rem) * 0);box-sizing:border-box;display:none;height:1.8rem;width:1.8rem;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding:calc(var(--spacing, .25rem) * 0);inset-inline-end:-2.25rem;box-shadow:0 1px 2px #0000000f}ax-conversation-message-list .add-reaction-button{padding-inline-start:.05rem}ax-conversation-message-list .message-content-row-own .add-reaction-button.add-reaction-outside{inset-inline-start:-2.25rem;inset-inline-end:auto}ax-conversation-message-list .message-item:hover .add-reaction-button.add-reaction-outside,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{display:inline-flex}ax-conversation-message-list .add-reaction-button.add-reaction-outside:hover,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .add-reaction-button.add-reaction-outside i{font-size:.9rem;color:rgba(var(--ax-sys-color-on-surface));opacity:80%}ax-conversation-message-list .reaction-bubble:focus-visible,ax-conversation-message-list .add-reaction-button:focus-visible,ax-conversation-message-list .action-trigger:focus-visible,ax-conversation-message-list ax-fab.scroll-to-bottom ax-button:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .message-actions{z-index:10;padding-bottom:calc(var(--spacing, .25rem) * 6);opacity:0%;transition:opacity var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .message-item:hover .message-actions{opacity:100%}ax-conversation-message-list .action-trigger{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .action-trigger:hover{background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-message-list .shortcut{font-size:.6875rem;opacity:70%}ax-conversation-message-list .scroll-to-bottom-wrapper{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 4);bottom:calc(var(--spacing, .25rem) * 4);z-index:999}ax-conversation-message-list ax-fab.scroll-to-bottom ax-button{display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none}ax-conversation-message-list .scroll-to-bottom-enter{animation:axScrollToBottomEnter var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}ax-conversation-message-list .scroll-to-bottom-leave{animation:axScrollToBottomLeave var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .scroll-to-bottom-enter,ax-conversation-message-list .scroll-to-bottom-leave{animation:none}}.reaction-picker-popup{width:max-content;min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;border-radius:.65rem;background-color:rgba(var(--ax-sys-color-lightest-surface));max-width:min(260px,92vw)}.reaction-picker-header{display:flex;min-height:calc(var(--spacing, .25rem) * 0);align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-block:.45rem;padding-inline-start:.7rem;padding-inline-end:calc(var(--spacing, .25rem) * 2)}.picker-title{font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-on-surface));opacity:85%}.picker-close{display:flex;height:1.6rem;width:1.6rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.25rem;--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:.95rem;color:rgba(var(--ax-sys-color-on-surface),.55);transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}.picker-close:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}.picker-close:focus-visible,.reaction-picker-emoji:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}.reaction-picker-emojis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.2rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:.45rem;padding-bottom:calc(var(--spacing, .25rem) * 2)}.reaction-picker-emoji{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);cursor:pointer;border-radius:.45rem;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:1.15rem;--tw-leading: 1;line-height:1;transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.reaction-picker-emoji:hover{background-color:rgba(var(--ax-sys-color-lighter-surface))}.reaction-picker-emoji-active{background-color:rgba(var(--ax-sys-color-surface))}.reaction-picker-emoji-active:hover{background:rgba(var(--ax-sys-color-primary-500),.25)}}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{transform:translate3d(0,100%,0);opacity:0}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXFabComponent, selector: "ax-fab", inputs: ["label", "popupStyle", "popupPlacement", "size"], outputs: ["popupPlacementChange", "onClick", "onOpened", "onClosed"] }, { kind: "component", type: AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "closeOnRouteChange", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: AXConversationInfiniteScrollDirective, selector: "[axInfiniteScroll]", inputs: ["threshold", "edge", "scrollDisabled", "cooldownMs"], outputs: ["scrollThreshold"] }, { kind: "directive", type: AXUploaderZoneDirective, selector: "[axUploaderZone]", inputs: ["multiple", "accept", "fileType", "overlayTemplate", "disableBrowse", "disableDragDrop"], outputs: ["fileChange", "onChanged", "dragEnter", "dragLeave", "dragOver", "onFileUploadComplete", "onFilesUploadComplete"] }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }, { kind: "component", type: AXConversationRegistryComponentOutletComponent, selector: "ax-conversation-registry-component-outlet", inputs: ["component", "componentLoader", "inputs"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.AXFormatPipe, name: "format" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8967
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationMessageListComponent, isStandalone: true, selector: "ax-conversation-message-list", outputs: { messageAction: "messageAction" }, viewQueries: [{ propertyName: "reactionPopover", first: true, predicate: ["reactionPopover"], descendants: true, isSignal: true }, { propertyName: "messageListRef", first: true, predicate: ["messageList"], descendants: true, isSignal: true }, { propertyName: "messagesContainerRef", first: true, predicate: ["messagesContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (activeConversation(); as conv) {\n @if (conv.id) {\n <div\n class=\"message-list message-list--conversation-surface\"\n [class.message-list--drag]=\"messageListDragging()\"\n #messageList\n role=\"log\"\n [attr.aria-label]=\"'@acorex:chat.aria.message-list' | translate | async\"\n aria-live=\"polite\"\n [style.background]=\"messageListBackgroundStyle()\"\n [style.--ax-comp-message-list-surface-bg]=\"messageListBackgroundStyle()\"\n axUploaderZone\n [disableBrowse]=\"true\"\n (dragEnter)=\"onMessageListDragEnter()\"\n (dragLeave)=\"onMessageListDragLeave()\"\n (fileChange)=\"onMessageListFilesDropped($event)\"\n >\n @if (loading()) {\n <div\n class=\"list-loading\"\n role=\"status\"\n aria-busy=\"true\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-messages' | translate | async\"\n >\n <div class=\"messages-skeleton\" aria-hidden=\"true\">\n @for (item of loadingSkeletonItems; track item) {\n <div class=\"message-skeleton\" [class.message-skeleton--own]=\"$odd\">\n @if ($even && isGroupConversation()) {\n <ax-skeleton class=\"message-skeleton-avatar\" [animated]=\"true\"></ax-skeleton>\n }\n <ax-skeleton\n class=\"message-skeleton-bubble\"\n [class.message-skeleton-bubble--short]=\"$index % 3 === 1\"\n [class.message-skeleton-bubble--medium]=\"$index % 3 === 2\"\n [animated]=\"true\"\n ></ax-skeleton>\n </div>\n }\n </div>\n </div>\n } @else if (messages().length === 0) {\n <div class=\"list-empty\" role=\"status\" [attr.aria-label]=\"'@acorex:chat.status.no-messages' | translate | async\">\n <ng-content select=\"ax-conversation-message-list-empty, [ax-conversation-message-list-empty]\">\n <ng-container\n *ngComponentOutlet=\"resolvedEmptyStateComponent(); inputs: { conversation: activeConversation()! }\"\n ></ng-container>\n </ng-content>\n </div>\n } @else {\n <div\n class=\"messages-container\"\n (scroll)=\"onScroll($event)\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'top'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreMessages()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n #messagesContainer\n role=\"feed\"\n [attr.aria-label]=\"'@acorex:chat.aria.messages' | translate | async\"\n >\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--prepend\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-older-messages' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{\n '@acorex:chat.status.loading-older-messages' | translate | async\n }}</ax-label>\n </div>\n }\n @for (group of messageGroups(); track group.date) {\n <!-- Date Separator -->\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"getDateSeparatorAriaLabel(group.dateLabel)\">\n <span class=\"date-separator__label\">{{ group.dateLabel }}</span>\n </div>\n\n <!-- Messages in this date group -->\n @for (message of group.messages; track message.id) {\n <div\n [class]=\"getMessageClasses(message)\"\n role=\"article\"\n [attr.aria-label]=\"getMessageAriaLabel(message)\"\n [id]=\"'message-' + message.id\"\n >\n <!-- Avatar (only for group conversations and received messages) -->\n @if (shouldShowAvatar(message)) {\n <div class=\"message-avatar\">\n <ax-conversation-avatar\n kind=\"user\"\n [userId]=\"message.senderId\"\n [conversation]=\"activeConversation()\"\n [message]=\"message\"\n [size]=\"32\"\n />\n </div>\n }\n\n <div class=\"message-content-row\" [class.message-content-row-own]=\"isOwnMessage(message)\">\n @if (messageSupportsReactions(message)) {\n <button\n type=\"button\"\n class=\"add-reaction-button add-reaction-outside\"\n [class.add-reaction-visible]=\"reactionPickerTarget() === message.id\"\n (click)=\"toggleReactionPicker(message, $event)\"\n [attr.aria-label]=\"'@acorex:chat.actions.add-reaction' | translate | async\"\n #reactionButton\n >\n <i class=\"fa-light fa-face-smile\"></i>\n </button>\n }\n\n <div\n class=\"message-bubble-container\"\n [id]=\"'message-bubble-' + message.id\"\n [attr.data-message-id]=\"message.id\"\n >\n <div\n [class]=\"getBubbleClasses(message)\"\n [class.message-bubble-sent]=\"message.senderId === currentUser()?.id\"\n [class.message-bubble-received]=\"message.senderId !== currentUser()?.id\"\n >\n <!-- Sender name (only for group conversations and received messages) -->\n @if (shouldShowSenderName(message)) {\n <div class=\"message-sender\">{{ getSenderName(message) }}:</div>\n }\n\n <!-- Reply Preview -->\n @if (message.replyTo) {\n <div\n class=\"reply-preview\"\n (click)=\"scrollToMessage(message.replyTo.id)\"\n role=\"button\"\n [attr.aria-label]=\"'Reply to ' + getSenderName(message.replyTo)\"\n (keydown.enter)=\"scrollToMessage(message.replyTo.id)\"\n (keydown.space)=\"scrollToMessage(message.replyTo.id)\"\n >\n <div class=\"reply-preview-content\">\n <div class=\"reply-preview-sender\">{{ getSenderName(message.replyTo) }}</div>\n <div class=\"reply-preview-text\">\n @if (getMessagePreviewText(message.replyTo); as preview) {\n <span class=\"last-message\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i\n >{{ '@acorex:chat.' + preview.type | translate | async }}\n } @else {\n {{ preview.value }}\n }\n </span>\n }\n </div>\n </div>\n </div>\n }\n\n <!-- Forwarded Indicator -->\n @if (message.forwarded) {\n <div class=\"forwarded-preview\">\n <i class=\"fa-solid fa-share\"></i>\n <span class=\"forwarded-text\">{{ getForwardedText(message) }}</span>\n </div>\n }\n\n <ax-conversation-registry-component-outlet\n [component]=\"getRendererComponent(message)\"\n [componentLoader]=\"getRendererComponentLoader(message)\"\n [inputs]=\"getRendererInputs(message)\"\n />\n\n @if (messageSupportsReactions(message) && message.reactions.length > 0) {\n <div class=\"message-reactions-container\">\n <div class=\"message-reactions-bubbles\">\n @for (reaction of getGroupedReactions(message); track reaction.emoji) {\n <button\n type=\"button\"\n class=\"reaction-bubble\"\n [class.reaction-bubble-active]=\"reaction.hasReacted\"\n (click)=\"onReactionClick(message, reaction.emoji)\"\n [attr.aria-label]=\"reaction.emoji + ' ' + reaction.count\"\n >\n <span class=\"reaction-emoji\">{{ reaction.emoji }}</span>\n @if (reaction.count > 1) {\n <span class=\"reaction-count\">{{ reaction.count }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n\n <!-- Message Footer -->\n <div class=\"message-footer\">\n @let replyCount = getReplyCount(message);\n @let forwardCount = getForwardCount(message);\n @if (replyCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"replyCount + ' replies'\">\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ replyCount }}</span>\n </span>\n }\n @if (forwardCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"forwardCount + ' forwards'\">\n <i class=\"fa-solid fa-share\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ forwardCount }}</span>\n </span>\n }\n @if (replyCount > 0 || forwardCount > 0) {\n <span class=\"message-footer-split\" aria-hidden=\"true\"></span>\n }\n <span class=\"message-time\">{{ message.timestamp | format: 'timeleft' | async }}</span>\n @if (message.editedAt) {\n <span class=\"edited-indicator\">\n <span>{{ '@acorex:chat.status.edited' | translate | async }}</span>\n </span>\n }\n @if (isOwnMessage(message)) {\n <span [class]=\"getStatusIconClasses(message)\">\n <ax-icon><i [class]=\"getStatusIcon(message)\"></i></ax-icon>\n </span>\n }\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Menu for Message Actions -->\n <ax-context-menu\n [target]=\"'#message-bubble-' + message.id\"\n [openOn]=\"'click'\"\n [closeOn]=\"'click'\"\n (onOpening)=\"handleMessageContextMenuOpening($event, message)\"\n (onClose)=\"contextMenuMessageId.set(null)\"\n (onItemClick)=\"handleMessageContextMenuItemClick($event, message)\"\n >\n </ax-context-menu>\n </div>\n }\n }\n </div>\n\n <!-- Scroll to Bottom Button -->\n @if (showScrollButton()) {\n <div\n class=\"scroll-to-bottom-wrapper\"\n animate.enter=\"scroll-to-bottom-enter\"\n animate.leave=\"scroll-to-bottom-leave\"\n >\n <ax-fab\n class=\"scroll-to-bottom\"\n (onClick)=\"scrollToBottom()\"\n [attr.aria-label]=\"'@acorex:chat.actions.scroll-to-bottom' | translate | async\"\n >\n <ax-icon><i class=\"fa-light fa-arrow-down\" aria-hidden=\"true\"></i></ax-icon>\n </ax-fab>\n </div>\n }\n }\n </div>\n }\n\n <!-- Reaction Picker Popover -->\n @if (reactionsEnabled() && reactionPickerTarget()) {\n <ax-popover\n #reactionPopover\n [target]=\"reactionPickerElement()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"reactionPickerPlacement()\"\n (onClose)=\"closeReactionPicker()\"\n >\n <div class=\"reaction-picker-popup\">\n <div class=\"reaction-picker-header\">\n <span class=\"picker-title\">{{ '@acorex:chat.actions.react' | translate | async }}</span>\n <button\n type=\"button\"\n class=\"picker-close\"\n (click)=\"closeReactionPicker()\"\n [attr.aria-label]=\"'@acorex:chat.actions.close' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n <div\n class=\"reaction-picker-emojis\"\n role=\"listbox\"\n [attr.aria-label]=\"'@acorex:chat.actions.choose-reaction' | translate | async\"\n >\n @for (emoji of availableReactions(); track emoji) {\n <button\n type=\"button\"\n class=\"reaction-picker-emoji\"\n [class.reaction-picker-emoji-active]=\"hasUserReactedById(reactionPickerTarget()!, emoji)\"\n (click)=\"onReactionClickById(reactionPickerTarget()!, emoji); closeReactionPicker()\"\n [attr.aria-label]=\"emoji\"\n >\n {{ emoji }}\n </button>\n }\n </div>\n </div>\n </ax-popover>\n }\n} @else {\n <div\n class=\"message-list message-list--no-active\"\n role=\"region\"\n [attr.aria-label]=\"'@acorex:chat.status.no-conversation-selected' | translate | async\"\n >\n <div class=\"list-no-active\">\n <ng-content select=\"ax-conversation-message-list-no-active, [ax-conversation-message-list-no-active]\">\n <ng-container *ngComponentOutlet=\"noActiveFallbackComponent\"></ng-container>\n </ng-content>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-message-list{position:relative;display:block;height:100%;container-type:inline-size;--ax-comp-message-bubble-tail-height: 1.5625rem;--ax-comp-message-bubble-tail-fill-width: 1.25rem;--ax-comp-message-bubble-tail-fill-offset: -.4375rem;--ax-comp-message-bubble-tail-cutout-width: 1.625rem;--ax-comp-message-bubble-tail-cutout-offset: -1.625rem;--ax-comp-message-bubble-tail-curve: 1rem 0rem;--ax-comp-message-bubble-tail-cutout-curve: .625rem;@keyframes axConversationSurfaceIn{0%{opacity:0}to{opacity:1}}@keyframes axConversationSurfaceInReduced{0%{opacity:.92}to{opacity:1}}@keyframes messagesSkeletonIn{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes messagesSkeletonInReduced{0%{opacity:.85}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterPrepend{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeavePrepend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.35rem)}}@keyframes axScrollToBottomEnter{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes axScrollToBottomLeave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}}ax-conversation-message-list .message-list{position:relative;display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden}ax-conversation-message-list .message-list.ax-drop-zone>.ax-uploader-overlay-state{display:none!important}ax-conversation-message-list .message-list--drag{outline-style:var(--tw-outline-style);outline-width:2px;outline-color:rgba(var(--ax-sys-color-primary-surface));--tw-outline-style: dashed;outline-style:dashed;outline-offset:-2px}ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceIn .36s cubic-bezier(.22,1,.36,1) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceInReduced .18s ease both}}ax-conversation-message-list .list-loading{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;justify-content:flex-start;overflow-x:hidden;overflow-y:auto}ax-conversation-message-list .messages-skeleton{display:flex;width:100%;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 6);animation:messagesSkeletonIn .42s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .message-skeleton{display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-message-list .message-skeleton--own{flex-direction:row-reverse}ax-conversation-message-list .message-skeleton-avatar{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-avatar.ax-skeleton{background-color:rgba(var(--ax-sys-color-on-surface),.16)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-avatar.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-surface),.22) 50%,transparent)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-bubble.ax-skeleton{background-color:rgb(var(--ax-sys-color-lightest-surface));box-shadow:0 1px 2px rgba(var(--ax-sys-color-on-surface),.08)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-bubble.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-surface),.14) 50%,transparent)}ax-conversation-message-list .message-skeleton--own ax-skeleton.message-skeleton-bubble.ax-skeleton{background-color:rgb(var(--ax-sys-color-primary-surface));box-shadow:0 1px 2px rgba(var(--ax-sys-color-primary-900),.12)}ax-conversation-message-list .message-skeleton--own ax-skeleton.message-skeleton-bubble.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-primary-surface),.2) 50%,transparent)}ax-conversation-message-list .message-skeleton-bubble{height:calc(var(--spacing, .25rem) * 10);border-radius:var(--radius-2xl, 1rem);width:min(62%,17.5rem)}ax-conversation-message-list .message-skeleton-bubble--short{height:calc(var(--spacing, .25rem) * 8);width:min(36%,9.5rem)}ax-conversation-message-list .message-skeleton-bubble--medium{height:calc(var(--spacing, .25rem) * 9);width:min(48%,13rem)}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .messages-skeleton{animation:messagesSkeletonInReduced .2s ease both}}ax-conversation-message-list .list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;animation:fadeInUp .5s ease-out}ax-conversation-message-list .message-list--no-active{height:100%}ax-conversation-message-list .list-no-active{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 48);flex-direction:column;align-items:center;justify-content:center}ax-conversation-message-list .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:5.5rem;--tw-leading: 1;line-height:1;opacity:35%;filter:grayscale(.2)}ax-conversation-message-list .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:1.625rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-tight, -.025em);letter-spacing:var(--tracking-tight, -.025em);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-message-list .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:420px;font-size:1.0625rem;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-on-surface));opacity:.65}ax-conversation-message-list .spinner{margin-bottom:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:3px;border-color:rgba(var(--ax-sys-color-border-light-surface));border-top-color:rgb(var(--ax-sys-color-primary-500));animation:spin .8s linear infinite}ax-conversation-message-list .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 2);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-message-list .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:.3rem}ax-conversation-message-list .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-message-list .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-message-list .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-message-list .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-message-list .load-more-enter{animation:axChatLoadMoreEnterPrepend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .load-more-leave{animation:axChatLoadMoreLeavePrepend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .load-more-dot{animation:none;opacity:.65}ax-conversation-message-list .load-more-enter,ax-conversation-message-list .load-more-leave{animation:none}}ax-conversation-message-list .messages-container{position:relative;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1;overflow-x:hidden;overflow-y:auto}ax-conversation-message-list .date-separator{pointer-events:none;position:sticky;z-index:150;display:flex;align-items:center;justify-content:center;top:.5rem;padding:.375rem 1rem .625rem;margin-block:.125rem .375rem}ax-conversation-message-list .date-separator__label{pointer-events:auto;display:inline-flex;width:calc(var(--spacing, .25rem) * 32);max-width:min(100%,18rem);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;-webkit-user-select:none;user-select:none}ax-conversation-message-list .unread-separator{margin-block:calc(var(--spacing, .25rem) * 6);display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4)}ax-conversation-message-list .unread-separator-line{height:1px;flex:1;background-color:rgba(var(--ax-sys-color-primary-surface));opacity:30%}ax-conversation-message-list .unread-separator-text{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);white-space:nowrap;color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}ax-conversation-message-list .message-item{position:relative;display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);transition:background-color .3s ease}ax-conversation-message-list .message-item-context-active{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.09);box-shadow:inset 0 0 0 1px rgba(var(--ax-sys-color-primary-500),.22)}ax-conversation-message-list .message-own.message-item-context-active{background-color:rgba(var(--ax-sys-color-primary-500),.12)}ax-conversation-message-list .message-highlight{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-message-list .message-item.message-own{flex-direction:row-reverse}ax-conversation-message-list .message-avatar{z-index:5;flex-shrink:0}ax-conversation-message-list .message-avatar-icon{display:flex;height:100%;width:100%;align-items:center;justify-content:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: 1;line-height:1}ax-conversation-message-list .message-content-row{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:0 1 auto;flex-direction:row;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 1);max-width:min(95%,50rem)}ax-conversation-message-list .message-content-row:has(.add-reaction-button.add-reaction-outside) .message-bubble-container{margin-inline-end:.375rem}ax-conversation-message-list .message-content-row-own:has(.add-reaction-button.add-reaction-outside) .message-bubble-container{margin-inline-end:0;margin-inline-start:.375rem}@container (min-width: 768px){ax-conversation-message-list .message-content-row{max-width:min(70%,50rem)}}ax-conversation-message-list .message-content-row-own{justify-content:flex-end}ax-conversation-message-list .message-item:not(.message-own) .message-content-row{justify-content:flex-start}ax-conversation-message-list .message-bubble-container{position:relative;display:flex;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex:1 1 auto;flex-direction:column}ax-conversation-message-list .message-own .message-bubble-container{align-items:flex-end}ax-conversation-message-list .message-sender{margin-bottom:.1rem;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-bubble{position:relative;display:flex;max-width:100%;flex-direction:column;border-radius:var(--radius-2xl, 1rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);padding-bottom:.1rem;overflow-wrap:break-word;transition:background-color .3s ease}ax-conversation-message-list .message-bubble>*{position:relative;z-index:1}ax-conversation-message-list .reply-preview{margin-bottom:calc(var(--spacing, .25rem) * 2);cursor:pointer;border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .reply-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .reply-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .reply-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .reply-preview-line{width:3px;flex-shrink:0;border-radius:1.5px;background:currentColor;opacity:.5}ax-conversation-message-list .reply-preview-content{min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-message-list .reply-preview-sender{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .reply-preview-text{overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .reply-preview-sender{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .reply-preview-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .last-message{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .forwarded-preview{margin-bottom:.1rem;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .forwarded-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .forwarded-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .forwarded-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .forwarded-preview i{flex-shrink:0;font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .forwarded-text{min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .forwarded-preview i{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .forwarded-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .message-bubble-received:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-lightest-surface));background-color:var(--ax-comp-message-bubble-bg);border-bottom-left-radius:.25rem}ax-conversation-message-list .message-bubble-sent:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-primary-surface));background-color:var(--ax-comp-message-bubble-bg);color:rgb(var(--ax-sys-color-on-primary-surface));border-bottom-right-radius:.25rem}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{content:\"\";position:absolute;bottom:0;height:var(--ax-comp-message-bubble-tail-height);pointer-events:none;z-index:0}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):before{width:var(--ax-comp-message-bubble-tail-fill-width);background-color:var(--ax-comp-message-bubble-bg)}ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{width:var(--ax-comp-message-bubble-tail-cutout-width);background:var(--ax-comp-message-list-surface-bg, rgb(var(--ax-sys-color-primary-lightest-surface)))}ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system){border-bottom-left-radius:1rem;border-bottom-right-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system){border-bottom-right-radius:1rem;border-bottom-left-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:auto;right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:auto;right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:auto;left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:auto;left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble.message-system:before,ax-conversation-message-list .message-bubble.message-system:after{display:none}ax-conversation-message-list .message-own .message-bubble{color:rgb(var(--ax-sys-color-on-primary-surface))}ax-conversation-message-list .message-bubble.message-system{background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);max-width:100%}ax-conversation-message-list .message-item:has(.message-system){justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .message-item:has(.message-system) .message-content-row{max-width:100%;justify-content:center}ax-conversation-message-list .message-item:has(.message-system) .message-bubble-container{align-items:center}ax-conversation-message-list .message-content{font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);white-space:pre-wrap}ax-conversation-message-list ax-conversation-registry-component-outlet{display:block;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0)}ax-conversation-message-list .message-footer{margin-top:.1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 1);padding-inline-start:calc(var(--spacing, .25rem) * 1);font-size:.6875rem;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%;-webkit-user-select:none;user-select:none}ax-conversation-message-list .message-footer-count{display:inline-flex;align-items:center;gap:.2rem;font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .message-footer-count i{font-size:.625rem;opacity:90%}ax-conversation-message-list .message-footer-count-value{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-footer-split{margin-inline:.2rem;height:.65rem;width:1px;flex-shrink:0;align-self:center;background-color:rgba(var(--ax-sys-color-border-light-surface));opacity:90%}ax-conversation-message-list .message-time{font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .edited-indicator{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline-start:.35rem;font-size:.675rem;opacity:75%}ax-conversation-message-list .status-icon{display:inline-flex;align-items:center}ax-conversation-message-list .status-icon i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-conversation-message-list .status-read{color:rgba(var(--ax-sys-color-primary-200))}ax-conversation-message-list .status-failed{color:rgba(var(--ax-sys-color-danger-200))}ax-conversation-message-list .message-reactions-bubbles{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem}ax-conversation-message-list .reaction-bubble{margin:calc(var(--spacing, .25rem) * 0);display:inline-flex;min-height:1.375rem;cursor:pointer;align-items:center;justify-content:center;gap:.15rem;border-radius:var(--radius-xl, .75rem);padding-inline:.35rem;padding-block:.1rem;color:rgba(var(--ax-sys-color-on-surface));--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background:rgba(var(--ax-sys-color-on-surface),.06);border:1px solid rgba(var(--ax-sys-color-on-surface),.1);transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ax-conversation-message-list .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-surface),.1);border-color:rgba(var(--ax-sys-color-on-surface),.18)}ax-conversation-message-list .reaction-bubble-active{background:rgba(var(--ax-sys-color-primary-500),.12);border-color:rgba(var(--ax-sys-color-primary-500),.45)}ax-conversation-message-list .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-primary-500),.18);border-color:rgba(var(--ax-sys-color-primary-500),.55)}ax-conversation-message-list .reaction-emoji{display:inline-block;font-size:.8125rem;--tw-leading: 1;line-height:1}ax-conversation-message-list .reaction-count{font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-on-surface));--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);opacity:.65}ax-conversation-message-list .reaction-bubble-active .reaction-count{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600));opacity:95%}ax-conversation-message-list .message-own .reaction-bubble{color:rgba(var(--ax-sys-color-on-primary-surface));background:rgba(var(--ax-sys-color-on-primary-surface),.12);border-color:rgba(var(--ax-sys-color-on-primary-surface),.2)}ax-conversation-message-list .message-own .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.2);border-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .reaction-bubble-active{background:rgba(var(--ax-sys-color-on-primary-surface),.28);border-color:rgba(var(--ax-sys-color-on-primary-surface),.5)}ax-conversation-message-list .message-own .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.34);border-color:rgba(var(--ax-sys-color-on-primary-surface),.6)}ax-conversation-message-list .message-own .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:80%}ax-conversation-message-list .message-own .reaction-bubble-active .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:100%}ax-conversation-message-list .message-reactions-container{margin-top:calc(var(--spacing, .25rem) * 1);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.2rem}ax-conversation-message-list .message-own .message-reactions-container{justify-content:flex-end}ax-conversation-message-list .message-own .message-footer .edited-indicator{border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .message-footer .message-footer-split{background:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .add-reaction-button.add-reaction-outside{position:absolute;top:50%;margin:calc(var(--spacing, .25rem) * 0);box-sizing:border-box;display:none;height:1.8rem;width:1.8rem;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding:calc(var(--spacing, .25rem) * 0);inset-inline-end:-2.35rem;box-shadow:0 1px 2px #0000000f}ax-conversation-message-list .add-reaction-button{padding-inline-start:.05rem}ax-conversation-message-list .message-content-row-own .add-reaction-button.add-reaction-outside{inset-inline-start:-2.35rem;inset-inline-end:auto}ax-conversation-message-list .message-item:hover .add-reaction-button.add-reaction-outside,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{display:inline-flex}ax-conversation-message-list .add-reaction-button.add-reaction-outside:hover,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .add-reaction-button.add-reaction-outside i{font-size:.9rem;color:rgba(var(--ax-sys-color-on-surface));opacity:80%}ax-conversation-message-list .reaction-bubble:focus-visible,ax-conversation-message-list .add-reaction-button:focus-visible,ax-conversation-message-list .action-trigger:focus-visible,ax-conversation-message-list ax-fab.scroll-to-bottom ax-button:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .message-actions{z-index:10;padding-bottom:calc(var(--spacing, .25rem) * 6);opacity:0%;transition:opacity var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .message-item:hover .message-actions{opacity:100%}ax-conversation-message-list .action-trigger{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .action-trigger:hover{background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-message-list .shortcut{font-size:.6875rem;opacity:70%}ax-conversation-message-list .scroll-to-bottom-wrapper{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 4);bottom:calc(var(--spacing, .25rem) * 4);z-index:999}ax-conversation-message-list ax-fab.scroll-to-bottom ax-button{display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none}ax-conversation-message-list .scroll-to-bottom-enter{animation:axScrollToBottomEnter var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}ax-conversation-message-list .scroll-to-bottom-leave{animation:axScrollToBottomLeave var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .scroll-to-bottom-enter,ax-conversation-message-list .scroll-to-bottom-leave{animation:none}}.reaction-picker-popup{width:max-content;min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;border-radius:.65rem;background-color:rgba(var(--ax-sys-color-lightest-surface));max-width:min(260px,92vw)}.reaction-picker-header{display:flex;min-height:calc(var(--spacing, .25rem) * 0);align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-block:.45rem;padding-inline-start:.7rem;padding-inline-end:calc(var(--spacing, .25rem) * 2)}.picker-title{font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-on-surface));opacity:85%}.picker-close{display:flex;height:1.6rem;width:1.6rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.25rem;--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:.95rem;color:rgba(var(--ax-sys-color-on-surface),.55);transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}.picker-close:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}.picker-close:focus-visible,.reaction-picker-emoji:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}.reaction-picker-emojis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.2rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:.45rem;padding-bottom:calc(var(--spacing, .25rem) * 2)}.reaction-picker-emoji{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);cursor:pointer;border-radius:.45rem;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:1.15rem;--tw-leading: 1;line-height:1;transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.reaction-picker-emoji:hover{background-color:rgba(var(--ax-sys-color-lighter-surface))}.reaction-picker-emoji-active{background-color:rgba(var(--ax-sys-color-surface))}.reaction-picker-emoji-active:hover{background:rgba(var(--ax-sys-color-primary-500),.25)}}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{transform:translate3d(0,100%,0);opacity:0}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXFabComponent, selector: "ax-fab", inputs: ["label", "popupStyle", "popupPlacement", "size"], outputs: ["popupPlacementChange", "onClick", "onOpened", "onClosed"] }, { kind: "component", type: AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "closeOnRouteChange", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXFormatModule }, { kind: "ngmodule", type: AXDateTimeModule }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: AXConversationInfiniteScrollDirective, selector: "[axInfiniteScroll]", inputs: ["threshold", "edge", "scrollDisabled", "cooldownMs"], outputs: ["scrollThreshold"] }, { kind: "directive", type: AXUploaderZoneDirective, selector: "[axUploaderZone]", inputs: ["multiple", "accept", "fileType", "overlayTemplate", "disableBrowse", "disableDragDrop"], outputs: ["fileChange", "onChanged", "dragEnter", "dragLeave", "dragOver", "onFileUploadComplete", "onFilesUploadComplete"] }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }, { kind: "component", type: AXConversationRegistryComponentOutletComponent, selector: "ax-conversation-registry-component-outlet", inputs: ["component", "componentLoader", "inputs"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.AXFormatPipe, name: "format" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8999
8968
|
}
|
|
9000
8969
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationMessageListComponent, decorators: [{
|
|
9001
8970
|
type: Component,
|
|
@@ -9014,7 +8983,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
9014
8983
|
AXUploaderZoneDirective,
|
|
9015
8984
|
AXConversationAvatarComponent,
|
|
9016
8985
|
AXConversationRegistryComponentOutletComponent,
|
|
9017
|
-
], template: "@if (activeConversation(); as conv) {\n @for (cid of [conv.id]; track cid) {\n <div\n class=\"message-list message-list--conversation-surface\"\n [class.message-list--drag]=\"messageListDragging()\"\n #messageList\n role=\"log\"\n [attr.aria-label]=\"'@acorex:chat.aria.message-list' | translate | async\"\n aria-live=\"polite\"\n [style.background]=\"messageListBackgroundStyle()\"\n [style.--ax-comp-message-list-surface-bg]=\"messageListBackgroundStyle()\"\n axUploaderZone\n [disableBrowse]=\"true\"\n (dragEnter)=\"onMessageListDragEnter()\"\n (dragLeave)=\"onMessageListDragLeave()\"\n (fileChange)=\"onMessageListFilesDropped($event)\"\n >\n @if (loading()) {\n <div\n class=\"list-loading\"\n role=\"status\"\n aria-busy=\"true\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-messages' | translate | async\"\n >\n <div class=\"messages-skeleton\" aria-hidden=\"true\">\n @for (item of loadingSkeletonItems; track item) {\n <div class=\"message-skeleton\" [class.message-skeleton--own]=\"$odd\">\n @if ($even && isGroupConversation()) {\n <ax-skeleton class=\"message-skeleton-avatar\" [animated]=\"true\"></ax-skeleton>\n }\n <ax-skeleton\n class=\"message-skeleton-bubble\"\n [class.message-skeleton-bubble--short]=\"$index % 3 === 1\"\n [class.message-skeleton-bubble--medium]=\"$index % 3 === 2\"\n [animated]=\"true\"\n ></ax-skeleton>\n </div>\n }\n </div>\n </div>\n } @else if (messages().length === 0) {\n <div class=\"list-empty\" role=\"status\" [attr.aria-label]=\"'@acorex:chat.status.no-messages' | translate | async\">\n <ng-content select=\"ax-conversation-message-list-empty, [ax-conversation-message-list-empty]\">\n <ng-container\n *ngComponentOutlet=\"resolvedEmptyStateComponent(); inputs: { conversation: activeConversation()! }\"\n ></ng-container>\n </ng-content>\n </div>\n } @else {\n <div\n class=\"messages-container\"\n (scroll)=\"onScroll($event)\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'top'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreMessages()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n #messagesContainer\n role=\"feed\"\n [attr.aria-label]=\"'@acorex:chat.aria.messages' | translate | async\"\n >\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--prepend\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-older-messages' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{\n '@acorex:chat.status.loading-older-messages' | translate | async\n }}</ax-label>\n </div>\n }\n @for (group of messageGroups(); track trackMessageGroup($index, group)) {\n <!-- Date Separator -->\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"getDateSeparatorAriaLabel(group.dateLabel)\">\n <span class=\"date-separator__label\">{{ group.dateLabel }}</span>\n </div>\n\n <!-- Messages in this date group -->\n @for (message of group.messages; track trackMessage($index, message)) {\n <div\n [class]=\"getMessageClasses(message)\"\n role=\"article\"\n [attr.aria-label]=\"getMessageAriaLabel(message)\"\n [id]=\"'message-' + message.id\"\n >\n <!-- Avatar (only for group conversations and received messages) -->\n @if (shouldShowAvatar(message)) {\n <div class=\"message-avatar\">\n <ax-conversation-avatar\n kind=\"user\"\n [userId]=\"message.senderId\"\n [conversation]=\"activeConversation()\"\n [message]=\"message\"\n [size]=\"32\"\n />\n </div>\n }\n\n <div class=\"message-content-row\" [class.message-content-row-own]=\"isOwnMessage(message)\">\n @if (messageSupportsReactions(message)) {\n <button\n type=\"button\"\n class=\"add-reaction-button add-reaction-outside\"\n [class.add-reaction-visible]=\"reactionPickerTarget() === message.id\"\n (click)=\"toggleReactionPicker(message, $event)\"\n [attr.aria-label]=\"'@acorex:chat.actions.add-reaction' | translate | async\"\n #reactionButton\n >\n <i class=\"fa-light fa-face-smile\"></i>\n </button>\n }\n\n <div\n class=\"message-bubble-container\"\n [id]=\"'message-bubble-' + message.id\"\n [attr.data-message-id]=\"message.id\"\n >\n <div\n [class]=\"getBubbleClasses(message)\"\n [class.message-bubble-sent]=\"message.senderId === currentUser()?.id\"\n [class.message-bubble-received]=\"message.senderId !== currentUser()?.id\"\n >\n <!-- Sender name (only for group conversations and received messages) -->\n @if (shouldShowSenderName(message)) {\n <div class=\"message-sender\">{{ getSenderName(message) }}:</div>\n }\n\n <!-- Reply Preview -->\n @if (message.replyTo) {\n <div\n class=\"reply-preview\"\n (click)=\"scrollToMessage(message.replyTo.id)\"\n role=\"button\"\n [attr.aria-label]=\"'Reply to ' + getSenderName(message.replyTo)\"\n (keydown.enter)=\"scrollToMessage(message.replyTo.id)\"\n (keydown.space)=\"scrollToMessage(message.replyTo.id)\"\n >\n <div class=\"reply-preview-content\">\n <div class=\"reply-preview-sender\">{{ getSenderName(message.replyTo) }}</div>\n <div class=\"reply-preview-text\">\n @if (getMessagePreviewText(message.replyTo); as preview) {\n <span class=\"last-message\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i\n >{{ '@acorex:chat.' + preview.type | translate | async }}\n } @else {\n {{ preview.value }}\n }\n </span>\n }\n </div>\n </div>\n </div>\n }\n\n <!-- Forwarded Indicator -->\n @if (message.forwarded) {\n <div class=\"forwarded-preview\">\n <i class=\"fa-solid fa-share\"></i>\n <span class=\"forwarded-text\">{{ getForwardedText(message) }}</span>\n </div>\n }\n\n <ax-conversation-registry-component-outlet\n [component]=\"getRendererComponent(message)\"\n [componentLoader]=\"getRendererComponentLoader(message)\"\n [inputs]=\"getRendererInputs(message)\"\n />\n\n @if (messageSupportsReactions(message) && message.reactions.length > 0) {\n <div class=\"message-reactions-container\">\n <div class=\"message-reactions-bubbles\">\n @for (reaction of getGroupedReactions(message); track reaction.emoji) {\n <button\n type=\"button\"\n class=\"reaction-bubble\"\n [class.reaction-bubble-active]=\"reaction.hasReacted\"\n (click)=\"onReactionClick(message, reaction.emoji)\"\n [attr.aria-label]=\"reaction.emoji + ' ' + reaction.count\"\n >\n <span class=\"reaction-emoji\">{{ reaction.emoji }}</span>\n @if (reaction.count > 1) {\n <span class=\"reaction-count\">{{ reaction.count }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n\n <!-- Message Footer -->\n <div class=\"message-footer\">\n @let replyCount = getReplyCount(message);\n @let forwardCount = getForwardCount(message);\n @if (replyCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"replyCount + ' replies'\">\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ replyCount }}</span>\n </span>\n }\n @if (forwardCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"forwardCount + ' forwards'\">\n <i class=\"fa-solid fa-share\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ forwardCount }}</span>\n </span>\n }\n @if (replyCount > 0 || forwardCount > 0) {\n <span class=\"message-footer-split\" aria-hidden=\"true\"></span>\n }\n <span class=\"message-time\">{{ message.timestamp | format: 'timeleft' | async }}</span>\n @if (message.editedAt) {\n <span class=\"edited-indicator\">\n <span>{{ '@acorex:chat.status.edited' | translate | async }}</span>\n </span>\n }\n @if (isOwnMessage(message)) {\n <span [class]=\"getStatusIconClasses(message)\">\n <ax-icon><i [class]=\"getStatusIcon(message)\"></i></ax-icon>\n </span>\n }\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Menu for Message Actions -->\n <ax-context-menu\n [target]=\"'#message-bubble-' + message.id\"\n [openOn]=\"'click'\"\n [closeOn]=\"'click'\"\n (onOpening)=\"handleMessageContextMenuOpening($event, message)\"\n (onClose)=\"contextMenuMessageId.set(null)\"\n (onItemClick)=\"handleMessageContextMenuItemClick($event, message)\"\n >\n </ax-context-menu>\n </div>\n }\n }\n </div>\n\n <!-- Scroll to Bottom Button -->\n @if (showScrollButton()) {\n <div\n class=\"scroll-to-bottom-wrapper\"\n animate.enter=\"scroll-to-bottom-enter\"\n animate.leave=\"scroll-to-bottom-leave\"\n >\n <ax-fab\n class=\"scroll-to-bottom\"\n (onClick)=\"scrollToBottom()\"\n [attr.aria-label]=\"'@acorex:chat.actions.scroll-to-bottom' | translate | async\"\n >\n <ax-icon><i class=\"fa-light fa-arrow-down\" aria-hidden=\"true\"></i></ax-icon>\n </ax-fab>\n </div>\n }\n }\n </div>\n }\n\n <!-- Reaction Picker Popover -->\n @if (reactionsEnabled() && reactionPickerTarget()) {\n <ax-popover\n #reactionPopover\n [target]=\"reactionPickerElement()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"reactionPickerPlacement()\"\n (onClose)=\"closeReactionPicker()\"\n >\n <div class=\"reaction-picker-popup\">\n <div class=\"reaction-picker-header\">\n <span class=\"picker-title\">{{ '@acorex:chat.actions.react' | translate | async }}</span>\n <button\n type=\"button\"\n class=\"picker-close\"\n (click)=\"closeReactionPicker()\"\n [attr.aria-label]=\"'@acorex:chat.actions.close' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n <div\n class=\"reaction-picker-emojis\"\n role=\"listbox\"\n [attr.aria-label]=\"'@acorex:chat.actions.choose-reaction' | translate | async\"\n >\n @for (emoji of availableReactions(); track emoji) {\n <button\n type=\"button\"\n class=\"reaction-picker-emoji\"\n [class.reaction-picker-emoji-active]=\"hasUserReactedById(reactionPickerTarget()!, emoji)\"\n (click)=\"onReactionClickById(reactionPickerTarget()!, emoji); closeReactionPicker()\"\n [attr.aria-label]=\"emoji\"\n >\n {{ emoji }}\n </button>\n }\n </div>\n </div>\n </ax-popover>\n }\n} @else {\n <div\n class=\"message-list message-list--no-active\"\n role=\"region\"\n [attr.aria-label]=\"'@acorex:chat.status.no-conversation-selected' | translate | async\"\n >\n <div class=\"list-no-active\">\n <ng-content select=\"ax-conversation-message-list-no-active, [ax-conversation-message-list-no-active]\">\n <ng-container *ngComponentOutlet=\"noActiveFallbackComponent\"></ng-container>\n </ng-content>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-message-list{position:relative;display:block;height:100%;container-type:inline-size;--ax-comp-message-bubble-tail-height: 1.5625rem;--ax-comp-message-bubble-tail-fill-width: 1.25rem;--ax-comp-message-bubble-tail-fill-offset: -.4375rem;--ax-comp-message-bubble-tail-cutout-width: 1.625rem;--ax-comp-message-bubble-tail-cutout-offset: -1.625rem;--ax-comp-message-bubble-tail-curve: 1rem 0rem;--ax-comp-message-bubble-tail-cutout-curve: .625rem;@keyframes axConversationSurfaceIn{0%{opacity:0}to{opacity:1}}@keyframes axConversationSurfaceInReduced{0%{opacity:.92}to{opacity:1}}@keyframes messagesSkeletonIn{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes messagesSkeletonInReduced{0%{opacity:.85}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterPrepend{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeavePrepend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.35rem)}}@keyframes axScrollToBottomEnter{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes axScrollToBottomLeave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}}ax-conversation-message-list .message-list{position:relative;display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden}ax-conversation-message-list .message-list.ax-drop-zone>.ax-uploader-overlay-state{display:none!important}ax-conversation-message-list .message-list--drag{outline-style:var(--tw-outline-style);outline-width:2px;outline-color:rgba(var(--ax-sys-color-primary-surface));--tw-outline-style: dashed;outline-style:dashed;outline-offset:-2px}ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceIn .36s cubic-bezier(.22,1,.36,1) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceInReduced .18s ease both}}ax-conversation-message-list .list-loading{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;justify-content:flex-end;overflow:hidden}ax-conversation-message-list .messages-skeleton{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 6);animation:messagesSkeletonIn .42s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .message-skeleton{display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-message-list .message-skeleton--own{flex-direction:row-reverse}ax-conversation-message-list .message-skeleton-avatar{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-message-list .message-skeleton-bubble{height:calc(var(--spacing, .25rem) * 10);border-radius:var(--radius-2xl, 1rem);width:min(62%,17.5rem)}ax-conversation-message-list .message-skeleton-bubble--short{height:calc(var(--spacing, .25rem) * 8);width:min(36%,9.5rem)}ax-conversation-message-list .message-skeleton-bubble--medium{height:calc(var(--spacing, .25rem) * 9);width:min(48%,13rem)}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .messages-skeleton{animation:messagesSkeletonInReduced .2s ease both}}ax-conversation-message-list .list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;animation:fadeInUp .5s ease-out}ax-conversation-message-list .message-list--no-active{height:100%}ax-conversation-message-list .list-no-active{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 48);flex-direction:column;align-items:center;justify-content:center}ax-conversation-message-list .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:5.5rem;--tw-leading: 1;line-height:1;opacity:35%;filter:grayscale(.2)}ax-conversation-message-list .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:1.625rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-tight, -.025em);letter-spacing:var(--tracking-tight, -.025em);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-message-list .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:420px;font-size:1.0625rem;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-on-surface));opacity:.65}ax-conversation-message-list .spinner{margin-bottom:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:3px;border-color:rgba(var(--ax-sys-color-border-light-surface));border-top-color:rgb(var(--ax-sys-color-primary-500));animation:spin .8s linear infinite}ax-conversation-message-list .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 2);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-message-list .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:.3rem}ax-conversation-message-list .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-message-list .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-message-list .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-message-list .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-message-list .load-more-enter{animation:axChatLoadMoreEnterPrepend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .load-more-leave{animation:axChatLoadMoreLeavePrepend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .load-more-dot{animation:none;opacity:.65}ax-conversation-message-list .load-more-enter,ax-conversation-message-list .load-more-leave{animation:none}}ax-conversation-message-list .messages-container{position:relative;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1;overflow-y:auto;overflow-x:visible}ax-conversation-message-list .date-separator{pointer-events:none;position:sticky;z-index:150;display:flex;align-items:center;justify-content:center;top:.5rem;padding:.375rem 1rem .625rem;margin-block:.125rem .375rem}ax-conversation-message-list .date-separator__label{pointer-events:auto;display:inline-flex;width:calc(var(--spacing, .25rem) * 32);max-width:min(100%,18rem);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;-webkit-user-select:none;user-select:none;color:rgba(var(--ax-sys-color-on-lightest-surface));background:rgba(var(--ax-sys-color-lightest-surface));border:1px solid rgba(var(--ax-sys-color-on-lightest-surface),.25)}ax-conversation-message-list .unread-separator{margin-block:calc(var(--spacing, .25rem) * 6);display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4)}ax-conversation-message-list .unread-separator-line{height:1px;flex:1;background-color:rgba(var(--ax-sys-color-primary-surface));opacity:30%}ax-conversation-message-list .unread-separator-text{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);white-space:nowrap;color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}ax-conversation-message-list .message-item{position:relative;display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);padding-inline:1.75rem;transition:background-color .3s ease}ax-conversation-message-list .message-item-context-active{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.09);box-shadow:inset 0 0 0 1px rgba(var(--ax-sys-color-primary-500),.22)}ax-conversation-message-list .message-own.message-item-context-active{background-color:rgba(var(--ax-sys-color-primary-500),.12)}ax-conversation-message-list .message-highlight{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-message-list .message-item.message-own{flex-direction:row-reverse}ax-conversation-message-list .message-avatar{z-index:5;flex-shrink:0}ax-conversation-message-list .message-avatar-icon{display:flex;height:100%;width:100%;align-items:center;justify-content:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: 1;line-height:1}ax-conversation-message-list .message-content-row{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:0 1 auto;flex-direction:row;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 1);max-width:min(95%,50rem)}@container (min-width: 768px){ax-conversation-message-list .message-content-row{max-width:min(70%,50rem)}}ax-conversation-message-list .message-content-row-own{justify-content:flex-end}ax-conversation-message-list .message-item:not(.message-own) .message-content-row{justify-content:flex-start}ax-conversation-message-list .message-bubble-container{position:relative;display:flex;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex:1 1 auto;flex-direction:column}ax-conversation-message-list .message-own .message-bubble-container{align-items:flex-end}ax-conversation-message-list .message-sender{margin-bottom:.1rem;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-bubble{position:relative;display:flex;max-width:100%;flex-direction:column;border-radius:var(--radius-2xl, 1rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);padding-bottom:.1rem;overflow-wrap:break-word;transition:background-color .3s ease}ax-conversation-message-list .message-bubble>*{position:relative;z-index:1}ax-conversation-message-list .reply-preview{margin-bottom:calc(var(--spacing, .25rem) * 2);cursor:pointer;border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .reply-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .reply-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .reply-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .reply-preview-line{width:3px;flex-shrink:0;border-radius:1.5px;background:currentColor;opacity:.5}ax-conversation-message-list .reply-preview-content{min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-message-list .reply-preview-sender{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .reply-preview-text{overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .reply-preview-sender{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .reply-preview-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .last-message{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .forwarded-preview{margin-bottom:.1rem;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .forwarded-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .forwarded-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .forwarded-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .forwarded-preview i{flex-shrink:0;font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .forwarded-text{min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .forwarded-preview i{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .forwarded-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .message-bubble-received:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-lightest-surface));background-color:var(--ax-comp-message-bubble-bg);border-bottom-left-radius:.25rem}ax-conversation-message-list .message-bubble-sent:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-primary-surface));background-color:var(--ax-comp-message-bubble-bg);color:rgb(var(--ax-sys-color-on-primary-surface));border-bottom-right-radius:.25rem}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{content:\"\";position:absolute;bottom:0;height:var(--ax-comp-message-bubble-tail-height);pointer-events:none;z-index:0}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):before{width:var(--ax-comp-message-bubble-tail-fill-width);background-color:var(--ax-comp-message-bubble-bg)}ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{width:var(--ax-comp-message-bubble-tail-cutout-width);background:var(--ax-comp-message-list-surface-bg, rgb(var(--ax-sys-color-primary-lightest-surface)))}ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system){border-bottom-left-radius:1rem;border-bottom-right-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system){border-bottom-right-radius:1rem;border-bottom-left-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:auto;right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:auto;right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:auto;left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:auto;left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble.message-system:before,ax-conversation-message-list .message-bubble.message-system:after{display:none}ax-conversation-message-list .message-own .message-bubble{color:rgb(var(--ax-sys-color-on-primary-surface))}ax-conversation-message-list .message-bubble.message-system{background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);max-width:100%}ax-conversation-message-list .message-item:has(.message-system){justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .message-item:has(.message-system) .message-content-row{max-width:100%;justify-content:center}ax-conversation-message-list .message-item:has(.message-system) .message-bubble-container{align-items:center}ax-conversation-message-list .message-content{font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);white-space:pre-wrap}ax-conversation-message-list ax-conversation-registry-component-outlet{display:block;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0)}ax-conversation-message-list .message-footer{margin-top:.1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 1);padding-inline-start:calc(var(--spacing, .25rem) * 1);font-size:.6875rem;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%;-webkit-user-select:none;user-select:none}ax-conversation-message-list .message-footer-count{display:inline-flex;align-items:center;gap:.2rem;font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .message-footer-count i{font-size:.625rem;opacity:90%}ax-conversation-message-list .message-footer-count-value{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-footer-split{margin-inline:.2rem;height:.65rem;width:1px;flex-shrink:0;align-self:center;background-color:rgba(var(--ax-sys-color-border-light-surface));opacity:90%}ax-conversation-message-list .message-time{font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .edited-indicator{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline-start:.35rem;font-size:.675rem;opacity:75%}ax-conversation-message-list .status-icon{display:inline-flex;align-items:center}ax-conversation-message-list .status-icon i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-conversation-message-list .status-read{color:rgba(var(--ax-sys-color-primary-200))}ax-conversation-message-list .status-failed{color:rgba(var(--ax-sys-color-danger-200))}ax-conversation-message-list .message-reactions-bubbles{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem}ax-conversation-message-list .reaction-bubble{margin:calc(var(--spacing, .25rem) * 0);display:inline-flex;min-height:1.375rem;cursor:pointer;align-items:center;justify-content:center;gap:.15rem;border-radius:var(--radius-xl, .75rem);padding-inline:.35rem;padding-block:.1rem;color:rgba(var(--ax-sys-color-on-surface));--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background:rgba(var(--ax-sys-color-on-surface),.06);border:1px solid rgba(var(--ax-sys-color-on-surface),.1);transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ax-conversation-message-list .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-surface),.1);border-color:rgba(var(--ax-sys-color-on-surface),.18)}ax-conversation-message-list .reaction-bubble-active{background:rgba(var(--ax-sys-color-primary-500),.12);border-color:rgba(var(--ax-sys-color-primary-500),.45)}ax-conversation-message-list .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-primary-500),.18);border-color:rgba(var(--ax-sys-color-primary-500),.55)}ax-conversation-message-list .reaction-emoji{display:inline-block;font-size:.8125rem;--tw-leading: 1;line-height:1}ax-conversation-message-list .reaction-count{font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-on-surface));--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);opacity:.65}ax-conversation-message-list .reaction-bubble-active .reaction-count{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600));opacity:95%}ax-conversation-message-list .message-own .reaction-bubble{color:rgba(var(--ax-sys-color-on-primary-surface));background:rgba(var(--ax-sys-color-on-primary-surface),.12);border-color:rgba(var(--ax-sys-color-on-primary-surface),.2)}ax-conversation-message-list .message-own .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.2);border-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .reaction-bubble-active{background:rgba(var(--ax-sys-color-on-primary-surface),.28);border-color:rgba(var(--ax-sys-color-on-primary-surface),.5)}ax-conversation-message-list .message-own .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.34);border-color:rgba(var(--ax-sys-color-on-primary-surface),.6)}ax-conversation-message-list .message-own .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:80%}ax-conversation-message-list .message-own .reaction-bubble-active .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:100%}ax-conversation-message-list .message-reactions-container{margin-top:calc(var(--spacing, .25rem) * 1);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.2rem}ax-conversation-message-list .message-own .message-reactions-container{justify-content:flex-end}ax-conversation-message-list .message-own .message-footer .edited-indicator{border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .message-footer .message-footer-split{background:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .add-reaction-button.add-reaction-outside{position:absolute;top:50%;margin:calc(var(--spacing, .25rem) * 0);box-sizing:border-box;display:none;height:1.8rem;width:1.8rem;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding:calc(var(--spacing, .25rem) * 0);inset-inline-end:-2.25rem;box-shadow:0 1px 2px #0000000f}ax-conversation-message-list .add-reaction-button{padding-inline-start:.05rem}ax-conversation-message-list .message-content-row-own .add-reaction-button.add-reaction-outside{inset-inline-start:-2.25rem;inset-inline-end:auto}ax-conversation-message-list .message-item:hover .add-reaction-button.add-reaction-outside,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{display:inline-flex}ax-conversation-message-list .add-reaction-button.add-reaction-outside:hover,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .add-reaction-button.add-reaction-outside i{font-size:.9rem;color:rgba(var(--ax-sys-color-on-surface));opacity:80%}ax-conversation-message-list .reaction-bubble:focus-visible,ax-conversation-message-list .add-reaction-button:focus-visible,ax-conversation-message-list .action-trigger:focus-visible,ax-conversation-message-list ax-fab.scroll-to-bottom ax-button:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .message-actions{z-index:10;padding-bottom:calc(var(--spacing, .25rem) * 6);opacity:0%;transition:opacity var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .message-item:hover .message-actions{opacity:100%}ax-conversation-message-list .action-trigger{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .action-trigger:hover{background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-message-list .shortcut{font-size:.6875rem;opacity:70%}ax-conversation-message-list .scroll-to-bottom-wrapper{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 4);bottom:calc(var(--spacing, .25rem) * 4);z-index:999}ax-conversation-message-list ax-fab.scroll-to-bottom ax-button{display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none}ax-conversation-message-list .scroll-to-bottom-enter{animation:axScrollToBottomEnter var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}ax-conversation-message-list .scroll-to-bottom-leave{animation:axScrollToBottomLeave var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .scroll-to-bottom-enter,ax-conversation-message-list .scroll-to-bottom-leave{animation:none}}.reaction-picker-popup{width:max-content;min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;border-radius:.65rem;background-color:rgba(var(--ax-sys-color-lightest-surface));max-width:min(260px,92vw)}.reaction-picker-header{display:flex;min-height:calc(var(--spacing, .25rem) * 0);align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-block:.45rem;padding-inline-start:.7rem;padding-inline-end:calc(var(--spacing, .25rem) * 2)}.picker-title{font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-on-surface));opacity:85%}.picker-close{display:flex;height:1.6rem;width:1.6rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.25rem;--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:.95rem;color:rgba(var(--ax-sys-color-on-surface),.55);transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}.picker-close:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}.picker-close:focus-visible,.reaction-picker-emoji:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}.reaction-picker-emojis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.2rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:.45rem;padding-bottom:calc(var(--spacing, .25rem) * 2)}.reaction-picker-emoji{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);cursor:pointer;border-radius:.45rem;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:1.15rem;--tw-leading: 1;line-height:1;transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.reaction-picker-emoji:hover{background-color:rgba(var(--ax-sys-color-lighter-surface))}.reaction-picker-emoji-active{background-color:rgba(var(--ax-sys-color-surface))}.reaction-picker-emoji-active:hover{background:rgba(var(--ax-sys-color-primary-500),.25)}}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{transform:translate3d(0,100%,0);opacity:0}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
8986
|
+
], template: "@if (activeConversation(); as conv) {\n @if (conv.id) {\n <div\n class=\"message-list message-list--conversation-surface\"\n [class.message-list--drag]=\"messageListDragging()\"\n #messageList\n role=\"log\"\n [attr.aria-label]=\"'@acorex:chat.aria.message-list' | translate | async\"\n aria-live=\"polite\"\n [style.background]=\"messageListBackgroundStyle()\"\n [style.--ax-comp-message-list-surface-bg]=\"messageListBackgroundStyle()\"\n axUploaderZone\n [disableBrowse]=\"true\"\n (dragEnter)=\"onMessageListDragEnter()\"\n (dragLeave)=\"onMessageListDragLeave()\"\n (fileChange)=\"onMessageListFilesDropped($event)\"\n >\n @if (loading()) {\n <div\n class=\"list-loading\"\n role=\"status\"\n aria-busy=\"true\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-messages' | translate | async\"\n >\n <div class=\"messages-skeleton\" aria-hidden=\"true\">\n @for (item of loadingSkeletonItems; track item) {\n <div class=\"message-skeleton\" [class.message-skeleton--own]=\"$odd\">\n @if ($even && isGroupConversation()) {\n <ax-skeleton class=\"message-skeleton-avatar\" [animated]=\"true\"></ax-skeleton>\n }\n <ax-skeleton\n class=\"message-skeleton-bubble\"\n [class.message-skeleton-bubble--short]=\"$index % 3 === 1\"\n [class.message-skeleton-bubble--medium]=\"$index % 3 === 2\"\n [animated]=\"true\"\n ></ax-skeleton>\n </div>\n }\n </div>\n </div>\n } @else if (messages().length === 0) {\n <div class=\"list-empty\" role=\"status\" [attr.aria-label]=\"'@acorex:chat.status.no-messages' | translate | async\">\n <ng-content select=\"ax-conversation-message-list-empty, [ax-conversation-message-list-empty]\">\n <ng-container\n *ngComponentOutlet=\"resolvedEmptyStateComponent(); inputs: { conversation: activeConversation()! }\"\n ></ng-container>\n </ng-content>\n </div>\n } @else {\n <div\n class=\"messages-container\"\n (scroll)=\"onScroll($event)\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'top'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreMessages()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n #messagesContainer\n role=\"feed\"\n [attr.aria-label]=\"'@acorex:chat.aria.messages' | translate | async\"\n >\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--prepend\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-older-messages' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{\n '@acorex:chat.status.loading-older-messages' | translate | async\n }}</ax-label>\n </div>\n }\n @for (group of messageGroups(); track group.date) {\n <!-- Date Separator -->\n <div class=\"date-separator\" role=\"separator\" [attr.aria-label]=\"getDateSeparatorAriaLabel(group.dateLabel)\">\n <span class=\"date-separator__label\">{{ group.dateLabel }}</span>\n </div>\n\n <!-- Messages in this date group -->\n @for (message of group.messages; track message.id) {\n <div\n [class]=\"getMessageClasses(message)\"\n role=\"article\"\n [attr.aria-label]=\"getMessageAriaLabel(message)\"\n [id]=\"'message-' + message.id\"\n >\n <!-- Avatar (only for group conversations and received messages) -->\n @if (shouldShowAvatar(message)) {\n <div class=\"message-avatar\">\n <ax-conversation-avatar\n kind=\"user\"\n [userId]=\"message.senderId\"\n [conversation]=\"activeConversation()\"\n [message]=\"message\"\n [size]=\"32\"\n />\n </div>\n }\n\n <div class=\"message-content-row\" [class.message-content-row-own]=\"isOwnMessage(message)\">\n @if (messageSupportsReactions(message)) {\n <button\n type=\"button\"\n class=\"add-reaction-button add-reaction-outside\"\n [class.add-reaction-visible]=\"reactionPickerTarget() === message.id\"\n (click)=\"toggleReactionPicker(message, $event)\"\n [attr.aria-label]=\"'@acorex:chat.actions.add-reaction' | translate | async\"\n #reactionButton\n >\n <i class=\"fa-light fa-face-smile\"></i>\n </button>\n }\n\n <div\n class=\"message-bubble-container\"\n [id]=\"'message-bubble-' + message.id\"\n [attr.data-message-id]=\"message.id\"\n >\n <div\n [class]=\"getBubbleClasses(message)\"\n [class.message-bubble-sent]=\"message.senderId === currentUser()?.id\"\n [class.message-bubble-received]=\"message.senderId !== currentUser()?.id\"\n >\n <!-- Sender name (only for group conversations and received messages) -->\n @if (shouldShowSenderName(message)) {\n <div class=\"message-sender\">{{ getSenderName(message) }}:</div>\n }\n\n <!-- Reply Preview -->\n @if (message.replyTo) {\n <div\n class=\"reply-preview\"\n (click)=\"scrollToMessage(message.replyTo.id)\"\n role=\"button\"\n [attr.aria-label]=\"'Reply to ' + getSenderName(message.replyTo)\"\n (keydown.enter)=\"scrollToMessage(message.replyTo.id)\"\n (keydown.space)=\"scrollToMessage(message.replyTo.id)\"\n >\n <div class=\"reply-preview-content\">\n <div class=\"reply-preview-sender\">{{ getSenderName(message.replyTo) }}</div>\n <div class=\"reply-preview-text\">\n @if (getMessagePreviewText(message.replyTo); as preview) {\n <span class=\"last-message\">\n @if (preview.type !== 'text') {\n <i [class]=\"preview.icon\"></i\n >{{ '@acorex:chat.' + preview.type | translate | async }}\n } @else {\n {{ preview.value }}\n }\n </span>\n }\n </div>\n </div>\n </div>\n }\n\n <!-- Forwarded Indicator -->\n @if (message.forwarded) {\n <div class=\"forwarded-preview\">\n <i class=\"fa-solid fa-share\"></i>\n <span class=\"forwarded-text\">{{ getForwardedText(message) }}</span>\n </div>\n }\n\n <ax-conversation-registry-component-outlet\n [component]=\"getRendererComponent(message)\"\n [componentLoader]=\"getRendererComponentLoader(message)\"\n [inputs]=\"getRendererInputs(message)\"\n />\n\n @if (messageSupportsReactions(message) && message.reactions.length > 0) {\n <div class=\"message-reactions-container\">\n <div class=\"message-reactions-bubbles\">\n @for (reaction of getGroupedReactions(message); track reaction.emoji) {\n <button\n type=\"button\"\n class=\"reaction-bubble\"\n [class.reaction-bubble-active]=\"reaction.hasReacted\"\n (click)=\"onReactionClick(message, reaction.emoji)\"\n [attr.aria-label]=\"reaction.emoji + ' ' + reaction.count\"\n >\n <span class=\"reaction-emoji\">{{ reaction.emoji }}</span>\n @if (reaction.count > 1) {\n <span class=\"reaction-count\">{{ reaction.count }}</span>\n }\n </button>\n }\n </div>\n </div>\n }\n\n <!-- Message Footer -->\n <div class=\"message-footer\">\n @let replyCount = getReplyCount(message);\n @let forwardCount = getForwardCount(message);\n @if (replyCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"replyCount + ' replies'\">\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ replyCount }}</span>\n </span>\n }\n @if (forwardCount > 0) {\n <span class=\"message-footer-count\" [attr.aria-label]=\"forwardCount + ' forwards'\">\n <i class=\"fa-solid fa-share\" aria-hidden=\"true\"></i>\n <span class=\"message-footer-count-value\">{{ forwardCount }}</span>\n </span>\n }\n @if (replyCount > 0 || forwardCount > 0) {\n <span class=\"message-footer-split\" aria-hidden=\"true\"></span>\n }\n <span class=\"message-time\">{{ message.timestamp | format: 'timeleft' | async }}</span>\n @if (message.editedAt) {\n <span class=\"edited-indicator\">\n <span>{{ '@acorex:chat.status.edited' | translate | async }}</span>\n </span>\n }\n @if (isOwnMessage(message)) {\n <span [class]=\"getStatusIconClasses(message)\">\n <ax-icon><i [class]=\"getStatusIcon(message)\"></i></ax-icon>\n </span>\n }\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Menu for Message Actions -->\n <ax-context-menu\n [target]=\"'#message-bubble-' + message.id\"\n [openOn]=\"'click'\"\n [closeOn]=\"'click'\"\n (onOpening)=\"handleMessageContextMenuOpening($event, message)\"\n (onClose)=\"contextMenuMessageId.set(null)\"\n (onItemClick)=\"handleMessageContextMenuItemClick($event, message)\"\n >\n </ax-context-menu>\n </div>\n }\n }\n </div>\n\n <!-- Scroll to Bottom Button -->\n @if (showScrollButton()) {\n <div\n class=\"scroll-to-bottom-wrapper\"\n animate.enter=\"scroll-to-bottom-enter\"\n animate.leave=\"scroll-to-bottom-leave\"\n >\n <ax-fab\n class=\"scroll-to-bottom\"\n (onClick)=\"scrollToBottom()\"\n [attr.aria-label]=\"'@acorex:chat.actions.scroll-to-bottom' | translate | async\"\n >\n <ax-icon><i class=\"fa-light fa-arrow-down\" aria-hidden=\"true\"></i></ax-icon>\n </ax-fab>\n </div>\n }\n }\n </div>\n }\n\n <!-- Reaction Picker Popover -->\n @if (reactionsEnabled() && reactionPickerTarget()) {\n <ax-popover\n #reactionPopover\n [target]=\"reactionPickerElement()\"\n [openOn]=\"'manual'\"\n [closeOn]=\"'clickOut'\"\n [placement]=\"reactionPickerPlacement()\"\n (onClose)=\"closeReactionPicker()\"\n >\n <div class=\"reaction-picker-popup\">\n <div class=\"reaction-picker-header\">\n <span class=\"picker-title\">{{ '@acorex:chat.actions.react' | translate | async }}</span>\n <button\n type=\"button\"\n class=\"picker-close\"\n (click)=\"closeReactionPicker()\"\n [attr.aria-label]=\"'@acorex:chat.actions.close' | translate | async\"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n <div\n class=\"reaction-picker-emojis\"\n role=\"listbox\"\n [attr.aria-label]=\"'@acorex:chat.actions.choose-reaction' | translate | async\"\n >\n @for (emoji of availableReactions(); track emoji) {\n <button\n type=\"button\"\n class=\"reaction-picker-emoji\"\n [class.reaction-picker-emoji-active]=\"hasUserReactedById(reactionPickerTarget()!, emoji)\"\n (click)=\"onReactionClickById(reactionPickerTarget()!, emoji); closeReactionPicker()\"\n [attr.aria-label]=\"emoji\"\n >\n {{ emoji }}\n </button>\n }\n </div>\n </div>\n </ax-popover>\n }\n} @else {\n <div\n class=\"message-list message-list--no-active\"\n role=\"region\"\n [attr.aria-label]=\"'@acorex:chat.status.no-conversation-selected' | translate | async\"\n >\n <div class=\"list-no-active\">\n <ng-content select=\"ax-conversation-message-list-no-active, [ax-conversation-message-list-no-active]\">\n <ng-container *ngComponentOutlet=\"noActiveFallbackComponent\"></ng-container>\n </ng-content>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-conversation-message-list{position:relative;display:block;height:100%;container-type:inline-size;--ax-comp-message-bubble-tail-height: 1.5625rem;--ax-comp-message-bubble-tail-fill-width: 1.25rem;--ax-comp-message-bubble-tail-fill-offset: -.4375rem;--ax-comp-message-bubble-tail-cutout-width: 1.625rem;--ax-comp-message-bubble-tail-cutout-offset: -1.625rem;--ax-comp-message-bubble-tail-curve: 1rem 0rem;--ax-comp-message-bubble-tail-cutout-curve: .625rem;@keyframes axConversationSurfaceIn{0%{opacity:0}to{opacity:1}}@keyframes axConversationSurfaceInReduced{0%{opacity:.92}to{opacity:1}}@keyframes messagesSkeletonIn{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes messagesSkeletonInReduced{0%{opacity:.85}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterPrepend{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeavePrepend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.35rem)}}@keyframes axScrollToBottomEnter{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes axScrollToBottomLeave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}}ax-conversation-message-list .message-list{position:relative;display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden}ax-conversation-message-list .message-list.ax-drop-zone>.ax-uploader-overlay-state{display:none!important}ax-conversation-message-list .message-list--drag{outline-style:var(--tw-outline-style);outline-width:2px;outline-color:rgba(var(--ax-sys-color-primary-surface));--tw-outline-style: dashed;outline-style:dashed;outline-offset:-2px}ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceIn .36s cubic-bezier(.22,1,.36,1) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .message-list--conversation-surface{animation:axConversationSurfaceInReduced .18s ease both}}ax-conversation-message-list .list-loading{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;justify-content:flex-start;overflow-x:hidden;overflow-y:auto}ax-conversation-message-list .messages-skeleton{display:flex;width:100%;flex-direction:column;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 6);animation:messagesSkeletonIn .42s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .message-skeleton{display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-message-list .message-skeleton--own{flex-direction:row-reverse}ax-conversation-message-list .message-skeleton-avatar{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-avatar.ax-skeleton{background-color:rgba(var(--ax-sys-color-on-surface),.16)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-avatar.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-surface),.22) 50%,transparent)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-bubble.ax-skeleton{background-color:rgb(var(--ax-sys-color-lightest-surface));box-shadow:0 1px 2px rgba(var(--ax-sys-color-on-surface),.08)}ax-conversation-message-list .messages-skeleton ax-skeleton.message-skeleton-bubble.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-surface),.14) 50%,transparent)}ax-conversation-message-list .message-skeleton--own ax-skeleton.message-skeleton-bubble.ax-skeleton{background-color:rgb(var(--ax-sys-color-primary-surface));box-shadow:0 1px 2px rgba(var(--ax-sys-color-primary-900),.12)}ax-conversation-message-list .message-skeleton--own ax-skeleton.message-skeleton-bubble.ax-skeleton-animate:before{background-image:linear-gradient(to right,transparent,rgba(var(--ax-sys-color-on-primary-surface),.2) 50%,transparent)}ax-conversation-message-list .message-skeleton-bubble{height:calc(var(--spacing, .25rem) * 10);border-radius:var(--radius-2xl, 1rem);width:min(62%,17.5rem)}ax-conversation-message-list .message-skeleton-bubble--short{height:calc(var(--spacing, .25rem) * 8);width:min(36%,9.5rem)}ax-conversation-message-list .message-skeleton-bubble--medium{height:calc(var(--spacing, .25rem) * 9);width:min(48%,13rem)}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .messages-skeleton{animation:messagesSkeletonInReduced .2s ease both}}ax-conversation-message-list .list-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;animation:fadeInUp .5s ease-out}ax-conversation-message-list .message-list--no-active{height:100%}ax-conversation-message-list .list-no-active{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 48);flex-direction:column;align-items:center;justify-content:center}ax-conversation-message-list .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:5.5rem;--tw-leading: 1;line-height:1;opacity:35%;filter:grayscale(.2)}ax-conversation-message-list .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:1.625rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-tight, -.025em);letter-spacing:var(--tracking-tight, -.025em);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-message-list .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:420px;font-size:1.0625rem;--tw-leading: var(--leading-relaxed, 1.625);line-height:var(--leading-relaxed, 1.625);color:rgba(var(--ax-sys-color-on-surface));opacity:.65}ax-conversation-message-list .spinner{margin-bottom:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:3px;border-color:rgba(var(--ax-sys-color-border-light-surface));border-top-color:rgb(var(--ax-sys-color-primary-500));animation:spin .8s linear infinite}ax-conversation-message-list .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 2);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-message-list .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:.3rem}ax-conversation-message-list .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-message-list .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-message-list .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-message-list .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-message-list .load-more-enter{animation:axChatLoadMoreEnterPrepend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-message-list .load-more-leave{animation:axChatLoadMoreLeavePrepend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .load-more-dot{animation:none;opacity:.65}ax-conversation-message-list .load-more-enter,ax-conversation-message-list .load-more-leave{animation:none}}ax-conversation-message-list .messages-container{position:relative;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1;overflow-x:hidden;overflow-y:auto}ax-conversation-message-list .date-separator{pointer-events:none;position:sticky;z-index:150;display:flex;align-items:center;justify-content:center;top:.5rem;padding:.375rem 1rem .625rem;margin-block:.125rem .375rem}ax-conversation-message-list .date-separator__label{pointer-events:auto;display:inline-flex;width:calc(var(--spacing, .25rem) * 32);max-width:min(100%,18rem);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:var(--color-surface);color:var(--color-on-surface);border-color:var(--color-border-surface);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 1);text-align:center;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;-webkit-user-select:none;user-select:none}ax-conversation-message-list .unread-separator{margin-block:calc(var(--spacing, .25rem) * 6);display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);padding-inline:calc(var(--spacing, .25rem) * 4)}ax-conversation-message-list .unread-separator-line{height:1px;flex:1;background-color:rgba(var(--ax-sys-color-primary-surface));opacity:30%}ax-conversation-message-list .unread-separator-text{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);white-space:nowrap;color:rgba(var(--ax-sys-color-primary-surface));text-transform:uppercase}ax-conversation-message-list .message-item{position:relative;display:flex;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);transition:background-color .3s ease}ax-conversation-message-list .message-item-context-active{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.09);box-shadow:inset 0 0 0 1px rgba(var(--ax-sys-color-primary-500),.22)}ax-conversation-message-list .message-own.message-item-context-active{background-color:rgba(var(--ax-sys-color-primary-500),.12)}ax-conversation-message-list .message-highlight{border-radius:var(--radius-lg, .5rem);background-color:rgba(var(--ax-sys-color-primary-500),.1)}ax-conversation-message-list .message-item.message-own{flex-direction:row-reverse}ax-conversation-message-list .message-avatar{z-index:5;flex-shrink:0}ax-conversation-message-list .message-avatar-icon{display:flex;height:100%;width:100%;align-items:center;justify-content:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: 1;line-height:1}ax-conversation-message-list .message-content-row{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:0 1 auto;flex-direction:row;align-items:flex-end;gap:calc(var(--spacing, .25rem) * 1);max-width:min(95%,50rem)}ax-conversation-message-list .message-content-row:has(.add-reaction-button.add-reaction-outside) .message-bubble-container{margin-inline-end:.375rem}ax-conversation-message-list .message-content-row-own:has(.add-reaction-button.add-reaction-outside) .message-bubble-container{margin-inline-end:0;margin-inline-start:.375rem}@container (min-width: 768px){ax-conversation-message-list .message-content-row{max-width:min(70%,50rem)}}ax-conversation-message-list .message-content-row-own{justify-content:flex-end}ax-conversation-message-list .message-item:not(.message-own) .message-content-row{justify-content:flex-start}ax-conversation-message-list .message-bubble-container{position:relative;display:flex;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex:1 1 auto;flex-direction:column}ax-conversation-message-list .message-own .message-bubble-container{align-items:flex-end}ax-conversation-message-list .message-sender{margin-bottom:.1rem;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-bubble{position:relative;display:flex;max-width:100%;flex-direction:column;border-radius:var(--radius-2xl, 1rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 2);padding-bottom:.1rem;overflow-wrap:break-word;transition:background-color .3s ease}ax-conversation-message-list .message-bubble>*{position:relative;z-index:1}ax-conversation-message-list .reply-preview{margin-bottom:calc(var(--spacing, .25rem) * 2);cursor:pointer;border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .reply-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .reply-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .reply-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .reply-preview-line{width:3px;flex-shrink:0;border-radius:1.5px;background:currentColor;opacity:.5}ax-conversation-message-list .reply-preview-content{min-width:calc(var(--spacing, .25rem) * 0);flex:1}ax-conversation-message-list .reply-preview-sender{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .reply-preview-text{overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .reply-preview-sender{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .reply-preview-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .last-message{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .forwarded-preview{margin-bottom:.1rem;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5);background:rgba(var(--ax-sys-color-primary-500),.08);border-inline-start-color:rgb(var(--ax-sys-color-primary-500));transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .forwarded-preview:hover{background:rgba(var(--ax-sys-color-primary-500),.14);border-inline-start-color:rgb(var(--ax-sys-color-primary-600))}ax-conversation-message-list .message-own .forwarded-preview{border-inline-start-style:var(--tw-border-style);border-inline-start-width:3px;background:rgba(var(--ax-sys-color-on-primary-surface),.14);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.55)}ax-conversation-message-list .message-own .forwarded-preview:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.22);border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.75)}ax-conversation-message-list .forwarded-preview i{flex-shrink:0;font-size:.8125rem;color:rgba(var(--ax-sys-color-primary-600))}ax-conversation-message-list .forwarded-text{min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-message-list .message-own .forwarded-preview i{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:95%}ax-conversation-message-list .message-own .forwarded-text{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:.78}ax-conversation-message-list .message-bubble-received:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-lightest-surface));background-color:var(--ax-comp-message-bubble-bg);border-bottom-left-radius:.25rem}ax-conversation-message-list .message-bubble-sent:not(.message-system){--ax-comp-message-bubble-bg: rgb(var(--ax-sys-color-primary-surface));background-color:var(--ax-comp-message-bubble-bg);color:rgb(var(--ax-sys-color-on-primary-surface));border-bottom-right-radius:.25rem}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{content:\"\";position:absolute;bottom:0;height:var(--ax-comp-message-bubble-tail-height);pointer-events:none;z-index:0}ax-conversation-message-list .message-bubble-received:not(.message-system):before,ax-conversation-message-list .message-bubble-sent:not(.message-system):before{width:var(--ax-comp-message-bubble-tail-fill-width);background-color:var(--ax-comp-message-bubble-bg)}ax-conversation-message-list .message-bubble-received:not(.message-system):after,ax-conversation-message-list .message-bubble-sent:not(.message-system):after{width:var(--ax-comp-message-bubble-tail-cutout-width);background:var(--ax-comp-message-list-surface-bg, rgb(var(--ax-sys-color-primary-lightest-surface)))}ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system){border-bottom-left-radius:1rem;border-bottom-right-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system){border-bottom-right-radius:1rem;border-bottom-left-radius:.25rem}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):before{left:auto;right:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-received:not(.message-system):after{left:auto;right:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-right-radius:0;border-bottom-left-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):before{right:auto;left:var(--ax-comp-message-bubble-tail-fill-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-curve)}[dir=rtl] ax-conversation-message-list .message-bubble-sent:not(.message-system):after{right:auto;left:var(--ax-comp-message-bubble-tail-cutout-offset);border-bottom-left-radius:0;border-bottom-right-radius:var(--ax-comp-message-bubble-tail-cutout-curve)}ax-conversation-message-list .message-bubble.message-system:before,ax-conversation-message-list .message-bubble.message-system:after{display:none}ax-conversation-message-list .message-own .message-bubble{color:rgb(var(--ax-sys-color-on-primary-surface))}ax-conversation-message-list .message-bubble.message-system{background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);max-width:100%}ax-conversation-message-list .message-item:has(.message-system){justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-conversation-message-list .message-item:has(.message-system) .message-content-row{max-width:100%;justify-content:center}ax-conversation-message-list .message-item:has(.message-system) .message-bubble-container{align-items:center}ax-conversation-message-list .message-content{font-size:.9375rem;--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);white-space:pre-wrap}ax-conversation-message-list ax-conversation-registry-component-outlet{display:block;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0)}ax-conversation-message-list .message-footer{margin-top:.1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:calc(var(--spacing, .25rem) * 1);padding-inline-start:calc(var(--spacing, .25rem) * 1);font-size:.6875rem;--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%;-webkit-user-select:none;user-select:none}ax-conversation-message-list .message-footer-count{display:inline-flex;align-items:center;gap:.2rem;font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .message-footer-count i{font-size:.625rem;opacity:90%}ax-conversation-message-list .message-footer-count-value{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-conversation-message-list .message-footer-split{margin-inline:.2rem;height:.65rem;width:1px;flex-shrink:0;align-self:center;background-color:rgba(var(--ax-sys-color-border-light-surface));opacity:90%}ax-conversation-message-list .message-time{font-size:.675rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-message-list .edited-indicator{display:inline-flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline-start:.35rem;font-size:.675rem;opacity:75%}ax-conversation-message-list .status-icon{display:inline-flex;align-items:center}ax-conversation-message-list .status-icon i{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-conversation-message-list .status-read{color:rgba(var(--ax-sys-color-primary-200))}ax-conversation-message-list .status-failed{color:rgba(var(--ax-sys-color-danger-200))}ax-conversation-message-list .message-reactions-bubbles{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem}ax-conversation-message-list .reaction-bubble{margin:calc(var(--spacing, .25rem) * 0);display:inline-flex;min-height:1.375rem;cursor:pointer;align-items:center;justify-content:center;gap:.15rem;border-radius:var(--radius-xl, .75rem);padding-inline:.35rem;padding-block:.1rem;color:rgba(var(--ax-sys-color-on-surface));--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);background:rgba(var(--ax-sys-color-on-surface),.06);border:1px solid rgba(var(--ax-sys-color-on-surface),.1);transition:background-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function),border-color var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ax-conversation-message-list .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-surface),.1);border-color:rgba(var(--ax-sys-color-on-surface),.18)}ax-conversation-message-list .reaction-bubble-active{background:rgba(var(--ax-sys-color-primary-500),.12);border-color:rgba(var(--ax-sys-color-primary-500),.45)}ax-conversation-message-list .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-primary-500),.18);border-color:rgba(var(--ax-sys-color-primary-500),.55)}ax-conversation-message-list .reaction-emoji{display:inline-block;font-size:.8125rem;--tw-leading: 1;line-height:1}ax-conversation-message-list .reaction-count{font-size:.6875rem;--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-on-surface));--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);opacity:.65}ax-conversation-message-list .reaction-bubble-active .reaction-count{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-primary-600));opacity:95%}ax-conversation-message-list .message-own .reaction-bubble{color:rgba(var(--ax-sys-color-on-primary-surface));background:rgba(var(--ax-sys-color-on-primary-surface),.12);border-color:rgba(var(--ax-sys-color-on-primary-surface),.2)}ax-conversation-message-list .message-own .reaction-bubble:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.2);border-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .reaction-bubble-active{background:rgba(var(--ax-sys-color-on-primary-surface),.28);border-color:rgba(var(--ax-sys-color-on-primary-surface),.5)}ax-conversation-message-list .message-own .reaction-bubble-active:hover{background:rgba(var(--ax-sys-color-on-primary-surface),.34);border-color:rgba(var(--ax-sys-color-on-primary-surface),.6)}ax-conversation-message-list .message-own .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:80%}ax-conversation-message-list .message-own .reaction-bubble-active .reaction-count{color:rgba(var(--ax-sys-color-on-primary-surface));opacity:100%}ax-conversation-message-list .message-reactions-container{margin-top:calc(var(--spacing, .25rem) * 1);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.2rem}ax-conversation-message-list .message-own .message-reactions-container{justify-content:flex-end}ax-conversation-message-list .message-own .message-footer .edited-indicator{border-inline-start-color:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .message-own .message-footer .message-footer-split{background:rgba(var(--ax-sys-color-on-primary-surface),.35)}ax-conversation-message-list .add-reaction-button.add-reaction-outside{position:absolute;top:50%;margin:calc(var(--spacing, .25rem) * 0);box-sizing:border-box;display:none;height:1.8rem;width:1.8rem;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding:calc(var(--spacing, .25rem) * 0);inset-inline-end:-2.35rem;box-shadow:0 1px 2px #0000000f}ax-conversation-message-list .add-reaction-button{padding-inline-start:.05rem}ax-conversation-message-list .message-content-row-own .add-reaction-button.add-reaction-outside{inset-inline-start:-2.35rem;inset-inline-end:auto}ax-conversation-message-list .message-item:hover .add-reaction-button.add-reaction-outside,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{display:inline-flex}ax-conversation-message-list .add-reaction-button.add-reaction-outside:hover,ax-conversation-message-list .add-reaction-button.add-reaction-outside.add-reaction-visible{border-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .add-reaction-button.add-reaction-outside i{font-size:.9rem;color:rgba(var(--ax-sys-color-on-surface));opacity:80%}ax-conversation-message-list .reaction-bubble:focus-visible,ax-conversation-message-list .add-reaction-button:focus-visible,ax-conversation-message-list .action-trigger:focus-visible,ax-conversation-message-list ax-fab.scroll-to-bottom ax-button:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}ax-conversation-message-list .message-actions{z-index:10;padding-bottom:calc(var(--spacing, .25rem) * 6);opacity:0%;transition:opacity var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .message-item:hover .message-actions{opacity:100%}ax-conversation-message-list .action-trigger{display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}ax-conversation-message-list .action-trigger:hover{background-color:rgba(var(--ax-sys-color-light-surface))}ax-conversation-message-list .shortcut{font-size:.6875rem;opacity:70%}ax-conversation-message-list .scroll-to-bottom-wrapper{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 4);bottom:calc(var(--spacing, .25rem) * 4);z-index:999}ax-conversation-message-list ax-fab.scroll-to-bottom ax-button{display:flex;height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none}ax-conversation-message-list .scroll-to-bottom-enter{animation:axScrollToBottomEnter var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}ax-conversation-message-list .scroll-to-bottom-leave{animation:axScrollToBottomLeave var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function) both}@media(prefers-reduced-motion:reduce){ax-conversation-message-list .scroll-to-bottom-enter,ax-conversation-message-list .scroll-to-bottom-leave{animation:none}}.reaction-picker-popup{width:max-content;min-width:calc(var(--spacing, .25rem) * 0);overflow:hidden;border-radius:.65rem;background-color:rgba(var(--ax-sys-color-lightest-surface));max-width:min(260px,92vw)}.reaction-picker-header{display:flex;min-height:calc(var(--spacing, .25rem) * 0);align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-block:.45rem;padding-inline-start:.7rem;padding-inline-end:calc(var(--spacing, .25rem) * 2)}.picker-title{font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);color:rgba(var(--ax-sys-color-on-surface));opacity:85%}.picker-close{display:flex;height:1.6rem;width:1.6rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.25rem;--tw-border-style: none;border-style:none;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:.95rem;color:rgba(var(--ax-sys-color-on-surface),.55);transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function)}.picker-close:hover{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500))}.picker-close:focus-visible,.reaction-picker-emoji:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:rgba(var(--ax-sys-color-primary-surface))}.reaction-picker-emojis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.2rem;padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:.45rem;padding-bottom:calc(var(--spacing, .25rem) * 2)}.reaction-picker-emoji{height:calc(var(--spacing, .25rem) * 8);width:calc(var(--spacing, .25rem) * 8);cursor:pointer;border-radius:.45rem;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0);font-size:1.15rem;--tw-leading: 1;line-height:1;transition:all var(--ax-sys-transition-duration) var(--ax-sys-transition-timing-function);font-family:\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\",\"Apple Color Emoji\",Twemoji Mozilla,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.reaction-picker-emoji:hover{background-color:rgba(var(--ax-sys-color-lighter-surface))}.reaction-picker-emoji-active{background-color:rgba(var(--ax-sys-color-surface))}.reaction-picker-emoji-active:hover{background:rgba(var(--ax-sys-color-primary-500),.25)}}@property --tw-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{transform:translate3d(0,100%,0);opacity:0}}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
9018
8987
|
}], ctorParameters: () => [], propDecorators: { reactionPopover: [{ type: i0.ViewChild, args: ['reactionPopover', { isSignal: true }] }], messageListRef: [{ type: i0.ViewChild, args: ['messageList', { isSignal: true }] }], messagesContainerRef: [{ type: i0.ViewChild, args: ['messagesContainer', { isSignal: true }] }], messageAction: [{ type: i0.Output, args: ["messageAction"] }] } });
|
|
9019
8988
|
|
|
9020
8989
|
/**
|
|
@@ -9370,7 +9339,7 @@ class AXConversationSidebarComponent {
|
|
|
9370
9339
|
this.hasMoreConversations = this.sidebar.hasMoreConversations;
|
|
9371
9340
|
// Setup debounced search
|
|
9372
9341
|
this.searchSubject
|
|
9373
|
-
.pipe(debounceTime(this.config.debounceSearch
|
|
9342
|
+
.pipe(debounceTime(this.config.debounceSearch), distinctUntilChanged())
|
|
9374
9343
|
.subscribe((query) => {
|
|
9375
9344
|
this.sidebar.setSearchQuery(query);
|
|
9376
9345
|
});
|
|
@@ -9429,7 +9398,7 @@ class AXConversationSidebarComponent {
|
|
|
9429
9398
|
this.searchSubject.complete();
|
|
9430
9399
|
}
|
|
9431
9400
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9432
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationSidebarComponent, isStandalone: true, selector: "ax-conversation-sidebar", outputs: { conversationSelected: "conversationSelected" }, ngImport: i0, template: " <div class=\"sidebar\">\n <!-- Header with Menu and Search -->\n <div class=\"sidebar-header\">\n <!-- <ax-button [look]=\"'outline'\" [size]=\"'md'\" class=\"menu-button\">\n <i class=\"fa-light fa-bars\"></i>\n </ax-button> -->\n <div class=\"sidebar-search\">\n <ax-search-box\n [value]=\"sidebar.searchQuery()\"\n (valueChange)=\"onSearchChange($event)\"\n [placeholder]=\"'@acorex:chat.placeholders.search-conversations' | translate | async\"\n ></ax-search-box>\n </div>\n </div>\n\n <!-- Tabs -->\n <ax-tabs (onActiveTabChanged)=\"onTabChange($event)\" [look]=\"'with-line'\" [style.overflow]=\"'hidden'\">\n @for (tab of enabledTabs(); track tab.id) {\n <ax-tab-item [text]=\"getTabLabel(tab.id)\" [key]=\"tab.id\">\n @if (tab.icon) {\n <ax-prefix>\n <ax-icon>\n <i [class]=\"'tab-icon ' + tab.icon\" aria-hidden=\"true\"></i>\n </ax-icon>\n </ax-prefix>\n }\n @if (tab.badge && getBadgeValue(tab.id); as badgeText) {\n <ax-suffix>\n <ax-badge [text]=\"badgeText\" [color]=\"'primary'\" />\n </ax-suffix>\n }\n </ax-tab-item>\n }\n </ax-tabs>\n\n <!-- Conversation List -->\n <div\n class=\"sidebar-list\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold ?? 200\"\n [edge]=\"'bottom'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreConversations()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n >\n @if (loading()) {\n <!-- Skeleton Loading State -->\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"conversation-skeleton\">\n <ax-skeleton class=\"skeleton-avatar\"></ax-skeleton>\n <div class=\"skeleton-content\">\n <div class=\"skeleton-header\">\n <ax-skeleton class=\"skeleton-title\"></ax-skeleton>\n <ax-skeleton class=\"skeleton-time\"></ax-skeleton>\n </div>\n <ax-skeleton class=\"skeleton-message\"></ax-skeleton>\n </div>\n </div>\n }\n } @else if (filteredConversations().length === 0) {\n <div class=\"list-empty\">\n <div class=\"empty-icon\"><i class=\"fa-light fa-comments\"></i></div>\n <h3 class=\"empty-title\">{{ '@acorex:chat.sidebar.empty-title' | translate | async }}</h3>\n <p class=\"empty-description\">\n @if (sidebar.searchQuery()) {\n {{ '@acorex:chat.sidebar.empty-search' | translate | async }}\n } @else {\n {{ '@acorex:chat.sidebar.empty-default' | translate | async }}\n }\n </p>\n </div>\n } @else {\n @for (conversation of filteredConversations(); track conversation.id) {\n <ax-conversation-item [conversation]=\"conversation\" (clicked)=\"selectConversation($event)\" />\n }\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--append\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-more' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{ '@acorex:chat.status.loading-more' | translate | async }}</ax-label>\n </div>\n }\n }\n </div>\n\n <div class=\"new-conversation-button-container\">\n <ng-content select=\"ax-suffix\">\n <div class=\"new-conversation-button-container-inner\">\n <ax-button\n class=\"new-conversation-btn\"\n [text]=\"'@acorex:chat.actions.new-conversation' | translate | async\"\n [look]=\"'solid'\"\n (onClick)=\"openNewConversationPopup()\"\n ></ax-button>\n </div>\n </ng-content>\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-sidebar{display:block;height:100%;width:100%;@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterAppend{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeaveAppend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.35rem)}}}ax-conversation-sidebar .sidebar{position:relative;display:flex;height:100%;flex-direction:column}ax-conversation-sidebar .sidebar-header{display:flex;min-height:calc(var(--spacing, .25rem) * 16);align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .menu-button{flex-shrink:0}ax-conversation-sidebar .sidebar-search{flex:1}ax-conversation-sidebar .sidebar-list{position:relative;flex:1;overflow-y:auto;padding-bottom:calc(var(--spacing, .25rem) * 16)}ax-conversation-sidebar .new-conversation-button-container{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 1);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .new-conversation-button-container-inner{display:flex;align-items:center;justify-content:center}ax-conversation-sidebar .list-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:4rem;--tw-leading: 1;line-height:1;opacity:50%}ax-conversation-sidebar .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:300px;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-sidebar .empty-action{margin-top:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 4);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-sidebar .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5)}ax-conversation-sidebar .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-sidebar .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-sidebar .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-sidebar .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-sidebar .load-more-enter{animation:axChatLoadMoreEnterAppend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-sidebar .load-more-leave{animation:axChatLoadMoreLeaveAppend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-sidebar .load-more-dot{animation:none;opacity:.65}ax-conversation-sidebar .load-more-enter,ax-conversation-sidebar .load-more-leave{animation:none}}ax-conversation-sidebar .tab-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-sidebar .conversation-skeleton{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-sidebar .skeleton-content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-title{height:calc(var(--spacing, .25rem) * 4);flex:1;border-radius:.25rem}ax-conversation-sidebar .skeleton-time{height:calc(var(--spacing, .25rem) * 3);width:calc(var(--spacing, .25rem) * 12);border-radius:.25rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-sidebar .skeleton-message{height:calc(var(--spacing, .25rem) * 3);width:80%;border-radius:.25rem}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "component", type: AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationItemComponent, selector: "ax-conversation-item", inputs: ["conversation"], outputs: ["clicked"] }, { kind: "directive", type: AXConversationInfiniteScrollDirective, selector: "[axInfiniteScroll]", inputs: ["threshold", "edge", "scrollDisabled", "cooldownMs"], outputs: ["scrollThreshold"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
9401
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationSidebarComponent, isStandalone: true, selector: "ax-conversation-sidebar", outputs: { conversationSelected: "conversationSelected" }, ngImport: i0, template: " <div class=\"sidebar\">\n <!-- Header with Menu and Search -->\n <div class=\"sidebar-header\">\n <!-- <ax-button [look]=\"'outline'\" [size]=\"'md'\" class=\"menu-button\">\n <i class=\"fa-light fa-bars\"></i>\n </ax-button> -->\n <div class=\"sidebar-search\">\n <ax-search-box\n [value]=\"sidebar.searchQuery()\"\n (valueChange)=\"onSearchChange($event)\"\n [placeholder]=\"'@acorex:chat.placeholders.search-conversations' | translate | async\"\n ></ax-search-box>\n </div>\n </div>\n\n <!-- Tabs -->\n <ax-tabs (onActiveTabChanged)=\"onTabChange($event)\" [look]=\"'with-line'\" [style.overflow]=\"'hidden'\">\n @for (tab of enabledTabs(); track tab.id) {\n <ax-tab-item [text]=\"getTabLabel(tab.id)\" [key]=\"tab.id\">\n @if (tab.icon) {\n <ax-prefix>\n <ax-icon>\n <i [class]=\"'tab-icon ' + tab.icon\" aria-hidden=\"true\"></i>\n </ax-icon>\n </ax-prefix>\n }\n @if (tab.badge && getBadgeValue(tab.id); as badgeText) {\n <ax-suffix>\n <ax-badge [text]=\"badgeText\" [color]=\"'primary'\" />\n </ax-suffix>\n }\n </ax-tab-item>\n }\n </ax-tabs>\n\n <!-- Conversation List -->\n <div\n class=\"sidebar-list\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'bottom'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreConversations()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n >\n @if (loading()) {\n <!-- Skeleton Loading State -->\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"conversation-skeleton\">\n <ax-skeleton class=\"skeleton-avatar\"></ax-skeleton>\n <div class=\"skeleton-content\">\n <div class=\"skeleton-header\">\n <ax-skeleton class=\"skeleton-title\"></ax-skeleton>\n <ax-skeleton class=\"skeleton-time\"></ax-skeleton>\n </div>\n <ax-skeleton class=\"skeleton-message\"></ax-skeleton>\n </div>\n </div>\n }\n } @else if (filteredConversations().length === 0) {\n <div class=\"list-empty\">\n <div class=\"empty-icon\"><i class=\"fa-light fa-comments\"></i></div>\n <h3 class=\"empty-title\">{{ '@acorex:chat.sidebar.empty-title' | translate | async }}</h3>\n <p class=\"empty-description\">\n @if (sidebar.searchQuery()) {\n {{ '@acorex:chat.sidebar.empty-search' | translate | async }}\n } @else {\n {{ '@acorex:chat.sidebar.empty-default' | translate | async }}\n }\n </p>\n </div>\n } @else {\n @for (conversation of filteredConversations(); track conversation.id) {\n <ax-conversation-item [conversation]=\"conversation\" (clicked)=\"selectConversation($event)\" />\n }\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--append\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-more' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{ '@acorex:chat.status.loading-more' | translate | async }}</ax-label>\n </div>\n }\n }\n </div>\n\n <div class=\"new-conversation-button-container\">\n <ng-content select=\"ax-suffix\">\n <div class=\"new-conversation-button-container-inner\">\n <ax-button\n class=\"new-conversation-btn\"\n [text]=\"'@acorex:chat.actions.new-conversation' | translate | async\"\n [look]=\"'solid'\"\n (onClick)=\"openNewConversationPopup()\"\n ></ax-button>\n </div>\n </ng-content>\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-sidebar{display:block;height:100%;width:100%;@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterAppend{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeaveAppend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.35rem)}}}ax-conversation-sidebar .sidebar{position:relative;display:flex;height:100%;flex-direction:column}ax-conversation-sidebar .sidebar-header{display:flex;min-height:calc(var(--spacing, .25rem) * 16);align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .menu-button{flex-shrink:0}ax-conversation-sidebar .sidebar-search{flex:1}ax-conversation-sidebar .sidebar-list{position:relative;flex:1;overflow-y:auto;padding-bottom:calc(var(--spacing, .25rem) * 16)}ax-conversation-sidebar .new-conversation-button-container{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 1);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .new-conversation-button-container-inner{display:flex;align-items:center;justify-content:center}ax-conversation-sidebar .list-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:4rem;--tw-leading: 1;line-height:1;opacity:50%}ax-conversation-sidebar .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:300px;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-sidebar .empty-action{margin-top:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 4);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-sidebar .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5)}ax-conversation-sidebar .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-sidebar .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-sidebar .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-sidebar .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-sidebar .load-more-enter{animation:axChatLoadMoreEnterAppend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-sidebar .load-more-leave{animation:axChatLoadMoreLeaveAppend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-sidebar .load-more-dot{animation:none;opacity:.65}ax-conversation-sidebar .load-more-enter,ax-conversation-sidebar .load-more-leave{animation:none}}ax-conversation-sidebar .tab-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-sidebar .conversation-skeleton{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-sidebar .skeleton-content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-title{height:calc(var(--spacing, .25rem) * 4);flex:1;border-radius:.25rem}ax-conversation-sidebar .skeleton-time{height:calc(var(--spacing, .25rem) * 3);width:calc(var(--spacing, .25rem) * 12);border-radius:.25rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-sidebar .skeleton-message{height:calc(var(--spacing, .25rem) * 3);width:80%;border-radius:.25rem}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXTabsComponent, selector: "ax-tabs", inputs: ["look", "location", "fitParent", "minWidth", "content"], outputs: ["onActiveTabChanged"] }, { kind: "component", type: AXTabItemComponent, selector: "ax-tab-item", inputs: ["disabled", "text", "key", "headerTemplate", "active"], outputs: ["disabledChange", "onClick", "onBlur", "onFocus", "activeChange"] }, { kind: "component", type: AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationItemComponent, selector: "ax-conversation-item", inputs: ["conversation"], outputs: ["clicked"] }, { kind: "directive", type: AXConversationInfiniteScrollDirective, selector: "[axInfiniteScroll]", inputs: ["threshold", "edge", "scrollDisabled", "cooldownMs"], outputs: ["scrollThreshold"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
9433
9402
|
}
|
|
9434
9403
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationSidebarComponent, decorators: [{
|
|
9435
9404
|
type: Component,
|
|
@@ -9446,7 +9415,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
9446
9415
|
AXTranslationModule,
|
|
9447
9416
|
AXConversationItemComponent,
|
|
9448
9417
|
AXConversationInfiniteScrollDirective,
|
|
9449
|
-
], template: " <div class=\"sidebar\">\n <!-- Header with Menu and Search -->\n <div class=\"sidebar-header\">\n <!-- <ax-button [look]=\"'outline'\" [size]=\"'md'\" class=\"menu-button\">\n <i class=\"fa-light fa-bars\"></i>\n </ax-button> -->\n <div class=\"sidebar-search\">\n <ax-search-box\n [value]=\"sidebar.searchQuery()\"\n (valueChange)=\"onSearchChange($event)\"\n [placeholder]=\"'@acorex:chat.placeholders.search-conversations' | translate | async\"\n ></ax-search-box>\n </div>\n </div>\n\n <!-- Tabs -->\n <ax-tabs (onActiveTabChanged)=\"onTabChange($event)\" [look]=\"'with-line'\" [style.overflow]=\"'hidden'\">\n @for (tab of enabledTabs(); track tab.id) {\n <ax-tab-item [text]=\"getTabLabel(tab.id)\" [key]=\"tab.id\">\n @if (tab.icon) {\n <ax-prefix>\n <ax-icon>\n <i [class]=\"'tab-icon ' + tab.icon\" aria-hidden=\"true\"></i>\n </ax-icon>\n </ax-prefix>\n }\n @if (tab.badge && getBadgeValue(tab.id); as badgeText) {\n <ax-suffix>\n <ax-badge [text]=\"badgeText\" [color]=\"'primary'\" />\n </ax-suffix>\n }\n </ax-tab-item>\n }\n </ax-tabs>\n\n <!-- Conversation List -->\n <div\n class=\"sidebar-list\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold ?? 200\"\n [edge]=\"'bottom'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreConversations()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n >\n @if (loading()) {\n <!-- Skeleton Loading State -->\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"conversation-skeleton\">\n <ax-skeleton class=\"skeleton-avatar\"></ax-skeleton>\n <div class=\"skeleton-content\">\n <div class=\"skeleton-header\">\n <ax-skeleton class=\"skeleton-title\"></ax-skeleton>\n <ax-skeleton class=\"skeleton-time\"></ax-skeleton>\n </div>\n <ax-skeleton class=\"skeleton-message\"></ax-skeleton>\n </div>\n </div>\n }\n } @else if (filteredConversations().length === 0) {\n <div class=\"list-empty\">\n <div class=\"empty-icon\"><i class=\"fa-light fa-comments\"></i></div>\n <h3 class=\"empty-title\">{{ '@acorex:chat.sidebar.empty-title' | translate | async }}</h3>\n <p class=\"empty-description\">\n @if (sidebar.searchQuery()) {\n {{ '@acorex:chat.sidebar.empty-search' | translate | async }}\n } @else {\n {{ '@acorex:chat.sidebar.empty-default' | translate | async }}\n }\n </p>\n </div>\n } @else {\n @for (conversation of filteredConversations(); track conversation.id) {\n <ax-conversation-item [conversation]=\"conversation\" (clicked)=\"selectConversation($event)\" />\n }\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--append\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-more' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{ '@acorex:chat.status.loading-more' | translate | async }}</ax-label>\n </div>\n }\n }\n </div>\n\n <div class=\"new-conversation-button-container\">\n <ng-content select=\"ax-suffix\">\n <div class=\"new-conversation-button-container-inner\">\n <ax-button\n class=\"new-conversation-btn\"\n [text]=\"'@acorex:chat.actions.new-conversation' | translate | async\"\n [look]=\"'solid'\"\n (onClick)=\"openNewConversationPopup()\"\n ></ax-button>\n </div>\n </ng-content>\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-sidebar{display:block;height:100%;width:100%;@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterAppend{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeaveAppend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.35rem)}}}ax-conversation-sidebar .sidebar{position:relative;display:flex;height:100%;flex-direction:column}ax-conversation-sidebar .sidebar-header{display:flex;min-height:calc(var(--spacing, .25rem) * 16);align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .menu-button{flex-shrink:0}ax-conversation-sidebar .sidebar-search{flex:1}ax-conversation-sidebar .sidebar-list{position:relative;flex:1;overflow-y:auto;padding-bottom:calc(var(--spacing, .25rem) * 16)}ax-conversation-sidebar .new-conversation-button-container{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 1);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .new-conversation-button-container-inner{display:flex;align-items:center;justify-content:center}ax-conversation-sidebar .list-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:4rem;--tw-leading: 1;line-height:1;opacity:50%}ax-conversation-sidebar .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:300px;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-sidebar .empty-action{margin-top:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 4);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-sidebar .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5)}ax-conversation-sidebar .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-sidebar .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-sidebar .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-sidebar .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-sidebar .load-more-enter{animation:axChatLoadMoreEnterAppend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-sidebar .load-more-leave{animation:axChatLoadMoreLeaveAppend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-sidebar .load-more-dot{animation:none;opacity:.65}ax-conversation-sidebar .load-more-enter,ax-conversation-sidebar .load-more-leave{animation:none}}ax-conversation-sidebar .tab-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-sidebar .conversation-skeleton{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-sidebar .skeleton-content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-title{height:calc(var(--spacing, .25rem) * 4);flex:1;border-radius:.25rem}ax-conversation-sidebar .skeleton-time{height:calc(var(--spacing, .25rem) * 3);width:calc(var(--spacing, .25rem) * 12);border-radius:.25rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-sidebar .skeleton-message{height:calc(var(--spacing, .25rem) * 3);width:80%;border-radius:.25rem}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
9418
|
+
], template: " <div class=\"sidebar\">\n <!-- Header with Menu and Search -->\n <div class=\"sidebar-header\">\n <!-- <ax-button [look]=\"'outline'\" [size]=\"'md'\" class=\"menu-button\">\n <i class=\"fa-light fa-bars\"></i>\n </ax-button> -->\n <div class=\"sidebar-search\">\n <ax-search-box\n [value]=\"sidebar.searchQuery()\"\n (valueChange)=\"onSearchChange($event)\"\n [placeholder]=\"'@acorex:chat.placeholders.search-conversations' | translate | async\"\n ></ax-search-box>\n </div>\n </div>\n\n <!-- Tabs -->\n <ax-tabs (onActiveTabChanged)=\"onTabChange($event)\" [look]=\"'with-line'\" [style.overflow]=\"'hidden'\">\n @for (tab of enabledTabs(); track tab.id) {\n <ax-tab-item [text]=\"getTabLabel(tab.id)\" [key]=\"tab.id\">\n @if (tab.icon) {\n <ax-prefix>\n <ax-icon>\n <i [class]=\"'tab-icon ' + tab.icon\" aria-hidden=\"true\"></i>\n </ax-icon>\n </ax-prefix>\n }\n @if (tab.badge && getBadgeValue(tab.id); as badgeText) {\n <ax-suffix>\n <ax-badge [text]=\"badgeText\" [color]=\"'primary'\" />\n </ax-suffix>\n }\n </ax-tab-item>\n }\n </ax-tabs>\n\n <!-- Conversation List -->\n <div\n class=\"sidebar-list\"\n axInfiniteScroll\n [threshold]=\"config.infiniteScrollThreshold\"\n [edge]=\"'bottom'\"\n [scrollDisabled]=\"loading() || loadingMore() || !hasMoreConversations()\"\n (scrollThreshold)=\"onScrollThreshold($event)\"\n >\n @if (loading()) {\n <!-- Skeleton Loading State -->\n @for (i of [1, 2, 3, 4]; track i) {\n <div class=\"conversation-skeleton\">\n <ax-skeleton class=\"skeleton-avatar\"></ax-skeleton>\n <div class=\"skeleton-content\">\n <div class=\"skeleton-header\">\n <ax-skeleton class=\"skeleton-title\"></ax-skeleton>\n <ax-skeleton class=\"skeleton-time\"></ax-skeleton>\n </div>\n <ax-skeleton class=\"skeleton-message\"></ax-skeleton>\n </div>\n </div>\n }\n } @else if (filteredConversations().length === 0) {\n <div class=\"list-empty\">\n <div class=\"empty-icon\"><i class=\"fa-light fa-comments\"></i></div>\n <h3 class=\"empty-title\">{{ '@acorex:chat.sidebar.empty-title' | translate | async }}</h3>\n <p class=\"empty-description\">\n @if (sidebar.searchQuery()) {\n {{ '@acorex:chat.sidebar.empty-search' | translate | async }}\n } @else {\n {{ '@acorex:chat.sidebar.empty-default' | translate | async }}\n }\n </p>\n </div>\n } @else {\n @for (conversation of filteredConversations(); track conversation.id) {\n <ax-conversation-item [conversation]=\"conversation\" (clicked)=\"selectConversation($event)\" />\n }\n @if (loadingMore()) {\n <div\n class=\"list-loading-more list-loading-more--append\"\n role=\"status\"\n animate.enter=\"load-more-enter\"\n animate.leave=\"load-more-leave\"\n [attr.aria-label]=\"'@acorex:chat.status.loading-more' | translate | async\"\n >\n <div class=\"load-more-indicator\" aria-hidden=\"true\">\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n <span class=\"load-more-dot\"></span>\n </div>\n <ax-label class=\"load-more-label\">{{ '@acorex:chat.status.loading-more' | translate | async }}</ax-label>\n </div>\n }\n }\n </div>\n\n <div class=\"new-conversation-button-container\">\n <ng-content select=\"ax-suffix\">\n <div class=\"new-conversation-button-container-inner\">\n <ax-button\n class=\"new-conversation-btn\"\n [text]=\"'@acorex:chat.actions.new-conversation' | translate | async\"\n [look]=\"'solid'\"\n (onClick)=\"openNewConversationPopup()\"\n ></ax-button>\n </div>\n </ng-content>\n </div>\n </div>\n", styles: ["@layer properties;@layer components{ax-conversation-sidebar{display:block;height:100%;width:100%;@keyframes axChatLoadMoreDot{0%,70%,to{transform:translateY(0) scale(1);opacity:.4}35%{transform:translateY(-.28rem) scale(1.08);opacity:1}}@keyframes axChatLoadMoreEnterAppend{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes axChatLoadMoreLeaveAppend{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(.35rem)}}}ax-conversation-sidebar .sidebar{position:relative;display:flex;height:100%;flex-direction:column}ax-conversation-sidebar .sidebar-header{display:flex;min-height:calc(var(--spacing, .25rem) * 16);align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .menu-button{flex-shrink:0}ax-conversation-sidebar .sidebar-search{flex:1}ax-conversation-sidebar .sidebar-list{position:relative;flex:1;overflow-y:auto;padding-bottom:calc(var(--spacing, .25rem) * 16)}ax-conversation-sidebar .new-conversation-button-container{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 1);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .new-conversation-button-container-inner{display:flex;align-items:center;justify-content:center}ax-conversation-sidebar .list-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing, .25rem) * 8);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 8);padding-block:calc(var(--spacing, .25rem) * 12);text-align:center;color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-icon{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:4rem;--tw-leading: 1;line-height:1;opacity:50%}ax-conversation-sidebar .empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}ax-conversation-sidebar .empty-description{margin:calc(var(--spacing, .25rem) * 0);max-width:300px;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-normal, 1.5);line-height:var(--leading-normal, 1.5);color:rgba(var(--ax-sys-color-on-surface));opacity:70%}ax-conversation-sidebar .empty-action{margin-top:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .list-loading-more{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 4);text-align:center;color:rgba(var(--ax-sys-color-on-surface));opacity:85%}ax-conversation-sidebar .load-more-indicator{display:flex;min-height:calc(var(--spacing, .25rem) * 5);align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5)}ax-conversation-sidebar .load-more-dot{height:.4rem;width:.4rem;border-radius:calc(infinity * 1px);background-color:rgba(var(--ax-sys-color-primary-500));animation:axChatLoadMoreDot 1s ease-in-out infinite}ax-conversation-sidebar .load-more-dot:nth-child(2){animation-delay:.14s}ax-conversation-sidebar .load-more-dot:nth-child(3){animation-delay:.28s}ax-conversation-sidebar .load-more-label{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);opacity:70%}ax-conversation-sidebar .load-more-enter{animation:axChatLoadMoreEnterAppend .32s cubic-bezier(.22,1,.36,1) both}ax-conversation-sidebar .load-more-leave{animation:axChatLoadMoreLeaveAppend .22s ease both}@media(prefers-reduced-motion:reduce){ax-conversation-sidebar .load-more-dot{animation:none;opacity:.65}ax-conversation-sidebar .load-more-enter,ax-conversation-sidebar .load-more-leave{animation:none}}ax-conversation-sidebar .tab-icon{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ))}ax-conversation-sidebar .conversation-skeleton{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 3)}ax-conversation-sidebar .skeleton-avatar{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12);flex-shrink:0;border-radius:calc(infinity * 1px)}ax-conversation-sidebar .skeleton-content{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-header{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2)}ax-conversation-sidebar .skeleton-title{height:calc(var(--spacing, .25rem) * 4);flex:1;border-radius:.25rem}ax-conversation-sidebar .skeleton-time{height:calc(var(--spacing, .25rem) * 3);width:calc(var(--spacing, .25rem) * 12);border-radius:.25rem;--tw-numeric-spacing: tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}ax-conversation-sidebar .skeleton-message{height:calc(var(--spacing, .25rem) * 3);width:80%;border-radius:.25rem}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-ordinal{syntax: \"*\"; inherits: false;}@property --tw-slashed-zero{syntax: \"*\"; inherits: false;}@property --tw-numeric-figure{syntax: \"*\"; inherits: false;}@property --tw-numeric-spacing{syntax: \"*\"; inherits: false;}@property --tw-numeric-fraction{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial;--tw-tracking: initial;--tw-ordinal: initial;--tw-slashed-zero: initial;--tw-numeric-figure: initial;--tw-numeric-spacing: initial;--tw-numeric-fraction: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
9450
9419
|
}], ctorParameters: () => [], propDecorators: { conversationSelected: [{ type: i0.Output, args: ["conversationSelected"] }] } });
|
|
9451
9420
|
|
|
9452
9421
|
class AXConversationNewDialogComponent extends AXBasePageComponent {
|
|
@@ -9591,7 +9560,7 @@ class AXConversationNewDialogComponent extends AXBasePageComponent {
|
|
|
9591
9560
|
this.searchDebounceTimer = setTimeout(() => {
|
|
9592
9561
|
this.searchDebounceTimer = undefined;
|
|
9593
9562
|
this.usersList()?.refresh(false);
|
|
9594
|
-
}, this.config.debounceSearch
|
|
9563
|
+
}, this.config.debounceSearch);
|
|
9595
9564
|
}
|
|
9596
9565
|
isUserSelected(id) {
|
|
9597
9566
|
return this.selectedUserIds().includes(id);
|
|
@@ -9962,6 +9931,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
9962
9931
|
/**
|
|
9963
9932
|
* Shared upload state and helpers for composer media pickers.
|
|
9964
9933
|
*/
|
|
9934
|
+
let pickerUploadItemIdSeq = 0;
|
|
9935
|
+
/** Stable id for `@for` tracking while upload state is patched immutably. */
|
|
9936
|
+
function createPickerUploadItemId() {
|
|
9937
|
+
if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
|
|
9938
|
+
return crypto.randomUUID();
|
|
9939
|
+
}
|
|
9940
|
+
pickerUploadItemIdSeq += 1;
|
|
9941
|
+
return `picker-upload-${pickerUploadItemIdSeq}`;
|
|
9942
|
+
}
|
|
9965
9943
|
function getPickerCancelUploadLabel(translation) {
|
|
9966
9944
|
return translation.translateSync('@acorex:chat.pickers.common.cancel-upload');
|
|
9967
9945
|
}
|
|
@@ -10303,7 +10281,7 @@ class AXConversationAudioPickerComponent {
|
|
|
10303
10281
|
let index = -1;
|
|
10304
10282
|
this.audioFiles.update((audios) => {
|
|
10305
10283
|
index = audios.length;
|
|
10306
|
-
return [...audios, { file, duration, dataUrl, uploadProgress: 0, uploading: true }];
|
|
10284
|
+
return [...audios, { id: createPickerUploadItemId(), file, duration, dataUrl, uploadProgress: 0, uploading: true }];
|
|
10307
10285
|
});
|
|
10308
10286
|
if (index >= 0) {
|
|
10309
10287
|
void this.uploadAudioAt(index, file);
|
|
@@ -10451,7 +10429,7 @@ class AXConversationAudioPickerComponent {
|
|
|
10451
10429
|
});
|
|
10452
10430
|
}
|
|
10453
10431
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationAudioPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10454
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationAudioPickerComponent, isStandalone: true, selector: "ax-conversation-audio-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.audio.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (audioFiles().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (audio of audioFiles(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n <i [class]=\"typeIconClass\"></i>\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ audio.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (audio.uploading) {\n <span>{{ getUploadingLabel(audio.uploadProgress ?? 0) }}</span>\n } @else if (audio.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (audio.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ audio.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(audio.file.size) }}</span>\n @if (audio.duration) {\n <span>{{ formatDuration(audio.duration) }}</span>\n }\n }\n </div>\n @if (audio.uploading || audio.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"audio.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeAudio($index)\"\n [attr.aria-label]=\"\n audio.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (audioFiles().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendAudio()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10432
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationAudioPickerComponent, isStandalone: true, selector: "ax-conversation-audio-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.audio.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (audioFiles().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (audio of audioFiles(); track audio.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n <i [class]=\"typeIconClass\"></i>\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ audio.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (audio.uploading) {\n <span>{{ getUploadingLabel(audio.uploadProgress ?? 0) }}</span>\n } @else if (audio.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (audio.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ audio.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(audio.file.size) }}</span>\n @if (audio.duration) {\n <span>{{ formatDuration(audio.duration) }}</span>\n }\n }\n </div>\n @if (audio.uploading || audio.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"audio.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeAudio($index)\"\n [attr.aria-label]=\"\n audio.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (audioFiles().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendAudio()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10455
10433
|
}
|
|
10456
10434
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationAudioPickerComponent, decorators: [{
|
|
10457
10435
|
type: Component,
|
|
@@ -10465,7 +10443,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
10465
10443
|
AXConversationPickerToolbarComponent,
|
|
10466
10444
|
AXConversationPickerCaptionComponent,
|
|
10467
10445
|
AXConversationPickerShellComponent,
|
|
10468
|
-
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.audio.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (audioFiles().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (audio of audioFiles(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n <i [class]=\"typeIconClass\"></i>\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ audio.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (audio.uploading) {\n <span>{{ getUploadingLabel(audio.uploadProgress ?? 0) }}</span>\n } @else if (audio.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (audio.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ audio.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(audio.file.size) }}</span>\n @if (audio.duration) {\n <span>{{ formatDuration(audio.duration) }}</span>\n }\n }\n </div>\n @if (audio.uploading || audio.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"audio.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeAudio($index)\"\n [attr.aria-label]=\"\n audio.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (audioFiles().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendAudio()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
10446
|
+
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.audio.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (audioFiles().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (audio of audioFiles(); track audio.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n <i [class]=\"typeIconClass\"></i>\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ audio.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (audio.uploading) {\n <span>{{ getUploadingLabel(audio.uploadProgress ?? 0) }}</span>\n } @else if (audio.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (audio.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ audio.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(audio.file.size) }}</span>\n @if (audio.duration) {\n <span>{{ formatDuration(audio.duration) }}</span>\n }\n }\n </div>\n @if (audio.uploading || audio.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"audio.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeAudio($index)\"\n [attr.aria-label]=\"\n audio.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (audioFiles().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendAudio()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
10469
10447
|
}], ctorParameters: () => [], propDecorators: { service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], conversation: [{ type: i0.Input, args: [{ isSignal: true, alias: "conversation", required: true }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], initialFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFiles", required: false }] }], autoRun: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoRun", required: false }] }], __popup__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__popup__", required: false }] }], __actionSheet__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__actionSheet__", required: false }] }] } });
|
|
10470
10448
|
|
|
10471
10449
|
var audioPicker_component = /*#__PURE__*/Object.freeze({
|
|
@@ -10874,7 +10852,10 @@ class AXConversationFilePickerComponent {
|
|
|
10874
10852
|
let fileIndex = -1;
|
|
10875
10853
|
this.files.update((files) => {
|
|
10876
10854
|
fileIndex = files.length;
|
|
10877
|
-
return [
|
|
10855
|
+
return [
|
|
10856
|
+
...files,
|
|
10857
|
+
{ id: createPickerUploadItemId(), file, preview, icon, type: pickerKind, uploadProgress: 0, uploading: true },
|
|
10858
|
+
];
|
|
10878
10859
|
});
|
|
10879
10860
|
if (fileIndex >= 0) {
|
|
10880
10861
|
void this.uploadFile(fileIndex, file);
|
|
@@ -11044,7 +11025,7 @@ class AXConversationFilePickerComponent {
|
|
|
11044
11025
|
});
|
|
11045
11026
|
}
|
|
11046
11027
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationFilePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11047
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationFilePickerComponent, isStandalone: true, selector: "ax-conversation-file-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.files.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (files().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (file of files(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (file.type === 'image' && file.preview) {\n <img [src]=\"file.preview\" [alt]=\"file.file.name\" />\n } @else {\n <i [class]=\"file.icon\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ file.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (file.uploading) {\n <span>{{ getUploadingLabel(file.uploadProgress ?? 0) }}</span>\n } @else if (file.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (file.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ file.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(file.file.size) }}</span>\n }\n </div>\n @if (file.uploading || file.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"file.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeFile($index)\"\n [attr.aria-label]=\"\n file.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (files().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendButtonText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendFiles()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
11028
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationFilePickerComponent, isStandalone: true, selector: "ax-conversation-file-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.files.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (files().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (file of files(); track file.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (file.type === 'image' && file.preview) {\n <img [src]=\"file.preview\" [alt]=\"file.file.name\" />\n } @else {\n <i [class]=\"file.icon\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ file.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (file.uploading) {\n <span>{{ getUploadingLabel(file.uploadProgress ?? 0) }}</span>\n } @else if (file.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (file.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ file.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(file.file.size) }}</span>\n }\n </div>\n @if (file.uploading || file.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"file.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeFile($index)\"\n [attr.aria-label]=\"\n file.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (files().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendButtonText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendFiles()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
11048
11029
|
}
|
|
11049
11030
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationFilePickerComponent, decorators: [{
|
|
11050
11031
|
type: Component,
|
|
@@ -11058,7 +11039,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
11058
11039
|
AXConversationPickerToolbarComponent,
|
|
11059
11040
|
AXConversationPickerCaptionComponent,
|
|
11060
11041
|
AXConversationPickerShellComponent,
|
|
11061
|
-
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.files.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (files().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (file of files(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (file.type === 'image' && file.preview) {\n <img [src]=\"file.preview\" [alt]=\"file.file.name\" />\n } @else {\n <i [class]=\"file.icon\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ file.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (file.uploading) {\n <span>{{ getUploadingLabel(file.uploadProgress ?? 0) }}</span>\n } @else if (file.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (file.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ file.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(file.file.size) }}</span>\n }\n </div>\n @if (file.uploading || file.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"file.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeFile($index)\"\n [attr.aria-label]=\"\n file.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (files().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendButtonText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendFiles()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
11042
|
+
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.files.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (files().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (file of files(); track file.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (file.type === 'image' && file.preview) {\n <img [src]=\"file.preview\" [alt]=\"file.file.name\" />\n } @else {\n <i [class]=\"file.icon\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ file.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (file.uploading) {\n <span>{{ getUploadingLabel(file.uploadProgress ?? 0) }}</span>\n } @else if (file.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (file.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ file.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(file.file.size) }}</span>\n }\n </div>\n @if (file.uploading || file.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"file.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeFile($index)\"\n [attr.aria-label]=\"\n file.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (files().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendButtonText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendFiles()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
11062
11043
|
}], ctorParameters: () => [], propDecorators: { service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], conversation: [{ type: i0.Input, args: [{ isSignal: true, alias: "conversation", required: true }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], initialFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFiles", required: false }] }], autoRun: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoRun", required: false }] }], __popup__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__popup__", required: false }] }], __actionSheet__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__actionSheet__", required: false }] }] } });
|
|
11063
11044
|
|
|
11064
11045
|
var filePicker_component = /*#__PURE__*/Object.freeze({
|
|
@@ -11264,7 +11245,7 @@ class AXConversationImagePickerComponent {
|
|
|
11264
11245
|
let index = -1;
|
|
11265
11246
|
this.images.update((images) => {
|
|
11266
11247
|
index = images.length;
|
|
11267
|
-
return [...images, { file, preview, uploadProgress: 0, uploading: true }];
|
|
11248
|
+
return [...images, { id: createPickerUploadItemId(), file, preview, uploadProgress: 0, uploading: true }];
|
|
11268
11249
|
});
|
|
11269
11250
|
if (index >= 0) {
|
|
11270
11251
|
void this.uploadImageAt(index, file);
|
|
@@ -11400,7 +11381,7 @@ class AXConversationImagePickerComponent {
|
|
|
11400
11381
|
});
|
|
11401
11382
|
}
|
|
11402
11383
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationImagePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
11403
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationImagePickerComponent, isStandalone: true, selector: "ax-conversation-image-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.images.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (images().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__grid\">\n @for (image of images(); track $index) {\n <div class=\"ax-conversation-picker__tile\">\n <img [src]=\"image.preview\" [alt]=\"image.file.name\" />\n @if (image.uploading || image.uploaded || image.error) {\n <div class=\"ax-conversation-picker__tile-overlay\">\n @if (image.uploading) {\n <span class=\"ax-conversation-picker__tile-status\">{{\n getUploadingLabel(image.uploadProgress ?? 0)\n }}</span>\n <ax-progress-bar [progress]=\"image.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n } @else if (image.uploaded) {\n <span class=\"ax-conversation-picker__tile-status\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (image.error) {\n <span class=\"ax-conversation-picker__tile-status\">{{ image.error }}</span>\n }\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-picker__tile-remove\"\n (click)=\"removeImage($index)\"\n [attr.aria-label]=\"\n image.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (images().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendImages()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
11384
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationImagePickerComponent, isStandalone: true, selector: "ax-conversation-image-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.images.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (images().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__grid\">\n @for (image of images(); track image.id) {\n <div class=\"ax-conversation-picker__tile\">\n <img [src]=\"image.preview\" [alt]=\"image.file.name\" />\n @if (image.uploading || image.uploaded || image.error) {\n <div class=\"ax-conversation-picker__tile-overlay\">\n @if (image.uploading) {\n <span class=\"ax-conversation-picker__tile-status\">{{\n getUploadingLabel(image.uploadProgress ?? 0)\n }}</span>\n <ax-progress-bar [progress]=\"image.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n } @else if (image.uploaded) {\n <span class=\"ax-conversation-picker__tile-status\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (image.error) {\n <span class=\"ax-conversation-picker__tile-status\">{{ image.error }}</span>\n }\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-picker__tile-remove\"\n (click)=\"removeImage($index)\"\n [attr.aria-label]=\"\n image.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (images().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendImages()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
11404
11385
|
}
|
|
11405
11386
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationImagePickerComponent, decorators: [{
|
|
11406
11387
|
type: Component,
|
|
@@ -11414,7 +11395,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
11414
11395
|
AXConversationPickerToolbarComponent,
|
|
11415
11396
|
AXConversationPickerCaptionComponent,
|
|
11416
11397
|
AXConversationPickerShellComponent,
|
|
11417
|
-
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.images.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (images().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__grid\">\n @for (image of images(); track $index) {\n <div class=\"ax-conversation-picker__tile\">\n <img [src]=\"image.preview\" [alt]=\"image.file.name\" />\n @if (image.uploading || image.uploaded || image.error) {\n <div class=\"ax-conversation-picker__tile-overlay\">\n @if (image.uploading) {\n <span class=\"ax-conversation-picker__tile-status\">{{\n getUploadingLabel(image.uploadProgress ?? 0)\n }}</span>\n <ax-progress-bar [progress]=\"image.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n } @else if (image.uploaded) {\n <span class=\"ax-conversation-picker__tile-status\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (image.error) {\n <span class=\"ax-conversation-picker__tile-status\">{{ image.error }}</span>\n }\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-picker__tile-remove\"\n (click)=\"removeImage($index)\"\n [attr.aria-label]=\"\n image.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (images().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendImages()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
11398
|
+
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.images.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (images().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__grid\">\n @for (image of images(); track image.id) {\n <div class=\"ax-conversation-picker__tile\">\n <img [src]=\"image.preview\" [alt]=\"image.file.name\" />\n @if (image.uploading || image.uploaded || image.error) {\n <div class=\"ax-conversation-picker__tile-overlay\">\n @if (image.uploading) {\n <span class=\"ax-conversation-picker__tile-status\">{{\n getUploadingLabel(image.uploadProgress ?? 0)\n }}</span>\n <ax-progress-bar [progress]=\"image.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n } @else if (image.uploaded) {\n <span class=\"ax-conversation-picker__tile-status\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (image.error) {\n <span class=\"ax-conversation-picker__tile-status\">{{ image.error }}</span>\n }\n </div>\n }\n <button\n type=\"button\"\n class=\"ax-conversation-picker__tile-remove\"\n (click)=\"removeImage($index)\"\n [attr.aria-label]=\"\n image.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (images().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendImages()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
11418
11399
|
}], ctorParameters: () => [], propDecorators: { service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], conversation: [{ type: i0.Input, args: [{ isSignal: true, alias: "conversation", required: true }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], initialFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFiles", required: false }] }], autoRun: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoRun", required: false }] }], __popup__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__popup__", required: false }] }], __actionSheet__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__actionSheet__", required: false }] }] } });
|
|
11419
11400
|
|
|
11420
11401
|
var imagePicker_component = /*#__PURE__*/Object.freeze({
|
|
@@ -11935,7 +11916,7 @@ class AXConversationVideoPickerComponent {
|
|
|
11935
11916
|
let index = -1;
|
|
11936
11917
|
this.videos.update((videos) => {
|
|
11937
11918
|
index = videos.length;
|
|
11938
|
-
return [...videos, { file, preview, duration, uploadProgress: 0, uploading: true }];
|
|
11919
|
+
return [...videos, { id: createPickerUploadItemId(), file, preview, duration, uploadProgress: 0, uploading: true }];
|
|
11939
11920
|
});
|
|
11940
11921
|
if (index >= 0) {
|
|
11941
11922
|
void this.uploadVideoAt(index, file);
|
|
@@ -12083,7 +12064,7 @@ class AXConversationVideoPickerComponent {
|
|
|
12083
12064
|
});
|
|
12084
12065
|
}
|
|
12085
12066
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationVideoPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12086
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationVideoPickerComponent, isStandalone: true, selector: "ax-conversation-video-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.videos.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (videos().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (video of videos(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (video.preview) {\n <video [src]=\"video.preview\" muted playsinline preload=\"metadata\"></video>\n <span class=\"ax-conversation-picker__thumb-badge\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-play\"></i\n ></span>\n } @else {\n <i [class]=\"typeIconClass\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ video.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (video.uploading) {\n <span>{{ getUploadingLabel(video.uploadProgress ?? 0) }}</span>\n } @else if (video.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (video.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ video.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(video.file.size) }}</span>\n @if (video.duration) {\n <span>{{ formatDuration(video.duration) }}</span>\n }\n }\n </div>\n @if (video.uploading || video.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"video.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeVideo($index)\"\n [attr.aria-label]=\"\n video.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (videos().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendVideos()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
12067
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXConversationVideoPickerComponent, isStandalone: true, selector: "ax-conversation-video-picker", inputs: { service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: true, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, initialFiles: { classPropertyName: "initialFiles", publicName: "initialFiles", isSignal: true, isRequired: false, transformFunction: null }, autoRun: { classPropertyName: "autoRun", publicName: "autoRun", isSignal: true, isRequired: false, transformFunction: null }, __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null }, __actionSheet__: { classPropertyName: "__actionSheet__", publicName: "__actionSheet__", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.videos.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (videos().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (video of videos(); track video.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (video.preview) {\n <video [src]=\"video.preview\" muted playsinline preload=\"metadata\"></video>\n <span class=\"ax-conversation-picker__thumb-badge\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-play\"></i\n ></span>\n } @else {\n <i [class]=\"typeIconClass\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ video.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (video.uploading) {\n <span>{{ getUploadingLabel(video.uploadProgress ?? 0) }}</span>\n } @else if (video.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (video.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ video.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(video.file.size) }}</span>\n @if (video.duration) {\n <span>{{ formatDuration(video.duration) }}</span>\n }\n }\n </div>\n @if (video.uploading || video.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"video.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeVideo($index)\"\n [attr.aria-label]=\"\n video.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (videos().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendVideos()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXProgressBarModule }, { kind: "component", type: i1$3.AXProgressBarComponent, selector: "ax-progress-bar", inputs: ["color", "mode", "progress", "height"], outputs: ["ValueChange", "sizeChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "component", type: AXConversationPickerHeaderComponent, selector: "ax-conversation-picker-header", inputs: ["title"], outputs: ["onClose"] }, { kind: "component", type: AXConversationPickerFooterComponent, selector: "ax-conversation-picker-footer", inputs: ["sendText", "sendDisabled"], outputs: ["onCancel", "onSend"] }, { kind: "component", type: AXConversationPickerEmptyComponent, selector: "ax-conversation-picker-empty", inputs: ["title", "hint", "iconClass", "dragOver"] }, { kind: "component", type: AXConversationPickerToolbarComponent, selector: "ax-conversation-picker-toolbar", inputs: ["countLabel", "addMoreLabel"] }, { kind: "component", type: AXConversationPickerCaptionComponent, selector: "ax-conversation-picker-caption", inputs: ["caption"], outputs: ["captionChange"] }, { kind: "component", type: AXConversationPickerShellComponent, selector: "ax-conversation-picker-shell", inputs: ["fileType", "multiple"], outputs: ["filesSelected", "dragEnter", "dragLeave", "dragOver"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
12087
12068
|
}
|
|
12088
12069
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXConversationVideoPickerComponent, decorators: [{
|
|
12089
12070
|
type: Component,
|
|
@@ -12097,7 +12078,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
12097
12078
|
AXConversationPickerToolbarComponent,
|
|
12098
12079
|
AXConversationPickerCaptionComponent,
|
|
12099
12080
|
AXConversationPickerShellComponent,
|
|
12100
|
-
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.videos.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (videos().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (video of videos(); track $index) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (video.preview) {\n <video [src]=\"video.preview\" muted playsinline preload=\"metadata\"></video>\n <span class=\"ax-conversation-picker__thumb-badge\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-play\"></i\n ></span>\n } @else {\n <i [class]=\"typeIconClass\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ video.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (video.uploading) {\n <span>{{ getUploadingLabel(video.uploadProgress ?? 0) }}</span>\n } @else if (video.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (video.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ video.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(video.file.size) }}</span>\n @if (video.duration) {\n <span>{{ formatDuration(video.duration) }}</span>\n }\n }\n </div>\n @if (video.uploading || video.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"video.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeVideo($index)\"\n [attr.aria-label]=\"\n video.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (videos().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendVideos()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
12081
|
+
], template: "<ax-conversation-picker-shell\n [fileType]=\"catalogFileType\"\n [multiple]=\"allowMultiple()\"\n (filesSelected)=\"handleFiles($event)\"\n (dragEnter)=\"isDragging.set(true)\"\n (dragLeave)=\"isDragging.set(false)\"\n>\n <ax-conversation-picker-header\n [title]=\"translation.translateSync('@acorex:chat.pickers.videos.title')\"\n (onClose)=\"cancel()\"\n />\n\n <div class=\"ax-conversation-picker__scroll\">\n @if (videos().length === 0) {\n <ax-conversation-picker-empty\n [title]=\"getEmptyTitle()\"\n [hint]=\"getEmptySubtitle()\"\n [iconClass]=\"emptyIconClass()\"\n [dragOver]=\"isDragging()\"\n />\n } @else {\n <div class=\"ax-conversation-picker__body\">\n <ax-conversation-picker-toolbar\n [countLabel]=\"getSelectedCountText()\"\n [addMoreLabel]=\"translation.translateSync('@acorex:chat.pickers.common.add-more')\"\n />\n\n <div class=\"ax-conversation-picker__list\">\n @for (video of videos(); track video.id) {\n <div class=\"ax-conversation-picker__row\">\n <div class=\"ax-conversation-picker__thumb\">\n @if (video.preview) {\n <video [src]=\"video.preview\" muted playsinline preload=\"metadata\"></video>\n <span class=\"ax-conversation-picker__thumb-badge\" aria-hidden=\"true\"\n ><i class=\"fa-solid fa-play\"></i\n ></span>\n } @else {\n <i [class]=\"typeIconClass\"></i>\n }\n </div>\n <div class=\"ax-conversation-picker__details\">\n <div class=\"ax-conversation-picker__name\">{{ video.file.name }}</div>\n <div class=\"ax-conversation-picker__status\">\n @if (video.uploading) {\n <span>{{ getUploadingLabel(video.uploadProgress ?? 0) }}</span>\n } @else if (video.uploaded) {\n <span class=\"ax-conversation-picker__status--ok\"\n ><i class=\"fa-light fa-check\"></i>\n {{ translation.translateSync('@acorex:chat.pickers.files.uploaded') }}</span\n >\n } @else if (video.error) {\n <span class=\"ax-conversation-picker__status--err\"\n ><i class=\"fa-light fa-xmark\"></i> {{ video.error }}</span\n >\n } @else {\n <span>{{ formatFileSize(video.file.size) }}</span>\n @if (video.duration) {\n <span>{{ formatDuration(video.duration) }}</span>\n }\n }\n </div>\n @if (video.uploading || video.uploaded) {\n <div class=\"ax-conversation-picker__progress\">\n <ax-progress-bar [progress]=\"video.uploadProgress || 0\" [mode]=\"'determinate'\" [height]=\"3\" />\n </div>\n }\n </div>\n <button\n type=\"button\"\n class=\"ax-conversation-picker__remove\"\n (click)=\"removeVideo($index)\"\n [attr.aria-label]=\"\n video.uploading\n ? getCancelUploadLabel()\n : translation.translateSync('@acorex:chat.pickers.common.remove')\n \"\n >\n <i class=\"fa-light fa-xmark\"></i>\n </button>\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n <ax-conversation-picker-caption [(caption)]=\"caption\" />\n\n @if (videos().length > 0) {\n <ax-conversation-picker-footer\n [sendText]=\"getSendText()\"\n [sendDisabled]=\"!canSend()\"\n (onCancel)=\"cancel()\"\n (onSend)=\"sendVideos()\"\n />\n }\n</ax-conversation-picker-shell>\n", styles: ["@layer properties;@layer components{.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(32rem,90dvh);width:min(28rem,93vw)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-main-container{min-height:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;padding:calc(var(--spacing, .25rem) * 0)}.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup-body-container>ng-component{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex-direction:column}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup .ax-popup{max-height:min(28rem,92dvh);width:93vw}}.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(40rem,92dvh);width:min(32rem,93vw)}@media(max-width:480px){.ax-popup-overlay.ax-conversation-composer-picker-popup--location .ax-popup{max-height:min(90dvh,92dvh)}}}@layer components{ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%;max-width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__scroll{min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 3);display:flex;min-height:8.5rem;cursor:pointer;touch-action:manipulation;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;--tw-border-style: dashed;border-style:dashed;border-color:rgba(var(--ax-sys-color-border-surface));padding:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 3);text-align:center;transition:border-color .15s ease,background-color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty--drag{border-color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.06)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-icon{font-size:1.75rem;--tw-leading: 1;line-height:1;color:rgba(var(--ax-sys-color-on-surface),.55)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-title{margin:calc(var(--spacing, .25rem) * 0);font-size:.8125rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty-hint{margin:calc(var(--spacing, .25rem) * 0);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:rgba(var(--ax-sys-color-on-surface),.6)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 3)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__list{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * 2);padding-top:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2.5);border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-surface));padding-inline:calc(var(--spacing, .25rem) * 2.5);padding-block:calc(var(--spacing, .25rem) * 2);transition:background-color .15s ease}@media(hover:hover){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row:hover{background-color:rgba(var(--ax-sys-color-light-surface))}}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 10);width:calc(var(--spacing, .25rem) * 10);flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--ax-sys-border-radius);font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:rgba(var(--ax-sys-color-primary-surface));background:rgba(var(--ax-sys-color-primary-500),.1)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb img,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb video{pointer-events:none;display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb-badge{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);display:flex;align-items:center;justify-content:center;font-size:.625rem;color:rgba(var(--ax-sys-color-light-surface));background:#00000052}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__details{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__name{overflow:hidden;font-size:.8125rem;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);text-overflow:ellipsis;white-space:nowrap;color:rgba(var(--ax-sys-color-on-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status{display:flex;flex-wrap:wrap;gap:calc(var(--spacing, .25rem) * 1.5);font-size:.6875rem;color:rgba(var(--ax-sys-color-on-surface),.65)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--ok{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-success-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__status--err{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);color:rgba(var(--ax-sys-color-danger-600))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__progress{margin-top:calc(var(--spacing, .25rem) * .5);width:100%}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove{display:flex;height:calc(var(--spacing, .25rem) * 11);width:calc(var(--spacing, .25rem) * 11);flex-shrink:0;cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:var(--ax-sys-border-radius);--tw-border-style: none;border-style:none;background-color:transparent;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));color:rgba(var(--ax-sys-color-on-surface),.55);transition:background-color .15s ease,color .15s ease}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:hover,:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__remove:focus-visible{background-color:rgba(var(--ax-sys-color-danger-lightest-surface));color:rgba(var(--ax-sys-color-danger-500));--tw-outline-style: none;outline-style:none}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{display:grid;gap:calc(var(--spacing, .25rem) * 2);grid-template-columns:repeat(auto-fill,minmax(5.25rem,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile{position:relative;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile img{display:block;height:100%;width:100%;object-fit:cover}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-remove{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1);z-index:20;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);cursor:pointer;touch-action:manipulation;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);--tw-border-style: none;border-style:none;background-color:rgba(var(--ax-sys-color-danger-500));font-size:.6875rem;color:rgba(var(--ax-sys-color-light-surface));box-shadow:0 1px 3px #0003}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-overlay{position:absolute;inset-inline:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);padding:calc(var(--spacing, .25rem) * 1);background:linear-gradient(transparent,#0000008c)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__tile-status{font-size:.625rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:rgba(var(--ax-sys-color-light-surface))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__caption-slot{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__input-hidden{display:none}@container picker (max-width: 480px){:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__grid{gap:calc(var(--spacing, .25rem) * 1.5);grid-template-columns:repeat(3,minmax(0,1fr))}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__row{gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1.5)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__thumb{height:calc(var(--spacing, .25rem) * 9);width:calc(var(--spacing, .25rem) * 9)}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__empty{margin:calc(var(--spacing, .25rem) * 2);min-height:7.5rem}:is(ax-conversation-picker-empty,ax-conversation-image-picker,ax-conversation-video-picker,ax-conversation-audio-picker,ax-conversation-file-picker,ax-conversation-location-picker) .ax-conversation-picker__body{padding-inline:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 2)}}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
12101
12082
|
}], ctorParameters: () => [], propDecorators: { service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], conversation: [{ type: i0.Input, args: [{ isSignal: true, alias: "conversation", required: true }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], initialFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFiles", required: false }] }], autoRun: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoRun", required: false }] }], __popup__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__popup__", required: false }] }], __actionSheet__: [{ type: i0.Input, args: [{ isSignal: true, alias: "__actionSheet__", required: false }] }] } });
|
|
12102
12083
|
|
|
12103
12084
|
var videoPicker_component = /*#__PURE__*/Object.freeze({
|
|
@@ -12778,7 +12759,7 @@ class AXConversationInfoBarSearchComponent {
|
|
|
12778
12759
|
this.searchDebounceTimer = setTimeout(() => {
|
|
12779
12760
|
this.searchDebounceTimer = undefined;
|
|
12780
12761
|
void this.performSearch(trimmed);
|
|
12781
|
-
}, this.config.debounceSearch
|
|
12762
|
+
}, this.config.debounceSearch);
|
|
12782
12763
|
}
|
|
12783
12764
|
/** Perform server-side search in messages */
|
|
12784
12765
|
async performSearch(query) {
|
|
@@ -15273,5 +15254,5 @@ function getErrorMessage(code, params) {
|
|
|
15273
15254
|
* Generated bundle index. Do not edit.
|
|
15274
15255
|
*/
|
|
15275
15256
|
|
|
15276
|
-
export { AXConversationApi, AXConversationApiLoggerService, AXConversationAudioAttachmentComponent, AXConversationAudioFileTypeProvider, AXConversationAudioPickerComponent, AXConversationAudioRendererComponent, AXConversationAvatarComponent, AXConversationAvatarPickerComponent, AXConversationBaseRegistry, AXConversationComposerActionRegistry, AXConversationComposerComponent, AXConversationComposerFileTypesProvider, AXConversationComposerGenerationStateService, AXConversationComposerPopupComponent, AXConversationComposerService, AXConversationComposerTabRegistry, AXConversationContainerComponent, AXConversationContainerDirective, AXConversationDateUtilsService, AXConversationEmojiTabComponent, AXConversationErrorHandlerService, AXConversationFallbackRendererComponent, AXConversationFileAttachmentComponent, AXConversationFileFileTypeProvider, AXConversationFilePickerComponent, AXConversationFileRendererComponent, AXConversationForwardMessageDialogComponent, AXConversationImageAttachmentComponent, AXConversationImageFileTypeProvider, AXConversationImagePickerComponent, AXConversationImageRendererComponent, AXConversationInfiniteScrollDirective, AXConversationInfoBarActionRegistry, AXConversationInfoBarComponent, AXConversationInfoBarSearchComponent, AXConversationInfoBarService, AXConversationItemActionRegistry, AXConversationLocationPickerComponent, AXConversationLocationRendererComponent, AXConversationMediaPlaybackInfoBarBannerComponent, AXConversationMessageActionRegistry, AXConversationMessageApi, AXConversationMessageListComponent, AXConversationMessageListNoActiveDefaultComponent, AXConversationMessageListService, AXConversationMessageRendererCopyHostComponent, AXConversationMessageRendererRegistry, AXConversationMessageRendererStateComponent, AXConversationMessageUtilsService, AXConversationModule, AXConversationNewDialogComponent, AXConversationPickerCaptionComponent, AXConversationPickerEmptyComponent, AXConversationPickerFooterComponent, AXConversationPickerHeaderComponent, AXConversationPickerShellComponent, AXConversationPickerToolbarComponent, AXConversationRealtimeApi, AXConversationRegistryComponentOutletComponent, AXConversationRegistryService, AXConversationService, AXConversationSidebarComponent, AXConversationSidebarService, AXConversationStickerRendererComponent, AXConversationStickerTabComponent, AXConversationSystemRendererComponent, AXConversationTabRegistry, AXConversationTextRendererComponent, AXConversationUserApi, AXConversationVideoAttachmentComponent, AXConversationVideoFileTypeProvider, AXConversationVideoPickerComponent, AXConversationVideoRendererComponent, AXConversationVoiceFileTypeProvider, AXConversationVoiceRecorderComponent, AXConversationVoiceRendererComponent, AX_CONVERSATION_AUDIO_CATALOG, AX_CONVERSATION_AUDIO_PRESENTATION, AX_CONVERSATION_AUDIO_RENDERER, AX_CONVERSATION_BUILTIN_COMPOSER_TABS, AX_CONVERSATION_COMPOSER_AUDIO_ACTION, AX_CONVERSATION_COMPOSER_EMOJI_ACTION, AX_CONVERSATION_COMPOSER_EMOJI_TAB, AX_CONVERSATION_COMPOSER_FILE_ACTION, AX_CONVERSATION_COMPOSER_IMAGE_ACTION, AX_CONVERSATION_COMPOSER_LOCATION_ACTION, AX_CONVERSATION_COMPOSER_STICKER_TAB, AX_CONVERSATION_COMPOSER_VIDEO_ACTION, AX_CONVERSATION_COMPOSER_VOICE_RECORDING_ACTION, AX_CONVERSATION_CONFIG, AX_CONVERSATION_CONNECTION_ERRORS, AX_CONVERSATION_CONVERSATION_AVATAR_COMPONENT, AX_CONVERSATION_DEFAULT_COMPOSER_ACTIONS, AX_CONVERSATION_DEFAULT_COMPOSER_TABS, AX_CONVERSATION_DEFAULT_CONVERSATION_ITEM_ACTIONS, AX_CONVERSATION_DEFAULT_CONVERSATION_TABS, AX_CONVERSATION_DEFAULT_GROUP_ICON, AX_CONVERSATION_DEFAULT_INFO_BAR_ACTIONS, AX_CONVERSATION_DEFAULT_MESSAGE_ACTIONS, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_BACKGROUND, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_BACKGROUND_PRESET_ID, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_THEME_BACKGROUND, AX_CONVERSATION_DEFAULT_MESSAGE_RENDERERS, AX_CONVERSATION_DEFAULT_ROOM_PREFERENCES, AX_CONVERSATION_DEFAULT_USER_ICON, AX_CONVERSATION_ERRORS, AX_CONVERSATION_ERROR_HANDLER_CONFIG, AX_CONVERSATION_ERROR_MESSAGES, AX_CONVERSATION_FALLBACK_RENDERER, AX_CONVERSATION_FILE_CATALOG, AX_CONVERSATION_FILE_ERRORS, AX_CONVERSATION_FILE_PRESENTATION, AX_CONVERSATION_FILE_RENDERER, AX_CONVERSATION_FILE_TYPES_READY, AX_CONVERSATION_IMAGE_CATALOG, AX_CONVERSATION_IMAGE_PRESENTATION, AX_CONVERSATION_IMAGE_RENDERER, AX_CONVERSATION_INFO_BAR_ARCHIVE_ACTION, AX_CONVERSATION_INFO_BAR_BLOCK_ACTION, AX_CONVERSATION_INFO_BAR_DELETE_ACTION, AX_CONVERSATION_INFO_BAR_DIVIDER, AX_CONVERSATION_INFO_BAR_MUTE_ACTION, AX_CONVERSATION_INFO_BAR_SEARCH_ACTION, AX_CONVERSATION_ITEM_BLOCK_ACTION, AX_CONVERSATION_ITEM_DELETE_ACTION, AX_CONVERSATION_ITEM_DIVIDER, AX_CONVERSATION_ITEM_MARK_READ_ACTION, AX_CONVERSATION_ITEM_MUTE_ACTION, AX_CONVERSATION_ITEM_PIN_ACTION, AX_CONVERSATION_LOCATION_ERRORS, AX_CONVERSATION_LOCATION_RENDERER, AX_CONVERSATION_MESSAGE_DELETE_ACTION, AX_CONVERSATION_MESSAGE_EDIT_ACTION, AX_CONVERSATION_MESSAGE_ERRORS, AX_CONVERSATION_MESSAGE_FORWARD_ACTION, AX_CONVERSATION_MESSAGE_LIST_BACKGROUND_PRESETS, AX_CONVERSATION_MESSAGE_REPLY_ACTION, AX_CONVERSATION_MESSAGE_TYPE_FILE_TYPE, AX_CONVERSATION_PEER_AVATAR_TYPES, AX_CONVERSATION_REGISTRY_CONFIG, AX_CONVERSATION_STICKER_API_KEY, AX_CONVERSATION_STICKER_RENDERER, AX_CONVERSATION_SYSTEM_RENDERER, AX_CONVERSATION_TAB_ALL, AX_CONVERSATION_TAB_ARCHIVED, AX_CONVERSATION_TAB_BOT, AX_CONVERSATION_TAB_CHANNELS, AX_CONVERSATION_TAB_GROUPS, AX_CONVERSATION_TAB_PRIVATE, AX_CONVERSATION_TAB_UNREAD, AX_CONVERSATION_TEXT_RENDERER, AX_CONVERSATION_URL_ERRORS, AX_CONVERSATION_USER_AVATAR_COMPONENT, AX_CONVERSATION_USER_ERRORS, AX_CONVERSATION_VIDEO_CATALOG, AX_CONVERSATION_VIDEO_PRESENTATION, AX_CONVERSATION_VIDEO_RENDERER, AX_CONVERSATION_VOICE_CATALOG, AX_CONVERSATION_VOICE_PRESENTATION, AX_CONVERSATION_VOICE_RENDERER, AX_DEFAULT_CONVERSATION_CONFIG, abortPickerUploads, applyAudioLocalPreview, applyFileLocalPreview, applyLocalPreview, applyVideoLocalPreview, applyVoiceLocalPreview, audioItemFromUpload, bindMediaRendererContentState, buildMediaGalleryTiles, canShowRendererContentError, cleanupPickerUploads, conversationAudioUtilities, conversationFileUtilities, conversationImageUtilities, conversationVideoUtilities, conversationVoiceUtilities, copyWithFileTypeFallback, createConversationAudioFileType, createConversationFileFileType, createConversationImageFileType, createConversationVideoFileType, createConversationVoiceFileType, createLocalPreviewUrl, createObjectUrl, createPickerDragHandlers, createResolvedMediaUrlSignal, deleteUploadedPickerMedia, dismissComposerPickerHost, ensureConversationFileCatalogRegistered, fetchConversationMediaPage, fileItemFromUpload, filterMessagesByMediaCategory, filterSupplementalInfoPanelMessages, findExistingPrivateConversation, formatDuration, formatErrorMessage, formatFileByteSize, formatFileSize, formatMediaDuration, formatPickerValidationMessage, getConversationMediaCategories, getConversationProfileFields, getErrorMessage, getMessageAudioItems, getMessageVideoItems, getPickerCancelUploadLabel, getPrivatePeerParticipant, hasRegistryComponent, inferFileExtensionHintFromMessage, isAttachmentListCategory, isComposerTabEnabled, isConversationReactionsEnabled, isGenericPrivateConversationTitle, isGridMediaCategory, isMessageDeliveryPending, isMessageListThemeBackground, isNonPersistableMediaUrl, isPickerItemReadyToSend, isSameMessageListBackground, isUploadAborted, limitFilesToCapacity, mediaCopyText, mergeAudioUploadResult, mergeFileUploadResult, mergeInfoPanelMessages, mergeUploadResult, mergeVideoUploadResult, mergeVoiceUploadResult, mergeWithDefaults, messageContainsLink, normalizeAudioPayload, normalizeFilePayload, normalizeImagePayload, normalizeMessageListBackgroundValue, normalizeVideoPayload, notifyMaxFilesCapacityExceeded, notifyPickerValidationErrors, openWithFileType, pickDisplayMediaUrl, pickerItemToMediaReference, pickerItemToUploadResult, provideConversation, provideConversationComposerFileTypes, provideConversationFileCatalog, reportMediaLoadError, resolveComposerMaxFiles, resolveConversationAvatarDisplay, resolveConversationComposerTabs, resolveConversationForViewer, resolveConversationMessageFileType, resolveConversationPeerParticipant, resolveConversationPeerUserId, resolveConversationTitleForViewer, resolveGalleryImageUrl, resolveImageDisplayUrl, resolveMessageListBackgroundRaw, resolveMessageListBackgroundStyle, resolveParticipantProfile, resolvePersistableMediaUrl, resolvePersistedThumbnailUrl, resolvePrivatePeerParticipant, resolvePrivatePeerUserId, resolveUserAvatarDisplay, resolveVideoThumbnailUrl, revokeObjectUrl, revokePickerBlobPreviews, sanitizeInput, shouldUseUserAvatarForConversation, syncPlaybackInfoBarBanner, toUploaderReference as toMediaItemUploaderReference, toUploaderReference$1 as toUploaderReference, uploadPickerFile, validateConversationId, validateEmail, validateLatitude, validateLongitude, validateMessagePayload, validateMessageText, validateMessageType, validateUrl, validateUserId, validateUserIds, videoItemFromUpload };
|
|
15257
|
+
export { AXConversationApi, AXConversationApiLoggerService, AXConversationAudioAttachmentComponent, AXConversationAudioFileTypeProvider, AXConversationAudioPickerComponent, AXConversationAudioRendererComponent, AXConversationAvatarComponent, AXConversationAvatarPickerComponent, AXConversationBaseRegistry, AXConversationComposerActionRegistry, AXConversationComposerComponent, AXConversationComposerFileTypesProvider, AXConversationComposerGenerationStateService, AXConversationComposerPopupComponent, AXConversationComposerService, AXConversationComposerTabRegistry, AXConversationContainerComponent, AXConversationContainerDirective, AXConversationDateUtilsService, AXConversationEmojiTabComponent, AXConversationErrorHandlerService, AXConversationFallbackRendererComponent, AXConversationFileAttachmentComponent, AXConversationFileFileTypeProvider, AXConversationFilePickerComponent, AXConversationFileRendererComponent, AXConversationForwardMessageDialogComponent, AXConversationImageAttachmentComponent, AXConversationImageFileTypeProvider, AXConversationImagePickerComponent, AXConversationImageRendererComponent, AXConversationInfiniteScrollDirective, AXConversationInfoBarActionRegistry, AXConversationInfoBarComponent, AXConversationInfoBarSearchComponent, AXConversationInfoBarService, AXConversationItemActionRegistry, AXConversationLocationPickerComponent, AXConversationLocationRendererComponent, AXConversationMediaPlaybackInfoBarBannerComponent, AXConversationMessageActionRegistry, AXConversationMessageApi, AXConversationMessageListComponent, AXConversationMessageListNoActiveDefaultComponent, AXConversationMessageListService, AXConversationMessageRendererCopyHostComponent, AXConversationMessageRendererRegistry, AXConversationMessageRendererStateComponent, AXConversationMessageUtilsService, AXConversationModule, AXConversationNewDialogComponent, AXConversationPickerCaptionComponent, AXConversationPickerEmptyComponent, AXConversationPickerFooterComponent, AXConversationPickerHeaderComponent, AXConversationPickerShellComponent, AXConversationPickerToolbarComponent, AXConversationRealtimeApi, AXConversationRegistryComponentOutletComponent, AXConversationRegistryService, AXConversationService, AXConversationSidebarComponent, AXConversationSidebarService, AXConversationStickerRendererComponent, AXConversationStickerTabComponent, AXConversationSystemRendererComponent, AXConversationTabRegistry, AXConversationTextRendererComponent, AXConversationUserApi, AXConversationVideoAttachmentComponent, AXConversationVideoFileTypeProvider, AXConversationVideoPickerComponent, AXConversationVideoRendererComponent, AXConversationVoiceFileTypeProvider, AXConversationVoiceRecorderComponent, AXConversationVoiceRendererComponent, AX_CONVERSATION_AUDIO_CATALOG, AX_CONVERSATION_AUDIO_PRESENTATION, AX_CONVERSATION_AUDIO_RENDERER, AX_CONVERSATION_BUILTIN_COMPOSER_TABS, AX_CONVERSATION_COMPOSER_AUDIO_ACTION, AX_CONVERSATION_COMPOSER_EMOJI_ACTION, AX_CONVERSATION_COMPOSER_EMOJI_TAB, AX_CONVERSATION_COMPOSER_FILE_ACTION, AX_CONVERSATION_COMPOSER_IMAGE_ACTION, AX_CONVERSATION_COMPOSER_LOCATION_ACTION, AX_CONVERSATION_COMPOSER_STICKER_TAB, AX_CONVERSATION_COMPOSER_VIDEO_ACTION, AX_CONVERSATION_COMPOSER_VOICE_RECORDING_ACTION, AX_CONVERSATION_CONFIG, AX_CONVERSATION_CONNECTION_ERRORS, AX_CONVERSATION_CONVERSATION_AVATAR_COMPONENT, AX_CONVERSATION_DEFAULT_COMPOSER_ACTIONS, AX_CONVERSATION_DEFAULT_COMPOSER_TABS, AX_CONVERSATION_DEFAULT_CONVERSATION_ITEM_ACTIONS, AX_CONVERSATION_DEFAULT_CONVERSATION_TABS, AX_CONVERSATION_DEFAULT_GROUP_ICON, AX_CONVERSATION_DEFAULT_INFO_BAR_ACTIONS, AX_CONVERSATION_DEFAULT_MESSAGE_ACTIONS, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_BACKGROUND, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_BACKGROUND_PRESET_ID, AX_CONVERSATION_DEFAULT_MESSAGE_LIST_THEME_BACKGROUND, AX_CONVERSATION_DEFAULT_MESSAGE_RENDERERS, AX_CONVERSATION_DEFAULT_ROOM_PREFERENCES, AX_CONVERSATION_DEFAULT_USER_ICON, AX_CONVERSATION_ERRORS, AX_CONVERSATION_ERROR_HANDLER_CONFIG, AX_CONVERSATION_ERROR_MESSAGES, AX_CONVERSATION_FALLBACK_RENDERER, AX_CONVERSATION_FILE_CATALOG, AX_CONVERSATION_FILE_ERRORS, AX_CONVERSATION_FILE_PRESENTATION, AX_CONVERSATION_FILE_RENDERER, AX_CONVERSATION_FILE_TYPES_READY, AX_CONVERSATION_IMAGE_CATALOG, AX_CONVERSATION_IMAGE_PRESENTATION, AX_CONVERSATION_IMAGE_RENDERER, AX_CONVERSATION_INFO_BAR_ARCHIVE_ACTION, AX_CONVERSATION_INFO_BAR_BLOCK_ACTION, AX_CONVERSATION_INFO_BAR_DELETE_ACTION, AX_CONVERSATION_INFO_BAR_DIVIDER, AX_CONVERSATION_INFO_BAR_MUTE_ACTION, AX_CONVERSATION_INFO_BAR_SEARCH_ACTION, AX_CONVERSATION_ITEM_BLOCK_ACTION, AX_CONVERSATION_ITEM_DELETE_ACTION, AX_CONVERSATION_ITEM_DIVIDER, AX_CONVERSATION_ITEM_MARK_READ_ACTION, AX_CONVERSATION_ITEM_MUTE_ACTION, AX_CONVERSATION_ITEM_PIN_ACTION, AX_CONVERSATION_LOCATION_ERRORS, AX_CONVERSATION_LOCATION_RENDERER, AX_CONVERSATION_MESSAGE_DELETE_ACTION, AX_CONVERSATION_MESSAGE_EDIT_ACTION, AX_CONVERSATION_MESSAGE_ERRORS, AX_CONVERSATION_MESSAGE_FORWARD_ACTION, AX_CONVERSATION_MESSAGE_LIST_BACKGROUND_PRESETS, AX_CONVERSATION_MESSAGE_REPLY_ACTION, AX_CONVERSATION_MESSAGE_TYPE_FILE_TYPE, AX_CONVERSATION_PEER_AVATAR_TYPES, AX_CONVERSATION_REGISTRY_CONFIG, AX_CONVERSATION_STICKER_API_KEY, AX_CONVERSATION_STICKER_RENDERER, AX_CONVERSATION_SYSTEM_RENDERER, AX_CONVERSATION_TAB_ALL, AX_CONVERSATION_TAB_ARCHIVED, AX_CONVERSATION_TAB_BOT, AX_CONVERSATION_TAB_CHANNELS, AX_CONVERSATION_TAB_GROUPS, AX_CONVERSATION_TAB_PRIVATE, AX_CONVERSATION_TAB_UNREAD, AX_CONVERSATION_TEXT_RENDERER, AX_CONVERSATION_URL_ERRORS, AX_CONVERSATION_USER_AVATAR_COMPONENT, AX_CONVERSATION_USER_ERRORS, AX_CONVERSATION_VIDEO_CATALOG, AX_CONVERSATION_VIDEO_PRESENTATION, AX_CONVERSATION_VIDEO_RENDERER, AX_CONVERSATION_VOICE_CATALOG, AX_CONVERSATION_VOICE_PRESENTATION, AX_CONVERSATION_VOICE_RENDERER, AX_DEFAULT_CONVERSATION_CONFIG, abortPickerUploads, applyAudioLocalPreview, applyFileLocalPreview, applyLocalPreview, applyVideoLocalPreview, applyVoiceLocalPreview, audioItemFromUpload, bindMediaRendererContentState, buildMediaGalleryTiles, canShowRendererContentError, cleanupPickerUploads, conversationAudioUtilities, conversationFileUtilities, conversationImageUtilities, conversationVideoUtilities, conversationVoiceUtilities, copyWithFileTypeFallback, createConversationAudioFileType, createConversationFileFileType, createConversationImageFileType, createConversationVideoFileType, createConversationVoiceFileType, createLocalPreviewUrl, createObjectUrl, createPickerDragHandlers, createPickerUploadItemId, createResolvedMediaUrlSignal, deleteUploadedPickerMedia, dismissComposerPickerHost, ensureConversationFileCatalogRegistered, fetchConversationMediaPage, fileItemFromUpload, filterMessagesByMediaCategory, filterSupplementalInfoPanelMessages, findExistingPrivateConversation, formatDuration, formatErrorMessage, formatFileByteSize, formatFileSize, formatMediaDuration, formatPickerValidationMessage, getConversationMediaCategories, getConversationProfileFields, getErrorMessage, getMessageAudioItems, getMessageVideoItems, getPickerCancelUploadLabel, getPrivatePeerParticipant, hasRegistryComponent, inferFileExtensionHintFromMessage, isAttachmentListCategory, isComposerTabEnabled, isConversationReactionsEnabled, isGenericPrivateConversationTitle, isGridMediaCategory, isMessageDeliveryPending, isMessageListThemeBackground, isNonPersistableMediaUrl, isPickerItemReadyToSend, isSameMessageListBackground, isUploadAborted, limitFilesToCapacity, mediaCopyText, mergeAudioUploadResult, mergeFileUploadResult, mergeInfoPanelMessages, mergeUploadResult, mergeVideoUploadResult, mergeVoiceUploadResult, mergeWithDefaults, messageContainsLink, normalizeAudioPayload, normalizeFilePayload, normalizeImagePayload, normalizeMessageListBackgroundValue, normalizeVideoPayload, notifyMaxFilesCapacityExceeded, notifyPickerValidationErrors, openWithFileType, pickDisplayMediaUrl, pickerItemToMediaReference, pickerItemToUploadResult, provideConversation, provideConversationComposerFileTypes, provideConversationFileCatalog, reportMediaLoadError, resolveComposerMaxFiles, resolveConversationAvatarDisplay, resolveConversationComposerTabs, resolveConversationForViewer, resolveConversationMessageFileType, resolveConversationPeerParticipant, resolveConversationPeerUserId, resolveConversationTitleForViewer, resolveGalleryImageUrl, resolveImageDisplayUrl, resolveMessageListBackgroundRaw, resolveMessageListBackgroundStyle, resolveParticipantProfile, resolvePersistableMediaUrl, resolvePersistedThumbnailUrl, resolvePrivatePeerParticipant, resolvePrivatePeerUserId, resolveUserAvatarDisplay, resolveVideoThumbnailUrl, revokeObjectUrl, revokePickerBlobPreviews, sanitizeInput, shouldUseUserAvatarForConversation, syncPlaybackInfoBarBanner, toUploaderReference as toMediaItemUploaderReference, toUploaderReference$1 as toUploaderReference, uploadPickerFile, validateConversationId, validateEmail, validateLatitude, validateLongitude, validateMessagePayload, validateMessageText, validateMessageType, validateUrl, validateUserId, validateUserIds, videoItemFromUpload };
|
|
15277
15258
|
//# sourceMappingURL=acorex-components-conversation.mjs.map
|