@acorex/components 22.1.0-next.1 → 22.1.0-next.10

package/types/acorex-components-combo-box.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { TemplateRef } from '@angular/core';
-import { NXComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent, AXEvent } from '@acorex/cdk/common';
+import { NXValueComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent, AXEvent } from '@acorex/cdk/common';
 import { AXPopoverComponent } from '@acorex/components/popover';
 import { Combobox } from '@angular/aria/combobox';
 import { Listbox } from '@angular/aria/listbox';
@@ -18,15 +18,23 @@ interface AXComboBoxItem {
     text: string;
     value: string | number;
 }
+/**
+ * The combo box model value: a scalar (or `null`) in single-select mode,
+ * or an array of scalars in multi-select mode.
+ */
+type AXComboBoxValue = string | number | (string | number)[] | null;
 
 /**
- * A minimal combo box for selecting a single value from a list of items.
+ * A minimal combo box for selecting one or more values from a list of items.
  *
  * Built on top of the `@angular/aria/combobox` directives, it supports two behaviors:
  * - `searchable="true"` (default): an input with typeahead filtering (matches `id`).
  * - `searchable="false"`: a select-like, non-editable trigger (same input; typing blocked without
  *   Combobox `readonly`, so Tab focus and keyboard open/select keep working).
  *
+ * With `multiple="true"`, selected values are shown as chips in the trigger and the popup stays
+ * open while toggling items (same interaction model as `ax-lookup` multi-select).
+ *
  * With `adaptivityEnabled` (default `true`), the list opens as a bottom actionsheet on small
  * screens instead of an anchored dropdown — the same alternate presentation as `ax-select-box`.
  *
@@ -36,8 +44,12 @@ interface AXComboBoxItem {
  *
  * @category Components
  */
-declare class AXComboBoxComponent extends NXComponent implements FormValueControl<string | number | null> {
+declare class AXComboBoxComponent extends NXValueComponent implements FormValueControl<AXComboBoxValue> {
     #private;
+    /**
+     * The name of the form field, used by validation rules and `ax-form.validate(names)`.
+     */
+    name: _angular_core.InputSignal<string>;
     /**
      * The list of items the user can select from.
      * Each item has `id` (search/identity), `text` (display), and `value` (submitted).
@@ -48,6 +60,11 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      * or is a select-like, non-editable trigger (`false`).
      */
     searchable: _angular_core.InputSignal<boolean>;
+    /**
+     * When `true`, multiple items can be selected. Selected values are shown as chips and the
+     * popup stays open while toggling. The model value is an array (`[]` when empty).
+     */
+    multiple: _angular_core.InputSignal<boolean>;
     /**
      * When `true` (default), the popup list uses the alternate actionsheet presentation on small
      * screens (`SM`). When `false`, the list always opens as an anchored dropdown.
@@ -65,6 +82,11 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      * The placeholder text shown when no value is selected.
      */
     placeholder: _angular_core.InputSignal<string>;
+    /**
+     * Placeholder for the trigger search input when items are already selected (multi-select).
+     * Falls back to `placeholder` when the selection is empty.
+     */
+    searchPlaceholder: _angular_core.InputSignal<string>;
     /**
      * Custom template rendered when the filtered list has no items.
      * When omitted, a default "no result found" message is shown.
@@ -80,6 +102,7 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      * Context: `{ $implicit: AXComboBoxItem }`.
      * When `searchable` is true, the template is shown while the popup is closed and the input
      * still reflects the selected text; typing/opening falls back to the plain input.
+     * In multi-select mode, the template replaces the chip text for each selected item.
      */
     selectedTemplate: _angular_core.InputSignal<TemplateRef<unknown>>;
     /**
@@ -95,14 +118,14 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      */
     look: _angular_core.ModelSignal<AXStyleLookType>;
     /**
-     * The selected item's `value`. Supports `[(value)]`, `[(ngModel)]`, and signal forms
-     * via {@link FormValueControl}.
+     * The selected item `value`(s). Scalar (or `null`) in single mode; an array in multi mode.
+     * Supports `[(value)]`, `[(ngModel)]`, and signal forms via {@link FormValueControl}.
      */
-    readonly value: _angular_core.ModelSignal<string | number>;
+    readonly value: _angular_core.ModelSignal<AXComboBoxValue>;
     /**
      * Emitted when the selected value changes.
      */
-    onValueChanged: _angular_core.OutputEmitterRef<AXValueChangedEvent<string | number>>;
+    onValueChanged: _angular_core.OutputEmitterRef<AXValueChangedEvent<AXComboBoxValue>>;
     /**
      * Emitted when the trigger receives focus.
      */
@@ -131,15 +154,26 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
     protected expanded: _angular_core.WritableSignal<boolean>;
     /** Whether the list is currently shown as a bottom actionsheet (small screens + adaptivity). */
     protected isActionsheetStyle: _angular_core.WritableSignal<boolean>;
-    /** The item whose `value` matches the current model value. */
+    /** The current selection normalized to an array of submitted values. */
+    protected selectedValues: _angular_core.Signal<(string | number)[]>;
+    /** Whether there is at least one selected value. */
+    protected hasSelection: _angular_core.Signal<boolean>;
+    /** Resolved selected items for the current model value(s). */
+    protected selectedItems: _angular_core.Signal<AXComboBoxItem[]>;
+    /** The item whose `value` matches the current model value (single-select). */
     protected selectedItem: _angular_core.Signal<AXComboBoxItem>;
-    /** Display text shown in the trigger / used as the searchable input baseline. */
+    /** Display text shown in the trigger / used as the searchable input baseline (single-select). */
     protected displayText: _angular_core.Signal<string>;
-    /** The text typed in the searchable input. Resets to the selected item's text. */
+    /**
+     * The text typed in the searchable input.
+     * Multi-select starts empty; single mode syncs from the selected display text.
+     */
     protected searchText: _angular_core.WritableSignal<string>;
     /** Whether the trigger should render `selectedTemplate` instead of the plain input text. */
     protected showSelectedTemplate: _angular_core.Signal<boolean>;
-    /** The listbox selection (item ids), kept in sync with the selected value. */
+    /** Placeholder for the editable trigger search input in multi-select. */
+    protected triggerSearchPlaceholder: _angular_core.Signal<string>;
+    /** The listbox selection (item ids), kept in sync with the selected value(s). */
     protected selection: _angular_core.WritableSignal<string[]>;
     /** Items filtered by typed query against `id` when the combo box is searchable. */
     protected filteredItems: _angular_core.Signal<AXComboBoxItem[]>;
@@ -149,13 +183,16 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
     constructor();
     /** Stable unique key for `@for` — avoids NG0955 when `id` is missing or duplicated. */
     protected trackItemKey(index: number, item: AXComboBoxItem): string;
+    /** Whether the given item is currently selected. */
+    protected isItemSelected(item: AXComboBoxItem): boolean;
     /**
      * Opens (searchable) or toggles (non-searchable) the popup on trigger click.
      */
     protected onTriggerClick(): void;
     /**
-     * Non-searchable keyboard: open with Enter/Space when collapsed; commit with Space when expanded.
-     * (Aria relays Enter for editable inputs, but not Space.)
+     * Keyboard handling on the trigger:
+     * - Non-searchable: open with Enter/Space when collapsed; commit with Space when expanded.
+     * - Multi-select: Backspace removes the last chip when the search input is empty.
      */
     protected onTriggerKeydown(event: KeyboardEvent): void;
     /** Blocks typing in non-searchable mode without Combobox `readonly` (keeps Tab/keyboard working). */
@@ -165,8 +202,12 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      */
     protected onPopoverClosed(): void;
     /**
-     * Clears the selected value (sets it to `null`) and closes the popup.
-     * Used by projected `ax-clear-button`.
+     * Removes a single chip from the multi selection.
+     */
+    protected removeChip(event: Event, item: AXComboBoxItem): void;
+    /**
+     * Clears the selected value(s) and closes the popup.
+     * Sets `null` in single mode and `[]` in multi mode. Used by projected `ax-clear-button`.
      *
      * @param isUserInteraction - Whether the clear was triggered by the user.
      */
@@ -180,18 +221,24 @@ declare class AXComboBoxComponent extends NXComponent implements FormValueContro
      */
     closeAll(): void;
     /**
-     * Commits the highlighted (active) or clicked list item as the component value and closes the popup.
+     * Commits the highlighted (active) or clicked list item as the component value.
      *
      * With `selectionMode="explicit"`, arrow keys only move the active item; Enter/Space must resolve
      * that option. Clicks resolve from the event target so we do not depend on listener order vs ngListbox.
+     *
+     * In multi-select mode the item is toggled and the popup stays open.
      */
     protected commit(event?: Event): void;
+    /**
+     * Focuses the combo box trigger input.
+     */
+    focus(options?: FocusOptions): void;
     /** Forwards native focus from the trigger input. */
     protected emitOnFocus(e: FocusEvent): void;
     /** Forwards native blur from the trigger input. */
     protected emitOnBlur(e: FocusEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXComboBoxComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXComboBoxComponent, "ax-combo-box", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "adaptivityEnabled": { "alias": "adaptivityEnabled"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "alternate": { "alias": "alternate"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "selectedTemplate": { "alias": "selectedTemplate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "look": "lookChange"; "value": "valueChange"; "onValueChanged": "onValueChanged"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onItemClick": "onItemClick"; "onItemSelected": "onItemSelected"; "onOpened": "onOpened"; "onClosed": "onClosed"; }, never, ["ax-prefix", "ax-clear-button", "ax-suffix", "ax-header", "ax-footer"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXComboBoxComponent, "ax-combo-box", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "adaptivityEnabled": { "alias": "adaptivityEnabled"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "alternate": { "alias": "alternate"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "selectedTemplate": { "alias": "selectedTemplate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "look": "lookChange"; "value": "valueChange"; "onValueChanged": "onValueChanged"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onItemClick": "onItemClick"; "onItemSelected": "onItemSelected"; "onOpened": "onOpened"; "onClosed": "onClosed"; }, never, ["ax-prefix", "ax-clear-button", "ax-suffix", "ax-header", "ax-footer", "ax-validation-rule"], true, never>;
 }
 
 declare class AXComboBoxModule {
@@ -201,4 +248,4 @@ declare class AXComboBoxModule {
 }
 
 export { AXComboBoxComponent, AXComboBoxModule };
-export type { AXComboBoxItem };
+export type { AXComboBoxItem, AXComboBoxValue };

package/types/acorex-components-conversation.d.ts

@@ -1,7 +1,7 @@
 import * as _acorex_components_conversation from '@acorex/components/conversation';
 import * as _angular_core from '@angular/core';
 import { OnDestroy, ViewContainerRef, Type, InputSignal, WritableSignal, Signal, Provider, OnInit, EventEmitter, TemplateRef, InjectionToken, ModuleWithProviders } from '@angular/core';
-import { AXComponentCloseEvent, AXHtmlEvent, AXDataSource, AXPlacement, AXClosableComponent } from '@acorex/cdk/common';
+import { AXComponentCloseEvent, AXHtmlEvent, AXClickEvent, AXDataSource, AXPlacement, AXClosableComponent } from '@acorex/cdk/common';
 import * as _acorex_components_popup from '@acorex/components/popup';
 import { AXPopupService, AXPopupRef } from '@acorex/components/popup';
 import { AXFileUploadOptions, AXUploadResult, AXUploadReference, AXUploaderService, AXUploaderFileChangeEvent } from '@acorex/cdk/uploader';
@@ -716,18 +716,20 @@ declare class AXConversationComposerService {
     readonly canSend: _angular_core.Signal<boolean>;
     /** Composer action context */
     readonly actionContext: _angular_core.Signal<AXConversationComposerActionContext>;
-    /** Left actions from registry */
-    readonly leftActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right actions from registry */
-    readonly rightActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left inline actions (location = 'inline' or undefined) */
-    readonly leftInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left menu actions (location = 'menu') */
-    readonly leftMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right inline actions (location = 'inline' or undefined) */
-    readonly rightInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right menu actions (location = 'menu') */
-    readonly rightMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start actions from registry */
+    readonly startActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End actions from registry */
+    readonly endActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start inline actions (location = 'inline' or undefined) */
+    readonly startInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start menu actions — shown in the attachment popup */
+    readonly startMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End inline actions inside the input pill (excludes default action) */
+    readonly endInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End menu actions (location = 'menu') */
+    readonly endMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Default end action (voice/send morph button) */
+    readonly defaultAction: _angular_core.Signal<AXConversationComposerAction>;
     startReply(message: AXConversationMessage): void;
     startEdit(message: AXConversationMessage): void;
     /** Focus the composer text area when the composer component is mounted. */
@@ -758,7 +760,7 @@ declare class AXConversationComposerService {
     /**
      * Get actions for the active conversation
      */
-    getActionsForPosition(position: 'left' | 'right', context: AXConversationComposerActionContext): AXConversationComposerAction[];
+    getActionsForPosition(position: 'start' | 'end', context: AXConversationComposerActionContext): AXConversationComposerAction[];
     /**
      * Execute an action
      */
@@ -822,10 +824,15 @@ interface AXConversationComposerAction extends Omit<AXConversationRegistryItem,
     label: string;
     /** Icon name/class */
     icon: string;
-    /** Position: left or right */
-    position: 'left' | 'right';
-    /** Location: inline (show as button) or menu (show in dropdown menu) */
+    /** Position: start or end of the composer */
+    position: 'start' | 'end';
+    /** Location: inline (show as button) or menu (show in attachment popup menu) */
     location?: 'inline' | 'menu';
+    /**
+     * Primary end action (e.g. voice record). Only one action may be default.
+     * Renders as the circular send-style button and morphs into send when the draft has content.
+     */
+    default?: boolean;
     /** Visibility condition */
     visible: (context: AXConversationComposerActionContext) => boolean;
     /** Enabled condition */
@@ -869,18 +876,20 @@ declare class AXConversationComposerActionRegistry {
     constructor();
     /** All registered actions */
     readonly actions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left-side actions sorted by priority */
-    readonly leftActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right-side actions sorted by priority */
-    readonly rightActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left-side inline actions (location = 'inline' or undefined) */
-    readonly leftInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left-side menu actions (location = 'menu') */
-    readonly leftMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right-side inline actions (location = 'inline' or undefined) */
-    readonly rightInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right-side menu actions (location = 'menu') */
-    readonly rightMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start-side actions sorted by priority */
+    readonly startActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End-side actions sorted by priority */
+    readonly endActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start-side inline actions (location = 'inline' or undefined) */
+    readonly startInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start-side menu actions (location = 'menu') — shown in the attachment popup */
+    readonly startMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End-side inline actions inside the input pill (excludes default action) */
+    readonly endInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End-side menu actions (location = 'menu') */
+    readonly endMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** The single default end action (voice/send morph button) */
+    readonly defaultAction: _angular_core.Signal<AXConversationComposerAction>;
     /**
      * Register a composer action
      */
@@ -895,11 +904,11 @@ declare class AXConversationComposerActionRegistry {
     /**
      * Get visible actions for a position
      */
-    getVisibleActions(position: 'left' | 'right', context: AXConversationComposerActionContext): AXConversationComposerAction[];
+    getVisibleActions(position: 'start' | 'end', context: AXConversationComposerActionContext): AXConversationComposerAction[];
     /**
      * Get enabled actions for a position
      */
-    getEnabledActions(position: 'left' | 'right', context: AXConversationComposerActionContext): AXConversationComposerAction[];
+    getEnabledActions(position: 'start' | 'end', context: AXConversationComposerActionContext): AXConversationComposerAction[];
     isActionEnabled(action: AXConversationComposerAction, context: AXConversationComposerActionContext): boolean;
     /**
      * Picker actions for a file catalog (by priority), when visible and enabled.
@@ -1598,7 +1607,7 @@ declare class AXConversationComposerComponent implements OnDestroy {
     private readonly config;
     private readonly translation;
     /** Access registry through conversation service */
-    private get registry();
+    protected get composerActionRegistry(): _acorex_components_conversation.AXConversationComposerActionRegistry;
     /** Composer text area reference */
     private readonly textAreaRef;
     /** Draft text - use service */
@@ -1627,6 +1636,9 @@ declare class AXConversationComposerComponent implements OnDestroy {
     /** Emoji popover state */
     private readonly emojiPopoverRef;
     readonly emojiPopoverTarget: _angular_core.WritableSignal<HTMLElement>;
+    /** Attachment menu popover state */
+    private readonly attachPopoverRef;
+    readonly attachPopoverTarget: _angular_core.WritableSignal<HTMLElement>;
     readonly composerPopupLoader: () => Promise<typeof _acorex_components_conversation.AXConversationComposerPopupComponent>;
     /** Input placeholder - use service */
     readonly placeholder: _angular_core.Signal<string>;
@@ -1638,18 +1650,20 @@ declare class AXConversationComposerComponent implements OnDestroy {
     readonly inputRows: _angular_core.Signal<number>;
     /** Can send message - use service */
     readonly canSend: _angular_core.Signal<boolean>;
-    /** Left actions from registry - use service */
-    readonly leftActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right actions from registry - use service */
-    readonly rightActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left inline actions (location = 'inline' or undefined) */
-    readonly leftInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Left menu actions (location = 'menu') */
-    readonly leftMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right inline actions (location = 'inline' or undefined) */
-    readonly rightInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
-    /** Right menu actions (location = 'menu') */
-    readonly rightMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start actions from registry - use service */
+    readonly startActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End actions from registry - use service */
+    readonly endActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start inline actions */
+    readonly startInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Start menu actions (attachment popup) */
+    readonly startMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End inline actions inside input pill */
+    readonly endInlineActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** End menu actions */
+    readonly endMenuActions: _angular_core.Signal<AXConversationComposerAction[]>;
+    /** Default end action (voice/send morph) */
+    readonly defaultAction: _angular_core.Signal<AXConversationComposerAction>;
     /** Handle key down */
     onKeyDown(event: AXHtmlEvent<KeyboardEvent>): void;
     /** Handle input */
@@ -1661,7 +1675,7 @@ declare class AXConversationComposerComponent implements OnDestroy {
     /** Handle send click */
     onSendClick(): Promise<void>;
     /** Handle emoji click */
-    onEmojiClick(event?: MouseEvent): Promise<void>;
+    onEmojiClick(event?: AXClickEvent | MouseEvent): Promise<void>;
     /** Handle emoji popover closed */
     onEmojiPopoverClosed(): void;
     /** Handle emoji/sticker selection from popup */
@@ -1670,8 +1684,16 @@ declare class AXConversationComposerComponent implements OnDestroy {
     private sendSticker;
     /** Get inputs for emoji popup component */
     getEmojiPopupInputs(): Record<string, unknown>;
-    /** Handle attach click */
-    onAttachClick(): void;
+    /** Handle attach menu click */
+    onAttachMenuClick(event: AXClickEvent): void;
+    /** Handle attachment popover closed */
+    onAttachPopoverClosed(): void;
+    /** Handle attachment menu action selection */
+    onAttachMenuAction(actionId: string): Promise<void>;
+    /** Handle default action click (voice when empty, send when has content) */
+    onDefaultActionClick(): Promise<void>;
+    /** Icon for the default morph button */
+    getDefaultActionIcon(): string;
     /** Handle voice click */
     onVoiceClick(): void;
     /** Remove attachment */
@@ -1684,8 +1706,9 @@ declare class AXConversationComposerComponent implements OnDestroy {
     startReply(message: AXConversationMessage): void;
     /** Focus the native textarea inside ax-text-area */
     private focusTextArea;
+    private getClickTarget;
     /** Handle action click */
-    onActionClick(actionId: string, event?: MouseEvent): Promise<void>;
+    onActionClick(actionId: string, event?: AXClickEvent | MouseEvent): Promise<void>;
     /** Check if action is enabled */
     isActionEnabled(action: any): boolean;
     /** Get replying sender name */
@@ -1693,6 +1716,9 @@ declare class AXConversationComposerComponent implements OnDestroy {
     getActionLabel(action: {
         label: string;
     }): string;
+    getActionButtonClass(action: {
+        className?: string;
+    }): string;
     /** Get replying message text */
     getReplyingMessageText(): string;
     /** Preview object for replying banner (type, icon, value) */
@@ -1788,7 +1814,10 @@ interface AXConversationDropdownMenuItem {
 declare class AXConversationInfoBarComponent {
     private readonly conversationService;
     private readonly infoBar;
+    private readonly customUserAvatarComponent;
     protected get registry(): _acorex_components_conversation.AXConversationRegistryService;
+    /** Whether a custom user avatar component is registered via conversation config. */
+    readonly hasCustomUserAvatar: _angular_core.Signal<boolean>;
     /** Active conversation */
     readonly activeConversation: _angular_core.Signal<AXConversation>;
     /** Active component from service */
@@ -3838,6 +3867,9 @@ declare class AXConversationMessageListComponent implements OnDestroy {
     readonly showScrollButton: _angular_core.WritableSignal<boolean>;
     /** Active conversation */
     readonly activeConversation: _angular_core.Signal<_acorex_components_conversation.AXConversation>;
+    readonly isGroupConversation: _angular_core.Signal<boolean>;
+    /** Placeholder indices for the initial message list skeleton. */
+    protected readonly loadingSkeletonItems: readonly [0, 1, 2, 3, 4, 5];
     /** Whether the active conversation allows message reactions. */
     readonly reactionsEnabled: _angular_core.Signal<boolean>;
     /** Messages */
@@ -6269,6 +6301,7 @@ declare class AXConversationDefaultConversationAvatarComponent {
         displayAvatar: string;
         displayIcon: string;
     }>;
+    readonly filteredUserAvatarInputs: _angular_core.Signal<Record<string, unknown>>;
     readonly fallbackDisplay: _angular_core.Signal<_acorex_components_conversation.AXConversationAvatarDisplay>;
     readonly fallbackInitials: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXConversationDefaultConversationAvatarComponent, never>;

package/types/acorex-components-loading-dialog.d.ts

@@ -1,6 +1,7 @@
 import { AXStyleColorType, AXStyleLookType, AXHotKeyAction, MXBaseComponent } from '@acorex/cdk/common';
 import { AXOverlayRef } from '@acorex/cdk/overlay';
 import { AXDialogButtonItem } from '@acorex/components/dialog';
+import { AXPopupSizeType, AXPopupRef } from '@acorex/components/popup';
 import { AXProgressMode } from '@acorex/components/progress-bar';
 import * as _angular_core from '@angular/core';
 import { OnInit } from '@angular/core';
@@ -13,6 +14,8 @@ interface AXLoadingDialogConfig {
     progressValue?: number;
     progressColor?: AXStyleColorType;
     progressHeight?: number;
+    /** Popup size token. Uses the same responsive sizes as `AXPopupService`. @default 'sm' */
+    size?: AXPopupSizeType;
     buttons?: AXLoadingDialogButtonItem[];
 }
 interface AXLoadingDialogButtonItem {
@@ -43,7 +46,7 @@ interface AXLoadingDialogRef {
 type AXDialogRef = AXLoadingDialogRef;
 /**
  * @internal
- * Internal reference used by loading dialog service to manage overlay instances
+ * Internal reference used by loading dialog service to manage overlay instances.
  */
 interface AXLoadingDialogInternalRef {
     overlayRef: AXOverlayRef<unknown>;
@@ -57,8 +60,13 @@ interface AXLoadingDialogInternalRef {
 declare class AXLoadingDialogComponent extends MXBaseComponent implements OnInit {
     /** Loading dialog configuration data */
     data: _angular_core.InputSignal<AXLoadingDialogConfig>;
-    /** @internal Callback function to close the dialog */
+    /** Callback function to close the dialog */
     onClose: _angular_core.InputSignal<() => void>;
+    /**
+     * Injected by {@link AXPopupComponent} when this dialog is opened via {@link AXPopupService}.
+     * @internal
+     */
+    readonly __popup__: _angular_core.InputSignal<AXPopupRef<any>>;
     /** @ignore */
     protected progressText: _angular_core.WritableSignal<string>;
     /** @ignore */
@@ -116,7 +124,7 @@ declare class AXLoadingDialogComponent extends MXBaseComponent implements OnInit
     /** @ignore */
     protected _hasAutoFocus(button: AXLoadingDialogButtonItem): boolean;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXLoadingDialogComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXLoadingDialogComponent, "ax-loading-dialog", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "onClose": { "alias": "onClose"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXLoadingDialogComponent, "ax-loading-dialog", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "onClose": { "alias": "onClose"; "required": false; "isSignal": true; }; "__popup__": { "alias": "__popup__"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class AXLoadingDialogModule {
@@ -126,7 +134,7 @@ declare class AXLoadingDialogModule {
 }
 
 declare class AXLoadingDialogService {
-    private overlayService;
+    private popupService;
     /**
      * Opens a loading dialog with the specified configuration.
      *

package/types/acorex-components-lookup.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { TemplateRef, ElementRef } from '@angular/core';
-import { AXEvent, AXDataSource, AXListDataSource, AXHtmlEvent, NXComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent } from '@acorex/cdk/common';
+import { AXEvent, AXDataSource, AXListDataSource, AXHtmlEvent, NXValueComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent } from '@acorex/cdk/common';
 import { AXPopoverComponent } from '@acorex/components/popover';
 import { AXTreeViewNode, AXTreeViewDataSource, AXTreeViewSelectionBehavior, AXTreeViewItemTemplateContext, AXTreeViewSelectionChangeEvent } from '@acorex/components/tree-view';
 import { FormValueControl } from '@angular/forms/signals';
@@ -127,6 +127,11 @@ declare abstract class AXLookupListViewBase {
     protected isSelected(item: AXLookupItem): boolean;
     protected isDisabled(item: AXLookupItem): boolean;
     protected handleItemClick(item: AXLookupItem | null | undefined): void;
+    /**
+     * Commit on mousedown (not click) so a searchable trigger blur cannot destroy the
+     * list before the pick is applied.
+     */
+    protected handleItemMouseDown(event: Event, item: AXLookupItem | null | undefined): void;
     protected handleItemKeypress(e: AXHtmlEvent<KeyboardEvent>, item: AXLookupItem | null | undefined): void;
     protected handleListKeypress(e: AXHtmlEvent<KeyboardEvent>): void;
     protected activateNavItem(nav: AXListNavigationDirective, item: AXListNavigationItemDirective): void;
@@ -205,8 +210,12 @@ declare class AXLookupMultiSelectTreeComponent {
  *
  * @category Components
  */
-declare class AXLookupComponent extends NXComponent implements FormValueControl<unknown | unknown[] | null> {
+declare class AXLookupComponent extends NXValueComponent implements FormValueControl<unknown | unknown[] | null> {
     #private;
+    /**
+     * The name of the form field, used by validation rules and `ax-form.validate(names)`.
+     */
+    name: _angular_core.InputSignal<string>;
     /**
      * The lookup rendering mode. Selects which mini component renders in the popup.
      */
@@ -313,6 +322,12 @@ declare class AXLookupComponent extends NXComponent implements FormValueControl<
      * via {@link FormValueControl}.
      */
     readonly value: _angular_core.ModelSignal<unknown>;
+    /**
+     * Full items that resolve the current `value` key(s) without calling datasource `byKey`.
+     * Use when the parent already has the selected entity (e.g. edit forms). Seeds the internal
+     * item cache; missing keys still fall through to `find` / `byKey`.
+     */
+    valueItems: _angular_core.InputSignal<AXLookupItem[]>;
     /**
      * Emitted when the selected value changes.
      */
@@ -445,6 +460,13 @@ declare class AXLookupComponent extends NXComponent implements FormValueControl<
      * Removes a single chip from the multi selection.
      */
     protected removeChip(event: Event, item: AXLookupItem): void;
+    /**
+     * Seeds the item cache with known items so matching `value` keys resolve without `byKey`.
+     * Useful after an async parent-entity load when `valueItems` is not bound.
+     *
+     * @param items - Full items that include `valueField` (and ideally `textField`) properties.
+     */
+    seedItems(items: AXLookupItem[]): void;
     /**
      * Clears the whole selection.
      * Sets `null` in single modes and `[]` in multi modes. Used by projected `ax-clear-button`.
@@ -453,7 +475,7 @@ declare class AXLookupComponent extends NXComponent implements FormValueControl<
      */
     reset(isUserInteraction?: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXLookupComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXLookupComponent, "ax-lookup", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "treeDataSource": { "alias": "treeDataSource"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "textField": { "alias": "textField"; "required": false; "isSignal": true; }; "disabledField": { "alias": "disabledField"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "adaptivityEnabled": { "alias": "adaptivityEnabled"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "alternate": { "alias": "alternate"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "itemHeight": { "alias": "itemHeight"; "required": false; "isSignal": true; }; "maxVisibleItems": { "alias": "maxVisibleItems"; "required": false; "isSignal": true; }; "treeSelectionBehavior": { "alias": "treeSelectionBehavior"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "selectedTemplate": { "alias": "selectedTemplate"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; "loadingTemplate": { "alias": "loadingTemplate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "look": "lookChange"; "value": "valueChange"; "onValueChanged": "onValueChanged"; "onSelectionChanged": "onSelectionChanged"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onItemClick": "onItemClick"; "onItemSelected": "onItemSelected"; "onOpened": "onOpened"; "onClosed": "onClosed"; }, never, ["ax-prefix", "ax-clear-button", "ax-suffix", "ax-header", "ax-footer"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXLookupComponent, "ax-lookup", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "dataSource": { "alias": "dataSource"; "required": false; "isSignal": true; }; "treeDataSource": { "alias": "treeDataSource"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "textField": { "alias": "textField"; "required": false; "isSignal": true; }; "disabledField": { "alias": "disabledField"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "adaptivityEnabled": { "alias": "adaptivityEnabled"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "alternate": { "alias": "alternate"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "itemHeight": { "alias": "itemHeight"; "required": false; "isSignal": true; }; "maxVisibleItems": { "alias": "maxVisibleItems"; "required": false; "isSignal": true; }; "treeSelectionBehavior": { "alias": "treeSelectionBehavior"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "selectedTemplate": { "alias": "selectedTemplate"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; "loadingTemplate": { "alias": "loadingTemplate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "valueItems": { "alias": "valueItems"; "required": false; "isSignal": true; }; }, { "look": "lookChange"; "value": "valueChange"; "onValueChanged": "onValueChanged"; "onSelectionChanged": "onSelectionChanged"; "onFocus": "onFocus"; "onBlur": "onBlur"; "onItemClick": "onItemClick"; "onItemSelected": "onItemSelected"; "onOpened": "onOpened"; "onClosed": "onClosed"; }, never, ["ax-prefix", "ax-clear-button", "ax-suffix", "ax-header", "ax-footer", "ax-validation-rule"], true, never>;
 }
 
 /**
@@ -607,6 +629,7 @@ declare class AXLookupMultiColumnComponent {
     protected resolveRowCssClass: (row: unknown) => string;
     protected handleRowClick(event: AXDataTableRowClick): void;
     protected handleItemClick(item: AXLookupItem | null | undefined): void;
+    protected handleItemMouseDown(event: Event, item: AXLookupItem | null | undefined): void;
     protected isSelected(item: AXLookupItem): boolean;
     protected isDisabled(item: AXLookupItem): boolean;
     private getValue;

package/types/acorex-components-select-box.d.ts

@@ -12,7 +12,7 @@ import { Observable } from 'rxjs';
 import * as i1 from '@angular/common';
 import * as i3 from '@angular/forms';
 import * as i4 from '@acorex/components/check-box';
-import * as i5 from '@acorex/components/badge';
+import * as i5 from '@acorex/components/tag';
 import * as i6 from '@acorex/components/decorators';
 import * as i7 from '@acorex/core/translation';
 import * as i8 from '@acorex/components/popover';
@@ -197,7 +197,7 @@ declare class AXSelectBoxComponent extends AXSelectBoxComponent_base implements
  */
 declare class AXSelectBoxModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXSelectBoxModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXSelectBoxModule, never, [typeof i1.CommonModule, typeof i2.AXCommonModule, typeof i3.FormsModule, typeof i4.AXCheckBoxModule, typeof i5.AXBadgeModule, typeof i6.AXDecoratorModule, typeof i7.AXTranslationModule, typeof i8.AXPopoverModule, typeof i9.AXLoadingModule, typeof i10.A11yModule, typeof i11.AXTextBoxModule, typeof i12.AXDropdownModule, typeof i13.AXListModule, typeof AXSelectBoxComponent], [typeof AXSelectBoxComponent]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<AXSelectBoxModule, never, [typeof i1.CommonModule, typeof i2.AXCommonModule, typeof i3.FormsModule, typeof i4.AXCheckBoxModule, typeof i5.AXTagModule, typeof i6.AXDecoratorModule, typeof i7.AXTranslationModule, typeof i8.AXPopoverModule, typeof i9.AXLoadingModule, typeof i10.A11yModule, typeof i11.AXTextBoxModule, typeof i12.AXDropdownModule, typeof i13.AXListModule, typeof AXSelectBoxComponent], [typeof AXSelectBoxComponent]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<AXSelectBoxModule>;
 }