Added Internal Links #84

frontend/composables/useWikiSuggestion.ts

@@ -0,0 +1,65 @@
+import { VueRenderer } from '@tiptap/vue-3'
+import tippy from 'tippy.js'
+import WikiPageList from '~/components/wiki/WikiPageList.vue'
+
+// Wir brauchen Zugriff auf die rohen Items aus useWikiTree
+// Da wir hier ausserhalb von setup() sind, müssen wir den State direkt holen oder übergeben.
+// Einfacher: Wir nutzen useNuxtApp() oder übergeben die Items in der Config.
+
+export default {
+    items: ({ query }: { query: string }) => {
+        // 1. Zugriff auf unsere Wiki Items
+        const { items } = useWikiTree()
+
+        // 2. Filtern
+        const allItems = items.value || []
+        return allItems
+            .filter(item => item.title.toLowerCase().includes(query.toLowerCase()))
+            .slice(0, 10) // Max 10 Vorschläge
+    },
+
+    render: () => {
+        let component: any
+        let popup: any
+
+        return {
+            onStart: (props: any) => {
+                component = new VueRenderer(WikiPageList, {
+                    props,
+                    editor: props.editor,
+                })
+
+                if (!props.clientRect) return
+
+                popup = tippy('body', {
+                    getReferenceClientRect: props.clientRect,
+                    appendTo: () => document.body,
+                    content: component.element,
+                    showOnCreate: true,
+                    interactive: true,
+                    trigger: 'manual',
+                    placement: 'bottom-start',
+                })
+            },
+
+            onUpdate(props: any) {
+                component.updateProps(props)
+                if (!props.clientRect) return
+                popup[0].setProps({ getReferenceClientRect: props.clientRect })
+            },
+
+            onKeyDown(props: any) {
+                if (props.event.key === 'Escape') {
+                    popup[0].hide()
+                    return true
+                }
+                return component.ref?.onKeyDown(props)
+            },
+
+            onExit() {
+                popup[0].destroy()
+                component.destroy()
+            },
+        }
+    },
+}