@acorex/components 20.7.62 → 20.8.0

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.
@@ -3812,9 +3812,6 @@ declare class AXForwardMessageDialogComponent implements OnInit {
3812
3812
  onForwardSearchChange(value: string): void;
3813
3813
  conversationFromItem(item: unknown): AXConversation | null;
3814
3814
  isSelected(conversationId: string): boolean;
3815
- getInitials(name: string): string;
3816
- getConversationAvatar(conversation: AXConversation): string | undefined;
3817
- getConversationAvatarIcon(conversation: AXConversation): string | undefined;
3818
3815
  private getFilteredConversationsForForward;
3819
3816
  onCancel(): void;
3820
3817
  onForward(): Promise<void>;
@@ -4499,7 +4496,6 @@ declare class AXNewConversationDialogComponent extends AXBasePageComponent {
4499
4496
  onSearchChange(value: string): void;
4500
4497
  isUserSelected(id: string): boolean;
4501
4498
  userFromItem(item: unknown): AXParticipant | null;
4502
- getInitials(name: string): string;
4503
4499
  private filteredUsers;
4504
4500
  onCreateConversation(): Promise<void>;
4505
4501
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXNewConversationDialogComponent, never>;
@@ -8480,6 +8480,9 @@ class AXConversationIndexedDbConversationApi extends AXConversationApi {
8480
8480
  const updated = {
8481
8481
  ...conversation,
8482
8482
  ...updates,
8483
+ ...(updates.metadata !== undefined
8484
+ ? { metadata: { ...conversation.metadata, ...updates.metadata } }
8485
+ : {}),
8483
8486
  updatedAt: new Date(),
8484
8487
  };
8485
8488
  conversationSharedStorage.conversations.set(conversationId, updated);
@@ -10450,7 +10453,7 @@ function resolveConversationAvatarDisplay(conversation) {
10450
10453
  */
10451
10454
  class AXConversationAvatarComponent {
10452
10455
  constructor() {
10453
- this.conversationService = inject(AXConversationService);
10456
+ this.conversationService = inject(AXConversationService, { optional: true });
10454
10457
  this.userAvatarComponent = inject(AX_CONVERSATION_USER_AVATAR_COMPONENT, { optional: true });
10455
10458
  this.conversationAvatarComponent = inject(AX_CONVERSATION_CONVERSATION_AVATAR_COMPONENT, {
10456
10459
  optional: true,
@@ -10464,7 +10467,7 @@ class AXConversationAvatarComponent {
10464
10467
  this.name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
10465
10468
  this.avatar = input(...(ngDevMode ? [undefined, { debugName: "avatar" }] : []));
10466
10469
  this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
10467
- this.currentUserId = computed(() => this.conversationService.currentUser()?.id, ...(ngDevMode ? [{ debugName: "currentUserId" }] : []));
10470
+ this.currentUserId = computed(() => this.conversationService?.currentUser()?.id, ...(ngDevMode ? [{ debugName: "currentUserId" }] : []));
10468
10471
  this.resolvedKind = computed(() => {
10469
10472
  const explicitKind = this.kind();
10470
10473
  if (explicitKind === 'user') {
@@ -10546,7 +10549,7 @@ class AXConversationAvatarComponent {
10546
10549
  }, ...(ngDevMode ? [{ debugName: "resolvedStatus" }] : []));
10547
10550
  }
10548
10551
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXConversationAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10549
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXConversationAvatarComponent, isStandalone: true, selector: "ax-conversation-avatar", inputs: { kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: false, transformFunction: null }, userId: { classPropertyName: "userId", publicName: "userId", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showStatus: { classPropertyName: "showStatus", publicName: "showStatus", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
10552
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXConversationAvatarComponent, isStandalone: true, selector: "ax-conversation-avatar", inputs: { kind: { classPropertyName: "kind", publicName: "kind", isSignal: true, isRequired: false, transformFunction: null }, userId: { classPropertyName: "userId", publicName: "userId", isSignal: true, isRequired: false, transformFunction: null }, conversation: { classPropertyName: "conversation", publicName: "conversation", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, showStatus: { classPropertyName: "showStatus", publicName: "showStatus", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, avatar: { classPropertyName: "avatar", publicName: "avatar", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.--ax-conversation-avatar-size.px": "size()" } }, ngImport: i0, template: `
10550
10553
  <div class="ax-conversation-avatar">
10551
10554
  @if (customComponent(); as component) {
10552
10555
  <ng-container *ngComponentOutlet="component; inputs: customInputs()" />
@@ -10571,7 +10574,7 @@ class AXConversationAvatarComponent {
10571
10574
  ></span>
10572
10575
  }
10573
10576
  </div>
10574
- `, isInline: true, styles: [":host{display:inline-flex}.ax-conversation-avatar{position:relative;display:inline-flex}.ax-conversation-avatar-icon{font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.ax-conversation-avatar-status{position:absolute;bottom:2px;inset-inline-end:2px;width:12px;height:12px;border-radius:50%}.ax-conversation-avatar-status.status-online{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-success-500))}.ax-conversation-avatar-status.status-away{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-warning-500))}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "shape", "look"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXImageComponent, selector: "ax-image", inputs: ["width", "height", "overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
10577
+ `, isInline: true, styles: [":host{display:inline-flex}.ax-conversation-avatar{position:relative;display:inline-flex}.ax-conversation-avatar-icon{font-size:calc(var(--ax-conversation-avatar-size, 2.5rem) * .5);line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.ax-conversation-avatar-status{position:absolute;bottom:2px;inset-inline-end:2px;width:12px;height:12px;border-radius:50%}.ax-conversation-avatar-status.status-online{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-success-500))}.ax-conversation-avatar-status.status-away{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-warning-500))}\n"], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "shape", "look"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXImageComponent, selector: "ax-image", inputs: ["width", "height", "overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
10575
10578
  }
10576
10579
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXConversationAvatarComponent, decorators: [{
10577
10580
  type: Component,
@@ -10600,7 +10603,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
10600
10603
  ></span>
10601
10604
  }
10602
10605
  </div>
10603
- `, styles: [":host{display:inline-flex}.ax-conversation-avatar{position:relative;display:inline-flex}.ax-conversation-avatar-icon{font-size:1rem;line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.ax-conversation-avatar-status{position:absolute;bottom:2px;inset-inline-end:2px;width:12px;height:12px;border-radius:50%}.ax-conversation-avatar-status.status-online{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-success-500))}.ax-conversation-avatar-status.status-away{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-warning-500))}\n"] }]
10606
+ `, host: {
10607
+ '[style.--ax-conversation-avatar-size.px]': 'size()',
10608
+ }, styles: [":host{display:inline-flex}.ax-conversation-avatar{position:relative;display:inline-flex}.ax-conversation-avatar-icon{font-size:calc(var(--ax-conversation-avatar-size, 2.5rem) * .5);line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.ax-conversation-avatar-status{position:absolute;bottom:2px;inset-inline-end:2px;width:12px;height:12px;border-radius:50%}.ax-conversation-avatar-status.status-online{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-success-500))}.ax-conversation-avatar-status.status-away{border:2px solid rgb(var(--ax-sys-color-surface));background-color:rgb(var(--ax-sys-color-warning-500))}\n"] }]
10604
10609
  }] });
10605
10610
 
10606
10611
  class AXConversationDateUtilsService {
@@ -15161,6 +15166,29 @@ class AXConversationService {
15161
15166
  */
15162
15167
  async updateConversation(conversationId, updates) {
15163
15168
  try {
15169
+ const { title, description, avatar, icon, metadata, archived } = updates;
15170
+ const apiUpdates = {};
15171
+ if (title !== undefined)
15172
+ apiUpdates.title = title;
15173
+ if (description !== undefined)
15174
+ apiUpdates.description = description;
15175
+ if (avatar !== undefined)
15176
+ apiUpdates.avatar = avatar;
15177
+ if (icon !== undefined)
15178
+ apiUpdates.icon = icon;
15179
+ if (metadata !== undefined)
15180
+ apiUpdates.metadata = metadata;
15181
+ if (Object.keys(apiUpdates).length > 0) {
15182
+ await this.conversationApi.updateConversation(conversationId, apiUpdates);
15183
+ }
15184
+ if (archived !== undefined) {
15185
+ if (archived) {
15186
+ await this.conversationApi.archiveConversation(conversationId);
15187
+ }
15188
+ else {
15189
+ await this.conversationApi.unarchiveConversation(conversationId);
15190
+ }
15191
+ }
15164
15192
  this.state.updateConversation(conversationId, updates);
15165
15193
  }
15166
15194
  catch (error) {
@@ -15175,6 +15203,7 @@ class AXConversationService {
15175
15203
  */
15176
15204
  async updateConversationSettings(conversationId, settings) {
15177
15205
  try {
15206
+ await this.conversationApi.updateConversationSettings(conversationId, settings);
15178
15207
  this.state.updateSettings(conversationId, settings);
15179
15208
  }
15180
15209
  catch (error) {
@@ -15189,6 +15218,7 @@ class AXConversationService {
15189
15218
  */
15190
15219
  async updateConversationTitle(conversationId, title) {
15191
15220
  try {
15221
+ await this.conversationApi.updateConversation(conversationId, { title });
15192
15222
  this.state.updateTitle(conversationId, title);
15193
15223
  }
15194
15224
  catch (error) {
@@ -15203,6 +15233,9 @@ class AXConversationService {
15203
15233
  */
15204
15234
  async updateConversationMetadata(conversationId, metadata) {
15205
15235
  try {
15236
+ const current = this.state.getConversation(conversationId);
15237
+ const mergedMetadata = { ...current?.metadata, ...metadata };
15238
+ await this.conversationApi.updateConversation(conversationId, { metadata: mergedMetadata });
15206
15239
  this.state.updateMetadata(conversationId, metadata);
15207
15240
  }
15208
15241
  catch (error) {
@@ -17699,11 +17732,11 @@ class AXMembersPopoverComponent {
17699
17732
  }
17700
17733
  </div>
17701
17734
  </div>
17702
- `, isInline: true, styles: [":host{display:block}.members-popover{width:280px;max-height:400px;border-radius:.5rem;display:flex;flex-direction:column;background:rgb(var(--ax-sys-color-lighter-surface))}.members-header{padding:.75rem 1rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.members-title{font-size:.875rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.members-list{overflow-y:auto;padding:.5rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:.5rem;transition:background .2s;cursor:pointer}.member-item:hover{background:rgb(var(--ax-sys-color-lighter-surface))}.member-info{flex:1;display:flex;flex-direction:column;gap:.125rem;min-width:0}.member-name{font-size:.875rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-role{font-size:.75rem;color:rgb(var(--ax-sys-color-primary-500));text-transform:capitalize}.member-description{font-size:.75rem;color:rgb(var(--ax-sys-color-on-surface));opacity:.72;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-status{width:10px;height:10px;border-radius:50%;flex-shrink:0}.member-status.status-online{background:rgb(var(--ax-sys-color-success-500))}.member-status.status-offline{background:rgb(var(--ax-sys-color-neutral-400))}.member-status.status-away{background:rgb(var(--ax-sys-color-warning-500))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
17735
+ `, isInline: true, styles: [":host{display:block}.members-popover{width:280px;max-height:400px;border-radius:.5rem;display:flex;flex-direction:column;background:rgb(var(--ax-sys-color-lightest-surface))}.members-header{padding:.75rem 1rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.members-title{font-size:.875rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.members-list{overflow-y:auto;padding:.5rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:.5rem;transition:background .2s}.member-item:hover{background:rgb(var(--ax-sys-color-surface))}.member-info{flex:1;display:flex;flex-direction:column;gap:.125rem;min-width:0}.member-name{font-size:.875rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-role{font-size:.75rem;color:rgb(var(--ax-sys-color-primary-500));text-transform:capitalize}.member-description{font-size:.75rem;color:rgb(var(--ax-sys-color-on-surface));opacity:.72;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-status{width:10px;height:10px;border-radius:50%;flex-shrink:0}.member-status.status-online{background:rgb(var(--ax-sys-color-success-500))}.member-status.status-offline{background:rgb(var(--ax-sys-color-neutral-400))}.member-status.status-away{background:rgb(var(--ax-sys-color-warning-500))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
17703
17736
  }
17704
17737
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXMembersPopoverComponent, decorators: [{
17705
17738
  type: Component,
17706
- args: [{ selector: 'ax-conversation-members-popover', imports: [CommonModule, AXLabelComponent, AXDecoratorModule, AXConversationAvatarComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
17739
+ args: [{ selector: 'ax-conversation-members-popover', imports: [CommonModule, AXDecoratorModule, AXConversationAvatarComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
17707
17740
  <div class="members-popover">
17708
17741
  <div class="members-header">
17709
17742
  <span class="members-title">{{ getMembersTitle() }}</span>
@@ -17737,7 +17770,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
17737
17770
  }
17738
17771
  </div>
17739
17772
  </div>
17740
- `, styles: [":host{display:block}.members-popover{width:280px;max-height:400px;border-radius:.5rem;display:flex;flex-direction:column;background:rgb(var(--ax-sys-color-lighter-surface))}.members-header{padding:.75rem 1rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.members-title{font-size:.875rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.members-list{overflow-y:auto;padding:.5rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:.5rem;transition:background .2s;cursor:pointer}.member-item:hover{background:rgb(var(--ax-sys-color-lighter-surface))}.member-info{flex:1;display:flex;flex-direction:column;gap:.125rem;min-width:0}.member-name{font-size:.875rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-role{font-size:.75rem;color:rgb(var(--ax-sys-color-primary-500));text-transform:capitalize}.member-description{font-size:.75rem;color:rgb(var(--ax-sys-color-on-surface));opacity:.72;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-status{width:10px;height:10px;border-radius:50%;flex-shrink:0}.member-status.status-online{background:rgb(var(--ax-sys-color-success-500))}.member-status.status-offline{background:rgb(var(--ax-sys-color-neutral-400))}.member-status.status-away{background:rgb(var(--ax-sys-color-warning-500))}\n"] }]
17773
+ `, styles: [":host{display:block}.members-popover{width:280px;max-height:400px;border-radius:.5rem;display:flex;flex-direction:column;background:rgb(var(--ax-sys-color-lightest-surface))}.members-header{padding:.75rem 1rem;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.members-title{font-size:.875rem;font-weight:600;color:rgb(var(--ax-sys-color-on-surface))}.members-list{overflow-y:auto;padding:.5rem}.member-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:.5rem;transition:background .2s}.member-item:hover{background:rgb(var(--ax-sys-color-surface))}.member-info{flex:1;display:flex;flex-direction:column;gap:.125rem;min-width:0}.member-name{font-size:.875rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-role{font-size:.75rem;color:rgb(var(--ax-sys-color-primary-500));text-transform:capitalize}.member-description{font-size:.75rem;color:rgb(var(--ax-sys-color-on-surface));opacity:.72;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-status{width:10px;height:10px;border-radius:50%;flex-shrink:0}.member-status.status-online{background:rgb(var(--ax-sys-color-success-500))}.member-status.status-offline{background:rgb(var(--ax-sys-color-neutral-400))}.member-status.status-away{background:rgb(var(--ax-sys-color-warning-500))}\n"] }]
17741
17774
  }] });
17742
17775
 
17743
17776
  /**
@@ -18230,18 +18263,6 @@ class AXForwardMessageDialogComponent {
18230
18263
  isSelected(conversationId) {
18231
18264
  return this.selectedConversationIds().includes(conversationId);
18232
18265
  }
18233
- getInitials(name) {
18234
- const parts = name.trim().split(/\s+/).filter(Boolean).slice(0, 2);
18235
- if (parts.length === 0)
18236
- return '?';
18237
- return parts.map((p) => p.charAt(0).toUpperCase()).join('');
18238
- }
18239
- getConversationAvatar(conversation) {
18240
- return AXConversationMessageUtilsService.getConversationAvatar(conversation);
18241
- }
18242
- getConversationAvatarIcon(conversation) {
18243
- return AXConversationMessageUtilsService.getConversationAvatarIcon(conversation);
18244
- }
18245
18266
  getFilteredConversationsForForward() {
18246
18267
  const q = this.forwardSearchQuery().toLowerCase().trim();
18247
18268
  let items = this.allConversations();
@@ -18305,10 +18326,12 @@ class AXForwardMessageDialogComponent {
18305
18326
  }
18306
18327
  }
18307
18328
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXForwardMessageDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
18308
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXForwardMessageDialogComponent, isStandalone: true, selector: "ax-forward-message-dialog", inputs: { __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: AXClosableComponent, useExisting: AXForwardMessageDialogComponent }], viewQueries: [{ propertyName: "forwardListEmptyTpl", first: true, predicate: ["forwardListEmpty"], descendants: true, isSignal: true }, { propertyName: "forwardList", first: true, predicate: ["forwardList"], descendants: true, isSignal: true }], ngImport: i0, template: `
18329
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXForwardMessageDialogComponent, isStandalone: true, selector: "ax-forward-message-dialog", inputs: { __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
18330
+ { provide: AXClosableComponent, useExisting: AXForwardMessageDialogComponent },
18331
+ ], viewQueries: [{ propertyName: "forwardListEmptyTpl", first: true, predicate: ["forwardListEmpty"], descendants: true, isSignal: true }, { propertyName: "forwardList", first: true, predicate: ["forwardList"], descendants: true, isSignal: true }], ngImport: i0, template: `
18309
18332
  <div class="forward-message-dialog">
18310
18333
  <ng-template #forwardListEmpty>
18311
- <div class="users-list-empty">
18334
+ <div class="forward-list-empty">
18312
18335
  @if (forwardSearchQuery()) {
18313
18336
  {{ '@acorex:chat.dialog.forward-message.no-conversations-search' | translate | async }}
18314
18337
  } @else {
@@ -18318,53 +18341,45 @@ class AXForwardMessageDialogComponent {
18318
18341
  </ng-template>
18319
18342
 
18320
18343
  <div class="dialog-content">
18321
- <div class="form-field">
18322
- <div class="users-list-wrap">
18323
- <ax-list
18324
- #forwardList
18325
- class="users-list"
18326
- [dataSource]="forwardListDataSource"
18327
- [multiple]="true"
18328
- [valueField]="'id'"
18329
- [textField]="'title'"
18330
- [checkbox]="false"
18331
- [itemHeight]="58"
18332
- [ngModel]="selectedConversationIds()"
18333
- (ngModelChange)="selectedConversationIds.set($event ?? [])"
18334
- [emptyTemplate]="forwardListEmptyTpl()"
18335
- [itemTemplate]="forwardItemTpl"
18336
- >
18337
- <ax-header class="users-list-header">
18338
- <div class="users-list-header-inner">
18339
- <ax-search-box
18340
- [value]="forwardSearchQuery()"
18341
- (valueChange)="onForwardSearchChange($event)"
18342
- [placeholder]="'@acorex:chat.placeholders.search-conversations' | translate | async"
18343
- ></ax-search-box>
18344
- </div>
18345
- </ax-header>
18346
- </ax-list>
18347
- </div>
18344
+ <div class="forward-list-wrap">
18345
+ <ax-list
18346
+ #forwardList
18347
+ class="forward-list"
18348
+ [dataSource]="forwardListDataSource"
18349
+ [multiple]="true"
18350
+ [valueField]="'id'"
18351
+ [textField]="'title'"
18352
+ [checkbox]="false"
18353
+ [itemHeight]="52"
18354
+ [ngModel]="selectedConversationIds()"
18355
+ (ngModelChange)="selectedConversationIds.set($event ?? [])"
18356
+ [emptyTemplate]="forwardListEmptyTpl()"
18357
+ [itemTemplate]="forwardItemTpl"
18358
+ >
18359
+ <ax-header class="forward-list-header">
18360
+ <div class="forward-list-header-inner">
18361
+ <ax-search-box
18362
+ [value]="forwardSearchQuery()"
18363
+ (valueChange)="onForwardSearchChange($event)"
18364
+ [placeholder]="'@acorex:chat.placeholders.search-conversations' | translate | async"
18365
+ ></ax-search-box>
18366
+ </div>
18367
+ </ax-header>
18368
+ </ax-list>
18348
18369
  </div>
18349
18370
  </div>
18371
+
18350
18372
  <ng-template #forwardItemTpl let-item>
18351
18373
  @if (conversationFromItem(item); as conversation) {
18352
- <div class="ax-label-container forward-item-content">
18374
+ <div class="forward-item-content">
18353
18375
  <input class="ax-checkbox" type="checkbox" [checked]="isSelected(conversation.id)" tabindex="0" />
18354
- <ax-avatar [size]="36" [color]="'primary'">
18355
- @if (getConversationAvatar(conversation); as avatar) {
18356
- <ax-image [src]="avatar" [alt]="conversation.title"></ax-image>
18357
- } @else if (getConversationAvatarIcon(conversation); as icon) {
18358
- <i [class]="icon" aria-hidden="true"></i>
18359
- } @else {
18360
- <ax-label>{{ getInitials(conversation.title) }}</ax-label>
18361
- }
18362
- </ax-avatar>
18363
- <span class="ax-checkbox-label ax-truncated forward-title-text">{{ conversation.title }}</span>
18376
+ <ax-conversation-avatar kind="auto" [conversation]="conversation" [size]="36" />
18377
+ <span class="forward-title-text ax-truncated">{{ conversation.title }}</span>
18364
18378
  </div>
18365
18379
  }
18366
18380
  </ng-template>
18367
- <ax-footer>
18381
+
18382
+ <ax-footer class="dialog-footer">
18368
18383
  <ax-suffix>
18369
18384
  <ax-button [text]="'@acorex:chat.actions.cancel' | translate | async" [look]="'solid'" (onClick)="onCancel()"></ax-button>
18370
18385
  <ax-button
@@ -18377,25 +18392,23 @@ class AXForwardMessageDialogComponent {
18377
18392
  </ax-suffix>
18378
18393
  </ax-footer>
18379
18394
  </div>
18380
- `, isInline: true, styles: [":host{display:block}.forward-message-dialog{display:flex;flex-direction:column}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.forward-list-wrap{height:280px;overflow:hidden}.forward-list{display:block;height:100%}.forward-list-header{display:block;position:sticky;top:0;z-index:1;background:rgba(var(--ax-sys-color-lightest-surface));border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}.forward-list-header-inner{padding:.5rem .75rem}.forward-list-empty{padding:1rem;text-align:center;font-size:.875rem;color:var(--ax-text-secondary, #6b7280)}.users-list-wrap{height:260px;overflow:hidden;// border: 1px solid rgb(var(--ax-sys-color-border-light-surface));// border-radius: .65rem;// background: rgb(var(--ax-sys-color-surface))}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;// background: rgb(var(--ax-sys-color-lightest-surface));border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .625rem}.forward-item-content{height:100%;display:flex;align-items:center;gap:.6rem;padding:.1rem .75rem;min-width:0}.forward-title-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:500}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "isItemTruncated", "showItemTooltip", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readonlyChange", "onBlur", "onFocus", "onItemClick", "onItemSelected", "onScrolledIndexChanged"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "shape", "look"], outputs: ["sizeChange"] }, { kind: "component", type: AXImageComponent, selector: "ax-image", inputs: ["width", "height", "overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }] }); }
18395
+ `, isInline: true, styles: [":host{display:block}.forward-message-dialog{display:flex;flex-direction:column;width:100%;overflow:hidden}.dialog-content{flex:1;min-height:0;overflow:hidden}.forward-list-wrap{height:min(50vh,24rem);overflow:hidden}.forward-list{display:block;height:100%}.forward-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.forward-list-header-inner{padding:.5rem .75rem}.forward-item-content{display:flex;align-items:center;gap:.75rem;height:100%;padding:.5rem;min-width:0;border-radius:.5rem;transition:background-color .2s ease}.forward-title-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:500;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface))}.forward-list-empty{padding:1.25rem 1rem;text-align:center;font-size:.875rem;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.dialog-footer{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "isItemTruncated", "showItemTooltip", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readonlyChange", "onBlur", "onFocus", "onItemClick", "onItemSelected", "onScrolledIndexChanged"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
18381
18396
  }
18382
18397
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXForwardMessageDialogComponent, decorators: [{
18383
18398
  type: Component,
18384
- args: [{ selector: 'ax-forward-message-dialog', imports: [
18399
+ args: [{ selector: 'ax-forward-message-dialog', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
18385
18400
  CommonModule,
18386
18401
  FormsModule,
18387
18402
  AXListComponent,
18388
18403
  AXSearchBoxComponent,
18389
18404
  AXButtonComponent,
18390
18405
  AXDecoratorGenericComponent,
18391
- AXAvatarComponent,
18392
- AXImageComponent,
18393
- AXLabelComponent,
18406
+ AXConversationAvatarComponent,
18394
18407
  AXTranslationModule,
18395
18408
  ], template: `
18396
18409
  <div class="forward-message-dialog">
18397
18410
  <ng-template #forwardListEmpty>
18398
- <div class="users-list-empty">
18411
+ <div class="forward-list-empty">
18399
18412
  @if (forwardSearchQuery()) {
18400
18413
  {{ '@acorex:chat.dialog.forward-message.no-conversations-search' | translate | async }}
18401
18414
  } @else {
@@ -18405,53 +18418,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
18405
18418
  </ng-template>
18406
18419
 
18407
18420
  <div class="dialog-content">
18408
- <div class="form-field">
18409
- <div class="users-list-wrap">
18410
- <ax-list
18411
- #forwardList
18412
- class="users-list"
18413
- [dataSource]="forwardListDataSource"
18414
- [multiple]="true"
18415
- [valueField]="'id'"
18416
- [textField]="'title'"
18417
- [checkbox]="false"
18418
- [itemHeight]="58"
18419
- [ngModel]="selectedConversationIds()"
18420
- (ngModelChange)="selectedConversationIds.set($event ?? [])"
18421
- [emptyTemplate]="forwardListEmptyTpl()"
18422
- [itemTemplate]="forwardItemTpl"
18423
- >
18424
- <ax-header class="users-list-header">
18425
- <div class="users-list-header-inner">
18426
- <ax-search-box
18427
- [value]="forwardSearchQuery()"
18428
- (valueChange)="onForwardSearchChange($event)"
18429
- [placeholder]="'@acorex:chat.placeholders.search-conversations' | translate | async"
18430
- ></ax-search-box>
18431
- </div>
18432
- </ax-header>
18433
- </ax-list>
18434
- </div>
18421
+ <div class="forward-list-wrap">
18422
+ <ax-list
18423
+ #forwardList
18424
+ class="forward-list"
18425
+ [dataSource]="forwardListDataSource"
18426
+ [multiple]="true"
18427
+ [valueField]="'id'"
18428
+ [textField]="'title'"
18429
+ [checkbox]="false"
18430
+ [itemHeight]="52"
18431
+ [ngModel]="selectedConversationIds()"
18432
+ (ngModelChange)="selectedConversationIds.set($event ?? [])"
18433
+ [emptyTemplate]="forwardListEmptyTpl()"
18434
+ [itemTemplate]="forwardItemTpl"
18435
+ >
18436
+ <ax-header class="forward-list-header">
18437
+ <div class="forward-list-header-inner">
18438
+ <ax-search-box
18439
+ [value]="forwardSearchQuery()"
18440
+ (valueChange)="onForwardSearchChange($event)"
18441
+ [placeholder]="'@acorex:chat.placeholders.search-conversations' | translate | async"
18442
+ ></ax-search-box>
18443
+ </div>
18444
+ </ax-header>
18445
+ </ax-list>
18435
18446
  </div>
18436
18447
  </div>
18448
+
18437
18449
  <ng-template #forwardItemTpl let-item>
18438
18450
  @if (conversationFromItem(item); as conversation) {
18439
- <div class="ax-label-container forward-item-content">
18451
+ <div class="forward-item-content">
18440
18452
  <input class="ax-checkbox" type="checkbox" [checked]="isSelected(conversation.id)" tabindex="0" />
18441
- <ax-avatar [size]="36" [color]="'primary'">
18442
- @if (getConversationAvatar(conversation); as avatar) {
18443
- <ax-image [src]="avatar" [alt]="conversation.title"></ax-image>
18444
- } @else if (getConversationAvatarIcon(conversation); as icon) {
18445
- <i [class]="icon" aria-hidden="true"></i>
18446
- } @else {
18447
- <ax-label>{{ getInitials(conversation.title) }}</ax-label>
18448
- }
18449
- </ax-avatar>
18450
- <span class="ax-checkbox-label ax-truncated forward-title-text">{{ conversation.title }}</span>
18453
+ <ax-conversation-avatar kind="auto" [conversation]="conversation" [size]="36" />
18454
+ <span class="forward-title-text ax-truncated">{{ conversation.title }}</span>
18451
18455
  </div>
18452
18456
  }
18453
18457
  </ng-template>
18454
- <ax-footer>
18458
+
18459
+ <ax-footer class="dialog-footer">
18455
18460
  <ax-suffix>
18456
18461
  <ax-button [text]="'@acorex:chat.actions.cancel' | translate | async" [look]="'solid'" (onClick)="onCancel()"></ax-button>
18457
18462
  <ax-button
@@ -18464,7 +18469,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
18464
18469
  </ax-suffix>
18465
18470
  </ax-footer>
18466
18471
  </div>
18467
- `, providers: [{ provide: AXClosableComponent, useExisting: AXForwardMessageDialogComponent }], styles: [":host{display:block}.forward-message-dialog{display:flex;flex-direction:column}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.forward-list-wrap{height:280px;overflow:hidden}.forward-list{display:block;height:100%}.forward-list-header{display:block;position:sticky;top:0;z-index:1;background:rgba(var(--ax-sys-color-lightest-surface));border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}.forward-list-header-inner{padding:.5rem .75rem}.forward-list-empty{padding:1rem;text-align:center;font-size:.875rem;color:var(--ax-text-secondary, #6b7280)}.users-list-wrap{height:260px;overflow:hidden;// border: 1px solid rgb(var(--ax-sys-color-border-light-surface));// border-radius: .65rem;// background: rgb(var(--ax-sys-color-surface))}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;// background: rgb(var(--ax-sys-color-lightest-surface));border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .625rem}.forward-item-content{height:100%;display:flex;align-items:center;gap:.6rem;padding:.1rem .75rem;min-width:0}.forward-title-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:500}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"] }]
18472
+ `, providers: [
18473
+ { provide: AXClosableComponent, useExisting: AXForwardMessageDialogComponent },
18474
+ ], styles: [":host{display:block}.forward-message-dialog{display:flex;flex-direction:column;width:100%;overflow:hidden}.dialog-content{flex:1;min-height:0;overflow:hidden}.forward-list-wrap{height:min(50vh,24rem);overflow:hidden}.forward-list{display:block;height:100%}.forward-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.forward-list-header-inner{padding:.5rem .75rem}.forward-item-content{display:flex;align-items:center;gap:.75rem;height:100%;padding:.5rem;min-width:0;border-radius:.5rem;transition:background-color .2s ease}.forward-title-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;font-weight:500;line-height:1.25rem;color:rgb(var(--ax-sys-color-on-surface))}.forward-list-empty{padding:1.25rem 1rem;text-align:center;font-size:.875rem;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.dialog-footer{flex-shrink:0}\n"] }]
18468
18475
  }] });
18469
18476
 
18470
18477
  /**
@@ -20567,12 +20574,6 @@ class AXNewConversationDialogComponent extends AXBasePageComponent {
20567
20574
  return null;
20568
20575
  return item.data ?? null;
20569
20576
  }
20570
- getInitials(name) {
20571
- if (!name.trim())
20572
- return '?';
20573
- const parts = name.trim().split(/\s+/).slice(0, 2);
20574
- return parts.map((p) => p.charAt(0).toUpperCase()).join('');
20575
- }
20576
20577
  filteredUsers() {
20577
20578
  const q = this.searchQuery().toLowerCase().trim();
20578
20579
  if (!q)
@@ -20623,7 +20624,9 @@ class AXNewConversationDialogComponent extends AXBasePageComponent {
20623
20624
  }
20624
20625
  }
20625
20626
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNewConversationDialogComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
20626
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXNewConversationDialogComponent, isStandalone: true, selector: "ax-new-conversation-dialog", inputs: { __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: AXClosableComponent, useExisting: AXNewConversationDialogComponent }], viewQueries: [{ propertyName: "usersListEmptyTpl", first: true, predicate: ["usersListEmpty"], descendants: true, isSignal: true }, { propertyName: "usersList", first: true, predicate: ["usersList"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
20627
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXNewConversationDialogComponent, isStandalone: true, selector: "ax-new-conversation-dialog", inputs: { __popup__: { classPropertyName: "__popup__", publicName: "__popup__", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
20628
+ { provide: AXClosableComponent, useExisting: AXNewConversationDialogComponent },
20629
+ ], viewQueries: [{ propertyName: "usersListEmptyTpl", first: true, predicate: ["usersListEmpty"], descendants: true, isSignal: true }, { propertyName: "usersList", first: true, predicate: ["usersList"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
20627
20630
  <div class="new-conversation-panel">
20628
20631
  <div class="new-conversation-dialog-content">
20629
20632
  @if (showUserPickerStep()) {
@@ -20637,7 +20640,7 @@ class AXNewConversationDialogComponent extends AXBasePageComponent {
20637
20640
  [checkbox]="false"
20638
20641
  [valueField]="'id'"
20639
20642
  [textField]="'name'"
20640
- [itemHeight]="'auto'"
20643
+ [itemHeight]="52"
20641
20644
  [ngModel]="selectedUserIds()"
20642
20645
  (ngModelChange)="onSelectedUsersChange($event ?? [])"
20643
20646
  [emptyTemplate]="usersListEmptyTpl()"
@@ -20716,13 +20719,14 @@ class AXNewConversationDialogComponent extends AXBasePageComponent {
20716
20719
  @if (userFromItem(item); as user) {
20717
20720
  <div class="user-item-content">
20718
20721
  <input class="ax-checkbox" type="checkbox" [checked]="isUserSelected(user.id)" tabindex="0" />
20719
- <ax-avatar [size]="54" [color]="'primary'">
20720
- @if (user.avatar) {
20721
- <ax-image [src]="user.avatar" [alt]="user.name"></ax-image>
20722
- } @else {
20723
- <ax-label>{{ getInitials(user.name) }}</ax-label>
20724
- }
20725
- </ax-avatar>
20722
+ <ax-conversation-avatar
20723
+ kind="user"
20724
+ [userId]="user.id"
20725
+ [size]="48"
20726
+ [name]="user.name"
20727
+ [avatar]="user.avatar"
20728
+ [icon]="user.icon"
20729
+ />
20726
20730
  <div class="user-item-text">
20727
20731
  <span class="ax-truncated user-name-text">{{ user.name }}</span>
20728
20732
  @if (user.description) {
@@ -20732,7 +20736,7 @@ class AXNewConversationDialogComponent extends AXBasePageComponent {
20732
20736
  </div>
20733
20737
  }
20734
20738
  </ng-template>
20735
- `, isInline: true, styles: [":host{display:block}.new-conversation-panel{display:flex;flex-direction:column;width:100%;overflow:hidden}.new-conversation-dialog-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.75rem}.form-field--grow{flex:1;min-height:0;display:flex;flex-direction:column}.group-details-step{flex:1;min-height:0;padding:.5rem .75rem;display:flex;flex-direction:column;gap:.75rem}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.title-input{height:2.25rem;border-radius:.5rem;border:1px solid rgb(var(--ax-sys-color-border-light-surface));background:rgb(var(--ax-sys-color-lighter-surface));padding:0 .7rem;color:rgb(var(--ax-sys-color-on-surface));font:inherit}.title-input:focus{outline:2px solid rgba(var(--ax-sys-color-primary-500),.25);outline-offset:0}.users-list-wrap{height:min(50vh,36rem);overflow:hidden}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .75rem}.user-item-content{display:flex;align-items:center;gap:.5rem;height:100%;padding:.5rem .75rem;min-width:0}.user-item-text{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1;gap:.1rem}.user-name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500}.user-description-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:400;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "isItemTruncated", "showItemTooltip", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readonlyChange", "onBlur", "onFocus", "onItemClick", "onItemSelected", "onScrolledIndexChanged"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["required", "for"], outputs: ["requiredChange"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXAvatarComponent, selector: "ax-avatar", inputs: ["color", "size", "shape", "look"], outputs: ["sizeChange"] }, { kind: "component", type: AXImageComponent, selector: "ax-image", inputs: ["width", "height", "overlayMode", "src", "alt", "priority", "lazy"], outputs: ["onLoad", "onError"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXAvatarPickerComponent, selector: "ax-avatar-picker", inputs: ["showClearButton", "avatarUrl"], outputs: ["avatarUrlChange", "onFileSelected"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
20739
+ `, isInline: true, styles: [":host{display:block}.new-conversation-panel{display:flex;flex-direction:column;width:100%;overflow:hidden}.new-conversation-dialog-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.75rem}.form-field--grow{flex:1;min-height:0;display:flex;flex-direction:column}.group-details-step{flex:1;min-height:0;padding:.5rem .75rem;display:flex;flex-direction:column;gap:.75rem}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.title-input{height:2.25rem;border-radius:.5rem;border:1px solid rgb(var(--ax-sys-color-border-light-surface));background:rgb(var(--ax-sys-color-lighter-surface));padding:0 .7rem;color:rgb(var(--ax-sys-color-on-surface));font:inherit}.title-input:focus{outline:2px solid rgba(var(--ax-sys-color-primary-500),.25);outline-offset:0}.users-list-wrap{height:min(50vh,36rem);overflow:hidden}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .75rem}.user-item-content{display:flex;align-items:center;gap:.75rem;height:100%;padding:.5rem .75rem;min-width:0}.user-item-text{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1;gap:.125rem}.user-name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.user-description-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:400;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "isItemTruncated", "showItemTooltip", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readonlyChange", "onBlur", "onFocus", "onItemClick", "onItemSelected", "onScrolledIndexChanged"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXAvatarPickerComponent, selector: "ax-avatar-picker", inputs: ["showClearButton", "avatarUrl"], outputs: ["avatarUrlChange", "onFileSelected"] }, { kind: "component", type: AXConversationAvatarComponent, selector: "ax-conversation-avatar", inputs: ["kind", "userId", "conversation", "message", "size", "showStatus", "name", "avatar", "icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
20736
20740
  }
20737
20741
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXNewConversationDialogComponent, decorators: [{
20738
20742
  type: Component,
@@ -20741,14 +20745,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
20741
20745
  FormsModule,
20742
20746
  AXButtonComponent,
20743
20747
  AXListComponent,
20744
- AXLabelComponent,
20745
20748
  AXSearchBoxComponent,
20746
- AXAvatarComponent,
20747
- AXImageComponent,
20748
20749
  AXDecoratorGenericComponent,
20749
20750
  AXAvatarPickerComponent,
20751
+ AXConversationAvatarComponent,
20750
20752
  AXTranslationModule,
20751
- ], providers: [{ provide: AXClosableComponent, useExisting: AXNewConversationDialogComponent }], template: `
20753
+ ], providers: [
20754
+ { provide: AXClosableComponent, useExisting: AXNewConversationDialogComponent },
20755
+ ], template: `
20752
20756
  <div class="new-conversation-panel">
20753
20757
  <div class="new-conversation-dialog-content">
20754
20758
  @if (showUserPickerStep()) {
@@ -20762,7 +20766,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
20762
20766
  [checkbox]="false"
20763
20767
  [valueField]="'id'"
20764
20768
  [textField]="'name'"
20765
- [itemHeight]="'auto'"
20769
+ [itemHeight]="52"
20766
20770
  [ngModel]="selectedUserIds()"
20767
20771
  (ngModelChange)="onSelectedUsersChange($event ?? [])"
20768
20772
  [emptyTemplate]="usersListEmptyTpl()"
@@ -20841,13 +20845,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
20841
20845
  @if (userFromItem(item); as user) {
20842
20846
  <div class="user-item-content">
20843
20847
  <input class="ax-checkbox" type="checkbox" [checked]="isUserSelected(user.id)" tabindex="0" />
20844
- <ax-avatar [size]="54" [color]="'primary'">
20845
- @if (user.avatar) {
20846
- <ax-image [src]="user.avatar" [alt]="user.name"></ax-image>
20847
- } @else {
20848
- <ax-label>{{ getInitials(user.name) }}</ax-label>
20849
- }
20850
- </ax-avatar>
20848
+ <ax-conversation-avatar
20849
+ kind="user"
20850
+ [userId]="user.id"
20851
+ [size]="48"
20852
+ [name]="user.name"
20853
+ [avatar]="user.avatar"
20854
+ [icon]="user.icon"
20855
+ />
20851
20856
  <div class="user-item-text">
20852
20857
  <span class="ax-truncated user-name-text">{{ user.name }}</span>
20853
20858
  @if (user.description) {
@@ -20857,7 +20862,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
20857
20862
  </div>
20858
20863
  }
20859
20864
  </ng-template>
20860
- `, styles: [":host{display:block}.new-conversation-panel{display:flex;flex-direction:column;width:100%;overflow:hidden}.new-conversation-dialog-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.75rem}.form-field--grow{flex:1;min-height:0;display:flex;flex-direction:column}.group-details-step{flex:1;min-height:0;padding:.5rem .75rem;display:flex;flex-direction:column;gap:.75rem}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.title-input{height:2.25rem;border-radius:.5rem;border:1px solid rgb(var(--ax-sys-color-border-light-surface));background:rgb(var(--ax-sys-color-lighter-surface));padding:0 .7rem;color:rgb(var(--ax-sys-color-on-surface));font:inherit}.title-input:focus{outline:2px solid rgba(var(--ax-sys-color-primary-500),.25);outline-offset:0}.users-list-wrap{height:min(50vh,36rem);overflow:hidden}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .75rem}.user-item-content{display:flex;align-items:center;gap:.5rem;height:100%;padding:.5rem .75rem;min-width:0}.user-item-text{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1;gap:.1rem}.user-name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem;line-height:1.5rem;font-weight:500}.user-description-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:400;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"] }]
20865
+ `, styles: [":host{display:block}.new-conversation-panel{display:flex;flex-direction:column;width:100%;overflow:hidden}.new-conversation-dialog-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:.75rem}.form-field--grow{flex:1;min-height:0;display:flex;flex-direction:column}.group-details-step{flex:1;min-height:0;padding:.5rem .75rem;display:flex;flex-direction:column;gap:.75rem}.form-field{display:flex;flex-direction:column;gap:.35rem}.field-label{font-size:.875rem;font-weight:500;color:var(--ax-text-secondary, #6b7280)}.title-input{height:2.25rem;border-radius:.5rem;border:1px solid rgb(var(--ax-sys-color-border-light-surface));background:rgb(var(--ax-sys-color-lighter-surface));padding:0 .7rem;color:rgb(var(--ax-sys-color-on-surface));font:inherit}.title-input:focus{outline:2px solid rgba(var(--ax-sys-color-primary-500),.25);outline-offset:0}.users-list-wrap{height:min(50vh,36rem);overflow:hidden}.users-list{display:block;height:100%}.users-list-header{display:block;position:sticky;top:0;z-index:1;border-bottom:1px solid rgb(var(--ax-sys-color-border-light-surface))}.users-list-header-inner{padding:.5rem .75rem}.user-item-content{display:flex;align-items:center;gap:.75rem;height:100%;padding:.5rem .75rem;min-width:0}.user-item-text{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1;gap:.125rem}.user-name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:500;color:rgb(var(--ax-sys-color-on-surface))}.user-description-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;font-weight:400;opacity:.72;color:rgb(var(--ax-sys-color-on-surface))}.users-list-empty{padding:1rem;text-align:center;font-size:.85rem;opacity:.7}\n"] }]
20861
20866
  }] });
20862
20867
 
20863
20868
  /**