Visually highlight the drop area, when drag'n drop is detected

[Kiarokh]

Current behavior

We have added a dropzone visualization on limel-file. But when users drag a file into the viewport, it does not react to that interaction.

Expected behavior

It'd be nice to highlight the dropzone, when a drag'n drop event is detected, to help users see where they can drop the file, more easily.

Environment

• lime-elements version:
• Framework used:
• Logs:

[adrianschmidt]

If I interpret this one correctly, we currently only light up the drop zone when the user drags a file over the limel-file component, but you would like it to light up as soon as the user drags a file anywhere over the viewport, right?

[Kiarokh]

exactly… it's like the component say:

Hey bro! Drop your file here!

[adrianschmidt]

We could probably solve that by letting the limel-file component set up event listeners for the appropriate drag events on the body element. But, an alternative that could give more control, would be to use custom events, and leave the listening to drag events and emitting of our custom events to the client. That way, the client could retain some control over what gets lit up when… 🤔