Predefined SuggestionsPremium
Predefined suggestions streamline user interactions by offering quick-select options for common responses or phrases. This feature significantly improves user experience by reducing typing effort and ensuring consistent communication patterns.
The Chat component supports two approaches for handling suggestions:
- Direct Send—Suggestions that are immediately sent as messages when clicked
- Input Population—Suggestions that populate the input field for review and editing before sending
Direct Send
This is the default behavior where suggestions are immediately sent as messages when clicked. Configure suggestions using the suggestions input with an array of ChatSuggestion objects. Each suggestion includes an identifier, display text, optional description for context, and a disabled state for conditional availability.
Suggestions appear as clickable items above the message input, allowing users to instantly send preset responses. Upon clicking a suggestion, the onSuggestionClick event is triggered, returning the ChatSuggestion as an argument. This allows you to handle each suggestion accordingly.
Input Population
This approach allows users to populate the Chat input field with suggested text rather than sending messages directly. When a suggestion is clicked, the text is populated into the input field using the inputValue property, enabling users to review, edit, or customize the text before sending.
This pattern is particularly useful for:
- Templates that users might want to customize
- Partial messages that need additional context
- Scenarios where users want to review before sending
- Multi-part messages where suggestions provide starting points