dnd-kit icon indicating copy to clipboard operation
dnd-kit copied to clipboard

[experimental] abstract/modifiers seem have issue with type

Open totomakers opened this issue 3 months ago • 2 comments

With the following versions:

 "@dnd-kit/abstract": "^0.1.21",
 "@dnd-kit/helpers": "^0.1.21",
 "@dnd-kit/react": "^0.1.21",

When using the DragAndDropProvier as following:

import { RestrictToVerticalAxis } from '@dnd-kit/abstract/modifiers'
import { move } from '@dnd-kit/helpers'
import { DragDropProvider } from '@dnd-kit/react'

 <DragDropProvider
  modifiers={[RestrictToVerticalAxis]}
  onDragEnd={(e) => {
    const ids = sortedFocusFields.map((f) => f.id)
    onChange?.(move(ids, e))
  }}
/>

Typescript seem not happy:

Type 'PluginDescriptor<any, any, typeof AxisModifier>' is not assignable to type 'ModifierConstructor<DragDropManager<Data, Draggable<Data>, Droppable<Data>>> | ModifierDescriptor<DragDropManager<Data, Draggable<...>, Droppable<...>>>'.
  Type 'PluginDescriptor<any, any, typeof AxisModifier>' is not assignable to type 'ModifierDescriptor<DragDropManager<Data, Draggable<Data>, Droppable<Data>>>'.
    Types of property 'plugin' are incompatible.
      Type 'typeof AxisModifier' is not assignable to type 'ModifierConstructor<DragDropManager<Data, Draggable<Data>, Droppable<Data>>>'.
        Types of parameters 'manager' and 'manager' are incompatible.
          Type 'DragDropManager<Data, Draggable<Data>, Droppable<Data>>' is not assignable to type 'DragDropManager<Draggable<Data, DragDropManager<any, any>>, Droppable<Data, DragDropManager<any, any>>>'.
            Types of property 'collisionObserver' are incompatible.
              Type 'CollisionObserver<Draggable<Data>, Droppable<Data>, DragDropManager<Draggable<Data>, Droppable<Data>>>' is not assignable to type 'CollisionObserver<Draggable<Data, DragDropManager<any, any>>, Droppable<Data, DragDropManager<any, any>>, DragDropManager<Draggable<Data, DragDropManager<...>>, Droppable<...>>>'.
                Type 'DragDropManager<Draggable<Data>, Droppable<Data>>' is not assignable to type 'DragDropManager<Draggable<Data, DragDropManager<any, any>>, Droppable<Data, DragDropManager<any, any>>>'.
                  The types of 'registry.draggables.register' are incompatible between these types.
                    Type '(key: UniqueIdentifier, value: Draggable<Data>) => () => void' is not assignable to type '(key: UniqueIdentifier, value: Draggable<Data, DragDropManager<any, any>>) => () => void'.
                      Types of parameters 'value' and 'value' are incompatible.
                        Type 'Draggable<Data, DragDropManager<any, any>>' is missing the following properties from type 'Draggable<Data>': handle, element, feedbackts(2322)

But the modifiers work as excepted \o/

totomakers avatar Sep 18 '25 09:09 totomakers

i'm having exactly the same issue.

axeloehrli avatar Oct 08 '25 10:10 axeloehrli

Same problem here! Any update on that?

marcusfreire-png avatar Oct 14 '25 08:10 marcusfreire-png