DropGroup.md

DropGroup

DropGroup uses contexts to consolidate events from and inject a key into any DropLists in its children that do not provide their own key. If a DropList belongs to a DropGroup then it must have an identifier that can be used to uniquely identify that DropList inside the DropGroup. Items cannot be dragged between DropGroups.

An Example

Please open this REPL

In this (somewhat contrived) example, we have a DropGroup that has influence over three DropLists (here wrapped in a List component to make things cleaner). The fourth DropList provides a key, so it is not a part of the DropGroup. Since it is not part of a DropGroup, it does not need an identifier. You may choose to include identifiers anyways for consistency. If you do not include an identifier and the DropList is part of a DropGroup, an error will be thrown.

Items can be dragged between any of the first three lists, but not into, or out of, the fourth.

Events

Three events are defined:

- dragcomplete

Fired once the item has taken its place in the new list. Like how DropList doesn't fire an itemdraggedout event if the item is dropped in the same list it was dragged from, DropGroup does not provide a sourceResult when the item is dropped in the same list it was dragged from.

Types:

type details = {
    sourceResult? : SourceResult;
    destinationResult: DestinationResult;
}

type SourceResult = {
    item: Item;
    listSnapshot: Item[];
    listIdentifier: v;
}

type DestinationResult = {
    item: Item;
    index: number;
    insertedAfter: Item | undefined;
    listSnapshot: Item[];
    listIdentifier: string | number;
}

Item is the type of whatever item is in your lists.

- dragstart

Fired as soon as the item is picked up.

Types:

type details = {
    item: Item,
    listIdentifier: string | number,
}

Item is the type of whatever item is in your lists.

- dragcancelled

Fired once the item returns to its original position

Types:

type details = {
    item: Item,
    listIdentifier: string | number,
}

Item is the type of whatever item is in your lists.