Ai.MessageIndicator#

Experimental: The AI extension and its component APIs may change in the future. Please give us feedback on your experience with them.

Import#

import { MessageIndicator } from '@dnb/eufemia/extensions/ai'
import '@dnb/eufemia/extensions/ai/style'
render(<MessageIndicator />)

Description#

Ai.MessageIndicator indicates that an assistant message is being prepared, for example after the user sends a message and before the first response arrives. It has the same header as Ai.Message, and screen readers announce a translated text. Remove it when the response starts or the request ends.

Use Ai.ActivityText when you want to describe a specific activity, such as “Searching” or “Preparing your answer”.

Demos#

Waiting for a message#

<MessageIndicator
  name="Aino"
  avatar={
    <Avatar variant="secondary" hasLabel>
      A
    </Avatar>
  }
/>