The widget configuration
Optionalsurface?: booleanWhether an item is its own handle, dragged by its whole surface and drawn without a grip, rather than moved by the grip beside its content as it is if omitted. The controls in the content of an item still take the clicks and the keys pressed on them, and a drag starting on one moves the item, unless the control is a field taking text or a value.
Optionalname?: stringThe accessible name of the set of lists, telling apart several on one screen; unnamed if omitted.
The keys of the items in each list, in display order, keyed by the list label, in display order; a key identifies its item across all lists, so it is unique among them.
OptionalonMove?: (move: Move) => false | void | Promise<unknown>Notified whenever an item is dropped at a position other than the one it was picked up from; returns false to
refuse the move outright, sending the item back at once. Otherwise the order the move leads to waits on screen
until the promise returned, if any, settles, and stays there once given back as items. A rejected promise ends
the wait as a fulfilled one does, and is passed on unhandled, as if it had never been returned, so a consumer
reporting failures catches them in the promise it returns.
Renders the content of an item, given its key; the content also names the handle moving the item.
The sortable lists
TypeError If items includes a blank label, or if an item key is blank or appears more
than once across all lists
Creates a set of sortable lists.
Presents the lists given side by side, each under its label, with their items in order. An item is moved by its handle: the grip beside its content or, with
surfaceset, the item itself, dragged by its whole surface and drawn without a grip. Either way the content is free to hold controls of its own, which keep the clicks and the keys pressed on them. On an item dragged by its whole surface, a drag starting on a button or a link moves the item, while fields taking text or a value keep the pointer to themselves. An item is dragged to a new place with the pointer, by touch after a brief hold, so that the lists can still be scrolled, or with the keyboard, Space or Enter picking up the item whose handle has the focus, the arrow keys carrying it and the same keys dropping it, or Escape sending it back. The items make room for the one dragged as it moves, so the order it would land in is shown before it is dropped, and the list it would land in is highlighted; an empty list takes an item dropped anywhere over it. A dropped item glides into its place.The lists are a single stop for Tab, landing on the handle the keyboard last stood on, and the arrow keys move from handle to handle in display order, list after list, Home and End reaching the first and the last.
An item dropped at a position other than the one it was picked up from is handed to
onMove, as a move from the one to the other. A consumer refusing the move outright returnsfalse, and the item goes back where it was picked up at once. Otherwise the order the move leads to stays on screen, the item marked as waiting, until the promiseonMovereturns settles, while no other item can be picked up. The lists then show the items given again, so the order stays on screen only once the consumer gives it back asitems: a consumer refusing a move once the store has answered, or failing to settle it, sees the item go back where it was picked up from.