diff --git a/frontend/components/wiki/WikiEditor.vue b/frontend/components/wiki/WikiEditor.vue index a3e9236..92385f5 100644 --- a/frontend/components/wiki/WikiEditor.vue +++ b/frontend/components/wiki/WikiEditor.vue @@ -4,26 +4,26 @@
- - - - + + + +
- - - + + +
- - + +
- - +
@@ -71,19 +71,14 @@ \ No newline at end of file diff --git a/frontend/composables/useWikiSuggestion.ts b/frontend/composables/useWikiSuggestion.ts new file mode 100644 index 0000000..6a3408a --- /dev/null +++ b/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() + }, + } + }, +} \ No newline at end of file diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts index a0cb84d..b304226 100644 --- a/frontend/nuxt.config.ts +++ b/frontend/nuxt.config.ts @@ -7,7 +7,7 @@ export default defineNuxtConfig({ } }, - modules: ['@pinia/nuxt', '@nuxt/ui', '@nuxtjs/supabase', "nuxt-editorjs", '@nuxtjs/fontaine', 'nuxt-viewport', 'nuxt-tiptap-editor', '@nuxtjs/leaflet', '@vueuse/nuxt'], + modules: ['@pinia/nuxt', '@nuxt/ui', '@nuxtjs/supabase', "nuxt-editorjs", '@nuxtjs/fontaine', 'nuxt-viewport', '@nuxtjs/leaflet', '@vueuse/nuxt'], ssr: false, @@ -41,9 +41,42 @@ export default defineNuxtConfig({ }, vite: { + resolve: { + dedupe: [ + 'vue', + '@tiptap/vue-3', + 'prosemirror-model', + 'prosemirror-view', + 'prosemirror-state', + 'prosemirror-commands', + 'prosemirror-schema-list', + 'prosemirror-transform', + 'prosemirror-history', + 'prosemirror-gapcursor', + 'prosemirror-dropcursor', + 'prosemirror-tables' + ] + }, optimizeDeps: { - include: ["@editorjs/editorjs", "dayjs",'@tiptap/vue-3','@tiptap/extension-code-block-lowlight', - 'lowlight',], + include: [ + "@editorjs/editorjs", + "dayjs", + '@tiptap/vue-3', + '@tiptap/extension-code-block-lowlight', + 'lowlight', + 'vue', + '@tiptap/extension-task-item', + '@tiptap/extension-task-list', + '@tiptap/extension-table', + '@tiptap/extension-mention', + 'prosemirror-model', + 'prosemirror-view', + 'prosemirror-state', + 'prosemirror-commands', + 'prosemirror-transform', + 'tippy.js', + 'prosemirror-tables', + ], }, }, @@ -55,11 +88,6 @@ export default defineNuxtConfig({ preference: 'system' }, - - tiptap: { - prefix: "Tiptap" - }, - runtimeConfig: { public: { diff --git a/frontend/package.json b/frontend/package.json index 169ecd9..83f2077 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,7 +16,6 @@ "@vueuse/core": "^14.1.0", "@vueuse/nuxt": "^14.1.0", "nuxt": "^3.14.1592", - "nuxt-tiptap-editor": "^1.2.0", "vue": "^3.5.13", "vue-router": "^4.2.5" }, @@ -53,6 +52,7 @@ "@tiptap/extension-highlight": "^3.17.1", "@tiptap/extension-image": "^3.17.1", "@tiptap/extension-link": "^3.17.1", + "@tiptap/extension-mention": "^3.17.1", "@tiptap/extension-placeholder": "^3.17.1", "@tiptap/extension-table": "^3.17.1", "@tiptap/extension-table-cell": "^3.17.1", @@ -95,6 +95,7 @@ "sass": "^1.69.7", "socket.io-client": "^4.7.2", "tailwindcss-safe-area-capacitor": "^0.5.1", + "tippy.js": "^6.3.7", "uuid": "^11.0.3", "uuidv4": "^6.2.13", "v-calendar": "^3.1.2",