flâneur — a map of the web's best reading

Drag Overlay - @dnd-kit – Documentation

docs.dndkit.com · 1,504 words · saved by 1 readers

Home Examples Github Search ⌘ K Overview INTRODUCTION Installation Quick start API DOCUMENTATION DndContext Droppable Draggable useDraggable Drag Overlay Sensors Modifiers PRESETS Sortable GUIDES Accessibility Powered By GitBook Drag Overlay The component provides a way to render a draggable overlay that is removed from the normal document flow and is positioned relative to the viewport. When should I use a drag overlay? Depending on your use-case, you may want to use a drag overlay rather than transforming the original draggable source element that is connected to the useDraggable hook: If you'd like to show a preview of where the draggable source will be when dropped, you can update the position of the draggable source while dragging without affecting the drag overlay. If your item needs to move from one container to another while dragging, we strongly recommend you use the component so the draggable item can unmount from its original container while dragg

When should I use a drag overlay? Depending on your use-case, you may want to use a drag overlay rather than transforming the original draggable source element that is connected to the useDraggable hook: If you’d like to show a preview of where the draggable source will be when dropped, you can update the position of the draggable source while dragging without affecting the drag overlay. If your item needs to move from one container to another while dragging , we strongly recommend you use the <DragOverlay> component so the draggable item can unmount from its original container while dragging

Explore this link on the map →

related reading