OSS Tanbou
Sign in with GitHub
View on GitHubProject website

extensible drag-and-drop toolkit combining pointer, touch, keyboard input, collision detection, and framework adapters

OSS scale score 240.9OSS health 79Update pace 9 commits/30d
About these scores

OSS scale score is an unbounded metric that log-compresses and weights Stars, Watchers, Forks, and Contributors. Discovery score is the current OSS scale score minus the score at discovery. Update pace is commits in the last 30 days, growth momentum is the OSS scale score difference within the recent observation window, and OSS health is a 0–100 rating based on available recency, Community Health, and release data.

Stars
17,693
Primary language
TypeScript
License
MIT
Repository last updated
Sep 12, 2026
On this page

Overview

dnd-kit is a toolkit for drag-and-drop interfaces spanning lists, grids, multiple containers, nested contexts, variable sizes, and virtualized lists. A framework-agnostic core and DOM layer sit below React, Vue, Svelte, and Solid adapters, with customizable sensors, collisions, animations, keyboard behavior, ARIA attributes, and live regions.

Features and best fit

Based on official documentation; not hands-on tested · Content checked:

Key features

Compose drag lifecycle with DragDropProvider and draggable/droppable hooks

The React adapter exposes DragDropProvider, useDraggable, and useDroppable so drag state and start/move/over/end events can participate in the component tree.

Sources: [1][3]

Support pointer, mouse, touch, and keyboard input

The project lists multiple input methods as a built-in capability, and the React package re-exports KeyboardSensor and PointerSensor from the DOM layer for configurable input behavior.

Sources: [1][3]

Extend to sortable interfaces, collision detection, and virtualized layouts

The layered architecture supports sortable behavior and custom collision strategies across lists, grids, nested contexts, variable-sized items, and virtualized lists.

Sources: [1][2]

Best fit

Fits design systems and complex editors that need shared drag-and-drop primitives

It is useful for kanban boards, sortable lists, dashboard builders, and editors where input, accessibility, and collision behavior should be standardized rather than rebuilt per component.

Sources: [1]

Before adoption

React adapter 0.5.0 requires React and React DOM 18 or 19

Package metadata for @dnd-kit/react 0.5.0 declares React and React DOM ^18.0.0 || ^19.0.0 as peer dependencies.

Sources: [2]

Version 0.5.0 changes sortable disabled controls and sensor handling

The release adds object-form disabled controls for independently disabling drag and drop and fixes inline sensor arrays being reassigned on every render.

Sources: [4]

Official sources

  1. [1]dnd-kit React 0.5.0 README(2026-10-05)
  2. [2]@dnd-kit/react 0.5.0 package metadata(2026-10-05)
  3. [3]@dnd-kit/react core exports(2026-10-05)
  4. [4]@dnd-kit/react 0.5.0 release(2026-10-05)
  5. [5]dnd-kit MIT license(2026-10-05)
Supplemental curator note

Current dnd-kit is layered as a framework-agnostic core, DOM implementation, and framework adapters. Avoid assuming older @dnd-kit/core examples match the current React package.

Try it in 3 steps

  1. 1

    Install pinned dnd-kit React 0.5.0

    Create an isolated npm project with the React adapter and exact peer dependencies.

    demo=$(mktemp -d "${TMPDIR:-/tmp}/dnd-kit.XXXXXX") && cd "$demo" && npm init -y >/dev/null && npm install --save-exact @dnd-kit/react@0.5.0 react@19.2.0 react-dom@19.2.0
  2. 2

    Verify the package version

    Require the installed React adapter to match the reviewed version.

    test "$(node -e "console.log(JSON.parse(require('fs').readFileSync('node_modules/@dnd-kit/react/package.json')).version)")" = '0.5.0'
  3. 3

    Check drag-and-drop API exports

    Verify the main provider and hooks without generating browser input.

    test "$(node --input-type=module -e "import * as D from '@dnd-kit/react'; console.log(['DragDropProvider','useDraggable','useDroppable'].every(k=>k in D))")" = 'true'
Check the official README

Growth

Growth trends · Last 30 days

17,693 Stars

Trend data is still being collected.

Development activity

Last 90 days · weekly

Commits (last 30 days)
9
Open PRs
44

Development activity is still being collected.

Built with

Categories and tags

Categories

Tags

GitHub data

GitHub dataView detailed GitHub data
View on GitHub

GitHub Topics

  • react
  • draggable
  • droppable
  • sortable
  • drag-and-drop
  • drag
Stars
17,693
Forks
920
Watchers
41
Open issues
89
Contributors
65
Owner type
User
Primary language
TypeScript
License
MIT
Repository last updated
Sep 12, 2026
Write a related article

Share a guide or use case for this OSS in Markdown. Articles are published after administrator approval.

Report incorrect information

Tell us if any listing information is incorrect or outdated.

After reading this page, do you know what to do next?