tiptap: refactor structure

packages/client/src/components/divider.tsx

@@ -1,13 +1,20 @@
-export const Divider = () => {
+import React from 'react';
+
+export const _Divider = ({ vertical = false }) => {
   return (
     <div
       style={{
         display: 'inline-block',
         width: 1,
-        height: 24,
+        height: 18,
         margin: '0 6px',
         backgroundColor: 'var(--semi-color-border)',
+        transform: `rotate(${vertical ? 90 : 0}deg)`,
       }}
     ></div>
   );
 };
+
+export const Divider = React.memo(_Divider, (prevProps, nextProps) => {
+  return prevProps.vertical === nextProps.vertical;
+});

packages/client/src/components/document/comments/index.tsx

@@ -4,7 +4,8 @@ import { useComments } from 'data/comment';
 import { useUser } from 'data/user';
 import { useToggle } from 'hooks/use-toggle';
 import React, { useCallback, useRef, useState } from 'react';
-import { CommentKit, CommentMenuBar, EditorContent, useEditor } from 'tiptap/editor';
+import { EditorContent, useEditor } from 'tiptap/core';
+import { CommentKit, CommentMenuBar } from 'tiptap/editor';
 
 import { Comments } from './comments';
 import styles from './index.module.scss';

packages/client/src/components/size-setter.tsx

@@ -4,13 +4,14 @@ import { useCallback, useRef } from 'react';
 
 type ISize = { width: number; height: number };
 
-export const Size: React.FC<{ width: number; maxWidth?: number; height: number; onOk: (arg: ISize) => void }> = ({
-  width,
-  maxWidth,
-  height,
-  onOk,
-  children,
-}) => {
+interface IProps {
+  width: number;
+  maxWidth?: number;
+  height: number;
+  onOk: (arg: ISize) => void;
+}
+
+export const SizeSetter: React.FC<IProps> = ({ width, maxWidth, height, onOk, children }) => {
   const $form = useRef<FormApi>();
 
   const handleOk = useCallback(() => {

packages/client/src/tiptap/components/divider.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-
-export const _Divider = ({ vertical = false }) => {
-  return (
-    <div
-      style={{
-        display: 'inline-block',
-        width: 1,
-        height: 18,
-        margin: '0 6px',
-        backgroundColor: 'var(--semi-color-border)',
-        transform: `rotate(${vertical ? 90 : 0}deg)`,
-      }}
-    ></div>
-  );
-};
-
-export const Divider = React.memo(_Divider, (prevProps, nextProps) => {
-  return prevProps.vertical === nextProps.vertical;
-});

packages/client/src/tiptap/components/skeleton.tsx

@@ -1,13 +0,0 @@
-import { Skeleton } from '@douyinfe/semi-ui';
-import React from 'react';
-
-export const DocumentSkeleton = () => {
-  const placeholder = (
-    <>
-      <Skeleton.Title style={{ width: 240, height: '2.4em', marginBottom: 12, marginTop: 12 }} />
-      <Skeleton.Paragraph style={{ width: '100%', height: 27 }} rows={7} />
-    </>
-  );
-
-  return <Skeleton placeholder={placeholder} loading={true} active></Skeleton>;
-};

packages/client/src/tiptap/core/all-kit.ts

@@ -1,5 +1,3 @@
-// 基础扩展
-// 自定义节点扩展
 import { Attachment } from 'tiptap/core/extensions/attachment';
 import { BackgroundColor } from 'tiptap/core/extensions/background-color';
 import { Blockquote } from 'tiptap/core/extensions/blockquote';
@@ -64,18 +62,7 @@ export const DocumentWithTitle = Document.extend({
 
 export const AllExtensions = [
   Paragraph,
-  Placeholder.configure({
-    placeholder: ({ node, editor }) => {
-      if (!editor.isEditable) return;
-
-      if (node.type.name === 'title') {
-        return '请输入标题';
-      }
-      return '输入 / 唤起更多';
-    },
-    showOnlyCurrent: false,
-    showOnlyWhenEditable: true,
-  }),
+  Placeholder,
   BackgroundColor,
   Blockquote,
   Bold,

packages/client/src/tiptap/core/extensions/collaboration-cursor/cursor-plugin/index.ts

@@ -7,7 +7,7 @@ import {
   setMeta,
   yCursorPluginKey,
   ySyncPluginKey,
-} from 'tiptap/core/y-prosemirror/y-prosemirror';
+} from 'tiptap/core/thritypart/y-prosemirror/y-prosemirror';
 import * as Y from 'yjs';
 
 /**

packages/client/src/tiptap/core/extensions/collaboration/collaboration.ts

@@ -1,5 +1,11 @@
 import { Extension } from '@tiptap/core';
-import { redo, undo, ySyncPlugin, yUndoPlugin, yUndoPluginKey } from 'tiptap/core/y-prosemirror/y-prosemirror';
+import {
+  redo,
+  undo,
+  ySyncPlugin,
+  yUndoPlugin,
+  yUndoPluginKey,
+} from 'tiptap/core/thritypart/y-prosemirror/y-prosemirror';
 import { UndoManager } from 'yjs';
 
 declare module '@tiptap/core' {

packages/client/src/tiptap/core/extensions/collaboration/helpers/is-change-origin.ts

@@ -1,5 +1,5 @@
 import { Transaction } from 'prosemirror-state';
-import { ySyncPluginKey } from 'tiptap/core/y-prosemirror/y-prosemirror';
+import { ySyncPluginKey } from 'tiptap/core/thritypart/y-prosemirror/y-prosemirror';
 
 export function isChangeOrigin(transaction: Transaction): boolean {
   return !!transaction.getMeta(ySyncPluginKey);

packages/client/src/tiptap/core/extensions/quick-insert.ts

@@ -4,8 +4,8 @@ import Suggestion from '@tiptap/suggestion';
 import { Plugin, PluginKey } from 'prosemirror-state';
 import tippy from 'tippy.js';
 import { EXTENSION_PRIORITY_HIGHEST } from 'tiptap/core/constants';
+import { QUICK_INSERT_ITEMS } from 'tiptap/core/menus/quick-insert';
 import { MenuList } from 'tiptap/core/wrappers/menu-list';
-import { QUICK_INSERT_ITEMS } from 'tiptap/editor/menus/quick-insert';
 
 export const QuickInsertPluginKey = new PluginKey('quickInsert');
 

packages/client/src/tiptap/core/index.tsx

@@ -0,0 +1,44 @@
+import { EditorOptions } from '@tiptap/core';
+import { Editor as BuiltInEditor } from '@tiptap/react';
+import { EditorContent, NodeViewContent, NodeViewWrapper } from '@tiptap/react';
+import { EventEmitter } from 'helpers/event-emitter';
+import { DependencyList, useEffect, useState } from 'react';
+
+function useForceUpdate() {
+  const [, setValue] = useState(0);
+  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();
+
+  useEffect(() => {
+    const instance = new Editor(options);
+
+    setEditor(instance);
+
+    if (!options.editable) {
+      instance.on('transaction', () => {
+        requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            forceUpdate();
+          });
+        });
+      });
+    }
+
+    return () => {
+      instance.destroy();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, deps);
+
+  return editor;
+};
+
+export { EditorContent, NodeViewContent, NodeViewWrapper };

packages/client/src/tiptap/core/menus/_event.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from 'helpers/event-emitter';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 const getEventEmitter = (editor: Editor): EventEmitter => {
   try {

packages/client/src/tiptap/core/menus/align/index.tsx

@@ -1,9 +1,9 @@
 import { IconAlignCenter, IconAlignJustify, IconAlignLeft, IconAlignRight } from '@douyinfe/semi-icons';
 import { Button, Dropdown, Tooltip } from '@douyinfe/semi-ui';
 import React, { useCallback, useMemo } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Align: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/attachment/bubble.tsx

@@ -1,10 +1,10 @@
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Attachment } from 'tiptap/core/extensions/attachment';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 export const AttachmentBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/attachment/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { AttachmentBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/background-color/index.tsx

@@ -1,12 +1,12 @@
 import { IconMark } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
+import { ColorPicker } from 'components/color-picker';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { ColorPicker } from 'tiptap/components/color-picker';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { useActive } from 'tiptap/core/hooks/use-active';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 
 const FlexStyle: React.CSSProperties = {
   display: 'inline-flex',

packages/client/src/tiptap/core/menus/blockquote/index.tsx

@@ -2,10 +2,10 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconQuote } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Blockquote as BlockquoteExtension } from 'tiptap/core/extensions/blockquote';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Blockquote: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/bold/index.tsx

@@ -2,10 +2,10 @@ import { IconBold } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Bold as BoldExtension } from 'tiptap/core/extensions/bold';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Bold: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/bullet-list/index.tsx

@@ -2,10 +2,10 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconList } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { BulletList as BulletListExtension } from 'tiptap/core/extensions/bullet-list';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const BulletList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/callout/bubble.tsx

@@ -1,12 +1,12 @@
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Button, Popover, Space, Typography } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { IconDrawBoard } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { Editor } from 'tiptap/core';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Callout } from 'tiptap/core/extensions/callout';
-import { Editor } from 'tiptap/editor';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 import styles from './bubble.module.scss';

packages/client/src/tiptap/core/menus/callout/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { CalloutBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/clear-node-and-marks/index.tsx

@@ -2,7 +2,7 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconClear } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 export const CleadrNodeAndMarks: React.FC<{ editor: Editor }> = ({ editor }) => {
   const clear = useCallback(() => {

packages/client/src/tiptap/core/menus/code-block/bubble.tsx

@@ -1,10 +1,10 @@
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { CodeBlock } from 'tiptap/core/extensions/code-block';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 export const CodeBlockBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/code-block/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { CodeBlockBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/code/index.tsx

@@ -2,10 +2,10 @@ import { IconCode } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Code as InlineCode } from 'tiptap/core/extensions/code';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Code: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/countdown/bubble.tsx

@@ -1,11 +1,11 @@
 import { IconCopy, IconDelete, IconEdit } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Countdown } from 'tiptap/core/extensions/countdown';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 import { triggerOpenCountSettingModal } from '../_event';

packages/client/src/tiptap/core/menus/countdown/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { CountdownBubbleMenu } from './bubble';
 import { CountdownSettingModal } from './modal';

packages/client/src/tiptap/core/menus/countdown/modal.tsx

@@ -2,7 +2,7 @@ import { Form, Modal } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { cancelSubject, OPEN_COUNT_SETTING_MODAL, subject } from '../_event';
 

packages/client/src/tiptap/core/menus/countdown/service.ts

@@ -1,4 +1,4 @@
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { triggerOpenCountSettingModal } from '../_event';
 

packages/client/src/tiptap/core/menus/document-children/bubble.tsx

@@ -1,10 +1,10 @@
 import { IconCopy, IconDelete } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { DocumentChildren } from 'tiptap/core/extensions/document-children';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 export const DocumentChildrenBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/document-children/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { DocumentChildrenBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/document-reference/bubble.tsx

@@ -1,14 +1,14 @@
 import { IconCopy, IconDelete, IconEdit } from '@douyinfe/semi-icons';
 import { Button, List, Popover, Space, Typography } from '@douyinfe/semi-ui';
 import { DataRender } from 'components/data-render';
+import { Divider } from 'components/divider';
 import { IconDocument } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import { useWikiTocs } from 'data/wiki';
 import { useRouter } from 'next/router';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { DocumentReference } from 'tiptap/core/extensions/document-reference';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 const { Text } = Typography;

packages/client/src/tiptap/core/menus/document-reference/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { DocumentReferenceBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/emoji/index.tsx

@@ -3,7 +3,7 @@ import { EmojiPicker } from 'components/emoji-picker';
 import { IconEmoji } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 export const Emoji: React.FC<{ editor: Editor }> = ({ editor }) => {
   const setEmoji = useCallback(

packages/client/src/tiptap/core/menus/flow/bubble.tsx

@@ -1,11 +1,11 @@
 import { IconCopy, IconDelete, IconEdit } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Flow } from 'tiptap/core/extensions/flow';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 import { triggerOpenFlowSettingModal } from '../_event';

packages/client/src/tiptap/core/menus/flow/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { FlowBubbleMenu } from './bubble';
 import { FlowSettingModal } from './modal';

packages/client/src/tiptap/core/menus/flow/modal.tsx

@@ -2,7 +2,7 @@ import { Modal, Spin, Typography } from '@douyinfe/semi-ui';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { createEditor, load } from 'thirtypart/diagram';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { cancelSubject, OPEN_FLOW_SETTING_MODAL, subject } from '../_event';
 

packages/client/src/tiptap/core/menus/fontsize/index.tsx

@@ -1,9 +1,9 @@
 import { Select } from '@douyinfe/semi-ui';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { useActive } from 'tiptap/core/hooks/use-active';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 
 export const FONT_SIZES = [12, 13, 14, 15, 16, 19, 22, 24, 29, 32, 40, 48];
 

packages/client/src/tiptap/core/menus/heading/index.tsx

@@ -1,8 +1,8 @@
 import { Select } from '@douyinfe/semi-ui';
 import React, { useCallback, useMemo } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Heading: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/horizontal-rule/index.tsx

@@ -2,9 +2,9 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconHorizontalRule } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const HorizontalRule: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/ident/index.tsx

@@ -2,9 +2,9 @@ import { IconIndentLeft, IconIndentRight } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Ident: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/iframe/bubble.tsx

@@ -1,14 +1,14 @@
 import { IconCopy, IconDelete, IconEdit, IconExternalOpen, IconLineHeight } from '@douyinfe/semi-icons';
 import { Button, Form, Modal, Space, Typography } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
+import { Divider } from 'components/divider';
+import { SizeSetter } from 'components/size-setter';
 import { Tooltip } from 'components/tooltip';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useRef } from 'react';
-import { Divider } from 'tiptap/components/divider';
-import { Size } from 'tiptap/components/size';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Iframe } from 'tiptap/core/extensions/iframe';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 const { Text } = Typography;
@@ -110,11 +110,11 @@ export const IframeBubbleMenu = ({ editor }) => {
           <Button size="small" type="tertiary" theme="borderless" icon={<IconEdit />} onClick={openEditLinkModal} />
         </Tooltip>
 
-        <Size width={width} height={height} onOk={setSize}>
+        <SizeSetter width={width} height={height} onOk={setSize}>
           <Tooltip content="设置宽高">
             <Button icon={<IconLineHeight />} type="tertiary" theme="borderless" size="small" />
           </Tooltip>
-        </Size>
+        </SizeSetter>
 
         <Divider />
 

packages/client/src/tiptap/core/menus/iframe/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { IframeBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/image/bubble.tsx

@@ -7,13 +7,13 @@ import {
   IconLineHeight,
 } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
+import { SizeSetter } from 'components/size-setter';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback, useEffect, useState } from 'react';
-import { Divider } from 'tiptap/components/divider';
-import { Size } from 'tiptap/components/size';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Image } from 'tiptap/core/extensions/image';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode, getEditorContainerDOMSize } from 'tiptap/prose-utils';
 
 export const ImageBubbleMenu = ({ editor }) => {
@@ -107,11 +107,11 @@ export const ImageBubbleMenu = ({ editor }) => {
           <Button onClick={alignRight} icon={<IconAlignRight />} type="tertiary" theme="borderless" size="small" />
         </Tooltip>
 
-        <Size width={width} maxWidth={maxWidth} height={height} onOk={updateSize}>
+        <SizeSetter width={width} maxWidth={maxWidth} height={height} onOk={updateSize}>
           <Tooltip content="设置宽高">
             <Button icon={<IconLineHeight />} type="tertiary" theme="borderless" size="small" />
           </Tooltip>
-        </Size>
+        </SizeSetter>
 
         <Divider />
 

packages/client/src/tiptap/core/menus/image/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { ImageBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/insert/index.tsx

@@ -21,9 +21,9 @@ import { useUser } from 'data/user';
 import { createKeysLocalStorageLRUCache } from 'helpers/lru-cache';
 import { useToggle } from 'hooks/use-toggle';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 import { createCountdown } from '../countdown/service';
 

packages/client/src/tiptap/core/menus/italic/index.tsx

@@ -2,10 +2,10 @@ import { IconItalic } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Italic as ItalicExtension } from 'tiptap/core/extensions/italic';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Italic: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/katex/bubble.tsx

@@ -1,14 +1,14 @@
 import { IconCopy, IconDelete, IconEdit, IconHelpCircle } from '@douyinfe/semi-icons';
 import { Button, Popover, Space, TextArea, Typography } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
 import { useUser } from 'data/user';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useRef } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { Editor } from 'tiptap/core';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Katex } from 'tiptap/core/extensions/katex';
-import { Editor } from 'tiptap/editor';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 const { Text } = Typography;

packages/client/src/tiptap/core/menus/katex/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { KatexBubbleMenu } from './bubble';
 

packages/client/src/tiptap/core/menus/link/bubble.tsx

@@ -1,11 +1,11 @@
 import { IconEdit, IconExternalOpen, IconUnlink } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import { Tooltip } from 'components/tooltip';
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { useCallback, useEffect, useState } from 'react';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Link } from 'tiptap/core/extensions/link';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { findMarkPosition, isMarkActive } from 'tiptap/prose-utils';
 
 import { triggerOpenLinkSettingModal } from '../_event';

packages/client/src/tiptap/core/menus/link/index.tsx

@@ -2,10 +2,10 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconLink } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Link as LinkExtension } from 'tiptap/core/extensions/link';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 import { LinkBubbleMenu } from './bubble';
 import { LinkSettingModal } from './modal';

packages/client/src/tiptap/core/menus/link/modal.tsx

@@ -2,7 +2,7 @@ import { Form, Modal } from '@douyinfe/semi-ui';
 import { FormApi } from '@douyinfe/semi-ui/lib/es/form';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useRef, useState } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 import { isValidURL } from 'tiptap/prose-utils';
 
 import { cancelSubject, OPEN_LINK_SETTING_MODAL, subject } from '../_event';

packages/client/src/tiptap/core/menus/link/service.ts

@@ -1,4 +1,4 @@
-import { Editor } from 'tiptap/editor/react';
+import { Editor } from 'tiptap/core';
 import { isMarkActive } from 'tiptap/prose-utils';
 
 import { triggerOpenLinkSettingModal } from '../_event';

packages/client/src/tiptap/core/menus/mind/bubble.tsx

@@ -1,12 +1,12 @@
 import { IconCopy, IconDelete, IconEdit, IconLineHeight } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
+import { SizeSetter } from 'components/size-setter';
 import { Tooltip } from 'components/tooltip';
 import { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
-import { Size } from 'tiptap/components/size';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Mind } from 'tiptap/core/extensions/mind';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 import { copyNode, deleteNode, getEditorContainerDOMSize } from 'tiptap/prose-utils';
 
 import { triggerOpenMindSettingModal } from '../_event';
@@ -55,11 +55,11 @@ export const MindBubbleMenu = ({ editor }) => {
           <Button size="small" type="tertiary" theme="borderless" icon={<IconEdit />} onClick={openEditLinkModal} />
         </Tooltip>
 
-        <Size width={width} maxWidth={maxWidth} height={height} onOk={setSize}>
+        <SizeSetter width={width} maxWidth={maxWidth} height={height} onOk={setSize}>
           <Tooltip content="设置宽高">
             <Button icon={<IconLineHeight />} type="tertiary" theme="borderless" size="small" />
           </Tooltip>
-        </Size>
+        </SizeSetter>
 
         <Divider />
 

packages/client/src/tiptap/core/menus/mind/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { MindBubbleMenu } from './bubble';
 import { MindSettingModal } from './modal';

packages/client/src/tiptap/core/menus/mind/modal.tsx

@@ -2,7 +2,7 @@ import { Modal, Spin, Typography } from '@douyinfe/semi-ui';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useState } from 'react';
 import { load, renderMind } from 'thirtypart/kityminder';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { cancelSubject, OPEN_MIND_SETTING_MODAL, subject } from '../_event';
 import styles from './style.module.scss';

packages/client/src/tiptap/core/menus/mind/toolbar/index.tsx

@@ -1,11 +1,11 @@
 import { IconBold, IconFont, IconHelpCircle, IconMark } from '@douyinfe/semi-icons';
 import { Button, Descriptions, Popover, Space, Tooltip, Typography } from '@douyinfe/semi-ui';
 import cls from 'classnames';
+import { ColorPicker } from 'components/color-picker';
 import { IconDrawBoard, IconMindCenter, IconStructure } from 'components/icons';
 import { IconZoomIn, IconZoomOut } from 'components/icons';
 import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useState } from 'react';
-import { ColorPicker } from 'tiptap/components/color-picker';
 import { clamp } from 'tiptap/prose-utils';
 
 import { MAX_ZOOM, MIN_ZOOM, TEMPLATES, THEMES, ZOOM_STEP } from '../constant';

packages/client/src/tiptap/core/menus/ordered-list/index.tsx

@@ -2,10 +2,10 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconOrderedList } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { OrderedList as OrderedListExtension } from 'tiptap/core/extensions/ordered-list';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const OrderedList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/quick-insert.tsx

@@ -21,7 +21,7 @@ import {
   IconTableOfContents,
   IconTask,
 } from 'components/icons';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { createCountdown } from './countdown/service';
 import { createOrToggleLink } from './link/service';

packages/client/src/tiptap/core/menus/redo/index.tsx

@@ -2,7 +2,7 @@ import { IconRedo } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 export const Redo: React.FC<{ editor: Editor }> = ({ editor }) => {
   const redo = useCallback(() => editor.chain().focus().redo().run(), [editor]);

packages/client/src/tiptap/core/menus/search/index.tsx

@@ -4,8 +4,8 @@ import { Tooltip } from 'components/tooltip';
 import { IsOnMobile } from 'hooks/use-on-mobile';
 import { useToggle } from 'hooks/use-toggle';
 import React, { useCallback, useEffect, useState } from 'react';
+import { Editor } from 'tiptap/core';
 import { SearchNReplace } from 'tiptap/core/extensions/search';
-import { Editor } from 'tiptap/editor';
 
 const { Text } = Typography;
 

packages/client/src/tiptap/core/menus/strike/index.tsx

@@ -2,10 +2,10 @@ import { IconStrikeThrough } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Strike as StrikeExtension } from 'tiptap/core/extensions/strike';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Strike: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/subscript/index.tsx

@@ -4,7 +4,7 @@ import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
 import { Subscript as SubscriptExtension } from 'tiptap/core/extensions/subscript';
 import { Title } from 'tiptap/core/extensions/title';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Subscript: React.FC<{ editor: any }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/superscript/index.tsx

@@ -4,7 +4,7 @@ import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
 import { Superscript as SuperscriptExtension } from 'tiptap/core/extensions/superscript';
 import { Title } from 'tiptap/core/extensions/title';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Superscript: React.FC<{ editor: any }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/table/bubble.tsx

@@ -1,5 +1,6 @@
 import { IconCopy } from '@douyinfe/semi-icons';
 import { Button, Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import {
   IconAddColumnAfter,
   IconAddColumnBefore,
@@ -16,9 +17,8 @@ import {
 } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Divider } from 'tiptap/components/divider';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Table } from 'tiptap/core/extensions/table';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { copyNode, deleteNode } from 'tiptap/prose-utils';
 
 export const TableBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/table/col-bubble.tsx

@@ -2,8 +2,8 @@ import { Button, Space } from '@douyinfe/semi-ui';
 import { IconAddColumnAfter, IconAddColumnBefore, IconDeleteColumn } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Table } from 'tiptap/core/extensions/table';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { isTableSelected } from 'tiptap/prose-utils';
 
 export const TableColBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/table/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 import { TableBubbleMenu } from './bubble';
 import { TableColBubbleMenu } from './col-bubble';

packages/client/src/tiptap/core/menus/table/row-bubble.tsx

@@ -2,8 +2,8 @@ import { Button, Space } from '@douyinfe/semi-ui';
 import { IconAddRowAfter, IconAddRowBefore, IconDeleteRow } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Table } from 'tiptap/core/extensions/table';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 import { isTableSelected } from 'tiptap/prose-utils';
 
 export const TableRowBubbleMenu = ({ editor }) => {

packages/client/src/tiptap/core/menus/task-list/index.tsx

@@ -2,10 +2,10 @@ import { Button } from '@douyinfe/semi-ui';
 import { IconTask } from 'components/icons';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { TaskList as TaskListExtension } from 'tiptap/core/extensions/task-list';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const TaskList: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/text-color/index.tsx

@@ -1,13 +1,13 @@
 import { IconFont } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
+import { ColorPicker } from 'components/color-picker';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { ColorPicker } from 'tiptap/components/color-picker';
+import { Editor } from 'tiptap/core';
 import { TextStyle } from 'tiptap/core/extensions/text-style';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
-import { useAttributes } from 'tiptap/editor/hooks/use-attributes';
+import { useActive } from 'tiptap/core/hooks/use-active';
+import { useAttributes } from 'tiptap/core/hooks/use-attributes';
 
 type Color = { color: string };
 

packages/client/src/tiptap/core/menus/text/index.tsx

@@ -1,5 +1,6 @@
 import { Space } from '@douyinfe/semi-ui';
 import React, { useCallback } from 'react';
+import { BubbleMenu } from 'tiptap/core/bubble-menu';
 import { Attachment } from 'tiptap/core/extensions/attachment';
 import { Callout } from 'tiptap/core/extensions/callout';
 import { CodeBlock } from 'tiptap/core/extensions/code-block';
@@ -16,7 +17,6 @@ import { Mind } from 'tiptap/core/extensions/mind';
 import { Table } from 'tiptap/core/extensions/table';
 import { TableOfContents } from 'tiptap/core/extensions/table-of-contents';
 import { Title } from 'tiptap/core/extensions/title';
-import { BubbleMenu } from 'tiptap/editor/views/bubble-menu';
 
 import { BackgroundColor } from '../background-color';
 import { Bold } from '../bold';

packages/client/src/tiptap/core/menus/underline/index.tsx

@@ -2,9 +2,9 @@ import { IconUnderline } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
+import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
-import { Editor } from 'tiptap/editor';
-import { useActive } from 'tiptap/editor/hooks/use-active';
+import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Underline: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);

packages/client/src/tiptap/core/menus/undo/index.tsx

@@ -2,7 +2,7 @@ import { IconUndo } from '@douyinfe/semi-icons';
 import { Button } from '@douyinfe/semi-ui';
 import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
-import { Editor } from 'tiptap/editor';
+import { Editor } from 'tiptap/core';
 
 export const Undo: React.FC<{ editor: Editor }> = ({ editor }) => {
   const undo = useCallback(() => editor.chain().focus().undo().run(), [editor]);

packages/client/src/tiptap/core/wrappers/mind/index.tsx

@@ -9,7 +9,7 @@ import { useToggle } from 'hooks/use-toggle';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { load, renderMind } from 'thirtypart/kityminder';
 import { Mind } from 'tiptap/core/extensions/mind';
-import { MAX_ZOOM, MIN_ZOOM, ZOOM_STEP } from 'tiptap/editor/menus/mind/constant';
+import { MAX_ZOOM, MIN_ZOOM, ZOOM_STEP } from 'tiptap/core/menus/mind/constant';
 import { clamp, getEditorContainerDOMSize } from 'tiptap/prose-utils';
 
 import styles from './index.module.scss';

packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx

@@ -12,11 +12,11 @@ import { useNetwork } from 'hooks/use-network';
 import { IsOnMobile } from 'hooks/use-on-mobile';
 import { useToggle } from 'hooks/use-toggle';
 import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { EditorContent, useEditor } from 'tiptap/core';
 import { Collaboration } from 'tiptap/core/extensions/collaboration';
 import { CollaborationCursor } from 'tiptap/core/extensions/collaboration-cursor';
 import { Tocs } from 'tiptap/editor/tocs';
 
-import { EditorContent, useEditor } from '../../react';
 import { CollaborationKit } from '../kit';
 import styles from './index.module.scss';
 import { MenuBar } from './menubar';

packages/client/src/tiptap/editor/collaboration/collaboration/index.tsx

@@ -5,9 +5,9 @@ import { throttle } from 'helpers/throttle';
 import { useToggle } from 'hooks/use-toggle';
 import { SecureDocumentIllustration } from 'illustrations/secure-document';
 import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
-import { IndexeddbPersistence } from 'tiptap/core/y-indexeddb';
+import { Editor } from 'tiptap/core';
+import { IndexeddbPersistence } from 'tiptap/core/thritypart/y-indexeddb';
 
-import { Editor } from '../../react';
 import { EditorInstance } from './editor';
 import styles from './index.module.scss';
 import { ICollaborationEditorProps, ProviderStatus } from './type';

packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx

@@ -1,44 +1,44 @@
 import { Space } from '@douyinfe/semi-ui';
+import { Divider } from 'components/divider';
 import React, { useMemo } from 'react';
-import { Divider } from 'tiptap/components/divider';
-import { Editor } from 'tiptap/editor';
-import { Align } from 'tiptap/editor/menus/align';
-import { Attachment } from 'tiptap/editor/menus/attachment';
-import { BackgroundColor } from 'tiptap/editor/menus/background-color';
-import { Blockquote } from 'tiptap/editor/menus/blockquote';
-import { Bold } from 'tiptap/editor/menus/bold';
-import { BulletList } from 'tiptap/editor/menus/bullet-list';
-import { Callout } from 'tiptap/editor/menus/callout';
-import { CleadrNodeAndMarks } from 'tiptap/editor/menus/clear-node-and-marks';
-import { Code } from 'tiptap/editor/menus/code';
-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 { Emoji } from 'tiptap/editor/menus/emoji';
-import { Flow } from 'tiptap/editor/menus/flow';
-import { FontSize } from 'tiptap/editor/menus/fontsize';
-import { Heading } from 'tiptap/editor/menus/heading';
-import { HorizontalRule } from 'tiptap/editor/menus/horizontal-rule';
-import { Ident } from 'tiptap/editor/menus/ident';
-import { Iframe } from 'tiptap/editor/menus/iframe';
-import { Image } from 'tiptap/editor/menus/image';
-import { Insert } from 'tiptap/editor/menus/insert';
-import { Italic } from 'tiptap/editor/menus/italic';
-import { Katex } from 'tiptap/editor/menus/katex';
-import { Link } from 'tiptap/editor/menus/link';
-import { Mind } from 'tiptap/editor/menus/mind';
-import { OrderedList } from 'tiptap/editor/menus/ordered-list';
-import { Redo } from 'tiptap/editor/menus/redo';
-import { Search } from 'tiptap/editor/menus/search';
-import { Strike } from 'tiptap/editor/menus/strike';
-import { Subscript } from 'tiptap/editor/menus/subscript';
-import { Superscript } from 'tiptap/editor/menus/superscript';
-import { Table } from 'tiptap/editor/menus/table';
-import { TaskList } from 'tiptap/editor/menus/task-list';
-import { TextColor } from 'tiptap/editor/menus/text-color';
-import { Underline } from 'tiptap/editor/menus/underline';
-import { Undo } from 'tiptap/editor/menus/undo';
+import { Editor } from 'tiptap/core';
+import { Align } from 'tiptap/core/menus/align';
+import { Attachment } from 'tiptap/core/menus/attachment';
+import { BackgroundColor } from 'tiptap/core/menus/background-color';
+import { Blockquote } from 'tiptap/core/menus/blockquote';
+import { Bold } from 'tiptap/core/menus/bold';
+import { BulletList } from 'tiptap/core/menus/bullet-list';
+import { Callout } from 'tiptap/core/menus/callout';
+import { CleadrNodeAndMarks } from 'tiptap/core/menus/clear-node-and-marks';
+import { Code } from 'tiptap/core/menus/code';
+import { CodeBlock } from 'tiptap/core/menus/code-block';
+import { Countdonw } from 'tiptap/core/menus/countdown';
+import { DocumentChildren } from 'tiptap/core/menus/document-children';
+import { DocumentReference } from 'tiptap/core/menus/document-reference';
+import { Emoji } from 'tiptap/core/menus/emoji';
+import { Flow } from 'tiptap/core/menus/flow';
+import { FontSize } from 'tiptap/core/menus/fontsize';
+import { Heading } from 'tiptap/core/menus/heading';
+import { HorizontalRule } from 'tiptap/core/menus/horizontal-rule';
+import { Ident } from 'tiptap/core/menus/ident';
+import { Iframe } from 'tiptap/core/menus/iframe';
+import { Image } from 'tiptap/core/menus/image';
+import { Insert } from 'tiptap/core/menus/insert';
+import { Italic } from 'tiptap/core/menus/italic';
+import { Katex } from 'tiptap/core/menus/katex';
+import { Link } from 'tiptap/core/menus/link';
+import { Mind } from 'tiptap/core/menus/mind';
+import { OrderedList } from 'tiptap/core/menus/ordered-list';
+import { Redo } from 'tiptap/core/menus/redo';
+import { Search } from 'tiptap/core/menus/search';
+import { Strike } from 'tiptap/core/menus/strike';
+import { Subscript } from 'tiptap/core/menus/subscript';
+import { Superscript } from 'tiptap/core/menus/superscript';
+import { Table } from 'tiptap/core/menus/table';
+import { TaskList } from 'tiptap/core/menus/task-list';
+import { TextColor } from 'tiptap/core/menus/text-color';
+import { Underline } from 'tiptap/core/menus/underline';
+import { Undo } from 'tiptap/core/menus/undo';
 
 const _MenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isEditable = useMemo(() => editor && editor.isEditable, [editor]);