Skip to main content

SortableGridList

An sortable grid list (based on GridList component)
(code example)

info

This component extends GridList props.

note

This component supports square items only

Usage#

<SortableGridList>  data={items}  maxItemWidth={140}  itemSpacing={Spacings.s3}  listPadding={Spacings.s5}  onOrderChange={onOrderChange}/>

API#

data#

Do not update 'data' in 'onOrderChange' (i.e. for each order change); only update it when you change the items (i.g. adding and removing an item).#

Data of items with an id prop as unique identifier
any[] & {id: string}

extraData#

Pass any extra data that should trigger a re-render
any

onOrderChange#

Order change callback
(newData: T[], newOrder: ItemsOrder) => void

renderItem#

Custom render item callback
FlatListProps['renderItem']