ListBox Drag & Drop for reordering - How to comply with WCAG 2.5.7

[rothsandro]

Hi,

The ListBox Component supports drag & drop interactions for reordering items within the list, also accessible for keyboard users and screen reader users. For WCAG SC 2.5.7 Dragging Movemenets drag operations must be achievable by a single pointer without dragging. Adding Move Up / Move Down buttons would solve the problem but (as mentioned on the docs page) interactive elements within listbox items are not allowed.

So unless a single pointer alternative is provided somehow else (e.g. buttons outside the ListBox based the selected item - not possible in my use case with multi selection), drag & drop interactions are not fully accessible for ListBoxes. Is that correct, or did I miss something?

I think I can use a GridList instead, which supports interactive elements.

Regards,
Sandro

[devongovett]

You'd need to add those buttons outside the listbox instead of inside the item. The user could select one or more items, then click the buttons. Or as you said, you can use GridList if you want the button within the item.

[rothsandro]

Thanks 🙏