Experimental: The Chat extension and its component APIs may change in the future. Please give us feedback on your experience with them.
Import#
import { Suggestion, Suggestions } from '@dnb/eufemia/extensions/chat'import '@dnb/eufemia/extensions/chat/style'render(<Suggestions><Suggestion /></Suggestions>)
Description#
Use Chat.Suggestions with Chat.Suggestion to show prompts the user can choose, e.g. on a welcome screen. Each suggestion is a default-size secondary button. Suggestions can be common questions in a human chat as well as AI prompts. The default icon is the AI icon; pass a suitable icon or icon={null} for a human conversation. onClick receives the suggestion, so the shown text can be shorter than the prompt that is sent.
Demos#
Suggestion buttons#
<Suggestions> <Suggestion suggestion="Block my Visa card">block my visa</Suggestion> <Suggestion suggestion="Show my latest transactions"> transactions </Suggestion> </Suggestions>