# AI setup

`agent-ui` has a deliberately small agent-facing setup path. It does not require a package install, framework, build step, or MCP server.

**HTML docs page:** [`ai-setup.html`](ai-setup.html) · **Agent index:** [`../../llms.txt`](../../llms.txt)

## 1. Read the catalog

Open [`../catalog.json`](../catalog.json). It is generated from the repository contract and lists every MVP component's:

- purpose and category;
- supported states;
- required and optional dependencies;
- canonical HTML, CSS, fixture, README, and docs paths;
- CSS variables, events, and host-owned responsibilities.

The repository-level [`AGENTS.md`](../../AGENTS.md) contains the same conventions in an agent-discoverable location.

## 2. Copy this prompt

```text
Build this agentic interface with agent-ui source files. First read docs/catalog.json and choose the smallest matching recipe or component. Copy tokens.css, the recipe stylesheets[] (including host-chrome.css when listed), and only the required component markup. Use semantic HTML, native forms, the shared data-au-* vocabulary, and the documented data-au-state values. Keep the host responsible for execution, authorization, persistence, validation, and state transitions. Treat model output, tool arguments, and tool output as untrusted text and escape it before insertion. Keep the no-JS path usable. Do not add React, Tailwind, a bundler, external assets, fonts, analytics, or runtime network requests. Exclude setup.docs_only_assets. After implementation, run node scripts/check-all.js and, when a browser is available, node scripts/check-browser.js.
```

## 3. Choose the shortest path

- Complete first screen: [`chat-tools.html`](../starters/chat-tools.html) (aliases the canonical showcase run)
- Canonical host composition: [`../../showcase/chat-run.html`](../../showcase/chat-run.html)
- Streaming conversation: [`chat-streaming.html`](../patterns/chat-streaming.html)
- Tool approval: [`tool-approval.html`](../patterns/tool-approval.html)
- Question and resume: [`question-resume.html`](../patterns/question-resume.html)

Resolved stylesheet lists live on each recipe in [`../catalog.json`](../catalog.json) as `stylesheets[]`. Optional one-link CSS: `recipes/chat-tools.css` (still copy `tokens.css`). Optional copy command: `node scripts/copy-recipe.js chat-tools ./vendor/agent-ui`. Exclude assets listed in `setup.docs_only_assets`.

## 4. Keep the trust boundary visible

`agent-ui` renders state. The host owns execution, authorization, persistence, validation, and server responses. Approval is only valid for the immutable action ID and exact serialized arguments shown to the user.

## 5. Verify before handing off

```bash
node scripts/check-all.js
node scripts/check-browser.js
```

The checks cover generated-document drift, catalog drift, SEO artifacts, no-JS fixtures, accessibility, contrast, links, size budgets, recipe contracts, and browser behavior.