@types/sortablejs

Basic Sortable List

This feature allows you to create a basic sortable list. By initializing Sortable on a DOM element, you can enable drag-and-drop sorting for its child elements.

import Sortable from 'sortablejs';

const el = document.getElementById('items');
const sortable = Sortable.create(el);

Custom Drag Handle

This feature allows you to specify a custom drag handle. Only elements matching the selector specified in the 'handle' option will be draggable.

import Sortable from 'sortablejs';

const el = document.getElementById('items');
const sortable = Sortable.create(el, {
  handle: '.handle'
});

Sortable with Animation

This feature enables animation during sorting. The 'animation' option specifies the duration of the animation in milliseconds.

import Sortable from 'sortablejs';

const el = document.getElementById('items');
const sortable = Sortable.create(el, {
  animation: 150
});

Group Sorting

This feature allows you to enable sorting between multiple lists. By setting the same 'group' option for multiple Sortable instances, items can be dragged between these lists.

import Sortable from 'sortablejs';

const el1 = document.getElementById('items1');
const el2 = document.getElementById('items2');

const sortable1 = Sortable.create(el1, {
  group: 'shared'
});
const sortable2 = Sortable.create(el2, {
  group: 'shared'
});