{"repo":"hanielu/dnd-kit-svelte","free":true,"listed":false,"github":"https://github.com/hanielu/dnd-kit-svelte","clone":"git clone https://github.com/hanielu/dnd-kit-svelte.git","description":"The modern, lightweight, performant, accessible and extensible drag & drop toolkit for Svelte","language":"TypeScript","stars":337,"topics":["svelte","svelte5","svelte5-drag-drop","sveltejs","sveltekit","dnd-kit"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"dnd-kit-svelte 📚 Original Documentation : next.dndkit.com A Svelte port of the powerful [@dnd-kit][dnd-kit] library - the modern, lightweight, performant, accessible and extensible drag & drop toolkit. Quick start Install it: Overview This library provides a complete port of dnd-kit to Svelte, maintaining feature parity with the original React implementation while adapting to Svelte's reactivity system. All documentation and APIs from the [original dnd-kit][dnd-kit-docs] library apply here, with some Svelte-specific adaptations. Examples - Sortable Tasks List - Nested Sortable List - Basic Drag & Drop Key Differences from React Implementation The main difference lies in how reactive values are handled. Since Svelte components don't rerender the same way React components do, we've adapted the API to work with Svelte's reactivity system. Using Functions for Reactive Inputs In hooks like useSortable , useDraggable , etc., you can pass a function to any field that needs to be reactive. The function will be called whenever the value needs to be accessed, ensuring you always get the latest value from Svelte's reactive scope. Example: React: Svelte: Data returned from hooks In React, components re-render when their state changes, so hooks can return values directly. However, since Svelte components don't re-render, all non-function properties returned from hooks use a .current getter to ensure you always access the latest value. Example: React: Svelte: This pattern is used consiste","default_branch":null,"files":null,"tree":[],"storefront":"/r/hanielu","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/hanielu/dnd-kit-svelte/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}