Function SortableList 

pub fn SortableList(_: SortableListProps) -> Element

A list whose items can be dragged to reorder.

Data-agnostic: give it a len and a render callback keyed by index. It renders one wrapper per item and emits a SortEvent on drop. The hovered drop target gets data-drop-target on its wrapper and the dragged item gets data-dragging; both are absent while inactive.

Headless by default - the component ships behavior, you compose the looks. With overlay set, the picked-up row is hidden in place and your overlay element floats at the pointer (the dnd-kit feel); keep it lightweight, it is your content, not a clone of the row. Without it, the row stays visible and slides.

Props

For details, see the props struct definition.

• len : usize

  Number of items.

• render : Callback<usize,Element>

  Renders the item at the given index.

• on_sort : EventHandler<SortEvent>

  Fired when the user drops an item at a new position.

• axis : Axis

  List direction: which axis rows are laid out (and shifted) along.

• live_preview : bool

  Open a live gap where the drop would land, by translating the rows in between. Set false for the plain highlight-only behavior.

• transition_ms : u32

  Duration (ms) of the row-slide transition during live preview.

• overlay : Option<Callback<usize,Element>>

  Opt-in floating ghost: renders overlay(index) pinned to the pointer while dragging, and hides the picked-up row in place so its slot reads as the drop gap. Absent → the row itself slides. Keep the ghost lightweight; it is your content, not a clone of the row.

• touch_handle : bool

  Confine touch/pen drags to a leading grip element instead of the whole row. The grip carries touch-action: none so the rest of the row keeps scrolling by finger - use this inside scrollable lists. Style it via [data-sort-handle].

• handle : Option<Callback<usize,Element>>

  Content for the touch_handle grip, keyed by index. Defaults to a braille-dots glyph when unset.

• attributes : Vec<Attribute>