Updated v5 docs to remove broken/unwanted code

ui-kit/angular/api-reference/introduction.mdx

@@ -1,14 +1,14 @@
 ---
 title: Services
 description: "Reference for CometChat UIKit Angular injectable services."
 ---
 This section documents the Angular services provided by the CometChat UIKit. These are injectable services you use via Angular's dependency injection to manage state, configure components, and customize behavior.
 
 ## Core Classes
 
 ### CometChatUIKit
 
 The main entry point for initializing and configuring the UIKit.
 
 ```typescript expandable
 class CometChatUIKit {
@@ -27,7 +27,7 @@
 ```
 
 <Note>
   The UIKit exposes two session-check methods with intentionally different casing — this mirrors the underlying CometChat SDK naming.
 
   - `getLoggedInUser()` (capital **I**, synchronous) — returns the in-memory cached user immediately. Use this for quick checks inside components where you already know the user is logged in.
   - `getLoggedinUser()` (lowercase **i**, async) — makes an SDK call to verify the session. Use this in `ngOnInit` or `main.ts` before rendering components, as it is the authoritative check.
@@ -61,7 +61,7 @@
 | `subscribePresenceForRoles(roles)` | `string[]` | — | Subscribe to presence updates for specific roles |
 | `setAutoEstablishSocketConnection(auto)` | `boolean` | `true` | Auto-establish WebSocket connection on init |
 | `setCallingEnabled(enabled)` | `boolean` | `false` | Enable voice/video calling. When `true`, the Calls SDK is initialized after login and call buttons become visible in MessageHeader, CallButtons, and CallLogs. When `false` (default), call buttons are hidden and the Calls SDK is not initialized |
 | `setCallAppSettings(settings)` | `any` | — | Custom `CallAppSettings` for the Calls SDK. Built via `CometChatUIKitCalls.CallAppSettingsBuilder`. If not set, the UIKit builds default settings from `appId` and `region` |
 | `setStorageMode(mode)` | `CometChat.StorageMode` | `LOCAL` | Storage mode for the SDK |
 | `setAdminHost(host)` | `string` | — | Override the admin host URL |
 | `setClientHost(host)` | `string` | — | Override the client host URL |
@@ -79,7 +79,7 @@
 | ChatStateService | Centralized chat state management service — tracks active user, group, and conversation across components | [ChatStateService](/ui-kit/angular/api-reference/chat-state-service) |
 | MessageBubbleConfigService | Centralized message bubble view configuration — customize bubble parts globally or per message type | [MessageBubbleConfigService](/ui-kit/angular/api-reference/message-bubble-config-service) |
 | CometChatTemplatesService | SDK-wide template customization service — shared and component-specific templates for all list components | [CometChatTemplatesService](/ui-kit/angular/api-reference/templates-service) |
 | FormatterConfigService | Text formatter configuration service — manages text formatting rules and custom formatters | [FormatterConfigService](/ui-kit/angular/api-reference/formatter-config-service) |
 | RichTextEditorService | Rich text editor configuration service — controls editor behavior, toolbar options, and input modes | [RichTextEditorService](/ui-kit/angular/api-reference/rich-text-editor-service) |
 | GlobalConfig | Centralized configuration via `COMETCHAT_GLOBAL_CONFIG` injection token — sets defaults for display, sound, calls, and more across all components | [GlobalConfig](/ui-kit/angular/customization/global-config) |
 
@@ -109,8 +109,9 @@
 Subscribe to message-related events.
 
 ```typescript
-CometChatMessageEvents.ccMessageSent.subscribe((message) => {
-  console.log('Message sent:', message);
+CometChatMessageEvents.ccMessageSent.subscribe(({ message, status }) => {
+  // `status` reflects the send lifecycle: inprogress, success, or error.
+  console.log('Message sent:', message, status);
 });
 
 CometChatMessageEvents.onTextMessageReceived.subscribe((message) => {

ui-kit/angular/components/cometchat-audio-bubble.mdx

@@ -2,7 +2,7 @@
 title: "Audio Bubble"
 description: "A comprehensive Angular component for rendering audio messages with real-time waveform visualization, playback controls, download functionality, and caption support"
 ---
 The `CometChatAudioBubble` component is a sophisticated audio message display component that renders audio messages with real-time waveform visualization and playback controls. It serves as the primary content renderer for audio-based messages in the CometChat Angular UIKit, handling everything from single audio display to complex multi-audio layouts with expand/collapse behavior.
 
 ## Overview
 
@@ -49,7 +49,7 @@
   template: `
     <cometchat-audio-bubble
       [message]="audioMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-audio-bubble>
   `
 })
@@ -75,13 +75,13 @@
     <!-- Incoming message (left-aligned) -->
     <cometchat-audio-bubble
       [message]="incomingMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-audio-bubble>
 
     <!-- Outgoing message (right-aligned) -->
     <cometchat-audio-bubble
       [message]="outgoingMessage"
-      [alignment]="MessageBubbleAlignment.RIGHT"
+      [alignment]="MessageBubbleAlignment.right"
     ></cometchat-audio-bubble>
   `
 })
@@ -139,7 +139,7 @@
 | Property | Type | Default | Description |
 |----------|------|---------|-------------|
 | `message` | `CometChat.MediaMessage` | **required** | The CometChat.MediaMessage object to render. Contains audio attachments, metadata, and sender information |
-| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.LEFT` | The alignment of the message bubble. `LEFT` for incoming/receiver messages, `RIGHT` for outgoing/sender messages |
+| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.left` | The alignment of the message bubble. `left` for incoming/receiver messages, `right` for outgoing/sender messages |
 
 ## Events
 
@@ -235,13 +235,13 @@
     <!-- Sender variant: white progress, neutral-500 wave -->
     <cometchat-audio-bubble
       [message]="audioMessage"
-      [alignment]="MessageBubbleAlignment.RIGHT"
+      [alignment]="MessageBubbleAlignment.right"
     ></cometchat-audio-bubble>
 
     <!-- Receiver variant: primary color progress, extended-primary-300 wave -->
     <cometchat-audio-bubble
       [message]="audioMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-audio-bubble>
   `
 })
@@ -591,7 +591,7 @@
 </Tip>
 
 <Warning>
   The component does NOT open a modal or fullscreen view. Expansion happens inline within the message bubble.
 </Warning>
 
 <Info>

ui-kit/angular/components/cometchat-call-buttons.mdx

@@ -73,7 +73,7 @@ export class CallButtonsDemoComponent {
 | `onError` | `((error: CometChat.CometChatException) => void) \| null` | `null` | Error callback invoked for any error during call operations. |
 | `outgoingCallDisableSoundForCalls` | `boolean` | `false` | Disables sound for the outgoing call overlay. Supports global config override. |
 | `outgoingCallCustomSoundForCalls` | `string` | `''` | Custom sound URL for the outgoing call overlay. Supports global config override. |
-| `callSettingsBuilder` | `CallSettingsBuilder` | `undefined` | Custom `CallSettingsBuilder` to override the default call settings used in the ongoing call screen. Follows the three-tier priority: @Input > [GlobalConfig](/ui-kit/angular/customization/global-config) > default. |
+| `callSettingsBuilder` | `SessionSettings` | `undefined` | A plain v5 `SessionSettings` object used to override the default call settings in the ongoing call screen. Pass a built `SessionSettings` object — the kit does **not** call `.build()` internally. Follows the three-tier priority: @Input > [GlobalConfig](/ui-kit/angular/customization/global-config) > default. |
 | `voiceCallButtonView` | `TemplateRef<any> \| null` | `null` | Replaces the default voice call button with a custom template. |
 | `videoCallButtonView` | `TemplateRef<any> \| null` | `null` | Replaces the default video call button with a custom template. |
 
@@ -115,7 +115,7 @@ cometchat-call-buttons {
 
 ### Custom Call Settings
 
-Override the default `CallSettingsBuilder` to customize the call UI:
+Pass a plain v5 `SessionSettings` object to customize the call UI. Build the object yourself with `.build()` — the kit does **not** call `.build()` internally:
 
 ```typescript expandable
 import { Component, OnInit } from '@angular/core';
@@ -139,9 +139,11 @@ export class CustomCallSettingsComponent implements OnInit {
   customCallSettings: any;
 
   ngOnInit(): void {
+    // Build the SessionSettings object yourself — the kit does not call .build().
     this.customCallSettings = new CometChatCalls.CallSettingsBuilder()
       .enableDefaultLayout(true)
-      .setIsAudioOnlyCall(false);
+      .setIsAudioOnlyCall(false)
+      .build();
   }
 }
 ```

ui-kit/angular/components/cometchat-collaborative-document-bubble.mdx

@@ -2,7 +2,7 @@
 title: "Collaborative Document Bubble"
 description: "An Angular component for rendering collaborative document messages with banner images, localized text, and action buttons"
 ---
 The `CometChatCollaborativeDocumentBubble` component renders collaborative document messages within chat. It displays a banner image, title, subtitle, and an action button that opens the document in a new fullscreen window.
 
 ## Overview
 
@@ -12,7 +12,7 @@
 - **Theme-aware Banner Images**: Automatically selects light/dark banner images based on current theme
 - **Localized Text**: Displays title, subtitle, and button text using localization keys
 - **Sender/Receiver Styling**: Supports outgoing (right-aligned) and incoming (left-aligned) visual variants
 - **Action Button**: Opens the document URL in a new fullscreen window
 - **Accessibility**: Full keyboard navigation and screen reader support
 
 
@@ -49,7 +49,7 @@
   template: `
     <cometchat-collaborative-document-bubble
       [message]="documentMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-collaborative-document-bubble>
   `
 })
@@ -77,13 +77,13 @@
     <!-- Incoming message (left-aligned) -->
     <cometchat-collaborative-document-bubble
       [message]="incomingMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-collaborative-document-bubble>
 
     <!-- Outgoing message (right-aligned) -->
     <cometchat-collaborative-document-bubble
       [message]="outgoingMessage"
-      [alignment]="MessageBubbleAlignment.RIGHT"
+      [alignment]="MessageBubbleAlignment.right"
     ></cometchat-collaborative-document-bubble>
   `
 })
@@ -127,7 +127,7 @@
 | Property | Type | Default | Description |
 |----------|------|---------|-------------|
 | `message` | `CometChat.CustomMessage` | **required** | The CometChat.CustomMessage object containing collaborative document metadata |
-| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.LEFT` | The alignment of the message bubble. `LEFT` for incoming/receiver messages, `RIGHT` for outgoing/sender messages |
+| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.left` | The alignment of the message bubble. `left` for incoming/receiver messages, `right` for outgoing/sender messages |
 | `disableInteraction` | `boolean` | `false` | When true, disables the action button and other interactive elements within the bubble |
 
 ## Events
@@ -219,7 +219,7 @@
   }
 
   get alignment(): MessageBubbleAlignment {
-    return this.isOutgoing ? MessageBubbleAlignment.RIGHT : MessageBubbleAlignment.LEFT;
+    return this.isOutgoing ? MessageBubbleAlignment.right : MessageBubbleAlignment.left;
   }
 
   handleDocumentOpen(url: string): void {
@@ -289,8 +289,8 @@
 
   getAlignment(message: CometChat.CustomMessage): MessageBubbleAlignment {
     return this.isOutgoing(message) 
-      ? MessageBubbleAlignment.RIGHT 
-      : MessageBubbleAlignment.LEFT;
+      ? MessageBubbleAlignment.right 
+      : MessageBubbleAlignment.left;
   }
 
   onDocumentOpen(url: string): void {

ui-kit/angular/components/cometchat-collaborative-whiteboard-bubble.mdx

@@ -2,7 +2,7 @@
 title: "Collaborative Whiteboard Bubble"
 description: "An Angular component for rendering collaborative whiteboard messages with banner images, localized text, and action buttons"
 ---
 The `CometChatCollaborativeWhiteboardBubble` component renders collaborative whiteboard messages within chat. It displays a banner image, title, subtitle, and an action button that opens the whiteboard in a new fullscreen window.
 
 ## Overview
 
@@ -12,7 +12,7 @@
 - **Theme-aware Banner Images**: Automatically selects light/dark banner images based on current theme
 - **Localized Text**: Displays title, subtitle, and button text using localization keys
 - **Sender/Receiver Styling**: Supports outgoing (right-aligned) and incoming (left-aligned) visual variants
 - **Action Button**: Opens the whiteboard URL in a new fullscreen window
 - **Accessibility**: Full keyboard navigation and screen reader support
 
 
@@ -49,7 +49,7 @@
   template: `
     <cometchat-collaborative-whiteboard-bubble
       [message]="whiteboardMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-collaborative-whiteboard-bubble>
   `
 })
@@ -77,13 +77,13 @@
     <!-- Incoming message (left-aligned) -->
     <cometchat-collaborative-whiteboard-bubble
       [message]="incomingMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-collaborative-whiteboard-bubble>
 
     <!-- Outgoing message (right-aligned) -->
     <cometchat-collaborative-whiteboard-bubble
       [message]="outgoingMessage"
-      [alignment]="MessageBubbleAlignment.RIGHT"
+      [alignment]="MessageBubbleAlignment.right"
     ></cometchat-collaborative-whiteboard-bubble>
   `
 })
@@ -127,7 +127,7 @@
 | Property | Type | Default | Description |
 |----------|------|---------|-------------|
 | `message` | `CometChat.CustomMessage` | **required** | The CometChat.CustomMessage object containing collaborative whiteboard metadata |
-| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.LEFT` | The alignment of the message bubble. `LEFT` for incoming/receiver messages, `RIGHT` for outgoing/sender messages |
+| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.left` | The alignment of the message bubble. `left` for incoming/receiver messages, `right` for outgoing/sender messages |
 | `disableInteraction` | `boolean` | `false` | When true, disables the action button and other interactive elements within the bubble |
 
 ## Events
@@ -219,7 +219,7 @@
   }
 
   get alignment(): MessageBubbleAlignment {
-    return this.isOutgoing ? MessageBubbleAlignment.RIGHT : MessageBubbleAlignment.LEFT;
+    return this.isOutgoing ? MessageBubbleAlignment.right : MessageBubbleAlignment.left;
   }
 
   handleWhiteboardOpen(url: string): void {
@@ -289,8 +289,8 @@
 
   getAlignment(message: CometChat.CustomMessage): MessageBubbleAlignment {
     return this.isOutgoing(message) 
-      ? MessageBubbleAlignment.RIGHT 
-      : MessageBubbleAlignment.LEFT;
+      ? MessageBubbleAlignment.right 
+      : MessageBubbleAlignment.left;
   }
 
   onWhiteboardOpen(url: string): void {

ui-kit/angular/components/cometchat-conversation-item.mdx

@@ -123,9 +123,9 @@
 | `hideReceipts` | `boolean` | `false` | Hide message read receipts (sent, delivered, read indicators) |
 | `hideUserStatus` | `boolean` | `false` | Hide the user online/offline status indicator |
 | `hideGroupType` | `boolean` | `false` | Hide the group type icon (public, private, password) |
-| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu and shows the custom context menu instead |
+| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu. Custom CometChat menu visibility depends on the component's context-menu options and interaction state. |
 | `dateFormat` | `CalendarObject` | `undefined` | Custom date format configuration for the timestamp display |
 | `textFormatters` | `CometChatTextFormatter[]` | `[]` | Array of text formatters applied to the last message subtitle text |
 
 ### Customization Properties
 
@@ -768,7 +768,7 @@
 </Tip>
 
 <Warning>
   When handling granular click events (avatarClick, titleClick, etc.), the component automatically calls `stopPropagation()` to prevent the main `itemClick` event from firing. Design your event handlers accordingly.
 </Warning>
 
 <Info>

ui-kit/angular/components/cometchat-conversations.mdx

@@ -19,7 +19,7 @@
 - **Service-Based Architecture**: Clean separation of concerns with Angular best practices
 - **Keyboard Navigation**: Full keyboard accessibility with arrow keys and shortcuts (WCAG 2.1 Level AA compliant)
 - **Selection Modes**: Support for single and multiple conversation selection
 - **Search Functionality**: Built-in search with debouncing
 - **Context Menu**: Customizable actions for each conversation
 - **Sound Notifications**: Optional notification sounds for new messages
 - **Error Handling**: Comprehensive error handling with retry logic
@@ -59,7 +59,7 @@
 - `aria-label` with conversation details (name, last message, unread count)
 - `aria-selected` indicates selected conversations
 - `aria-live="polite"` region for screen reader announcements
 - Proper `tabindex` management (roving tabindex pattern)
 
 **Screen Reader Support:**
 - Announces conversation details when focused
@@ -72,7 +72,7 @@
 - Visible focus indicators (2px border) meeting WCAG contrast requirements
 - Focus trap within modals (delete confirmation)
 - Focus restoration after closing overlays
 - Roving tabindex for efficient keyboard navigation
 - High contrast mode support
 
 **WCAG 2.1 Compliance:**
@@ -177,7 +177,7 @@
 | Property | Type | Default | Description |
 |----------|------|---------|-------------|
 | `options` | `(conversation: Conversation) => CometChatOption[]` | `undefined` | Function to provide custom context menu options |
-| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu and shows the custom context menu instead |
+| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu. Custom CometChat menu visibility depends on the component's context-menu options and interaction state. |
 | `slots` | `Partial<ConversationSlots>` | `undefined` | Slot-based customization for fine-grained UI control of conversation items |
 
 ### Sound Configuration Properties
@@ -1259,7 +1259,7 @@
 - Clear focus indicators using the primary color
 - Focus is maintained when navigating with keyboard
 - Focus returns to the last focused item after menu interactions
 - Focus is trapped within modal dialogs (context menus)
 
 ### High Contrast Mode
 
@@ -1356,7 +1356,7 @@
 
 ### Retry Logic
 
 The service includes automatic retry logic with exponential backoff for recoverable errors:
 
 - Network errors: Retries up to 3 times
 - Timeout errors: Retries with increasing delays (1s, 2s, 4s)

ui-kit/angular/components/cometchat-file-bubble.mdx

@@ -44,7 +44,7 @@
   template: `
     <cometchat-file-bubble
       [message]="fileMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-file-bubble>
   `
 })
@@ -70,13 +70,13 @@
     <!-- Incoming message (left-aligned) -->
     <cometchat-file-bubble
       [message]="incomingMessage"
-      [alignment]="MessageBubbleAlignment.LEFT"
+      [alignment]="MessageBubbleAlignment.left"
     ></cometchat-file-bubble>
 
     <!-- Outgoing message (right-aligned) -->
     <cometchat-file-bubble
       [message]="outgoingMessage"
-      [alignment]="MessageBubbleAlignment.RIGHT"
+      [alignment]="MessageBubbleAlignment.right"
     ></cometchat-file-bubble>
   `
 })
@@ -92,7 +92,7 @@
 | Property | Type | Default | Description |
 |----------|------|---------|-------------|
 | `message` | `CometChat.MediaMessage` | **required** | The CometChat.MediaMessage object to render. Contains file attachments, metadata, and sender information |
-| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.LEFT` | The alignment of the message bubble. `LEFT` for incoming/receiver messages, `RIGHT` for outgoing/sender messages |
+| `alignment` | `MessageBubbleAlignment` | `MessageBubbleAlignment.left` | The alignment of the message bubble. `left` for incoming/receiver messages, `right` for outgoing/sender messages |
 
 ## Advanced Usage
 
@@ -431,7 +431,7 @@
 </Tip>
 
 <Warning>
   The component does NOT open a modal or fullscreen view. Expansion happens inline within the message bubble.
 </Warning>
 
 <Info>
@@ -481,7 +481,7 @@
 **Expand/Collapse Animation:**
 - Uses CSS transitions for smooth animations
 - Efficient height animation without JavaScript
 - Focus management optimized with setTimeout
 
 ### Best Practices for Performance
 

ui-kit/angular/components/cometchat-group-item.mdx

@@ -13,7 +13,7 @@
 - **Group Avatar**: Displays the group icon with a group type indicator badge
 - **Member Count**: Shows the localized member count below the group name
 - **Custom Templates**: Template projection for leading, title, subtitle, and trailing sections
-- **Context Menu**: Configurable context menu options on hover or right-click
+- **Context Menu**: Configurable context menu options that appear on hover or focus
 - **Keyboard Accessibility**: Full keyboard support with Enter, Space, and Shift+F10 shortcuts
 - **Global Config Priority**: Supports a three-tier priority system (Input > GlobalConfig > Default)
 
@@ -68,10 +68,10 @@
 | `isActive` | `boolean` | `false` | Whether this group item is currently active/selected for viewing. Applies active styling. |
 | `isSelected` | `boolean` | `false` | Whether this group item is selected in selection mode. Shows selection indicator. |
 | `isFocused` | `boolean` | `false` | Whether this group item currently has keyboard focus. Applies focus styling. |
 | `tabIndex` | `number` | `-1` | The tabindex for roving tabindex pattern. Only the focused item should have `0`. |
 | `hideGroupType` | `boolean` | `false` | Whether to hide the group type indicator (public, private, password). Supports global config override. |
-| `disableDefaultContextMenu` | `boolean` | `true` | Whether to disable the browser's default context menu on right-click/long-press. |
-| `contextMenuOptions` | `CometChatOption[]` | `undefined` | Options for the context menu displayed on hover/right-click. |
+| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu. Custom CometChat menu visibility depends on the component's context-menu options and interaction state. |
+| `contextMenuOptions` | `CometChatOption[]` | `undefined` | Options for the context menu displayed on hover/focus. |
 | `leadingView` | `TemplateRef<{ $implicit: CometChat.Group }>` | `undefined` | Custom template for the leading section (icon/avatar area). |
 | `titleView` | `TemplateRef<{ $implicit: CometChat.Group }>` | `undefined` | Custom template for the title section. |
 | `subtitleView` | `TemplateRef<{ $implicit: CometChat.Group }>` | `undefined` | Custom template for the subtitle section. |
@@ -83,9 +83,9 @@
 |-------|-------------|-------------|
 | `itemClick` | `CometChat.Group` | Emitted when the group item is clicked or activated via keyboard. |
 | `itemSelect` | `{ group: CometChat.Group; selected: boolean }` | Emitted when the group is selected/deselected in selection mode. |
-| `contextMenuOpen` | `CometChat.Group` | Emitted when the context menu is opened. |
+| `contextMenuOpen` | `CometChat.Group` | Emitted for keyboard shortcuts (Shift+F10 / ContextMenu) to request the context menu. Menu option visibility itself is driven by hover/focus state. |
 | `contextMenuOptionClick` | `{ option: CometChatOption; group: CometChat.Group }` | Emitted when a context menu option is clicked. |
 | `itemFocus` | `void` | Emitted when the item's inner container receives native focus. Used by the parent list for roving tabindex management. |
 
 ## Customization
 
@@ -136,21 +136,21 @@
 |-----|--------|
 | `Enter` | Activate the group item (emits `itemClick`) |
 | `Space` | Activate the group item (emits `itemClick`) |
-| `Shift + F10` | Open the context menu |
-| `ContextMenu` | Open the context menu |
+| `Shift + F10` | Emit `contextMenuOpen` to request the context menu (options appear on hover/focus) |
+| `ContextMenu` | Emit `contextMenuOpen` to request the context menu (options appear on hover/focus) |
 
 ### ARIA Attributes
 
 - `role="option"` on the item container
 - `aria-selected` reflects the current selection state
 - `aria-label` combines the group name, type, and member count for screen readers
 - Proper `tabindex` management via roving tabindex pattern
 
 ### Focus Management
 
 - Visible focus indicator meeting WCAG contrast requirements
 - Mouse clicks prevent focus outline (focus ring only appears for keyboard navigation)
 - Roving tabindex pattern for efficient list navigation
 - `itemFocus` output enables parent list to track focus position
 
 ## Related Components

ui-kit/angular/components/cometchat-group-member-item.mdx

@@ -13,8 +13,8 @@
 - **Member Avatar**: Displays the member's avatar image with an online/offline status indicator
 - **Role Badge**: Shows the member's scope/role (owner, admin, moderator) as a visual badge
 - **Custom Templates**: Template projection for leading, title, subtitle, and trailing sections
-- **Context Menu**: Configurable context menu options for member management (kick, ban, change scope)
-- **Keyboard Accessibility**: Full keyboard support with Enter, Space, and Shift+F10 shortcuts
+- **Context Menu**: Configurable context menu options for member management (kick, ban, change scope) shown on hover or focus
+- **Keyboard Accessibility**: Full keyboard support with Enter and Space shortcuts
 - **Global Config Priority**: Supports a three-tier priority system (Input > GlobalConfig > Default)
 
 
@@ -68,10 +68,10 @@
 | `isActive` | `boolean` | `false` | Whether this member item is currently active/selected for viewing. Applies active styling. |
 | `isSelected` | `boolean` | `false` | Whether this member item is selected in selection mode. Shows selection indicator. |
 | `isFocused` | `boolean` | `false` | Whether this member item currently has keyboard focus. Applies focus styling. |
 | `tabIndex` | `number` | `-1` | The tabindex for roving tabindex pattern. Only the focused item should have `0`. |
 | `hideUserStatus` | `boolean` | `false` | Whether to hide the member online/offline status indicator. Supports global config override. |
-| `disableDefaultContextMenu` | `boolean` | `true` | Whether to disable the browser's default context menu on right-click/long-press. |
-| `contextMenuOptions` | `CometChatOption[]` | `undefined` | Options for the context menu (kick, ban, change scope). |
+| `disableDefaultContextMenu` | `boolean` | `true` | When true, prevents the browser's native context menu. Custom CometChat menu visibility depends on the component's context-menu options and interaction state. |
+| `contextMenuOptions` | `CometChatOption[]` | `undefined` | Options for the context menu (kick, ban, change scope), shown on hover/focus. |
 | `leadingView` | `TemplateRef<{ $implicit: CometChat.GroupMember }>` | `undefined` | Custom template for the leading section (avatar area). |
 | `titleView` | `TemplateRef<{ $implicit: CometChat.GroupMember }>` | `undefined` | Custom template for the title section. |
 | `subtitleView` | `TemplateRef<{ $implicit: CometChat.GroupMember }>` | `undefined` | Custom template for the subtitle section. |
@@ -82,7 +82,7 @@
 | Event | Payload Type | Description |
 |-------|-------------|-------------|
 | `itemClick` | `CometChat.GroupMember` | Emitted when the member item is clicked or activated via keyboard. |
 | `itemFocus` | `void` | Emitted when the item's inner container receives native focus. Used by the parent list for roving tabindex management. |
 | `contextMenuOptionClick` | `{ option: CometChatOption; member: CometChat.GroupMember }` | Emitted when a context menu option is clicked. |
 
 ## Customization
@@ -164,8 +164,8 @@
 |-----|--------|
 | `Enter` | Activate the member item (emits `itemClick`) |
 | `Space` | Activate the member item (emits `itemClick`) |
-| `Shift + F10` | Open the context menu |
-| `ContextMenu` | Open the context menu |
+
+Context menu options are shown on hover or focus; there is no keyboard shortcut that opens the menu.
 
 ### ARIA Attributes
 
@@ -173,15 +173,15 @@
 - `aria-selected` reflects the current selection state
 - `aria-label` combines the member name, scope/role, and online/offline status for screen readers
 - `aria-hidden="true"` on the scope badge (decorative; scope is included in the accessible label)
 - Proper `tabindex` management via roving tabindex pattern
 
 ### Focus Management
 
 - Visible focus indicator with minimum 3:1 contrast ratio
 - Mouse clicks prevent focus outline (focus ring only appears for keyboard navigation)
 - Roving tabindex pattern for efficient list navigation
 - `itemFocus` output enables parent list to track focus position
 - Scope change control is focusable via Tab
 
 ## Related Components