---
title: 'Ai.ActivityText'
description: 'Describes what the assistant is doing, such as thinking or searching.'
version: 11.17.0
generatedAt: 2026-11-05T09:55:47.088Z
checksum: 090b7d977ba4be5e2c4c04d199a30a4048416c59f443a56985df2f80629d9c40
---

# Ai.ActivityText

**Experimental:** The AI 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/ai'
import '@dnb/eufemia/extensions/ai/style'
render(<ActivityText>Searching …</ActivityText>)
```

## Description

`Ai.ActivityText` describes the assistant's current activity, such as “Thinking”, “Searching” or “Preparing your answer”. 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 [Ai.MessageIndicator](/web/patterns-and-extensions/ai/MessageIndicator/) to indicate that an assistant message is being prepared before its content arrives. Use `Ai.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 the assistant's current activity, e.g. `Thinking …` or `Searching …`.",
      "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)."
}
```