From 2452b7fdc38cc2ca365f2885bf329ffe68bbc27e Mon Sep 17 00:00:00 2001
From: fantasticit <fantasticit@163.com>
Date: Fri, 8 Jul 2022 15:54:43 +0800
Subject: [PATCH] tiptap: dragable katex

---
 .../client/src/tiptap/core/extensions/katex.ts    |  1 +
 .../src/tiptap/core/wrappers/katex/index.tsx      | 15 +++++++--------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/client/src/tiptap/core/extensions/katex.ts b/packages/client/src/tiptap/core/extensions/katex.ts
index afb1f71..249de38 100644
--- a/packages/client/src/tiptap/core/extensions/katex.ts
+++ b/packages/client/src/tiptap/core/extensions/katex.ts
@@ -23,6 +23,7 @@ export const Katex = Node.create({
   group: 'block',
   selectable: true,
   atom: true,
+  draggable: true,
 
   addOptions() {
     return {
diff --git a/packages/client/src/tiptap/core/wrappers/katex/index.tsx b/packages/client/src/tiptap/core/wrappers/katex/index.tsx
index bb7960b..5f42e63 100644
--- a/packages/client/src/tiptap/core/wrappers/katex/index.tsx
+++ b/packages/client/src/tiptap/core/wrappers/katex/index.tsx
@@ -1,13 +1,12 @@
-import { NodeViewWrapper } from '@tiptap/react';
-import cls from 'classnames';
 import { convertColorToRGBA } from 'helpers/color';
 import { Theme, ThemeEnum } from 'hooks/use-theme';
 import katex from 'katex';
 import { useMemo } from 'react';
+import { DragableWrapper } from 'tiptap/core/wrappers/dragable';
 
 import styles from './index.module.scss';
 
-export const KatexWrapper = ({ node }) => {
+export const KatexWrapper = ({ node, editor }) => {
   const { text } = node.attrs;
   const { theme } = Theme.useHook();
   const backgroundColor = useMemo(() => {
@@ -35,14 +34,14 @@ export const KatexWrapper = ({ node }) => {
   );
 
   return (
-    <NodeViewWrapper
-      className={cls(styles.wrap, 'render-wrapper')}
+    <DragableWrapper
+      editor={editor}
+      className={'render-wrapper'}
       style={{
         backgroundColor,
       }}
-      contentEditable={false}
     >
-      {content}
-    </NodeViewWrapper>
+      <div className={styles.wrap}>{content}</div>
+    </DragableWrapper>
   );
 };