Tiptap: Could you update docs to use tippy.js v5?

[roschaefer]

Is your feature request related to a problem? Please describe.
Apparently the suggestion example uses tippy.js version 4.x.

Here is the code: https://github.com/scrumpy/tiptap/blob/master/examples/Components/Routes/Suggestions/index.vue#L220

Describe the solution you'd like
Could you update the example to use version 5.x of tippy.js? Here's what I did: https://github.com/Human-Connection/Human-Connection/pull/2258

From the PR description:

I've spent a considerable amount of time to try/error the correct way of integrating tippy.js into tiptap. Here's what I came up with. It's probably not nice to destroy and recreate the tiptap context menu but I didn't know a better way to do it. The new API of tippy.js does not have instance.popperInstance.scheduleUpdate method anymore.

There is the sticky plugin which should reposition the popper menu when the content or the reference object changes. I couldn't find a way to get the desired behaviour since it's calling the virtualNode.getBoundingClientRect() 4 times, and in the end, it's always at position 0/0 (top left corner) thus invisible. https://atomiks.github.io/tippyjs/plugins/

The original error message was that you cannot pass a normal object to tippy(object, { ... }) anymore. https://atomiks.github.io/tippyjs/misc/

Describe alternatives you've considered
You are using MutationObserver to observe this.$refs.suggestions and you call instance.popperInstance.scheduleUpdate. The latter is not available anymore, I'm afraid. So the best solution I came up with is to destroy the menu all the time. I wonder if that's an appropriate solution.

Probably a better solution is to use tippy's sticky plugin.

[gambolputty]

Hey @roschaefer,

if you are interested, I managed to get tippy.js 6 (current version) working with tiptap. Your idea to use the sticky plugin helped!

I created a PR here: https://github.com/scrumpy/tiptap/pull/655

[philippkuehn]

this is fixed now!