Move instances in navigator with keyboard

[TrySound]

We were requested a few times to support moving instances in navigator with keyboard.
How we can make it intuitive?

I think navigation and movement should use similar shortcuts.
For example cmd+up and cmd+down should carry instance across all visible items.
Edge case: a few levels of last in group should travel these levels

Example of moving text down

text
box1
  box2
    box3
box4

down

box1
  text
  box2
    box3
box4

down

box1
  box2
    text
    box3
box4

down

box1
  box2
    box3
    text
box4

down

box1
  box2
    box3
  text
box4

down

box1
  box2
    box3
text
box4

down

box1
  box2
    box3
box4
text

What webflow does? It also makes movement and navigation similar. Though I find shortcuts less intuitive.
https://webflow.com/updates/keyboard-shortcuts-moving-elements

[TrySound]

cc @kof @johnsicili

[johnsicili]

I often want to move a box above another box.

box1
 heading1
box2
 heading2

With box 2 selected, I press up, and I think the desired result it this:

box2
 heading2
box1
 heading1

One of the current issues with navigator dragging is this scenario. Often, when dragging the box above/below another, it expands it unintentionally and places it within. See this issue for more info #4288

What if we do modifier + cmd + arrow to move within an instance? This also aligns with our arrows to expand instances.

Given this

box1
 heading1
box2
 heading2

And box2 is selected, user presses modifier + cmd + arrow up and gets this

box1
 heading1
 box2
  heading2

[vizviking]

I think the selected element should move on the same level within its parent if some modifier plus arrow up/down. Once you use a modifier plus left/right it should move up a parent level or down into the child of the adjacent component (on that level).

I'm not sure a unilateral move up and down regardless of child/parent relationship is as helpful.

Moving selected components up and down the list in the navigator can be finicky at times. It would be nice if we could move components up and down the list with a CTRL+Arrow up or something similar with more precision than dragging with mouse.

(example)
CTRL+Arrow up = Move component above adjacent child component
CTRL+Arrow down = Move component below adjacent child component
CTRL+Arrow left = Move up the list to become its own parent
CTRL+Arrow right = Move into child component above

The main issue is when dragging a component up and down the list it is quick to enter the children of adjacent lists without meaning to.

Also, if more than one item could be selected at a time during a move it would make many processes much faster!