QuireKit Core — 一个内核，不止于 DOM

QUIREKIT / CORE为文档而生的编辑器框架ALPHA · MIT CORE

这句标题就是编辑器。点一下，写成你的。

一个内核，

不止于 DOM。

四种 View，一套文档引擎。自主掌握输入、选区与分页，从熟悉的富文本，走向 Word 兼容文档。

4DOM / HTML / Canvas / SVG

PROSEMIRROR 内核 · TIPTAP 风格扩展

01 / FOUR VIEWS. ONE CORE.

同一份文档。
四种编辑现场。

从 PM / Tiptap 的原生编辑体验出发，逐步掌握输入、选区、排版与渲染。在下面写点什么，再切换 View。文档、选区与撤销历史，始终留在同一个 Editor。

了解四种 View 的分工 ↗

DOM · HTML · Canvas · SVG

这里运行的是通用文档。Word 模型与分页规则由对应扩展提供；依赖 DOM 的第三方插件，需要适配 Canvas / SVG 的视图能力。

02 / INPUT IS PART OF THE ENGINE

画出文字之后，
还要让输入成立。

离开 contenteditable，就要重新解决输入法。QuireKit 为 Canvas、SVG 与 HTML 连续流提供 IME 运行时，处理预编辑、候选窗定位与合成提交。

IME / COMPOSITION交互式原理演示

下一个想法：中文编辑

屏幕上的文字临时排版预览

正式文档下一个想法：

History保持不变

EVENTcompositionupdate

图解说明合成生命周期，不模拟系统候选窗。上方真实 View 可直接使用你的输入法；具体系统与移动键盘仍需按目标环境验证。

在真实 View 中试一试 ↑

03 / SELECTION YOU CAN BUILD ON

焦点可以离开，
选区始终在场。

工具栏、侧栏、弹窗，都需要接管焦点。HTML 连续流使用浏览器几何与 SVG 高亮层，让选区继续留在正文里，等待下一步操作。

理解规范选区与显示几何 ↗

Selection → SVG → Action

01 / STATE

一个编辑目标

选中了什么，由文档状态决定；操作控件接管焦点后，命令仍有明确目标。

02 / GEOMETRY

高亮跟着文字走

DOM 测量文字位置，SVG 绘制选区。正文与交互高亮各有清晰的职责。

03 / INTEGRATION

为产品界面留出空间

把编辑器接入格式面板和业务界面，不必把失去焦点当作取消选择。

04 / WHY QUIREKIT, ALONGSIDE TIPTAP?

相同的起点。
更深的掌控。

QuireKit 扩展自 Tiptap Core，保留 ProseMirror 编辑语义。DOM 场景站在相同的原生基础上；真正拉开差异的，是 HTML 的自主交互，以及 Canvas / SVG 背后的文档引擎。

左右滑动，对照两种路径 →

你要解决的问题	Tiptap	QuireKit CORE + VIEWS
原生 DOM 编辑	ProseMirror 原生 View：浏览器排版、原生输入与选区，以及 DOM NodeView。	相同的原生 View 基础。这是熟悉的起点；同一个 Core 还可以继续切换到其他 View。
HTML，自主交互	原生 DOM 编辑器使用浏览器与 ProseMirror 的输入、选区机制，通过扩展定制行为。	保留浏览器 CSS 排版，QuireKit 接管 IME 合成、自绘光标、SVG 选区与焦点交接。
Canvas / SVG 编辑	标准编辑架构以 ProseMirror 的 DOM View 为基础。	自主构建排版与渲染底层。统一排版 API 驱动像素或矢量输出，配套完整的输入与交互运行时。
分页与复杂表格	Pages 已提供分页、页眉页脚与分页符，Conversion 支持 DOCX 工作流。	递归容器分页、长单元格续排、重复表头、跨页合并单元格。文档 profile 注入 Word 语义。
扩展与迁移	Tiptap 扩展生态、DOM NodeView 与熟悉的命令接口。	延续 Node / Mark / Extension 写法；统一 @quirekit 包身份，为自绘视图补充布局与选区适配。
许可与产品	开源编辑器，以及单独提供的 Pro 产品和服务。	Core 与通用扩展为 MIT；View、Word 与产品包分别采用各自许可。

这些需求，值得选择 QuireKit

底层难题已有引擎承接，产品能力由你定义。

你需要 HTML 的自主输入与选区，或要做 Canvas / SVG、复杂分页和 Word 兼容文档。统一排版、递归分页与交互运行时，已经成为你可以继续构建的基础。

这些场景，Tiptap 已经适合

产品以 DOM 富文本为主，现有生态已经满足需求。

迁移需要具体收益。Tiptap 也有分页、DOCX 转换与 AI 工具，仅凭这些功能名称不足以构成选择理由。

架构与集成路径对比，核对于 2026-10-22。参考： Tiptap Editor · Pages · Conversion · AI Toolkit

查看迁移方式与兼容边界 ↗

05 / BUILT BELOW THE SURFACE

深入富文本之下，
构建文档引擎的底座。

Canvas 与 SVG 背后，是自主构建的排版、分页与渲染基础设施。统一的布局契约，层层递归的分页能力，细致到单元格的跨页处理——这些，才是支撑 Word 兼容的基石。

RECURSIVE PAGINATION01 → 02

Document
Table
Cell
Content

QUIREKIT / LAYOUT

页有边界。

ABC

QUIREKIT / CONTINUATION

内容无间。

ABC

重复表头单元格续排

分页架构示意 · 同一份几何 → Canvas / SVG

01 / 统一排版 API

定义一次，贯穿排版与绘制。 ↗

扩展通过统一契约接入布局。Canvas 与 SVG 消费同一份几何，绘制、命中、光标与选区由此保持一致。

02 / 递归分页引擎

从整页，深入每一个容器。 ↗

页面、表格、单元格、段落逐层组合。内容容器复用递归分页能力，带着续排状态进入下一页，让复杂文档结构也能自然跨页。

03 / 表格跨页

页面结束，表格继续。 ↗

长单元格续排、重复表头、跨页合并单元格。内容、边框与交互几何跟随同一份分页结果，让复杂表格成为可编辑的文档。

THE WORD FOUNDATION

引擎掌握排版，文档 profile 提供页面、分节、段落与表格语义。Classic 将这些能力装配成 Word 兼容的文档产品。

了解 Word 模型 ↗

EXTENSIONS THAT EXPLAIN THEMSELVES

业务能力，也能进入 AI 的文档工具。

扩展声明可读能力，为可执行命令提供描述。AI 核心统一管理 document_read 与 document_edit，产品接入所需模型与服务。

了解 AI 的实际装配 ↗

Extension

addAiCapabilities()defineCommand()

↓document_read + document_edit

06 / 从这里写起

熟悉的扩展写法，更多可掌握的能力。

延续 Node、Mark、Extension 的开发经验。内容需要走向 Canvas / SVG 时，再为它补充布局、绘制与选区适配。

editor.tsTypeScript

1import { Editor } from '@quirekit/core'2import { StarterKit } from '@quirekit/starter-kit'3import { DomViewExtension } from '@quirekit/dom-view'4 5const editor = new Editor({6  element: document.getElementById('editor'),7  mode: 'dom',8  extensions: [StarterKit, DomViewExtension],9  content: '<p>Hello, QuireKit.</p>',10})