Svelte Themes Logo Svelte Themes
Svelte Dragdroplist screenshot

Svelte Dragdroplist

Author Avatar Theme by Jwlarocque
Updated: 19 Aug 2020
117 Stars

Sortable lists with Svelte 3. Animated, touch-friendly, and accessible.

Github

Overview

Svelte-DragDropListSortable is a component available on NPM that allows for the creation of sortable lists using Svelte. It offers bidirectional binding, full touch support, and accessibility features. This component is an easier alternative to writing a new one from scratch.

Features

  • Bidirectional binding: The data order updates immediately as the user drags a list item to a new position, even before it is dropped.
  • Full touch support: This component provides support for touch devices and does not rely on the HTML5 drag and drop API.
  • Accessibility: The component includes buttons that allow users to move elements without needing to drag them.

Installation

To use Svelte-DragDropListSortable, you need to install it from NPM. Here is an example of how you can install it using npm:

npm install svelte-drag-droplist-sortable

Once installed, you can import the component into your project and use it accordingly.

Summary

Svelte-DragDropListSortable is a useful component for creating sortable lists in Svelte. Its key features include bidirectional binding, full touch support, and accessibility options. It can be easily installed through NPM, making it a convenient choice for developers who need to implement sortable lists.