DragHandle positioning

[YousefED]

We need to clean up the position of the draghandle:

• Fix vertical position: the draghandle is now too far to the top. Check for both headings and regular elements
• Fix horizontal position (see below)

Horizontal position
The draghandle now displays right before elements, even when they are indented. This is ugly as it overlaps with the vertical line ("the indentation guide").

Design-wise; I don't think there's an easy option where we can have both indentation guides and a draghandle right next to the block.

So there are two options here:

a) remove indentation guides (notion also doesn't have this, it's more inspired by Roam) and display draghandles right next to the element similar to Notion
b) always show the draghandles on the left side of the document (so at the same horizontal position as root-level elements)

Preferably, indentation lines can be configured by the consumer library, and if enabled we show Draghandles at position B, otherwise at position A

[YousefED]

@17Amir17 This currently breaks when resizing the window:

[17Amir17]

The issue here is that the horizontal anchor is calculated when the window is opened and then is never changed. I can listen for resize events and recalculate the horizontal anchor and this would partially solve the issue. The issue remaining is that the draghandle will render into the new position only after the mouse moves again. To fix this we need to create a transaction each resize event and render the draghandle again ( I think this requires us to move the render function from the plugins props to plugins update) What do you think @YousefED ?