feat: improve tiptap

This commit is contained in:
fantasticit 2022-03-22 12:58:46 +08:00
parent ea7da9d6a3
commit 54cc57bb1b
6 changed files with 45 additions and 15 deletions

View File

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

View File

@ -33,4 +33,16 @@
margin-left: 8px; 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;
}
} }

View File

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

View File

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

View File

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

View File

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