# API Endpoint

> One API reference entry, docs-style: method badge, path with its parameters picked out, then path, query and body parameters with types, required, defaults, allowed values and expandable child attributes. Beside it, the request in cURL, JavaScript or Python, generated from the params with your base URL and a tinted key placeholder, plus responses by status. The language choice is remembered.

- Slug: `api-endpoint`
- Category: [Code](https://www.assembli.design/category/code.md)
- Type: block
- Tags: api, reference, docs, endpoint, code, parameters, curl, developer
- npm dependencies: @base-ui/react, lucide-react
- shadcn/ui dependencies: none
- Live preview: https://www.assembli.design/preview/api-endpoint
- Page: https://www.assembli.design/components/api-endpoint

![API Endpoint preview](https://www.assembli.design/thumbnails/api-endpoint-light.png)

## Props

Other props pass through to the root element.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `method` (required) | `ApiMethod` |  |  |
| `path` (required) | `string` |  | Path with `{param}` placeholders, e.g. "/v1/customers/{customer}/invoices". |
| `title` | `React.ReactNode` |  |  |
| `description` | `React.ReactNode` |  |  |
| `returns` | `React.ReactNode` |  | What a successful call gives back, shown under the parameters. |
| `baseUrl` | `string` | `"https://api.example.com"` |  |
| `apiKey` | `string` | `"YOUR_API_KEY"` | Placeholder key written into every example and tinted so readers spot what to replace. |
| `params` | `{ path?: ApiParam[]; query?: ApiParam[]; body?: ApiParam[] }` |  |  |
| `examples` | `Partial<Record<ApiLanguage, string>>` |  | Replace a generated example. `{{baseUrl}}` and `{{apiKey}}` are substituted. |
| `responses` | `ApiResponse[]` | `[]` |  |
| `languages` | `ApiLanguage[]` | `["curl", "javascript", "python"]` |  |
| `language` | `ApiLanguage` |  | Controlled language. Uncontrolled, the choice is remembered and shared by every endpoint on the page. |
| `onLanguageChange` | `(language: ApiLanguage) => void` |  |  |

## Install

One-time setup (needs a subscription):

1. Add the registry to the project's `components.json`: `{"@assembli":{"url":"https://www.assembli.design/r/{name}.json","headers":{"Authorization":"Bearer ${ASSEMBLI_API_KEY}"}}}` (merge into `"registries"`).
2. Put an API key from https://www.assembli.design/account in `.env.local` as `ASSEMBLI_API_KEY=asm_…`.

Then install with the shadcn CLI (writes `components/api-endpoint/api-endpoint.tsx` and installs dependencies):

```bash
npx shadcn@latest add @assembli/api-endpoint
```

Registry item JSON: https://www.assembli.design/r/api-endpoint.json (send `Authorization: Bearer <api key>`)

## Code

> Component source needs an Assembli subscription ($12/month or $96/year) and an API key sent as `Authorization: Bearer <key>`. To get one without copying anything, POST https://www.assembli.design/api/agent/login (or call the MCP tool connect_account), show the user the link it returns, and poll https://www.assembli.design/api/agent/token for the key. Or subscribe at https://www.assembli.design/pricing and create a key at https://www.assembli.design/account.