Skip to content

Conversation

jledentu
Copy link
Contributor

@jledentu jledentu commented Sep 3, 2022

Hi, this PR implements drag & drop from outside, directly in the library.

While I was trying to experiment such feature, I noticed that the related example contained a lot of custom code to make it work. It's not very easy, and not persistent since it relies on internal interfaces ($refs, internal/private methods).

So I modestly propose this feature:

  • a new prop is-droppable says whether the grid can accept drag from outside (i.e native draggable elements)
  • a prop before-drop-over is a callback function used to eventually abort dragover events, or dynamically adapt the size of dragging items
  • an event drop is emitted when dropping an element

About the implementation, in order to handle the drag events in the GridLayout component, I moved calcXY and calcGridColWidth methods in a calculateUtils file in order to expose them (I was inspired by the React Grid Layout library for namings). This allows to not rely on GridItem internal methods.

I also moved the placeholder update, may fix #544.

jledentu and others added 6 commits September 4, 2022 01:15
* feat: Centering the dropping placeholder on the cursor * Removing unnecessary * Mutualizing width and height getter function Co-authored-by: Corentin Pillet <corentin.pillet@energiency.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants