Skip to content

SortableGroup

Keyword arguments

Name Description Type 
id Unique identifier for the component in callbacks str or a dictionary with structure {'type' : ..., 'index' : ...}
children SortableItem children drawn in the list SortableItem
className CSS class name used to style the component via CSS stylesheets str
dropAnimation Dictionary with keys duration and easing where duration is the length of the animation in millisecond and easing is a CSS easing function. This is applied by default to all SortableItem children. {'duration' : ..., 'easing' : ...}
showClone Whether a clone should be shown in the list when dragging the component or not. This is applied by default to all SortableItem children. bool
style CSS style to apply to this component dict

Values accessible via callbacks

The arguments below can be used to trigger callbacks or can be updated in callbacks.

Name Trigger ? Updatable ? Information
dropAnimation ✅ ✅ The new dropAnimation does not take effect immediately but during the next drop operation.
showClone ✅ ✅ The new showClone does not take effect immediately but during the next drag operation.
sortedIds ✅ ✅ Can be used to trigger actions depending on the order of the items. Setting sortedIds will not update the visual order unless the children are drawn again in the new order.
style ✅ ✅ The new style takes effect immediately.

Styles

The following classes are avaible to style the component in a CSS stylesheet:

CSS selector Description
sortable-group Div HTML element containing the SortableItem children