One core. Beyond the DOM.
One core.
Beyond the DOM.
Four views. One document engine. Take control of input, selection and pagination, from familiar rich text to Word-compatible documents.
DOM / HTML / Canvas / SVG01 / FOUR VIEWS. ONE CORE.
Change the view.
Keep everything else.
Start with native PM / Tiptap editing. Take control of interaction in HTML, then layout and rendering in Canvas or SVG. Edit below and switch views: the document, selection and history stay in one Editor.
Explore the view architecture ↗This is a live general-purpose document. Word models and pagination rules are supplied by their own extensions. DOM-specific plugins need view adapters to work on Canvas and SVG.
02 / INPUT IS PART OF THE ENGINE
Every idea starts
before the commit.
Moving beyond contenteditable means owning composition too. QuireKit brings an IME runtime to Canvas, SVG and retained HTML, including preedit, candidate anchoring and commit handling.
The next idea: unchangedcompositionupdateThe diagram explains the lifecycle; it does not simulate an OS candidate window. Try your actual input method in the live views above. Platform and mobile keyboard behavior still needs validation for your target environment.
Try the real runtime ↑03 / SELECTION YOU CAN BUILD ON
Focus can move.
Your selection stays.
A toolbar, a sidebar, a dialog: your interface needs somewhere to work. Retained HTML uses browser geometry with an SVG selection layer, so highlighting can stay while focus moves to your controls.
Selection belongs to the document state ↗One editing target
Commands act on the canonical selection, even when another control owns focus.
A measured highlight
DOM geometry becomes SVG rectangles. The content and the selection have separate owners.
Room for your interface
Build formatting panels around the editor without treating lost focus as a lost selection.
04 / WHY QUIREKIT, ALONGSIDE TIPTAP?
A familiar starting point.
Deeper control.
QuireKit extends Tiptap Core and preserves ProseMirror semantics. In native DOM editing, the foundations align. The difference begins when your product needs to own interaction, page layout and rendering.
Swipe to compare both approaches →
| What you need | Tiptap | QuireKit CORE + VIEWS |
|---|---|---|
| Native DOM editing | ProseMirror’s native View: browser layout, native input and selection, and DOM NodeViews. | The same native View foundation. A familiar baseline, with the option to change to other views on one Core. |
| HTML, with owned interaction | The native DOM editor uses browser and ProseMirror input and selection; extensions customize behavior. | Retained HTML with browser CSS layout, but QuireKit owns IME composition, the caret, SVG selection and focus handoff. |
| Canvas / SVG editing | Its standard editing architecture is based on ProseMirror’s DOM View. | Purpose-built layout and rendering infrastructure. A unified layout API drives pixel or vector output, with its own input and interaction runtime. |
| Pagination & complex tables | Pages provides pagination, headers, footers and page breaks; Conversion supports DOCX workflows. | Recursive container pagination, long-cell continuation, repeated headers and cross-page merged cells. Document profiles supply Word semantics. |
| Extensions & migration | A broad Tiptap ecosystem, DOM NodeViews and familiar commands. | Familiar Node / Mark / Extension APIs. Unify @quirekit package identity; add layout and selection adapters for self-rendered views. |
| Licensing | Open-source editor plus separately offered Pro products and services. | MIT Core and common extensions; View and Word/product packages have separate licenses. |
Build on the engine. Focus on your product.
Own HTML interaction or build Canvas/SVG document products on shared layout, pagination and input infrastructure. Your team can build on that foundation.
Your product lives in the DOM and its ecosystem fits your needs.
A switch needs a concrete reason. Tiptap also has pagination, DOCX conversion and AI tooling; those labels alone are not a differentiator.
Architecture comparison checked 2026-10-22. References: Tiptap Editor · Pages · Conversion · AI Toolkit
Read the migration boundaries ↗05 / BUILT BELOW THE SURFACE
Beyond rich text.
A document engine of your own.
Canvas and SVG are backed by purpose-built layout, pagination and rendering infrastructure. Together with document profiles for page and section rules, this is the foundation for Word-compatible editing.
- Document
- Table
- Cell
- Content
The page ends.
The flow goes on.
Define once. Lay out across views. ↗
Extensions supply layout through a common contract. Canvas and SVG consume shared geometry for rendering, hit testing, carets and selection.
02 / Recursive paginationFrom a page down to its smallest container. ↗
Content flows through a hierarchy of pages, tables, cells and paragraphs. Containers compose with the shared pagination engine and carry continuation state onto the next page.
03 / Table paginationA page ends. The table continues. ↗
Long cells continue, headers repeat, and merged cells span pages. Content, borders and interaction geometry follow the same page fragments.
The engine owns layout. Document profiles supply page, section, paragraph and table semantics. Classic brings these layers together as a Word-compatible product.
Explore the Word model ↗Business capabilities. Ready for document tools.
Extensions declare readable capabilities and describe executable commands. The AI core owns the document_read and document_edit contracts; your product supplies its model and service integration.
Explore the AI integration ↗addAiCapabilities()defineCommand()06 / YOUR NEXT COMMIT
Familiar by design.Yours to extend.
Keep the Node, Mark and Extension concepts you know. Add layout and selection adapters when your content needs to work beyond the DOM.
import { Editor } from '@quirekit/core'import { StarterKit } from '@quirekit/starter-kit'import { DomViewExtension } from '@quirekit/dom-view' const editor = new Editor({ element: document.getElementById('editor'), mode: 'dom', extensions: [StarterKit, DomViewExtension], content: '<p>Hello, QuireKit.</p>',})pnpm add @quirekit/core @quirekit/starter-kit @quirekit/dom-viewBuild your first editor ↗07 / MAKE IT YOURS
A starting point for every ambition.
Start with the core, add a capability, or bring a complete editor into your application.
Build from the foundations.
Follow the document model, lifecycle and typed commands. Go from your first editor to a complete workspace.
Read the documentationMake room for your ideas.
Add text formatting, structured content and document capabilities. Try the live examples and take the integration source.
Explore pluginsStart with a complete product.
A paginated workspace, a ribbon and optional Word capabilities. Integration, configuration and licensing in one place.
Meet ClassicBUILT WITH QUIREKIT. BUILT BY YOU.
Your next editor starts here.
Core and common extensions are MIT. View, product and Word packages have their own licenses.