Keyboard Reorder

Pointer dragging should not be the only way to complete a reorder. The Web Component layer provides a focusable handle and keyboard movement by default.

Keyboard flow

Ready
Focus the handle Press ArrowDown Confirm the announcement

Keyboard changes will be announced here.

Controls

Section titled “Controls”
  • ArrowUp moves an item before its previous sibling.
  • ArrowDown moves an item after its next sibling.
  • Home moves an item to the top.
  • End moves an item to the bottom.