Add keyboard navigation (kind of)

Fixes #165
This commit is contained in:
ajnart
2022-06-06 17:39:18 +02:00
parent 2594a7caa5
commit 339919cfff

View File

@@ -4,11 +4,13 @@ import {
closestCenter, closestCenter,
DndContext, DndContext,
DragOverlay, DragOverlay,
KeyboardSensor,
MouseSensor, MouseSensor,
TouchSensor,
useSensor, useSensor,
useSensors, useSensors,
} from '@dnd-kit/core'; } from '@dnd-kit/core';
import { arrayMove, SortableContext } from '@dnd-kit/sortable'; import { arrayMove, SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable';
import { useConfig } from '../../tools/state'; import { useConfig } from '../../tools/state';
import { SortableAppShelfItem, AppShelfItem } from './AppShelfItem'; import { SortableAppShelfItem, AppShelfItem } from './AppShelfItem';
@@ -19,6 +21,15 @@ const AppShelf = (props: any) => {
const [activeId, setActiveId] = useState(null); const [activeId, setActiveId] = useState(null);
const { config, setConfig } = useConfig(); const { config, setConfig } = useConfig();
const sensors = useSensors( const sensors = useSensors(
useSensor(TouchSensor, {
activationConstraint: {
delay: 250,
tolerance: 5,
},
}),
useSensor(KeyboardSensor, {
coordinateGetter: sortableKeyboardCoordinates,
}),
useSensor(MouseSensor, { useSensor(MouseSensor, {
// Require the mouse to move by 10 pixels before activating // Require the mouse to move by 10 pixels before activating
activationConstraint: { activationConstraint: {