Dnd kit

We recommend using the excellent dnd kit library for adding drag and drop functionality to Forma 36 components.

Examples

Import

import { DndContext } from '@dnd-kit/core';
import {
arrayMove,
horizontalListSortingStrategy,
SortableContext,
useSortable,
} from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';

Integrating with useSortable

Reorder item
Tech
Reorder item
News
Reorder item
CMS
Reorder item
Contentful

Example with table rows

Reorder item
Tech
Reorder item
News
Reorder item
CMS
Reorder item
Contentful

Help improve this page