# Tag Group

> An accessible tag group in the WAI-ARIA grid pattern: one tab stop, arrow keys, Home and End to move, Space or Enter to select one or many, and Backspace or Delete to remove the focused tag and hand focus to its neighbour. Read-only, single and multiple selection, disabled tags, icons, a label, help text and an empty state.

- Slug: `tag-group`
- Category: [Chips](https://www.assembli.design/category/chips.md)
- Type: component
- Tags: tag, chip, tag-group, keyboard, removable, multi-select
- npm dependencies: motion
- shadcn/ui dependencies: none
- Added: 2026-10-24
- Live preview: https://www.assembli.design/preview/tag-group
- Page: https://www.assembli.design/components/tag-group

## 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/tag-group/tag-group.tsx` and installs dependencies):

```bash
npx shadcn@latest add @assembli/tag-group
```

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

## Code

> Component source needs an Assembli subscription ($12/month) 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.