More Premium Hugo Themes Premium Svelte Themes

Svelte Dnd Action

An action based drag and drop container for Svelte

Svelte Dnd Action

An action based drag and drop container for Svelte

Author Avatar Theme by isaachagoel
Github Stars Github Stars: 2061
Last Commit Last Commit: Dec 28, 2025 -
First Commit Created: Dec 18, 2023 -
Svelte Dnd Action screenshot

Overview

Svelte DND Action is a feature-complete implementation of drag and drop for Svelte using a custom action. It offers support for various drag and drop use-cases, works with any input device, and is fully accessible. The library is production-ready and actively maintained.

Features

  • Awesome drag and drop with minimal configuration
  • Supports different types of containers (horizontal, vertical, etc.)
  • Supports nested draggable containers (similar to Trello)
  • Rich animations (optional)
  • Touch support
  • Customizable drop zones
  • Scroll dnd-zones and/or window horizontally or vertically
  • Supports advanced use-cases like copy-on-drag and custom drag handles
  • Performant with a small footprint
  • Fully accessible (beta) with keyboard support and assistive instructions for screen readers

Installation

To use Svelte DND Action, make sure you have Svelte 3 (version 3.23.0 or higher) installed. Then, follow the code snippet below for basic usage:

import { dndAction } from 'svelte-dnd-action';

// Use the dndAction in your Svelte component

Summary

Svelte DND Action is a powerful drag and drop library for Svelte. It offers a wide range of features, including support for different container types, nested draggable containers, rich animations, touch support, and more. The library is production-ready and actively maintained. With minimal configuration, it provides an elegant API and full accessibility support.