feat: improve tiptap

packages/client/src/components/tiptap/components/attachment/index.tsx

@@ -149,5 +149,9 @@ export const AttachmentWrapper = ({ editor, node, updateAttributes }) => {
     }
   })();
 
-  return <NodeViewWrapper as="div">{content}</NodeViewWrapper>;
+  return (
+    <NodeViewWrapper as="div">
+      {content} <NodeViewContent />
+    </NodeViewWrapper>
+  );
 };

packages/client/src/components/tiptap/components/documentReference/index.module.scss

@@ -33,4 +33,16 @@
       margin-left: 8px;
     }
   }
+
+  .empty {
+    display: flex;
+    align-items: center;
+    padding: 8px;
+    border: 1px solid var(--semi-color-border);
+    margin-top: 12px;
+    border-radius: var(--border-radius);
+    text-decoration: none;
+    color: var(--semi-color-text-1);
+    cursor: not-allowed;
+  }
 }

packages/client/src/components/tiptap/components/documentReference/index.tsx

@@ -47,18 +47,24 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
             )}
           />
         )}
-        <Link
-          key={documentId}
-          href={{
-            pathname: `${!isShare ? '' : '/share'}/wiki/[wikiId]/document/[documentId]`,
-            query: { wikiId, documentId },
-          }}
-        >
-          <a className={styles.itemWrap} target="_blank">
-            <IconDocument />
-            <span>{title || '请选择文档'}</span>
-          </a>
-        </Link>
+        {wikiId && documentId ? (
+          <Link
+            key={documentId}
+            href={{
+              pathname: `${!isShare ? '' : '/share'}/wiki/[wikiId]/document/[documentId]`,
+              query: { wikiId, documentId },
+            }}
+          >
+            <a className={styles.itemWrap} target="_blank">
+              <IconDocument />
+              <span>{title || '请选择文档'}</span>
+            </a>
+          </Link>
+        ) : (
+          <div className={styles.empty}>
+            <span>{'用户未选择文档'}</span>
+          </div>
+        )}
       </div>
       <NodeViewContent></NodeViewContent>
     </NodeViewWrapper>

packages/client/src/components/tiptap/components/image/index.tsx

@@ -1,4 +1,4 @@
-import { NodeViewWrapper } from '@tiptap/react';
+import { NodeViewWrapper, NodeViewContent } from '@tiptap/react';
 import { Resizeable } from 'components/resizeable';
 import { useEffect, useRef } from 'react';
 import { Typography, Spin } from '@douyinfe/semi-ui';
@@ -87,6 +87,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
   return (
     <NodeViewWrapper as="div" style={{ textAlign, fontSize: 0, maxWidth: '100%' }}>
       {content}
+      <NodeViewContent />
     </NodeViewWrapper>
   );
 };

packages/client/src/components/tiptap/extensions/attachment.ts

@@ -12,6 +12,8 @@ declare module '@tiptap/core' {
 
 export const Attachment = Node.create({
   name: 'attachment',
+  content: '',
+  marks: '',
   group: 'block',
   draggable: true,
   atom: true,

packages/client/src/components/tiptap/extensions/image.ts

@@ -16,7 +16,12 @@ export const Image = BuiltInImage.extend({
   addOptions() {
     return {
       ...this.parent?.(),
-      inline: true,
+      inline: false,
+      content: '',
+      marks: '',
+      group: 'block',
+      draggable: true,
+      atom: true,
     };
   },
   addAttributes() {