KQ-207 · TAG/FIELD
Tag Field
A field that turns text into tokens. Type and press Enter or comma to chip a tag in on a spring; paste a delimited list and it splits into several at once; backspace on an empty field lifts the last one back off. Removing a chip reflows the rest with a FLIP glide, and duplicates are ignored.
KQ-207 · TAG/FIELD
designmotion
Tags 2
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/tag-field
Props
- value
- string[]
- default —
- Current tags (controlled).
- onValueChange
- (tags) => void
- default —
- Fires with the new tag list.
- maxTags
- number
- default —
- Optional cap on the number of tags.
- placeholder
- string
- default —
- Input placeholder.
| Prop | Type | Default | Description |
|---|---|---|---|
| value | string[] | — | Current tags (controlled). |
| onValueChange | (tags) => void | — | Fires with the new tag list. |
| maxTags | number | — | Optional cap on the number of tags. |
| placeholder | string | — | Input placeholder. |