I am making an editor using DraftJS and want to implement context-menu on hover functionality i.e. show a dropdown menu when hovering over a list-item (akin to behaviour in list-based editors like Workflowy).

What is a good way to implement it in DraftJS? I have tried doing it using a custom block with a menu that gets shown by recognizing the active ContentBlock and activating it with the help of onMouseOver callback in the Editor component.

However, this way the area in the ContentBlock is clickable, even outside of the EditorBlock. Have tried using contentEditable={false} on the non-EditorBlock parts of the custom content block so as to avoid enabling cursor on those parts but the implementation seems sketchy at best.

The challenge for me is to recognize the current content block while hovering outside the editable area.