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

PropTypeDefaultDescription
valuestring[]Current tags (controlled).
onValueChange(tags) => voidFires with the new tag list.
maxTagsnumberOptional cap on the number of tags.
placeholderstringInput placeholder.