# dnd kit

## Docs

- [DragDropManager](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/drag-drop-manager.md): Central orchestrator for drag and drop operations
- [Draggable](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/draggable.md): Entities that can be dragged in drag and drop operations
- [Droppable](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/droppable.md): Entities that can receive draggable items in drag and drop operations
- [Modifiers](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/modifiers.md): Transform drag behavior with constraints, snapping, and custom logic
- [@dnd-kit/abstract](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/overview.md): Framework-agnostic core API for building drag and drop interfaces
- [Plugins](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/plugins.md): Extend drag and drop functionality with reusable, composable behaviors
- [Sensors](https://mintlify.wiki/clauderic/dnd-kit/api/abstract/sensors.md): Input handlers for detecting and initiating drag operations
- [Collision Detection Algorithms](https://mintlify.wiki/clauderic/dnd-kit/api/collision/algorithms.md): API reference for collision detection algorithms in dnd-kit
- [DragDropManager](https://mintlify.wiki/clauderic/dnd-kit/api/dom/drag-drop-manager.md): Main orchestrator for drag-and-drop operations in @dnd-kit/dom
- [@dnd-kit/dom](https://mintlify.wiki/clauderic/dnd-kit/api/dom/overview.md): DOM implementation of dnd-kit with sensors, plugins, and drag-and-drop primitives
- [Plugins](https://mintlify.wiki/clauderic/dnd-kit/api/dom/plugins.md): Extend drag-and-drop functionality with plugins
- [Sensors](https://mintlify.wiki/clauderic/dnd-kit/api/dom/sensors.md): Input sensors for pointer and keyboard interactions
- [Sortable](https://mintlify.wiki/clauderic/dnd-kit/api/dom/sortable.md): High-level API for building sortable lists and grids
- [Geometry Utilities](https://mintlify.wiki/clauderic/dnd-kit/api/geometry/utilities.md): API reference for geometry utilities and classes in dnd-kit
- [Helper Utilities](https://mintlify.wiki/clauderic/dnd-kit/api/helpers/utilities.md): API reference for helper functions in dnd-kit
- [DragDropProvider](https://mintlify.wiki/clauderic/dnd-kit/api/react/drag-drop-provider.md): Context provider that manages drag and drop state, sensors, and event handlers
- [DragOverlay](https://mintlify.wiki/clauderic/dnd-kit/api/react/drag-overlay.md): Component that renders a custom overlay element during drag operations
- [Additional Hooks](https://mintlify.wiki/clauderic/dnd-kit/api/react/hooks.md): Utility hooks for accessing drag and drop state and manager instances
- [@dnd-kit/react](https://mintlify.wiki/clauderic/dnd-kit/api/react/overview.md): React adapter for dnd-kit — a lightweight, performant, and extensible drag and drop toolkit
- [useDraggable](https://mintlify.wiki/clauderic/dnd-kit/api/react/use-draggable.md): Hook to make an element draggable
- [useDroppable](https://mintlify.wiki/clauderic/dnd-kit/api/react/use-droppable.md): Hook to create a drop target for draggable elements
- [useSortable](https://mintlify.wiki/clauderic/dnd-kit/api/react/use-sortable.md): Hook to create sortable list items that combine draggable and droppable behaviors
- [Solid Hooks](https://mintlify.wiki/clauderic/dnd-kit/api/solid/hooks.md): Complete API reference for dnd-kit Solid hooks
- [Solid Overview](https://mintlify.wiki/clauderic/dnd-kit/api/solid/overview.md): Complete API reference for dnd-kit Solid integration
- [State Management](https://mintlify.wiki/clauderic/dnd-kit/api/state/management.md): API reference for state management utilities in dnd-kit
- [Svelte Overview](https://mintlify.wiki/clauderic/dnd-kit/api/svelte/overview.md): Complete API reference for dnd-kit Svelte integration
- [Svelte Primitives](https://mintlify.wiki/clauderic/dnd-kit/api/svelte/primitives.md): Complete API reference for dnd-kit Svelte primitives
- [Vue Composables](https://mintlify.wiki/clauderic/dnd-kit/api/vue/composables.md): Complete API reference for dnd-kit Vue composables
- [Vue Overview](https://mintlify.wiki/clauderic/dnd-kit/api/vue/overview.md): Complete API reference for dnd-kit Vue integration
- [Architecture overview](https://mintlify.wiki/clauderic/dnd-kit/concepts/architecture.md): Understand the layered architecture of dnd-kit and how its components work together
- [Collision detection](https://mintlify.wiki/clauderic/dnd-kit/concepts/collision-detection.md): Learn how dnd-kit detects collisions between draggables and droppables using a priority-based system
- [DragDropManager](https://mintlify.wiki/clauderic/dnd-kit/concepts/drag-drop-manager.md): The central orchestrator that manages drag and drop operations, sensors, plugins, and collision detection
- [Draggables and Droppables](https://mintlify.wiki/clauderic/dnd-kit/concepts/draggables-droppables.md): Understand the entity system that represents draggable and droppable elements
- [Modifiers](https://mintlify.wiki/clauderic/dnd-kit/concepts/modifiers.md): Transform drag coordinates to constrain movement, snap to grids, or implement custom behaviors
- [Plugin system](https://mintlify.wiki/clauderic/dnd-kit/concepts/plugins.md): Extend dnd-kit functionality with plugins that add features like visual feedback, auto-scrolling, and accessibility
- [Sensors](https://mintlify.wiki/clauderic/dnd-kit/concepts/sensors.md): Understand how sensors detect user input and translate interactions into drag operations
- [Accessibility Features](https://mintlify.wiki/clauderic/dnd-kit/examples/accessibility-features.md): Comprehensive examples demonstrating accessibility features and screen reader support in drag and drop interfaces
- [Custom Animations](https://mintlify.wiki/clauderic/dnd-kit/examples/custom-animations.md): Create sophisticated animations and visual feedback for drag and drop interactions
- [Custom Collision Detection](https://mintlify.wiki/clauderic/dnd-kit/examples/custom-collision-detection.md): Advanced examples of custom collision detection algorithms for specialized drag and drop scenarios
- [Multiple Drop Containers](https://mintlify.wiki/clauderic/dnd-kit/examples/multiple-containers.md): Build complex drag and drop interfaces with multiple containers and cross-container dragging
- [Multiple Sortable Lists](https://mintlify.wiki/clauderic/dnd-kit/examples/multiple-lists.md): Create kanban boards and multi-container drag-and-drop interfaces
- [Nested Drag Contexts](https://mintlify.wiki/clauderic/dnd-kit/examples/nested-contexts.md): Master complex drag and drop hierarchies with nested contexts, sortable lists, and tree structures
- [Simple Drag and Drop](https://mintlify.wiki/clauderic/dnd-kit/examples/simple-drag-drop.md): Learn how to create a basic drag and drop interface with dnd-kit
- [Sortable Grid Layout](https://mintlify.wiki/clauderic/dnd-kit/examples/sortable-grid.md): Create a drag-and-drop sortable grid with automatic flow and positioning
- [Basic Sortable List](https://mintlify.wiki/clauderic/dnd-kit/examples/sortable-list.md): Create a simple drag-and-drop sortable list with dnd-kit
- [Touch and Keyboard Support](https://mintlify.wiki/clauderic/dnd-kit/examples/touch-keyboard-support.md): Advanced examples for implementing comprehensive touch and keyboard controls for drag and drop interfaces
- [Virtualized Sortable Lists](https://mintlify.wiki/clauderic/dnd-kit/examples/virtualized-lists.md): Handle thousands of sortable items with optimal performance using virtualization
- [React](https://mintlify.wiki/clauderic/dnd-kit/frameworks/react.md): Use dnd-kit with React applications
- [SolidJS](https://mintlify.wiki/clauderic/dnd-kit/frameworks/solid.md): Use dnd-kit with SolidJS applications
- [Svelte](https://mintlify.wiki/clauderic/dnd-kit/frameworks/svelte.md): Use dnd-kit with Svelte 5 applications
- [Vanilla JavaScript](https://mintlify.wiki/clauderic/dnd-kit/frameworks/vanilla.md): Use dnd-kit with vanilla JavaScript and TypeScript
- [Vue](https://mintlify.wiki/clauderic/dnd-kit/frameworks/vue.md): Use dnd-kit with Vue 3 applications
- [Accessibility Features](https://mintlify.wiki/clauderic/dnd-kit/guides/accessibility.md): Build inclusive drag and drop interfaces with keyboard support, screen readers, and ARIA attributes
- [Animations and Transitions](https://mintlify.wiki/clauderic/dnd-kit/guides/animations.md): Create smooth, performant animations for drag operations and sortable list reordering
- [Creating Custom Sensors](https://mintlify.wiki/clauderic/dnd-kit/guides/custom-sensors.md): Build custom input sensors to handle specialized drag and drop interactions beyond mouse, touch, and keyboard
- [Performance Optimization](https://mintlify.wiki/clauderic/dnd-kit/guides/performance.md): Optimize drag and drop performance for large lists, complex interfaces, and resource-constrained devices
- [Building Sortable Lists](https://mintlify.wiki/clauderic/dnd-kit/guides/sortable.md): Learn how to create sortable lists, grids, and multi-container sorting interfaces with dnd-kit
- [Installation](https://mintlify.wiki/clauderic/dnd-kit/installation.md): Install dnd-kit packages for your preferred framework and package manager
- [Introduction](https://mintlify.wiki/clauderic/dnd-kit/introduction.md): A modern, lightweight, performant, accessible and extensible drag and drop toolkit for the web
- [Quick start](https://mintlify.wiki/clauderic/dnd-kit/quickstart.md): Build your first drag and drop interface with dnd-kit in minutes