I built Prompt Area — a contentEditable rich text input component for React, designed specifically for AI chat interfaces.
The problem: if you're building an AI chat UI, your input needs @mentions (to reference context), /commands (to trigger actions), #tags, inline markdown, file attachments, and undo/redo. Existing options are either too limited (react-mentions only does mentions) or massive overkill (Tiptap, Lexical, and Plate are full document editors built on ProseMirror/Slate — way too heavy for a prompt input).
Prompt Area sits in the middle. It uses a segment-based model (array of {type, text} objects) on top of contentEditable, with all logic extracted into a pure engine file that's testable without a DOM. Zero dependencies beyond React and your existing Tailwind/shadcn setup.
Features: trigger-based chips (@, /, # or any character), immutable chip pills, live inline markdown preview, auto-growing textarea, full undo/redo history, copy/paste with chip preservation, IME support for CJK input, ARIA accessibility, dark mode, and file/image attachments.
Install in one command:
`npx shadcn@latest add https://prompt-area.com/r/prompt-area.json`
Demo & docs: https://prompt-area.com GitHub: https://github.com/team-gpt/prompt-area
Would love feedback from anyone building AI/LLM interfaces.