Mention Input
Buttons
Text input that shows an animated dropdown when typing @, with user filtering, keyboard navigation, avatar display, and AnimatePresence transitions.
Loading preview...
Customize
Placeholder
Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Current input value. |
onChange | (value: string) => void | — | Callback when value changes. |
users | { id: string; name: string; avatar?: string }[] | — | Array of mentionable users. |
placeholder | string | 'Type @ to mention someone...' | Placeholder text. |
className | string | '' | Additional CSS classes. |