Fixed the children prop for DragOverlay

[pardeshirzadeh]

DragOverlay is currently defined as ParentComponent<DragOverlayProps>, but it doesn't work in the following scenario in a .tsx file:

<DragOverlay>
  {(draggable) => <div>Drag overlay for {draggable?.id}</div>}
</DragOverlay>

It will throw the following error

Type '(draggable: Draggable$1 | null) => Element' is not assignable to type '((number | boolean | Node | ArrayElement | (string & {}) | ((activeDraggable: Draggable$1 | null) => Element)) & (number | boolean | Node | ArrayElement | (string & {}))) | null | undefined'.
  Type '(draggable: Draggable$1 | null) => Element' is not assignable to type '((activeDraggable: Draggable$1 | null) => Element) & number'.
    Type '(draggable: Draggable$1 | null) => Element' is not assignable to type 'number'.

The reason for that is because ParentComponent overrides children, so the definition in DragOverlayProps is ignored.

[martinpengellyphillips]

Hmm, I don't understand. What does "not work" mean here?

[pardeshirzadeh]

I updated the first comment with more details. Hope it's more clear now

[Adevien]

This is still a current issue on latest version. Any updates?

[martinpengellyphillips]

Ah yes, I was just looking at this. I think we should use Component here still to maintain return type etc.

[malekim]

Unfortunately, it didn't solve the issue.

TS2322: Type '(draggable: Draggable$1 | null) => Element' is not assignable to type '((number | boolean | Node | ArrayElement | (string & {}) | ((activeDraggable: Draggable$1 | null) => Element)) & (number | boolean | Node | ArrayElement | (string & {}))) | null | undefined'.   Type '(draggable: Draggable$1 | null) => Element' is not assignable to type '((activeDraggable: Draggable$1 | null) => Element) & number'.     Type '(draggable: Draggable$1 | null) => Element' is not assignable to type 'number'.`

[Adevien]

took latest commit, it did solved the issue as far as I can tell :)

[martinpengellyphillips]

Thanks @Adevien - @malekim I wonder why not working for you 🤔