Swap Start Event

The moment the user starts dragging an item, Swapy fires an event for that called swapStart. It’s fired once per a swapping session. A swapping session ends when the user drops the item.

You can listen to that event using swapy.onSwapStart().

swapy.onSwapStart((event) => {
  console.log(event)
})

The event object contains the following:

slotItemMap: the current slot-to-item map.
- You can get it in three different formats: asArray, asObject, and asMap.
fromSlot: the id of the slot where the item was dragged from.
draggingItem: the id of the item being dragged.

Event object example

swapy.onSwapStart((event) => {
  console.log(event.slotItemMap.asObject)
  // {
  //   'foo': 'a',
  //   'bar': 'b',
  //   'baz': 'c'
  // }

  console.log(event.slotItemMap.asArray)
  // [
  //   { slot: 'foo', item: 'a' },
  //   { slot: 'bar', item: 'b' },
  //   { slot: 'baz', item: 'c' }
  // ]

  console.log(event.slotItemMap.asMap)
  // Map(3) {
  // 'foo' => 'a',
  // 'bar' => 'b',
  // 'baz' => 'c'
  // }

  console.log(event.fromSlot)
  // 'foo'

  console.log(event.draggingItem)
  // 'a'
})

Demo

To see this event in action, use the demo below, open the dev console, and check the event object logged when the swapping session begins.