# Activity

> What an assistant did before it answered: a collapsible "Thinking" disclosure holding its narration and a list of steps (searched, read, ran a command), each able to open onto its own output.

```ts
import { Activity } from "@sdxc/ui/chat";
```

Renders the disclosure. Pass `open` while the reply streams so its steps show as they
arrive; a replay folds it once the answer starts, and history leaves it closed.

## Examples

```tsx
<Activity open>
	<Activity.Summary busy="Thinking">Thought for 8s</Activity.Summary>
	<Activity.Steps><Activity.Step icon={<GlobeIcon />}>Searched the web</Activity.Step></Activity.Steps>
</Activity>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `children` | `RemixNode` | An Activity.Summary, then an optional Activity.Note and Activity.Steps. |

Also accepts everything in `TagProps<"details">`.


### Activity.Summary

The disclosure's line: the done label, or the shimmering busy one while the reply streams.

| Prop | Type | Description |
| --- | --- | --- |
| `children` | `RemixNode` | What the summary says once the work is done, such as "Thought for 8s". |
| `busy?` | `RemixNode` | What it says while the reply around it is busy (`aria-busy="true"`), such as "Thinking"; it shimmers until the reply settles. |

Also accepts everything in `TagProps<"summary">`.


### Activity.Note

The assistant's narration, set as body text above its steps.

| Prop | Type | Description |
| --- | --- | --- |
| `children` | `RemixNode` | The assistant's own words on what it is about to do. |

Also accepts everything in `TagProps<"p">`.


### Activity.Steps

The steps, in order; `boxed` frames a run of them with dividers.

| Prop | Type | Description |
| --- | --- | --- |
| `children` | `RemixNode` | Activity.Step rows in the order they happened. |
| `boxed?` | `boolean` | Frames the list with dividers, for a run of similar steps inside another step. |

Also accepts everything in `TagProps<"ol">`.


### Activity.Step

One step: its glyph and words in a muted line.

| Prop | Type | Description |
| --- | --- | --- |
| `children` | `RemixNode` | What happened, in the past tense ("Searched the web"), or the present while `running`. |
| `icon?` | `RemixNode` | A 16px glyph for the kind of step; a step that only marks progress goes without. |
| `detail?` | `RemixNode` | What the step opens onto: a command's output, or a Activity.Steps `boxed` run. |
| `running?` | `boolean` | Draws the step as still in progress, with moving dots in place of its icon. |
| `duration?` | `number` | How long a streamed replay dwells on this step, in milliseconds, so a search or a command reads as taking time; while it dwells the step shows the moving dots. |

Also accepts everything in `Omit<TagProps<"li">, "title">`.