Classic
ToolbarUI-driven WYSIWYG
A familiar rich text editor with a static toolbar. Bold, italic, headings, lists, tables, links, images, and colors, all wired to a single ToolbarUI preset or your own custom toolbar slot.
PrimeUI
TextEditor.
ProseMirror-based rich text editor for Vue. Classic toolbar, Notion-style blocks, markdown, and a fully template-driven UI.
Loading editor…
A real, editable rich text editor running in the page. Switch tabs to explore classic, block, markdown, and headless modes, each backed by the same ProseMirror engine.
Modes
Four modes. One engine.
Choose the editing experience that fits your product. Classic toolbar, Notion-style blocks, raw markdown, or a fully headless canvas you template from scratch. All modes share the same ProseMirror core.
Block
Notion-style blocks
Every paragraph is a draggable, convertible block. Slash commands, block controls, context toolbar, and a block menu for converting between headings, lists, quotes, and code.
Markdown
Write in markdown
Type markdown syntax and see it render in real time. Headings with #, bold with **, lists with -, code with backticks. The editor converts markdown to rich text as you type.
Headless
Template everything
Zero default UI. Build your own toolbar, menus, and overlays from scratch using slot props that expose every command and every state flag the engine tracks.
Formatting
Rich text, fully controlled.
Every formatting command is a function you call, and every active state is a boolean you read. Wire them to your own buttons, keyboard shortcuts, or AI agents.
Inline Formats
Bold, italic, and beyond
Bold, italic, underline, strikethrough, code, subscript, superscript. Each format has a command and a reactive state flag for active/inactive UI.
Headings
Six levels of hierarchy
H1 through H6 with a single command. The heading navigator slot shows a document outline and lets you jump to any section.
Colors & Fonts
Foreground, background, family, size
Set text color, highlight color, font family, and font size with toolbar presets or your own color picker. All values round-trip through HTML.
Text Align
Left, center, right, justify
Paragraph-level alignment with a single command. Alignment state is reactive and surfaces to your toolbar for active indicators.
Content
Beyond plain text.
Insert structured content. Tables with merge and resize, linked images with upload progress, @mentions with autocomplete, and documents with inline previews.
Tables
Insert, merge, resize
Full table management with column/row/cell options. Merge cells, resize columns, insert rows, and style headers through slot-driven option menus.
Images
Upload, drag, paste
Drag-and-drop or paste images with real-time upload progress. Constrain file types and sizes. Insert by URL or from a file picker.
Links
Insert and manage
Create links from selected text or paste a URL. The link command handles both insertion and editing with a single interface.
Mentions
@mention with autocomplete
Type @ to trigger a filterable autocomplete list. The mention slot receives filter text and a command to insert. Wire it to your user list.
Lists
Bullet, ordered, checklist
Three list types with nesting, indentation, and tab/shift-tab navigation. Checklists render interactive checkboxes inline.
Documents
Embed PDF, Office, text
Upload documents with progress tracking and render inline link previews. Constrain file types and sizes with props.
Block Editing
Blocks are first-class.
In block mode, every paragraph is an independent node you can drag, duplicate, delete, and convert. The slash command palette and block menu make structural editing fast.
Slash Commands
Type / to insert
A filterable command palette triggered by /. Insert headings, lists, quotes, code blocks, tables, images, and documents without leaving the keyboard.
Block Controls
Drag, duplicate, delete
A floating handle appears on hover. Drag to reorder, click for a block menu with duplicate, delete, and turn-into options.
Context ToolbarUI
Format inline selections
A floating toolbar appears when you select text. Bold, italic, link, code, and turn-into, all scoped to the current selection with no static toolbar in the way.
Block Menu
Convert block type
Change any block from paragraph to heading, list, quote, or code block. The menu shows available conversions with icons and keyboard shortcuts.
Architecture
Headless by design.
A ProseMirror-based core with zero framework dependencies, wrapped by a thin Vue bridge. Every visual surface is a slot you control.
Headless Core
Logic without the look
All editing logic, schema, commands, and state derivation live in @primeui/texteditor-core. A plain-TS package built on ProseMirror with zero UI opinions.
Slots
Replace any surface
ToolbarUI, context toolbar, slash menu, block menu, mention list, table options, image upload, navigator. Every overlay and control surface is a scoped slot.
Plugin System
Extend with custom logic
Define custom plugins with defineTextEditorPlugin. Access selected text, replace content, add commands, and hook into the editor lifecycle. AI, translate, and code highlight are all built as plugins.
Customization
Looks like your product.
Ship with the PrimeOne preset for a polished default, or go fully headless. Theme tokens, CSS variables, and slot-driven UI give you complete control.
ToolbarUI Presets
ToolbarUI, ContextToolbarUI
Pre-built toolbar components with sensible defaults. Drop them in and override individual buttons, or use them as a starting point for your own.
Theme Tokens
CSS variables, top to bottom
Every color, radius, font size, and spacing value flows through CSS custom properties. Override tokens to match your design system, no build step required.
Undo & Redo
History built in
Ctrl+Z and Ctrl+Shift+Z work out of the box. The history plugin tracks every formatting change, content insertion, and structural edit.
Print
Print-ready output
A print command renders the editor content in a clean, print-optimized format. Wire it to a toolbar button or trigger it programmatically.
Ready to wire it in?
Drop the package into your Vue project, import the styles, and have a fully functional rich text editor in under five minutes.
