/
367
Sponsor

Introduction

Next

Rich text editor components for React, built on Tiptap and shadcn/ui. A toolbar editor and a Notion-style block editor you install with the shadcn CLI.

Rich text editor components built on Tiptap for the shadcn/ui ecosystem.

Packages

This monorepo provides two editor packages:

@editorcn/editor

A toolbar-style rich text editor with a compound component API. Perfect for traditional editing experiences with a top toolbar.

  • RichTextEditor — root component with toolbar and content area
  • RichTextEditor.Toolbar — sticky toolbar with control groups
  • 20+ built-in toolbar controls (Bold, H1, Link, Undo, etc.)

View docs →

@editorcn/block-editor

A Notion-style block-type rich text editor. Ideal for modern, block-based writing experiences.

  • BlockEditor — block-type editor with slash commands and drag handles
  • Slash command menu (type / to insert blocks)
  • Bubble menu for inline formatting
  • Block-level actions (duplicate, delete, reorder)
  • Built-in image and table blocks

View docs →

Which one should I use?

You want...Use
A traditional toolbar editor (WordPress, Medium-style)@editorcn/editor
A block-based editor (Notion, Linear-style)@editorcn/block-editor
Both in the same appInstall both packages

Common Features

Both editors share:

  • Built with shadcn/ui design tokens and CSS variables
  • Full TypeScript support
  • Extensible via Tiptap extensions
  • Lightweight and modular