---
title: Todo List
description: The Update Todos tool call with done, active and pending items.
---

<Component path="claude-code/examples/claude-code-todo-list" />

<RegistryInstall name="claude-code-todo-list" />

`ClaudeCodeTodoList` prints the `● Update Todos` call with the list hanging off a `⎿` below it. Done todos get a `☒` and a dim strikethrough, the active one is bold white and pending ones stay in the body color. Screen readers hear the status before each label. Change the heading with `heading`, or pass `heading={null}` to print the list on its own.

```ts
interface ClaudeCodeTodo {
  label: string;
  status: "done" | "active" | "todo";
}
```

## Used in

**[Claude Code](/blocks/claude-code)**

A Claude Code terminal session with the compact header, tool calls, a running turn and the prompt.
