Drag and Drop

Drag tree rows inside the tree or out to a host-page dropzone. Internal drops commit through the built-in move APIs. External drops expose the dragged path through the browser's text/plain DataTransfer payload.

Hydrated drag-and-drop tree

Drag with a mouse or long-press touch. Active search blocks drag starts, collapsed folders auto-open, and flattened path segments target their canonical folder. Drop inside the tree to move paths, or on the host box below to read the full path without changing the tree.

Block dragging README.mdBlock drops into src/lib/

The log below shows both mutation events and drop observer hooks so the demo stays path-first and mutation-first.

Host page dropzone

Drop a tree row here to read the tree path with a normal DOM drop handler.

Last dropped file: None

Drag and drop demoPointer + touch moves on the canonical tree

Interact with the tree to see state changes…