Add ui-components composer autocomplete for enhanced mentions

Author: gpunto

stream-chat-android-docs/src/main/kotlin/io/getstream/chat/docs/kotlin/ui/messages/MessageComposer.kt

@@ -132,7 +132,7 @@ private object MessageComposer : Fragment() {
             messageComposerView.attachmentRemovalListener = { attachment ->
                 // Handle attachment removal
             }
-            messageComposerView.mentionSelectionListener = { user ->
+            messageComposerView.suggestedMentionSelectionListener = { mention ->
                 // Handle mention selection
             }
             messageComposerView.commandSelectionListener = { command ->
@@ -198,8 +198,8 @@ private object MessageComposer : Fragment() {
             messageComposerView.attachmentRemovalListener = { attachment ->
                 messageComposerViewModel.removeAttachment(attachment)
             }
-            messageComposerView.mentionSelectionListener = { user ->
-                messageComposerViewModel.selectMention(user)
+            messageComposerView.suggestedMentionSelectionListener = { mention ->
+                messageComposerViewModel.selectMention(mention)
             }
             messageComposerView.commandSelectionListener = { command ->
                 messageComposerViewModel.selectCommand(command)
@@ -279,7 +279,8 @@ private object MessageComposer : Fragment() {
             )
             messageComposerView.setMentionSuggestionsContent(
                 DefaultMessageComposerMentionSuggestionsContent(context).also {
-                    it.mentionSelectionListener = { user -> messageComposerView.mentionSelectionListener(user) }
+                    it.suggestedMentionSelectionListener =
+                        { mention -> messageComposerView.suggestedMentionSelectionListener(mention) }
                 }
             )
         }
@@ -323,7 +324,7 @@ private object MessageComposer : Fragment() {
             )
             messageComposerView.setMentionSuggestionsContent(
                 DefaultMessageComposerMentionSuggestionsContent(context).also {
-                    it.mentionSelectionListener = { user -> messageComposerViewModel.selectMention(user) }
+                    it.suggestedMentionSelectionListener = { mention -> messageComposerViewModel.selectMention(mention) }
                 }
             )
         }

stream-chat-android-ui-common/src/main/res/drawable/stream_design_ic_users.xml

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    Copyright (c) 2014-2026 Stream.io Inc. All rights reserved.
+
+    Licensed under the Stream License;
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+      https://github.com/GetStream/stream-chat-android/blob/main/LICENSE
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+    <path
+        android:strokeColor="#FF000000"
+        android:strokeWidth="1.5"
+        android:strokeLineCap="round"
+        android:strokeLineJoin="round"
+        android:pathData="M0.8 15.63C1.42 14.67 2.28 13.88 3.28 13.33 4.29 12.78 5.42 12.5 6.56 12.5 7.71 12.5 8.83 12.78 9.84 13.33 10.85 13.88 11.7 14.67 12.33 15.63M19.2 15.63C18.58 14.67 17.72 13.88 16.72 13.33 15.71 12.78 14.58 12.5 13.44 12.5 14.04 12.5 14.63 12.37 15.17 12.11 15.71 11.86 16.19 11.48 16.57 11.02 16.95 10.56 17.22 10.02 17.37 9.44 17.52 8.86 17.54 8.26 17.42 7.67 17.31 7.08 17.07 6.53 16.72 6.04 16.36 5.56 15.91 5.16 15.38 4.87 14.86 4.59 14.28 4.42 13.68 4.38 13.08 4.35 12.48 4.44 11.93 4.66M10.63 8.44C10.63 10.68 8.81 12.5 6.56 12.5 4.32 12.5 2.5 10.68 2.5 8.44 2.5 6.19 4.32 4.38 6.56 4.38 8.81 4.38 10.63 6.19 10.63 8.44Z"/>
+</vector>

stream-chat-android-ui-components/api/stream-chat-android-ui-components.api

@@ -32,6 +32,7 @@ import io.getstream.chat.android.models.ChannelCapabilities
 import io.getstream.chat.android.models.Command
 import io.getstream.chat.android.models.CreatePollParams
 import io.getstream.chat.android.models.User
+import io.getstream.chat.android.ui.common.feature.messages.composer.mention.Mention
 import io.getstream.chat.android.ui.common.state.messages.MessageMode
 import io.getstream.chat.android.ui.common.state.messages.composer.MessageComposerState
 import io.getstream.chat.android.ui.databinding.StreamUiMessageComposerBinding
@@ -116,10 +117,26 @@ public class MessageComposerView : ConstraintLayout {
     public var attachmentRemovalListener: (Attachment) -> Unit = {}
 
     /**
-     * Selection listener invoked when a mention suggestion item is selected.
-     */
+     * Selection listener invoked when a user mention suggestion item is selected.
+     *
+     * Kept for backward compatibility; only fires for [Mention.User] rows. New code should
+     * prefer [suggestedMentionSelectionListener], which fires for every mention type. Note both
+     * listeners fire on a user tap: a custom [mentionSelectionListener] runs in addition to
+     * [suggestedMentionSelectionListener], so the default selection still inserts the mention. To
+     * replace the default selection behavior, override [suggestedMentionSelectionListener].
+     */
+    @Deprecated(
+        message = "Use suggestedMentionSelectionListener; it also fires for other mention types.",
+        replaceWith = ReplaceWith("suggestedMentionSelectionListener"),
+        level = DeprecationLevel.WARNING,
+    )
     public var mentionSelectionListener: (User) -> Unit = {}
 
+    /**
+     * Selection listener invoked when any mention suggestion item is selected.
+     */
+    public var suggestedMentionSelectionListener: (Mention) -> Unit = {}
+
     /**
      * Selection listener invoked when a command suggestion item is selected.
      */
@@ -256,14 +273,15 @@ public class MessageComposerView : ConstraintLayout {
     /**
      * The current list of mention suggestions.
      */
-    private var mentionSuggestions: List<User>? = null
+    private var mentionSuggestions: List<Mention>? = null
 
     /**
      * Default implementation of [mentionSuggestionsContent].
      */
     private val defaultMentionSuggestionsView: View by lazy {
         DefaultMessageComposerMentionSuggestionsContent(context).also {
             it.mentionSelectionListener = { user -> mentionSelectionListener(user) }
+            it.suggestedMentionSelectionListener = { mention -> suggestedMentionSelectionListener(mention) }
         }.attachContext()
     }
 
@@ -606,6 +624,9 @@ public class MessageComposerView : ConstraintLayout {
             if (contentView.mentionSelectionListener == null) {
                 contentView.mentionSelectionListener = { mentionSelectionListener(it) }
             }
+            if (contentView.suggestedMentionSelectionListener == null) {
+                contentView.suggestedMentionSelectionListener = { suggestedMentionSelectionListener(it) }
+            }
         }
     }
 
@@ -643,12 +664,12 @@ public class MessageComposerView : ConstraintLayout {
      */
     private fun renderSuggestion(state: MessageComposerState) {
         when {
-            state.mentionSuggestions.isNotEmpty() -> renderMentionSuggestions(state)
+            state.suggestedMentions.isNotEmpty() -> renderMentionSuggestions(state)
             state.commandSuggestions.isNotEmpty() -> renderCommandsSuggestions(state)
             else -> suggestionsPopup?.dismiss()
         }
         this.commandSuggestions = state.commandSuggestions
-        this.mentionSuggestions = state.mentionSuggestions
+        this.mentionSuggestions = state.suggestedMentions
     }
 
     /**
@@ -683,7 +704,7 @@ public class MessageComposerView : ConstraintLayout {
      */
     private fun renderMentionSuggestions(state: MessageComposerState) {
         // Do not do anything if the list hasn't changed
-        if (this.mentionSuggestions == state.mentionSuggestions) return
+        if (this.mentionSuggestions == state.suggestedMentions) return
         if (!messageComposerContext.style.messageInputMentionsHandlingEnabled) return
 
         (mentionSuggestionsContent as? MessageComposerContent)?.renderState(state)

stream-chat-android-ui-components/src/main/kotlin/io/getstream/chat/android/ui/feature/messages/composer/MessageComposerView.kt

@@ -130,7 +130,7 @@ public open class DefaultMessageComposerLeadingContent : FrameLayout, MessageCom
         val hasAttachments = state.attachments.isNotEmpty()
         val hasCommandInput = state.inputValue.startsWith("/")
         val hasCommandSuggestions = state.commandSuggestions.isNotEmpty()
-        val hasMentionSuggestions = state.mentionSuggestions.isNotEmpty()
+        val hasMentionSuggestions = state.suggestedMentions.isNotEmpty()
         val isInEditMode = state.action is Edit
         val hasCommands = state.hasCommands
         val noRecording = state.recording is RecordingState.Idle