Keymap to move a line

1

Hello! I’m trying to implement a keymap for ProseMirror that allow moving lines with arrow-up/down like the default keymap in CodeMirror 6 But could not figure out how to move a line there is no such command like moveLineUp.

Thanks in advance!

2

There are quite a few differences to the data structure for codemirror versus prosemirror that you should be aware of. But no, there doesnt appear to be a default command to do what you would like, although I would be interesting in assisting you.

I think you’ll first want to clarify just what you are trying to accomplish:

  1. Is it to move a paragraph upwards/downwards in an list of paragraphs?
  2. Is it to do the same, but for list items?
  3. Or did you really want to adjust the visible lines in a single paragraph block as they naturally were displayed on the screen? I hope you see why “moveLineUp” has to be a bit different in prosemirror codebase by now.

For 1 & 2, the manipulation would be something like finding the start of the node you want to move. Removing it, then inserting it to the intended position (before or after the next node.nodeSize)

Additional complexity is detecting when this is a valid operation. Is it only valid when there are two paragraphs in sequences (or two list items in sequence)? That’s a good start imo.

What other types do you have in your schema? All of them should be taken into consideration with regards to what might be valid / invalid or supported / unsupported.

Did you actually just want to perform moveLineUp in the case of codeblocks in prosemirror? If so, perhaps none of the above applies and it’d be more appropriate to embed codemirror instance into prosemirror.

3

Thank you for the suggestion. That’s a really good start. I’m trying to integrate the keymap plugin for a huge codebase in prosemirror so the action should be applied to all nodes. I have some experience with codemirror 5 and codemirror 6 and moving the lines there is an obvious task.

4

No problem. But it’s still not clear what you want and perhaps I can get you started off even better :slightly_smiling_face:

huge codebase in prosemirror so the action should be applied to all nodes

What type of nodes? What do you mean by huge codebase?

1 Like
5

Hey I implemented something similar (moves nodes up or down) using Prosemirror in bangle.dev/core-commands.js at 960fb4706a953ef910a9ddf2d80a7f10bdd2921b · bangle-io/bangle.dev · GitHub feel free to use it.

3 Likes
6

It is awesome, thank you so much!

1 Like