# Setup checklist

What's left before the first useful answer: connect an environment, let the agents read it, invite the team. The current step is open with its one action; a blocked step says what it waits for. Progress counts only steps done.

- Registry name: `setup-checklist` (`@candor/setup-checklist`)
- Tier: Pro. Installing it needs a Pro, Premium or Team licence key: the person runs `npx candor-ui key <key>` themselves; never ask for the key in chat or write it to a file.
- Docs: https://candor.themethodic.com/docs/setup-checklist

## Install

```bash
npx candor-ui add setup-checklist
```

Run `npx candor-ui@latest init` once first (https://candor.themethodic.com/get-started.md). Without the CLI: `npx shadcn@latest add @candor/setup-checklist`.
It brings in: button, locale, team, utils.
npm packages: lucide-react@^1.67.0.

## Example

```tsx
"use client"

import { SetupChecklist } from "@/components/setup-checklist"
import type { SetupStep } from "@/lib/team"

const steps: SetupStep[] = [
  { id: "account", title: "Create your account", status: "done" },
  { id: "staging", title: "Connect Staging", status: "done" },
  { id: "read", title: "Let Keel read Acme API Staging", detail: "About 6 minutes for a codebase this size. You can ask questions while it reads.", status: "current", action: { label: "Start reading", onClick: () => {} } },
  { id: "invite", title: "Invite your team", status: "todo" },
  { id: "prod", title: "Connect Production", status: "blocked", blockedBy: "a Staging change approved end to end" },
]

export default function Example() {
  return <SetupChecklist className="w-full max-w-md" title="Get Acme ready" steps={steps} />
}
```

## <SetupChecklist>

Props:

- `title: string`: The heading, also the checklist's accessible name.
- `steps: SetupStep[]`: The steps in order, each with its status and action.
- `bare?: boolean | undefined` (default `false`): No border or heading, only the progress and steps, for inside another card (AccountState's `steps`). Defaults to false.
- `className?: string | undefined`

## Strings (`setupChecklist`)

The fixed words, English by default. Override any of them under `setupChecklist` in `<LocaleProvider strings={{ setupChecklist: { … } }}>`; the table is exported as `setupChecklistStrings`.

- `progress`: {done} of {total} done
- `waitsFor`: Waits for: {what}

## Rules for using Candor UI

- Components take plain typed data. Never pass model output as HTML or render it as a link; messages are typed blocks.
- A control that can't be used says why: wrap it in `<Locked reason="…">`, don't just disable it.
- Don't show a value you don't have: leave it out (it renders as —) rather than guess. An estimate is labelled as one.
- Nothing is pre-selected in a decision a person makes, and the agent is named from your app's data, never from model output.
- Your app's words go in `LocaleProvider` (fixed strings) and `TermsProvider` (nouns); entity kinds and agent roles in `EntityKindsProvider` and `AgentRolesProvider`.