POC: Drag, Drop, Resize, Stack Dash layout

Hi all- I have been playing around with proof of concept for a layout that could be interactive (concept below). I’ve somewhat hacked my way to get it working with clientside callbacks. Given I’m not well versed in react or js (I’ve stumbled through the custom components tutorials) I was wondering if anyone out there finds this interesting for a project and knows react well, to perhaps team up on creating some custom components that could be used purely in python.

Enjoy, and any thoughts are welcomed!



Great stuff latshawk!

I lack the skills to help you but I also think that dash lacks this basic functionality of allowing the user to freely layout his stuff.

I’m using the Lumino conponent for this and sometimes Dragula.js.
But I’d need more functionality and server-side callbacks.
Eg Restrict dragging vertically/horizontally within a container, callbacks when stuff was moved etc.

Also it would be nice to be able to resize the panels by dragging the splitters between them (like in Lumino)
[EDIT : your implementation does this already (saw this later)]

Your stuff looks cleaner! Would be glad to use it!

1 Like

This is beyond cool, latshawk!
I would LOVE Dash to have a feature like this!