HN Showcase
Back to browse
Prompt Area – Rich text input for AI chat UIs (Shadcn, zero deps)

Prompt Area – Rich text input for AI chat UIs (Shadcn, zero deps)

by kachar·Mar 12, 2026·1 point·0 comments
Visit ProjectView on HN

AI Analysis

●MidSlickCozy

Shadcn registry component for chat inputs when Tiptap and Lexical are overkill.

Strengths
  • •Segment-based engine file is testable without a DOM environment.
  • •Zero dependencies beyond React and existing Tailwind/shadcn setup.
  • •Imperative handle methods (focus, insertChip, getChipsByTrigger) for programmatic control.
Weaknesses
  • •Rich text chat inputs already solved by Tiptap, Lexical, Plate.
  • •Component-only — no backend integration or message handling.
Target Audience

Frontend developers building AI chat interfaces

Similar To

Tiptap · Lexical · Plate

Post Description

Hi HN,

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.

Similar Projects