---
title: 'Chat.ActivityText'
description: 'Describes an ongoing activity in the conversation, such as searching or preparing a reply.'
version: 11.17.1
generatedAt: 2026-11-10T20:21:10.523Z
checksum: 090b7d977ba4be5e2c4c04d199a30a4048416c59f443a56985df2f80629d9c40
---

# Chat.ActivityText

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

## Import

```tsx
import { ActivityText } from '@dnb/eufemia/extensions/chat'
import '@dnb/eufemia/extensions/chat/style'
render(<ActivityText>Searching …</ActivityText>)
```

## Description

`Chat.ActivityText` describes an ongoing activity in the conversation, such as “Searching” or “Preparing your answer”. The activity can be performed by a person, an AI assistant or the application. Provide the activity text as `children`. It inherits the surrounding text color.

The current visual treatment uses a moving highlight. When the user prefers reduced motion, the text is shown without animation.

Use [Chat.MessageIndicator](/web/patterns-and-extensions/chat/MessageIndicator/) to indicate that a reply is being prepared before its content arrives. Use `Chat.ActivityText` when you have a specific activity to describe.

`ActivityText` only provides presentation. It does not create a live region or announce text changes. When the activity needs to be announced, place it in [AriaLive](/web/components/aria-live/) with `variant="content"` and `atomic`. Keep that region mounted while its text changes, and avoid nesting it in another live region.


## Demos

### Assistant activity


```tsx
render(<ActivityText>Looking up your transactions …</ActivityText>)
```


### Announced activity

Use `AriaLive` when activity changes should be announced. Keep the region mounted and update the activity text.


```tsx
const Activity = () => {
  const [text, setText] = useState('Ready');
  return <>
              <AriaLive variant="content" atomic>
                <ActivityText>{text}</ActivityText>
              </AriaLive>
              <Button top onClick={() => setText(text === 'Ready' ? 'Looking up your transactions …' : 'Ready')}>
                Change activity
              </Button>
            </>;
};
render(<Activity />);
```

<!-- eufemia-properties-usage:start -->
Some properties provide flexibility for specific integrations. Follow the component's usage guidance. Customizations beyond the documented patterns need a use case approved by DNB UX. [Read about intended use and customization](/web/styling-and-themes/configuration/component-properties/#intended-use-and-customization).
<!-- eufemia-properties-usage:end -->

## Properties


```json
{
  "props": {
    "children": {
      "doc": "Text describing an ongoing activity, e.g. `Searching …` or `Preparing a reply …`.",
      "type": "React.ReactNode",
      "status": "optional"
    },
    "[Space](/uilib/layout/space/properties)": {
      "doc": "Spacing properties like `top` or `bottom` are supported.",
      "type": [
        "string",
        "object"
      ],
      "status": "optional"
    }
  },
  "usageGuidance": "Some properties provide flexibility for specific integrations. Follow the component's usage guidance. Customizations beyond the documented patterns need a use case approved by DNB UX. [Read about intended use and customization](/web/styling-and-themes/configuration/component-properties/#intended-use-and-customization)."
}
```
