From 8cbfbd71d17644e7f940d27859f8a6ac583f54e8 Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Wed, 4 May 2022 00:52:33 +0800
Subject: [PATCH 1/2] refactor: improve tiptap

---
 packages/client/package.json                  |   1 +
 .../src/components/data-render/index.tsx      |   5 +-
 .../src/components/data-render/loading.tsx    |  19 +-
 .../components/document/comments/index.tsx    |   5 +-
 .../src/components/document/editor/editor.tsx | 219 +++---------------
 .../document/editor/index.module.scss         |  61 ++---
 .../src/components/document/editor/index.tsx  |   7 +-
 .../src/components/document/reader/editor.tsx | 117 ----------
 .../src/components/document/reader/index.tsx  | 124 +++++++---
 .../document/reader/public/content.tsx        |  34 ---
 .../document/reader/public/index.tsx          |  25 +-
 .../src/components/document/reader/user.tsx   |  48 ----
 .../src/components/document/version/index.tsx |   4 +-
 .../src/components/template/editor/editor.tsx |  78 +------
 .../template/editor/index.module.scss         |  63 ++---
 .../components/template/editor/useEditor.tsx  |  35 ---
 .../src/components/template/reader/editor.tsx |  79 -------
 .../template/reader/index.module.scss         |  32 ---
 .../src/components/template/reader/index.tsx  |  10 +-
 .../client/src/components/wiki/tocs/tree.tsx  |   2 +-
 packages/client/src/data/comment.ts           |   4 +-
 packages/client/src/data/document.ts          |  12 +-
 packages/client/src/data/template.ts          |   4 +-
 packages/client/src/data/wiki.tsx             |  14 +-
 packages/client/src/pages/_app.tsx            |   3 +-
 .../client/src/pages/feature/editor/index.tsx |  29 +++
 packages/client/src/styles/reset.scss         |  37 ---
 .../color-picker/index.tsx                    |   0
 .../color-picker/style.module.scss            |   0
 .../src/tiptap/{ => components}/divider.tsx   |   0
 .../_components => components}/size.tsx       |   0
 .../src/tiptap/{ => components}/skeleton.tsx  |   0
 .../client/src/tiptap/{ => core}/constants.ts |   0
 .../{ => core}/extensions/attachment.ts       |   2 +-
 .../{ => core}/extensions/background-color.ts |   0
 .../{ => core}/extensions/blockquote.ts       |   3 +-
 .../src/tiptap/{ => core}/extensions/bold.ts  |   0
 .../{ => core}/extensions/bullet-list.ts      |   2 +-
 .../tiptap/{ => core}/extensions/callout.ts   |   2 +-
 .../{ => core}/extensions/code-block.ts       |   2 +-
 .../src/tiptap/{ => core}/extensions/code.ts  |   2 +-
 .../cursor-plugin/index.ts                    |   0
 .../extensions/collaboration-cursor/index.ts  |   0
 .../extensions/collaboration/collaboration.ts |   0
 .../collaboration/helpers/is-change-origin.ts |   0
 .../extensions/collaboration/index.ts         |   0
 .../extensions/color-highlighter.ts           |   0
 .../src/tiptap/{ => core}/extensions/color.ts |   0
 .../tiptap/{ => core}/extensions/countdown.ts |   2 +-
 .../extensions/document-children.ts           |   2 +-
 .../extensions/document-reference.ts          |   2 +-
 .../tiptap/{ => core}/extensions/document.ts  |   0
 .../{ => core}/extensions/dropcursor.ts       |   0
 .../src/tiptap/{ => core}/extensions/emoji.ts |   6 +-
 .../tiptap/core/extensions/event-emitter.ts   |  19 ++
 .../src/tiptap/{ => core}/extensions/focus.ts |   0
 .../tiptap/{ => core}/extensions/font-size.ts |   0
 .../tiptap/{ => core}/extensions/gapcursor.ts |   0
 .../{ => core}/extensions/hard-break.ts       |   0
 .../tiptap/{ => core}/extensions/heading.ts   |   0
 .../{ => core}/extensions/horizontal-rule.ts  |   0
 .../{ => core}/extensions/html-marks.ts       |   2 +-
 .../tiptap/{ => core}/extensions/iframe.ts    |   2 +-
 .../src/tiptap/{ => core}/extensions/image.ts |   2 +-
 .../tiptap/{ => core}/extensions/indent.ts    |   0
 .../tiptap/{ => core}/extensions/italic.ts    |   0
 .../src/tiptap/{ => core}/extensions/katex.ts |   2 +-
 .../src/tiptap/{ => core}/extensions/link.ts  |   0
 .../tiptap/{ => core}/extensions/listItem.ts  |   0
 .../tiptap/{ => core}/extensions/loading.ts   |   2 +-
 .../tiptap/{ => core}/extensions/mention.ts   |   2 +-
 .../src/tiptap/{ => core}/extensions/mind.ts  |   2 +-
 .../{ => core}/extensions/ordered-list.ts     |   2 +-
 .../tiptap/{ => core}/extensions/paragraph.ts |   0
 .../src/tiptap/{ => core}/extensions/paste.ts |  59 +++--
 .../{ => core}/extensions/placeholder.ts      |   0
 .../{ => core}/extensions/quick-insert.tsx    |   6 +-
 .../tiptap/{ => core}/extensions/search.ts    |   0
 .../tiptap/{ => core}/extensions/selection.ts |   2 +-
 .../tiptap/{ => core}/extensions/status.ts    |   2 +-
 .../tiptap/{ => core}/extensions/strike.ts    |   0
 .../tiptap/{ => core}/extensions/subscript.ts |   0
 .../{ => core}/extensions/superscript.ts      |   0
 .../{ => core}/extensions/table-cell.tsx      |   0
 .../{ => core}/extensions/table-header.tsx    |   0
 .../tiptap/{ => core}/extensions/table-row.ts |   0
 .../src/tiptap/{ => core}/extensions/table.ts |   0
 .../tiptap/{ => core}/extensions/task-item.ts |   2 +-
 .../tiptap/{ => core}/extensions/task-list.ts |   2 +-
 .../{ => core}/extensions/text-align.ts       |   0
 .../{ => core}/extensions/text-style.ts       |   0
 .../src/tiptap/{ => core}/extensions/text.ts  |   0
 .../tiptap/{ => core}/extensions/title.tsx    |   0
 .../{ => core}/extensions/trailing-node.ts    |   0
 .../tiptap/{ => core}/extensions/underline.ts |   0
 .../src/tiptap/{ => core}/styles/base.scss    |   0
 .../src/tiptap/{ => core}/styles/code.scss    |   0
 .../{ => core}/styles/collaboration.scss      |   0
 .../src/tiptap/{ => core}/styles/color.scss   |   0
 .../src/tiptap/{ => core}/styles/heading.scss |   0
 .../src/tiptap/{ => core}/styles/index.scss   |   0
 .../src/tiptap/{ => core}/styles/katex.scss   |   0
 .../src/tiptap/{ => core}/styles/list.scss    |   0
 .../src/tiptap/{ => core}/styles/lock.scss    |   0
 .../src/tiptap/{ => core}/styles/mention.scss |   0
 .../src/tiptap/{ => core}/styles/menu.scss    |   0
 .../{ => core}/styles/mind/context-menu.scss  |   0
 .../tiptap/{ => core}/styles/mind/index.scss  |   0
 .../tiptap/{ => core}/styles/mind/mind.scss   |   0
 .../{ => core}/styles/mind/mobile-menu.scss   |   0
 .../{ => core}/styles/mind/node-menu.scss     |   0
 .../{ => core}/styles/mind/toolbar.scss       |   0
 .../src/tiptap/{ => core}/styles/node.scss    |   0
 .../tiptap/{ => core}/styles/placeholder.scss |   0
 .../src/tiptap/{ => core}/styles/search.scss  |   0
 .../tiptap/{ => core}/styles/selection.scss   |   0
 .../src/tiptap/{ => core}/styles/table.scss   |   2 +
 .../src/tiptap/{ => core}/styles/title.scss   |   0
 .../src/tiptap/{ => core}/styles/var.scss     |   0
 .../wrappers/attachment/file-icon.tsx         |   0
 .../wrappers/attachment/index.module.scss     |   0
 .../{ => core}/wrappers/attachment/index.tsx  |   0
 .../attachment/player/index.module.scss       |   0
 .../wrappers/attachment/player/index.tsx      |   0
 .../player/pdf-player/index.module.scss       |   0
 .../attachment/player/pdf-player/index.tsx    |   0
 .../wrappers/callout/index.module.scss        |   0
 .../{ => core}/wrappers/callout/index.tsx     |   0
 .../wrappers/code-block/index.module.scss     |   0
 .../{ => core}/wrappers/code-block/index.tsx  |   0
 .../wrappers/countdown/index.module.scss      |   0
 .../{ => core}/wrappers/countdown/index.tsx   |   0
 .../document-children/index.module.scss       |   0
 .../wrappers/document-children/index.tsx      |   0
 .../document-reference/index.module.scss      |   0
 .../wrappers/document-reference/index.tsx     |   0
 .../{ => core}/wrappers/emoji-list/emojis.ts  |   0
 .../wrappers/emoji-list/index.module.scss     |   0
 .../{ => core}/wrappers/emoji-list/index.tsx  |   0
 .../wrappers/iframe/index.module.scss         |   0
 .../{ => core}/wrappers/iframe/index.tsx      |   0
 .../wrappers/image/index.module.scss          |   0
 .../{ => core}/wrappers/image/index.tsx       |   0
 .../wrappers/katex/index.module.scss          |   0
 .../{ => core}/wrappers/katex/index.tsx       |   0
 .../tiptap/{ => core}/wrappers/loading.tsx    |   0
 .../wrappers/mention-list/index.module.scss   |   0
 .../wrappers/mention-list/index.tsx           |   0
 .../wrappers/menu-list/index.module.scss      |   0
 .../{ => core}/wrappers/menu-list/index.tsx   |   0
 .../wrappers/mind/index.module.scss           |   0
 .../tiptap/{ => core}/wrappers/mind/index.tsx |   2 +-
 .../wrappers/mind/mind-elixir/const.ts        |   0
 .../wrappers/mind/mind-elixir/customLink.ts   |   0
 .../wrappers/mind/mind-elixir/i18n.ts         |   0
 .../mind/mind-elixir/iconfont/iconfont.js     |  61 +++++
 .../wrappers/mind/mind-elixir/index.ts        |   2 +-
 .../wrappers/mind/mind-elixir/interact.ts     |   0
 .../wrappers/mind/mind-elixir/linkDiv.ts      |   0
 .../wrappers/mind/mind-elixir/mouse.ts        |   0
 .../mind/mind-elixir/nodeOperation.ts         |   0
 .../mind/mind-elixir/plugin/contextMenu.ts    |   0
 .../mind/mind-elixir/plugin/keypress.ts       |   0
 .../mind/mind-elixir/plugin/mobileMenu.ts     |   0
 .../mind/mind-elixir/plugin/nodeDraggable.ts  |   0
 .../mind/mind-elixir/plugin/nodeMenu.tsx      |   2 +-
 .../mind/mind-elixir/plugin/toolBar.tsx       |   2 +-
 .../wrappers/mind/mind-elixir/utils/dom.ts    |   2 +-
 .../wrappers/mind/mind-elixir/utils/index.ts  |   0
 .../wrappers/mind/mind-elixir/utils/pubsub.ts |   0
 .../wrappers/mind/mind-elixir/utils/svg.ts    |   0
 .../wrappers/status/index.module.scss         |   0
 .../{ => core}/wrappers/status/index.tsx      |   0
 .../wrappers/task-item/index.module.scss      |   0
 .../{ => core}/wrappers/task-item/index.tsx   |   0
 .../collaboration/collaboration/editor.tsx    | 115 +++++++++
 .../collaboration/index.module.scss           |  26 +++
 .../collaboration/collaboration/index.tsx     | 140 +++++++++++
 .../collaboration/collaboration/menubar.tsx   | 119 ++++++++++
 .../collaboration/collaboration/type.ts       |  48 ++++
 .../src/tiptap/editor/collaboration/index.tsx |   4 +
 .../src/tiptap/editor/collaboration/kit.ts    | 144 ++++++++++++
 .../tiptap/editor/collaboration/reader.tsx    |  27 +++
 .../client/src/tiptap/editor/comment/index.ts |   2 +
 .../client/src/tiptap/editor/comment/kit.ts   | 103 ++++++++
 .../src/tiptap/editor/comment/menubar.tsx     |  48 ++++
 .../tiptap/{ => editor}/hooks/use-active.tsx  |   0
 .../{ => editor}/hooks/use-attributes.tsx     |   0
 packages/client/src/tiptap/editor/index.tsx   |   3 +
 .../client/src/tiptap/editor/menus/_event.ts  |  34 +++
 .../tiptap/{ => editor}/menus/align/index.tsx |   6 +-
 .../{ => editor}/menus/attachment/bubble.tsx  |   6 +-
 .../{ => editor}/menus/attachment/index.tsx   |   2 +-
 .../menus/background-color/index.tsx          |  10 +-
 .../{ => editor}/menus/blockquote/index.tsx   |   8 +-
 .../tiptap/{ => editor}/menus/bold/index.tsx  |   8 +-
 .../{ => editor}/menus/bullet-list/index.tsx  |   8 +-
 .../menus/callout/bubble.module.scss          |   0
 .../{ => editor}/menus/callout/bubble.tsx     |   8 +-
 .../{ => editor}/menus/callout/index.tsx      |   2 +-
 .../menus/clear-node-and-marks/index.tsx      |   2 +-
 .../{ => editor}/menus/code-block/bubble.tsx  |   6 +-
 .../{ => editor}/menus/code-block/index.tsx   |   2 +-
 .../tiptap/{ => editor}/menus/code/index.tsx  |   8 +-
 .../{ => editor}/menus/countdown/bubble.tsx   |  12 +-
 .../{ => editor}/menus/countdown/index.tsx    |   2 +-
 .../{ => editor}/menus/countdown/modal.tsx    |  10 +-
 .../{ => editor}/menus/countdown/service.ts   |   2 +-
 .../menus/document-children/bubble.tsx        |   6 +-
 .../menus/document-children/index.tsx         |   2 +-
 .../menus/document-reference/bubble.tsx       |   6 +-
 .../menus/document-reference/index.tsx        |   2 +-
 .../tiptap/{ => editor}/menus/emoji/index.tsx |   2 +-
 .../{ => editor}/menus/fontsize/index.tsx     |   8 +-
 .../{ => editor}/menus/heading/index.tsx      |   6 +-
 .../menus/horizontal-rule/index.tsx           |   6 +-
 .../tiptap/{ => editor}/menus/ident/index.tsx |   6 +-
 .../{ => editor}/menus/iframe/bubble.tsx      |  10 +-
 .../{ => editor}/menus/iframe/index.tsx       |   2 +-
 .../{ => editor}/menus/image/bubble.tsx       |  10 +-
 .../tiptap/{ => editor}/menus/image/index.tsx |   2 +-
 .../{ => editor}/menus/insert/index.tsx       |   6 +-
 .../{ => editor}/menus/italic/index.tsx       |   8 +-
 .../tiptap/{ => editor}/menus/link/bubble.tsx |   8 +-
 .../tiptap/{ => editor}/menus/link/index.tsx  |   8 +-
 .../tiptap/{ => editor}/menus/link/modal.tsx  |   8 +-
 .../tiptap/{ => editor}/menus/link/service.ts |   4 +-
 .../tiptap/{ => editor}/menus/mind/bubble.tsx |  10 +-
 .../tiptap/{ => editor}/menus/mind/index.tsx  |   2 +-
 .../{ => editor}/menus/ordered-list/index.tsx |   8 +-
 .../{ => editor}/menus/quick-insert.tsx       |   2 +-
 .../tiptap/{ => editor}/menus/redo/index.tsx  |   2 +-
 .../{ => editor}/menus/search/index.tsx       |   4 +-
 .../{ => editor}/menus/strike/index.tsx       |   8 +-
 .../{ => editor}/menus/subscript/index.tsx    |   6 +-
 .../{ => editor}/menus/superscript/index.tsx  |   6 +-
 .../{ => editor}/menus/table/bubble.tsx       |   6 +-
 .../tiptap/{ => editor}/menus/table/index.tsx |   2 +-
 .../{ => editor}/menus/task-list/index.tsx    |   8 +-
 .../{ => editor}/menus/text-color/index.tsx   |  12 +-
 .../{ => editor}/menus/underline/index.tsx    |   6 +-
 .../tiptap/{ => editor}/menus/undo/index.tsx  |   2 +-
 .../client/src/tiptap/editor/react/index.tsx  |   4 +
 .../tiptap/{ => editor}/react/useEditor.tsx   |   8 +-
 .../views/bubble-menu/bubble-menu-plugin.tsx  |   1 -
 .../{ => editor}/views/bubble-menu/index.tsx  |   0
 .../tiptap/{ => editor}/views/float-menu.tsx  |   0
 .../tiptap/{index.ts => fix-match-nodes.ts}   |   8 -
 packages/client/src/tiptap/indexdb.ts         |  20 --
 .../html-to-prosemirror/all-kit.tsx           | 133 +++++++++++
 .../html-to-prosemirror/utils.ts              |   4 +-
 .../markdown-to-prosemirror/index.tsx         |   3 -
 .../markdown/prosemirror-to-markdown/index.ts |  77 +++---
 packages/client/src/tiptap/menubar.tsx        | 147 ------------
 packages/client/src/tiptap/menus/_event.ts    |  13 --
 .../src/tiptap/prose-utils/copy-node.ts       |   7 +-
 .../client/src/tiptap/prose-utils/index.ts    |   2 +
 .../markdown-source-map.ts                    |   0
 .../helpers.ts => prose-utils/markdown.ts}    |   2 +-
 .../client/src/tiptap/prose-utils/mention.ts  |   2 +-
 .../client/src/tiptap/prose-utils/upload.ts   |   6 +-
 packages/client/src/tiptap/provider.ts        |  64 -----
 packages/client/src/tiptap/react/index.tsx    |   4 -
 packages/client/src/tiptap/start-kit.tsx      | 198 ----------------
 .../mind/mind-elixir/iconfont/iconfont.js     |   1 -
 packages/client/tsconfig.json                 |   1 +
 .../src/services/collaboration.service.ts     |  37 +--
 .../src/services/document-version.service.ts  |   6 +-
 pnpm-lock.yaml                                |  10 +
 269 files changed, 1617 insertions(+), 1527 deletions(-)
 delete mode 100644 packages/client/src/components/document/reader/editor.tsx
 delete mode 100644 packages/client/src/components/document/reader/public/content.tsx
 delete mode 100644 packages/client/src/components/document/reader/user.tsx
 delete mode 100644 packages/client/src/components/template/editor/useEditor.tsx
 delete mode 100644 packages/client/src/components/template/reader/editor.tsx
 delete mode 100644 packages/client/src/components/template/reader/index.module.scss
 create mode 100644 packages/client/src/pages/feature/editor/index.tsx
 rename packages/client/src/tiptap/{menus/_components => components}/color-picker/index.tsx (100%)
 rename packages/client/src/tiptap/{menus/_components => components}/color-picker/style.module.scss (100%)
 rename packages/client/src/tiptap/{ => components}/divider.tsx (100%)
 rename packages/client/src/tiptap/{menus/_components => components}/size.tsx (100%)
 rename packages/client/src/tiptap/{ => components}/skeleton.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/constants.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/attachment.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/background-color.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/blockquote.ts (88%)
 rename packages/client/src/tiptap/{ => core}/extensions/bold.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/bullet-list.ts (84%)
 rename packages/client/src/tiptap/{ => core}/extensions/callout.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/code-block.ts (99%)
 rename packages/client/src/tiptap/{ => core}/extensions/code.ts (81%)
 rename packages/client/src/tiptap/{ => core}/extensions/collaboration-cursor/cursor-plugin/index.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/collaboration-cursor/index.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/collaboration/collaboration.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/collaboration/helpers/is-change-origin.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/collaboration/index.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/color-highlighter.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/color.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/countdown.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/document-children.ts (94%)
 rename packages/client/src/tiptap/{ => core}/extensions/document-reference.ts (95%)
 rename packages/client/src/tiptap/{ => core}/extensions/document.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/dropcursor.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/emoji.ts (94%)
 create mode 100644 packages/client/src/tiptap/core/extensions/event-emitter.ts
 rename packages/client/src/tiptap/{ => core}/extensions/focus.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/font-size.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/gapcursor.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/hard-break.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/heading.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/horizontal-rule.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/html-marks.ts (94%)
 rename packages/client/src/tiptap/{ => core}/extensions/iframe.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/image.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/indent.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/italic.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/katex.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/link.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/listItem.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/loading.ts (85%)
 rename packages/client/src/tiptap/{ => core}/extensions/mention.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/mind.ts (98%)
 rename packages/client/src/tiptap/{ => core}/extensions/ordered-list.ts (81%)
 rename packages/client/src/tiptap/{ => core}/extensions/paragraph.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/paste.ts (81%)
 rename packages/client/src/tiptap/{ => core}/extensions/placeholder.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/quick-insert.tsx (95%)
 rename packages/client/src/tiptap/{ => core}/extensions/search.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/selection.ts (98%)
 rename packages/client/src/tiptap/{ => core}/extensions/status.ts (96%)
 rename packages/client/src/tiptap/{ => core}/extensions/strike.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/subscript.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/superscript.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/table-cell.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/table-header.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/table-row.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/table.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/task-item.ts (98%)
 rename packages/client/src/tiptap/{ => core}/extensions/task-list.ts (79%)
 rename packages/client/src/tiptap/{ => core}/extensions/text-align.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/text-style.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/text.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/title.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/trailing-node.ts (100%)
 rename packages/client/src/tiptap/{ => core}/extensions/underline.ts (100%)
 rename packages/client/src/tiptap/{ => core}/styles/base.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/code.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/collaboration.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/color.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/heading.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/index.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/katex.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/list.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/lock.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mention.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/menu.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/context-menu.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/index.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/mind.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/mobile-menu.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/node-menu.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/mind/toolbar.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/node.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/placeholder.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/search.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/selection.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/table.scss (96%)
 rename packages/client/src/tiptap/{ => core}/styles/title.scss (100%)
 rename packages/client/src/tiptap/{ => core}/styles/var.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/file-icon.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/player/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/player/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/player/pdf-player/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/attachment/player/pdf-player/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/callout/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/callout/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/code-block/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/code-block/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/countdown/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/countdown/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/document-children/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/document-children/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/document-reference/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/document-reference/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/emoji-list/emojis.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/emoji-list/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/emoji-list/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/iframe/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/iframe/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/image/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/image/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/katex/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/katex/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/loading.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mention-list/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mention-list/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/menu-list/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/menu-list/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/index.tsx (98%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/const.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/customLink.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/i18n.ts (100%)
 create mode 100644 packages/client/src/tiptap/core/wrappers/mind/mind-elixir/iconfont/iconfont.js
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/index.ts (99%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/interact.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/linkDiv.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/mouse.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/nodeOperation.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/contextMenu.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/keypress.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/mobileMenu.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/nodeDraggable.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx (99%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/plugin/toolBar.tsx (98%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/utils/dom.ts (99%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/utils/index.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/utils/pubsub.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/mind/mind-elixir/utils/svg.ts (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/status/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/status/index.tsx (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/task-item/index.module.scss (100%)
 rename packages/client/src/tiptap/{ => core}/wrappers/task-item/index.tsx (100%)
 create mode 100644 packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx
 create mode 100644 packages/client/src/tiptap/editor/collaboration/collaboration/index.module.scss
 create mode 100644 packages/client/src/tiptap/editor/collaboration/collaboration/index.tsx
 create mode 100644 packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx
 create mode 100644 packages/client/src/tiptap/editor/collaboration/collaboration/type.ts
 create mode 100644 packages/client/src/tiptap/editor/collaboration/index.tsx
 create mode 100644 packages/client/src/tiptap/editor/collaboration/kit.ts
 create mode 100644 packages/client/src/tiptap/editor/collaboration/reader.tsx
 create mode 100644 packages/client/src/tiptap/editor/comment/index.ts
 create mode 100644 packages/client/src/tiptap/editor/comment/kit.ts
 create mode 100644 packages/client/src/tiptap/editor/comment/menubar.tsx
 rename packages/client/src/tiptap/{ => editor}/hooks/use-active.tsx (100%)
 rename packages/client/src/tiptap/{ => editor}/hooks/use-attributes.tsx (100%)
 create mode 100644 packages/client/src/tiptap/editor/index.tsx
 create mode 100644 packages/client/src/tiptap/editor/menus/_event.ts
 rename packages/client/src/tiptap/{ => editor}/menus/align/index.tsx (92%)
 rename packages/client/src/tiptap/{ => editor}/menus/attachment/bubble.tsx (86%)
 rename packages/client/src/tiptap/{ => editor}/menus/attachment/index.tsx (85%)
 rename packages/client/src/tiptap/{ => editor}/menus/background-color/index.tsx (82%)
 rename packages/client/src/tiptap/{ => editor}/menus/blockquote/index.tsx (76%)
 rename packages/client/src/tiptap/{ => editor}/menus/bold/index.tsx (74%)
 rename packages/client/src/tiptap/{ => editor}/menus/bullet-list/index.tsx (75%)
 rename packages/client/src/tiptap/{ => editor}/menus/callout/bubble.module.scss (100%)
 rename packages/client/src/tiptap/{ => editor}/menus/callout/bubble.tsx (94%)
 rename packages/client/src/tiptap/{ => editor}/menus/callout/index.tsx (84%)
 rename packages/client/src/tiptap/{ => editor}/menus/clear-node-and-marks/index.tsx (93%)
 rename packages/client/src/tiptap/{ => editor}/menus/code-block/bubble.tsx (87%)
 rename packages/client/src/tiptap/{ => editor}/menus/code-block/index.tsx (85%)
 rename packages/client/src/tiptap/{ => editor}/menus/code/index.tsx (74%)
 rename packages/client/src/tiptap/{ => editor}/menus/countdown/bubble.tsx (82%)
 rename packages/client/src/tiptap/{ => editor}/menus/countdown/index.tsx (89%)
 rename packages/client/src/tiptap/{ => editor}/menus/countdown/modal.tsx (83%)
 rename packages/client/src/tiptap/{ => editor}/menus/countdown/service.ts (83%)
 rename packages/client/src/tiptap/{ => editor}/menus/document-children/bubble.tsx (86%)
 rename packages/client/src/tiptap/{ => editor}/menus/document-children/index.tsx (86%)
 rename packages/client/src/tiptap/{ => editor}/menus/document-reference/bubble.tsx (94%)
 rename packages/client/src/tiptap/{ => editor}/menus/document-reference/index.tsx (86%)
 rename packages/client/src/tiptap/{ => editor}/menus/emoji/index.tsx (95%)
 rename packages/client/src/tiptap/{ => editor}/menus/fontsize/index.tsx (80%)
 rename packages/client/src/tiptap/{ => editor}/menus/heading/index.tsx (92%)
 rename packages/client/src/tiptap/{ => editor}/menus/horizontal-rule/index.tsx (81%)
 rename packages/client/src/tiptap/{ => editor}/menus/ident/index.tsx (87%)
 rename packages/client/src/tiptap/{ => editor}/menus/iframe/bubble.tsx (93%)
 rename packages/client/src/tiptap/{ => editor}/menus/iframe/index.tsx (84%)
 rename packages/client/src/tiptap/{ => editor}/menus/image/bubble.tsx (92%)
 rename packages/client/src/tiptap/{ => editor}/menus/image/index.tsx (84%)
 rename packages/client/src/tiptap/{ => editor}/menus/insert/index.tsx (97%)
 rename packages/client/src/tiptap/{ => editor}/menus/italic/index.tsx (74%)
 rename packages/client/src/tiptap/{ => editor}/menus/link/bubble.tsx (92%)
 rename packages/client/src/tiptap/{ => editor}/menus/link/index.tsx (81%)
 rename packages/client/src/tiptap/{ => editor}/menus/link/modal.tsx (89%)
 rename packages/client/src/tiptap/{ => editor}/menus/link/service.ts (77%)
 rename packages/client/src/tiptap/{ => editor}/menus/mind/bubble.tsx (86%)
 rename packages/client/src/tiptap/{ => editor}/menus/mind/index.tsx (84%)
 rename packages/client/src/tiptap/{ => editor}/menus/ordered-list/index.tsx (76%)
 rename packages/client/src/tiptap/{ => editor}/menus/quick-insert.tsx (99%)
 rename packages/client/src/tiptap/{ => editor}/menus/redo/index.tsx (92%)
 rename packages/client/src/tiptap/{ => editor}/menus/search/index.tsx (96%)
 rename packages/client/src/tiptap/{ => editor}/menus/strike/index.tsx (74%)
 rename packages/client/src/tiptap/{ => editor}/menus/subscript/index.tsx (76%)
 rename packages/client/src/tiptap/{ => editor}/menus/superscript/index.tsx (76%)
 rename packages/client/src/tiptap/{ => editor}/menus/table/bubble.tsx (96%)
 rename packages/client/src/tiptap/{ => editor}/menus/table/index.tsx (82%)
 rename packages/client/src/tiptap/{ => editor}/menus/task-list/index.tsx (76%)
 rename packages/client/src/tiptap/{ => editor}/menus/text-color/index.tsx (81%)
 rename packages/client/src/tiptap/{ => editor}/menus/underline/index.tsx (80%)
 rename packages/client/src/tiptap/{ => editor}/menus/undo/index.tsx (92%)
 create mode 100644 packages/client/src/tiptap/editor/react/index.tsx
 rename packages/client/src/tiptap/{ => editor}/react/useEditor.tsx (73%)
 rename packages/client/src/tiptap/{ => editor}/views/bubble-menu/bubble-menu-plugin.tsx (99%)
 rename packages/client/src/tiptap/{ => editor}/views/bubble-menu/index.tsx (100%)
 rename packages/client/src/tiptap/{ => editor}/views/float-menu.tsx (100%)
 rename packages/client/src/tiptap/{index.ts => fix-match-nodes.ts} (61%)
 delete mode 100644 packages/client/src/tiptap/indexdb.ts
 create mode 100644 packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/all-kit.tsx
 delete mode 100644 packages/client/src/tiptap/menubar.tsx
 delete mode 100644 packages/client/src/tiptap/menus/_event.ts
 rename packages/client/src/tiptap/{markdown/markdown-to-prosemirror => prose-utils}/markdown-source-map.ts (100%)
 rename packages/client/src/tiptap/{markdown/markdown-to-prosemirror/helpers.ts => prose-utils/markdown.ts} (94%)
 delete mode 100644 packages/client/src/tiptap/provider.ts
 delete mode 100644 packages/client/src/tiptap/react/index.tsx
 delete mode 100644 packages/client/src/tiptap/start-kit.tsx
 delete mode 100644 packages/client/src/tiptap/wrappers/mind/mind-elixir/iconfont/iconfont.js

diff --git a/packages/client/package.json b/packages/client/package.json
index 4dfb0088..bfe92824 100644
--- a/packages/client/package.json
+++ b/packages/client/package.json
@@ -83,6 +83,7 @@
     "react-split-pane": "^0.1.92",
     "scroll-into-view-if-needed": "^2.2.29",
     "swr": "^1.2.0",
+    "tilg": "^0.1.1",
     "tippy.js": "^6.3.7",
     "toggle-selection": "^1.0.6",
     "viewerjs": "^1.10.4",
diff --git a/packages/client/src/components/data-render/index.tsx b/packages/client/src/components/data-render/index.tsx
index 0e3db44a..78465e76 100644
--- a/packages/client/src/components/data-render/index.tsx
+++ b/packages/client/src/components/data-render/index.tsx
@@ -69,8 +69,9 @@ export const DataRender: React.FC<IProps> = ({
   return (
     <LoadingWrap
       loading={loading}
-      loadingContent={runRender(loadingContent)}
-      normalContent={loading ? null : runRender(normalContent)}
+      runRender={runRender}
+      loadingContent={loadingContent}
+      normalContent={loading ? null : normalContent}
     />
   );
 };
diff --git a/packages/client/src/components/data-render/loading.tsx b/packages/client/src/components/data-render/loading.tsx
index dc4fae56..480c6273 100644
--- a/packages/client/src/components/data-render/loading.tsx
+++ b/packages/client/src/components/data-render/loading.tsx
@@ -1,14 +1,15 @@
 import React, { useEffect, useRef } from 'react';
 import { useToggle } from 'hooks/use-toggle';
 
-interface IProps {
-  loading: boolean;
-  delay?: number;
-  loadingContent: React.ReactElement;
-  normalContent: React.ReactElement;
-}
+// interface IProps {
+//   loading: boolean;
+//   delay?: number;
+//   runRender
+//   loadingContent: React.ReactElement;
+//   normalContent: React.ReactElement;
+// }
 
-export const LoadingWrap: React.FC<IProps> = ({ loading, delay = 200, loadingContent, normalContent }) => {
+export const LoadingWrap = ({ loading, delay = 200, runRender, loadingContent, normalContent }) => {
   const timer = useRef<ReturnType<typeof setTimeout>>(null);
   const [showLoading, toggleShowLoading] = useToggle(false);
 
@@ -31,8 +32,8 @@ export const LoadingWrap: React.FC<IProps> = ({ loading, delay = 200, loadingCon
   }, [delay, loading, toggleShowLoading]);
 
   if (loading) {
-    return showLoading ? loadingContent : null;
+    return showLoading ? runRender(loadingContent) : null;
   }
 
-  return normalContent;
+  return runRender(normalContent);
 };
diff --git a/packages/client/src/components/document/comments/index.tsx b/packages/client/src/components/document/comments/index.tsx
index 92130739..74912aa5 100644
--- a/packages/client/src/components/document/comments/index.tsx
+++ b/packages/client/src/components/document/comments/index.tsx
@@ -1,8 +1,7 @@
 import React, { useRef, useState } from 'react';
-import { useEditor, EditorContent } from '@tiptap/react';
 import { Avatar, Button, Space, Typography, Banner, Pagination } from '@douyinfe/semi-ui';
 import { useToggle } from 'hooks/use-toggle';
-import { CommentKit, Document, History, CommentMenuBar } from 'tiptap';
+import { CommentKit, CommentMenuBar, useEditor, EditorContent } from 'tiptap/editor';
 import { DataRender } from 'components/data-render';
 import { useUser } from 'data/user';
 import { useComments } from 'data/comment';
@@ -34,7 +33,7 @@ export const CommentEditor: React.FC<IProps> = ({ documentId }) => {
 
   const editor = useEditor({
     editable: true,
-    extensions: [...CommentKit, Document, History],
+    extensions: CommentKit,
   });
 
   const openEditor = () => {
diff --git a/packages/client/src/components/document/editor/editor.tsx b/packages/client/src/components/document/editor/editor.tsx
index 65b480f3..160b3014 100644
--- a/packages/client/src/components/document/editor/editor.tsx
+++ b/packages/client/src/components/document/editor/editor.tsx
@@ -1,33 +1,12 @@
 import Router from 'next/router';
-import React, { useMemo, useEffect, useState, useRef } from 'react';
+import React, { useEffect, useState, useRef } from 'react';
 import cls from 'classnames';
-import deepEqual from 'deep-equal';
-import { BackTop, Toast, Spin, Typography } from '@douyinfe/semi-ui';
 import { ILoginUser, IAuthority } from '@think/domains';
-import { SecureDocumentIllustration } from 'illustrations/secure-document';
 import { useToggle } from 'hooks/use-toggle';
-import { useNetwork } from 'hooks/use-network';
-import {
-  useEditor,
-  EditorContent,
-  MenuBar,
-  BaseKit,
-  DocumentWithTitle,
-  getCollaborationExtension,
-  getCollaborationCursorExtension,
-  getProvider,
-  destoryProvider,
-  ProviderStatus,
-  getIndexdbProvider,
-  destoryIndexdbProvider,
-} from 'tiptap';
 import { findMentions } from 'tiptap/prose-utils';
 import { useCollaborationDocument } from 'data/document';
-import { DataRender } from 'components/data-render';
-import { Banner } from 'components/banner';
-import { LogoName } from 'components/logo';
-import { debounce } from 'helpers/debounce';
 import { event, triggerChangeDocumentTitle, triggerJoinUser, USE_DOCUMENT_VERSION } from 'event';
+import { CollaborationEditor, ICollaborationRefProps } from 'tiptap/editor';
 import { DocumentUserSetting } from './users';
 import styles from './index.module.scss';
 
@@ -39,93 +18,31 @@ interface IProps {
   style: React.CSSProperties;
 }
 
-const { Text } = Typography;
-
-export const _Editor: React.FC<IProps> = ({ user: currentUser, documentId, authority, className, style }) => {
+export const Editor: React.FC<IProps> = ({ user: currentUser, documentId, authority, className, style }) => {
   const $hasShowUserSettingModal = useRef(false);
+  const $editor = useRef<ICollaborationRefProps>();
   const { users, addUser, updateUser } = useCollaborationDocument(documentId);
-  const [status, setStatus] = useState<ProviderStatus>('connecting');
-  const { online } = useNetwork();
-  const [loading, toggleLoading] = useToggle(true);
-  const [error, setError] = useState(null);
-  const provider = useMemo(() => {
-    return getProvider({
-      targetId: documentId,
-      token: currentUser.token,
-      cacheType: 'EDITOR',
-      user: currentUser,
-      docType: 'document',
-      events: {
-        onAwarenessUpdate({ states }) {
-          triggerJoinUser(states);
-        },
-        onAuthenticationFailed() {
-          toggleLoading(false);
-          setError(new Error('鉴权失败！暂时无法提供服务'));
-        },
-        onSynced() {
-          toggleLoading(false);
-        },
-        onStatus({ status }) {
-          setStatus(status);
-        },
-      },
-    });
-  }, [documentId, currentUser, toggleLoading]);
-  const editor = useEditor(
-    {
-      editable: authority && authority.editable,
-      extensions: [
-        ...BaseKit,
-        DocumentWithTitle,
-        getCollaborationExtension(provider),
-        getCollaborationCursorExtension(provider, currentUser),
-      ],
-      onTransaction: debounce(({ transaction }) => {
-        try {
-          const title = transaction.doc.content.firstChild.content.firstChild.textContent;
-          triggerChangeDocumentTitle(title);
-        } catch (e) {
-          //
-        }
-      }, 50),
-      onDestroy() {
-        destoryProvider(provider, 'EDITOR');
-      },
-    },
-    [authority, provider]
-  );
   const [mentionUsersSettingVisible, toggleMentionUsersSettingVisible] = useToggle(false);
   const [mentionUsers, setMentionUsers] = useState([]);
 
   useEffect(() => {
-    if (!authority || !authority.editable) return;
-
-    const indexdbProvider = getIndexdbProvider(documentId, provider.document);
-
-    indexdbProvider.on('synced', () => {
-      setStatus('loadCacheSuccess');
-    });
-
-    return () => {
-      destoryIndexdbProvider(documentId);
+    const handler = (data) => {
+      const editor = $editor.current && $editor.current.getEditor();
+      if (!editor) return;
+      editor.commands.setContent(data);
     };
-  }, [documentId, provider, authority]);
-
-  useEffect(() => {
-    if (!editor) return;
-    const handler = (data) => editor.commands.setContent(data);
     event.on(USE_DOCUMENT_VERSION, handler);
 
     return () => {
       event.off(USE_DOCUMENT_VERSION, handler);
     };
-  }, [editor]);
+  }, []);
 
   useEffect(() => {
-    if (!editor) return;
-
     const handler = () => {
+      const editor = $editor.current && $editor.current.getEditor();
+      if (!editor) return;
+
       // 已经拦截过一次，不再拦截
       if ($hasShowUserSettingModal.current) return;
 
@@ -169,98 +86,28 @@ export const _Editor: React.FC<IProps> = ({ user: currentUser, documentId, autho
       Router.events.off('routeChangeStart', handler);
       window.removeEventListener('unload', handler);
     };
-  }, [editor, users, currentUser, toggleMentionUsersSettingVisible]);
-
-  useEffect(() => {
-    const listener = (event: KeyboardEvent) => {
-      if ((event.ctrlKey || event.metaKey) && event.keyCode == 83) {
-        event.preventDefault();
-        Toast.info(`${LogoName}会实时保存你的数据，无需手动保存。`);
-        return false;
-      }
-    };
-
-    window.document.addEventListener('keydown', listener);
-
-    return () => {
-      window.document.removeEventListener('keydown', listener);
-    };
-  }, []);
+  }, [users, currentUser, toggleMentionUsersSettingVisible]);
 
   return (
-    <DataRender
-      loading={loading}
-      loadingContent={
-        <div style={{ margin: '10vh auto' }}>
-          <Spin tip="正在为您加载编辑器中...">
-            {/* FIXME: semi-design 的问题，不加 div，文字会换行! */}
-            <div></div>
-          </Spin>
-        </div>
-      }
-      error={error}
-      errorContent={(error) => (
-        <div
-          style={{
-            margin: '10vh',
-            display: 'flex',
-            justifyContent: 'center',
-            flexDirection: 'column',
-            alignItems: 'center',
-          }}
-        >
-          <SecureDocumentIllustration />
-          <Text style={{ marginTop: 12 }} type="danger">
-            {(error && error.message) || '未知错误'}
-          </Text>
-        </div>
-      )}
-      normalContent={() => {
-        return (
-          <div className={styles.editorWrap}>
-            {(!online || status === 'disconnected') && (
-              <Banner
-                type="warning"
-                description="我们已与您断开连接，您可以继续编辑文档。一旦重新连接，我们会自动重新提交数据。"
-              />
-            )}
-            {authority && !authority.editable && (
-              <Banner type="warning" description="您没有编辑权限，暂不能编辑该文档。" closeable={false} />
-            )}
-            <header className={className}>
-              <div>
-                <MenuBar editor={editor} />
-              </div>
-            </header>
-            <main id="js-template-editor-container" style={style}>
-              <div className={cls(styles.contentWrap, className)}>
-                <EditorContent editor={editor} />
-              </div>
-              <BackTop target={() => document.querySelector('#js-template-editor-container')} />
-            </main>
-            <DocumentUserSetting
-              visible={mentionUsersSettingVisible}
-              toggleVisible={toggleMentionUsersSettingVisible}
-              mentionUsers={mentionUsers}
-              users={users}
-              addUser={addUser}
-              updateUser={updateUser}
-            />
-          </div>
-        );
-      }}
-    />
+    <div className={cls(styles.editorWrap, className)} style={style}>
+      <CollaborationEditor
+        ref={$editor}
+        menubar
+        editable={authority && authority.editable}
+        user={currentUser}
+        id={documentId}
+        type="document"
+        onTitleUpdate={triggerChangeDocumentTitle}
+        onAwarenessUpdate={triggerJoinUser}
+      />
+      <DocumentUserSetting
+        visible={mentionUsersSettingVisible}
+        toggleVisible={toggleMentionUsersSettingVisible}
+        mentionUsers={mentionUsers}
+        users={users}
+        addUser={addUser}
+        updateUser={updateUser}
+      />
+    </div>
   );
 };
-
-export const Editor = React.memo(_Editor, (prevProps, nextProps) => {
-  if (deepEqual(prevProps, nextProps)) return true;
-  Toast.info({
-    content: '信息已更新，我们将为您重新加载页面！',
-    duration: 3,
-    onClose() {
-      Router.reload();
-    },
-  });
-  return false;
-});
diff --git a/packages/client/src/components/document/editor/index.module.scss b/packages/client/src/components/document/editor/index.module.scss
index bd89c012..45308925 100644
--- a/packages/client/src/components/document/editor/index.module.scss
+++ b/packages/client/src/components/document/editor/index.module.scss
@@ -1,3 +1,4 @@
+/* stylelint-disable no-descending-specificity */
 .wrap {
   display: flex;
   flex-direction: column;
@@ -30,51 +31,31 @@
   height: 100%;
   overflow: hidden;
 
-  > header {
-    position: relative;
-    z-index: 110;
-    display: flex;
-    height: 50px;
-    padding: 0 24px;
-    overflow: hidden;
-    background-color: var(--semi-color-nav-bg);
-    align-items: center;
-    border-bottom: 1px solid var(--semi-color-border);
-    user-select: none;
-
-    &.isStandardWidth {
-      justify-content: center;
-    }
-
-    &.isFullWidth {
-      justify-content: flex-start;
-    }
-
-    > div {
-      display: inline-flex;
-      align-items: center;
-      height: 100%;
-      overflow: auto;
+  > div {
+    > main {
+      padding: 24px 24px 96px;
     }
   }
 
-  > main {
-    flex: 1;
-    height: calc(100% - 50px);
-    overflow: auto;
-
-    .contentWrap {
-      padding: 24px 24px 96px;
-
-      &.isStandardWidth {
-        width: 96%;
-        max-width: 750px;
-        margin: 0 auto;
+  &.isStandardWidth {
+    > div {
+      > main {
+        > div:first-of-type {
+          width: 96%;
+          max-width: 750px;
+          margin: 0 auto;
+        }
       }
+    }
+  }
 
-      &.isFullWidth {
-        width: 100%;
-        margin: 0 auto;
+  &.isFullWidth {
+    width: 100%;
+    margin: 0 auto;
+
+    > div {
+      > header {
+        justify-content: flex-start;
       }
     }
   }
diff --git a/packages/client/src/components/document/editor/index.tsx b/packages/client/src/components/document/editor/index.tsx
index db806e21..20679587 100644
--- a/packages/client/src/components/document/editor/index.tsx
+++ b/packages/client/src/components/document/editor/index.tsx
@@ -70,7 +70,12 @@ export const DocumentEditor: React.FC<IProps> = ({ documentId }) => {
                   <Skeleton active placeholder={<Skeleton.Title style={{ width: 80 }} />} loading={true} />
                 }
                 normalContent={() => (
-                  <Text ellipsis={{ showTooltip: true }} style={{ width: ~~(windowWith / 4) }}>
+                  <Text
+                    ellipsis={{
+                      showTooltip: { opts: { content: title, style: { wordBreak: 'break-all' } } },
+                    }}
+                    style={{ width: ~~(windowWith / 4) }}
+                  >
                     {title}
                   </Text>
                 )}
diff --git a/packages/client/src/components/document/reader/editor.tsx b/packages/client/src/components/document/reader/editor.tsx
deleted file mode 100644
index ad01c841..00000000
--- a/packages/client/src/components/document/reader/editor.tsx
+++ /dev/null
@@ -1,117 +0,0 @@
-import React, { useMemo, useEffect, useState } from 'react';
-import { Layout, Spin, Typography } from '@douyinfe/semi-ui';
-import { IDocument, ILoginUser } from '@think/domains';
-import { useToggle } from 'hooks/use-toggle';
-import {
-  useEditor,
-  EditorContent,
-  BaseKit,
-  DocumentWithTitle,
-  getCollaborationExtension,
-  getCollaborationCursorExtension,
-  getProvider,
-  destoryProvider,
-} from 'tiptap';
-import { SecureDocumentIllustration } from 'illustrations/secure-document';
-import { DataRender } from 'components/data-render';
-import { ImageViewer } from 'components/image-viewer';
-import { triggerJoinUser } from 'event';
-import { CreateUser } from './user';
-import styles from './index.module.scss';
-
-const { Content } = Layout;
-const { Text } = Typography;
-
-interface IProps {
-  user: ILoginUser;
-  documentId: string;
-  document: IDocument;
-}
-
-export const Editor: React.FC<IProps> = ({ user, documentId, document, children }) => {
-  const [loading, toggleLoading] = useToggle(true);
-  const [error, setError] = useState(null);
-  const provider = useMemo(() => {
-    return getProvider({
-      targetId: documentId,
-      token: user.token,
-      cacheType: 'READER',
-      user,
-      docType: 'document',
-      events: {
-        onAwarenessUpdate({ states }) {
-          triggerJoinUser(states);
-        },
-        onAuthenticationFailed() {
-          toggleLoading(false);
-          setError(new Error('鉴权失败！暂时无法提供服务'));
-        },
-        onSynced() {
-          toggleLoading(false);
-        },
-      },
-    });
-  }, [documentId, user, toggleLoading]);
-  const editor = useEditor({
-    editable: false,
-    extensions: [
-      ...BaseKit,
-      DocumentWithTitle,
-      getCollaborationExtension(provider),
-      getCollaborationCursorExtension(provider, user),
-    ],
-    editorProps: {
-      // @ts-ignore
-      taskItemClickable: true,
-    },
-    onDestroy() {
-      destoryProvider(provider, 'READER');
-    },
-  });
-
-  return (
-    <DataRender
-      loading={loading}
-      loadingContent={
-        <div style={{ margin: '10vh auto' }}>
-          <Spin tip="正在为您加载文档内容中...">
-            {/* FIXME: semi-design 的问题，不加 div，文字会换行! */}
-            <div />
-          </Spin>
-        </div>
-      }
-      error={error}
-      errorContent={(error) => (
-        <div
-          style={{
-            margin: '10vh',
-            display: 'flex',
-            justifyContent: 'center',
-            flexDirection: 'column',
-            alignItems: 'center',
-          }}
-        >
-          <SecureDocumentIllustration />
-          <Text style={{ marginTop: 12 }} type="danger">
-            {(error && error.message) || '未知错误'}
-          </Text>
-        </div>
-      )}
-      normalContent={() => {
-        return (
-          <Content className={styles.editorWrap}>
-            <div id="js-reader-container">
-              <ImageViewer containerSelector="#js-reader-container" />
-              <EditorContent editor={editor} />
-            </div>
-            <CreateUser
-              document={document}
-              container={() => window.document.querySelector('#js-reader-container .ProseMirror .title')}
-            />
-            {children}
-          </Content>
-        );
-      }}
-    />
-  );
-};
diff --git a/packages/client/src/components/document/reader/index.tsx b/packages/client/src/components/document/reader/index.tsx
index 43238309..977282a3 100644
--- a/packages/client/src/components/document/reader/index.tsx
+++ b/packages/client/src/components/document/reader/index.tsx
@@ -1,8 +1,22 @@
 import Router from 'next/router';
-import React, { useCallback, useMemo, useRef, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
+import { createPortal } from 'react-dom';
 import cls from 'classnames';
-import { Layout, Nav, Space, Button, Typography, Skeleton, Tooltip, Popover, BackTop, Spin } from '@douyinfe/semi-ui';
-import { IconEdit, IconArticle } from '@douyinfe/semi-icons';
+import {
+  Layout,
+  Nav,
+  Space,
+  Avatar,
+  Button,
+  Typography,
+  Skeleton,
+  Tooltip,
+  Popover,
+  BackTop,
+  Spin,
+} from '@douyinfe/semi-ui';
+import { LocaleTime } from 'components/locale-time';
+import { IconUser, IconEdit, IconArticle } from '@douyinfe/semi-icons';
 import { Seo } from 'components/seo';
 import { DataRender } from 'components/data-render';
 import { DocumentShare } from 'components/document/share';
@@ -15,11 +29,24 @@ import { useDocumentStyle } from 'hooks/use-document-style';
 import { useWindowSize } from 'hooks/use-window-size';
 import { useUser } from 'data/user';
 import { useDocumentDetail } from 'data/document';
-import { Editor } from './editor';
+import { triggerJoinUser } from 'event';
+import { CollaborationEditor } from 'tiptap/editor';
 import styles from './index.module.scss';
 
 const { Header } = Layout;
 const { Text } = Typography;
+const EditBtnStyle = {
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  height: 30,
+  width: 30,
+  borderRadius: '100%',
+  backgroundColor: '#0077fa',
+  color: '#fff',
+  bottom: 100,
+  transform: 'translateY(-50px)',
+};
 
 interface IProps {
   documentId: string;
@@ -36,6 +63,51 @@ export const DocumentReader: React.FC<IProps> = ({ documentId }) => {
   const { data: documentAndAuth, loading: docAuthLoading, error: docAuthError } = useDocumentDetail(documentId);
   const { document, authority } = documentAndAuth || {};
 
+  const renderAuthor = useCallback(
+    (element) => {
+      if (!document) return null;
+
+      const target = element && element.querySelector('.ProseMirror .title');
+
+      if (target) {
+        return createPortal(
+          <div
+            style={{
+              borderTop: '1px solid var(--semi-color-border)',
+              marginTop: 24,
+              padding: '16px 0',
+              fontSize: 13,
+              fontWeight: 'normal',
+              color: 'var(--semi-color-text-0)',
+            }}
+          >
+            <Space>
+              <Avatar size="small" src={document.createUser && document.createUser.avatar}>
+                <IconUser />
+              </Avatar>
+              <div>
+                <p style={{ margin: 0 }}>
+                  创建者：
+                  {document.createUser && document.createUser.name}
+                </p>
+                <p style={{ margin: '8px 0 0' }}>
+                  最近更新日期：
+                  <LocaleTime date={document.updatedAt} timeago />
+                  {' ⦁ '}阅读量：
+                  {document.views}
+                </p>
+              </div>
+            </Space>
+          </div>,
+          target
+        );
+      }
+
+      return null;
+    },
+    [document]
+  );
+
   const gotoEdit = useCallback(() => {
     Router.push(`/wiki/${document.wikiId}/document/${document.id}/edit`);
   }, [document]);
@@ -54,7 +126,13 @@ export const DocumentReader: React.FC<IProps> = ({ documentId }) => {
               error={docAuthError}
               loadingContent={<Skeleton active placeholder={<Skeleton.Title style={{ width: 80 }} />} loading={true} />}
               normalContent={() => (
-                <Text strong ellipsis={{ showTooltip: true }} style={{ width: ~~(windowWidth / 4) }}>
+                <Text
+                  strong
+                  ellipsis={{
+                    showTooltip: { opts: { content: document.title, style: { wordBreak: 'break-all' } } },
+                  }}
+                  style={{ width: ~~(windowWidth / 4) }}
+                >
                   {document.title}
                 </Text>
               )}
@@ -103,30 +181,22 @@ export const DocumentReader: React.FC<IProps> = ({ documentId }) => {
                   <>
                     <Seo title={document.title} />
                     {user && (
-                      <Editor key={document.id} user={user} documentId={document.id} document={document}>
-                        <div className={styles.commentWrap}>
-                          <CommentEditor documentId={document.id} />
-                        </div>
-                      </Editor>
+                      <CollaborationEditor
+                        editable={false}
+                        user={user}
+                        id={documentId}
+                        type="document"
+                        renderInEditorPortal={renderAuthor}
+                        onAwarenessUpdate={triggerJoinUser}
+                      />
+                    )}
+                    {user && (
+                      <div className={styles.commentWrap}>
+                        <CommentEditor documentId={document.id} />
+                      </div>
                     )}
                     {authority && authority.editable && container && (
-                      <BackTop
-                        style={{
-                          display: 'flex',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                          height: 30,
-                          width: 30,
-                          borderRadius: '100%',
-                          backgroundColor: '#0077fa',
-                          color: '#fff',
-                          bottom: 100,
-                          transform: `translateY(-50px);`,
-                        }}
-                        onClick={gotoEdit}
-                        target={() => container}
-                        visibilityHeight={200}
-                      >
+                      <BackTop style={EditBtnStyle} onClick={gotoEdit} target={() => container} visibilityHeight={200}>
                         <IconEdit />
                       </BackTop>
                     )}
diff --git a/packages/client/src/components/document/reader/public/content.tsx b/packages/client/src/components/document/reader/public/content.tsx
deleted file mode 100644
index 44057e5b..00000000
--- a/packages/client/src/components/document/reader/public/content.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React, { useMemo } from 'react';
-import { IDocument } from '@think/domains';
-import { useEditor, EditorContent, BaseKit, DocumentWithTitle } from 'tiptap';
-import { safeJSONParse } from 'helpers/json';
-import { CreateUser } from '../user';
-
-interface IProps {
-  document: IDocument;
-  createUserContainerSelector: string;
-}
-
-export const DocumentContent: React.FC<IProps> = ({ document, createUserContainerSelector }) => {
-  const json = useMemo(() => {
-    const c = safeJSONParse(document.content);
-    const json = c.default || c;
-    return json;
-  }, [document]);
-
-  const editor = useEditor(
-    {
-      editable: false,
-      extensions: [...BaseKit, DocumentWithTitle],
-      content: json,
-    },
-    [json]
-  );
-
-  return (
-    <>
-      <EditorContent editor={editor} />
-      <CreateUser document={document} container={() => window.document.querySelector(createUserContainerSelector)} />
-    </>
-  );
-};
diff --git a/packages/client/src/components/document/reader/public/index.tsx b/packages/client/src/components/document/reader/public/index.tsx
index 97d99ab5..cea85f92 100644
--- a/packages/client/src/components/document/reader/public/index.tsx
+++ b/packages/client/src/components/document/reader/public/index.tsx
@@ -24,8 +24,8 @@ import { Theme } from 'components/theme';
 import { ImageViewer } from 'components/image-viewer';
 import { useDocumentStyle } from 'hooks/use-document-style';
 import { usePublicDocument } from 'data/document';
-import { DocumentSkeleton } from 'tiptap';
-import { DocumentContent } from './content';
+import { DocumentSkeleton } from 'tiptap/components/skeleton';
+import { CollaborationEditor } from 'tiptap/editor';
 import styles from './index.module.scss';
 
 const { Header, Content } = Layout;
@@ -121,26 +121,21 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
           }}
           loadingContent={
             <div className={cls(styles.editorWrap, editorWrapClassNames)} style={{ fontSize }}>
-              <DocumentSkeleton />
+              1<DocumentSkeleton />
             </div>
           }
           normalContent={() => {
             return (
-              <>
+              <div
+                id="js-share-document-editor-container"
+                className={cls(styles.editorWrap, editorWrapClassNames)}
+                style={{ fontSize }}
+              >
                 <Seo title={data.title} />
-                <div
-                  className={cls(styles.editorWrap, editorWrapClassNames)}
-                  style={{ fontSize }}
-                  id="js-share-document-editor-container"
-                >
-                  <DocumentContent
-                    document={data}
-                    createUserContainerSelector="#js-share-document-editor-container .ProseMirror .title"
-                  />
-                </div>
+                <CollaborationEditor menubar={false} editable={false} user={null} id={documentId} type="document" />
                 <ImageViewer containerSelector="#js-share-document-editor-container" />
                 <BackTop target={() => document.querySelector('#js-share-document-editor-container').parentNode} />
-              </>
+              </div>
             );
           }}
         />
diff --git a/packages/client/src/components/document/reader/user.tsx b/packages/client/src/components/document/reader/user.tsx
deleted file mode 100644
index c8a76c04..00000000
--- a/packages/client/src/components/document/reader/user.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { createPortal } from 'react-dom';
-import { Space, Avatar } from '@douyinfe/semi-ui';
-import { IconUser } from '@douyinfe/semi-icons';
-import { IDocument } from '@think/domains';
-import { LocaleTime } from 'components/locale-time';
-
-export const CreateUser: React.FC<{ document: IDocument; container: () => HTMLElement }> = ({
-  document,
-  container = null,
-}) => {
-  if (!document.createUser) return null;
-
-  const content = (
-    <div
-      style={{
-        borderTop: '1px solid var(--semi-color-border)',
-        marginTop: 24,
-        padding: '16px 0',
-        fontSize: 13,
-        fontWeight: 'normal',
-        color: 'var(--semi-color-text-0)',
-      }}
-    >
-      <Space>
-        <Avatar size="small" src={document.createUser && document.createUser.avatar}>
-          <IconUser />
-        </Avatar>
-        <div>
-          <p style={{ margin: 0 }}>
-            创建者：
-            {document.createUser && document.createUser.name}
-          </p>
-          <p style={{ margin: '8px 0 0' }}>
-            最近更新日期：
-            <LocaleTime date={document.updatedAt} timeago />
-            {' ⦁ '}阅读量：
-            {document.views}
-          </p>
-        </div>
-      </Space>
-    </div>
-  );
-
-  const el = container && container();
-
-  if (!el) return content;
-  return createPortal(content, el);
-};
diff --git a/packages/client/src/components/document/version/index.tsx b/packages/client/src/components/document/version/index.tsx
index 08acdb3f..3227f81a 100644
--- a/packages/client/src/components/document/version/index.tsx
+++ b/packages/client/src/components/document/version/index.tsx
@@ -3,7 +3,7 @@ import { Button, Modal, Typography } from '@douyinfe/semi-ui';
 import { IconChevronLeft } from '@douyinfe/semi-icons';
 import { useEditor, EditorContent } from '@tiptap/react';
 import cls from 'classnames';
-import { BaseKit, DocumentWithTitle } from 'tiptap';
+import { CollaborationKit } from 'tiptap/editor';
 import { safeJSONParse } from 'helpers/json';
 import { DataRender } from 'components/data-render';
 import { LocaleTime } from 'components/locale-time';
@@ -25,7 +25,7 @@ export const DocumentVersion: React.FC<IProps> = ({ documentId, onSelect }) => {
 
   const editor = useEditor({
     editable: false,
-    extensions: [...BaseKit, DocumentWithTitle],
+    extensions: CollaborationKit,
     content: { type: 'doc', content: [] },
   });
 
diff --git a/packages/client/src/components/template/editor/editor.tsx b/packages/client/src/components/template/editor/editor.tsx
index 9d22935c..d7cc4fee 100644
--- a/packages/client/src/components/template/editor/editor.tsx
+++ b/packages/client/src/components/template/editor/editor.tsx
@@ -1,35 +1,15 @@
 import React, { useMemo, useCallback, useState, useEffect } from 'react';
 import Router from 'next/router';
 import cls from 'classnames';
-import {
-  Button,
-  Nav,
-  Space,
-  Typography,
-  Tooltip,
-  Switch,
-  Popover,
-  Popconfirm,
-  BackTop,
-  Toast,
-} from '@douyinfe/semi-ui';
+import { Button, Nav, Space, Typography, Tooltip, Switch, Popover, Popconfirm } from '@douyinfe/semi-ui';
 import { IconChevronLeft, IconArticle } from '@douyinfe/semi-icons';
 import { ILoginUser, ITemplate } from '@think/domains';
 import { Theme } from 'components/theme';
-import {
-  useEditor,
-  EditorContent,
-  BaseKit,
-  DocumentWithTitle,
-  getCollaborationExtension,
-  getProvider,
-  MenuBar,
-} from 'tiptap';
 import { User } from 'components/user';
 import { DocumentStyle } from 'components/document/style';
-import { LogoName } from 'components/logo';
 import { useDocumentStyle } from 'hooks/use-document-style';
 import { useWindowSize } from 'hooks/use-window-size';
+import { CollaborationEditor } from 'tiptap/editor';
 import styles from './index.module.scss';
 
 const { Text } = Typography;
@@ -44,30 +24,6 @@ interface IProps {
 export const Editor: React.FC<IProps> = ({ user, data, updateTemplate, deleteTemplate }) => {
   const { width: windowWidth } = useWindowSize();
   const [title, setTitle] = useState(data.title);
-  const provider = useMemo(() => {
-    return getProvider({
-      targetId: data.id,
-      token: user.token,
-      cacheType: 'READER',
-      user,
-      docType: 'template',
-    });
-  }, []);
-  const editor = useEditor(
-    {
-      editable: true,
-      extensions: [...BaseKit, DocumentWithTitle, getCollaborationExtension(provider)],
-      onTransaction: ({ transaction }) => {
-        try {
-          const title = transaction.doc.content.firstChild.content.firstChild.textContent;
-          setTitle(title);
-        } catch (e) {
-          //
-        }
-      },
-    },
-    [provider]
-  );
   const [isPublic, setPublic] = useState(false);
   const { width, fontSize } = useDocumentStyle();
   const editorWrapClassNames = useMemo(() => {
@@ -89,22 +45,6 @@ export const Editor: React.FC<IProps> = ({ user, data, updateTemplate, deleteTem
     setPublic(data.isPublic);
   }, [data]);
 
-  useEffect(() => {
-    const listener = (event: KeyboardEvent) => {
-      if ((event.ctrlKey || event.metaKey) && event.keyCode == 83) {
-        event.preventDefault();
-        Toast.info(`${LogoName}会实时保存你的数据，无需手动保存。`);
-        return false;
-      }
-    };
-
-    window.document.addEventListener('keydown', listener);
-
-    return () => {
-      window.document.removeEventListener('keydown', listener);
-    };
-  }, []);
-
   return (
     <div className={styles.wrap}>
       <header>
@@ -140,17 +80,9 @@ export const Editor: React.FC<IProps> = ({ user, data, updateTemplate, deleteTem
       </header>
       <main className={styles.contentWrap}>
         <div className={styles.editorWrap}>
-          <header className={editorWrapClassNames}>
-            <div>
-              <MenuBar editor={editor} />
-            </div>
-          </header>
-          <main id="js-template-editor-container">
-            <div className={cls(styles.contentWrap, editorWrapClassNames)} style={{ fontSize }}>
-              <EditorContent editor={editor} />
-            </div>
-            <BackTop target={() => document.querySelector('#js-template-editor-container')} />
-          </main>
+          <div className={cls(styles.contentWrap, editorWrapClassNames)} style={{ fontSize }}>
+            <CollaborationEditor menubar editable user={user} id={data.id} type="template" onTitleUpdate={setTitle} />
+          </div>
         </div>
       </main>
     </div>
diff --git a/packages/client/src/components/template/editor/index.module.scss b/packages/client/src/components/template/editor/index.module.scss
index dc41c83a..983ce25e 100644
--- a/packages/client/src/components/template/editor/index.module.scss
+++ b/packages/client/src/components/template/editor/index.module.scss
@@ -1,3 +1,4 @@
+/* stylelint-disable no-descending-specificity */
 .wrap {
   display: flex;
   flex-direction: column;
@@ -30,55 +31,33 @@
   height: 100%;
   overflow: hidden;
 
-  > header {
-    position: relative;
-    z-index: 110;
-    display: flex;
-    height: 50px;
-    padding: 0 24px;
-    overflow: hidden;
-    background-color: var(--semi-color-nav-bg);
-    align-items: center;
-    border-bottom: 1px solid var(--semi-color-border);
-    user-select: none;
+  > div {
+    height: 100%;
 
+    > div:first-of-type > main {
+      padding: 24px 24px 96px;
+    }
+  }
+
+  .isStandardWidth {
     > div {
-      display: inline-flex;
-      align-items: center;
-      height: 100%;
-      overflow: auto;
-    }
-
-    &.isStandardWidth {
-      > div {
-        margin: 0 auto;
-      }
-    }
-
-    &.isFullWidth {
-      > div {
-        margin: 0;
+      > main {
+        > div:first-of-type {
+          width: 96%;
+          max-width: 750px;
+          margin: 0 auto;
+        }
       }
     }
   }
 
-  > main {
-    flex: 1;
-    height: calc(100% - 50px);
-    overflow: auto;
+  .isFullWidth {
+    width: 100%;
+    margin: 0 auto;
 
-    .contentWrap {
-      padding: 24px 24px 96px;
-
-      &.isStandardWidth {
-        width: 96%;
-        max-width: 750px;
-        margin: 0 auto;
-      }
-
-      &.isFullWidth {
-        width: 100%;
-        margin: 0 auto;
+    > div {
+      > header {
+        justify-content: flex-start;
       }
     }
   }
diff --git a/packages/client/src/components/template/editor/useEditor.tsx b/packages/client/src/components/template/editor/useEditor.tsx
deleted file mode 100644
index eab529f8..00000000
--- a/packages/client/src/components/template/editor/useEditor.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { useState, useEffect, DependencyList } from 'react';
-import { EditorOptions } from '@tiptap/core';
-import { Editor } from '@tiptap/react';
-
-function useForceUpdate() {
-  const [, setValue] = useState(0);
-
-  return () => setValue((value) => value + 1);
-}
-
-export const useEditor = (options: Partial<EditorOptions> = {}, deps: DependencyList = []) => {
-  const [editor, setEditor] = useState<Editor | null>(null);
-  const forceUpdate = useForceUpdate();
-
-  useEffect(() => {
-    const instance = new Editor(options);
-
-    setEditor(instance);
-
-    // instance.on('transaction', () => {
-    //   requestAnimationFrame(() => {
-    //     requestAnimationFrame(() => {
-    //       console.log('update');
-    //       forceUpdate();
-    //     });
-    //   });
-    // });
-
-    return () => {
-      instance.destroy();
-    };
-  }, deps);
-
-  return editor;
-};
diff --git a/packages/client/src/components/template/reader/editor.tsx b/packages/client/src/components/template/reader/editor.tsx
deleted file mode 100644
index fff033ef..00000000
--- a/packages/client/src/components/template/reader/editor.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import React, { useMemo } from 'react';
-import cls from 'classnames';
-import { Layout, Spin, Typography } from '@douyinfe/semi-ui';
-import { IUser, ITemplate } from '@think/domains';
-import { useEditor, EditorContent, BaseKit, DocumentWithTitle } from 'tiptap';
-import { DataRender } from 'components/data-render';
-import { ImageViewer } from 'components/image-viewer';
-import { useDocumentStyle } from 'hooks/use-document-style';
-import { safeJSONParse } from 'helpers/json';
-import styles from './index.module.scss';
-
-const { Content } = Layout;
-const { Title } = Typography;
-
-interface IProps {
-  user: IUser;
-  data: ITemplate;
-  loading: boolean;
-  error: Error | null;
-}
-
-export const Editor: React.FC<IProps> = ({ user, data, loading, error }) => {
-  const json = useMemo(() => {
-    const c = safeJSONParse(data.content);
-    let json = c.default || c;
-
-    if (json && json.content) {
-      json = {
-        type: 'doc',
-        content: json.content.slice(1),
-      };
-    }
-
-    return json;
-  }, [data]);
-
-  const editor = useEditor(
-    {
-      editable: false,
-      extensions: [...BaseKit, DocumentWithTitle],
-      content: json,
-    },
-    [json]
-  );
-
-  const { width, fontSize } = useDocumentStyle();
-  const editorWrapClassNames = useMemo(() => {
-    return width === 'standardWidth' ? styles.isStandardWidth : styles.isFullWidth;
-  }, [width]);
-
-  if (!user) return null;
-
-  return (
-    <div className={styles.wrap}>
-      <Layout className={styles.contentWrap}>
-        <DataRender
-          loading={false}
-          loadingContent={
-            <div style={{ margin: 24 }}>
-              <Spin></Spin>
-            </div>
-          }
-          error={error}
-          normalContent={() => {
-            return (
-              <Content className={cls(styles.editorWrap)}>
-                <div className={editorWrapClassNames} style={{ fontSize }}>
-                  <Title>{data.title}</Title>
-                  <EditorContent editor={editor} />
-                </div>
-                <ImageViewer containerSelector={`.${styles.editorWrap}`} />
-              </Content>
-            );
-          }}
-        />
-      </Layout>
-    </div>
-  );
-};
diff --git a/packages/client/src/components/template/reader/index.module.scss b/packages/client/src/components/template/reader/index.module.scss
deleted file mode 100644
index 5f90ebcf..00000000
--- a/packages/client/src/components/template/reader/index.module.scss
+++ /dev/null
@@ -1,32 +0,0 @@
-.wrap {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-
-  .contentWrap {
-    flex: 1;
-    overflow: hidden;
-
-    > div {
-      display: flex;
-      flex-direction: column;
-      height: 100%;
-    }
-
-    .editorWrap {
-      flex: 1;
-      overflow: auto;
-    }
-  }
-}
-
-.isStandardWidth {
-  width: 96%;
-  max-width: 750px;
-  margin: 0 auto;
-}
-
-.isFullWidth {
-  width: 100%;
-  margin: 0 auto;
-}
diff --git a/packages/client/src/components/template/reader/index.tsx b/packages/client/src/components/template/reader/index.tsx
index 759a1f75..645da9cc 100644
--- a/packages/client/src/components/template/reader/index.tsx
+++ b/packages/client/src/components/template/reader/index.tsx
@@ -1,17 +1,16 @@
 import React from 'react';
 import { Spin } from '@douyinfe/semi-ui';
-import { useUser } from 'data/user';
 import { Seo } from 'components/seo';
 import { DataRender } from 'components/data-render';
 import { useTemplate } from 'data/template';
-import { Editor } from './editor';
+import { ImageViewer } from 'components/image-viewer';
+import { ReaderEditor } from 'tiptap/editor';
 
 interface IProps {
   templateId: string;
 }
 
 export const TemplateReader: React.FC<IProps> = ({ templateId }) => {
-  const { user } = useUser();
   const { data, loading, error } = useTemplate(templateId);
 
   return (
@@ -25,9 +24,10 @@ export const TemplateReader: React.FC<IProps> = ({ templateId }) => {
       error={error}
       normalContent={() => {
         return (
-          <div style={{ fontSize: 16 }}>
+          <div id="js-template-reader" className="container">
             <Seo title={data.title} />
-            <Editor user={user} data={data} loading={loading} error={error} />
+            <ReaderEditor content={data.content} />
+            <ImageViewer containerSelector={`#js-template-reader`} />
           </div>
         );
       }}
diff --git a/packages/client/src/components/wiki/tocs/tree.tsx b/packages/client/src/components/wiki/tocs/tree.tsx
index 1bd09ca4..485497f0 100644
--- a/packages/client/src/components/wiki/tocs/tree.tsx
+++ b/packages/client/src/components/wiki/tocs/tree.tsx
@@ -75,7 +75,7 @@ export const Tree = ({ data, docAsLink, getDocLink, parentIds, activeId, isShare
           <a className={styles.left}>
             <Typography.Text
               ellipsis={{
-                showTooltip: { opts: { content: label, position: 'right' } },
+                showTooltip: { opts: { content: label, style: { wordBreak: 'break-all' }, position: 'right' } },
               }}
             >
               {label}
diff --git a/packages/client/src/data/comment.ts b/packages/client/src/data/comment.ts
index 324b4ded..22b3ad2c 100644
--- a/packages/client/src/data/comment.ts
+++ b/packages/client/src/data/comment.ts
@@ -29,7 +29,7 @@ export const useComments = (documentId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   const updateComment = useCallback(
@@ -41,7 +41,7 @@ export const useComments = (documentId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   const deleteComment = useCallback(
diff --git a/packages/client/src/data/document.ts b/packages/client/src/data/document.ts
index af888563..e2e9667e 100644
--- a/packages/client/src/data/document.ts
+++ b/packages/client/src/data/document.ts
@@ -59,7 +59,7 @@ export const useDocumentDetail = (documentId, options = null) => {
       mutate();
       return res;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   const toggleStatus = useCallback(
@@ -68,7 +68,7 @@ export const useDocumentDetail = (documentId, options = null) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   return { data, loading, error, update, toggleStatus };
@@ -118,7 +118,7 @@ export const useDocumentStar = (documentId) => {
       targetId: documentId,
     });
     mutate();
-  }, [mutate]);
+  }, [mutate, documentId]);
 
   return { data, error, toggleStar };
 };
@@ -198,7 +198,7 @@ export const useCollaborationDocument = (documentId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   const updateUser = useCallback(
@@ -210,7 +210,7 @@ export const useCollaborationDocument = (documentId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   const deleteUser = useCallback(
@@ -222,7 +222,7 @@ export const useCollaborationDocument = (documentId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, documentId]
   );
 
   return { users: data, loading, error, addUser, updateUser, deleteUser };
diff --git a/packages/client/src/data/template.ts b/packages/client/src/data/template.ts
index b2fa106c..68d4d4ef 100644
--- a/packages/client/src/data/template.ts
+++ b/packages/client/src/data/template.ts
@@ -62,12 +62,12 @@ export const useTemplate = (templateId) => {
       mutate();
       return ret as unknown as ITemplate;
     },
-    [mutate]
+    [mutate, templateId]
   );
 
   const deleteTemplate = useCallback(async () => {
     await HttpClient.post(`/template/delete/${templateId}`);
-  }, []);
+  }, [templateId]);
 
   return {
     data,
diff --git a/packages/client/src/data/wiki.tsx b/packages/client/src/data/wiki.tsx
index 3be1ea6b..cc4c955d 100644
--- a/packages/client/src/data/wiki.tsx
+++ b/packages/client/src/data/wiki.tsx
@@ -104,7 +104,7 @@ export const useWikiTocs = (wikiId) => {
       mutate();
       return res;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   return { data, loading, error, refresh: mutate, update };
@@ -143,7 +143,7 @@ export const useWikiDetail = (wikiId) => {
       mutate();
       return res;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   /**
@@ -157,7 +157,7 @@ export const useWikiDetail = (wikiId) => {
       mutate();
       return res;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   return { data, loading, error, update, toggleStatus };
@@ -178,7 +178,7 @@ export const useWikiUsers = (wikiId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   const updateUser = useCallback(
@@ -187,7 +187,7 @@ export const useWikiUsers = (wikiId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   const deleteUser = useCallback(
@@ -196,7 +196,7 @@ export const useWikiUsers = (wikiId) => {
       mutate();
       return ret;
     },
-    [mutate]
+    [mutate, wikiId]
   );
 
   return {
@@ -229,7 +229,7 @@ export const useWikiStar = (wikiId) => {
       targetId: wikiId,
     });
     mutate();
-  }, [mutate]);
+  }, [mutate, wikiId]);
 
   return { data, error, toggleStar };
 };
diff --git a/packages/client/src/pages/_app.tsx b/packages/client/src/pages/_app.tsx
index 5493bace..f089844d 100644
--- a/packages/client/src/pages/_app.tsx
+++ b/packages/client/src/pages/_app.tsx
@@ -2,9 +2,10 @@ import type { AppProps } from 'next/app';
 import Head from 'next/head';
 import React from 'react';
 import { useTheme } from 'hooks/use-theme';
+import 'tiptap/fix-match-nodes';
 import 'viewerjs/dist/viewer.css';
 import 'styles/globals.scss';
-import 'tiptap/styles/index.scss';
+import 'tiptap/core/styles/index.scss';
 
 function MyApp({ Component, pageProps }: AppProps) {
   useTheme();
diff --git a/packages/client/src/pages/feature/editor/index.tsx b/packages/client/src/pages/feature/editor/index.tsx
new file mode 100644
index 00000000..b2a073f1
--- /dev/null
+++ b/packages/client/src/pages/feature/editor/index.tsx
@@ -0,0 +1,29 @@
+import React, { useRef } from 'react';
+import { useRouter } from 'next/router';
+import { SingleColumnLayout } from 'layouts/single-column';
+import { ICollaborationEditorProps, CollaborationEditor, ICollaborationRefProps } from 'tiptap/editor';
+import { useUser } from 'data/user';
+
+const Page = () => {
+  const $container = useRef<HTMLDivElement>();
+  const { user } = useUser();
+
+  const { query } = useRouter();
+  const { type, id } = query as { type: ICollaborationEditorProps['type']; id: string };
+
+  return (
+    <SingleColumnLayout>
+      <div className="container" style={{ height: 400 }} ref={$container}>
+        {type && id ? (
+          <>
+            {user && <CollaborationEditor menubar editable user={user} id={id} type={type} />}
+            <br />
+            {user && <CollaborationEditor menubar editable user={user} id={id} type={type} />}
+          </>
+        ) : null}
+      </div>
+    </SingleColumnLayout>
+  );
+};
+
+export default Page;
diff --git a/packages/client/src/styles/reset.scss b/packages/client/src/styles/reset.scss
index 86c51556..4285162b 100644
--- a/packages/client/src/styles/reset.scss
+++ b/packages/client/src/styles/reset.scss
@@ -87,40 +87,3 @@ select {
     scroll-behavior: auto !important;
   }
 }
-
-::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-  background-color: transparent;
-}
-
-::-webkit-scrollbar-button {
-  width: 6px;
-  height: 6px;
-  background-color: transparent;
-}
-
-::-webkit-scrollbar-track {
-  background-color: transparent;
-}
-
-::-webkit-scrollbar-track-piece {
-  background-color: transparent;
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: transparent;
-  border-radius: 5px;
-}
-
-::-webkit-scrollbar-corner,
-::-webkit-resizer {
-  background-color: transparent;
-}
-
-*:hover {
-  &::-webkit-scrollbar-thumb &::-webkit-scrollbar-corner,
-  &::-webkit-resizer {
-    background-color: var(--scrollbar-bg);
-  }
-}
diff --git a/packages/client/src/tiptap/menus/_components/color-picker/index.tsx b/packages/client/src/tiptap/components/color-picker/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/menus/_components/color-picker/index.tsx
rename to packages/client/src/tiptap/components/color-picker/index.tsx
diff --git a/packages/client/src/tiptap/menus/_components/color-picker/style.module.scss b/packages/client/src/tiptap/components/color-picker/style.module.scss
similarity index 100%
rename from packages/client/src/tiptap/menus/_components/color-picker/style.module.scss
rename to packages/client/src/tiptap/components/color-picker/style.module.scss
diff --git a/packages/client/src/tiptap/divider.tsx b/packages/client/src/tiptap/components/divider.tsx
similarity index 100%
rename from packages/client/src/tiptap/divider.tsx
rename to packages/client/src/tiptap/components/divider.tsx
diff --git a/packages/client/src/tiptap/menus/_components/size.tsx b/packages/client/src/tiptap/components/size.tsx
similarity index 100%
rename from packages/client/src/tiptap/menus/_components/size.tsx
rename to packages/client/src/tiptap/components/size.tsx
diff --git a/packages/client/src/tiptap/skeleton.tsx b/packages/client/src/tiptap/components/skeleton.tsx
similarity index 100%
rename from packages/client/src/tiptap/skeleton.tsx
rename to packages/client/src/tiptap/components/skeleton.tsx
diff --git a/packages/client/src/tiptap/constants.ts b/packages/client/src/tiptap/core/constants.ts
similarity index 100%
rename from packages/client/src/tiptap/constants.ts
rename to packages/client/src/tiptap/core/constants.ts
diff --git a/packages/client/src/tiptap/extensions/attachment.ts b/packages/client/src/tiptap/core/extensions/attachment.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/attachment.ts
rename to packages/client/src/tiptap/core/extensions/attachment.ts
index f23a58f6..2f02970d 100644
--- a/packages/client/src/tiptap/extensions/attachment.ts
+++ b/packages/client/src/tiptap/core/extensions/attachment.ts
@@ -1,7 +1,7 @@
 import { Node, mergeAttributes } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
-import { AttachmentWrapper } from 'tiptap/wrappers/attachment';
+import { AttachmentWrapper } from 'tiptap/core/wrappers/attachment';
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
diff --git a/packages/client/src/tiptap/extensions/background-color.ts b/packages/client/src/tiptap/core/extensions/background-color.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/background-color.ts
rename to packages/client/src/tiptap/core/extensions/background-color.ts
diff --git a/packages/client/src/tiptap/extensions/blockquote.ts b/packages/client/src/tiptap/core/extensions/blockquote.ts
similarity index 88%
rename from packages/client/src/tiptap/extensions/blockquote.ts
rename to packages/client/src/tiptap/core/extensions/blockquote.ts
index 4cc04be1..31002b6a 100644
--- a/packages/client/src/tiptap/extensions/blockquote.ts
+++ b/packages/client/src/tiptap/core/extensions/blockquote.ts
@@ -1,7 +1,6 @@
 import { Blockquote as BuiltInBlockquote } from '@tiptap/extension-blockquote';
 import { wrappingInputRule } from '@tiptap/core';
-import { getParents } from 'tiptap/prose-utils';
-import { getMarkdownSource } from 'tiptap/markdown/markdown-to-prosemirror';
+import { getParents, getMarkdownSource } from 'tiptap/prose-utils';
 
 export const Blockquote = BuiltInBlockquote.extend({
   addAttributes() {
diff --git a/packages/client/src/tiptap/extensions/bold.ts b/packages/client/src/tiptap/core/extensions/bold.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/bold.ts
rename to packages/client/src/tiptap/core/extensions/bold.ts
diff --git a/packages/client/src/tiptap/extensions/bullet-list.ts b/packages/client/src/tiptap/core/extensions/bullet-list.ts
similarity index 84%
rename from packages/client/src/tiptap/extensions/bullet-list.ts
rename to packages/client/src/tiptap/core/extensions/bullet-list.ts
index 583ff579..f64a30fd 100644
--- a/packages/client/src/tiptap/extensions/bullet-list.ts
+++ b/packages/client/src/tiptap/core/extensions/bullet-list.ts
@@ -1,5 +1,5 @@
 import { BulletList as BuiltInBulletList } from '@tiptap/extension-bullet-list';
-import { getMarkdownSource } from 'tiptap/markdown/markdown-to-prosemirror';
+import { getMarkdownSource } from 'tiptap/prose-utils';
 
 export const BulletList = BuiltInBulletList.extend({
   addAttributes() {
diff --git a/packages/client/src/tiptap/extensions/callout.ts b/packages/client/src/tiptap/core/extensions/callout.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/callout.ts
rename to packages/client/src/tiptap/core/extensions/callout.ts
index b5bfb67c..afa83c29 100644
--- a/packages/client/src/tiptap/extensions/callout.ts
+++ b/packages/client/src/tiptap/core/extensions/callout.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { CalloutWrapper } from 'tiptap/wrappers/callout';
+import { CalloutWrapper } from 'tiptap/core/wrappers/callout';
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
diff --git a/packages/client/src/tiptap/extensions/code-block.ts b/packages/client/src/tiptap/core/extensions/code-block.ts
similarity index 99%
rename from packages/client/src/tiptap/extensions/code-block.ts
rename to packages/client/src/tiptap/core/extensions/code-block.ts
index dadfa9a0..f5e146f7 100644
--- a/packages/client/src/tiptap/extensions/code-block.ts
+++ b/packages/client/src/tiptap/core/extensions/code-block.ts
@@ -3,7 +3,7 @@ import { Plugin, PluginKey, TextSelection } from 'prosemirror-state';
 import { ReactNodeViewRenderer } from '@tiptap/react';
 import { lowlight } from 'lowlight/lib/all';
 import { LowlightPlugin } from 'tiptap/prose-utils';
-import { CodeBlockWrapper } from 'tiptap/wrappers/code-block';
+import { CodeBlockWrapper } from 'tiptap/core/wrappers/code-block';
 
 export interface CodeBlockOptions {
   /**
diff --git a/packages/client/src/tiptap/extensions/code.ts b/packages/client/src/tiptap/core/extensions/code.ts
similarity index 81%
rename from packages/client/src/tiptap/extensions/code.ts
rename to packages/client/src/tiptap/core/extensions/code.ts
index 097ed8bd..2afdee3c 100644
--- a/packages/client/src/tiptap/extensions/code.ts
+++ b/packages/client/src/tiptap/core/extensions/code.ts
@@ -1,5 +1,5 @@
 import BuiltInCode from '@tiptap/extension-code';
-import { EXTENSION_PRIORITY_LOWER } from 'tiptap/constants';
+import { EXTENSION_PRIORITY_LOWER } from 'tiptap/core/constants';
 
 export const Code = BuiltInCode.extend({
   excludes: null,
diff --git a/packages/client/src/tiptap/extensions/collaboration-cursor/cursor-plugin/index.ts b/packages/client/src/tiptap/core/extensions/collaboration-cursor/cursor-plugin/index.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/collaboration-cursor/cursor-plugin/index.ts
rename to packages/client/src/tiptap/core/extensions/collaboration-cursor/cursor-plugin/index.ts
diff --git a/packages/client/src/tiptap/extensions/collaboration-cursor/index.ts b/packages/client/src/tiptap/core/extensions/collaboration-cursor/index.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/collaboration-cursor/index.ts
rename to packages/client/src/tiptap/core/extensions/collaboration-cursor/index.ts
diff --git a/packages/client/src/tiptap/extensions/collaboration/collaboration.ts b/packages/client/src/tiptap/core/extensions/collaboration/collaboration.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/collaboration/collaboration.ts
rename to packages/client/src/tiptap/core/extensions/collaboration/collaboration.ts
diff --git a/packages/client/src/tiptap/extensions/collaboration/helpers/is-change-origin.ts b/packages/client/src/tiptap/core/extensions/collaboration/helpers/is-change-origin.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/collaboration/helpers/is-change-origin.ts
rename to packages/client/src/tiptap/core/extensions/collaboration/helpers/is-change-origin.ts
diff --git a/packages/client/src/tiptap/extensions/collaboration/index.ts b/packages/client/src/tiptap/core/extensions/collaboration/index.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/collaboration/index.ts
rename to packages/client/src/tiptap/core/extensions/collaboration/index.ts
diff --git a/packages/client/src/tiptap/extensions/color-highlighter.ts b/packages/client/src/tiptap/core/extensions/color-highlighter.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/color-highlighter.ts
rename to packages/client/src/tiptap/core/extensions/color-highlighter.ts
diff --git a/packages/client/src/tiptap/extensions/color.ts b/packages/client/src/tiptap/core/extensions/color.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/color.ts
rename to packages/client/src/tiptap/core/extensions/color.ts
diff --git a/packages/client/src/tiptap/extensions/countdown.ts b/packages/client/src/tiptap/core/extensions/countdown.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/countdown.ts
rename to packages/client/src/tiptap/core/extensions/countdown.ts
index 95e29fb2..373a641a 100644
--- a/packages/client/src/tiptap/extensions/countdown.ts
+++ b/packages/client/src/tiptap/core/extensions/countdown.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { CountdownWrapper } from 'tiptap/wrappers/countdown';
+import { CountdownWrapper } from 'tiptap/core/wrappers/countdown';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 declare module '@tiptap/core' {
diff --git a/packages/client/src/tiptap/extensions/document-children.ts b/packages/client/src/tiptap/core/extensions/document-children.ts
similarity index 94%
rename from packages/client/src/tiptap/extensions/document-children.ts
rename to packages/client/src/tiptap/core/extensions/document-children.ts
index f2498d41..9bd3d99b 100644
--- a/packages/client/src/tiptap/extensions/document-children.ts
+++ b/packages/client/src/tiptap/core/extensions/document-children.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { DocumentChildrenWrapper } from 'tiptap/wrappers/document-children';
+import { DocumentChildrenWrapper } from 'tiptap/core/wrappers/document-children';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 declare module '@tiptap/core' {
diff --git a/packages/client/src/tiptap/extensions/document-reference.ts b/packages/client/src/tiptap/core/extensions/document-reference.ts
similarity index 95%
rename from packages/client/src/tiptap/extensions/document-reference.ts
rename to packages/client/src/tiptap/core/extensions/document-reference.ts
index 9ea65d77..2113906e 100644
--- a/packages/client/src/tiptap/extensions/document-reference.ts
+++ b/packages/client/src/tiptap/core/extensions/document-reference.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { DocumentReferenceWrapper } from 'tiptap/wrappers/document-reference';
+import { DocumentReferenceWrapper } from 'tiptap/core/wrappers/document-reference';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 declare module '@tiptap/core' {
diff --git a/packages/client/src/tiptap/extensions/document.ts b/packages/client/src/tiptap/core/extensions/document.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/document.ts
rename to packages/client/src/tiptap/core/extensions/document.ts
diff --git a/packages/client/src/tiptap/extensions/dropcursor.ts b/packages/client/src/tiptap/core/extensions/dropcursor.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/dropcursor.ts
rename to packages/client/src/tiptap/core/extensions/dropcursor.ts
diff --git a/packages/client/src/tiptap/extensions/emoji.ts b/packages/client/src/tiptap/core/extensions/emoji.ts
similarity index 94%
rename from packages/client/src/tiptap/extensions/emoji.ts
rename to packages/client/src/tiptap/core/extensions/emoji.ts
index 4e46af3a..9d0d8cb0 100644
--- a/packages/client/src/tiptap/extensions/emoji.ts
+++ b/packages/client/src/tiptap/core/extensions/emoji.ts
@@ -3,9 +3,9 @@ import { ReactRenderer } from '@tiptap/react';
 import { Plugin, PluginKey } from 'prosemirror-state';
 import Suggestion from '@tiptap/suggestion';
 import tippy from 'tippy.js';
-import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/constants';
-import { EmojiList } from 'tiptap/wrappers/emoji-list';
-import { emojiSearch, emojisToName } from 'tiptap/wrappers/emoji-list/emojis';
+import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
+import { EmojiList } from 'tiptap/core/wrappers/emoji-list';
+import { emojiSearch, emojisToName } from 'tiptap/core/wrappers/emoji-list/emojis';
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
diff --git a/packages/client/src/tiptap/core/extensions/event-emitter.ts b/packages/client/src/tiptap/core/extensions/event-emitter.ts
new file mode 100644
index 00000000..5e24f131
--- /dev/null
+++ b/packages/client/src/tiptap/core/extensions/event-emitter.ts
@@ -0,0 +1,19 @@
+import { Extension } from '@tiptap/core';
+import { EventEmitter as Em } from 'helpers/event-emitter';
+import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
+
+const event = new Em();
+
+/**
+ * 添加事件能力
+ */
+export const EventEmitter = Extension.create({
+  name: 'eventEmitter',
+  priority: EXTENSION_PRIORITY_HIGHEST,
+  addOptions() {
+    return { eventEmitter: event };
+  },
+  addStorage() {
+    return this.options;
+  },
+});
diff --git a/packages/client/src/tiptap/extensions/focus.ts b/packages/client/src/tiptap/core/extensions/focus.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/focus.ts
rename to packages/client/src/tiptap/core/extensions/focus.ts
diff --git a/packages/client/src/tiptap/extensions/font-size.ts b/packages/client/src/tiptap/core/extensions/font-size.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/font-size.ts
rename to packages/client/src/tiptap/core/extensions/font-size.ts
diff --git a/packages/client/src/tiptap/extensions/gapcursor.ts b/packages/client/src/tiptap/core/extensions/gapcursor.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/gapcursor.ts
rename to packages/client/src/tiptap/core/extensions/gapcursor.ts
diff --git a/packages/client/src/tiptap/extensions/hard-break.ts b/packages/client/src/tiptap/core/extensions/hard-break.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/hard-break.ts
rename to packages/client/src/tiptap/core/extensions/hard-break.ts
diff --git a/packages/client/src/tiptap/extensions/heading.ts b/packages/client/src/tiptap/core/extensions/heading.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/heading.ts
rename to packages/client/src/tiptap/core/extensions/heading.ts
diff --git a/packages/client/src/tiptap/extensions/horizontal-rule.ts b/packages/client/src/tiptap/core/extensions/horizontal-rule.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/horizontal-rule.ts
rename to packages/client/src/tiptap/core/extensions/horizontal-rule.ts
diff --git a/packages/client/src/tiptap/extensions/html-marks.ts b/packages/client/src/tiptap/core/extensions/html-marks.ts
similarity index 94%
rename from packages/client/src/tiptap/extensions/html-marks.ts
rename to packages/client/src/tiptap/core/extensions/html-marks.ts
index 5ed3c868..ffc637fe 100644
--- a/packages/client/src/tiptap/extensions/html-marks.ts
+++ b/packages/client/src/tiptap/core/extensions/html-marks.ts
@@ -1,5 +1,5 @@
 import { Mark, mergeAttributes, markInputRule } from '@tiptap/core';
-import { PARSE_HTML_PRIORITY_LOWEST } from 'tiptap/constants';
+import { PARSE_HTML_PRIORITY_LOWEST } from 'tiptap/core/constants';
 import { markInputRegex, extractMarkAttributesFromMatch } from 'tiptap/prose-utils';
 
 export const marks = [{ name: 'underline', tag: 'u' }];
diff --git a/packages/client/src/tiptap/extensions/iframe.ts b/packages/client/src/tiptap/core/extensions/iframe.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/iframe.ts
rename to packages/client/src/tiptap/core/extensions/iframe.ts
index 9fc37937..f3949bda 100644
--- a/packages/client/src/tiptap/extensions/iframe.ts
+++ b/packages/client/src/tiptap/core/extensions/iframe.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { IframeWrapper } from 'tiptap/wrappers/iframe';
+import { IframeWrapper } from 'tiptap/core/wrappers/iframe';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 declare module '@tiptap/core' {
diff --git a/packages/client/src/tiptap/extensions/image.ts b/packages/client/src/tiptap/core/extensions/image.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/image.ts
rename to packages/client/src/tiptap/core/extensions/image.ts
index c3721553..2d252ed5 100644
--- a/packages/client/src/tiptap/extensions/image.ts
+++ b/packages/client/src/tiptap/core/extensions/image.ts
@@ -1,6 +1,6 @@
 import { Image as BuiltInImage } from '@tiptap/extension-image';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { ImageWrapper } from 'tiptap/wrappers/image';
+import { ImageWrapper } from 'tiptap/core/wrappers/image';
 
 const resolveImageEl = (element) => (element.nodeName === 'IMG' ? element : element.querySelector('img'));
 
diff --git a/packages/client/src/tiptap/extensions/indent.ts b/packages/client/src/tiptap/core/extensions/indent.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/indent.ts
rename to packages/client/src/tiptap/core/extensions/indent.ts
diff --git a/packages/client/src/tiptap/extensions/italic.ts b/packages/client/src/tiptap/core/extensions/italic.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/italic.ts
rename to packages/client/src/tiptap/core/extensions/italic.ts
diff --git a/packages/client/src/tiptap/extensions/katex.ts b/packages/client/src/tiptap/core/extensions/katex.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/katex.ts
rename to packages/client/src/tiptap/core/extensions/katex.ts
index 06f74b40..959fc3ef 100644
--- a/packages/client/src/tiptap/extensions/katex.ts
+++ b/packages/client/src/tiptap/core/extensions/katex.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes, nodeInputRule } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { KatexWrapper } from 'tiptap/wrappers/katex';
+import { KatexWrapper } from 'tiptap/core/wrappers/katex';
 
 type IKatexAttrs = {
   text?: string;
diff --git a/packages/client/src/tiptap/extensions/link.ts b/packages/client/src/tiptap/core/extensions/link.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/link.ts
rename to packages/client/src/tiptap/core/extensions/link.ts
diff --git a/packages/client/src/tiptap/extensions/listItem.ts b/packages/client/src/tiptap/core/extensions/listItem.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/listItem.ts
rename to packages/client/src/tiptap/core/extensions/listItem.ts
diff --git a/packages/client/src/tiptap/extensions/loading.ts b/packages/client/src/tiptap/core/extensions/loading.ts
similarity index 85%
rename from packages/client/src/tiptap/extensions/loading.ts
rename to packages/client/src/tiptap/core/extensions/loading.ts
index 6edaafb2..5965ffe1 100644
--- a/packages/client/src/tiptap/extensions/loading.ts
+++ b/packages/client/src/tiptap/core/extensions/loading.ts
@@ -1,6 +1,6 @@
 import { Node } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { LoadingWrapper } from 'tiptap/wrappers/loading';
+import { LoadingWrapper } from 'tiptap/core/wrappers/loading';
 
 export const Loading = Node.create({
   name: 'loading',
diff --git a/packages/client/src/tiptap/extensions/mention.ts b/packages/client/src/tiptap/core/extensions/mention.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/mention.ts
rename to packages/client/src/tiptap/core/extensions/mention.ts
index e4af7f9a..bd30c28c 100644
--- a/packages/client/src/tiptap/extensions/mention.ts
+++ b/packages/client/src/tiptap/core/extensions/mention.ts
@@ -3,7 +3,7 @@ import { ReactRenderer } from '@tiptap/react';
 import tippy from 'tippy.js';
 import { getUsers } from 'services/user';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
-import { MentionList } from 'tiptap/wrappers/mention-list';
+import { MentionList } from 'tiptap/core/wrappers/mention-list';
 
 const suggestion = {
   items: async ({ query }) => {
diff --git a/packages/client/src/tiptap/extensions/mind.ts b/packages/client/src/tiptap/core/extensions/mind.ts
similarity index 98%
rename from packages/client/src/tiptap/extensions/mind.ts
rename to packages/client/src/tiptap/core/extensions/mind.ts
index 0d0ec1ae..bf94f61d 100644
--- a/packages/client/src/tiptap/extensions/mind.ts
+++ b/packages/client/src/tiptap/core/extensions/mind.ts
@@ -1,7 +1,7 @@
 import { Node, mergeAttributes, nodeInputRule } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
 import { Plugin, PluginKey } from 'prosemirror-state';
-import { MindWrapper } from 'tiptap/wrappers/mind';
+import { MindWrapper } from 'tiptap/core/wrappers/mind';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 const DEFAULT_MIND_DATA = {
diff --git a/packages/client/src/tiptap/extensions/ordered-list.ts b/packages/client/src/tiptap/core/extensions/ordered-list.ts
similarity index 81%
rename from packages/client/src/tiptap/extensions/ordered-list.ts
rename to packages/client/src/tiptap/core/extensions/ordered-list.ts
index 8fe72ca9..bc8bcf2a 100644
--- a/packages/client/src/tiptap/extensions/ordered-list.ts
+++ b/packages/client/src/tiptap/core/extensions/ordered-list.ts
@@ -1,5 +1,5 @@
 import { OrderedList as BuiltInOrderedList } from '@tiptap/extension-ordered-list';
-import { getMarkdownSource } from 'tiptap/markdown/markdown-to-prosemirror';
+import { getMarkdownSource } from 'tiptap/prose-utils';
 
 export const OrderedList = BuiltInOrderedList.extend({
   addAttributes() {
diff --git a/packages/client/src/tiptap/extensions/paragraph.ts b/packages/client/src/tiptap/core/extensions/paragraph.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/paragraph.ts
rename to packages/client/src/tiptap/core/extensions/paragraph.ts
diff --git a/packages/client/src/tiptap/extensions/paste.ts b/packages/client/src/tiptap/core/extensions/paste.ts
similarity index 81%
rename from packages/client/src/tiptap/extensions/paste.ts
rename to packages/client/src/tiptap/core/extensions/paste.ts
index 30535081..6f3dce54 100644
--- a/packages/client/src/tiptap/extensions/paste.ts
+++ b/packages/client/src/tiptap/core/extensions/paste.ts
@@ -1,16 +1,30 @@
 import { Extension } from '@tiptap/core';
 import { Plugin, PluginKey } from 'prosemirror-state';
-import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/constants';
+import { Schema, Fragment } from 'prosemirror-model';
+import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
 import { handleFileEvent, isInCode, LANGUAGES, isTitleNode } from 'tiptap/prose-utils';
-import {
-  isMarkdown,
-  normalizePastedMarkdown,
-  markdownToProsemirror,
-  prosemirrorToMarkdown,
-} from 'tiptap/markdown/markdown-to-prosemirror';
-import { copyNode } from 'tiptap/prose-utils';
+import { copyNode, isMarkdown, normalizeMarkdown } from 'tiptap/prose-utils';
 import { safeJSONParse } from 'helpers/json';
 
+interface IPasteOptions {
+  /**
+   *
+   * 将 markdown 转换为 html
+   */
+  markdownToHTML: (arg: string) => string;
+
+  /**
+   * 将 markdown 转换为 prosemirror 节点
+   * FIXME: prosemirror 节点的类型是什么？
+   */
+  markdownToProsemirror: (arg: { schema: Schema; content: string; hasTitle: boolean }) => unknown;
+
+  /**
+   * 将 prosemirror 转换为 markdown
+   */
+  prosemirrorToMarkdown: (arg: { content: Fragment }) => string;
+}
+
 const isPureText = (content): boolean => {
   if (!content) return false;
 
@@ -27,11 +41,25 @@ const isPureText = (content): boolean => {
   return content['type'] === 'text';
 };
 
-export const Paste = Extension.create({
+export const Paste = Extension.create<IPasteOptions>({
   name: 'paste',
   priority: EXTENSION_PRIORITY_HIGHEST,
+
+  addOptions() {
+    return {
+      markdownToHTML: (arg) => arg,
+      markdownToProsemirror: (arg) => arg.content,
+      prosemirrorToMarkdown: (arg) => String(arg.content),
+    };
+  },
+
+  addStorage() {
+    return this.options;
+  },
+
   addProseMirrorPlugins() {
-    const { editor } = this;
+    const extensionThis = this;
+    const { editor } = extensionThis;
 
     return [
       new Plugin({
@@ -41,9 +69,8 @@ export const Paste = Extension.create({
             if (view.props.editable && !view.props.editable(view.state)) {
               return false;
             }
-
             if (!event.clipboardData) return false;
-
+            // 文件
             const files = Array.from(event.clipboardData.files);
             if (files.length) {
               event.preventDefault();
@@ -53,12 +80,14 @@ export const Paste = Extension.create({
               return true;
             }
 
+            const { markdownToProsemirror } = extensionThis.options;
             const text = event.clipboardData.getData('text/plain');
             const html = event.clipboardData.getData('text/html');
             const vscode = event.clipboardData.getData('vscode-editor-data');
             const node = event.clipboardData.getData('text/node');
             const markdownText = event.clipboardData.getData('text/markdown');
 
+            // 直接复制节点
             if (node) {
               const doc = safeJSONParse(node);
               const tr = view.state.tr;
@@ -98,7 +127,7 @@ export const Paste = Extension.create({
               const schema = view.props.state.schema;
               const doc = markdownToProsemirror({
                 schema,
-                content: normalizePastedMarkdown(markdownText || text),
+                content: normalizeMarkdown(markdownText || text),
                 hasTitle,
               });
               let tr = view.state.tr;
@@ -111,13 +140,11 @@ export const Paste = Extension.create({
               view.dispatch(tr.scrollIntoView());
               return true;
             }
-
             if (text.length !== 0) {
               event.preventDefault();
               view.dispatch(view.state.tr.insertText(text));
               return true;
             }
-
             return false;
           },
           handleDrop: (view, event: any) => {
@@ -171,7 +198,7 @@ export const Paste = Extension.create({
             if (!doc) {
               return '';
             }
-            const content = prosemirrorToMarkdown({
+            const content = extensionThis.options.prosemirrorToMarkdown({
               content: doc,
             });
             return content;
diff --git a/packages/client/src/tiptap/extensions/placeholder.ts b/packages/client/src/tiptap/core/extensions/placeholder.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/placeholder.ts
rename to packages/client/src/tiptap/core/extensions/placeholder.ts
diff --git a/packages/client/src/tiptap/extensions/quick-insert.tsx b/packages/client/src/tiptap/core/extensions/quick-insert.tsx
similarity index 95%
rename from packages/client/src/tiptap/extensions/quick-insert.tsx
rename to packages/client/src/tiptap/core/extensions/quick-insert.tsx
index edb1131d..f1ea1bf8 100644
--- a/packages/client/src/tiptap/extensions/quick-insert.tsx
+++ b/packages/client/src/tiptap/core/extensions/quick-insert.tsx
@@ -3,9 +3,9 @@ import { Node } from '@tiptap/core';
 import { ReactRenderer } from '@tiptap/react';
 import { Plugin, PluginKey } from 'prosemirror-state';
 import Suggestion from '@tiptap/suggestion';
-import { MenuList } from 'tiptap/wrappers/menu-list';
-import { QUICK_INSERT_ITEMS } from 'tiptap/menus/quick-insert';
-import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/constants';
+import { MenuList } from 'tiptap/core/wrappers/menu-list';
+import { QUICK_INSERT_ITEMS } from 'tiptap/editor/menus/quick-insert';
+import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
 
 export const QuickInsertPluginKey = new PluginKey('quickInsert');
 
diff --git a/packages/client/src/tiptap/extensions/search.ts b/packages/client/src/tiptap/core/extensions/search.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/search.ts
rename to packages/client/src/tiptap/core/extensions/search.ts
diff --git a/packages/client/src/tiptap/extensions/selection.ts b/packages/client/src/tiptap/core/extensions/selection.ts
similarity index 98%
rename from packages/client/src/tiptap/extensions/selection.ts
rename to packages/client/src/tiptap/core/extensions/selection.ts
index 0c77e734..e612c903 100644
--- a/packages/client/src/tiptap/extensions/selection.ts
+++ b/packages/client/src/tiptap/core/extensions/selection.ts
@@ -2,7 +2,7 @@ import { Extension } from '@tiptap/core';
 import { Plugin, PluginKey, NodeSelection, TextSelection, Selection, AllSelection } from 'prosemirror-state';
 import { Decoration, DecorationSet } from 'prosemirror-view';
 import { getCurrentNode, isInCodeBlock, isInCallout } from 'tiptap/prose-utils';
-import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/constants';
+import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
 
 export const selectionPluginKey = new PluginKey('selection');
 
diff --git a/packages/client/src/tiptap/extensions/status.ts b/packages/client/src/tiptap/core/extensions/status.ts
similarity index 96%
rename from packages/client/src/tiptap/extensions/status.ts
rename to packages/client/src/tiptap/core/extensions/status.ts
index 9e02fb2e..de5be4b9 100644
--- a/packages/client/src/tiptap/extensions/status.ts
+++ b/packages/client/src/tiptap/core/extensions/status.ts
@@ -1,6 +1,6 @@
 import { Node, mergeAttributes } from '@tiptap/core';
 import { ReactNodeViewRenderer } from '@tiptap/react';
-import { StatusWrapper } from 'tiptap/wrappers/status';
+import { StatusWrapper } from 'tiptap/core/wrappers/status';
 import { getDatasetAttribute } from 'tiptap/prose-utils';
 
 type IStatusAttrs = {
diff --git a/packages/client/src/tiptap/extensions/strike.ts b/packages/client/src/tiptap/core/extensions/strike.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/strike.ts
rename to packages/client/src/tiptap/core/extensions/strike.ts
diff --git a/packages/client/src/tiptap/extensions/subscript.ts b/packages/client/src/tiptap/core/extensions/subscript.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/subscript.ts
rename to packages/client/src/tiptap/core/extensions/subscript.ts
diff --git a/packages/client/src/tiptap/extensions/superscript.ts b/packages/client/src/tiptap/core/extensions/superscript.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/superscript.ts
rename to packages/client/src/tiptap/core/extensions/superscript.ts
diff --git a/packages/client/src/tiptap/extensions/table-cell.tsx b/packages/client/src/tiptap/core/extensions/table-cell.tsx
similarity index 100%
rename from packages/client/src/tiptap/extensions/table-cell.tsx
rename to packages/client/src/tiptap/core/extensions/table-cell.tsx
diff --git a/packages/client/src/tiptap/extensions/table-header.tsx b/packages/client/src/tiptap/core/extensions/table-header.tsx
similarity index 100%
rename from packages/client/src/tiptap/extensions/table-header.tsx
rename to packages/client/src/tiptap/core/extensions/table-header.tsx
diff --git a/packages/client/src/tiptap/extensions/table-row.ts b/packages/client/src/tiptap/core/extensions/table-row.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/table-row.ts
rename to packages/client/src/tiptap/core/extensions/table-row.ts
diff --git a/packages/client/src/tiptap/extensions/table.ts b/packages/client/src/tiptap/core/extensions/table.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/table.ts
rename to packages/client/src/tiptap/core/extensions/table.ts
diff --git a/packages/client/src/tiptap/extensions/task-item.ts b/packages/client/src/tiptap/core/extensions/task-item.ts
similarity index 98%
rename from packages/client/src/tiptap/extensions/task-item.ts
rename to packages/client/src/tiptap/core/extensions/task-item.ts
index 1915b7cf..3d1c09b0 100644
--- a/packages/client/src/tiptap/extensions/task-item.ts
+++ b/packages/client/src/tiptap/core/extensions/task-item.ts
@@ -2,7 +2,7 @@ import { wrappingInputRule } from '@tiptap/core';
 import { TaskItem as BuiltInTaskItem } from '@tiptap/extension-task-item';
 import { Plugin } from 'prosemirror-state';
 import { findParentNodeClosestToPos } from 'prosemirror-utils';
-import { PARSE_HTML_PRIORITY_HIGHEST } from 'tiptap/constants';
+import { PARSE_HTML_PRIORITY_HIGHEST } from 'tiptap/core/constants';
 
 const CustomTaskItem = BuiltInTaskItem.extend({
   parseHTML() {
diff --git a/packages/client/src/tiptap/extensions/task-list.ts b/packages/client/src/tiptap/core/extensions/task-list.ts
similarity index 79%
rename from packages/client/src/tiptap/extensions/task-list.ts
rename to packages/client/src/tiptap/core/extensions/task-list.ts
index dedb4e99..04743e4b 100644
--- a/packages/client/src/tiptap/extensions/task-list.ts
+++ b/packages/client/src/tiptap/core/extensions/task-list.ts
@@ -1,5 +1,5 @@
 import { TaskList as BuiltInTaskList } from '@tiptap/extension-task-list';
-import { PARSE_HTML_PRIORITY_HIGHEST } from 'tiptap/constants';
+import { PARSE_HTML_PRIORITY_HIGHEST } from 'tiptap/core/constants';
 
 export const TaskList = BuiltInTaskList.extend({
   parseHTML() {
diff --git a/packages/client/src/tiptap/extensions/text-align.ts b/packages/client/src/tiptap/core/extensions/text-align.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/text-align.ts
rename to packages/client/src/tiptap/core/extensions/text-align.ts
diff --git a/packages/client/src/tiptap/extensions/text-style.ts b/packages/client/src/tiptap/core/extensions/text-style.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/text-style.ts
rename to packages/client/src/tiptap/core/extensions/text-style.ts
diff --git a/packages/client/src/tiptap/extensions/text.ts b/packages/client/src/tiptap/core/extensions/text.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/text.ts
rename to packages/client/src/tiptap/core/extensions/text.ts
diff --git a/packages/client/src/tiptap/extensions/title.tsx b/packages/client/src/tiptap/core/extensions/title.tsx
similarity index 100%
rename from packages/client/src/tiptap/extensions/title.tsx
rename to packages/client/src/tiptap/core/extensions/title.tsx
diff --git a/packages/client/src/tiptap/extensions/trailing-node.ts b/packages/client/src/tiptap/core/extensions/trailing-node.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/trailing-node.ts
rename to packages/client/src/tiptap/core/extensions/trailing-node.ts
diff --git a/packages/client/src/tiptap/extensions/underline.ts b/packages/client/src/tiptap/core/extensions/underline.ts
similarity index 100%
rename from packages/client/src/tiptap/extensions/underline.ts
rename to packages/client/src/tiptap/core/extensions/underline.ts
diff --git a/packages/client/src/tiptap/styles/base.scss b/packages/client/src/tiptap/core/styles/base.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/base.scss
rename to packages/client/src/tiptap/core/styles/base.scss
diff --git a/packages/client/src/tiptap/styles/code.scss b/packages/client/src/tiptap/core/styles/code.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/code.scss
rename to packages/client/src/tiptap/core/styles/code.scss
diff --git a/packages/client/src/tiptap/styles/collaboration.scss b/packages/client/src/tiptap/core/styles/collaboration.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/collaboration.scss
rename to packages/client/src/tiptap/core/styles/collaboration.scss
diff --git a/packages/client/src/tiptap/styles/color.scss b/packages/client/src/tiptap/core/styles/color.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/color.scss
rename to packages/client/src/tiptap/core/styles/color.scss
diff --git a/packages/client/src/tiptap/styles/heading.scss b/packages/client/src/tiptap/core/styles/heading.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/heading.scss
rename to packages/client/src/tiptap/core/styles/heading.scss
diff --git a/packages/client/src/tiptap/styles/index.scss b/packages/client/src/tiptap/core/styles/index.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/index.scss
rename to packages/client/src/tiptap/core/styles/index.scss
diff --git a/packages/client/src/tiptap/styles/katex.scss b/packages/client/src/tiptap/core/styles/katex.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/katex.scss
rename to packages/client/src/tiptap/core/styles/katex.scss
diff --git a/packages/client/src/tiptap/styles/list.scss b/packages/client/src/tiptap/core/styles/list.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/list.scss
rename to packages/client/src/tiptap/core/styles/list.scss
diff --git a/packages/client/src/tiptap/styles/lock.scss b/packages/client/src/tiptap/core/styles/lock.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/lock.scss
rename to packages/client/src/tiptap/core/styles/lock.scss
diff --git a/packages/client/src/tiptap/styles/mention.scss b/packages/client/src/tiptap/core/styles/mention.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mention.scss
rename to packages/client/src/tiptap/core/styles/mention.scss
diff --git a/packages/client/src/tiptap/styles/menu.scss b/packages/client/src/tiptap/core/styles/menu.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/menu.scss
rename to packages/client/src/tiptap/core/styles/menu.scss
diff --git a/packages/client/src/tiptap/styles/mind/context-menu.scss b/packages/client/src/tiptap/core/styles/mind/context-menu.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/context-menu.scss
rename to packages/client/src/tiptap/core/styles/mind/context-menu.scss
diff --git a/packages/client/src/tiptap/styles/mind/index.scss b/packages/client/src/tiptap/core/styles/mind/index.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/index.scss
rename to packages/client/src/tiptap/core/styles/mind/index.scss
diff --git a/packages/client/src/tiptap/styles/mind/mind.scss b/packages/client/src/tiptap/core/styles/mind/mind.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/mind.scss
rename to packages/client/src/tiptap/core/styles/mind/mind.scss
diff --git a/packages/client/src/tiptap/styles/mind/mobile-menu.scss b/packages/client/src/tiptap/core/styles/mind/mobile-menu.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/mobile-menu.scss
rename to packages/client/src/tiptap/core/styles/mind/mobile-menu.scss
diff --git a/packages/client/src/tiptap/styles/mind/node-menu.scss b/packages/client/src/tiptap/core/styles/mind/node-menu.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/node-menu.scss
rename to packages/client/src/tiptap/core/styles/mind/node-menu.scss
diff --git a/packages/client/src/tiptap/styles/mind/toolbar.scss b/packages/client/src/tiptap/core/styles/mind/toolbar.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/mind/toolbar.scss
rename to packages/client/src/tiptap/core/styles/mind/toolbar.scss
diff --git a/packages/client/src/tiptap/styles/node.scss b/packages/client/src/tiptap/core/styles/node.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/node.scss
rename to packages/client/src/tiptap/core/styles/node.scss
diff --git a/packages/client/src/tiptap/styles/placeholder.scss b/packages/client/src/tiptap/core/styles/placeholder.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/placeholder.scss
rename to packages/client/src/tiptap/core/styles/placeholder.scss
diff --git a/packages/client/src/tiptap/styles/search.scss b/packages/client/src/tiptap/core/styles/search.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/search.scss
rename to packages/client/src/tiptap/core/styles/search.scss
diff --git a/packages/client/src/tiptap/styles/selection.scss b/packages/client/src/tiptap/core/styles/selection.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/selection.scss
rename to packages/client/src/tiptap/core/styles/selection.scss
diff --git a/packages/client/src/tiptap/styles/table.scss b/packages/client/src/tiptap/core/styles/table.scss
similarity index 96%
rename from packages/client/src/tiptap/styles/table.scss
rename to packages/client/src/tiptap/core/styles/table.scss
index fbb1b2a6..0b5fca3b 100644
--- a/packages/client/src/tiptap/styles/table.scss
+++ b/packages/client/src/tiptap/core/styles/table.scss
@@ -1,7 +1,9 @@
 .ProseMirror {
   .tableWrapper {
+    max-width: 100%;
     padding: 0;
     margin: 0;
+    overflow: auto;
   }
 
   table {
diff --git a/packages/client/src/tiptap/styles/title.scss b/packages/client/src/tiptap/core/styles/title.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/title.scss
rename to packages/client/src/tiptap/core/styles/title.scss
diff --git a/packages/client/src/tiptap/styles/var.scss b/packages/client/src/tiptap/core/styles/var.scss
similarity index 100%
rename from packages/client/src/tiptap/styles/var.scss
rename to packages/client/src/tiptap/core/styles/var.scss
diff --git a/packages/client/src/tiptap/wrappers/attachment/file-icon.tsx b/packages/client/src/tiptap/core/wrappers/attachment/file-icon.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/file-icon.tsx
rename to packages/client/src/tiptap/core/wrappers/attachment/file-icon.tsx
diff --git a/packages/client/src/tiptap/wrappers/attachment/index.module.scss b/packages/client/src/tiptap/core/wrappers/attachment/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/attachment/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/attachment/index.tsx b/packages/client/src/tiptap/core/wrappers/attachment/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/index.tsx
rename to packages/client/src/tiptap/core/wrappers/attachment/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/attachment/player/index.module.scss b/packages/client/src/tiptap/core/wrappers/attachment/player/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/player/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/attachment/player/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/attachment/player/index.tsx b/packages/client/src/tiptap/core/wrappers/attachment/player/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/player/index.tsx
rename to packages/client/src/tiptap/core/wrappers/attachment/player/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/attachment/player/pdf-player/index.module.scss b/packages/client/src/tiptap/core/wrappers/attachment/player/pdf-player/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/player/pdf-player/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/attachment/player/pdf-player/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/attachment/player/pdf-player/index.tsx b/packages/client/src/tiptap/core/wrappers/attachment/player/pdf-player/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/attachment/player/pdf-player/index.tsx
rename to packages/client/src/tiptap/core/wrappers/attachment/player/pdf-player/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/callout/index.module.scss b/packages/client/src/tiptap/core/wrappers/callout/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/callout/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/callout/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/callout/index.tsx b/packages/client/src/tiptap/core/wrappers/callout/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/callout/index.tsx
rename to packages/client/src/tiptap/core/wrappers/callout/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/code-block/index.module.scss b/packages/client/src/tiptap/core/wrappers/code-block/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/code-block/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/code-block/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/code-block/index.tsx b/packages/client/src/tiptap/core/wrappers/code-block/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/code-block/index.tsx
rename to packages/client/src/tiptap/core/wrappers/code-block/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/countdown/index.module.scss b/packages/client/src/tiptap/core/wrappers/countdown/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/countdown/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/countdown/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/countdown/index.tsx b/packages/client/src/tiptap/core/wrappers/countdown/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/countdown/index.tsx
rename to packages/client/src/tiptap/core/wrappers/countdown/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/document-children/index.module.scss b/packages/client/src/tiptap/core/wrappers/document-children/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/document-children/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/document-children/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/document-children/index.tsx b/packages/client/src/tiptap/core/wrappers/document-children/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/document-children/index.tsx
rename to packages/client/src/tiptap/core/wrappers/document-children/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/document-reference/index.module.scss b/packages/client/src/tiptap/core/wrappers/document-reference/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/document-reference/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/document-reference/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/document-reference/index.tsx b/packages/client/src/tiptap/core/wrappers/document-reference/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/document-reference/index.tsx
rename to packages/client/src/tiptap/core/wrappers/document-reference/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/emoji-list/emojis.ts b/packages/client/src/tiptap/core/wrappers/emoji-list/emojis.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/emoji-list/emojis.ts
rename to packages/client/src/tiptap/core/wrappers/emoji-list/emojis.ts
diff --git a/packages/client/src/tiptap/wrappers/emoji-list/index.module.scss b/packages/client/src/tiptap/core/wrappers/emoji-list/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/emoji-list/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/emoji-list/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/emoji-list/index.tsx b/packages/client/src/tiptap/core/wrappers/emoji-list/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/emoji-list/index.tsx
rename to packages/client/src/tiptap/core/wrappers/emoji-list/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/iframe/index.module.scss b/packages/client/src/tiptap/core/wrappers/iframe/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/iframe/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/iframe/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/iframe/index.tsx b/packages/client/src/tiptap/core/wrappers/iframe/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/iframe/index.tsx
rename to packages/client/src/tiptap/core/wrappers/iframe/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/image/index.module.scss b/packages/client/src/tiptap/core/wrappers/image/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/image/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/image/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/image/index.tsx b/packages/client/src/tiptap/core/wrappers/image/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/image/index.tsx
rename to packages/client/src/tiptap/core/wrappers/image/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/katex/index.module.scss b/packages/client/src/tiptap/core/wrappers/katex/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/katex/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/katex/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/katex/index.tsx b/packages/client/src/tiptap/core/wrappers/katex/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/katex/index.tsx
rename to packages/client/src/tiptap/core/wrappers/katex/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/loading.tsx b/packages/client/src/tiptap/core/wrappers/loading.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/loading.tsx
rename to packages/client/src/tiptap/core/wrappers/loading.tsx
diff --git a/packages/client/src/tiptap/wrappers/mention-list/index.module.scss b/packages/client/src/tiptap/core/wrappers/mention-list/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mention-list/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/mention-list/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/mention-list/index.tsx b/packages/client/src/tiptap/core/wrappers/mention-list/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mention-list/index.tsx
rename to packages/client/src/tiptap/core/wrappers/mention-list/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/menu-list/index.module.scss b/packages/client/src/tiptap/core/wrappers/menu-list/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/menu-list/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/menu-list/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/menu-list/index.tsx b/packages/client/src/tiptap/core/wrappers/menu-list/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/menu-list/index.tsx
rename to packages/client/src/tiptap/core/wrappers/menu-list/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/mind/index.module.scss b/packages/client/src/tiptap/core/wrappers/mind/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/mind/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/mind/index.tsx b/packages/client/src/tiptap/core/wrappers/mind/index.tsx
similarity index 98%
rename from packages/client/src/tiptap/wrappers/mind/index.tsx
rename to packages/client/src/tiptap/core/wrappers/mind/index.tsx
index 1eebd3a6..7af48787 100644
--- a/packages/client/src/tiptap/wrappers/mind/index.tsx
+++ b/packages/client/src/tiptap/core/wrappers/mind/index.tsx
@@ -7,7 +7,7 @@ import { Spin, Typography } from '@douyinfe/semi-ui';
 import { Resizeable } from 'components/resizeable';
 import { useToggle } from 'hooks/use-toggle';
 import { getEditorContainerDOMSize, uuid } from 'tiptap/prose-utils';
-import { Mind } from 'tiptap/extensions/mind';
+import { Mind } from 'tiptap/core/extensions/mind';
 import styles from './index.module.scss';
 
 const { Text } = Typography;
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/const.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/const.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/const.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/const.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/customLink.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/customLink.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/customLink.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/customLink.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/i18n.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/i18n.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/i18n.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/i18n.ts
diff --git a/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/iconfont/iconfont.js b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/iconfont/iconfont.js
new file mode 100644
index 00000000..3823ea6b
--- /dev/null
+++ b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/iconfont/iconfont.js
@@ -0,0 +1,61 @@
+!(function (t) {
+  var c,
+    l,
+    a,
+    e,
+    o,
+    i,
+    n =
+      '<svg><symbol id="icon-edit" viewBox="0 0 1024 1024"><path d="M423.765333 128a42.666667 42.666667 0 0 1 3.2 85.205333L423.765333 213.333333H234.666667a64 64 0 0 0-63.872 60.245334L170.666667 277.333333v512a64 64 0 0 0 60.245333 63.872L234.666667 853.333333h512a64 64 0 0 0 63.872-60.245333L810.666667 789.333333v-189.098666a42.666667 42.666667 0 0 1 85.205333-3.2l0.128 3.2V789.333333a149.333333 149.333333 0 0 1-144.213333 149.248L746.666667 938.666667h-512a149.333333 149.333333 0 0 1-149.248-144.213334L85.333333 789.333333v-512a149.333333 149.333333 0 0 1 144.213334-149.248L234.666667 128h189.098666z m324.949334-53.248a42.666667 42.666667 0 0 1 60.330666 0l150.869334 150.869333a42.666667 42.666667 0 0 1 0 60.330667l-329.386667 329.386667a42.666667 42.666667 0 0 1-29.44 12.458666l-153.386667 2.517334a42.666667 42.666667 0 0 1-43.349333-43.349334l2.56-153.386666a42.666667 42.666667 0 0 1 12.458667-29.44z m30.165333 90.496L491.946667 452.266667l-1.493334 91.989333 92.032-1.493333 286.976-286.976-90.538666-90.538667z"  ></path></symbol><symbol id="icon-rising" viewBox="0 0 1024 1024"><path d="M553.173333 803.84h-64l0.021334-474.581333-224.021334 224-45.269333-45.226667L521.6 206.293333l301.717333 301.696-45.269333 45.269334-224.853333-224.896v475.477333z"  ></path></symbol><symbol id="icon-falling" viewBox="0 0 1024 1024"><path d="M553.173333 238.314667h-64l0.021334 474.602666-224.021334-224-45.269333 45.226667L521.6 835.861333l301.717333-301.717333-45.269333-45.226667-224.853333 224.853334V238.336z"  ></path></symbol><symbol id="icon-shanchu2" viewBox="0 0 1024 1024"><path d="M516.60601807 107.93026734c-82.64382935 0-149.71865844 65.51751709-152.5729065 147.77160644H171.37136841c-21.40603638 0-38.92044068 17.38504028-38.92044068 38.92126465 0 21.40686036 17.38504028 38.92208862 38.92126466 38.92208862h42.94308471v435.40136719c0 81.73498536 55.39828492 148.55026245 123.90106201 148.55026245h348.99444581c68.37341309 0 123.90106201-66.42553711 123.901062-148.55026245V333.80477906h38.92126465c21.40686036 0 38.92126464-17.38586426 38.92126465-38.92208863 0-21.40686036-17.38504028-38.92126464-38.92126465-38.92126465H668.91854859C666.45321656 173.44860839 599.24902344 107.93109131 516.60601807 107.93109131z m-79.65939331 147.77160644c2.85424805-42.16442872 37.2354126-74.85809326 79.78875732-74.85809326s76.93450927 32.82302857 79.39984131 74.85809326H436.94662476z m-98.86047364 589.01165771c-24.2611084 0-50.98754883-31.13717651-50.98754883-75.76693725V333.80477906h450.97036744V769.33551026c0 44.50039673-26.72644043 75.76776123-50.98754884 75.76776122H338.08615112v-0.38973999z m0 0"  ></path><path d="M390.37063599 751.17263794c17.77313232 0 32.43411255-17.7739563 32.43411255-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43411255-40.08966065-17.77478027 0-32.43493653 17.77478027-32.43493653 40.08966065v228.72875976c0 22.18469239 14.27124023 40.08883667 32.43493653 40.08883667z m117.41308594 0c17.7739563 0 32.43411255-17.7739563 32.43411255-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43411255-40.08966065-17.7739563 0-32.43493653 17.77478027-32.43493653 40.08966065v228.72875976c0 22.18469239 14.66098023 40.08883667 32.43493653 40.08883667z m123.51049804 0c17.7739563 0 32.43493653-17.7739563 32.43493652-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43493652-40.08966065-17.7739563 0-32.43411255 17.77478027-32.43411255 40.08966065v228.72875976c0 22.18469239 14.14105224 40.08883667 32.43411255 40.08883667z m0 0"  ></path></symbol><symbol id="icon-zijiedian" viewBox="0 0 1024 1024"><path d="M312.208 472c19.568-157.856 153.432-280 315.656-280 175.68 0 318.112 143.272 318.112 320S803.552 832 627.864 832c-162.224 0-296.08-122.144-315.656-280H120a40 40 0 0 1 0-80h192.208zM632 752c132.552 0 240-107.448 240-240 0-132.552-107.448-240-240-240-132.552 0-240 107.448-240 240 0 132.552 107.448 240 240 240z m-40-280v-80a40 40 0 0 1 80 0v80h80a40 40 0 0 1 0 80h-80v80a40 40 0 0 1-80 0v-80h-80a40 40 0 0 1 0-80h80z"  ></path></symbol><symbol id="icon-tongjijiedian-" viewBox="0 0 1024 1024"><path d="M803.84 131.626667H410.24A59.733333 59.733333 0 0 0 350.506667 192v45.226667H199.68a51.626667 51.626667 0 0 0-51.626667 51.626666v465.92a51.626667 51.626667 0 0 0 51.626667 51.626667h187.52v-55.466667h-162.133333a21.333333 21.333333 0 0 1-21.333334-21.333333V313.386667a21.333333 21.333333 0 0 1 21.333334-21.333334h125.653333v64a59.733333 59.733333 0 0 0 59.733333 59.733334h393.386667a59.733333 59.733333 0 0 0 59.733333-59.733334V192a59.733333 59.733333 0 0 0-59.733333-60.373333z m4.266667 224.64a4.266667 4.266667 0 0 1-4.266667 4.266666H410.24a4.266667 4.266667 0 0 1-4.266667-4.266666V192a4.266667 4.266667 0 0 1 4.266667-4.266667h393.6a4.266667 4.266667 0 0 1 4.266667 4.266667zM716.16 749.44h-81.28v-81.493333a27.733333 27.733333 0 0 0-55.466667 0v81.28h-81.493333a27.733333 27.733333 0 1 0 0 55.466666h81.28v81.28a27.733333 27.733333 0 1 0 55.466667 0v-81.066666h81.28a27.733333 27.733333 0 0 0 0-55.466667z"  ></path></symbol><symbol id="icon-close" viewBox="0 0 1024 1024"><path d="M557.312 513.248l265.28-263.904c12.544-12.48 12.608-32.704 0.128-45.248-12.512-12.576-32.704-12.608-45.248-0.128L512.128 467.904l-263.04-263.84c-12.448-12.48-32.704-12.544-45.248-0.064-12.512 12.48-12.544 32.736-0.064 45.28l262.976 263.776L201.6 776.8c-12.544 12.48-12.608 32.704-0.128 45.248a31.937 31.937 0 0 0 22.688 9.44c8.16 0 16.32-3.104 22.56-9.312l265.216-263.808 265.44 266.24c6.24 6.272 14.432 9.408 22.656 9.408a31.94 31.94 0 0 0 22.592-9.344c12.512-12.48 12.544-32.704 0.064-45.248L557.312 513.248z" fill="" ></path></symbol><symbol id="icon-menu" viewBox="0 0 1024 1024"><path d="M109.714 292.571h804.572c21.943 0 36.571-21.942 36.571-43.885 0-14.629-14.628-29.257-36.571-29.257H109.714c-21.943 0-36.571 14.628-36.571 36.571 0 14.629 14.628 36.571 36.571 36.571zM914.286 512H109.714c-21.943 0-36.571 14.629-36.571 36.571 0 14.629 14.628 36.572 36.571 36.572h804.572c21.943 0 36.571-21.943 36.571-43.886 0-14.628-14.628-29.257-36.571-29.257z m0 292.571H109.714c-21.943 0-36.571 14.629-36.571 36.572s14.628 36.571 36.571 36.571h804.572c21.943 0 36.571-21.943 36.571-36.571 0-21.943-14.628-36.572-36.571-36.572z"  ></path></symbol><symbol id="icon-right" viewBox="0 0 1024 1024"><path d="M385 560.69999999L385 738.9c0 36.90000001 26.4 68.5 61.3 68.5l150.2 0c1.5 0 3-0.1 4.5-0.3 10.2 38.7 45.5 67.3 87.5 67.3 50 0 90.5-40.5 90.5-90.5s-40.5-90.5-90.5-90.5c-42 0-77.3 28.6-87.5 67.39999999-1.4-0.3-2.9-0.4-4.5-0.39999999L446.3 760.4c-6.8 0-14.3-8.9-14.3-21.49999999l0-427.00000001c0-12.7 7.40000001-21.5 14.30000001-21.5l150.19999999 0c1.5 0 3-0.2 4.5-0.4 10.2 38.8 45.5 67.3 87.5 67.3 50 0 90.5-40.5 90.5-90.4 0-49.9-40.5-90.6-90.5-90.59999999-42 0-77.3 28.6-87.5 67.39999999-1.4-0.2-2.9-0.4-4.49999999-0.4L446.3 243.3c-34.80000001 0-61.3 31.6-61.3 68.50000001L385 513.7l-79.1 0c-10.4-38.5-45.49999999-67-87.4-67-50 0-90.5 40.5-90.5 90.5s40.5 90.5 90.5 90.5c41.79999999 0 77.00000001-28.4 87.4-67L385 560.69999999z" fill="#333333" ></path></symbol><symbol id="icon-left" viewBox="0 0 1024 1024"><path d="M639 463.30000001L639 285.1c0-36.90000001-26.4-68.5-61.3-68.5l-150.2 0c-1.5 0-3 0.1-4.5 0.3-10.2-38.7-45.5-67.3-87.5-67.3-50 0-90.5 40.5-90.5 90.5s40.5 90.5 90.5 90.5c42 0 77.3-28.6 87.5-67.39999999 1.4 0.3 2.9 0.4 4.5 0.39999999L577.7 263.6c6.8 0 14.3 8.9 14.3 21.49999999l0 427.00000001c0 12.7-7.40000001 21.5-14.30000001 21.5l-150.19999999 0c-1.5 0-3 0.2-4.5 0.4-10.2-38.8-45.5-67.3-87.5-67.3-50 0-90.5 40.5-90.5 90.4 0 49.9 40.5 90.6 90.5 90.59999999 42 0 77.3-28.6 87.5-67.39999999 1.4 0.2 2.9 0.4 4.49999999 0.4L577.7 780.7c34.80000001 0 61.3-31.6 61.3-68.50000001L639 510.3l79.1 0c10.4 38.5 45.49999999 67 87.4 67 50 0 90.5-40.5 90.5-90.5s-40.5-90.5-90.5-90.5c-41.79999999 0-77.00000001 28.4-87.4 67L639 463.30000001z" fill="#333333" ></path></symbol><symbol id="icon-side" viewBox="0 0 1024 1024"><path d="M851.91168 328.45312c-59.97056 0-108.6208 48.47104-108.91264 108.36992l-137.92768 38.4a109.14304 109.14304 0 0 0-63.46752-46.58688l1.39264-137.11872c47.29344-11.86816 82.31936-54.66624 82.31936-105.64096 0-60.15488-48.76288-108.91776-108.91776-108.91776s-108.91776 48.76288-108.91776 108.91776c0 49.18784 32.60928 90.75712 77.38368 104.27392l-1.41312 138.87488a109.19936 109.19936 0 0 0-63.50336 48.55808l-138.93632-39.48544 0.01024-0.72704c0-60.15488-48.76288-108.91776-108.91776-108.91776s-108.91776 48.75776-108.91776 108.91776c0 60.15488 48.76288 108.91264 108.91776 108.91264 39.3984 0 73.91232-20.92032 93.03552-52.2496l139.19232 39.552-0.00512 0.2304c0 25.8304 9.00096 49.5616 24.02816 68.23424l-90.14272 132.63872a108.7488 108.7488 0 0 0-34.2528-5.504c-60.15488 0-108.91776 48.768-108.91776 108.91776 0 60.16 48.76288 108.91776 108.91776 108.91776 60.16 0 108.92288-48.75776 108.92288-108.91776 0-27.14624-9.9328-51.968-26.36288-71.04l89.04704-131.03104a108.544 108.544 0 0 0 37.6832 6.70208 108.672 108.672 0 0 0 36.48512-6.272l93.13792 132.57216a108.48256 108.48256 0 0 0-24.69888 69.0688c0 60.16 48.768 108.92288 108.91776 108.92288 60.16 0 108.91776-48.76288 108.91776-108.92288 0-60.14976-48.75776-108.91776-108.91776-108.91776a108.80512 108.80512 0 0 0-36.69504 6.3488l-93.07136-132.48a108.48768 108.48768 0 0 0 24.79616-72.22784l136.09984-37.888c18.99008 31.93856 53.84192 53.3504 93.69088 53.3504 60.16 0 108.92288-48.75776 108.92288-108.91264-0.00512-60.15488-48.77312-108.92288-108.92288-108.92288z"  ></path></symbol><symbol id="icon-B" viewBox="0 0 1024 1024"><path d="M98.067692 65.457231H481.28c75.854769 0 132.411077 3.150769 169.668923 9.452307 37.336615 6.301538 70.656 19.534769 100.036923 39.620924 29.459692 20.007385 53.956923 46.710154 73.570462 80.029538 19.692308 33.398154 29.459692 70.734769 29.459692 112.167385 0 44.898462-12.130462 86.094769-36.233846 123.588923a224.886154 224.886154 0 0 1-98.461539 84.283077c58.368 17.092923 103.266462 46.08 134.695385 87.04 31.350154 40.96 47.025231 89.088 47.025231 144.462769 0 43.638154-10.082462 86.016-30.404923 127.212308-20.243692 41.196308-47.891692 74.043077-83.02277 98.697846-35.052308 24.654769-78.296615 39.778462-129.732923 45.449846-32.295385 3.465846-110.119385 5.671385-233.472 6.537846H98.067692V65.457231z m193.536 159.507692V446.621538h126.818462c75.460923 0 122.328615-1.024 140.603077-3.229538 33.083077-3.938462 59.155692-15.36 78.139077-34.343385 18.904615-18.904615 28.435692-43.874462 28.435692-74.830769 0-29.696-8.192-53.720615-24.497231-72.310154-16.384-18.510769-40.644923-29.696-72.940307-33.634461-19.140923-2.205538-74.279385-3.308308-165.415385-3.308308h-111.064615z m0 381.243077v256.315077h179.2c69.710769 0 113.979077-1.969231 132.726154-5.907692 28.750769-5.198769 52.145231-17.959385 70.262154-38.281847 18.116923-20.243692 27.096615-47.340308 27.096615-81.368615 0-28.750769-6.931692-53.169231-20.873846-73.255385a118.232615 118.232615 0 0 0-60.494769-43.795692c-26.387692-9.137231-83.574154-13.705846-171.638154-13.705846H291.603692z"  ></path></symbol><symbol id="icon-a" viewBox="0 0 1024 1024"><path d="M757.76 665.6q0 20.48 1.536 34.304t7.68 22.016 18.944 12.288 34.304 4.096q-3.072 25.6-15.36 44.032-11.264 16.384-33.28 29.696t-62.976 13.312q-11.264 0-20.48-0.512t-17.408-2.56l-6.144-2.048-1.024 0q-4.096-1.024-10.24-4.096-2.048-2.048-4.096-2.048-1.024-1.024-2.048-1.024-14.336-8.192-23.552-17.408t-14.336-17.408q-6.144-10.24-9.216-20.48-63.488 75.776-178.176 75.776-48.128 0-88.064-15.36t-69.12-44.032-45.056-68.096-15.872-88.576 16.896-89.088 47.616-67.584 74.24-42.496 96.768-14.848q48.128 0 88.576 17.408t66.048 49.152q0-8.192 0.512-16.384t0.512-15.36q0-71.68-39.936-104.448t-128-32.768q-43.008 0-84.992 6.656t-84.992 17.92q14.336-28.672 25.088-47.616t24.064-29.184q30.72-24.576 158.72-24.576 79.872 0 135.168 13.824t90.624 43.52 51.2 75.264 15.872 108.032l0 200.704zM487.424 743.424q50.176 0 79.872-33.28t29.696-95.744q0-61.44-28.672-93.696t-76.8-32.256q-52.224 0-82.944 33.28t-30.72 94.72q0 58.368 31.744 92.672t77.824 34.304z"  ></path></symbol><symbol id="icon-full" viewBox="0 0 1024 1024"><path d="M639.328 416c8.032 0 16.096-3.008 22.304-9.056l202.624-197.184-0.8 143.808c-0.096 17.696 14.144 32.096 31.808 32.192 0.064 0 0.128 0 0.192 0 17.6 0 31.904-14.208 32-31.808l1.248-222.208c0-0.672-0.352-1.248-0.384-1.92 0.032-0.512 0.288-0.896 0.288-1.408 0.032-17.664-14.272-32-31.968-32.032L671.552 96l-0.032 0c-17.664 0-31.968 14.304-32 31.968C639.488 145.632 653.824 160 671.488 160l151.872 0.224-206.368 200.8c-12.672 12.32-12.928 32.608-0.64 45.248C622.656 412.736 630.976 416 639.328 416z"  ></path><path d="M896.032 639.552 896.032 639.552c-17.696 0-32 14.304-32.032 31.968l-0.224 151.872-200.832-206.4c-12.32-12.64-32.576-12.96-45.248-0.64-12.672 12.352-12.928 32.608-0.64 45.248l197.184 202.624-143.808-0.8c-0.064 0-0.128 0-0.192 0-17.6 0-31.904 14.208-32 31.808-0.096 17.696 14.144 32.096 31.808 32.192l222.24 1.248c0.064 0 0.128 0 0.192 0 0.64 0 1.12-0.32 1.76-0.352 0.512 0.032 0.896 0.288 1.408 0.288l0.032 0c17.664 0 31.968-14.304 32-31.968L928 671.584C928.032 653.952 913.728 639.584 896.032 639.552z"  ></path><path d="M209.76 159.744l143.808 0.8c0.064 0 0.128 0 0.192 0 17.6 0 31.904-14.208 32-31.808 0.096-17.696-14.144-32.096-31.808-32.192L131.68 95.328c-0.064 0-0.128 0-0.192 0-0.672 0-1.248 0.352-1.888 0.384-0.448 0-0.8-0.256-1.248-0.256 0 0-0.032 0-0.032 0-17.664 0-31.968 14.304-32 31.968L96 352.448c-0.032 17.664 14.272 32 31.968 32.032 0 0 0.032 0 0.032 0 17.664 0 31.968-14.304 32-31.968l0.224-151.936 200.832 206.4c6.272 6.464 14.624 9.696 22.944 9.696 8.032 0 16.096-3.008 22.304-9.056 12.672-12.32 12.96-32.608 0.64-45.248L209.76 159.744z"  ></path><path d="M362.368 617.056l-202.624 197.184 0.8-143.808c0.096-17.696-14.144-32.096-31.808-32.192-0.064 0-0.128 0-0.192 0-17.6 0-31.904 14.208-32 31.808l-1.248 222.24c0 0.704 0.352 1.312 0.384 2.016 0 0.448-0.256 0.832-0.256 1.312-0.032 17.664 14.272 32 31.968 32.032L352.448 928c0 0 0.032 0 0.032 0 17.664 0 31.968-14.304 32-31.968s-14.272-32-31.968-32.032l-151.936-0.224 206.4-200.832c12.672-12.352 12.96-32.608 0.64-45.248S375.008 604.704 362.368 617.056z"  ></path></symbol><symbol id="icon-add" viewBox="0 0 1024 1024"><path d="M863.328 482.56l-317.344-1.12L545.984 162.816c0-17.664-14.336-32-32-32s-32 14.336-32 32l0 318.4L159.616 480.064c-0.032 0-0.064 0-0.096 0-17.632 0-31.936 14.24-32 31.904C127.424 529.632 141.728 544 159.392 544.064l322.592 1.152 0 319.168c0 17.696 14.336 32 32 32s32-14.304 32-32l0-318.944 317.088 1.12c0.064 0 0.096 0 0.128 0 17.632 0 31.936-14.24 32-31.904C895.264 496.992 880.96 482.624 863.328 482.56z"  ></path></symbol><symbol id="icon-move" viewBox="0 0 1024 1024"><path d="M863.744 544 163.424 544c-17.664 0-32-14.336-32-32s14.336-32 32-32l700.32 0c17.696 0 32 14.336 32 32S881.44 544 863.744 544z"  ></path></symbol><symbol id="icon-living" viewBox="0 0 1024 1024"><path d="M514.133333 488.533333m-106.666666 0a106.666667 106.666667 0 1 0 213.333333 0 106.666667 106.666667 0 1 0-213.333333 0Z" fill="#666666" ></path><path d="M512 64C264.533333 64 64 264.533333 64 512c0 236.8 183.466667 428.8 416 445.866667v-134.4c-53.333333-59.733333-200.533333-230.4-200.533333-334.933334 0-130.133333 104.533333-234.666667 234.666666-234.666666s234.666667 104.533333 234.666667 234.666666c0 61.866667-49.066667 153.6-145.066667 270.933334l-59.733333 68.266666V960C776.533333 942.933333 960 748.8 960 512c0-247.466667-200.533333-448-448-448z" fill="#666666" ></path></symbol></svg>',
+    h = (h = document.getElementsByTagName('script'))[h.length - 1].getAttribute('data-injectcss');
+  if (h && !t.__iconfont__svg__cssinject__) {
+    t.__iconfont__svg__cssinject__ = !0;
+    try {
+      document.write(
+        '<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>'
+      );
+    } catch (t) {
+      console && console.log(t);
+    }
+  }
+  function d() {
+    o || ((o = !0), a());
+  }
+  (c = function () {
+    var t, c, l, a;
+    ((a = document.createElement('div')).innerHTML = n),
+      (n = null),
+      (l = a.getElementsByTagName('svg')[0]) &&
+        (l.setAttribute('aria-hidden', 'true'),
+        (l.style.position = 'absolute'),
+        (l.style.width = 0),
+        (l.style.height = 0),
+        (l.style.overflow = 'hidden'),
+        (t = l),
+        (c = document.body).firstChild
+          ? ((a = t), (l = c.firstChild).parentNode.insertBefore(a, l))
+          : c.appendChild(t));
+  }),
+    document.addEventListener
+      ? ~['complete', 'loaded', 'interactive'].indexOf(document.readyState)
+        ? setTimeout(c, 0)
+        : ((l = function () {
+            document.removeEventListener('DOMContentLoaded', l, !1), c();
+          }),
+          document.addEventListener('DOMContentLoaded', l, !1))
+      : document.attachEvent &&
+        ((a = c),
+        (e = t.document),
+        (o = !1),
+        (i = function () {
+          try {
+            e.documentElement.doScroll('left');
+          } catch (t) {
+            return void setTimeout(i, 50);
+          }
+          d();
+        })(),
+        (e.onreadystatechange = function () {
+          'complete' == e.readyState && ((e.onreadystatechange = null), d());
+        }));
+})(window);
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/index.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/index.ts
similarity index 99%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/index.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/index.ts
index b7c114a4..043096dc 100644
--- a/packages/client/src/tiptap/wrappers/mind/mind-elixir/index.ts
+++ b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/index.ts
@@ -198,6 +198,7 @@ function MindElixir(
 ) {
   const box = document.querySelector(el);
   if (!box) return;
+  // @ts-ignore
   this.mindElixirBox = box;
   this.before = before || {};
   this.nodeData = data.nodeData;
@@ -416,7 +417,6 @@ MindElixir.prototype = {
 
   destroy: function () {
     this.bus.destroy();
-    this.mindElixirBox.removeChild(this.container);
   },
 };
 
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/interact.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/interact.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/interact.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/interact.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/linkDiv.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/linkDiv.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/linkDiv.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/linkDiv.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/mouse.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/mouse.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/mouse.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/mouse.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/nodeOperation.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/nodeOperation.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/nodeOperation.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/nodeOperation.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/contextMenu.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/contextMenu.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/contextMenu.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/contextMenu.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/keypress.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/keypress.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/keypress.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/keypress.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/mobileMenu.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/mobileMenu.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/mobileMenu.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/mobileMenu.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/nodeDraggable.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/nodeDraggable.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/nodeDraggable.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/nodeDraggable.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx
similarity index 99%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx
index b432519e..99b53db2 100644
--- a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx
+++ b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/nodeMenu.tsx
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Button, Tooltip, Space, Dropdown, Form } from '@douyinfe/semi-ui';
 import { IconBold, IconFont, IconMark, IconLink } from '@douyinfe/semi-icons';
-import { ColorPicker } from 'tiptap/menus/_components/color-picker';
+import { ColorPicker } from 'tiptap/components/color-picker';
 import { findEle } from '../utils/dom';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
 
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/toolBar.tsx b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/toolBar.tsx
similarity index 98%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/toolBar.tsx
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/toolBar.tsx
index c92382f7..1f5739c5 100644
--- a/packages/client/src/tiptap/wrappers/mind/mind-elixir/plugin/toolBar.tsx
+++ b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/plugin/toolBar.tsx
@@ -11,7 +11,7 @@ import {
   IconZoomOut,
   IconZoomIn,
 } from 'components/icons';
-import { Divider } from 'tiptap/divider';
+import { Divider } from 'tiptap/components/divider';
 import { useToggle } from 'hooks/use-toggle';
 import { useMemo } from 'react';
 
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/dom.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/dom.ts
similarity index 99%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/dom.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/dom.ts
index 7b474bd4..c0d5e7b9 100644
--- a/packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/dom.ts
+++ b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/dom.ts
@@ -1,6 +1,6 @@
 import { LEFT, RIGHT, SIDE } from '../const';
 import { NodeObj } from '../index';
-import { encodeHTML } from '../utils/index';
+import { encodeHTML } from './index';
 
 export type Top = HTMLElement;
 export type Group = HTMLElement;
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/index.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/index.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/index.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/index.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/pubsub.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/pubsub.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/pubsub.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/pubsub.ts
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/svg.ts b/packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/svg.ts
similarity index 100%
rename from packages/client/src/tiptap/wrappers/mind/mind-elixir/utils/svg.ts
rename to packages/client/src/tiptap/core/wrappers/mind/mind-elixir/utils/svg.ts
diff --git a/packages/client/src/tiptap/wrappers/status/index.module.scss b/packages/client/src/tiptap/core/wrappers/status/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/status/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/status/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/status/index.tsx b/packages/client/src/tiptap/core/wrappers/status/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/status/index.tsx
rename to packages/client/src/tiptap/core/wrappers/status/index.tsx
diff --git a/packages/client/src/tiptap/wrappers/task-item/index.module.scss b/packages/client/src/tiptap/core/wrappers/task-item/index.module.scss
similarity index 100%
rename from packages/client/src/tiptap/wrappers/task-item/index.module.scss
rename to packages/client/src/tiptap/core/wrappers/task-item/index.module.scss
diff --git a/packages/client/src/tiptap/wrappers/task-item/index.tsx b/packages/client/src/tiptap/core/wrappers/task-item/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/wrappers/task-item/index.tsx
rename to packages/client/src/tiptap/core/wrappers/task-item/index.tsx
diff --git a/packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx b/packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx
new file mode 100644
index 00000000..5b3cfc27
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx
@@ -0,0 +1,115 @@
+import React, { useEffect, forwardRef, useImperativeHandle, useRef, useMemo } from 'react';
+import { Toast, BackTop } from '@douyinfe/semi-ui';
+import { HocuspocusProvider } from '@hocuspocus/provider';
+import { debounce } from 'helpers/debounce';
+import { useNetwork } from 'hooks/use-network';
+import { useToggle } from 'hooks/use-toggle';
+import { LogoName } from 'components/logo';
+import { Banner } from 'components/banner';
+import { useEditor, EditorContent } from '../../react';
+import { Collaboration } from 'tiptap/core/extensions/collaboration';
+import { CollaborationCursor } from 'tiptap/core/extensions/collaboration-cursor';
+import { getRandomColor } from 'helpers/color';
+import { CollaborationKit } from '../kit';
+import { MenuBar } from './menubar';
+import { ICollaborationEditorProps, ProviderStatus } from './type';
+
+type IProps = Pick<
+  ICollaborationEditorProps,
+  'editable' | 'user' | 'onTitleUpdate' | 'menubar' | 'renderInEditorPortal'
+> & {
+  hocuspocusProvider: HocuspocusProvider;
+  status: ProviderStatus;
+};
+
+export const EditorInstance = forwardRef((props: IProps, ref) => {
+  const { hocuspocusProvider, editable, user, onTitleUpdate, status, menubar, renderInEditorPortal } = props;
+  const $mainContainer = useRef<HTMLDivElement>();
+  const { online } = useNetwork();
+  const [created, toggleCreated] = useToggle(false);
+  const editor = useEditor(
+    {
+      editable,
+      extensions: [
+        ...CollaborationKit,
+        Collaboration.configure({
+          document: hocuspocusProvider.document,
+        }),
+        CollaborationCursor.configure({
+          provider: hocuspocusProvider,
+          user: {
+            ...(user || {
+              name: '匿名用户正在阅读文章...',
+            }),
+            color: getRandomColor(),
+          },
+        }),
+      ].filter(Boolean),
+      onTransaction: debounce(({ transaction }) => {
+        try {
+          const title = transaction.doc.content.firstChild.content.firstChild.textContent;
+          onTitleUpdate(title);
+        } catch (e) {
+          //
+        }
+      }, 50),
+      onCreate() {
+        toggleCreated(true);
+      },
+      onDestroy() {},
+    },
+    [editable, user, onTitleUpdate, hocuspocusProvider]
+  );
+
+  useImperativeHandle(ref, () => editor);
+
+  const protals = useMemo(() => {
+    if (!created || !renderInEditorPortal) return;
+    return renderInEditorPortal($mainContainer.current);
+  }, [created, renderInEditorPortal]);
+
+  // 监听 ctrl+s
+  useEffect(() => {
+    const listener = (event: KeyboardEvent) => {
+      if ((event.ctrlKey || event.metaKey) && event.keyCode == 83) {
+        event.preventDefault();
+        Toast.info(`${LogoName}会实时保存你的数据，无需手动保存。`);
+        return false;
+      }
+    };
+
+    window.document.addEventListener('keydown', listener);
+
+    return () => {
+      window.document.removeEventListener('keydown', listener);
+    };
+  }, []);
+
+  return (
+    <>
+      {(!online || status === 'disconnected') && (
+        <Banner
+          type="warning"
+          description="我们已与您断开连接，您可以继续编辑文档。一旦重新连接，我们会自动重新提交数据。"
+        />
+      )}
+      {/* FIXME：需要菜单栏但是无法编辑，则认为进入了编辑模式但是没有编辑权限 */}
+      {!editable && menubar && (
+        <Banner type="warning" description="您没有编辑权限，暂不能编辑该文档。" closeable={false} />
+      )}
+      {menubar && (
+        <header>
+          <MenuBar editor={editor} />
+        </header>
+      )}
+      <main ref={$mainContainer}>
+        <EditorContent editor={editor} />
+        {protals}
+      </main>
+
+      {editable && menubar && <BackTop target={() => $mainContainer.current} visibilityHeight={200} />}
+    </>
+  );
+});
+
+EditorInstance.displayName = 'EditorInstance';
diff --git a/packages/client/src/tiptap/editor/collaboration/collaboration/index.module.scss b/packages/client/src/tiptap/editor/collaboration/collaboration/index.module.scss
new file mode 100644
index 00000000..92d2e0ab
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/collaboration/index.module.scss
@@ -0,0 +1,26 @@
+.wrap {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  flex-direction: column;
+
+  > header {
+    position: relative;
+    z-index: 110;
+    display: flex;
+    justify-content: center;
+    height: 50px;
+    padding: 0 24px;
+    overflow: hidden;
+    background-color: var(--semi-color-nav-bg);
+    align-items: center;
+    border-bottom: 1px solid var(--semi-color-border);
+    user-select: none;
+  }
+
+  > main {
+    flex: 1;
+    overflow: auto;
+  }
+}
diff --git a/packages/client/src/tiptap/editor/collaboration/collaboration/index.tsx b/packages/client/src/tiptap/editor/collaboration/collaboration/index.tsx
new file mode 100644
index 00000000..71463f1c
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/collaboration/index.tsx
@@ -0,0 +1,140 @@
+import React, { useMemo, useState, useEffect, forwardRef, useImperativeHandle, useRef } from 'react';
+import { Typography, Spin } from '@douyinfe/semi-ui';
+import { IndexeddbPersistence } from 'y-indexeddb';
+import { HocuspocusProvider } from '@hocuspocus/provider';
+import { useToggle } from 'hooks/use-toggle';
+import { SecureDocumentIllustration } from 'illustrations/secure-document';
+import { DataRender } from 'components/data-render';
+import { Editor } from '../../react';
+import { ICollaborationEditorProps, ProviderStatus } from './type';
+import { EditorInstance } from './editor';
+import styles from './index.module.scss';
+
+const { Text } = Typography;
+
+export type ICollaborationRefProps = {
+  getEditor: () => Editor;
+};
+
+export const CollaborationEditor = forwardRef((props: ICollaborationEditorProps, ref) => {
+  const {
+    id: documentId,
+    type,
+    editable,
+    onTitleUpdate,
+    user,
+    menubar,
+    renderInEditorPortal,
+    onAwarenessUpdate,
+  } = props;
+  const $editor = useRef<Editor>();
+  const [loading, toggleLoading] = useToggle(true);
+  const [error, setError] = useState(null);
+  const [status, setStatus] = useState<ProviderStatus>('connecting');
+
+  const hocuspocusProvider = useMemo(() => {
+    return new HocuspocusProvider({
+      url: process.env.COLLABORATION_API_URL,
+      name: documentId,
+      token: (user && user.token) || 'read-public',
+      parameters: {
+        targetId: documentId,
+        userId: user && user.id,
+        docType: type,
+      },
+      maxAttempts: 1,
+      onAwarenessUpdate({ states }) {
+        const users = states.map((state) => ({ clientId: state.clientId, user: state.user }));
+        onAwarenessUpdate && onAwarenessUpdate(users);
+      },
+      onAuthenticationFailed() {
+        toggleLoading(false);
+        setError(new Error('鉴权失败！暂时无法提供服务'));
+      },
+      onSynced() {
+        toggleLoading(false);
+      },
+      onStatus({ status }) {
+        setStatus(status);
+      },
+    } as any);
+  }, [documentId, user, type, onAwarenessUpdate, toggleLoading]);
+
+  useImperativeHandle(
+    ref,
+    () =>
+      ({
+        getEditor: () => $editor.current,
+      } as ICollaborationRefProps)
+  );
+
+  // 离线缓存
+  useEffect(() => {
+    if (!editable) return;
+    const indexdbProvider = new IndexeddbPersistence(documentId, hocuspocusProvider.document);
+    indexdbProvider.on('synced', () => {
+      setStatus('loadCacheSuccess');
+    });
+
+    return () => {
+      if (indexdbProvider) {
+        indexdbProvider.destroy();
+      }
+    };
+  }, [editable, documentId, hocuspocusProvider]);
+
+  useEffect(() => {
+    return () => {
+      if (hocuspocusProvider) {
+        hocuspocusProvider.destroy();
+      }
+    };
+  }, [hocuspocusProvider]);
+
+  return (
+    <div className={styles.wrap}>
+      <DataRender
+        loading={loading}
+        loadingContent={
+          <div style={{ width: 174, margin: 'auto' }}>
+            <Spin tip="正在为您加载编辑器中...">
+              {/* FIXME: semi-design 的问题，不加 div，文字会换行! */}
+              <div></div>
+            </Spin>
+          </div>
+        }
+        error={error}
+        errorContent={(error) => (
+          <div
+            style={{
+              margin: '10%',
+              display: 'flex',
+              justifyContent: 'center',
+              flexDirection: 'column',
+              alignItems: 'center',
+            }}
+          >
+            <SecureDocumentIllustration />
+            <Text style={{ marginTop: 12 }} type="danger">
+              {(error && error.message) || '未知错误'}
+            </Text>
+          </div>
+        )}
+        normalContent={() => (
+          <EditorInstance
+            ref={$editor}
+            editable={editable}
+            menubar={menubar}
+            hocuspocusProvider={hocuspocusProvider}
+            onTitleUpdate={onTitleUpdate}
+            user={user}
+            status={status}
+            renderInEditorPortal={renderInEditorPortal}
+          />
+        )}
+      />
+    </div>
+  );
+});
+
+CollaborationEditor.displayName = 'CollaborationEditor';
diff --git a/packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx b/packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx
new file mode 100644
index 00000000..81bf8727
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx
@@ -0,0 +1,119 @@
+import React, { useMemo } from 'react';
+import { Space } from '@douyinfe/semi-ui';
+import { Divider } from 'tiptap/components/divider';
+import { Editor } from 'tiptap/editor';
+
+import { Insert } from 'tiptap/editor/menus/insert';
+import { Undo } from 'tiptap/editor/menus/undo';
+import { Redo } from 'tiptap/editor/menus/redo';
+import { CleadrNodeAndMarks } from 'tiptap/editor/menus/clear-node-and-marks';
+
+import { Heading } from 'tiptap/editor/menus/heading';
+import { FontSize } from 'tiptap/editor/menus/fontsize';
+import { Bold } from 'tiptap/editor/menus/bold';
+import { Italic } from 'tiptap/editor/menus/italic';
+import { Underline } from 'tiptap/editor/menus/underline';
+import { Strike } from 'tiptap/editor/menus/strike';
+import { Code } from 'tiptap/editor/menus/code';
+import { Superscript } from 'tiptap/editor/menus/superscript';
+import { Subscript } from 'tiptap/editor/menus/subscript';
+import { TextColor } from 'tiptap/editor/menus/text-color';
+import { BackgroundColor } from 'tiptap/editor/menus/background-color';
+
+import { Align } from 'tiptap/editor/menus/align';
+
+import { BulletList } from 'tiptap/editor/menus/bullet-list';
+import { OrderedList } from 'tiptap/editor/menus/ordered-list';
+import { TaskList } from 'tiptap/editor/menus/task-list';
+import { Ident } from 'tiptap/editor/menus/ident';
+
+import { Emoji } from 'tiptap/editor/menus/emoji';
+import { Link } from 'tiptap/editor/menus/link';
+import { Blockquote } from 'tiptap/editor/menus/blockquote';
+import { HorizontalRule } from 'tiptap/editor/menus/horizontal-rule';
+import { Search } from 'tiptap/editor/menus/search';
+
+import { Attachment } from 'tiptap/editor/menus/attachment';
+import { Callout } from 'tiptap/editor/menus/callout';
+import { CodeBlock } from 'tiptap/editor/menus/code-block';
+import { Countdonw } from 'tiptap/editor/menus/countdown';
+import { DocumentChildren } from 'tiptap/editor/menus/document-children';
+import { DocumentReference } from 'tiptap/editor/menus/document-reference';
+import { Image } from 'tiptap/editor/menus/image';
+import { Iframe } from 'tiptap/editor/menus/iframe';
+import { Table } from 'tiptap/editor/menus/table';
+import { Mind } from 'tiptap/editor/menus/mind';
+
+const _MenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
+  const isEditable = useMemo(() => editor && editor.isEditable, [editor]);
+
+  if (!editor) return null;
+
+  return (
+    <div
+      style={{
+        overflow: 'auto',
+        opacity: isEditable ? 1 : 0.65,
+        pointerEvents: isEditable ? 'auto' : 'none',
+      }}
+    >
+      <Space spacing={2}>
+        <Insert editor={editor} />
+
+        <Divider />
+
+        <Undo editor={editor} />
+        <Redo editor={editor} />
+        <CleadrNodeAndMarks editor={editor} />
+
+        <Divider />
+
+        <Heading editor={editor} />
+        <FontSize editor={editor} />
+        <Bold editor={editor} />
+        <Italic editor={editor} />
+        <Underline editor={editor} />
+        <Strike editor={editor} />
+        <Code editor={editor} />
+        <Superscript editor={editor} />
+        <Subscript editor={editor} />
+        <TextColor editor={editor} />
+        <BackgroundColor editor={editor} />
+
+        <Divider />
+
+        <Align editor={editor} />
+
+        <Divider />
+
+        <BulletList editor={editor} />
+        <OrderedList editor={editor} />
+        <TaskList editor={editor} />
+        <Ident editor={editor} />
+
+        <Divider />
+
+        <Emoji editor={editor} />
+        <Blockquote editor={editor} />
+        <Link editor={editor} />
+        <HorizontalRule editor={editor} />
+        <Search editor={editor} />
+
+        <Attachment editor={editor} />
+        <Callout editor={editor} />
+        <CodeBlock editor={editor} />
+        <Countdonw editor={editor} />
+        <DocumentChildren editor={editor} />
+        <DocumentReference editor={editor} />
+        <Image editor={editor} />
+        <Iframe editor={editor} />
+        <Table editor={editor} />
+        <Mind editor={editor} />
+      </Space>
+    </div>
+  );
+};
+
+export const MenuBar = React.memo(_MenuBar, (prevProps, nextProps) => {
+  return prevProps.editor === nextProps.editor;
+});
diff --git a/packages/client/src/tiptap/editor/collaboration/collaboration/type.ts b/packages/client/src/tiptap/editor/collaboration/collaboration/type.ts
new file mode 100644
index 00000000..39a0e62e
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/collaboration/type.ts
@@ -0,0 +1,48 @@
+import { ILoginUser, IUser } from '@think/domains';
+import React from 'react';
+
+export interface ICollaborationEditorProps {
+  /**
+   * 文档 id
+   */
+  id: string;
+
+  /**
+   *  类型
+   */
+  type: 'document' | 'template';
+
+  /**
+   * 是否可编辑
+   */
+  editable: boolean;
+
+  /**
+   * 是否需要菜单
+   */
+  menubar?: boolean;
+
+  /**
+   * 当前用户
+   * 为 null 时会查看对应文档是否为公开状态，否则鉴权失败
+   */
+  user: ILoginUser | null;
+
+  /**
+   * 文档标题变动
+   */
+  onTitleUpdate?: (arg: string) => void;
+
+  /**
+   * 协作用户变动
+   */
+  onAwarenessUpdate?: (users: { clientId: number; user: IUser }[]) => void;
+
+  /**
+   * 渲染在编辑器区域的节点
+   * @element 编辑器渲染父节点
+   */
+  renderInEditorPortal?: (element: HTMLElement) => React.ReactNode;
+}
+
+export type ProviderStatus = 'connecting' | 'connected' | 'disconnected' | 'loadCacheSuccess';
diff --git a/packages/client/src/tiptap/editor/collaboration/index.tsx b/packages/client/src/tiptap/editor/collaboration/index.tsx
new file mode 100644
index 00000000..6224f37a
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/index.tsx
@@ -0,0 +1,4 @@
+export * from './collaboration';
+export * from './reader';
+export * from './kit';
+export * from './collaboration/type';
diff --git a/packages/client/src/tiptap/editor/collaboration/kit.ts b/packages/client/src/tiptap/editor/collaboration/kit.ts
new file mode 100644
index 00000000..c601e9d2
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/kit.ts
@@ -0,0 +1,144 @@
+// 基础扩展
+import { Document } from 'tiptap/core/extensions/document';
+import { BackgroundColor } from 'tiptap/core/extensions/background-color';
+import { Blockquote } from 'tiptap/core/extensions/blockquote';
+import { Bold } from 'tiptap/core/extensions/bold';
+import { BulletList } from 'tiptap/core/extensions/bullet-list';
+import { Code } from 'tiptap/core/extensions/code';
+import { CodeBlock } from 'tiptap/core/extensions/code-block';
+import { Color } from 'tiptap/core/extensions/color';
+import { ColorHighlighter } from 'tiptap/core/extensions/color-highlighter';
+import { Dropcursor } from 'tiptap/core/extensions/dropcursor';
+import { EventEmitter } from 'tiptap/core/extensions/event-emitter';
+import { Focus } from 'tiptap/core/extensions/focus';
+import { FontSize } from 'tiptap/core/extensions/font-size';
+import { Gapcursor } from 'tiptap/core/extensions/gapcursor';
+import { HardBreak } from 'tiptap/core/extensions/hard-break';
+import { Heading } from 'tiptap/core/extensions/heading';
+import { HorizontalRule } from 'tiptap/core/extensions/horizontal-rule';
+import { HTMLMarks } from 'tiptap/core/extensions/html-marks';
+import { Image } from 'tiptap/core/extensions/image';
+import { Indent } from 'tiptap/core/extensions/indent';
+import { Italic } from 'tiptap/core/extensions/italic';
+import { Link } from 'tiptap/core/extensions/link';
+import { ListItem } from 'tiptap/core/extensions/listItem';
+import { Loading } from 'tiptap/core/extensions/loading';
+import { OrderedList } from 'tiptap/core/extensions/ordered-list';
+import { Paragraph } from 'tiptap/core/extensions/paragraph';
+import { Placeholder } from 'tiptap/core/extensions/placeholder';
+import { SelectionExtension } from 'tiptap/core/extensions/selection';
+import { Strike } from 'tiptap/core/extensions/strike';
+import { Subscript } from 'tiptap/core/extensions/subscript';
+import { Superscript } from 'tiptap/core/extensions/superscript';
+import { Table } from 'tiptap/core/extensions/table';
+import { TableCell } from 'tiptap/core/extensions/table-cell';
+import { TableHeader } from 'tiptap/core/extensions/table-header';
+import { TableRow } from 'tiptap/core/extensions/table-row';
+import { Text } from 'tiptap/core/extensions/text';
+import { TextAlign } from 'tiptap/core/extensions/text-align';
+import { TextStyle } from 'tiptap/core/extensions/text-style';
+import { TaskItem } from 'tiptap/core/extensions/task-item';
+import { TaskList } from 'tiptap/core/extensions/task-list';
+import { Title } from 'tiptap/core/extensions/title';
+import { TrailingNode } from 'tiptap/core/extensions/trailing-node';
+import { Underline } from 'tiptap/core/extensions/underline';
+import { Paste } from 'tiptap/core/extensions/paste';
+// 自定义节点扩展
+import { Attachment } from 'tiptap/core/extensions/attachment';
+import { Callout } from 'tiptap/core/extensions/callout';
+import { Countdown } from 'tiptap/core/extensions/countdown';
+import { DocumentChildren } from 'tiptap/core/extensions/document-children';
+import { DocumentReference } from 'tiptap/core/extensions/document-reference';
+import { Emoji } from 'tiptap/core/extensions/emoji';
+import { Iframe } from 'tiptap/core/extensions/iframe';
+import { Katex } from 'tiptap/core/extensions/katex';
+import { Mention } from 'tiptap/core/extensions/mention';
+import { Mind } from 'tiptap/core/extensions/mind';
+import { QuickInsert } from 'tiptap/core/extensions/quick-insert';
+import { SearchNReplace } from 'tiptap/core/extensions/search';
+import { Status } from 'tiptap/core/extensions/status';
+
+// markdown 支持
+import { markdownToProsemirror } from 'tiptap/markdown/markdown-to-prosemirror';
+import { markdownToHTML } from 'tiptap/markdown/markdown-to-prosemirror/markdown-to-html';
+import { prosemirrorToMarkdown } from 'tiptap/markdown/prosemirror-to-markdown';
+
+const DocumentWithTitle = Document.extend({
+  content: 'title block+',
+});
+
+export const CollaborationKit = [
+  Paragraph,
+  Placeholder.configure({
+    placeholder: ({ node, editor }) => {
+      if (!editor.isEditable) return;
+
+      if (node.type.name === 'title') {
+        return '请输入标题';
+      }
+      return '输入 / 唤起更多';
+    },
+    showOnlyCurrent: false,
+    showOnlyWhenEditable: true,
+  }),
+  BackgroundColor,
+  Blockquote,
+  Bold,
+  BulletList,
+  Code,
+  CodeBlock,
+  Color,
+  ColorHighlighter,
+  Dropcursor,
+  EventEmitter,
+  Focus,
+  FontSize,
+  Gapcursor,
+  HardBreak,
+  Heading,
+  HorizontalRule,
+  ...HTMLMarks,
+  Image,
+  Indent,
+  Italic,
+  Link,
+  ListItem,
+  Loading,
+  OrderedList,
+  SelectionExtension,
+  Strike,
+  Subscript,
+  Superscript,
+  Table,
+  TableCell,
+  TableHeader,
+  TableRow,
+  Text,
+  TextAlign,
+  TextStyle,
+  TaskItem,
+  TaskList,
+  TrailingNode,
+  Underline,
+  Paste.configure({
+    markdownToHTML,
+    markdownToProsemirror,
+    prosemirrorToMarkdown,
+  }),
+  Attachment,
+  Callout,
+  Countdown,
+  DocumentChildren,
+  DocumentReference,
+  Emoji,
+  Iframe,
+  Katex,
+  Mention,
+  Mind,
+  QuickInsert,
+  SearchNReplace,
+  Status,
+  Title,
+  // Document,
+  DocumentWithTitle,
+];
diff --git a/packages/client/src/tiptap/editor/collaboration/reader.tsx b/packages/client/src/tiptap/editor/collaboration/reader.tsx
new file mode 100644
index 00000000..22e63dfd
--- /dev/null
+++ b/packages/client/src/tiptap/editor/collaboration/reader.tsx
@@ -0,0 +1,27 @@
+import React, { useMemo } from 'react';
+import { safeJSONParse } from 'helpers/json';
+import { useEditor, EditorContent } from '../react';
+import { CollaborationKit } from './kit';
+
+interface IProps {
+  content: string;
+}
+
+export const ReaderEditor: React.FC<IProps> = ({ content }) => {
+  const json = useMemo(() => {
+    const c = safeJSONParse(content);
+    const json = c.default || c;
+    return json;
+  }, [content]);
+
+  const editor = useEditor(
+    {
+      editable: false,
+      extensions: CollaborationKit,
+      content: json,
+    },
+    [json]
+  );
+
+  return <EditorContent editor={editor} />;
+};
diff --git a/packages/client/src/tiptap/editor/comment/index.ts b/packages/client/src/tiptap/editor/comment/index.ts
new file mode 100644
index 00000000..211af9d0
--- /dev/null
+++ b/packages/client/src/tiptap/editor/comment/index.ts
@@ -0,0 +1,2 @@
+export * from './kit';
+export * from './menubar';
diff --git a/packages/client/src/tiptap/editor/comment/kit.ts b/packages/client/src/tiptap/editor/comment/kit.ts
new file mode 100644
index 00000000..e9788180
--- /dev/null
+++ b/packages/client/src/tiptap/editor/comment/kit.ts
@@ -0,0 +1,103 @@
+import { Document } from 'tiptap/core/extensions/document';
+import History from '@tiptap/extension-history';
+import { BackgroundColor } from 'tiptap/core/extensions/background-color';
+import { Blockquote } from 'tiptap/core/extensions/blockquote';
+import { Bold } from 'tiptap/core/extensions/bold';
+import { BulletList } from 'tiptap/core/extensions/bullet-list';
+import { Code } from 'tiptap/core/extensions/code';
+import { CodeBlock } from 'tiptap/core/extensions/code-block';
+import { Color } from 'tiptap/core/extensions/color';
+import { ColorHighlighter } from 'tiptap/core/extensions/color-highlighter';
+import { Dropcursor } from 'tiptap/core/extensions/dropcursor';
+import { EventEmitter } from 'tiptap/core/extensions/event-emitter';
+import { Emoji } from 'tiptap/core/extensions/emoji';
+import { Focus } from 'tiptap/core/extensions/focus';
+import { FontSize } from 'tiptap/core/extensions/font-size';
+import { Gapcursor } from 'tiptap/core/extensions/gapcursor';
+import { HardBreak } from 'tiptap/core/extensions/hard-break';
+import { Heading } from 'tiptap/core/extensions/heading';
+import { HorizontalRule } from 'tiptap/core/extensions/horizontal-rule';
+import { HTMLMarks } from 'tiptap/core/extensions/html-marks';
+import { Indent } from 'tiptap/core/extensions/indent';
+import { Italic } from 'tiptap/core/extensions/italic';
+import { Katex } from 'tiptap/core/extensions/katex';
+import { Link } from 'tiptap/core/extensions/link';
+import { ListItem } from 'tiptap/core/extensions/listItem';
+import { Mention } from 'tiptap/core/extensions/mention';
+import { OrderedList } from 'tiptap/core/extensions/ordered-list';
+import { Paragraph } from 'tiptap/core/extensions/paragraph';
+import { Placeholder } from 'tiptap/core/extensions/placeholder';
+import { Strike } from 'tiptap/core/extensions/strike';
+import { Subscript } from 'tiptap/core/extensions/subscript';
+import { Superscript } from 'tiptap/core/extensions/superscript';
+import { Table } from 'tiptap/core/extensions/table';
+import { TableCell } from 'tiptap/core/extensions/table-cell';
+import { TableHeader } from 'tiptap/core/extensions/table-header';
+import { TableRow } from 'tiptap/core/extensions/table-row';
+import { Text } from 'tiptap/core/extensions/text';
+import { TextAlign } from 'tiptap/core/extensions/text-align';
+import { TextStyle } from 'tiptap/core/extensions/text-style';
+import { TaskItem } from 'tiptap/core/extensions/task-item';
+import { TaskList } from 'tiptap/core/extensions/task-list';
+import { TrailingNode } from 'tiptap/core/extensions/trailing-node';
+import { Underline } from 'tiptap/core/extensions/underline';
+import { Paste } from 'tiptap/core/extensions/paste';
+
+// markdown 支持
+import { markdownToProsemirror } from 'tiptap/markdown/markdown-to-prosemirror';
+import { markdownToHTML } from 'tiptap/markdown/markdown-to-prosemirror/markdown-to-html';
+import { prosemirrorToMarkdown } from 'tiptap/markdown/prosemirror-to-markdown';
+
+export const CommentKit = [
+  BackgroundColor,
+  Blockquote,
+  Bold,
+  BulletList,
+  Code,
+  CodeBlock,
+  Color,
+  ColorHighlighter,
+  Document,
+  Dropcursor,
+  EventEmitter,
+  Emoji,
+  Focus,
+  FontSize,
+  Gapcursor,
+  HardBreak,
+  Heading,
+  History,
+  HorizontalRule,
+  ...HTMLMarks,
+  Indent,
+  Italic,
+  Katex,
+  Link,
+  ListItem,
+  Mention,
+  OrderedList,
+  Paragraph,
+  Paste.configure({
+    markdownToHTML,
+    markdownToProsemirror,
+    prosemirrorToMarkdown,
+  }),
+  Placeholder.configure({
+    placeholder: '请输入内容',
+    showOnlyWhenEditable: true,
+  }),
+  Strike,
+  Subscript,
+  Superscript,
+  Table,
+  TableCell,
+  TableHeader,
+  TableRow,
+  Text,
+  TextAlign,
+  TextStyle,
+  TaskItem,
+  TaskList,
+  TrailingNode,
+  Underline,
+];
diff --git a/packages/client/src/tiptap/editor/comment/menubar.tsx b/packages/client/src/tiptap/editor/comment/menubar.tsx
new file mode 100644
index 00000000..0b7b5409
--- /dev/null
+++ b/packages/client/src/tiptap/editor/comment/menubar.tsx
@@ -0,0 +1,48 @@
+import React from 'react';
+import { Editor } from 'tiptap/editor';
+import { Space } from '@douyinfe/semi-ui';
+import { Divider } from 'tiptap/components/divider';
+
+import { Undo } from 'tiptap/editor/menus/undo';
+import { Redo } from 'tiptap/editor/menus/redo';
+import { CleadrNodeAndMarks } from 'tiptap/editor/menus/clear-node-and-marks';
+
+import { Heading } from 'tiptap/editor/menus/heading';
+import { Bold } from 'tiptap/editor/menus/bold';
+import { Italic } from 'tiptap/editor/menus/italic';
+import { Underline } from 'tiptap/editor/menus/underline';
+import { Strike } from 'tiptap/editor/menus/strike';
+import { Code } from 'tiptap/editor/menus/code';
+import { Superscript } from 'tiptap/editor/menus/superscript';
+import { Subscript } from 'tiptap/editor/menus/subscript';
+import { TextColor } from 'tiptap/editor/menus/text-color';
+import { BackgroundColor } from 'tiptap/editor/menus/background-color';
+
+const _CommentMenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
+  return (
+    <>
+      <Space spacing={2}>
+        <Undo editor={editor} />
+        <Redo editor={editor} />
+        <CleadrNodeAndMarks editor={editor} />
+
+        <Divider />
+
+        <Heading editor={editor} />
+        <Bold editor={editor} />
+        <Italic editor={editor} />
+        <Underline editor={editor} />
+        <Strike editor={editor} />
+        <Code editor={editor} />
+        <Superscript editor={editor} />
+        <Subscript editor={editor} />
+        <TextColor editor={editor} />
+        <BackgroundColor editor={editor} />
+      </Space>
+    </>
+  );
+};
+
+export const CommentMenuBar = React.memo(_CommentMenuBar, (prevProps, nextProps) => {
+  return prevProps.editor === nextProps.editor;
+});
diff --git a/packages/client/src/tiptap/hooks/use-active.tsx b/packages/client/src/tiptap/editor/hooks/use-active.tsx
similarity index 100%
rename from packages/client/src/tiptap/hooks/use-active.tsx
rename to packages/client/src/tiptap/editor/hooks/use-active.tsx
diff --git a/packages/client/src/tiptap/hooks/use-attributes.tsx b/packages/client/src/tiptap/editor/hooks/use-attributes.tsx
similarity index 100%
rename from packages/client/src/tiptap/hooks/use-attributes.tsx
rename to packages/client/src/tiptap/editor/hooks/use-attributes.tsx
diff --git a/packages/client/src/tiptap/editor/index.tsx b/packages/client/src/tiptap/editor/index.tsx
new file mode 100644
index 00000000..6082bef4
--- /dev/null
+++ b/packages/client/src/tiptap/editor/index.tsx
@@ -0,0 +1,3 @@
+export * from './collaboration';
+export * from './comment';
+export * from './react';
diff --git a/packages/client/src/tiptap/editor/menus/_event.ts b/packages/client/src/tiptap/editor/menus/_event.ts
new file mode 100644
index 00000000..71286e40
--- /dev/null
+++ b/packages/client/src/tiptap/editor/menus/_event.ts
@@ -0,0 +1,34 @@
+import { Editor } from 'tiptap/editor';
+import { EventEmitter } from 'helpers/event-emitter';
+
+const getEventEmitter = (editor: Editor): EventEmitter => {
+  try {
+    const event = editor.eventEmitter;
+    return event;
+  } catch (e) {
+    throw new Error('未找到 EventEmitter 模块！');
+  }
+};
+
+export const OPEN_COUNT_SETTING_MODAL = 'OPEN_COUNT_SETTING_MODAL';
+export const OPEN_LINK_SETTING_MODAL = 'OPEN_LINK_SETTING_MODAL';
+
+export const subject = (editor: Editor, eventName, handler) => {
+  const event = getEventEmitter(editor);
+  event.on(eventName, handler);
+};
+
+export const cancelSubject = (editor: Editor, eventName, handler) => {
+  const event = getEventEmitter(editor);
+  event.off(eventName, handler);
+};
+
+export const triggerOpenCountSettingModal = (editor: Editor, data) => {
+  const event = getEventEmitter(editor);
+  event.emit(OPEN_COUNT_SETTING_MODAL, data);
+};
+
+export const triggerOpenLinkSettingModal = (editor: Editor, data) => {
+  const event = getEventEmitter(editor);
+  event.emit(OPEN_LINK_SETTING_MODAL, data);
+};
diff --git a/packages/client/src/tiptap/menus/align/index.tsx b/packages/client/src/tiptap/editor/menus/align/index.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/align/index.tsx
rename to packages/client/src/tiptap/editor/menus/align/index.tsx
index 394ba5c6..61e9ba17 100644
--- a/packages/client/src/tiptap/menus/align/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/align/index.tsx
@@ -1,9 +1,9 @@
 import React, { useCallback, useMemo } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button, Dropdown, Tooltip } from '@douyinfe/semi-ui';
 import { IconAlignLeft, IconAlignCenter, IconAlignRight, IconAlignJustify } from '@douyinfe/semi-icons';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 
 export const Align: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/attachment/bubble.tsx b/packages/client/src/tiptap/editor/menus/attachment/bubble.tsx
similarity index 86%
rename from packages/client/src/tiptap/menus/attachment/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/attachment/bubble.tsx
index 4774a124..365ac760 100644
--- a/packages/client/src/tiptap/menus/attachment/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/attachment/bubble.tsx
@@ -1,10 +1,10 @@
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Attachment } from 'tiptap/extensions/attachment';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Attachment } from 'tiptap/core/extensions/attachment';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
-import { Divider } from 'tiptap/divider';
+import { Divider } from 'tiptap/components/divider';
 import { useCallback } from 'react';
 
 export const AttachmentBubbleMenu = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/attachment/index.tsx b/packages/client/src/tiptap/editor/menus/attachment/index.tsx
similarity index 85%
rename from packages/client/src/tiptap/menus/attachment/index.tsx
rename to packages/client/src/tiptap/editor/menus/attachment/index.tsx
index fed6e993..f39e72e3 100644
--- a/packages/client/src/tiptap/menus/attachment/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/attachment/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { AttachmentBubbleMenu } from './bubble';
 
 export const Attachment: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/background-color/index.tsx b/packages/client/src/tiptap/editor/menus/background-color/index.tsx
similarity index 82%
rename from packages/client/src/tiptap/menus/background-color/index.tsx
rename to packages/client/src/tiptap/editor/menus/background-color/index.tsx
index f25377f0..1107ea09 100644
--- a/packages/client/src/tiptap/menus/background-color/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/background-color/index.tsx
@@ -1,12 +1,12 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconMark } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { ColorPicker } from '../_components/color-picker';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { ColorPicker } from 'tiptap/components/color-picker';
 
 const FlexStyle: React.CSSProperties = {
   display: 'flex',
diff --git a/packages/client/src/tiptap/menus/blockquote/index.tsx b/packages/client/src/tiptap/editor/menus/blockquote/index.tsx
similarity index 76%
rename from packages/client/src/tiptap/menus/blockquote/index.tsx
rename to packages/client/src/tiptap/editor/menus/blockquote/index.tsx
index 03327b3c..4336684c 100644
--- a/packages/client/src/tiptap/menus/blockquote/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/blockquote/index.tsx
@@ -1,11 +1,11 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import { IconQuote } from 'components/icons';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Blockquote as BlockquoteExtension } from 'tiptap/extensions/blockquote';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Blockquote as BlockquoteExtension } from 'tiptap/core/extensions/blockquote';
 
 export const Blockquote: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/bold/index.tsx b/packages/client/src/tiptap/editor/menus/bold/index.tsx
similarity index 74%
rename from packages/client/src/tiptap/menus/bold/index.tsx
rename to packages/client/src/tiptap/editor/menus/bold/index.tsx
index 561de915..9b8ca64e 100644
--- a/packages/client/src/tiptap/menus/bold/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/bold/index.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconBold } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Bold as BoldExtension } from 'tiptap/extensions/bold';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Bold as BoldExtension } from 'tiptap/core/extensions/bold';
 
 export const Bold: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/bullet-list/index.tsx b/packages/client/src/tiptap/editor/menus/bullet-list/index.tsx
similarity index 75%
rename from packages/client/src/tiptap/menus/bullet-list/index.tsx
rename to packages/client/src/tiptap/editor/menus/bullet-list/index.tsx
index 3ce4aa28..b1399446 100644
--- a/packages/client/src/tiptap/menus/bullet-list/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/bullet-list/index.tsx
@@ -1,11 +1,11 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconList } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { BulletList as BulletListExtension } from 'tiptap/extensions/bullet-list';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { BulletList as BulletListExtension } from 'tiptap/core/extensions/bullet-list';
 
 export const BulletList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/callout/bubble.module.scss b/packages/client/src/tiptap/editor/menus/callout/bubble.module.scss
similarity index 100%
rename from packages/client/src/tiptap/menus/callout/bubble.module.scss
rename to packages/client/src/tiptap/editor/menus/callout/bubble.module.scss
diff --git a/packages/client/src/tiptap/menus/callout/bubble.tsx b/packages/client/src/tiptap/editor/menus/callout/bubble.tsx
similarity index 94%
rename from packages/client/src/tiptap/menus/callout/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/callout/bubble.tsx
index 0c056210..19216db1 100644
--- a/packages/client/src/tiptap/menus/callout/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/callout/bubble.tsx
@@ -1,12 +1,12 @@
 import { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Space, Button, Popover, Typography } from '@douyinfe/semi-ui';
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
 import { IconDrawBoard } from 'components/icons';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Divider } from 'tiptap/divider';
-import { Callout } from 'tiptap/extensions/callout';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Divider } from 'tiptap/components/divider';
+import { Callout } from 'tiptap/core/extensions/callout';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 import styles from './bubble.module.scss';
 
diff --git a/packages/client/src/tiptap/menus/callout/index.tsx b/packages/client/src/tiptap/editor/menus/callout/index.tsx
similarity index 84%
rename from packages/client/src/tiptap/menus/callout/index.tsx
rename to packages/client/src/tiptap/editor/menus/callout/index.tsx
index 2bb0a81e..9cc9e116 100644
--- a/packages/client/src/tiptap/menus/callout/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/callout/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { CalloutBubbleMenu } from './bubble';
 
 export const Callout: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/clear-node-and-marks/index.tsx b/packages/client/src/tiptap/editor/menus/clear-node-and-marks/index.tsx
similarity index 93%
rename from packages/client/src/tiptap/menus/clear-node-and-marks/index.tsx
rename to packages/client/src/tiptap/editor/menus/clear-node-and-marks/index.tsx
index 368f6bca..5759bb17 100644
--- a/packages/client/src/tiptap/menus/clear-node-and-marks/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/clear-node-and-marks/index.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconClear } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
diff --git a/packages/client/src/tiptap/menus/code-block/bubble.tsx b/packages/client/src/tiptap/editor/menus/code-block/bubble.tsx
similarity index 87%
rename from packages/client/src/tiptap/menus/code-block/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/code-block/bubble.tsx
index 890a50fe..4ab1c0db 100644
--- a/packages/client/src/tiptap/menus/code-block/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/code-block/bubble.tsx
@@ -2,10 +2,10 @@ import React, { useCallback } from 'react';
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { CodeBlock } from 'tiptap/extensions/code-block';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { CodeBlock } from 'tiptap/core/extensions/code-block';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
-import { Divider } from 'tiptap/divider';
+import { Divider } from 'tiptap/components/divider';
 
 export const CodeBlockBubbleMenu = ({ editor }) => {
   const copyMe = useCallback(() => copyNode(CodeBlock.name, editor), [editor]);
diff --git a/packages/client/src/tiptap/menus/code-block/index.tsx b/packages/client/src/tiptap/editor/menus/code-block/index.tsx
similarity index 85%
rename from packages/client/src/tiptap/menus/code-block/index.tsx
rename to packages/client/src/tiptap/editor/menus/code-block/index.tsx
index d700c8d0..83734082 100644
--- a/packages/client/src/tiptap/menus/code-block/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/code-block/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { CodeBlockBubbleMenu } from './bubble';
 
 export const CodeBlock: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/code/index.tsx b/packages/client/src/tiptap/editor/menus/code/index.tsx
similarity index 74%
rename from packages/client/src/tiptap/menus/code/index.tsx
rename to packages/client/src/tiptap/editor/menus/code/index.tsx
index 7b26b946..cf4b4a41 100644
--- a/packages/client/src/tiptap/menus/code/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/code/index.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconCode } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Code as InlineCode } from 'tiptap/extensions/code';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Code as InlineCode } from 'tiptap/core/extensions/code';
 
 export const Code: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/countdown/bubble.tsx b/packages/client/src/tiptap/editor/menus/countdown/bubble.tsx
similarity index 82%
rename from packages/client/src/tiptap/menus/countdown/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/countdown/bubble.tsx
index c4f369eb..f1684698 100644
--- a/packages/client/src/tiptap/menus/countdown/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/countdown/bubble.tsx
@@ -2,19 +2,19 @@ import { useCallback } from 'react';
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconEdit, IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Countdown } from 'tiptap/extensions/countdown';
-import { Divider } from 'tiptap/divider';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Countdown } from 'tiptap/core/extensions/countdown';
+import { Divider } from 'tiptap/components/divider';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
 import { triggerOpenCountSettingModal } from '../_event';
 
 export const CountdownBubbleMenu = ({ editor }) => {
   const attrs = useAttributes(editor, Countdown.name, {});
 
   const openEditLinkModal = useCallback(() => {
-    triggerOpenCountSettingModal(attrs);
-  }, [attrs]);
+    triggerOpenCountSettingModal(editor, attrs);
+  }, [editor, attrs]);
 
   const copyMe = useCallback(() => copyNode(Countdown.name, editor), [editor]);
   const deleteMe = useCallback(() => deleteNode(Countdown.name, editor), [editor]);
diff --git a/packages/client/src/tiptap/menus/countdown/index.tsx b/packages/client/src/tiptap/editor/menus/countdown/index.tsx
similarity index 89%
rename from packages/client/src/tiptap/menus/countdown/index.tsx
rename to packages/client/src/tiptap/editor/menus/countdown/index.tsx
index a922226d..b24dd680 100644
--- a/packages/client/src/tiptap/menus/countdown/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/countdown/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { CountdownBubbleMenu } from './bubble';
 import { CountdownSettingModal } from './modal';
 
diff --git a/packages/client/src/tiptap/menus/countdown/modal.tsx b/packages/client/src/tiptap/editor/menus/countdown/modal.tsx
similarity index 83%
rename from packages/client/src/tiptap/menus/countdown/modal.tsx
rename to packages/client/src/tiptap/editor/menus/countdown/modal.tsx
index d1be6988..70e3e796 100644
--- a/packages/client/src/tiptap/menus/countdown/modal.tsx
+++ b/packages/client/src/tiptap/editor/menus/countdown/modal.tsx
@@ -1,9 +1,9 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Form, Modal } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { useToggle } from 'hooks/use-toggle';
-import { event, OPEN_COUNT_SETTING_MODAL } from '../_event';
+import { OPEN_COUNT_SETTING_MODAL, subject, cancelSubject } from '../_event';
 
 type IProps = { editor: Editor };
 
@@ -25,12 +25,12 @@ export const CountdownSettingModal: React.FC<IProps> = ({ editor }) => {
       data && setInitialState(data);
     };
 
-    event.on(OPEN_COUNT_SETTING_MODAL, handler);
+    subject(editor, OPEN_COUNT_SETTING_MODAL, handler);
 
     return () => {
-      event.off(OPEN_COUNT_SETTING_MODAL, handler);
+      cancelSubject(editor, OPEN_COUNT_SETTING_MODAL, handler);
     };
-  }, [toggleVisible]);
+  }, [editor, toggleVisible]);
 
   return (
     <Modal centered title="倒计时" visible={visible} onOk={handleOk} onCancel={() => toggleVisible(false)}>
diff --git a/packages/client/src/tiptap/menus/countdown/service.ts b/packages/client/src/tiptap/editor/menus/countdown/service.ts
similarity index 83%
rename from packages/client/src/tiptap/menus/countdown/service.ts
rename to packages/client/src/tiptap/editor/menus/countdown/service.ts
index 2a22a941..d001ff33 100644
--- a/packages/client/src/tiptap/menus/countdown/service.ts
+++ b/packages/client/src/tiptap/editor/menus/countdown/service.ts
@@ -1,4 +1,4 @@
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { triggerOpenCountSettingModal } from '../_event';
 
 /**
diff --git a/packages/client/src/tiptap/menus/document-children/bubble.tsx b/packages/client/src/tiptap/editor/menus/document-children/bubble.tsx
similarity index 86%
rename from packages/client/src/tiptap/menus/document-children/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/document-children/bubble.tsx
index be680303..fc43b809 100644
--- a/packages/client/src/tiptap/menus/document-children/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/document-children/bubble.tsx
@@ -2,10 +2,10 @@ import React, { useCallback } from 'react';
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { DocumentChildren } from 'tiptap/extensions/document-children';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { DocumentChildren } from 'tiptap/core/extensions/document-children';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
-import { Divider } from 'tiptap/divider';
+import { Divider } from 'tiptap/components/divider';
 
 export const DocumentChildrenBubbleMenu = ({ editor }) => {
   const copyMe = useCallback(() => copyNode(DocumentChildren.name, editor), [editor]);
diff --git a/packages/client/src/tiptap/menus/document-children/index.tsx b/packages/client/src/tiptap/editor/menus/document-children/index.tsx
similarity index 86%
rename from packages/client/src/tiptap/menus/document-children/index.tsx
rename to packages/client/src/tiptap/editor/menus/document-children/index.tsx
index 03a4348d..9f54245a 100644
--- a/packages/client/src/tiptap/menus/document-children/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/document-children/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { DocumentChildrenBubbleMenu } from './bubble';
 
 export const DocumentChildren: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/document-reference/bubble.tsx b/packages/client/src/tiptap/editor/menus/document-reference/bubble.tsx
similarity index 94%
rename from packages/client/src/tiptap/menus/document-reference/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/document-reference/bubble.tsx
index 4cd21e0d..46bd4112 100644
--- a/packages/client/src/tiptap/menus/document-reference/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/document-reference/bubble.tsx
@@ -6,9 +6,9 @@ import { Tooltip } from 'components/tooltip';
 import { DataRender } from 'components/data-render';
 import { IconDocument } from 'components/icons';
 import { useWikiTocs } from 'data/wiki';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { DocumentReference } from 'tiptap/extensions/document-reference';
-import { Divider } from 'tiptap/divider';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { DocumentReference } from 'tiptap/core/extensions/document-reference';
+import { Divider } from 'tiptap/components/divider';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 const { Text } = Typography;
diff --git a/packages/client/src/tiptap/menus/document-reference/index.tsx b/packages/client/src/tiptap/editor/menus/document-reference/index.tsx
similarity index 86%
rename from packages/client/src/tiptap/menus/document-reference/index.tsx
rename to packages/client/src/tiptap/editor/menus/document-reference/index.tsx
index 22342c0b..0b69d3d2 100644
--- a/packages/client/src/tiptap/menus/document-reference/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/document-reference/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { DocumentReferenceBubbleMenu } from './bubble';
 
 export const DocumentReference: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/emoji/index.tsx b/packages/client/src/tiptap/editor/menus/emoji/index.tsx
similarity index 95%
rename from packages/client/src/tiptap/menus/emoji/index.tsx
rename to packages/client/src/tiptap/editor/menus/emoji/index.tsx
index 9af7f848..4c28080f 100644
--- a/packages/client/src/tiptap/menus/emoji/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/emoji/index.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import { IconEmoji } from 'components/icons';
diff --git a/packages/client/src/tiptap/menus/fontsize/index.tsx b/packages/client/src/tiptap/editor/menus/fontsize/index.tsx
similarity index 80%
rename from packages/client/src/tiptap/menus/fontsize/index.tsx
rename to packages/client/src/tiptap/editor/menus/fontsize/index.tsx
index b2b41671..97d5a9d5 100644
--- a/packages/client/src/tiptap/menus/fontsize/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/fontsize/index.tsx
@@ -1,9 +1,9 @@
 import React, { useCallback } from 'react';
 import { Select } from '@douyinfe/semi-ui';
-import { Editor } from '@tiptap/core';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
+import { Editor } from 'tiptap/editor';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
 
 export const FONT_SIZES = [12, 13, 14, 15, 16, 19, 22, 24, 29, 32, 40, 48];
 
diff --git a/packages/client/src/tiptap/menus/heading/index.tsx b/packages/client/src/tiptap/editor/menus/heading/index.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/heading/index.tsx
rename to packages/client/src/tiptap/editor/menus/heading/index.tsx
index 17dfda27..762b09db 100644
--- a/packages/client/src/tiptap/menus/heading/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/heading/index.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback, useMemo } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Select } from '@douyinfe/semi-ui';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 
 export const Heading: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/horizontal-rule/index.tsx b/packages/client/src/tiptap/editor/menus/horizontal-rule/index.tsx
similarity index 81%
rename from packages/client/src/tiptap/menus/horizontal-rule/index.tsx
rename to packages/client/src/tiptap/editor/menus/horizontal-rule/index.tsx
index 72d95ead..54474991 100644
--- a/packages/client/src/tiptap/menus/horizontal-rule/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/horizontal-rule/index.tsx
@@ -1,10 +1,10 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import { IconHorizontalRule } from 'components/icons';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 
 export const HorizontalRule: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/ident/index.tsx b/packages/client/src/tiptap/editor/menus/ident/index.tsx
similarity index 87%
rename from packages/client/src/tiptap/menus/ident/index.tsx
rename to packages/client/src/tiptap/editor/menus/ident/index.tsx
index f0c261c6..ddfcdcfa 100644
--- a/packages/client/src/tiptap/menus/ident/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/ident/index.tsx
@@ -1,10 +1,10 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconIndentLeft, IconIndentRight } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 
 export const Ident: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/iframe/bubble.tsx b/packages/client/src/tiptap/editor/menus/iframe/bubble.tsx
similarity index 93%
rename from packages/client/src/tiptap/menus/iframe/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/iframe/bubble.tsx
index 88bb63d2..06b3ace4 100644
--- a/packages/client/src/tiptap/menus/iframe/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/iframe/bubble.tsx
@@ -4,12 +4,12 @@ import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
 import { IconEdit, IconExternalOpen, IconLineHeight, IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { useToggle } from 'hooks/use-toggle';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Iframe } from 'tiptap/extensions/iframe';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Iframe } from 'tiptap/core/extensions/iframe';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
-import { Divider } from 'tiptap/divider';
-import { Size } from '../_components/size';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { Divider } from 'tiptap/components/divider';
+import { Size } from 'tiptap/components/size';
 
 const { Text } = Typography;
 
diff --git a/packages/client/src/tiptap/menus/iframe/index.tsx b/packages/client/src/tiptap/editor/menus/iframe/index.tsx
similarity index 84%
rename from packages/client/src/tiptap/menus/iframe/index.tsx
rename to packages/client/src/tiptap/editor/menus/iframe/index.tsx
index 640e8a6f..05f922e0 100644
--- a/packages/client/src/tiptap/menus/iframe/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/iframe/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { IframeBubbleMenu } from './bubble';
 
 export const Iframe: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/image/bubble.tsx b/packages/client/src/tiptap/editor/menus/image/bubble.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/image/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/image/bubble.tsx
index b9aea477..caa4998e 100644
--- a/packages/client/src/tiptap/menus/image/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/image/bubble.tsx
@@ -9,12 +9,12 @@ import {
   IconDelete,
 } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Divider } from 'tiptap/divider';
-import { Image } from 'tiptap/extensions/image';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Divider } from 'tiptap/components/divider';
+import { Image } from 'tiptap/core/extensions/image';
 import { getEditorContainerDOMSize, copyNode, deleteNode } from 'tiptap/prose-utils';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
-import { Size } from '../_components/size';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { Size } from 'tiptap/components/size';
 
 export const ImageBubbleMenu = ({ editor }) => {
   const { width: maxWidth } = getEditorContainerDOMSize(editor);
diff --git a/packages/client/src/tiptap/menus/image/index.tsx b/packages/client/src/tiptap/editor/menus/image/index.tsx
similarity index 84%
rename from packages/client/src/tiptap/menus/image/index.tsx
rename to packages/client/src/tiptap/editor/menus/image/index.tsx
index 72f8e9e1..696b2084 100644
--- a/packages/client/src/tiptap/menus/image/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/image/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { ImageBubbleMenu } from './bubble';
 
 export const Image: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/insert/index.tsx b/packages/client/src/tiptap/editor/menus/insert/index.tsx
similarity index 97%
rename from packages/client/src/tiptap/menus/insert/index.tsx
rename to packages/client/src/tiptap/editor/menus/insert/index.tsx
index 40191728..05fee33c 100644
--- a/packages/client/src/tiptap/menus/insert/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/insert/index.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button, Dropdown, Popover } from '@douyinfe/semi-ui';
 import { IconPlus } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
@@ -21,8 +21,8 @@ import { useToggle } from 'hooks/use-toggle';
 import { useUser } from 'data/user';
 import { createKeysLocalStorageLRUCache } from 'helpers/lru-cache';
 import { getEditorContainerDOMSize } from 'tiptap/prose-utils';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 import { createCountdown } from '../countdown/service';
 
 const insertMenuLRUCache = createKeysLocalStorageLRUCache('TIPTAP_INSERT_MENU', 3);
diff --git a/packages/client/src/tiptap/menus/italic/index.tsx b/packages/client/src/tiptap/editor/menus/italic/index.tsx
similarity index 74%
rename from packages/client/src/tiptap/menus/italic/index.tsx
rename to packages/client/src/tiptap/editor/menus/italic/index.tsx
index 4efe630d..86bc1951 100644
--- a/packages/client/src/tiptap/menus/italic/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/italic/index.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconItalic } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Italic as ItalicExtension } from 'tiptap/extensions/italic';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Italic as ItalicExtension } from 'tiptap/core/extensions/italic';
 
 export const Italic: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/link/bubble.tsx b/packages/client/src/tiptap/editor/menus/link/bubble.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/link/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/link/bubble.tsx
index 8b4af9c3..b488b709 100644
--- a/packages/client/src/tiptap/menus/link/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/link/bubble.tsx
@@ -2,11 +2,11 @@ import { useEffect, useState, useRef, useCallback } from 'react';
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconExternalOpen, IconUnlink, IconEdit } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { Divider } from 'tiptap/divider';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Link } from 'tiptap/extensions/link';
+import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Link } from 'tiptap/core/extensions/link';
 import { isMarkActive, findMarkPosition } from 'tiptap/prose-utils';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
 import { triggerOpenLinkSettingModal } from '../_event';
 
 export const LinkBubbleMenu = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/link/index.tsx b/packages/client/src/tiptap/editor/menus/link/index.tsx
similarity index 81%
rename from packages/client/src/tiptap/menus/link/index.tsx
rename to packages/client/src/tiptap/editor/menus/link/index.tsx
index 058f2bf5..c36b1ca5 100644
--- a/packages/client/src/tiptap/menus/link/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/link/index.tsx
@@ -1,11 +1,11 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import { IconLink } from 'components/icons';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Link as LinkExtension } from 'tiptap/extensions/link';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Link as LinkExtension } from 'tiptap/core/extensions/link';
 import { createOrToggleLink } from './service';
 import { LinkBubbleMenu } from './bubble';
 import { LinkSettingModal } from './modal';
diff --git a/packages/client/src/tiptap/menus/link/modal.tsx b/packages/client/src/tiptap/editor/menus/link/modal.tsx
similarity index 89%
rename from packages/client/src/tiptap/menus/link/modal.tsx
rename to packages/client/src/tiptap/editor/menus/link/modal.tsx
index 0464a89f..3885189a 100644
--- a/packages/client/src/tiptap/menus/link/modal.tsx
+++ b/packages/client/src/tiptap/editor/menus/link/modal.tsx
@@ -1,10 +1,10 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { Form, Modal } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { useToggle } from 'hooks/use-toggle';
 import { isValidURL } from 'tiptap/prose-utils';
-import { event, OPEN_LINK_SETTING_MODAL } from '../_event';
+import { OPEN_LINK_SETTING_MODAL, subject, cancelSubject } from '../_event';
 
 type IProps = { editor: Editor };
 
@@ -37,10 +37,10 @@ export const LinkSettingModal: React.FC<IProps> = ({ editor }) => {
       data && setInitialState(data);
     };
 
-    event.on(OPEN_LINK_SETTING_MODAL, handler);
+    subject(editor, OPEN_LINK_SETTING_MODAL, handler);
 
     return () => {
-      event.off(OPEN_LINK_SETTING_MODAL, handler);
+      cancelSubject(editor, OPEN_LINK_SETTING_MODAL, handler);
     };
   }, [editor, toggleVisible]);
 
diff --git a/packages/client/src/tiptap/menus/link/service.ts b/packages/client/src/tiptap/editor/menus/link/service.ts
similarity index 77%
rename from packages/client/src/tiptap/menus/link/service.ts
rename to packages/client/src/tiptap/editor/menus/link/service.ts
index ee967864..e201a03b 100644
--- a/packages/client/src/tiptap/menus/link/service.ts
+++ b/packages/client/src/tiptap/editor/menus/link/service.ts
@@ -1,4 +1,4 @@
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor/react';
 import { isMarkActive } from 'tiptap/prose-utils';
 import { triggerOpenLinkSettingModal } from '../_event';
 
@@ -13,7 +13,7 @@ export const createOrToggleLink = (editor: Editor) => {
   if (!isInLink) {
     const selection = state.selection;
     const text = state.doc.textBetween(selection.from, selection.to);
-    triggerOpenLinkSettingModal({ text, href: '', from: selection.from, to: selection.to });
+    triggerOpenLinkSettingModal(editor, { text, href: '', from: selection.from, to: selection.to });
   } else {
     // @ts-ignore
     editor.chain().focus().toggleLink().run();
diff --git a/packages/client/src/tiptap/menus/mind/bubble.tsx b/packages/client/src/tiptap/editor/menus/mind/bubble.tsx
similarity index 86%
rename from packages/client/src/tiptap/menus/mind/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/mind/bubble.tsx
index d7786c2b..83a9a3c0 100644
--- a/packages/client/src/tiptap/menus/mind/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/mind/bubble.tsx
@@ -2,12 +2,12 @@ import { useCallback } from 'react';
 import { Space, Button } from '@douyinfe/semi-ui';
 import { IconCopy, IconLineHeight, IconDelete } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Mind } from 'tiptap/extensions/mind';
-import { Divider } from 'tiptap/divider';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Mind } from 'tiptap/core/extensions/mind';
+import { Divider } from 'tiptap/components/divider';
 import { getEditorContainerDOMSize, copyNode, deleteNode } from 'tiptap/prose-utils';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
-import { Size } from '../_components/size';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { Size } from 'tiptap/components/size';
 
 export const MindBubbleMenu = ({ editor }) => {
   const { width: maxWidth } = getEditorContainerDOMSize(editor);
diff --git a/packages/client/src/tiptap/menus/mind/index.tsx b/packages/client/src/tiptap/editor/menus/mind/index.tsx
similarity index 84%
rename from packages/client/src/tiptap/menus/mind/index.tsx
rename to packages/client/src/tiptap/editor/menus/mind/index.tsx
index 9075a5c9..1de00106 100644
--- a/packages/client/src/tiptap/menus/mind/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/mind/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { MindBubbleMenu } from './bubble';
 
 export const Mind: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/ordered-list/index.tsx b/packages/client/src/tiptap/editor/menus/ordered-list/index.tsx
similarity index 76%
rename from packages/client/src/tiptap/menus/ordered-list/index.tsx
rename to packages/client/src/tiptap/editor/menus/ordered-list/index.tsx
index d93aa4d2..473e64ef 100644
--- a/packages/client/src/tiptap/menus/ordered-list/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/ordered-list/index.tsx
@@ -1,11 +1,11 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconOrderedList } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { OrderedList as OrderedListExtension } from 'tiptap/extensions/ordered-list';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { OrderedList as OrderedListExtension } from 'tiptap/core/extensions/ordered-list';
 
 export const OrderedList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/quick-insert.tsx b/packages/client/src/tiptap/editor/menus/quick-insert.tsx
similarity index 99%
rename from packages/client/src/tiptap/menus/quick-insert.tsx
rename to packages/client/src/tiptap/editor/menus/quick-insert.tsx
index 25977b1d..215c0fa3 100644
--- a/packages/client/src/tiptap/menus/quick-insert.tsx
+++ b/packages/client/src/tiptap/editor/menus/quick-insert.tsx
@@ -1,4 +1,4 @@
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Space } from '@douyinfe/semi-ui';
 import { IconList, IconOrderedList } from '@douyinfe/semi-icons';
 import {
diff --git a/packages/client/src/tiptap/menus/redo/index.tsx b/packages/client/src/tiptap/editor/menus/redo/index.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/redo/index.tsx
rename to packages/client/src/tiptap/editor/menus/redo/index.tsx
index fb4156fd..1b301404 100644
--- a/packages/client/src/tiptap/menus/redo/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/redo/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconRedo } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
diff --git a/packages/client/src/tiptap/menus/search/index.tsx b/packages/client/src/tiptap/editor/menus/search/index.tsx
similarity index 96%
rename from packages/client/src/tiptap/menus/search/index.tsx
rename to packages/client/src/tiptap/editor/menus/search/index.tsx
index a6db56c2..8dabee92 100644
--- a/packages/client/src/tiptap/menus/search/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/search/index.tsx
@@ -1,9 +1,9 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { Popover, Button, Typography, Input, Space } from '@douyinfe/semi-ui';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Tooltip } from 'components/tooltip';
 import { IconSearchReplace } from 'components/icons';
-import { SearchNReplace } from 'tiptap/extensions/search';
+import { SearchNReplace } from 'tiptap/core/extensions/search';
 
 const { Text } = Typography;
 
diff --git a/packages/client/src/tiptap/menus/strike/index.tsx b/packages/client/src/tiptap/editor/menus/strike/index.tsx
similarity index 74%
rename from packages/client/src/tiptap/menus/strike/index.tsx
rename to packages/client/src/tiptap/editor/menus/strike/index.tsx
index d2b1a898..44b752f8 100644
--- a/packages/client/src/tiptap/menus/strike/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/strike/index.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconStrikeThrough } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Strike as StrikeExtension } from 'tiptap/extensions/strike';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Strike as StrikeExtension } from 'tiptap/core/extensions/strike';
 
 export const Strike: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/subscript/index.tsx b/packages/client/src/tiptap/editor/menus/subscript/index.tsx
similarity index 76%
rename from packages/client/src/tiptap/menus/subscript/index.tsx
rename to packages/client/src/tiptap/editor/menus/subscript/index.tsx
index 23a513a3..fe0f372c 100644
--- a/packages/client/src/tiptap/menus/subscript/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/subscript/index.tsx
@@ -2,9 +2,9 @@ import React from 'react';
 import { Button } from '@douyinfe/semi-ui';
 import { IconSub } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Subscript as SubscriptExtension } from 'tiptap/extensions/subscript';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Subscript as SubscriptExtension } from 'tiptap/core/extensions/subscript';
 
 export const Subscript: React.FC<{ editor: any }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/superscript/index.tsx b/packages/client/src/tiptap/editor/menus/superscript/index.tsx
similarity index 76%
rename from packages/client/src/tiptap/menus/superscript/index.tsx
rename to packages/client/src/tiptap/editor/menus/superscript/index.tsx
index 81307ea1..150e585e 100644
--- a/packages/client/src/tiptap/menus/superscript/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/superscript/index.tsx
@@ -2,9 +2,9 @@ import React from 'react';
 import { Button } from '@douyinfe/semi-ui';
 import { IconSup } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { Superscript as SuperscriptExtension } from 'tiptap/extensions/superscript';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { Superscript as SuperscriptExtension } from 'tiptap/core/extensions/superscript';
 
 export const Superscript: React.FC<{ editor: any }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/table/bubble.tsx b/packages/client/src/tiptap/editor/menus/table/bubble.tsx
similarity index 96%
rename from packages/client/src/tiptap/menus/table/bubble.tsx
rename to packages/client/src/tiptap/editor/menus/table/bubble.tsx
index 986541ee..9232c9be 100644
--- a/packages/client/src/tiptap/menus/table/bubble.tsx
+++ b/packages/client/src/tiptap/editor/menus/table/bubble.tsx
@@ -16,9 +16,9 @@ import {
   IconTableHeaderCell,
 } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
-import { Divider } from 'tiptap/divider';
-import { BubbleMenu } from 'tiptap/views/bubble-menu';
-import { Table } from 'tiptap/extensions/table';
+import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { Table } from 'tiptap/core/extensions/table';
 import { copyNode } from 'tiptap/prose-utils';
 
 export const TableBubbleMenu = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/table/index.tsx b/packages/client/src/tiptap/editor/menus/table/index.tsx
similarity index 82%
rename from packages/client/src/tiptap/menus/table/index.tsx
rename to packages/client/src/tiptap/editor/menus/table/index.tsx
index 02188c11..a2fb6dce 100644
--- a/packages/client/src/tiptap/menus/table/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/table/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { TableBubbleMenu } from './bubble';
 
 export const Table: React.FC<{ editor: Editor }> = ({ editor }) => {
diff --git a/packages/client/src/tiptap/menus/task-list/index.tsx b/packages/client/src/tiptap/editor/menus/task-list/index.tsx
similarity index 76%
rename from packages/client/src/tiptap/menus/task-list/index.tsx
rename to packages/client/src/tiptap/editor/menus/task-list/index.tsx
index e5335277..cce3eaae 100644
--- a/packages/client/src/tiptap/menus/task-list/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/task-list/index.tsx
@@ -1,11 +1,11 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import { IconTask } from 'components/icons';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { TaskList as TaskListExtension } from 'tiptap/extensions/task-list';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { TaskList as TaskListExtension } from 'tiptap/core/extensions/task-list';
 
 export const TaskList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/text-color/index.tsx b/packages/client/src/tiptap/editor/menus/text-color/index.tsx
similarity index 81%
rename from packages/client/src/tiptap/menus/text-color/index.tsx
rename to packages/client/src/tiptap/editor/menus/text-color/index.tsx
index 9fef691f..3837c047 100644
--- a/packages/client/src/tiptap/menus/text-color/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/text-color/index.tsx
@@ -1,13 +1,13 @@
 import React, { useCallback } from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconFont } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
-import { TextStyle } from 'tiptap/extensions/text-style';
-import { useAttributes } from 'tiptap/hooks/use-attributes';
-import { ColorPicker } from '../_components/color-picker';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
+import { TextStyle } from 'tiptap/core/extensions/text-style';
+import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { ColorPicker } from 'tiptap/components/color-picker';
 
 type Color = { color: string };
 
diff --git a/packages/client/src/tiptap/menus/underline/index.tsx b/packages/client/src/tiptap/editor/menus/underline/index.tsx
similarity index 80%
rename from packages/client/src/tiptap/menus/underline/index.tsx
rename to packages/client/src/tiptap/editor/menus/underline/index.tsx
index 59b01303..f2ca7a43 100644
--- a/packages/client/src/tiptap/menus/underline/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/underline/index.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconUnderline } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
-import { useActive } from 'tiptap/hooks/use-active';
-import { Title } from 'tiptap/extensions/title';
+import { useActive } from 'tiptap/editor/hooks/use-active';
+import { Title } from 'tiptap/core/extensions/title';
 
 export const Underline: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
diff --git a/packages/client/src/tiptap/menus/undo/index.tsx b/packages/client/src/tiptap/editor/menus/undo/index.tsx
similarity index 92%
rename from packages/client/src/tiptap/menus/undo/index.tsx
rename to packages/client/src/tiptap/editor/menus/undo/index.tsx
index 61120a31..3c876ca8 100644
--- a/packages/client/src/tiptap/menus/undo/index.tsx
+++ b/packages/client/src/tiptap/editor/menus/undo/index.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from '@tiptap/core';
+import { Editor } from 'tiptap/editor';
 import { Button } from '@douyinfe/semi-ui';
 import { IconUndo } from '@douyinfe/semi-icons';
 import { Tooltip } from 'components/tooltip';
diff --git a/packages/client/src/tiptap/editor/react/index.tsx b/packages/client/src/tiptap/editor/react/index.tsx
new file mode 100644
index 00000000..e2a551b0
--- /dev/null
+++ b/packages/client/src/tiptap/editor/react/index.tsx
@@ -0,0 +1,4 @@
+import { EditorContent, NodeViewWrapper, NodeViewContent } from '@tiptap/react';
+import { useEditor, Editor } from './useEditor';
+
+export { Editor, EditorContent, NodeViewWrapper, NodeViewContent, useEditor };
diff --git a/packages/client/src/tiptap/react/useEditor.tsx b/packages/client/src/tiptap/editor/react/useEditor.tsx
similarity index 73%
rename from packages/client/src/tiptap/react/useEditor.tsx
rename to packages/client/src/tiptap/editor/react/useEditor.tsx
index 5e68fdfb..a3f26625 100644
--- a/packages/client/src/tiptap/react/useEditor.tsx
+++ b/packages/client/src/tiptap/editor/react/useEditor.tsx
@@ -1,6 +1,7 @@
 import { useState, useEffect, DependencyList } from 'react';
 import { EditorOptions } from '@tiptap/core';
-import { Editor } from '@tiptap/react';
+import { Editor as BuiltInEditor } from '@tiptap/react';
+import { EventEmitter } from 'helpers/event-emitter';
 
 function useForceUpdate() {
   const [, setValue] = useState(0);
@@ -8,6 +9,10 @@ function useForceUpdate() {
   return () => setValue((value) => value + 1);
 }
 
+export class Editor extends BuiltInEditor {
+  public eventEmitter: EventEmitter = new EventEmitter();
+}
+
 export const useEditor = (options: Partial<EditorOptions> = {}, deps: DependencyList = []) => {
   const [editor, setEditor] = useState<Editor | null>(null);
   const forceUpdate = useForceUpdate();
@@ -28,6 +33,7 @@ export const useEditor = (options: Partial<EditorOptions> = {}, deps: Dependency
     return () => {
       instance.destroy();
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, deps);
 
   return editor;
diff --git a/packages/client/src/tiptap/views/bubble-menu/bubble-menu-plugin.tsx b/packages/client/src/tiptap/editor/views/bubble-menu/bubble-menu-plugin.tsx
similarity index 99%
rename from packages/client/src/tiptap/views/bubble-menu/bubble-menu-plugin.tsx
rename to packages/client/src/tiptap/editor/views/bubble-menu/bubble-menu-plugin.tsx
index 964290f9..10a1a488 100644
--- a/packages/client/src/tiptap/views/bubble-menu/bubble-menu-plugin.tsx
+++ b/packages/client/src/tiptap/editor/views/bubble-menu/bubble-menu-plugin.tsx
@@ -173,7 +173,6 @@ export class BubbleMenuView {
 
     if (!shouldShow) {
       this.hide();
-
       return;
     }
 
diff --git a/packages/client/src/tiptap/views/bubble-menu/index.tsx b/packages/client/src/tiptap/editor/views/bubble-menu/index.tsx
similarity index 100%
rename from packages/client/src/tiptap/views/bubble-menu/index.tsx
rename to packages/client/src/tiptap/editor/views/bubble-menu/index.tsx
diff --git a/packages/client/src/tiptap/views/float-menu.tsx b/packages/client/src/tiptap/editor/views/float-menu.tsx
similarity index 100%
rename from packages/client/src/tiptap/views/float-menu.tsx
rename to packages/client/src/tiptap/editor/views/float-menu.tsx
diff --git a/packages/client/src/tiptap/index.ts b/packages/client/src/tiptap/fix-match-nodes.ts
similarity index 61%
rename from packages/client/src/tiptap/index.ts
rename to packages/client/src/tiptap/fix-match-nodes.ts
index e975ea58..0d32441f 100644
--- a/packages/client/src/tiptap/index.ts
+++ b/packages/client/src/tiptap/fix-match-nodes.ts
@@ -4,11 +4,3 @@ EditorView.prototype.updateState = function updateState(state) {
   if (!this.docView) return; // This prevents the matchesNode error on hot reloads
   this.updateStateInner(state, this.state.plugins != state.plugins);
 };
-
-export { getSchema } from '@tiptap/core';
-export * from './react';
-export * from './start-kit';
-export * from './menubar';
-export * from './provider';
-export * from './indexdb';
-export * from './skeleton';
diff --git a/packages/client/src/tiptap/indexdb.ts b/packages/client/src/tiptap/indexdb.ts
deleted file mode 100644
index e2f0958b..00000000
--- a/packages/client/src/tiptap/indexdb.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { IndexeddbPersistence } from 'y-indexeddb';
-
-const POOL = new Map();
-
-export const getIndexdbProvider = (name, doc) => {
-  if (!POOL.has(name)) {
-    POOL.set(name, new IndexeddbPersistence(name, doc));
-  }
-
-  return POOL.get(name);
-};
-
-export const destoryIndexdbProvider = (name) => {
-  const provider = POOL.get(name);
-
-  if (!provider) return;
-
-  provider.destroy();
-  POOL.delete(name);
-};
diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/all-kit.tsx b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/all-kit.tsx
new file mode 100644
index 00000000..096bd3c8
--- /dev/null
+++ b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/all-kit.tsx
@@ -0,0 +1,133 @@
+// 基础扩展
+import { Document } from 'tiptap/core/extensions/document';
+import { BackgroundColor } from 'tiptap/core/extensions/background-color';
+import { Blockquote } from 'tiptap/core/extensions/blockquote';
+import { Bold } from 'tiptap/core/extensions/bold';
+import { BulletList } from 'tiptap/core/extensions/bullet-list';
+import { Code } from 'tiptap/core/extensions/code';
+import { CodeBlock } from 'tiptap/core/extensions/code-block';
+import { Color } from 'tiptap/core/extensions/color';
+import { ColorHighlighter } from 'tiptap/core/extensions/color-highlighter';
+import { Dropcursor } from 'tiptap/core/extensions/dropcursor';
+import { Focus } from 'tiptap/core/extensions/focus';
+import { FontSize } from 'tiptap/core/extensions/font-size';
+import { Gapcursor } from 'tiptap/core/extensions/gapcursor';
+import { HardBreak } from 'tiptap/core/extensions/hard-break';
+import { Heading } from 'tiptap/core/extensions/heading';
+import { HorizontalRule } from 'tiptap/core/extensions/horizontal-rule';
+import { HTMLMarks } from 'tiptap/core/extensions/html-marks';
+import { Image } from 'tiptap/core/extensions/image';
+import { Indent } from 'tiptap/core/extensions/indent';
+import { Italic } from 'tiptap/core/extensions/italic';
+import { Link } from 'tiptap/core/extensions/link';
+import { ListItem } from 'tiptap/core/extensions/listItem';
+import { Loading } from 'tiptap/core/extensions/loading';
+import { OrderedList } from 'tiptap/core/extensions/ordered-list';
+import { Paragraph } from 'tiptap/core/extensions/paragraph';
+import { Placeholder } from 'tiptap/core/extensions/placeholder';
+import { SelectionExtension } from 'tiptap/core/extensions/selection';
+import { Strike } from 'tiptap/core/extensions/strike';
+import { Subscript } from 'tiptap/core/extensions/subscript';
+import { Superscript } from 'tiptap/core/extensions/superscript';
+import { Table } from 'tiptap/core/extensions/table';
+import { TableCell } from 'tiptap/core/extensions/table-cell';
+import { TableHeader } from 'tiptap/core/extensions/table-header';
+import { TableRow } from 'tiptap/core/extensions/table-row';
+import { Text } from 'tiptap/core/extensions/text';
+import { TextAlign } from 'tiptap/core/extensions/text-align';
+import { TextStyle } from 'tiptap/core/extensions/text-style';
+import { TaskItem } from 'tiptap/core/extensions/task-item';
+import { TaskList } from 'tiptap/core/extensions/task-list';
+import { Title } from 'tiptap/core/extensions/title';
+import { TrailingNode } from 'tiptap/core/extensions/trailing-node';
+import { Underline } from 'tiptap/core/extensions/underline';
+import { Paste } from 'tiptap/core/extensions/paste';
+// 自定义节点扩展
+import { Attachment } from 'tiptap/core/extensions/attachment';
+import { Callout } from 'tiptap/core/extensions/callout';
+import { Countdown } from 'tiptap/core/extensions/countdown';
+import { DocumentChildren } from 'tiptap/core/extensions/document-children';
+import { DocumentReference } from 'tiptap/core/extensions/document-reference';
+import { Emoji } from 'tiptap/core/extensions/emoji';
+import { Iframe } from 'tiptap/core/extensions/iframe';
+import { Katex } from 'tiptap/core/extensions/katex';
+import { Mention } from 'tiptap/core/extensions/mention';
+import { Mind } from 'tiptap/core/extensions/mind';
+import { QuickInsert } from 'tiptap/core/extensions/quick-insert';
+import { SearchNReplace } from 'tiptap/core/extensions/search';
+import { Status } from 'tiptap/core/extensions/status';
+
+export const DocumentWithTitle = Document.extend({
+  content: 'title block+',
+});
+
+export const AllExtensions = [
+  Paragraph,
+  Placeholder.configure({
+    placeholder: ({ node, editor }) => {
+      if (!editor.isEditable) return;
+
+      if (node.type.name === 'title') {
+        return '请输入标题';
+      }
+      return '输入 / 唤起更多';
+    },
+    showOnlyCurrent: false,
+    showOnlyWhenEditable: true,
+  }),
+  BackgroundColor,
+  Blockquote,
+  Bold,
+  BulletList,
+  Code,
+  CodeBlock,
+  Color,
+  ColorHighlighter,
+  Dropcursor,
+  Focus,
+  FontSize,
+  Gapcursor,
+  HardBreak,
+  Heading,
+  HorizontalRule,
+  ...HTMLMarks,
+  Image,
+  Indent,
+  Italic,
+  Link,
+  ListItem,
+  Loading,
+  OrderedList,
+  SelectionExtension,
+  Strike,
+  Subscript,
+  Superscript,
+  Table,
+  TableCell,
+  TableHeader,
+  TableRow,
+  Text,
+  TextAlign,
+  TextStyle,
+  TaskItem,
+  TaskList,
+  TrailingNode,
+  Underline,
+  Paste,
+  Attachment,
+  Callout,
+  Countdown,
+  DocumentChildren,
+  DocumentReference,
+  Emoji,
+  Iframe,
+  Katex,
+  Mention,
+  Mind,
+  QuickInsert,
+  SearchNReplace,
+  Status,
+  DocumentWithTitle,
+  Title,
+  Document,
+];
diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/utils.ts b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/utils.ts
index 6648bb33..a02427e4 100644
--- a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/utils.ts
+++ b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/html-to-prosemirror/utils.ts
@@ -1,4 +1,4 @@
-import { BaseKit } from '../../../start-kit';
+import { AllExtensions } from './all-kit';
 
 /**
  * 通过 tiptap extension 的配置从 DOM 节点上获取属性值
@@ -25,7 +25,7 @@ const getAttribute = (
 };
 
 export const getAttributes = (name: string, element: HTMLElement): Record<string, unknown> => {
-  const ext = BaseKit.find((ext) => ext.name === name);
+  const ext = AllExtensions.find((ext) => ext && ext.name === name);
 
   if (!ext) return {};
 
diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx
index d1a56d68..77748521 100644
--- a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx
+++ b/packages/client/src/tiptap/markdown/markdown-to-prosemirror/index.tsx
@@ -1,8 +1,5 @@
 import { htmlToPromsemirror } from './html-to-prosemirror';
 import { markdownToHTML } from './markdown-to-html';
-export { prosemirrorToMarkdown } from '../prosemirror-to-markdown';
-export * from './helpers';
-export * from './markdown-source-map';
 
 /**
  * markdown-it 渲染出的 HTML 中 img 不符合格式要求
diff --git a/packages/client/src/tiptap/markdown/prosemirror-to-markdown/index.ts b/packages/client/src/tiptap/markdown/prosemirror-to-markdown/index.ts
index 3672abd9..afdfb72b 100644
--- a/packages/client/src/tiptap/markdown/prosemirror-to-markdown/index.ts
+++ b/packages/client/src/tiptap/markdown/prosemirror-to-markdown/index.ts
@@ -1,40 +1,41 @@
 import { MarkdownSerializer as ProseMirrorMarkdownSerializer, defaultMarkdownSerializer } from 'prosemirror-markdown';
-import { Attachment } from 'tiptap/extensions/attachment';
-import { Bold } from 'tiptap/extensions/bold';
-import { BulletList } from 'tiptap/extensions/bullet-list';
-import { Callout } from 'tiptap/extensions/callout';
-import { Code } from 'tiptap/extensions/code';
-import { CodeBlock } from 'tiptap/extensions/code-block';
-import { Countdown } from 'tiptap/extensions/countdown';
-import { DocumentChildren } from 'tiptap/extensions/document-children';
-import { DocumentReference } from 'tiptap/extensions/document-reference';
-import { HardBreak } from 'tiptap/extensions/hard-break';
-import { Heading } from 'tiptap/extensions/heading';
-import { HorizontalRule } from 'tiptap/extensions/horizontal-rule';
-import { marks } from 'tiptap/extensions/html-marks';
-import { Mention } from 'tiptap/extensions/mention';
-import { Iframe } from 'tiptap/extensions/iframe';
-import { Image } from 'tiptap/extensions/image';
-import { Italic } from 'tiptap/extensions/italic';
-import { Katex } from 'tiptap/extensions/katex';
-import { Link } from 'tiptap/extensions/link';
-import { ListItem } from 'tiptap/extensions/listItem';
-import { Mind } from 'tiptap/extensions/mind';
-import { OrderedList } from 'tiptap/extensions/ordered-list';
-import { Paragraph } from 'tiptap/extensions/paragraph';
-import { Status } from 'tiptap/extensions/status';
-import { Strike } from 'tiptap/extensions/strike';
-import { Subscript } from 'tiptap/extensions/subscript';
-import { Superscript } from 'tiptap/extensions/superscript';
-import { Table } from 'tiptap/extensions/table';
-import { TableCell } from 'tiptap/extensions/table-cell';
-import { TableHeader } from 'tiptap/extensions/table-header';
-import { TableRow } from 'tiptap/extensions/table-row';
-import { Text } from 'tiptap/extensions/text';
-import { TaskItem } from 'tiptap/extensions/task-item';
-import { TaskList } from 'tiptap/extensions/task-list';
-import { TextStyle } from 'tiptap/extensions/text-style';
-import { Title } from 'tiptap/extensions/title';
+import { Attachment } from 'tiptap/core/extensions/attachment';
+import { Blockquote } from 'tiptap/core/extensions/blockquote';
+import { Bold } from 'tiptap/core/extensions/bold';
+import { BulletList } from 'tiptap/core/extensions/bullet-list';
+import { Callout } from 'tiptap/core/extensions/callout';
+import { Code } from 'tiptap/core/extensions/code';
+import { CodeBlock } from 'tiptap/core/extensions/code-block';
+import { Countdown } from 'tiptap/core/extensions/countdown';
+import { DocumentChildren } from 'tiptap/core/extensions/document-children';
+import { DocumentReference } from 'tiptap/core/extensions/document-reference';
+import { HardBreak } from 'tiptap/core/extensions/hard-break';
+import { Heading } from 'tiptap/core/extensions/heading';
+import { HorizontalRule } from 'tiptap/core/extensions/horizontal-rule';
+import { marks } from 'tiptap/core/extensions/html-marks';
+import { Mention } from 'tiptap/core/extensions/mention';
+import { Iframe } from 'tiptap/core/extensions/iframe';
+import { Image } from 'tiptap/core/extensions/image';
+import { Italic } from 'tiptap/core/extensions/italic';
+import { Katex } from 'tiptap/core/extensions/katex';
+import { Link } from 'tiptap/core/extensions/link';
+import { ListItem } from 'tiptap/core/extensions/listItem';
+import { Mind } from 'tiptap/core/extensions/mind';
+import { OrderedList } from 'tiptap/core/extensions/ordered-list';
+import { Paragraph } from 'tiptap/core/extensions/paragraph';
+import { Status } from 'tiptap/core/extensions/status';
+import { Strike } from 'tiptap/core/extensions/strike';
+import { Subscript } from 'tiptap/core/extensions/subscript';
+import { Superscript } from 'tiptap/core/extensions/superscript';
+import { Table } from 'tiptap/core/extensions/table';
+import { TableCell } from 'tiptap/core/extensions/table-cell';
+import { TableHeader } from 'tiptap/core/extensions/table-header';
+import { TableRow } from 'tiptap/core/extensions/table-row';
+import { Text } from 'tiptap/core/extensions/text';
+import { TaskItem } from 'tiptap/core/extensions/task-item';
+import { TaskList } from 'tiptap/core/extensions/task-list';
+import { TextStyle } from 'tiptap/core/extensions/text-style';
+import { Title } from 'tiptap/core/extensions/title';
 import {
   isPlainURL,
   renderHardBreak,
@@ -91,8 +92,8 @@ const SerializerConfig = {
   },
 
   nodes: {
-    attachment: renderCustomContainer('attachment'),
-    blockquote: (state, node) => {
+    [Attachment.name]: renderCustomContainer('attachment'),
+    [Blockquote.name]: (state, node) => {
       if (node.attrs.multiline) {
         state.write('>>>');
         state.ensureNewLine();
diff --git a/packages/client/src/tiptap/menubar.tsx b/packages/client/src/tiptap/menubar.tsx
deleted file mode 100644
index 990864e8..00000000
--- a/packages/client/src/tiptap/menubar.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import React, { useMemo } from 'react';
-import { Editor } from '@tiptap/core';
-import { Space } from '@douyinfe/semi-ui';
-import { Divider } from './divider';
-
-import { Insert } from './menus/insert';
-import { Undo } from './menus/undo';
-import { Redo } from './menus/redo';
-import { CleadrNodeAndMarks } from './menus/clear-node-and-marks';
-
-import { Heading } from './menus/heading';
-import { FontSize } from './menus/fontsize';
-import { Bold } from './menus/bold';
-import { Italic } from './menus/italic';
-import { Underline } from './menus/underline';
-import { Strike } from './menus/strike';
-import { Code } from './menus/code';
-import { Superscript } from './menus/superscript';
-import { Subscript } from './menus/subscript';
-import { TextColor } from './menus/text-color';
-import { BackgroundColor } from './menus/background-color';
-
-import { Align } from './menus/align';
-
-import { BulletList } from './menus/bullet-list';
-import { OrderedList } from './menus/ordered-list';
-import { TaskList } from './menus/task-list';
-import { Ident } from './menus/ident';
-
-import { Emoji } from './menus/emoji';
-import { Link } from './menus/link';
-import { Blockquote } from './menus/blockquote';
-import { HorizontalRule } from './menus/horizontal-rule';
-import { Search } from './menus/search';
-
-import { Attachment } from './menus/attachment';
-import { Callout } from './menus/callout';
-import { CodeBlock } from './menus/code-block';
-import { Countdonw } from './menus/countdown';
-import { DocumentChildren } from './menus/document-children';
-import { DocumentReference } from './menus/document-reference';
-import { Image } from './menus/image';
-import { Iframe } from './menus/iframe';
-import { Table } from './menus/table';
-import { Mind } from './menus/mind';
-
-const _MenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
-  const isEditable = useMemo(() => editor && editor.isEditable, [editor]);
-
-  if (!editor) return null;
-
-  return (
-    <div
-      style={{
-        opacity: isEditable ? 1 : 0.65,
-        pointerEvents: isEditable ? 'auto' : 'none',
-      }}
-    >
-      <Space spacing={2}>
-        <Insert editor={editor} />
-
-        <Divider />
-
-        <Undo editor={editor} />
-        <Redo editor={editor} />
-        <CleadrNodeAndMarks editor={editor} />
-
-        <Divider />
-
-        <Heading editor={editor} />
-        <FontSize editor={editor} />
-        <Bold editor={editor} />
-        <Italic editor={editor} />
-        <Underline editor={editor} />
-        <Strike editor={editor} />
-        <Code editor={editor} />
-        <Superscript editor={editor} />
-        <Subscript editor={editor} />
-        <TextColor editor={editor} />
-        <BackgroundColor editor={editor} />
-
-        <Divider />
-
-        <Align editor={editor} />
-
-        <Divider />
-
-        <BulletList editor={editor} />
-        <OrderedList editor={editor} />
-        <TaskList editor={editor} />
-        <Ident editor={editor} />
-
-        <Divider />
-
-        <Emoji editor={editor} />
-        <Blockquote editor={editor} />
-        <Link editor={editor} />
-        <HorizontalRule editor={editor} />
-        <Search editor={editor} />
-
-        <Attachment editor={editor} />
-        <Callout editor={editor} />
-        <CodeBlock editor={editor} />
-        <Countdonw editor={editor} />
-        <DocumentChildren editor={editor} />
-        <DocumentReference editor={editor} />
-        <Image editor={editor} />
-        <Iframe editor={editor} />
-        <Table editor={editor} />
-        <Mind editor={editor} />
-      </Space>
-    </div>
-  );
-};
-
-export const MenuBar = React.memo(_MenuBar, (prevProps, nextProps) => {
-  return prevProps.editor === nextProps.editor;
-});
-
-const _CommentMenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
-  return (
-    <>
-      <Space spacing={2}>
-        <Undo editor={editor} />
-        <Redo editor={editor} />
-        <CleadrNodeAndMarks editor={editor} />
-
-        <Divider />
-
-        <Heading editor={editor} />
-        <Bold editor={editor} />
-        <Italic editor={editor} />
-        <Underline editor={editor} />
-        <Strike editor={editor} />
-        <Code editor={editor} />
-        <Superscript editor={editor} />
-        <Subscript editor={editor} />
-        <TextColor editor={editor} />
-        <BackgroundColor editor={editor} />
-      </Space>
-    </>
-  );
-};
-
-export const CommentMenuBar = React.memo(_CommentMenuBar, (prevProps, nextProps) => {
-  return prevProps.editor === nextProps.editor;
-});
diff --git a/packages/client/src/tiptap/menus/_event.ts b/packages/client/src/tiptap/menus/_event.ts
deleted file mode 100644
index 5600444b..00000000
--- a/packages/client/src/tiptap/menus/_event.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { EventEmitter } from 'helpers/event-emitter';
-
-export const event = new EventEmitter();
-
-export const OPEN_COUNT_SETTING_MODAL = 'OPEN_COUNT_SETTING_MODAL';
-export const triggerOpenCountSettingModal = (data) => {
-  event.emit(OPEN_COUNT_SETTING_MODAL, data);
-};
-
-export const OPEN_LINK_SETTING_MODAL = 'OPEN_LINK_SETTING_MODAL';
-export const triggerOpenLinkSettingModal = (data) => {
-  event.emit(OPEN_LINK_SETTING_MODAL, data);
-};
diff --git a/packages/client/src/tiptap/prose-utils/copy-node.ts b/packages/client/src/tiptap/prose-utils/copy-node.ts
index 528c9e35..34278d6a 100644
--- a/packages/client/src/tiptap/prose-utils/copy-node.ts
+++ b/packages/client/src/tiptap/prose-utils/copy-node.ts
@@ -2,8 +2,8 @@ import { Editor } from '@tiptap/core';
 import { Node, Fragment } from 'prosemirror-model';
 import { copy } from 'helpers/copy';
 import { safeJSONStringify } from 'helpers/json';
-import { prosemirrorToMarkdown } from 'tiptap/markdown/prosemirror-to-markdown';
-import { markdownToHTML } from 'tiptap/markdown/markdown-to-prosemirror/markdown-to-html';
+// import { prosemirrorToMarkdown } from 'tiptap/_markdown/prosemirror-to-markdown';
+// import { markdownToHTML } from 'tiptap/markdown/markdown-to-prosemirror/markdown-to-html';
 
 export function copyNode(nodeOrNodeName: Node);
 export function copyNode(nodeOrNodeName: string, editor: Editor);
@@ -39,7 +39,10 @@ export function copyNode(nodeOrNodeName: string | Node, editor?: Editor) {
       toCopy.push({ text: targetNode.textContent, format: 'text/plain' });
     }
 
+    console.log('copy', editor);
+
     try {
+      const { markdownToHTML, prosemirrorToMarkdown } = editor.extensionStorage['paste'];
       const markdown = prosemirrorToMarkdown({ content: Fragment.from(targetNode) });
       toCopy.push({ text: markdown, format: 'text/markdown' });
       const html = markdownToHTML(markdown);
diff --git a/packages/client/src/tiptap/prose-utils/index.ts b/packages/client/src/tiptap/prose-utils/index.ts
index 67f4a1be..90b132e0 100644
--- a/packages/client/src/tiptap/prose-utils/index.ts
+++ b/packages/client/src/tiptap/prose-utils/index.ts
@@ -11,6 +11,8 @@ export * from './editor-container-size';
 export * from './file';
 export * from './lowlight-plugin';
 export * from './mark';
+export * from './markdown-source-map';
+export * from './markdown';
 export * from './mention';
 export * from './node';
 export * from './position';
diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/markdown-source-map.ts b/packages/client/src/tiptap/prose-utils/markdown-source-map.ts
similarity index 100%
rename from packages/client/src/tiptap/markdown/markdown-to-prosemirror/markdown-source-map.ts
rename to packages/client/src/tiptap/prose-utils/markdown-source-map.ts
diff --git a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/helpers.ts b/packages/client/src/tiptap/prose-utils/markdown.ts
similarity index 94%
rename from packages/client/src/tiptap/markdown/markdown-to-prosemirror/helpers.ts
rename to packages/client/src/tiptap/prose-utils/markdown.ts
index 9a8c420e..3fb80d89 100644
--- a/packages/client/src/tiptap/markdown/markdown-to-prosemirror/helpers.ts
+++ b/packages/client/src/tiptap/prose-utils/markdown.ts
@@ -33,7 +33,7 @@ export const isMarkdown = (text: string): boolean => {
   return false;
 };
 
-export const normalizePastedMarkdown = (text: string): string => {
+export const normalizeMarkdown = (text: string): string => {
   const CHECKBOX_REGEX = /^\s?(\[(X|\s|_|-)\]\s(.*)?)/gim;
 
   while (text.match(CHECKBOX_REGEX)) {
diff --git a/packages/client/src/tiptap/prose-utils/mention.ts b/packages/client/src/tiptap/prose-utils/mention.ts
index 36bc3e65..5f6a57bd 100644
--- a/packages/client/src/tiptap/prose-utils/mention.ts
+++ b/packages/client/src/tiptap/prose-utils/mention.ts
@@ -1,5 +1,5 @@
 import { Editor } from '@tiptap/core';
-import { Mention } from '../extensions/mention';
+import { Mention } from 'tiptap/core/extensions/mention';
 
 export const findMentions = (editor: Editor) => {
   const content = editor.getJSON();
diff --git a/packages/client/src/tiptap/prose-utils/upload.ts b/packages/client/src/tiptap/prose-utils/upload.ts
index a8e9a9c6..c17ccb0b 100644
--- a/packages/client/src/tiptap/prose-utils/upload.ts
+++ b/packages/client/src/tiptap/prose-utils/upload.ts
@@ -1,8 +1,8 @@
 import { Editor } from '@tiptap/core';
 import { uploadFile } from 'services/file';
-import { Loading } from '../extensions/loading';
-import { Attachment } from '../extensions/attachment';
-import { Image } from '../extensions/image';
+import { Loading } from 'tiptap/core/extensions/loading';
+import { Attachment } from 'tiptap/core/extensions/attachment';
+import { Image } from 'tiptap/core/extensions/image';
 import { extractFileExtension, extractFilename } from './file';
 
 export const acceptedMimes = {
diff --git a/packages/client/src/tiptap/provider.ts b/packages/client/src/tiptap/provider.ts
deleted file mode 100644
index 105f854a..00000000
--- a/packages/client/src/tiptap/provider.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import { HocuspocusProvider } from '@hocuspocus/provider';
-import { IUser } from '@think/domains';
-
-const PROVIDER_POOL_READER = new Map();
-const PROVIDER_POOL_EDITOR = new Map();
-
-export type ProviderStatus = 'connecting' | 'connected' | 'disconnected' | 'loadCacheSuccess';
-
-export const getProvider = ({
-  targetId,
-  token,
-  cacheType = 'READER',
-  user,
-  docType = 'document',
-  events = {},
-}: {
-  targetId: string;
-  token: string;
-  cacheType: 'READER' | 'EDITOR';
-  user: IUser;
-  docType: 'document' | 'template';
-  events?: {
-    onAuthenticated?: () => void;
-    onAuthenticationFailed?: ({ reason }: { reason: string }) => void;
-    onOpen?: (event: Event) => void;
-    onConnect?: () => void;
-    onMessage?: (event: MessageEvent) => void;
-    onOutgoingMessage?: (message) => void;
-    onStatus?: (status: any) => void;
-    onSynced?: () => void;
-    onDisconnect?: (event: CloseEvent) => void;
-    onClose?: (event: CloseEvent) => void;
-    onDestroy?: () => void;
-    onAwarenessChange?: (states: any) => void;
-    onAwarenessUpdate?: (states: any) => void;
-  };
-}) => {
-  const pool = cacheType === 'READER' ? PROVIDER_POOL_READER : PROVIDER_POOL_EDITOR;
-
-  if (!pool.has(targetId)) {
-    const provider = new HocuspocusProvider({
-      url: process.env.COLLABORATION_API_URL,
-      name: targetId,
-      token,
-      parameters: {
-        targetId,
-        userId: user && user.id,
-        docType,
-      },
-      maxAttempts: 5,
-      ...events,
-    } as any);
-    pool.set(targetId, provider);
-  }
-  return pool.get(targetId);
-};
-
-export const destoryProvider = (provider, cacheType: 'READER' | 'EDITOR' = 'READER') => {
-  const pool = cacheType === 'READER' ? PROVIDER_POOL_READER : PROVIDER_POOL_EDITOR;
-
-  pool.delete(provider.configuration.name);
-  provider.document.destroy();
-  provider.destroy();
-};
diff --git a/packages/client/src/tiptap/react/index.tsx b/packages/client/src/tiptap/react/index.tsx
deleted file mode 100644
index 35c04383..00000000
--- a/packages/client/src/tiptap/react/index.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-import { EditorContent, NodeViewWrapper, NodeViewContent } from '@tiptap/react';
-import { useEditor } from './useEditor';
-
-export { EditorContent, NodeViewWrapper, NodeViewContent, useEditor };
diff --git a/packages/client/src/tiptap/start-kit.tsx b/packages/client/src/tiptap/start-kit.tsx
deleted file mode 100644
index 9b441e79..00000000
--- a/packages/client/src/tiptap/start-kit.tsx
+++ /dev/null
@@ -1,198 +0,0 @@
-import { HocuspocusProvider } from '@hocuspocus/provider';
-import { Attachment } from './extensions/attachment';
-import { BackgroundColor } from './extensions/background-color';
-import { Blockquote } from './extensions/blockquote';
-import { Bold } from './extensions/bold';
-import { BulletList } from './extensions/bullet-list';
-import { Callout } from './extensions/callout';
-import { Code } from './extensions/code';
-import { CodeBlock } from './extensions/code-block';
-import { Color } from './extensions/color';
-import { ColorHighlighter } from './extensions/color-highlighter';
-import { Countdown } from './extensions/countdown';
-import { DocumentChildren } from './extensions/document-children';
-import { DocumentReference } from './extensions/document-reference';
-import { Dropcursor } from './extensions/dropcursor';
-import { Emoji } from './extensions/emoji';
-import { Focus } from './extensions/focus';
-import { FontSize } from './extensions/font-size';
-import { Gapcursor } from './extensions/gapcursor';
-import { HardBreak } from './extensions/hard-break';
-import { Heading } from './extensions/heading';
-import { HorizontalRule } from './extensions/horizontal-rule';
-import { HTMLMarks } from './extensions/html-marks';
-import { Iframe } from './extensions/iframe';
-import { Image } from './extensions/image';
-import { Indent } from './extensions/indent';
-import { Italic } from './extensions/italic';
-import { Katex } from './extensions/katex';
-import { Link } from './extensions/link';
-import { ListItem } from './extensions/listItem';
-import { Loading } from './extensions/loading';
-import { Mention } from './extensions/mention';
-import { Mind } from './extensions/mind';
-import { OrderedList } from './extensions/ordered-list';
-import { Paragraph } from './extensions/paragraph';
-import { Placeholder } from './extensions/placeholder';
-import { QuickInsert } from './extensions/quick-insert';
-import { SearchNReplace } from './extensions/search';
-import { SelectionExtension } from './extensions/selection';
-import { Status } from './extensions/status';
-import { Strike } from './extensions/strike';
-import { Subscript } from './extensions/subscript';
-import { Superscript } from './extensions/superscript';
-import { Table } from './extensions/table';
-import { TableCell } from './extensions/table-cell';
-import { TableHeader } from './extensions/table-header';
-import { TableRow } from './extensions/table-row';
-import { Text } from './extensions/text';
-import { TextAlign } from './extensions/text-align';
-import { TextStyle } from './extensions/text-style';
-import { TaskItem } from './extensions/task-item';
-import { TaskList } from './extensions/task-list';
-import { Title } from './extensions/title';
-import { TrailingNode } from './extensions/trailing-node';
-import { Underline } from './extensions/underline';
-import { Paste } from './extensions/paste';
-
-import { getRandomColor } from 'helpers/color';
-// 文档
-import { Document } from './extensions/document';
-// 操作历史
-import History from '@tiptap/extension-history';
-// 协作
-import { Collaboration } from './extensions/collaboration';
-import { CollaborationCursor } from './extensions/collaboration-cursor';
-
-export const BaseKit = [
-  Attachment,
-  BackgroundColor,
-  Blockquote,
-  Bold,
-  BulletList,
-  Callout,
-  Code,
-  CodeBlock,
-  Color,
-  ColorHighlighter,
-  Countdown,
-  DocumentChildren,
-  DocumentReference,
-  Dropcursor,
-  Emoji,
-  Focus,
-  FontSize,
-  Gapcursor,
-  HardBreak,
-  Heading,
-  HorizontalRule,
-  ...HTMLMarks,
-  Iframe,
-  Image,
-  Indent,
-  Italic,
-  Katex,
-  Link,
-  ListItem,
-  Loading,
-  Mention,
-  Mind,
-  OrderedList,
-  Paragraph,
-  Placeholder.configure({
-    placeholder: ({ node, editor }) => {
-      if (!editor.isEditable) return;
-
-      if (node.type.name === 'title') {
-        return '请输入标题';
-      }
-      return '输入 / 唤起更多';
-    },
-    showOnlyCurrent: false,
-    showOnlyWhenEditable: true,
-  }),
-  QuickInsert,
-  SearchNReplace,
-  SelectionExtension,
-  Status,
-  Strike,
-  Subscript,
-  Superscript,
-  Table,
-  TableCell,
-  TableHeader,
-  TableRow,
-  Text,
-  TextAlign,
-  TextStyle,
-  TaskItem,
-  TaskList,
-  Title,
-  TrailingNode,
-  Underline,
-  Paste,
-];
-
-export const CommentKit = [
-  BackgroundColor,
-  Blockquote,
-  Bold,
-  BulletList,
-  Code,
-  CodeBlock,
-  Color,
-  ColorHighlighter,
-  Dropcursor,
-  Emoji,
-  Focus,
-  FontSize,
-  Gapcursor,
-  HardBreak,
-  Heading,
-  HorizontalRule,
-  ...HTMLMarks,
-  Indent,
-  Italic,
-  Katex,
-  Link,
-  ListItem,
-  Mention,
-  OrderedList,
-  Paragraph,
-  Placeholder.configure({
-    placeholder: '请输入内容',
-    showOnlyWhenEditable: true,
-  }),
-  Strike,
-  Subscript,
-  Superscript,
-  Text,
-  TextAlign,
-  TextStyle,
-  TaskItem,
-  TaskList,
-  TrailingNode,
-  Underline,
-];
-
-export { Document, History };
-
-export const DocumentWithTitle = Document.extend({
-  content: 'title block+',
-});
-
-export const getCollaborationExtension = (provider: HocuspocusProvider) => {
-  return Collaboration.configure({
-    document: provider.document,
-  });
-};
-
-export const getCollaborationCursorExtension = (provider: HocuspocusProvider, user) => {
-  return CollaborationCursor.configure({
-    provider,
-    user: {
-      ...user,
-      color: getRandomColor(),
-    },
-  });
-};
diff --git a/packages/client/src/tiptap/wrappers/mind/mind-elixir/iconfont/iconfont.js b/packages/client/src/tiptap/wrappers/mind/mind-elixir/iconfont/iconfont.js
deleted file mode 100644
index b8ff4bda..00000000
--- a/packages/client/src/tiptap/wrappers/mind/mind-elixir/iconfont/iconfont.js
+++ /dev/null
@@ -1 +0,0 @@
-!function(t){var c,l,a,e,o,i,n='<svg><symbol id="icon-edit" viewBox="0 0 1024 1024"><path d="M423.765333 128a42.666667 42.666667 0 0 1 3.2 85.205333L423.765333 213.333333H234.666667a64 64 0 0 0-63.872 60.245334L170.666667 277.333333v512a64 64 0 0 0 60.245333 63.872L234.666667 853.333333h512a64 64 0 0 0 63.872-60.245333L810.666667 789.333333v-189.098666a42.666667 42.666667 0 0 1 85.205333-3.2l0.128 3.2V789.333333a149.333333 149.333333 0 0 1-144.213333 149.248L746.666667 938.666667h-512a149.333333 149.333333 0 0 1-149.248-144.213334L85.333333 789.333333v-512a149.333333 149.333333 0 0 1 144.213334-149.248L234.666667 128h189.098666z m324.949334-53.248a42.666667 42.666667 0 0 1 60.330666 0l150.869334 150.869333a42.666667 42.666667 0 0 1 0 60.330667l-329.386667 329.386667a42.666667 42.666667 0 0 1-29.44 12.458666l-153.386667 2.517334a42.666667 42.666667 0 0 1-43.349333-43.349334l2.56-153.386666a42.666667 42.666667 0 0 1 12.458667-29.44z m30.165333 90.496L491.946667 452.266667l-1.493334 91.989333 92.032-1.493333 286.976-286.976-90.538666-90.538667z"  ></path></symbol><symbol id="icon-rising" viewBox="0 0 1024 1024"><path d="M553.173333 803.84h-64l0.021334-474.581333-224.021334 224-45.269333-45.226667L521.6 206.293333l301.717333 301.696-45.269333 45.269334-224.853333-224.896v475.477333z"  ></path></symbol><symbol id="icon-falling" viewBox="0 0 1024 1024"><path d="M553.173333 238.314667h-64l0.021334 474.602666-224.021334-224-45.269333 45.226667L521.6 835.861333l301.717333-301.717333-45.269333-45.226667-224.853333 224.853334V238.336z"  ></path></symbol><symbol id="icon-shanchu2" viewBox="0 0 1024 1024"><path d="M516.60601807 107.93026734c-82.64382935 0-149.71865844 65.51751709-152.5729065 147.77160644H171.37136841c-21.40603638 0-38.92044068 17.38504028-38.92044068 38.92126465 0 21.40686036 17.38504028 38.92208862 38.92126466 38.92208862h42.94308471v435.40136719c0 81.73498536 55.39828492 148.55026245 123.90106201 148.55026245h348.99444581c68.37341309 0 123.90106201-66.42553711 123.901062-148.55026245V333.80477906h38.92126465c21.40686036 0 38.92126464-17.38586426 38.92126465-38.92208863 0-21.40686036-17.38504028-38.92126464-38.92126465-38.92126465H668.91854859C666.45321656 173.44860839 599.24902344 107.93109131 516.60601807 107.93109131z m-79.65939331 147.77160644c2.85424805-42.16442872 37.2354126-74.85809326 79.78875732-74.85809326s76.93450927 32.82302857 79.39984131 74.85809326H436.94662476z m-98.86047364 589.01165771c-24.2611084 0-50.98754883-31.13717651-50.98754883-75.76693725V333.80477906h450.97036744V769.33551026c0 44.50039673-26.72644043 75.76776123-50.98754884 75.76776122H338.08615112v-0.38973999z m0 0"  ></path><path d="M390.37063599 751.17263794c17.77313232 0 32.43411255-17.7739563 32.43411255-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43411255-40.08966065-17.77478027 0-32.43493653 17.77478027-32.43493653 40.08966065v228.72875976c0 22.18469239 14.27124023 40.08883667 32.43493653 40.08883667z m117.41308594 0c17.7739563 0 32.43411255-17.7739563 32.43411255-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43411255-40.08966065-17.7739563 0-32.43493653 17.77478027-32.43493653 40.08966065v228.72875976c0 22.18469239 14.66098023 40.08883667 32.43493653 40.08883667z m123.51049804 0c17.7739563 0 32.43493653-17.7739563 32.43493652-40.08883667V482.35504151c0-22.31488037-14.53079224-40.08966065-32.43493652-40.08966065-17.7739563 0-32.43411255 17.77478027-32.43411255 40.08966065v228.72875976c0 22.18469239 14.14105224 40.08883667 32.43411255 40.08883667z m0 0"  ></path></symbol><symbol id="icon-zijiedian" viewBox="0 0 1024 1024"><path d="M312.208 472c19.568-157.856 153.432-280 315.656-280 175.68 0 318.112 143.272 318.112 320S803.552 832 627.864 832c-162.224 0-296.08-122.144-315.656-280H120a40 40 0 0 1 0-80h192.208zM632 752c132.552 0 240-107.448 240-240 0-132.552-107.448-240-240-240-132.552 0-240 107.448-240 240 0 132.552 107.448 240 240 240z m-40-280v-80a40 40 0 0 1 80 0v80h80a40 40 0 0 1 0 80h-80v80a40 40 0 0 1-80 0v-80h-80a40 40 0 0 1 0-80h80z"  ></path></symbol><symbol id="icon-tongjijiedian-" viewBox="0 0 1024 1024"><path d="M803.84 131.626667H410.24A59.733333 59.733333 0 0 0 350.506667 192v45.226667H199.68a51.626667 51.626667 0 0 0-51.626667 51.626666v465.92a51.626667 51.626667 0 0 0 51.626667 51.626667h187.52v-55.466667h-162.133333a21.333333 21.333333 0 0 1-21.333334-21.333333V313.386667a21.333333 21.333333 0 0 1 21.333334-21.333334h125.653333v64a59.733333 59.733333 0 0 0 59.733333 59.733334h393.386667a59.733333 59.733333 0 0 0 59.733333-59.733334V192a59.733333 59.733333 0 0 0-59.733333-60.373333z m4.266667 224.64a4.266667 4.266667 0 0 1-4.266667 4.266666H410.24a4.266667 4.266667 0 0 1-4.266667-4.266666V192a4.266667 4.266667 0 0 1 4.266667-4.266667h393.6a4.266667 4.266667 0 0 1 4.266667 4.266667zM716.16 749.44h-81.28v-81.493333a27.733333 27.733333 0 0 0-55.466667 0v81.28h-81.493333a27.733333 27.733333 0 1 0 0 55.466666h81.28v81.28a27.733333 27.733333 0 1 0 55.466667 0v-81.066666h81.28a27.733333 27.733333 0 0 0 0-55.466667z"  ></path></symbol><symbol id="icon-close" viewBox="0 0 1024 1024"><path d="M557.312 513.248l265.28-263.904c12.544-12.48 12.608-32.704 0.128-45.248-12.512-12.576-32.704-12.608-45.248-0.128L512.128 467.904l-263.04-263.84c-12.448-12.48-32.704-12.544-45.248-0.064-12.512 12.48-12.544 32.736-0.064 45.28l262.976 263.776L201.6 776.8c-12.544 12.48-12.608 32.704-0.128 45.248a31.937 31.937 0 0 0 22.688 9.44c8.16 0 16.32-3.104 22.56-9.312l265.216-263.808 265.44 266.24c6.24 6.272 14.432 9.408 22.656 9.408a31.94 31.94 0 0 0 22.592-9.344c12.512-12.48 12.544-32.704 0.064-45.248L557.312 513.248z" fill="" ></path></symbol><symbol id="icon-menu" viewBox="0 0 1024 1024"><path d="M109.714 292.571h804.572c21.943 0 36.571-21.942 36.571-43.885 0-14.629-14.628-29.257-36.571-29.257H109.714c-21.943 0-36.571 14.628-36.571 36.571 0 14.629 14.628 36.571 36.571 36.571zM914.286 512H109.714c-21.943 0-36.571 14.629-36.571 36.571 0 14.629 14.628 36.572 36.571 36.572h804.572c21.943 0 36.571-21.943 36.571-43.886 0-14.628-14.628-29.257-36.571-29.257z m0 292.571H109.714c-21.943 0-36.571 14.629-36.571 36.572s14.628 36.571 36.571 36.571h804.572c21.943 0 36.571-21.943 36.571-36.571 0-21.943-14.628-36.572-36.571-36.572z"  ></path></symbol><symbol id="icon-right" viewBox="0 0 1024 1024"><path d="M385 560.69999999L385 738.9c0 36.90000001 26.4 68.5 61.3 68.5l150.2 0c1.5 0 3-0.1 4.5-0.3 10.2 38.7 45.5 67.3 87.5 67.3 50 0 90.5-40.5 90.5-90.5s-40.5-90.5-90.5-90.5c-42 0-77.3 28.6-87.5 67.39999999-1.4-0.3-2.9-0.4-4.5-0.39999999L446.3 760.4c-6.8 0-14.3-8.9-14.3-21.49999999l0-427.00000001c0-12.7 7.40000001-21.5 14.30000001-21.5l150.19999999 0c1.5 0 3-0.2 4.5-0.4 10.2 38.8 45.5 67.3 87.5 67.3 50 0 90.5-40.5 90.5-90.4 0-49.9-40.5-90.6-90.5-90.59999999-42 0-77.3 28.6-87.5 67.39999999-1.4-0.2-2.9-0.4-4.49999999-0.4L446.3 243.3c-34.80000001 0-61.3 31.6-61.3 68.50000001L385 513.7l-79.1 0c-10.4-38.5-45.49999999-67-87.4-67-50 0-90.5 40.5-90.5 90.5s40.5 90.5 90.5 90.5c41.79999999 0 77.00000001-28.4 87.4-67L385 560.69999999z" fill="#333333" ></path></symbol><symbol id="icon-left" viewBox="0 0 1024 1024"><path d="M639 463.30000001L639 285.1c0-36.90000001-26.4-68.5-61.3-68.5l-150.2 0c-1.5 0-3 0.1-4.5 0.3-10.2-38.7-45.5-67.3-87.5-67.3-50 0-90.5 40.5-90.5 90.5s40.5 90.5 90.5 90.5c42 0 77.3-28.6 87.5-67.39999999 1.4 0.3 2.9 0.4 4.5 0.39999999L577.7 263.6c6.8 0 14.3 8.9 14.3 21.49999999l0 427.00000001c0 12.7-7.40000001 21.5-14.30000001 21.5l-150.19999999 0c-1.5 0-3 0.2-4.5 0.4-10.2-38.8-45.5-67.3-87.5-67.3-50 0-90.5 40.5-90.5 90.4 0 49.9 40.5 90.6 90.5 90.59999999 42 0 77.3-28.6 87.5-67.39999999 1.4 0.2 2.9 0.4 4.49999999 0.4L577.7 780.7c34.80000001 0 61.3-31.6 61.3-68.50000001L639 510.3l79.1 0c10.4 38.5 45.49999999 67 87.4 67 50 0 90.5-40.5 90.5-90.5s-40.5-90.5-90.5-90.5c-41.79999999 0-77.00000001 28.4-87.4 67L639 463.30000001z" fill="#333333" ></path></symbol><symbol id="icon-side" viewBox="0 0 1024 1024"><path d="M851.91168 328.45312c-59.97056 0-108.6208 48.47104-108.91264 108.36992l-137.92768 38.4a109.14304 109.14304 0 0 0-63.46752-46.58688l1.39264-137.11872c47.29344-11.86816 82.31936-54.66624 82.31936-105.64096 0-60.15488-48.76288-108.91776-108.91776-108.91776s-108.91776 48.76288-108.91776 108.91776c0 49.18784 32.60928 90.75712 77.38368 104.27392l-1.41312 138.87488a109.19936 109.19936 0 0 0-63.50336 48.55808l-138.93632-39.48544 0.01024-0.72704c0-60.15488-48.76288-108.91776-108.91776-108.91776s-108.91776 48.75776-108.91776 108.91776c0 60.15488 48.76288 108.91264 108.91776 108.91264 39.3984 0 73.91232-20.92032 93.03552-52.2496l139.19232 39.552-0.00512 0.2304c0 25.8304 9.00096 49.5616 24.02816 68.23424l-90.14272 132.63872a108.7488 108.7488 0 0 0-34.2528-5.504c-60.15488 0-108.91776 48.768-108.91776 108.91776 0 60.16 48.76288 108.91776 108.91776 108.91776 60.16 0 108.92288-48.75776 108.92288-108.91776 0-27.14624-9.9328-51.968-26.36288-71.04l89.04704-131.03104a108.544 108.544 0 0 0 37.6832 6.70208 108.672 108.672 0 0 0 36.48512-6.272l93.13792 132.57216a108.48256 108.48256 0 0 0-24.69888 69.0688c0 60.16 48.768 108.92288 108.91776 108.92288 60.16 0 108.91776-48.76288 108.91776-108.92288 0-60.14976-48.75776-108.91776-108.91776-108.91776a108.80512 108.80512 0 0 0-36.69504 6.3488l-93.07136-132.48a108.48768 108.48768 0 0 0 24.79616-72.22784l136.09984-37.888c18.99008 31.93856 53.84192 53.3504 93.69088 53.3504 60.16 0 108.92288-48.75776 108.92288-108.91264-0.00512-60.15488-48.77312-108.92288-108.92288-108.92288z"  ></path></symbol><symbol id="icon-B" viewBox="0 0 1024 1024"><path d="M98.067692 65.457231H481.28c75.854769 0 132.411077 3.150769 169.668923 9.452307 37.336615 6.301538 70.656 19.534769 100.036923 39.620924 29.459692 20.007385 53.956923 46.710154 73.570462 80.029538 19.692308 33.398154 29.459692 70.734769 29.459692 112.167385 0 44.898462-12.130462 86.094769-36.233846 123.588923a224.886154 224.886154 0 0 1-98.461539 84.283077c58.368 17.092923 103.266462 46.08 134.695385 87.04 31.350154 40.96 47.025231 89.088 47.025231 144.462769 0 43.638154-10.082462 86.016-30.404923 127.212308-20.243692 41.196308-47.891692 74.043077-83.02277 98.697846-35.052308 24.654769-78.296615 39.778462-129.732923 45.449846-32.295385 3.465846-110.119385 5.671385-233.472 6.537846H98.067692V65.457231z m193.536 159.507692V446.621538h126.818462c75.460923 0 122.328615-1.024 140.603077-3.229538 33.083077-3.938462 59.155692-15.36 78.139077-34.343385 18.904615-18.904615 28.435692-43.874462 28.435692-74.830769 0-29.696-8.192-53.720615-24.497231-72.310154-16.384-18.510769-40.644923-29.696-72.940307-33.634461-19.140923-2.205538-74.279385-3.308308-165.415385-3.308308h-111.064615z m0 381.243077v256.315077h179.2c69.710769 0 113.979077-1.969231 132.726154-5.907692 28.750769-5.198769 52.145231-17.959385 70.262154-38.281847 18.116923-20.243692 27.096615-47.340308 27.096615-81.368615 0-28.750769-6.931692-53.169231-20.873846-73.255385a118.232615 118.232615 0 0 0-60.494769-43.795692c-26.387692-9.137231-83.574154-13.705846-171.638154-13.705846H291.603692z"  ></path></symbol><symbol id="icon-a" viewBox="0 0 1024 1024"><path d="M757.76 665.6q0 20.48 1.536 34.304t7.68 22.016 18.944 12.288 34.304 4.096q-3.072 25.6-15.36 44.032-11.264 16.384-33.28 29.696t-62.976 13.312q-11.264 0-20.48-0.512t-17.408-2.56l-6.144-2.048-1.024 0q-4.096-1.024-10.24-4.096-2.048-2.048-4.096-2.048-1.024-1.024-2.048-1.024-14.336-8.192-23.552-17.408t-14.336-17.408q-6.144-10.24-9.216-20.48-63.488 75.776-178.176 75.776-48.128 0-88.064-15.36t-69.12-44.032-45.056-68.096-15.872-88.576 16.896-89.088 47.616-67.584 74.24-42.496 96.768-14.848q48.128 0 88.576 17.408t66.048 49.152q0-8.192 0.512-16.384t0.512-15.36q0-71.68-39.936-104.448t-128-32.768q-43.008 0-84.992 6.656t-84.992 17.92q14.336-28.672 25.088-47.616t24.064-29.184q30.72-24.576 158.72-24.576 79.872 0 135.168 13.824t90.624 43.52 51.2 75.264 15.872 108.032l0 200.704zM487.424 743.424q50.176 0 79.872-33.28t29.696-95.744q0-61.44-28.672-93.696t-76.8-32.256q-52.224 0-82.944 33.28t-30.72 94.72q0 58.368 31.744 92.672t77.824 34.304z"  ></path></symbol><symbol id="icon-full" viewBox="0 0 1024 1024"><path d="M639.328 416c8.032 0 16.096-3.008 22.304-9.056l202.624-197.184-0.8 143.808c-0.096 17.696 14.144 32.096 31.808 32.192 0.064 0 0.128 0 0.192 0 17.6 0 31.904-14.208 32-31.808l1.248-222.208c0-0.672-0.352-1.248-0.384-1.92 0.032-0.512 0.288-0.896 0.288-1.408 0.032-17.664-14.272-32-31.968-32.032L671.552 96l-0.032 0c-17.664 0-31.968 14.304-32 31.968C639.488 145.632 653.824 160 671.488 160l151.872 0.224-206.368 200.8c-12.672 12.32-12.928 32.608-0.64 45.248C622.656 412.736 630.976 416 639.328 416z"  ></path><path d="M896.032 639.552 896.032 639.552c-17.696 0-32 14.304-32.032 31.968l-0.224 151.872-200.832-206.4c-12.32-12.64-32.576-12.96-45.248-0.64-12.672 12.352-12.928 32.608-0.64 45.248l197.184 202.624-143.808-0.8c-0.064 0-0.128 0-0.192 0-17.6 0-31.904 14.208-32 31.808-0.096 17.696 14.144 32.096 31.808 32.192l222.24 1.248c0.064 0 0.128 0 0.192 0 0.64 0 1.12-0.32 1.76-0.352 0.512 0.032 0.896 0.288 1.408 0.288l0.032 0c17.664 0 31.968-14.304 32-31.968L928 671.584C928.032 653.952 913.728 639.584 896.032 639.552z"  ></path><path d="M209.76 159.744l143.808 0.8c0.064 0 0.128 0 0.192 0 17.6 0 31.904-14.208 32-31.808 0.096-17.696-14.144-32.096-31.808-32.192L131.68 95.328c-0.064 0-0.128 0-0.192 0-0.672 0-1.248 0.352-1.888 0.384-0.448 0-0.8-0.256-1.248-0.256 0 0-0.032 0-0.032 0-17.664 0-31.968 14.304-32 31.968L96 352.448c-0.032 17.664 14.272 32 31.968 32.032 0 0 0.032 0 0.032 0 17.664 0 31.968-14.304 32-31.968l0.224-151.936 200.832 206.4c6.272 6.464 14.624 9.696 22.944 9.696 8.032 0 16.096-3.008 22.304-9.056 12.672-12.32 12.96-32.608 0.64-45.248L209.76 159.744z"  ></path><path d="M362.368 617.056l-202.624 197.184 0.8-143.808c0.096-17.696-14.144-32.096-31.808-32.192-0.064 0-0.128 0-0.192 0-17.6 0-31.904 14.208-32 31.808l-1.248 222.24c0 0.704 0.352 1.312 0.384 2.016 0 0.448-0.256 0.832-0.256 1.312-0.032 17.664 14.272 32 31.968 32.032L352.448 928c0 0 0.032 0 0.032 0 17.664 0 31.968-14.304 32-31.968s-14.272-32-31.968-32.032l-151.936-0.224 206.4-200.832c12.672-12.352 12.96-32.608 0.64-45.248S375.008 604.704 362.368 617.056z"  ></path></symbol><symbol id="icon-add" viewBox="0 0 1024 1024"><path d="M863.328 482.56l-317.344-1.12L545.984 162.816c0-17.664-14.336-32-32-32s-32 14.336-32 32l0 318.4L159.616 480.064c-0.032 0-0.064 0-0.096 0-17.632 0-31.936 14.24-32 31.904C127.424 529.632 141.728 544 159.392 544.064l322.592 1.152 0 319.168c0 17.696 14.336 32 32 32s32-14.304 32-32l0-318.944 317.088 1.12c0.064 0 0.096 0 0.128 0 17.632 0 31.936-14.24 32-31.904C895.264 496.992 880.96 482.624 863.328 482.56z"  ></path></symbol><symbol id="icon-move" viewBox="0 0 1024 1024"><path d="M863.744 544 163.424 544c-17.664 0-32-14.336-32-32s14.336-32 32-32l700.32 0c17.696 0 32 14.336 32 32S881.44 544 863.744 544z"  ></path></symbol><symbol id="icon-living" viewBox="0 0 1024 1024"><path d="M514.133333 488.533333m-106.666666 0a106.666667 106.666667 0 1 0 213.333333 0 106.666667 106.666667 0 1 0-213.333333 0Z" fill="#666666" ></path><path d="M512 64C264.533333 64 64 264.533333 64 512c0 236.8 183.466667 428.8 416 445.866667v-134.4c-53.333333-59.733333-200.533333-230.4-200.533333-334.933334 0-130.133333 104.533333-234.666667 234.666666-234.666666s234.666667 104.533333 234.666667 234.666666c0 61.866667-49.066667 153.6-145.066667 270.933334l-59.733333 68.266666V960C776.533333 942.933333 960 748.8 960 512c0-247.466667-200.533333-448-448-448z" fill="#666666" ></path></symbol></svg>',h=(h=document.getElementsByTagName("script"))[h.length-1].getAttribute("data-injectcss");if(h&&!t.__iconfont__svg__cssinject__){t.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}function d(){o||(o=!0,a())}c=function(){var t,c,l,a;(a=document.createElement("div")).innerHTML=n,n=null,(l=a.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",t=l,(c=document.body).firstChild?(a=t,(l=c.firstChild).parentNode.insertBefore(a,l)):c.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(c,0):(l=function(){document.removeEventListener("DOMContentLoaded",l,!1),c()},document.addEventListener("DOMContentLoaded",l,!1)):document.attachEvent&&(a=c,e=t.document,o=!1,(i=function(){try{e.documentElement.doScroll("left")}catch(t){return void setTimeout(i,50)}d()})(),e.onreadystatechange=function(){"complete"==e.readyState&&(e.onreadystatechange=null,d())})}(window);
\ No newline at end of file
diff --git a/packages/client/tsconfig.json b/packages/client/tsconfig.json
index 6bb2f094..abae6d23 100644
--- a/packages/client/tsconfig.json
+++ b/packages/client/tsconfig.json
@@ -27,6 +27,7 @@
       "constants/*": ["constants/*"],
       "helpers/*": ["helpers/*"],
       "tiptap/*": ["tiptap/*"],
+      "tiptap-v2/*": ["tiptap-v2/*"],
       "event/*": ["event/*"]
     }
   },
diff --git a/packages/server/src/services/collaboration.service.ts b/packages/server/src/services/collaboration.service.ts
index 3681eb08..113e473f 100644
--- a/packages/server/src/services/collaboration.service.ts
+++ b/packages/server/src/services/collaboration.service.ts
@@ -8,6 +8,7 @@ import { OutUser, UserService } from '@services/user.service';
 import { TemplateService } from '@services/template.service';
 import { DocumentService } from '@services/document.service';
 import { DocumentVersionService } from '@services/document-version.service';
+import { DocumentStatus } from '@think/domains';
 
 @Injectable()
 export class CollaborationService {
@@ -82,27 +83,35 @@ export class CollaborationService {
   async onAuthenticate({ connection, token, requestParameters }: onAuthenticatePayload) {
     const targetId = requestParameters.get('targetId');
     const docType = requestParameters.get('docType');
-    const user = await this.userService.decodeToken(token);
-
-    if (!user || !user.id) {
-      throw new HttpException('您无权查看', HttpStatus.UNAUTHORIZED);
-    }
+    const user = token ? await this.userService.decodeToken(token) : null;
 
     switch (docType) {
       case 'document': {
-        const authority = await this.documentService.getDocumentAuthority(targetId, user.id);
-        if (!authority.readable) {
-          throw new HttpException('您无权查看此文档', HttpStatus.FORBIDDEN);
+        if (!user) {
+          const document = await this.documentService.findById(targetId);
+          if (!document || document.status !== DocumentStatus.public) {
+            throw new HttpException('您无权查看此文档', HttpStatus.FORBIDDEN);
+          }
+          return { user: { name: '匿名用户' } };
+        } else {
+          const authority = await this.documentService.getDocumentAuthority(targetId, user.id);
+          if (!authority.readable) {
+            throw new HttpException('您无权查看此文档', HttpStatus.FORBIDDEN);
+          }
+          if (!authority.editable) {
+            connection.readOnly = true;
+          }
+          return {
+            user,
+          };
         }
-        if (!authority.editable) {
-          connection.readOnly = true;
-        }
-        return {
-          user,
-        };
       }
 
       case 'template': {
+        if (!user || !user.id) {
+          throw new HttpException('您无权查看', HttpStatus.UNAUTHORIZED);
+        }
+
         const template = await this.templateService.findById(targetId);
         if (template.createUserId !== user.id) {
           throw new HttpException('您无权查看此模板', HttpStatus.FORBIDDEN);
diff --git a/packages/server/src/services/document-version.service.ts b/packages/server/src/services/document-version.service.ts
index 5886244e..121c0ffc 100644
--- a/packages/server/src/services/document-version.service.ts
+++ b/packages/server/src/services/document-version.service.ts
@@ -27,7 +27,7 @@ export class DocumentVersionService {
     const redisConfig = lodash.get(config, 'db.redis', null);
 
     if (!redisConfig) {
-      console.error('Redis 未配置，无法启动文档版本服务');
+      console.error('[think] Redis 未配置，无法启动文档版本服务');
       return;
     }
 
@@ -46,11 +46,11 @@ export class DocumentVersionService {
         this.error = null;
       });
       redis.on('error', (e) => {
-        console.error(`[think] Redis 启动失败: "${e}"`);
+        console.error(`[think] 文档版本服务启动错误: "${e}"`);
       });
       redis.connect().catch((e) => {
         this.redis = null;
-        this.error = '[think] Redis 启动失败：无法提供文档版本服务';
+        this.error = '[think] 文档版本服务启动失败！';
       });
     } catch (e) {}
   }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e2af17ae..b3121ac1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -135,6 +135,7 @@ importers:
       react-split-pane: ^0.1.92
       scroll-into-view-if-needed: ^2.2.29
       swr: ^1.2.0
+      tilg: ^0.1.1
       tippy.js: ^6.3.7
       toggle-selection: ^1.0.6
       tsconfig-paths-webpack-plugin: ^3.5.2
@@ -218,6 +219,7 @@ importers:
       react-split-pane: 0.1.92_react-dom@17.0.2+react@17.0.2
       scroll-into-view-if-needed: 2.2.29
       swr: 1.2.0_react@17.0.2
+      tilg: 0.1.1_react@17.0.2
       tippy.js: 6.3.7
       toggle-selection: 1.0.6
       viewerjs: 1.10.4
@@ -8718,6 +8720,14 @@ packages:
   /through/2.3.8:
     resolution: {integrity: sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=}
 
+  /tilg/0.1.1_react@17.0.2:
+    resolution: {integrity: sha512-0uHyTAUM0tJL792LeviRPFkJtCbF6Za3/hbbnRmWGUaicOhbJ0IpvBViXiXTF7nk6R0L6vve2XLesQzn5jEVng==}
+    peerDependencies:
+      react: ^18.0.0 || ^17.0.0
+    dependencies:
+      react: 17.0.2
+    dev: false
+
   /tiny-invariant/1.2.0:
     resolution: {integrity: sha512-1Uhn/aqw5C6RI4KejVeTg6mIS7IqxnLJ8Mv2tV5rTc0qWobay7pDUz6Wi392Cnc8ak1H0F2cjoRzb2/AW4+Fvg==}
     dev: false

From faf83ad35bcf5dc5f7ea2b5dcfa210ef9d517080 Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Wed, 4 May 2022 01:00:28 +0800
Subject: [PATCH 2/2] fix: render author of document

---
 .../src/components/document/reader/author.tsx | 42 ++++++++++++++++
 .../src/components/document/reader/index.tsx  | 50 ++-----------------
 .../document/reader/public/index.tsx          | 28 ++++++++++-
 3 files changed, 72 insertions(+), 48 deletions(-)
 create mode 100644 packages/client/src/components/document/reader/author.tsx

diff --git a/packages/client/src/components/document/reader/author.tsx b/packages/client/src/components/document/reader/author.tsx
new file mode 100644
index 00000000..c48c5981
--- /dev/null
+++ b/packages/client/src/components/document/reader/author.tsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import { Space, Avatar } from '@douyinfe/semi-ui';
+import { LocaleTime } from 'components/locale-time';
+import { IconUser } from '@douyinfe/semi-icons';
+import { IDocument } from '@think/domains';
+
+interface IProps {
+  document: IDocument;
+}
+
+export const Author: React.FC<IProps> = ({ document }) => {
+  return (
+    <div
+      style={{
+        borderTop: '1px solid var(--semi-color-border)',
+        marginTop: 24,
+        padding: '16px 0',
+        fontSize: 13,
+        fontWeight: 'normal',
+        color: 'var(--semi-color-text-0)',
+      }}
+    >
+      <Space>
+        <Avatar size="small" src={document.createUser && document.createUser.avatar}>
+          <IconUser />
+        </Avatar>
+        <div>
+          <p style={{ margin: 0 }}>
+            创建者：
+            {document.createUser && document.createUser.name}
+          </p>
+          <p style={{ margin: '8px 0 0' }}>
+            最近更新日期：
+            <LocaleTime date={document.updatedAt} timeago />
+            {' ⦁ '}阅读量：
+            {document.views}
+          </p>
+        </div>
+      </Space>
+    </div>
+  );
+};
diff --git a/packages/client/src/components/document/reader/index.tsx b/packages/client/src/components/document/reader/index.tsx
index 977282a3..eaca35ce 100644
--- a/packages/client/src/components/document/reader/index.tsx
+++ b/packages/client/src/components/document/reader/index.tsx
@@ -2,21 +2,8 @@ import Router from 'next/router';
 import React, { useCallback, useMemo, useState } from 'react';
 import { createPortal } from 'react-dom';
 import cls from 'classnames';
-import {
-  Layout,
-  Nav,
-  Space,
-  Avatar,
-  Button,
-  Typography,
-  Skeleton,
-  Tooltip,
-  Popover,
-  BackTop,
-  Spin,
-} from '@douyinfe/semi-ui';
-import { LocaleTime } from 'components/locale-time';
-import { IconUser, IconEdit, IconArticle } from '@douyinfe/semi-icons';
+import { Layout, Nav, Space, Button, Typography, Skeleton, Tooltip, Popover, BackTop, Spin } from '@douyinfe/semi-ui';
+import { IconEdit, IconArticle } from '@douyinfe/semi-icons';
 import { Seo } from 'components/seo';
 import { DataRender } from 'components/data-render';
 import { DocumentShare } from 'components/document/share';
@@ -31,6 +18,7 @@ import { useUser } from 'data/user';
 import { useDocumentDetail } from 'data/document';
 import { triggerJoinUser } from 'event';
 import { CollaborationEditor } from 'tiptap/editor';
+import { Author } from './author';
 import styles from './index.module.scss';
 
 const { Header } = Layout;
@@ -70,37 +58,7 @@ export const DocumentReader: React.FC<IProps> = ({ documentId }) => {
       const target = element && element.querySelector('.ProseMirror .title');
 
       if (target) {
-        return createPortal(
-          <div
-            style={{
-              borderTop: '1px solid var(--semi-color-border)',
-              marginTop: 24,
-              padding: '16px 0',
-              fontSize: 13,
-              fontWeight: 'normal',
-              color: 'var(--semi-color-text-0)',
-            }}
-          >
-            <Space>
-              <Avatar size="small" src={document.createUser && document.createUser.avatar}>
-                <IconUser />
-              </Avatar>
-              <div>
-                <p style={{ margin: 0 }}>
-                  创建者：
-                  {document.createUser && document.createUser.name}
-                </p>
-                <p style={{ margin: '8px 0 0' }}>
-                  最近更新日期：
-                  <LocaleTime date={document.updatedAt} timeago />
-                  {' ⦁ '}阅读量：
-                  {document.views}
-                </p>
-              </div>
-            </Space>
-          </div>,
-          target
-        );
+        return createPortal(<Author document={document} />, target);
       }
 
       return null;
diff --git a/packages/client/src/components/document/reader/public/index.tsx b/packages/client/src/components/document/reader/public/index.tsx
index cea85f92..a9559447 100644
--- a/packages/client/src/components/document/reader/public/index.tsx
+++ b/packages/client/src/components/document/reader/public/index.tsx
@@ -1,4 +1,5 @@
 import React, { useMemo, useRef, useCallback } from 'react';
+import { createPortal } from 'react-dom';
 import cls from 'classnames';
 import {
   Layout,
@@ -26,6 +27,7 @@ import { useDocumentStyle } from 'hooks/use-document-style';
 import { usePublicDocument } from 'data/document';
 import { DocumentSkeleton } from 'tiptap/components/skeleton';
 import { CollaborationEditor } from 'tiptap/editor';
+import { Author } from '../author';
 import styles from './index.module.scss';
 
 const { Header, Content } = Layout;
@@ -44,6 +46,21 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
     return width === 'standardWidth' ? styles.isStandardWidth : styles.isFullWidth;
   }, [width]);
 
+  const renderAuthor = useCallback(
+    (element) => {
+      if (!document) return null;
+
+      const target = element && element.querySelector('.ProseMirror .title');
+
+      if (target) {
+        return createPortal(<Author document={data} />, target);
+      }
+
+      return null;
+    },
+    [data]
+  );
+
   const handleOk = useCallback(() => {
     $form.current.validate().then((values) => {
       query(values.password);
@@ -121,7 +138,7 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
           }}
           loadingContent={
             <div className={cls(styles.editorWrap, editorWrapClassNames)} style={{ fontSize }}>
-              1<DocumentSkeleton />
+              <DocumentSkeleton />
             </div>
           }
           normalContent={() => {
@@ -132,7 +149,14 @@ export const DocumentPublicReader: React.FC<IProps> = ({ documentId, hideLogo =
                 style={{ fontSize }}
               >
                 <Seo title={data.title} />
-                <CollaborationEditor menubar={false} editable={false} user={null} id={documentId} type="document" />
+                <CollaborationEditor
+                  menubar={false}
+                  editable={false}
+                  user={null}
+                  id={documentId}
+                  type="document"
+                  renderInEditorPortal={renderAuthor}
+                />
                 <ImageViewer containerSelector="#js-share-document-editor-container" />
                 <BackTop target={() => document.querySelector('#js-share-document-editor-container').parentNode} />
               </div>