dragoon0x Tag & Token Input
Behavior
- Type text → press Enter or comma → creates a tag/chip
- Tags appear as removable chips inside the input
- Backspace removes the last tag when input is empty
- Autocomplete suggestions appear while typing
- Click X on any tag to remove it
Design
- Tags flow and wrap within the input container
- Input grows vertically to accommodate tags
- Tag style: rounded pill or rounded rectangle with X button
- Consistent tag color (or color-coded by category)
- Maximum tag count if applicable
Autocomplete
- Show matching existing tags/options while typing
- Highlight matching characters
- Allow creating new tags ("Create 'new-tag'" option at bottom)
- Recently used tags shown when input is focused but empty
Validation
- Prevent duplicate tags (highlight existing one briefly)
- Character/length limits per tag
- Invalid tag format feedback
- Max tags limit with message