Inconsistent behaviour of side menu when cursor outside editor

[hncheung9]

An inconsistent behaviour of side menu showing up outside editor. It will show up when the cursor is outside editor, both left and right. However, it does not show when cursor is out of y-axis but inside x-axis(top and down area bound by editor width). Can it only show up when cursor is insider editor?

Example

https://github.com/TypeCellOS/BlockNote/assets/62551881/e925f318-ba2b-42d8-977e-40d7c4fabdbb

My use-case is a floating, draggable note and I understand that this is not default BlockNote design(Notion-alike). It will still be much appreciated to have some tunes and make it more universal and clean. Maybe PR#99 block-side-menu-detection-fix will be able to address this issue.

` <BlockNoteView className="grow overflow-auto px-1 max-w-full max-h-full" editor={editor} theme={'light'}

`

Thank you very much for all the awesome work and support!

[matthewlipski]

This is actually a surprisingly complex issue as the side menu is not necessarily inside the bounding box for the editor, especially when you consider that the React component can be replaced with smth completely different. I think you definitely still want the side menu to show up when hovering over it, even if it's technically outside the editor, so we can't just make it show only when the mouse cursor is within the editor.

It probably makes most sense to allow consumers to define an element/DOMRect in which the side menu should be shown, but we don't have a clear idea for how that API should look yet. Thanks for bringing this up though, it's something we'll look into fixing!

[ivorpad]

I've tested the preview available at https://github.com/TypeCellOS/BlockNote/pull/99, and I can confirm that it resolves the problem. @matthewlipski, could you please provide the rationale behind closing this PR? I'm really hoping you can merge this.

[awkwardnovice]

Having this issue as well. Also happens when clicking outside of the editor.

Confusing and distracting UX behavior.