Thanks for working on it.

I have a few suggestion to make it more fun 😉

1. Put translation in to dedicated WebAsset as we did it for Form validation

   joomla-cms/libraries/src/WebAsset/AssetItem/FormValidateAssetItem.php

   Lines 38 to 45 in e2170c8

   	public function onAttachCallback(Document $doc)
   	{
   	// Add validate.js language strings
   	Text::script('JLIB_FORM_CONTAINS_INVALID_FIELDS');
   	Text::script('JLIB_FORM_FIELD_REQUIRED_VALUE');
   	Text::script('JLIB_FORM_FIELD_REQUIRED_CHECK');
   	Text::script('JLIB_FORM_FIELD_INVALID_VALUE');
   	}

2. Make it work for multiple elements on the page, drop the containerSelector and pass the URL as data- attribute (can also pass other options as data-) kind of:

<div 
  class="js-my-cool-sortable-table" 
  data-sorting-url="blabla" 
  data-sorting-dir="ASC" 
  data-sorting-row=".js-row-selector"
>
    <div class="js-row-selector">...</div>
    <div class="js-row-selector">...</div>
 </div>

setUpSortableTable(container, setupOptions){
  const options = {..defaultOptions, ...setupOptions};
  ...
  ...
}
document.querySelectorAll('.js-my-cool-sortable-table').forEach((container) => {
  setUpSortableTable(container, container.dataset);
});

It of course could be WC, but as regular container it will be more clear and reusable.

setUpSortableTable() could be publicly available so people can use it on its own. If you like.

Thanks 😉

@Fedik Better? I still haven't modularize it (waiting to see the other 2-3 parts that have drag and drop)

I have tested this item ✅ successfully on 42f52e7

I clicked on the first checkbox of an article and followed the instructions, and the sorting is performed correctly.

@brianteeman yes

BTW I would appreciate an accessibility test and a check on the announcements. Thanks

Better?

Looks good, thanks!

I still haven't modularize it (waiting to see the other 2-3 parts that have drag and drop)

Not important for now, can stay as you did.
It can be extended anytime later in another PR.

@brianteeman yes

BTW I would appreciate an accessibility test and a check on the announcements. Thanks

I will check tomorrow. Not looked at it too closely yet but it will need a live region for the announcement

Looks like you are missing some strings from the announcements https://dndkit.com/extend/plugins/accessibility#default-announcements and from the screen reader instructions https://dndkit.com/extend/plugins/accessibility#default-screen-reader-instructions

This pull request has conflicts, please resolve those before we can evaluate the pull request.

This pull request has conflicts, please resolve those before we can evaluate the pull request.

icon size looks a bit big and not aligned with other icons

dnd works well with both mouse and keyboard

BUT when narrator is enabled it doesnt appear to work at all with the keyboard - but neither does their own demo clauderic/dnd-kit#147

you have to turn scan mode to off in narrator for it to work. i dont know if this is something obvious to screen reader users or not.

Can someone link this PR to the issue 29936