Building chat, search, or agent-control interfaces means shipping your own composer every time: drag-drop file attachment, slash-command palette, mention picker, live token budget, and the right keyboard semantics (Cmd/Ctrl+Enter to send). Without it, you end up with four separate implementations drifting across codebases, each missing edge cases like picker-escape-closes-picker or textarea-height-jumps.

PromptInput is a controlled textarea with four built-in interactions: typing / triggers a command picker (↑/↓ to navigate, Enter to insert); @ triggers a mention picker filtered against a supplied mention list; drag-dropping files anywhere attaches them as chips; and Cmd/Ctrl+Enter submits both text and attachments to an onSubmit callback. The token budget meter (configurable budgetTokens and charsPerToken) tracks headroom with color feedback. An optional aboveInput slot lets you stack a drawer or toolbar inside the same rounded shell.

Import from @particle-academy/react-fancy, wire <PromptInput budgetTokens={32000} commands={[{ name: "/rewrite", hint: "rewrite the selection" }]} mentions={[{ id: "ada", name: "Ada", kind: "person" }]} onSubmit={(text, attachments) => send(text, attachments)} />, and you are done. The component owns picker state and file list; call the callback when the user hits send. No MCP bridge yet, but stable attachment IDs and a clear text/attachment shape make future agent control straightforward.