You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: components/chat/file-uploads-and-media.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -25,9 +25,9 @@ Enable file uploads by setting the `EnableFileUpload` parameter to `true`:
25
25
26
26
The `MessageFilesLayoutMode` parameter controls how file attachments are displayed within chat messages. Choose from three layout options to best fit your application's design:
27
27
28
-
*`ChatMessageFilesLayoutMode.Vertical` - Files are displayed in a vertical stack (default)
29
-
*`ChatMessageFilesLayoutMode.Horizontal` - Files are displayed in a horizontal row
30
-
*`ChatMessageFilesLayoutMode.Wrap` - Files wrap to the next line when they exceed the message width
28
+
*`ChatMessageFilesLayoutMode.Vertical`—Files are displayed in a vertical stack (default)
29
+
*`ChatMessageFilesLayoutMode.Horizontal`—Files are displayed in a horizontal row
30
+
*`ChatMessageFilesLayoutMode.Wrap`—Files wrap to the next line when they exceed the message width
Copy file name to clipboardExpand all lines: components/chat/messages.md
+10-10Lines changed: 10 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -14,7 +14,9 @@ The Telerik UI for Blazor Chat component provides comprehensive control over mes
14
14
15
15
## Typing Indicator
16
16
17
-
The Chat component supports displaying a typing indicator to show when another user is composing a message. Set the `IsTypingField` parameter to specify which field in your data model indicates typing status, and set that field to `true` on a message to display the typing indicator instead of message content.
17
+
The Chat supports displaying a typing indicator to show when another user is composing a message. When a message has `IsTyping` set to `true`, the component will display an animated typing indicator (typically three dots) instead of the message content. This provides visual feedback that enhances the conversational experience, especially in real-time chat scenarios.
18
+
19
+
First, set the `IsTypingField` parameter to specify which field in your data model indicates typing status. Next, set that field to `true` on a message to display the typing indicator.
@@ -74,8 +76,6 @@ The Chat component supports displaying a typing indicator to show when another u
74
76
}
75
77
````
76
78
77
-
When a message has `IsTyping` set to `true`, the Chat will display an animated typing indicator (typically three dots) instead of the message content. This provides visual feedback that enhances the conversational experience, especially in real-time chat scenarios.
78
-
79
79
## Context Menu Message Actions
80
80
81
81
Configure context menu actions that appear when users right-click on messages. These actions provide quick access to common message operations.
@@ -245,7 +245,7 @@ Control the width behavior of chat messages using the `MessageWidthMode` paramet
245
245
246
246
## Author and Receiver Message Settings
247
247
248
-
The Chat component allows you to configure settings specifically for author messages (sent by the current user) and receiver messages (received from other users) using `ChatAuthorMessageSettings` and `ChatReceiverMessageSettings` components. These settings take precedence over global Chat settings, enabling different configurations for sent and received messages.
248
+
The Chat component lets you configure settings specifically for author messages (sent by the current user) and receiver messages (received from other users) using `ChatAuthorMessageSettings` and `ChatReceiverMessageSettings` components. These settings take precedence over global Chat settings, enabling different configurations for sent and received messages.
249
249
250
250
Use these settings to customize message behavior, appearance, and available actions based on whether the message was sent or received. For example, you might want different context menu actions, toolbar actions, or file actions for your own messages versus messages from others.
251
251
@@ -345,13 +345,13 @@ Use these settings to customize message behavior, appearance, and available acti
345
345
}
346
346
````
347
347
348
-
Available settings for both `ChatAuthorMessageSettings` and `ChatReceiverMessageSettings`:
348
+
`ChatAuthorMessageSettings` and `ChatReceiverMessageSettings` provide the following settings:
349
349
350
-
*`EnableMessageCollapse` - Enables the collapse functionality for long messages
351
-
*`MessageWidthMode` - Controls message width (`Standard` or `Full`)
352
-
*`ChatMessageContextMenuActions` - Define context menu actions for right-click interactions
353
-
*`ChatMessageToolbarActions` - Define toolbar actions that appear on hover or selection
354
-
*`ChatFileActions` - Define actions available for file attachments
350
+
*`EnableMessageCollapse`—Enables the collapse functionality for long messages
351
+
*`MessageWidthMode`—Controls message width (`Standard` or `Full`)
352
+
*`ChatMessageContextMenuActions`—Defines context menu actions for right-click interactions
353
+
*`ChatMessageToolbarActions`—Defines toolbar actions that appear on hover or selection
354
+
*`ChatFileActions`—Defines actions available for file attachments
355
355
356
356
If no author or receiver-specific setting is provided, the component falls back to the global Chat settings.
Copy file name to clipboardExpand all lines: components/chat/quick-actions.md
+8-8Lines changed: 8 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -20,9 +20,11 @@ Message suggestions provide users with quick reply options that appear below the
20
20
21
21
The `SuggestionsLayoutMode` parameter controls how suggestions are displayed in the chat interface. Choose from three layout options to optimize the presentation based on the number and length of your suggestions:
22
22
23
-
*`ChatSuggestionsLayoutMode.Wrap` - Suggestions wrap to the next line if they exceed the container width (default)
24
-
*`ChatSuggestionsLayoutMode.Scroll` - Suggestions are displayed in a single line with horizontal scrolling
25
-
*`ChatSuggestionsLayoutMode.ScrollButtons` - Suggestions are displayed in a single line with horizontal scrolling and navigation buttons
23
+
*`ChatSuggestionsLayoutMode.Wrap`—Suggestions wrap to the next line if they exceed the container width (default)
24
+
*`ChatSuggestionsLayoutMode.Scroll`—Suggestions are displayed in a single line with horizontal scrolling
25
+
*`ChatSuggestionsLayoutMode.ScrollButtons`—Suggestions are displayed in a single line with horizontal scrolling and navigation
26
+
27
+
Use `Scroll` or `ScrollButtons` mode when you have many suggestions or longer text that won't fit comfortably in the available width. The `ScrollButtons` mode is particularly helpful for users who prefer button navigation over scrolling gestures.
26
28
27
29
````Razor
28
30
<TelerikChat Data="@ChatData"
@@ -58,15 +60,13 @@ The `SuggestionsLayoutMode` parameter controls how suggestions are displayed in
58
60
}
59
61
````
60
62
61
-
Use `Scroll` or `ScrollButtons` mode when you have many suggestions or longer text that won't fit comfortably in the available width. The `ScrollButtons` mode is particularly helpful for users who prefer button navigation over scrolling gestures.
62
-
63
63
## Suggested Actions Layout Mode
64
64
65
65
The `SuggestedActionsLayoutMode` parameter controls how suggested actions (quick actions attached to specific messages) are displayed. Similar to `SuggestionsLayoutMode`, it offers three layout options:
66
66
67
-
*`ChatSuggestedActionsLayoutMode.Wrap` - Suggested actions wrap to the next line (default)
68
-
*`ChatSuggestedActionsLayoutMode.Scroll` - Suggested actions are displayed in a single line with horizontal scrolling
69
-
*`ChatSuggestedActionsLayoutMode.ScrollButtons` - Suggested actions are displayed in a single line with horizontal scrolling and navigation buttons
67
+
*`ChatSuggestedActionsLayoutMode.Wrap`—Suggested actions wrap to the next line (default)
68
+
*`ChatSuggestedActionsLayoutMode.Scroll`—Suggested actions are displayed in a single line with horizontal scrolling
69
+
*`ChatSuggestedActionsLayoutMode.ScrollButtons`—Suggested actions are displayed in a single line with horizontal scrolling and navigation buttons
Copy file name to clipboardExpand all lines: components/chat/templates.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -29,7 +29,7 @@ This template allows you to customize the Chat header, where you can display tit
29
29
30
30
## NoDataTemplate
31
31
32
-
The `NoDataTemplate`allows you to define custom content displayed when the Chat has no messages. This is useful for showing welcome messages, instructions, or branding when the conversation is empty.
32
+
The `NoDataTemplate`lets you to define custom content displayed when the Chat has no messages. This is useful for showing welcome messages, instructions, or branding when the conversation is empty.
33
33
34
34
````RAZOR.skip-repl
35
35
<NoDataTemplate>
@@ -40,7 +40,7 @@ The `NoDataTemplate` allows you to define custom content displayed when the Chat
40
40
41
41
## MessageContentTemplate
42
42
43
-
Customize how individual message content is rendered within the Chat. This template has been renamed from `MessageTemplate` for better clarity.
43
+
The `MessageContentTemplate` provides the option to customize how individual message content is rendered within the Chat.
0 commit comments