Mentions that
just work
A headless React hook for inline suggestions.
@mentions, #tags, /commands — from one tiny primitive.
A headless React hook for inline suggestions.
@mentions, #tags, /commands — from one tiny primitive.
import { Mentions } from "@skyastrall/mentions-react"
<Mentions
triggers={[{ char: "@", data: users }]}
onChange={(markup, plainText) => save(markup)}
/> @ for users, # for tags, / for commands — each with its own data source, color, and config.
Drop-in component, compound components, or headless hook. Pick your level of control.
Dimmed inline AI completions. Tab to accept. Wire up any LLM in 5 lines of code.
Core is 5KB, React adapter is 7KB. Zero runtime dependencies. No bloat.
Async data with context — textBefore, textAfter, activeMentions. Built for LLM suggestions.
WAI-ARIA combobox pattern. Full keyboard navigation. Screen reader support.