Skip to Content
Production-ready Drag & Drop for React

ddo-dnd

가볍고 확장 가능한 React DnD 라이브러리. 좌표 기반 드래그, 충돌(사각형/원/OBB) 지원, 제네릭 타입으로 도메인에 맞게 확장하세요.

ddo-dnd playground

블록이 충돌 시 빨간색으로 표시됩니다.

Rectangle collision

블록을 드래그하여 위치를 변경해 보세요.

Block A
Block B
Block C

OBB collision

모서리를 잡고 회전시킨 후 충돌을 확인해 보세요.

Block A
Block B
Block C

Circle collision

원이 충돌되는지 확인해 보세요.

Circle A
Circle B

확장 가능한 타입

BlockType을 제네릭으로 확장해 도메인 필드를 안전하게 유지합니다.

정확한 충돌

AABB(사각형), 원 근사, OBB(회전 박스)까지 상황에 맞는 충돌 모드를 선택.

가벼운 용량

200KB 미만 사이즈로 가볍게 개발하세요.

부드러운 트랜지션

useBlocksTransition으로 위치/크기 보간 애니메이션을 간단하게.

작은 러닝커브

DragContainer, DraggableItem, DraggingItem 조합으로 빠르게 구축.

모노레포 친화적

플레이그라운드/문서와 함께 손쉽게 개발·배포 가능한 구조.