insert new link with autocomplete

src/components/Note/NoteEditor.vue

@@ -59,6 +59,7 @@ const editorConfig = {
 
 const editorElement = ref<HTMLInputElement | null>(null)
 watch(editorData, () => emit('update', htmlToMd(editorData.value)))
+let editorInstance: any
 
 const handleClick = ({ data }: { data: any }) => {
   const noteTitle = data.domTarget.textContent as string
@@ -114,7 +115,50 @@ const handleContextedKeypress = (event: any) => {
 }
 
 const createLink = (link: string) => {
-  console.log(link)
+  if (!editor) return
+  const model = editorInstance.model
+  model.change((writer: any) => {
+    const currentPosition = model.document.selection.getFirstPosition()
+    // const node = [currentPosition.textNode, currentPosition.nodeBefore, currentPosition.nodeAfter]
+    // console.log(currentPosition, node)
+    // writer.insertText(link, currentPosition)
+    console.log(model.document.selection.getFirstPosition())
+    writer.insertText(
+      link,
+      { contextedLink: true },
+      currentPosition.nodeBefore,
+      'after'
+    )
+    model.enqueueChange((writer: any) => {
+      // const { nextSibling } = contextedLinkTextNode
+      // if (!nextSibling || !nextSibling.data || !nextSibling.data.startsWith(']]'))
+      writer.insertText(']]', model.document.selection.getFirstPosition())
+    })
+    writer.remove(currentPosition.nodeBefore)
+    showAutocomplete.value = false
+
+    // const node = [
+    //   currentPosition.textNode,
+    //   currentPosition.nodeBefore,
+    //   currentPosition.nodeAfter,
+    // ].find(
+    //   (node) =>
+    //     node &&
+    //     (node.hasAttribute('contextedLinkAutocomplete') ||
+    //       node.hasAttribute('contextedLink'))
+    // )
+    // const contextedLinkTextNode = writer.createText(title, { contextedLink: true })
+    // writer.insert(contextedLinkTextNode, node, 'after')
+    // model.enqueueChange((writer) => {
+    //   const { nextSibling } = contextedLinkTextNode
+    //   if (!nextSibling || !nextSibling.data || !nextSibling.data.startsWith(']]'))
+    //     writer.insertText(']]', model.document.selection.getFirstPosition())
+    // })
+    // if (node) writer.remove(node)
+    // writer.removeSelectionAttribute('contextedLink')
+    // writer.removeSelectionAttribute('contextedLinkAutocomplete')
+    // this.autocompleteText = null
+  })
 }
 </script>
 <template>
@@ -124,6 +168,7 @@ const createLink = (link: string) => {
       :editor="editor"
       v-model="editorData"
       :config="editorConfig"
+      @editor-ready="(editor) => (editorInstance = editor)"
       @click="handleClick"
       @contexted-link-autocomplete="handleAutocomplete"
       @contexted-keypress="handleContextedKeypress"