ClayTreeView: keyboard alternative for drag and drop

[marcoscv-work]

Right now we can drag and drop and it works great, but we don't have alternate keys so it can be considered not accessible.

We would need:

• A way to invoque the action of move (for example, use the dropdown menu to call 'move action', when pressed start the interaction).

  

• Use arrow keys and enter to determinate the movement, example (only when the movement started): https://schne324.github.io/dragon-drop/demo/#nested

  

[matuzalemsteles]

Oh good point about that, I think this shouldn't be a problem to implement with what we have today.

[marcoscv-work]

Just some points to add before starting working on this:

From a functional point of view:

• We need to make the same by keyboard than by mouse so we need a way to open nodes and drop off the node in different levels, is important to remember that this is an alternative for accessibility so the easiest technical solutions if finally do the same will ve valid, we could auto-open groups, or do it in two steps dropping off the level-1 item in a level-2 group and then go back to the item in the level-2 group and move it again in that level

From a design point o view:

• Node in movement will be represented by the node in a white box with a blue line to determinate in the same way than using mouse the direction and effect of dropping of on the place blue line is colliding

[matuzalemsteles]

Hey @marcoscv-work sorry to comment too late here, maintaining the design will make this a little more complicated to maintain, i'm not sure this helps much when the user is interacting with the DnD using just the keyboard.

I think moving the Drag Layer wouldn't move in pixels but clicking on the arrow for example moves directly to the next drop point. I'd like to hear more from @drakonux and @emiliano-cicero about this before I go ahead with it, it would also be nice to first have something on the design side and documented before going with it.

[marcoscv-work]

Already implemented in Portal by Echo, if you guys want to take a look go there: Page editor -> Add fragments.

Please, we shouldn't forget this request, if any other way Echo will never use our tree / drag n drop, etc :-(

[matuzalemsteles]

I'm working on it but it's still in development I'm going to move it to the next release so it doesn't block the current release.

[github-actions[bot]]

This issue has been merged and will be released in DXP at https://issues.liferay.com/browse/LPS-175585