feat(front): add MarkdownPaste extension for enhanced paste functionality in Tiptap editor

front/components/Tiptap.vue

@@ -3,6 +3,7 @@ import { Editor, EditorContent } from '@tiptap/vue-3'
 import StarterKit from '@tiptap/starter-kit'
 import { Markdown } from 'tiptap-markdown';
 import Placeholder from '@tiptap/extension-placeholder'
+import { MarkdownPaste } from './Tiptap/ MarkdownPaste';
 const props = defineProps<{
   modelValue: string
   placeholder?: string
@@ -15,7 +16,7 @@ const editor = ref<Editor | undefined>(undefined)
 onMounted(() => {
   editor.value = new Editor({
     content: props.modelValue,
-    extensions: [StarterKit, Markdown, Placeholder.configure({
+    extensions: [StarterKit, Markdown, MarkdownPaste, Placeholder.configure({
       placeholder: props.placeholder ?? ''
     })],
     onUpdate: () => {

front/components/Tiptap/ MarkdownPaste.ts

@@ -0,0 +1,25 @@
+import { Extension } from '@tiptap/core'
+import { Plugin, PluginKey } from 'prosemirror-state'
+import { marked } from 'marked'
+
+export const MarkdownPaste = Extension.create({
+    name: 'markdownPaste',
+    addProseMirrorPlugins() {
+        return [
+            new Plugin({
+                key: new PluginKey('markdownPaste'),
+                props: {
+                    handlePaste: (view, event) => {
+                        const clipboardText = event.clipboardData?.getData('text/plain')
+                        if (clipboardText) {
+                            const html = marked(clipboardText)
+                            this.editor.commands.insertContent(html)
+                            return true
+                        }
+                        return false
+                    },
+                },
+            }),
+        ]
+    },
+})