XClass properties can only be reordered with a mouse in the class editor

In the class editor, XClass properties are reordered by dragging them, and the property "Number" field, which is what actually stores the order, is hidden by the same code that sets the drag and drop up:

makeSortable(element) {
  if (element.length > 0) {
    // Hide the property number, as ordering can be done by drag and drop
    element.find('.xproperty-content').each(function () {
      ...
      input.parent().hide();

The drag and drop itself is implemented with jQuery UI sortable(), which is pointer-only and has no keyboard support, and the move handle is a <span class="tool move">, which is not focusable either.
So hiding the "Number" field removed the only keyboard route to reordering, and there is now no way at all to change the order of the properties of a class without a mouse.

Steps to reproduce

1. Go to a page holding an XClass, for instance XWiki.MyClass, and open the class editor (?editor=class).
2. Add two or more properties.
3. Using only the keyboard, try to change the order of the properties.

Expected: the properties can be reordered.
Actual: they cannot. Tab does not reach the move handle, and the "Number" field that would allow
setting the position is hidden.

This fails Success Criterion 2.1.1 Keyboard,
and also Success Criterion 2.5.7 Dragging Movements.

Note

The same pattern is missing in the object editor, where objects cannot be reordered at all, see
XWIKI-5671.