@acorex-platform/module-conversation-client 0.0.33 → 0.0.38

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.
Files changed (46) hide show
  1. package/fesm2022/{acorex-platform-module-conversation-client-acorex-platform-module-conversation-client-CDlDFzbl.mjs → acorex-platform-module-conversation-client-acorex-platform-module-conversation-client-XTzQQhii.mjs} +745 -215
  2. package/fesm2022/acorex-platform-module-conversation-client-acorex-platform-module-conversation-client-XTzQQhii.mjs.map +1 -0
  3. package/fesm2022/{acorex-platform-module-conversation-client-after-message-sent.command-yzW01skh.mjs → acorex-platform-module-conversation-client-after-message-sent.command-BMGagKtP.mjs} +2 -2
  4. package/fesm2022/{acorex-platform-module-conversation-client-after-message-sent.command-yzW01skh.mjs.map → acorex-platform-module-conversation-client-after-message-sent.command-BMGagKtP.mjs.map} +1 -1
  5. package/fesm2022/{acorex-platform-module-conversation-client-assist-delegated-agent-detail-popup.component-DhRvuCex.mjs → acorex-platform-module-conversation-client-assist-delegated-agent-detail-popup.component-D1SDsHvl.mjs} +3 -3
  6. package/fesm2022/{acorex-platform-module-conversation-client-assist-delegated-agent-detail-popup.component-DhRvuCex.mjs.map → acorex-platform-module-conversation-client-assist-delegated-agent-detail-popup.component-D1SDsHvl.mjs.map} +1 -1
  7. package/fesm2022/{acorex-platform-module-conversation-client-assist-tool-detail-popup.component-BRW1cHN6.mjs → acorex-platform-module-conversation-client-assist-tool-detail-popup.component-BV1YH96m.mjs} +2 -2
  8. package/fesm2022/{acorex-platform-module-conversation-client-assist-tool-detail-popup.component-BRW1cHN6.mjs.map → acorex-platform-module-conversation-client-assist-tool-detail-popup.component-BV1YH96m.mjs.map} +1 -1
  9. package/fesm2022/acorex-platform-module-conversation-client-chat-call-session-page.component-nE7xP4bF.mjs +1607 -0
  10. package/fesm2022/acorex-platform-module-conversation-client-chat-call-session-page.component-nE7xP4bF.mjs.map +1 -0
  11. package/fesm2022/acorex-platform-module-conversation-client-chat-call-start-popup.component-DXkqkS50.mjs +92 -0
  12. package/fesm2022/acorex-platform-module-conversation-client-chat-call-start-popup.component-DXkqkS50.mjs.map +1 -0
  13. package/fesm2022/{acorex-platform-module-conversation-client-chat-conversation-info-media-view.component-CppNPfqe.mjs → acorex-platform-module-conversation-client-chat-conversation-info-media-view.component-SYCtAqcV.mjs} +2 -2
  14. package/fesm2022/{acorex-platform-module-conversation-client-chat-conversation-info-media-view.component-CppNPfqe.mjs.map → acorex-platform-module-conversation-client-chat-conversation-info-media-view.component-SYCtAqcV.mjs.map} +1 -1
  15. package/fesm2022/{acorex-platform-module-conversation-client-chat-conversation-info-panel.component-BBL8iEqc.mjs → acorex-platform-module-conversation-client-chat-conversation-info-panel.component-51PtojIM.mjs} +14 -4
  16. package/fesm2022/acorex-platform-module-conversation-client-chat-conversation-info-panel.component-51PtojIM.mjs.map +1 -0
  17. package/fesm2022/{acorex-platform-module-conversation-client-comments-page.component-Djn8EikR.mjs → acorex-platform-module-conversation-client-comments-page.component-Dv_x3ztZ.mjs} +2 -2
  18. package/fesm2022/{acorex-platform-module-conversation-client-comments-page.component-Djn8EikR.mjs.map → acorex-platform-module-conversation-client-comments-page.component-Dv_x3ztZ.mjs.map} +1 -1
  19. package/fesm2022/acorex-platform-module-conversation-client-contracts-entities-message.mjs.map +1 -1
  20. package/fesm2022/acorex-platform-module-conversation-client-contracts-entities-room.mjs.map +1 -1
  21. package/fesm2022/acorex-platform-module-conversation-client-contracts-entity-catalog-acorex-platform-module-conversation-client-contracts-entity-catalog-Cy3LwYMZ.mjs.map +1 -1
  22. package/fesm2022/acorex-platform-module-conversation-client-contracts-entity-catalog-message.entity-Dz7cO1P4.mjs.map +1 -1
  23. package/fesm2022/acorex-platform-module-conversation-client-contracts-entity-catalog-room.entity-B9txvc3y.mjs.map +1 -1
  24. package/fesm2022/acorex-platform-module-conversation-client-contracts.mjs.map +1 -1
  25. package/fesm2022/acorex-platform-module-conversation-client-emit-typing-indicator.command-BzsN1_ns.mjs.map +1 -1
  26. package/fesm2022/acorex-platform-module-conversation-client-local-entities.mjs.map +1 -1
  27. package/fesm2022/{acorex-platform-module-conversation-client-mark-conversation-unread.command-BoTNaBxS.mjs → acorex-platform-module-conversation-client-mark-conversation-unread.command-8NoSuUwe.mjs} +2 -2
  28. package/fesm2022/{acorex-platform-module-conversation-client-mark-conversation-unread.command-BoTNaBxS.mjs.map → acorex-platform-module-conversation-client-mark-conversation-unread.command-8NoSuUwe.mjs.map} +1 -1
  29. package/fesm2022/{acorex-platform-module-conversation-client-open-chat.command-VgeGqj-z.mjs → acorex-platform-module-conversation-client-open-chat.command-BgJ0Z36e.mjs} +5 -5
  30. package/fesm2022/acorex-platform-module-conversation-client-open-chat.command-BgJ0Z36e.mjs.map +1 -0
  31. package/fesm2022/{acorex-platform-module-conversation-client-retry-assist-response.command-DYIpLKDB.mjs → acorex-platform-module-conversation-client-retry-assist-response.command-lcNz4Hpu.mjs} +2 -2
  32. package/fesm2022/{acorex-platform-module-conversation-client-retry-assist-response.command-DYIpLKDB.mjs.map → acorex-platform-module-conversation-client-retry-assist-response.command-lcNz4Hpu.mjs.map} +1 -1
  33. package/fesm2022/acorex-platform-module-conversation-client-start-direct-chat.command-CfSIVHDu.mjs.map +1 -1
  34. package/fesm2022/{acorex-platform-module-conversation-client-sync-read-state.command-D97E8VvL.mjs → acorex-platform-module-conversation-client-sync-read-state.command-DxccFsD9.mjs} +26 -13
  35. package/fesm2022/acorex-platform-module-conversation-client-sync-read-state.command-DxccFsD9.mjs.map +1 -0
  36. package/fesm2022/acorex-platform-module-conversation-client.mjs +1 -1
  37. package/package.json +2 -2
  38. package/types/acorex-platform-module-conversation-client.d.ts +28 -1
  39. package/fesm2022/acorex-platform-module-conversation-client-acorex-platform-module-conversation-client-CDlDFzbl.mjs.map +0 -1
  40. package/fesm2022/acorex-platform-module-conversation-client-chat-call-session-page.component-C47tt1me.mjs +0 -1386
  41. package/fesm2022/acorex-platform-module-conversation-client-chat-call-session-page.component-C47tt1me.mjs.map +0 -1
  42. package/fesm2022/acorex-platform-module-conversation-client-chat-call-start-popup.component-EZjVSlhm.mjs +0 -89
  43. package/fesm2022/acorex-platform-module-conversation-client-chat-call-start-popup.component-EZjVSlhm.mjs.map +0 -1
  44. package/fesm2022/acorex-platform-module-conversation-client-chat-conversation-info-panel.component-BBL8iEqc.mjs.map +0 -1
  45. package/fesm2022/acorex-platform-module-conversation-client-open-chat.command-VgeGqj-z.mjs.map +0 -1
  46. package/fesm2022/acorex-platform-module-conversation-client-sync-read-state.command-D97E8VvL.mjs.map +0 -1
@@ -1,1386 +0,0 @@
1
- import { createRandomUuid } from '@acorex-platform/framework-shared/core';
2
- import { AXPAvatarComponent } from '@acorex-platform/framework-client/layout/components';
3
- import { AXPLayoutBuilderService } from '@acorex-platform/framework-client/layout/builder';
4
- import { AXConversationContainerDirective, AXConversationMessageListComponent, AXConversationComposerComponent, AXConversationService } from '@acorex/components/conversation';
5
- import { AXBasePageComponent } from '@acorex/components/page';
6
- import * as i1 from '@acorex/components/button';
7
- import { AXButtonModule } from '@acorex/components/button';
8
- import * as i2 from '@acorex/components/decorators';
9
- import { AXDecoratorModule } from '@acorex/components/decorators';
10
- import * as i3$1 from '@acorex/components/drawer';
11
- import { AXDrawerModule } from '@acorex/components/drawer';
12
- import { AXToastService } from '@acorex/components/toast';
13
- import * as i3 from '@acorex/core/translation';
14
- import { AXTranslationModule, AXTranslationService } from '@acorex/core/translation';
15
- import { AsyncPipe } from '@angular/common';
16
- import * as i0 from '@angular/core';
17
- import { input, output, signal, computed, ChangeDetectionStrategy, Component, Injectable, inject, ElementRef, effect, Directive, ViewEncapsulation } from '@angular/core';
18
- import { ConnectionState } from 'livekit-client';
19
- import { k as AXMChatUserApi, l as AXMChatEntityConversationApi, m as AXMChatConversationApi, n as AXMChatCallRtcService, o as AXMChatCallRtcSignalInboxService, p as AXMChatCallActiveSessionService, q as AXMChatCallEventsService, r as AXMConversationRealtimeBus, A as AXMConversationEntityStoreService, h as axmResolveConversationListAvatar, s as axmReadChatCallLog, t as axmBuildChatCallLogMessage, u as axmReadChatCallMediaContextIssue, v as AXM_CHAT_CALL_RTC_PROVIDERS } from './acorex-platform-module-conversation-client-acorex-platform-module-conversation-client-CDlDFzbl.mjs';
20
- import { AXP_ROOT_CONFIG_TOKEN } from '@acorex-platform/framework-client/common';
21
- import { HttpClient } from '@angular/common/http';
22
- import { firstValueFrom } from 'rxjs';
23
-
24
- //#region ----- Imports -----
25
- //#endregion
26
- //#region ----- Helpers -----
27
- function axmCoerceLookupUserIds(value) {
28
- if (!value) {
29
- return [];
30
- }
31
- if (Array.isArray(value)) {
32
- return value
33
- .map((entry) => {
34
- if (typeof entry === 'string') {
35
- return entry.trim();
36
- }
37
- if (entry && typeof entry === 'object' && 'id' in entry) {
38
- return String(entry.id ?? '').trim();
39
- }
40
- return String(entry ?? '').trim();
41
- })
42
- .filter(Boolean);
43
- }
44
- if (typeof value === 'string') {
45
- const trimmed = value.trim();
46
- return trimmed ? [trimmed] : [];
47
- }
48
- return [];
49
- }
50
- //#endregion
51
- //#region ----- Dialog -----
52
- /**
53
- * Opens a user picker for adding participants to an active call.
54
- */
55
- async function axmOpenChatCallAddPeopleDialog(layoutBuilder, translationService) {
56
- const [dialogTitle, fieldLabel, cancelLabel, submitLabel] = await Promise.all([
57
- translationService.translateAsync('@conversation:chat.call.add-people-dialog.title'),
58
- translationService.translateAsync('@conversation:chat.call.add-people-dialog.field.users'),
59
- translationService.translateAsync('@conversation:comments.actions.cancel.title'),
60
- translationService.translateAsync('@conversation:chat.call.add-people-dialog.actions.invite'),
61
- ]);
62
- const dialogRef = await layoutBuilder
63
- .create()
64
- .dialog((dialog) => {
65
- dialog
66
- .setTitle(dialogTitle ?? 'Add People')
67
- .setSize('md')
68
- .setCloseButton(true)
69
- .setContext({ userIds: null })
70
- .content((flex) => {
71
- flex.setDirection('column').setGap('10px');
72
- flex.formField(fieldLabel ?? 'People', (field) => {
73
- field.path('userIds');
74
- field.lookupBox({
75
- entity: 'SecurityManagement.User',
76
- multiple: true,
77
- searchable: true,
78
- allowClear: true,
79
- validations: [{ rule: 'required' }],
80
- });
81
- });
82
- })
83
- .setActions((actions) => {
84
- actions.cancel(cancelLabel ?? 'Cancel');
85
- actions.submit(submitLabel ?? 'Invite');
86
- });
87
- })
88
- .show();
89
- if (dialogRef.action() === 'cancel') {
90
- dialogRef.close();
91
- return false;
92
- }
93
- const context = dialogRef.context();
94
- const userIds = axmCoerceLookupUserIds(context.userIds);
95
- dialogRef.close();
96
- return userIds.length ? userIds : false;
97
- }
98
- //#endregion
99
-
100
- //#region ----- Imports -----
101
- //#endregion
102
- //#region ----- Component -----
103
- class AXMChatCallControlsComponent {
104
- constructor() {
105
- //#region ----- Inputs / Outputs -----
106
- this.phase = input('outgoing-waiting', /* @ts-ignore */
107
- ...(ngDevMode ? [{ debugName: "phase" }] : /* istanbul ignore next */ []));
108
- this.videoEnabled = input(false, /* @ts-ignore */
109
- ...(ngDevMode ? [{ debugName: "videoEnabled" }] : /* istanbul ignore next */ []));
110
- this.micMuted = input(false, /* @ts-ignore */
111
- ...(ngDevMode ? [{ debugName: "micMuted" }] : /* istanbul ignore next */ []));
112
- this.showAddPeople = input(false, /* @ts-ignore */
113
- ...(ngDevMode ? [{ debugName: "showAddPeople" }] : /* istanbul ignore next */ []));
114
- this.showScreencast = input(true, /* @ts-ignore */
115
- ...(ngDevMode ? [{ debugName: "showScreencast" }] : /* istanbul ignore next */ []));
116
- this.showChat = input(false, /* @ts-ignore */
117
- ...(ngDevMode ? [{ debugName: "showChat" }] : /* istanbul ignore next */ []));
118
- this.chatOpen = input(false, /* @ts-ignore */
119
- ...(ngDevMode ? [{ debugName: "chatOpen" }] : /* istanbul ignore next */ []));
120
- this.audioDevices = input([], /* @ts-ignore */
121
- ...(ngDevMode ? [{ debugName: "audioDevices" }] : /* istanbul ignore next */ []));
122
- this.videoDevices = input([], /* @ts-ignore */
123
- ...(ngDevMode ? [{ debugName: "videoDevices" }] : /* istanbul ignore next */ []));
124
- this.selectedAudioDeviceId = input(null, /* @ts-ignore */
125
- ...(ngDevMode ? [{ debugName: "selectedAudioDeviceId" }] : /* istanbul ignore next */ []));
126
- this.selectedVideoDeviceId = input(null, /* @ts-ignore */
127
- ...(ngDevMode ? [{ debugName: "selectedVideoDeviceId" }] : /* istanbul ignore next */ []));
128
- this.screencast = output();
129
- this.openChat = output();
130
- this.toggleVideo = output();
131
- this.toggleMute = output();
132
- this.endCall = output();
133
- this.accept = output();
134
- this.decline = output();
135
- this.addPeople = output();
136
- this.pickDevice = output();
137
- this.requestDevices = output();
138
- //#endregion
139
- //#region ----- State Signals -----
140
- this.openMenu = signal(null, /* @ts-ignore */
141
- ...(ngDevMode ? [{ debugName: "openMenu" }] : /* istanbul ignore next */ []));
142
- //#endregion
143
- //#region ----- Computed Properties -----
144
- this.isIncoming = computed(() => this.phase() === 'incoming', /* @ts-ignore */
145
- ...(ngDevMode ? [{ debugName: "isIncoming" }] : /* istanbul ignore next */ []));
146
- this.hangupLabelKey = computed(() => this.phase() === 'active'
147
- ? '@conversation:chat.call.end-call'
148
- : '@conversation:chat.call.cancel', /* @ts-ignore */
149
- ...(ngDevMode ? [{ debugName: "hangupLabelKey" }] : /* istanbul ignore next */ []));
150
- this.videoLabelKey = computed(() => this.videoEnabled()
151
- ? '@conversation:chat.call.stop-video'
152
- : '@conversation:chat.call.start-video', /* @ts-ignore */
153
- ...(ngDevMode ? [{ debugName: "videoLabelKey" }] : /* istanbul ignore next */ []));
154
- this.muteLabelKey = computed(() => this.micMuted() ? '@conversation:chat.call.unmute' : '@conversation:chat.call.mute', /* @ts-ignore */
155
- ...(ngDevMode ? [{ debugName: "muteLabelKey" }] : /* istanbul ignore next */ []));
156
- this.menuDevices = computed(() => {
157
- const kind = this.openMenu();
158
- if (kind === 'audioinput') {
159
- return this.audioDevices();
160
- }
161
- if (kind === 'videoinput') {
162
- return this.videoDevices();
163
- }
164
- return [];
165
- }, /* @ts-ignore */
166
- ...(ngDevMode ? [{ debugName: "menuDevices" }] : /* istanbul ignore next */ []));
167
- }
168
- //#endregion
169
- //#region ----- Event Handlers -----
170
- onOpenDeviceMenu(event, kind) {
171
- event.preventDefault();
172
- event.stopPropagation();
173
- this.openMenu.set(this.openMenu() === kind ? null : kind);
174
- this.requestDevices.emit(kind);
175
- }
176
- onCloseDeviceMenu() {
177
- this.openMenu.set(null);
178
- }
179
- onSelectDevice(kind, deviceId) {
180
- this.pickDevice.emit({ kind, deviceId });
181
- this.openMenu.set(null);
182
- }
183
- selectedDeviceId(kind) {
184
- return kind === 'audioinput' ? this.selectedAudioDeviceId() : this.selectedVideoDeviceId();
185
- }
186
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
187
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMChatCallControlsComponent, isStandalone: true, selector: "axm-chat-call-controls", inputs: { phase: { classPropertyName: "phase", publicName: "phase", isSignal: true, isRequired: false, transformFunction: null }, videoEnabled: { classPropertyName: "videoEnabled", publicName: "videoEnabled", isSignal: true, isRequired: false, transformFunction: null }, micMuted: { classPropertyName: "micMuted", publicName: "micMuted", isSignal: true, isRequired: false, transformFunction: null }, showAddPeople: { classPropertyName: "showAddPeople", publicName: "showAddPeople", isSignal: true, isRequired: false, transformFunction: null }, showScreencast: { classPropertyName: "showScreencast", publicName: "showScreencast", isSignal: true, isRequired: false, transformFunction: null }, showChat: { classPropertyName: "showChat", publicName: "showChat", isSignal: true, isRequired: false, transformFunction: null }, chatOpen: { classPropertyName: "chatOpen", publicName: "chatOpen", isSignal: true, isRequired: false, transformFunction: null }, audioDevices: { classPropertyName: "audioDevices", publicName: "audioDevices", isSignal: true, isRequired: false, transformFunction: null }, videoDevices: { classPropertyName: "videoDevices", publicName: "videoDevices", isSignal: true, isRequired: false, transformFunction: null }, selectedAudioDeviceId: { classPropertyName: "selectedAudioDeviceId", publicName: "selectedAudioDeviceId", isSignal: true, isRequired: false, transformFunction: null }, selectedVideoDeviceId: { classPropertyName: "selectedVideoDeviceId", publicName: "selectedVideoDeviceId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { screencast: "screencast", openChat: "openChat", toggleVideo: "toggleVideo", toggleMute: "toggleMute", endCall: "endCall", accept: "accept", decline: "decline", addPeople: "addPeople", pickDevice: "pickDevice", requestDevices: "requestDevices" }, ngImport: i0, template: "<div class=\"axm-chat-call-controls\">\n <!-- ----- Incoming: camera before decline/accept ----- -->\n @if (isIncoming()) {\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleVideo.emit()\"\n [attr.aria-label]=\"videoLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"videoEnabled()\">\n <i class=\"fa-solid\" [class.fa-video]=\"videoEnabled()\" [class.fa-video-slash]=\"!videoEnabled()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'videoinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.camera' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"decline.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.decline' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--danger\">\n <i class=\"fa-solid fa-phone axm-chat-call-controls__hangup\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"accept.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.accept' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--success\">\n <i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleMute.emit()\"\n [attr.aria-label]=\"muteLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"!micMuted()\">\n <i class=\"fa-solid\" [class.fa-microphone]=\"!micMuted()\" [class.fa-microphone-slash]=\"micMuted()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'audioinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.microphone' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n }\n <!-- ----- Outgoing / active controls ----- -->\n @else {\n <!-- ----- In-call chat drawer ----- -->\n @if (showChat()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"openChat.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.open-chat' | translate | async\"\n >\n <span\n class=\"axm-chat-call-controls__circle\"\n [class.axm-chat-call-controls__circle--light]=\"chatOpen()\"\n >\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n\n <!-- ----- Screencast only during an active call ----- -->\n @if (showScreencast()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"screencast.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.screencast' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--light\">\n <i class=\"fa-solid fa-desktop\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleVideo.emit()\"\n [attr.aria-label]=\"videoLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"videoEnabled()\">\n <i class=\"fa-solid\" [class.fa-video]=\"videoEnabled()\" [class.fa-video-slash]=\"!videoEnabled()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'videoinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.camera' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"endCall.emit()\"\n [attr.aria-label]=\"hangupLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--danger\">\n <i class=\"fa-solid fa-phone axm-chat-call-controls__hangup\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleMute.emit()\"\n [attr.aria-label]=\"muteLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"!micMuted()\">\n <i class=\"fa-solid\" [class.fa-microphone]=\"!micMuted()\" [class.fa-microphone-slash]=\"micMuted()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'audioinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.microphone' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <!-- ----- Add people on an active group call ----- -->\n @if (showAddPeople()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"addPeople.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.add-people' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--light\">\n <i class=\"fa-solid fa-user-plus\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n }\n\n <!-- ----- Device switcher ----- -->\n @if (openMenu(); as kind) {\n <button type=\"button\" class=\"axm-chat-call-controls__menu-backdrop\" (click)=\"onCloseDeviceMenu()\"></button>\n <ul class=\"axm-chat-call-controls__menu\" role=\"listbox\">\n @if (menuDevices().length === 0) {\n <li class=\"axm-chat-call-controls__menu-empty\">\n {{ '@conversation:chat.call.devices.empty' | translate | async }}\n </li>\n }\n @for (device of menuDevices(); track device.deviceId) {\n <li>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__menu-item\"\n [class.axm-chat-call-controls__menu-item--active]=\"device.deviceId === selectedDeviceId(kind)\"\n (click)=\"onSelectDevice(kind, device.deviceId)\"\n >\n {{ device.label || device.deviceId }}\n </button>\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
188
- }
189
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallControlsComponent, decorators: [{
190
- type: Component,
191
- args: [{ selector: 'axm-chat-call-controls', changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXTranslationModule, AsyncPipe], template: "<div class=\"axm-chat-call-controls\">\n <!-- ----- Incoming: camera before decline/accept ----- -->\n @if (isIncoming()) {\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleVideo.emit()\"\n [attr.aria-label]=\"videoLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"videoEnabled()\">\n <i class=\"fa-solid\" [class.fa-video]=\"videoEnabled()\" [class.fa-video-slash]=\"!videoEnabled()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'videoinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.camera' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"decline.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.decline' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--danger\">\n <i class=\"fa-solid fa-phone axm-chat-call-controls__hangup\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"accept.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.accept' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--success\">\n <i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleMute.emit()\"\n [attr.aria-label]=\"muteLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"!micMuted()\">\n <i class=\"fa-solid\" [class.fa-microphone]=\"!micMuted()\" [class.fa-microphone-slash]=\"micMuted()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'audioinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.microphone' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n }\n <!-- ----- Outgoing / active controls ----- -->\n @else {\n <!-- ----- In-call chat drawer ----- -->\n @if (showChat()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"openChat.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.open-chat' | translate | async\"\n >\n <span\n class=\"axm-chat-call-controls__circle\"\n [class.axm-chat-call-controls__circle--light]=\"chatOpen()\"\n >\n <i class=\"fa-solid fa-message\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n\n <!-- ----- Screencast only during an active call ----- -->\n @if (showScreencast()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"screencast.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.screencast' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--light\">\n <i class=\"fa-solid fa-desktop\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleVideo.emit()\"\n [attr.aria-label]=\"videoLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"videoEnabled()\">\n <i class=\"fa-solid\" [class.fa-video]=\"videoEnabled()\" [class.fa-video-slash]=\"!videoEnabled()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'videoinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.camera' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"endCall.emit()\"\n [attr.aria-label]=\"hangupLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--danger\">\n <i class=\"fa-solid fa-phone axm-chat-call-controls__hangup\" aria-hidden=\"true\"></i>\n </span>\n </button>\n\n <div class=\"axm-chat-call-controls__item\">\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"toggleMute.emit()\"\n [attr.aria-label]=\"muteLabelKey() | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle\" [class.axm-chat-call-controls__circle--light]=\"!micMuted()\">\n <i class=\"fa-solid\" [class.fa-microphone]=\"!micMuted()\" [class.fa-microphone-slash]=\"micMuted()\" aria-hidden=\"true\"></i>\n </span>\n </button>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__chevron\"\n (click)=\"onOpenDeviceMenu($event, 'audioinput')\"\n [attr.aria-label]=\"'@conversation:chat.call.devices.microphone' | translate | async\"\n >\n <i class=\"fa-solid fa-chevron-up\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <!-- ----- Add people on an active group call ----- -->\n @if (showAddPeople()) {\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__action\"\n (click)=\"addPeople.emit()\"\n [attr.aria-label]=\"'@conversation:chat.call.add-people' | translate | async\"\n >\n <span class=\"axm-chat-call-controls__circle axm-chat-call-controls__circle--light\">\n <i class=\"fa-solid fa-user-plus\" aria-hidden=\"true\"></i>\n </span>\n </button>\n }\n }\n\n <!-- ----- Device switcher ----- -->\n @if (openMenu(); as kind) {\n <button type=\"button\" class=\"axm-chat-call-controls__menu-backdrop\" (click)=\"onCloseDeviceMenu()\"></button>\n <ul class=\"axm-chat-call-controls__menu\" role=\"listbox\">\n @if (menuDevices().length === 0) {\n <li class=\"axm-chat-call-controls__menu-empty\">\n {{ '@conversation:chat.call.devices.empty' | translate | async }}\n </li>\n }\n @for (device of menuDevices(); track device.deviceId) {\n <li>\n <button\n type=\"button\"\n class=\"axm-chat-call-controls__menu-item\"\n [class.axm-chat-call-controls__menu-item--active]=\"device.deviceId === selectedDeviceId(kind)\"\n (click)=\"onSelectDevice(kind, device.deviceId)\"\n >\n {{ device.label || device.deviceId }}\n </button>\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
192
- }], propDecorators: { phase: [{ type: i0.Input, args: [{ isSignal: true, alias: "phase", required: false }] }], videoEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "videoEnabled", required: false }] }], micMuted: [{ type: i0.Input, args: [{ isSignal: true, alias: "micMuted", required: false }] }], showAddPeople: [{ type: i0.Input, args: [{ isSignal: true, alias: "showAddPeople", required: false }] }], showScreencast: [{ type: i0.Input, args: [{ isSignal: true, alias: "showScreencast", required: false }] }], showChat: [{ type: i0.Input, args: [{ isSignal: true, alias: "showChat", required: false }] }], chatOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "chatOpen", required: false }] }], audioDevices: [{ type: i0.Input, args: [{ isSignal: true, alias: "audioDevices", required: false }] }], videoDevices: [{ type: i0.Input, args: [{ isSignal: true, alias: "videoDevices", required: false }] }], selectedAudioDeviceId: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedAudioDeviceId", required: false }] }], selectedVideoDeviceId: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedVideoDeviceId", required: false }] }], screencast: [{ type: i0.Output, args: ["screencast"] }], openChat: [{ type: i0.Output, args: ["openChat"] }], toggleVideo: [{ type: i0.Output, args: ["toggleVideo"] }], toggleMute: [{ type: i0.Output, args: ["toggleMute"] }], endCall: [{ type: i0.Output, args: ["endCall"] }], accept: [{ type: i0.Output, args: ["accept"] }], decline: [{ type: i0.Output, args: ["decline"] }], addPeople: [{ type: i0.Output, args: ["addPeople"] }], pickDevice: [{ type: i0.Output, args: ["pickDevice"] }], requestDevices: [{ type: i0.Output, args: ["requestDevices"] }] } });
193
-
194
- //#region ----- Imports -----
195
- //#endregion
196
- //#region ----- Constants -----
197
- const CHAT_CALL_INCOMING_RING_SRC = 'assets/sounds/ring.mp3';
198
- const CHAT_CALL_OUTGOING_RING_SRC = 'assets/sounds/phone-call.mp3';
199
- const CHAT_CALL_OUTGOING_GAP_MS = 2500;
200
- //#endregion
201
- //#region ----- Service -----
202
- /**
203
- * Plays call audio: looping ringtone for the callee, spaced ringback for the caller.
204
- */
205
- class AXMChatCallRingerService {
206
- constructor() {
207
- //#region ----- Private State -----
208
- this.audio = null;
209
- this.gapTimer = null;
210
- this.playing = false;
211
- }
212
- //#endregion
213
- //#region ----- Playback -----
214
- playIncoming() {
215
- this.#playLooped(CHAT_CALL_INCOMING_RING_SRC);
216
- }
217
- playOutgoing() {
218
- this.#playWithGap(CHAT_CALL_OUTGOING_RING_SRC, CHAT_CALL_OUTGOING_GAP_MS);
219
- }
220
- stop() {
221
- this.playing = false;
222
- this.#clearGapTimer();
223
- const audio = this.audio;
224
- this.audio = null;
225
- if (!audio) {
226
- return;
227
- }
228
- audio.pause();
229
- audio.removeAttribute('src');
230
- audio.load();
231
- }
232
- #playLooped(src) {
233
- this.stop();
234
- if (typeof Audio === 'undefined') {
235
- return;
236
- }
237
- this.playing = true;
238
- const audio = new Audio(src);
239
- audio.loop = true;
240
- void audio.play().catch(() => {
241
- // Autoplay may be blocked until a user gesture; the call UI still shows.
242
- });
243
- this.audio = audio;
244
- }
245
- #playWithGap(src, gapMs) {
246
- this.stop();
247
- if (typeof Audio === 'undefined') {
248
- return;
249
- }
250
- this.playing = true;
251
- this.#playOutgoingClip(src, gapMs);
252
- }
253
- #playOutgoingClip(src, gapMs) {
254
- if (!this.playing) {
255
- return;
256
- }
257
- const previous = this.audio;
258
- this.audio = null;
259
- if (previous) {
260
- previous.pause();
261
- previous.removeAttribute('src');
262
- previous.load();
263
- }
264
- const audio = new Audio(src);
265
- audio.loop = false;
266
- audio.addEventListener('ended', () => {
267
- if (!this.playing) {
268
- return;
269
- }
270
- this.#clearGapTimer();
271
- this.gapTimer = setTimeout(() => {
272
- this.gapTimer = null;
273
- this.#playOutgoingClip(src, gapMs);
274
- }, gapMs);
275
- }, { once: true });
276
- void audio.play().catch(() => {
277
- // Autoplay may be blocked until a user gesture; the call UI still shows.
278
- });
279
- this.audio = audio;
280
- }
281
- #clearGapTimer() {
282
- if (this.gapTimer == null) {
283
- return;
284
- }
285
- clearTimeout(this.gapTimer);
286
- this.gapTimer = null;
287
- }
288
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallRingerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
289
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallRingerService, providedIn: 'root' }); }
290
- }
291
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallRingerService, decorators: [{
292
- type: Injectable,
293
- args: [{ providedIn: 'root' }]
294
- }] });
295
-
296
- //#region ----- Imports -----
297
- //#endregion
298
- //#region ----- Client -----
299
- /**
300
- * Posts call signaling to the conversation API (built-in realtime fan-out on server).
301
- */
302
- class AXMChatCallSignalClient {
303
- constructor() {
304
- this.http = inject(HttpClient);
305
- this.rootConfig = inject(AXP_ROOT_CONFIG_TOKEN);
306
- }
307
- async signal(request) {
308
- const conversationId = request.conversationId.trim();
309
- const url = `${this.rootConfig.baseUrl}/v1/global/conversation/conversations/${encodeURIComponent(conversationId)}/calls/signal`;
310
- return firstValueFrom(this.http.post(url, {
311
- action: request.action,
312
- media: request.media,
313
- callId: request.callId,
314
- targetUserIds: request.targetUserIds,
315
- }, { withCredentials: true }));
316
- }
317
- async log(request) {
318
- const conversationId = request.conversationId.trim();
319
- const url = `${this.rootConfig.baseUrl}/v1/global/conversation/conversations/${encodeURIComponent(conversationId)}/calls/log`;
320
- return firstValueFrom(this.http.post(url, {
321
- outcome: request.outcome,
322
- media: request.media,
323
- callId: request.callId,
324
- durationSec: request.durationSec,
325
- initiatorUserId: request.initiatorUserId,
326
- joinedUserIds: request.joinedUserIds,
327
- absentUserIds: request.absentUserIds,
328
- isGroup: request.isGroup,
329
- }, { withCredentials: true }));
330
- }
331
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallSignalClient, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
332
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallSignalClient, providedIn: 'root' }); }
333
- }
334
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallSignalClient, decorators: [{
335
- type: Injectable,
336
- args: [{ providedIn: 'root' }]
337
- }] });
338
-
339
- //#region ----- Constants -----
340
- /** Same palette keys as `AXPAvatarComponent` (`avatar.component.ts`). */
341
- const AXM_CHAT_CALL_AVATAR_COLOR_KEYS = [
342
- 'primary',
343
- 'secondary',
344
- 'danger',
345
- 'warning',
346
- 'success',
347
- 'accent1',
348
- 'accent2',
349
- 'accent3',
350
- ];
351
- //#endregion
352
- //#region ----- Helpers -----
353
- function hashString(value) {
354
- let hash = 0;
355
- for (let index = 0; index < value.length; index += 1) {
356
- hash = (hash << 5) - hash + value.charCodeAt(index);
357
- hash |= 0;
358
- }
359
- return Math.abs(hash);
360
- }
361
- /** Stable avatar accent key per participant name — aligned with `axp-avatar` color pick. */
362
- function axmChatCallTileAvatarColor(participantName) {
363
- const scoped = participantName.trim() || '?';
364
- const index = hashString(scoped) % AXM_CHAT_CALL_AVATAR_COLOR_KEYS.length;
365
- return AXM_CHAT_CALL_AVATAR_COLOR_KEYS[index];
366
- }
367
- //#endregion
368
-
369
- //#region ----- Imports -----
370
- /**
371
- * Attaches a LiveKit track to the host media element.
372
- */
373
- class AXMChatCallVideoAttachDirective {
374
- //#endregion
375
- //#region ----- Lifecycle -----
376
- constructor() {
377
- //#region ----- Inputs -----
378
- this.axmChatCallTrack = input(null, /* @ts-ignore */
379
- ...(ngDevMode ? [{ debugName: "axmChatCallTrack" }] : /* istanbul ignore next */ []));
380
- //#endregion
381
- //#region ----- Services & Dependencies -----
382
- this.host = inject((ElementRef));
383
- effect((onCleanup) => {
384
- const track = this.axmChatCallTrack();
385
- const element = this.host.nativeElement;
386
- if (!track) {
387
- element.srcObject = null;
388
- return;
389
- }
390
- track.attach(element);
391
- void element.play().catch(() => undefined);
392
- onCleanup(() => {
393
- track.detach(element);
394
- });
395
- });
396
- }
397
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallVideoAttachDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
398
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.8", type: AXMChatCallVideoAttachDirective, isStandalone: true, selector: "video[axmChatCallTrack]", inputs: { axmChatCallTrack: { classPropertyName: "axmChatCallTrack", publicName: "axmChatCallTrack", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
399
- }
400
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallVideoAttachDirective, decorators: [{
401
- type: Directive,
402
- args: [{
403
- selector: 'video[axmChatCallTrack]',
404
- }]
405
- }], ctorParameters: () => [], propDecorators: { axmChatCallTrack: [{ type: i0.Input, args: [{ isSignal: true, alias: "axmChatCallTrack", required: false }] }] } });
406
-
407
- //#region ----- Imports -----
408
- //#endregion
409
- //#region ----- Component -----
410
- class AXMChatCallParticipantTileComponent {
411
- constructor() {
412
- //#region ----- Inputs -----
413
- this.tile = input.required(/* @ts-ignore */
414
- ...(ngDevMode ? [{ debugName: "tile" }] : /* istanbul ignore next */ []));
415
- this.videoTrack = input(null, /* @ts-ignore */
416
- ...(ngDevMode ? [{ debugName: "videoTrack" }] : /* istanbul ignore next */ []));
417
- /** Sidebar thumbnail size during screen-share presentation layout. */
418
- this.compact = input(false, /* @ts-ignore */
419
- ...(ngDevMode ? [{ debugName: "compact" }] : /* istanbul ignore next */ []));
420
- //#endregion
421
- //#region ----- Computed Properties -----
422
- this.hasVideo = computed(() => Boolean(this.videoTrack()), /* @ts-ignore */
423
- ...(ngDevMode ? [{ debugName: "hasVideo" }] : /* istanbul ignore next */ []));
424
- this.hasAvatarImage = computed(() => Boolean((this.tile().avatar ?? '').trim()), /* @ts-ignore */
425
- ...(ngDevMode ? [{ debugName: "hasAvatarImage" }] : /* istanbul ignore next */ []));
426
- this.avatarColorKey = computed(() => axmChatCallTileAvatarColor(this.tile().name), /* @ts-ignore */
427
- ...(ngDevMode ? [{ debugName: "avatarColorKey" }] : /* istanbul ignore next */ []));
428
- this.avatarSize = computed(() => {
429
- if (this.hasVideo()) {
430
- return 0;
431
- }
432
- return this.compact() ? 40 : 88;
433
- }, /* @ts-ignore */
434
- ...(ngDevMode ? [{ debugName: "avatarSize" }] : /* istanbul ignore next */ []));
435
- this.showSpeakingRing = computed(() => {
436
- const tile = this.tile();
437
- return !this.hasVideo() && !tile.micMuted && tile.audioLevel > 0.02;
438
- }, /* @ts-ignore */
439
- ...(ngDevMode ? [{ debugName: "showSpeakingRing" }] : /* istanbul ignore next */ []));
440
- this.speakingRingLevel = computed(() => {
441
- const tile = this.tile();
442
- if (this.hasVideo() || tile.micMuted || tile.audioLevel <= 0.02) {
443
- return 0;
444
- }
445
- return Math.min(10, Math.round(tile.audioLevel * 10));
446
- }, /* @ts-ignore */
447
- ...(ngDevMode ? [{ debugName: "speakingRingLevel" }] : /* istanbul ignore next */ []));
448
- }
449
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallParticipantTileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
450
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMChatCallParticipantTileComponent, isStandalone: true, selector: "axm-chat-call-participant-tile", inputs: { tile: { classPropertyName: "tile", publicName: "tile", isSignal: true, isRequired: true, transformFunction: null }, videoTrack: { classPropertyName: "videoTrack", publicName: "videoTrack", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.axm-chat-call-participant-tile--rail": "compact()" }, classAttribute: "axm-chat-call-participant-tile" }, ngImport: i0, template: "<div\n class=\"axm-chat-call-tile\"\n [class.axm-chat-call-tile--video]=\"hasVideo()\"\n [class.axm-chat-call-tile--speaking]=\"showSpeakingRing()\"\n [class.axm-chat-call-tile--compact]=\"compact()\"\n>\n <!-- ----- Blurred profile image background (camera off) ----- -->\n @if (!hasVideo() && hasAvatarImage()) {\n <img class=\"axm-chat-call-tile__bg-blur\" [src]=\"tile().avatar\" alt=\"\" />\n }\n <!-- ----- Accent gradient when no profile image ----- -->\n @else if (!hasVideo()) {\n <div\n class=\"axm-chat-call-tile__bg-color\"\n [attr.data-avatar-color]=\"avatarColorKey()\"\n ></div>\n }\n\n <!-- ----- Live camera feed ----- -->\n @if (videoTrack(); as track) {\n <video\n class=\"axm-chat-call-tile__video\"\n autoplay\n playsinline\n [muted]=\"tile().isSelf\"\n [axmChatCallTrack]=\"track\"\n ></video>\n }\n <!-- ----- Centered avatar when camera is off ----- -->\n @else {\n <div class=\"axm-chat-call-tile__avatar-stack\">\n @if (showSpeakingRing()) {\n <div class=\"axm-chat-call-tile__speaking-ring\" [attr.data-level]=\"speakingRingLevel()\"></div>\n }\n <axp-avatar [size]=\"avatarSize()\" [fullName]=\"tile().name\" [src]=\"tile().avatar ?? ''\" />\n </div>\n }\n\n <!-- ----- Camera off badge ----- -->\n @if (!tile().videoEnabled) {\n <span class=\"axm-chat-call-tile__badge axm-chat-call-tile__badge--camera\" aria-hidden=\"true\">\n <i class=\"fa-solid fa-video-slash\"></i>\n </span>\n }\n\n <span class=\"axm-chat-call-tile__name\">\n {{ tile().name }}\n @if (tile().isSelf) {\n ({{ '@conversation:chat.call.you' | translate | async }})\n }\n </span>\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXPAvatarComponent, selector: "axp-avatar", inputs: ["size", "src", "fullName", "showTitle", "fallbackText", "placeholder"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "directive", type: AXMChatCallVideoAttachDirective, selector: "video[axmChatCallTrack]", inputs: ["axmChatCallTrack"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
451
- }
452
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallParticipantTileComponent, decorators: [{
453
- type: Component,
454
- args: [{ selector: 'axm-chat-call-participant-tile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
455
- class: 'axm-chat-call-participant-tile',
456
- '[class.axm-chat-call-participant-tile--rail]': 'compact()',
457
- }, imports: [AXPAvatarComponent, AXDecoratorModule, AXMChatCallVideoAttachDirective, AXTranslationModule, AsyncPipe], template: "<div\n class=\"axm-chat-call-tile\"\n [class.axm-chat-call-tile--video]=\"hasVideo()\"\n [class.axm-chat-call-tile--speaking]=\"showSpeakingRing()\"\n [class.axm-chat-call-tile--compact]=\"compact()\"\n>\n <!-- ----- Blurred profile image background (camera off) ----- -->\n @if (!hasVideo() && hasAvatarImage()) {\n <img class=\"axm-chat-call-tile__bg-blur\" [src]=\"tile().avatar\" alt=\"\" />\n }\n <!-- ----- Accent gradient when no profile image ----- -->\n @else if (!hasVideo()) {\n <div\n class=\"axm-chat-call-tile__bg-color\"\n [attr.data-avatar-color]=\"avatarColorKey()\"\n ></div>\n }\n\n <!-- ----- Live camera feed ----- -->\n @if (videoTrack(); as track) {\n <video\n class=\"axm-chat-call-tile__video\"\n autoplay\n playsinline\n [muted]=\"tile().isSelf\"\n [axmChatCallTrack]=\"track\"\n ></video>\n }\n <!-- ----- Centered avatar when camera is off ----- -->\n @else {\n <div class=\"axm-chat-call-tile__avatar-stack\">\n @if (showSpeakingRing()) {\n <div class=\"axm-chat-call-tile__speaking-ring\" [attr.data-level]=\"speakingRingLevel()\"></div>\n }\n <axp-avatar [size]=\"avatarSize()\" [fullName]=\"tile().name\" [src]=\"tile().avatar ?? ''\" />\n </div>\n }\n\n <!-- ----- Camera off badge ----- -->\n @if (!tile().videoEnabled) {\n <span class=\"axm-chat-call-tile__badge axm-chat-call-tile__badge--camera\" aria-hidden=\"true\">\n <i class=\"fa-solid fa-video-slash\"></i>\n </span>\n }\n\n <span class=\"axm-chat-call-tile__name\">\n {{ tile().name }}\n @if (tile().isSelf) {\n ({{ '@conversation:chat.call.you' | translate | async }})\n }\n </span>\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
458
- }], propDecorators: { tile: [{ type: i0.Input, args: [{ isSignal: true, alias: "tile", required: true }] }], videoTrack: [{ type: i0.Input, args: [{ isSignal: true, alias: "videoTrack", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }] } });
459
-
460
- //#region ----- Imports -----
461
- //#endregion
462
- //#region ----- Component -----
463
- /**
464
- * Message list + composer for the call-session chat drawer.
465
- * The parent selects the call conversation in {@link AXConversationService} before rendering.
466
- */
467
- class AXMChatCallInCallChatComponent {
468
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallInCallChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
469
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: AXMChatCallInCallChatComponent, isStandalone: true, selector: "axm-chat-call-in-call-chat", ngImport: i0, template: "<div axConversationContainer class=\"axm-chat-call-in-call-chat\">\n <ax-conversation-message-list class=\"axm-chat-call-in-call-chat__messages\" style=\"direction: ltr\" />\n <ax-conversation-composer class=\"axm-chat-call-in-call-chat__composer\" />\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXConversationContainerDirective, selector: "[axConversationContainer]" }, { kind: "component", type: AXConversationMessageListComponent, selector: "ax-conversation-message-list", outputs: ["messageAction"] }, { kind: "component", type: AXConversationComposerComponent, selector: "ax-conversation-composer", outputs: ["messageSent", "generationCancelled", "emojiClick", "attachClick", "voiceClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
470
- }
471
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallInCallChatComponent, decorators: [{
472
- type: Component,
473
- args: [{ selector: 'axm-chat-call-in-call-chat', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
474
- AXConversationContainerDirective,
475
- AXConversationMessageListComponent,
476
- AXConversationComposerComponent,
477
- ], template: "<div axConversationContainer class=\"axm-chat-call-in-call-chat\">\n <ax-conversation-message-list class=\"axm-chat-call-in-call-chat__messages\" style=\"direction: ltr\" />\n <ax-conversation-composer class=\"axm-chat-call-in-call-chat__composer\" />\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
478
- }] });
479
-
480
- //#region ----- Imports -----
481
- //#endregion
482
- //#region ----- Component -----
483
- /**
484
- * Call-session popup backed by RTC/LiveKit.
485
- */
486
- class AXMChatCallSessionPageComponent extends AXBasePageComponent {
487
- //#endregion
488
- //#region ----- Stage Helpers -----
489
- resolveVideoTrack(tile) {
490
- if (!tile.videoEnabled) {
491
- return null;
492
- }
493
- if (tile.isSelf) {
494
- return this.localVideoTrack() ?? null;
495
- }
496
- const remote = this.remoteVideos().find((item) => item.participantId === tile.id);
497
- return remote?.track ?? null;
498
- }
499
- //#endregion
500
- //#region ----- Lifecycle -----
501
- constructor() {
502
- super();
503
- this.sessionMedia = 'voice';
504
- this.sessionPhase = 'outgoing-waiting';
505
- //#endregion
506
- //#region ----- Services & Dependencies -----
507
- this.userApi = inject(AXMChatUserApi);
508
- this.conversationApi = inject(AXMChatEntityConversationApi);
509
- this.chatConversationApi = inject(AXMChatConversationApi);
510
- this.conversationService = inject(AXConversationService);
511
- this.layoutBuilder = inject(AXPLayoutBuilderService);
512
- this.toastService = inject(AXToastService);
513
- this.translationService = inject(AXTranslationService);
514
- this.rtc = inject(AXMChatCallRtcService);
515
- this.callSignal = inject(AXMChatCallSignalClient);
516
- this.signalInbox = inject(AXMChatCallRtcSignalInboxService);
517
- this.activeCallSessions = inject(AXMChatCallActiveSessionService);
518
- this.callEvents = inject(AXMChatCallEventsService);
519
- this.realtimeBus = inject(AXMConversationRealtimeBus);
520
- this.conversationStore = inject(AXMConversationEntityStoreService);
521
- this.ringer = inject(AXMChatCallRingerService);
522
- //#endregion
523
- //#region ----- State Signals -----
524
- this.loading = signal(true, /* @ts-ignore */
525
- ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
526
- this.error = signal(false, /* @ts-ignore */
527
- ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
528
- this.errorMessage = signal(null, /* @ts-ignore */
529
- ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
530
- this.conversation = signal(null, /* @ts-ignore */
531
- ...(ngDevMode ? [{ debugName: "conversation" }] : /* istanbul ignore next */ []));
532
- this.phase = signal('outgoing-waiting', /* @ts-ignore */
533
- ...(ngDevMode ? [{ debugName: "phase" }] : /* istanbul ignore next */ []));
534
- this.mediaType = signal('voice', /* @ts-ignore */
535
- ...(ngDevMode ? [{ debugName: "mediaType" }] : /* istanbul ignore next */ []));
536
- this.videoEnabled = signal(false, /* @ts-ignore */
537
- ...(ngDevMode ? [{ debugName: "videoEnabled" }] : /* istanbul ignore next */ []));
538
- this.micMuted = signal(false, /* @ts-ignore */
539
- ...(ngDevMode ? [{ debugName: "micMuted" }] : /* istanbul ignore next */ []));
540
- this.currentUserId = signal(null, /* @ts-ignore */
541
- ...(ngDevMode ? [{ debugName: "currentUserId" }] : /* istanbul ignore next */ []));
542
- this.callId = signal(null, /* @ts-ignore */
543
- ...(ngDevMode ? [{ debugName: "callId" }] : /* istanbul ignore next */ []));
544
- this.ringTimeoutId = null;
545
- this.outcomeSub = null;
546
- this.callEventsSub = null;
547
- this.closing = false;
548
- this.accepting = false;
549
- this.activeSince = null;
550
- /** Wall-clock when this session UI opened — used for ring duration on cancelled/missed/declined. */
551
- this.sessionOpenedAt = Date.now();
552
- this.initiatorUserId = null;
553
- this.audioDevices = signal([], /* @ts-ignore */
554
- ...(ngDevMode ? [{ debugName: "audioDevices" }] : /* istanbul ignore next */ []));
555
- this.videoDevices = signal([], /* @ts-ignore */
556
- ...(ngDevMode ? [{ debugName: "videoDevices" }] : /* istanbul ignore next */ []));
557
- this.selectedAudioDeviceId = signal(null, /* @ts-ignore */
558
- ...(ngDevMode ? [{ debugName: "selectedAudioDeviceId" }] : /* istanbul ignore next */ []));
559
- this.selectedVideoDeviceId = signal(null, /* @ts-ignore */
560
- ...(ngDevMode ? [{ debugName: "selectedVideoDeviceId" }] : /* istanbul ignore next */ []));
561
- this.chatDrawerOpen = signal(false, /* @ts-ignore */
562
- ...(ngDevMode ? [{ debugName: "chatDrawerOpen" }] : /* istanbul ignore next */ []));
563
- this.savedActiveConversationId = undefined;
564
- this.localVideoTrack = this.rtc.localVideoTrack;
565
- this.remoteVideos = this.rtc.remoteVideos;
566
- this.localScreenShareTrack = this.rtc.localScreenShareTrack;
567
- this.remoteScreenShares = this.rtc.remoteScreenShares;
568
- //#endregion
569
- //#region ----- Computed Properties -----
570
- this.peerDisplayName = computed(() => {
571
- const conversation = this.conversation();
572
- if (!conversation) {
573
- return '';
574
- }
575
- return axmResolveConversationListAvatar(conversation).title;
576
- }, /* @ts-ignore */
577
- ...(ngDevMode ? [{ debugName: "peerDisplayName" }] : /* istanbul ignore next */ []));
578
- this.peerAvatarSrc = computed(() => {
579
- const conversation = this.conversation();
580
- if (!conversation) {
581
- return '';
582
- }
583
- return axmResolveConversationListAvatar(conversation).avatar ?? '';
584
- }, /* @ts-ignore */
585
- ...(ngDevMode ? [{ debugName: "peerAvatarSrc" }] : /* istanbul ignore next */ []));
586
- this.showStage = computed(() => {
587
- if (this.phase() === 'active' || this.mediaType() === 'video' || this.videoEnabled()) {
588
- return true;
589
- }
590
- return (this.remoteVideos().length > 0 ||
591
- this.remoteScreenShares().length > 0 ||
592
- Boolean(this.localScreenShareTrack()));
593
- }, /* @ts-ignore */
594
- ...(ngDevMode ? [{ debugName: "showStage" }] : /* istanbul ignore next */ []));
595
- this.activeScreenShare = computed(() => {
596
- const local = this.localScreenShareTrack();
597
- const currentUserId = this.currentUserId();
598
- const conversation = this.conversation();
599
- if (local && currentUserId) {
600
- const self = conversation?.participants?.find((participant) => participant.id === currentUserId);
601
- return {
602
- participantId: currentUserId,
603
- participantName: self?.name ?? 'You',
604
- isSelf: true,
605
- track: local,
606
- };
607
- }
608
- const remote = this.remoteScreenShares()[0];
609
- if (!remote) {
610
- return null;
611
- }
612
- return {
613
- participantId: remote.participantId,
614
- participantName: remote.participantName,
615
- isSelf: false,
616
- track: remote.track,
617
- };
618
- }, /* @ts-ignore */
619
- ...(ngDevMode ? [{ debugName: "activeScreenShare" }] : /* istanbul ignore next */ []));
620
- this.showScreenShareLayout = computed(() => Boolean(this.activeScreenShare()), /* @ts-ignore */
621
- ...(ngDevMode ? [{ debugName: "showScreenShareLayout" }] : /* istanbul ignore next */ []));
622
- this.showParticipantGrid = computed(() => {
623
- if (!this.showStage()) {
624
- return false;
625
- }
626
- if (this.phase() === 'active') {
627
- return true;
628
- }
629
- const phase = this.phase();
630
- return ((phase === 'connecting' || phase === 'outgoing-waiting') &&
631
- (this.videoEnabled() || this.remoteVideos().length > 0));
632
- }, /* @ts-ignore */
633
- ...(ngDevMode ? [{ debugName: "showParticipantGrid" }] : /* istanbul ignore next */ []));
634
- /** Voice ring / waiting without a video stage — center the profile block. */
635
- this.idleLayout = computed(() => {
636
- if (this.showParticipantGrid()) {
637
- return false;
638
- }
639
- if (this.showStage()) {
640
- return false;
641
- }
642
- const phase = this.phase();
643
- return phase === 'incoming' || phase === 'outgoing-waiting' || phase === 'connecting';
644
- }, /* @ts-ignore */
645
- ...(ngDevMode ? [{ debugName: "idleLayout" }] : /* istanbul ignore next */ []));
646
- this.headerAvatarSize = computed(() => 128, /* @ts-ignore */
647
- ...(ngDevMode ? [{ debugName: "headerAvatarSize" }] : /* istanbul ignore next */ []));
648
- this.phaseTextKey = computed(() => {
649
- switch (this.phase()) {
650
- case 'incoming':
651
- return '@conversation:chat.call.is-calling';
652
- case 'connecting':
653
- return '@conversation:chat.call.connecting';
654
- case 'active':
655
- return '@conversation:chat.call.connected';
656
- default:
657
- return '@conversation:chat.call.waiting';
658
- }
659
- }, /* @ts-ignore */
660
- ...(ngDevMode ? [{ debugName: "phaseTextKey" }] : /* istanbul ignore next */ []));
661
- this.stageTiles = computed(() => {
662
- const conversation = this.conversation();
663
- const currentUserId = this.currentUserId();
664
- if (!conversation || !currentUserId) {
665
- return [];
666
- }
667
- const audioLevels = this.rtc.participantAudioLevels();
668
- const remoteMicMuted = this.rtc.remoteMicMuted();
669
- const remoteVideoIds = new Set(this.remoteVideos().map((item) => item.participantId));
670
- const buildTile = (participant, isSelf) => {
671
- const id = participant.id;
672
- const micMuted = isSelf ? this.micMuted() : (remoteMicMuted[id] ?? false);
673
- const videoEnabled = isSelf ? this.videoEnabled() : remoteVideoIds.has(id);
674
- const audioLevel = micMuted ? 0 : Math.min(1, Math.max(0, audioLevels[id] ?? 0));
675
- return {
676
- id,
677
- name: participant.name,
678
- avatar: participant.avatar,
679
- isSelf,
680
- micMuted,
681
- videoEnabled,
682
- audioLevel,
683
- };
684
- };
685
- const remotes = (conversation.participants ?? []).filter((participant) => participant.id !== currentUserId);
686
- const self = conversation.participants?.find((participant) => participant.id === currentUserId);
687
- const tiles = remotes.map((participant) => buildTile(participant, false));
688
- tiles.push(buildTile({
689
- id: currentUserId,
690
- name: self?.name ?? 'You',
691
- avatar: self?.avatar,
692
- }, true));
693
- return tiles;
694
- }, /* @ts-ignore */
695
- ...(ngDevMode ? [{ debugName: "stageTiles" }] : /* istanbul ignore next */ []));
696
- effect(() => {
697
- const remoteCount = this.rtc.remoteParticipantCount();
698
- const connectionState = this.rtc.connectionState();
699
- const phase = this.phase();
700
- if (connectionState === ConnectionState.Connected &&
701
- remoteCount > 0 &&
702
- (phase === 'outgoing-waiting' || phase === 'connecting')) {
703
- this.#clearRingTimeout();
704
- this.ringer.stop();
705
- this.phase.set('active');
706
- this.activeSince = Date.now();
707
- void this.rtc.ensureAudioPlayback();
708
- }
709
- });
710
- effect(() => {
711
- if (this.phase() === 'active' && this.activeSince == null) {
712
- this.activeSince = Date.now();
713
- }
714
- });
715
- }
716
- ngOnInit() {
717
- this.outcomeSub = this.realtimeBus.messageStream$.subscribe((message) => {
718
- const log = axmReadChatCallLog(message);
719
- const currentCallId = this.callId();
720
- if (!log || !currentCallId || log.callId !== currentCallId) {
721
- return;
722
- }
723
- void this.#closeFromRemoteLog();
724
- });
725
- this.callEventsSub = this.callEvents.events$.subscribe((payload) => {
726
- const currentCallId = this.callId();
727
- if (!currentCallId || payload.callId !== currentCallId) {
728
- return;
729
- }
730
- const selfId = this.currentUserId();
731
- const fromSelf = Boolean(selfId && payload.fromUserId === selfId);
732
- if (fromSelf) {
733
- if (payload.action === 'accept' ||
734
- payload.action === 'decline' ||
735
- payload.action === 'cancel' ||
736
- payload.action === 'end') {
737
- const phase = this.phase();
738
- if (phase === 'incoming' || phase === 'outgoing-waiting') {
739
- void this.#closeFromSiblingDevice();
740
- }
741
- }
742
- return;
743
- }
744
- if (payload.action === 'accept') {
745
- this.activeCallSessions.addParticipant(currentCallId, payload.fromUserId);
746
- void this.#onPeerAccepted();
747
- return;
748
- }
749
- if (payload.action === 'end') {
750
- void this.#closeFromRemoteEnd();
751
- return;
752
- }
753
- if (payload.action === 'decline' || payload.action === 'cancel') {
754
- void this.#closeFromRemoteLog();
755
- }
756
- });
757
- void this.#bootstrap();
758
- }
759
- ngOnDestroy() {
760
- this.ringer.stop();
761
- this.#clearRingTimeout();
762
- this.outcomeSub?.unsubscribe();
763
- this.callEventsSub?.unsubscribe();
764
- this.#restoreCallConversation();
765
- if (!this.closing) {
766
- const phase = this.phase();
767
- if (phase === 'incoming') {
768
- void this.#logOutcome('declined', { durationSec: this.#elapsedDurationSec() });
769
- }
770
- else if (phase === 'outgoing-waiting') {
771
- void this.#logOutcome('cancelled', { durationSec: this.#elapsedDurationSec() });
772
- }
773
- }
774
- this.signalInbox.releaseCall(this.callId());
775
- this.activeCallSessions.release(this.callId());
776
- void this.rtc.disconnect();
777
- super.ngOnDestroy();
778
- }
779
- //#endregion
780
- //#region ----- Event Handlers -----
781
- onToggleVideo() {
782
- void this.#setVideoEnabled(!this.videoEnabled());
783
- }
784
- onToggleMute() {
785
- const nextMuted = !this.micMuted();
786
- this.micMuted.set(nextMuted);
787
- void this.rtc.setMicrophoneEnabled(!nextMuted);
788
- if (!nextMuted) {
789
- void this.rtc.ensureAudioPlayback();
790
- }
791
- }
792
- async onScreencast() {
793
- try {
794
- await this.rtc.toggleScreenShare(!this.rtc.isScreenSharing());
795
- }
796
- catch {
797
- const message = await this.translationService.translateAsync('@conversation:chat.call.media-error');
798
- this.#toast(message, 'danger');
799
- }
800
- }
801
- onEndCall() {
802
- if (this.phase() === 'outgoing-waiting') {
803
- void this.#finishWithLog('cancelled');
804
- return;
805
- }
806
- void this.#endActiveCall();
807
- }
808
- onAccept() {
809
- void this.#acceptIncoming();
810
- }
811
- onDecline() {
812
- void this.#finishWithLog('declined');
813
- }
814
- onToggleChatDrawer() {
815
- this.chatDrawerOpen.update((open) => !open);
816
- }
817
- async onAddPeople() {
818
- const conversation = this.conversation();
819
- const callId = this.callId();
820
- const currentUserId = this.currentUserId();
821
- if (!conversation?.id || !callId || !currentUserId || this.phase() !== 'active') {
822
- return;
823
- }
824
- const conversationId = conversation.id.trim();
825
- const picked = await axmOpenChatCallAddPeopleDialog(this.layoutBuilder, this.translationService);
826
- if (!picked) {
827
- return;
828
- }
829
- const inCallIds = new Set([currentUserId, ...this.rtc.getConnectedParticipantIds()]);
830
- const targetUserIds = picked.filter((userId) => !inCallIds.has(userId));
831
- if (!targetUserIds.length) {
832
- const message = await this.translationService.translateAsync('@conversation:chat.call.add-people-all-in-call');
833
- this.#toast(message, 'default');
834
- return;
835
- }
836
- try {
837
- const participantIds = new Set((conversation.participants ?? []).map((participant) => participant.id));
838
- const toAddToConversation = targetUserIds.filter((userId) => !participantIds.has(userId));
839
- if (toAddToConversation.length) {
840
- const updated = await this.conversationApi.addParticipants(conversationId, toAddToConversation);
841
- this.conversation.set(updated);
842
- }
843
- await this.callSignal.signal({
844
- conversationId,
845
- action: 'invite',
846
- media: this.mediaType(),
847
- callId,
848
- targetUserIds,
849
- });
850
- this.#trackCallParticipants(targetUserIds);
851
- const message = await this.translationService.translateAsync('@conversation:chat.call.add-people-success');
852
- this.#toast(message, 'success');
853
- }
854
- catch (error) {
855
- const fallback = await this.translationService.translateAsync('@conversation:chat.call.add-people-error');
856
- this.#toast(error instanceof Error && error.message ? error.message : fallback, 'danger');
857
- }
858
- }
859
- onRequestDevices(kind) {
860
- void this.#refreshDevices(kind);
861
- }
862
- onPickDevice(choice) {
863
- if (choice.kind === 'audioinput') {
864
- this.selectedAudioDeviceId.set(choice.deviceId);
865
- }
866
- else {
867
- this.selectedVideoDeviceId.set(choice.deviceId);
868
- }
869
- void this.rtc.switchInputDevice(choice.kind, choice.deviceId);
870
- }
871
- //#endregion
872
- //#region ----- Bootstrap -----
873
- async #bootstrap() {
874
- const conversation = this.sessionConversation;
875
- const conversationId = conversation?.id?.trim();
876
- const media = this.sessionMedia === 'video' ? 'video' : 'voice';
877
- const phase = this.sessionPhase === 'incoming' ||
878
- this.sessionPhase === 'active' ||
879
- this.sessionPhase === 'connecting' ||
880
- this.sessionPhase === 'outgoing-waiting'
881
- ? this.sessionPhase
882
- : 'outgoing-waiting';
883
- this.mediaType.set(media);
884
- this.phase.set(phase);
885
- this.videoEnabled.set(media === 'video');
886
- this.callId.set(this.sessionCallId?.trim() || createRandomUuid());
887
- this.activeCallSessions.engage(this.callId());
888
- if (!conversation || !conversationId) {
889
- this.loading.set(false);
890
- this.error.set(true);
891
- return;
892
- }
893
- this.loading.set(true);
894
- this.error.set(false);
895
- this.errorMessage.set(null);
896
- this.conversation.set(conversation);
897
- try {
898
- await this.#bindCallConversation();
899
- const currentUser = await this.userApi.getCurrentUser();
900
- this.currentUserId.set(currentUser.id);
901
- this.initiatorUserId =
902
- phase === 'incoming'
903
- ? this.sessionInitiatorUserId?.trim() || null
904
- : currentUser.id;
905
- this.videoEnabled.set(media === 'video');
906
- this.micMuted.set(false);
907
- if (phase === 'incoming') {
908
- this.#trackCallParticipants((conversation.participants ?? []).map((participant) => participant.id));
909
- this.ringer.playIncoming();
910
- void this.#refreshDevices();
911
- return;
912
- }
913
- this.phase.set('outgoing-waiting');
914
- this.ringer.playOutgoing();
915
- await this.#ringPeers(currentUser.id);
916
- this.#armRingTimeout();
917
- void this.#connectMedia(currentUser.id, currentUser.name, conversationId, media).catch(async (error) => {
918
- const message = await this.#resolveCallConnectErrorMessage(error);
919
- this.errorMessage.set(message);
920
- this.error.set(true);
921
- this.ringer.stop();
922
- this.#clearRingTimeout();
923
- this.signalInbox.suppressCall(this.callId());
924
- void this.#signalCallAction('cancel');
925
- });
926
- void this.#refreshDevices();
927
- }
928
- catch (error) {
929
- this.error.set(true);
930
- this.errorMessage.set(await this.#resolveCallConnectErrorMessage(error));
931
- }
932
- finally {
933
- this.loading.set(false);
934
- }
935
- }
936
- //#endregion
937
- //#region ----- Call Signaling -----
938
- async #connectMedia(participantIdentity, participantName, conversationId, media) {
939
- await this.rtc.connect({
940
- conversationId,
941
- participantIdentity,
942
- participantName,
943
- media,
944
- });
945
- }
946
- async #ringPeers(fromUserId) {
947
- const conversation = this.conversation();
948
- const callId = this.callId();
949
- if (!conversation?.id || !callId) {
950
- return;
951
- }
952
- const targetUserIds = this.#resolveInitialRingTargetUserIds(conversation, fromUserId);
953
- if (!targetUserIds.length) {
954
- return;
955
- }
956
- this.#trackCallParticipants(targetUserIds);
957
- try {
958
- await this.callSignal.signal({
959
- conversationId: conversation.id,
960
- action: 'invite',
961
- media: this.mediaType(),
962
- callId,
963
- targetUserIds,
964
- });
965
- }
966
- catch {
967
- // Built-in realtime is the primary ring path.
968
- }
969
- }
970
- /**
971
- * Private chats ring only the peer; group chats ring every participant except self.
972
- */
973
- #resolveInitialRingTargetUserIds(conversation, fromUserId) {
974
- const scopedFrom = fromUserId.trim();
975
- const participantIds = (conversation.participants ?? [])
976
- .map((participant) => participant.id?.trim())
977
- .filter((id) => Boolean(id) && id !== scopedFrom);
978
- if (conversation.type === 'private') {
979
- return participantIds.slice(0, 1);
980
- }
981
- return participantIds;
982
- }
983
- async #acceptIncoming() {
984
- if (this.accepting || this.closing) {
985
- return;
986
- }
987
- const conversationId = this.conversation()?.id?.trim();
988
- const currentUserId = this.currentUserId();
989
- const callId = this.callId();
990
- if (!conversationId || !currentUserId) {
991
- return;
992
- }
993
- this.signalInbox.suppressCall(callId);
994
- this.accepting = true;
995
- this.#clearRingTimeout();
996
- this.ringer.stop();
997
- this.phase.set('connecting');
998
- void this.#signalCallAction('accept');
999
- try {
1000
- await this.#connectMedia(currentUserId, this.#selfDisplayName(currentUserId), conversationId, this.mediaType());
1001
- this.phase.set('active');
1002
- this.activeSince = Date.now();
1003
- void this.rtc.ensureAudioPlayback();
1004
- if (this.mediaType() === 'video') {
1005
- void this.#setVideoEnabled(true);
1006
- }
1007
- }
1008
- catch (error) {
1009
- this.accepting = false;
1010
- this.ringer.stop();
1011
- this.errorMessage.set(await this.#resolveCallConnectErrorMessage(error));
1012
- this.error.set(true);
1013
- void this.#signalCallAction('end');
1014
- }
1015
- }
1016
- async #onPeerAccepted() {
1017
- if (this.closing) {
1018
- return;
1019
- }
1020
- this.#clearRingTimeout();
1021
- this.ringer.stop();
1022
- this.phase.set(this.rtc.connectionState() === ConnectionState.Connected ? 'active' : 'connecting');
1023
- if (this.phase() === 'active') {
1024
- this.activeSince = Date.now();
1025
- }
1026
- void this.rtc.ensureAudioPlayback();
1027
- }
1028
- async #signalCallAction(action) {
1029
- const conversation = this.conversation();
1030
- const callId = this.callId();
1031
- const fromUserId = this.currentUserId();
1032
- if (!conversation?.id || !callId || !fromUserId) {
1033
- return;
1034
- }
1035
- const targetUserIds = this.#resolveCallSignalTargetUserIds(conversation, fromUserId, action);
1036
- if (!targetUserIds.length) {
1037
- return;
1038
- }
1039
- try {
1040
- await this.callSignal.signal({
1041
- conversationId: conversation.id,
1042
- action,
1043
- media: this.mediaType(),
1044
- callId,
1045
- targetUserIds,
1046
- });
1047
- }
1048
- catch {
1049
- // Media join is the source of truth; signaling is best-effort.
1050
- }
1051
- }
1052
- /** During an active call, signal everyone who joined or was invited — not only local conversation.participants. */
1053
- #resolveCallSignalTargetUserIds(conversation, fromUserId, action) {
1054
- const scopedFrom = fromUserId.trim();
1055
- const connectedIds = this.rtc
1056
- .getConnectedParticipantIds()
1057
- .map((id) => id.trim())
1058
- .filter(Boolean);
1059
- const participantIds = (conversation.participants ?? [])
1060
- .map((participant) => participant.id?.trim())
1061
- .filter((id) => Boolean(id) && id !== scopedFrom);
1062
- const trackedIds = this.activeCallSessions.getParticipantIds(this.callId());
1063
- if (action === 'end') {
1064
- return this.#unionCallTargetUserIds(scopedFrom, participantIds, connectedIds, trackedIds);
1065
- }
1066
- if (action === 'accept') {
1067
- const union = this.#unionCallTargetUserIds(scopedFrom, participantIds, connectedIds, trackedIds);
1068
- if (union.length) {
1069
- return union;
1070
- }
1071
- if (conversation.type === 'private') {
1072
- return participantIds.slice(0, 1);
1073
- }
1074
- return participantIds;
1075
- }
1076
- if (action === 'decline' || action === 'cancel') {
1077
- const union = this.#unionCallTargetUserIds(scopedFrom, participantIds, trackedIds, []);
1078
- if (union.length) {
1079
- return union;
1080
- }
1081
- if (conversation.type === 'private') {
1082
- return participantIds.slice(0, 1);
1083
- }
1084
- return participantIds;
1085
- }
1086
- return participantIds;
1087
- }
1088
- #unionCallTargetUserIds(fromUserId, participantIds, connectedIds, trackedIds) {
1089
- const targets = new Set();
1090
- for (const id of participantIds) {
1091
- targets.add(id);
1092
- }
1093
- for (const id of connectedIds) {
1094
- if (id !== fromUserId) {
1095
- targets.add(id);
1096
- }
1097
- }
1098
- for (const id of trackedIds) {
1099
- if (id !== fromUserId) {
1100
- targets.add(id);
1101
- }
1102
- }
1103
- return [...targets];
1104
- }
1105
- #trackCallParticipants(userIds) {
1106
- const callId = this.callId();
1107
- const selfId = this.currentUserId();
1108
- if (!callId) {
1109
- return;
1110
- }
1111
- for (const userId of userIds) {
1112
- const scoped = userId?.trim();
1113
- if (scoped && scoped !== selfId) {
1114
- this.activeCallSessions.addParticipant(callId, scoped);
1115
- }
1116
- }
1117
- }
1118
- #selfDisplayName(currentUserId) {
1119
- return this.conversation()?.participants?.find((participant) => participant.id === currentUserId)?.name;
1120
- }
1121
- #armRingTimeout() {
1122
- this.#clearRingTimeout();
1123
- this.ringTimeoutId = setTimeout(() => {
1124
- if (this.phase() === 'outgoing-waiting') {
1125
- this.ringer.stop();
1126
- void this.translationService
1127
- .translateAsync('@conversation:chat.call.no-answer')
1128
- .then((message) => this.#toast(message, 'default'));
1129
- void this.#finishWithLog('missed');
1130
- }
1131
- }, 45_000);
1132
- }
1133
- #clearRingTimeout() {
1134
- if (this.ringTimeoutId != null) {
1135
- clearTimeout(this.ringTimeoutId);
1136
- this.ringTimeoutId = null;
1137
- }
1138
- }
1139
- async #finishWithLog(outcome) {
1140
- if (this.closing) {
1141
- return;
1142
- }
1143
- this.closing = true;
1144
- this.signalInbox.suppressCall(this.callId());
1145
- this.ringer.stop();
1146
- this.#clearRingTimeout();
1147
- await this.#signalCallAction(outcome === 'declined' ? 'decline' : 'cancel');
1148
- await this.#logOutcome(outcome, { durationSec: this.#elapsedDurationSec() });
1149
- await this.#closeLocal();
1150
- }
1151
- async #endActiveCall() {
1152
- if (this.closing) {
1153
- return;
1154
- }
1155
- this.closing = true;
1156
- this.signalInbox.suppressCall(this.callId());
1157
- this.#trackCallParticipants(this.rtc.getConnectedParticipantIds());
1158
- this.ringer.stop();
1159
- this.#clearRingTimeout();
1160
- await this.#logCompletedIfActive();
1161
- if (this.activeSince == null && this.phase() === 'connecting') {
1162
- await this.#logOutcome('cancelled', { durationSec: this.#elapsedDurationSec() });
1163
- }
1164
- await this.#signalCallAction('end');
1165
- await this.#closeLocal();
1166
- }
1167
- async #logCompletedIfActive() {
1168
- if (this.activeSince == null) {
1169
- return;
1170
- }
1171
- const conversation = this.conversation();
1172
- if (!conversation) {
1173
- return;
1174
- }
1175
- const conversationId = conversation.id?.trim();
1176
- const callId = this.callId();
1177
- const currentUserId = this.currentUserId();
1178
- if (!conversationId || !callId || !currentUserId) {
1179
- return;
1180
- }
1181
- const durationSec = Math.max(1, Math.round((Date.now() - this.activeSince) / 1000));
1182
- const joinedUserIds = [
1183
- ...new Set([currentUserId, ...this.rtc.getConnectedParticipantIds().map((id) => id.trim()).filter(Boolean)]),
1184
- ];
1185
- const allParticipantIds = (conversation.participants ?? [])
1186
- .map((participant) => participant.id?.trim())
1187
- .filter((id) => Boolean(id));
1188
- const absentUserIds = allParticipantIds.filter((id) => !joinedUserIds.includes(id));
1189
- await this.#logOutcome('completed', {
1190
- durationSec,
1191
- joinedUserIds,
1192
- absentUserIds,
1193
- });
1194
- }
1195
- /** Talk time when connected; otherwise ring/wait time since the session opened. */
1196
- #elapsedDurationSec() {
1197
- const startedAt = this.activeSince ?? this.sessionOpenedAt;
1198
- return Math.max(1, Math.round((Date.now() - startedAt) / 1000));
1199
- }
1200
- async #logOutcome(outcome, extras) {
1201
- const conversation = this.conversation();
1202
- const conversationId = conversation?.id?.trim();
1203
- const callId = this.callId();
1204
- const currentUserId = this.currentUserId();
1205
- if (!conversationId || !callId) {
1206
- return;
1207
- }
1208
- try {
1209
- const result = await this.callSignal.log({
1210
- conversationId,
1211
- outcome,
1212
- media: this.mediaType(),
1213
- callId,
1214
- initiatorUserId: this.initiatorUserId ?? currentUserId ?? undefined,
1215
- isGroup: conversation?.type !== 'private',
1216
- ...extras,
1217
- });
1218
- const peerUserId = (conversation?.participants ?? [])
1219
- .map((participant) => participant.id?.trim())
1220
- .find((id) => id && id !== currentUserId) ?? null;
1221
- const peerUserName = peerUserId
1222
- ? conversation?.participants?.find((participant) => participant.id === peerUserId)?.name
1223
- : null;
1224
- const fallback = axmBuildChatCallLogMessage({
1225
- messageId: result.messageId,
1226
- conversationId,
1227
- senderId: currentUserId ?? '',
1228
- outcome,
1229
- media: this.mediaType(),
1230
- callId,
1231
- initiatorUserId: this.initiatorUserId ?? currentUserId ?? undefined,
1232
- isGroup: conversation?.type !== 'private',
1233
- actorUserId: currentUserId ?? undefined,
1234
- peerUserId,
1235
- peerUserName,
1236
- durationSec: extras?.durationSec,
1237
- joinedUserIds: extras?.joinedUserIds,
1238
- absentUserIds: extras?.absentUserIds,
1239
- });
1240
- const logged = (await this.conversationStore.getMessage(result.messageId)) ?? fallback;
1241
- this.conversationStore.publishNewMessage(logged);
1242
- void this.conversationStore.touchLastMessage(conversationId, logged);
1243
- }
1244
- catch (error) {
1245
- console.warn('[chat-call] Failed to persist call log message', error);
1246
- }
1247
- }
1248
- async #closeFromRemoteLog() {
1249
- if (this.closing || this.phase() === 'active') {
1250
- return;
1251
- }
1252
- this.closing = true;
1253
- this.ringer.stop();
1254
- this.#clearRingTimeout();
1255
- await this.#closeLocal();
1256
- }
1257
- async #closeFromRemoteEnd() {
1258
- if (this.closing) {
1259
- return;
1260
- }
1261
- this.closing = true;
1262
- this.ringer.stop();
1263
- this.#clearRingTimeout();
1264
- await this.#closeLocal();
1265
- }
1266
- /** Another device of this user answered/declined — dismiss ringing UI without logging again. */
1267
- async #closeFromSiblingDevice() {
1268
- if (this.closing) {
1269
- return;
1270
- }
1271
- this.closing = true;
1272
- this.signalInbox.suppressCall(this.callId());
1273
- this.ringer.stop();
1274
- this.#clearRingTimeout();
1275
- await this.#closeLocal();
1276
- }
1277
- async #closeLocal() {
1278
- this.ringer.stop();
1279
- this.#restoreCallConversation();
1280
- this.signalInbox.releaseCall(this.callId());
1281
- await this.rtc.disconnect();
1282
- this.close();
1283
- }
1284
- //#endregion
1285
- //#region ----- Conversation Focus -----
1286
- async #bindCallConversation() {
1287
- const conversationId = this.conversation()?.id?.trim();
1288
- if (!conversationId) {
1289
- return;
1290
- }
1291
- if (this.savedActiveConversationId === undefined) {
1292
- this.savedActiveConversationId = this.conversationService.activeConversationId();
1293
- }
1294
- await this.conversationService.selectConversation(conversationId);
1295
- this.chatConversationApi.reportFocusedConversation(conversationId);
1296
- }
1297
- #restoreCallConversation() {
1298
- if (this.savedActiveConversationId === undefined) {
1299
- return;
1300
- }
1301
- const conversationId = this.savedActiveConversationId;
1302
- this.savedActiveConversationId = undefined;
1303
- this.chatConversationApi.reportFocusedConversation(typeof conversationId === 'string' ? conversationId : null);
1304
- void this.conversationService.selectConversation(conversationId);
1305
- }
1306
- //#endregion
1307
- //#region ----- Media Helpers -----
1308
- async #refreshDevices(kind) {
1309
- try {
1310
- if (!kind || kind === 'audioinput') {
1311
- this.audioDevices.set(await this.rtc.listInputDevices('audioinput'));
1312
- }
1313
- if (!kind || kind === 'videoinput') {
1314
- this.videoDevices.set(await this.rtc.listInputDevices('videoinput'));
1315
- }
1316
- }
1317
- catch {
1318
- // Device lists stay empty until the browser grants media permission.
1319
- }
1320
- }
1321
- async #setVideoEnabled(enabled) {
1322
- this.videoEnabled.set(enabled);
1323
- if (enabled) {
1324
- this.mediaType.set('video');
1325
- }
1326
- try {
1327
- await this.rtc.setCameraEnabled(enabled);
1328
- }
1329
- catch (error) {
1330
- this.videoEnabled.set(false);
1331
- const message = await this.#resolveCallMediaErrorMessage(error);
1332
- this.#toast(message, 'danger');
1333
- }
1334
- }
1335
- async #resolveCallConnectErrorMessage(error) {
1336
- const mediaIssue = axmReadChatCallMediaContextIssue(error);
1337
- if (mediaIssue === 'secure-context') {
1338
- return this.translationService.translateAsync('@conversation:chat.call.media-secure-context-required');
1339
- }
1340
- if (mediaIssue === 'unsupported') {
1341
- return this.translationService.translateAsync('@conversation:chat.call.media-unavailable');
1342
- }
1343
- const fallback = await this.translationService.translateAsync('@conversation:chat.call.connect-error');
1344
- return error instanceof Error && error.message ? error.message : fallback;
1345
- }
1346
- async #resolveCallMediaErrorMessage(error) {
1347
- const mediaIssue = axmReadChatCallMediaContextIssue(error);
1348
- if (mediaIssue === 'secure-context') {
1349
- return this.translationService.translateAsync('@conversation:chat.call.media-secure-context-required');
1350
- }
1351
- if (mediaIssue === 'unsupported') {
1352
- return this.translationService.translateAsync('@conversation:chat.call.media-unavailable');
1353
- }
1354
- return this.translationService.translateAsync('@conversation:chat.call.media-error');
1355
- }
1356
- #toast(content, color) {
1357
- this.toastService.show({
1358
- color,
1359
- content,
1360
- location: 'bottom-center',
1361
- timeOut: 3000,
1362
- });
1363
- }
1364
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallSessionPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1365
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMChatCallSessionPageComponent, isStandalone: true, selector: "axm-chat-call-session-page", host: { classAttribute: "ax-dark axm-chat-call-session-page" }, providers: [...AXM_CHAT_CALL_RTC_PROVIDERS], usesInheritance: true, ngImport: i0, template: "<div class=\"axm-chat-call-session\">\n <!-- ----- Loading conversation / connecting RTC ----- -->\n @if (loading()) {\n <div class=\"axm-chat-call-session__status-block\">\n {{ '@conversation:chat.call.loading' | translate | async }}\n </div>\n }\n <!-- ----- Load / connect error ----- -->\n @else if (error()) {\n <div class=\"axm-chat-call-session__status-block axm-chat-call-session__status-block--error\">\n <p>{{ errorMessage() || ('@conversation:chat.call.load-error' | translate | async) }}</p>\n <button type=\"button\" class=\"axm-chat-call-session__text-button\" (click)=\"onEndCall()\">\n {{ '@conversation:chat.call.cancel' | translate | async }}\n </button>\n </div>\n }\n <!-- ----- Call session ----- -->\n @else {\n <ax-drawer-container class=\"axm-chat-call-session__drawer-host\" dir=\"ltr\">\n <ax-content class=\"axm-chat-call-session__drawer-main\">\n <div\n class=\"axm-chat-call-session__main\"\n [class.axm-chat-call-session__main--idle]=\"idleLayout()\"\n [class.axm-chat-call-session__main--grid]=\"showParticipantGrid() && !showScreenShareLayout()\"\n [class.axm-chat-call-session__main--present]=\"showScreenShareLayout()\"\n >\n <div\n class=\"axm-chat-call-session__body\"\n [class.axm-chat-call-session__body--grid]=\"showParticipantGrid()\"\n >\n <!-- ----- Centered profile (ringing / incoming voice) ----- -->\n @if (!showParticipantGrid()) {\n <div class=\"axm-chat-call-session__header\">\n <axp-avatar\n [size]=\"headerAvatarSize()\"\n [fullName]=\"peerDisplayName()\"\n [src]=\"peerAvatarSrc()\"\n />\n <h1 class=\"axm-chat-call-session__name\">{{ peerDisplayName() }}</h1>\n <p class=\"axm-chat-call-session__phase-text\">{{ phaseTextKey() | translate | async }}</p>\n </div>\n }\n\n <!-- ----- Participant grid (active / video preview) ----- -->\n @if (showParticipantGrid()) {\n <!-- ----- Screen share: large present + compact participant rail ----- -->\n @if (showScreenShareLayout()) {\n @if (activeScreenShare(); as share) {\n <div class=\"axm-chat-call-session__stage axm-chat-call-session__stage--present\">\n <div class=\"axm-chat-call-session__present-main\">\n <div class=\"axm-chat-call-session__present-screen\">\n <video\n class=\"axm-chat-call-session__present-video\"\n autoplay\n playsinline\n [muted]=\"share.isSelf\"\n [axmChatCallTrack]=\"share.track\"\n ></video>\n <span class=\"axm-chat-call-session__present-label\">\n {{ share.participantName }}\n \u00B7\n {{ '@conversation:chat.call.presenting' | translate | async }}\n </span>\n </div>\n </div>\n <div class=\"axm-chat-call-session__present-rail\">\n @for (tile of stageTiles(); track tile.id) {\n <axm-chat-call-participant-tile\n [tile]=\"tile\"\n [videoTrack]=\"resolveVideoTrack(tile)\"\n [compact]=\"true\"\n />\n }\n </div>\n </div>\n }\n }\n <!-- ----- Default equal-width participant grid ----- -->\n @else {\n <div class=\"axm-chat-call-session__stage axm-chat-call-session__stage--grid\">\n <div\n class=\"axm-chat-call-session__grid\"\n [attr.data-tile-count]=\"stageTiles().length\"\n >\n @for (tile of stageTiles(); track tile.id) {\n <axm-chat-call-participant-tile\n [tile]=\"tile\"\n [videoTrack]=\"resolveVideoTrack(tile)\"\n />\n }\n </div>\n </div>\n }\n }\n </div>\n\n <axm-chat-call-controls\n [phase]=\"phase()\"\n [videoEnabled]=\"videoEnabled()\"\n [micMuted]=\"micMuted()\"\n [showAddPeople]=\"phase() === 'active'\"\n [showScreencast]=\"phase() === 'active'\"\n [showChat]=\"phase() === 'active'\"\n [chatOpen]=\"chatDrawerOpen()\"\n [audioDevices]=\"audioDevices()\"\n [videoDevices]=\"videoDevices()\"\n [selectedAudioDeviceId]=\"selectedAudioDeviceId()\"\n [selectedVideoDeviceId]=\"selectedVideoDeviceId()\"\n (screencast)=\"onScreencast()\"\n (openChat)=\"onToggleChatDrawer()\"\n (toggleVideo)=\"onToggleVideo()\"\n (toggleMute)=\"onToggleMute()\"\n (endCall)=\"onEndCall()\"\n (accept)=\"onAccept()\"\n (decline)=\"onDecline()\"\n (addPeople)=\"onAddPeople()\"\n (requestDevices)=\"onRequestDevices($event)\"\n (pickDevice)=\"onPickDevice($event)\"\n />\n </div>\n </ax-content>\n\n <!-- ----- In-call chat (push drawer) ----- -->\n <ax-drawer\n class=\"axm-chat-call-session__chat-drawer\"\n location=\"end\"\n mode=\"push\"\n [collapsed]=\"!chatDrawerOpen()\"\n >\n <ax-content class=\"axm-chat-call-session__chat-drawer-content\">\n <header class=\"axm-chat-call-session__chat-drawer-header\">\n <h2 class=\"axm-chat-call-session__chat-drawer-title\">{{ peerDisplayName() }}</h2>\n <ax-button\n look=\"blank\"\n (onClick)=\"onToggleChatDrawer()\"\n [attr.aria-label]=\"('@conversation:chat.call.close-chat' | translate | async) ?? ''\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-xmark\" />\n </ax-prefix>\n </ax-button>\n </header>\n @if (chatDrawerOpen()) {\n <axm-chat-call-in-call-chat class=\"axm-chat-call-session__chat-drawer-body\" />\n }\n </ax-content>\n </ax-drawer>\n </ax-drawer-container>\n }\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXPAvatarComponent, selector: "axp-avatar", inputs: ["size", "src", "fullName", "showTitle", "fallbackText", "placeholder"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXDrawerModule }, { kind: "component", type: i3$1.AXDrawerComponent, selector: "ax-drawer", inputs: ["location", "showBackdrop", "mode", "transition", "closeOnBackdropClick", "backdropClass", "collapsed", "singleOpenMode"], outputs: ["onBackdropClick", "collapsedStateChanged"] }, { kind: "component", type: i3$1.AXDrawerContainerComponent, selector: "ax-drawer-container" }, { kind: "component", type: AXMChatCallControlsComponent, selector: "axm-chat-call-controls", inputs: ["phase", "videoEnabled", "micMuted", "showAddPeople", "showScreencast", "showChat", "chatOpen", "audioDevices", "videoDevices", "selectedAudioDeviceId", "selectedVideoDeviceId"], outputs: ["screencast", "openChat", "toggleVideo", "toggleMute", "endCall", "accept", "decline", "addPeople", "pickDevice", "requestDevices"] }, { kind: "component", type: AXMChatCallParticipantTileComponent, selector: "axm-chat-call-participant-tile", inputs: ["tile", "videoTrack", "compact"] }, { kind: "directive", type: AXMChatCallVideoAttachDirective, selector: "video[axmChatCallTrack]", inputs: ["axmChatCallTrack"] }, { kind: "component", type: AXMChatCallInCallChatComponent, selector: "axm-chat-call-in-call-chat" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1366
- }
1367
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMChatCallSessionPageComponent, decorators: [{
1368
- type: Component,
1369
- args: [{ selector: 'axm-chat-call-session-page', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
1370
- class: 'ax-dark axm-chat-call-session-page',
1371
- }, providers: [...AXM_CHAT_CALL_RTC_PROVIDERS], imports: [
1372
- AXPAvatarComponent,
1373
- AXTranslationModule,
1374
- AsyncPipe,
1375
- AXButtonModule,
1376
- AXDecoratorModule,
1377
- AXDrawerModule,
1378
- AXMChatCallControlsComponent,
1379
- AXMChatCallParticipantTileComponent,
1380
- AXMChatCallVideoAttachDirective,
1381
- AXMChatCallInCallChatComponent,
1382
- ], template: "<div class=\"axm-chat-call-session\">\n <!-- ----- Loading conversation / connecting RTC ----- -->\n @if (loading()) {\n <div class=\"axm-chat-call-session__status-block\">\n {{ '@conversation:chat.call.loading' | translate | async }}\n </div>\n }\n <!-- ----- Load / connect error ----- -->\n @else if (error()) {\n <div class=\"axm-chat-call-session__status-block axm-chat-call-session__status-block--error\">\n <p>{{ errorMessage() || ('@conversation:chat.call.load-error' | translate | async) }}</p>\n <button type=\"button\" class=\"axm-chat-call-session__text-button\" (click)=\"onEndCall()\">\n {{ '@conversation:chat.call.cancel' | translate | async }}\n </button>\n </div>\n }\n <!-- ----- Call session ----- -->\n @else {\n <ax-drawer-container class=\"axm-chat-call-session__drawer-host\" dir=\"ltr\">\n <ax-content class=\"axm-chat-call-session__drawer-main\">\n <div\n class=\"axm-chat-call-session__main\"\n [class.axm-chat-call-session__main--idle]=\"idleLayout()\"\n [class.axm-chat-call-session__main--grid]=\"showParticipantGrid() && !showScreenShareLayout()\"\n [class.axm-chat-call-session__main--present]=\"showScreenShareLayout()\"\n >\n <div\n class=\"axm-chat-call-session__body\"\n [class.axm-chat-call-session__body--grid]=\"showParticipantGrid()\"\n >\n <!-- ----- Centered profile (ringing / incoming voice) ----- -->\n @if (!showParticipantGrid()) {\n <div class=\"axm-chat-call-session__header\">\n <axp-avatar\n [size]=\"headerAvatarSize()\"\n [fullName]=\"peerDisplayName()\"\n [src]=\"peerAvatarSrc()\"\n />\n <h1 class=\"axm-chat-call-session__name\">{{ peerDisplayName() }}</h1>\n <p class=\"axm-chat-call-session__phase-text\">{{ phaseTextKey() | translate | async }}</p>\n </div>\n }\n\n <!-- ----- Participant grid (active / video preview) ----- -->\n @if (showParticipantGrid()) {\n <!-- ----- Screen share: large present + compact participant rail ----- -->\n @if (showScreenShareLayout()) {\n @if (activeScreenShare(); as share) {\n <div class=\"axm-chat-call-session__stage axm-chat-call-session__stage--present\">\n <div class=\"axm-chat-call-session__present-main\">\n <div class=\"axm-chat-call-session__present-screen\">\n <video\n class=\"axm-chat-call-session__present-video\"\n autoplay\n playsinline\n [muted]=\"share.isSelf\"\n [axmChatCallTrack]=\"share.track\"\n ></video>\n <span class=\"axm-chat-call-session__present-label\">\n {{ share.participantName }}\n \u00B7\n {{ '@conversation:chat.call.presenting' | translate | async }}\n </span>\n </div>\n </div>\n <div class=\"axm-chat-call-session__present-rail\">\n @for (tile of stageTiles(); track tile.id) {\n <axm-chat-call-participant-tile\n [tile]=\"tile\"\n [videoTrack]=\"resolveVideoTrack(tile)\"\n [compact]=\"true\"\n />\n }\n </div>\n </div>\n }\n }\n <!-- ----- Default equal-width participant grid ----- -->\n @else {\n <div class=\"axm-chat-call-session__stage axm-chat-call-session__stage--grid\">\n <div\n class=\"axm-chat-call-session__grid\"\n [attr.data-tile-count]=\"stageTiles().length\"\n >\n @for (tile of stageTiles(); track tile.id) {\n <axm-chat-call-participant-tile\n [tile]=\"tile\"\n [videoTrack]=\"resolveVideoTrack(tile)\"\n />\n }\n </div>\n </div>\n }\n }\n </div>\n\n <axm-chat-call-controls\n [phase]=\"phase()\"\n [videoEnabled]=\"videoEnabled()\"\n [micMuted]=\"micMuted()\"\n [showAddPeople]=\"phase() === 'active'\"\n [showScreencast]=\"phase() === 'active'\"\n [showChat]=\"phase() === 'active'\"\n [chatOpen]=\"chatDrawerOpen()\"\n [audioDevices]=\"audioDevices()\"\n [videoDevices]=\"videoDevices()\"\n [selectedAudioDeviceId]=\"selectedAudioDeviceId()\"\n [selectedVideoDeviceId]=\"selectedVideoDeviceId()\"\n (screencast)=\"onScreencast()\"\n (openChat)=\"onToggleChatDrawer()\"\n (toggleVideo)=\"onToggleVideo()\"\n (toggleMute)=\"onToggleMute()\"\n (endCall)=\"onEndCall()\"\n (accept)=\"onAccept()\"\n (decline)=\"onDecline()\"\n (addPeople)=\"onAddPeople()\"\n (requestDevices)=\"onRequestDevices($event)\"\n (pickDevice)=\"onPickDevice($event)\"\n />\n </div>\n </ax-content>\n\n <!-- ----- In-call chat (push drawer) ----- -->\n <ax-drawer\n class=\"axm-chat-call-session__chat-drawer\"\n location=\"end\"\n mode=\"push\"\n [collapsed]=\"!chatDrawerOpen()\"\n >\n <ax-content class=\"axm-chat-call-session__chat-drawer-content\">\n <header class=\"axm-chat-call-session__chat-drawer-header\">\n <h2 class=\"axm-chat-call-session__chat-drawer-title\">{{ peerDisplayName() }}</h2>\n <ax-button\n look=\"blank\"\n (onClick)=\"onToggleChatDrawer()\"\n [attr.aria-label]=\"('@conversation:chat.call.close-chat' | translate | async) ?? ''\"\n >\n <ax-prefix>\n <ax-icon icon=\"fa-light fa-xmark\" />\n </ax-prefix>\n </ax-button>\n </header>\n @if (chatDrawerOpen()) {\n <axm-chat-call-in-call-chat class=\"axm-chat-call-session__chat-drawer-body\" />\n }\n </ax-content>\n </ax-drawer>\n </ax-drawer-container>\n }\n</div>\n", styles: ["@layer properties;axm-chat-call-session-page{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column}.axm-chat-call-session{box-sizing:border-box;display:flex;height:100%;min-height:0px;width:100%;flex:1}.axm-chat-call-session__drawer-host{display:flex;height:100%;min-height:0px;width:100%;flex:1;direction:ltr}.axm-chat-call-session__drawer-main{display:flex;height:100%;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__chat-drawer{width:min(22rem,100%);max-width:100%;border-left-style:var(--tw-border-style);border-left-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-content{display:flex;height:100%;min-height:0px;width:100%;flex-direction:column;background-color:#1a1c1e}.axm-chat-call-session__chat-drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 3);border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2.5);color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-session__chat-drawer-header{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-session__chat-drawer-title{margin:0;min-width:0px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9375rem;--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axm-chat-call-session__chat-drawer-body{min-height:0px;flex:1}.axm-chat-call-session__main{display:flex;min-height:0px;min-width:0px;flex:1;flex-direction:column;align-items:center;padding-inline:calc(var(--spacing, .25rem) * 5);padding-top:calc(var(--spacing, .25rem) * 5);padding-bottom:calc(var(--spacing, .25rem) * 2)}.axm-chat-call-session__main--grid,.axm-chat-call-session__main--present{align-items:stretch;padding:calc(var(--spacing, .25rem) * 2);padding-bottom:var(--spacing, .25rem)}.axm-chat-call-session__body{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center}.axm-chat-call-session__main--idle .axm-chat-call-session__body{justify-content:center}.axm-chat-call-session__header{margin-top:calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * 2);text-align:center}.axm-chat-call-session__main--idle .axm-chat-call-session__header{margin-top:0}.axm-chat-call-session__name{margin:0;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}.axm-chat-call-session__phase-text{margin:0;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:65%}.axm-chat-call-session__body--grid{flex:1;align-items:stretch}.axm-chat-call-session__stage{margin-block:calc(var(--spacing, .25rem) * 3);display:flex;min-height:0px;width:100%;flex:1;align-items:center;justify-content:center;overflow:hidden}.axm-chat-call-session__stage--grid{margin:0;min-height:0px;flex:1;align-items:stretch;justify-content:stretch;padding:0}.axm-chat-call-session__grid{display:grid;height:100%;min-height:0px;width:100%;flex:1;gap:calc(var(--spacing, .25rem) * 2);grid-auto-rows:minmax(0,1fr)}.axm-chat-call-session__grid[data-tile-count=\"1\"]{grid-template-columns:repeat(1,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"2\"]{grid-template-columns:repeat(2,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"3\"]{grid-template-columns:repeat(3,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"4\"]{grid-template-columns:repeat(4,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"5\"]{grid-template-columns:repeat(5,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"6\"]{grid-template-columns:repeat(6,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"7\"]{grid-template-columns:repeat(7,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"8\"]{grid-template-columns:repeat(8,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"9\"]{grid-template-columns:repeat(9,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"10\"]{grid-template-columns:repeat(10,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"11\"]{grid-template-columns:repeat(11,minmax(0,1fr))}.axm-chat-call-session__grid[data-tile-count=\"12\"]{grid-template-columns:repeat(12,minmax(0,1fr))}.axm-chat-call-session__stage--present{margin:0;display:flex;min-height:0px;width:100%;flex:1;flex-direction:row;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);padding:0}.axm-chat-call-session__present-main{display:flex;min-height:0px;min-width:0px;flex:1}.axm-chat-call-session__present-screen{position:relative;box-sizing:border-box;min-height:0px;flex:1;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:var(--color-black, #000);border:3px solid #f9ab00;box-shadow:0 0 0 1px #f9ab0059}.axm-chat-call-session__present-video{height:100%;width:100%;background-color:var(--color-black, #000);object-fit:contain}.axm-chat-call-session__present-label{position:absolute;bottom:calc(var(--spacing, .25rem) * 2.5);left:calc(var(--spacing, .25rem) * 2.5);z-index:1;max-width:calc(100% - 1.3rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:var(--spacing, .25rem);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-session__present-rail{display:flex;height:100%;min-height:0px;width:calc(var(--spacing, .25rem) * 44);flex-shrink:0;flex-direction:column;align-content:flex-start;align-items:stretch;justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 2);overflow-x:hidden;overflow-y:auto}.axm-chat-call-session__present-rail axm-chat-call-participant-tile{height:5.75rem;max-height:5.75rem;min-height:5.75rem;flex-shrink:0;flex:0 0 5.75rem}.axm-chat-call-session__status-block{display:flex;min-height:0px;width:100%;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 4);padding:calc(var(--spacing, .25rem) * 8);text-align:center}.axm-chat-call-session__status-block--error{color:#ff8a80}.axm-chat-call-session__text-button{cursor:pointer;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:currentcolor;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2);opacity:85%}axm-chat-call-controls{margin-top:auto;display:block;width:100%;flex-shrink:0}.axm-chat-call-controls{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 5);padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 3);padding-bottom:calc(var(--spacing, .25rem) * 5)}.axm-chat-call-controls__item{position:relative;display:flex;flex-direction:column;align-items:center}.axm-chat-call-controls__action{position:relative;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:0;color:var(--color-white, #fff)}.axm-chat-call-controls__action:focus-visible{border-radius:var(--radius-lg, .5rem);outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:4px;outline-color:#ffffff73}.axm-chat-call-controls__circle{position:relative;display:inline-flex;height:3.25rem;width:3.25rem;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);background-color:#3a3d41;font-size:var(--text-lg, 1.125rem);line-height:var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));color:var(--color-white, #fff)}.axm-chat-call-controls__circle--danger{background-color:#e53935}.axm-chat-call-controls__circle--success{background-color:#4caf50}.axm-chat-call-controls__circle--light{background-color:#f2f2f2;color:#1a1c1e}.axm-chat-call-controls__chevron{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1.5);top:calc(var(--spacing, .25rem) * -.5);z-index:2;display:inline-flex;height:1.15rem;width:1.15rem;cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 20%,transparent);background-color:#2b2e32;padding:0;font-size:.55rem;color:var(--color-white, #fff)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__chevron{border-color:color-mix(in oklab,var(--color-white, #fff) 20%,transparent)}}.axm-chat-call-controls__hangup{rotate:135deg}.axm-chat-call-controls__menu-backdrop{position:fixed;inset:0;z-index:20;cursor:default;border-style:var(--tw-border-style);border-width:0px;background-color:transparent}.axm-chat-call-controls__menu{position:absolute;inset-inline-start:50%;bottom:calc(100% + .5rem);z-index:21;margin:0;max-width:calc(var(--spacing, .25rem) * 72);min-width:calc(var(--spacing, .25rem) * 48);--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);list-style-type:none;border-radius:var(--radius-xl, .75rem);border-style:var(--tw-border-style);border-width:1px;border-color:color-mix(in srgb,#fff 10%,transparent);background-color:#2b2e32;padding:calc(var(--spacing, .25rem) * 1.5);box-shadow:0 10px 28px #0006}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu{border-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}.axm-chat-call-controls__menu-empty,.axm-chat-call-controls__menu-item{display:block;width:100%;border-radius:var(--radius-lg, .5rem);border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2);text-align:start;font-size:.8125rem;color:var(--color-white, #fff)}.axm-chat-call-controls__menu-item{cursor:pointer}.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in srgb,#fff 10%,transparent)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-controls__menu-item:hover,.axm-chat-call-controls__menu-item--active{background-color:color-mix(in oklab,var(--color-white, #fff) 10%,transparent)}}axm-chat-call-participant-tile{display:block;min-height:0px;width:100%}axm-chat-call-participant-tile:not(.axm-chat-call-participant-tile--rail){height:100%}.axm-chat-call-tile{position:relative;display:flex;height:100%;min-height:0px;width:100%;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--radius-xl, .75rem);background-color:#101113}.axm-chat-call-tile__bg-blur,.axm-chat-call-tile__bg-color{pointer-events:none;position:absolute;inset:0}.axm-chat-call-tile__bg-blur{scale:1.15;object-fit:cover;opacity:90%;filter:blur(28px)}.axm-chat-call-tile__bg-color{opacity:100%}.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-primary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=primary]{background:radial-gradient(circle at 42% 38%,var(--color-primary-lightest) 0%,color-mix(in srgb,var(--color-primary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-secondary-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=secondary]{background:radial-gradient(circle at 42% 38%,var(--color-secondary-lightest) 0%,color-mix(in srgb,var(--color-secondary) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-danger-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=danger]{background:radial-gradient(circle at 42% 38%,var(--color-danger-lightest) 0%,color-mix(in srgb,var(--color-danger) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-warning-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=warning]{background:radial-gradient(circle at 42% 38%,var(--color-warning-lightest) 0%,color-mix(in srgb,var(--color-warning) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-success-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=success]{background:radial-gradient(circle at 42% 38%,var(--color-success-lightest) 0%,color-mix(in srgb,var(--color-success) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent1-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent1]{background:radial-gradient(circle at 42% 38%,var(--color-accent1-lightest) 0%,color-mix(in srgb,var(--color-accent1) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent2-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent2]{background:radial-gradient(circle at 42% 38%,var(--color-accent2-lightest) 0%,color-mix(in srgb,var(--color-accent2) 70%,black) 100%)}}.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,rgba(var(--ax-sys-color-accent3-surface)) 70%,black) 100%)}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__bg-color[data-avatar-color=accent3]{background:radial-gradient(circle at 42% 38%,var(--color-accent3-lightest) 0%,color-mix(in srgb,var(--color-accent3) 70%,black) 100%)}}.axm-chat-call-tile__video{position:absolute;inset:0;height:100%;width:100%;background-color:var(--color-black, #000);object-fit:cover}.axm-chat-call-tile__avatar-stack{position:relative;z-index:1;display:flex;height:5.5rem;width:5.5rem;align-items:center;justify-content:center}.axm-chat-call-tile__speaking-ring{pointer-events:none;position:absolute;inset:0;border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:.22rem;border-color:color-mix(in srgb,#fff 75%,transparent);box-shadow:0 0 0 .12rem #ffffff2e;transition:transform .12s ease-out,opacity .12s ease-out}@supports (color: color-mix(in lab,red,red)){.axm-chat-call-tile__speaking-ring{border-color:color-mix(in oklab,var(--color-white, #fff) 75%,transparent)}}.axm-chat-call-tile__speaking-ring[data-level=\"0\"]{transform:scale(1);opacity:.35}.axm-chat-call-tile__speaking-ring[data-level=\"1\"]{transform:scale(1.055);opacity:.395}.axm-chat-call-tile__speaking-ring[data-level=\"2\"]{transform:scale(1.11);opacity:.44}.axm-chat-call-tile__speaking-ring[data-level=\"3\"]{transform:scale(1.165);opacity:.485}.axm-chat-call-tile__speaking-ring[data-level=\"4\"]{transform:scale(1.22);opacity:.53}.axm-chat-call-tile__speaking-ring[data-level=\"5\"]{transform:scale(1.275);opacity:.575}.axm-chat-call-tile__speaking-ring[data-level=\"6\"]{transform:scale(1.33);opacity:.62}.axm-chat-call-tile__speaking-ring[data-level=\"7\"]{transform:scale(1.385);opacity:.665}.axm-chat-call-tile__speaking-ring[data-level=\"8\"]{transform:scale(1.44);opacity:.71}.axm-chat-call-tile__speaking-ring[data-level=\"9\"]{transform:scale(1.495);opacity:.755}.axm-chat-call-tile__speaking-ring[data-level=\"10\"]{transform:scale(1.55);opacity:.8}.axm-chat-call-tile__badge{position:absolute;top:calc(var(--spacing, .25rem) * 2.5);right:calc(var(--spacing, .25rem) * 2.5);z-index:2;display:flex;height:calc(var(--spacing, .25rem) * 7);width:calc(var(--spacing, .25rem) * 7);align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));color:var(--color-white, #fff);background:#202124d1}.axm-chat-call-tile__name{position:absolute;right:calc(var(--spacing, .25rem) * 2.5);bottom:calc(var(--spacing, .25rem) * 2.5);z-index:2;max-width:calc(100% - 1.1rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.8125rem;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);color:var(--color-white, #fff);background:#202124c7}.axm-chat-call-tile--compact .axm-chat-call-tile__avatar-stack{height:calc(var(--spacing, .25rem) * 12);width:calc(var(--spacing, .25rem) * 12)}.axm-chat-call-tile--compact .axm-chat-call-tile__badge{top:calc(var(--spacing, .25rem) * 1.5);right:calc(var(--spacing, .25rem) * 1.5);height:1.35rem;width:1.35rem;font-size:.625rem}.axm-chat-call-tile--compact .axm-chat-call-tile__name{right:calc(var(--spacing, .25rem) * 1.5);bottom:calc(var(--spacing, .25rem) * 1.5);max-width:calc(100% - .7rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.6875rem}.axm-chat-call-tile--compact .axm-chat-call-tile__speaking-ring{border-style:var(--tw-border-style);border-width:.16rem}.axm-chat-call-in-call-chat{display:flex;height:100%;min-height:0px;width:100%;flex:1;flex-direction:column;background-color:rgba(var(--ax-sys-color-surface));color:rgba(var(--ax-sys-color-on-surface))}.axm-chat-call-in-call-chat__messages{min-height:0px;flex:1;overflow:hidden;direction:ltr}.axm-chat-call-in-call-chat__composer{flex-shrink:0;border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-light-surface))}@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-outline-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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;}@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-outline-style: solid;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
1383
- }], ctorParameters: () => [] });
1384
-
1385
- export { AXMChatCallSessionPageComponent };
1386
- //# sourceMappingURL=acorex-platform-module-conversation-client-chat-call-session-page.component-C47tt1me.mjs.map