createDroppable

Create droppable targets with the createDroppable primitive.

Usage

The createDroppable primitive requires a unique id. It returns an object with an attach function and reactive state.

Input

id · UniqueIdentifier | (() => UniqueIdentifier) · required

A unique identifier for this droppable instance.

accept · string | string[] | (() => string | string[])

The types of draggable elements this droppable accepts.

type · string | (() => string)

The type of this droppable element.

collisionDetector · CollisionDetector | (() => CollisionDetector)

A custom collision detection algorithm.

disabled · boolean | (() => boolean)

Whether the droppable is disabled.

data · Data | (() => Data)

Custom data to attach to this droppable instance.

Output

isDropTarget · boolean

Whether this element is currently a drop target (a draggable is hovering over it).

droppable · Droppable

The underlying Droppable instance.

attach · (element: HTMLElement) => () => void

Attachment function for the droppable element. Use with {@attach}.