Skip to main content

Drag and Drop API Reference

kittl.dragAndDrop — drag images from your extension into the Kittl canvas.

Scope: exempt — always allowed (uses design:state:write internally)

startDragImageEvent(input)

Call inside a dragstart handler. Sets up the native drag preview and attaches a dragend listener that completes the drop.

PropertyTypeRequiredDescription
eventDragEventYesThe native dragstart event
imgHTMLImageElementYesThe image element being dragged
persistImagebooleanNoIf true, fetches the src, uploads it via kittl.upload, and replaces the inserted object with the uploaded asset

Returns: void

dropImage(input)

Inserts an image at specific coordinates without a native drag gesture.

PropertyTypeRequiredDescription
xnumberYesDrop X coordinate (iframe client space)
ynumberYesDrop Y coordinate (iframe client space)
srcstringYesImage source URL
imgWidthnumberNoRendered width for sizing the placed image
imgHeightnumberNoRendered height for sizing the placed image
grabOffsetXnumberNoHorizontal grab offset (cursor position within the image)
grabOffsetYnumberNoVertical grab offset (cursor position within the image)
persistImagebooleanNoIf true, fetches and uploads the image for permanent storage

Returns: Promise<string | null> — the ID of the inserted object, or null if the drop failed.