fix(table): restrict movement to only the vertical axis.

close #7477
ant-design · Aug 4, 2023 · 5a8f9fb · 5a8f9fb
1 parent 870cfbe
commit 5a8f9fb
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 0 deletions.
diff --git a/packages/table/package.json b/packages/table/package.json
@@ -42,6 +42,7 @@
     "@ant-design/pro-utils": "2.12.8",
     "@babel/runtime": "^7.18.0",
     "@dnd-kit/core": "^6.0.8",
+    "@dnd-kit/modifiers": "^6.0.1",
     "@dnd-kit/sortable": "^7.0.2",
     "@dnd-kit/utilities": "^3.2.1",
     "classnames": "^2.3.2",

diff --git a/packages/table/src/utils/useDragSort.tsx b/packages/table/src/utils/useDragSort.tsx
@@ -8,6 +8,7 @@ import {
   useSensor,
   useSensors,
 } from '@dnd-kit/core';
+import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
 import {
   arrayMove,
   SortableContext,
@@ -180,6 +181,7 @@ export function useDragSort<T>(props: UseDragSortOptions<T>) {
     DndContext: (contextProps: any) => {
       return (
         <DndContext
+          modifiers={[restrictToVerticalAxis]}
           sensors={sensors}
           collisionDetection={closestCenter}
           onDragEnd={handleDragEnd}

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml