RichText

Trình soạn thảo TipTap kèm toolbar dựng sẵn: 7 nhóm nút (định dạng, tiêu đề, danh sách, căn lề, liên kết, lịch sử, media), đọc/ghi HTML, chèn ảnh theo URL hoặc upload qua onImageUpload, nhúng YouTube. Chỉ cài khi cần — TipTap không lọt vào dự án không dùng.

Cài đặt

npx shadcn@latest add @reno/rich-text

Demo

HTML

<h2>Khoá học React nâng cao</h2>
<p>Khai giảng <strong>12/09</strong>. Còn <em>8 chỗ</em>, xem <a href="/dang-ky">trang đăng ký</a>.</p>
<ul><li>Server Components</li><li>Suspense và streaming</li></ul>
<blockquote>Học xong là làm được, không phải học xong là biết.</blockquote>

npm dependencies

@tiptap/react@^3.31.0
@tiptap/core@^3.31.0
@tiptap/pm@^3.31.0
@tiptap/starter-kit@^3.31.0
@tiptap/extension-image@^3.31.0
@tiptap/extension-text-align@^3.31.0
@tiptap/extension-youtube@^3.31.0
lucide-react@^1.38.0

Registry dependencies

@reno/utils
@reno/button
@reno/dialog
@reno/input
@reno/label
@reno/separator
@reno/spinner
@reno/tabs
@reno/toggle-group
@reno/rich-text-value