SelectNode only on click, not drag events

1

I have a math node view which renders math using katex (ProseMirror Math). I want to make this ndoe draggable so that I can easily move it inside my editor. The problem is that once the drag starts, the selectNode is fired and my math editor opens. I’d like to avoid opening inner math node view on both dragStart and dragEnd events and open it only on click. Here is the code:

image
image1149×573 39.1 KB

How can I do that, i.e. call selectNode only on click and not drag events?

1 Like
2

uppp

3

If I hadn’t already fixed this I’d have made you wait a week for bumping. But you’re in luck, I just pushed this patch.

2 Likes
4

Thank you! When the changes will be available in npm (https://www.npmjs.com/package/prosemirror-view)?

5

I’ve tagged a version 1.32.4

1 Like
6

Now when the dragging starts indeed nothing happens, but when I drop the node, its view opens. image

Ideally I’d like to set selection after that dragged node when dragging ends but not select it

7

Dropping content selects it in ProseMirror. You could probably change that with an appendTransaction hook, but as default behavior that’s going to stay this way.

1 Like
8

OK, I did the following and it works as intended but if you see that it could be written better (i.e. more efficient) please tell

      appendTransaction(transactions, oldState, newState) {
        let drop: boolean = false;
        let mathPresent = false;
        let pos: number = 0;
        for (let tr of transactions) {
          if (tr.getMeta('uiEvent') == 'drop') drop = true;
          if (tr.selection.$anchor.nodeAfter?.type.name == 'math_inline') {
            mathPresent = true;
            pos = tr.selection.$to.pos;
          }
        }

        if (drop && mathPresent)
          return newState.tr.setSelection(
            TextSelection.create(newState.tr.doc, pos)
          );

        return null;
      },