Search the Qalma docs

Type at least two characters to get started.

UI Kit

UI Kit component

Drag Handle

QalmaDragHandle renders the fixed block handle, block action menu, dragged-block highlight, and drop indicator. QalmaDragHandleDirective tracks the hovered block and feeds it the placement.

Preview

Block actions

Hover a paragraph to reveal the handle, open its menu, or drag it to reorder.

API

The QalmaDragHandleDirective wraps the content and exposes handle(), dropIndicator(), draggedBlockHighlight(), hide(), and startDrag(). The <qalma-drag-handle> component takes editor, handle, dropIndicator, and draggedBlockHighlight, and emits dismiss and dragStart.